/* Lexivo AI — company site (lexivoai.com root), 2026-10-10.
   The Lexivo family palette and faces (shared with the partner site): blue = the
   AI, amber = the real person, green = the tracked outcome. Each industry keeps
   its own site's colour as a small dot. */

@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/instrument-sans-normal-400-700-latin.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-normal-400-latin.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-italic-400-latin.woff2) format("woff2")}
@font-face{font-family:"DM Mono";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-mono-normal-400-latin.woff2) format("woff2")}
@font-face{font-family:"DM Mono";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/dm-mono-normal-500-latin.woff2) format("woff2")}

:root{
  --paper:#F7F6F2;--paper-2:#EFEDE6;--card:#FFFFFF;
  --ink:#121829;--ink-2:#2A3246;--muted:#5B6376;--faint:#8C92A2;--rule:#E6E2D8;--rule-2:#D6D1C4;
  --ai:#4453E6;--ai-ink:#2E3BB8;--ai-soft:#EDEFFD;--ai-line:#C9CEFA;--ai-n:#9AA4FF;
  --human:#D2760F;--human-ink:#94510A;--human-soft:#FCF1E3;--human-line:#F1D2A8;--human-n:#F2B266;
  --win:#0E8456;--win-ink:#0A6442;--win-soft:#E3F3EB;--win-line:#B6E0CB;--win-n:#5FD3A0;
  --night:#0F1424;--night-2:#161C30;--night-3:#222A43;--night-4:#0B0F1C;
  --on-night:#EEF0F6;--on-night-soft:#A7AEC0;--night-rule:rgba(238,240,246,.12);
  --legal:#1E3A78;--medspa:#46543F;--dental:#D8451A;--reno:#1F5C6B;
  --legal-n:#8FAEF5;--medspa-n:#B3C6A8;--dental-n:#F49572;--reno-n:#7DBCCB;
  --sans:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --max:1200px;--gutter:clamp(16px,4vw,32px);
  --r-sm:10px;--r:16px;--r-lg:22px;--r-xl:30px;
  --shadow-sm:0 1px 2px rgba(18,24,41,.05),0 2px 8px -2px rgba(18,24,41,.07);
  --shadow:0 2px 4px rgba(18,24,41,.04),0 14px 34px -14px rgba(18,24,41,.2);
  --shadow-lg:0 4px 10px rgba(18,24,41,.05),0 34px 80px -28px rgba(18,24,41,.38);
  --ease:cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:84px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
img,svg,video,iframe{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
address{font-style:normal}
:focus-visible{outline:2px solid var(--ai);outline-offset:3px;border-radius:6px}
[hidden]{display:none!important}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px}
.skip:focus{top:12px}

.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.ic{width:18px;height:18px;flex:none}
.ic-ext{width:13px;height:13px;opacity:.7}
.ic-win{color:var(--win)}
.muted{color:var(--muted);font-weight:400}

/* type ------------------------------------------------------------------ */
.label{display:inline-flex;align-items:center;gap:10px;font:500 12px/1.2 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.label::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ai);box-shadow:10px 0 0 var(--human)}
.label::before{margin-right:10px}
.label-n{color:var(--on-night-soft)}
.h1{font-weight:600;font-size:clamp(40px,4.7vw,64px);line-height:1.01;letter-spacing:-.04em;margin:22px 0 0;text-wrap:balance}
.h1-sub{font-size:clamp(38px,4.8vw,62px)}
.h2{font-weight:600;font-size:clamp(32px,4.2vw,54px);line-height:1.05;letter-spacing:-.035em;text-wrap:balance}
.h2-sm{font-size:clamp(28px,3vw,40px)}
.h1 em,.h2 em,.motto,.eng-fig,.stat b,.facts b{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.015em}
.h1 em{display:block}
.lede{font-size:clamp(17px,1.45vw,20px);line-height:1.6;color:var(--muted);max-width:660px;margin-top:20px;text-wrap:pretty}
.fine{margin-top:10px;font-size:13.5px;color:var(--faint)}

/* buttons --------------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 24px;border-radius:999px;font-weight:600;font-size:16px;letter-spacing:-.005em;white-space:nowrap;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s,border-color .2s,color .2s}
.btn .ic{width:17px;height:17px}
.btn-dark{background:var(--ink);color:#fff;box-shadow:0 10px 24px -12px rgba(18,24,41,.55)}
.btn-dark:hover{transform:translateY(-1px);box-shadow:0 16px 30px -14px rgba(18,24,41,.6)}
.btn-line{border:1px solid var(--rule-2);background:rgba(255,255,255,.65);color:var(--ink)}
.btn-line:hover{border-color:var(--ink);background:#fff}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{transform:translateY(-1px);box-shadow:0 12px 28px -12px rgba(0,0,0,.6)}
.btn-ghost-n{border:1px solid rgba(238,240,246,.22);color:var(--on-night)}
.btn-ghost-n:hover{border-color:rgba(238,240,246,.55);background:rgba(255,255,255,.04)}
.btn-sm{height:42px;padding:0 18px;font-size:14.5px;gap:8px}
.btn-full{width:100%}

/* tags: the AI / person / outcome colour code ---------------------------- */
.tag{display:inline-flex;align-items:center;gap:7px;height:24px;padding:0 10px;border-radius:999px;font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;border:1px solid}
.tag i{width:6px;height:6px;border-radius:50%;background:currentColor}
.t-ai{color:var(--ai-ink);background:var(--ai-soft);border-color:var(--ai-line)}
.t-hu{color:var(--human-ink);background:var(--human-soft);border-color:var(--human-line)}
.t-win{color:var(--win-ink);background:var(--win-soft);border-color:var(--win-line)}
.t-ink{color:var(--ink-2);background:#fff;border-color:var(--rule-2)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none}
.dot-legal{background:var(--legal)}.dot-medspa{background:var(--medspa)}.dot-dental{background:var(--dental)}.dot-reno{background:var(--reno)}

/* header ---------------------------------------------------------------- */
.hdr{position:sticky;top:0;z-index:60;background:rgba(247,246,242,.84);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.hdr.scrolled{border-bottom-color:var(--rule)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:72px}
.logo{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:21px;letter-spacing:-.025em;color:var(--ink)}
.logo .mark{width:31px;height:24px}
.logo i{font-style:normal;font-weight:400;color:var(--muted)}
.logo-n{color:#fff}.logo-n i{color:var(--on-night-soft)}
.nav{display:flex;gap:30px}
.nav a{font-size:15px;font-weight:500;color:var(--ink-2);transition:color .15s}
.nav a:hover,.nav a[aria-current]{color:var(--ink)}
.hdr-cta{display:flex;align-items:center;gap:10px}
.menu-btn{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--rule-2);align-items:center;justify-content:center;background:#fff}
.mnav{border-top:1px solid var(--rule);background:var(--paper)}
.mnav nav{display:flex;flex-direction:column;padding:8px var(--gutter) 18px}
.mnav a{padding:13px 2px;font-size:17px;font-weight:500;border-bottom:1px solid var(--rule)}
.mnav a:last-child{border:0;color:var(--ai-ink)}
@media (max-width:960px){.nav{display:none}.menu-btn{display:inline-flex}}
@media (max-width:420px){.hdr-cta .btn{display:none}}

/* hero ------------------------------------------------------------------ */
.hero{position:relative;padding:clamp(40px,6vw,84px) 0 clamp(52px,6vw,88px);overflow:hidden}
.hero::before{content:"";position:absolute;inset:-20% -10% auto auto;width:780px;height:780px;border-radius:50%;background:radial-gradient(closest-side,rgba(68,83,230,.12),transparent 70%);pointer-events:none}
.hero::after{content:"";position:absolute;left:-220px;bottom:-260px;width:620px;height:620px;border-radius:50%;background:radial-gradient(closest-side,rgba(210,118,15,.1),transparent 70%);pointer-events:none}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,5vw,64px);align-items:center}
.hero .lede{max-width:600px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.hero-note{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:26px;font-size:14px;color:var(--muted)}
.hero-note a{display:inline-flex;align-items:center;gap:7px;color:var(--ink-2);font-weight:500}
.hero-note a:hover{color:var(--ink)}
.hero-note .dot{width:8px;height:8px}

/* hero background: drifting aurora + a faint grid (2026-10-15 visual pass) ----- */
.hero::before,.hero::after{display:none}
.hero-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero-bg i{position:absolute;border-radius:50%;filter:blur(70px)}
.hb1{width:640px;height:640px;right:-140px;top:-200px;background:rgba(68,83,230,.24)}
.hb2{width:520px;height:520px;right:260px;top:240px;background:rgba(210,118,15,.17)}
.hb3{width:480px;height:480px;left:-180px;bottom:-220px;background:rgba(14,132,86,.10)}
@media (prefers-reduced-motion:no-preference){.hb1{animation:drift1 18s ease-in-out infinite alternate}.hb2{animation:drift2 22s ease-in-out infinite alternate}}
@keyframes drift1{to{transform:translate(-70px,50px) scale(1.08)}}
@keyframes drift2{to{transform:translate(60px,-40px) scale(.92)}}
.hb-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(18,24,41,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(18,24,41,.05) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 60% 62% at 74% 44%,#000 20%,transparent 72%);mask-image:radial-gradient(ellipse 60% 62% at 74% 44%,#000 20%,transparent 72%)}
.h1 em{background:linear-gradient(100deg,var(--ai) 0%,#7B4FD8 45%,var(--human) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;padding:0 .04em .1em 0}

/* hero visual: a real website with the card open, the app on a phone, three moments */
.hx{position:relative;width:100%;max-width:600px;height:640px;justify-self:end}
.hx-browser{position:absolute;right:-72px;top:0;width:106%;border-radius:16px;background:#fff;overflow:hidden;border:1px solid rgba(18,24,41,.08);box-shadow:0 2px 6px rgba(18,24,41,.05),0 44px 90px -36px rgba(18,24,41,.48)}
.hx-bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;background:#F3F2EE;border-bottom:1px solid var(--rule)}
.hx-bar>i{width:9px;height:9px;border-radius:50%}
.hx-bar>i:nth-child(1){background:#EE9F94}.hx-bar>i:nth-child(2){background:#F1CB78}.hx-bar>i:nth-child(3){background:#9FD3A2}
.hx-url{display:flex;align-items:center;justify-content:center;gap:6px;min-width:46%;height:22px;margin:0 auto;padding:0 12px;border-radius:999px;background:#fff;border:1px solid var(--rule);font:400 11px/1 var(--mono);color:var(--muted)}
.hx-lock{width:11px;height:11px;color:var(--win)}
.hx-us{display:grid}
.hx-u{grid-area:1/1;font-weight:400;opacity:0;transition:opacity .5s}
.hx-u.on{opacity:1}
.hx-site{position:relative;aspect-ratio:16/10;background:#ECEAE4}
.hx-web{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s var(--ease)}
.hx-web.on{opacity:1}
.hx-phone{position:absolute;z-index:3;left:0;bottom:52px;width:190px;height:394px;padding:8px;border-radius:38px;background:#0d1220;box-shadow:0 34px 70px -24px rgba(18,24,41,.6),inset 0 0 0 1.5px rgba(255,255,255,.1)}
.hx-screen{position:relative;width:100%;height:100%;border-radius:30px;overflow:hidden;background:#fff}
.hx-notch{position:absolute;z-index:3;top:6px;left:50%;transform:translateX(-50%);width:64px;height:19px;border-radius:12px;background:#0d1220}
.hx-sb{position:absolute;z-index:2;left:0;right:0;top:0;height:28px;display:flex;align-items:center;justify-content:space-between;padding:3px 18px 0 22px;background:#fff;font-size:10px;font-weight:600;color:var(--ink)}
.hx-sb i{width:18px;height:8px;border-radius:2px;border:1.5px solid var(--ink);position:relative}
.hx-sb i::after{content:"";position:absolute;inset:1px 3px 1px 1px;border-radius:1px;background:var(--ink)}
.hx-shot{position:absolute;left:0;right:0;top:28px;width:100%;height:auto;opacity:0;transition:opacity .9s var(--ease)}
.hx-shot.on{opacity:1}
.hx-toast{position:absolute;z-index:4;display:flex;align-items:center;gap:12px;min-width:258px;padding:11px 16px 11px 11px;border-radius:16px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);border:1px solid rgba(255,255,255,.8);box-shadow:0 1px 2px rgba(18,24,41,.06),0 20px 44px -20px rgba(18,24,41,.42)}
.hx-t1{left:-30px;top:30px}
.hx-t2{right:-30px;top:420px}
.hx-t3{right:14px;top:502px}
@media (prefers-reduced-motion:no-preference){.hx-t1{animation:bob 6.5s ease-in-out infinite}.hx-t2{animation:bob 6.5s ease-in-out -2.2s infinite}.hx-t3{animation:bob 6.5s ease-in-out -4.4s infinite}}
@keyframes bob{50%{transform:translateY(-7px)}}
.hx-ic{width:42px;height:42px;flex:none;margin:-4px 0}
.hx-avs{position:relative;width:40px;height:40px;flex:none}
.hx-av{position:absolute;inset:0;width:40px;height:40px;border-radius:50%;object-fit:cover;opacity:0;transition:opacity .5s;box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--human-line)}
.hx-av.on{opacity:1}
.hx-ok{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:50%;background:var(--win);color:#fff;box-shadow:0 8px 18px -6px rgba(14,132,86,.65)}
.hx-ok .ic{width:20px;height:20px}
.hx-vs{display:grid;flex:1;min-width:0}
.hx-v{grid-area:1/1;opacity:0;transform:translateY(5px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.hx-v.on{opacity:1;transform:none;transition-delay:.15s}
.hx-v b{display:block;font-size:14.5px;font-weight:600;letter-spacing:-.01em;line-height:1.3;white-space:nowrap}
.hx-v p{margin-top:1px;font-size:12.5px;line-height:1.4;color:var(--muted);white-space:nowrap}
.hx-ex{align-self:flex-start;font:500 9px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);border:1px dashed var(--rule-2);border-radius:999px;padding:4px 7px}
.hx-tabs{position:absolute;z-index:5;right:0;bottom:0;display:flex;gap:4px;padding:5px;border-radius:999px;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--rule);box-shadow:var(--shadow-sm);white-space:nowrap}
.hx-tab{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:999px;font-size:13.5px;font-weight:500;color:var(--muted);transition:background .25s,color .25s}
.hx-tab i{width:7px;height:7px;border-radius:50%}
.hx-tab[aria-selected="true"]{background:var(--ink);color:#fff}

/* client strip ----------------------------------------------------------- */
.strip{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:rgba(255,255,255,.5)}
.strip-in{display:flex;align-items:center;gap:28px;height:76px}
.strip-k{display:flex;flex-direction:column;gap:2px;flex:none;padding-right:26px;border-right:1px solid var(--rule)}
.strip-k span{font:500 10.5px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.strip-k b{font:500 12.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.mq{position:relative;flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mq-track{display:flex;width:max-content;animation:mq 147s linear infinite}
.mq:hover .mq-track{animation-play-state:paused}
.mq-set{display:flex;align-items:center;flex:none}
.mq-set span{display:inline-flex;align-items:center;font-size:15px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.mq-set span::after{content:"";width:4px;height:4px;margin:0 18px;border-radius:50%;background:var(--rule-2)}
@keyframes mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mq-track{animation:none}}

/* sections ------------------------------------------------------------- */
.sec{padding:clamp(76px,9vw,128px) 0;position:relative}
.sec-tight{padding:clamp(48px,6vw,80px) 0}
.sec.alt{background:var(--paper-2)}
.sec.night{background:var(--night);color:var(--on-night)}
.sec.night .h2{color:#fff}
.sec.night .lede{color:var(--on-night-soft)}
.head{max-width:780px;margin-bottom:clamp(40px,5vw,64px)}
.head.center{margin-left:auto;margin-right:auto;text-align:center}
.head.center .lede{margin-left:auto;margin-right:auto}
.head .h2,.head .tag+.h2{margin-top:18px}
.center-cta{display:flex;justify-content:center;margin-top:44px}

/* problem ---------------------------------------------------------------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.stats-2{grid-template-columns:repeat(2,1fr);max-width:860px}
.stat{padding-top:24px;border-top:1px solid var(--night-rule)}
.stat b{display:block;font-size:clamp(60px,7vw,92px);line-height:.95;color:#fff}
.stat p{margin-top:14px;font-size:17px;color:var(--on-night)}
.stat small{display:block;margin-top:14px;font:500 11px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-night-soft)}
.fine-n{margin-top:40px;font-size:13px;color:var(--on-night-soft);opacity:.8}

/* how it works ----------------------------------------------------------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.step{position:relative;padding:28px 28px 30px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);overflow:hidden}
.step::after{content:"";position:absolute;left:0;right:0;top:0;height:3px}
.s-ai::after{background:var(--ai)}.s-hu::after{background:var(--human)}.s-win::after{background:var(--win)}
.step-n{position:absolute;top:18px;right:22px;font:400 italic 54px/1 var(--serif);color:var(--rule-2)}
.step h3{margin-top:26px;font-size:23px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.step p{margin-top:10px;color:var(--muted);font-size:16px}
.motto{margin-top:56px;text-align:center;font-size:clamp(30px,3.6vw,46px);line-height:1.15;color:var(--ink)}
.m-ai{color:var(--ai)}.m-hu{color:var(--human)}

/* where it works ----------------------------------------------------------- */
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.way{display:flex;flex-direction:column;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);overflow:hidden;box-shadow:var(--shadow-sm)}
.way-vis{position:relative;height:236px;display:grid;place-items:center;background:linear-gradient(180deg,#FBFAF7,#F2F0EA);border-bottom:1px solid var(--rule);overflow:hidden}
.way-body{padding:24px 26px 28px}
.way-body h3{font-size:21px;font-weight:600;letter-spacing:-.02em}
.way-body p{margin-top:8px;color:var(--muted);font-size:15.5px}
.way-body .fine{font-size:13px}
/* mini website with the card in the corner */
.mini-browser{position:relative;width:82%;height:170px;border-radius:12px;background:#fff;box-shadow:var(--shadow);overflow:hidden}
.mb-bar{display:flex;align-items:center;gap:5px;height:26px;padding:0 10px;background:#F1F0EC;border-bottom:1px solid var(--rule)}
.mb-bar i{width:7px;height:7px;border-radius:50%;background:#D9D5CB}
.mb-bar span{margin-left:8px;font:400 9.5px/1 var(--mono);color:var(--faint)}
.mb-page{display:flex;flex-direction:column;gap:8px;padding:16px 16px}
.mb-page span{display:block;border-radius:4px;background:#ECEAE4}
.mb-h{width:62%;height:14px}.mb-l{width:80%;height:7px}.mb-l.s{width:54%}
.mb-btn{width:64px;height:16px;margin-top:4px;border-radius:999px!important;background:var(--ink)!important}
.mb-card{position:absolute;right:10px;bottom:10px;width:76px;height:76px;border-radius:12px;overflow:hidden;border:2px solid #fff;box-shadow:0 10px 22px -8px rgba(18,24,41,.5)}
.mb-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mb-aft{position:absolute;inset:0;clip-path:inset(0 0 0 50%)}
.mb-card i{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff}
.mb-live{position:absolute;right:92px;bottom:36px;padding:4px 8px;border-radius:999px;background:var(--ink);color:#fff;font:500 8.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
@media (prefers-reduced-motion:no-preference){.mb-aft{animation:sweep 5s ease-in-out infinite}.mb-card i{animation:sweepl 5s ease-in-out infinite}}
@keyframes sweep{0%,100%{clip-path:inset(0 0 0 70%)}50%{clip-path:inset(0 0 0 28%)}}
@keyframes sweepl{0%,100%{left:70%}50%{left:28%}}
/* mini Instagram ad */
.mini-ig{width:182px;border-radius:14px;background:#fff;box-shadow:var(--shadow);overflow:hidden;transform:rotate(-2deg)}
.mi-hd{display:flex;align-items:center;gap:7px;padding:8px 10px}
.mi-hd img{width:22px;height:22px;border-radius:50%;object-fit:cover}
.mi-hd b{display:block;font-size:10px;font-weight:600;line-height:1.2}
.mi-hd small{display:block;font-size:8.5px;color:var(--faint)}
.mi-img{position:relative;height:118px;display:grid;place-items:center;background:linear-gradient(135deg,#F6F1E6,#EADFC9)}
.mi-free{position:absolute;top:8px;left:8px;padding:3px 6px;border-radius:4px;background:#C2412D;color:#fff;font-size:8px;font-weight:700;letter-spacing:.12em}
.mi-cover{width:72px;height:96px;padding:8px 7px;border-radius:5px;background:#132744;color:#fff;box-shadow:0 8px 16px -6px rgba(0,0,0,.5);display:flex;flex-direction:column}
.mi-cover small{font-size:5px;letter-spacing:.14em;text-transform:uppercase;color:#D9B26A}
.mi-cover b{margin-top:5px;font:400 11px/1.05 var(--serif)}
.mi-cover i{width:14px;height:1.5px;margin-top:5px;background:#C2412D}
.mi-cover span{margin-top:auto;font-size:4.8px;letter-spacing:.12em;text-transform:uppercase;color:#D9B26A}
.mi-cta{display:flex;justify-content:space-between;align-items:center;margin:8px 9px 10px;padding:7px 9px;border-radius:7px;background:#1A6FE8;color:#fff;font-size:9.5px;font-weight:600}
/* mini messages */
.mini-msgs{display:flex;flex-direction:column;gap:9px;width:78%}
.mm-mail{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#fff;box-shadow:var(--shadow-sm);border:1px solid var(--rule)}
.mm-mail .ic{color:var(--ai)}
.mm-mail b{display:block;font-size:12px;font-weight:600;line-height:1.25}
.mm-mail small{display:block;font-size:10.5px;color:var(--faint)}
.mm-sms{max-width:88%;padding:9px 12px;border-radius:16px 16px 16px 5px;background:#E9E7E1;font-size:11.5px;line-height:1.4;color:var(--ink-2)}
.mm-sms.me{align-self:flex-end;border-radius:16px 16px 5px 16px;background:var(--ai);color:#fff}

/* industries ------------------------------------------------------------- */
.inds{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.ind{display:grid;grid-template-columns:140px minmax(0,1fr);gap:26px;padding:28px 26px;border-radius:var(--r-xl);background:linear-gradient(180deg,var(--night-2),#121829);border:1px solid var(--night-rule)}
.ind-phone{align-self:start;width:140px;height:292px;padding:6px;border-radius:28px;background:#05070d;box-shadow:0 24px 50px -24px rgba(0,0,0,.8),inset 0 0 0 1px rgba(255,255,255,.08)}
.ind-phone img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:22px}
.ind-top{display:flex;align-items:center;gap:10px}
.ind-top h3{font-size:24px;font-weight:600;letter-spacing:-.02em;color:#fff}
.ind .dot-legal{background:var(--legal-n)}.ind .dot-medspa{background:var(--medspa-n)}.ind .dot-dental{background:var(--dental-n)}.ind .dot-reno{background:var(--reno-n)}
.ind-sub{margin-top:4px;font:500 11px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-night-soft)}
.ind-dl{display:grid;gap:12px;margin-top:20px}
.ind-dl dt{font:500 10.5px/1.3 var(--mono);letter-spacing:.13em;text-transform:uppercase}
.k-ai{color:var(--ai-n)}.k-hu{color:var(--human-n)}.k-win{color:var(--win-n)}
.ind-dl dd{margin-top:3px;font-size:15.5px;line-height:1.5;color:var(--on-night)}
.ind-proof{display:flex;gap:9px;margin-top:18px;padding-top:16px;border-top:1px solid var(--night-rule);font-size:13.5px;line-height:1.5;color:var(--on-night-soft)}
.ind-proof .ic{width:16px;height:16px;margin-top:2px;color:var(--win-n)}
.ind-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.ind-act{align-items:center}
.btn-txt{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 6px;font-size:14.5px;font-weight:600;color:var(--on-night);border-radius:999px}
.btn-txt .ic{width:12px;height:12px;padding:6px;box-sizing:content-box;border-radius:50%;background:rgba(255,255,255,.1)}
.btn-txt:hover{color:#fff}.btn-txt:hover .ic{background:rgba(255,255,255,.2)}
.ind-act .dur{font-weight:400;color:var(--on-night-soft)}
.ind-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px}
.lnk{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:500;color:var(--ink-2);border-bottom:1px solid transparent;transition:border-color .15s,color .15s}
.lnk:hover{border-bottom-color:currentColor;color:var(--ink)}
.night .lnk,.ind .lnk{color:var(--on-night)}
.ind-demo{margin-top:12px;font-size:12.5px;color:var(--on-night-soft);opacity:.8}

/* platform ---------------------------------------------------------------- */
.plat{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pcol{padding:28px 28px 30px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm)}
.pcol h3{margin-top:18px;font-size:21px;font-weight:600;letter-spacing:-.02em;line-height:1.25}
.pcol ul{display:grid;gap:10px;margin-top:16px}
.pcol li{display:flex;gap:10px;font-size:15px;line-height:1.5;color:var(--ink-2)}
.pcol li .ic{width:17px;height:17px;margin-top:2px}
.p-ai li .ic{color:var(--ai)}.p-hu li .ic{color:var(--human)}.p-win li .ic{color:var(--win)}
.dash{margin-top:44px;border-radius:18px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-lg);overflow:hidden}
.dash-bar{display:flex;align-items:center;gap:6px;height:40px;padding:0 16px;background:#F1F0EC;border-bottom:1px solid var(--rule)}
.dash-bar i{width:10px;height:10px;border-radius:50%;background:#DDD8CD}
.dash-bar span{margin:0 auto;padding:4px 14px;border-radius:999px;background:#fff;border:1px solid var(--rule);font:400 12px/1.2 var(--mono);color:var(--muted)}
.dash img{width:100%;height:auto}
.dash figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding:14px 18px;border-top:1px solid var(--rule);font-size:13.5px;color:var(--muted)}
.dash-links{display:flex;flex-wrap:wrap;gap:6px 18px}

/* under the hood ----------------------------------------------------------- */
.eng{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.eng-c{padding:30px 30px 32px;border-radius:var(--r-lg);border:1px solid var(--night-rule);background:linear-gradient(180deg,var(--night-2),var(--night))}
.eng-ic{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:12px;background:rgba(154,164,255,.12);color:var(--ai-n)}
.eng-c h3{margin-top:18px;font-size:14px;font-weight:500;font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-night-soft)}
.eng-fig{margin-top:10px;font-size:clamp(34px,3.4vw,46px);line-height:1.05;color:#fff}
.eng-figcap{margin-top:4px;font-size:15px;color:var(--on-night-soft)}
.eng-c p:last-child{margin-top:16px;font-size:15.5px;line-height:1.6;color:var(--on-night)}

/* what's next ----------------------------------------------------------- */
.nx-live{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;padding:20px 22px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule)}
.nx-k{font:500 11.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.nx-k2{margin:40px 0 16px}
.nx-chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 15px;border-radius:999px;background:var(--paper);border:1px solid var(--rule-2);font-size:14.5px;font-weight:500;transition:border-color .15s}
.chip:hover{border-color:var(--ink)}
.chip-live{background:#fff}
.nx{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.nx-g{padding:26px;border-radius:var(--r-lg);border:1px dashed var(--rule-2)}
.nx-g h3{font-size:20px;font-weight:600;letter-spacing:-.015em}
.nx-g p{margin-top:6px;font-size:14.5px;color:var(--muted)}
.nx-g ul{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.nx-g li{padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid var(--rule);font-size:13.5px;color:var(--ink-2)}

/* clients -------------------------------------------------------------- */
.cls{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.cl{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid var(--rule);transition:transform .18s var(--ease),box-shadow .18s}
.cl:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.cl.is-more{display:none}
.cls.show-all .cl.is-more{display:flex}
.cl-logo{display:block;width:44px;height:44px;flex:none;border-radius:11px;overflow:hidden;background:var(--paper)}
.cl-logo img{width:100%;height:100%;object-fit:cover}
.cl-logo.mono{display:grid;place-items:center;background:var(--ai-soft)}
.cl-logo.mono b{font-size:14px;font-weight:700;letter-spacing:.02em;color:var(--ai-ink)}
.cl-n{font-size:13.5px;font-weight:600;line-height:1.3;color:var(--ink-2)}
.cls-more{display:flex;justify-content:center;margin-top:24px}

/* contact ------------------------------------------------------------- */
.ct-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,80px);align-items:start}
.ct-copy .h2{margin-top:18px}
.ct-list{display:grid;gap:12px;margin-top:30px}
.ct-list li{display:flex;align-items:center;gap:12px;font-size:16px;color:var(--on-night)}
.ct-list .ic{color:var(--human-n)}
.ct-list a:hover{text-decoration:underline}
.ct-agency{margin-top:28px;padding:16px 18px;border-radius:14px;border:1px solid var(--night-rule);font-size:15px;color:var(--on-night-soft)}
.ct-agency b{color:#fff}
.form{display:grid;gap:14px;padding:clamp(22px,3vw,32px);border-radius:var(--r-xl);background:#fff;color:var(--ink);box-shadow:0 30px 70px -30px rgba(0,0,0,.7)}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld{display:grid;gap:6px}
.fld>span{font:500 11px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fld>span i{font-style:normal;text-transform:none;letter-spacing:0;color:var(--faint)}
.fld input,.fld select,.fld textarea{width:100%;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid var(--rule-2);background:var(--paper);font:400 16px/1.4 var(--sans);color:var(--ink);transition:border-color .15s,background .15s}
.fld textarea{resize:vertical;min-height:110px}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--ai);background:#fff;box-shadow:0 0 0 3px var(--ai-soft)}
.fld .bad{border-color:#C2412D}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{min-height:1px;font-size:14px;color:#B3381F}
.form-msg:empty{display:none}
.form-done{padding:18px;border-radius:14px;background:var(--win-soft);border:1px solid var(--win-line)}
.form-done b{display:flex;align-items:center;gap:8px;font-size:17px}
.form-done p{margin-top:6px;color:var(--ink-2);font-size:15px}
.form.sent>*:not(.form-done){display:none}

/* footer ------------------------------------------------------------------ */
.ftr{background:var(--night-4);color:var(--on-night-soft);padding:64px 0 28px;border-top:1px solid var(--night-rule);font-size:15px}
.ftr-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px}
.ftr-brand p{margin-top:14px;max-width:330px}
.ftr-brand address{margin-top:18px;line-height:1.7}
.ftr h2{font:500 11px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:14px}
.ftr ul{display:grid;gap:9px}
.ftr a:hover{color:#fff}
.ftr .lnk{color:var(--on-night-soft);font-size:15px;font-weight:400}
.ftr-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;margin-top:48px;padding-top:22px;border-top:1px solid var(--night-rule);font-size:13px;opacity:.85}

/* modals -------------------------------------------------------------- */
.modal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:clamp(10px,3vw,32px);background:rgba(8,11,20,.74);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.modal-box{position:relative;width:100%;border-radius:20px;overflow:hidden;box-shadow:0 40px 100px -30px rgba(0,0,0,.8);animation:pop .28s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.985)}}
.x{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;flex:none;transition:background .15s}
.film-box{max-width:1100px;background:#0b0f1c;color:var(--on-night)}
.film-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 14px}
.film-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.film-tabs button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:999px;font-size:14px;font-weight:500;color:var(--on-night-soft);white-space:nowrap}
.film-tabs button span{font:400 12px/1 var(--mono);opacity:.7}
.film-tabs button[aria-selected="true"]{background:rgba(255,255,255,.1);color:#fff}
.film-tabs .dot-legal{background:var(--legal-n)}.film-tabs .dot-medspa{background:var(--medspa-n)}.film-tabs .dot-dental{background:var(--dental-n)}.film-tabs .dot-reno{background:var(--reno-n)}
.film-box .x{color:#fff}.film-box .x:hover{background:rgba(255,255,255,.1)}
.film-stage{background:#000;aspect-ratio:16/9}
.film-stage video{width:100%;height:100%;background:#000}
.film-cap{padding:10px 16px 14px;font-size:13px;color:var(--on-night-soft)}
.app-box{max-width:440px;height:min(860px,92vh);display:flex;flex-direction:column;background:#fff}
.app-box.wide{max-width:1060px;height:min(760px,92vh)}
.app-bar{display:flex;align-items:center;gap:10px;height:52px;padding:0 8px 0 16px;border-bottom:1px solid var(--rule);flex:none}
.app-live{display:inline-flex;align-items:center;gap:6px;font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--win-ink)}
.app-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--win);box-shadow:0 0 0 3px var(--win-soft)}
.app-bar b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14.5px;font-weight:600}
.app-open{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:500;color:var(--muted);white-space:nowrap}
.app-open:hover{color:var(--ink)}
.app-box .x:hover{background:var(--paper-2)}
.app-frame{position:relative;flex:1;min-height:0;background:var(--paper)}
.app-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}
.app-load{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;font-size:14px;color:var(--muted);background:var(--paper);transition:opacity .4s}
.app-load span{width:26px;height:26px;border-radius:50%;border:2.5px solid var(--rule-2);border-top-color:var(--ai);animation:spin .8s linear infinite}
.app-frame.ready .app-load{opacity:0;pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:560px){.app-open{display:none}}
body.modal-open{overflow:hidden}

/* inner pages ------------------------------------------------------------ */
.phero{position:relative;padding:clamp(56px,8vw,112px) 0 clamp(40px,5vw,64px);overflow:hidden}
.phero::before{content:"";position:absolute;right:-180px;top:-240px;width:640px;height:640px;border-radius:50%;background:radial-gradient(closest-side,rgba(68,83,230,.1),transparent 70%)}
.phero .wrap{position:relative}
.phero .h1{max-width:900px}
.phero-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.phero-chips .chip{background:#fff;padding:0 8px}
.journey{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--rule)}
.journey li{position:relative;padding:28px 24px 8px 0}
.journey li+li{padding-left:24px;border-left:1px solid var(--rule)}
.j-n{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;border:1px solid var(--rule-2);font:500 13px/1 var(--mono)}
.j-ai{background:var(--ai-soft);border-color:var(--ai-line);color:var(--ai-ink)}
.j-hu{background:var(--human-soft);border-color:var(--human-line);color:var(--human-ink)}
.j-win{background:var(--win-soft);border-color:var(--win-line);color:var(--win-ink)}
.journey h3{margin-top:16px;font-size:19px;font-weight:600;letter-spacing:-.015em}
.journey p{margin-top:8px;font-size:15px;color:var(--muted)}
.split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(36px,6vw,80px);align-items:center}
.split-rev{align-items:start}
.split-copy .h2{margin-top:18px}
.split-copy .tag+.h2{margin-top:18px}
.split-h3{margin-top:34px;font:500 12px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ticks{display:grid;gap:13px;margin-top:22px}
.ticks li{display:flex;gap:11px;font-size:16px;line-height:1.55;color:var(--ink-2)}
.ticks .ic{width:18px;height:18px;margin-top:3px;color:var(--win)}
.ticks b{color:var(--ink);font-weight:600}
.phones{position:relative;height:560px}
.ph{position:absolute;width:230px;height:478px;padding:8px;border-radius:38px;background:#0d1220;box-shadow:var(--shadow-lg)}
.ph img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:30px}
.ph-a{left:4%;top:0;transform:rotate(-4deg)}
.ph-b{right:4%;top:56px;transform:rotate(4deg)}
.phones-cap{position:absolute;left:0;right:0;bottom:0;text-align:center;font-size:13.5px;color:var(--muted)}
.phones-cap a{color:var(--ink);font-weight:600;border-bottom:1px solid currentColor}
.cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{padding:26px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm)}
.card-ic{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--human-soft);color:var(--human-ink)}
.card h3{margin-top:18px;font-size:19px;font-weight:600;letter-spacing:-.015em}
.card p{margin-top:8px;font-size:15px;color:var(--muted)}
.note{margin-top:26px;font-size:14.5px;color:var(--muted)}
.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:40px}
.cols3 h3{font-size:18px;font-weight:600;letter-spacing:-.01em}
.cols3 p{margin-top:6px;font-size:15px;color:var(--muted)}
.eng-rows{display:grid;gap:0;border-top:1px solid var(--night-rule)}
.eng-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:40px;padding:36px 0;border-bottom:1px solid var(--night-rule)}
.eng-row h3{margin-top:14px;font-size:24px;font-weight:600;letter-spacing:-.02em;color:#fff}
.eng-row p{color:var(--on-night);font-size:16.5px}
.eng-row p+p{margin-top:12px}
.figs{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.figs b{display:block;font:400 italic clamp(34px,3.4vw,46px)/1 var(--serif);color:#fff}
.figs span{display:block;margin-top:8px;font-size:14px;color:var(--on-night-soft)}
.agency{padding:30px;border-radius:var(--r-xl);background:var(--paper-2);border:1px solid var(--rule)}
.agency p{margin:14px 0 22px;color:var(--muted)}
.cta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.cta-band .hero-ctas{margin-top:0}
.prose-grid{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:40px}
.prose p{font-size:18px;line-height:1.7;color:var(--ink-2)}
.prose p+p{margin-top:18px}
.prose h2{margin:40px 0 12px;font-size:22px;font-weight:600;letter-spacing:-.015em}
.prose h2:first-child{margin-top:0}
.prose a{color:var(--ai-ink);border-bottom:1px solid var(--ai-line)}
.prose-narrow{max-width:760px}
.prose-narrow p{font-size:17px}
.beliefs{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.beliefs article{padding:30px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule)}
.b-n{font:400 italic 40px/1 var(--serif);color:var(--rule-2)}
.beliefs h3{margin-top:14px;font-size:21px;font-weight:600;letter-spacing:-.02em;line-height:1.3}
.beliefs p{margin-top:8px;color:var(--muted);font-size:15.5px}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.facts div{padding-top:20px;border-top:1px solid var(--rule-2)}
.facts b{display:block;font-size:clamp(40px,4vw,56px);line-height:1}
.facts p{margin-top:10px;font-size:15px;color:var(--muted)}
.ct-mini{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.ct-mini .h2{margin-top:14px}
.ct-mini .ct-list{margin-top:0}
.nf{min-height:56vh}

/* reveal on scroll (only when JS runs) ---------------------------------- */
.js [data-rv]{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js [data-rv].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js [data-rv]{opacity:1;transform:none;transition:none}.hx-shot,.hx-v{transition:none}}

/* responsive ------------------------------------------------------------- */
@media (max-width:1100px){
  .hero-grid{grid-template-columns:1fr}
  .hx{margin-top:12px}
  .inds{grid-template-columns:1fr}
  .cards4{grid-template-columns:repeat(2,1fr)}
  .ftr-grid{grid-template-columns:1fr 1fr 1fr}
  .ftr-brand{grid-column:1/-1}
}
@media (max-width:960px){
  .steps,.ways,.plat,.nx,.stats{grid-template-columns:1fr}
  .steps,.ways,.plat,.nx{max-width:620px}
  .eng{grid-template-columns:1fr}
  .cls{grid-template-columns:repeat(2,1fr)}
  .ct-grid,.split,.prose-grid{grid-template-columns:1fr}
  .journey{grid-template-columns:1fr 1fr}
  .journey li:nth-child(3){padding-left:0;border-left:0}
  .eng-row{grid-template-columns:1fr;gap:14px}
  .facts{grid-template-columns:1fr 1fr}
  .cols3{grid-template-columns:1fr}
  .beliefs{grid-template-columns:1fr}
  .phones{height:520px;max-width:520px;width:100%;margin:0 auto}
}
@media (max-width:640px){
  body{font-size:16px}
  .strip-in{height:auto;padding:14px 0;flex-direction:column;align-items:stretch;gap:10px}
  .strip-k{flex-direction:row;gap:8px;border:0;padding:0}
  .ind{grid-template-columns:1fr;padding:22px}
  .ind-phone{width:150px;height:310px;justify-self:center}
  .fld-row{grid-template-columns:1fr}
  .cls{grid-template-columns:1fr 1fr;gap:8px}
  .cl{flex-direction:column;align-items:flex-start;gap:8px;padding:12px}
  .cl-logo{width:38px;height:38px;border-radius:10px}
  .cl-n{font-size:12.5px}
  .cards4{grid-template-columns:1fr}
  .journey{grid-template-columns:1fr}
  .journey li,.journey li+li{padding:22px 0 6px;border-left:0}
  .journey li+li{border-top:1px solid var(--rule)}
  .figs{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .phones{height:430px}
  .ph{width:180px;height:374px;border-radius:30px;padding:6px}
  .ph img{border-radius:24px}
  .btn{height:50px}
  .hero-ctas .btn{flex:1 1 auto}
  .center-cta .muted{display:none}
}


/* ======================================================================
   2026-10-15 clarity rebuild: hero trust row, industry cards, how it works,
   without/with, MOCK results (labelled), estimate, what you get, FAQ.
   ====================================================================== */
.trust{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px}
.trust li{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;font-weight:500;color:var(--ink-2)}
.trust .ic{width:16px;height:16px;color:var(--win)}
.hero-film{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:15px;font-weight:600;color:var(--ink)}
.hero-film .ic{width:13px;height:13px;padding:9px;box-sizing:content-box;border-radius:50%;background:#fff;border:1px solid var(--rule-2);transition:border-color .15s}
.hero-film small{font-size:13px;font-weight:400;color:var(--muted)}
.hero-film:hover .ic{border-color:var(--ink)}

/* industries: pick yours, then one card each -------------------------------- */
.ix-pick{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:-18px 0 26px}
.ix-pick .pk{position:relative;display:flex;align-items:center;gap:10px;height:54px;padding:0 18px;border-radius:14px;background:#fff;border:1px solid var(--rule);font-size:15.5px;font-weight:600;letter-spacing:-.01em;transition:border-color .15s,transform .15s var(--ease)}
.ix-pick .pk:hover{border-color:var(--ink);transform:translateY(-1px)}
.pk-go{display:flex;flex:1;align-items:center;gap:inherit;min-width:0;text-align:left}
.pk-go::after{content:"";position:absolute;inset:0;border-radius:inherit}
.ixs{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.ix{display:flex;flex-direction:column;border-radius:var(--r-xl);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);overflow:hidden}
.ix-film{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--paper-2);border-bottom:1px solid var(--rule)}
.ix-prev{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.ix-film:hover .ix-prev{transform:scale(1.03)}
.ix-play{position:absolute;left:18px;bottom:18px;display:inline-flex;align-items:center;gap:11px;height:52px;padding:0 18px 0 7px;border-radius:999px;background:rgba(18,24,41,.9);color:#fff;font-size:15.5px;font-weight:600;box-shadow:0 12px 28px -10px rgba(0,0,0,.55);backdrop-filter:blur(6px);transition:transform .25s var(--ease),background .25s}
.ix-pb{position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;color:var(--ink)}
.ix-pb .ic{width:15px;height:15px;margin-left:2px}
.ix-pb::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid rgba(255,255,255,.55);animation:ix-ring 2.4s var(--ease) infinite}
@keyframes ix-ring{0%{transform:scale(.85);opacity:1}70%,100%{transform:scale(1.35);opacity:0}}
.ix-play i{font:400 12.5px/1 var(--mono);font-style:normal;opacity:.7}
.ix-film:hover .ix-play{transform:scale(1.05);background:var(--ink)}
@media (prefers-reduced-motion:reduce){.ix-pb::after{animation:none;display:none}}
.ix-body{display:flex;flex-direction:column;flex:1;padding:24px 26px 26px}
.ix-k{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.ix-k b{font-size:17px;font-weight:600;letter-spacing:-.01em}
.ix-k span:last-child{font:500 10.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.ix h3{margin-top:12px;font-size:clamp(22px,2vw,26px);font-weight:600;line-height:1.2;letter-spacing:-.025em;text-wrap:balance}
.ix-p{margin-top:12px;font-size:15.5px;line-height:1.6;color:var(--muted)}
.ix-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:22px}

/* how it works -------------------------------------------------------------- */

/* without / with ------------------------------------------------------------ */
.vs{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.vs-col{padding:28px 30px 30px;border-radius:var(--r-lg);border:1px solid var(--rule)}
.vs-no{background:rgba(255,255,255,.45)}
.vs-yes{background:#fff;border-color:var(--win-line);box-shadow:var(--shadow)}
.vs-h{font:500 12px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.vs-yes .vs-h{color:var(--win-ink)}
.vs ul{display:grid;gap:16px;margin-top:20px}
.vs li{display:flex;gap:12px;font-size:16.5px;line-height:1.5}
.vs li .ic{width:19px;height:19px;margin-top:2px}
.vs-no li{color:var(--muted)}.vs-no li .ic{color:#C2412D}
.vs-yes li{color:var(--ink)}.vs-yes li .ic{color:var(--win)}

/* MOCK results: every card and quote labelled ------------------------------- */
.mk-banner{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:22px;padding:14px 18px;border-radius:14px;border:1px dashed var(--human-n);background:rgba(242,178,102,.08);font-size:14.5px;color:var(--on-night)}
.mk-banner b{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;background:var(--human-n);color:#2A1A05;font:500 11.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.mk-badge{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;border:1px solid var(--human-n);color:var(--human-n);font:500 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.mk-badge-s{height:20px;padding:0 8px;font-size:9.5px;margin-left:6px;vertical-align:middle}
.mk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.mk-card{display:flex;flex-direction:column;padding:24px 26px 26px;border-radius:var(--r-lg);border:1px solid var(--night-rule);background:linear-gradient(180deg,var(--night-2),var(--night))}
.mk-top{display:flex;align-items:center;gap:12px}
.mk-top div{flex:1;min-width:0}
.mk-top b{display:block;font-size:16px;font-weight:600;color:#fff;letter-spacing:-.01em}
.mk-top small{display:block;margin-top:2px;font:500 10.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-night-soft)}
.mk-card .dot-legal{background:var(--legal-n)}.mk-card .dot-medspa{background:var(--medspa-n)}.mk-card .dot-dental{background:var(--dental-n)}.mk-card .dot-reno{background:var(--reno-n)}
.dot-any{background:var(--win-n)}
.mk-line{display:flex;align-items:baseline;gap:14px;margin-top:22px;font:400 italic clamp(52px,6vw,74px)/1 var(--serif);color:#fff;letter-spacing:-.02em}
.mk-line i{font-style:normal;font-size:.55em;color:var(--human-n)}
.mk-unit{margin-top:8px;font-size:17px;font-weight:600;color:var(--on-night)}
.mk-sub{margin-top:2px;font-size:14px;color:var(--on-night-soft)}
.mk-bars{display:grid;gap:8px;margin-top:18px}
.mk-bar{display:grid;grid-template-columns:190px minmax(0,1fr) 44px;align-items:center;gap:12px;font-size:13px;color:var(--on-night-soft)}
.mk-bar i{display:block;height:10px;border-radius:999px;background:rgba(238,240,246,.22)}
.mk-bar.on{color:#fff}.mk-bar.on i{background:linear-gradient(90deg,var(--ai-n),var(--win-n))}
.mk-bar b{font:500 14px/1 var(--mono);text-align:right}
.mk-fun{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.mk-fun li{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--night-rule);font-size:12.5px;color:var(--on-night-soft)}
.mk-fun li b{font:500 12.5px/1 var(--mono);color:#fff}
.mk-fun li+li::before{content:"→";margin-right:2px;color:var(--faint)}
.mk-extra{margin-top:12px;font-size:13.5px;color:var(--on-night-soft)}
.mk-extra b{font:500 13.5px/1 var(--mono);color:#fff}
.mk-q{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--night-rule)}
.mk-q p{font:400 italic 20px/1.35 var(--serif);color:#fff}
.mk-q footer{margin-top:8px;font-size:13px;color:var(--on-night-soft)}
.mk-wide{grid-column:1/-1}
.mk-wide-in{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px 40px;align-items:center}
.mk-wide .mk-line{margin-top:14px}
.mk-fun-row{margin-top:0}

/* estimate ------------------------------------------------------------------ */
.est{padding:clamp(20px,3vw,32px);border-radius:var(--r-xl);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow)}
.est-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,48px);align-items:start}
.est-k{display:block;font:500 11.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.est-k+.est-tabs{margin-top:12px}
.est-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:28px}
.est-tabs button{display:flex;align-items:center;gap:9px;height:46px;padding:0 14px;border-radius:12px;border:1px solid var(--rule-2);background:var(--paper);font-size:15px;font-weight:600;transition:border-color .15s,background .15s}
.est-tabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.est-v{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:10px 0 14px}
.est-v b{font:400 italic 46px/1 var(--serif);letter-spacing:-.02em}
.est-v>span{font-size:15px;color:var(--muted)}
.est input[type=range]{width:100%;height:30px;accent-color:var(--ai);cursor:pointer}
.est-out{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.est-col{padding:20px 20px 22px;border-radius:var(--r);background:var(--paper);border:1px solid var(--rule)}
.est-lex{background:linear-gradient(180deg,#F4F6FF,#fff);border-color:var(--ai-line)}
.est-h{font-size:16px;font-weight:600}
.est-h small{display:block;margin-top:2px;font-size:12.5px;font-weight:400;color:var(--muted)}
.est-col ul{display:grid;gap:12px;margin-top:16px}
.est-col li{display:flex;align-items:baseline;gap:10px}
.est-col li b{min-width:64px;font:400 italic 34px/1 var(--serif);letter-spacing:-.02em}
.est-lex li b{color:var(--ai-ink)}
.est-col li>span{font-size:14.5px;color:var(--ink-2)}
.est-note{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--rule);font-size:14px;color:var(--muted)}
.est-note .mk-badge{border-color:var(--human);color:var(--human-ink)}

/* what you get ---------------------------------------------------------------- */
.inc{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:18px}
.inc-col{padding:30px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm)}
.inc-h{font:500 12px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.inc-col .ticks{margin-top:18px}
.inc-steps{display:grid;gap:12px;margin-top:18px}
.inc-steps li{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:500}
.inc-steps span{display:inline-grid;place-items:center;width:32px;height:32px;flex:none;border-radius:50%;background:var(--human-soft);border:1px solid var(--human-line);color:var(--human-ink);font:500 13px/1 var(--mono)}
.inc-price{margin:24px 0;padding:18px;border-radius:14px;background:var(--paper);border:1px solid var(--rule)}
.inc-price b{font-size:15px}
.inc-price p{margin-top:6px;font-size:14.5px;line-height:1.55;color:var(--muted)}

/* FAQ ----------------------------------------------------------------------- */
.faq-wrap{max-width:880px}
.faq{border-top:1px solid var(--rule-2)}
.faq details{border-bottom:1px solid var(--rule-2)}
.faq summary{position:relative;display:block;padding:20px 44px 20px 0;font-size:18px;font-weight:600;letter-spacing:-.01em;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:14px;height:14px;margin-top:-7px;background:linear-gradient(currentColor,currentColor) center/14px 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 14px no-repeat;transition:transform .2s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 44px 22px 0;font-size:16px;line-height:1.65;color:var(--muted)}

/* free mock-up form ------------------------------------------------------------ */
.ct-steps{display:grid;gap:14px;margin-top:28px}
.ct-steps li{display:flex;gap:14px}
.ct-steps span{display:inline-grid;place-items:center;width:30px;height:30px;flex:none;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid var(--night-rule);color:#fff;font:500 13px/1 var(--mono)}
.ct-steps b{display:block;font-size:16px;color:#fff}
.ct-steps p{margin-top:2px;font-size:14.5px;color:var(--on-night-soft)}
.ct-steps+.ct-list{margin-top:26px}
.form-h{font-size:20px;font-weight:600;letter-spacing:-.015em}
.form-fine{font-size:13px;color:var(--faint);text-align:center}

@media (max-width:1100px){
  .ixs{grid-template-columns:1fr;max-width:720px}
  .mk-grid{grid-template-columns:1fr}
  .est-in{grid-template-columns:1fr}
  .inc{grid-template-columns:1fr}
}
@media (max-width:960px){
  .ix-pick{grid-template-columns:1fr 1fr}
  .vs{grid-template-columns:1fr}
  .mk-wide-in{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ix-pick .pk{height:48px;padding:0 14px;font-size:14.5px}
  .ix-body{padding:20px}
  .ix-play{left:12px;bottom:12px;height:44px;gap:9px;padding:0 15px 0 6px;font-size:14px}
  .ix-pb{width:32px;height:32px}
  .est-out{grid-template-columns:1fr}
  .mk-bar{grid-template-columns:110px minmax(0,1fr) 36px}
  .mk-card{padding:20px}
  .vs-col,.inc-col{padding:22px}
  .faq summary{font-size:16.5px}
}

/* ======================================================================
   2026-10-15 visual pass: grain, buttons, logo strip, icon picker, real
   screenshots, form-vs-report, animated mock results, bento, FAQ, brand art.
   ====================================================================== */
body::after{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.btn-dark{background:linear-gradient(180deg,#252D47,#121829);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 26px -12px rgba(18,24,41,.6)}
.btn-dark:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 18px 36px -14px rgba(68,83,230,.55)}
.btn-line{background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

/* logo strip ---------------------------------------------------------------- */
.strip{background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.strip-in{height:84px}
.mq-set .lg::after{content:none}
.lg{display:inline-flex!important;align-items:center;gap:10px;margin-right:36px}
.lg img,.lg i{width:34px;height:34px;flex:none;border-radius:9px;object-fit:cover;box-shadow:0 0 0 1px var(--rule),0 4px 10px -6px rgba(18,24,41,.3)}
.lg i{display:grid;place-items:center;background:var(--ai-soft);color:var(--ai-ink);font:700 11.5px/1 var(--sans);font-style:normal}
.lg b{font-size:14.5px;font-weight:600;color:var(--ink-2);white-space:nowrap}

/* industries: icon picker, lifted cards -------------------------------------- */
#industries{background:radial-gradient(1100px 520px at 88% -6%,rgba(68,83,230,.08),transparent 62%),radial-gradient(900px 480px at -8% 108%,rgba(210,118,15,.07),transparent 60%),var(--paper-2)}
.ix-pick{gap:14px;margin:-14px 0 30px}
.ix-pick .pk{height:auto;padding:12px 18px 12px 12px;gap:14px;border-radius:18px;box-shadow:var(--shadow-sm)}
.ix-pick img{width:58px;height:58px;flex:none;transition:transform .35s var(--ease)}
.ix-pick .pk:hover img{transform:scale(1.08) rotate(-4deg)}
.ix-pick .pk-go>span{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.3}
.ix-pick b{font-size:16px;font-weight:600}
.ix-pick small{font-size:12.5px;font-weight:400;color:var(--muted)}
.ix-pick .ic{width:16px;height:16px;color:var(--faint);transition:transform .2s,color .2s}
.ix-pick .pk:hover .pk-go .ic{transform:translateX(3px);color:var(--ink)}
/* the tiles play their industry's film: a round play button in place of the arrow */
.ix-pick .pk-play{position:relative;z-index:1;pointer-events:none;flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--ink);color:#fff;box-shadow:0 6px 16px -8px rgba(18,24,41,.55);transition:transform .2s var(--ease),background .2s}
.ix-pick .pk-play .ic{width:15px;height:15px;color:#fff;margin-left:2px}
.ix-pick .pk:hover .pk-play{transform:scale(1.1);background:var(--ai)}
.ix-pick .pk:hover .pk-play .ic{transform:none;color:#fff}
.ix{transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.ix:hover{transform:translateY(-4px);box-shadow:0 34px 70px -34px rgba(18,24,41,.38)}

/* how it works: real screenshots that bleed off the bottom ---------------------- */

/* without / with: a contact form vs a free report -------------------------------- */
.vs-col{overflow:hidden}
.vs-vis{position:relative;height:236px;margin:-28px -30px 24px;display:flex;align-items:center;justify-content:center;gap:26px;border-bottom:1px solid var(--rule)}
.vs-no .vs-vis{background:repeating-linear-gradient(135deg,#F2F0EA 0 12px,#EDEAE3 12px 24px)}
.vs-yes .vs-vis{background:radial-gradient(90% 120% at 50% 0%,#EAEDFF 0%,#F5F6FF 48%,#fff 100%);border-bottom-color:var(--ai-line)}
.cf{display:grid;gap:7px;width:224px;padding:14px;border-radius:12px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);filter:grayscale(1);opacity:.92}
.cf-h{font-size:13px;font-weight:600;color:var(--ink-2)}
.cf-f{display:block;height:24px;padding:0 9px;border-radius:6px;background:#F3F2EE;border:1px solid var(--rule);font-size:11px;line-height:22px;color:var(--faint)}
.cf-ta{height:40px}
.cf-b{display:block;height:26px;border-radius:7px;background:#9AA0AE;color:#fff;font-size:11px;font-weight:600;line-height:26px;text-align:center}
.cf-toast{position:absolute;right:20px;bottom:16px;display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:12px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);font-size:12px;color:var(--muted)}
.cf-toast .ic{width:14px;height:14px}
.rc{position:relative;display:flex;flex-direction:column;width:140px;height:182px;flex:none;padding:14px 12px;border-radius:10px;background:linear-gradient(160deg,#18346A,#0F2142);color:#fff;transform:rotate(-3deg);box-shadow:0 26px 50px -20px rgba(15,33,66,.7),9px 9px 0 -2px #fff,9px 9px 0 -1px var(--rule-2)}
.rc small{font:500 7.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#E2B866}
.rc b{margin-top:10px;font:400 21px/1.02 var(--serif)}
.rc i{width:22px;height:2px;margin-top:10px;background:#E2643F}
.rc span{margin-top:auto;font:500 7.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#E2B866}
.rc em{position:absolute;right:-10px;top:-10px;box-shadow:0 6px 14px -4px rgba(0,0,0,.4);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#D9B26A;color:#0F2142}
.rc em .ic{width:16px;height:16px}
.rc-chips{display:grid;gap:8px}
.rc-chips li{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:#fff;border:1px solid var(--ai-line);font-size:12.5px;font-weight:600;color:var(--ai-ink);box-shadow:var(--shadow-sm)}
.rc-chips .ic{width:13px;height:13px;color:var(--win)}

/* mock results: glows, gradient figures, bars that fill on arrival --------------- */
#results{overflow:hidden}
#results::before{content:"";position:absolute;left:-220px;top:-220px;width:760px;height:760px;border-radius:50%;background:radial-gradient(closest-side,rgba(68,83,230,.3),transparent 70%);pointer-events:none}
#results::after{content:"";position:absolute;right:-240px;bottom:-260px;width:800px;height:800px;border-radius:50%;background:radial-gradient(closest-side,rgba(210,118,15,.2),transparent 70%);pointer-events:none}
#results .wrap{position:relative;z-index:1}
.mk-card{background:linear-gradient(180deg,rgba(28,35,58,.92),rgba(16,21,38,.92));box-shadow:0 34px 70px -40px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.07);transition:transform .4s var(--ease),border-color .4s}
.mk-card:hover{transform:translateY(-3px);border-color:rgba(238,240,246,.24)}
.mk-line{background:linear-gradient(180deg,#fff 30%,#B9C2FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.mk-bar i{width:var(--w);transition:width 1.4s var(--ease) .3s}
.js .mk-card:not(.in) .mk-bar i{width:0}
.mk-banner{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

/* estimate ----------------------------------------------------------------------- */
.est{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--ai-line),var(--rule) 45%,var(--human-line)) border-box;border:1px solid transparent;box-shadow:0 44px 90px -54px rgba(18,24,41,.5)}
.est-lex li b{background:linear-gradient(100deg,var(--ai),#7B4FD8);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.05em}

/* what you get: icon bento + "you do three things" band -------------------------- */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bento article{position:relative;padding:24px 26px 28px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.bento article::before{content:"";position:absolute;right:-70px;top:-70px;width:200px;height:200px;border-radius:50%;background:radial-gradient(closest-side,rgba(68,83,230,.09),transparent 70%)}
.bento article:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.bento img{position:relative;width:86px;height:86px;margin:-4px 0 0 -8px;transition:transform .45s var(--ease)}
.bento article:hover img{transform:translateY(-3px) rotate(-3deg) scale(1.05)}
.bento h3{position:relative;margin-top:12px;font-size:19px;font-weight:600;letter-spacing:-.015em}
.bento p{position:relative;margin-top:6px;font-size:15px;line-height:1.55;color:var(--muted)}
.you{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,300px) auto;align-items:center;gap:18px 34px;margin-top:16px;padding:22px 26px;border-radius:var(--r-lg);background:radial-gradient(600px 200px at 10% 0%,rgba(68,83,230,.25),transparent 70%),var(--night);color:var(--on-night);box-shadow:var(--shadow)}
.you-h{font:500 12px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--on-night-soft)}
.you-steps{display:flex;flex-wrap:wrap;gap:10px 24px}
.you-steps li{display:flex;align-items:center;gap:10px;font-size:15.5px;font-weight:500;color:#fff}
.you-steps span{display:inline-grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:rgba(242,178,102,.14);border:1px solid rgba(242,178,102,.4);color:var(--human-n);font:500 12px/1 var(--mono)}
.you-price b{font-size:14px;color:#fff}
.you-price p{margin-top:2px;font-size:13px;line-height:1.5;color:var(--on-night-soft)}
.you .btn-dark{background:#fff;color:var(--ink);box-shadow:none}
.dash{box-shadow:0 2px 6px rgba(18,24,41,.05),0 50px 100px -50px rgba(18,24,41,.5)}

/* FAQ: two columns ----------------------------------------------------------------- */
.faq-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(32px,6vw,84px);align-items:start}
.faq-side{position:sticky;top:110px}
.faq-side .lede a{color:var(--ai-ink);border-bottom:1px solid var(--ai-line)}
.faq-side .btn{margin-top:26px}
.faq details{transition:background .2s}
.faq summary:hover{color:var(--ai-ink)}

/* free mock-up: the brand art behind the form ------------------------------------- */
#mockup{overflow:hidden;background:radial-gradient(900px 500px at 92% 10%,rgba(68,83,230,.22),transparent 65%),radial-gradient(700px 420px at 0% 100%,rgba(210,118,15,.12),transparent 65%),var(--night)}
.ct-side{position:relative}
.ct-orb{position:absolute;z-index:0;right:-30px;top:-96px;width:480px;height:auto;-webkit-mask-image:radial-gradient(closest-side,#000 78%,transparent 100%);mask-image:radial-gradient(closest-side,#000 78%,transparent 100%);max-width:none;pointer-events:none;filter:drop-shadow(0 30px 50px rgba(0,0,0,.35))}
.ct-side .form{position:relative;z-index:1}
@media (prefers-reduced-motion:no-preference){.ct-orb{animation:orbfloat 10s ease-in-out infinite}}
@keyframes orbfloat{50%{transform:translateY(-14px) rotate(1.5deg)}}

@media (max-width:1100px){
  .hx{justify-self:center}
  .hx-browser{right:0;width:92%}
  .hx-t2{right:-8px}
  .bento{grid-template-columns:repeat(2,1fr)}
  .you{grid-template-columns:1fr 1fr}
}
@media (max-width:960px){
  .faq-grid{grid-template-columns:1fr}
  .faq-side{position:static}
  .ct-orb{width:400px;right:-20px;top:-80px}
}
@media (max-width:640px){
  .hx{height:478px}
  .hx-browser{right:0;width:94%;border-radius:12px}
  .hx-bar{height:28px}.hx-url{font-size:9.5px;height:19px}
  .hx-phone{width:122px;height:252px;padding:6px;border-radius:26px;bottom:46px}
  .hx-screen{border-radius:23px}.hx-notch{width:44px;height:14px}.hx-sb{height:22px;font-size:8px}
  .hx-shot{top:22px}
  .hx-toast{min-width:0;padding:9px 12px 9px 9px;gap:9px;border-radius:13px}
  .hx-t1{display:none}
  .hx-t2{right:0;top:262px}.hx-t3{right:14px;top:336px}
  .hx-v b{font-size:12.5px}.hx-v p{font-size:11px}
  .hx-avs,.hx-av,.hx-ok{width:32px;height:32px}.hx-ok .ic{width:16px;height:16px}
  .hx-ex{display:none}
  .hx-tabs{right:auto;left:50%;transform:translateX(-50%)}
  .hx-tab{padding:0 10px;font-size:12.5px;height:32px}
  .ix-pick img{width:44px;height:44px}
  .ix-pick small{display:none}
  .ix-pick .pk{padding:10px 12px 10px 10px;gap:10px}
  .ix-pick .pk{min-width:0;gap:8px;padding:10px 8px 10px 8px}
  .ix-pick .pk img{width:36px;height:36px}
  .ix-pick b{font-size:14px}
  .ix-pick .pk-play{width:30px;height:30px}
  .ix-pick .pk-play .ic{width:12px;height:12px}
  .vs-vis{margin:-22px -22px 20px;height:190px;gap:16px}
  .cf{width:190px}
  .rc{width:108px;height:142px}.rc b{font-size:17px}
  .rc-chips li{font-size:11.5px;padding:6px 10px}
  .bento{grid-template-columns:1fr;gap:12px}
  .bento article{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:16px;align-items:center;padding:16px 18px}
  .bento img{grid-row:1/3;width:64px;height:64px;margin:0}
  .bento h3{margin-top:0;font-size:17px;align-self:end}
  .bento p{margin-top:2px;font-size:14px;align-self:start}
  .hb1{width:420px;height:420px;right:-160px;top:-160px;background:rgba(68,83,230,.16)}
  .hb2{display:none}
  .you{grid-template-columns:1fr}
  .ct-orb{width:280px;right:-20px;top:-64px}
}

/* hero: a soft ping over the card on the demo website (the launcher always sits bottom-right) */
.hx-ping{position:absolute;z-index:2;right:1.4%;bottom:2.2%;width:9.5%;aspect-ratio:1;border-radius:50%;pointer-events:none;box-shadow:0 0 0 2px rgba(68,83,230,.75)}
@media (prefers-reduced-motion:no-preference){.hx-ping{animation:ping 2.6s var(--ease) infinite}}
@keyframes ping{0%{box-shadow:0 0 0 2px rgba(68,83,230,.8),0 0 0 0 rgba(68,83,230,.45)}70%{box-shadow:0 0 0 2px rgba(68,83,230,0),0 0 0 22px rgba(68,83,230,0)}100%{box-shadow:0 0 0 2px rgba(68,83,230,0),0 0 0 0 rgba(68,83,230,0)}}

/* about: the brand art and what it means */
.phero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,64px);align-items:center}
.brand-art{margin:0;text-align:center}
.brand-art img{width:100%;height:auto;max-width:520px;-webkit-mask-image:radial-gradient(closest-side,#000 80%,transparent 100%);mask-image:radial-gradient(closest-side,#000 80%,transparent 100%);margin:0 auto;filter:drop-shadow(0 34px 50px rgba(18,24,41,.22))}
.brand-art figcaption{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:6px;font-size:14px;color:var(--muted)}
.brand-art figcaption span{display:inline-flex;align-items:center;gap:8px}
.brand-art figcaption i{width:10px;height:10px;border-radius:50%}
.ba-ai{background:var(--ai)}.ba-hu{background:var(--human)}.ba-win{background:var(--win-n)}
@media (prefers-reduced-motion:no-preference){.brand-art img{animation:orbfloat 10s ease-in-out infinite}}
@media (max-width:960px){.phero-grid{grid-template-columns:1fr}.brand-art img{max-width:400px}}

/* "it runs in the browser": a mobile address bar on the phones (owner, 2026-10-15: toolkit, not app) */
.hx-addr{position:absolute;z-index:2;left:10px;right:10px;top:28px;height:20px;display:flex;align-items:center;justify-content:center;gap:4px;border-radius:999px;background:#F1F0EC;font:400 8.5px/1 var(--mono);color:var(--muted)}
.hx-addr .hx-lock{width:9px;height:9px}
.hx-shot{top:52px}
@media (max-width:640px){.hx-addr{top:22px;height:16px;left:7px;right:7px;font-size:7px}.hx-shot{top:40px}}

/* ======================================================================
   2026-10-15: every source, not only the website (owner). Hero = sources
   flowing into the toolkit; "Everywhere you pay for attention" section.
   ====================================================================== */
.hx3{height:640px;width:calc(100% + 48px);max-width:none;margin-right:-48px}
.hx-flow{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none;overflow:visible}
.hx-flow .fl{fill:none;stroke:url(#hxg);stroke-width:2;stroke-linecap:round;stroke-dasharray:3 7}
@media (prefers-reduced-motion:no-preference){.hx-flow .fl{animation:flow 1.1s linear infinite}}
@keyframes flow{to{stroke-dashoffset:-20}}
.src-col{position:absolute;z-index:2;left:0;top:6px;width:236px;display:flex;flex-direction:column;gap:11px}
.src{padding:9px 12px 10px;border-radius:14px;background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(18,24,41,.07);box-shadow:0 1px 2px rgba(18,24,41,.05),0 14px 30px -18px rgba(18,24,41,.35)}
.src:nth-child(2){margin-left:14px}.src:nth-child(3){margin-left:4px}.src:nth-child(4){margin-left:16px}.src:nth-child(5){margin-left:2px}
.src-k{display:flex;align-items:center;gap:6px;margin-bottom:5px;font:500 9.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.src-k .ic{width:13px;height:13px}
.s-google .src-k .ic{color:var(--ai)}.s-ig .src-k .ic{color:#C8457A}.s-web .src-k .ic{color:var(--win)}.s-mail .src-k .ic{color:var(--human)}.s-sms .src-k .ic{color:#2E9E5B}
.src .hx-v small{display:block;font:400 9.5px/1.3 var(--mono);color:var(--faint)}
.src .hx-v b{display:block;margin-top:1px;font-size:13px;line-height:1.3;white-space:normal}
.s-google .hx-v b{color:#2238B8}
.src .hx-v p{margin-top:1px;font-size:11.5px;line-height:1.4;white-space:normal}
.ig-v{display:flex;align-items:center;gap:10px}
.ig-media{flex:none;width:44px;height:44px;border-radius:9px;overflow:hidden;background:#EFE6D6}
.ig-media img{width:100%;height:100%;object-fit:cover}
.ig-cover{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:5px;background:linear-gradient(160deg,#18346A,#0F2142)}
.ig-cover small{font:500 6px/1 var(--mono)!important;letter-spacing:.1em;text-transform:uppercase;color:#E2B866!important}
.ig-cover b{margin:0!important;font:400 8.5px/1 var(--serif)!important;color:#fff}
.src-btn{display:inline-flex;align-items:center;gap:6px;margin-top:4px;padding:6px 11px;border-radius:999px;background:var(--ink);color:#fff;font-size:11.5px;font-weight:600}
.src-btn .ic{width:12px;height:12px}
.src-bub{display:inline-block;padding:6px 10px;border-radius:13px 13px 13px 4px;background:#E9E7E1;color:var(--ink-2)!important}
.hx3 .hx-phone{left:auto;right:0;top:92px;bottom:auto;width:200px;height:414px}
.hx3 .hx-t2{right:-30px;top:18px;left:auto}
.hx3 .hx-t3{right:-36px;top:auto;bottom:70px;left:auto}
.hx3 .hx-tabs{right:auto;left:50%;transform:translateX(-50%);bottom:0}

/* where it works: every channel ------------------------------------------------------ */
#channels{background:radial-gradient(900px 420px at 50% 0%,rgba(68,83,230,.06),transparent 65%),var(--paper)}
.chn{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.chn article{display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:16px;align-items:center;padding:18px 22px 18px 16px;border-radius:20px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.chn article:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.chn img{grid-row:1/3;width:76px;height:76px;transition:transform .45s var(--ease)}
.chn article:hover img{transform:rotate(-4deg) scale(1.06)}
.chn h3{align-self:end;font-size:18px;font-weight:600;letter-spacing:-.015em}
.chn p{align-self:start;margin-top:3px;font-size:14.5px;line-height:1.5;color:var(--muted)}
.chn-note{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:30px;font-size:16px;font-weight:500;color:var(--ink-2)}
.chn-note .ic{width:20px;height:20px;padding:7px;box-sizing:content-box;border-radius:50%;background:var(--win-soft);color:var(--win)}

/* how it works, step 1: several sources, one offer -------------------------------------- */

/* mock results: where the sample firm's consultations came from ------------------------ */
.mk-src{margin-top:16px;padding-top:14px;border-top:1px solid var(--night-rule)}
.mk-src p{font:500 10.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-night-soft)}
.mk-srcbar{display:flex;gap:3px;height:10px;margin-top:10px;border-radius:999px;overflow:hidden}
.mk-srcbar i{display:block;height:100%}
.mk-src .ms0{background:var(--ai-n)}.mk-src .ms1{background:var(--win-n)}.mk-src .ms2{background:var(--human-n)}.mk-src .ms3{background:#E98AA8}
.mk-src ul{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px}
.mk-src li{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--on-night-soft)}
.mk-src li i{width:8px;height:8px;border-radius:50%}
.mk-src li b{font:500 12.5px/1 var(--mono);color:#fff}

@media (max-width:1100px){
  .hx3{width:100%;max-width:600px;margin-right:0}
  .chn{grid-template-columns:repeat(2,1fr)}
  .hx3 .hx-t2{right:-8px}.hx3 .hx-t3{right:-8px}
}
@media (max-width:640px){
  .hx3{height:520px}
  .src-col{width:58%;gap:7px;top:0}
  .src{padding:7px 9px 8px;border-radius:11px}
  .src:nth-child(n){margin-left:0}
  .src-k{font-size:8px;margin-bottom:3px}.src-k .ic{width:11px;height:11px}
  .src .hx-v b{font-size:11.5px}.src .hx-v p,.src .hx-v small{display:none}
  .s-sms .hx-v p.src-bub{display:inline-block;font-size:10.5px}
  .ig-media{width:32px;height:32px}
  .src-btn{font-size:10px;padding:4px 8px;margin-top:0}
  .hx3 .hx-phone{width:136px;height:282px;top:70px;padding:6px;border-radius:26px}
  .hx3 .hx-t2{display:none}
  .hx3 .hx-t3{right:0;bottom:56px}
  .chn{grid-template-columns:1fr;gap:12px}
  .chn article{grid-template-columns:60px minmax(0,1fr);padding:14px 16px 14px 12px}
  .chn img{width:60px;height:60px}
  .chn h3{font-size:16.5px}.chn p{font-size:14px}
}

/* the smallest phones: the name and the play button need the room */
@media (max-width:360px){.ix-pick .pk img{display:none}}

/* film pop-up without a top bar (2026-10-16): the close button floats over the film's corner */
.film-box{position:relative;overflow:hidden}
.film-box .film-x{position:absolute;top:12px;right:12px;z-index:2;background:rgba(11,15,28,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.film-box .film-x:hover{background:rgba(11,15,28,.85)}

/* header: Industries dropdown → the four industry sites (2026-10-16) */
.nav{align-items:center}
.nav-dd{position:relative}
.nav-dd-btn{display:inline-flex;align-items:center;gap:4px;font:inherit;font-size:15px;font-weight:500;color:var(--ink-2);background:none;border:0;padding:0;cursor:pointer;transition:color .15s}
.nav-dd-btn .ic{width:15px;height:15px;transition:transform .2s}
.nav-dd-btn:hover,.nav-dd-btn[aria-expanded="true"]{color:var(--ink)}
.nav-dd-btn[aria-expanded="true"] .ic{transform:rotate(180deg)}
.nav-dd-panel{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%);z-index:60;width:340px;padding:8px;border-radius:18px;background:#fff;border:1px solid var(--rule);box-shadow:0 24px 60px -24px rgba(18,24,41,.35)}
.nav .nav-dd-panel a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;color:var(--ink);transition:background .15s}
.nav .nav-dd-panel a:hover,.nav .nav-dd-panel a:focus-visible{background:var(--paper-2,#f4f2ee)}
.nav-dd-panel img{width:40px;height:40px;flex:none}
.nav-dd-panel span{display:flex;flex-direction:column;line-height:1.3}
.nav-dd-panel b{font-size:15px;font-weight:600}
.nav-dd-panel small{font-size:12.5px;color:var(--muted)}
.mnav-k{padding:14px 2px 4px;font:500 10.5px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.mnav a.mnav-ind{padding:11px 2px 11px 14px;font-size:16px}

/* how it works (2026-10-16): tabs pick the industry; step 1 (the visitor taps the free offer), step 2 (the
   toolkit builds their result) and step 3 (you reply, they book) play in order. Without .go — no JS, reduced
   motion, or between plays — every step shows its finished state. ------------------------------------- */
[data-seq]:not([data-ind="legal"]) [data-for="legal"],[data-seq]:not([data-ind="medspa"]) [data-for="medspa"],
[data-seq]:not([data-ind="dental"]) [data-for="dental"],[data-seq]:not([data-ind="reno"]) [data-for="reno"]{display:none}
.hiw{--t1:4.2s;--t2:5.2s;--t3:5.6s}
.hiw-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:-6px auto 34px}
.hiw-tab{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:999px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);font-size:15px;font-weight:500;color:var(--ink-2);transition:background .25s,color .25s,border-color .25s}
.hiw-tab:hover{border-color:var(--rule-2)}
.hiw-tab i{width:8px;height:8px;border-radius:50%}
.hiw-tab[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.hiw-tab[aria-selected="true"] .dot-legal{background:var(--legal-n)}.hiw-tab[aria-selected="true"] .dot-medspa{background:var(--medspa-n)}
.hiw-tab[aria-selected="true"] .dot-dental{background:var(--dental-n)}.hiw-tab[aria-selected="true"] .dot-reno{background:var(--reno-n)}
.hiw-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.hiw-step{--d:0s;--t:var(--t1);position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s}
.hiw-step:nth-child(2){--d:var(--t1);--t:var(--t2)}
.hiw-step:nth-child(3){--d:calc(var(--t1) + var(--t2));--t:var(--t3)}
.hiw.solo .hiw-step{--d:0s}
.hiw-step.is-on{transform:translateY(-4px);border-color:var(--ai-line);box-shadow:0 0 0 4px var(--ai-soft),var(--shadow)}
.hiw-vis{position:relative;height:300px;overflow:hidden;border-radius:calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px) 0 0;border-bottom:1px solid var(--rule);background:radial-gradient(120% 90% at 50% 0%,#fff 0%,#F5F3ED 58%,#ECE9E1 100%)}
.hiw-prog{position:absolute;z-index:3;left:0;right:0;bottom:0;height:3px}
.hiw-prog i{display:block;height:100%;background:linear-gradient(90deg,var(--ai),var(--human));transform:scaleX(0);transform-origin:left}
.hiw-ex{position:absolute;z-index:3;top:12px;right:12px;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.88);border:1px solid var(--rule);font:500 9px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.hiw-body{padding:22px 24px 26px}
.hiw-who{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
.hiw-n{display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font:500 13px/1 var(--mono)}
.who{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;font:500 10.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.who .ic{width:13px;height:13px}
.who-them{background:var(--paper-2);color:var(--ink-2)}
.who-ai{background:var(--ai-soft);color:var(--ai-ink)}
.who-you{background:var(--human-soft);color:var(--human-ink)}
.hiw-body h3{font-size:21px;font-weight:600;letter-spacing:-.02em;line-height:1.25}
.hiw-body h3+p{margin-top:8px;color:var(--muted);font-size:15.5px}
.hiw-arr{position:absolute;z-index:4;top:134px;right:-31px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#fff;border:1px solid var(--rule);color:var(--ink);box-shadow:var(--shadow-sm);transition:background .4s,color .4s,border-color .4s}
.hiw-arr .ic{width:15px;height:15px}
.hiw-step:has(+ .hiw-step.is-on) .hiw-arr{background:var(--ai);border-color:var(--ai);color:#fff}
.hiw-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 10px;margin-top:36px;color:var(--ink-2);font-size:16px;text-align:center}
.hiw-note>span{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 10px;margin:0 8px}

/* step 1: their browser, your website, your free offer, one tap */
.b1{position:absolute;left:18px;right:18px;top:20px;height:212px;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 26px 50px -26px rgba(18,24,41,.45),0 0 0 1px rgba(18,24,41,.07)}
.b1-bar{display:flex;align-items:center;gap:5px;height:24px;padding:0 9px;background:#F3F2EE;border-bottom:1px solid var(--rule)}
.b1-bar>i{width:7px;height:7px;border-radius:50%;background:#DCD7CC}
.b1-bar>span{display:flex;align-items:center;gap:4px;height:16px;margin:0 auto;padding:0 10px;border-radius:999px;background:#fff;font:400 9.5px/1 var(--mono);color:var(--muted)}
.b1-bar .ic{width:10px;height:10px;color:var(--win)}
.b1-page{position:relative;height:188px;overflow:hidden}
.b1-page>img{width:100%;height:100%;object-fit:cover;object-position:left top}
.b1-page::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(13,18,32,0) 25%,rgba(13,18,32,.3))}
.b1-card{position:absolute;z-index:2;right:12px;bottom:12px;width:min(200px,74%);padding:11px 12px 12px;border-radius:12px;background:#fff;box-shadow:0 18px 36px -14px rgba(18,24,41,.6),0 0 0 1px rgba(18,24,41,.06)}
.b1-card small{display:block;font:500 9px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--win-ink)}
.b1-card b{display:block;margin:4px 0 9px;font-size:14px;font-weight:600;line-height:1.2;letter-spacing:-.01em}
.b1-btn{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;height:30px;border-radius:999px;background:var(--ink);color:#fff;font-size:11.5px;font-weight:600}
.b1-btn .ic{width:13px;height:13px}
.b1-rip{position:absolute;left:86%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:rgba(154,164,255,.7);opacity:0;pointer-events:none}
.b1-btn .b1-cur{position:absolute;left:86%;top:50%;width:22px;height:22px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.3))}
.b1-ch{position:absolute;left:12px;right:12px;bottom:18px;display:flex;justify-content:center;gap:6px}
.b1-ch li{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;background:#fff;border:1px solid var(--rule);font-size:11.5px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.b1-ch .ic{width:12px;height:12px;color:var(--ai)}

/* step 2: the toolkit on their phone, under your address: what goes in, then their result */
.ph{position:absolute;left:50%;top:20px;width:200px;margin-left:-100px;padding:7px 7px 0;border-radius:32px 32px 0 0;background:#0d1220;box-shadow:0 30px 60px -26px rgba(18,24,41,.55)}
.ph-addr{display:flex;align-items:center;justify-content:center;gap:5px;height:20px;margin:3px 12px 7px;border-radius:999px;background:#262D42;font:400 9.5px/1 var(--mono);color:#C9D1DA}
.ph-addr .ic{width:10px;height:10px;color:var(--win-n)}
.ph-scr{position:relative;height:260px;border-radius:24px 24px 0 0;background:#fff;overflow:hidden}
.s2-in,.s2-load,.s2-out{position:absolute;inset:0;padding:14px 13px}
.s2-in,.s2-load{opacity:0}
.s2-load{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.s2-load i{width:26px;height:26px;border-radius:50%;border:2.5px solid var(--ai-soft);border-top-color:var(--ai)}
.s2-load small{font-size:11px;color:var(--muted)}
.q small,.pin small{display:block;font:500 9px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.q-bar{display:block;height:4px;margin:8px 0 14px;border-radius:9px;background:var(--paper-2);overflow:hidden}
.q-bar i{display:block;width:60%;height:100%;background:var(--legal)}
.q b{display:block;margin-bottom:4px;font-size:15px;font-weight:600;letter-spacing:-.01em}
.q-c{display:block;margin-top:7px;padding:9px 11px;border-radius:10px;border:1px solid var(--rule);font-size:12px;font-weight:500;color:var(--ink-2)}
.q-c.q-sel{border-color:var(--legal);background:#EEF2FB;color:var(--legal);box-shadow:0 0 0 1px var(--legal)}
.pin{display:flex;flex-direction:column;align-items:center}
.pin small{align-self:flex-start}
.pin-ph{position:relative;display:block;width:150px;height:150px;margin-top:12px;border-radius:14px;overflow:hidden;box-shadow:var(--shadow-sm)}
.pin-ph img{width:100%;height:100%;object-fit:cover}
.scan{position:absolute;inset:0;background:linear-gradient(180deg,rgba(68,83,230,0) 68%,rgba(68,83,230,.32) 96%,var(--ai-n) 100%);opacity:0;transform:translateY(-100%)}
.pin-k{margin-top:12px;font-size:11.5px;font-weight:600;color:var(--ai-ink)}
.pin-k::after{content:"…"}
.rp{border-radius:12px;overflow:hidden;border:1px solid var(--rule)}
.rp-hd{padding:11px 12px;background:var(--legal);color:#fff}
.rp-hd small{display:block;font:500 8.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;opacity:.72}
.rp-hd b{display:block;margin-top:4px;font-family:var(--serif);font-size:19px;font-weight:400;line-height:1.1}
.rp-hd span{display:block;margin-top:3px;font-size:10.5px;opacity:.82}
.rp ul{padding:4px 12px}
.rp li{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--rule);font-size:12px;font-weight:500}
.rp li:last-child{border-bottom:0}
.rp li .ic{width:17px;height:17px;padding:2px;border-radius:50%;background:var(--win-soft);color:var(--win)}
.rp-fine{padding:0 12px 10px;font-size:9.5px;color:var(--faint)}
.sc-top{display:flex;align-items:center;gap:10px}
.sc-ring{position:relative;flex:none;width:68px;height:68px}
.sc-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.sc-ring circle{fill:none;stroke:var(--paper-2);stroke-width:6}
.sc-ring .sc-arc{stroke:var(--medspa);stroke-linecap:round}
.sc-ring img{position:absolute;inset:9px;width:50px;height:50px;border-radius:50%;object-fit:cover}
.sc-top small{display:block;font:500 8.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.sc-top p{margin-top:3px;font-size:11.5px;line-height:1.35;color:var(--ink-2)}
.sc ul{margin-top:14px}
.sc li{display:grid;grid-template-columns:72px 1fr;align-items:center;gap:8px;padding:7px 0;font-size:11px;color:var(--ink-2)}
.sc li>i{height:5px;border-radius:9px;background:var(--paper-2);overflow:hidden}
.sc li>i>i{display:block;height:100%;border-radius:9px;background:var(--medspa);transform-origin:left}
.ba{display:flex;flex-direction:column;align-items:center}
.ba-box{position:relative;display:block;width:100%;aspect-ratio:1;border-radius:14px;overflow:hidden}
.ba-box img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-box .ba-aft{clip-path:inset(0 0 0 50%)}
.ba-line{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 8px rgba(0,0,0,.35)}
.ba-line::after{content:"";position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.ba em{position:absolute;left:8px;bottom:8px;padding:3px 7px;border-radius:999px;background:rgba(13,18,32,.7);color:#fff;font:500 8.5px/1.2 var(--mono);font-style:normal;letter-spacing:.1em;text-transform:uppercase}
.ba>b{margin-top:10px;font-size:13px;font-weight:600}

/* step 3: your review screen, your video reply, their booking */
.hv3{display:flex;flex-direction:column;gap:9px;padding:18px 18px 0}
.hv3 .hiw-ex{top:auto;bottom:14px}
.rv{border-radius:12px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);overflow:hidden}
.rv-hd{display:flex;align-items:center;justify-content:space-between;padding:7px 11px;background:#F3F2EE;border-bottom:1px solid var(--rule);font:500 9px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.rv-hd i{padding:2px 7px;border-radius:999px;background:var(--ai);color:#fff;font-style:normal}
.rv-lead{display:flex;align-items:center;gap:10px;padding:9px 11px}
.rv-av{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--ai-soft);color:var(--ai-ink);font-size:13px;font-weight:600}
.rv-lead b{display:block;font-size:12.5px;font-weight:600;line-height:1.3}
.rv-lead small{display:block;font-size:11px;color:var(--muted)}
.vb{display:flex;align-items:center;gap:10px;align-self:flex-start;width:86%;padding:7px;border-radius:16px 16px 16px 6px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm)}
.vb-th{position:relative;flex:none;width:50px;height:50px;border-radius:11px;overflow:hidden;background:#E9E3D8}
.vb-th img{width:100%;height:100%;object-fit:cover}
.vb-rec{position:absolute;z-index:2;top:5px;left:5px;width:8px;height:8px;border-radius:50%;background:#E5484D;box-shadow:0 0 0 2px rgba(255,255,255,.85);opacity:0}
.vb-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(13,18,32,.3);color:#fff}
.vb-play .ic{width:18px;height:18px;margin-left:2px}
.vb>div{display:grid}
.vb b{font-size:12.5px;font-weight:600}
.vb small{grid-row:2;grid-column:1;font-size:11px;font-weight:500}
.vb-a{color:#C2383D;opacity:0}
.vb-b{color:var(--win-ink)}
.cb{position:relative;align-self:flex-end;max-width:84%;padding:9px 13px;border-radius:16px 16px 6px 16px;background:linear-gradient(180deg,#5462F0,var(--ai));color:#fff;font-size:12.5px;line-height:1.35;box-shadow:0 12px 24px -12px rgba(68,83,230,.75)}
.cb-dots{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:4px;opacity:0}
.cb-dots i{width:5px;height:5px;border-radius:50%;background:#fff}
.bk{align-self:center;display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;background:var(--win-soft);border:1px solid var(--win-line);color:var(--win-ink);font-size:13px;font-weight:600}
.bk .ic{width:15px;height:15px}

@media (prefers-reduced-motion:no-preference){
  .go .hiw-prog i{animation:hw-prog var(--t) linear var(--d) both}
  .go .b1-page>img{animation:hw-zoom var(--t) ease-out var(--d) both}
  .go .b1-card{animation:hw-up .6s var(--ease) calc(var(--d) + .3s) both}
  .go .b1-cur{animation:hw-cur 2s var(--ease) calc(var(--d) + 1s) both}
  .go .b1-btn{animation:hw-press .5s ease calc(var(--d) + 2.75s) both}
  .go .b1-rip{animation:hw-rip .8s ease-out calc(var(--d) + 2.8s) both}
  .go .s2-in{animation:hw-in2 var(--t) linear var(--d) both}
  .go .s2-load{animation:hw-load var(--t) linear var(--d) both}
  .s2-load i{animation:spin .8s linear infinite}
  .go .s2-out{animation:hw-out var(--t) var(--ease) var(--d) both}
  .go .q-sel{animation:hw-sel .35s ease calc(var(--d) + 1.2s) both}
  .go .q-bar i{animation:hw-grow .8s var(--ease) calc(var(--d) + 1.4s) both}
  .go .pin-ph img{animation:hw-drop .6s var(--ease) calc(var(--d) + .2s) both}
  .go .scan{animation:hw-scan 1.4s ease-in-out calc(var(--d) + .8s) both}
  .go .rp li{animation:hw-tick .4s var(--ease) calc(var(--d) + 3.8s) both}
  .go .rp li:nth-child(2){animation-delay:calc(var(--d) + 4.1s)}
  .go .rp li:nth-child(3){animation-delay:calc(var(--d) + 4.4s)}
  .go .sc-arc{animation:hw-ring 1.3s var(--ease) calc(var(--d) + 3.6s) both}
  .go .sc li>i>i{animation:hw-fill .9s var(--ease) calc(var(--d) + 3.8s) both}
  .go .sc li:nth-child(2)>i>i{animation-delay:calc(var(--d) + 3.95s)}
  .go .sc li:nth-child(3)>i>i{animation-delay:calc(var(--d) + 4.1s)}
  .go .ba-aft{animation:hw-ba 1.9s ease-in-out calc(var(--d) + 3.6s) both}
  .go .ba-line{animation:hw-bal 1.9s ease-in-out calc(var(--d) + 3.6s) both}
  .go .rv{animation:hw-up .5s var(--ease) calc(var(--d) + .2s) both}
  .go .rv-hd i{animation:hw-ping 1.1s ease-out calc(var(--d) + .7s) 2 both}
  .go .vb{animation:hw-up .5s var(--ease) calc(var(--d) + 1s) both}
  .go .vb-rec{animation:hw-rec 1.8s linear calc(var(--d) + 1.1s) both}
  .go .vb-a{animation:hw-hold 1.8s steps(1) calc(var(--d) + 1.1s) both}
  .go .vb-b,.go .vb-play{animation:hw-show .3s ease calc(var(--d) + 2.9s) both}
  .go .cb{animation:hw-up .4s var(--ease) calc(var(--d) + 3.1s) both}
  .go .cb-dots{animation:hw-hold .9s steps(1) calc(var(--d) + 3.1s) both}
  .cb-dots i{animation:hw-dot 1s ease-in-out infinite}
  .cb-dots i:nth-child(2){animation-delay:.15s}.cb-dots i:nth-child(3){animation-delay:.3s}
  .go .cb-msg{animation:hw-show .35s ease calc(var(--d) + 4s) both}
  .go .bk{animation:hw-pop .55s cubic-bezier(.3,1.5,.5,1) calc(var(--d) + 4.5s) both}
}
@keyframes hw-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes hw-zoom{from{transform:scale(1.08)}}
@keyframes hw-up{from{opacity:0;transform:translateY(14px)}}
@keyframes hw-cur{0%{opacity:0;transform:translate(60px,70px)}20%{opacity:1}80%{transform:none}88%{transform:scale(.8)}100%{opacity:1;transform:none}}
@keyframes hw-press{40%{transform:scale(.95);background:var(--ai)}}
@keyframes hw-rip{0%{opacity:0;transform:scale(.3)}1%{opacity:.9}100%{opacity:0;transform:scale(3.4)}}
@keyframes hw-in2{0%,44%{opacity:1}50%,100%{opacity:0}}
@keyframes hw-load{0%,46%{opacity:0}52%,62%{opacity:1}68%,100%{opacity:0}}
@keyframes hw-out{0%,64%{opacity:0;transform:translateY(10px)}74%,100%{opacity:1;transform:none}}
@keyframes hw-sel{from{border-color:var(--rule);background:#fff;color:var(--ink-2);box-shadow:none}}
@keyframes hw-grow{from{width:30%}}
@keyframes hw-drop{from{opacity:0;transform:scale(.88)}}
@keyframes hw-scan{0%{opacity:0;transform:translateY(-100%)}10%,90%{opacity:1}100%{opacity:0;transform:none}}
@keyframes hw-tick{from{opacity:0;transform:translateX(-8px)}}
@keyframes hw-ring{from{stroke-dashoffset:213.63}}
@keyframes hw-fill{from{transform:scaleX(0)}}
@keyframes hw-ba{0%{clip-path:inset(0 0 0 100%)}55%{clip-path:inset(0)}100%{clip-path:inset(0 0 0 50%)}}
@keyframes hw-bal{0%{left:100%}55%{left:0}100%{left:50%}}
@keyframes hw-ping{0%{box-shadow:0 0 0 0 rgba(68,83,230,.55)}100%{box-shadow:0 0 0 8px rgba(68,83,230,0)}}
@keyframes hw-rec{0%,24%,50%,74%{opacity:1}12%,37%,62%,87%{opacity:.25}99%{opacity:1}100%{opacity:0}}
@keyframes hw-hold{0%{opacity:1}100%{opacity:0}}
@keyframes hw-show{from{opacity:0}}
@keyframes hw-dot{0%,60%,100%{opacity:.55;transform:none}30%{opacity:1;transform:translateY(-3px)}}
@keyframes hw-pop{from{opacity:0;transform:scale(.6)}}
@media (max-width:960px){
  .hiw-steps{grid-template-columns:1fr;max-width:520px;margin:0 auto;gap:36px}
  .hiw-arr{top:auto;right:auto;bottom:-29px;left:50%;margin-left:-16px;transform:rotate(90deg)}
}
@media (max-width:640px){
  .hiw-tabs{gap:6px;margin-bottom:26px}
  .hiw-tab{height:38px;padding:0 13px;font-size:13.5px}
  .hiw-body{padding:20px 20px 22px}
  .hiw-note{font-size:15px}
}

/* ==========================================================================
   2026-10-19 · "More leads. More booked clients." (owner)
   Hero with the three beats and the new hero image, the problem in four
   channels, the video-ads stage (beat 1), the film player under "How it
   works", compact industry cards, and the free mock-up as the header button.
   ========================================================================== */

/* header: one dark button (the free mock-up), client login as a quiet link */
.hdr-login{font-size:15px;font-weight:500;color:var(--ink-2);padding:0 6px;transition:color .15s}
.hdr-login:hover{color:var(--ink)}
@media (max-width:960px){.hdr-login{display:none}}

/* hero ------------------------------------------------------------------- */
.hero-v2 .h1{font-size:clamp(44px,4.7vw,68px);line-height:.98}
.hero-v2 .h1 em{margin-top:.06em}
/* the three outcomes (owner, 2026-10-20): plain words, an icon each, the booking line strongest */
.outs{display:grid;gap:13px;margin-top:28px}
.outs li{display:flex;align-items:center;gap:14px;font-size:clamp(17.5px,1.5vw,21px);font-weight:500;line-height:1.3;letter-spacing:-.012em;color:var(--ink-2)}
.outs .ic{flex:none;width:36px;height:36px;padding:8px;border-radius:11px;background:var(--ai-soft);color:var(--ai-ink);box-shadow:inset 0 0 0 1px var(--ai-line)}
.outs .out-key{font-weight:600;color:var(--ink)}
.outs .out-key .ic{background:var(--human-soft);color:var(--human-ink);box-shadow:inset 0 0 0 1px var(--human-line)}
.outs .out-key span{text-decoration-line:underline;text-decoration-color:rgba(210,118,15,.22);text-decoration-thickness:.4em;text-underline-offset:-.24em;text-decoration-skip-ink:none}
.hero-sup{margin-top:22px;max-width:540px;font-size:15.5px;line-height:1.6;color:var(--muted)}
.hero-sup b{font-weight:600}.hero-sup .m-ai{color:var(--ai-ink)}.hero-sup .m-hu{color:var(--human-ink)}
.hero-v2 .hero-ctas{margin-top:30px}
.hero-v2 .btn-line .ic{width:15px;height:15px}
.hero-art{margin:0 -84px 0 -12px;justify-self:end;width:calc(100% + 96px);max-width:none}
.pb-sec .h2 em{display:block}
.hero-art img{width:100%;height:auto;scale:1.09375}
.hero-v2 .label{text-wrap:balance;line-height:1.5}
@media (prefers-reduced-motion:no-preference){.hero-art img{animation:heroFloat 9s ease-in-out infinite}}
@keyframes heroFloat{50%{transform:translateY(-10px)}}
@media (max-width:1100px){.hero-v2 .hero-grid{grid-template-columns:1fr}.hero-art{justify-self:center;width:100%;max-width:560px;margin:6px auto 0}}

/* the problem: four channels, each ending on what was lost ---------------- */
.pbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.pb{display:flex;flex-direction:column;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);overflow:hidden}
.pb-v{position:relative;height:214px;overflow:hidden;background:linear-gradient(180deg,#F8F7F3,#EFEDE6);border-bottom:1px solid var(--rule)}
.pb-t{padding:16px 18px 20px}
.pb-t h3{font-size:18.5px;font-weight:600;letter-spacing:-.015em}
.pb-x{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:6px 12px 6px 9px;border-radius:999px;background:#FBE8E4;color:#A12F22;font-size:13px;font-weight:600}
.pb-x .ic{width:13px;height:13px}
/* website */
.pb-br{position:absolute;left:16px;right:16px;top:16px;bottom:16px;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 10px 24px -14px rgba(18,24,41,.45)}
.pb-bar{display:flex;align-items:center;gap:5px;height:20px;padding:0 9px;background:#F3F2EE;border-bottom:1px solid var(--rule)}
.pb-bar i{width:6px;height:6px;border-radius:50%;background:#D9D5CC}
.pb-bar b{margin-left:8px;padding:2px 8px;border-radius:5px;background:#fff;font:500 9px/1.3 var(--mono);color:var(--faint)}
.pb-br img{display:block;width:100%;height:auto}
.pb-cur{position:absolute;z-index:2;left:70%;top:76%;width:21px;height:21px;opacity:0}
/* google ad */
.pb-ad{position:absolute;left:16px;right:16px;top:28px;padding:13px 14px;border-radius:12px;background:#fff;box-shadow:0 10px 24px -14px rgba(18,24,41,.4)}
.pb-ad small{display:block;font-size:10.5px;color:#4d5156}
.pb-ad small b{color:#202124;font-weight:600}
.pb-ad p{margin-top:5px;font-size:15px;line-height:1.25;font-weight:500;color:#1a0dab}
.pb-ad span{display:block;margin-top:5px;font-size:12px;line-height:1.4;color:#4d5156}
.pb-rip{position:absolute;left:34%;top:52%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:rgba(26,13,171,.22);opacity:0}
.pb-back{position:absolute;left:50%;bottom:20px;display:inline-flex;align-items:center;gap:6px;padding:7px 13px 7px 10px;border-radius:999px;background:#fff;border:1px solid var(--rule-2);box-shadow:var(--shadow-sm);font-size:13px;font-weight:600;color:var(--ink);transform:translateX(-50%)}
.pb-back .ic{width:14px;height:14px;transform:rotate(180deg)}
/* instagram */
.pb-ph{position:absolute;left:50%;top:14px;width:134px;height:232px;margin-left:-67px;border-radius:21px;background:#fff;border:6px solid #1c1c1e;overflow:hidden;box-shadow:0 14px 26px -14px rgba(0,0,0,.5)}
.pb-post{padding:8px 7px 9px}
.pb-ph-h{display:flex;align-items:center;gap:5px;font-size:8px;font-weight:600;color:#222}
.pb-ph-h i{display:grid;place-items:center;width:15px;height:15px;border-radius:50%;background:#14476a;color:#fff;font:600 6px/1 var(--sans);font-style:normal}
.pb-ph-h span{font-weight:400;color:#8a8a8a}
.pb-ph-h s{display:block;width:48px;height:6px;border-radius:3px;background:#E6E8EC}
.pb-art{display:grid;place-items:center;height:98px;margin-top:6px;border-radius:7px;background:#14476a;color:#fff;text-align:center;font:700 14px/1.05 var(--sans);letter-spacing:-.01em}
.pb-ph-b{margin-top:6px;padding:6px;border-radius:5px;background:#ECEFF3;text-align:center;font-size:8px;font-weight:600;color:#333}
.pb-ghost .pb-art{background:#ECEEF2}.pb-ghost .pb-ph-h i{background:#DFE2E7}
/* calls and emails */
.pb-log{position:absolute;left:16px;right:16px;top:16px;bottom:16px;padding:11px 12px;border-radius:12px;background:#fff;box-shadow:0 10px 24px -14px rgba(18,24,41,.35)}
.pb-log p{padding-bottom:7px;border-bottom:1px solid var(--rule);font-size:12px;font-weight:600}
.pb-log ul{margin-top:3px}
.pb-log li{display:flex;align-items:center;gap:7px;height:27px;font-size:12px;color:var(--ink-2)}
.pb-log li .ic{width:13px;height:13px;color:var(--faint)}
.pb-log li b{margin-left:auto;font-size:11.5px;font-weight:600;color:#A12F22}
/* the moment of loss plays once, as each card arrives */
.pb--web{--td:3.1s}.pb--ga{--td:1.9s}.pb--ig{--td:2.5s}.pb--log{--td:2.4s}
.pb{--d:calc(var(--i) * .22s)}
.js .pb .pb-x{opacity:0;transform:scale(.9)}
.js .pb.in .pb-x{animation:pbPop .45s var(--ease) forwards;animation-delay:calc(var(--d) + var(--td))}
.js .pb.in .pb-v{animation:pbLost .9s ease forwards;animation-delay:calc(var(--d) + var(--td) + .15s)}
.js .pb.in .pb-cur{animation:pbCur 2.9s var(--ease) forwards;animation-delay:calc(var(--d) + .3s)}
.js .pb.in .pb-rip{animation:pbRip .6s ease-out forwards;animation-delay:calc(var(--d) + .6s)}
.js .pb .pb-back{opacity:0}
.js .pb.in .pb-back{animation:pbPop .4s var(--ease) forwards;animation-delay:calc(var(--d) + 1s)}
.js .pb.in .pb-ad{animation:pbAdOut .6s ease forwards;animation-delay:calc(var(--d) + 1.25s)}
.js .pb.in .pb-feed{animation:pbScroll 1s cubic-bezier(.6,0,.3,1) forwards;animation-delay:calc(var(--d) + 1.3s)}
.js .pb .pb-log li{opacity:0}
.js .pb.in .pb-log li{animation:pbRow .4s var(--ease) forwards;animation-delay:calc(var(--d) + .3s + var(--n) * .36s)}
@keyframes pbPop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@keyframes pbLost{to{filter:grayscale(.85) opacity(.72)}}
@keyframes pbCur{0%{opacity:0;transform:translate(0,0)}12%{opacity:1}42%{transform:translate(-96px,-46px)}62%{opacity:1;transform:translate(-92px,-44px)}100%{opacity:0;transform:translate(70px,-150px)}}
@keyframes pbRip{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(1.9)}}
@keyframes pbAdOut{to{transform:translateX(-10px);opacity:.75}}
@keyframes pbScroll{to{transform:translateY(-80px)}}
@keyframes pbRow{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.js .pb.in .pb-back{animation-name:pbBack}
@keyframes pbBack{from{opacity:0;transform:translateX(-50%) scale(.9)}to{opacity:1;transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .js .pb .pb-x,.js .pb .pb-back,.js .pb .pb-log li{opacity:1;transform:none;animation:none}
  .js .pb .pb-back{transform:translateX(-50%)}
  .js .pb.in .pb-v{animation:none;filter:grayscale(.85) opacity(.72)}
  .js .pb.in .pb-cur,.js .pb.in .pb-rip,.js .pb.in .pb-ad,.js .pb.in .pb-feed{animation:none}
}
.pb-why{margin-top:46px;text-align:center;font-size:clamp(20px,2vw,26px);font-weight:500;letter-spacing:-.012em;color:var(--ink-2)}
.pb-why b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.18em;color:var(--ink)}
.pb-why span{display:block;margin-top:6px;font-weight:600;background:linear-gradient(100deg,var(--ai) 0%,#7B4FD8 50%,var(--human) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:1100px){.pbs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pbs{grid-template-columns:1fr}.pb-v{height:206px}}

/* beat 1 · the ads, on a dark stage -------------------------------------- */
.ads-sec{overflow:hidden}
.ads-sec::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(760px 380px at 18% 0%,rgba(68,83,230,.30),transparent 70%),radial-gradient(640px 340px at 88% 100%,rgba(210,118,15,.18),transparent 70%)}
.ads-sec .wrap{position:relative}
.reel-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2.4vw,34px);align-items:start;max-width:1120px;margin:0 auto;padding-top:10px}
.ad{display:flex;flex-direction:column;align-items:center;margin:0;transition:opacity .5s var(--ease),transform .5s var(--ease)}
.ad-ph{position:relative;display:block;width:100%;max-width:252px;padding:7px;border-radius:36px;background:#05070D;cursor:pointer;
  box-shadow:0 0 0 1px rgba(255,255,255,.09) inset,0 34px 70px -30px rgba(0,0,0,.85);transition:box-shadow .45s var(--ease),transform .45s var(--ease)}
.ad-ph::before{content:"";position:absolute;z-index:2;left:50%;top:15px;width:30%;height:16px;margin-left:-15%;border-radius:10px;background:#05070D}
.ad-ph video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;border-radius:29px;background:#141a2c}
.ad-ex{position:absolute;z-index:3;right:16px;top:40px;padding:5px 8px;border-radius:6px;background:rgba(5,7,13,.74);color:#fff;font:500 9.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.ad-play{position:absolute;z-index:3;left:50%;top:50%;display:grid;place-items:center;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--ink);box-shadow:0 12px 26px -8px rgba(0,0,0,.55);transition:opacity .3s,transform .3s var(--ease)}
.ad-play .ic{width:26px;height:26px;margin-left:3px}
.ad-ph:hover .ad-play{transform:scale(1.06)}
.ad.playing .ad-play{opacity:0;transform:scale(.8)}
.ad-prog{position:absolute;z-index:3;left:20px;right:20px;bottom:13px;height:3px;border-radius:2px;background:rgba(255,255,255,.25);overflow:hidden;opacity:0;transition:opacity .3s}
.ad-prog i{display:block;width:0;height:100%;background:#fff}
.ad.playing .ad-prog{opacity:1}
.reel.live .ad{opacity:.62}
.reel.live .ad.on{opacity:1;transform:translateY(-8px)}
.ad.on .ad-ph{box-shadow:0 0 0 2px rgba(154,164,255,.95),0 44px 90px -34px rgba(68,83,230,.75)}
.ad figcaption{margin-top:18px;text-align:center}
.ad figcaption .dot{width:8px;height:8px;margin-right:8px;vertical-align:1px}
.ad figcaption .dot-legal{background:var(--legal-n)}.ad figcaption .dot-medspa{background:var(--medspa-n)}.ad figcaption .dot-dental{background:var(--dental-n)}.ad figcaption .dot-reno{background:var(--reno-n)}
.ad figcaption b{font-size:15.5px;font-weight:600;color:#fff}
.ad figcaption small{display:block;margin-top:4px;font-size:13px;color:var(--on-night-soft)}
.reel-ctl{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 22px;margin-top:36px}
.reel-snd{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:999px;border:1px solid rgba(238,240,246,.26);color:var(--on-night);font-size:14.5px;font-weight:500;transition:border-color .2s,background .2s}
.reel-snd:hover{border-color:rgba(238,240,246,.6);background:rgba(255,255,255,.05)}
.reel-snd span{display:inline-flex;align-items:center;gap:8px}
.reel-snd .ic{width:17px;height:17px}
.reel-snd .snd-on,.reel-snd[aria-pressed="true"] .snd-off{display:none}
.reel-snd[aria-pressed="true"] .snd-on{display:inline-flex}
.reel-note{max-width:520px;font-size:13px;line-height:1.5;color:var(--on-night-soft)}
.ads-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 26px;margin-top:52px;padding-top:38px;border-top:1px solid var(--night-rule)}
.ads-facts li{display:flex;align-items:flex-start;gap:12px}
.ads-facts .ic{width:22px;height:22px;margin-top:1px;color:var(--ai-n)}
.ads-facts b{display:block;font-size:15.5px;font-weight:600;color:#fff}
.ads-facts p{margin-top:4px;font-size:14px;line-height:1.5;color:var(--on-night-soft)}
/* phones and tablets (owner, 2026-10-19: no slider): the four ads one below the other; each plays muted
   while it is on screen, and a tap plays it full screen with sound */
@media (max-width:960px){
  .reel-row{grid-template-columns:1fr;gap:44px;padding-top:0}
  .reel.live .ad,.reel.live .ad.on{opacity:1;transform:none}
  .ad .ad-ph{max-width:300px}
  .ads-facts{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){.ads-facts{grid-template-columns:1fr}.ad .ad-ph{max-width:280px}}

/* the film player under "How it works" ------------------------------------ */
.watch{margin-top:clamp(64px,8vw,104px)}
.wt-head{max-width:780px;margin:0 auto 26px;text-align:center}
.wt-k{display:inline-flex;align-items:center;gap:9px;font:500 12px/1.2 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.wt-k .ic{width:18px;height:18px;color:var(--ai)}
.wt-head h3{margin-top:12px;font-size:clamp(28px,3.3vw,44px);font-weight:600;line-height:1.08;letter-spacing:-.03em;text-wrap:balance}
.wt-head h3 em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.015em}
.wt-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:22px}
.wt-tab{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);font-size:15px;font-weight:500;color:var(--ink-2);transition:background .25s,color .25s,border-color .25s}
.wt-tab:hover{border-color:var(--rule-2)}
.wt-tab i{width:8px;height:8px;border-radius:50%}
.wt-tab small{margin-left:2px;font:500 12px/1 var(--mono);color:var(--faint)}
.wt-tab[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.wt-tab[aria-selected="true"] small{color:var(--on-night-soft)}
.wt-tab[aria-selected="true"] .dot-legal{background:var(--legal-n)}.wt-tab[aria-selected="true"] .dot-medspa{background:var(--medspa-n)}
.wt-tab[aria-selected="true"] .dot-dental{background:var(--dental-n)}.wt-tab[aria-selected="true"] .dot-reno{background:var(--reno-n)}
.wt-stage{position:relative;max-width:1060px;margin:0 auto;aspect-ratio:16/9;border-radius:26px;overflow:hidden;background:#0B0F1C;box-shadow:0 2px 6px rgba(18,24,41,.08),0 56px 110px -44px rgba(18,24,41,.6)}
.wt-stage video{display:block;width:100%;height:100%;object-fit:cover;background:#0B0F1C}
.wt-big{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,rgba(11,15,28,0) 45%,rgba(11,15,28,.22));transition:opacity .3s}
.wt-big span{display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:#fff;color:var(--ink);box-shadow:0 0 0 10px rgba(255,255,255,.18),0 20px 44px -12px rgba(0,0,0,.6);transition:transform .25s var(--ease)}
.wt-big .ic{width:36px;height:36px;margin-left:6px}
.wt-big:hover span{transform:scale(1.06)}
.watch.playing .wt-big{opacity:0;pointer-events:none}
.wt-chs{max-width:1060px;margin:16px auto 0}
.wt-ch{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.wt-ch button{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;border-radius:14px;background:#fff;border:1px solid var(--rule);font-size:14.5px;font-weight:500;color:var(--ink-2);text-align:left;transition:border-color .2s,background .2s,color .2s}
.wt-ch button i{font:500 12px/1 var(--mono);font-style:normal;color:var(--faint)}
.wt-ch button:hover{border-color:var(--ink)}
.wt-ch button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.wt-ch button.on i{color:var(--on-night-soft)}
@media (max-width:640px){.wt-ch{grid-template-columns:1fr 1fr}.wt-big span{width:70px;height:70px}.wt-big .ic{width:28px;height:28px}.wt-stage{border-radius:18px}}

/* industries, compact ---------------------------------------------------- */
.bizs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.biz{display:flex;flex-direction:column;padding:22px 22px 24px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--rule);box-shadow:var(--shadow-sm);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.biz:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.biz img{width:64px;height:64px;margin:-4px 0 0 -6px}
.biz-k{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13.5px;font-weight:600;color:var(--muted)}
.biz h3{margin-top:6px;font-size:20px;font-weight:600;line-height:1.2;letter-spacing:-.02em}
.biz-p{flex:1;margin-top:8px;font-size:14.5px;line-height:1.55;color:var(--muted)}
.biz-act{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.biz-act .btn{width:100%}
@media (max-width:1100px){.bizs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.bizs{grid-template-columns:1fr}}

/* Google Ads (owner, 2026-10-19: "simple but impactful"): one search, played twice. Most ads land the
   click on a contact page and they leave; yours lands it on the free toolkit. A [data-seq] like How it
   works; without .go (no JS, reduced motion, between plays) every part shows its end state. --------- */
.gads{max-width:1040px;margin:0 auto}
.gads-stage{position:relative;padding:32px clamp(16px,3.2vw,40px) 34px;border-radius:var(--r-lg);background:radial-gradient(120% 90% at 50% 0%,#fff 0%,#F8F6F0 55%,#F1EEE6 100%);border:1px solid var(--rule);box-shadow:var(--shadow)}
.gads-ex{position:absolute;top:14px;right:16px;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid var(--rule);font:500 9px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.gads-q{display:flex;align-items:center;gap:12px;max-width:600px;height:54px;margin:0 auto 30px;padding:0 22px;border-radius:999px;background:#fff;border:1px solid #DFE1E5;box-shadow:0 1px 6px rgba(32,33,36,.16);font-size:17.5px;color:#202124}
.gads-q .ic{flex:none;width:20px;height:20px;color:#9AA0A6}
.gads-qt{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gads-caret{flex:none;width:2px;height:22px;margin-left:-10px;border-radius:1px;background:#1a73e8;animation:gd-blink 1.1s step-end infinite}
.gads-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,3vw,32px)}
.gads-c{display:flex;flex-direction:column;padding:18px 18px 20px;border-radius:18px;background:rgba(255,255,255,.55);border:1px solid var(--rule)}
.gads-you{background:#fff;border-color:var(--ai-line);box-shadow:0 0 0 4px var(--ai-soft),var(--shadow-sm)}
.gads-k{margin-bottom:12px;font:500 10.5px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.gads-you .gads-k{color:var(--ai-ink)}
.gads-flow{display:flex;flex-direction:column}
.gads-most .gads-flow{filter:grayscale(.9) opacity(.6)}
.gads-ad{position:relative;overflow:hidden;padding:13px 15px 14px;border-radius:12px;background:#fff;border:1px solid #ECEAE4;box-shadow:0 10px 24px -16px rgba(18,24,41,.4)}
.gads-ad small{display:block;font-size:11.5px;color:#4d5156}
.gads-ad small b{color:#202124;font-weight:600}
.gads-h{display:block;margin-top:5px;font-size:16.5px;line-height:1.3;font-weight:500;color:#1a0dab}
.gads-d{display:block;margin-top:4px;font-size:13.5px;line-height:1.45;color:#4d5156}
.gads-rip{position:absolute;left:28%;top:56%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:rgba(26,13,171,.22);opacity:0;pointer-events:none}
.gads-to{display:grid;place-items:center;height:34px;color:var(--faint)}
.gads-to .ic{width:16px;height:16px;transform:rotate(90deg)}
.gads-land{padding:13px 15px 15px;border-radius:12px;background:#fff;border:1px solid #ECEAE4;box-shadow:0 10px 24px -16px rgba(18,24,41,.35)}
.gads-land small{display:block;font:500 10px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.gads-land b{display:block;margin:6px 0 10px;font-size:16px;line-height:1.3;font-weight:600;letter-spacing:-.012em;color:var(--ink)}
.gads-form i{display:block;height:10px;border-radius:5px;background:#EEECE6}
.gads-form i+i{width:64%;margin-top:7px}
.gads-sub{display:inline-block;margin-top:12px;padding:7px 16px;border-radius:8px;background:#C3C8D2;color:#fff;font-size:12.5px;font-weight:600}
.gads-tk small{color:var(--ai-ink)}
.gads-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:999px;background:var(--ink);color:#fff;font-size:13.5px;font-weight:600}
.gads-btn .ic{width:15px;height:15px}
.gads-x,.gads-ok{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;margin-top:16px;padding:7px 13px 7px 10px;border-radius:999px;font-size:14px;font-weight:600}
.gads-x{background:#FBE8E4;color:#A12F22}
.gads-ok{background:#E2F3E9;color:#17663D}
.gads-ok span{font-weight:500;color:#3B7D58}
.gads-x .ic,.gads-ok .ic{width:14px;height:14px}
.gads-pts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,36px);margin:36px auto 0}
.gads-pts li{display:flex;align-items:flex-start;gap:14px}
.gads-pts .ic{flex:none;width:42px;height:42px;padding:10px;border-radius:12px;background:#fff;border:1px solid var(--rule);color:var(--ai);box-shadow:var(--shadow-sm)}
.gads-pts p{font-size:15.5px;line-height:1.5;color:var(--muted)}
.gads-pts b{display:block;margin-bottom:2px;font-size:17px;font-weight:600;letter-spacing:-.012em;color:var(--ink)}
/* the play: typed search, both ads, the click, where each lands, then lost vs. won */
.go .gads-qt{animation:gd-type 1.25s steps(30,end) .2s both}
.go .gads-caret{animation:gd-in 0s linear 1.45s both,gd-blink 1.1s step-end 1.45s infinite}
.go .gads-ad{animation:gd-up .5s var(--ease) 1.55s both}
.go .gads-you .gads-ad{animation-delay:1.67s}
.go .gads-rip{animation:gd-rip .7s ease-out 2.3s forwards}
.go .gads-to,.go .gads-land{animation:gd-up .5s var(--ease) 2.7s both}
.go .gads-you .gads-to,.go .gads-you .gads-land{animation-delay:2.82s}
.go .gads-most .gads-flow{animation:gd-lost .9s ease 3.7s both}
.go .gads-x{animation:gd-pop .45s var(--ease) 3.85s both}
.go .gads-you{animation:gd-glow .8s var(--ease) 4.1s both}
.go .gads-ok{animation:gd-pop .45s var(--ease) 4.2s both}
@keyframes gd-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes gd-in{from{opacity:0}to{opacity:1}}
@keyframes gd-blink{50%{opacity:0}}
@keyframes gd-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes gd-rip{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(2)}}
@keyframes gd-lost{from{filter:none}to{filter:grayscale(.9) opacity(.6)}}
@keyframes gd-glow{from{background:rgba(255,255,255,.55);border-color:var(--rule);box-shadow:none}to{background:#fff;border-color:var(--ai-line);box-shadow:0 0 0 4px var(--ai-soft),var(--shadow-sm)}}
@keyframes gd-pop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.gads-caret{animation:none}}
@media (max-width:960px){.gads-pts{grid-template-columns:1fr;max-width:560px}}
/* phones: the two ads stay side by side, so the difference is one glance */
@media (max-width:620px){
  .gads-stage{padding:26px 12px 20px}
  .gads-ex{top:9px;right:10px}
  .gads-q{height:48px;margin-bottom:20px;padding:0 15px;gap:9px;font-size:14.5px}
  .gads-q .ic{width:17px;height:17px}
  .gads-caret{height:18px;margin-left:-7px}
  .gads-cols{gap:10px}
  .gads-c{padding:12px 10px 13px;border-radius:14px}
  .gads-k{margin-bottom:9px;font-size:9px;letter-spacing:.1em}
  .gads-ad{padding:10px 10px 11px}
  .gads-ad small{font-size:9.5px}
  .gads-h{font-size:13px}
  .gads-d,.gads-ok span{display:none}
  .gads-to{height:26px}
  .gads-land{padding:10px 10px 12px}
  .gads-land small{font-size:8.5px;letter-spacing:.04em}
  .gads-land b{font-size:13px;margin:5px 0 8px}
  .gads-sub{margin-top:9px;padding:5px 11px;font-size:11px}
  .gads-btn{padding:7px 11px;font-size:11.5px}
  .gads-btn .ic{display:none}
  .gads-c{padding:12px 8px 13px}
  .gads-x,.gads-ok{margin-top:12px;padding:6px 8px 6px 7px;gap:4px;border-radius:12px;font-size:11px}
}

/* header (2026-10-19): with "Video ads" and "Google Ads" both in the menu, labels never wrap, the gaps
   tighten on small laptops, and at 1000px and below the menu button takes over (it holds every link) */
.nav a,.nav-dd-btn,.hdr-login,.logo{white-space:nowrap}
@media (max-width:1280px){.nav{gap:22px}.hdr-in{gap:18px}}
@media (max-width:1000px){.nav{display:none}.menu-btn{display:inline-flex}.hdr-login{display:none}}
.gads-sec .h2 em{display:block}
@media (max-width:620px){.gads-btn{white-space:nowrap;font-size:11px;padding:7px 10px}}

/* How it works is now the film only (owner, 2026-10-19): no gap left over from the step cards */
#how .watch{margin-top:0}

/* industry icons on the film and Google Ads tabs (owner, 2026-10-19: "previous version has icons") */
.tab-ic{flex:none;width:28px;height:28px;margin-left:-8px;border-radius:50%;object-fit:contain}
.wt-tab:has(.tab-ic),.gads .hiw-tab{padding-left:16px}
@media (max-width:620px){.tab-ic{width:24px;height:24px;margin-left:-6px}}

/* the film heading sits under the section heading now: one size down (owner, 2026-10-19) */
.wt-head h3{margin-top:0;font-size:clamp(21px,2.1vw,28px)}
