/* ============================================================
   TechWyse Re-Brand — shared design system + page CSS
   Lifted VERBATIM from the source project:
     - _ds/.../tokens/{fonts,colors,typography,layout}.css
     - final.html <style> block (lines 18-1019)
   Do not re-derive these values by hand.
   ============================================================ */

/* ---------- cascade layer order ----------
   This file is normally the FIRST of the plugin's stylesheets on the page, so
   whichever layer it names first would otherwise be the first layer in the
   document — and for `!important` declarations the first layer wins. The
   e-commerce stylesheet ends in a COLOUR LOCK layer whose whole job is to
   have the last word on the colours of its own widgets; naming that layer
   here, ahead of this file's own `twrb-font-family`, guarantees that stays
   true however the stylesheets end up ordered. A layer named but never used
   costs nothing and changes nothing else about the cascade. */
@layer twrb-ecom-colour-lock, twrb-font-family;

/* ---------- tokens/fonts.css (font paths rewritten to the plugin) ---------- */
/* TechWyse webfonts — Bebas Neue (display) + Poppins (supporting).

   Every weight the design asks for is registered against its OWN file, so the
   browser always finds a real face and never synthesises one:
     Bebas Neue  400                       (the family ships a single weight)
     Poppins     300 / 400 / 500 / 600 / 700
   (verified against each file's OS/2 usWeightClass: 400 / 300-400-500-600-700).

   The same files are ALSO registered under plugin-private family names
   ("TWRB Bebas Neue" / "TWRB Poppins"), which `--font-display` / `--font-body`
   list FIRST. A theme (or another plugin) that ships its own `@font-face` for
   "Poppins" at one of these weights would otherwise win the family match for
   that weight — last declaration wins — and the copy would silently render in
   the theme's file at the theme's weight. The public names stay in the stack
   behind the aliases as fallbacks, so nothing changes if a face fails to load.
   Only the faces actually used are downloaded, so the aliases cost no bytes. */
@font-face{font-family:"Bebas Neue";src:url("../fonts/BebasNeue-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}

@font-face{font-family:"Poppins";src:url("../fonts/Poppins-Light.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("../fonts/Poppins-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("../fonts/Poppins-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("../fonts/Poppins-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("../fonts/Poppins-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}

/* plugin-private aliases — same files, same weights, collision-proof names */
@font-face{font-family:"TWRB Bebas Neue";src:url("../fonts/BebasNeue-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}

@font-face{font-family:"TWRB Poppins";src:url("../fonts/Poppins-Light.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"TWRB Poppins";src:url("../fonts/Poppins-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"TWRB Poppins";src:url("../fonts/Poppins-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"TWRB Poppins";src:url("../fonts/Poppins-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"TWRB Poppins";src:url("../fonts/Poppins-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}

/* ---------- tokens/colors.css ---------- */
/* ── TechWyse color system ──────────────────────────────────
   Base palette from the official Brand Colour Palette sheet.
   Cobalt + Android Green are the two logo/primary colours. */
:root{
  /* Primary (logo) */
  --tw-cobalt:#1B3E93;        /* primary brand blue */
  --tw-green:#8CC63E;         /* android green — signature accent */

  /* Secondary palette (collateral) */
  --tw-dark-sky-blue:#4191D6;
  --tw-grass-green:#429301;
  --tw-baltic-sea:#292929;    /* near-black ink */
  --tw-halloween-orange:#E9602A;
  --tw-lavender-mist:#D5EBFF;
  --tw-leaf-green:#52AC09;
  --tw-white-smoke:#F4F4F4;
  --tw-mango-tango:#DB7608;
  --tw-zircon:#F1F9FF;        /* faint blue paper */
  --tw-apple-green:#85C62E;
  --tw-white:#FFFFFF;
  --tw-yellow-orange:#F1B600;

  /* Cobalt tint/shade ramp (derived) */
  --tw-cobalt-900:#0E2255;
  --tw-cobalt-800:#153073;
  --tw-cobalt-700:#1B3E93;
  --tw-cobalt-600:#2A50AE;
  --tw-cobalt-500:#3D66C6;
  --tw-cobalt-200:#AEC1EC;
  --tw-cobalt-100:#D8E2F7;

  /* Green tint/shade ramp (derived) */
  --tw-green-700:#5F9E22;
  --tw-green-600:#78B62F;
  --tw-green-500:#8CC63E;
  --tw-green-300:#B6DE83;
  --tw-green-100:#E6F4D2;

  /* Neutral ink ramp */
  --tw-ink-900:#141A24;
  --tw-ink-800:#292929;
  --tw-ink-600:#4A4F57;
  --tw-ink-500:#6B7280;
  --tw-ink-400:#9AA1AC;
  --tw-ink-300:#C7CCD4;
  --tw-ink-200:#E4E8EE;
  --tw-ink-100:#F1F3F7;

  /* ── Semantic aliases ── */
  --surface-page:var(--tw-white);
  --surface-alt:var(--tw-zircon);
  --surface-muted:var(--tw-white-smoke);
  --surface-ink:var(--tw-ink-900);          /* dark full-bleed sections */
  --surface-brand:var(--tw-cobalt-700);
  --surface-card:var(--tw-white);

  --text-heading:var(--tw-ink-900);
  --text-body:var(--tw-ink-600);
  --text-muted:var(--tw-ink-500);
  --text-inverse:var(--tw-white);
  --text-on-brand:var(--tw-white);
  --text-brand:var(--tw-cobalt-700);
  --text-accent:var(--tw-green-700);

  --border-subtle:var(--tw-ink-200);
  --border-strong:var(--tw-ink-300);
  --border-brand:var(--tw-cobalt-700);

  --accent-primary:var(--tw-cobalt-700);
  --accent-secondary:var(--tw-green-500);
  --accent-warm:var(--tw-halloween-orange);
  --accent-gold:var(--tw-yellow-orange);

  --focus-ring:var(--tw-dark-sky-blue);
  --state-success:var(--tw-leaf-green);
  --state-warning:var(--tw-yellow-orange);
  --state-danger:var(--tw-halloween-orange);
  --state-info:var(--tw-dark-sky-blue);
}

/* ---------- tokens/typography.css ---------- */
/* ── TechWyse typography ────────────────────────────────────
   Display: Bebas Neue (condensed, all-caps, kinetic headlines)
   Supporting: Poppins (readable geometric sans for everything else) */
:root{
  --font-display:"TWRB Bebas Neue","Bebas Neue","Oswald","Arial Narrow",sans-serif;  /* @kind font */
  --font-body:"TWRB Poppins","Poppins","Helvetica Neue",Arial,sans-serif;  /* @kind font */

  --fw-light:300;  /* @kind font */
  --fw-regular:400;  /* @kind font */
  --fw-medium:500;  /* @kind font */
  --fw-semibold:600;  /* @kind font */
  --fw-bold:700;  /* @kind font */

  /* Display ramp — Bebas Neue. Tight leading, wide tracking. */
  --display-2xl:clamp(3.27rem,11vw,10rem);  /* @kind font */
  --display-xl:clamp(2.55rem,8vw,7rem);  /* @kind font */
  --display-lg:clamp(2rem,6vw,5rem);  /* @kind font */
  --display-md:clamp(1.64rem,4.5vw,3.75rem);  /* @kind font */
  --display-lh:0.92;  /* @kind font */
  --display-tracking:0.01em;  /* @kind font */

  /* Heading ramp — Poppins for sub-heads / card titles */
  --heading-xl:2.25rem;  /* @kind font */
  --heading-lg:1.75rem;  /* @kind font */
  --heading-md:1.375rem;  /* @kind font */
  --heading-sm:1.125rem;  /* @kind font */
  --heading-lh:1.15;  /* @kind font */

  /* Body ramp — Poppins */
  --body-xl:1.25rem;  /* @kind font */
  --body-lg:1.0625rem;  /* @kind font */
  --body-md:1rem;  /* @kind font */
  --body-sm:0.875rem;  /* @kind font */
  --body-xs:0.75rem;  /* @kind font */
  --body-lh:1.65;  /* @kind font */
  --body-lh-tight:1.45;  /* @kind font */

  /* Labels / eyebrows — uppercase Poppins, tracked out */
  --label-md:0.8125rem;  /* @kind font */
  --label-sm:0.6875rem;  /* @kind font */
  --label-tracking:0.16em;  /* @kind font */
  --label-weight:var(--fw-semibold);  /* @kind font */
}

/* 768px–1599px only: the display ramp grows more gently with the viewport.
   `--display-lg` drops from 6vw to 4.5vw (a x0.75 factor) and the rest of the
   ramp takes the same factor so the steps keep their relationship. The clamp
   floors and ceilings are deliberately unchanged — only the preferred (vw)
   value moves, so nothing changes below 768px or from 1600px up. */
@media(min-width:768px) and (max-width:1599.98px){
  :root{
    --display-2xl:clamp(3.27rem,8.25vw,10rem);  /* @kind font */
    --display-xl:clamp(2.55rem,6vw,7rem);  /* @kind font */
    --display-lg:clamp(2rem,4.5vw,5rem);  /* @kind font */
    --display-md:clamp(1.64rem,3.375vw,3.75rem);  /* @kind font */
  }
}

/* ---------- tokens/layout.css ---------- */
/* ── TechWyse spacing, radii, shadows, motion, layout ─────── */
:root{
  /* Spacing scale (4px base) */
  --space-1:4px;   --space-2:8px;   --space-3:12px;  --space-4:16px;
  --space-5:24px;  --space-6:32px;  --space-7:48px;  --space-8:64px;
  --space-9:96px;  --space-10:128px; --space-11:160px; --space-12:200px;

  /* Spacing ceiling — see SPACING CAPS in docs/spacing-caps-ipad-mobile.md.
     Every margin/padding/gap that can resolve past the ceiling is written as
     `min(var(--sp-cap),<the original value>)`, so on desktop the token is far
     larger than any spacing in the sheet and `min()` gives back the original
     value untouched; on iPad and mobile it clamps. */
  --sp-cap:1000px;
  --sp-cap-tablet:40px;
  --sp-cap-mobile:25px;

  /* CONTENT SPACING SCALE — see the CONTENT SPACING SYSTEM block near the end
     of this file. Content is spaced with `margin-top` only; the only `gap`
     left anywhere is the COLUMN gap between side-by-side columns.

       breakpoint   content->content   heading->content   content->CTA   columns
       <=767px            15px               20px             25px         30px
       >=768px            12px               16px             22px         26px
       >=1600px           15px               20px             30px         50px
       >=1850px           18px               22px             40px         50px  */
  --c-gap:15px;    /* content -> content (p, ol, ul) */  /* @kind other */
  --hc-gap:20px;   /* heading -> content */              /* @kind other */
  --cta-gap:25px;  /* content -> CTA */                  /* @kind other */
  --col-gap:30px;  /* between COLUMNS only */            /* @kind other */

  /* Section rhythm — standard top/bottom gap for every fold */
  --fold-pad-y:40px;
  --gutter:clamp(1.25rem,5vw,5rem);  /* @kind other */
  --content-max:1240px;
  --content-wide:1440px;

  /* Radii — restrained; the brand is largely square-edged */
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:14px;
  --radius-xl:24px;
  --radius-pill:999px;

  /* Shadows — soft cobalt-tinted elevation */
  --shadow-sm:0 1px 2px rgba(20,26,36,.06),0 1px 3px rgba(20,26,36,.08);
  --shadow-md:0 6px 16px rgba(20,26,36,.08),0 2px 6px rgba(20,26,36,.06);
  --shadow-lg:0 18px 40px rgba(20,26,36,.12),0 6px 14px rgba(20,26,36,.08);
  --shadow-brand:0 20px 48px rgba(27,62,147,.28);
  --shadow-focus:0 0 0 3px rgba(65,145,214,.45);

  /* Motion — smooth, deliberate, editorial (never bouncy) */
  --ease-out:cubic-bezier(.16,1,.3,1);  /* @kind other */
  --ease-in-out:cubic-bezier(.65,.05,.36,1);  /* @kind other */
  --ease-standard:cubic-bezier(.4,0,.2,1);  /* @kind other */
  --dur-fast:180ms;  /* @kind other */
  --dur-base:320ms;  /* @kind other */
  --dur-slow:640ms;  /* @kind other */
  --dur-reveal:900ms;  /* @kind other */

  --z-nav:100;  /* @kind other */
  --z-overlay:200;  /* @kind other */
  --z-modal:300;  /* @kind other */
}

/* SPACING CAPS — the two breakpoint bands where `--sp-cap` bites.
   The project's bands are 1600+, 1200-1599, 768-1199 and below 768
   (see docs/responsive-type-and-button-scale.md), so "iPad" is 768-1199.98px
   and "mobile" is everything under it. Mobile inherits the iPad rule and then
   tightens it, which is why every capped declaration only has to be written
   once, inside whichever media query it already lived in. */
@media(max-width:1199.98px){ :root{ --sp-cap:var(--sp-cap-tablet); } }
@media(max-width:767.98px){  :root{ --sp-cap:var(--sp-cap-mobile); } }

/* CONTENT SPACING SCALE — the four steps of the table above. Mobile-first:
   the `:root` values are the <=767px column, each query below replaces them. */
@media(min-width:768px){  :root{ --c-gap:12px; --hc-gap:16px; --cta-gap:22px; --col-gap:26px; } }
@media(min-width:1600px){ :root{ --c-gap:15px; --hc-gap:20px; --cta-gap:30px; --col-gap:50px; } }
@media(min-width:1850px){ :root{ --c-gap:18px; --hc-gap:22px; --cta-gap:40px; } }

/* ---------- final.html <style> block (verbatim) ---------- */
  /* ── Container system: one scale for every fold, header, footer and mega ──
     Every token below is the INNER CONTENT width — the measure the eye reads.
     The side padding (`--gutter`) always sits OUTSIDE it: on the section
     (`.fold{padding:… var(--gutter)}`), or as the centring
     `max(var(--gutter),(100% - <token>)/2)` the hero and the header use. So a
     token of 1140px renders 1140px of *visible* content, with the gutter
     beyond it — never 1140px minus the padding. The one place the padding
     has to live inside the box (`.fold-flush`, `.container-standard`) adds the
     two gutters back onto the max-width so the content still measures the
     token exactly.

       band        .wrap / .wrap-wide      header + footer      gutter
       <768px      100%                    100%                 15px
       >=768px     100%                    100%                 15px
       >=992px     100%                    100%                 15px
       >=1200px    1140px                  1720px               20px
       >=1600px    1520px                  1720px               20px

     Only the two desktop bands were restyled; 768px and 992px are untouched.

     BELOW 1200px THE LADDER IS OFF (see docs/tablet-mobile-full-width.md):
     the 720px and 960px steps are declared as before but switched back to
     100% by the query right under them, so a content section measures the
     viewport minus its gutter and no heading or paragraph breaks a line
     earlier than the screen itself forces. The desktop bands keep their
     caps. The two steps are left in place rather than deleted so the
     ladder stays readable and one query is all that has to be lifted to
     bring them back. */
  :root{--gutter:15px;--content-max:100%;--content-wide:100%;--container-max:100%;--content-chrome:100%}
  @media(min-width:768px){:root{--content-max:720px;--content-wide:720px;--container-max:720px;--content-chrome:720px}}
  @media(min-width:992px){:root{--content-max:960px;--content-wide:960px;--container-max:960px;--content-chrome:960px}}
  @media(max-width:1199.98px){:root{--content-max:100%;--content-wide:100%;--container-max:100%;--content-chrome:100%}}
  @media(min-width:1200px){:root{--gutter:20px;--content-max:1140px;--content-wide:1140px;--container-max:1140px;--content-chrome:1720px}}
  @media(min-width:1600px){:root{--content-max:1520px;--content-wide:1520px;--container-max:1520px}}
  .wrap,.wrap-wide{width:100%}
  /* a section that zeroes its own padding still owes the container its gutter */
  .fold-flush>.wrap,.fold-flush>.wrap-wide{padding-left:var(--gutter);padding-right:var(--gutter)}
  /* …and because that padding is INSIDE the box here, the desktop bands widen
     the box by the two gutters so the content keeps measuring the token.
     Desktop-only: below 1200px the box stays on the bare token, as before. */
  @media(min-width:1200px){
    .fold-flush>.wrap{max-width:calc(var(--content-max) + var(--gutter) * 2)}
    .fold-flush>.wrap-wide{max-width:calc(var(--content-wide) + var(--gutter) * 2)}
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  [id]{scroll-margin-top:calc(var(--tw-header-h,110px) + 16px)}
  body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
  h1,h2,h3,h4,p{margin:0}
  a{color:var(--tw-cobalt-700);text-decoration:none}
  a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--tw-green-500);outline-offset:3px;border-radius:3px}
  /* tel: links never take a hover treatment — see the TEL LINK LOCK at the
     end of this file for the rest of the states */
  a:not([href*="tel:" i]):hover{color:var(--tw-green-700)}
  img{display:block;max-width:100%}
  .tw-display{font-family:var(--font-display);text-transform:uppercase;line-height:.92;letter-spacing:.01em}
  /* Bebas Neue is single-weight — display headings read lighter via ink + tracking, not font-weight */
  .tw-display,.solidword,.dcy-verdict,.fitwarn,.fnpanel h3,.pillar b,.alabel{opacity:.94;letter-spacing:.018em}
  .ghostword{letter-spacing:.028em}
  /* headings default to bold, which the browser synthesises on single-weight Bebas —
     pinning 500 removes that faux-bold thickening */
  .tw-display,.solidword,.ghostword,.dcy-verdict,.dcy-word,.dcy-note,.fitwarn,.fitlabel,.fnpanel h3,.pillar b,.alabel,.heroh1,.eng-title,.haloword,.stat-num,.pnum,.astepnum{font-weight:400}
  /* Eyebrows — 17px label (reference value), 28x2px rule, tight gap.
     `align-items:flex-start` plus the margin-top calc pins the rule to the
     vertical centre of the FIRST line of the label at every width
     (line-height is 1, so 1em is the first line box); centring against the
     whole block would drop the rule half a line when a long label wraps. The
     gap and the rule geometry are this build's own and are left as they are. */
  .tw-eyebrow{display:inline-flex;align-items:flex-start;gap:8px;font-size:17px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1}
  .tw-eyebrow i{width:28px;height:2px;margin-top:calc((1em - 2px) / 2);border-radius:2px;background:var(--tw-green-500);box-shadow:0 0 16px 3px rgba(140,198,62,.38);display:inline-block;flex:none;transform-origin:left;animation:twEyebrowRule .9s var(--ease-out) both}
  @keyframes twEyebrowRule{from{transform:scaleX(0)}to{transform:scaleX(1)}}

  /* buttons */
  .btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-body);font-weight:600;letter-spacing:.01em;border:1.5px solid transparent;border-radius:var(--radius-pill);cursor:pointer;line-height:1;transition:background .18s var(--ease-out),color .18s var(--ease-out),border-color .18s var(--ease-out),box-shadow .18s var(--ease-out),transform .18s var(--ease-out);font-size:17px;padding:16px 20px 16px min(var(--sp-cap),30px)}
  .btn .circ{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;transition:transform .32s var(--ease-out)}
  .btn:not([href*="tel:" i]):hover .circ{transform:translate(3px,-3px)}
  .btn-green{background:var(--tw-green-500);color:#fff;border-color:var(--tw-green-500)}
  .btn-green .circ{background:#fff;color:var(--tw-ink-900);font-size:17px}
  .btn-green:not([href*="tel:" i]):hover{background:var(--tw-green-600);border-color:var(--tw-green-600);color:#fff;box-shadow:0 16px 34px rgba(140,198,62,.34)}
  .btn-outline{background:transparent;color:var(--tw-cobalt-700);border-color:var(--tw-cobalt-300,#AEC1EC)}
  .btn-outline .circ{background:var(--tw-cobalt-100)}
  .btn-outline:not([href*="tel:" i]):hover{background:var(--tw-cobalt-700);color:#fff;border-color:var(--tw-cobalt-700)}
  .btn-outline:not([href*="tel:" i]):hover .circ{background:rgba(255,255,255,.2)}
  .btn-ondark{background:transparent;color:#fff;border-color:rgba(255,255,255,.32)}
  .btn-ondark .circ{background:rgba(255,255,255,.14)}
  .btn-ondark:not([href*="tel:" i]):hover{background:#fff;color:var(--tw-ink-900);border-color:#fff}
  .btn-ondark:not([href*="tel:" i]):hover .circ{background:rgba(20,26,36,.12)}
  .btn-sm{font-size:14px;padding:11px 14px 11px 20px}
  .btn-sm .circ{width:26px;height:26px;font-size:15px}

  /* reveals */
  [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
  [data-reveal="left"]{transform:translateX(-52px)}
  [data-reveal="right"]{transform:translateX(52px)}
  [data-reveal="scale"]{transform:scale(.94)}
  .reveal-in{opacity:1!important;transform:none!important}


  /* generic layout helpers */
  .wrap{max-width:var(--content-max);margin:0 auto}
  .wrap-wide{max-width:var(--content-wide);margin:0 auto}
  .fold{padding:var(--fold-pad-y) var(--gutter)}
  /* standard section top/bottom gap: 40px base, 30px at/below 767px, and the
     reference's own `clamp(5rem,10vw,10rem)` from 1600px up — see the
     ">=1600px REFERENCE SPACING" note at the end of this file. The clamp is
     already at its 10rem ceiling by 1600px, so it is a flat 160px across the
     whole band; the former 60px/80px steps were below the reference. */
  @media(max-width:767px){:root{--fold-pad-y:30px}}
  @media(min-width:1600px){:root{--fold-pad-y:clamp(5rem,10vw,10rem)}}

  /* growth engine diagram */
  .hero-grid>*{min-width:0}
  .hero-visual{max-width:540px;margin:0 auto;width:100%}
  .tw-engine{display:block;width:100%;height:auto;overflow:visible}
  .tw-engine .spoke{stroke-dasharray:200;stroke-dashoffset:200}
  .tw-engine.play .spoke{animation:twDraw 1s var(--ease-out) forwards}
  .tw-engine .ring{stroke-dasharray:6 10;opacity:0;transform-box:fill-box;transform-origin:center}
  .tw-engine.play .ring{opacity:1;animation:twSpin 26s linear infinite;transition:opacity .8s ease .3s}
  .tw-engine .node{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.4)}
  .tw-engine.play .node{animation:twPop .7s var(--ease-out) forwards}
  .tw-engine .core{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.4)}
  .tw-engine.play .core{animation:twPop .8s var(--ease-out) 1.1s forwards}
  .tw-engine .flow{opacity:0}
  .tw-engine.play .flow{animation:twFlow 2.6s linear infinite}
  .tw-engine .node-lbl{opacity:0}
  .tw-engine.play .node-lbl{animation:twFade .6s ease forwards}
  .tw-engine .node .halo{opacity:0;transition:opacity .4s var(--ease-out)}
  .tw-engine .node.is-active .halo{opacity:1}
  .tw-engine .node.is-active .node-core{filter:brightness(1.06)}
  .tw-engine .node{transition:transform .45s var(--ease-out)}
  .tw-engine[data-active] .node.is-active{transform:scale(1.08)}
  .tw-engine[data-active] .node:not(.is-active){opacity:.5}

  @keyframes twDraw{to{stroke-dashoffset:0}}
  @keyframes twPop{0%{opacity:0;transform:scale(.4)}70%{opacity:1;transform:scale(1.05)}100%{opacity:1;transform:scale(1)}}
  @keyframes twFade{to{opacity:1}}
  @keyframes twSpin{to{transform:rotate(360deg)}}
  @keyframes twFlow{0%{opacity:0;offset-distance:0%}12%{opacity:1}88%{opacity:1}100%{opacity:0;offset-distance:100%}}
  @keyframes twFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
  @keyframes twRise{0%{opacity:0;transform:translateY(105%)}100%{opacity:1;transform:translateY(0)}}
  @keyframes twSweepRule{0%,8%{transform:translateX(-110%)}92%,100%{transform:translateX(210%)}}
  @keyframes twSweepText{0%,8%{background-position:260% 0}92%,100%{background-position:-160% 0}}
  @keyframes twRulePulse{0%,8%{box-shadow:0 0 18px 4px rgba(140,198,62,.4)}50%{box-shadow:0 0 26px 7px rgba(140,198,62,.75)}92%,100%{box-shadow:0 0 18px 4px rgba(140,198,62,.4)}}
  .sweeprule{position:relative;overflow:hidden;animation:twRulePulse 2.4s linear infinite}
  .sweeprule::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#fff 46%,transparent);animation:twSweepRule 2.4s linear infinite}
  .sweepword{color:transparent!important;background-color:var(--swbase);background-image:linear-gradient(100deg,var(--swbase) 0%,var(--swbase) 26%,color-mix(in oklch,var(--swlit) 70%,var(--swbase)) 34%,var(--swlit) 44%,var(--swlit) 56%,color-mix(in oklch,var(--swlit) 70%,var(--swbase)) 66%,var(--swbase) 78%,var(--swbase) 100%);background-size:260% 100%;background-repeat:no-repeat;background-position:-160% 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:twSweepText 2.4s linear infinite;filter:drop-shadow(0 0 14px rgba(255,255,255,.18))}
  .sweepword.sw-white{--swbase:#fff;--swlit:#fff}
  .sweepword.sw-green{--swbase:var(--tw-green-500);--swlit:#EAFFC2;filter:drop-shadow(0 0 16px rgba(140,198,62,.5))}
  @media(prefers-reduced-motion:reduce){.sweeprule,.sweeprule::after,.sweepword{animation:none}}
  @keyframes twGlowPulse{0%,100%{opacity:.5}50%{opacity:1}}
  @keyframes twDashFlow{to{stroke-dashoffset:-220}}
  @keyframes twChartDraw{to{stroke-dashoffset:0}}
  @keyframes twBob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
  @keyframes twCursorMove{0%,45%{transform:translate(0,0) scale(1)}75%{transform:translate(var(--cx,0),var(--cy,0)) scale(.82)}82%{transform:translate(var(--cx,0),var(--cy,0)) scale(.82)}100%,90%{transform:translate(var(--cx,0),var(--cy,0)) scale(1)}}
  @keyframes twLeadPop{0%,55%{opacity:0;transform:translateY(10px) scale(.9)}70%,100%{opacity:1;transform:translateY(0) scale(1)}}
  @keyframes twStratTrail{0%,8%{stroke-dashoffset:520}52%,100%{stroke-dashoffset:0}}
  @keyframes twStratDot{0%,8%{offset-distance:0%}52%,100%{offset-distance:100%}}
  @keyframes twStratLand{0%,48%{opacity:0;transform:scale(.3)}62%{opacity:.9;transform:scale(1.5)}80%,100%{opacity:0;transform:scale(2.1)}}
  @keyframes twStratRow{0%,6%{opacity:.32}16%,94%{opacity:1}100%{opacity:.32}}
  @keyframes twStratTick{0%,8%{transform:scale(0)}20%,100%{transform:scale(1)}}
  @keyframes twPlanGrow{0%,8%{transform:scaleY(0)}52%,100%{transform:scaleY(1)}}
  /* ── 01 The engine: four arcs, live energy, hover reveals each stage ──
     Animation and hover live on DIFFERENT elements: the entrance keyframe runs on
     .dquad (fill:both, so its final transform stays there), while hover only ever
     transitions .dwedge. Nothing toggles animation:none mid-flight. */
  @keyframes twDormHalo{0%,100%{opacity:.28;transform:scale(.96)}50%{opacity:.6;transform:scale(1.05)}}
  @keyframes twDormGlyph{0%,100%{opacity:.82}50%{opacity:1}}
  @keyframes twDormBloom{0%,100%{opacity:.1}50%{opacity:.26}}
  @keyframes twDormDrift{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}
  @keyframes twDormSpin{to{transform:rotate(360deg)}}
  @keyframes twDormOrbit{to{offset-distance:100%}}
  @keyframes twDormFeed{0%{offset-distance:0%;opacity:0}20%{opacity:1}74%{opacity:1}100%{offset-distance:100%;opacity:0}}
  @keyframes twDormQuadIn{0%{opacity:0;transform:scale(.74) rotate(-8deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
  @keyframes twDormCoreIn{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:scale(1)}}

  .dorm{position:relative;width:100%;height:100%;display:flex;align-items:flex-end;justify-content:center;perspective:1500px}
  .dormtilt{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center;transform-style:preserve-3d;transition:transform .6s var(--ease-out);will-change:transform}
  .dormsvg{overflow:visible;height:100%;width:auto;max-width:100%}

  /* ── hero: white copy card above a cropped Growth-Engine arc ──
     --ab is the arc's height; the arc is anchored to the fold's bottom edge and
     every rim node / panel / control measures off it, so the whole assembly
     scales as one piece. */
  /* FLEX (was `display:grid;place-items:center`). The centring pair is split:
     `align-items` applies in both the row and the <=720px column layout, so it
     stays on the base rule; `justify-content` would change the column layout's
     vertical distribution, so it is fenced above that stack point. */
  .ecircuit{--ab:clamp(190px,22vh,280px);position:relative;z-index:4;flex:1;width:100%;display:flex;align-items:center;padding:calc(var(--tw-header-h,96px) + clamp(14px,2.6vh,34px)) var(--gutter) calc(var(--ab) + clamp(14px,2.4vh,30px))}
  @media(min-width:720.02px){.ecircuit{justify-content:center}}

  /* the copy card */
  .ecard{position:relative;z-index:5;width:min(100%,860px);text-align:center}
  /* the hero card's own eyebrow scale — the reference sizes this one with a
     fluid clamp rather than the flat .tw-eyebrow value; the 28x2px rule is
     still pinned to the centre of the first line */
  .ecard .eyebrow{display:flex;align-items:flex-start;justify-content:center;gap:8px;font-family:var(--font-body);font-size:clamp(11px,.92vw,13px);line-height:1;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tw-green-500)}
  .ecard .eyebrow i{width:28px;height:2px;margin-top:calc((1em - 2px) / 2);border-radius:2px;background:var(--tw-green-500);flex:none}
  .ecard h1{font-family:var(--font-display);text-transform:uppercase;font-size:clamp(2.2rem,min(4.4vw,6.2vh),3.9rem);line-height:.92;letter-spacing:.01em;color:#fff;margin:clamp(12px,1.6vh,20px) auto 0;max-width:34ch}
  .ecard .esub{margin:clamp(10px,1.4vh,16px) auto 0;font-size:clamp(1rem,1.35vw,1.3rem);font-weight:500;color:rgba(255,255,255,.82)}
  .ecard .ectas{display:flex;flex-wrap:wrap;justify-content:center;gap:13px;margin-top:clamp(18px,2.4vh,28px)}
  .btn-ink{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.28)}
  .btn-ink:not([href*="tel:" i]):hover{background:#fff;color:var(--tw-ink-900);border-color:#fff}
  /* FLEX. The strip's own `padding-top` moved onto the cells as a `margin-top`
     — same distance between the hairline and the figures, no content padding. */
  .ecard .estats{display:flex;margin-top:clamp(18px,2.4vh,28px);border-top:1px solid rgba(255,255,255,.16)}
  .ecard .estat{flex:1 1 0;min-width:0;margin-top:clamp(14px,1.8vh,20px);padding:0 clamp(8px,1.2vw,16px)}
  .ecard .estat+.estat{border-left:1px solid rgba(27,62,147,.16)}
  .ecard .estat b{display:block;font-family:var(--font-display);font-size:clamp(1.5rem,2.6vw,2.3rem);line-height:1;color:#fff;white-space:nowrap}
  .ecard .estat span{display:block;margin-top:6px;font-size:clamp(10.5px,.85vw,12px);color:rgba(255,255,255,.55);line-height:1.35}

  /* the arc — the engine itself, cropped by the fold */
  .earc{position:absolute;left:50%;bottom:0;translate:-50% 0;z-index:1;width:min(84%,1240px);height:var(--ab);border-radius:50% 50% 0 0/100% 100% 0 0;border-top:2px solid rgba(140,198,62,.5);background:radial-gradient(130% 170% at 50% 100%,rgba(27,62,147,.5),rgba(11,16,28,.94) 66%);pointer-events:none}
  .earc::after{content:"";position:absolute;inset:-2px 0 auto;height:56%;border-radius:inherit;background:linear-gradient(to bottom,rgba(174,193,236,.07),transparent);pointer-events:none}
  .earcglow{display:none}

  /* rim nodes sit on the ellipse: y = ab · √(1−(dx/a)²) */

  /* the active step's copy, always visible — no hover needed */

  .earrow{position:absolute;z-index:7;bottom:calc(var(--ab) * .4);width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;background:rgba(11,16,28,.82);border:1px solid rgba(174,193,236,.22);color:#fff;backdrop-filter:blur(6px);transition:background .24s var(--ease-out),border-color .24s var(--ease-out),transform .24s var(--ease-out)}
  .earrow:hover{background:var(--tw-green-500);border-color:var(--tw-green-500);color:var(--tw-ink-900);transform:scale(1.06)}
  .earrow.prev{left:calc(50% - min(42%,620px) - 12px)}
  .earrow.next{right:calc(50% - min(42%,620px) - 12px)}

  @media(max-width:1080px){
    .ecircuit{--ab:clamp(200px,26vh,300px)}
    .earc{width:min(94%,900px)}
  }
  @media(max-width:720px){
    /* stacked: the step between items is a `margin-top`, never a `gap`, and the
       tail room the column used to hold as `padding-bottom` rides on the last
       item as `margin-bottom` — flex item margins never collapse, so the
       column ends at exactly the same place. */
    .ecircuit{--ab:auto;display:flex;flex-direction:column}
    .ecircuit>*+*{margin-top:min(var(--sp-cap),clamp(20px,3.4vh,34px))}
    .ecircuit>:last-child{margin-bottom:min(var(--sp-cap),clamp(20px,4vh,36px))}
    .earc,.earcglow,.earrow{position:relative;left:auto;right:auto;bottom:auto;translate:none;width:100%;height:auto;border-radius:var(--radius-lg);border:1px solid rgba(174,193,236,.18);background:rgba(11,16,28,.7)}
    .earc,.earcglow{display:none}
    .earrows{display:flex;justify-content:center;gap:12px}
    .earrow{width:42px;height:42px}
  }
  @media(min-width:721px){.earrows{display:contents}}
  @keyframes twOrbit{to{offset-distance:100%}}
  @keyframes twSpokeIn{0%{opacity:0;offset-distance:0%}18%{opacity:1}82%{opacity:1}100%{opacity:0;offset-distance:100%}}
  @keyframes twNodeBeat{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
  @keyframes twTrafBar{0%,6%{transform:scaleX(0)}44%,100%{transform:scaleX(1)}}
  @keyframes twTrafRow{0%,4%{opacity:.4}18%,96%{opacity:1}100%{opacity:.4}}

  .kh span{display:block;overflow:hidden;padding-bottom:.2em;margin-bottom:-.08em}
  .kh span span{display:block;animation:twRise .9s var(--ease-out) both}

  /* connected system fold composition */
  /* FLEX — source tracks `1fr auto 1fr` */
  .connect-grid{display:flex;column-gap:min(var(--sp-cap),var(--col-gap));align-items:center}
  .connect-grid>*{flex:1 1 0;min-width:0}
  .connect-grid>:nth-child(2){flex:0 0 auto}
  .cchip{display:flex;align-items:center;gap:12px;padding:15px 20px;border-radius:var(--radius-pill);font-weight:600;font-size:15px}
  .cchip .dot{width:9px;height:9px;border-radius:50%;flex:none}

  /* stats */
  .stat-num{font-family:var(--font-display);line-height:.9;letter-spacing:.01em;display:inline-flex;align-items:baseline}

  /* ── scroll-driven engine ── */
  .engine-scroll.engine-static{height:auto;min-height:100vh}
  .engine-static .engine-pin{position:relative;height:auto;min-height:100vh;justify-content:center}
  .engine-static .engine-grid{margin-top:0;padding-top:calc(var(--tw-header-h,96px) + clamp(10px,2.4vh,30px));padding-bottom:min(var(--sp-cap),clamp(20px,4vh,48px))}
  .eng-glow{position:absolute;border-radius:50%;pointer-events:none;z-index:0;transform:translateZ(0);will-change:transform}
  /* min-width keeps the bars evenly weighted; content can push a longer label wider */
  /* Finale: single centred column. The chain must be definite-height all the
     way down (grid -> column -> layer) because every .ecopy is absolute. */
  .engine-grid.finale{position:absolute;inset:0;display:block;margin-top:0;padding:0}
  .engine-grid.finale .engine-visual{display:none}
  .engine-grid.finale .engine-copy{position:absolute;left:0;right:0;top:calc(var(--tw-headerh,150px) * .45);bottom:0;height:auto;min-height:0}
  .engine-grid.finale .ecopy{position:absolute;inset:0;align-items:center;text-align:center}
  .engine-visual{transition:opacity .4s var(--ease-out)}
  /* FLEX. `--he-c1w`/`--he-c2w` are the unitless twins the widget prints beside
     the `fr` pair (see column_weight_css() in includes/class-base-widget.php);
     they always sum to 2, so `flex:<w> 1 0` distributes exactly like the two
     tracks did. One centred row of `max-content` rows === `align-items:center`.
     `.finale` keeps `display:block` on its own higher-specificity rule above. */
  .engine-grid{margin-top:calc(-1 * clamp(14px,2.4vh,30px));position:relative;z-index:4;flex:1;display:flex;align-items:center;column-gap:min(var(--sp-cap),var(--col-gap));padding:min(var(--sp-cap),clamp(10px,3vh,36px)) max(var(--gutter),calc((100% - var(--content-wide)) / 2));min-height:0}
  .engine-grid>.engine-visual{flex:var(--he-c1w,1.08) 1 0;min-width:0;transition:flex-grow .55s var(--ease-out)}
  .engine-grid>.engine-copy{flex:var(--he-c2w,.92) 1 0;min-width:0;transition:flex-grow .55s var(--ease-out)}
  .engine-grid{width:100%;max-width:var(--container-max);margin-left:auto;margin-right:auto}
  .engine-visual,.engine-copy{position:relative;height:min(70vh,660px)}
  /* the two cells the visual/copy used to be pinned into (1/1 and 1/2) are the
     same two flex items DOM order already produces, so no placement is needed */
  .engine-visual{overflow:hidden}
  /* every `.ecopy` used to sit in the same cell (1/1) and cross-fade. In flow
     that is a full-width item with an equal negative end margin, so the layers
     stay stacked and the column still grows to the TALLEST of them. */
  .engine-copy{display:flex;align-items:stretch}
  .engine-copy>.ecopy{flex:0 0 100%;min-width:0;margin-inline-end:-100%}
  .estage{position:absolute;inset:0;container-type:size;display:flex;align-items:center;justify-content:center;will-change:opacity,transform;backface-visibility:hidden;contain:layout paint}
  .estage>svg,.estage .tw-engine{width:auto;max-width:100%;height:100%;max-height:100%;margin:0 auto;overflow:visible}
  .estage .hero-visual,.estage #tw-hero-engine{height:100%;max-height:100%;max-width:none;display:flex;align-items:center;justify-content:center}
  .ecopy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;will-change:opacity,transform;backface-visibility:hidden;contain:layout paint}
  .engine-static .estage,.engine-static .ecopy{transition:opacity .45s var(--ease-out),transform .45s var(--ease-out)}
  .eng-step{font-family:var(--font-display);font-size:1.3rem;color:var(--tw-green-500);letter-spacing:.1em;margin-bottom:14px}
  .heroh1{font-size:clamp(2.6rem,min(6.1vw,7.9vh),5.3rem)}
  @media(max-height:760px){.heroh1{font-size:clamp(2.25rem,min(5.2vw,7vh),4rem)}}
  @media(max-height:620px){.heroh1{font-size:clamp(2rem,min(4.5vw,6.3vh),3.3rem)}}
  .eng-title{font-family:var(--font-display);text-transform:uppercase;line-height:.9;font-size:clamp(2.6rem,min(6.1vw,7.9vh),5.3rem);color:#fff;margin-bottom:16px}
  .eng-head{font-size:clamp(1.25rem,1.95vw,1.75rem);font-weight:600;color:#fff;line-height:1.3;margin-bottom:16px;max-width:30ch}
  .eng-desc{font-size:var(--body-md);color:rgba(255,255,255,.66);line-height:1.6;max-width:56ch;margin-bottom:24px}
  .eng-pts{list-style:none;margin:0 0 4px;padding:0;display:flex;flex-direction:column}
  .eng-pts>li+li{margin-top:13px}
  .eng-pts li{display:flex;align-items:center;gap:13px;font-size:15px;color:rgba(255,255,255,.88);font-weight:500}
  .eng-pts .pdot{width:24px;height:24px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(140,198,62,.18)}
  .engine-hint{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;color:rgba(255,255,255,.5);font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600}
  .engine-hint>*+*{margin-top:8px}
  .engine-hint .hchev{width:20px;height:20px;animation:twBob 1.7s var(--ease-in-out) infinite}
  .engine-static .engine-hint{display:none}
  /* channel chips (stage 3) */
  .chchip{position:absolute;display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:var(--radius-pill);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#fff;font-size:13px;font-weight:600;backdrop-filter:blur(4px);white-space:nowrap;animation:twFloat 6s var(--ease-in-out) infinite}
  .chchip .cdot{width:8px;height:8px;border-radius:50%;flex:none}
  /* metric tiles (stage 4) */
  .mtile{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);padding:16px 18px}
  .mtile .mv{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);color:#fff;line-height:1}
  .mtile .ml{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:8px;font-weight:600}
  .finlbl{position:absolute;display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:var(--radius-pill);font-size:13px;font-weight:600;white-space:nowrap;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff}
  .finlbl .fdot{width:8px;height:8px;border-radius:50%;flex:none}


  @media(max-width:960px){
    .engine-scroll.engine-static{height:auto}
    /* FLEX. One track === a column stack; `align-content:center` on a single
       column === `justify-content:center`. The 18px the grid held as a `gap`
       is now a `margin-top` on the lower half, so nothing carries a vertical
       gap. `order` still puts the visual first. */
    .engine-grid{flex-direction:column;align-items:stretch;justify-content:center;column-gap:0;padding-top:0}
    .engine-grid>.engine-visual,.engine-grid>.engine-copy{flex:0 0 auto;width:100%}
    .engine-grid>.engine-copy{margin-top:18px}
    .engine-visual{height:min(30vh,300px);order:1}
    .engine-copy{height:auto;min-height:0;order:2}
    .ecopy{position:relative;inset:auto}
    .eng-title{font-size:clamp(1.9rem,6vw,2.6rem);margin-bottom:10px}
    .eng-step{font-size:1.05rem;margin-bottom:8px}
    .eng-head{font-size:1.05rem;margin-bottom:10px}
    .eng-desc{font-size:14px;margin-bottom:14px}
    .eng-pts>li+li{margin-top:9px}
    .engine-hint{display:none}
    .eng-desc{margin-bottom:18px}
    .eng-pts li{font-size:14px}
  }
  @media(max-width:600px){
  }

  /* 4-part system */
  /* FLEX — two even tracks. The bespoke gutter is replaced by the shared
     COLUMN gap token (the only `gap` the sheet still uses); `align-items:start`
     becomes the flex spelling `flex-start`. */
  .sys-grid{display:flex;column-gap:min(var(--sp-cap),var(--col-gap));align-items:flex-start}
  .sys-grid>*{flex:1 1 0;min-width:0}
  .sys-sticky{position:sticky;top:120px;align-self:flex-start}
  /* The row keeps its rule above it, but the vertical breathing room is no
     longer `padding-top`/`padding-bottom` on a content row: the row is a flex
     column and each child carries the 38px as `margin-top`/`margin-bottom`.
     Flex items never collapse their margins, so the row height and the border
     position are unchanged. */
  .step{display:flex;flex-direction:column;border-top:1px solid var(--border-subtle);opacity:.4;transition:opacity .5s var(--ease-out)}
  .step>:first-child{margin-top:min(var(--sp-cap),38px)}
  .step>:last-child{margin-bottom:min(var(--sp-cap),38px)}
  .step.step-active{opacity:1}
  .step .snum{font-family:var(--font-display);font-size:1.5rem;color:var(--tw-ink-300);transition:color .4s}
  .step.step-active .snum{color:var(--tw-green-600)}

  /* ── people collage — FLEXBOX (no CSS Grid) ─────────────────────────────
     The source built this fold on a 12-column / 2-row grid. The same
     geometry is reproduced here with a wrapping *column* flex container:
     the container's height is the full collage height, so each flex line
     IS one visual column and the items fill it top-to-bottom before
     wrapping to the next column.

       >=992px  col 1: c1 (2 rows)   col 2: c2 + [c4|c5]   col 3: c3 (2 rows)
       <992px   one stacked column: c1 / c2 / [c4|c5] / c3

     c4/c5 sit side by side in both layouts, so they share one `.cg-pair`
     row wrapper — the middle column's lower row at >=992px, and a row of
     the stack below it (see the <=990.98px block further down).

     Widths are the exact source track sizes re-expressed as percentages:
     a k-column-wide cell is k*u + (k-1)*gap where u = (100% - 11*gap)/12,
     i.e. 4 cols -> 33.3333% - gap*2/3, 5 cols -> 41.6667% - gap*7/12,
     3 cols -> 25% - gap*3/4. --pc1/--pc2/--pc3 carry those percentages so
     the widget's column-width control can move them; the gap terms always
     sum to the 2 (or 1) gutters the row actually contains, so the columns
     keep filling the row exactly. */
  .collage{
    --cg:clamp(10px,1.15vw,16px);
    --cr:clamp(128px,14.6vw,208px);
    --pc1:33.33333%;--pc2:41.66667%;--pc3:25%;
    display:flex;flex-flow:column wrap;align-content:flex-start;
    gap:var(--cg);height:calc(var(--cr) * 2 + var(--cg))
  }
  .collage[data-swap="yes"]{flex-wrap:wrap-reverse} /* mirror the column order */
  .collage figure,.collage .cg-pair{flex:0 0 auto;min-height:0}
  .collage .cg-pair{display:flex;flex-direction:row;gap:var(--cg)}
  .collage figure{margin:0;overflow:hidden;border-radius:var(--radius-lg);position:relative;background:var(--tw-ink-100);isolation:isolate}
  .collage img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform 1.1s var(--ease-out),filter .6s var(--ease-out)}
  .collage figure::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent 42%,rgba(20,26,36,.62));opacity:0;transition:opacity .55s var(--ease-out)}
  .collage figure:hover img{transform:scale(1.06)}
  .collage figure:hover::after{opacity:1}
  .ccap{position:absolute;z-index:2;left:clamp(14px,1.1vw,20px);right:clamp(14px,1.1vw,20px);bottom:clamp(13px,1vw,18px);display:flex;align-items:center;gap:10px;color:#fff;font-family:var(--font-body);font-size:var(--label-sm);letter-spacing:var(--label-tracking);text-transform:uppercase;font-weight:600;opacity:0;transform:translateY(9px);transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
  .ccap::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--tw-green-500)}
  .collage figure:hover .ccap{opacity:1;transform:none}
  /* flex-basis is the MAIN (vertical) size here — the cell's row span */
  .collage .c1{flex-basis:calc(var(--cr) * 2 + var(--cg));width:calc(var(--pc1) - var(--cg) * 2 / 3)}
  .collage .c2,.collage .cg-pair{flex-basis:var(--cr);width:calc(var(--pc2) - var(--cg) * 7 / 12)}
  .collage .c3{flex-basis:calc(var(--cr) * 2 + var(--cg));width:calc(var(--pc3) - var(--cg) * 3 / 4)}
  /* inside the pair: 3 of the middle column's 5 source columns, then 2 */
  .collage .cg-pair .c4{width:calc(60% - var(--cg) * .4)}
  .collage .cg-pair .c5{width:calc(40% - var(--cg) * .6)}
  /* if the editor removed one of the two, the survivor takes the whole row */
  .collage .cg-pair > :only-child{width:100%}

  /* assessment — split: copy left, vertical step rail right.
     Flexbox at EVERY width — this widget carries no `display:grid` at any
     resolution. The editor's split percentage reaches the layout through the
     unitless twins `column_weight_css()` prints beside the `fr` pair
     (`--as-c1w` / `--as-c2w`, always summing to 2), because `flex-grow`
     cannot consume an `fr`-typed value. `flex:<w> 1 0` hands out leftover
     space exactly like `minmax(0,<w>fr)` did, and `min-width:0` restores the
     `minmax(0,…)` floor a bare flex item does not have. Swapped, the aside
     used to move to the SECOND track, so the visual order flips with
     `row-reverse` and the two weights trade places. */
  .assplit{display:flex;align-items:flex-start;column-gap:min(var(--sp-cap),var(--col-gap))}
  .assplit>.assaside{flex:var(--as-c1w,.86) 1 0;min-width:0}
  .assplit>.asteps{flex:var(--as-c2w,1.14) 1 0;min-width:0}
  .assplit[data-swap="yes"]{flex-direction:row-reverse}
  .assplit[data-swap="yes"]>.assaside{flex-grow:var(--as-c2w,1.14)}
  .assplit[data-swap="yes"]>.asteps{flex-grow:var(--as-c1w,.86)}
  .assaside{position:sticky;top:clamp(96px,12vh,150px)}
  .asteps{position:relative;display:flex;flex-direction:column;padding-left:min(var(--sp-cap),clamp(120px,10.5vw,172px))}
  .asteps::before{content:"";position:absolute;z-index:0;left:min(var(--sp-cap),clamp(120px,10.5vw,172px));top:8px;bottom:8px;width:1px;background:var(--border-subtle);-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent)}
  .asteps::after{content:"";position:absolute;z-index:0;left:min(var(--sp-cap),clamp(120px,10.5vw,172px));top:8px;width:1px;height:calc((100% - 16px) * var(--afill,0));background:linear-gradient(180deg,var(--tw-cobalt-700),var(--tw-green-500));-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent);transition:height .8s var(--ease-out)}
  .asteps>.astep+.astep{margin-top:min(var(--sp-cap),clamp(34px,4.4vw,58px))}
  .astep{position:relative;padding-left:min(var(--sp-cap),clamp(40px,3.4vw,52px));transition:opacity .5s var(--ease-out)}
  .astep:not(.astep-on){opacity:.55}
  .astepnum{position:absolute;right:calc(100% + 23px + clamp(14px,1.5vw,22px));top:23px;transform:translateY(-50%);font-family:var(--font-display);font-size:clamp(4.4rem,7.6vw,7rem);line-height:1.12;padding-bottom:.06em;color:color-mix(in oklch,#8CC63E 22%,transparent);pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 34%,rgba(0,0,0,.18) 88%,transparent);mask-image:linear-gradient(180deg,#000 48%,rgba(0,0,0,.3) 92%,rgba(0,0,0,.15));transition:color .6s var(--ease-out)}
  .astep.astep-on .astepnum{color:color-mix(in oklch,#8CC63E 34%,transparent)}
  .anode{position:absolute;left:-23px;top:0;z-index:1;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--tw-green-500);color:#fff;transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
  .anode svg{width:20px;height:20px}
  .astep.astep-on .anode{transform:scale(1.06);box-shadow:0 10px 26px rgba(140,198,62,.34)}
  .acard{position:relative;text-align:left}
  .alabel{display:flex;align-items:center;min-height:46px;font-family:var(--font-display);font-size:clamp(2.15rem,3.1vw,2.9rem);line-height:1;letter-spacing:.01em;color:var(--tw-ink-900)}
  .acard p{max-width:52ch;margin-top:12px}
  /* stacked: aside over steps, reversed when swapped. Cross-axis is now the
     horizontal one, so `stretch` is what keeps both children full-width —
     the single-track grid's default behaviour. */
  @media(max-width:991px){
    /* stacked: the column gap goes to zero and the step between the two
       halves rides on whichever one `column-reverse` puts second. */
    .assplit{flex-direction:column;align-items:stretch;column-gap:0}
    .assplit>.assaside,.assplit>.asteps{flex:0 0 auto;width:100%}
    .assplit>.asteps{margin-top:min(var(--sp-cap),var(--col-gap))}
    .assplit[data-swap="yes"]{flex-direction:column-reverse}
    .assplit[data-swap="yes"]>.asteps{margin-top:0}
    .assplit[data-swap="yes"]>.assaside{margin-top:min(var(--sp-cap),var(--col-gap))}
    .assaside{position:static}
  }
  /* `.asteps` reserves its `padding-left` as an artwork gutter: the ghost step
     number is absolutely positioned into it (`right:calc(100% + …)`). Once the
     spacing cap clamps that gutter to 40px/25px the number no longer fits
     beside the step, so from the tablet band down it switches to the stacked
     treatment the sheet already defined for <=620px — same declarations, moved
     up a breakpoint. Below 620px the rest of that block still applies. */
  @media(max-width:1199.98px){
    .astepnum{position:static;display:block;height:auto;top:auto;transform:none;font-size:3rem;margin:0 0 2px}
  }
  @media(max-width:620px){
    .alabel{min-height:0}
    .asteps{padding-left:min(var(--sp-cap),30px)}
    .asteps>.astep+.astep{margin-top:min(var(--sp-cap),34px)}
    .asteps::before,.asteps::after{left:min(var(--sp-cap),30px)}
    .astep{padding-left:min(var(--sp-cap),34px)}
  }

  .logomq{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
  .logomq-track{display:flex;align-items:center;width:max-content;gap:min(var(--sp-cap),clamp(52px,6vw,94px));animation:twMarquee 38s linear infinite}
  .logomq:hover .logomq-track{animation-play-state:paused}
  /* optional per-logo link: the anchor is layout-neutral so a linked logo sits
     exactly where a bare <img> did */
  .logomq-track a{display:inline-flex;align-items:center;line-height:0}
  .logomq img{height:clamp(38px,3.6vw,54px);width:auto;max-width:none;object-fit:contain;filter:grayscale(1);opacity:.42;transition:filter .3s var(--ease-out),opacity .3s var(--ease-out)}
  .logomq img:hover{filter:none;opacity:1}
  /* supplied as white artwork — render as a dark silhouette so it reads on the light strip */
  .logomq img.wl{filter:brightness(0);opacity:.4}
  .logomq img.wl:hover{filter:brightness(0);opacity:.82}
  @keyframes twMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  @media(prefers-reduced-motion:reduce){
    .logomq-track{animation:none;flex-wrap:wrap;justify-content:center;width:100%}
  }
  /* Scrolling marquee is a below-1200 behaviour only — desktop reverts to the
     static wrapped row (matches source: no seam duplicate needed, so hide it). */
  @media(min-width:1200px){
    .logomq{overflow:visible;-webkit-mask-image:none;mask-image:none}
    .logomq-track{animation:none;flex-wrap:wrap;justify-content:center;width:100%;gap:min(var(--sp-cap),clamp(28px,3.4vw,56px)) min(var(--sp-cap),clamp(38px,4.6vw,72px))}
    .logomq-track img[aria-hidden="true"],
    .logomq-track a[aria-hidden="true"]{display:none}
  }
  .cbrule{flex:1;height:1px;background:var(--border-subtle)}

  /* fold: not your typical agency */
  /* FLEX — source tracks `1fr 1.1fr auto 1.32fr`, in DOM order:
     the lead copy, the negatives list, the bridge glyph, the answer card. */
  .ntrow{display:flex;column-gap:min(var(--sp-cap),var(--col-gap));align-items:center}
  .ntrow>[data-reveal="left"]{flex:1 1 0;min-width:0}
  .ntrow>.ntneg{flex:1.1 1 0;min-width:0}
  .ntrow>.ntbridge{flex:0 0 auto}
  .ntrow>.ntanswer{flex:1.32 1 0;min-width:0}
  .ntneg{display:flex;flex-direction:column;gap:0}
  .ntlead{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-body);font-size:15px;font-weight:600;color:var(--tw-ink-500);margin-bottom:16px;letter-spacing:.01em}
  .ntlead span{width:22px;height:2px;border-radius:2px;background:var(--tw-ink-200,#d7dbe2)}
  /* The 15px that used to be `padding-top`/`padding-bottom` on this content row
     now rides on its two flex children as `margin-top`/`margin-bottom`. Flex
     items never collapse their margins, so the row is exactly as tall as before
     and the rules above/below it land in exactly the same place. The 2px
     horizontal padding (and the hover nudge that animates it) is untouched. */
  .ntitem{display:flex;align-items:center;gap:14px;padding:0 2px;border-bottom:1px solid var(--border-subtle);transition:padding-left .4s var(--ease-out)}
  .ntitem>*{margin-top:15px;margin-bottom:15px}
  .ntitem:first-of-type{border-top:1px solid var(--border-subtle)}
  .ntneg:hover .ntitem{padding-left:6px}
  .ntitem .ico{width:30px;height:30px;border-radius:50%;flex:none;background:#fff;border:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:center;color:var(--tw-ink-500);transition:background .35s var(--ease-out),color .35s var(--ease-out)}
  .ntitem:hover .ico{background:color-mix(in oklch,var(--tw-green-500) 16%,transparent);color:var(--tw-green-700)}
  .ntitem b{font-size:clamp(1.05rem,1.45vw,1.3rem);font-weight:600;color:var(--tw-ink-800,#2a3140);text-decoration:line-through;text-decoration-color:color-mix(in oklch,var(--tw-green-600) 70%,transparent);text-decoration-thickness:2.5px;text-underline-offset:2px}
  .ntbridge{flex:none;width:clamp(48px,5.4vw,84px);align-self:center;display:flex;align-items:center;justify-content:center}
  .ntbridge svg{width:100%;height:56px;overflow:visible}
  .ntbridge .bline{stroke-dasharray:4 6;animation:twDashFlow 4.5s linear infinite}
  .ntbridge .bring{transform-box:fill-box;transform-origin:center;animation:twRingOut 2.6s var(--ease-out) infinite}
  @keyframes twRingOut{0%{transform:scale(.7);opacity:.55}70%,100%{transform:scale(1.5);opacity:0}}
  .ntanswer{position:relative;background:linear-gradient(155deg,var(--tw-cobalt-800),var(--tw-cobalt-900) 62%,#0E2255);border-radius:var(--radius-lg);padding:min(var(--sp-cap),clamp(26px,2.6vw,40px));overflow:hidden;box-shadow:0 26px 60px rgba(27,62,147,.24)}
  .ntanswer::after{content:"";position:absolute;right:-22%;bottom:-32%;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(140,198,62,.2),transparent 68%);pointer-events:none}
  .ntanswer>*{position:relative;z-index:1}
  .ntanswer .ntbrace{position:absolute;left:0;top:clamp(26px,2.6vw,40px);bottom:clamp(26px,2.6vw,40px);width:3px;border-radius:2px;background:linear-gradient(180deg,var(--tw-green-500),rgba(140,198,62,.15));z-index:1}
  @media(min-width:768px) and (max-width:1199px){
    /* FLEX. The layout is two stacked siblings beside one full-height
       sibling — the single shape flexbox has no in-flow equivalent for — so
       the answer card is taken out of flow and pinned across the stack. That
       draws the same box the spanned area drew, including the existing
       horizontal overhang (the two percentage tracks already sum to 100%, so
       the second one starts a full gap past the first). The row gap is a
       `margin-top` on the negatives list, never a container gap.
       Caveat: the row height is now driven by the lead + negatives stack. */
    .ntrow{--nt-gap:min(var(--sp-cap),var(--col-gap));position:relative;flex-direction:column;align-items:flex-start;column-gap:0}
    .ntrow>[data-reveal="left"],.ntrow>.ntneg{flex:0 0 auto;width:var(--nt-c1,50%)}
    .ntrow>.ntneg{margin-top:min(var(--sp-cap),clamp(26px,4vw,44px))}
    .ntrow>.ntanswer{position:absolute;top:0;bottom:0;left:calc(var(--nt-c1,50%) + var(--nt-gap));width:var(--nt-c2,50%)}
    .ntrow[data-swap="yes"]>[data-reveal="left"],.ntrow[data-swap="yes"]>.ntneg{width:var(--nt-c2,50%);margin-left:calc(var(--nt-c1,50%) + var(--nt-gap))}
    .ntrow[data-swap="yes"]>.ntanswer{left:0;width:var(--nt-c1,50%)}
    .ntbridge{display:none}
  }
  @media(max-width:767px){
    /* FLEX — one column; the card comes back into normal flow and the row
       step becomes a `margin-top` on each following sibling. */
    .ntrow{flex-direction:column;align-items:stretch;column-gap:0}
    .ntrow>[data-reveal="left"],.ntrow>.ntneg,.ntrow>.ntanswer,
    .ntrow[data-swap="yes"]>[data-reveal="left"],.ntrow[data-swap="yes"]>.ntneg,
    .ntrow[data-swap="yes"]>.ntanswer{position:relative;inset:auto;flex:0 0 auto;width:auto;margin-left:0}
    .ntrow>.ntneg,.ntrow>.ntanswer{margin-top:min(var(--sp-cap),clamp(26px,4vw,44px))}
    .ntbridge{display:none}
    /* the card's own tracks: a full-width eyebrow over head | body. The
       14px row step rides on the second line's two items as a margin. */
    .ntanswer{--nta-gap:min(var(--sp-cap),clamp(24px,3.4vw,48px));display:flex;flex-wrap:wrap;column-gap:var(--nta-gap);align-items:center}
    .ntanswer .ntans-eyebrow{flex:0 0 100%;min-width:0}
    .ntanswer .ntans-head{flex:1.05 1 0;min-width:0;max-width:none;margin-top:14px}
    .ntanswer .ntans-body{flex:1 1 0;min-width:0;max-width:none;margin-top:14px;align-self:center}
    .ntitem{margin-left:0!important;transform:none!important}
  }
  @media(max-width:640px){
    .ntanswer{flex-wrap:nowrap;flex-direction:column;align-items:stretch}
    .ntanswer .ntans-eyebrow,.ntanswer .ntans-head,.ntanswer .ntans-body{flex:0 0 auto;width:auto}
    .ntanswer .ntans-head,.ntanswer .ntans-body{margin-top:16px}
  }

  /* fold: engine payoff */
  /* Same move as `.ntitem`: the vertical padding of this content row becomes a
     symmetric `margin-top`/`margin-bottom` on the two words it holds. Both words
     shift by the same amount, so the `baseline` alignment between them is
     untouched and the row keeps its exact height and rule positions. */
  .ghostline{display:flex;align-items:baseline;gap:clamp(8px,.9vw,15px);border-top:1px solid rgba(255,255,255,.12)}
  .ghostline>*{margin-top:clamp(10px,1.6vh,20px);margin-bottom:clamp(10px,1.6vh,20px)}
  .ghostline:last-of-type{border-bottom:1px solid rgba(255,255,255,.12)}
  .ghostword{font-family:var(--font-display);text-transform:uppercase;font-size:clamp(2.4rem,6vw,5rem);line-height:.9;letter-spacing:.02em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.3)}
  .solidword{font-family:var(--font-display);text-transform:uppercase;font-size:clamp(2.4rem,6vw,5rem);line-height:.9;color:#fff}
  /* FLEX. `--pf-c1w`/`--pf-c2w` are the unitless twins printed beside the
     `fr` pair by column_weight_css(); they always sum to 2, so `flex:<w> 1 0`
     hands out exactly what `minmax(0,<w>fr)` did. The swapped area order is
     `row-reverse` plus a weight swap, so "Left Column Width" keeps meaning
     the column that is physically on the left. */
  .payoffgrid{display:flex;column-gap:min(var(--sp-cap),var(--col-gap));align-items:flex-start}
  .payoffgrid>.payofflines{flex:var(--pf-c1w,1.35) 1 0;min-width:0}
  .payoffgrid>.payoffcol{flex:var(--pf-c2w,.65) 1 0;min-width:0}
  .payoffgrid[data-swap="yes"]{flex-direction:row-reverse}
  .payoffgrid[data-swap="yes"]>.payofflines{flex-grow:var(--pf-c2w,.65)}
  .payoffgrid[data-swap="yes"]>.payoffcol{flex-grow:var(--pf-c1w,1.35)}
  .payoffcol{display:flex;flex-direction:column}
  .outcomes{display:flex;flex-direction:column}
  /* The row's vertical padding moves onto its two flex children as symmetric
     margins (`--oc-pad`), so no content element carries `padding-top`/
     `padding-bottom` and the rules between the rows stay exactly where they
     were. `.ocnode` already owns a 7px `margin-top` of its own, declared later
     at the same specificity, so its share is written out explicitly at a higher
     specificity as `--oc-pad + 7px`; that keeps the dot — and the connector
     line it draws — pixel-identical to the padded version. */
  .ocitem{--oc-pad:clamp(16px,2vh,24px);position:relative;display:flex;align-items:flex-start;gap:16px;border-top:1px solid rgba(255,255,255,.12)}
  .ocitem>*{margin-top:var(--oc-pad);margin-bottom:var(--oc-pad)}
  .ocitem>.ocnode{margin-top:calc(var(--oc-pad) + 7px)}
  .ocitem:first-child{border-top:0}
  .ocitem:first-child>*{margin-top:0}
  .ocitem:first-child>.ocnode{margin-top:7px}
  .ocitem:last-child>*{margin-bottom:0}
  .payoffdots{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.075) 1px,transparent 1px);background-size:30px 30px;-webkit-mask-image:radial-gradient(120% 90% at 30% 20%,#000 12%,transparent 72%);mask-image:radial-gradient(120% 90% at 30% 20%,#000 12%,transparent 72%);z-index:0}
  .growthline{position:absolute;right:0;bottom:0;width:min(72%,880px);pointer-events:none;z-index:0;opacity:.85;transform:translateY(14%)}
  .growthline path.gl{stroke-dasharray:900;stroke-dashoffset:900;transition:stroke-dashoffset 2.2s var(--ease-out) .2s}
  .growthline.reveal-in path.gl{stroke-dashoffset:0}
  .ocnode{position:relative;flex:none;width:10px;height:10px;margin-top:7px;border-radius:50%;background:var(--tw-green-500);box-shadow:0 0 0 4px rgba(140,198,62,.14),0 0 16px 5px rgba(140,198,62,.45)}
  .ocitem:not(:last-child) .ocnode::before{content:"";position:absolute;left:50%;top:14px;width:1px;height:calc(100% + 40px);background:linear-gradient(rgba(140,198,62,.5),rgba(140,198,62,.06))}
  .ocnode::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid rgba(140,198,62,.45);animation:twGlowPulse 2.8s var(--ease-in-out) infinite}
  .ocitem b{display:block;font-size:clamp(1rem,1.25vw,1.18rem);font-weight:600;color:#fff;line-height:1.25}
  .ocitem small{display:block;font-size:13px;color:rgba(255,255,255,.55);margin-top:5px;line-height:1.4}
  @media(max-width:640px){
    .payoffgrid{flex-direction:column;align-items:stretch}
    .payoffgrid>.payofflines,.payoffgrid>.payoffcol{flex:0 0 auto;width:100%}
    .payoffgrid>.payoffcol{margin-top:min(var(--sp-cap),var(--col-gap))}
    .payoffgrid[data-swap="yes"]{flex-direction:column-reverse}
    .payoffgrid[data-swap="yes"]>.payoffcol{margin-top:0}
    .payoffgrid[data-swap="yes"]>.payofflines{margin-top:min(var(--sp-cap),var(--col-gap))}
  }
  /* mobile only: this fold's eyebrow — the green rule + title lockup above the
     ghost lines — takes its own metrics instead of the global eyebrow scale
     (16px / 20x2px on mobile, see the EYEBROW LOCK at the end of this file):
     a 20px label with a 20x2px rule. `align-self:flex-start` on the rule plus
     a margin-top of half the 20px first-line box minus the rule's own 2px
     keeps it centred on the FIRST line when the title wraps; the row's
     `align-items:center` would drop it to the middle of the wrapped block.
     The widget sets width/height/font-size inline, hence the !important. */
  @media(max-width:767px){
    .elementor-widget-twrb_payoff .sweeprule{align-self:flex-start;width:20px!important;height:2px!important;margin-top:calc((20px - 2px) / 2)!important}
    .elementor-widget-twrb_payoff .sweeprule + .tw-display{font-size:20px!important}
  }

  .ghostink{color:transparent;-webkit-text-stroke:1.5px rgba(20,26,36,.32)}
  .headmark{position:relative;display:inline-block;z-index:1}
  .headmark>span{position:relative;z-index:2}
  .handrule{position:absolute;left:-5%;bottom:-.16em;width:110%;height:.42em;overflow:visible;z-index:0;pointer-events:none;transform:rotate(1.4deg);transform-origin:left center;clip-path:inset(0 100% 0 0);transition:clip-path 1.1s var(--ease-out) .3s}
  .reveal-in .handrule{clip-path:inset(0 0 0 0)}
  .handrule path{stroke:none}
  /* fold: brand halo — client social posts */
  .haloposts{position:absolute;inset:0;pointer-events:none;z-index:0;display:block}
  /* Width is fixed and the inner edge is pinned relative to the CENTRED content
     column, so the feeds track the middle of the fold as the viewport widens
     instead of being flung out to the window edges. */
  /* SHADOW GUTTER. `overflow:hidden` is what keeps the marquee from spilling
     out of the feed, but it clips at the PADDING box — so with a flush box the
     thumbs' cobalt drop-shadow was sliced flat against the feed's left and
     right edges. Rather than drop the clip (which would break the loop), the
     feed carries `--hsx` of transparent padding on both sides, grows by the
     same amount, and is pulled back out by `--hsx` in `left`/`right`. The
     thumbs therefore land on exactly the same pixels as before, with a band of
     unclipped space on each side for the shadow to fall into.
     `--hsx` covers the widest shadow in play — the `:hover` blur of 50px
     reaches half its radius, 25px, past the card edge. */
  .halofeed{--fw:clamp(200px,15vw,286px);--hsx:26px;position:absolute;top:0;bottom:0;width:calc(var(--fw) + (var(--hsx) * 2));padding-left:var(--hsx);padding-right:var(--hsx);overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent,#000 11%,#000 89%,transparent);mask-image:linear-gradient(180deg,transparent,#000 11%,#000 89%,transparent)}
  .halofeed.l{left:calc(max(1.4%,calc(50% - 660px - var(--fw))) - var(--hsx))}
  .halofeed.r{right:calc(max(1.4%,calc(50% - 660px - var(--fw))) - var(--hsx))}
  /* `contain` stays at `layout` only: paint containment clips descendants to
     the track's own padding box, which would re-clip every thumb shadow at the
     card edge and undo the gutter above. */
  .hfstack{display:flex;flex-direction:column;animation:twFeedUp 64s linear infinite;animation-play-state:paused;contain:layout}
  .halofold.feeds-live .hfstack{animation-play-state:running;will-change:transform}
  .halofeed.r .hfstack{animation-duration:78s;animation-direction:reverse}
  @keyframes twFeedUp{from{transform:translateY(0)}to{transform:translateY(-50%)}}
  .hpost{contain:content;position:relative;width:100%;margin-bottom:14px;border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--border-subtle);box-shadow:0 14px 34px rgba(27,62,147,.11);pointer-events:auto;display:flex;flex-direction:column;transition:box-shadow .4s var(--ease-out)}
  .hpost:hover{box-shadow:0 22px 50px rgba(27,62,147,.18)}
  .igp{display:flex;flex-direction:column;height:100%;font-family:var(--font-body)}
  .igp-top{display:flex;align-items:center;gap:9px;padding:11px 12px}
  .igp-av{width:28px;height:28px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;letter-spacing:.02em}
  .igp-h{font-size:13px;font-weight:600;color:var(--tw-ink-900);line-height:1.1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .igp-dots{margin-left:auto;color:var(--tw-ink-400);font-size:14px;letter-spacing:1px;line-height:1}
  .igp-img{flex:none;aspect-ratio:1/1;position:relative;overflow:hidden;background:var(--tw-zircon)}
  .igp-img img{width:100%;height:100%;object-fit:cover;display:block}
  .igp-badge{position:absolute;left:9px;bottom:9px;display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:var(--radius-pill);background:rgba(20,26,36,.62);color:#fff;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;backdrop-filter:blur(3px)}
  .igp-acts{display:flex;align-items:center;gap:11px;padding:10px 12px 0;color:var(--tw-ink-800,#2a3140)}
  .igp-cap{padding:6px 12px 12px;font-size:11.5px;line-height:1.4;color:var(--tw-ink-500)}
  .igp-cap b{color:var(--tw-ink-900);font-weight:600}
  @media(min-width:1700px){.halofold{min-height:1180px;display:flex;flex-direction:column;justify-content:center}}
  /* below the wide breakpoint the centred column reaches the edges, so the feeds
     narrow and sit further back instead of disappearing entirely */
  @media(max-width:1699px){.halofeed{--fw:clamp(150px,13vw,230px)}.halofold{min-height:980px;display:flex;flex-direction:column;justify-content:center}}
  @media(max-width:1200px){.halofeed{--fw:clamp(128px,15vw,180px)}.halofold{min-height:860px}}
  @media(max-width:820px){.halofeed{--fw:clamp(104px,26vw,150px)}.halofeed.l{left:-3%}.halofeed.r{right:-3%}.halofold{min-height:0}}
  /* Below 1199px there isn't room to pin two full-height feeds at the outer
     edges without crushing the centred content between them. Swap the pair
     from side columns to top/bottom rows and turn each vertical feed into a
     horizontal marquee instead — `.haloposts` collapses to `display:contents`
     so `.halofeed.l`/`.halofeed.r` become ordinary flex children of `.halofold`
     alongside `.wrap`, giving 3 stacked rows (feed / content / feed) in place
     of the desktop's 1 row of 3 columns (feed | content | feed).
     The breathing room between each feed and the centred content comes from
     the standard section-rhythm token applied as top/bottom padding on the
     content wrap; the outer edges take a flat 20px above the top feed and
     20px below the bottom feed.
     Nothing here applies from 1200px up — the desktop column layout, its
     padding and the marquee animation are untouched. */
  @media(max-width:1199px){
    /* TOP/BOTTOM RHYTHM. The stacked layout owns its own outer spacing, so
       every foreign source of space is zeroed first and the wanted 20px is
       then put back on the fold itself:
         • `!important` on the padding/margin so a theme's `section`/`.fold`
           rule (or Elementor's wrapper) cannot stack a second gap on top;
         • `justify-content:flex-start`, because the desktop tiers above set
           `center` — once the section is stretched by a parent that centring
           splits the slack evenly above and below the three rows, which reads
           as a phantom pad over the top feed;
         • the widget wrapper's own top padding/margin, for the same reason. */
    [class*="elementor-widget-twrb_brand_halo"],
    [class*="elementor-widget-twrb_brand_halo"]>.elementor-widget-container{padding-top:0!important;margin-top:0!important}
    .halofold{display:flex;flex-direction:column;justify-content:flex-start;min-height:0;padding-top:20px!important;padding-bottom:20px;margin-top:0!important}
    .haloposts{position:static;display:contents}
    /* SHADOW GUTTER, ROTATED. Same trick as the desktop feed, on the other
       axis: the row is full-bleed so the side shadows fall inside the mask
       fade, but the feed's `overflow:hidden` was slicing the thumbs' shadow
       flat along the top and bottom edges. `--hsy`/`--hsb` open transparent
       bands there (the shadow sits 14px low and blurs 34px, rising to 22px/50px
       on hover, so it reaches ~3px above the card and ~47px below it), and the
       matching negative margins on `.l`/`.r` below cancel the bands again so
       the row rhythm is byte-for-byte what it was. The 20px outer gaps come
       from the fold's padding, not from these bands. */
    .halofeed{--hsy:8px;--hsb:52px;position:static;left:auto!important;right:auto!important;top:auto;bottom:auto;width:calc(100% + var(--gutter) * 2);padding:var(--hsy) 0 var(--hsb);margin-left:calc(var(--gutter) * -1);margin-right:calc(var(--gutter) * -1);height:auto;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
    .halofeed.l{order:1;margin-top:calc(var(--hsy) * -1);margin-bottom:calc(var(--hsb) * -1)}
    /* The breathing room between each feed and the centred content is owned by
       the content row itself rather than by a `row-gap` on the fold: the same
       `--fold-pad-y` token, as top and bottom padding on `.wrap`. Padding (not
       margin) because `.wrap` already carries `margin:0 auto` for its own
       centring, and because the feeds' negative `--hsy`/`--hsb` margins pull
       against their neighbours — padding on the wrap stays clear of both. */
    .halofold>.wrap{order:2;padding-top:var(--fold-pad-y);padding-bottom:var(--fold-pad-y)}
    .halofeed.r{order:3;margin-top:calc(var(--hsy) * -1);margin-bottom:calc(var(--hsb) * -1)}
    /* `width:max-content` is what stops the track from slicing its own posts:
       as a block-level box the stack would otherwise be exactly as wide as the
       feed, so the flex row would overflow it and the shared `translateX(-50%)`
       would land on half the feed instead of half the track — the loop would
       jump. Sizing the box to the full row puts the reset on exactly one of the
       two printed passes, so the marquee stays seamless. */
    .hfstack{flex-direction:row;width:max-content;animation-name:twFeedLeft}
    /* The thumb keeps the shared elevation here — with the shadow gutter above
       it now renders whole instead of being cut off along the row edges. */
    .hpost{width:clamp(140px,30vw,210px);flex:none;margin-bottom:0;margin-right:14px}
  }
  @keyframes twFeedLeft{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  @media(prefers-reduced-motion:reduce){.hfstack{animation:none}}

  /* fold: brand halo */
  .halostage{position:relative;padding:min(var(--sp-cap),clamp(30px,5.5vw,66px)) 0 clamp(10px,2vw,22px);display:flex;flex-direction:column;align-items:center}
  .halobloom{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:min(104%,1020px);aspect-ratio:4.2/1;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.85),rgba(233,244,255,.5) 45%,transparent 72%);pointer-events:none;z-index:0}
  .haloorbit{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:min(106%,1060px);height:auto;overflow:visible;pointer-events:none}
  .haloorbit.back{z-index:1}
  .haloorbit.front{z-index:3}
  .hstreak{fill:none;stroke-linecap:round;animation:twHaloSweep 13s linear infinite}
  .hstreak.s2{animation-duration:17s}
  .hstreak.s3{animation-duration:10s}
  .hstreak.s4{animation-duration:21s}
  .hspark{fill:none;stroke:#fff;stroke-linecap:round;stroke-dasharray:5 2000;animation:twHaloSweep 13s linear infinite}
  .hspark.k2{animation-duration:10s;animation-delay:-3s}
  @keyframes twHaloSweep{to{stroke-dashoffset:-2005}}
  .halolock{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
  .haloword{font-family:var(--font-display);font-size:clamp(4.5rem,17vw,13rem);line-height:.82;letter-spacing:.02em;background:linear-gradient(96deg,var(--tw-cobalt-800) 4%,var(--tw-cobalt-500) 34%,var(--tw-green-300) 68%,var(--tw-green-500) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
  .haloreflect{position:relative;z-index:2;margin-top:-.28em;transform:scaleY(-1);opacity:.1;filter:blur(1.5px);-webkit-mask-image:linear-gradient(transparent,rgba(0,0,0,.4) 52%,#000);mask-image:linear-gradient(transparent,rgba(0,0,0,.4) 52%,#000);pointer-events:none}
  .halodots{position:absolute;top:6%;bottom:6%;width:15%;pointer-events:none;z-index:0;background-image:radial-gradient(currentColor 1.1px,transparent 1.1px);background-size:11px 11px;opacity:.5;-webkit-mask-image:radial-gradient(120% 100% at var(--mx,0%) 50%,#000 4%,transparent 76%);mask-image:radial-gradient(120% 100% at var(--mx,0%) 50%,#000 4%,transparent 76%)}
  .halodots.l{left:0;--mx:0%;color:var(--tw-cobalt-500)}
  .halodots.r{right:0;--mx:100%;color:var(--tw-green-500)}
  /* DOTS UNDER THE FEEDS — desktop only.
     Both sides already had a positioning context: `.haloposts`/`.halofeed` are
     absolutely positioned off the fold, `.halodots` absolutely positioned off
     `.halostage`. What stopped a z-index from biting was the stacking context
     in between — `.halofold>.wrap` used to carry `z-index:1`, sealing every
     descendant (dots included) above `.haloposts`' `z-index:0`. That z-index is
     gone from the markup, so the wrap now paints as a `z-index:auto` positioned
     box: still over the feeds because it comes later in tree order, but no
     longer a lid. With the lid off, `z-index:-1` resolves against the fold and
     drops the dots beneath the feed wrappers.
     `isolation:isolate` is what keeps that negative layer inside the fold — it
     makes `.halofold` a stacking context (it is already `position:relative`)
     without moving it relative to its own siblings, so the dots cannot slide
     behind the section's `--surface-alt` background.
     Nothing else moves: `.halobloom` (0), `.haloorbit.back` (1), `.halolock`
     (2), `.haloorbit.front` (3) and `.tfstep` (auto) all still paint above both
     the dots and the feeds, exactly as they did inside the wrap.
     Below 1200px the feeds are stacked rows that never cross the dots — and the
     dots are hidden outright under 1200px — so this stays desktop-only. */
  @media(min-width:1200px){
    .halofold{isolation:isolate}
    .halodots{z-index:-1}
  }
  .trustflow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:min(var(--sp-cap),clamp(26px,3.6vw,56px));max-width:960px;margin:0 auto}
  .tfstep{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}
  .tfstep>*+*{margin-top:12px}
  .tflabel{font-size:clamp(21px,2.1vw,30px);font-weight:600;letter-spacing:.01em;line-height:1.2;opacity:0;transform:translateY(8px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
  .reveal-in .tflabel{opacity:1;transform:none}
  .tfstep:nth-child(2) .tflabel{transition-delay:.16s}
  .tfstep:nth-child(3) .tflabel{transition-delay:.32s}
  .tfstep:nth-child(4) .tflabel{transition-delay:.48s}
  .tfarrow{position:absolute;top:50%;margin-top:-12px;right:calc(-1 * clamp(26px,3.6vw,56px) / 2);width:24px;height:24px;transform:translateX(50%);color:var(--tw-ink-300);opacity:0;transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
  .reveal-in .tfarrow{opacity:1}
  .tfstep:nth-child(2) .tfarrow{transition-delay:.24s}
  .tfstep:nth-child(3) .tfarrow{transition-delay:.4s}
  @media(max-width:720px){
    .trustflow{gap:20px 20px}
    .tflabel{font-size:clamp(16px,2.1vw,30px)}
    .tfarrow{display:none}
  }
  /* The closing note under the trust flow used to be a `<p>` carrying a
     `border-top` plus the `padding-top` that held its copy off that hairline.
     No content element may carry vertical padding, so the hairline is drawn by
     a zero-height block `::before` at the top of the paragraph and the space
     under it is that pseudo-element's `margin-bottom`. The paragraph has no
     horizontal padding, so the pseudo-element's border spans exactly the same
     width the paragraph's own border-top did — the rendering is unchanged.
     The step is a custom property so the mobile block can retune it without
     reintroducing padding. */
  .halo-close{--halo-close-step:min(var(--sp-cap),clamp(24px,3vw,34px))}
  .halo-close::before{content:"";display:block;border-top:1px solid var(--border-subtle);margin-bottom:var(--halo-close-step)}
  /* The dot fields are a desktop-only flourish: below 1200px the stage is
     narrow enough that the two 15%-wide columns crowd the halo lock-up, so
     they are removed outright for the whole iPad + mobile band (the project's
     desktop band starts at 1200px — see SPACING CAPS at the top of this
     file). `!important` because the span is a bare element a theme can style.
     Paired with the `min-width:1200px` rule above, the dots now only ever
     exist in the band where that rule also applies. */
  @media(max-width:1199.98px){.halodots{display:none!important}}
  @media(prefers-reduced-motion:reduce){.hstreak,.hspark{animation:none}.hspark{display:none}}

  /* fold: the decaying pitch */
  .dcypanel{position:relative;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);width:100vw;border-radius:0;padding:min(var(--sp-cap),clamp(52px,7vw,112px)) min(var(--sp-cap),clamp(24px,5vw,90px));overflow:hidden;background:linear-gradient(158deg,rgba(255,255,255,.055),rgba(255,255,255,.015) 52%,rgba(255,255,255,.03));box-shadow:0 40px 90px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06)}
  .dcypanel::before{content:"";position:absolute;inset:-55%;background:conic-gradient(from 0deg,transparent 0deg,color-mix(in srgb,var(--tw-green-500) 70%,transparent) 42deg,transparent 96deg,transparent 190deg,color-mix(in srgb,var(--state-danger) 62%,transparent) 236deg,transparent 292deg);animation:dcySpin 9s linear infinite;pointer-events:none}
  .dcypanel::after{content:"";position:absolute;inset:0;border-radius:0;background:linear-gradient(158deg,#131e38,#0e1830 58%,#121d36);pointer-events:none}
  .dcypanel>.dcy{position:relative;z-index:1;max-width:var(--content-wide);margin:0 auto}
  .dcypanel>span{z-index:2}
  @keyframes dcySpin{to{transform:rotate(360deg)}}
  .dcyscan{position:absolute;left:0;right:0;top:0;height:34%;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--tw-green-500) 7%,transparent) 60%,transparent);animation:dcyScan 7.5s var(--ease-in-out) infinite}
  @keyframes dcyScan{0%,100%{transform:translateY(-40%);opacity:0}12%{opacity:1}88%{opacity:1}92%{transform:translateY(300%);opacity:0}}
  .dcyc{position:absolute;width:clamp(16px,1.8vw,26px);height:clamp(16px,1.8vw,26px);z-index:2;pointer-events:none;border:2px solid var(--tw-green-500);opacity:.75}
  .dcyc.tl{top:clamp(18px,2.4vw,34px);left:clamp(18px,2.4vw,34px);border-right:0;border-bottom:0}
  .dcyc.tr{top:clamp(18px,2.4vw,34px);right:clamp(18px,2.4vw,34px);border-left:0;border-bottom:0;border-color:var(--state-danger)}
  .dcyc.bl{bottom:clamp(18px,2.4vw,34px);left:clamp(18px,2.4vw,34px);border-right:0;border-top:0}
  .dcyc.br{bottom:clamp(18px,2.4vw,34px);right:clamp(18px,2.4vw,34px);border-left:0;border-top:0;border-color:var(--state-danger)}
  .dcypanel.paused::before,.dcypanel.paused .dcyscan{animation-play-state:paused}
  @media(prefers-reduced-motion:reduce){.dcypanel::before,.dcyscan{animation:none}.dcyscan{opacity:0}}
  @media(max-width:900px){.dcypanel{padding:min(var(--sp-cap),clamp(44px,9vw,64px)) min(var(--sp-cap),clamp(18px,5vw,28px))}}
  .dcy-head{font-family:var(--font-body);font-weight:700;text-transform:uppercase;letter-spacing:.01em;font-size:clamp(1.75rem,3.6vw,2.9rem);line-height:1.12;color:#fff;margin:0;max-width:16ch;text-wrap:balance}
  /* FLEX — source tracks `minmax(0,.72fr) minmax(0,1.28fr)` */
  .dcy{display:flex;column-gap:min(var(--sp-cap),var(--col-gap));align-items:center}
  .dcy>:first-child{flex:.72 1 0;min-width:0}
  .dcy>.dcy-list{flex:1.28 1 0;min-width:0}
  /* FLEX. Two tracks with a zero row gap and a full-row rule between each
     pair. Wrapping flex lines reproduce those rows one for one: a line is as
     tall as its tallest cell, exactly like an auto grid row, and the rule
     takes a line of its own because it is 100% wide. */
  .dcy-list{--dcy-col-gap:clamp(10px,1.2vw,20px);position:relative;display:flex;flex-wrap:wrap;column-gap:var(--dcy-col-gap);align-items:center;margin:0;padding:0;list-style:none}
  .dcy-list>.dcy-cap,.dcy-list>.dcy-word,.dcy-list>.dcy-note{flex:0 0 calc((100% - var(--dcy-col-gap)) / 2);min-width:0}
  .dcy-list>.dcy-rule{flex:0 0 100%}
  /* the caption sits on the baseline of its line and lifts itself clear of
     the first row — a `margin-bottom` on a flex-end item does exactly what
     the old `padding-bottom` did, without padding on a text element. */
  .dcy-cap{align-self:flex-end;font-size:clamp(13px,1.15vw,17px);font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:clamp(14px,1.7vw,20px)}
  .dcy-cap.l{color:var(--tw-cobalt-200);text-align:right}
  .dcy-cap.r{color:color-mix(in srgb,var(--state-danger) 78%,#fff);padding-left:calc(clamp(17px,1.7vw,21px) + 10px);text-align:left}
  /* `justify-self:end` on an inline-block === a track-wide box whose text is
     right-aligned, which the `text-align` here already does. The row's own
     height came from vertical padding on the text; it is the same distance
     as a margin, and margins do not collapse inside a flex line. */
  .dcy-word{position:relative;display:block;text-align:right;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.015em;line-height:.98;font-size:clamp(1.5rem,3.4vw,2.9rem);color:#fff;transition:none;margin:clamp(10px,1.2vw,15px) 0}
  .reveal-in .dcy-word{animation:dcyDecay 2.4s var(--ease-out) forwards}
  .dcy-note{display:flex;align-items:center;gap:10px;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.02em;font-size:clamp(1.1rem,2.5vw,2.15rem);line-height:.98;color:var(--state-danger);white-space:nowrap;margin:clamp(10px,1.2vw,15px) 0;opacity:0;transform:translateX(-8px)}
  .reveal-in .dcy-note{animation:dcyNote .8s var(--ease-out) forwards}
  .dcy-note .x{box-shadow:0 0 0 0 color-mix(in srgb,var(--state-danger) 40%,transparent);width:clamp(17px,1.7vw,21px);height:clamp(17px,1.7vw,21px);border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--state-danger) 18%,transparent);border:1px solid color-mix(in srgb,var(--state-danger) 42%,transparent);color:var(--state-danger)}
  .dcy-row.gone .dcy-note{opacity:.85}
  .dcy-rule{height:clamp(6px,.8vw,10px)}
  @keyframes dcyDecay{
    0%,26%{opacity:1;transform:none;letter-spacing:.015em}
    100%{opacity:var(--fade,.7);transform:none;letter-spacing:.07em}
  }
  @keyframes dcyNote{0%{opacity:0;transform:translateX(-8px)}100%{opacity:1;transform:translateX(0)}}
  /* Headline -> Verdict is a heading -> content step, so it takes the standard
     `--hc-gap` token from the CONTENT SPACING SYSTEM rather than the bespoke
     clamp it used to carry. The token is already capped per band, so no
     `min(var(--sp-cap),…)` wrapper is needed. */
  .dcy-verdict{margin:var(--hc-gap) 0 0;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.01em;line-height:.9;font-size:clamp(2.3rem,6.4vw,5.4rem);color:#fff}
  .dcy-verdict .headmark{color:var(--tw-green-500)}
  @media(prefers-reduced-motion:reduce){
    .reveal-in .dcy-word{animation:none;opacity:.78;letter-spacing:.03em}
    .reveal-in .dcy-note{animation:none;opacity:1;transform:none}
  }
  @media(max-width:900px){
    .dcy{flex-direction:column;align-items:stretch;column-gap:0}
    .dcy>:first-child,.dcy>.dcy-list{flex:0 0 auto;width:100%}
    .dcy>.dcy-list{margin-top:min(var(--sp-cap),28px)}
    .dcy-word{font-size:clamp(1.4rem,5.6vw,1.9rem)}
    .dcy-note{font-size:clamp(.95rem,4vw,1.4rem);white-space:normal}
    .dcy-list{--dcy-col-gap:14px}
  }
  @media(max-width:767px){
    /* the uneven pair (4.5fr / 5.5fr) */
    .dcy-list>.dcy-cap.l,.dcy-list>.dcy-word{flex-basis:calc((100% - var(--dcy-col-gap)) * .45)}
    .dcy-list>.dcy-cap.r,.dcy-list>.dcy-note{flex-basis:calc((100% - var(--dcy-col-gap)) * .55)}
  }

  /* fold: why clients stay */
  /* FLEX — `repeat(4,1fr)` with a gap becomes a wrapping row whose items are
     each an exact quarter of the space left by the three gaps. The card row
     carries a COLUMN gap only: the wrap step is a `margin-top` on the cards,
     zeroed on the first line so the row still starts where it did. The
     first line is as many cards as the breakpoint shows, so the cancel is
     fenced into non-overlapping bands (4 / 2 / 1 per row). */
  .pillars{--pil-gap:clamp(12px,1.2vw,18px);display:flex;flex-wrap:wrap;column-gap:var(--pil-gap);align-items:stretch;margin-top:min(var(--sp-cap),clamp(32px,4vw,52px))}
  .pillars>*{flex:0 0 calc((100% - var(--pil-gap) * 3) / 4);min-width:0;margin-top:var(--pil-gap)}
  @media(min-width:1024.02px){.pillars>:nth-child(-n+4){margin-top:0}}
  @media(min-width:560.02px) and (max-width:1024px){.pillars>:nth-child(-n+2){margin-top:0}}
  @media(max-width:560px){.pillars>:first-child{margin-top:0}}
  .pillar{position:relative;display:flex;flex-direction:column;padding:min(var(--sp-cap),clamp(24px,2.2vw,32px)) clamp(20px,1.9vw,26px) min(var(--sp-cap),clamp(24px,2.2vw,30px));border-radius:var(--radius-lg);overflow:hidden;cursor:default;background:#1B3E93;box-shadow:0 16px 40px rgba(12,18,32,.16);transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
  .pillar{background:var(--pbg,#1B3E93)}
  .pillar[data-pillar="accountability"],.pillar[data-pillar="performance"]{--pico-fg:#fff;--pico-bg:rgba(20,26,36,.2);--pico-bd:var(--tw-green-300);--pico-hbg:#fff;--pcue-col:var(--tw-ink-900)}
  .pillar::after{content:"";position:absolute;left:0;top:0;height:3px;width:0;background:var(--pcol);transition:width .7s var(--ease-out);z-index:2}
  .pillar.is-lit::after,.pillar:hover::after,.pillar:focus-visible::after{width:100%}
  .pillar::before{content:"";position:absolute;right:-24%;top:-46%;width:96%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in oklch,var(--pcol) 34%,transparent),transparent 72%);opacity:.45;transition:opacity .5s var(--ease-out),transform .6s var(--ease-out);pointer-events:none}
  .pillar.is-lit::before{opacity:.7}
  .pillar:hover,.pillar:focus-visible{transform:translateY(-7px);box-shadow:0 30px 64px rgba(12,18,32,.28)}
  .pillar:hover::before,.pillar:focus-visible::before{opacity:1;transform:scale(1.1)}
  .pillar:focus-visible{outline:2px solid var(--pcol);outline-offset:3px}
  .pgnum{display:none}
  .pillar>*{position:relative;z-index:1}
  .pillar .pico2{width:54px;height:54px;border-radius:15px;display:flex;align-items:center;justify-content:center;color:var(--pico-fg,#fff);background:var(--pico-bg,color-mix(in oklch,var(--pcol) 46%,transparent));border:1px solid var(--pico-bd,color-mix(in oklch,var(--pcol) 72%,transparent));transition:transform .45s var(--ease-out),background .35s var(--ease-out),color .35s var(--ease-out),box-shadow .45s var(--ease-out)}
  .pillar:hover .pico2,.pillar:focus-visible .pico2{background:var(--pico-hbg,var(--pcol));color:var(--tw-ink-900);border-color:var(--pico-hbg,var(--pcol));transform:translateY(-3px) scale(1.05);box-shadow:0 16px 32px color-mix(in oklch,var(--pcol) 62%,transparent),0 0 0 4px color-mix(in oklch,var(--pcol) 26%,transparent)}
  .pillar b{display:block;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.02em;font-size:clamp(1.5rem,2.3vw,2.1rem);line-height:.96;color:#fff}
  .pillar small{display:block;font-size:15px;color:rgba(255,255,255,.7);line-height:1.62;text-wrap:pretty}
  /* the card's own stack: the 15px `gap` is a `margin-top` on each following
     child. The description absorbs the card's free height, which is what the
     cue's old `margin-top:auto` did, so the cue still sits on the bottom
     edge — and its 18px `padding-top` joins the 15px step as one margin. */
  .pillar>*+*{margin-top:15px}
  .pillar small{flex:1 1 auto}
  .pillar>.pcue{margin-top:33px}
  .pcue{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--pcue-col,#fff);opacity:0;transform:translateY(6px);transition:opacity .4s var(--ease-out),transform .4s var(--ease-out)}
  .pillar:hover .pcue,.pillar:focus-visible .pcue{opacity:1;transform:translateY(0)}
  .pcue svg{transition:transform .4s var(--ease-out)}
  .pillar:hover .pcue svg{transform:translateX(4px)}
  /* the single-line headline can't fit under the --display-lg 35.2px floor; let it wrap there */
  .proofline br{display:block}
  @media(max-width:520px){.proofline{white-space:normal!important;max-width:22ch!important;font-size:clamp(1.35rem,6.4vw,1.9rem)!important}}
  @media(max-width:767px){.elementor-widget-twrb_proof .tw-eyebrow + .tw-display{white-space:normal!important;word-break:break-word}}
  @media(max-width:600px){.asshead{font-size:clamp(2rem,8.5vw,2.9rem)!important}}
  .staytag{display:inline-flex;align-items:center;gap:12px;padding:15px min(var(--sp-cap),26px);border-radius:var(--radius-pill);background:var(--tw-zircon);border:1px solid var(--border-subtle);font-size:16px;font-weight:600;color:var(--tw-ink-900)}
  @media(max-width:767px){
    .staytag{flex-wrap:wrap;align-items:flex-start;line-height:1.2}
    .staytag svg{margin-top:1px}
  }
  @media(max-width:1024px){.pillars>*{flex-basis:calc((100% - var(--pil-gap)) / 2)}}
  @media(max-width:560px){.pillars>*{flex-basis:100%}}
  .gbar{display:flex;align-items:center;gap:min(var(--sp-cap),clamp(16px,2.5vw,30px))}
  /* content stack: the `gap` becomes a `margin-top` on each following child */
  .pphead{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:min(var(--sp-cap),clamp(34px,4.4vw,58px))}
  .pphead>*+*{margin-top:clamp(14px,1.8vw,22px)}
  /* FLEX — `repeat(6,1fr)`; the wrap step rides on the cells as a margin,
     zeroed on the first line (6 / 4 / 2 cells, per band) */
  .ppgrid{--pp-gap:clamp(12px,1.4vw,20px);display:flex;flex-wrap:wrap;column-gap:var(--pp-gap)}
  .ppgrid>*{flex:0 0 calc((100% - var(--pp-gap) * 5) / 6);min-width:0;margin-top:var(--pp-gap)}
  @media(min-width:1100.02px){.ppgrid>:nth-child(-n+6){margin-top:0}}
  @media(min-width:620.02px) and (max-width:1100px){.ppgrid>:nth-child(-n+4){margin-top:0}}
  @media(max-width:620px){.ppgrid>:nth-child(-n+2){margin-top:0}}
  .ppcell{display:flex;align-items:center;justify-content:center;min-height:clamp(78px,8vw,104px);padding:14px 16px;background:#fff;border-radius:var(--radius-md);box-shadow:0 8px 22px rgba(9,24,66,.22);opacity:0;transform:translateY(14px) scale(.97);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out),box-shadow .3s var(--ease-out)}
  .reveal-in .ppcell{opacity:1;transform:none}
  .ppcell:hover{box-shadow:0 16px 34px rgba(9,24,66,.3),0 0 0 2px rgba(140,198,62,.5);transform:translateY(-3px)}
  .ppcell img{width:auto;max-width:100%;object-fit:contain}
  @media(max-width:1100px){.ppgrid>*{flex-basis:calc((100% - var(--pp-gap) * 3) / 4)}}
  @media(max-width:620px){.ppgrid>*{flex-basis:calc((100% - var(--pp-gap)) / 2)}}
  .fnwrap{display:grid;grid-template-columns:minmax(0,var(--fn-c1,.95fr)) minmax(0,var(--fn-c2,1.05fr));grid-template-areas:"left stage";gap:min(var(--sp-cap),clamp(26px,4vw,64px));align-items:center}
  .fnwrap[data-swap="yes"]{grid-template-areas:"stage left"}
  .fnleft{grid-area:left}
  .fnstage{grid-area:stage}
  .fnhead{align-items:flex-start;text-align:left;gap:clamp(12px,1.5vw,18px);margin-bottom:min(var(--sp-cap),clamp(40px,5vw,68px))}
  .fnhead h2{font-size:clamp(2.6rem,4.9vw,4.3rem)!important}
  @media(max-width:980px){.fnhead{align-items:center;text-align:center}}
  @media(max-width:980px){.fnwrap{grid-template-columns:1fr;grid-template-areas:"left" "stage";gap:min(var(--sp-cap),clamp(24px,5vw,40px))}.fnwrap[data-swap="yes"]{grid-template-areas:"stage" "left"}}
  /* the funnel eyebrow takes the global scale on desktop — 17px / 28x2px (see
     the EYEBROW LOCK block at the end of this file) — and the standalone
     reference's own 15px / 14px-gap step below 1199.98px, which is declared
     next to that lock so it can outrank it */
  .fntabs{display:none}
  @media(max-width:990.98px){
    .fnwrap{grid-template-columns:1fr;grid-template-areas:"head" "stage" "panels"}
    .fnwrap[data-swap="yes"]{grid-template-areas:"head" "stage" "panels"}
    .fnleft{display:contents}
    .fnhead{grid-area:head;align-items:center;text-align:center;margin-bottom:0}
    .fnpanels{grid-area:panels}
    /* The reference's stacked tab strip, carried over verbatim with the rest
       of the funnel's styles. It is inert in the reference too — `.fntabs` is
       `display:none` at base width, `display:flex` here, then
       `display:none!important` again below 1199.98px (see the funnel eyebrow
       block after the EYEBROW LOCK), and the section ships no `.fntab`
       markup at all. Kept so the section's stylesheet, hover states and
       responsive behaviour match the standalone exactly; `initFunnelTabs()`
       in techwyse-interactions.js wires it up if markup is ever added. */
    .fntabs{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:8px;margin-top:clamp(10px,2vw,16px);width:100%;max-width:440px}
    .fntab{flex:none;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:44px;min-height:44px;padding:6px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#fff;font:600 11.5px/1.2 var(--font-body);letter-spacing:.05em;text-transform:uppercase;text-align:center;cursor:pointer;transition:background .3s var(--ease-out),border-color .3s var(--ease-out),padding .3s var(--ease-out),gap .3s var(--ease-out)}
    .fntab i{width:30px;height:30px;flex:none;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:14px;font-weight:700;letter-spacing:0;color:#fff;border:1px solid rgba(255,255,255,.28);transition:background .3s,color .3s,border-color .3s}
    .fntab span{max-width:0;max-height:0;overflow:hidden;opacity:0;white-space:normal;text-wrap:balance;transition:max-width .4s var(--ease-out),max-height .4s var(--ease-out),opacity .3s var(--ease-out)}
    .fntab:hover{border-color:rgba(255,255,255,.34)}
    .fntab:focus-visible{outline:2px solid var(--fc);outline-offset:2px}
    .fntab.on{flex:0 1 auto;min-width:0;gap:6px;padding:8px 14px 10px;border-radius:22px;background:color-mix(in oklch,var(--fc) 18%,transparent);border-color:var(--fc)}
    .fntab.on i{width:26px;height:26px;font-size:13px;background:var(--fc);border-color:var(--fc);color:#0A0D12}
    .fntab.on span{max-width:190px;max-height:4em;opacity:1}
  }
  .fnpanels{position:relative;display:grid;align-items:start;border-top:1px solid rgba(255,255,255,.1);padding-top:min(var(--sp-cap),clamp(24px,2.8vw,36px))}
  @media(max-width:980px){.fnpanel h3{margin-top:10px}}
  .fnpanel{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .4s var(--ease-out),transform .4s var(--ease-out)}
  .fnpanel.on{opacity:1;visibility:visible;transform:none}
  .fnstep{display:inline-flex;align-items:center;gap:13px;font-family:var(--font-body);font-size:clamp(13px,1.05vw,15px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55)}
  .fnstep i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:14px;font-weight:700;letter-spacing:0;color:#0A0D12;background:var(--fc,#8CC63E)}
  .fnpanel h3{margin:12px 0 min(var(--sp-cap),26px);font-size:clamp(1.7rem,2.7vw,2.35rem);line-height:1;letter-spacing:.01em;color:#fff}
  .fnpanel h3 em{font-style:normal;color:var(--fc,#8CC63E)}
  .fnlinks{display:flex;flex-direction:column;counter-reset:fnl}
  .fnlink{counter-increment:fnl;position:relative;isolation:isolate;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(14px,1.4vw,20px);padding:clamp(11px,1.1vw,15px) clamp(12px,1.1vw,16px);border-bottom:1px solid rgba(255,255,255,.09);font-family:var(--font-body);font-size:clamp(14.5px,1.2vw,16.5px);color:rgba(255,255,255,.8);text-decoration:none;opacity:0;transform:translateY(9px);transition:color .22s var(--ease-out),transform .42s var(--ease-out),opacity .42s var(--ease-out)}
  .fnpanel.on .fnlink{opacity:1;transform:none;transition-delay:calc(var(--i,0) * 60ms + 90ms)}
  /* stage-tinted wash + growing edge, drawn behind the row */
  .fnlink::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:var(--radius-sm,6px);background:linear-gradient(90deg,color-mix(in oklch,var(--fc,#8CC63E) 20%,transparent),transparent 72%);opacity:0;transition:opacity .28s var(--ease-out)}
  .fnlink::after{content:"";position:absolute;left:0;top:12%;bottom:12%;z-index:-1;width:2px;border-radius:2px;background:var(--fc,#8CC63E);transform:scaleY(0);transform-origin:center;transition:transform .3s var(--ease-out)}
  /* `a.fnlink`, not `.fnlink`: the global `a:not([href*="tel:" i]):hover` rule
     near the top of this file is (0,2,1) and was outranking a bare
     `.fnlink:hover` (0,2,0), so the links hovered green instead of the
     reference's white. Adding the element to the selector puts it level and,
     being later in the sheet, it wins. */
  a.fnlink:not([href*="tel:" i]):hover,a.fnlink:not([href*="tel:" i]):focus-visible{color:#fff;outline:none;transform:translateX(5px)}
  .fnlink:not([href*="tel:" i]):hover::before,.fnlink:not([href*="tel:" i]):focus-visible::before{opacity:1}
  .fnlink:not([href*="tel:" i]):hover::after,.fnlink:not([href*="tel:" i]):focus-visible::after{transform:scaleY(1)}
  .fnlink .fni{font-family:var(--font-display);font-size:clamp(12px,.95vw,13.5px);letter-spacing:.08em;line-height:1;color:rgba(255,255,255,.32);font-variant-numeric:tabular-nums;transition:color .22s var(--ease-out)}
  .fnlink .fni::before{content:"0" counter(fnl)}
  .fnlink:not([href*="tel:" i]):hover .fni,.fnlink:not([href*="tel:" i]):focus-visible .fni{color:var(--fc,#8CC63E)}
  .fnlink b{font-weight:400;text-wrap:pretty}
  .fnlink u{text-decoration:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font-size:13px;line-height:1;color:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.14);transition:transform .32s var(--ease-out),color .2s,background .24s,border-color .24s}
  .fnlink:not([href*="tel:" i]):hover u,.fnlink:not([href*="tel:" i]):focus-visible u{transform:translateX(4px);color:#0A0D12;background:var(--fc,#8CC63E);border-color:var(--fc,#8CC63E)}
  @media(prefers-reduced-motion:reduce){.fnlink{opacity:1;transform:none;transition:none}}
  .fnstage{position:relative;display:flex;flex-direction:column;align-items:center;justify-self:center;width:100%;max-width:620px}
  .fnplume{position:relative;width:100%;height:clamp(160px,18vw,230px);pointer-events:none}
  /* STACKED STAGE (reference metrics).
     Below the stack point the stage is no longer a column of its own, so it
     spans the full content width and the funnel is sized outright instead of
     being squeezed by a track: 300px of SVG on tablet, 260px on phones, with
     24px of side padding for the segment glow to fall into.
     The plume keeps its 620x230 desktop coordinate frame — its `--dx`/`left`
     offsets are absolute pixels tuned to that box — and is scaled about its
     bottom centre to the SVG's width (620 x .484 = 300, 620 x .42 = 260). The
     transform costs no layout, so the negative `margin-top` gives back exactly
     the height the scale removes (230 x .484 = 111 -> -119; 230 x .42 = 97 ->
     -133) and the icons still meet the funnel mouth. */
  @media(max-width:990.98px){
    .fnstage{max-width:none;width:100%;padding:28px 24px 12px}
    .fnstage .fnsvg{width:300px;max-width:100%}
    .fnplume{flex:none;width:620px;height:230px;transform:scale(.484);transform-origin:50% 100%;margin-top:-119px}
  }
  @media(max-width:767.98px){
    .fnstage .fnsvg{width:260px}
    .fnplume{transform:scale(.42);margin-top:-133px}
  }
  .fnp{position:absolute;bottom:0;width:var(--s,36px);height:var(--s,36px);border-radius:13px;background:#fff;display:grid;place-items:center;box-shadow:0 10px 26px rgba(0,0,0,.45);opacity:0;animation:fnrise var(--d,10s) linear var(--dl,0s) infinite}
  .fnp img{width:64%;height:64%;object-fit:contain}
  @keyframes fnrise{0%{opacity:0;transform:translate(-50%,14px) scale(.35)}14%{opacity:1;transform:translate(calc(-50% + (var(--dx)/7)),calc(var(--rise)/-7)) scale(1)}72%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(var(--rise)*-1)) scale(1.02)}}
  .fnsvg{width:100%;height:auto;overflow:visible}
  /* SHADOW HEAD-ROOM. `filter:drop-shadow()` on an SVG element is clipped to
     that element's filter region, which browsers derive from its bounding box
     (-10% / 120%) — a 30px blur offset 10px down needs far more than that, so
     the active segment's glow was being sliced into a rectangle on its top and
     side edges. Each `.fnseg` therefore carries an invisible `.fnbox` rect that
     enlarges the group's bbox (and with it the filter region) well past the
     glow. It paints nothing and takes no pointer events, so hover/focus, the
     `.fnseg` <-> `.fnpanel` cycle and the `transform:translateY(-3px)` lift are
     all unchanged. `.fnstage`/`.fnplume` stay unclipped for the same reason. */
  .fnbox{fill:none;stroke:none;pointer-events:none}
  /* ...and nothing between the funnel and the page may clip either. The fold
     used to carry `overflow:clip` + `overflow-clip-margin:90px`, which widens
     the clip in Chrome and Firefox but is a no-op in Safari (it does not
     implement `overflow-clip-margin`), so there the fold still cut the ground
     shadow and the active segment's glow at its own box — the very rectangle
     this block exists to remove. The fold's clip only ever contained the two
     decorative radial blobs, and the widget now wraps those in their own
     `inset:0;overflow:hidden` layer, so the fold itself no longer needs one.
     Declaring the whole chain unclipped keeps it that way even when a theme
     or an Elementor container tries to reintroduce a clip. */
  .fold[data-funnel],.fold[data-funnel]>.wrap-wide,.fnwrap,.fnstage,.fnplume{overflow:visible}
  /* ...with ONE axis of exception below the stack point. The stacked plume
     keeps its 620px-wide coordinate frame (see the stage block above), which is
     wider than a phone viewport, so its empty layout box would push the page
     into horizontal scroll. The source page absorbs that with `overflow:hidden`
     on the fold; here only the X axis is clipped, at the fold's own box —
     nothing the funnel draws comes anywhere near the fold's left/right edges
     (the gutter alone is wider than the segment glow), while Y stays `visible`
     so the ground shadow and the active segment's glow still spill freely.
     `overflow: <x> <y>` with one axis `visible` and the other `clip` is the one
     mixed pair CSS allows; browsers without `overflow:clip` simply drop the
     declaration and keep today's fully-unclipped behaviour. */
  @media(max-width:990.98px){
    .fold[data-funnel]{overflow-x:clip;overflow-y:visible}
  }
  .fnseg{cursor:pointer;transition:transform .4s var(--ease-out),filter .4s var(--ease-out);transform-box:fill-box;transform-origin:center}
  .fnseg .fnon{opacity:0;transition:opacity .4s var(--ease-out)}
  .fnseg.active .fnon{opacity:1}
  .fnseg.active{transform:translateY(-3px)}
  .fnseg[data-stage="0"].active{filter:drop-shadow(0 10px 30px rgba(46,95,214,.55))}
  .fnseg[data-stage="1"].active{filter:drop-shadow(0 10px 30px rgba(63,138,224,.5))}
  .fnseg[data-stage="2"].active{filter:drop-shadow(0 10px 30px rgba(69,174,232,.5))}
  .fnseg[data-stage="3"].active{filter:drop-shadow(0 10px 30px rgba(95,214,220,.45))}
  .fnsheen{pointer-events:none;mix-blend-mode:screen}
  .fnshade,.fnedge,.fnrim{pointer-events:none}
  .fnchev{opacity:0;transition:opacity .4s var(--ease-out);pointer-events:none}
  .fnseg.active .fnchev{opacity:1}
  .fnchev path{animation:fnChev 1.7s ease-in-out infinite}
  @keyframes fnChev{0%,100%{opacity:.1}50%{opacity:.95}}
  .fnring{transform-box:fill-box;transform-origin:center;animation:fnRing 3.6s var(--ease-out) infinite;pointer-events:none}
  @keyframes fnRing{0%{opacity:.45;transform:scale(.9)}100%{opacity:0;transform:scale(1.34)}}
  .fnmouth{pointer-events:none;animation:fnMouthPulse 3.6s ease-in-out infinite}
  @keyframes fnMouthPulse{0%,100%{opacity:.55}50%{opacity:1}}
  @media(prefers-reduced-motion:reduce){.fnchev path,.fnring,.fnmouth{animation:none}}
  .fncap{font-family:var(--font-body);font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.5);text-align:center;max-width:40ch;margin:clamp(10px,1.6vw,20px) auto 0}
  @media(prefers-reduced-motion:reduce){.fnp{animation:none;opacity:.9;transform:translate(-50%,0)}}
  .revwall{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
  .revrow{display:flex;width:max-content;gap:clamp(18px,2vw,26px);padding:clamp(9px,1vw,13px) 0}
  .revrow.a{animation:twRevLeft 112s linear infinite}
  .revwall:hover .revrow{animation-play-state:paused}
  @keyframes twRevLeft{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .tmcard{flex:none;width:clamp(300px,25vw,382px);background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:min(var(--sp-cap),clamp(22px,2.4vw,28px));transition:box-shadow .3s var(--ease-out),transform .3s var(--ease-out),opacity .35s var(--ease-out),border-color .3s var(--ease-out)}
  .tmcard:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}
  /* A pillar hover is a pillar hover: it lights the tile it is on and nothing
     else. The review wall is never dimmed, re-bordered or re-shadowed from up
     there — the cards keep their own resting look at all times. */
  @media(prefers-reduced-motion:reduce){.revrow{animation:none;flex-wrap:wrap;width:100%;justify-content:center}}
  /* On the small screens the widget lists (1200px and below by default) the
     wall stops drifting and becomes a slider: techwyse-interactions.js adds
     `.is-slider` (only where motion is allowed) and steps the track one card
     every `data-slide-interval` milliseconds. The duplicated second pass of
     cards stays in the DOM — the step onto the first duplicate is what lets the
     loop restart forwards instead of rewinding back through every card.

     `--tw-slide-per` is how many cards share the view at the current width (the
     widget's "Cards Per View" rules) and `--tw-slide-gap` the space between
     them; both are written onto the wall by the script. With the defaults —
     one card, no gap — a card is the full width of the wall, exactly as before. */
  .revwall.is-slider{-webkit-mask-image:none;mask-image:none}
  .revwall.is-slider .revrow{width:100%;gap:var(--tw-slide-gap,0px);animation:none;transition:transform .55s var(--ease-out);will-change:transform}
  .revwall.is-slider .revrow>.tmcard{flex:0 0 calc((100% - (var(--tw-slide-per,1) - 1) * var(--tw-slide-gap,0px)) / var(--tw-slide-per,1));width:auto;min-width:0;max-width:100%}
  .tmcard p{font-size:14.5px;line-height:1.75;color:var(--text-body);margin:18px 0 0}
  .tmava{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:21px;flex:none}
  .tmava.pic{background:#fff!important;border:1px solid var(--border-subtle);overflow:hidden;padding:5px}
  .tmava.pic img{width:100%;height:100%;object-fit:contain;display:block}
  /* a reviewer's profile picture (imported from the review plugin) fills the
     circle instead of sitting padded inside it like a client logo */
  .tmava.pic.photo{padding:0;border-color:transparent}
  .tmava.pic.photo img{object-fit:cover}
  .stars{color:#FBBC05;font-size:14px;letter-spacing:.1em}
  .revrow{align-items:stretch}
  .tmcard{display:flex;flex-direction:column}
  .tmmore{margin-top:auto!important;align-self:flex-start;padding-top:12px}
  .tmtext{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
  .tmcard.is-open .tmtext{display:block;overflow:visible}
  .tmmore{display:none;margin-top:12px;padding:0;background:none;border:0;font-family:var(--font-body);font-size:13.5px;font-weight:600;color:var(--tw-cobalt-700);cursor:pointer;letter-spacing:.01em;border-bottom:1px solid color-mix(in srgb,var(--tw-cobalt-700) 34%,transparent);transition:color .22s var(--ease-out),border-color .22s var(--ease-out)}
  .tmmore:hover{color:var(--tw-green-700);border-color:var(--tw-green-600)}
  .tmcard.can-expand .tmmore{display:inline-block}

  /* fold: who we work with */
  /* the row has no border, so its old `padding-top` is the same distance as
     one combined `margin-top` — and content keeps its padding at zero */
  .fitrow{display:block;margin-top:calc(min(var(--sp-cap),clamp(26px,3.4vw,44px)) + min(var(--sp-cap),clamp(20px,2.6vw,32px)))}
  /* FLEX — source tracks `minmax(190px,auto) minmax(0,760px)`: an auto label
     with a 190px floor beside a capped, growing tick grid. */
  .fitcols{display:flex;column-gap:min(var(--sp-cap),var(--col-gap));align-items:center;justify-content:center;margin-top:min(var(--sp-cap),clamp(30px,4vw,50px))}
  .fitcols>.fitlabel{flex:0 1 auto;min-width:190px}
  .fitcols>.fitgrid{flex:1 1 0;min-width:0;max-width:760px}
  .fitlabel{position:relative;margin:0;align-self:center;text-align:right;font-family:var(--font-display);text-transform:uppercase;font-size:clamp(1.9rem,3.5vw,3.15rem);line-height:1.02;letter-spacing:.02em;color:#fff;max-width:20ch;padding-right:min(var(--sp-cap),clamp(20px,2.2vw,30px));border-right:3px solid var(--tw-green-500);text-shadow:0 0 34px rgba(140,198,62,.22)}
  /* green bloom behind the label so it reads as the fold's hinge, not a caption */
  .fitlabel::before{content:"";position:absolute;z-index:-1;right:-10%;top:50%;translate:0 -50%;width:150%;aspect-ratio:1.6/1;border-radius:50%;background:radial-gradient(closest-side,rgba(140,198,62,.2),transparent 72%);pointer-events:none}
  .fitlabel em{position:relative;font-style:normal;color:var(--tw-green-500)}
  /* light variant of the who-we-work-with fold */
  .fitlight .fitwarn,.fitlight .fitlabel{color:var(--tw-ink-900)}
  .fitlight .solidword{color:var(--tw-ink-900)}
  .fitlight .payoffdots{background-image:radial-gradient(rgba(20,26,36,.09) 1px,transparent 1px)}
  @media(max-width:991px){.fitcols{flex-direction:column;align-items:center;column-gap:0}.fitcols>.fitlabel{flex:0 0 auto;min-width:0}.fitcols>.fitgrid{flex:0 0 auto;width:100%;max-width:none;margin-top:20px}.fitlabel{text-align:center;max-width:none;padding-right:0;padding-left:0;border-right:0;border-left:0}}
  @media(max-width:620px){.fitclose{white-space:normal!important;max-width:52ch!important}}
  .fitwarn{font-family:var(--font-display);text-transform:uppercase;line-height:.9;letter-spacing:.01em;font-size:clamp(2.6rem,6.2vw,5rem);color:#fff;margin:0 auto;max-width:22ch}
  /* FLEX — two even tracks; the wrap step rides on the items as a margin,
     zeroed on the first line (2 items, or 1 once they go full width) */
  .fitgrid{--fit-gap:clamp(10px,1.1vw,14px);display:flex;flex-wrap:wrap;column-gap:var(--fit-gap)}
  .fitgrid>*{flex:0 0 calc((100% - var(--fit-gap)) / 2);min-width:0;margin-top:var(--fit-gap)}
  @media(min-width:720.02px){.fitgrid>:nth-child(-n+2){margin-top:0}}
  @media(max-width:720px){.fitgrid>:first-child{margin-top:0}}
  .fititem{position:relative;display:flex;align-items:center;gap:14px;padding:clamp(15px,1.7vh,19px) clamp(16px,1.5vw,20px);border-radius:var(--radius-md);background:linear-gradient(158deg,rgba(255,255,255,.07),rgba(255,255,255,.028));border:1px solid rgba(255,255,255,.12);font-size:clamp(15px,1.2vw,17px);font-weight:600;color:#fff;opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease-out),transform .45s var(--ease-out),border-color .3s var(--ease-out),background .3s var(--ease-out)}
  .fititem:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--tw-green-500) 46%,transparent);background:linear-gradient(158deg,rgba(140,198,62,.13),rgba(255,255,255,.03))}
  .reveal-in .fititem{opacity:1;transform:none}
  .reveal-in .fititem:hover{transform:translateY(-3px)}
  .fititem:nth-child(2){transition-delay:.07s}
  .fititem:nth-child(3){transition-delay:.14s}
  .fititem:nth-child(4){transition-delay:.21s}
  .fititem:nth-child(5){transition-delay:.28s}
  .fititem:nth-child(6){transition-delay:.35s}
  .fititem .fchk{width:28px;height:28px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--tw-green-500) 20%,transparent);border:1px solid color-mix(in srgb,var(--tw-green-500) 40%,transparent);color:var(--tw-green-500);transition:background .3s var(--ease-out),color .3s var(--ease-out)}
  .fititem:hover .fchk{background:var(--tw-green-500);color:var(--tw-ink-900)}
  @media(max-width:720px){.fitgrid>*{flex-basis:100%}}
  .stepviz{width:100%;height:auto;overflow:visible}
  .stepviz .bar{transform-box:fill-box;transform-origin:bottom;transform:scaleY(.04);opacity:0;transition:transform 1s var(--ease-out),opacity .5s var(--ease-out)}
  .reveal-in .stepviz .bar{transform:none;opacity:1}
  .stepviz .bar:nth-of-type(2){transition-delay:.12s}
  .stepviz .bar:nth-of-type(3){transition-delay:.24s}
  .stepviz .bar:nth-of-type(4){transition-delay:.36s}
  .stepviz .bar:nth-of-type(5){transition-delay:.48s}
  .stepviz .cap{animation:twCapGlow 3.2s var(--ease-in-out) infinite}
  .stepviz .trend{stroke-dasharray:620;stroke-dashoffset:620;transition:stroke-dashoffset 1.5s var(--ease-out) .55s}
  .reveal-in .stepviz .trend{stroke-dashoffset:0}
  .stepviz .spark{opacity:0}
  .reveal-in .stepviz .spark{animation:twSparkRun 4.4s linear 1.9s infinite}
  .stepviz .peak{transform-box:fill-box;transform-origin:center;animation:twGlowPulse 2.4s var(--ease-in-out) infinite}
  .stepviz .mote{opacity:0}
  .reveal-in .stepviz .mote{animation:twMote 4.6s var(--ease-out) infinite}
  @keyframes twCapGlow{0%,100%{opacity:.65}50%{opacity:1}}
  @keyframes twSparkRun{0%{opacity:0;offset-distance:0%}8%{opacity:1}80%{opacity:1}100%{opacity:0;offset-distance:100%}}
  @keyframes twMote{0%{opacity:0;transform:translateY(0)}18%{opacity:.85}100%{opacity:0;transform:translateY(-78px)}}
  @media(max-width:720px){.fitgrid>*{flex-basis:100%}}

  /* 25 years of proof — ascending glow nodes */
  /* FLEX — five even tracks in one row, bottom-aligned */
  .proofrow{display:flex;column-gap:clamp(14px,2vw,30px);align-items:flex-end;--step:min(var(--sp-cap),clamp(26px,3.4vw,52px))}
  .proofrow>.pstat{flex:1 1 0;min-width:0}
  .pstat{position:relative;display:flex;column-gap:14px;align-items:flex-start;margin-bottom:calc(var(--i) * var(--step))}
  /* the node's old `padding-top` rides on the dot instead, so the column is
     the same height and `.pline` still measures from the node's own top */
  .pnode{position:relative;flex:none;width:14px;display:flex;justify-content:center}
  .pnode>.pdotg{margin-top:14px}
  .pdotg{position:relative;width:9px;height:9px;border-radius:50%;background:var(--tw-green-500);opacity:0;transform:scale(.35);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out);box-shadow:0 0 0 4px rgba(140,198,62,.16),0 0 16px 5px rgba(140,198,62,.55),0 0 34px 12px rgba(140,198,62,.25)}
  .pstat.reveal-in .pdotg{opacity:1;transform:scale(1)}
  .pstat.reveal-in .pdotg::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(140,198,62,.5);animation:twGlowPulse 2.6s var(--ease-in-out) infinite}
  .pline{position:absolute;top:24px;left:50%;width:1px;height:calc(150px + var(--i) * var(--step));background:linear-gradient(rgba(140,198,62,.55),rgba(140,198,62,0));transform:scaleY(0);transform-origin:top;transition:transform 1s var(--ease-out) .18s}
  .pstat.reveal-in .pline{transform:scaleY(1)}
  .pnum{font-family:var(--font-display);font-size:clamp(1.9rem,3.4vw,2.9rem);line-height:.95;color:#fff;display:flex;align-items:baseline}
  .plabel{font-size:clamp(14px,1.15vw,17px);font-weight:600;color:#fff;line-height:1.2;margin-top:2px}
  .psub{font-size:13px;color:rgba(255,255,255,.55);margin-top:5px;line-height:1.3}
  @media(max-width:860px){
    .proofrow{--step:clamp(18px,4vw,30px)}
    .pline{height:calc(90px + var(--i) * var(--step))}
  }
  @media(max-width:990.98px){
    .proofrow{display:flex;flex-direction:column;align-items:flex-start;column-gap:0;max-width:420px;margin-left:auto;margin-right:auto}
    /* the stack step used to be `padding-bottom` on every stat but the last —
       the same distance as a `margin-top` on every stat but the first */
    .proofrow>.pstat{flex:0 0 auto}
    .pstat{margin-bottom:0;width:100%}
    .proofrow{max-width:560px}
    .pstat{flex-direction:row;align-items:flex-start;column-gap:12px;width:calc(50% + var(--i) * 12.5%);align-self:flex-start}
    .proofrow>.pstat + .pstat{margin-top:min(var(--sp-cap),clamp(24px,5vw,34px))}
    .pnode{flex:1 1 auto;min-width:24px;width:auto;height:auto;justify-content:flex-end;align-items:flex-start}
    .pnode>.pdotg{margin-top:11px}
    .pdotg{flex:none}
    .pline{top:15px;left:0;right:12px;width:auto;height:1px;background:linear-gradient(90deg,rgba(140,198,62,.65),rgba(140,198,62,.12));transform:scaleX(0);transform-origin:left center}
    .pstat.reveal-in .pline{transform:scaleX(1)}
    .pstat>div:last-child{flex:none;width:clamp(128px,36vw,180px);text-align:left}
  }

  /* footer */
  /* FLEX — source tracks minmax(150px,.62fr) minmax(0,3fr) minmax(140px,.6fr),
     in DOM order: the nav, the services block, the right-hand blocks.
     The `padding-bottom` here is BAND padding — the footer's link region
     against the divider below it, the same tier as `--fold-pad-y` — not
     content spacing, so it stays. It also cannot move onto the columns: the
     band wraps and then stacks below 1100px, where a per-column margin would
     repeat itself between the rows. */
  .flinks{display:flex;column-gap:min(var(--sp-cap),var(--col-gap));padding-bottom:min(var(--sp-cap),clamp(40px,4.6vw,64px))}
  .flinks>.fnav{flex:.62 1 0;min-width:150px}
  .flinks>.fservices{flex:3 1 0;min-width:0}
  .flinks>.fright{flex:.6 1 0;min-width:140px}
  /* link lists: the 12px `gap` becomes a `margin-top` between the items */
  .fnav ul,.fright ul,.fsgrid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
  .fnav ul>li+li,.fright ul>li+li,.fsgrid ul>li+li{margin-top:12px}
  .flinks a{color:rgba(255,255,255,.68);font-size:14.5px;line-height:1.45;transition:color .2s var(--ease-out),padding-left .22s var(--ease-out)}
  .flinks a:not([href*="tel:" i]):hover{color:var(--tw-green-500)}
  .fnav a{font-weight:500}
  /* the hairline used to hang off the heading's `padding-bottom`; it is drawn
     by an `::after` now so the heading itself carries no vertical padding */
  .fservices h4{margin:0 0 14px;font-size:17px;font-weight:600;color:#fff;letter-spacing:.01em}
  .fservices h4::after{content:"";display:block;margin-top:14px;height:1px;background:rgba(255,255,255,.18)}
  /* FLEX — `repeat(4,1fr)`. The row step is a `margin-top` on every item past
     the first line, so the container itself carries a COLUMN gap only. */
  .fsgrid{--fs-gap:clamp(18px,2vw,32px);display:flex;flex-wrap:wrap;column-gap:var(--fs-gap)}
  .fsgrid>*{flex:0 0 calc((100% - var(--fs-gap) * 3) / 4);min-width:0;margin-top:var(--fs-gap)}
  .fsgrid>:nth-child(-n+4){margin-top:0}
  .fsgrid h5,.fright h5{margin:0 0 14px;font-size:14px;font-weight:600;color:var(--tw-green-500);letter-spacing:.06em;text-transform:uppercase;line-height:1.3}
  /* FLEX — source tracks `auto 1fr auto` */
  .fmid{display:flex;align-items:center;column-gap:min(var(--sp-cap),var(--col-gap));padding:min(var(--sp-cap),clamp(30px,3.4vw,44px)) 0;border-top:1px solid rgba(255,255,255,.14)}
  .fmid>img,.fmid>.fcontact{flex:0 0 auto}
  .fmid>.fsocial{flex:1 1 0;min-width:0}
  .fsocial{display:flex;align-items:center;gap:clamp(14px,2vw,26px)}
  .social{display:flex;align-items:center;gap:clamp(10px,1.2vw,14px);flex:none}
  .frule{flex:1;height:1px;background:rgba(255,255,255,.18)}
  .fcontact{display:flex;flex-direction:column;align-items:flex-end}
  .fcontact>*+*{margin-top:12px}
  .fcname{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tw-green-500)}
  .fphone{display:inline-flex;align-items:center;gap:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-pill);padding:9px 20px 9px 11px;transition:background .22s var(--ease-out),border-color .22s var(--ease-out),transform .22s var(--ease-out)}
  .fphone:not([href*="tel:" i]):hover{background:rgba(255,255,255,.1);border-color:rgba(140,198,62,.5);transform:translateY(-1px)}
  .fphone .fpico{width:36px;height:36px;border-radius:50%;flex:none;background:var(--tw-green-500);color:var(--tw-ink-900);display:flex;align-items:center;justify-content:center}
  .fphone .fpl{display:flex;flex-direction:column;line-height:1.15}
  .fphone .fpl small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}
  .fphone .fpl b{font-size:17px;font-weight:600;color:#fff;letter-spacing:.02em}
  .faddr{display:flex;align-items:flex-start;gap:12px;padding:13px 18px;border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-md);background:rgba(255,255,255,.04);font-size:13.5px;color:rgba(255,255,255,.72);line-height:1.5;text-align:left}
  .faddr .faico{width:28px;height:28px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(140,198,62,.16);color:var(--tw-green-500)}
  .faddr small{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:3px}
  .fbar{background:rgba(0,0,0,.45);padding:18px var(--gutter);color:rgba(255,255,255,.5);font-size:13px;position:relative}
  /* FOOTER CONTAINER — the footer is site chrome, so from 1200px up it rides
     the wider `--content-chrome` measure (1720px) instead of the fold scale,
     exactly like the header bar. Two boxes, two different padding positions:
       • the main block's gutter is INSIDE its own `.wrap-wide` (inline style),
         so the box takes the token plus the two gutters;
       • the copyright bar's gutter is on `.fbar` OUTSIDE the inner wrap, so
         that one sits on the bare token.
     Both therefore render 1720px of visible content with 20px beside it.
     Desktop-only — below 1200px the footer keeps the shared fold scale. */
  @media(min-width:1200px){
    [class*="elementor-widget-twrb_footer"] footer>.wrap-wide{max-width:calc(var(--content-chrome) + var(--gutter) * 2)}
    [class*="elementor-widget-twrb_footer"] .fbar>.wrap-wide{max-width:var(--content-chrome)}
  }
  /* the right-hand blocks drop to their own full-width line; the two columns
     inside them wrap, with the row step as a `margin-top` on the second line.
     The `!important` is the one way to outrank both the inline `margin-top`
     the widget prints on later headings and the reset right below it. */
  @media(max-width:1100px){.flinks{flex-wrap:wrap}.flinks>.fnav{flex:.7 1 0;min-width:140px}.flinks>.fservices{flex:2 1 0;min-width:0}.flinks>.fright{flex:0 0 100%;min-width:0;margin-top:min(var(--sp-cap),var(--col-gap))}.fright{display:flex;flex-wrap:wrap;column-gap:24px}.fright>*{flex:0 0 calc((100% - 24px) / 2);min-width:0}.fright>*:nth-child(n+3){margin-top:24px!important}.fright h5{margin-top:0!important}}
  @media(max-width:820px){.flinks{flex-direction:column;column-gap:0}.flinks>.fnav,.flinks>.fservices,.flinks>.fright{flex:0 0 auto;width:auto;min-width:0}.flinks>.fservices,.flinks>.fright{margin-top:min(var(--sp-cap),var(--col-gap))}.fsgrid>*{flex-basis:calc((100% - var(--fs-gap)) / 2)}.fsgrid>:nth-child(-n+4){margin-top:var(--fs-gap)}.fsgrid>:nth-child(-n+2){margin-top:0}.fmid{flex-direction:column;align-items:center;text-align:center;column-gap:0}.fmid>img,.fmid>.fsocial,.fmid>.fcontact{flex:0 0 auto}.fmid>*+*{margin-top:min(var(--sp-cap),var(--col-gap))}.fcontact{align-items:center}.fsocial{width:100%}}
  @media(max-width:520px){.fsgrid>*{flex-basis:100%}.fsgrid>:nth-child(-n+2){margin-top:var(--fs-gap)}.fsgrid>:first-child{margin-top:0}.fright>*{flex-basis:100%}.fright>*:nth-child(n+2){margin-top:24px!important}}
  @media(max-width:991.98px){.fsgrid{--fs-gap:min(var(--sp-cap),26px)}.fsgrid>*{flex-basis:100%!important}.fsgrid>:nth-child(-n+4),.fsgrid>:nth-child(-n+2){margin-top:var(--fs-gap)}.fsgrid>:first-child{margin-top:0}.fsgrid ul{flex-direction:row;flex-wrap:wrap;column-gap:24px}.fsgrid ul>li{flex:0 0 calc((100% - 24px) / 2);min-width:0;margin-top:12px}.fsgrid ul>li:nth-child(-n+2){margin-top:0}}
  @media(max-width:767px){.fsgrid ul>li{flex-basis:100%}.fsgrid ul>li:nth-child(-n+2){margin-top:12px}.fsgrid ul>li:first-child{margin-top:0}}
  @media(min-width:992px) and (max-width:1199.98px){.flinks{flex-direction:column;column-gap:0}.flinks>.fnav,.flinks>.fservices,.flinks>.fright{flex:0 0 auto;width:auto;min-width:0}.flinks>.fservices,.flinks>.fright{margin-top:min(var(--sp-cap),var(--col-gap))}.fnav ul{flex-direction:row;flex-wrap:wrap;column-gap:24px}.fnav ul>li{flex:0 0 calc((100% - 72px) / 4);min-width:0;margin-top:12px}.fnav ul>li:nth-child(-n+4){margin-top:0}.fsgrid>*{flex-basis:calc((100% - var(--fs-gap) * 3) / 4)}.fright{display:flex;flex-wrap:wrap;column-gap:24px}.fright>*{flex:0 0 calc((100% - 24px) / 2);min-width:0}.fright>h5{order:1}.fright>ul{order:2}.fright>*:nth-child(n+3){margin-top:0!important}.fright h5{margin-top:0!important}.fright ul{flex-direction:row;flex-wrap:wrap;column-gap:24px;margin-bottom:0}.fright ul>li{flex:0 0 calc((100% - 24px) / 2);min-width:0;margin-top:12px}.fright ul>li:nth-child(-n+2){margin-top:0}}
  /* `grid-auto-flow:column` over two rows: every heading on the first line,
     every list on the second — which is what these two `order` values give,
     with the same zero row gap */
  @media(min-width:768px) and (max-width:991.98px){.flinks{flex-direction:column;column-gap:0}.flinks>.fnav,.flinks>.fservices,.flinks>.fright{flex:0 0 auto;width:auto;min-width:0}.flinks>.fservices,.flinks>.fright{margin-top:min(var(--sp-cap),var(--col-gap))}.fnav ul{flex-direction:row;flex-wrap:wrap;column-gap:24px}.fnav ul>li{flex:0 0 calc((100% - 48px) / 3);min-width:0;margin-top:12px}.fnav ul>li:nth-child(-n+3){margin-top:0}.fright>h5{order:1}.fright>ul{order:2}.fright>*:nth-child(n+3){margin-top:0!important}.fright ul{flex-direction:row;flex-wrap:wrap;column-gap:24px}.fright ul>li{flex:0 0 calc((100% - 24px) / 2);min-width:0;margin-top:12px}.fright ul>li:nth-child(-n+2){margin-top:0}}
  /* Mobile keeps the layout it already had — the separators between Services,
     Our Work and Media are drawn by absolutely positioned pseudo-elements that
     sit in the middle of the existing gaps. The right-hand blocks are two
     50%-wide cells per row down to 520px, so the line inside `.fright` is
     `200% + column-gap` of the heading it hangs on; below 520px the cells are
     full width and it is a plain 100%.

     SEPARATOR BREATHING ROOM (mobile). A line drawn in the middle of its gap
     gets exactly half that gap above and below it, so the gap is what sets the
     clearance: the region step was `min(--sp-cap,--col-gap)` (25px on mobile)
     and the step between the right-hand blocks was 24px, i.e. ~12px either
     side — too tight to read as a division. Both gaps become
     `--fsep-gap` (48px), which puts 24px above and below every line and clears
     the 20px minimum. The value is a token so the gap and the pseudo-element's
     own offset can never drift apart, and it is scoped to this band, so the
     tablet and desktop rhythms are untouched. `.fservices`' own step is not
     part of this — no line is drawn in it. */
  @media(max-width:767px){
    .flinks{--fsep-gap:48px}
    .flinks>.fright{position:relative;margin-top:var(--fsep-gap)}
    .flinks>.fright::before,.fright>h5:nth-of-type(n+2)::before{content:"";position:absolute;left:0;height:1px;background:rgba(255,255,255,.14);pointer-events:none}
    .flinks>.fright::before{top:calc(-.5 * var(--fsep-gap));width:100%}
    .fright>h5:nth-of-type(n+2){position:relative;margin-top:var(--fsep-gap)!important}
    .fright>h5:nth-of-type(n+2)::before{top:calc(-.5 * var(--fsep-gap));width:calc(200% + 24px)}
  }
  @media(max-width:520px){
    .fright>h5:nth-of-type(n+2)::before{width:100%}
  }
  /* iPad closes the Services block with a rule of its own. In this band the
     three regions are already stacked, and the Services columns run one per
     line with their links two-up, so the block ends a long way below its
     heading and the right-hand blocks start straight after it with nothing to
     mark the change. ONE line does that — drawn on the region, after everything
     it contains, not between its columns — so it reads as the end of Services
     rather than as another divider inside it. The mobile band above owns the
     line above `.fright` and is a different breakpoint, so the two never both
     appear.

     SEPARATOR BREATHING ROOM (iPad), matching the mobile band. The line is
     drawn in the middle of the step `.flinks > .fright` carries, so that step
     alone sets the clearance: it was `min(--sp-cap,--col-gap)` — 26px here,
     i.e. only ~13px either side. It becomes the same `--fsep-gap` token the
     mobile band uses (48px), putting 24px above and below the line and
     clearing the 20px minimum. Only the step that holds the line moves:
     `.fservices`' own step above it, and every other group and breakpoint,
     are untouched. */
  @media(min-width:768px) and (max-width:991.98px){
    .flinks{--fsep-gap:48px}
    .flinks>.fright{margin-top:var(--fsep-gap)}
    .flinks>.fservices{position:relative}
    .flinks>.fservices::after{
      content:"";position:absolute;left:0;bottom:calc(-.5 * var(--fsep-gap));
      width:100%;height:1px;background:rgba(255,255,255,.14);pointer-events:none;
    }
  }
  .foot-grid h4{font-size:var(--label-sm);letter-spacing:var(--label-tracking);text-transform:uppercase;color:var(--tw-green-500);font-weight:600;margin-bottom:18px}
  .foot-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
  .foot-grid ul>li+li{margin-top:12px}
  .foot-grid a{color:rgba(255,255,255,.72);font-size:14.5px}
  .foot-grid a:not([href*="tel:" i]):hover{color:#fff}
  .social a{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .22s,border-color .22s,transform .22s}
  .social a:not([href*="tel:" i]):hover{background:var(--tw-green-500);border-color:var(--tw-green-500);color:var(--tw-ink-900);transform:translateY(-2px)}

  .clientstrip img{max-height:44px;max-width:130px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.5;transition:filter .32s var(--ease-out),opacity .32s var(--ease-out)}
  .clientstrip img:hover{filter:none;opacity:1}

  @media(max-width:960px){
    .sys-grid{flex-direction:column;align-items:stretch;column-gap:0}
    .sys-grid>*{flex:0 0 auto;width:100%}
    .sys-grid>*+*{margin-top:min(var(--sp-cap),var(--col-gap))}
    .sys-sticky{position:relative;top:0}
    .connect-grid{flex-direction:column;align-items:stretch;column-gap:0;text-align:center}
    .connect-grid>*,.connect-grid>:nth-child(2){flex:0 0 auto;width:100%}
    .connect-grid>*+*{margin-top:min(var(--sp-cap),var(--col-gap))}
    .connect-grid .cchip{justify-content:center}
  }
  @media(max-width:1024px){
    .hero-grid{flex-direction:column!important;align-items:stretch!important;column-gap:0!important;text-align:center}
    .hero-grid>*{flex:0 0 auto!important;width:100%}
    .hero-grid>*+*{margin-top:min(var(--sp-cap),36px)}
    .hero-visual{order:2;max-width:400px}
    .hero-grid .tw-eyebrow,.hero-grid .btn{justify-content:center}
    .hero-grid [data-reveal]{margin-left:auto;margin-right:auto}
  }
  /* the people head row's two columns, side by side down to 1199px */
  .pplhead{--pph-gap:clamp(20px,2.6vw,40px);display:flex;flex-wrap:wrap;align-items:flex-end;column-gap:var(--pph-gap);margin-bottom:min(var(--sp-cap),clamp(34px,4vw,50px))}
  .pplhead[data-swap="yes"]{flex-direction:row-reverse}
  /* `min-width:0` makes the two columns squeeze like the source's grid tracks
     did instead of wrapping onto a second line at awkward widths */
  .pplhead > div{flex:0 1 var(--pph1,auto);min-width:0}   /* source track: auto */
  .pplhead > p{flex:1 1 var(--pph2,0);min-width:0}        /* source track: 1fr  */
  /* below 1199px the head row drops the two-column layout entirely: one
     full-width column, each part spanning the whole wrapper. Stacked, the
     desktop gap/margin read as dead space, so both are tightened: the gap
     between the title block and the lead, and the space under the whole row
     before the collage. */
  @media(max-width:1199px){
    /* stacked: the step between the two parts is the flex row-gap, so it
       holds in either (possibly reversed) column order. A margin on the <p>
       was zeroed by the shared `.elementor-widget-container p{margin:0}`
       isolation reset, leaving the lead flush against the heading. */
    .pplhead{--pph-gap:clamp(16px,2.4vw,24px);flex-direction:column;align-items:stretch;row-gap:var(--pph-gap);margin-bottom:clamp(16px,2vw,22px)}
    .pplhead[data-swap="yes"]{flex-direction:column-reverse}
    .pplhead > div,.pplhead > p{flex:0 0 auto;width:100%}
    .pplhead > div,.pplhead > p{margin-top:0}
    .pplhead > div > :last-child{max-width:none!important}
    .pplhead > p{max-width:none!important}
  }
  /* collage below 991px: one stacked column, in DOM order —
       row 1  c1        full width
       row 2  c2        full width, on its own row
       row 3  cg-pair   c4 | c5 side by side, keeping the source 60/40 split
       row 4  c3        full width
     The wrapping COLUMN container becomes a wrapping ROW container, so every
     cell (and the pair wrapper) takes a whole flex line. `flex-basis` is the
     HORIZONTAL size again here, which is why the row spans are replaced by
     explicit heights. Nothing in this block applies at 991px and above. */
  @media(max-width:990.98px){
    .collage{flex-flow:row wrap;align-content:flex-start;height:auto}
    .collage[data-swap="yes"]{flex-wrap:wrap} /* one column — no order to mirror */
    /* every direct child is one full-width row — the generic rule also covers
       any extra figure the repeater holds beyond the five source cells */
    .collage > figure,.collage > .cg-pair{flex-basis:100%;width:100%;order:0}
    .collage > figure{height:clamp(190px,34vw,340px)}
    .collage .c2,.collage .c3{flex-basis:100%;width:100%}
    .collage .c1{flex-basis:100%;width:100%;height:clamp(230px,44vw,430px)}
    /* the pair keeps its own two-column row; its children keep the 60/40
       widths declared above and stretch to the row's height */
    .collage .cg-pair{display:flex;flex-direction:row;flex-basis:100%;width:100%;height:clamp(160px,28vw,280px)}
    .collage .cg-pair .c4,.collage .cg-pair .c5{flex-basis:auto}
  }
  @media(max-width:860px){
    .ccap{opacity:1;transform:none}
    .collage figure::after{opacity:1}
  }
  @media(max-width:720px){
    .stats-row>*{flex-basis:calc((100% - var(--stats-gap,0px)) / 2)!important}
    .foot-grid>*{flex-basis:calc((100% - var(--foot-gap,0px)) / 2)}
  }
  @media(max-height:760px){
    .engine-visual{height:clamp(170px,26vh,210px);min-height:170px}
    .eng-title{font-size:clamp(1.9rem,min(4.6vw,6vh),2.7rem);margin-bottom:8px}
    .eng-step{font-size:.95rem;margin-bottom:6px}
    .eng-head{font-size:.98rem;margin-bottom:8px}
    .eng-desc{display:none}
    .eng-pts>li+li{margin-top:7px}
    .eng-pts li{font-size:13px}
    .eng-pts .pdot{width:20px;height:20px}
    .engine-hint{display:none}
  }

  @media(max-height:620px){
    .eng-head{display:none}
    .eng-title{font-size:clamp(1.5rem,4vh,1.9rem);margin-bottom:6px}
    .eng-step{font-size:.82rem;margin-bottom:4px}
    .engine-visual{display:none}
    /* FLEX. `!important` is carried over from the track declaration this
       replaces: the reverted-hero block further down restates `.engine-grid`
       at the same specificity, and the short-viewport layout has to win.
       The visual is hidden here, so the stacked step is cancelled — a
       `display:none` grid item never generated a gap either. */
    .engine-grid{flex-direction:column!important;align-items:stretch!important;justify-content:center;column-gap:0;padding-top:8px;padding-bottom:8px}
    .engine-grid>.engine-visual,.engine-grid>.engine-copy{flex:0 0 auto!important;width:100%}
    .engine-grid>.engine-copy{margin-top:0!important}
    .eng-pts>li+li{margin-top:6px}
    .eng-pts li{font-size:12.5px}
    .eng-pts .pdot{width:18px;height:18px}
  }

  @media(prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important}
    [data-reveal]{opacity:1!important;transform:none!important}
    html{scroll-behavior:auto}
  }

/* ==== reverted growth-engine hero (from Growth Engine Hero.dc.html) ==== */
  /* ── 01 The engine: four arcs, live energy, hover reveals each stage ──
     Animation and hover live on DIFFERENT elements: the entrance keyframe runs on
     .dquad (fill:both, so its final transform stays there), while hover only ever
     transitions .dwedge. Nothing toggles animation:none mid-flight. */
  @keyframes twDormHalo{0%,100%{opacity:.28;transform:scale(.96)}50%{opacity:.6;transform:scale(1.05)}}
  @keyframes twDormGlyph{0%,100%{opacity:.82}50%{opacity:1}}
  @keyframes twDormBloom{0%,100%{opacity:.1}50%{opacity:.26}}
  @keyframes twDormDrift{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}
  @keyframes twDormSpin{to{transform:rotate(360deg)}}
  @keyframes twDormOrbit{to{offset-distance:100%}}
  @keyframes twDormFeed{0%{offset-distance:0%;opacity:0}20%{opacity:1}74%{opacity:1}100%{offset-distance:100%;opacity:0}}
  @keyframes twDormQuadIn{0%{opacity:0;transform:scale(.74) rotate(-8deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
  @keyframes twDormCoreIn{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:scale(1)}}

  .dorm{position:relative;width:100%;height:100%;display:flex;align-items:flex-end;justify-content:center;perspective:1500px}
  .dormtilt{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center;transform-style:preserve-3d;transition:transform .6s var(--ease-out);will-change:transform}
  .dormsvg{overflow:visible;height:100%;width:auto;max-width:100%}

  .dquad{cursor:pointer;transform-box:view-box;transform-origin:300px 300px;animation:twDormQuadIn .95s var(--ease-out) both}
  .dwedge{transform-box:view-box;transform-origin:300px 300px;transition:transform .5s var(--ease-out),opacity .34s var(--ease-out);will-change:transform}
  .dquad:hover .dwedge{transform:translate(var(--tx),var(--ty)) scale(1.04)}
  .dorm:has(.dquad:hover) .dquad:not(:hover) .dwedge{opacity:.24}
  .dbloom{transform-box:view-box;transform-origin:300px 300px;animation:twDormBloom 6s var(--ease-in-out) infinite;transition:opacity .4s var(--ease-out),transform .55s var(--ease-out);pointer-events:none}
  .dquad:hover .dbloom{opacity:.5;transform:scale(1.1)}
  .dconn{stroke-dasharray:300;stroke-dashoffset:300;opacity:0;transition:stroke-dashoffset .6s var(--ease-out),opacity .3s var(--ease-out)}
  .dcoretint,.dcorering{opacity:0;pointer-events:none;transition:opacity .38s var(--ease-out)}
  .dorm:has(.q0:hover) .dcoretint.t0,.dorm:has(.q1:hover) .dcoretint.t1,.dorm:has(.q2:hover) .dcoretint.t2,.dorm:has(.q3:hover) .dcoretint.t3{opacity:.26}
  .dorm:has(.q0:hover) .dcorering.t0,.dorm:has(.q1:hover) .dcorering.t1,.dorm:has(.q2:hover) .dcorering.t2,.dorm:has(.q3:hover) .dcorering.t3{opacity:.85}
  .dquad:hover .dconn{stroke-dashoffset:0;opacity:.85}
  .dorm:has(.dquad:hover) .dfeed{opacity:0}
  .dfeed{transition:opacity .3s var(--ease-out)}

  .dcore-lbl{opacity:0;transition:opacity .3s var(--ease-out)}
  .dcore-default{opacity:1}
  .dorm:has(.dquad:hover) .dcore-default{opacity:0}
  .dorm:has(.q0:hover) .dcore-0,.dorm:has(.q1:hover) .dcore-1,.dorm:has(.q2:hover) .dcore-2,.dorm:has(.q3:hover) .dcore-3{opacity:1}

  .dcal{position:absolute;width:min(34%,236px);opacity:0;transform:translateY(10px);transition:opacity .34s var(--ease-out),transform .34s var(--ease-out);pointer-events:none;z-index:3}
  .dcal b{display:block;font-size:clamp(12px,2.1cqh,15px);font-weight:700;color:#fff;line-height:1.25;margin-bottom:6px}
  .dcal span{display:block;font-size:clamp(10.5px,1.8cqh,13px);color:rgba(255,255,255,.66);line-height:1.5}
  .dcal i{display:block;width:26px;height:2px;border-radius:2px;margin-bottom:9px;background:var(--dc,var(--tw-green-500))}
  .dcal-tl{left:0;top:9%;text-align:left}
  .dcal-tr{right:0;top:9%;text-align:left}
  .dcal-br{right:0;bottom:9%;text-align:left}
  .dcal-bl{left:0;bottom:9%;text-align:left}
  .dcal b{margin-bottom:7px}
  .dcal>*{position:relative;z-index:1}
  .dorm:has(.q0:hover) .dcal-tl,.dorm:has(.q1:hover) .dcal-tr,.dorm:has(.q2:hover) .dcal-br,.dorm:has(.q3:hover) .dcal-bl{opacity:1;transform:translateY(0)}
  @media(max-width:900px){.dcal{display:none}}
  @keyframes twOrbit{to{offset-distance:100%}}

  /* ── scroll-driven engine ── */
  .engine-scroll{position:relative;background:#E9F4FF}
  .engine-pin{position:relative;min-height:100vh;overflow:hidden;display:flex;flex-direction:column;background:#E9F4FF}
  .eng-glow{position:absolute;border-radius:50%;pointer-events:none;z-index:0;transform:translateZ(0);will-change:transform}
  .engine-visual{transition:opacity .4s var(--ease-out)}
  /* FLEX. The two percentage tracks become two fixed-basis flex items, and a
     single centred row of `max-content` rows is exactly `align-items:center`
     on one flex line. `--he-c1w`/`--he-c2w` are the unitless twins the widget
     prints beside the `fr` pair (column_weight_css() in
     includes/class-base-widget.php); they always sum to 2, so `flex:<w> 1 0`
     distributes exactly like the two `fr` tracks did. `.finale` keeps
     `display:block` from its own higher-specificity rule further up. */
  .engine-grid{position:relative;z-index:4;flex:1;display:flex;align-items:center;column-gap:min(var(--sp-cap),var(--col-gap));padding:min(var(--sp-cap),clamp(18px,4vh,52px)) var(--gutter) min(var(--sp-cap),clamp(40px,7vh,80px));min-height:0}
  .engine-grid>.engine-visual{flex:var(--he-c1w,1.08) 1 0;min-width:0;transition:flex-grow .55s var(--ease-out)}
  .engine-grid>.engine-copy{flex:var(--he-c2w,.92) 1 0;min-width:0;transition:flex-grow .55s var(--ease-out)}
  /* The hero grid keeps `max-width:var(--container-max)` from the rule further
     up, but this block moved its gutter INSIDE the box (the `var(--gutter)`
     side padding above). On the desktop bands the box therefore takes the two
     gutters on top of the token, so the two columns still measure the full
     1140px / 1520px with the 20px beside them — same column ratio, same gap,
     just the container. Nothing below 1200px is touched. */
  @media(min-width:1200px){
    .engine-grid{max-width:calc(var(--container-max) + var(--gutter) * 2)}
  }
  .engine-visual{position:relative;height:min(70vh,660px)}
  .engine-copy{position:relative;height:auto}
  /* one stage only now — nothing left to cross-fade */
  .engine-visual .estage,.engine-copy .ecopy{position:relative;inset:auto;opacity:1;visibility:visible;transform:none}
  .engine-visual .estage{height:100%}
  .engine-visual{overflow:hidden}
  /* every `.ecopy` used to sit in the same cell (1/1). In flow that is a
     full-width item with an equal negative end margin, so the layers stay
     stacked and the column still grows to the TALLEST of them. */
  .engine-copy{display:flex;align-items:stretch}
  .engine-copy>.ecopy{flex:0 0 100%;min-width:0;margin-inline-end:-100%}
  .estage{position:absolute;inset:0;container-type:size;display:flex;align-items:center;justify-content:center;will-change:opacity,transform;backface-visibility:hidden;contain:layout paint}
  .estage>svg,.estage .tw-engine{width:auto;max-width:100%;height:100%;max-height:100%;margin:0 auto;overflow:visible}
  .estage .hero-visual,.estage #tw-hero-engine{height:100%;max-height:100%;max-width:none;display:flex;align-items:center;justify-content:center}
  .ecopy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;will-change:opacity,transform;backface-visibility:hidden;contain:layout paint}
  .eng-step{font-family:var(--font-display);font-size:1.3rem;color:var(--tw-green-500);letter-spacing:.1em;margin-bottom:14px}
  .heroh1{font-size:clamp(2.6rem,min(6.1vw,7.9vh),5.3rem)}
  @media(max-height:760px){.heroh1{font-size:clamp(2.25rem,min(5.2vw,7vh),4rem)}}
  @media(max-height:620px){.heroh1{font-size:clamp(2rem,min(4.5vw,6.3vh),3.3rem)}}
  .eng-title{font-family:var(--font-display);text-transform:uppercase;line-height:.9;font-size:clamp(2.6rem,min(6.1vw,7.9vh),5.3rem);color:#fff;margin-bottom:16px}
  .eng-head{font-size:clamp(1.25rem,1.95vw,1.75rem);font-weight:600;color:#fff;line-height:1.3;margin-bottom:16px;max-width:30ch}
  .eng-desc{font-size:var(--body-md);color:rgba(255,255,255,.66);line-height:1.6;max-width:56ch;margin-bottom:24px}
  .eng-pts{list-style:none;margin:0 0 4px;padding:0;display:flex;flex-direction:column}
  .eng-pts>li+li{margin-top:13px}
  .eng-pts li{display:flex;align-items:center;gap:13px;font-size:15px;color:rgba(255,255,255,.88);font-weight:500}
  .eng-pts .pdot{width:24px;height:24px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(140,198,62,.18)}
  /* channel chips (stage 3) */
  .chchip{position:absolute;display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:var(--radius-pill);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#fff;font-size:13px;font-weight:600;backdrop-filter:blur(4px);white-space:nowrap;animation:twFloat 6s var(--ease-in-out) infinite}
  .chchip .cdot{width:8px;height:8px;border-radius:50%;flex:none}
  /* metric tiles (stage 4) */
  .mtile{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);padding:16px 18px}
  .mtile .mv{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);color:#fff;line-height:1}
  .mtile .ml{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:8px;font-weight:600}
  .finlbl{position:absolute;display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:var(--radius-pill);font-size:13px;font-weight:600;white-space:nowrap;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff}
  .finlbl .fdot{width:8px;height:8px;border-radius:50%;flex:none}
  @media(max-width:960px){
    /* FLEX. One track === a column stack; `align-content:center` on a single
       column === `justify-content:center`. The 18px the grid held as a `gap`
       is now a `margin-top` on the lower half, so nothing carries a vertical
       gap. `order` still puts the visual first. */
    .engine-grid{flex-direction:column;align-items:stretch;justify-content:center;column-gap:0;padding-top:0}
    .engine-grid>.engine-visual,.engine-grid>.engine-copy{flex:0 0 auto;width:100%}
    .engine-grid>.engine-copy{margin-top:18px}
    .engine-visual{height:min(30vh,300px);order:1}
    .engine-copy{height:auto;min-height:0;order:2}
    .ecopy{position:relative;inset:auto}
    .eng-title{font-size:clamp(1.9rem,6vw,2.6rem);margin-bottom:10px}
    .eng-step{font-size:1.05rem;margin-bottom:8px}
    .eng-head{font-size:1.05rem;margin-bottom:10px}
    .eng-desc{font-size:14px;margin-bottom:14px}
    .eng-pts>li+li{margin-top:9px}
    .eng-desc{margin-bottom:18px}
    .eng-pts li{font-size:14px}
  }

  /* ── hero growth tree: four branches out of the Growth Engine core ── */
  .wring{overflow:visible}
  .wpanel line{transition:stroke .5s var(--ease-out)}
  @keyframes twRailFlow{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
  @keyframes twSpin{to{transform:rotate(360deg)}}
  @keyframes twRadar{0%,100%{opacity:.55}50%{opacity:.85}}
  .wpulse{stroke-dasharray:2.5 97.5;opacity:.55;animation:twRailFlow 5.4s linear infinite;pointer-events:none}
  .wseg.on .wpulse{opacity:.95}
  .wnodeglow{transition:opacity .5s var(--ease-out)}
  .wseg.on .wnodeglow{opacity:.34}
  .wnodearc{opacity:0;transition:opacity .4s var(--ease-out);animation:twSpin 16s linear infinite}
  .wseg.on .wnodearc,.wseg:hover .wnodearc{opacity:.6}
  .wradar{animation:twRadar 7s var(--ease-in-out) infinite}
  .wbeamflow{stroke-dasharray:16 84;animation:twRailFlow 1.5s linear infinite}
  @keyframes twEnergyPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}
  .wtoporb{animation:twEnergyPulse 3.8s var(--ease-in-out) infinite;transform-box:fill-box;transform-origin:center}
  @media(prefers-reduced-motion:reduce){.wtoporb{animation:none}}
  @media(prefers-reduced-motion:reduce){.wbeamflow{animation:none;opacity:0}}
  .whubring{animation:twSpin 22s linear infinite;transition:stroke .5s var(--ease-out)}
  .whalo{animation:twDormHalo 6s var(--ease-in-out) infinite}
  .wticks{transform-box:fill-box;transform-origin:center;animation:twSpin 70s linear infinite reverse}
  @keyframes twDotPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.22)}}
  .wmarkdot{animation:twDotPulse 2.4s var(--ease-in-out) infinite}
  @media(prefers-reduced-motion:reduce){.whalo,.wticks,.wmarkdot{animation:none}.worbitdot animateTransform{display:none}}
  .wseg{cursor:pointer}
  .wrailbase{transition:opacity .45s var(--ease-out)}
  .wseg.on .wrailbase{opacity:.4}
  .wconn{stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:stroke-dashoffset .9s var(--ease-out),opacity .3s var(--ease-out);pointer-events:none}
  .wseg.on .wconn{stroke-dashoffset:0;opacity:1}
  .wsegfill{transition:opacity .45s var(--ease-out)}
  .wnode{filter:drop-shadow(0 10px 24px rgba(4,10,28,.45))}
  .wdot{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.72);transition:opacity .4s var(--ease-out),transform .6s var(--ease-out);pointer-events:none}
  .wseg.on .wdot{opacity:.55;transform:scale(1)}
  .wdome{filter:drop-shadow(0 -14px 40px rgba(6,14,34,.5))}
  .wplay{cursor:pointer}
  .wplay circle{transition:transform .3s var(--ease-out),fill .3s var(--ease-out);transform-box:fill-box;transform-origin:center}
  .wplay:hover circle{transform:scale(1.1);fill:rgba(255,255,255,.22)}
  .wpi{transition:opacity .22s var(--ease-out)}
  .wpi-pause{opacity:0}
  .dorm[data-playing="1"] .wpi-pause{opacity:1}
  .dorm[data-playing="1"] .wpi-play{opacity:0}
  .wcalg{opacity:0;transform:translateY(6px);transition:opacity .42s var(--ease-out),transform .42s var(--ease-out);pointer-events:none}
  .dorm[data-active="0"] .wcalg-0,.dorm[data-active="1"] .wcalg-1,.dorm[data-active="2"] .wcalg-2,.dorm[data-active="3"] .wcalg-3{opacity:1;transform:none}
  @media(max-width:900px){.wcalg{display:none}}
  @media(prefers-reduced-motion:reduce){.wsegfill,.wconn,.wdot,.wcalg,.wnode,.wicon{transition:none}.wpulse,.wnodearc,.wradar{animation:none}.wpulse{opacity:0}}

  .engine-visual{overflow:visible}
  .engine-visual .estage{contain:layout;overflow:visible}
  @media(max-width:960px){.engine-visual{overflow:hidden}}
  .bannervid{width:118%;height:118%;max-width:none;object-fit:contain;display:block;margin:clamp(-47px,calc(4vh - 71px),-13px) -9% 0;mix-blend-mode:multiply}
  .engine-visual{overflow:visible}
  @media(max-width:960px){.bannervid{object-fit:cover}}
.estage,.ecopy{opacity:1!important;transform:none!important;visibility:visible!important}

/* ============================================================
   THEME ISOLATION (required)
   Per-section widgets lose the source page's single outer
   wrapper, so anything that relied on *inherited* font/colour
   would fall back to the active theme. Scope the reset to this
   plugin's widgets via Elementor's auto class so nothing leaks.
   `!important` sits on the CONTAINER only — it governs
   inheritance, never the sections' own colours.
   ============================================================ */
[class*="elementor-widget-twrb_"] > .elementor-widget-container{
  /* `font-family` is NOT here — it is declared in the E-COMMERCE FAMILY &
     COLOUR EXEMPTION just below, which carries the `twrb_ec` guard. */
  /* the project's base body size — every paragraph, list, label and piece of
     small text that does not set its own size inherits it from here, so the
     breakpoint ladder in `--body-base` reaches all of them at once (see the
     GLOBAL TYPE & BUTTON SCALE block near the end of this file). Without it
     the theme's own body size leaked in through inheritance. */
  font-size:var(--body-base)!important;
  line-height:1.5;
  margin:0;
  padding:0;
}
/* Elementor's "Optimized Markup" experiment drops `.elementor-widget-container`
   altogether, and the inheritance root above goes with it — every element that
   sets none of its own font or colour then falls back to the theme again. Re-
   state the INHERITED properties (only those: margin, padding and
   line-height stay off the wrapper, which is what Elementor's Advanced tab
   writes to) on the widget element itself, so the isolation holds either way —
   the size here, the family and the colour in the exemption below, which
   carries the same two arms. With the normal markup the rules above restate
   the same values one level down at a higher specificity, so nothing changes
   there. The FONT
   WEIGHT LOCK and the REFERENCE TYPE & COLOUR LOCK at the end of this file
   carry the same two-arm scope for the same reason. The non-inherited resets
   below (box-sizing, the `margin:0` on headings/prose, the link
   text-decoration) still key off `.elementor-widget-container` only — they are
   unchanged by this pass. */
[class*="elementor-widget-twrb_"]{
  /* `font-family` is NOT here either — see the exemption below. */
  font-size:var(--body-base)!important;
}

/* ------------------------------------------------------------
   E-COMMERCE FAMILY & COLOUR EXEMPTION

   The inherited `color` AND `font-family` the two rules above set
   are split out here so the e-commerce landing-page family —
   `twrb_ec_*` — can be left out of both. That family is the same
   case as the header-builder widget: it ships a complete,
   self-contained stylesheet (`techwyse-ecom.css`) carrying its own
   palette and its own type ramp (Archivo + IBM Plex Mono, both
   bundled), and emits no inline `style` attributes at all, so
   every colour and family it states is a plain declaration at one
   or two classes.

   `font-family` joined the exemption because the rules above and
   `techwyse-ecom.css`'s own inheritance root are both
   `!important` at (0,2,0): which face the landing page inherited
   came down to which stylesheet WordPress happened to print last.
   With the guard the question does not arise — the reference's
   `--ec-font` is the only declaration that matches.

   With the exemption missing, any page that also carried one of
   this plugin's other widgets (a Theme-Builder header or footer is
   enough) loaded this file beside the landing page's own, and the
   REFERENCE TYPE & COLOUR LOCK at the end of this file then
   flattened the whole palette: its bare-`a` rule painted every
   e-commerce link `--tw-cobalt-700` (#1B3E93) and its bare-element
   rule forced every heading, paragraph and span to
   `color:inherit!important`, erasing the landing page's own
   values. The visible symptom was the hero's service pillars —
   white over the photo in the reference — reading blue, because
   their labels sit inside the pillar's `<a>` and inherited its
   cobalt.

   The same zero-specificity guard rides the three colour
   declarations in that lock. It costs the rest of the cascade
   nothing, and nothing outside the `twrb_ec` family changes:
   every other widget keeps the identical declaration at the
   identical rank and source position.
   ------------------------------------------------------------ */
[class*="elementor-widget-twrb_"] > .elementor-widget-container:where(:not([class*="twrb_ec"] *)){
  font-family:var(--font-body)!important;
  color:var(--text-body)!important;
}
[class*="elementor-widget-twrb_"]:where(:not([class*="twrb_ec"])){
  font-family:var(--font-body)!important;
  color:var(--text-body)!important;
}

[class*="elementor-widget-twrb_"] .elementor-widget-container *{ box-sizing:border-box; }
[class*="elementor-widget-twrb_"] .elementor-widget-container :is(h1,h2,h3,h4,h5,h6,p,figure,blockquote,ul,ol){ margin:0; }
[class*="elementor-widget-twrb_"] .elementor-widget-container a{ text-decoration:none; }
[class*="elementor-widget-twrb_"] .elementor-widget-container button,
[class*="elementor-widget-twrb_"] .elementor-widget-container input,
[class*="elementor-widget-twrb_"] .elementor-widget-container textarea,
[class*="elementor-widget-twrb_"] .elementor-widget-container select{ font-family:inherit; }

/* TW People Collage — neutralize any Advanced-tab margin/padding an editor may
   have set on the widget instance itself, which would otherwise sit between
   the collage and the footer as extra blank space the widget's own markup
   can't account for. Elementor's Advanced-tab margin/padding selectors target
   {{WRAPPER}} (the outer .elementor-element, not the inner container), so both
   levels need resetting — the inner-only rule alone never touched the actual
   element Elementor writes the margin/padding onto. */
[class*="elementor-widget-twrb_people"]{ margin:0!important; padding:0!important; }
[class*="elementor-widget-twrb_people"] > .elementor-widget-container{ margin:0!important; padding:0!important; }

/* TW People Collage — measure.
   This fold used to opt out of the shared tiers with its own 1460px floor.
   The container system is now the single source of truth for every section's
   width (see the CONTAINER SYSTEM table near the top of this file), so the
   fold reads `--content-wide` straight — 1140px from 1200px up, 1520px from
   1600px up — like every other widget. The rule is kept (rather than deleted)
   so the collage still resolves the token on `.fold > .wrap-wide` even where
   a stray theme rule would otherwise reach it first. Layout inside the fold
   is unchanged: only the measure moves. */
[class*="elementor-widget-twrb_people"] .fold > .wrap-wide{ max-width:var(--content-wide); }

/* Section rhythm: this fold uses the SAME default top/bottom spacing as every
   other section — the shared `--fold-pad-y` tiers at :root (30px ≤767px,
   40px, and the reference's own `clamp(5rem,10vw,10rem)` from 1600px up). No
   widget-scoped override here, so the fold inherits that scale exactly like
   the rest of the page. */

/* the fold's optional CTA — source `.btn`, so the BUTTON LOCK at the end of
   this file governs its size, colours and hover exactly as it does every
   other button in the plugin */
[class*="elementor-widget-twrb_people"] .ppl-cta{ margin-top:min(var(--sp-cap),clamp(24px,3vw,36px)); }

/* CRITICAL — many themes ship img,svg{height:auto!important;max-width:100%!important},
   which overrides even inline styles and collapses every fixed-size image/icon.
   Re-assert the exact sizing this markup uses (inline style, or the component's
   own class), with !important, for every image/svg in the project — not just
   the ones an inline style happens to catch. */
[class*="elementor-widget-twrb_"] .elementor-widget-container img[style*="height:100%"]{ height:100%!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container img[style*="object-fit:cover"]{ object-fit:cover!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container img[style*="object-fit:contain"]{ object-fit:contain!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container img[style*="width:auto"]{ max-width:none; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .igp-img img,
[class*="elementor-widget-twrb_"] .elementor-widget-container .collage figure img{ height:100%!important; width:100%!important; object-fit:cover!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .bannervid{ height:118%!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .logomq img{ height:clamp(38px,3.6vw,54px)!important; width:auto!important; max-width:none!important; object-fit:contain!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .clientstrip img{ height:auto!important; max-height:44px!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .fnp img{ height:64%!important; width:64%!important; object-fit:contain!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .tmava.pic img{ height:100%!important; width:100%!important; object-fit:contain!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .tmava.pic.photo img{ object-fit:cover!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .widget-card .card-media img{ height:100%!important; width:100%!important; object-fit:var(--card-media-fit,cover)!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .twrb-combined .cc-media img{ height:auto!important; width:100%!important; object-fit:var(--card-media-fit,cover)!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .dormsvg{ height:100%!important; width:auto!important; max-width:100%!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .anode svg{ width:20px!important; height:20px!important; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .ntbridge svg{ width:100%!important; height:56px!important; }

/* The margin reset above outranks the source's own class rules on bare
   elements (`.acard p{margin-top:12px}` etc). Re-assert exactly those
   source values at the isolation block's specificity — no new styling, just
   the original numbers restored. */
[class*="elementor-widget-twrb_"] .elementor-widget-container .ntlead{ margin-bottom:16px; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .fitwarn{ margin:0 auto; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .ecard h1{ margin:clamp(12px,1.6vh,20px) auto 0; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .acard p{ margin-top:12px; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .fnpanel h3{ margin:12px 0 min(var(--sp-cap),26px); }
[class*="elementor-widget-twrb_"] .elementor-widget-container .tmcard p{ margin:18px 0 0; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .fservices h4{ margin:0 0 14px; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .fsgrid h5,
[class*="elementor-widget-twrb_"] .elementor-widget-container .fright h5{ margin:0 0 14px; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .foot-grid h4{ margin-bottom:18px; }
/* TW Trust Problem — `.dcy-verdict` is a `<p>`, so the margin reset above
   ((0,2,1)) was flattening its heading -> content step to zero and the Verdict
   sat hard against the Headline on the front end while the editor preview (and
   the standalone reference) still showed the gap. Re-assert it at the reset's
   specificity, using the standard `--hc-gap` token. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-head + .dcy-verdict{ margin-top:var(--hc-gap); }

/* Elementor wraps every widget in extra divs; the source folds are full-bleed. */
[class*="elementor-widget-twrb_"] > .elementor-widget-container > section,
[class*="elementor-widget-twrb_"] > .elementor-widget-container > header,
[class*="elementor-widget-twrb_"] > .elementor-widget-container > footer{ width:100%; }

/* TW Growth Engine Funnel — the funnel paints outside its own box on purpose
   (the ground shadow under the cone, the active segment's drop-shadow glow and
   the mouth's ring pulse all reach past the SVG). Elementor's own wrappers sit
   between that section and the page, so a clip on either of them puts the
   hard-edged rectangle straight back. Keep both transparent to overflow; the
   widget's decorative blobs are clipped by their own layer, not by these. */
[class*="elementor-widget-twrb_funnel"],
[class*="elementor-widget-twrb_funnel"] > .elementor-widget-container{ overflow:visible; }

/* Service-link hover lock — the reference hovers a service link to WHITE, with
   only its number and arrow picking up the stage colour. Themes routinely ship
   a green `a:hover` at a specificity a component class cannot reach
   (`.entry-content a:hover`, `.elementor-kit-N a:hover`, …), which is what was
   turning the whole row green on the front end. Re-state the reference values
   at the isolation block's specificity so nothing outside can reach them. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink{ color:rgba(255,255,255,.8)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):hover,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):focus-visible{ color:#fff!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink .fni{ color:rgba(255,255,255,.32)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):hover .fni,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):focus-visible .fni{ color:var(--fc,#8CC63E)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink u{ color:rgba(255,255,255,.5)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):hover u,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):focus-visible u{ color:#0A0D12!important; background:var(--fc,#8CC63E)!important; border-color:var(--fc,#8CC63E)!important; }

/* WYSIWYG fidelity: the reset above zeroes p-margins so a single-paragraph
   editor value is pixel-identical to the source. Restore spacing only where
   the editor actually produced multiple blocks — at the content -> content
   step from the CONTENT SPACING SYSTEM scale, not a font-relative guess. */
[class*="elementor-widget-twrb_"] .elementor-widget-container .twrb-rich :is(p,ul,ol) + :is(p,ul,ol){ margin-top:var(--c-gap); }
[class*="elementor-widget-twrb_"] .elementor-widget-container .twrb-rich :is(ul,ol){ padding-left:1.25em; }
[class*="elementor-widget-twrb_"] .elementor-widget-container .twrb-rich li + li{ margin-top:.35em; }

/* ============================================================
   RESPONSIVE FIXES
   ============================================================ */

/* below 1200px: headings AND content run full width — the design's
   per-element max-width (the ch-based line lengths, and the few px ones) is a
   desktop-only reading-measure constraint, so nothing breaks a line earlier
   than the viewport forces it to.

   One band, one rule: this used to be two (paragraphs below 992px, headings
   768–1199.98px), which left the 992–1199.98px paragraphs on their desktop
   measure. The selector covers the display/heading classes as well, since a
   title is not always an h1-h6 tag (the Heading and Combined Content widgets
   let the editor pick the tag), and the prose wrappers, which carry whatever
   measure the WYSIWYG value was authored against.

   `!important` is required: most of these measures are printed by the widgets
   as an inline `style` on the element itself (`max-width:14ch`, `42ch`, …),
   which no plain stylesheet rule can outrank. */
@media(max-width:1199.98px){
  [class*="elementor-widget-twrb_"] .elementor-widget-container :is(h1,h2,h3,h4,h5,h6,p,.tw-display,.widget-heading,.widget-content,.twrb-rich){ max-width:none!important; }
}

/* below 1199px — TW Not Your Typical Agency: the answer box's items sit
   closer together. The project's defaults add padding-top between a
   paragraph and a heading (in either order) inside `.ntanswer`; those
   overrides are removed so only the items' own margins space them. The
   box's own padding is deliberately untouched. */
@media(max-width:1199.98px){
  [class*="elementor-widget-twrb_"] .elementor-widget-container .ntanswer :is(p,h1,h2,h3,h4,h5,h6,ul,ol){ padding-top:0!important; }
}

/* mobile only — TW Not Your Typical Agency: the content tags inside the
   answer box run flush to the box's inner edge (no per-tag padding-left).
   Scoped to the tags, so `.ntanswer`'s own padding still holds. */
@media(max-width:767px){
  [class*="elementor-widget-twrb_"] .elementor-widget-container .ntanswer :is(p,h1,h2,h3,h4,h5,h6,ul,ol){ padding-left:0!important; }
}

/* mobile only — TW Not Your Typical Agency: no paragraph inside the answer
   box carries a top margin (the eyebrow and body copy both ship inline
   margins from the widget). Bottom margins and the box's own padding are
   deliberately untouched. */
@media(max-width:767px){
  [class*="elementor-widget-twrb_"] .elementor-widget-container .ntanswer p{ margin-top:0!important; }
}

/* mobile only: the margin:0 reset above (and its partial p/ul/ol-only
   restore) leaves WYSIWYG-authored headings with no spacing at all. This
   used to hand the job back to the browser's default block spacing
   (`margin:revert`), which also brought back a `margin-bottom` on every
   block. Content is now spaced with `margin-top` only, so the reset stays
   and the CONTENT SPACING SYSTEM block at the end of this file supplies the
   steps from the scale — at every width, mobile included. */

/* ------------------------------------------------------------
   TW Hero — Growth Engine (#engine): content breaking out of
   the fold on narrow viewports.

   Two things in that section were laid out as if the copy
   column were always desktop-wide:

   1. `.engine-stats` — the stat strip is one column per stat
      and never collapsed, so below ~500px each cell was
      narrower than its own label ("Specialists", "Discipline").
      The cells had an auto/min-content minimum, so the strip
      grew past the fold instead of the text reflowing — it ran
      off the right edge and took the page's horizontal scroll
      with it. The cells now carry `min-width:0` (in the widget,
      identical at every width the content already fits) and the
      strip drops to two columns on mobile, which is the same
      treatment the other stat row in this project already gets
      at 720px.
   2. `.eng-head` — the sub-headline ships inline
      `white-space:nowrap`, so it could not wrap at any width
      and spilled out of the fold on small phones.

   Both rules are mobile-only and only engage when the content
   no longer fits, so the desktop/tablet layout is untouched.
   ------------------------------------------------------------ */
@media(max-width:767px){
  /* two stats per row instead of one row of N. FLEX: a fixed 50% basis is
     the wrapping equivalent of `repeat(2,minmax(0,1fr))`, and the 18px each
     cell already carries as `margin-top` is the row step, so no `row-gap`. */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .engine-stats > *{
    flex:0 0 50%!important;
  }
  /* the cells carry index-based inline padding/dividers built for a single
     row; re-key them to the column so the divider sits between the two
     columns and never at the start of a row */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .engine-stats > *{
    padding:0!important;
    border-left:0!important;
  }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .engine-stats > *:nth-child(odd){
    padding-right:14px!important;
  }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .engine-stats > *:nth-child(even){
    padding-left:14px!important;
    border-left:1px solid rgba(27,62,147,.16)!important;
  }
  /* let the sub-headline wrap rather than run past the fold */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-head{
    white-space:normal!important;
  }
}

/* ============================================================
   WIDGET COMPONENT SYSTEM — Base + Modifier
   Used by the standalone Button / Heading / Combined Content /
   FAQ widgets. Mobile-first min-width breakpoints; the source
   page's own values are the 1850px (Extra Large) scale.
   These classes are additive: nothing above is overridden.
   ============================================================ */

/* --- utilities --- */
.container-standard{width:100%;max-width:100%;margin-inline:auto;padding-inline:15px}
.section-py-main{padding-block:min(var(--sp-cap),30px)}
@media(min-width:768px){
  .container-standard{max-width:720px;padding-inline:min(var(--sp-cap),30px)}
  .section-py-main{padding-block:min(var(--sp-cap),45px)}
}
@media(min-width:992px){ .container-standard{max-width:960px} }
/* …and below 1200px the cap comes straight back off, exactly like the
   `--content-*` ladder above: only the side padding is left, so the standalone
   widgets' content runs the full width of the viewport on iPad and mobile. */
@media(max-width:1199.98px){ .container-standard{max-width:100%} }
/* `.container-standard` carries its side padding INSIDE the box, so from
   1200px up the max-width is the content token plus the two gutters — the
   inner content then measures 1140px (>=1200px) / 1520px (>=1600px) with
   20px beside it, matching `.wrap` exactly. The former 1850px step is gone:
   the container scale tops out at the 1600px band. */
@media(min-width:1200px){ .container-standard{max-width:calc(var(--content-max) + var(--gutter) * 2);padding-inline:var(--gutter)} .section-py-main{padding-block:min(var(--sp-cap),35px)} }
@media(min-width:1600px){ .section-py-main{padding-block:min(var(--sp-cap),50px)} }
@media(min-width:1850px){ .section-py-main{padding-block:min(var(--sp-cap),clamp(56px,6vw,96px))} }

/* consistent structural rhythm: ~20px on mobile/iPad, ~30px above.
   FLEX + margin: both are single-column content stacks, so the rhythm is a
   `margin-top` on every item after the first — never a `gap`. */
.twrb-stack,.twrb-grid{display:flex;flex-direction:column}
.twrb-stack>*+*,.twrb-grid>*+*{margin-top:20px}
@media(min-width:1200px){ .twrb-stack>*+*,.twrb-grid>*+*{margin-top:min(var(--sp-cap),30px)} }

/* alignment utilities (shared by the standalone widgets) */
.twrb-align-left{text-align:left}
.twrb-align-center{text-align:center}
.twrb-align-right{text-align:right}
.twrb-align-block{text-align:left}
.twrb-btn-wrap{display:block}
/* stand-alone CTA row under a fold's content (Base_Widget::the_center_cta) —
   centred by default; the Alignment / Spacing Above controls override both */
.twrb-xcta{display:flex;flex-wrap:wrap;justify-content:center;margin-top:min(var(--sp-cap),clamp(28px,3.4vw,44px))}

/* Content-spacing scale — driven entirely by the CONTENT SPACING SYSTEM
   tokens, so every breakpoint in the scale is defined in exactly one place
   (see `--c-gap` / `--hc-gap` / `--cta-gap` in the token block at the top).
   Content is spaced with `margin-top` only; no paddings, no gaps. */
.widget-heading + .widget-content,
.widget-heading + .twrb-rich{margin-top:var(--hc-gap)}
.widget-content + .widget-content,
.twrb-rich + .twrb-rich{margin-top:var(--c-gap)}
.widget-content + .widget-heading,
.twrb-rich + .widget-heading{margin-top:min(var(--sp-cap),var(--cta-gap))}
.widget-heading + .widget-heading{margin-top:var(--c-gap)}

/* --- base: heading --- */
.widget-heading{
  font-family:var(--font-display);
  text-transform:uppercase;
  line-height:var(--display-lh,.92);
  letter-spacing:var(--display-tracking,.01em);
  color:var(--text-heading);
  font-size:25px; /* mobile base — deliberately between 22px and 28px */
  margin:0;
}
.widget-heading.heading-xs{font-size:22px}
.widget-heading.heading-sm{font-size:23px}
.widget-heading.heading-lg{font-size:27px}
.widget-heading.heading-xl{font-size:28px}
@media(min-width:768px){
  .widget-heading{font-size:32px}
  .widget-heading.heading-xs{font-size:24px}
  .widget-heading.heading-sm{font-size:28px}
  .widget-heading.heading-lg{font-size:38px}
  .widget-heading.heading-xl{font-size:44px}
}
@media(min-width:992px){
  .widget-heading{font-size:36px}
  .widget-heading.heading-xs{font-size:26px}
  .widget-heading.heading-sm{font-size:31px}
  .widget-heading.heading-lg{font-size:44px}
  .widget-heading.heading-xl{font-size:52px}
}
@media(min-width:1200px){ /* QA breakpoint — scaled down, never the XL values */
  .widget-heading{font-size:40px}
  .widget-heading.heading-xs{font-size:28px}
  .widget-heading.heading-sm{font-size:34px}
  .widget-heading.heading-lg{font-size:50px}
  .widget-heading.heading-xl{font-size:60px}
}
@media(min-width:1600px){
  .widget-heading{font-size:52px}
  .widget-heading.heading-xs{font-size:32px}
  .widget-heading.heading-sm{font-size:42px}
  .widget-heading.heading-lg{font-size:64px}
  .widget-heading.heading-xl{font-size:78px}
}
@media(min-width:1850px){
  .widget-heading{font-size:var(--display-md)}
  .widget-heading.heading-xs{font-size:var(--heading-xl)}
  .widget-heading.heading-sm{font-size:var(--display-md)}
  .widget-heading.heading-lg{font-size:var(--display-lg)}
  .widget-heading.heading-xl{font-size:var(--display-xl)}
}
/* body-font heading modifier (Poppins sub-heads) */
.widget-heading.heading-body{font-family:var(--font-body);text-transform:none;line-height:var(--heading-lh,1.15);letter-spacing:0;font-weight:var(--fw-semibold)}
/* colour modifiers (exactly one per heading; `custom` sets an inline colour) */
.widget-heading.heading-ink{color:var(--text-heading)}
.widget-heading.heading-cobalt{color:var(--tw-cobalt-700)}
.widget-heading.heading-green{color:var(--tw-green-600)}
.widget-heading.heading-white{color:var(--text-inverse)}

/* --- base: prose ---
   Size comes from the project-wide content token `--content-size` (see the
   GLOBAL TYPE & BUTTON SCALE block near the end of this file), so prose steps
   down with every other paragraph/list/label instead of carrying its own
   ladder. At 1600px+ `--content-size` resolves to `--body-lg` — the value
   this rule already used there, so nothing changes on large desktop. */
.widget-content{font-family:var(--font-body);font-size:var(--content-size);line-height:var(--body-lh,1.65);color:var(--text-body)}

/* --- base: button ---
   The source's own `.btn` is the Base — reusing it is what keeps a button
   dropped anywhere on the page identical to the buttons inside the lifted
   sections. Only two colour Modifiers are new (`.btn-cobalt`, `.btn-ghost`);
   the source already ships `.btn-green`, `.btn-outline`, `.btn-ondark`.
   The responsive size scale is scoped to the standalone widgets so the lifted
   sections keep their exact source rendering (source `.btn` is 17px at every
   width, and that is preserved). */
.btn-cobalt{background:var(--tw-cobalt-700);color:#fff;border-color:var(--tw-cobalt-700)}
.btn-cobalt .circ{background:rgba(255,255,255,.18)}
.btn-cobalt:not([href*="tel:" i]):hover{background:var(--tw-cobalt-600);border-color:var(--tw-cobalt-600);box-shadow:var(--shadow-brand)}
.btn-ghost{background:transparent;color:var(--tw-cobalt-700);border-color:transparent}
.btn-ghost .circ{background:var(--tw-cobalt-100)}
.btn-ghost:not([href*="tel:" i]):hover{color:var(--tw-cobalt-600)}
.btn:focus-visible{outline:none;box-shadow:var(--shadow-focus)}

/* size Modifiers — standalone Button widget and Combined-Content CTA only */
.twrb-btn-wrap .btn,.cc-cta .btn{font-size:15px;padding:13px 16px 13px 22px}
.twrb-btn-wrap .btn .circ,.cc-cta .btn .circ{width:28px;height:28px;font-size:16px}
.twrb-btn-wrap .btn.btn-sm,.cc-cta .btn.btn-sm{font-size:13px;padding:10px 12px 10px 18px}
.twrb-btn-wrap .btn.btn-sm .circ,.cc-cta .btn.btn-sm .circ{width:22px;height:22px;font-size:14px}
.twrb-btn-wrap .btn.btn-lg,.cc-cta .btn.btn-lg{font-size:16px;padding:15px 18px 15px 24px}
.twrb-btn-wrap .btn.btn-lg .circ,.cc-cta .btn.btn-lg .circ{width:30px;height:30px;font-size:17px}
@media(min-width:768px){
  .twrb-btn-wrap .btn,.cc-cta .btn{font-size:16px;padding:14px 18px 14px min(var(--sp-cap),26px)}
  .twrb-btn-wrap .btn .circ,.cc-cta .btn .circ{width:31px;height:31px;font-size:17px}
  .twrb-btn-wrap .btn.btn-sm,.cc-cta .btn.btn-sm{font-size:13.5px;padding:10px 13px 10px 19px}
  .twrb-btn-wrap .btn.btn-sm .circ,.cc-cta .btn.btn-sm .circ{width:24px;height:24px;font-size:14px}
  .twrb-btn-wrap .btn.btn-lg,.cc-cta .btn.btn-lg{font-size:17px;padding:17px 22px 17px min(var(--sp-cap),32px)}
  .twrb-btn-wrap .btn.btn-lg .circ,.cc-cta .btn.btn-lg .circ{width:34px;height:34px;font-size:18px}
}
@media(min-width:1600px){ /* the source's own values */
  .twrb-btn-wrap .btn,.cc-cta .btn{font-size:17px;padding:16px 20px 16px min(var(--sp-cap),30px)}
  .twrb-btn-wrap .btn .circ,.cc-cta .btn .circ{width:34px;height:34px;font-size:18px}
  .twrb-btn-wrap .btn.btn-sm,.cc-cta .btn.btn-sm{font-size:14px;padding:11px 14px 11px 20px}
  .twrb-btn-wrap .btn.btn-sm .circ,.cc-cta .btn.btn-sm .circ{width:26px;height:26px;font-size:15px}
  .twrb-btn-wrap .btn.btn-lg,.cc-cta .btn.btn-lg{font-size:19px;padding:19px 24px 19px min(var(--sp-cap),36px)}
  .twrb-btn-wrap .btn.btn-lg .circ,.cc-cta .btn.btn-lg .circ{width:38px;height:38px;font-size:20px}
}
.twrb-btn-wrap .btn.btn-ghost,.cc-cta .btn.btn-ghost{padding-left:0;padding-right:0}
.twrb-btn-wrap .btn.btn-block{display:flex;width:100%;justify-content:center}

/* --- base: card --- */
.widget-card{
  display:flex;flex-direction:column;height:100%;
  background:var(--surface-card);border:1px solid var(--border-subtle);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-md);
  padding:20px;overflow:hidden;
}
@media(min-width:768px){ .widget-card{padding:min(var(--sp-cap),36px)} }
@media(min-width:1600px){ .widget-card{padding:min(var(--sp-cap),44px)} }
.widget-card.card-dark{background:var(--surface-ink);border-color:rgba(255,255,255,.12);color:var(--text-inverse)}
.widget-card.card-dark .widget-heading{color:var(--text-inverse)}
.widget-card.card-dark .widget-content{color:rgba(255,255,255,.72)}
.widget-card.card-flat{box-shadow:none;background:var(--surface-alt)}
/* repeating boxes: equal height, last element pinned to the bottom */
.widget-card > :last-child{margin-top:auto}
.widget-card .card-body{flex:1 1 auto}
.widget-card .card-media{
  flex:none;width:100%;overflow:hidden;border-radius:var(--radius-md);
  height:var(--card-media-h,200px);
}
@media(min-width:768px){ .widget-card .card-media{height:var(--card-media-h-md,var(--card-media-h,240px))} }
@media(min-width:1200px){ .widget-card .card-media{height:var(--card-media-h-lg,var(--card-media-h-md,var(--card-media-h,260px)))} }
.widget-card .card-media.media-light{background:var(--tw-zircon)}
.widget-card .card-media img{width:100%;height:100%;display:block;object-fit:var(--card-media-fit,cover)}

/* --- combined content widget ---
   Mobile-first: one column. The two-column layout, the sticky text column and
   the image side all switch on together at the breakpoint the widget chooses
   (cc-at-768 / cc-at-992 / cc-at-1200), driven through custom properties so
   each breakpoint needs one rule instead of five.

   FLEX: the row is a column stack by default and turns into a two-column
   flex row at the chosen breakpoint. The widget publishes its split as both
   an `fr` pair and a unitless twin (`--cc-text-ww` / `--cc-media-ww`); the
   twin is what `flex` can take, and `flex:<w> 1 0` + `min-width:0` divides
   the row exactly the way `minmax(0,<w>fr)` tracks did. `gap` survives only
   as the `column-gap` between the two columns — the stacked step is a
   `margin-top` on whichever half `order` puts second. */
.twrb-combined .cc-row{display:flex;flex-direction:column;align-items:stretch}
.twrb-combined .cc-row>.cc-media{margin-top:20px}
.twrb-combined.cc-reverse .cc-row>.cc-media{margin-top:0}
.twrb-combined.cc-reverse .cc-row>.cc-text{margin-top:20px}
@media(min-width:1200px){
  .twrb-combined .cc-row>.cc-media,
  .twrb-combined.cc-reverse .cc-row>.cc-text{margin-top:min(var(--sp-cap),30px)}
}
.twrb-combined .cc-text{order:var(--cc-text-order,1)}
.twrb-combined .cc-media{order:var(--cc-media-order,2)}
/* image first while stacked */
.twrb-combined.cc-reverse{--cc-text-order:2;--cc-media-order:1}
@media(min-width:768px){
  .twrb-combined.cc-two.cc-at-768{--cc-sticky-pos:sticky;--cc-text-order:1;--cc-media-order:2}
  .twrb-combined.cc-two.cc-at-768.cc-image-left{--cc-text-order:2;--cc-media-order:1}
  .twrb-combined.cc-two.cc-at-768 .cc-row{flex-direction:row;align-items:flex-start;column-gap:min(var(--sp-cap),var(--col-gap))}
  .twrb-combined.cc-two.cc-at-768 .cc-row>.cc-text{flex:var(--cc-text-ww,1) 1 0;min-width:0;margin-top:0}
  .twrb-combined.cc-two.cc-at-768 .cc-row>.cc-media{flex:var(--cc-media-ww,1) 1 0;min-width:0;margin-top:0}
}
@media(min-width:992px){
  .twrb-combined.cc-two.cc-at-992{--cc-sticky-pos:sticky;--cc-text-order:1;--cc-media-order:2}
  .twrb-combined.cc-two.cc-at-992.cc-image-left{--cc-text-order:2;--cc-media-order:1}
  .twrb-combined.cc-two.cc-at-992 .cc-row{flex-direction:row;align-items:flex-start;column-gap:min(var(--sp-cap),var(--col-gap))}
  .twrb-combined.cc-two.cc-at-992 .cc-row>.cc-text{flex:var(--cc-text-ww,1) 1 0;min-width:0;margin-top:0}
  .twrb-combined.cc-two.cc-at-992 .cc-row>.cc-media{flex:var(--cc-media-ww,1) 1 0;min-width:0;margin-top:0}
}
@media(min-width:1200px){
  .twrb-combined.cc-two.cc-at-1200{--cc-sticky-pos:sticky;--cc-text-order:1;--cc-media-order:2}
  .twrb-combined.cc-two.cc-at-1200.cc-image-left{--cc-text-order:2;--cc-media-order:1}
  .twrb-combined.cc-two.cc-at-1200 .cc-row{flex-direction:row;align-items:flex-start;column-gap:min(var(--sp-cap),var(--col-gap))}
  .twrb-combined.cc-two.cc-at-1200 .cc-row>.cc-text{flex:var(--cc-text-ww,1) 1 0;min-width:0;margin-top:0}
  .twrb-combined.cc-two.cc-at-1200 .cc-row>.cc-media{flex:var(--cc-media-ww,1) 1 0;min-width:0;margin-top:0}
}
.twrb-combined .cc-media img{display:block;width:100%;height:auto;border-radius:var(--radius-lg);object-fit:var(--card-media-fit,cover)}
.twrb-combined .cc-media{margin:0}
/* content -> CTA step, from the content-spacing scale */
.twrb-combined .cc-cta{margin-top:min(var(--sp-cap),var(--cta-gap))}
/* sticky only engages once the two columns are side by side */
.twrb-combined.cc-sticky .cc-text{position:var(--cc-sticky-pos,static);top:calc(var(--tw-header-h,96px) + 24px)}
@media(prefers-reduced-motion:reduce){ .twrb-combined.cc-sticky .cc-text{position:static} }

/* --- accordion / FAQ --- */
.tw-acc{display:flex;flex-direction:column}
.tw-acc-item + .tw-acc-item{margin-top:12px}
.tw-acc-item{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-card);overflow:hidden}
.tw-acc-q{
  display:flex;align-items:flex-start;gap:14px;width:100%;
  background:none;border:0;cursor:pointer;text-align:left;
  padding:16px 18px;font-size:16px;line-height:1.4;
  font-weight:var(--fw-semibold);color:var(--text-heading);
}
@media(min-width:768px){ .tw-acc-q{padding:20px 24px;font-size:17px} }
.tw-acc-ico{
  flex:none;width:22px;height:22px;position:relative;
  /* aligned to the FIRST LINE of the question at every breakpoint */
  margin-top:calc((1.4em - 22px) / 2);
  transition:transform var(--dur-base) var(--ease-out);
}
.tw-acc-ico::before,.tw-acc-ico::after{content:"";position:absolute;background:var(--tw-cobalt-700);border-radius:2px}
.tw-acc-ico::before{left:3px;right:3px;top:10px;height:2px}
.tw-acc-ico::after{top:3px;bottom:3px;left:10px;width:2px;transition:opacity var(--dur-base) var(--ease-out)}
.tw-acc-item.is-open .tw-acc-ico::after{opacity:0}
.tw-acc-a{padding:0 18px 18px;font-size:15px;line-height:var(--body-lh,1.65);color:var(--text-body)}
@media(min-width:768px){ .tw-acc-a{padding:0 24px 22px;font-size:15.5px} }
.tw-acc-a[hidden]{display:none}
.tw-acc-qt{flex:1 1 auto}
.twrb-faq .tw-eyebrow + .widget-heading{margin-top:16px}
.twrb-faq .widget-heading + .tw-acc,.twrb-faq .tw-eyebrow + .tw-acc{margin-top:20px}
@media(min-width:1200px){ .twrb-faq .widget-heading + .tw-acc,.twrb-faq .tw-eyebrow + .tw-acc{margin-top:min(var(--sp-cap),30px)} }

/* CF7 inside a TechWyse card */
.twrb-cf7 .wpcf7-form p{margin:0 0 14px}
.twrb-cf7 .wpcf7-form label{display:block;font-size:13px;font-weight:var(--fw-semibold);letter-spacing:.04em;color:var(--text-heading);margin-bottom:6px}
/* FLEX: one field per row, two from 768px up. `gap` is kept only as the
   `column-gap` between the two field columns; the row step is a `margin-top`
   cancelled on the first line (one item below 768px, two above). */
.twrb-cf7 .wpcf7-form .form-2{--f2-gap:14px;display:flex;flex-wrap:wrap;column-gap:var(--f2-gap)}
.twrb-cf7 .wpcf7-form .form-2>*{flex:0 0 100%;min-width:0;margin-top:var(--f2-gap)}
.twrb-cf7 .wpcf7-form .form-2>:first-child{margin-top:0}
@media(min-width:768px){
  .twrb-cf7 .wpcf7-form .form-2>*{flex-basis:calc((100% - var(--f2-gap)) / 2)}
  .twrb-cf7 .wpcf7-form .form-2>:nth-child(-n+2){margin-top:0}
}
.twrb-cf7 .wpcf7-form input[type=text],
.twrb-cf7 .wpcf7-form input[type=email],
.twrb-cf7 .wpcf7-form input[type=tel],
.twrb-cf7 .wpcf7-form input[type=url],
.twrb-cf7 .wpcf7-form select,
.twrb-cf7 .wpcf7-form textarea{
  width:100%;padding:12px 14px;font-family:var(--font-body);font-size:15px;
  color:var(--text-heading);background:#fff;
  border:1px solid var(--border-subtle);border-radius:var(--radius-md);
}
.twrb-cf7 .wpcf7-form :is(input,select,textarea):focus{outline:none;border-color:var(--border-brand);box-shadow:var(--shadow-focus)}
.twrb-cf7 .wpcf7-form textarea{min-height:130px;resize:vertical}
.twrb-cf7 .wpcf7-form input[type=submit],
.twrb-cf7 .wpcf7-form button[type=submit]{
  width:100%;background:var(--tw-green-500);color:var(--tw-ink-900);
  border:0;border-radius:var(--radius-pill);padding:14px min(var(--sp-cap),28px);
  font-family:var(--font-body);font-weight:var(--fw-semibold);font-size:15px;cursor:pointer;
  transition:background var(--dur-base) var(--ease-out);
}
.twrb-cf7 .wpcf7-form input[type=submit]:hover,
.twrb-cf7 .wpcf7-form button[type=submit]:hover{background:var(--tw-green-600)}
.twrb-cf7-placeholder{border:1px dashed var(--border-strong);border-radius:var(--radius-md);padding:20px;color:var(--text-muted);font-size:14px}
.twrb-cf7 .widget-heading + .widget-content{margin-top:12px}
.twrb-cf7 .twrb-cf7-body{margin-top:18px}
.twrb-cf7 > .twrb-cf7-body:first-child{margin-top:0}
@media(min-width:1600px){ .twrb-cf7 .twrb-cf7-body{margin-top:24px} }

/* ============================================================
   BUTTON LOCK (only the GLOBAL TYPE & BUTTON SCALE and the
   FONT WEIGHT LOCK may follow it — both deliberately re-state
   these selectors to step the sizes down per breakpoint. The
   REFERENCE TYPE & COLOUR LOCK further down skips `.btn`
   entirely for the same reason: this block already owns the
   button's family, colour, tracking and leading.)
   Themes and Elementor's global kit style bare `a` / `.btn`
   (link colour, underline, padding, radius, uppercase, box
   shadow) and those rules were winning over the single-class
   component rules above, so buttons drifted from the source.
   This block re-asserts the SAME values already declared for
   `.btn` in final.html (lines 51-66) and for the plugin's own
   `.btn-cobalt`/`.btn-ghost`/size scale — no new styling, just
   the source numbers restored at a specificity + `!important`
   the theme cannot outrank. Everything is scoped to this
   plugin's widgets, so nothing leaks to the rest of the site.
   The scope is written as
   `:is([class*="elementor-widget-twrb_"] .elementor-widget-container,
        [class*="elementor-widget-twrb_"])`
   so it holds both with the normal Elementor wrapper and with
   Elementor's "Optimized Markup" experiment on (which drops
   `.elementor-widget-container` entirely).
   Inline-style exception: the Hero widget's Button Background /
   Button Text colour controls inject inline styles, so the
   green variant's background/colour stay opt-out via
   `:not([style*="..."])` and keep working.
   ============================================================ */

/* --- base: .btn (final.html line 51) --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn{
  display:inline-flex!important;
  align-items:center!important;
  gap:12px!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  font-family:var(--font-body)!important;
  font-weight:600!important;
  font-style:normal!important;
  letter-spacing:.01em!important;
  text-transform:none!important;
  text-decoration:none!important;
  text-align:center!important;
  white-space:normal!important;
  border:1.5px solid transparent!important;
  border-radius:var(--radius-pill)!important;
  box-shadow:none!important;
  cursor:pointer!important;
  line-height:1!important;
  transition:background .18s var(--ease-out),color .18s var(--ease-out),border-color .18s var(--ease-out),box-shadow .18s var(--ease-out),transform .18s var(--ease-out)!important;
  font-size:17px!important;
  padding:16px 20px 16px 30px!important;
  /* themes commonly add a gradient fill, a lift, a glow or a native
     button chrome on top of a link-button — none of that exists in
     final.html, so it is zeroed out here */
  background-image:none!important;
  background-clip:border-box!important;
  text-shadow:none!important;
  filter:none!important;
  opacity:1!important;
  transform:none!important;
  outline:none!important;
  vertical-align:middle!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
/* a theme's overlay pseudo (the classic `.btn::before` wipe/fill) would sit
   over the source's flat fill — the source button has no pseudo elements */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn::before,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn::after{
  content:none!important;
  display:none!important;
}
/* every interactive state keeps the source's own treatment: the ONLY hover
   change in final.html is the colour swap per Modifier (below) plus the arrow
   nudge — no underline, no lift, no fade, no glow. `:visited` is listed
   because themes recolour visited links, which would repaint a CTA. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn:hover,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn:focus,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn:active,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn:visited{
  text-decoration:none!important;
  background-image:none!important;
  text-shadow:none!important;
  filter:none!important;
  opacity:1!important;
  transform:none!important;
  letter-spacing:.01em!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn .circ{
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:18px!important;
  line-height:1!important;
  margin:0!important;
  padding:0!important;
  transition:transform .32s var(--ease-out)!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn:not([href*="tel:" i]):hover .circ{ transform:translate(3px,-3px)!important; }

/* --- colour Modifiers (final.html lines 54-64, 212-213) --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green{ border-color:var(--tw-green-500)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green:not([style*="background"]){ background:var(--tw-green-500)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green:not([style*="color"]){ color:#fff!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green .circ{ background:#fff!important; color:var(--tw-ink-900)!important; font-size:17px!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green:not([href*="tel:" i]):hover{ border-color:var(--tw-green-600)!important; box-shadow:0 16px 34px rgba(140,198,62,.34)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green:not([style*="background"]):not([href*="tel:" i]):hover{ background:var(--tw-green-600)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green:not([style*="color"]):not([href*="tel:" i]):hover{ color:#fff!important; }

:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-outline{ background:transparent!important; color:var(--tw-cobalt-700)!important; border-color:var(--tw-cobalt-300,#AEC1EC)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-outline .circ{ background:var(--tw-cobalt-100)!important; color:inherit!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-outline:not([href*="tel:" i]):hover{ background:var(--tw-cobalt-700)!important; color:#fff!important; border-color:var(--tw-cobalt-700)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-outline:not([href*="tel:" i]):hover .circ{ background:rgba(255,255,255,.2)!important; }

:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ondark{ background:transparent!important; color:#fff!important; border-color:rgba(255,255,255,.32)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ondark .circ{ background:rgba(255,255,255,.14)!important; color:inherit!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ondark:not([href*="tel:" i]):hover{ background:#fff!important; color:var(--tw-ink-900)!important; border-color:#fff!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ondark:not([href*="tel:" i]):hover .circ{ background:rgba(20,26,36,.12)!important; }

:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ink{ background:transparent!important; color:#fff!important; border:1px solid rgba(255,255,255,.28)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ink:not([href*="tel:" i]):hover{ background:#fff!important; color:var(--tw-ink-900)!important; border-color:#fff!important; }

/* plugin-only Modifiers, same treatment */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-cobalt{ background:var(--tw-cobalt-700)!important; color:#fff!important; border-color:var(--tw-cobalt-700)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-cobalt .circ{ background:rgba(255,255,255,.18)!important; color:inherit!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-cobalt:not([href*="tel:" i]):hover{ background:var(--tw-cobalt-600)!important; border-color:var(--tw-cobalt-600)!important; box-shadow:var(--shadow-brand)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ghost{ background:transparent!important; color:var(--tw-cobalt-700)!important; border-color:transparent!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ghost .circ{ background:var(--tw-cobalt-100)!important; color:inherit!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ghost:not([href*="tel:" i]):hover{ color:var(--tw-cobalt-600)!important; }

:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn:focus-visible{ outline:none!important; box-shadow:var(--shadow-focus)!important; }

/* --- size Modifier (final.html lines 65-66) --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-sm{ font-size:14px!important; padding:11px 14px 11px 20px!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-sm .circ{ width:26px!important; height:26px!important; font-size:15px!important; }

/* --- responsive size scale: standalone Button widget + Combined-Content CTA
       (unchanged values, re-asserted so they still beat the locked base) --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn{ font-size:15px!important; padding:13px 16px 13px 22px!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn .circ,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn .circ{ width:28px!important; height:28px!important; font-size:16px!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm{ font-size:13px!important; padding:10px 12px 10px 18px!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm .circ,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm .circ{ width:22px!important; height:22px!important; font-size:14px!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg{ font-size:16px!important; padding:15px 18px 15px 24px!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg .circ,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg .circ{ width:30px!important; height:30px!important; font-size:17px!important; }
@media(min-width:768px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn{ font-size:16px!important; padding:14px 18px 14px 26px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn .circ{ width:31px!important; height:31px!important; font-size:17px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm{ font-size:13.5px!important; padding:10px 13px 10px 19px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm .circ{ width:24px!important; height:24px!important; font-size:14px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg{ font-size:17px!important; padding:17px 22px 17px 32px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg .circ{ width:34px!important; height:34px!important; font-size:18px!important; }
}
@media(min-width:1600px){ /* the source's own values */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn{ font-size:17px!important; padding:16px 20px 16px 30px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn .circ{ width:34px!important; height:34px!important; font-size:18px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm{ font-size:14px!important; padding:11px 14px 11px 20px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm .circ{ width:26px!important; height:26px!important; font-size:15px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg{ font-size:19px!important; padding:19px 24px 19px 36px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg .circ{ width:38px!important; height:38px!important; font-size:20px!important; }
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-ghost,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-ghost{ padding-left:0!important; padding-right:0!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-block{ display:flex!important; width:100%!important; justify-content:center!important; }

/* layout tweaks from the source that must survive the lock */
@media(max-width:1024px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .hero-grid .btn{ justify-content:center!important; }
}

/* ============================================================
   TEL LINK LOCK (stays after the BUTTON LOCK)
   Requirement: a `tel:` link must have NO hover treatment
   anywhere in the project — header, footer, widgets, templates —
   whether it is a plain text link or a full CTA button. No
   colour change, no underline, no background shift, no transform
   and no transition, on `:hover` OR on `:focus-visible`.
   A phone number is a dial action, not a navigation target, so
   it simply keeps its resting look in every state.

   THE MATCHER: `[href*="tel:" i]` — a *substring*, *case-
   insensitive* match, so every way a phone link can be authored
   is caught: `tel:`, `TEL:`, `Tel:+1…`, an href with leading
   whitespace, a number pasted with spaces or dashes, and a
   `tel:` produced by a shortcode. It is not anchored with `^`
   on purpose: the requirement is "any anchor that contains a tel
   reference", not "any anchor whose href starts with tel:".

   Three layers do the work:
   1. SOURCE — every hover/focus rule in this file that can land
      on an anchor now carries `:not([href*="tel:" i])`, so no hover
      treatment is produced for a tel link in the first place:
      the global `a:not([href*="tel:" i]):hover`, the `.btn*`
      Modifiers, `.fnlink` (+ its `::before`/`::after`/`.fni`/`u`),
      `.flinks a`, `.fphone`, `.foot-grid a`, `.social a`, and the
      matching `!important` re-assertions in the BUTTON and FOOTER
      locks. `techwyse-header-builder.css` carries the same
      exclusion on its own `.twhb-*` hover rules and its own lock.
   2. LOCK (below) — a project-wide `!important` neutraliser that
      also cancels hover/focus styling coming from the theme, a
      kit, or Elementor's own link styles. It is deliberately NOT
      scoped to `[class*="elementor-widget-twrb_"]`, because the
      requirement is project-wide.
   3. RUNTIME PIN — `telHoverLock()` in
      `assets/js/techwyse-interactions.js`. CSS can only restate a
      resting value it knows; a third-party `a:hover{color:…}` on a
      plain tel link inside body copy, or on a CTA this plugin did
      not style, has a resting colour no stylesheet here can name.
      The pin reads each tel link's resting computed style while it
      is NOT hovered and re-applies exactly those values inline for
      as long as the pointer is over it, so the rendered result is
      byte-identical to the resting one whatever the theme does.

   `[href*="tel:" i]` is repeated three times purely to carry the
   selector's weight up to the locks above without reaching for an
   id. Every value restated below is the SAME resting value
   declared earlier in this file — nothing new is styled.

   ONE deliberate exception: the keyboard focus RING
   (`box-shadow:var(--shadow-focus)` on `.btn:focus-visible`) is
   kept. It is not a hover effect and is none of the properties
   the requirement enumerates; removing it would leave keyboard
   users with no visible focus indicator (WCAG 2.4.7). Colour,
   background, underline, transform and transition ARE
   neutralised on `:focus-visible`, exactly as on `:hover`.
   ============================================================ */

/* every tel link, in every state — no lift, no fade, no
   underline, no glow, and no transition toward a state that no
   longer differs from the resting one */
a[href*="tel:" i][href*="tel:" i][href*="tel:" i],
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:hover,
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:focus,
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:focus-visible,
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:focus-within,
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:active{
  transform:none!important;
  translate:none!important;
  rotate:none!important;
  scale:none!important;
  text-decoration:none!important;
  text-shadow:none!important;
  background-image:none!important;
  filter:none!important;
  opacity:1!important;
  transition:none!important;
}
/* the arrow bubble — and anything else nested in a tel link —
   stays put too: no transition in any state means the resting and
   the hovered rendering cannot differ even for a moment */
a[href*="tel:" i][href*="tel:" i][href*="tel:" i] *,
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]::before,
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]::after{
  transition:none!important;
}
a[href*="tel:" i][href*="tel:" i][href*="tel:" i] .circ,
a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:is(:hover,:focus,:focus-visible,:active) .circ{
  transform:none!important;
  transition:none!important;
}
/* no hover shadow (the green Modifier is the one that adds one).
   `:not(:focus-visible)` is what keeps the keyboard focus ring. */
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn:is(:hover,:active):not(:focus-visible){ box-shadow:none!important; }

/* --- resting colours re-asserted per button Modifier --- */
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-green:is(:hover,:focus,:focus-visible,:active){ border-color:var(--tw-green-500)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-green:not([style*="background"]):is(:hover,:focus,:focus-visible,:active){ background:var(--tw-green-500)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-green:not([style*="color"]):is(:hover,:focus,:focus-visible,:active){ color:#fff!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-green:is(:hover,:focus,:focus-visible,:active) .circ{ background:#fff!important; color:var(--tw-ink-900)!important; }

a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-outline:is(:hover,:focus,:focus-visible,:active){ background:transparent!important; color:var(--tw-cobalt-700)!important; border-color:var(--tw-cobalt-300,#AEC1EC)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-outline:is(:hover,:focus,:focus-visible,:active) .circ{ background:var(--tw-cobalt-100)!important; color:inherit!important; }

a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-ondark:is(:hover,:focus,:focus-visible,:active){ background:transparent!important; color:#fff!important; border-color:rgba(255,255,255,.32)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-ondark:is(:hover,:focus,:focus-visible,:active) .circ{ background:rgba(255,255,255,.14)!important; color:inherit!important; }

a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-ink:is(:hover,:focus,:focus-visible,:active){ background:transparent!important; color:#fff!important; border-color:rgba(255,255,255,.28)!important; }

a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-cobalt:is(:hover,:focus,:focus-visible,:active){ background:var(--tw-cobalt-700)!important; color:#fff!important; border-color:var(--tw-cobalt-700)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-cobalt:is(:hover,:focus,:focus-visible,:active) .circ{ background:rgba(255,255,255,.18)!important; color:inherit!important; }

a[href*="tel:" i][href*="tel:" i][href*="tel:" i].btn-ghost:is(:hover,:focus,:focus-visible,:active){ background:transparent!important; color:var(--tw-cobalt-700)!important; border-color:transparent!important; }

/* --- the footer's own link components --- */
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].fphone:is(:hover,:focus,:focus-visible,:active){ background:rgba(255,255,255,.06)!important; border-color:rgba(255,255,255,.14)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].fnlink:is(:hover,:focus,:focus-visible,:active){ color:rgba(255,255,255,.8)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].fnlink:is(:hover,:focus,:focus-visible,:active)::before{ opacity:0!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].fnlink:is(:hover,:focus,:focus-visible,:active)::after{ transform:scaleY(0)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].fnlink:is(:hover,:focus,:focus-visible,:active) .fni{ color:rgba(255,255,255,.32)!important; }
a[href*="tel:" i][href*="tel:" i][href*="tel:" i].fnlink:is(:hover,:focus,:focus-visible,:active) u{ transform:none!important; color:rgba(255,255,255,.5)!important; background:transparent!important; border-color:rgba(255,255,255,.14)!important; }
.flinks a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:is(:hover,:focus,:focus-visible,:active){ color:rgba(255,255,255,.68)!important; }
.foot-grid a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:is(:hover,:focus,:focus-visible,:active){ color:rgba(255,255,255,.72)!important; }
.social a[href*="tel:" i][href*="tel:" i][href*="tel:" i]:is(:hover,:focus,:focus-visible,:active){ background:transparent!important; border-color:rgba(255,255,255,.2)!important; color:#fff!important; }

/* ============================================================
   EYEBROW LOCK
   The eyebrow metrics are a fixed part of the design — a 17px
   label (the reference value; 16px / 20x2px on mobile, see the
   media query below), a 28x2px rule, an 8px gap, and the rule
   pinned to the vertical centre of the FIRST line of the
   label. `.ecard .eyebrow` carries the reference's own fluid
   clamp instead of a flat size. Theme rules
   for bare `i` (icon fonts size/space them) and kit typography
   for small uppercase labels were the two things able to move
   them, so the same values declared earlier in this file are
   re-asserted here, scoped to this plugin's widgets.
   `align-items:flex-start` + the rule's `margin-top` (half of
   the 1em first-line box, minus the rule's own 2px) is what
   keeps the rule on the first line when a long label wraps —
   `align-items:center` would drop it to the middle of the block.
   Colour, margins, width and justification are deliberately NOT
   locked: widgets set those inline (centred eyebrows, spacing
   below) and the Eyebrow Color control must keep working.
   ============================================================ */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow{
  align-items:flex-start!important;
  gap:8px!important;
  font-size:17px!important;
  line-height:1!important;
  text-transform:uppercase!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow i,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .eyebrow i{
  width:28px!important;
  min-width:0!important;
  max-width:none!important;
  height:2px!important;
  min-height:0!important;
  flex:none!important;
  margin:calc((1em - 2px) / 2) 0 0!important;
  padding:0!important;
  border:0!important;
  border-radius:2px!important;
  background:var(--tw-green-500)!important;
  font-size:inherit!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .eyebrow{
  align-items:flex-start!important;
  gap:8px!important;
  font-size:clamp(11px,.92vw,13px)!important;
  line-height:1!important;
}

/* --- mobile only: 16px label, 20x2px rule ---------------------
   Declared after the lock above (same specificity, later wins) so
   it overrides the locked 17px / 28px desktop metrics. Everything
   else — the 8px gap, flex-start alignment and the rule's
   em-based margin-top — is left alone, so the rule stays pinned to
   the centre of the first line at the smaller type size.
   Only `.tw-eyebrow` (every section widget, incl. the `ntans-`/
   `cc-` variants) is stepped down here: the hero card's
   `.ecard .eyebrow` uses the reference's own clamp, which already
   resolves to its 11px floor at these widths, so overriding it
   would push it back above the reference. */
@media(max-width:767px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow{
    font-size:16px!important;
  }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow i,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .eyebrow i{
    width:20px!important;
  }
}

/* --- funnel fold: the standalone's own eyebrow step -----------
   "Funnel Section (Standalone).html" is the sole reference for the
   TW Growth Engine Funnel, and below 1199.98px it sizes that
   section's eyebrow itself — 15px on a 1.3 line, a 14px gap, and
   a 28x2px rule pinned with `calc(.65em - 1px)`. Declared after
   the lock and the mobile step above, and with `!important`, so it
   outranks both for this one section only; every other eyebrow on
   the page keeps the global scale. The `.fntabs` kill switch is
   the reference's too — it is what makes the tab strip carried in
   the funnel block above inert at every width. */
@media(max-width:1199.98px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fntabs,
  .fntabs{
    display:none!important;
  }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnhead .tw-eyebrow,
  .fnhead .tw-eyebrow{
    font-size:15px!important;
    line-height:1.3!important;
    align-items:flex-start!important;
    gap:14px!important;
  }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnhead .tw-eyebrow i,
  .fnhead .tw-eyebrow i{
    width:28px!important;
    height:2px!important;
    margin:calc(.65em - 1px) 0 0!important;
  }
}

/* ------------------------------------------------------------
   TW Why Clients Choose Us — the Google rating bar (`.gbar`)
   ran off the fold on phones.

   The bar is one flex row: hairline / content block / hairline.
   The content block ships an inline `flex:none` (= `0 0 auto`),
   so it is sized to MAX-CONTENT and can never shrink, and the
   copy column inside it is a flex item with the default
   `min-width:auto` — a second floor at the same max-content
   width. Nothing here sets `white-space:nowrap`; the text
   simply never gets a narrower box to wrap into, so the longest
   line (the hint copy) sets the bar's width and the whole thing
   spills past the container.

   Mobile only: let the row wrap, hand the content block the
   full row and clear BOTH min-width floors, so the copy breaks
   naturally inside the container. The two hairlines keep their
   `flex:1` and land above and below the block. Line-height is
   opened from the inline 1.15 (built for single lines) so the
   wrapped lines stay legible. Desktop/tablet is untouched —
   above 767px the original single-row bar still applies.
   ------------------------------------------------------------ */
@media(max-width:767px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .gbar{
    flex-wrap:wrap!important;
    justify-content:center!important;
  }
  /* the content block: drop the inline `flex:none` and the auto floor */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .gbar > span:not(.cbrule){
    flex:1 1 100%!important;
    min-width:0!important;
    max-width:100%!important;
    justify-content:center!important;
  }
  /* the Google mark stays at its drawn size */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .gbar > span:not(.cbrule) > svg{
    flex:none!important;
  }
  /* the copy column — second min-width floor lives here */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .gbar > span:not(.cbrule) > span{
    flex:1 1 auto!important;
    min-width:0!important;
    line-height:1.4!important;
  }
  /* the individual lines (score+stars, count, hint) wrap inside it */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .gbar > span:not(.cbrule) > span > span{
    min-width:0!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
    flex-wrap:wrap!important;
  }
  /* hairlines: still `flex:1`, now on their own rows above/below */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .gbar > .cbrule{
    flex:1 1 40px!important;
    min-width:0!important;
  }
}

/* ------------------------------------------------------------
   TW Brand Halo — mobile vertical rhythm.

   Below 1200px the fold stacks (feed row / centred content /
   feed row), but every gap INSIDE the content column was still
   carrying its desktop figure, so on a phone the column read as
   a very loose ribbon:

     • 30px (`--fold-pad-y`) between each marquee row and the
       content, top and bottom;
     • 26px between the headline and the lead paragraph;
     • a 54px well under the trust flow — the closing
       paragraph's own `margin-top` (30px) plus the 24px step
       under its hairline (`--halo-close-step`, drawn by
       `.halo-close::before`; it used to be a `padding-top` on
       the paragraph itself). That well is the gap marked in
       the brief.

   Each of those steps down to the project's shared spacing
   scale — `--space-5` (24px) and `--space-4` (16px) — instead of
   the hardcoded/clamped desktop numbers. `!important` is
   required because the two paragraphs ship their margins as
   INLINE styles from the widget (`margin:26px auto 0` and
   `margin:clamp(30px,4vw,46px) auto 0`), which a plain class
   rule cannot outrank. The hairline step is a custom property,
   so it needs no `!important`.

   Deliberately untouched, so nothing but the spacing moves:
     • the feeds themselves — widths, masks, the `--hsy`/`--hsb`
       shadow gutter and the `twFeedLeft` marquee;
     • the fold's own 20px outer padding (its boundary rhythm
       against the neighbouring sections);
     • `.halostage`'s padding — its height is the reference box
       for the absolutely centred `.halobloom` / `.haloorbit`,
       so trimming it would slide the halo ring off the word;
     • `.trustflow`'s negative `margin-top`, which cancels the
       invisible `.haloreflect` and therefore has to stay paired
       with the stage height above.

   Everything here is inside `max-width:767px` — from 768px up
   the fold keeps the exact spacing it has today.
   ------------------------------------------------------------ */
@media(max-width:767px){
  /* marquee row ↔ centred content, top and bottom */
  [class*="elementor-widget-twrb_brand_halo"] .halofold > .wrap{
    padding-top:var(--space-5)!important;
    padding-bottom:var(--space-5)!important;
  }
  /* headline ↔ lead paragraph */
  [class*="elementor-widget-twrb_brand_halo"] .halofold > .wrap > [data-reveal] > p{
    margin-top:var(--space-4)!important;
  }
  /* trust flow ↔ hairline ↔ closing paragraph (the marked gap). The half under
     the hairline is now the `.halo-close::before` step, retuned through its
     custom property instead of through `padding-top`. */
  [class*="elementor-widget-twrb_brand_halo"] .halofold > .wrap > p[data-reveal]{
    margin-top:var(--space-4)!important;
    --halo-close-step:var(--space-4);
  }
}

/* The step arrows in the trust flow are absolutely positioned and
   already hidden below 720px, so they must contribute no height to
   the row — a theme that resets `position` or `display` on inline
   SVG would otherwise reopen a ~36px well between the labels and
   the hairline above the closing paragraph. Re-asserted at the
   SAME breakpoint as the source rule, so the 721–767px band keeps
   its visible arrows exactly as before. */
@media(max-width:720px){
  [class*="elementor-widget-twrb_brand_halo"] .tfarrow{ display:none!important; }
}

/* ============================================================
   GLOBAL TYPE & BUTTON SCALE
   (stays after every component block, before the FONT WEIGHT LOCK)

   One ladder for the whole project, stepped at the three QA
   breakpoints. Nothing here is per-widget: the body size lives in
   a single token that the widget container inherits from, and the
   buttons are scaled on the shared `.btn` Base + its Modifiers.

   ── Body / default text ──────────────────────────────────────
     1600px+          `--body-lg` (17px) — unchanged
     below 1599px     14px
     below 1199px     15px
     mobile (<768px)  14px
   The bands are written as max-width queries in that order, so
   each one overrides the band above it for its own range:
     1200–1599 → 14px | 768–1199 → 15px | below 768 → 14px.
   `--body-base` is the size; the rest of the body ramp and the
   label sizes are re-derived from it at the same steps, so
   paragraphs, lists, labels and small text that reference a token
   (rather than a hard px) come down with it. The container rule in
   the THEME ISOLATION block inherits `--body-base` to everything
   that sets no size of its own.

   ── Buttons ──────────────────────────────────────────────────
   Height (padding + arrow bubble), padding and font-size scale
   down proportionally at each step — ~0.88 / ~0.80 / ~0.71 of the
   1600px+ metrics. Style, pill radius and every hover treatment
   are untouched: only the box and the type shrink. The rules
   repeat the BUTTON LOCK's selectors (and its `!important`) so
   they outrank it at equal specificity on source order, and they
   cover the `.twrb-btn-wrap`/`.cc-cta` scope too, which the lock
   declares one class deeper.
   ============================================================ */

/* --- the body token ladder ---
   `--body-base` is the inherited default size (what the widget container
   hands down); `--content-size` is the prose size `.widget-content` uses.
   At 1600px+ both keep exactly the values in force before this block —
   1rem inherited, `--body-lg` for prose — so large desktop is untouched.
   From 1599px down they are the one ladder, and the rest of the body ramp
   plus the label sizes are re-derived from it at the same steps. The label
   tokens are capped with `min()` so a band can only ever take them down. */
:root{
  --body-base:1rem;  /* @kind font */          /* 16px — the 1600px+ inherited size */
  --content-size:var(--body-lg);  /* @kind font */ /* 17px — the 1600px+ prose size */
}
@media(max-width:1599.98px){
  :root{
    --body-base:14px;  /* @kind font */
    --content-size:var(--body-base);  /* @kind font */
    --body-xl:calc(var(--body-base) + 3px);  /* @kind font */
    --body-lg:calc(var(--body-base) + 1px);  /* @kind font */
    --body-md:var(--body-base);  /* @kind font */
    --body-sm:calc(var(--body-base) - 1px);  /* @kind font */
    --body-xs:calc(var(--body-base) - 3px);  /* @kind font */
    --label-md:min(0.8125rem,calc(var(--body-base) - 1.5px));  /* @kind font */
    --label-sm:min(0.6875rem,calc(var(--body-base) - 3px));  /* @kind font */
  }
}
@media(max-width:1199.98px){
  :root{ --body-base:15px;  /* @kind font */ }
}
@media(max-width:767.98px){
  :root{ --body-base:14px;  /* @kind font */ }
}

/* shared content components that carry their own size — re-pointed at the
   token inside the bands only, so the 1600px+ rendering is untouched */
@media(max-width:1599.98px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-acc-a{ font-size:var(--body-base); }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form :is(input[type=text],input[type=email],input[type=tel],input[type=url],select,textarea){ font-size:var(--body-base); }
}

/* --- buttons: 1200–1599px (~0.88 of the 1600px+ metrics) --- */
@media(max-width:1599.98px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn{ font-size:15px!important; padding:14px 17px 14px 26px!important; gap:10px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn .circ{ width:30px!important; height:30px!important; font-size:16px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green .circ{ font-size:15px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm{ font-size:13px!important; padding:10px 12px 10px 18px!important; gap:9px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm .circ{ width:23px!important; height:23px!important; font-size:14px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg{ font-size:17px!important; padding:17px 21px 17px 31px!important; gap:10px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg .circ{ width:33px!important; height:33px!important; font-size:18px!important; }

  /* the ghost Modifier stays flush to its text edge at every size */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-ghost,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-ghost,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-ghost{ padding-left:0!important; padding-right:0!important; }

  /* the CF7 card's submit button is a button too */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form :is(input[type=submit],button[type=submit]){ padding:13px 25px; font-size:14px; }
}

/* --- buttons: 768–1199px (~0.80) --- */
@media(max-width:1199.98px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn{ font-size:14px!important; padding:12.5px 15px 12.5px 23px!important; gap:9px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn .circ{ width:27px!important; height:27px!important; font-size:15px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green .circ{ font-size:14px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm{ font-size:12px!important; padding:9px 11px 9px 16px!important; gap:8px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm .circ{ width:21px!important; height:21px!important; font-size:13px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg{ font-size:15.5px!important; padding:14px 18px 14px 27px!important; gap:9px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg .circ{ width:30px!important; height:30px!important; font-size:16px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form :is(input[type=submit],button[type=submit]){ padding:12px 22px; font-size:13.5px; }
}

/* --- buttons: mobile, below 768px (~0.71) --- */
@media(max-width:767.98px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn{ font-size:13px!important; padding:11px 13px 11px 20px!important; gap:8px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn .circ{ width:24px!important; height:24px!important; font-size:14px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green .circ{ font-size:13px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm{ font-size:11.5px!important; padding:8px 10px 8px 14px!important; gap:7px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-sm .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-sm .circ{ width:19px!important; height:19px!important; font-size:12px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg{ font-size:14px!important; padding:12px 15px 12px 23px!important; gap:8px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-btn-wrap .btn.btn-lg .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .cc-cta .btn.btn-lg .circ{ width:26px!important; height:26px!important; font-size:14px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form :is(input[type=submit],button[type=submit]){ padding:11px 20px; font-size:13px; }

  /* a CTA that sits in a narrow phone column wraps its label rather than
     pushing the pill past the fold — the arrow bubble stays on the last line */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn{ max-width:100%!important; }
}

/* ============================================================
   BUTTON HOVER COVERAGE
   Every button in the plugin answers the pointer. `.btn` (all
   Modifiers), the CF7 submit, `.tmmore`, `.earrow` and the footer
   phone pill already carry one from the source; the accordion
   question was the only clickable control without a hover state,
   so it gets the treatment its own component already uses
   elsewhere — colour only, no new geometry.
   `tel:` links are deliberately excluded here as well: the TEL
   LINK LOCK above keeps a dial action free of hover feedback.
   ============================================================ */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-acc-q{
  transition:color var(--dur-fast) var(--ease-out),background var(--dur-fast) var(--ease-out);
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-acc-q:hover{
  /* `!important` so the REFERENCE TYPE & COLOUR LOCK's resting `.tw-acc-q`
     colour, which is `!important` by necessity, cannot swallow the hover. */
  color:var(--tw-cobalt-700)!important;
  background:var(--tw-zircon);
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-acc-q:hover .tw-acc-ico::before,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-acc-q:hover .tw-acc-ico::after{
  background:var(--tw-green-600);
}

/* ============================================================
   GRID → FLEX — TW Growth Engine Funnel (tablet & mobile)

   Every other widget in this project is Flexbox in the base sheet
   at EVERY width now, so nothing outside the funnel is restated
   here. The funnel is the one section still laid out with CSS Grid
   on desktop, and this block is its tablet/mobile flex pass, kept
   exactly as it was: every rule is fenced behind `max-width:
   1199.98px`, the top edge of the project's iPad band (the bands
   are 1600+, 1200–1599, 768–1199, below 768 — see
   docs/responsive-type-and-button-scale.md).

   This is a MECHANISM change only. Each container below is
   re-expressed with the flex properties that reproduce its current
   track geometry:

     grid-template-columns:<a>fr <b>fr  ->  flex:<a> 1 0 / flex:<b> 1 0
       (`fr` hands out the SAME leftover space a `flex-basis:0` item
        grows into, so the resulting widths are identical)
     minmax(0,<n>fr)                    ->  + min-width:0
     grid-template-areas / grid-area    ->  order / row-reverse
     grid-area:1/1 overlap stack        ->  flex-basis:100% + an equal
                                            negative inline-end margin,
                                            which keeps every layer in
                                            flow so the container stays
                                            as tall as the TALLEST one
     place-items:center                 ->  align-items + justify-content
     justify-self:center                ->  explicit width + auto margin

   The `fr` custom properties the widget prints (`--fn-c1`, `--fn-c2`)
   cannot be fed to `flex-grow` or `calc()`, so `column_weight_css()` in
   includes/class-base-widget.php publishes the same numbers a second
   time without the unit, as `--fn-c1w` / `--fn-c2w`. The pair always
   sums to 2, so `calc((100% - gap) * <w> / 2)` is the track's resolved
   width. The fallbacks below repeat the widget's own default ratio.
   ============================================================ */

@media(max-width:1199.98px){

  /* ---- funnel wrapper: minmax(0,c1) minmax(0,c2) + areas ----
     `.fnstage` is `justify-self:center` under a 620px cap, so it keeps
     its TRACK width as an explicit width and centres inside it with auto
     inline margins. Growing it with `flex-grow` instead would hand the
     space the cap frees back to `.fnleft`, which grid never does. */
  .fnwrap{--fn-gap:clamp(26px,4vw,64px);display:flex;align-items:center}
  .fnwrap>.fnleft{flex:0 1 auto;width:calc((100% - var(--fn-gap)) * var(--fn-c1w,.95) / 2);min-width:0}
  .fnwrap>.fnstage{flex:0 1 auto;width:calc((100% - var(--fn-gap)) * var(--fn-c2w,1.05) / 2);margin-inline:auto}
  .fnwrap[data-swap="yes"]{flex-direction:row-reverse}
  .fnwrap[data-swap="yes"]>.fnleft{width:calc((100% - var(--fn-gap)) * var(--fn-c2w,1.05) / 2)}
  .fnwrap[data-swap="yes"]>.fnstage{width:calc((100% - var(--fn-gap)) * var(--fn-c1w,.95) / 2)}

  /* ---- funnel panels: every panel in cell 1/1 ---- */
  .fnpanels{display:flex;align-items:flex-start}
  .fnpanels>.fnpanel{flex:0 0 100%;min-width:0;margin-inline-end:-100%}

  .fnstep i{display:flex;align-items:center;justify-content:center}
  /* funnel link row: auto 1fr auto */
  .fnlink{display:flex;align-items:center}
  .fnlink .fni,.fnlink u{flex:0 0 auto}
  .fnlink b{flex:1 1 0;min-width:0}
  .fnlink u{display:flex;align-items:center;justify-content:center}
  .fnp{display:flex;align-items:center;justify-content:center}
}

@media(max-width:990.98px){
  /* funnel: one column — head, stage, panels. `.fnleft{display:contents}`
     lifts its two children into this flex container, so the running order
     is restored with `order` instead of grid areas. */
  .fnwrap,.fnwrap[data-swap="yes"]{flex-direction:column;align-items:stretch}
  .fnwrap>.fnleft,.fnwrap[data-swap="yes"]>.fnleft{width:auto}
  .fnhead{order:1;flex:0 0 auto;width:100%}
  /* the full-width stage is restated here because the band rule above targets
     `.fnwrap>.fnstage` (0,2,0) and would otherwise outrank `.fnstage`; the
     funnel is sized on `.fnsvg` itself now, not by squeezing this box */
  .fnwrap>.fnstage,.fnwrap[data-swap="yes"]>.fnstage{order:2;flex:0 0 auto;width:100%;max-width:none;margin-inline:0;align-self:stretch}
  .fnpanels{order:3;flex:0 0 auto;width:100%}
}

/* ============================================================
   TABLET & MOBILE SPACING — tightened with the standard tokens

   With the folds on flexbox, the vertical air the grid rows were
   holding shows up as slack between items and between sections.
   Everything below swaps a hand-written pixel value for the `--space-*`
   step one rung down. No structure, order or horizontal metric changes,
   and every rule is fenced behind `max-width:1199.98px`, so the desktop
   rhythm is untouched.

     between sections   --fold-pad-y     a flat 45px (30px mobile)
                        .section-py-main  the same two values
     between halves     the stacked-fold gaps that were sized for
                        side-by-side columns
     between items      the shared `.twrb-stack` / `.twrb-grid` step
                        (the heading<->content rhythm is NOT tightened
                        here — it comes from the content-spacing tokens,
                        which carry a value of their own per band)

   This block is the *editorial* pass — it picks the step a designer would
   pick. The hard ceiling is a separate, mechanical one: `--sp-cap`, declared
   with the spacing tokens near the top of this file and switched to 40px at
   <=1199.98px and 25px at <=767.98px. Every margin/padding/gap that could
   resolve past it is written `min(var(--sp-cap),<original>)` in place, so the
   two passes compose: this block chooses, the cap bounds. Anything added here
   later should stay at or below the cap (`--space-6` = 32px on tablet,
   `--space-5` = 24px on mobile are the largest safe steps) or be wrapped in
   `min()` like `.sys-grid` below. See docs/spacing-caps-ipad-mobile.md.

   SECTION PADDING IS THE ONE EXCEPTION TO THAT CEILING. The brief is a flat
   45px of top/bottom padding on every section below 1200px, and 30px on
   mobile, so the two section declarations below are written as the bare
   values — not `min(var(--sp-cap),…)` — because the cap (40px / 25px) would
   otherwise clamp both of them. Nothing else in this block changes: the cap
   still bounds every item-level margin, padding and gap.
   See docs/tablet-mobile-full-width.md.
   ============================================================ */

@media(max-width:1199.98px){
  /* section rhythm — a flat 45px top and bottom, above the --sp-cap ceiling
     on purpose (see the note above). `--fold-pad-y` is what `.fold` and the
     widgets that print `padding:var(--fold-pad-y) var(--gutter)` inline both
     read, so one token covers every section built on the fold. */
  :root{--fold-pad-y:45px}
  .section-py-main{padding-block:45px}
  /* TW Growth Engine Funnel is the one fold that prints its own top/bottom
     padding as an inline style on the <section> (clamp(40px,5vw,72px) and
     clamp(30px,3.4vw,48px)) instead of reading `--fold-pad-y`, so the flat
     45px has to be restated for it. `!important` is the only way to outrank
     an inline style — the same reason the >=1600px block below uses it for
     this section. */
  .elementor-widget-twrb_funnel section{padding-top:45px!important;padding-bottom:45px!important}

  /* content rhythm (shared widget system). The heading<->content scale and
     the content->CTA step are NOT restated here any more: they come from
     the `--c-gap` / `--hc-gap` / `--cta-gap` tokens, which already carry
     their own value for every band. Only the structural stacks are
     tightened, and as a `margin-top` rather than a `gap`. */
  .twrb-stack>*+*,.twrb-grid>*+*{margin-top:var(--space-4)} /* was 20px */
  .twrb-combined .cc-row>.cc-media,
  .twrb-combined.cc-reverse .cc-row>.cc-text{margin-top:var(--space-4)} /* was 20px */
}
@media(max-width:991.98px){
  .fsgrid{--fs-gap:var(--space-5)}                          /* was 26px */
}
@media(max-width:991px){
  .fitcols>.fitgrid{margin-top:var(--space-4)}              /* was 20px */
}
@media(max-width:990.98px){
  /* the funnel is the one section still on grid — its stacked gap stays a gap.
     It is also the one section held to "Funnel Section (Standalone).html"
     rather than the page reference, so it keeps that file's own stacked gap
     instead of being normalised onto the --space-* scale like the rules
     around it. */
  .fnwrap,.fnwrap[data-swap="yes"]{gap:clamp(24px,5vw,40px)}
}
@media(max-width:960px){
  .engine-grid:not(.finale)>.engine-copy{margin-top:var(--space-3)} /* was 18px */
  .sys-grid>*+*{margin-top:min(var(--sp-cap),var(--space-7))} /* was clamp(40px,6vw,110px) */
  .connect-grid>*+*{margin-top:var(--space-5)} /* was clamp(24px,4vw,64px) */
}
@media(max-width:900px){
  .dcy>.dcy-list{margin-top:var(--space-5)}                 /* was 28px */
}
@media(max-width:767px){
  /* mobile section rhythm — a flat 30px, also above the --sp-cap ceiling */
  :root{--fold-pad-y:30px}
  .section-py-main{padding-block:30px}
  .elementor-widget-twrb_funnel section{padding-top:30px!important;padding-bottom:30px!important}
  .ntrow>.ntneg,.ntrow>.ntanswer{margin-top:var(--space-6)} /* was clamp(26px,4vw,44px) */
}
@media(max-width:640px){
  .payoffgrid>.payoffcol,
  .payoffgrid[data-swap="yes"]>.payofflines{margin-top:var(--space-6)} /* was clamp(28px,4vw,64px) */
  .payoffgrid[data-swap="yes"]>.payoffcol{margin-top:0}
}

/* ============================================================
   CONTENT SPACING SYSTEM
   (stays after every component block, before the FONT WEIGHT LOCK)

   One scale for every widget in the plugin. The four steps live in
   `:root` at the top of this file and are re-declared at 768px,
   1600px and 1850px, so each figure is written exactly once:

     --c-gap    content -> content (p, ol, ul)   15 / 12 / 15 / 18
     --hc-gap   heading -> content               20 / 16 / 20 / 22
     --cta-gap  content -> CTA                   25 / 22 / 30 / 40
     --col-gap  between COLUMNS only             30 / 26 / 50 / 50

   Two rules govern how those steps are applied, everywhere:

     1. Content is spaced with `margin-top` ONLY. Never `padding-top`
        or `padding-bottom` on a content element, and never a `gap`
        on a content container — `gap` is reserved for the space
        between COLUMNS.
     2. The step always belongs to the element BELOW it, so the first
        item in any block never carries one.

   The `padding-top`/`padding-bottom` zeroing below is the part that
   needs `!important`: themes and Elementor's global kit both style
   bare `p`/`h1`-`h6`/`ul`/`ol`/`li` at specificities this sheet
   cannot outrank from a class selector (`.elementor-kit-N p`,
   `body .entry-content p`, …), and those paddings would otherwise
   sit on top of the scale. It is scoped to this plugin's widgets
   (`[class*="elementor-widget-twrb_"]`, plus the header builder's
   `.twhb` root), so nothing outside them is touched.

   Deliberately NOT zeroed, because none of them is a content
   element: section/fold padding (`--fold-pad-y`, `.section-py-main`,
   `.halofold`, `.flinks`), tap targets and hover bridges on
   controls (`.btn`, `.tmmore`, `.twhb-phone`), tile lanes
   (`.revrow`), and
   everything inside TW Growth Engine Funnel, which is out of scope.
   ============================================================ */

/* 1 — no vertical padding on a content element. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"],.twhb) :is(p,ul,ol,li,h1,h2,h3,h4,h5,h6,.widget-content,.twrb-rich,.widget-heading){
  padding-top:0!important;
  padding-bottom:0!important;
}

/* 2 — the scale, as `margin-top` on the element below the step.

   These apply to the PROSE TIER — the blocks the editor authors: the
   `.widget-heading` / `.widget-content` pair, and any WYSIWYG value
   rendered into `.twrb-rich`. The bespoke section components
   (`.eng-title`, `.fservices h4`, `.ntlead`, …) keep their own
   hand-tuned rhythm; re-stating the scale on every `h1`-`h6` in the
   plugin would land on top of the `margin-bottom` those components
   already carry and double every one of those steps, which the brief
   rules out ("no visual regressions to the existing layouts"). */

/* heading -> content */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"],.twhb) .widget-heading + :is(p,ul,ol,.widget-content,.twrb-rich),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-rich :is(h1,h2,h3,h4,h5,h6) + :is(p,ul,ol){
  margin-top:var(--hc-gap);
}

/* content -> content (p, ol, ul) */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"],.twhb) :is(.widget-content,.twrb-rich) + :is(.widget-content,.twrb-rich),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(.widget-content,.twrb-rich) :is(p,ul,ol) + :is(p,ul,ol){
  margin-top:var(--c-gap);
}

/* content -> CTA (the button wrapper the widgets print, or a marked CTA
   block). A bare `.btn` that a bespoke component places itself keeps that
   component's own step. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"],.twhb) :is(p,ul,ol,.widget-content,.twrb-rich) + :is(.twrb-btn-wrap,.cc-cta,.twrb-cta){
  margin-top:min(var(--sp-cap),var(--cta-gap));
}
/* …and a heading closing a block above a CTA takes the same step. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"],.twhb) .widget-heading + :is(.twrb-btn-wrap,.cc-cta,.twrb-cta){
  margin-top:min(var(--sp-cap),var(--cta-gap));
}

/* ============================================================
   FONT WEIGHT LOCK (must stay after every component block; only
   the REFERENCE TYPE & COLOUR LOCK, the MENU ACTIVE STATE and the
   >=1600px REFERENCE SPACING block may follow it — none of the
   three declares a font-weight)

   Every weight in this project comes from the type tokens above
   (`--fw-light` 300 … `--fw-bold` 700). Themes and Elementor's
   global kit style bare elements and headings —
   `.elementor-kit-N h2{font-weight:…}` (0,1,1),
   `body/.elementor-kit-N{font-weight:…}` (inherited),
   `p`, `a`, `strong`, `button`, `label`, form controls — and those
   rules were outranking the single-class component rules declared
   earlier in this file, so copy rendered at the theme's weight.

   This block re-asserts the SAME weights already declared above,
   at a specificity + `!important` the theme cannot outrank, and
   nothing else: no size, colour, family or spacing is touched.
   Everything is scoped to this plugin's widgets, so no weight
   leaks to the rest of the site. The scope is written as
   `:is([class*="elementor-widget-twrb_"] .elementor-widget-container,
        [class*="elementor-widget-twrb_"])`
   so it holds both with the normal Elementor wrapper and with
   Elementor's "Optimized Markup" experiment on (which drops
   `.elementor-widget-container` entirely).

   Four layers, each one only reached when the layer above does
   not apply to that element:
     1. inline weights the widgets print   [style*=…]  (0,3,0)
     2. component classes, grouped by weight          (0,5,1)+
     3. bare element defaults                         (0,3,1)
     4. container inheritance (everything un-set)     —
   Layers 2 and 3 are the more specific selectors, so they are
   fenced off with `:not([style*="font-weight"])`: an element the
   widget gave an inline weight is skipped by them entirely and
   falls to layer 1, which re-states that same inline value at
   `!important` so a theme's own `!important` cannot beat it.
   Within layer 2 a class list always outranks layer 3's bare
   element selectors, so `.eng-pts li` stays Medium while a plain
   `li` is Regular.

   Display type: Bebas Neue is a SINGLE-weight family, so anything
   set in `--font-display` must ask for 400 — a heading left at the
   browser's default `bold` gets a SYNTHESISED (smeared) bold
   instead of a real face. The earlier pin at the top of this file
   covered most display classes but missed `.widget-heading`,
   `.ecard h1`, `.ecard .estat b`, `.eng-step`, `.mtile .mv`,
   `.step .snum` and `.fnlink .fni`; they are pinned to 400 here
   with the rest. `font-synthesis-weight:none` backs that up — if
   any weight ever goes unmatched the browser picks the nearest
   real face rather than faking one.
   ============================================================ */

/* --- inheritance root: un-set text is Poppins Regular, never the theme's ---
   The e-commerce family (`twrb_ec_*`) is exempted from this lock throughout,
   with the same zero-specificity `:where(:not([class*="twrb_ec"])…)` guard the
   FAMILY and COLOUR locks already carry — see the note at the end of the
   block. `font-synthesis-weight:none` goes with it: that switch exists for
   single-weight Bebas Neue, and the landing page's Archivo is a VARIABLE face
   covering 400–900, so every weight it asks for is a real instance. */
[class*="elementor-widget-twrb_"] > .elementor-widget-container:where(:not([class*="twrb_ec"] *)),
[class*="elementor-widget-twrb_"]:where(:not([class*="twrb_ec"])){
  font-weight:var(--fw-regular)!important;
  /* weight synthesis only — `font-synthesis:none` would also switch off
     italic synthesis, and no italic face is bundled, so `<em>` would stop
     leaning. Inherited, so it covers every descendant. */
  font-synthesis-weight:none;
}

/* --- layer 3: bare elements (theme rules target these directly, so
       inheritance alone cannot defend them) --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(p,li,dt,dd,blockquote,figcaption,address,caption,td,th,label,small,a,button,input,select,textarea,option,summary):not([style*="font-weight"]):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)){
  font-weight:var(--fw-regular)!important;
}
/* headings and `b`/`strong` keep the browser's own default — 700, which is a
   real Poppins face — unless a component class below says otherwise.
   The `twrb_ec` guard matters most here: the landing page's titles are
   `<h1 class="ec-hero__h1 ec-h1">` / `<h2 class="ec-h2">`, and the reference
   sets them in Archivo at **900**. This rule's `!important` 700 beat that
   plain two-class declaration, which is why they read a notch light. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(h1,h2,h3,h4,h5,h6,b,strong):not([style*="font-weight"]):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)){
  font-weight:var(--fw-bold)!important;
}

/* --- layer 2: component classes, grouped by the weight they declare --- */

/* 400 — the display ramp (single-weight Bebas) plus the body-font
   components the source explicitly pins to Regular */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(
  .tw-display,.solidword,.ghostword,.dcy-verdict,.dcy-word,.dcy-note,.fitwarn,.fitlabel,
  .fnpanel h3,.pillar b,.alabel,.heroh1,.eng-title,.haloword,.stat-num,.pnum,
  .astepnum,.fnlink b,.widget-heading:not(.heading-body),.ecard h1,.ecard .estat b,
  .eng-step,.mtile .mv,.step .snum,.fnlink .fni
):not([style*="font-weight"]){
  font-weight:var(--fw-regular)!important;
}

/* 500 — Medium */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(
  .ecard .esub,.eng-pts li,.fnav a
):not([style*="font-weight"]){
  font-weight:var(--fw-medium)!important;
}

/* 600 — SemiBold: every eyebrow, label, card title and button */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(
  .tw-eyebrow,.btn,
  .cchip,.eng-head,.engine-hint,.chchip,.mtile .ml,.finlbl,.ccap,.ntlead,.ntitem b,
  .ocitem b,.igp-h,.igp-cap b,.tflabel,.staytag,.fnstep,.tmava,.tmmore,.fititem,.plabel,
  .fservices h4,.fsgrid h5,.fright h5,.foot-grid h4,.fphone .fpl b,
  .widget-heading.heading-body,.tw-acc-q,
  .twrb-cf7 .wpcf7-form label,
  .twrb-cf7 .wpcf7-form input[type=submit],
  .twrb-cf7 .wpcf7-form button[type=submit]
):not([style*="font-weight"]){
  font-weight:var(--fw-semibold)!important;
}

/* 700 — Bold */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(
  .ecard .eyebrow,.igp-av,.igp-badge,.dcy-head,.dcy-cap,.pcue,.fnstep i,.fcname,.dcal b
):not([style*="font-weight"]){
  font-weight:var(--fw-bold)!important;
}

/* form fields inside the CF7 card take the body weight (browsers do not
   inherit font properties into form controls) */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form :is(input,select,textarea):not([type=submit]):not([style*="font-weight"]){
  font-weight:var(--fw-regular)!important;
}

/* --- layer 1: inline weights printed by the widgets / typed by an editor.
       Matched on the style attribute itself so the declared value is simply
       re-stated at `!important` — with and without the space after the colon,
       since the WYSIWYG editor writes `font-weight: 600`. --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight:300"],
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight: 300"]{ font-weight:var(--fw-light)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight:400"],
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight: 400"]{ font-weight:var(--fw-regular)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight:500"],
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight: 500"]{ font-weight:var(--fw-medium)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight:600"],
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight: 600"]{ font-weight:var(--fw-semibold)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight:700"],
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-weight: 700"]{ font-weight:var(--fw-bold)!important; }

/* ------------------------------------------------------------
   E-COMMERCE WEIGHT EXEMPTION — why `twrb_ec` is guarded above

   `--fw-light` … `--fw-bold` is the Poppins ramp: 300/400/500/600
   /700, and 400 for single-weight Bebas Neue. The e-commerce
   landing-page family does not use it. `techwyse-ecom.css` ships
   its own variable Archivo (400–900) plus IBM Plex Mono, and the
   reference asks Archivo for weights this ramp does not contain —
   `.ec-h1`/`.ec-h2`/`.ec-hero__h1` at **900**, `.ec-btn` and
   `.ec-head__pnum` at 800, `.ec-head__link` at 600 — as plain one-
   and two-class declarations with no `!important`.

   So every one of them lost to this lock: layer 3 rounded the
   titles down to 700 and flattened the buttons and nav links to
   400, which is the "titles look a little different" symptom. The
   guard rides on the inheritance root and on both layer-3 rules —
   the only ones whose selectors can reach an `ec-` element; layer
   2 names Poppins-ramp component classes only and never matched
   the family in the first place, and layer 1 only re-states an
   inline weight, which these widgets never print.

   `:where()` adds no specificity, so every other widget keeps the
   identical declaration at the identical rank and source position.
   ------------------------------------------------------------ */

/* ============================================================
   REFERENCE TYPE & COLOUR LOCK
   (stays after the FONT WEIGHT LOCK, before the MENU ACTIVE STATE)

   Sibling of the FONT WEIGHT LOCK above, for the four remaining
   typographic properties: `font-family`, `color`, `letter-spacing`
   and `line-height`. Sizes are already pinned by the GLOBAL TYPE &
   BUTTON SCALE and weights by the FONT WEIGHT LOCK, so between the
   three blocks every property named in the reference is now held.

   Why it is needed. Every value below is ALREADY declared earlier
   in this file with the reference's own number — nothing here is a
   new design decision, and a rule-for-rule comparison against the
   reference stylesheet found no value differences. What was missing
   was rank. A per-section widget has no outer page wrapper, so:

     * the Elementor global kit styles bare elements directly —
       `.elementor-kit-N h2{font-family;color;line-height;
       letter-spacing}` is (0,1,1) and beats this file's
       single-class component rules at (0,1,0);
     * `.elementor-kit-N a{color}` and a theme's own `.entry-content
       p`, `h2`, `li`, `strong` rules beat them the same way;
     * anything relying on INHERITANCE (the THEME ISOLATION block's
       container `font-family`/`color`) loses to any element-level
       theme rule, because a direct match always beats an inherited
       value regardless of specificity.

   That is the reported symptom: the family reading slightly off in
   places (the theme's own Poppins or its body stack winning the
   element match) and sections rendering the theme's text colour
   instead of the reference's.

   Three layers, each reached only when the one above does not apply:

     1. the two inline families the widgets print, re-stated at
        `!important` so even a theme's `!important` loses;
     2. every component rule in this file's own source region, in
        that region's ORDER, so hover/state/media-query variants
        keep beating their own base rule exactly as before;
     3. the bare elements — `font-family` back to the reference's
        own `var(--font-body)` token, `letter-spacing`/`line-height`
        back to `inherit`, `color` back to `inherit` and `a` back to
        the reference's `var(--tw-cobalt-700)`.
        This is the layer that unseats `.elementor-kit-N h2` and
        friends; once they are gone, normal inheritance and layer 2
        produce the reference's values.

   `font-family` deliberately does NOT use `inherit` in layer 3 (nor
   in the two blocks that follow this one). `inherit!important` takes
   whatever the parent resolved to, so any display-face element a
   layer-2 rule happened to skip — every one of them is guarded with
   `:not([style*="line-height"])` and friends, and several widgets
   print exactly those inline — silently rendered in the parent's
   body face instead of Bebas. Naming the token states the value
   outright, and a DISPLAY-FACE GUARD (a zero-specificity `:where()`
   listing the display ramp and everything nested inside it) keeps
   the body token away from the elements that must stay on
   `--font-display`. Both are written out at each rule below.

   Layer 2's selectors are class-based (0,3,0 and up with the scope)
   and layer 3's are element-based (0,2,1), so layer 2 always wins
   where both match — `.eng-pts li` keeps its colour while a plain
   `li` inherits.

   Everything carries `:not([style*="<property>"])`, so an inline
   value a widget prints — including anything typed into an Elementor
   style control — is skipped by the lock entirely and still wins.

   Deliberately NOT covered, because each already has a dedicated
   lock earlier in this file that would otherwise be duplicated or
   contradicted here: `.btn` (BUTTON LOCK) and `tel:` links (TEL LINK
   LOCK). `html`, `body`, `*` and `:root` rules are skipped too — the
   lock must not reach outside this plugin's widgets.

   The header-builder widget is excluded via a zero-specificity
   `:where(:not([class*="twhb"]):not([class*="twhb"] *))` on layer 3
   and on the bare-`a` colour: that widget ships its own stylesheet
   (`techwyse-header-builder.css`) whose colours are plain
   declarations, and an `!important` here would erase all of them.
   `:where()` contributes nothing to specificity, so the guard costs
   the rest of the cascade nothing.

   The e-commerce landing-page family (`twrb_ec_*`) is excluded
   from the COLOUR declarations for the same reason, through the
   matching guard
   `:where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *))` —
   see the E-COMMERCE COLOUR EXEMPTION note under THEME ISOLATION
   for why the colours specifically, and what it fixes.
   ============================================================ */

/* --- layer 1: the families the widgets print inline, re-stated --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-family:var(--font-display)"]{font-family:var(--font-display)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) [style*="font-family:var(--font-body)"]{font-family:var(--font-body)!important;}

/* --- layer 2: component classes, in this stylesheet's own source order ---
   The link rule below opens the layer because it is the `a` rule the source
   declares beside the bare `a{color}` that layer 3 restores. It carries a
   zero-specificity `:where()` exclusion — `.btn`, whose every state
   belongs to the BUTTON LOCK, and the header-builder subtree, which styles
   its own links from `techwyse-header-builder.css`. `:where()` matches
   without adding specificity, so each rule keeps exactly the rank it has in
   the source and the rules under it are unaffected. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) a:not([href*="tel:" i]):hover:not([style*="color"]):where(:not(.btn)):where(:not([class*="twhb"]):not([class*="twhb"] *)):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)){color:var(--tw-green-700)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-display:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]){font-family:var(--font-display)!important;line-height:.92!important;letter-spacing:.01em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-display:not([style*="letter-spacing"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .solidword:not([style*="letter-spacing"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-verdict:not([style*="letter-spacing"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fitwarn:not([style*="letter-spacing"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnpanel h3:not([style*="letter-spacing"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pillar b:not([style*="letter-spacing"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .alabel:not([style*="letter-spacing"]){letter-spacing:.018em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ghostword:not([style*="letter-spacing"]){letter-spacing:.028em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow:not([style*="letter-spacing"]):not([style*="line-height"]){letter-spacing:.14em!important;line-height:1!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .eyebrow:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-body)!important;line-height:1!important;letter-spacing:.2em!important;color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard h1:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.92!important;letter-spacing:.01em!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .esub:not([style*="color"]){color:rgba(255,255,255,.82)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .estat b:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:1!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .estat span:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.55)!important;line-height:1.35!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .earrow:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .earrow:hover:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .stat-num:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]){font-family:var(--font-display)!important;line-height:.9!important;letter-spacing:.01em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-step:not([style*="font-family"]):not([style*="color"]):not([style*="letter-spacing"]){font-family:var(--font-display)!important;color:var(--tw-green-500)!important;letter-spacing:.1em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-title:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.9!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-head:not([style*="color"]):not([style*="line-height"]){color:#fff!important;line-height:1.3!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-desc:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.66)!important;line-height:1.6!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-pts li:not([style*="color"]){color:rgba(255,255,255,.88)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .engine-hint:not([style*="color"]):not([style*="letter-spacing"]){color:rgba(255,255,255,.5)!important;letter-spacing:.18em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .chchip:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .mtile .mv:not([style*="font-family"]):not([style*="color"]):not([style*="line-height"]){font-family:var(--font-display)!important;color:#fff!important;line-height:1!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .mtile .ml:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:.1em!important;color:rgba(255,255,255,.5)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .finlbl:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .step .snum:not([style*="font-family"]):not([style*="color"]){font-family:var(--font-display)!important;color:var(--tw-ink-300)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .step.step-active .snum:not([style*="color"]){color:var(--tw-green-600)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ccap:not([style*="color"]):not([style*="font-family"]):not([style*="letter-spacing"]){color:#fff!important;font-family:var(--font-body)!important;letter-spacing:var(--label-tracking)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .astepnum:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:1.12!important;color:color-mix(in oklch,#8CC63E 22%,transparent)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .astep.astep-on .astepnum:not([style*="color"]){color:color-mix(in oklch,#8CC63E 34%,transparent)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .anode:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .alabel:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:1!important;letter-spacing:.01em!important;color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .logomq-track a:not([style*="line-height"]){line-height:0!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ntlead:not([style*="font-family"]):not([style*="color"]):not([style*="letter-spacing"]){font-family:var(--font-body)!important;color:var(--tw-ink-500)!important;letter-spacing:.01em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ntitem .ico:not([style*="color"]){color:var(--tw-ink-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ntitem:hover .ico:not([style*="color"]){color:var(--tw-green-700)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ntitem b:not([style*="color"]){color:var(--tw-ink-800,#2a3140)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ghostword:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.9!important;letter-spacing:.02em!important;color:transparent!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .solidword:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.9!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ocitem b:not([style*="color"]):not([style*="line-height"]){color:#fff!important;line-height:1.25!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ocitem small:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.55)!important;line-height:1.4!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ghostink:not([style*="color"]){color:transparent!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp:not([style*="font-family"]){font-family:var(--font-body)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp-av:not([style*="color"]):not([style*="letter-spacing"]){color:#fff!important;letter-spacing:.02em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp-h:not([style*="color"]):not([style*="line-height"]){color:var(--tw-ink-900)!important;line-height:1.1!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp-dots:not([style*="color"]):not([style*="letter-spacing"]):not([style*="line-height"]){color:var(--tw-ink-400)!important;letter-spacing:1px!important;line-height:1!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp-badge:not([style*="color"]):not([style*="letter-spacing"]){color:#fff!important;letter-spacing:.1em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp-acts:not([style*="color"]){color:var(--tw-ink-800,#2a3140)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp-cap:not([style*="line-height"]):not([style*="color"]){line-height:1.4!important;color:var(--tw-ink-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .igp-cap b:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .haloword:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.82!important;letter-spacing:.02em!important;color:transparent!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .halodots.l:not([style*="color"]){color:var(--tw-cobalt-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .halodots.r:not([style*="color"]){color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tflabel:not([style*="letter-spacing"]):not([style*="line-height"]){letter-spacing:.01em!important;line-height:1.2!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tfarrow:not([style*="color"]){color:var(--tw-ink-300)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-head:not([style*="font-family"]):not([style*="letter-spacing"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-body)!important;letter-spacing:.01em!important;line-height:1.12!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-cap:not([style*="letter-spacing"]){letter-spacing:.14em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-cap.l:not([style*="color"]){color:var(--tw-cobalt-200)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-cap.r:not([style*="color"]){color:color-mix(in srgb,var(--state-danger) 78%,#fff)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-word:not([style*="font-family"]):not([style*="letter-spacing"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;letter-spacing:.015em!important;line-height:.98!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-note:not([style*="font-family"]):not([style*="letter-spacing"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;letter-spacing:.02em!important;line-height:.98!important;color:var(--state-danger)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-note .x:not([style*="color"]){color:var(--state-danger)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-verdict:not([style*="font-family"]):not([style*="letter-spacing"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;letter-spacing:.01em!important;line-height:.9!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-verdict .headmark:not([style*="color"]){color:var(--tw-green-500)!important;}
@media(prefers-reduced-motion:reduce){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .reveal-in .dcy-word:not([style*="letter-spacing"]){letter-spacing:.03em!important;}
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pillar .pico2:not([style*="color"]){color:var(--pico-fg,#fff)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pillar:hover .pico2:not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pillar:focus-visible .pico2:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pillar b:not([style*="font-family"]):not([style*="letter-spacing"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;letter-spacing:.02em!important;line-height:.96!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pillar small:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.7)!important;line-height:1.62!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pcue:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:.1em!important;color:var(--pcue-col,#fff)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .staytag:not([style*="color"]){color:var(--tw-ink-900)!important;}
@media(max-width:767px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .staytag:not([style*="line-height"]){line-height:1.2!important;}
}
@media(max-width:990.98px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fntab:not([style*="color"]):not([style*="letter-spacing"]){color:#fff!important;letter-spacing:.05em!important;}
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fntab i:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:0!important;color:#fff!important;}
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fntab.on i:not([style*="color"]){color:#0A0D12!important;}
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnstep:not([style*="font-family"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-body)!important;letter-spacing:.16em!important;color:rgba(255,255,255,.55)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnstep i:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:0!important;color:#0A0D12!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnpanel h3:not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){line-height:1!important;letter-spacing:.01em!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnpanel h3 em:not([style*="color"]){color:var(--fc,#8CC63E)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([style*="font-family"]):not([style*="color"]){font-family:var(--font-body)!important;color:rgba(255,255,255,.8)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) a.fnlink:not([href*="tel:" i]):hover:not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) a.fnlink:not([href*="tel:" i]):focus-visible:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink .fni:not([style*="font-family"]):not([style*="letter-spacing"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;letter-spacing:.08em!important;line-height:1!important;color:rgba(255,255,255,.32)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):hover .fni:not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):focus-visible .fni:not([style*="color"]){color:var(--fc,#8CC63E)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink u:not([style*="line-height"]):not([style*="color"]){line-height:1!important;color:rgba(255,255,255,.5)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):hover u:not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnlink:not([href*="tel:" i]):focus-visible u:not([style*="color"]){color:#0A0D12!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fncap:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-body)!important;line-height:1.55!important;color:rgba(255,255,255,.5)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tmcard p:not([style*="line-height"]):not([style*="color"]){line-height:1.75!important;color:var(--text-body)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tmava:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .stars:not([style*="color"]):not([style*="letter-spacing"]){color:#FBBC05!important;letter-spacing:.1em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tmmore:not([style*="font-family"]):not([style*="color"]):not([style*="letter-spacing"]){font-family:var(--font-body)!important;color:var(--tw-cobalt-700)!important;letter-spacing:.01em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tmmore:hover:not([style*="color"]){color:var(--tw-green-700)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fitlabel:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:1.02!important;letter-spacing:.02em!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fitlabel em:not([style*="color"]){color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fitlight .fitwarn:not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fitlight .fitlabel:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fitlight .solidword:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fitwarn:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.9!important;letter-spacing:.01em!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fititem:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fititem .fchk:not([style*="color"]){color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fititem:hover .fchk:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .pnum:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.95!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .plabel:not([style*="color"]):not([style*="line-height"]){color:#fff!important;line-height:1.2!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .psub:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.55)!important;line-height:1.3!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks a:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.68)!important;line-height:1.45!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks a:not([href*="tel:" i]):hover:not([style*="color"]){color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fservices h4:not([style*="color"]):not([style*="letter-spacing"]){color:#fff!important;letter-spacing:.01em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fsgrid h5:not([style*="color"]):not([style*="letter-spacing"]):not([style*="line-height"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fright h5:not([style*="color"]):not([style*="letter-spacing"]):not([style*="line-height"]){color:var(--tw-green-500)!important;letter-spacing:.06em!important;line-height:1.3!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fcname:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:.14em!important;color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fphone .fpico:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fphone .fpl:not([style*="line-height"]){line-height:1.15!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fphone .fpl small:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:.16em!important;color:rgba(255,255,255,.6)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fphone .fpl b:not([style*="color"]):not([style*="letter-spacing"]){color:#fff!important;letter-spacing:.02em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .faddr:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.72)!important;line-height:1.5!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .faddr .faico:not([style*="color"]){color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .faddr small:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:.16em!important;color:rgba(255,255,255,.5)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fbar:not([style*="color"]){color:rgba(255,255,255,.5)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .foot-grid h4:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:var(--label-tracking)!important;color:var(--tw-green-500)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .foot-grid a:not([style*="color"]){color:rgba(255,255,255,.72)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .foot-grid a:not([href*="tel:" i]):hover:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .social a:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .social a:not([href*="tel:" i]):hover:not([style*="color"]){color:var(--tw-ink-900)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcal b:not([style*="color"]):not([style*="line-height"]){color:#fff!important;line-height:1.25!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcal span:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.66)!important;line-height:1.5!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-step:not([style*="font-family"]):not([style*="color"]):not([style*="letter-spacing"]){font-family:var(--font-display)!important;color:var(--tw-green-500)!important;letter-spacing:.1em!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-title:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:.9!important;color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-head:not([style*="color"]):not([style*="line-height"]){color:#fff!important;line-height:1.3!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-desc:not([style*="color"]):not([style*="line-height"]){color:rgba(255,255,255,.66)!important;line-height:1.6!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .eng-pts li:not([style*="color"]){color:rgba(255,255,255,.88)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .chchip:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .mtile .mv:not([style*="font-family"]):not([style*="color"]):not([style*="line-height"]){font-family:var(--font-display)!important;color:#fff!important;line-height:1!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .mtile .ml:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:.1em!important;color:rgba(255,255,255,.5)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .finlbl:not([style*="color"]){color:#fff!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-heading:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]):not([style*="color"]){font-family:var(--font-display)!important;line-height:var(--display-lh,.92)!important;letter-spacing:var(--display-tracking,.01em)!important;color:var(--text-heading)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-heading.heading-body:not([style*="font-family"]):not([style*="line-height"]):not([style*="letter-spacing"]){font-family:var(--font-body)!important;line-height:var(--heading-lh,1.15)!important;letter-spacing:0!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-heading.heading-ink:not([style*="color"]){color:var(--text-heading)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-heading.heading-cobalt:not([style*="color"]){color:var(--tw-cobalt-700)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-heading.heading-green:not([style*="color"]){color:var(--tw-green-600)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-heading.heading-white:not([style*="color"]){color:var(--text-inverse)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-content:not([style*="font-family"]):not([style*="line-height"]):not([style*="color"]){font-family:var(--font-body)!important;line-height:var(--body-lh,1.65)!important;color:var(--text-body)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-card.card-dark:not([style*="color"]){color:var(--text-inverse)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-card.card-dark .widget-heading:not([style*="color"]){color:var(--text-inverse)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .widget-card.card-dark .widget-content:not([style*="color"]){color:rgba(255,255,255,.72)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-acc-q:not([style*="line-height"]):not([style*="color"]){line-height:1.4!important;color:var(--text-heading)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-acc-a:not([style*="line-height"]):not([style*="color"]){line-height:var(--body-lh,1.65)!important;color:var(--text-body)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form label:not([style*="letter-spacing"]):not([style*="color"]){letter-spacing:.04em!important;color:var(--text-heading)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form input[type=text]:not([style*="font-family"]):not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form input[type=email]:not([style*="font-family"]):not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form input[type=tel]:not([style*="font-family"]):not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form input[type=url]:not([style*="font-family"]):not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form select:not([style*="font-family"]):not([style*="color"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form textarea:not([style*="font-family"]):not([style*="color"]){font-family:var(--font-body)!important;color:var(--text-heading)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form input[type=submit]:not([style*="color"]):not([style*="font-family"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7 .wpcf7-form button[type=submit]:not([style*="color"]):not([style*="font-family"]){color:var(--tw-ink-900)!important;font-family:var(--font-body)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .twrb-cf7-placeholder:not([style*="color"]){color:var(--text-muted)!important;}

/* --- layer 3: the bare elements a theme or the Elementor kit styles direct --- */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) a:not([style*="color"]):where(:not([class*="twhb"]):not([class*="twhb"] *)):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)){color:var(--tw-cobalt-700)!important;}
/* `font-family` names the BODY TOKEN here, never `inherit`: an
   `inherit!important` on this list took its value from whatever the parent
   happened to resolve to, so any display-face element this lock's own
   component rules skipped — one carrying an inline `line-height`/
   `letter-spacing`/`color`, which several widgets print — was flattened to the
   parent's face instead of Bebas. The DISPLAY-FACE GUARD below keeps the
   token off the display ramp and off everything inside it (zero specificity,
   so nothing else about the rule's rank changes); those elements are pinned to
   `--font-display` by layer 2 above and simply inherit that face downwards. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,span,b,strong,em,i,u,s,small,sup,sub,mark,cite,q,abbr,time,address,figcaption,blockquote,div,td,th,caption,label,legend,summary,figure,button,input,select,textarea,optgroup,option,a):not([style*="font-family"]):where(:not([class*="twhb"]):not([class*="twhb"] *)):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)):where(:not(:is(.tw-display,.ecard h1,.ecard .estat b,.stat-num,.eng-step,.eng-title,.mtile .mv,.step .snum,.astepnum,.alabel,.ghostword,.solidword,.haloword,.dcy-word,.dcy-note,.dcy-verdict,.pillar b,.fnlink .fni,.fitlabel,.fitwarn,.pnum,.widget-heading,[style*="font-family:var(--font-display)"])):not(:is(.tw-display,.ecard h1,.ecard .estat b,.stat-num,.eng-step,.eng-title,.mtile .mv,.step .snum,.astepnum,.alabel,.ghostword,.solidword,.haloword,.dcy-word,.dcy-note,.dcy-verdict,.pillar b,.fnlink .fni,.fitlabel,.fitwarn,.pnum,.widget-heading,[style*="font-family:var(--font-display)"]) *)){font-family:var(--font-body)!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,span,b,strong,em,i,u,s,small,sup,sub,mark,cite,q,abbr,time,address,figcaption,blockquote,div,td,th,caption,label,legend,summary,figure):not([style*="color"]):where(:not([class*="twhb"]):not([class*="twhb"] *)):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)){color:inherit!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,span,b,strong,em,i,u,s,small,sup,sub,mark,cite,q,abbr,time,address,figcaption,blockquote,div,td,th,caption,label,legend,summary,figure,button,input,select,textarea,optgroup,option,a):not([style*="letter-spacing"]):where(:not([class*="twhb"]):not([class*="twhb"] *)):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)){letter-spacing:inherit!important;}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,span,b,strong,em,i,u,s,small,sup,sub,mark,cite,q,abbr,time,address,figcaption,blockquote,div,td,th,caption,label,legend,summary,figure,a):not([style*="line-height"]):where(:not([class*="twhb"]):not([class*="twhb"] *)):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)){line-height:inherit!important;}

/* ============================================================
   FONT FAMILY LOCK — the container elements
   (stays right after the REFERENCE TYPE & COLOUR LOCK it extends)

   One family across every widget is the whole point of the locks
   above: the two tokens, `--font-display` and `--font-body`, and
   nothing else. Layer 3 sends the TEXT elements back to `inherit`
   so a theme cannot match them directly — but `inherit` only ends
   up on the right family if the element it inherits FROM is on the
   right family too, and layer 3's list is text elements only. The
   structural elements that carry them are not in it:

     * `<ul>/<ol>/<dl>` wrap every checklist, menu and link list —
       a theme's `.entry-content ul{font-family:…}` still won, and
       each `<li>` inside it dutifully inherited the theme's face;
     * `<section>` is the outer element of EVERY widget's markup;
     * `<nav>/<header>/<footer>` carry the menus and the footer;
     * `<form>/<fieldset>` wrap the CF7 fields, whose own
       `font-family:inherit` then read from the theme;
     * `<table>/<thead>/<tbody>/<tr>` do the same for `<td>/<th>`.

   So this block is layer 3 for those elements, `font-family` only
   — no colour, no line-height, no letter-spacing. Nothing else
   about them changes, and because family is the only property, the
   header-builder subtree does NOT need the `:where(:not([class*=
   "twhb"])…)` exclusion the rest of the lock carries (that guard
   exists to protect that widget's own COLOURS; its families are
   pinned by the family lock in `techwyse-header-builder.css`, at a
   specificity above this block).

   Same rank and same guard style as layer 3 — (0,2,1) with
   `!important`, and `:not([style*="font-family"])` so an inline
   family a widget or an editor prints still wins. Every component
   rule in this file that names a family is restated at
   `!important` in the lock region above, so this rule can never
   reach past a real design value to the wrong face. The value is
   the `--font-body` token and the DISPLAY-FACE GUARD rides along,
   for the reason given at the head of the lock: these structural
   elements carry text, and an `inherit!important` on them handed
   the parent's resolved face to anything the display rules skipped.

   ⚠ The e-commerce family (`twrb_ec_*`) IS excluded here, with the
   same zero-specificity `:where(:not([class*="twrb_ec"])…)` guard
   layer 3 above already carries. That family ships its own
   complete stylesheet (`techwyse-ecom.css`, Archivo + IBM Plex
   Mono) whose families are plain one- and two-class declarations,
   so an `!important` here beat every one of them. Layer 3's own
   guard covers the TEXT elements, which is why the landing page's
   `<h1>`/`<h2>`/`<p>` kept Archivo — but its eyebrow is a
   `<div class="ec-eyebrow">` and its sections are `<section>`, and
   those are in THIS rule's list, so the reference's IBM Plex Mono
   eyebrow was rendering in Poppins. `:where()` costs no
   specificity: every other widget keeps the identical declaration
   at the identical rank and source position.
   ============================================================ */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(section,article,aside,nav,header,footer,main,hgroup,div,ul,ol,dl,menu,form,fieldset,table,thead,tbody,tfoot,tr,colgroup,details,picture,code,pre,kbd,samp,var,ins,del,output,data,bdi,bdo):not([style*="font-family"]):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)):where(:not(:is(.tw-display,.ecard h1,.ecard .estat b,.stat-num,.eng-step,.eng-title,.mtile .mv,.step .snum,.astepnum,.alabel,.ghostword,.solidword,.haloword,.dcy-word,.dcy-note,.dcy-verdict,.pillar b,.fnlink .fni,.fitlabel,.fitwarn,.pnum,.widget-heading,[style*="font-family:var(--font-display)"])):not(:is(.tw-display,.ecard h1,.ecard .estat b,.stat-num,.eng-step,.eng-title,.mtile .mv,.step .snum,.astepnum,.alabel,.ghostword,.solidword,.haloword,.dcy-word,.dcy-note,.dcy-verdict,.pillar b,.fnlink .fni,.fitlabel,.fitwarn,.pnum,.widget-heading,[style*="font-family:var(--font-display)"]) *)){font-family:var(--font-body)!important;}

/* ============================================================
   MENU ACTIVE STATE — the menu entry for the page being viewed.

   The TW Header (Builder) styles its own active states from
   `techwyse-header-builder.css`, in its own `.twhb-` namespace. What is left
   here is the treatment for the footer's link lists, which until now had no
   active state at all. The widgets are what decide which link is current;
   each one also prints its own scoped overrides when the Menu Active State
   controls have been used.

   Each colour deliberately matches the hover colour the same link already
   had, so an active link that is also hovered never flickers between two
   different colours. The block sits last in the file so it wins its ties.

   The colours are `!important` because the REFERENCE TYPE & COLOUR LOCK above
   has to re-state every resting link colour at `!important` to get past the
   theme; a plain declaration here, however specific, would lose to it.
   ============================================================ */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks a.is-current,
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnav a.is-current{
  color:var(--tw-green-500)!important;
}

/* ============================================================
   >=1600px REFERENCE SPACING
   (stays last — it only re-states spacing, never type or colour)

   Above 1600px the page must match the reference's spacing exactly.
   A declaration-level comparison of every `gap`, `row-gap`,
   `column-gap`, `margin*` and `padding*` at that width found only
   the items below; everything else already matches, either
   literally or through an equivalence this build documents:

     * `min(var(--sp-cap), X)` resolves to X here — `--sp-cap` is
       1000px on desktop and only engages at 1199.98px and below
       (docs/spacing-caps-ipad-mobile.md);
     * a reference `gap` that became `column-gap` + a per-child
       `margin-top`, and a reference `padding` that became child
       margins with `:first-child`/`:last-child` resets
       (docs/grid-to-flex-tablet-mobile.md);
     * variables that indirect the same value — `.collage{gap:var(--cg)}`
       with `--cg:clamp(10px,1.15vw,16px)`, `.dcy-list` with
       `--dcy-col-gap:clamp(10px,1.2vw,20px)`, `.ntitem` with its
       `15px` block padding moved onto `.ntitem>*`.

   `--fold-pad-y` is the fourth item and is fixed at its own
   declaration near the top of this file (the reference's
   `clamp(5rem,10vw,10rem)`, a flat 160px across this whole band,
   in place of the former 60px/80px steps).

   Nothing here exists below 1600px, so no other breakpoint moves.
   Two of the five section rules NEED their `!important`, because
   those widgets print the padding as an inline style on the
   `<section>`: `twrb_client_strip` (`padding:var(--fold-pad-y)
   var(--gutter)`) and `twrb_funnel`. The other three sections carry
   no inline padding and would already win on specificity —
   `.elementor-widget-twrb_x section` is (0,1,1) against `.fold`'s
   (0,1,0) — so their `!important` is only for uniformity.
   ============================================================ */
@media(min-width:1600px){

  /* the eyebrow rule -> label gap: reference 16px (8px is the value
     the whole build uses below this band, and stays there) */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow{ gap:16px!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .ecard .eyebrow{ gap:11px!important; }

  /* the DECAY panel's verdict line. Both the base rule and the
     `.dcy-head + .dcy-verdict` adjacency further up use `--hc-gap`
     (20px); the reference uses its own clamp, 44px here. */
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-verdict,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .dcy-head + .dcy-verdict{ margin-top:clamp(28px,3.4vw,44px)!important; }

  /* the five sections the reference gives a padding of their own
     instead of letting `.fold` supply `--fold-pad-y` */
  .elementor-widget-twrb_client_strip section{
    padding-top:clamp(38px,5vw,62px)!important;
    padding-bottom:clamp(38px,5vw,62px)!important;
  }
  .elementor-widget-twrb_not_typical section{
    padding-top:clamp(48px,6vw,76px)!important;
    padding-bottom:clamp(48px,6vw,76px)!important;
  }
  .elementor-widget-twrb_funnel section{
    padding-top:clamp(56px,7vw,92px)!important;
  }
  .elementor-widget-twrb_why_clients section{
    padding-top:clamp(48px,6vw,76px)!important;
  }
  .elementor-widget-twrb_who_we_work_with section{
    padding-top:clamp(38px,4.6vw,60px)!important;
    padding-bottom:clamp(44px,5.4vw,72px)!important;
  }
}

/* ============================================================
   FOOTER LINK BAND — WORDPRESS MENU MARKUP

   The footer's three link regions (`.fnav`, `.fservices`, `.fright`) each hold
   exactly ONE WordPress menu. `wp_nav_menu()` prints it whenever that region's
   picker names a menu, and the widget rebuilds the identical markup from the
   region's custom items otherwise, so there is a single shape to dress:

     <ul class="menu">
       <li class="menu-item menu-item-has-children">
         <a>Our Work</a>
         <ul class="sub-menu">
           <li class="menu-item"><a>Portfolio</a></li>
           …
         </ul>
       </li>
       …
     </ul>

   Everything below is keyed to the classes WordPress generates —
   `menu-item`, `menu-item-has-children`, `sub-menu`, and, for the active
   state, `current-menu-item` / `current-menu-parent` / `current-menu-ancestor`.

   The menu's LEVELS stand in for the elements the reference markup used, one
   for one, so the footer block above keeps doing the outer work untouched:

     .fnav        ul.menu                  ->  `.fnav ul`      (the primary links)
                  li.menu-item             ->  one link

     .fservices   h4                       ->  `.fservices h4` (block heading —
                                               printed by the widget from the
                                               Block Heading control, or from a
                                               three-level menu's own root item)
                  ul.menu.fsgrid           ->  `.fsgrid`       (the column grid)
                  > li.menu-item           ->  `.fsgrid > div` (one column)
                    > a                    ->  `.fsgrid h5`    (its green title)
                    > ul.sub-menu          ->  `.fsgrid ul`    (its links)

     .fright      ul.menu                  ->  `.fright`'s block stack
                  > li.menu-item > a       ->  `.fright h5`    (a block title)
                  > li.menu-item > ul.sub-menu -> `.fright ul` (that block's links)

   `fsgrid` rides on the services menu's own `<ul>` and `.fnav ul` / `.fright ul`
   reach the menu lists as they stand, so EVERY per-breakpoint rule in the
   footer block above — the 4 -> 2 -> 1 column steps, the two-per-row link
   lists, the right column's own full-width line, the `.flinks > .fright`
   separator — already applies to this markup unchanged. What follows adds only
   what the menu's own elements need: the titles that are now `<a>` rather than
   `<h5>`, the block stack's 28px rhythm, and the tablet/mobile bands where a
   block's title and list are nested inside one `<li>` instead of being
   siblings.

   The type/colour rules carry the widget guard and `!important` because the
   REFERENCE TYPE & COLOUR LOCK above re-states `.flinks a` (colour and
   line-height) at `!important` on a (0,5,1) selector; a title that is now an
   `<a>` has to outrank it, and it carries the lock's own two carve-outs so an
   inline colour or line-height still wins. The structural rules need neither.

   Two conventions keep the breakpoint overrides winnable: a band repeats the
   base rule's chain verbatim, so it is always at least as specific and always
   later in the file; and the 12px/24px/28px rhythms are written as "set it on
   every item, reset `:first-child`" rather than `li + li`, so a band can re-cut
   which items carry the step without needing a longer selector.
   ============================================================ */

/* list chrome. `.fnav ul,.fright ul,.fsgrid ul` above already does this for the
   lists it can reach; the services menu's own `ul.menu.fsgrid` is not one of
   them. Same declarations, wider net. */
.flinks ul{list-style:none;margin:0;padding:0}

/* no submenu toggle. Several themes push their own accordion control — the
   `+ / −` button — into every menu item that has children. The footer's
   columns are always open, so the widget strips that button out of
   `wp_nav_menu()`'s output; this closes the same hole for a theme that adds
   it with JS after the page has rendered. The footer's link band prints no
   button of its own, so the net can stay wide. */
.flinks button,
.flinks .sub-menu-toggle,
.flinks .dropdown-toggle,
.flinks .menu-item-toggle{display:none!important}

/* ---------- Services columns ---------- */

/* the block heading is a link when a three-level menu supplies it; it keeps
   the `<h4>`'s own type and only has to win the colour back from the lock */
.flinks .fservices>h4>a{display:block;width:fit-content;max-width:100%}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fservices>h4>a:not([style*="color"]):not([style*="line-height"]){
  font-size:inherit!important;font-weight:inherit!important;
  color:#fff!important;letter-spacing:inherit!important;line-height:inherit!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fservices>h4>a:not([style*="color"]):not([href*="tel:" i]):hover{
  color:var(--tw-green-500)!important;
}

/* a column's title — the `.fsgrid h5` of the reference markup. The column
   itself (`li.menu-item`) and its link list (`ul.sub-menu`) are laid out by
   `.fsgrid > *` and `.fsgrid ul` above, at every breakpoint. */
.flinks .fservices>ul.menu>li.menu-item>a{display:block;width:fit-content;max-width:100%;margin:0 0 14px}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fservices>ul.menu>li.menu-item>a:not([style*="color"]):not([style*="line-height"]){
  font-size:14px!important;font-weight:var(--fw-semibold)!important;
  color:var(--tw-green-500)!important;letter-spacing:.06em!important;
  text-transform:uppercase;line-height:1.3!important;
}
/* the column titles rest green, so their hover — and their active state —
   is white; the two match, so an active title that is hovered never flickers */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fservices>ul.menu>li.menu-item>a:not([style*="color"]):not([href*="tel:" i]):hover{
  color:#fff!important;
}

/* ---------- Right column ---------- */

/* level 1 — the block titles (`.fright h5`), on the 28px step the reference
   markup carries as a `margin-top` on every heading past the first. A block
   with NO child pages is a bare `li.menu-item`; it is still a block title,
   because what makes one is the level it sits on, not whether it has a list. */
.flinks .fright>ul.menu{display:flex;flex-direction:column}
.flinks .fright>ul.menu>li.menu-item{margin-top:min(var(--sp-cap),28px)}
.flinks .fright>ul.menu>li.menu-item:first-child{margin-top:0}
.flinks .fright>ul.menu>li.menu-item>a{display:block;width:fit-content;max-width:100%;margin:0 0 14px}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fright>ul.menu>li.menu-item>a:not([style*="color"]):not([style*="line-height"]){
  font-size:14px!important;font-weight:var(--fw-semibold)!important;
  color:var(--tw-green-500)!important;letter-spacing:.06em!important;
  text-transform:uppercase;line-height:1.3!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fright>ul.menu>li.menu-item>a:not([style*="color"]):not([href*="tel:" i]):hover{
  color:#fff!important;
}
/* level 2 — that block's links (`.fright ul`). The 12px step is re-stated here
   so it outranks `.fright ul > li + li` above, which the `ul.menu` above has to
   override to 28px. */
.flinks .fright ul.sub-menu{display:flex;flex-direction:column}
.flinks .fright ul.sub-menu>li.menu-item{margin-top:12px}
.flinks .fright ul.sub-menu>li.menu-item:first-child{margin-top:0}

/* ---------- Primary links ---------- */
/* a flat list, already dressed by the `.fnav` rules above. A menu that does
   carry children keeps them in the same single column, on the same 12px
   rhythm, instead of being pulled into the row-wrap the tablet bands give
   `.fnav ul > li`. */
.flinks .fnav ul.sub-menu{flex-direction:column;margin-top:12px}
.flinks .fnav ul.sub-menu>li.menu-item{flex:0 0 auto;margin-top:12px}
.flinks .fnav ul.sub-menu>li.menu-item:first-child{margin-top:0}

/* ---------- Breakpoints (mirroring the footer block above) ---------- */

/* the right-hand blocks drop to their own full-width line and their titles and
   lists become two 50% cells per row. In the reference markup those were
   siblings inside `.fright`; here they are nested inside one `li.menu-item`,
   so `display:contents` hands them to the menu's own wrap container as the
   same two cells, and the same 50% / 24px values apply. */
@media(max-width:1100px){
  .flinks .fright>ul.menu{flex:0 0 100%;max-width:100%;flex-direction:row;flex-wrap:wrap;column-gap:24px}
  .flinks .fright>ul.menu>li.menu-item{display:contents}
  .flinks .fright>ul.menu>li.menu-item>a,
  .flinks .fright>ul.menu>li.menu-item>ul.sub-menu{flex:0 0 calc((100% - 24px) / 2);min-width:0;width:auto;max-width:none}
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>a,
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>ul.sub-menu{margin-top:24px}
}
/* Below 520px the title and its list stop being two cells on one row and
   become two stacked full-width cells, so the gap between them is now a
   VERTICAL one — and the 24px that separated the cells horizontally was landing
   on top of the title's own 14px `margin-bottom`, putting 38px between a green
   block title and the first link under it. The title keeps its 14px step (the
   same one every Services column title uses, so the two columns of the footer
   read alike) and the list's own step goes to zero; only the step BETWEEN
   blocks, which carries the separator, stays — it is set with that separator,
   in the two bands at the end of this section. */
@media(max-width:520px){
  .flinks .fright>ul.menu>li.menu-item>a,
  .flinks .fright>ul.menu>li.menu-item>ul.sub-menu{flex-basis:100%}
}
/* every block title on the first line, every list on the second — the two
   `order` values the reference markup gives `.fright > h5` / `.fright > ul` */
@media(min-width:992px) and (max-width:1199.98px){
  .flinks .fright>ul.menu{flex:0 0 100%;max-width:100%;flex-direction:row;flex-wrap:wrap;column-gap:24px}
  .flinks .fright>ul.menu>li.menu-item{display:contents}
  .flinks .fright>ul.menu>li.menu-item>a,
  .flinks .fright>ul.menu>li.menu-item>ul.sub-menu{flex:0 0 calc((100% - 24px) / 2);min-width:0;width:auto;max-width:none}
  .flinks .fright>ul.menu>li.menu-item>a{order:1}
  .flinks .fright>ul.menu>li.menu-item>ul.sub-menu{order:2;flex-direction:row;flex-wrap:wrap;column-gap:24px;margin-bottom:0}
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>a,
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>ul.sub-menu{margin-top:0}
  .flinks .fright ul.sub-menu>li.menu-item{flex:0 0 calc((100% - 24px) / 2);min-width:0;margin-top:12px}
  .flinks .fright ul.sub-menu>li.menu-item:nth-child(-n+2){margin-top:0}
}
@media(min-width:768px) and (max-width:991.98px){
  .flinks .fright>ul.menu>li.menu-item>a{order:1}
  .flinks .fright>ul.menu>li.menu-item>ul.sub-menu{order:2;flex-direction:row;flex-wrap:wrap;column-gap:24px}
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>a,
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>ul.sub-menu{margin-top:0}
  .flinks .fright ul.sub-menu>li.menu-item{flex:0 0 calc((100% - 24px) / 2);min-width:0;margin-top:12px}
  .flinks .fright ul.sub-menu>li.menu-item:nth-child(-n+2){margin-top:0}
}
/* the separator above the second block's title, drawn in the middle of the
   gap and spanning both cells — the `h5:nth-of-type(n+2)::before` above. The
   one above `.fright` itself (Services | Our Work) is drawn on the region and
   takes the same gap there.

   The gap is `--fsep-gap` — the token the footer block above sets to 48px for
   this band — so the line lands 24px clear of the list above it and 24px clear
   of the title below, over the 20px minimum, and the offset can never drift
   from the gap it is centred in. The step is restated on BOTH cells because
   between 521px and 767px a block's title and list share a row: give the step
   to only one of them and the row's two halves no longer start level. Below
   520px they stack and the list's step is zeroed again by the band below, which
   is the last word on it. */
@media(max-width:767px){
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>a,
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>ul.sub-menu{margin-top:var(--fsep-gap,48px)}
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>a{position:relative}
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>a::before{
    content:"";position:absolute;left:0;top:calc(-.5 * var(--fsep-gap,48px));height:1px;
    width:calc(200% + 24px);background:rgba(255,255,255,.14);pointer-events:none;
  }
}
/* stacked: every list sits tight under its own title, and the step between
   blocks is carried by the title alone. `:nth-child(n+1)` matches every item
   and is here only to buy the selector the one class the `:nth-child(n+2)`
   rule above has — same trick the file uses elsewhere to re-cut which items
   carry a step without lengthening the chain. */
@media(max-width:520px){
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+1)>ul.sub-menu{margin-top:0}
  .flinks .fright>ul.menu>li.menu-item:nth-child(n+2)>a::before{width:100%}
}

/* ---------- Active state ----------
   Driven entirely by the classes WordPress puts on the `<li>`:
   `current-menu-item` on the entry for the page being viewed,
   `current-menu-parent` on its parent and `current-menu-ancestor` on anything
   further up. The widget prints the same three on a region fed from its own
   custom items, and drops them altogether — on both sources — while the
   *Highlight the Current Page* switch is off.

   A parent with NO child items carries `current-menu-item` on ITSELF, so the
   "highlight the parent on its own page" case is covered by the same rules; it
   needs none of its own, at any level.

   `:is(…)` costs the specificity of one class, so each selector below stays
   exactly one class ahead of the type/colour rule it overrides, and the level
   chains are the same ones used above.

   Each colour is the one that link already uses on hover, so an active item
   that is also hovered never flickers between two colours: the links and the
   white "Services" block heading take the footer's green, and the green column
   and block titles take white. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fnav li.menu-item:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor)>a:not([style*="color"]):not([style*="line-height"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fservices ul.sub-menu>li.menu-item:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor)>a:not([style*="color"]):not([style*="line-height"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fright ul.sub-menu>li.menu-item:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor)>a:not([style*="color"]):not([style*="line-height"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fservices>h4>a.is-current:not([style*="color"]):not([style*="line-height"]){
  color:var(--tw-green-500)!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fservices>ul.menu>li.menu-item:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor)>a:not([style*="color"]):not([style*="line-height"]),
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .flinks .fright>ul.menu>li.menu-item:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor)>a:not([style*="color"]):not([style*="line-height"]){
  color:#fff!important;
}

/* ============================================================
   FONT FAMILY — LAYOUT-PROOF LOCK  (must stay LAST in this file)

   The problem this closes. Every block above wins on SPECIFICITY,
   and specificity is only ever compared *within the same origin
   and layer*. A page rendered on Elementor Canvas (or on this
   plugin's own "TechWyse Full Width" template) has none of the
   theme's content wrappers, so the theme's descendant rules —
   `.entry-content h2`, `.site-main p`, `.page ul li` — do not
   match at all and the widgets keep Poppins/Bebas. Insert the same
   template into a page on the theme's Default layout and those
   wrappers reappear: any of those rules written with `!important`
   (and several themes do exactly that for their body/heading face)
   sits at the same importance as the locks above, and then the
   longer selector wins. That is the reported symptom — the family
   changing depending on which Page Layout is chosen.

   The fix is to stop competing on selector length. For IMPORTANT
   declarations the cascade sorts by LAYER before specificity, and
   the order is reversed: unlayered `!important` ranks LOWEST, and
   an earlier layer beats a later one. So an `!important` family
   declared inside a layer beats an `!important` family the theme
   or the Elementor kit declares outside one, no matter how long
   its selector is — and therefore renders identically on Canvas,
   on Full Width, on the theme's Default layout and inside an
   Elementor theme-builder template.

   This block is the ONLY place in the plugin that uses a layer, so
   nothing else about the cascade changes; the unlayered locks above
   stay exactly as they are and keep serving as the fallback for a
   browser too old for `@layer` (pre-2022), where behaviour is
   unchanged from before.

   What is inside, in specificity order (normal rules apply between
   them, because they all sit in the same layer):

     1. the widget element itself — the inheritance root, the
        `--font-body` token;
     2. every descendant back to the `--font-body` token (never
        `inherit` — see the note on the DISPLAY-FACE GUARD in the
        REFERENCE TYPE & COLOUR LOCK above), so no rule from outside
        this plugin can match one of them directly;
     3. the elements the design puts in the display face (and the
        body-face ones nested under them), restated from the
        REFERENCE TYPE & COLOUR LOCK above — same selectors, same
        two tokens, `font-family` only.

   `:not([style*="font-family"])` is carried throughout, exactly as
   above, so an inline family a widget prints — or one typed into an
   Elementor control — still wins. The TW Header (Builder) subtree is
   excluded here and pinned by the matching layer in
   `techwyse-header-builder.css`, so that widget's one display-face
   element is not flattened; `:where()` costs no specificity.
   ============================================================ */
@layer twrb-font-family{

  /* 1 — the inheritance root.
     The two e-commerce families carry the same zero-specificity exemption the
     COLOUR declarations above already have, and for the same reason: they ship
     their own self-contained stylesheet (Archivo + IBM Plex Mono, bundled),
     and a layered `font-family:…!important` here outranks every plain
     declaration in it — so this rule, not the reference, decided their face. */
  [class*="elementor-widget-twrb_"]:where(:not([class*="twrb_ec"])){font-family:var(--font-body)!important;}

  /* 2 — every descendant takes the body token outright instead of matching a
     theme rule. It names the token rather than `inherit` and carries the
     DISPLAY-FACE GUARD, exactly as the unlayered locks above do: this rule
     sits in a layer, so its `!important` outranks every unlayered
     `!important` in this file, and an `inherit` here therefore flattened any
     display-face element that rule 3a below does not list to whatever its
     parent resolved to. The guard costs no specificity, so 3a and 3b keep
     winning over this rule exactly as before. */
  [class*="elementor-widget-twrb_"] *:not([style*="font-family"]):where(:not([class*="twhb"]):not([class*="twhb"] *)):where(:not([class*="twrb_ec"]):not([class*="twrb_ec"] *)):where(:not(:is(.tw-display,.ecard h1,.ecard .estat b,.stat-num,.eng-step,.eng-title,.mtile .mv,.step .snum,.astepnum,.alabel,.ghostword,.solidword,.haloword,.dcy-word,.dcy-note,.dcy-verdict,.pillar b,.fnlink .fni,.fitlabel,.fitwarn,.pnum,.widget-heading,[style*="font-family:var(--font-display)"])):not(:is(.tw-display,.ecard h1,.ecard .estat b,.stat-num,.eng-step,.eng-title,.mtile .mv,.step .snum,.astepnum,.alabel,.ghostword,.solidword,.haloword,.dcy-word,.dcy-note,.dcy-verdict,.pillar b,.fnlink .fni,.fitlabel,.fitwarn,.pnum,.widget-heading,[style*="font-family:var(--font-display)"]) *)){font-family:var(--font-body)!important;}

  /* 3a — the display face */
  [class*="elementor-widget-twrb_"] .tw-display:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .ecard h1:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .ecard .estat b:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .stat-num:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .eng-step:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .eng-title:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .mtile .mv:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .step .snum:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .astepnum:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .alabel:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .ghostword:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .solidword:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .haloword:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .dcy-word:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .dcy-note:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .dcy-verdict:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .pillar b:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .fnlink .fni:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .fitlabel:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .fitwarn:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .pnum:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .widget-heading:not([style*="font-family"]){font-family:var(--font-display)!important;}

  /* 3b — the body face where a component names it explicitly */
  [class*="elementor-widget-twrb_"] .btn:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .ecard .eyebrow:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .ccap:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .ntlead:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .igp:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .dcy-head:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .fnstep:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .fnlink:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .fncap:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .fntab:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .tmmore:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .widget-content:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .widget-heading.heading-body:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form input[type=text]:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form input[type=email]:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form input[type=tel]:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form input[type=url]:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form select:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form textarea:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form input[type=submit]:not([style*="font-family"]),
  [class*="elementor-widget-twrb_"] .twrb-cf7 .wpcf7-form button[type=submit]:not([style*="font-family"]){font-family:var(--font-body)!important;}
}

/* ============================================================
   RE-BRAND FIX PASS
   (funnel focus ring, Not-Typical columns, payoff graph,
    eyebrow spacing + mobile scale)

   Appended last on purpose. Every rule below has to outrank the
   rule it replaces earlier in this file — and, for the eyebrow
   gaps and the negatives list, an inline style the widget
   prints — so the selectors mirror the ones they override and
   win on SOURCE ORDER (plus `!important` where an inline style
   is in play) rather than on invented extra specificity.
   Nothing here is unscoped from its breakpoint: each block
   states the band it belongs to and changes nothing outside it.
   ============================================================ */

/* --- 1. TW Growth Engine Funnel: no focus ring on a click -----
   Each funnel stage is a `<g class="fnseg" tabindex="0"
   role="button">`. A pointer press focuses it, and every engine
   that still paints the legacy `:focus` ring (Safari, plus any
   theme shipping a bare `:focus{outline:…}`) drew a box around
   the segment on click.

   The ring is dropped for `:focus` only and re-declared for
   `:focus-visible`, so keyboard users keep exactly the 2px green
   outline the global `[tabindex]:focus-visible` rule gives every
   other control — focus stays visible where it matters. All
   resolutions, matching the rest of the funnel's states. */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnseg:focus,
.fnseg:focus{ outline:none!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnseg:focus-visible,
.fnseg:focus-visible{ outline:2px solid var(--tw-green-500)!important; outline-offset:3px!important; }

/* --- 2. TW Not Your Typical Agency, DESKTOP (>=1200px) --------
   The row is four flex children: the headline column, the
   negatives list, the bridge glyph, the answer card.

   a) The headline column and the answer card now carry the same
      `flex:1 1 0`, so they resolve to identical widths (the card
      used to run at 1.32 against the headline's 1).

   b) The negatives list ("What We Don't Do") was wrapping
      "Run Disconnected Campaigns." onto a second line: its share
      of the row resolved narrower than the row's own text.
      `white-space:nowrap` keeps each label on one line and
      `min-width:max-content` gives the column a floor equal to
      that single line, so flexbox freezes it at its content width
      and splits the remainder between the two equal columns
      instead of squeezing the list. The inline
      `min-width:min(100%,340px)` the widget prints is the value
      being replaced, hence `!important`.
   Both only exist from 1200px up; the tablet and mobile stacks
   below re-declare their own widths and are untouched. */
@media(min-width:1200px){
  .ntrow>[data-reveal="left"],
  .ntrow>.ntanswer{ flex:1 1 0; }
  .ntrow>.ntneg{ min-width:max-content!important; }
  .ntitem b{ white-space:nowrap; }
}

/* --- 3. TW Not Your Typical Agency, 768–1199px ---------------
   In this band the answer card is taken out of flow and pinned
   `top:0;bottom:0` across the headline + negatives stack, so its
   copy sat at the top of a box as tall as that stack. A column
   flex box with a centred main axis puts the lockup in the
   vertical middle of the card. `safe center` is declared second
   so a card whose content is taller than the stack overflows
   downwards (and stays readable) instead of being clipped at
   both ends; engines without `safe` keep the plain value.
   The absolutely-positioned `.ntbrace` is out of flow and is not
   affected. Mobile (<768px) puts the card back in normal flow
   with its own wrap rules — untouched. */
@media(min-width:768px) and (max-width:1199.98px){
  .ntrow>.ntanswer{
    display:flex;
    flex-direction:column;
    justify-content:center;
    justify-content:safe center;
  }
}

/* --- 4. TW Growth Engine Payoff, below 1199px ----------------
   The growth-curve SVG behind the fold sits under the ghost
   lines and the outcomes list. Its own `opacity:.85` is raised
   to a flat 1 by `.reveal-in{opacity:1!important}` once the
   section scrolls in, and at tablet/phone widths the curve runs
   straight through the copy. Dropping it to .3 keeps the graph
   readable as background texture without competing with the
   text. Both the pre- and post-reveal states are named, and
   `!important` is required to outrank `.reveal-in`'s own.
   Desktop keeps the reference treatment. */
@media(max-width:1199.98px){
  .growthline,
  .growthline.reveal-in,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .growthline,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .growthline.reveal-in{
    opacity:.3!important;
  }
}

/* --- 5. EYEBROW -> HEADING GAP, below 1199px ------------------
   Capped at 15px. Only the sections whose gap was ABOVE 15px are
   listed, so nothing gets pushed further apart: the Who We Work
   With eyebrow (12px) and the answer card's own `.ntans-eyebrow`
   (14px) are deliberately left alone, and so is the Client Strip
   eyebrow — that one sits above the logo marquee, not above a
   heading. Combined Content prints no gap at all.

   The five section eyebrows print `margin-bottom` as an inline
   style, so `!important` is what carries the cap. The FAQ gap is
   a stylesheet rule (16px) and the funnel's is TWO rules at once
   — `.fnhead`'s column `gap` plus `.pphead > * + *`'s
   `margin-top` — so the gap is zeroed and the whole step is put
   on the margin. */
@media(max-width:1199.98px){
  .elementor-widget-twrb_assessment .tw-eyebrow,
  .elementor-widget-twrb_proof .tw-eyebrow,
  .elementor-widget-twrb_people .tw-eyebrow,
  .elementor-widget-twrb_why_clients .tw-eyebrow,
  .elementor-widget-twrb_not_typical .tw-eyebrow:not(.ntans-eyebrow){ margin-bottom:15px!important; }

  .twrb-faq .tw-eyebrow + .widget-heading{ margin-top:15px!important; }

  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnhead,
  .fnhead{ gap:0!important; }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnhead>*+*,
  .fnhead>*+*{ margin-top:15px!important; }
}

/* --- 6. EYEBROW SCALE, mobile only (<768px) ------------------
   Every eyebrow on the page: a 13px label with a 20x2px rule.
   This supersedes the 16px/20px mobile step declared with the
   EYEBROW LOCK above AND the funnel fold's own 15px/28px step
   (which is declared for the whole <=1199.98px band) — the
   funnel selector is repeated here at the same specificity so
   source order settles it and the phone scale is genuinely
   uniform across sections.

   The rule stays pinned to the vertical centre of the FIRST line
   of the label: `align-items:flex-start` (from the lock) plus a
   `margin-top` of half the 1em first-line box minus the rule's
   own 2px. The rule->label gap comes down from 8px to 6px so the
   shorter rule does not read as detached from the smaller text. */
@media(max-width:767px){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnhead .tw-eyebrow,
  .fnhead .tw-eyebrow{
    font-size:13px!important;
    gap:6px!important;
    align-items:flex-start!important;
  }
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .tw-eyebrow i,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .fnhead .tw-eyebrow i,
  .fnhead .tw-eyebrow i{
    width:20px!important;
    height:2px!important;
    margin:calc((1em - 2px) / 2) 0 0!important;
  }
}

/* --- 7. TW Why Clients Choose Us — cue text, below 1199px ----
   Each of the four pillars ends in a `.pcue` ("See reviews →").
   On desktop it is a hover reveal: `opacity:0` plus a 6px lift,
   animated in by `.pillar:hover .pcue`. Below 1199px there is no
   dependable hover, so the reveal is removed outright rather
   than softened — the cue is simply part of the card, visible at
   rest, with no transition to play and no hover nudge on its
   arrow. Same selectors as the rules they replace; source order
   settles it. Desktop (>=1200px) keeps the hover reveal. */
@media(max-width:1199px){
  .pcue{ opacity:1; transform:none; transition:none; }
  .pillar:hover .pcue,
  .pillar:focus-visible .pcue{ opacity:1; transform:none; }
  .pcue svg{ transition:none; }
  .pillar:hover .pcue svg{ transform:none; }
}

/* --- 8. TW Not Your Typical Agency, 768–1199px --------------
   Two gaps tighten in the tablet band, where the headline
   column and the negatives list are stacked in one half of the
   row:

   a) eyebrow -> headline. The widget prints `margin-bottom:18px`
      inline and block 5 above already caps the whole <=1199.98px
      band at 15px; this band takes it to a flat 10px. The
      selector mirrors block 5's (so the answer card's own
      `.ntans-eyebrow` is still excluded) and wins on source
      order; `!important` is for the inline style.

   b) headline -> "What We Don't Do". The step is the negatives
      list's own `margin-top`, `min(var(--sp-cap),clamp(26px,
      4vw,44px))` — 40px across this whole band once `--sp-cap`
      clamps to the tablet ceiling. Re-declared as a 20-24px
      ramp: 20px at 768px, 24px from ~1090px up. `min()` keeps
      the spacing ceiling in play exactly as before. */
@media(min-width:768px) and (max-width:1199.98px){
  .elementor-widget-twrb_not_typical .tw-eyebrow:not(.ntans-eyebrow){ margin-bottom:10px!important; }
  .ntrow>.ntneg{ margin-top:min(var(--sp-cap),clamp(20px,2.2vw,24px)); }
}

/* --- 9. TW Growth Assessment CTA — step node, mobile --------
   Each step is a `.astep` whose green disc (`.anode`) is pulled
   into the rail gutter with `left:-23px`, half of its own 46px.
   On mobile the gutter itself is capped at 25px by `--sp-cap`,
   so the disc's right edge landed 2px from the copy beside it.

   The disc comes down to 38px (`left:-19px` keeps it centred on
   the same rail line) with a 16px glyph, and `.astep` takes a
   flat 33px indent — so the gap between the disc and the copy
   goes from 2px to 14px. The rail, its fill and the gutter are
   untouched, so nothing else in the column shifts.

   The icon needs `!important` at the isolation block's own
   specificity: that block pins `.anode svg` to 20px to survive
   themes that force `img/svg` sizing. Between 620px and 767px
   `.alabel` still reserves a 46px line box to sit level with the
   old disc; it follows the disc down to 38px. Below 620px it is
   already `min-height:0` and stays there. */
@media(max-width:767px){
  .anode{ width:38px; height:38px; left:-19px; }
  .anode svg{ width:16px; height:16px; }
  [class*="elementor-widget-twrb_"] .elementor-widget-container .anode svg{ width:16px!important; height:16px!important; }
  .astep{ padding-left:33px; }
}
@media(min-width:620.02px) and (max-width:767px){
  .alabel{ min-height:38px; }
}

/* ============================================================
   SCROLL-TO-TOP BUTTON — desktop only
   Printed into the page footer by includes/class-scroll-top.php,
   shown/hidden by initScrollTop() in techwyse-interactions.js.

   Selector is `button.twrb-scrolltop` (element + class) rather
   than the bare class: the button lives OUTSIDE the widgets, so
   the isolation block above does not reach it and a theme rule
   like `.site button{…}` would otherwise outrank a single class.

   The hidden state uses `visibility` as well as `opacity`, so a
   button that is not on screen is also out of the tab order and
   out of the accessibility tree. `visibility` is transitioned
   with a 0s delay: .3s on the way out (it waits for the fade to
   finish) and 0s on the way in.
   ============================================================ */
:root{
  --twrb-scrolltop-size:52px;
  --twrb-scrolltop-inset:max(var(--gutter,20px),24px);
  /* Lifted clear of the third-party chat launcher that sits in the
     bottom-right corner (typically ~60px tall at a ~20px inset). */
  --twrb-scrolltop-bottom:calc(var(--twrb-scrolltop-inset) + 84px);
  /* Above every layer this project ships — the sticky header is
     --twhb-z (200 by default) and its mega menu stacks inside
     that — and above the z-indexes Elementor popups/overlays and
     the usual modal plugins use. */
  --twrb-scrolltop-z:999999;
  --twrb-scrolltop-ease:var(--ease-out,cubic-bezier(.16,1,.3,1));
  --twrb-scrolltop-dur:.3s;
}

button.twrb-scrolltop{
  position:fixed;
  right:var(--twrb-scrolltop-inset);
  bottom:var(--twrb-scrolltop-bottom);
  z-index:var(--twrb-scrolltop-z);
  width:var(--twrb-scrolltop-size);
  height:var(--twrb-scrolltop-size);
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-body);
  line-height:1;
  -webkit-appearance:none;
  appearance:none;
  cursor:pointer;
  border:1.5px solid var(--tw-green-500,#8CC63E);
  border-radius:var(--radius-pill,999px);
  background:var(--tw-green-500,#8CC63E);
  color:#fff;
  box-shadow:0 10px 24px rgba(20,26,36,.16),0 2px 6px rgba(20,26,36,.10);
  opacity:0;
  visibility:hidden;
  transform:translateY(16px) scale(.9);
  transition:
    opacity var(--twrb-scrolltop-dur) var(--twrb-scrolltop-ease),
    transform var(--twrb-scrolltop-dur) var(--twrb-scrolltop-ease),
    background-color .28s var(--twrb-scrolltop-ease),
    border-color .28s var(--twrb-scrolltop-ease),
    box-shadow .28s var(--twrb-scrolltop-ease),
    visibility 0s linear var(--twrb-scrolltop-dur);
}

button.twrb-scrolltop.is-visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  transition:
    opacity var(--twrb-scrolltop-dur) var(--twrb-scrolltop-ease),
    transform var(--twrb-scrolltop-dur) var(--twrb-scrolltop-ease),
    background-color .28s var(--twrb-scrolltop-ease),
    border-color .28s var(--twrb-scrolltop-ease),
    box-shadow .28s var(--twrb-scrolltop-ease),
    visibility 0s linear 0s;
}

/* Scroll-progress ring: initScrollTop() writes the page's scrolled
   fraction (0–1) to --twrb-top-p on every scroll frame; the ring is a
   conic gradient masked down to a thin band just inside the edge. */
button.twrb-scrolltop::before{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:50%;
  pointer-events:none;
  background:conic-gradient(#fff calc(var(--twrb-top-p,0) * 360deg),rgba(255,255,255,.28) 0);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));
}

button.twrb-scrolltop svg{
  position:relative;
  width:20px;
  height:20px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .28s var(--twrb-scrolltop-ease);
}

/* Hover: the button lifts, turns cobalt with a soft glow and the
   arrow nudges upward on a loop. */
button.twrb-scrolltop.is-visible:hover{
  background:var(--tw-cobalt-700,#1B3E93);
  border-color:var(--tw-cobalt-700,#1B3E93);
  color:#fff;
  box-shadow:0 16px 34px rgba(27,62,147,.34),0 0 0 4px rgba(140,198,62,.35);
  transform:translateY(-4px) scale(1.06);
}
button.twrb-scrolltop.is-visible:hover svg{ animation:twrb-scrolltop-nudge .9s var(--twrb-scrolltop-ease) infinite; }
@keyframes twrb-scrolltop-nudge{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-4px); }
}
button.twrb-scrolltop.is-visible:active{
  transform:translateY(-1px) scale(.97);
  transition-duration:.12s;
}

button.twrb-scrolltop:focus-visible{
  outline:3px solid var(--tw-cobalt-700,#1B3E93);
  outline-offset:3px;
}

/* Strictly desktop: the plugin's tablet band starts at 1199.98px. */
@media(max-width:1199.98px){
  button.twrb-scrolltop{ display:none!important; }
}

@media(prefers-reduced-motion:reduce){
  button.twrb-scrolltop,
  button.twrb-scrolltop.is-visible,
  button.twrb-scrolltop svg{ transition:none!important; }
  button.twrb-scrolltop,
  button.twrb-scrolltop.is-visible,
  button.twrb-scrolltop.is-visible:hover,
  button.twrb-scrolltop.is-visible:active{ transform:none!important; }
  button.twrb-scrolltop.is-visible:hover svg{ transform:none!important; animation:none!important; }
}

/* ============================================================
   HOME TEMPLATE — COMPACT DESKTOP LAYER (1200–1599.98px ONLY)
   (appended last so it wins its ties on source order)

   Every section of the home page ("TechWyse Re-Brand — Home
   (Flex Columns)") runs a step smaller in this band: type, box
   sizes, the spacing inside and between boxes, and the section
   top/bottom rhythm. Roughly x0.85 of what the band used before.

   * Scope: the home-page widgets only, listed in the `:is()`
     below. The e-commerce (`twrb_ec_*`), Toronto guide
     (`twrb_tg_*`), header builder and Home Hero (Growth Engine
     Cluster, its own stylesheet) are NOT in the list, so nothing
     on those templates moves.
   * The tokens are re-declared on the widget element, not on
     `:root`, so the change stays inside those widgets. Section
     headings and body copy print `var(--display-lg)` /
     `var(--body-*)` inline, so they follow the tokens.
   * Sizes a widget prints as a fixed inline style, and the
     values held by the EYEBROW and BUTTON locks, are restated
     with `!important` (the only way past an inline style or a
     lock), mirroring the lock selectors.
   * Nothing exists below 1200px or from 1600px up.
   See docs/home-compact-desktop-1200-1599.md.
   ============================================================ */
@media(min-width:1200px) and (max-width:1599.98px){

  /* --- tokens: type ramp + spacing scale + section rhythm --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer){
    --display-2xl:clamp(2.8rem,7vw,8.5rem);  /* @kind font */
    --display-xl:clamp(2.2rem,5.1vw,6rem);  /* @kind font */
    --display-lg:clamp(1.75rem,3.8vw,4.25rem);  /* @kind font */
    --display-md:clamp(1.4rem,2.85vw,3.2rem);  /* @kind font */
    --heading-xl:2rem;  /* @kind font */
    --heading-lg:1.55rem;  /* @kind font */
    --heading-md:1.2rem;  /* @kind font */
    --heading-sm:1rem;  /* @kind font */
    --body-base:13px;  /* @kind font */
    --content-size:13px;  /* @kind font */
    --body-xl:16px;  /* @kind font */
    --body-lg:14px;  /* @kind font */
    --body-md:13px;  /* @kind font */
    --body-sm:12px;  /* @kind font */
    --body-xs:11px;  /* @kind font */
    --label-md:12px;  /* @kind font */
    --label-sm:10.5px;  /* @kind font */
    --c-gap:10px;    /* was 12px */
    --hc-gap:14px;   /* was 16px */
    --cta-gap:18px;  /* was 22px */
    --col-gap:22px;  /* was 26px */
    --fold-pad-y:32px; /* was 40px */
  }

  /* --- section rhythm --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .section-py-main{ padding-block:28px; }                       /* was 35px */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .twrb-stack>*+*,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .twrb-grid>*+*{ margin-top:24px; }       /* was 30px */
  .elementor-widget-twrb_funnel section{ padding-top:clamp(32px,4vw,58px)!important; padding-bottom:clamp(24px,2.7vw,38px)!important; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .halofold{ min-height:820px; }                                  /* was 980px */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .halostage{ padding:clamp(24px,4.4vw,53px) 0 clamp(8px,1.6vw,18px); }

  /* --- eyebrows: 15px label, 24px rule, tighter step to the heading --- */
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .tw-eyebrow{ font-size:15px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .tw-eyebrow i{ width:24px!important; }
  .elementor-widget-twrb_assessment .tw-eyebrow,
  .elementor-widget-twrb_proof .tw-eyebrow,
  .elementor-widget-twrb_people .tw-eyebrow,
  .elementor-widget-twrb_why_clients .tw-eyebrow,
  .elementor-widget-twrb_not_typical .tw-eyebrow:not(.ntans-eyebrow){ margin-bottom:15px!important; }
  .elementor-widget-twrb_client_strip .tw-eyebrow{ margin-bottom:clamp(26px,3.5vw,44px)!important; }

  /* --- standalone heading widget --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .widget-heading{ font-size:35px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .widget-heading.heading-xs{ font-size:25px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .widget-heading.heading-sm{ font-size:30px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .widget-heading.heading-lg{ font-size:44px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .widget-heading.heading-xl{ font-size:52px; }

  /* --- section titles printed with a fixed inline size --- */
  .elementor-widget-twrb_brand_halo .tw-display{ font-size:clamp(2.2rem,5.1vw,3.9rem)!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .fnhead .tw-display{ font-size:clamp(2.2rem,4.15vw,3.65rem)!important; }
  .elementor-widget-twrb_payoff .sweeprule + .tw-display{ font-size:clamp(1.4rem,2.7vw,2.3rem)!important; }
  .elementor-widget-twrb_who_we_work_with .solidword{ font-size:clamp(2.3rem,5.6vw,4.6rem)!important; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .proofline{ font-size:clamp(1.3rem,2.7vw,2.1rem)!important; margin-top:clamp(40px,5.6vw,70px)!important; }

  /* --- buttons: ~0.80 of the 1600px+ metrics (was ~0.88) --- */
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-btn-wrap .btn,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .cc-cta .btn{ font-size:14px!important; padding:12.5px 15px 12.5px 23px!important; gap:9px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn .circ,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-btn-wrap .btn .circ,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .cc-cta .btn .circ{ width:27px!important; height:27px!important; font-size:15px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn-green .circ{ font-size:14px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn.btn-sm,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-btn-wrap .btn.btn-sm,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .cc-cta .btn.btn-sm{ font-size:12px!important; padding:9px 11px 9px 16px!important; gap:8px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn.btn-sm .circ,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-btn-wrap .btn.btn-sm .circ,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .cc-cta .btn.btn-sm .circ{ width:21px!important; height:21px!important; font-size:13px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn.btn-lg,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-btn-wrap .btn.btn-lg,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .cc-cta .btn.btn-lg{ font-size:15.5px!important; padding:14px 18px 14px 27px!important; gap:9px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn.btn-lg .circ,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-btn-wrap .btn.btn-lg .circ,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .cc-cta .btn.btn-lg .circ{ width:30px!important; height:30px!important; font-size:16px!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .btn.btn-ghost,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-btn-wrap .btn.btn-ghost,
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .cc-cta .btn.btn-ghost{ padding-left:0!important; padding-right:0!important; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .twrb-cf7 .wpcf7-form :is(input[type=submit],button[type=submit]){ padding:12px 22px; font-size:13.5px; }

  /* --- cards, FAQ, form card --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .widget-card{ padding:30px; }                                   /* was 36px */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .tw-acc-q{ padding:16px 20px; font-size:15px; }                 /* was 20px 24px / 17px */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .tw-acc-a{ padding:0 20px 18px; }                               /* was 0 24px 22px */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .twrb-faq .widget-heading + .tw-acc,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .twrb-faq .tw-eyebrow + .tw-acc{ margin-top:24px; }

  /* --- TW Hero — Growth Engine --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) :is(.heroh1,.eng-title){ font-size:clamp(2rem,min(5.2vw,6.7vh),4.5rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .eng-step{ font-size:1rem!important; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .eng-head{ font-size:clamp(.95rem,1.15vw,1.1rem)!important; margin-bottom:20px!important; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .eng-pts li{ font-size:13.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .stat-num{ font-size:clamp(1.45rem,2.55vw,2.1rem)!important; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .chchip{ font-size:12px; padding:9px 14px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .cchip{ font-size:13.5px; padding:13px 17px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .mtile{ padding:14px 15px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .mtile .mv{ font-size:clamp(1.4rem,2.55vw,1.9rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ecard h1{ font-size:clamp(1.9rem,min(3.75vw,5.3vh),3.3rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ecard .esub{ font-size:clamp(.9rem,1.15vw,1.1rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ecard .estat b{ font-size:clamp(1.3rem,2.2vw,1.95rem); }

  /* --- TW Brand Halo / TW Client Strip --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .haloword{ font-size:clamp(3.8rem,14.5vw,11rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .logomq-track{ gap:clamp(44px,5vw,80px); }

  /* --- TW Trust Problem --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .trustflow{ gap:clamp(22px,3vw,48px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .tflabel{ font-size:clamp(18px,1.8vw,25px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .dcypanel{ padding:clamp(42px,5.6vw,90px) clamp(20px,4vw,72px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .dcy-head{ font-size:clamp(1.5rem,3.05vw,2.45rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .dcy-cap{ font-size:clamp(12px,1vw,14.5px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .dcy-word{ font-size:clamp(1.3rem,2.9vw,2.45rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .dcy-note{ font-size:clamp(1rem,2.1vw,1.8rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .dcy-verdict{ font-size:clamp(2rem,5.45vw,4.6rem); }

  /* --- TW Not Your Typical Agency --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ntlead{ font-size:13.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ntitem b{ font-size:clamp(.95rem,1.25vw,1.1rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ntanswer{ padding:clamp(21px,2.1vw,32px); --nta-gap:clamp(20px,2.9vw,40px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) :is(.ghostword,.solidword){ font-size:clamp(2.1rem,5.1vw,4.25rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ocitem b{ font-size:clamp(.9rem,1.06vw,1rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ocitem small{ font-size:12px; }

  /* --- TW Why Clients Choose Us --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .pillars{ --pil-gap:clamp(10px,1vw,15px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .pillar{ padding:clamp(20px,1.85vw,27px) clamp(17px,1.6vw,22px) clamp(20px,1.85vw,26px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .pillar b{ font-size:clamp(1.3rem,1.95vw,1.8rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .pillar small{ font-size:13.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .pcue{ font-size:11px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .staytag{ font-size:14px; padding:13px 22px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .gbar{ gap:clamp(14px,2.1vw,26px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .revrow{ gap:clamp(15px,1.7vw,22px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .tmcard{ padding:clamp(18px,2vw,24px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .tmcard p{ font-size:13.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .tmmore{ font-size:12.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .stars{ font-size:13px; }

  /* --- TW Proof / TW People / TW Payoff --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .pnum{ font-size:clamp(1.6rem,2.9vw,2.45rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .plabel{ font-size:clamp(12.5px,1vw,14.5px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .psub{ font-size:12px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .proofrow{ column-gap:clamp(12px,1.7vw,26px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ppgrid{ --pp-gap:clamp(10px,1.2vw,17px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .ppcell{ min-height:clamp(66px,6.8vw,88px); padding:12px 14px; }

  /* --- TW Growth Engine Funnel --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fnwrap{ gap:clamp(22px,3.4vw,54px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fnpanels{ padding-top:clamp(20px,2.4vw,30px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fnstage{ padding:24px 20px 10px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fnstep{ font-size:clamp(12px,.9vw,13.5px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fnpanel h3{ font-size:clamp(1.45rem,2.3vw,2rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fnlink{ font-size:clamp(13px,1.02vw,14.5px); gap:clamp(12px,1.2vw,17px); padding:clamp(9px,.9vw,13px) clamp(10px,.95vw,14px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fncap{ font-size:12.5px; }

  /* --- TW Who We Work With --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fitlabel{ font-size:clamp(1.6rem,3vw,2.7rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fitwarn{ font-size:clamp(2.2rem,5.25vw,4.25rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fitgrid{ --fit-gap:clamp(8px,.9vw,12px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fititem{ font-size:clamp(13.5px,1.02vw,15px); padding:clamp(12px,1.4vh,16px) clamp(13px,1.25vw,17px); }

  /* --- TW Assessment --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .asteps{ padding-left:clamp(100px,8.9vw,146px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .astep{ padding-left:clamp(34px,2.9vw,44px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .astepnum{ font-size:clamp(3.7rem,6.45vw,6rem); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .alabel{ font-size:clamp(1.85rem,2.65vw,2.45rem); min-height:40px; }

  /* --- TW Footer --- */
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .flinks{ padding-bottom:clamp(32px,3.8vw,52px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .flinks a{ font-size:13.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fservices h4{ font-size:15.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) :is(.fsgrid h5,.fright h5){ font-size:13px; }
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .flinks .fservices>ul.menu>li.menu-item>a:not([style*="color"]):not([style*="line-height"]),
  :is(:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .elementor-widget-container,:is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer)) .flinks .fright>ul.menu>li.menu-item>a:not([style*="color"]):not([style*="line-height"]){ font-size:13px!important; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fsgrid{ --fs-gap:clamp(15px,1.7vw,27px); }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fmid{ padding:clamp(24px,2.8vw,36px) 0; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fphone{ padding:8px 17px 8px 10px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fphone .fpl b{ font-size:15.5px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .faddr{ font-size:12.5px; padding:11px 15px; }
  :is(.elementor-widget-twrb_hero_engine,.elementor-widget-twrb_brand_halo,.elementor-widget-twrb_client_strip,.elementor-widget-twrb_trust_problem,.elementor-widget-twrb_not_typical,.elementor-widget-twrb_who_we_work_with,.elementor-widget-twrb_why_clients,.elementor-widget-twrb_proof,.elementor-widget-twrb_people,.elementor-widget-twrb_payoff,.elementor-widget-twrb_funnel,.elementor-widget-twrb_faq,.elementor-widget-twrb_assessment,.elementor-widget-twrb_combined_content,.elementor-widget-twrb_heading,.elementor-widget-twrb_button,.elementor-widget-twrb_cf7_form,.elementor-widget-twrb_footer) .fbar{ font-size:12.5px; padding:15px var(--gutter); }
}

/* ============================================================
   CTA HOVER SYSTEM — shared `.btn` CTAs (appended last)
   The Home Hero / Banner CTA's hover (techwyse-home-hero.css,
   `.hg .cta-fx`) applied to every pill CTA in the plugin, so all
   CTAs hover the same way: colour floods out of the icon disc,
   the label rolls up to a second copy, the icon swaps out to the
   top-right and the pill drifts magnetically (JS: initCtaFx() in
   techwyse-interactions.js). Label roll and icon swap run on the
   same quick ~.3s beat as the hero CTA.

   Markup: `a.btn.cta-fx` > `.fx-lbl > span` (label) +
   `.circ > i` (glyph). Written through the BUTTON LOCK scope,
   one class higher, so it outranks the lock's `!important`
   hover colours, `.btn::before` reset and arrow nudge, while
   the Style-tab button controls (`{{WRAPPER}}` selectors) still
   rank above it. Per Modifier, the button keeps its resting
   fill on hover and the flood carries the hover colour:
     --fx-fill  flood colour       --fx-ink   rolled-in label colour
     --fx-icon  hovered glyph      --fx-edge  hovered border
     --fx-glow  hover shadow tint
   A tel: CTA keeps the TEL LINK LOCK (no hover change at all),
   so every hover rule below excludes it.
   ============================================================ */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx{
  --fx-fill:var(--tw-cobalt-700,#1B3E93);--fx-ink:#fff;--fx-icon:var(--tw-cobalt-700,#1B3E93);--fx-edge:var(--fx-fill);--fx-glow:rgba(27,62,147,.5);--cx:calc(100% - 37px);--cy:50%;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  will-change:translate;
  transition:background .18s var(--ease-out),color .18s var(--ease-out),border-color .45s var(--ease-out) .08s,box-shadow .6s var(--ease-out),transform .25s var(--ease-out)!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-cobalt.cta-fx{ --fx-fill:var(--tw-green-500); --fx-icon:#fff; --fx-glow:rgba(140,198,62,.45); }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-outline.cta-fx{ --fx-icon:#fff; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(.btn-ondark,.btn-ink).cta-fx{ --fx-fill:#fff; --fx-ink:var(--tw-ink-900); --fx-icon:var(--tw-ink-900); --fx-glow:rgba(255,255,255,.28); }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ghost.cta-fx{ --fx-fill:transparent; --fx-ink:var(--tw-cobalt-600); --fx-icon:var(--tw-cobalt-600); --fx-edge:transparent; --fx-glow:transparent; }

/* the flood — re-opens the pseudo the BUTTON LOCK closes */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:auto!important;
  height:auto!important;
  z-index:-1!important;
  border-radius:inherit!important;
  background:var(--fx-fill)!important;
  opacity:1!important;
  transform:none!important;
  pointer-events:none!important;
  clip-path:circle(0px at var(--cx) var(--cy))!important;
  transition:clip-path .6s var(--ease-in-out)!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible)::before{ clip-path:circle(160% at var(--cx) var(--cy))!important; transition:clip-path .85s var(--ease-out)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible){ border-color:var(--fx-edge)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):hover{ box-shadow:0 22px 44px -18px var(--fx-glow),0 8px 18px -10px var(--fx-glow)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):focus-visible{ box-shadow:var(--shadow-focus),0 22px 44px -18px var(--fx-glow)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):active{ transform:scale(.975)!important; }

/* resting fill and text colour held on hover, so the flood is what changes */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green.cta-fx:not([style*="background"]):not([href*="tel:" i]):is(:hover,:focus-visible){ background:var(--tw-green-500)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-green.cta-fx:not([style*="color"]):not([href*="tel:" i]):is(:hover,:focus-visible){ color:#fff!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-outline.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible){ background:transparent!important; color:var(--tw-cobalt-700)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-cobalt.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible){ background:var(--tw-cobalt-700)!important; color:#fff!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) :is(.btn-ondark,.btn-ink).cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible){ background:transparent!important; color:#fff!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn-ghost.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible){ color:var(--tw-cobalt-700)!important; }

/* label roll — the 1.5em window is pulled back to a 1em line box with
   negative margins, so every button keeps its existing height */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx .fx-lbl{
  display:block!important;
  overflow:hidden!important;
  height:1.5em!important;
  line-height:1.5!important;
  margin:-.25em 0!important;
  padding:0!important;
  white-space:nowrap!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx .fx-lbl>span{
  display:block!important;
  line-height:inherit!important;
  text-shadow:0 1.5em 0 var(--fx-ink)!important;
  transition:transform .32s var(--ease-in-out)!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible) .fx-lbl>span{ transform:translate3d(0,-1.5em,0)!important; transition:transform .38s var(--ease-out) .03s!important; }

/* icon swap */
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx .circ{
  position:relative!important;
  overflow:hidden!important;
  flex:none!important;
  transition:transform .32s var(--ease-out),color .22s var(--ease-out),background-color .22s var(--ease-out)!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx .circ i{
  display:block!important;
  font-style:normal!important;
  line-height:1!important;
  text-shadow:-1.7em 1.7em 0 currentColor!important;
  transition:transform .28s var(--ease-in-out)!important;
}
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible) .circ{ transform:scale(1.08)!important; color:var(--fx-icon)!important; }
:is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx:not([href*="tel:" i]):is(:hover,:focus-visible) .circ i{ transform:translate3d(1.7em,-1.7em,0)!important; transition:transform .32s var(--ease-out) .03s!important; }

@media(prefers-reduced-motion:reduce){
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx::before,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx .fx-lbl>span,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx .circ,
  :is([class*="elementor-widget-twrb_"] .elementor-widget-container,[class*="elementor-widget-twrb_"]) .btn.cta-fx .circ i{ transition:none!important; }
}