/* ============================================================
   Site-wide typography, loaded LAST on every page.
   Source of truth is the index hero: Inter, headings at 500,
   subheadlines at 400, nothing italic, nothing thin.
   ============================================================ */

:root{--font:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif !important}

html,body,button,input,select,textarea{
  font-family:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif !important;
  font-optical-sizing:auto;
}

/* ---- Headlines: same as the index hero (Inter 500, tight tracking) ---- */
h1,h2,h3,h4,h5,h6,
.hero-q-h1,.section-headline,.s-title,.page-headline,.lead-title,.lp-title,
.card-h,.card-title,.pkg-name,.pkg-bigword,.sys-name,.wk-title,.form-title,
.nf-h1,.certs-head,.about-inner h2,.cta-inner h2,.guarantee h3,
.method-step .ms-word,.statement .scrub,.pkg-outcome,.aph-name b,
.trust-num,.tile .big-n,.pkg-price,.faq-q{
  font-family:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif !important;
  font-weight:500 !important;
  font-style:normal !important;
}
h1,.hero-q-h1,.page-headline,.nf-h1{letter-spacing:-.03em !important}
h2,h3,.section-headline,.s-title,.lead-title,.lp-title,.about-inner h2,.cta-inner h2{letter-spacing:-.025em !important}

/* Accent words inside headlines: same weight and no slant, only the colour changes */
h1 em,h2 em,h3 em,h4 em,h1 i,h2 i,h3 i,h4 i,
.hero-q-h1 em,.section-headline em,.s-title em,.page-headline em,.lead-title em,
.lp-title em,.method-step .ms-word em,.cta-inner h2 em,.section.cta h2 em,.pkg-custom-text em{
  font-style:normal !important;
  font-weight:inherit !important;
  border-bottom:none !important;
}
/* CTA headlines read in one colour: the accent line matches the rest (black) */
.cta-inner h2 em,.section.cta h2 em,.cta-section h2 em,.cta-strip h2 em,.about-cta h2 em{
  color:inherit !important;
}
/* One H1 size per page type, matching the index hero. Scoped to pages with the
   site nav (#mobileMenu) so the qualify and thank-you funnels keep their compact
   form-column headings. :not(#_) out-specifies the per-page !important sizes. */
html body:has(#mobileMenu) h1:not(#_){font-size:clamp(40px,6vw,64px) !important;line-height:1.05 !important}
html body:has(#mobileMenu) .article-header-inner h1:not(#_){font-size:clamp(32px,4.2vw,48px) !important;line-height:1.12 !important}
@media(max-width:600px){
  html body:has(#mobileMenu) h1:not(#_){font-size:clamp(34px,9.5vw,44px) !important}
  html body:has(#mobileMenu) .article-header-inner h1:not(#_){font-size:clamp(28px,8vw,36px) !important}
}

/* No two-tone headings anywhere: every word in a heading takes the heading's colour.
   :not(#_) adds ID-level specificity so per-page !important accent rules lose.
   The scroll-reveal character spans (.srt-w/.srt-c) are left alone so the fade still runs. */
html body :is(h1,h2,h3,h4,h5,h6,.hero-q-h1,.section-headline,.page-headline,.nf-h1,.s-title,.lead-title,.lp-title):not(#_)
  :is(em,i,b,strong,mark,u,span:not(.srt-w):not(.srt-c)){
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
  background:none !important;
  border-bottom:none !important;
}

/* ---- Subheadlines: same as the index hero sub (Inter 400) ---- */
.hero-q-sub,.hero-sub,.section-sub,.s-sub,.page-sub,.lede,.lp-sub,.os-sub,
.funnel-sub,.gate-sub,.nf-sub,.form-sub,.form-card-sub,.certs-sub,.card-sub,
.about-hero-sub,.svc-price-sub,.vs-free-sub,.pkg-seemore-sub,.sub,
.lead-copy,.pkg-header-note,.pkg-desc,.sys-desc,.method-step .ms-desc,
.about-inner p,.cta-inner p,.guarantee p{
  font-family:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif !important;
  font-weight:400 !important;
  font-style:normal !important;
}
.hero-q-sub strong,.hero-sub strong,.lead-copy b,.section-sub strong,.lede strong{font-weight:500 !important}

/* ---- Eyebrows / kickers: one style everywhere ---- */
.eyebrow,.a-eyebrow,.hero-eyebrow,.certs-eyebrow,.pillar-eyebrow,.res-eyebrow,
.lp-eyebrow,.blog-eyebrow,.lead-eyebrow,.os-kicker,.h1-kicker,.s-tag,.section-label,
.pkg-tier,.ms-num,.sys-num,.funnel-n{
  font-family:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif !important;
  font-weight:500 !important;
  font-style:normal !important;
}

/* ---- No slanted text anywhere on the site ---- */
em,i,cite,q,blockquote,figcaption,.testi-quote,.lp-meta,.pkg-note{font-style:normal !important}

/* ============================================================
   Firm-style pass (Sep 2026), shared by every page.
   Reference: Westbridge / Elyte consulting templates. Calm, black
   and white, one message per screen. Linked last, so it wins.
   ============================================================ */

/* ---- Section labels: one plain style everywhere --------------------
   Was a glass pill on some pages and a lined kicker on others. Now always
   a short rule + small caps text, no surface, no hover lift. */
.section-label,.a-eyebrow,.s-tag{
  display:inline-flex !important;align-items:center;gap:10px;
  padding:0 !important;background:none !important;box-shadow:none !important;
  border:none !important;border-radius:0 !important;transform:none !important;
  font-size:11px !important;font-weight:500 !important;letter-spacing:.16em !important;
  text-transform:uppercase;color:rgba(20,17,13,.64) !important;
}
.section-label::before,.a-eyebrow::before,.s-tag::before{content:none !important;display:none !important}
.section-label:hover,.a-eyebrow:hover{box-shadow:none !important;transform:none !important}

/* ---- Two-tone headlines: second line muted, never a colour ---------- */
h1 em,h2 em,.section-headline em,.s-title em,.a-head h2 em{color:rgba(20,17,13,.40) !important}

/* ---- Section heads read left, like the rest of the page ------------ */
.a-head{text-align:left !important;margin-left:0 !important;margin-right:auto !important;max-width:760px !important}
.a-head h2,.a-head p{margin-left:0 !important;margin-right:0 !important}
.a-head .a-eyebrow{justify-content:flex-start}

/* ---- Heroes: one message. The six certification chips duplicated the
   stats row and the "Anthropic-Certified" label; the label stays. ---- */
.hero-q-certs-list{display:none !important}
.hero-q-certs{margin-top:22px !important}


/* ---- One dark band per page (Westbridge "Different by Design") -----
   Add class="band-dark" to a section. Tokens flip so the section's own
   rules keep working; buttons and cards are re-lit for the dark ground. */
html body .band-dark.band-dark.band-dark{
  background:#0C0A08 !important;color:#F5F3F0;border-top:none !important;
  --ink:#F5F3F0;--ink-2:rgba(245,243,240,.86);--ink-muted:rgba(245,243,240,.62);
  --soft:rgba(245,243,240,.74);--mute:rgba(245,243,240,.54);--faint:rgba(245,243,240,.32);
  --rule:rgba(255,255,255,.12);--line:rgba(255,255,255,.12);--line-2:rgba(255,255,255,.08);
  --gold:#F5F3F0;--accent:#F5F3F0;--parchment:#F5F3F0;
}
.band-dark h1,.band-dark h2,.band-dark h3,.band-dark h4{color:#F5F3F0 !important}
.band-dark p,.band-dark li{color:rgba(245,243,240,.68)}
.band-dark strong{color:#F5F3F0}
.band-dark h1 em,.band-dark h2 em,.band-dark h3 em,.band-dark .section-headline em{color:rgba(245,243,240,.46) !important}
.band-dark .section-label,.band-dark .a-eyebrow,.band-dark .s-tag,.band-dark .certs-label{color:rgba(245,243,240,.56) !important}
.band-dark .btn-primary,.band-dark .btn-primary-dark{background:#F5F3F0 !important;color:#14110D !important;box-shadow:none !important}
.band-dark .cert-chip{color:rgba(245,243,240,.78) !important;border-color:rgba(255,255,255,.2) !important;background:transparent !important;box-shadow:none !important}
.band-dark .cert-chip .dot{background:#F5F3F0 !important}
.band-dark a:not([class]){color:#F5F3F0}

/* Dark surfaces elsewhere (cards, dark heroes) keep a light muted tone */
.dark-card h2 em,.dark-card h3 em{color:rgba(255,255,255,.52) !important}
html body .hero--quiet h1 em,html body .hero--quiet .hero-q-h1 em,html body .about-hero h1 em,html body .onsite-hero h1 em,html body .article-header h1 em,html body .article-header em{color:rgba(255,255,255,.62) !important}
.dark-card .section-label,.dark-card .a-eyebrow{color:rgba(255,255,255,.56) !important}

/* ---- Palette: white, black and greys; light brown ONLY as an accent --
   Tan never fills a section or a button. It marks: the rule on section
   labels, rating stars, small dots, the numbered markers. Nothing else. */
:root{
  --tan:#8B6C4A;        /* marks: lines, dots, stars */
  --tan-ink:#6E5438;    /* the rare accent TEXT, readable on white (4.6:1) */
}
.testi-stars,.testi-cta-star,.hero-q-stars,.q-stars,.why-stars{color:var(--tan) !important}
.cert-chip .dot,.live-dot{background:var(--tan) !important;box-shadow:none !important}
.cert-mark{color:var(--tan) !important}
.why-num,.del-num,.step-time{color:var(--tan-ink) !important}
.why-roman{color:var(--tan-ink) !important;box-shadow:inset 0 0 0 1px var(--tan) !important}
.g-check{color:var(--tan) !important}
/* dark cards recolour their contents with triple-class rules; match them */
html body .dark-card.dark-card.dark-card .testi-stars,html body .dark-card.dark-card.dark-card .g-check,html body .dark-card.dark-card.dark-card .cert-mark{color:var(--tan) !important}

/* Headlines wrap in balanced lines, no single orphaned word */
h1,h2,h3,.section-headline{text-wrap:balance}


/* ============================================================
   Consulting-firm layout pass 2 (Sep 2026): plain nav, square
   corners, flat cards, bottom-left hero, statement section.
   ============================================================ */

/* ---- Plain full-width nav (was a floating glass pill) ------------- */
html body nav#nav,html body nav#nav.compact,html body nav#nav.on-hero{
  top:0 !important;left:0 !important;right:0 !important;transform:none !important;
  width:100% !important;max-width:none !important;border-radius:0 !important;
  padding:16px max(28px,calc((100% - var(--max,1200px))/2 + 28px)) !important;
  -webkit-backdrop-filter:none !important;backdrop-filter:none !important;
}
html body nav#nav,html body nav#nav.compact{
  background:#fff !important;box-shadow:none !important;border-bottom:1px solid rgba(20,17,13,.08) !important;
}
html body nav#nav.on-hero{background:transparent !important;box-shadow:none !important;border-bottom:1px solid rgba(255,255,255,.14) !important}
html body nav#nav .nav-actions a.btn-pill,html body nav#nav.on-hero .nav-actions a.btn-pill{border-radius:4px !important;box-shadow:none !important;transform:none !important}
html body nav#nav.on-hero .nav-actions a.btn-pill{background:#F5F3F0 !important;color:#14110D !important;border:none !important}
html body nav#nav.on-hero .nav-actions a.btn-pill .live{background:var(--tan) !important}
html body nav#nav .nav-links a.active,html body nav#nav .nav-links a[aria-current]{background:none !important;box-shadow:none !important;color:var(--ink) !important}
html body nav#nav.on-hero .nav-links a.active,html body nav#nav.on-hero .nav-links a[aria-current]{color:#fff !important}
@media(max-width:860px){html body nav#nav,html body nav#nav.compact,html body nav#nav.on-hero{padding:12px 20px !important}}

/* ---- Square corners everywhere (was 12-20px and full pills) ------- */
:root{--r-sm:2px !important;--r:4px !important;--r-lg:6px !important;--pill:4px !important}
.btn-primary,.btn-primary-dark,.btn-ghost,.pkg-btn,.os-cta,.vs-cta,.hf-btn,.cert-chip,.wk-go,
.testi-cta a,.faq-item,.pkg-card,.testi-card,.svcb,.svcb-photo,.wk-strip,.wk-photo,.price-card,
.blog-card,.stat-box,.highlight-box,.step-item,.proc-step,.about-photo,.about-photo img,
.offer-strip,.guarantee,.founding-banner,.pricing-note,.why-card,.sa-item,.sys-item,.funnel-step,.svc-card,
input,select,textarea,button{border-radius:4px !important}
.why-roman,.live,.live-dot,.dot,.soc,.cav,.g-check,.os-slot{border-radius:50% !important}
.os-slot{border-radius:2px !important}

/* ---- Flat cards: white, one hairline, no shadow, no glass ---------- */
html body .faq-item.faq-item,html body .pkg-card.pkg-card:not(.pkg-card--light),
html body .stat-box.stat-box,html body .highlight-box.highlight-box,html body .blog-card.blog-card,
html body .proc-step.proc-step,html body .step-item.step-item,html body .ps-col.ps-col,html body .sys-item.sys-item,
html body .funnel-step.funnel-step,html body .sa-item.sa-item,html body .svc-card.svc-card,html body .guarantee.guarantee,
html body .founding-banner.founding-banner,html body .pricing-note.pricing-note,html body .about-card.about-card,
html body .vs-card.vs-card,html body .ladder-card.ladder-card,html body .why-card.why-card,html body .wk-strip.wk-strip,
html body .offer-strip.offer-strip,html body .ind-card.ind-card{
  background:#fff !important;background-image:none !important;
  box-shadow:none !important;border:1px solid rgba(20,17,13,.10) !important;
  -webkit-backdrop-filter:none !important;backdrop-filter:none !important;color:var(--ink);
}
html body .testi-card:hover,html body .blog-card:hover,html body .pkg-card:hover,html body .wk-strip:hover,html body .ind-card:hover{
  transform:none !important;box-shadow:none !important;border-color:rgba(20,17,13,.22) !important}
/* text inside cards that used to be lit for a dark surface */
html body .faq-item p,html body .blog-card p,html body .stat-box p,html body .highlight-box p{color:var(--soft) !important}
html body .faq-item h4,html body .faq-item summary,
html body .blog-card h2,html body .blog-card h3,html body .pkg-card .pkg-name,html body .stat-box strong,html body .highlight-box strong{color:var(--ink) !important}
html body .card-tag,html body .article-tag,html body .article-tag a,html body .blog-card .card-tag{color:var(--tan-ink) !important}
html body .pkg-card:not(.pkg-card--light) .pkg-tier,html body .pkg-card:not(.pkg-card--light) .pkg-forwho{color:var(--mute) !important}
html body .pkg-card:not(.pkg-card--light) .pkg-btn{background:#14110D !important;color:#fff !important;border:none !important}
html body .pkg-card:not(.pkg-card--light) .pkg-note{color:var(--mute) !important}
html body .pkg-card .pkg-badge{border-radius:3px !important}

/* ---- Photo cards stay dark behind the photo, corners squared ------- */
html body .svcb.dark-card{box-shadow:none !important}

/* Westbridge-style hero: photo full-bleed, copy anchored bottom-left,
   one sentence, one button. Proof lives in the stats row just below. */
html body .hero--firm{min-height:min(92vh,860px);display:flex;align-items:flex-end;padding:0 !important;text-align:left}
html body .hero--firm::before{background:
  linear-gradient(0deg,rgba(8,7,6,.86) 0%,rgba(8,7,6,.55) 38%,rgba(8,7,6,.18) 70%,rgba(8,7,6,.35) 100%) !important}
.hf-inner{position:relative;z-index:2;width:100%;max-width:var(--max);margin:0 auto;padding:0 28px clamp(48px,7vh,80px)}
.hf-eyebrow{font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:rgba(245,243,240,.7);margin:0 0 20px;display:flex;align-items:center;gap:10px}
.hf-eyebrow::before{content:none}
html body .hero--firm .hf-h1{font-size:clamp(40px,5.2vw,78px) !important;line-height:1 !important;letter-spacing:-.04em !important;color:#F5F3F0 !important;max-width:15ch;margin:0 !important;text-align:left !important}
.hf-row{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-top:36px;padding-top:28px;border-top:1px solid rgba(255,255,255,.18)}
.hf-sub{max-width:520px;font-size:17px;line-height:1.6;color:rgba(245,243,240,.78);margin:0}
.hf-actions{display:flex;flex-direction:column;align-items:flex-end;gap:12px;flex:none}
.hf-btn{display:inline-flex;align-items:center;gap:10px;background:#F5F3F0;color:#14110D;font-size:15px;font-weight:500;padding:15px 24px;border-radius:4px;text-decoration:none;transition:background .2s}
.hf-btn:hover{background:#fff}
.hf-slots{font-size:12.5px;color:rgba(245,243,240,.6)}
@media(max-width:760px){
  html body .hero--firm{min-height:88vh}
  .hf-inner{padding:0 20px 40px}
  .hf-row{flex-direction:column;align-items:flex-start;gap:22px;margin-top:26px;padding-top:22px}
  .hf-actions{align-items:flex-start}
  .hf-sub{font-size:16px}
}

/* Westbridge "Who We Are": one large statement instead of card lists */
.st-sec{padding:clamp(88px,11vw,140px) 0 !important}
.st-wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
html body .st-statement{font-size:clamp(28px,3.6vw,48px) !important;line-height:1.16 !important;letter-spacing:-.025em !important;font-weight:500 !important;max-width:1060px;margin:26px 0 0 !important;text-align:left}
.st-foot{display:grid;grid-template-columns:minmax(0,560px) auto;justify-content:space-between;align-items:end;gap:32px;margin-top:48px;padding-top:28px;border-top:1px solid var(--line)}
.st-body{font-size:16px;line-height:1.7;color:var(--soft);margin:0}
.st-link{font-size:14px;font-weight:500;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--tan);padding-bottom:3px;white-space:nowrap}
.st-sec .ind-line{margin-top:40px}
@media(max-width:760px){.st-wrap{padding:0 20px}.st-foot{grid-template-columns:1fr;gap:20px;margin-top:32px}}
.hf-stars{color:var(--tan);letter-spacing:1px;margin-right:4px}
html body .hero--firm .hf-h1 em{color:rgba(245,243,240,.6) !important}
/* legibility fixes found in the flat-card audit */
html body .price-travel{color:rgba(20,17,13,.6) !important}
html body .price-travel strong,html body .price-travel a{color:var(--ink) !important}
html body .form-privacy{color:rgba(20,17,13,.52) !important}
html body .wk-tag{color:rgba(20,17,13,.54) !important}
/* pricing packages: flatten the dark tier cards too (their page rules are
   triple-class + !important, so these are scoped by the section id) */
html body #packages .pkg-card:not(.pkg-card--light){
  background:#fff !important;background-image:none !important;box-shadow:none !important;
  border:1px solid rgba(20,17,13,.10) !important;color:#14110D !important}
html body #packages .pkg-card.featured:not(.pkg-card--light){border:1.5px solid var(--tan) !important}
html body #packages .pkg-card:not(.pkg-card--light) *:not(.pkg-btn):not(.pkg-btn *):not(.pkg-badge):not(.pkg-badge *){color:rgba(20,17,13,.68) !important;border-color:rgba(20,17,13,.10) !important}
html body #packages .pkg-card:not(.pkg-card--light) :is(h2,h3,h4,.pkg-name,.pkg-price,.pkg-num,strong,b):not(.pkg-btn *){color:#14110D !important}
html body #packages .pkg-card:not(.pkg-card--light) :is(.pkg-tier,.pkg-kicker,.pkg-eyebrow){color:var(--tan-ink) !important}
html body #packages .pkg-card:not(.pkg-card--light) .pkg-btn{background:#14110D !important;color:#fff !important;border:none !important;box-shadow:none !important}
html body #packages .pkg-card:not(.pkg-card--light) .pkg-btn *{color:#fff !important}
html body #packages .pkg-card:not(.pkg-card--light) .pkg-badge{background:var(--tan) !important;color:#fff !important;border:none !important}
html body #packages .pkg-card:not(.pkg-card--light) hr,html body #packages .pkg-card:not(.pkg-card--light) [class*="divider"],html body #packages .pkg-card:not(.pkg-card--light) .pkg-top-rule{background:rgba(20,17,13,.10) !important}
html body .form-card-review{color:rgba(20,17,13,.56) !important}

/* Review cards: black, flat, square (the one dark card type on white pages) */
html body .testi-card.testi-card.testi-card{
  background:#0C0A08 !important;background-image:none !important;border:1px solid #0C0A08 !important;
  box-shadow:none !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;color:#F5F3F0 !important}
html body .testi-card.testi-card.testi-card .testi-quote{color:rgba(245,243,240,.82) !important}
html body .testi-card.testi-card.testi-card :is(.testi-name,strong,b,h3,h4){color:#F5F3F0 !important}
html body .testi-card.testi-card.testi-card :is(.testi-meta,.testi-role,.testi-src,small,span:not(.testi-stars)){color:rgba(245,243,240,.56)}
html body .testi-card.testi-card.testi-card .testi-stars{color:rgb(186,154,114) !important}
html body .testi-card.testi-card.testi-card:hover{border-color:#0C0A08 !important;transform:none !important}
html body .testi-card.testi-card.testi-card .testi-source,html body .testi-card.testi-card.testi-card .testi-source *{color:rgba(245,243,240,.56) !important}
/* hero: the legacy .hero rule makes it a column, so anchor with justify-content */
html body .hero--firm{flex-direction:column !important;justify-content:flex-end !important;align-items:stretch !important}
@media(max-width:760px){
  html body .hero--firm{min-height:0 !important;padding-top:150px !important}
  .hf-eyebrow{font-size:10.5px;letter-spacing:.12em;white-space:nowrap;margin-bottom:16px}
  html body .hero--firm .hf-h1{font-size:clamp(34px,10vw,44px) !important;line-height:1.03 !important}
  .hf-inner{padding-bottom:44px}
  .hf-sub{font-size:15.5px;line-height:1.55}
  .hf-btn{width:100%;justify-content:center}
  .hf-actions{width:100%;align-items:stretch}
  .hf-slots{text-align:center}
}
/* hero: no blurred photo layer (old mobile "blurred fill" rule) and no glass
   sheen on the nav. The photo fills the hero; a plain gradient sits on top. */
html body .hero--firm::after{content:none !important;display:none !important}
html body .hero--firm .hero-wave,html body .hero--firm picture{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;object-fit:cover !important;object-position:60% center !important;filter:none !important;transform:none !important;z-index:0 !important}
html body .hero--firm::before{z-index:1 !important;background:
  linear-gradient(180deg,rgba(8,7,6,.62) 0%,rgba(8,7,6,.20) 22%,rgba(8,7,6,.20) 45%,rgba(8,7,6,.88) 100%) !important}
html body nav#nav::after,html body nav#nav::before{content:none !important;display:none !important}

/* ---- Nav: no status dot on the Book a Call button ------------------ */
html body #nav .btn-pill .live,html body .mobile-menu .btn-pill .live{display:none !important}

/* ---- Review cards: equal height, quote on top, name pinned to the foot */
html body .testi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
html body .testi-grid .testi-card.testi-card.testi-card{
  display:flex !important;flex-direction:column !important;height:100% !important;
  margin:0 !important;padding:30px 28px 26px !important;min-height:0}
html body .testi-grid .testi-card .testi-stars{margin:0 0 18px !important;font-size:14px;letter-spacing:2px}
html body .testi-grid .testi-card .testi-quote{flex:1 1 auto;margin:0 0 28px !important;font-size:15.5px !important;line-height:1.65 !important}
html body .testi-grid .testi-card .testi-author{margin-top:auto !important;padding-top:20px;border-top:1px solid rgba(245,243,240,.12);display:flex;flex-direction:column;align-items:flex-start;gap:3px}
html body .testi-grid .testi-card .testi-name{font-size:15px;font-weight:500;margin:0 0 3px}
html body .testi-grid .testi-card .testi-source{font-size:12.5px}
@media(max-width:900px){html body .testi-grid{grid-template-columns:1fr}html body .testi-grid .testi-card.testi-card.testi-card{height:auto !important}}

/* ---- Google-style review cards, in the site palette ----------------- */
html body .testi-card--g .gr-top{display:flex;align-items:center;justify-content:space-between;margin:0 0 18px}
html body .testi-card--g .gr-top .testi-stars{margin:0 !important;font-size:15px;letter-spacing:1.5px;line-height:1}
html body .testi-card--g .g-mark{width:18px;height:18px;flex:none;color:rgba(245,243,240,.72)}
html body .testi-card--g .testi-author{flex-direction:row !important;align-items:center !important;gap:12px !important}
html body .testi-card--g .gr-avatar{flex:none;width:38px;height:38px;border-radius:50% !important;display:grid;place-items:center;
  background:rgb(139,108,74);color:#F5F3F0;font-size:15px;font-weight:500;letter-spacing:0}
html body .testi-card--g .gr-who{display:flex;flex-direction:column;gap:2px;min-width:0}
html body .testi-card--g .testi-name{margin:0 !important;line-height:1.25}
html body .testi-card--g .testi-source{line-height:1.3}

/* ---- Review cards v2: compact, even, readable ----------------------- */
html body .testi-grid{gap:20px !important;margin-top:4px}
html body .testi-grid .testi-card.testi-card.testi-card{padding:30px 30px 26px !important;border-radius:6px !important}
html body .testi-card--g .gr-top{margin:0 0 20px !important}
html body .testi-card--g .gr-top .testi-stars{font-size:14px !important;letter-spacing:2px !important}
html body .testi-card--g .g-mark{width:20px;height:20px;color:rgba(245,243,240,.6)}
html body .testi-grid .testi-card--g .testi-quote{
  flex:1 1 auto;margin:0 0 26px !important;
  font-size:16px !important;line-height:1.62 !important;letter-spacing:-.005em;color:rgba(245,243,240,.86) !important;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;line-clamp:7;overflow:hidden}
html body .testi-card--g .testi-author{padding-top:20px !important;border-top:1px solid rgba(245,243,240,.12) !important}
html body .testi-card--g .gr-avatar{width:40px;height:40px;font-size:16px;background:rgb(139,108,74)}
html body .testi-card--g .testi-name{font-size:15px !important}
html body .testi-card--g .testi-source{font-size:12.5px !important}
@media(max-width:900px){html body .testi-grid .testi-card--g .testi-quote{-webkit-line-clamp:9;line-clamp:9}}

/* ---- Review layout v3: one featured review + two result cards ------- */
html body .testi-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) !important;grid-template-rows:auto auto;gap:20px !important}
html body .testi-grid .testi-card--feat{grid-column:1;grid-row:1 / span 2}
html body .testi-grid .testi-card--g .testi-quote{-webkit-line-clamp:unset !important;line-clamp:none !important;display:block !important;overflow:visible !important}
html body .testi-grid .testi-card--feat.testi-card--feat{padding:40px 40px 32px !important}
html body .testi-grid .testi-card--feat .testi-quote{font-size:clamp(20px,1.85vw,27px) !important;line-height:1.46 !important;letter-spacing:-.012em;color:#F5F3F0 !important}
html body .testi-grid .testi-card--g:not(.testi-card--feat) .testi-quote{font-size:15px !important;line-height:1.6 !important}
.gr-metric{display:flex;align-items:baseline;gap:12px;margin:0 0 16px;padding-bottom:16px;border-bottom:1px solid rgba(245,243,240,.12)}
.gr-num{font-size:clamp(34px,3vw,44px);font-weight:300;letter-spacing:-.04em;line-height:1;color:#F5F3F0}
.gr-lab{font-size:13px;line-height:1.35;color:rgba(245,243,240,.6);max-width:18ch}
@media(max-width:900px){
  html body .testi-grid{grid-template-columns:1fr !important;grid-template-rows:none}
  html body .testi-grid .testi-card--feat{grid-column:auto;grid-row:auto;order:3}
  html body .testi-grid .testi-card--feat.testi-card--feat{padding:30px 26px 26px !important}
}
@media(max-width:900px){html body .testi-grid .testi-card--feat .testi-quote{font-size:16.5px !important;line-height:1.6 !important}}

/* ---- Review layout v3.1: same layout, compact sizing ---------------- */
html body .testi-grid{gap:16px !important}
html body .testi-grid .testi-card.testi-card.testi-card{padding:24px 24px 20px !important}
html body .testi-grid .testi-card--feat.testi-card--feat{padding:30px 32px 24px !important}
html body .testi-grid .testi-card--feat .testi-quote{font-size:clamp(17px,1.35vw,19px) !important;line-height:1.55 !important;margin-bottom:20px !important}
html body .testi-grid .testi-card--g:not(.testi-card--feat) .testi-quote{font-size:14px !important;line-height:1.55 !important;margin-bottom:16px !important}
html body .testi-card--g .gr-top{margin:0 0 14px !important}
.gr-metric{margin:0 0 12px !important;padding-bottom:12px !important;gap:10px !important}
.gr-num{font-size:clamp(26px,2.2vw,32px) !important}
.gr-lab{font-size:12px !important}
html body .testi-card--g .testi-author{padding-top:14px !important}
html body .testi-card--g .gr-avatar{width:34px !important;height:34px !important;font-size:14px !important}
html body .testi-card--g .testi-name{font-size:14px !important}
html body .testi-card--g .testi-source{font-size:12px !important}
@media(max-width:900px){html body .testi-grid .testi-card--feat .testi-quote{font-size:15px !important}}

/* ---- Review cards v4: three identical, compact cards in one row ----- */
html body .testi-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;grid-template-rows:none !important;gap:16px !important;align-items:stretch}
html body .testi-grid .testi-card.testi-card.testi-card{grid-column:auto !important;grid-row:auto !important;padding:22px 22px 18px !important}
html body .testi-grid .testi-card--g .testi-quote{font-size:14px !important;line-height:1.55 !important;margin:0 0 16px !important;color:rgba(245,243,240,.82) !important}
@media(max-width:900px){html body .testi-grid{grid-template-columns:1fr !important}}
/* metric row: label centred against the number, not hung from its baseline */
html body .testi-card--g .gr-metric{align-items:center !important;gap:12px !important}
html body .testi-card--g .gr-num{line-height:1 !important;white-space:nowrap}
html body .testi-card--g .gr-lab{line-height:1.3 !important;max-width:20ch}


/* ---- Lead pop-up: large centered modal over a dimmed backdrop ---------
   Timing lives in /assets/js/lead-popup.js (8s or 50% scroll, every visit).
   The script adds .lead-popup-backdrop; clicking it or Esc closes. */
html body .lead-popup{
  width:560px !important;max-width:calc(100vw - 32px) !important;max-height:calc(100vh - 32px);overflow-y:auto;
  padding:48px 48px 40px !important;background:#fff !important;color:#14110D !important;
  border:1px solid rgba(20,17,13,.12) !important;border-radius:6px !important;
  box-shadow:0 32px 80px rgba(20,17,13,.28) !important;
  -webkit-backdrop-filter:none !important;backdrop-filter:none !important;background-image:none !important}
html body .lead-popup .lp-eyebrow{display:flex;align-items:center;gap:10px;font-size:12px !important;letter-spacing:.16em !important;
  text-transform:uppercase;color:rgba(20,17,13,.64) !important;margin-bottom:16px !important}
html body .lead-popup .lp-eyebrow::before{content:none;display:none}
html body .lead-popup .lp-title{font-size:32px !important;font-weight:500 !important;line-height:1.15 !important;letter-spacing:-.025em;color:#14110D !important;margin-bottom:14px !important;padding-right:24px}
html body .lead-popup .lp-sub{font-size:16.5px !important;line-height:1.55 !important;color:rgba(20,17,13,.64) !important;margin-bottom:28px !important}
html body .lead-popup form{display:flex;gap:10px}
html body .lead-popup input[type=email]{flex:1;min-width:0;background:#fff !important;border:1px solid rgba(20,17,13,.2) !important;border-radius:4px !important;padding:16px 16px !important;font-size:16px !important;color:#14110D !important;box-shadow:none !important}
html body .lead-popup input[type=email]:focus{border-color:#14110D !important;outline:none}
html body .lead-popup button[type=submit]{background:#14110D !important;color:#fff !important;border:none !important;border-radius:4px !important;padding:16px 22px !important;font-size:15px !important;font-weight:500 !important;letter-spacing:0 !important;box-shadow:none !important;white-space:nowrap}
html body .lead-popup button[type=submit]:hover{background:#2A2724 !important}
html body .lead-popup .lp-close{top:16px !important;right:16px !important;width:36px !important;height:36px !important;border-radius:4px !important;
  background:transparent !important;border:none !important;color:rgba(20,17,13,.5) !important;box-shadow:none !important;opacity:1 !important}
html body .lead-popup .lp-close:hover{background:rgba(20,17,13,.06) !important;color:#14110D !important}
html body .lead-popup .lp-close svg{width:14px;height:14px}
html body .lead-popup .lp-meta{font-size:13px !important;color:rgba(20,17,13,.5) !important;margin-top:14px !important}
html body .lead-popup .lp-meta.ok{color:var(--tan-ink) !important}
@media(max-width:600px){
  html body .lead-popup{padding:40px 24px 28px !important}
  html body .lead-popup .lp-title{font-size:26px !important}
  html body .lead-popup .lp-sub{font-size:15.5px !important;margin-bottom:22px !important}
  html body .lead-popup form{flex-direction:column}
}


/* ---- Lead pop-up base (position + show state), shared by every page -- */
.lead-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
html body .lead-popup{position:fixed !important;top:50% !important;left:50% !important;bottom:auto !important;right:auto !important;z-index:1001 !important;
  opacity:0;transform:translate(-50%,-46%) scale(.98) !important;pointer-events:none;transition:opacity .3s,transform .3s}
html body .lead-popup.show{opacity:1;transform:translate(-50%,-50%) scale(1) !important;pointer-events:auto}
.lead-popup-backdrop{position:fixed;inset:0;z-index:1000;background:rgba(20,17,13,.55);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .3s}
.lead-popup-backdrop.show{opacity:1;pointer-events:auto}
html.lp-open,html.lp-open body{overflow:hidden}
.lead-popup .lp-close{position:absolute;display:grid;place-items:center;padding:0;cursor:pointer}
.lead-popup .lp-close svg{width:11px;height:11px;stroke:currentColor;stroke-width:2.2;fill:none}
.lead-popup form{display:flex;gap:8px}
.lead-popup .lp-meta.err{color:#B8451F !important}
@media(prefers-reduced-motion:reduce){.lead-popup,.lead-popup-backdrop{transition:none}}

/* ---- Services page: black cards (packages, "which one is you", funnel
   steps). Overrides the flat-white pass above for these three only. ---- */
html body #packages .pkg-card.pkg-card:not(.pkg-card--light),
html body .ps-card.ps-card.ps-card,
html body .funnel-step.funnel-step.funnel-step{
  background:#0C0A08 !important;background-image:none !important;color:#F5F3F0 !important;
  border:1px solid #0C0A08 !important;box-shadow:none !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
html body #packages .pkg-card.featured:not(.pkg-card--light),
html body .funnel-step.featured.featured{border:1.5px solid rgb(139,108,74) !important}
/* text on the black cards */
html body #packages .pkg-card:not(.pkg-card--light) *:not(.pkg-btn):not(.pkg-btn *):not(.pkg-badge):not(.pkg-badge *),
html body .ps-card.ps-card *,html body .funnel-step.funnel-step *{color:rgba(245,243,240,.74) !important;border-color:rgba(255,255,255,.12) !important}
html body #packages .pkg-card:not(.pkg-card--light) :is(h2,h3,h4,.pkg-name,.pkg-price,.pkg-num,strong,b):not(.pkg-btn *),
html body .ps-card.ps-card :is(h2,h3,h4,strong,b),html body .funnel-step.funnel-step :is(h2,h3,h4,strong,b){color:#F5F3F0 !important}
html body #packages .pkg-card:not(.pkg-card--light) :is(.pkg-tier,.pkg-kicker,.pkg-eyebrow),
html body .funnel-step.funnel-step :is(.funnel-n,.fs-n,.step-n,[class*="num"]),
html body .ps-card.ps-card :is(.ps-tag,[class*="tag"],[class*="kicker"]){color:rgb(186,154,114) !important}
html body #packages .pkg-card:not(.pkg-card--light) :is(svg,.pkg-check,[class*="check"]){color:rgb(186,154,114) !important;stroke:currentColor}
html body #packages .pkg-card:not(.pkg-card--light) .pkg-btn{background:#F5F3F0 !important;color:#14110D !important;border:none !important}
html body #packages .pkg-card:not(.pkg-card--light) .pkg-btn *{color:#14110D !important}
html body #packages .pkg-card:not(.pkg-card--light) .pkg-badge{background:rgb(139,108,74) !important;color:#fff !important}
html body #packages .pkg-card:not(.pkg-card--light) :is(hr,[class*="divider"],.pkg-top-rule){background:rgba(255,255,255,.12) !important}
html body .ps-card.ps-card a,html body .funnel-step.funnel-step a{color:rgb(186,154,114) !important}

/* Review cards: pure white, not the warm off-white. On a white page they get a
   crisp hairline and a very soft lift so they still read as cards.
   :not(#_) out-specifies the per-page !important card rules. */
html body .testi-card:not(#_){
  background:#FFFFFF !important;
  border:1px solid rgba(20,17,13,.10) !important;
  box-shadow:0 1px 2px rgba(20,17,13,.04),0 12px 32px rgba(20,17,13,.06) !important;
}

/* ---- Tan never fills (brand guide, Oct 2026) ------------------------
   --gold resolves to the tan accent, so these legacy button rules were
   painting tan buttons: the FAQ CTA, the blog article CTA (16 pages) and
   the old nav-cta hover. Buttons are ink with white text, sentence case,
   like every other primary button. :not(#_) beats the page !important. */
html body :is(.btn-primary-light,.article-cta a):not(#_){
  background:#14110D !important;color:#fff !important;
  font-size:15px !important;font-weight:500 !important;letter-spacing:-.01em !important;
  text-transform:none !important;border-radius:4px !important;box-shadow:none !important;
}
html body :is(.btn-primary-light,.article-cta a):not(#_):hover{background:#2A2724 !important;transform:none !important}
/* the blog CTA sits on a dark box, so it takes the on-dark button: parchment fill, ink text */
html body .article-cta a:not(#_){background:#F5F3F0 !important;color:#14110D !important}
html body .article-cta a:not(#_):hover{background:#fff !important;color:#14110D !important}
html body .nav-cta:not(#_):hover{background:#2A2724 !important;color:#fff !important}

/* ---- Blog boxes and the footer email field: square corners like the
   rest of the site (they were 20px and 12px). ---------------------------- */
html body :is(.related-reading,.build-steps li,.checklist,.scenario-box):not(#_){border-radius:4px !important}
html body footer .gf-form :is(input,button):not(#_){border-radius:4px !important}