/* ============================================================
   AUPTOMIZE PARTNERS — site stylesheet
   System A (Auptomize editorial). Tokens declared once, here.
   ============================================================ */

:root{
  --bg:            oklch(.985 .001 250);
  --bg-soft:       oklch(.962 .003 250);
  --surface:       #ffffff;
  --ink:           oklch(.16 .006 260);
  --ink-2:         oklch(.34 .010 260);
  --muted:         oklch(.48 .012 260);
  --line:          oklch(.878 .004 250);
  --line-soft:     oklch(.925 .003 250);

  --primary:       oklch(.52 .24 293);      /* violet */
  --primary-ink:   oklch(.42 .22 293);
  --primary-wash:  oklch(.955 .022 293);
  --audit:         #C8F23C;                 /* CTA lime, high-contrast click colour */
  --audit-hover:   #D6FF55;
  --audit-ink:     #10150A;
  --star:          oklch(.82 .16 90);
  --neg:           oklch(.55 .17 25);

  --dark:          #0E1116;
  --dark-2:        #161A21;
  --dark-line:     rgba(255,255,255,.12);
  --on-dark:       rgba(255,255,255,.72);

  --wrap: min(1140px, 100% - 160px);
  --r-sm: 6px; --r: 12px; --r-lg: 16px; --r-xl: 24px;
  --ease: cubic-bezier(.16,1,.3,1);
  --head: 76px;

  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
          "Helvetica Neue", Inter, Arial, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--head) + 16px); }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
:focus-visible{ outline:3px solid var(--primary); outline-offset:3px; border-radius:4px; }

/* ---------- type ---------- */
h1,h2,h3,h4{ margin:0; font-weight:650; letter-spacing:-.03em; line-height:1.05; }
h1{ font-size:clamp(42px,6.4vw,78px); letter-spacing:-.035em; }
h2{ font-size:clamp(30px,4.2vw,54px); }
h3{ font-size:clamp(20px,2.1vw,26px); letter-spacing:-.02em; line-height:1.2; }
p{ margin:0 0 18px; }
.eyebrow{
  font-size:12px; font-weight:650; letter-spacing:.14em; text-transform:uppercase;
  color:var(--primary); margin:0 0 18px;
}
.eyebrow.on-dark{ color:#B79BFF; }
.sub{ font-size:21px; line-height:1.55; color:var(--muted); max-width:66ch; }
.sub.on-dark{ color:var(--on-dark); }
.accent{ color:var(--primary); }
.num{ font-variant-numeric:tabular-nums; letter-spacing:-.04em; }

/* ---------- layout ---------- */
.wrap{ width:var(--wrap); margin-inline:auto; }
section{ padding-block:112px; }
section.tight{ padding-block:72px; }
.band-dark{ background:var(--dark); color:#fff; }
.band-soft{ background:var(--bg-soft); }
.band-wash{ background:var(--primary-wash); }
.sec-head{ max-width:760px; margin-bottom:56px; }
.sec-head.center{ margin-inline:auto; text-align:center; max-width:800px; }
.sec-head.center h2, .sec-head.center .sub, .pain-head h2, .pain-head .sub,
.hero-centre h1, .hero-centre .lede{ text-wrap:balance; }
.sec-head p{ margin-top:20px; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:15px 26px; border-radius:var(--r); border:1.5px solid transparent;
  font-size:16px; font-weight:600; letter-spacing:-.01em; cursor:pointer;
  transition:transform .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
}
.btn:hover{ transform:translateY(-2px); }
.btn-audit{ background:var(--audit); color:var(--audit-ink); font-weight:700;
  box-shadow:0 8px 28px -10px rgba(200,242,60,.6); }
.btn-audit:hover{ background:var(--audit-hover); box-shadow:0 12px 34px -10px rgba(200,242,60,.75); }
.btn-primary{ background:var(--primary); color:#fff; }
.btn-ghost{ border-color:var(--line); color:var(--ink); background:var(--surface); }
.btn-ghost:hover{ border-color:var(--ink); }
.btn-ghost.on-dark{ background:transparent; border-color:rgba(255,255,255,.3); color:#fff; }
.btn-ghost.on-dark:hover{ border-color:#fff; }
.btn-row{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.btn-note{ font-size:14px; color:var(--muted); margin-top:18px; }
.btn-note.on-dark{ color:rgba(255,255,255,.55); }

/* ---------- header ---------- */
.utility{
  background:var(--dark-2); color:rgba(255,255,255,.76);
  font-size:13px; letter-spacing:-.005em;
}
.utility .wrap{ display:flex; justify-content:space-between; align-items:center; gap:20px; height:40px; }
.utility strong{ color:#fff; font-weight:600; }
.utility a{ color:#fff; }
.utility-right{ display:flex; gap:22px; align-items:center; }

header.site{
  position:sticky; top:0; z-index:60; height:var(--head);
  border-bottom:1px solid transparent; transition:background .3s var(--ease), border-color .3s var(--ease);
}
header.site.stuck{
  background:rgba(255,255,255,.82); backdrop-filter:saturate(180%) blur(18px);
  border-bottom-color:var(--line-soft);
}
header.site .wrap{ display:flex; align-items:center; gap:36px; height:100%; }

.logo{ display:flex; align-items:center; gap:11px; flex:none; }
.logo svg{ width:28px; height:28px; display:block; }
.logo-text{ display:flex; flex-direction:column; line-height:1; }
.logo-name{ font-size:17px; font-weight:700; letter-spacing:-.035em; }
.logo-sub{ font-size:9.5px; font-weight:600; letter-spacing:.2em; color:var(--muted); margin-top:3px; }

nav.main{ display:flex; align-items:center; gap:4px; margin-left:auto; }
nav.main > .item{ position:relative; }
nav.main > .item > a,
nav.main > .item > button{
  display:flex; align-items:center; gap:6px; padding:10px 13px; border:0; background:none;
  font:inherit; font-size:15px; font-weight:550; color:var(--ink-2); cursor:pointer; border-radius:8px;
}
nav.main > .item > a:hover, nav.main > .item > button:hover{ color:var(--ink); background:var(--bg-soft); }
nav.main > .item > a[aria-current="page"]{ color:var(--primary); }
.caret{ width:9px; height:9px; transition:transform .2s var(--ease); }
.item[data-open="true"] .caret{ transform:rotate(180deg); }

.mega{
  position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(-6px);
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:0 24px 60px -20px rgba(14,17,22,.22); padding:22px; min-width:560px;
  opacity:0; visibility:hidden; transition:all .22s var(--ease);
}
.item[data-open="true"] .mega{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.mega.wide{ min-width:720px; }
.mega-grid{ display:grid; grid-template-columns:1fr 1fr; gap:6px 24px; }
.mega-grid.three{ grid-template-columns:repeat(3,1fr); }
.mega-col-head{
  grid-column:1/-1; font-size:11px; font-weight:650; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); padding:10px 10px 6px;
}
.mega a.m-link{ display:block; padding:11px 10px; border-radius:10px; transition:background .18s var(--ease); }
.mega a.m-link:hover{ background:var(--bg-soft); }
.m-link .t{ font-size:15px; font-weight:600; letter-spacing:-.015em; }
.m-link .d{ font-size:13px; color:var(--muted); margin-top:2px; line-height:1.4; }

.head-cta{ flex:none; margin-left:8px; }
.head-cta .btn{ padding:12px 20px; font-size:15px; }
.burger{ display:none; margin-left:auto; background:none; border:1.5px solid var(--line);
  border-radius:10px; width:44px; height:44px; cursor:pointer; align-items:center; justify-content:center; }
.burger span{ display:block; width:18px; height:1.5px; background:var(--ink); position:relative; }
.burger span::before,.burger span::after{ content:""; position:absolute; left:0; width:18px; height:1.5px; background:var(--ink); }
.burger span::before{ top:-5px; } .burger span::after{ top:5px; }

.mobile-nav{ display:none; background:var(--surface); border-bottom:1px solid var(--line); }
.mobile-nav.open{ display:block; }
.mobile-nav .wrap{ padding-block:18px; }
.mobile-nav a{ display:block; padding:13px 0; border-bottom:1px solid var(--line-soft); font-weight:600; }
.mobile-nav .mgroup{ font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); padding:20px 0 6px; font-weight:650; }

/* ---------- hero ---------- */
.hero{ background:var(--dark); color:#fff; padding-block:104px 96px; position:relative; overflow:hidden; }
.hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(760px 420px at 88% -8%, oklch(.52 .24 293 / .34), transparent 70%),
    radial-gradient(620px 420px at 6% 104%, oklch(.45 .12 151 / .20), transparent 70%);
}
.hero .wrap{ position:relative; z-index:1; }
.hero h1{ max-width:17ch; }
.hero .sub{ margin-top:26px; }
.hero .btn-row{ margin-top:38px; }
.rotator{ display:inline-grid; vertical-align:bottom; }
.rotator span{
  grid-area:1/1; color:#B79BFF; opacity:0; transform:translateY(.22em);
  transition:opacity .5s var(--ease), transform .5s var(--ease);
}
.rotator span.on{ opacity:1; transform:none; }

.trust-line{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 22px; margin-top:34px;
  font-size:14px; color:rgba(255,255,255,.6); }
.stars{ color:var(--star); letter-spacing:2px; font-size:14px; }

/* ---------- stat bar ---------- */
.stat-bar{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.stat-bar.on-dark{ background:var(--dark-line); border-color:var(--dark-line); }
.stat{ background:var(--surface); padding:30px 26px; }
.stat-bar.on-dark .stat{ background:var(--dark); }
.stat .v{ font-size:clamp(32px,3.4vw,44px); font-weight:650; color:var(--primary); line-height:1; }
.stat-bar.on-dark .stat .v{ color:#B79BFF; }
.stat .k{ font-size:14px; color:var(--muted); margin-top:11px; line-height:1.4; }
.stat-bar.on-dark .stat .k{ color:rgba(255,255,255,.58); }
.hero .stat-bar{ margin-top:64px; }

/* ---------- marquee ---------- */
.marquee{ overflow:hidden; border-block:1px solid var(--line); background:var(--surface); padding-block:20px; }
.marquee-track{ display:flex; gap:0; width:max-content; animation:slide 46s linear infinite; }
.marquee-track span{ display:flex; align-items:center; gap:34px; padding-right:34px;
  font-size:16px; font-weight:550; color:var(--ink-2); white-space:nowrap; }
.marquee-track b{ color:var(--primary); font-weight:650; }
.marquee-track span::after{ content:"◆"; color:var(--line); font-size:9px; }
@keyframes slide{ to{ transform:translateX(-50%); } }
.marquee:hover .marquee-track{ animation-play-state:paused; }

/* ---------- service tabs ---------- */
.tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:40px; }
.tab{
  padding:12px 20px; border:1.5px solid var(--line); background:var(--surface); border-radius:999px;
  font:inherit; font-size:15px; font-weight:600; color:var(--ink-2); cursor:pointer;
  transition:all .2s var(--ease);
}
.tab:hover{ border-color:var(--ink); }
.tab[aria-selected="true"]{ background:var(--primary); border-color:var(--primary); color:#fff; }
.panel{ display:none; }
.panel.on{ display:block; animation:fade .45s var(--ease); }
@keyframes fade{ from{ opacity:0; transform:translateY(10px); } }

.cb{ display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:start; }
.cb-copy h3{ margin-bottom:16px; }
.cb-copy p{ color:var(--muted); }
table.cb-table{ width:100%; border-collapse:collapse; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
table.cb-table th{
  text-align:left; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); font-weight:650; padding:16px 20px; background:var(--bg-soft);
  border-bottom:1px solid var(--line);
}
table.cb-table th:first-child{ width:50%; border-right:1px solid var(--line); }
table.cb-table td{ padding:17px 20px; font-size:15.5px; border-bottom:1px solid var(--line-soft); vertical-align:top; }
table.cb-table td:first-child{ color:var(--muted); border-right:1px solid var(--line-soft); }
table.cb-table td:last-child{ font-weight:600; }
table.cb-table tr:last-child td{ border-bottom:0; }

/* ---------- ai visibility tiles ---------- */
.ai-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.ai-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:24px; }
.ai-card .src{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--primary); }
.ai-card .q{ font-size:19px; font-weight:600; letter-spacing:-.02em; margin:16px 0 22px; line-height:1.3; }
.ai-card .hit{ display:flex; align-items:center; gap:12px; padding-top:18px; border-top:1px solid var(--line-soft); }
.ai-dot{ width:34px; height:34px; border-radius:9px; background:var(--primary-wash); color:var(--primary);
  display:grid; place-items:center; font-weight:700; font-size:14px; flex:none; }
.ai-card .nm{ font-weight:650; font-size:15px; letter-spacing:-.015em; }
.ai-card .mt{ font-size:13px; color:var(--muted); }

/* ---------- steps ---------- */
.steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.step{ background:var(--surface); padding:30px 26px 34px; }
.step .n{ font-size:12px; font-weight:700; letter-spacing:.14em; color:var(--primary); }
.step h3{ font-size:19px; margin:16px 0 12px; }
.step p{ font-size:15px; color:var(--muted); margin:0; }

/* ---------- results / case rows ---------- */
.result-row{ border-top:1px solid var(--line); }
.result-row a, .result-row .r-inner{
  display:grid; grid-template-columns:auto 1fr auto; gap:32px; align-items:center;
  padding:30px 4px; transition:background .22s var(--ease), padding-inline .22s var(--ease);
}
.result-row a:hover{ background:var(--surface); padding-inline:22px; }
.result-row .big{ font-size:clamp(30px,3.4vw,42px); font-weight:650; color:var(--primary); min-width:200px; }
.result-row .mid .t{ font-size:19px; font-weight:600; letter-spacing:-.02em; }
.result-row .mid .d{ font-size:15px; color:var(--muted); margin-top:4px; }
.result-row .go{ font-size:14px; font-weight:600; color:var(--muted); white-space:nowrap; }
.result-row a:hover .go{ color:var(--primary); }

.case-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.case-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:28px; display:flex; flex-direction:column; transition:all .3s var(--ease);
}
.case-card:hover{ transform:translateY(-4px); box-shadow:0 22px 50px -24px rgba(14,17,22,.25); border-color:var(--ink); }
.case-card .tag{ font-size:11px; font-weight:650; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.case-card .v{ font-size:clamp(32px,3.2vw,42px); font-weight:650; color:var(--primary); margin:18px 0 6px; line-height:1; }
.case-card h3{ font-size:19px; margin:12px 0 14px; }
.case-card p{ font-size:15px; color:var(--muted); flex:1; }
.case-card .go{ font-size:14.5px; font-weight:650; color:var(--primary); }

/* ---------- industries ---------- */
.ind-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.ind-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:28px; transition:all .3s var(--ease); }
.ind-card:hover{ border-color:var(--primary); transform:translateY(-3px); }
.ind-card h3{ font-size:20px; margin-bottom:8px; }
.ind-card .d{ font-size:15px; color:var(--muted); margin-bottom:20px; }
.chips{ display:flex; flex-wrap:wrap; gap:7px; }
.chip{ font-size:12.5px; font-weight:600; padding:6px 11px; border-radius:999px;
  background:var(--bg-soft); border:1px solid var(--line-soft); color:var(--ink-2); }

/* ---------- testimonials ---------- */
.quote-grid{ columns:3; column-gap:22px; }
.quote{ break-inside:avoid; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:26px; margin-bottom:22px; }
.quote .stars{ color:var(--star); margin-bottom:14px; }
.quote p{ font-size:16px; margin:0 0 18px; }
.quote .who{ display:flex; align-items:center; gap:11px; }
.avatar{ width:36px; height:36px; border-radius:50%; background:var(--primary-wash);
  color:var(--primary); display:grid; place-items:center; font-weight:700; font-size:14px; flex:none; }
.quote .nm{ font-weight:650; font-size:15px; }
.quote .src{ font-size:13px; color:var(--muted); }

/* ---------- pricing ---------- */
.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.price-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:30px; display:flex; flex-direction:column; }
.price-card.featured{ border:1.5px solid var(--primary); box-shadow:0 22px 56px -28px oklch(.52 .24 293 / .5); }
.price-card .flag{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--primary); margin-bottom:14px; }
.price-card h3{ font-size:22px; }
.price-card .p{ font-size:15px; color:var(--muted); margin:12px 0 22px; }
.price{ display:flex; align-items:baseline; gap:8px; padding-top:22px; border-top:1px solid var(--line-soft); }
.price .amt{ font-size:40px; font-weight:650; letter-spacing:-.04em; }
.price .per{ font-size:15px; color:var(--muted); }
.price-card ul{ list-style:none; padding:0; margin:24px 0; flex:1; }
.price-card li{ font-size:15px; padding:9px 0 9px 28px; position:relative; color:var(--ink-2); }
.price-card li::before{ content:""; position:absolute; left:0; top:17px; width:13px; height:7px;
  border-left:2px solid var(--primary); border-bottom:2px solid var(--primary); transform:rotate(-45deg); }

/* ---------- faq ---------- */
.faq{ max-width:860px; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{ list-style:none; cursor:pointer; padding:26px 48px 26px 0; position:relative;
  font-size:19px; font-weight:600; letter-spacing:-.02em; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; position:absolute; right:6px; top:50%; transform:translateY(-50%);
  font-size:26px; font-weight:400; color:var(--primary); transition:transform .25s var(--ease); }
.faq-item[open] summary::after{ content:"−"; }
.faq-item .a{ padding:0 48px 28px 0; color:var(--muted); font-size:16.5px; }
.faq-item .a p:last-child{ margin:0; }

/* ---------- generic content ---------- */
.prose{ max-width:72ch; }
.prose h2{ margin-top:56px; margin-bottom:20px; }
.prose h3{ margin-top:38px; margin-bottom:14px; }
.prose ul{ padding-left:22px; margin:0 0 20px; }
.prose li{ margin-bottom:10px; }
.two-col{ display:grid; grid-template-columns:1.05fr 1fr; gap:64px; align-items:start; }
.data-table{ width:100%; border-collapse:collapse; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.data-table th{ text-align:left; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); font-weight:650; padding:16px 20px; background:var(--bg-soft);
  border-bottom:1px solid var(--line); }
.data-table td{ padding:16px 20px; border-bottom:1px solid var(--line-soft); font-size:16px; }
.data-table td:last-child{ font-weight:650; font-variant-numeric:tabular-nums; }
.data-table tr:last-child td{ border-bottom:0; }
.data-table tr.total td{ background:var(--primary-wash); color:var(--primary-ink); font-weight:700; }

.callout{ background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--primary);
  border-radius:var(--r); padding:24px 26px; margin:32px 0; }
.callout p:last-child{ margin:0; }
.pull{ font-size:clamp(22px,2.4vw,30px); font-weight:650; letter-spacing:-.025em; line-height:1.3;
  margin:40px 0; padding-left:26px; border-left:3px solid var(--primary); }
.pull cite{ display:block; font-size:15px; font-weight:500; font-style:normal;
  color:var(--muted); letter-spacing:0; margin-top:14px; }

/* ---------- page hero (inner pages) ---------- */
.page-hero{ background:var(--dark); color:#fff; padding-block:84px 76px; position:relative; overflow:hidden; }
.page-hero::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(700px 400px at 90% -10%, oklch(.52 .24 293 / .3), transparent 70%); }
.page-hero .wrap{ position:relative; z-index:1; }
.page-hero h1{ font-size:clamp(38px,5.2vw,64px); max-width:19ch; }
.page-hero .sub{ margin-top:22px; }
.crumbs{ font-size:13px; color:rgba(255,255,255,.5); margin-bottom:22px; }
.crumbs a:hover{ color:#fff; }

/* ---------- form ---------- */
.form-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:32px; }
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:14px; font-weight:600; margin-bottom:7px; }
.field input,.field select,.field textarea{
  width:100%; padding:13px 15px; border:1.5px solid var(--line); border-radius:var(--r);
  font:inherit; font-size:16px; background:var(--bg); color:var(--ink);
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--primary); box-shadow:0 0 0 3px oklch(.52 .24 293 / .18);
}
.field .hint{ font-size:13px; color:var(--muted); margin-top:6px; }
.consent{ background:var(--bg-soft); border-radius:var(--r); padding:16px; font-size:13.5px;
  color:var(--muted); margin-bottom:20px; }

/* ---------- final cta ---------- */
.cta-band{ background:var(--dark); color:#fff; padding-block:100px; position:relative; overflow:hidden; }
.cta-band::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(700px 420px at 50% 120%, oklch(.52 .24 293 / .34), transparent 70%); }
.cta-band .wrap{ position:relative; z-index:1; text-align:center; }
.cta-band h2{ max-width:18ch; margin-inline:auto; }
.cta-band .sub{ margin:22px auto 0; text-align:center; }
.cta-band .btn-row{ justify-content:center; margin-top:36px; }

/* ---------- footer ---------- */
footer.site{ background:var(--dark-2); color:rgba(255,255,255,.64); padding-block:72px 0; font-size:15px; }
footer.site .cols{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:48px; padding-bottom:56px; }
footer.site h4{ font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.44); font-weight:650; margin-bottom:18px; }
footer.site ul{ list-style:none; padding:0; margin:0; }
footer.site li{ margin-bottom:11px; }
footer.site a:hover{ color:#fff; }
footer.site .blurb{ max-width:34ch; margin:20px 0; line-height:1.6; }
footer .logo-name,footer .logo-sub{ color:#fff; }
footer .logo-sub{ color:rgba(255,255,255,.5); }
.directory{ border-top:1px solid var(--dark-line); padding-block:40px; }
.directory h4{ font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.44); font-weight:650; margin-bottom:16px; }
.directory .links{ display:flex; flex-wrap:wrap; gap:8px 10px; }
.directory .links a{ font-size:13px; color:rgba(255,255,255,.5);
  border:1px solid var(--dark-line); border-radius:999px; padding:6px 12px; }
.directory .links a:hover{ color:#fff; border-color:rgba(255,255,255,.4); }
.legal{ border-top:1px solid var(--dark-line); padding-block:26px; display:flex;
  justify-content:space-between; flex-wrap:wrap; gap:16px; font-size:13.5px; color:rgba(255,255,255,.44); }
.legal .r{ display:flex; gap:22px; flex-wrap:wrap; }

/* ---------- mobile sticky bar ---------- */
.mobile-cta{ display:none; position:fixed; bottom:0; left:0; right:0; z-index:70;
  background:rgba(255,255,255,.94); backdrop-filter:blur(16px);
  border-top:1px solid var(--line); padding:12px 20px calc(12px + env(safe-area-inset-bottom)); }
.mobile-cta .btn{ width:100%; }

/* ---------- reveal ---------- */
.rv{ opacity:0; transform:translateY(22px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.rv.in{ opacity:1; transform:none; }

/* ---------- responsive ---------- */
@media (max-width:1080px){
  :root{ --wrap:min(1200px, 100% - 56px); }
  .quote-grid{ columns:2; }
  .ai-grid,.case-grid,.ind-grid,.price-grid{ grid-template-columns:repeat(2,1fr); }
  .two-col,.cb{ grid-template-columns:1fr; gap:40px; }
}
@media (max-width:860px){
  :root{ --wrap:min(1200px, 100% - 40px); }
  body{ font-size:16px; }
  h1{ font-size:clamp(34px,8.4vw,52px); }
  .sub{ font-size:18px; }
  section{ padding-block:72px; }
  nav.main,.head-cta{ display:none; }
  .burger{ display:flex; }
  .mobile-cta{ display:block; }
  footer.site{ padding-bottom:84px; }
  .stat-bar{ grid-template-columns:repeat(2,1fr); }
  .quote-grid{ columns:1; }
  .ai-grid,.case-grid,.ind-grid,.price-grid{ grid-template-columns:1fr; }
  footer.site .cols{ grid-template-columns:1fr 1fr; gap:32px; }
  .result-row a,.result-row .r-inner{ grid-template-columns:1fr; gap:10px; padding:24px 0; }
  .result-row .big{ min-width:0; }
  .utility .wrap{ font-size:12px; }
  .utility-right{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .rv{ opacity:1; transform:none; }
}

/* ============================================================
   V2: Builder Funnel sequence
   ============================================================ */

/* hero split with fit form */
.hero-split{ display:grid; grid-template-columns:1fr 412px; gap:56px; align-items:start; }
.hero-split h1{ font-size:clamp(34px,4.4vw,56px); max-width:none; text-wrap:balance; }
.hero-split .lede{ font-size:19px; line-height:1.6; color:var(--on-dark); max-width:46ch; margin-top:28px; }
.strike{
  color:rgba(255,255,255,.42);
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
  background-image:linear-gradient(to bottom,
    transparent 0 calc(54% - 2px), #B79BFF calc(54% - 2px) calc(54% + 2px), transparent calc(54% + 2px));
}

.fit-card{ background:var(--surface); border-radius:var(--r-xl); padding:30px;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.6); color:var(--ink); }
.fit-card .kicker{ font-size:11px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--primary); }
.fit-card h2{ font-size:26px; margin:12px 0 10px; letter-spacing:-.025em; }
.fit-card .note{ font-size:14.5px; color:var(--muted); margin-bottom:22px; }
.fit-steps{ display:flex; justify-content:space-between; align-items:center;
  font-size:12px; font-weight:650; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); padding-bottom:12px; border-bottom:1px solid var(--line); margin-bottom:20px; }
.fit-bar{ height:3px; background:var(--line-soft); border-radius:2px; margin-bottom:20px; overflow:hidden; }
.fit-bar i{ display:block; height:100%; background:var(--primary); width:33.3%; transition:width .4s var(--ease); }
.fit-step{ display:none; } .fit-step.on{ display:block; }
.fit-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.fit-card .field{ margin-bottom:14px; }
.fit-card .field input,.fit-card .field select{ padding:12px 14px; font-size:15px; }
.fit-nav{ display:flex; gap:10px; margin-top:6px; }
.fit-nav .btn{ flex:1; padding:14px 18px; }
.fit-foot{ font-size:12.5px; color:var(--muted); text-align:center; margin:16px 0 0; }

/* pain section */
.pain-head{ text-align:center; max-width:800px; margin:0 auto 20px; }
.pain-head h2{ font-size:clamp(32px,4.4vw,56px); line-height:1.08; }
.pain-head .sub{ margin:24px auto 0; text-align:center; font-size:19px; }
.ul-mark{ box-shadow:inset 0 -.28em 0 oklch(.52 .24 293 / .22); }
.out-mark{ color:transparent; -webkit-text-stroke:1.6px var(--ink); }
.pain-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:64px; }
.pain-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:28px; }
.pain-card h3{ font-size:19px; line-height:1.25; margin-bottom:14px; }
.pain-card p{ font-size:15px; color:var(--muted); margin:0; }

/* pillars */
.pillars{ display:grid; grid-template-columns:repeat(5,1fr); gap:1px;
  background:var(--dark-line); border:1px solid var(--dark-line); border-radius:var(--r-lg); overflow:hidden; }
.pillar{ background:var(--dark); padding:30px 24px 34px; }
.pillar .n{ font-size:11px; font-weight:700; letter-spacing:.14em; color:#B79BFF; }
.pillar h3{ font-size:20px; margin:16px 0 12px; color:#fff; }
.pillar p{ font-size:14.5px; color:rgba(255,255,255,.58); margin:0; }

/* gate */
.gate{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.gate-col{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:30px; }
.gate-col.no{ background:var(--bg-soft); }
.gate-col h3{ font-size:20px; margin-bottom:20px; }
.gate-col ul{ list-style:none; padding:0; margin:0; }
.gate-col li{ font-size:15.5px; padding:11px 0 11px 30px; position:relative; color:var(--ink-2);
  border-bottom:1px solid var(--line-soft); }
.gate-col li:last-child{ border-bottom:0; }
.gate-col.yes li::before{ content:""; position:absolute; left:2px; top:20px; width:13px; height:7px;
  border-left:2px solid var(--primary); border-bottom:2px solid var(--primary); transform:rotate(-45deg); }
.gate-col.no li{ color:var(--muted); }
.gate-col.no li::before{ content:"×"; position:absolute; left:4px; top:10px;
  font-size:18px; color:var(--neg); font-weight:600; }

/* region switch */
.region{ position:relative; }
.region > button{ display:flex; align-items:center; gap:7px; background:none; border:0;
  font:inherit; font-size:13px; color:#fff; cursor:pointer; padding:6px 2px; }
.region-menu{ position:absolute; right:0; top:calc(100% + 8px); background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r); box-shadow:0 20px 50px -18px rgba(0,0,0,.3);
  min-width:190px; padding:6px; opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:all .2s var(--ease); z-index:80; }
.region[data-open="true"] .region-menu{ opacity:1; visibility:visible; transform:none; }
.region-menu a{ display:flex; gap:10px; align-items:center; padding:10px 12px;
  border-radius:8px; font-size:14px; font-weight:550; color:var(--ink); }
.region-menu a:hover{ background:var(--bg-soft); }
.region-menu a[aria-current="true"]{ color:var(--primary); font-weight:650; }

@media (max-width:1080px){
  .hero-split{ grid-template-columns:1fr; gap:44px; }
  .pain-grid{ grid-template-columns:repeat(2,1fr); }
  .pillars{ grid-template-columns:repeat(2,1fr); }
  .gate{ grid-template-columns:1fr; }
}
@media (max-width:860px){
  .pain-grid,.pillars{ grid-template-columns:1fr; }
  .fit-row{ grid-template-columns:1fr; }
}

/* ============================================================
   V3: US site. Rolling results, system diagram, one-page system
   ============================================================ */

/* rolling results wall */
.wall{ display:grid; grid-template-columns:1fr 1.25fr 1fr; gap:22px; height:620px;
  position:relative; overflow:hidden; }
.wall::before,.wall::after{ content:""; position:absolute; left:0; right:0; height:130px;
  z-index:3; pointer-events:none; }
.wall::before{ top:0; background:linear-gradient(var(--dark), transparent); }
.wall::after{ bottom:0; background:linear-gradient(transparent, var(--dark)); }
.wall-col{ overflow:hidden; }
.wall-track{ display:flex; flex-direction:column; gap:16px; animation:wallUp 38s linear infinite; }
.wall-col.down .wall-track{ animation-name:wallDown; animation-duration:46s; }
.wall-col.mid .wall-track{ animation-duration:30s; }
@keyframes wallUp{ from{ transform:translateY(0); } to{ transform:translateY(-50%); } }
@keyframes wallDown{ from{ transform:translateY(-50%); } to{ transform:translateY(0); } }

.res-tile{ background:var(--dark-2); border:1px solid var(--dark-line); border-radius:var(--r-lg);
  padding:24px 26px; }
.res-tile .v{ font-size:clamp(30px,3.2vw,40px); font-weight:650; color:#B79BFF;
  line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.04em; }
.res-tile .k{ font-size:14.5px; color:rgba(255,255,255,.66); margin-top:12px; line-height:1.45; }
.res-tile .src{ font-size:11.5px; color:rgba(255,255,255,.34); margin-top:12px;
  padding-top:12px; border-top:1px solid var(--dark-line); }

.rev-tile{ background:var(--dark-2); border:1px solid var(--dark-line); border-radius:var(--r-lg);
  padding:22px 24px; }
.rev-tile .stars{ color:var(--star); font-size:13px; letter-spacing:2px; }
.rev-tile p{ font-size:15px; color:rgba(255,255,255,.8); margin:12px 0 14px; line-height:1.5; }
.rev-tile .who{ font-size:13px; color:rgba(255,255,255,.44); }

/* system diagram */
.diagram{ background:var(--dark-2); border:1px solid var(--dark-line);
  border-radius:var(--r-xl); padding:40px 32px; }
.diagram svg{ width:100%; height:auto; display:block; }
.flow-dot{ animation:flow 2.6s linear infinite; }
.flow-dot.d2{ animation-delay:.65s; } .flow-dot.d3{ animation-delay:1.3s; }
.flow-dot.d4{ animation-delay:1.95s; }
@keyframes flow{ from{ offset-distance:0%; opacity:0; } 12%{ opacity:1; }
  88%{ opacity:1; } to{ offset-distance:100%; opacity:0; } }
.pulse{ animation:pulse 2.4s ease-in-out infinite; transform-origin:center; }
@keyframes pulse{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }

/* service rows, five as one system */
.svc-row{ display:grid; grid-template-columns:72px 1fr 1.1fr; gap:32px; align-items:start;
  padding:40px 0; border-top:1px solid var(--line); }
.svc-row .idx{ font-size:12px; font-weight:700; letter-spacing:.14em; color:var(--primary); padding-top:8px; }
.svc-row h3{ font-size:26px; margin-bottom:12px; }
.svc-row .lead{ font-size:16.5px; color:var(--muted); margin:0; }
.svc-row ul{ list-style:none; padding:0; margin:0; }
.svc-row li{ font-size:15.5px; padding:10px 0 10px 28px; position:relative; color:var(--ink-2);
  border-bottom:1px solid var(--line-soft); }
.svc-row li:last-child{ border-bottom:0; }
.svc-row li::before{ content:""; position:absolute; left:2px; top:19px; width:12px; height:6px;
  border-left:2px solid var(--primary); border-bottom:2px solid var(--primary); transform:rotate(-45deg); }

/* tier cards without prices */
.tier-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.tier{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:32px; display:flex; flex-direction:column; }
.tier.featured{ border:1.5px solid var(--primary);
  box-shadow:0 24px 60px -30px oklch(.52 .24 293 / .55); }
.tier .flag{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--primary); margin-bottom:14px; }
.tier h3{ font-size:24px; }
.tier .basis{ font-size:17px; font-weight:600; color:var(--primary-ink); margin:16px 0 0;
  padding-top:18px; border-top:1px solid var(--line-soft); }
.tier .p{ font-size:15.5px; color:var(--muted); margin:14px 0 0; }
.tier ul{ list-style:none; padding:0; margin:24px 0; flex:1; }
.tier li{ font-size:15px; padding:9px 0 9px 26px; position:relative; color:var(--ink-2); }
.tier li::before{ content:""; position:absolute; left:0; top:17px; width:12px; height:6px;
  border-left:2px solid var(--primary); border-bottom:2px solid var(--primary); transform:rotate(-45deg); }

/* founder */
.founder{ display:grid; grid-template-columns:300px 1fr; gap:48px; align-items:start; }
.founder-card{ background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:28px; text-align:center; }
.founder-mark{ width:92px; height:92px; border-radius:50%; margin:0 auto 18px;
  background:var(--primary-wash); color:var(--primary); display:grid; place-items:center;
  font-size:30px; font-weight:700; letter-spacing:-.03em; }
.founder-card .nm{ font-size:19px; font-weight:650; letter-spacing:-.02em; }
.founder-card .rl{ font-size:14px; color:var(--muted); margin-top:4px; }

@media (max-width:1080px){
  .wall{ grid-template-columns:1fr 1fr; height:540px; }
  .wall-col.down{ display:none; }
  .tier-grid{ grid-template-columns:1fr; }
  .svc-row{ grid-template-columns:48px 1fr; }
  .svc-row > ul{ grid-column:2; }
  .founder{ grid-template-columns:1fr; gap:28px; }
}
@media (max-width:860px){
  .wall{ grid-template-columns:1fr; height:460px; }
  .wall-col:not(.mid){ display:none; }
}

/* ============================================================
   V4: correct lockup, 4-stage journey, Builder Funnel service cards
   ============================================================ */

/* correct logo lockup: mark | AUPTOMIZE / PARTNERS */
.logo{ gap:12px; }
.logo svg{ width:30px; height:30px; }
.logo-text{ position:relative; padding-left:13px; gap:1px; }
.logo-text::before{ content:""; position:absolute; left:0; top:4%; bottom:4%;
  width:1.5px; background:currentColor; opacity:.3; }
.logo-name,.logo-sub{ font-size:15px; font-weight:800; letter-spacing:-.025em;
  line-height:1.08; color:inherit; margin:0; text-transform:uppercase; }
.logo-sub{ opacity:1; }
footer .logo-name, footer .logo-sub{ color:#fff; }

/* 4-stage journey */
.journey{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; align-items:stretch; }
.stage{ position:relative; display:block; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-xl); padding:30px 26px 32px;
  transition:transform .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease); }
.stage + .stage{ margin-left:30px; }
.stage::after{ content:""; position:absolute; right:-30px; top:50%; width:30px; height:2px;
  background:linear-gradient(90deg, var(--sc, #7C4DFF), transparent); }
.stage:last-child::after{ display:none; }
.stage .arrow{ position:absolute; right:-23px; top:50%; transform:translateY(-50%);
  width:7px; height:7px; border-radius:50%; background:var(--sc, #7C4DFF);
  animation:hop 2.8s linear infinite; }
.stage:nth-child(2) .arrow{ animation-delay:.35s; }
.stage:nth-child(3) .arrow{ animation-delay:.7s; }
@keyframes hop{ 0%{ transform:translate(-14px,-50%); opacity:0; }
  20%{ opacity:1; } 80%{ opacity:1; } 100%{ transform:translate(14px,-50%); opacity:0; } }
.stage:hover{ transform:translateY(-5px); border-color:var(--sc, #7C4DFF);
  box-shadow:0 26px 60px -30px rgba(14,17,22,.3); }
.stage .n{ font-size:11px; font-weight:700; letter-spacing:.16em; color:var(--sc, #7C4DFF); }
.stage h3{ font-size:23px; margin:14px 0 10px; color:var(--ink); letter-spacing:-.025em; }
.stage .d{ font-size:14.5px; color:var(--muted); line-height:1.5; margin-bottom:20px; }
.stage .tools{ display:flex; flex-wrap:wrap; gap:6px; padding-top:18px;
  border-top:1px solid var(--line-soft); }
.stage .tool{ font-size:11.5px; font-weight:600; padding:5px 10px; border-radius:999px;
  background:var(--bg-soft); border:1px solid var(--line-soft); color:var(--ink-2); }
.stage .go{ font-size:13px; font-weight:650; color:var(--sc, #7C4DFF); margin-top:18px;
  opacity:0; transition:opacity .3s var(--ease); }
.stage:hover .go{ opacity:1; }

/* Builder Funnel style service cards */
.svc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.svc-card{ position:relative; overflow:hidden; border-radius:var(--r-xl);
  background:var(--surface); border:1px solid var(--line); padding:34px 28px 30px;
  min-height:400px; display:flex; flex-direction:column; justify-content:flex-end;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.svc-card:hover{ transform:translateY(-6px); box-shadow:0 30px 70px -32px rgba(14,17,22,.3); }
.svc-card.dark{ background:var(--dark); border-color:var(--dark); }
.svc-card .ghost{ position:absolute; top:-6%; left:-6%; font-size:230px; font-weight:800;
  letter-spacing:-.06em; line-height:.8; color:transparent;
  -webkit-text-stroke:1.5px var(--line); pointer-events:none; user-select:none; }
.svc-card.dark .ghost{ -webkit-text-stroke:0; color:#fff; opacity:.97; }
.svc-card .body{ position:relative; z-index:1; }
.svc-card h3{ font-size:25px; margin-bottom:12px; }
.svc-card.dark h3{ color:#fff; }
.svc-card p{ font-size:15px; color:var(--muted); margin:0; }
.svc-card.dark p{ color:rgba(255,255,255,.66); }

@media (max-width:1080px){
  .journey{ grid-template-columns:repeat(2,1fr); gap:24px 54px; }
  .stage + .stage{ margin-left:0; }
  .stage::after,.stage .arrow{ display:none; }
  .svc-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:860px){
  .journey{ grid-template-columns:1fr; gap:16px; }
  .svc-grid{ grid-template-columns:1fr; }
  .svc-card{ min-height:300px; }
  .svc-card .ghost{ font-size:170px; }
}

/* hero photo layer (drop-in per locale) */
.hero.has-photo::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-image:var(--hero-img); background-size:cover; background-position:center 60%;
  filter:grayscale(1) contrast(1.12) brightness(1.15);
  opacity:.95;
}
.hero.has-photo::after{
  background:
    linear-gradient(90deg, rgba(14,17,22,.96) 0%, rgba(14,17,22,.8) 30%,
                           rgba(14,17,22,.4) 58%, rgba(14,17,22,.22) 100%),
    radial-gradient(760px 420px at 88% -8%, oklch(.52 .24 293 / .3), transparent 70%),
    radial-gradient(620px 420px at 6% 104%, oklch(.45 .12 151 / .18), transparent 70%);
}

/* ============================================================
   V6: blended sections, centred hero, qualifier modal, banners
   ============================================================ */

/* soft blends so dark and light sections never cut hard */
.blend{ position:absolute; left:0; right:0; height:110px; pointer-events:none; z-index:2; opacity:.9; }
.blend-bottom{ bottom:-1px; background:linear-gradient(180deg, transparent, var(--blend-to, var(--bg))); }
.blend-top{ top:-1px; background:linear-gradient(180deg, var(--blend-from, var(--bg)), transparent); }
section{ position:relative; }
.blend{ z-index:3; }
header.site.stuck{ background:rgba(255,255,255,.78); }

/* header sits over the hero without a seam */
body.dark-top .utility{ background:var(--dark); }
body.dark-top header.site:not(.stuck){ background:var(--dark); }
body.dark-top header.site:not(.stuck) .logo,
body.dark-top header.site:not(.stuck) nav.main > .item > a{ color:#fff; }
body.dark-top header.site:not(.stuck) nav.main > .item > a:hover{ background:rgba(255,255,255,.08); }
body.dark-top header.site:not(.stuck) .logo-sub{ color:rgba(255,255,255,.75); }
body.dark-top header.site:not(.stuck) .burger{ border-color:rgba(255,255,255,.3); }
body.dark-top header.site:not(.stuck) .burger span,
body.dark-top header.site:not(.stuck) .burger span::before,
body.dark-top header.site:not(.stuck) .burger span::after{ background:#fff; }

/* centred hero, no inline form */
.hero-centre{ text-align:center; max-width:960px; margin-inline:auto; position:relative; z-index:1; }
.hero.has-photo .hero-centre::before{
  content:""; position:absolute; inset:-70px -140px; z-index:-1; pointer-events:none;
  background:radial-gradient(ellipse 70% 60% at 50% 50%,
    rgba(14,17,22,.92) 0%, rgba(14,17,22,.78) 42%, rgba(14,17,22,.35) 70%, transparent 88%);
}
.hero-centre h1{ font-size:clamp(38px,5.6vw,74px); margin-inline:auto; text-wrap:balance; }
.hero-centre .lede{ font-size:19.5px; line-height:1.6; color:var(--on-dark);
  max-width:60ch; margin:26px auto 0; }
.hero-centre .btn-row{ justify-content:center; margin-top:38px; }
.hero{ padding-block:120px 150px; }
.hero.has-photo::before{ background-position:center 62%; }

/* trust strip under the hero */
.trust-strip{ display:flex; justify-content:center; align-items:center; gap:14px 30px;
  flex-wrap:wrap; margin-top:44px; position:relative; z-index:1; }
.trust-pill{ display:flex; align-items:center; gap:9px; padding:9px 16px; border-radius:999px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
  font-size:13.5px; color:rgba(255,255,255,.82); }
.trust-pill .stars{ color:var(--star); font-size:12px; letter-spacing:1px; }
.trust-pill b{ color:#fff; font-weight:650; }

/* seven-figure banner */
.fig-banner{ background:var(--dark); border-block:1px solid var(--dark-line);
  padding:26px 0; text-align:center; position:relative; }
.fig-banner p{ margin:0; font-size:clamp(17px,2vw,23px); font-weight:600;
  letter-spacing:-.02em; color:#fff; }
.fig-banner .hl{ color:#B79BFF; }
.fig-banner .sm{ display:block; font-size:13px; font-weight:500; color:rgba(255,255,255,.45);
  margin-top:10px; letter-spacing:0; }

/* live results ticker */
.live-bar{ background:var(--dark-2); border-block:1px solid var(--dark-line);
  overflow:hidden; padding:14px 0; }
.live-track{ display:flex; width:max-content; animation:slide 52s linear infinite; }
.live-track span{ display:flex; align-items:center; gap:14px; padding-right:40px;
  font-size:14.5px; color:rgba(255,255,255,.72); white-space:nowrap; }
.live-track b{ color:#C8F23C; font-weight:700; }
.live-track span::before{ content:""; width:7px; height:7px; border-radius:50%;
  background:#C8F23C; box-shadow:0 0 10px #C8F23C; flex:none; }

/* google review badge */
.g-badge{ display:inline-flex; align-items:center; gap:11px; padding:11px 18px;
  border-radius:14px; background:var(--surface); border:1px solid var(--line); }
.g-badge .g{ width:22px; height:22px; flex:none; }
.g-badge .r{ font-size:20px; font-weight:700; letter-spacing:-.03em; }
.g-badge .stars{ color:var(--star); font-size:13px; letter-spacing:1.5px; }
.g-badge .t{ font-size:12.5px; color:var(--muted); }
.g-badge.on-dark{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.15); }
.g-badge.on-dark .r{ color:#fff; } .g-badge.on-dark .t{ color:rgba(255,255,255,.55); }

/* qualifier modal */
.modal{ position:fixed; inset:0; z-index:200; display:none; align-items:center;
  justify-content:center; padding:24px; }
.modal.open{ display:flex; }
.modal-veil{ position:absolute; inset:0; background:rgba(8,10,14,.72);
  backdrop-filter:blur(6px); animation:fadeIn .35s var(--ease); }
.modal-card{ position:relative; width:min(470px,100%); max-height:88vh; overflow-y:auto;
  background:var(--surface); border-radius:var(--r-xl); padding:32px;
  box-shadow:0 50px 120px -30px rgba(0,0,0,.65); animation:pop .45s var(--ease); }
@keyframes fadeIn{ from{ opacity:0; } }
@keyframes pop{ from{ opacity:0; transform:translateY(22px) scale(.97); } }
.modal-x{ position:absolute; top:16px; right:16px; width:34px; height:34px; border-radius:50%;
  border:0; background:var(--bg-soft); color:var(--muted); font-size:19px; cursor:pointer;
  line-height:1; display:grid; place-items:center; }
.modal-x:hover{ background:var(--line); color:var(--ink); }

@media (max-width:860px){
  .hero{ padding-block:80px 100px; }
  .trust-strip{ gap:10px; }
  .modal-card{ padding:26px 22px; }
}

/* ---------- V7: rotating homepage banner ---------- */
.rotator-bar{ display:grid; place-items:center; min-height:84px; padding:26px 0; }
.rotator-bar .msg{ grid-area:1/1; opacity:0; transform:translateY(10px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
  font-size:clamp(16px,1.9vw,21px); font-weight:600; letter-spacing:-.02em;
  color:rgba(255,255,255,.72); text-align:center; padding-inline:24px; }
.rotator-bar .msg.on{ opacity:1; transform:none; }
.rotator-bar .msg b{ color:#C8F23C; font-weight:700; }

/* ---------- modal legibility ---------- */
.modal-card{ color:var(--ink); }
.modal-card h2{ color:var(--ink); }
.modal-card .field label{ font-size:14.5px; font-weight:650; color:var(--ink); }
.modal-card .field input, .modal-card .field select, .modal-card .field textarea{
  background:#fff; border-color:var(--line); color:var(--ink); font-size:16px; }
.modal-card .fit-steps{ color:var(--ink-2); font-size:12.5px; }
.modal-card .fit-foot{ color:var(--ink-2); font-size:13px; }

/* ---------- founder, photo left ---------- */
.founder{ grid-template-columns:340px 1fr; gap:56px; align-items:start; }
.founder-photo{ width:100%; aspect-ratio:4/5; border-radius:var(--r-xl); object-fit:cover;
  display:block; background:var(--bg-soft); }
.founder-card{ padding:0; border:0; background:none; text-align:left; }
.founder-card .nm{ font-size:21px; margin-top:18px; }
.founder-mark{ width:100%; aspect-ratio:4/5; border-radius:var(--r-xl); margin:0;
  font-size:64px; background:var(--bg-soft); border:1px solid var(--line); }
.founder .prose p:first-child{ font-size:19px; color:var(--ink); font-weight:500;
  letter-spacing:-.01em; }

/* ---------- hero video hook ---------- */
.hero-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  z-index:0; filter:saturate(1.05) contrast(1.04); opacity:1; }

@media (max-width:1080px){ :root{ --wrap:min(1140px, 100% - 72px); } }
@media (max-width:860px){ :root{ --wrap:min(1140px, 100% - 40px); } .founder{ grid-template-columns:1fr; } }

/* founder fixes: portrait placeholder, tighter stat row */
.founder-mark{ height:auto !important; width:100% !important; aspect-ratio:4/5;
  display:grid; place-items:center; }
.founder .stat-bar{ grid-template-columns:repeat(3,1fr); margin-top:30px; }
.founder .stat{ padding:22px 18px; }
.founder .stat .v{ font-size:clamp(22px,2.2vw,30px); line-height:1.1; }
.founder .stat .k{ font-size:13px; margin-top:8px; }

/* ============================================================
   V9: Ads for Trades
   ============================================================ */

.trades-hero{ background:var(--dark); color:#fff; padding-block:86px 0; overflow:hidden; }
.trades-hero .wrap{ display:grid; grid-template-columns:1.08fr .92fr; gap:40px; align-items:end; }
.trades-hero .copy{ padding-bottom:96px; }
.trades-hero h1{ font-size:clamp(36px,4.9vw,62px); max-width:14ch; }
.trades-hero .sub{ margin-top:22px; max-width:48ch; }
.price-flag{ display:inline-flex; align-items:baseline; gap:10px; margin-top:28px;
  padding:12px 20px; border-radius:999px; background:rgba(200,242,60,.12);
  border:1px solid rgba(200,242,60,.35); }
.price-flag .n{ font-size:26px; font-weight:750; color:#C8F23C; letter-spacing:-.03em; }
.price-flag .l{ font-size:14px; color:rgba(255,255,255,.72); }
.mascot-wrap{ position:relative; display:flex; justify-content:center; align-items:flex-end; }
.mascot{ width:100%; height:auto; max-width:440px; display:block;
  filter:drop-shadow(0 30px 60px rgba(0,0,0,.6)); }
.mascot-wrap::before{ content:""; position:absolute; bottom:4%; left:50%; translate:-50% 0;
  width:78%; aspect-ratio:1; border-radius:50%; z-index:0;
  background:radial-gradient(circle, rgba(200,242,60,.22) 0%, transparent 68%); }
.mascot{ position:relative; z-index:1; }

.trade-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.trade-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:22px 18px; text-align:center; transition:all .25s var(--ease); }
.trade-card:hover{ border-color:var(--primary); transform:translateY(-3px); }
.trade-card .ic{ font-size:26px; line-height:1; }
.trade-card h3{ font-size:16px; margin:12px 0 6px; letter-spacing:-.015em; }
.trade-card p{ font-size:13px; color:var(--muted); margin:0; line-height:1.45; }

.svc-two{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.svc-panel{ background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-xl); padding:32px; }
.svc-panel.lead{ border:1.5px solid var(--primary);
  box-shadow:0 26px 64px -32px oklch(.52 .24 293 / .5); }
.svc-panel h3{ font-size:24px; margin-bottom:10px; }
.svc-panel .d{ font-size:15.5px; color:var(--muted); margin-bottom:22px; }
.svc-panel ul{ list-style:none; padding:0; margin:0; }
.svc-panel li{ font-size:15px; padding:9px 0 9px 26px; position:relative; color:var(--ink-2);
  border-bottom:1px solid var(--line-soft); }
.svc-panel li:last-child{ border-bottom:0; }
.svc-panel li::before{ content:""; position:absolute; left:0; top:17px; width:12px; height:6px;
  border-left:2px solid var(--primary); border-bottom:2px solid var(--primary);
  transform:rotate(-45deg); }

.cta-mascot{ display:grid; grid-template-columns:260px 1fr; gap:44px; align-items:center;
  text-align:left; }
.cta-mascot .mascot{ max-width:260px; }
.cta-band .cta-mascot h2, .cta-band .cta-mascot .sub{ margin-inline:0; text-align:left; }
.cta-band .cta-mascot .btn-row{ justify-content:flex-start; }

@media (max-width:1080px){
  .trades-hero .wrap{ grid-template-columns:1fr; gap:0; }
  .trades-hero .copy{ padding-bottom:36px; }
  .mascot{ max-width:330px; }
  .trade-grid{ grid-template-columns:repeat(3,1fr); }
  .svc-two{ grid-template-columns:1fr; }
  .cta-mascot{ grid-template-columns:1fr; text-align:center; gap:24px; }
  .cta-mascot .mascot{ max-width:200px; margin-inline:auto; }
  .cta-band .cta-mascot h2, .cta-band .cta-mascot .sub{ margin-inline:auto; text-align:center; }
  .cta-band .cta-mascot .btn-row{ justify-content:center; }
}
@media (max-width:860px){ .trade-grid{ grid-template-columns:repeat(2,1fr); } }

/* Ads for Trades highlighted in the nav */
nav.main > .item > a.flagged{
  color:var(--audit-ink); background:var(--audit); font-weight:700;
  padding:9px 15px; border-radius:999px;
}
nav.main > .item > a.flagged:hover{ background:var(--audit-hover); color:var(--audit-ink); }
body.dark-top header.site:not(.stuck) nav.main > .item > a.flagged{ color:var(--audit-ink); }

/* ---------- Ads for Trades: lighter palette than the main site ---------- */
:root{ --trade-bg:#F7F9F6; --trade-ink:#17200F; }
.trade-soft{ background:var(--trade-bg); }
.trades-hero{ background:linear-gradient(165deg, #141A10 0%, #0E1116 55%, #0E1116 100%); }
.trades-hero .price-flag{ cursor:pointer; border:1px solid rgba(200,242,60,.4);
  transition:all .25s var(--ease); font:inherit; }
.trades-hero .price-flag:hover{ background:rgba(200,242,60,.2); transform:translateY(-2px); }
.price-flag{ cursor:pointer; font:inherit; gap:12px; }
.price-flag .go{ color:#C8F23C; font-size:19px; font-weight:700; }
.price-flag:hover{ background:rgba(200,242,60,.2); }

.trade-card{ display:block; color:inherit; }
.trade-card:hover{ border-color:var(--audit); box-shadow:0 18px 40px -22px rgba(0,0,0,.2); }
.trade-grid{ grid-template-columns:repeat(4,1fr); }
@media (max-width:1080px){ .trade-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:860px){ .trade-grid{ grid-template-columns:repeat(2,1fr); } }

/* video heroes run brighter than the stills, so they need more wash under the text */
.hero.has-photo:has(.hero-video)::after{
  background:
    linear-gradient(180deg, rgba(14,17,22,.92) 0%, rgba(14,17,22,.55) 30%,
                            rgba(14,17,22,.55) 70%, rgba(14,17,22,.95) 100%),
    radial-gradient(ellipse 60% 55% at 50% 48%, rgba(14,17,22,.8) 0%,
                    rgba(14,17,22,.5) 55%, transparent 85%);
}
.hero.has-photo:has(.hero-video) .hero-centre::before{ display:none; }
.hero-video{ filter:saturate(1.02) contrast(1.02) brightness(.92); }

/* ---------- contact options: ring, WhatsApp, email ---------- */
.contact-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.c-opt{ display:flex; align-items:center; gap:12px; padding:13px 18px; border-radius:14px;
  border:1px solid var(--line); background:var(--surface); transition:all .22s var(--ease); }
.c-opt:hover{ border-color:var(--audit); transform:translateY(-2px); }
.c-opt .ic{ font-size:19px; line-height:1; flex:none; }
.c-opt b{ display:block; font-size:14.5px; font-weight:650; letter-spacing:-.015em; }
.c-opt em{ display:block; font-size:12.5px; font-style:normal; color:var(--muted); margin-top:2px; }
.contact-row.on-dark .c-opt{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.15);
  color:#fff; }
.contact-row.on-dark .c-opt:hover{ border-color:var(--audit); background:rgba(255,255,255,.11); }
.contact-row.on-dark .c-opt em{ color:rgba(255,255,255,.55); }
.c-opt.wa .ic{ color:#25D366; }
.cta-band .contact-row{ justify-content:center; margin-top:30px; }
.cta-mascot .contact-row{ justify-content:flex-start; }

/* service cards get their own calls to action */
.svc-card{ justify-content:flex-end; }
.svc-cta{ display:flex; gap:9px; margin-top:20px; flex-wrap:wrap; }
.svc-cta .btn{ padding:11px 18px; font-size:14.5px; }
.svc-card .body{ width:100%; }

@media (max-width:860px){
  .contact-row{ flex-direction:column; }
  .c-opt{ width:100%; }
  .cta-mascot .contact-row{ justify-content:center; }
}

/* ---------- contact options in the CTA colour, so they actually get seen ---------- */
.c-opt{
  background:var(--audit); border-color:var(--audit); color:var(--audit-ink);
  box-shadow:0 8px 24px -12px rgba(200,242,60,.55);
}
.c-opt:hover{ background:var(--audit-hover); border-color:var(--audit-hover);
  color:var(--audit-ink); box-shadow:0 12px 30px -12px rgba(200,242,60,.7); }
.c-opt em{ color:rgba(16,21,10,.66); }
.contact-row.on-dark .c-opt{ background:var(--audit); border-color:var(--audit);
  color:var(--audit-ink); }
.contact-row.on-dark .c-opt:hover{ background:var(--audit-hover); border-color:var(--audit-hover); }
.contact-row.on-dark .c-opt em{ color:rgba(16,21,10,.66); }
.c-opt.wa .ic{ color:var(--audit-ink); }

/* ---------- form hands off to the booking step ---------- */
.fit-done{ text-align:center; padding-top:6px; }
.fit-done .tick{ width:54px; height:54px; border-radius:50%; margin:0 auto 18px;
  background:var(--audit); color:var(--audit-ink); display:grid; place-items:center;
  font-size:26px; font-weight:800; }
.fit-done h3{ font-size:22px; margin-bottom:10px; }
.fit-done p{ font-size:15px; color:var(--muted); margin-bottom:20px; }
.fit-done .note-build{ font-size:13px; background:var(--bg-soft); border-radius:10px;
  padding:14px; color:var(--muted); }
.fit-done .contact-row{ margin-top:20px; flex-direction:column; }
.fit-done .c-opt{ width:100%; justify-content:center; }

/* ---------- V13: price pill, Trade Search nav button, founder photo ---------- */

/* solid lime so the price actually reads as a button */
.price-flag{
  background:var(--audit); border:1px solid var(--audit); color:var(--audit-ink);
  box-shadow:0 10px 30px -12px rgba(200,242,60,.6); padding:13px 22px;
}
.price-flag:hover{ background:var(--audit-hover); border-color:var(--audit-hover); }
.trades-hero .price-flag{ background:var(--audit); border-color:var(--audit); }
.trades-hero .price-flag:hover{ background:var(--audit-hover); }
.price-flag .from{ font-size:13px; font-weight:650; color:rgba(16,21,10,.6);
  text-transform:uppercase; letter-spacing:.08em; }
.price-flag .n{ color:var(--audit-ink); font-size:27px; font-weight:750; }
.price-flag .l{ color:rgba(16,21,10,.68); font-size:13.5px; }
.price-flag .go{ color:var(--audit-ink); }

/* Trade Search: flat, violet, with a highlight running round the edge */
nav.main > .item > a.flagged{
  position:relative; background:transparent; color:#fff; font-weight:650;
  border:1.5px solid rgba(183,155,255,.5); overflow:hidden; isolation:isolate;
  animation:tsPulse 2.6s ease-in-out infinite;
}
nav.main > .item > a.flagged::before{
  content:""; position:absolute; inset:-150%; z-index:-2;
  background:conic-gradient(from 0deg, transparent 0 62%, #B79BFF 78%, #C8F23C 88%, transparent 100%);
  animation:tsSpin 3.4s linear infinite;
}
nav.main > .item > a.flagged::after{
  content:""; position:absolute; inset:1.5px; z-index:-1; border-radius:999px;
  background:var(--dark);
}
header.site.stuck nav.main > .item > a.flagged::after{ background:#fff; }
header.site.stuck nav.main > .item > a.flagged{ color:var(--ink); }
@keyframes tsSpin{ to{ transform:rotate(1turn); } }
@keyframes tsPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.045); } }
nav.main > .item > a.flagged:hover{ background:transparent; animation-play-state:paused; }

/* founder photo is a square headshot, shown round */
.founder{ grid-template-columns:240px 1fr; }
.founder-photo{ aspect-ratio:1; border-radius:50%; }
.founder-mark{ aspect-ratio:1; border-radius:50%; }
.founder-card{ text-align:center; }
.founder-card .nm{ margin-top:20px; }

@media (prefers-reduced-motion:reduce){
  nav.main > .item > a.flagged, nav.main > .item > a.flagged::before{ animation:none; }
}

/* the earlier lime-pill rules still won on specificity, so state the final colours last */
body.dark-top header.site:not(.stuck) nav.main > .item > a.flagged,
header.site nav.main > .item > a.flagged{ color:#fff; background:transparent; }
body.dark-top header.site.stuck nav.main > .item > a.flagged,
header.site.stuck nav.main > .item > a.flagged{ color:var(--ink); background:transparent; }
nav.main > .item > a.flagged:hover{ color:#fff; background:transparent; }
header.site.stuck nav.main > .item > a.flagged:hover{ color:var(--ink); }

.send-warning{ background:oklch(.55 .17 25 / .1); border:1px solid oklch(.55 .17 25 / .3);
  color:var(--neg); border-radius:10px; padding:12px 14px; font-size:13.5px; margin-bottom:18px; }

/* the video fades up over its own poster frame, so there is no grey flash on load */
.hero-video{ opacity:0; transition:opacity .45s var(--ease); }
.hero-video.ready, .hero-video[data-ready]{ opacity:1; }