/* Lorne & Vale v5. Monochrome system: black, white, Apple greys.
   Colour exists only as small status tints inside product windows. */

:root{
  --bg:#ffffff; --soft:#f5f5f7; --ink:#1d1d1f; --ink2:#6e6e73; --ink3:#86868b;
  --line:#d2d2d7; --line2:#e8e8ed;
  --dbg:#000000; --dsoft:#161617; --dcard:#1d1d1f; --dink:#f5f5f7; --dink2:#a1a1a6; --dink3:#6e6e73;
  --dline:#424245; --dline2:#2d2d2f;
  --hot:#e0402e; --warm:#d9930b; --good:#31a24c;
  --r-lg:28px; --r-md:18px; --r-sm:12px; --pill:980px;
  --shadow-lg:0 30px 80px rgba(0,0,0,.14), 0 4px 16px rgba(0,0,0,.06);
  --shadow-md:0 12px 40px rgba(0,0,0,.08);
  --dshadow:0 30px 80px rgba(0,0,0,.55);
  --wrap:clamp(1080px, 90vw, 1680px); --wrapN:720px;
  --ff:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --nav-h:52px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }
body{font-family:var(--ff);color:var(--ink);background:var(--bg);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:3px solid currentColor;outline-offset:3px;border-radius:4px}
::selection{background:#1d1d1f;color:#fff}
.skip{position:absolute;left:-9999px;top:0;background:#000;color:#fff;padding:10px 16px;z-index:99;border-radius:0 0 8px 0}
.skip:focus{left:0}

/* ---------- Layout ---------- */
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}
.wrap--n{max-width:var(--wrapN)}
.center{text-align:center}
.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-40{margin-top:40px}.mt-56{margin-top:56px}
.sec{padding:clamp(60px,10vw,128px) 0}
.sec--tight{padding:clamp(44px,7vw,84px) 0}
.pad-t0{padding-top:0}
.sec--soft{background:var(--soft)}
.sec-head{max-width:820px;margin:0 auto clamp(36px,5vw,64px);text-align:center}
.sec-head--left{margin-left:0;text-align:left}

/* Dark band: every component adapts inside .dk */
.dk{background:var(--dbg);color:var(--dink)}
.dk ::selection{background:#f5f5f7;color:#000}

/* ---------- Type ---------- */
.d1{font-size:clamp(2.9rem,7.4vw,5rem);line-height:1.03;letter-spacing:-.028em;font-weight:700}
.d2{font-size:clamp(2.1rem,4.8vw,3.4rem);line-height:1.06;letter-spacing:-.022em;font-weight:700}
.d3{font-size:clamp(1.45rem,2.8vw,1.9rem);line-height:1.15;letter-spacing:-.015em;font-weight:700}
.lead{font-size:clamp(1.15rem,2.2vw,1.4rem);line-height:1.4;color:var(--ink2);font-weight:500;letter-spacing:-.012em}
.dk .lead{color:var(--dink2)}
.eyebrow{display:block;font-size:14px;font-weight:600;color:var(--ink3);margin-bottom:16px;letter-spacing:.08em;text-transform:uppercase}
.dk .eyebrow{color:var(--dink2)}
.muted{color:var(--ink2)}.dk .muted{color:var(--dink2)}
.small{font-size:14px;color:var(--ink3);line-height:1.5}.dk .small{color:var(--dink3)}
.mono{font-family:var(--mono);font-size:.86em}
h3{font-size:19px;letter-spacing:-.01em;font-weight:600}
p+p{margin-top:10px}

/* Gradient display text. Use sparingly. */
.grad{background:linear-gradient(180deg,#fff 30%,#8b8b90 100%);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.16em}
.grad--ink{background:linear-gradient(180deg,#1d1d1f 40%,#77777c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.16em}

/* ---------- Nav (dark frosted, Apple-style) ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(0,0,0,.72);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
.nav__in{max-width:var(--wrap);margin:0 auto;padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right));height:var(--nav-h);display:flex;align-items:center;gap:28px}
.nav__brand{font-weight:600;font-size:17px;letter-spacing:-.01em;color:#f5f5f7}
.nav__links{display:flex;align-items:center;gap:26px;margin-left:auto}
.nav__links a{font-size:13.5px;color:rgba(245,245,247,.82);transition:color .2s}
.nav__links a:hover{color:#fff}
.nav__cta{background:#f5f5f7;color:#000 !important;border-radius:var(--pill);padding:6px 14px;font-weight:500}
.nav__cta:hover{background:#fff}
.nav__burger{display:none;position:relative;width:40px;height:40px;margin-left:auto}
.nav__burger span{position:absolute;left:10px;right:10px;height:1.5px;background:#f5f5f7;transition:transform .25s,opacity .2s}
.nav__burger span:nth-child(1){top:16px}.nav__burger span:nth-child(2){top:23px}
.is-open .nav__burger span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.is-open .nav__burger span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}
@media (max-width:840px){
  .nav__burger{display:block}
  .nav__links{display:none;position:fixed;top:var(--nav-h);right:0;left:0;height:calc(100dvh - var(--nav-h));background:rgba(0,0,0,.92);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);flex-direction:column;align-items:flex-start;padding:26px 22px 30px;gap:22px;border-bottom:1px solid var(--dline2);z-index:55;overflow-y:auto}
  .nav__links a{font-size:19px}
  .is-open .nav__links{display:flex}
}

/* ---------- Hero (black, full-bleed) ---------- */
.hero{background:var(--dbg);color:var(--dink);padding:calc(var(--nav-h) + clamp(64px,9vw,116px)) 0 clamp(64px,9vw,110px);position:relative;overflow:hidden;text-align:center}
.hero::before{content:"";position:absolute;inset:-40% -20% auto;height:80%;background:radial-gradient(60% 60% at 50% 0%,rgba(255,255,255,.10),rgba(255,255,255,0) 70%);pointer-events:none}
.hero>.wrap{position:relative}
.hero .lead{max-width:680px;margin:22px auto 0;color:var(--dink2)}
.hero--tool{padding-bottom:clamp(40px,6vw,64px)}
.cta-row{display:flex;gap:22px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:32px}

/* ---------- Buttons and links ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;background:#1d1d1f;color:#fff;border-radius:var(--pill);padding:13px 26px;font-size:17px;font-weight:500;transition:background .2s,transform .15s,color .2s}
.btn:hover{background:#000;transform:scale(1.015)}
.btn--lg{padding:16px 32px;font-size:19px}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn--ghost:hover{background:var(--ink);color:#fff}
.dk .btn,.btn--onDark{background:#f5f5f7;color:#000}
.dk .btn:hover,.btn--onDark:hover{background:#fff;color:#000}
.dk .btn--ghost{background:transparent;color:var(--dink);box-shadow:inset 0 0 0 1.5px rgba(245,245,247,.5)}
.dk .btn--ghost:hover{background:#f5f5f7;color:#000;box-shadow:inset 0 0 0 1.5px #f5f5f7}
.link{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:inherit;border-bottom:1px solid transparent;transition:border-color .2s}
.link:hover{border-bottom-color:currentColor}
.link svg{width:9px;height:14px;flex:none;transition:transform .2s}
.link:hover svg{transform:translateX(2px)}
p a,li a{border-bottom:1px solid var(--line);transition:border-color .2s}
p a:hover,li a:hover{border-bottom-color:var(--ink)}
.dk p a{border-bottom-color:var(--dline)}.dk p a:hover{border-bottom-color:var(--dink)}
.rule{width:44px;height:3px;background:currentColor;border-radius:2px;margin:0 auto 22px;opacity:.9}

/* ---------- Chips (status dots carry the only colour) ---------- */
.chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:var(--pill);padding:4px 12px;font-size:13px;font-weight:500;color:var(--ink);background:#fff;white-space:nowrap}
.chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ink3);flex:none}
.chip--plain::before{display:none}
.chip--fill{background:#1d1d1f;color:#fff;border-color:#1d1d1f}
.chip--fill::before{background:#fff}
.chip--hot::before{background:var(--hot)}
.chip--warm::before{background:var(--warm)}
.chip--good::before{background:var(--good)}
.dk .chip{background:rgba(255,255,255,.06);border-color:var(--dline);color:var(--dink)}
.dk .chip--fill{background:#f5f5f7;color:#000;border-color:#f5f5f7}
.dk .chip--fill::before{background:#000}

/* ---------- Product window ---------- */
.window{background:#fff;border:1px solid var(--line2);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden}
.window__bar{display:flex;align-items:center;gap:7px;padding:13px 18px;border-bottom:1px solid var(--line2);background:linear-gradient(180deg,#fafafa,#f5f5f7)}
.window__dot{width:11px;height:11px;border-radius:50%;background:#d2d2d7}
.window__title{margin-left:8px;font-size:13px;color:var(--ink3);font-weight:500;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.window__body{padding:clamp(20px,3vw,32px)}
.dk .window{background:var(--dcard);border-color:var(--dline2);box-shadow:var(--dshadow)}
.dk .window__bar{background:linear-gradient(180deg,#232326,#1d1d1f);border-bottom-color:var(--dline2)}
.dk .window__dot{background:#48484c}
.dk .window__title{color:var(--dink2)}

/* ---------- Brief (lead-brief table) ---------- */
.brief{background:#fff;border:1px solid var(--line2);border-radius:var(--r-md);overflow:hidden}
.brief__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:16px 18px;border-bottom:1px solid var(--line2);background:#fafafa;flex-wrap:wrap}
.brief__head b{font-size:15px;letter-spacing:-.01em}
.brief__rows{display:grid}
.brief__row{display:grid;grid-template-columns:132px 1fr;gap:14px;padding:12px 18px;border-bottom:1px solid var(--line2);font-size:15px}
.brief__row:last-child{border-bottom:0}
.brief__k{color:var(--ink3);font-weight:500}
.brief__v{min-height:1.4em;overflow-wrap:anywhere}
.brief.is-done{animation:briefIn .5s ease}
@keyframes briefIn{from{opacity:.35;transform:translateY(6px)}to{opacity:1;transform:none}}
.dk .brief{background:var(--dcard);border-color:var(--dline2)}
.dk .brief__head{background:#232326;border-bottom-color:var(--dline2)}
.dk .brief__row{border-bottom-color:var(--dline2)}
.dk .brief__k{color:var(--dink3)}
.typing::after{content:"";display:inline-block;width:1px;height:1em;background:currentColor;margin-left:2px;vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
@media (max-width:560px){.brief__row{grid-template-columns:1fr;gap:3px}}

/* ---------- Cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.cards--2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.card{background:#fff;border:1px solid var(--line2);border-radius:var(--r-md);padding:clamp(20px,3vw,28px);transition:transform .25s,box-shadow .25s}
.sec--soft .card{border-color:#e2e2e6}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.card h3{margin-bottom:6px}
.card p{font-size:15px;color:var(--ink2)}
.card p+p{margin-top:8px}
.dk .card{background:var(--dcard);border-color:var(--dline2)}
.card--hl{border-color:var(--ink);box-shadow:0 10px 34px rgba(0,0,0,.09)}
.dk .card--hl{border-color:#fff;box-shadow:0 10px 34px rgba(0,0,0,.4)}
.dk .card p{color:var(--dink2)}
.dk .card:hover{box-shadow:var(--dshadow)}

/* ---------- Bento ---------- */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.tile{background:#fff;border:1px solid #e5e5ea;border-radius:var(--r-lg);padding:clamp(22px,3vw,30px);display:flex;flex-direction:column;gap:8px;transition:transform .25s,box-shadow .25s}
.tile:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.tile--2{grid-column:span 2}.tile--3{grid-column:span 3}.tile--4{grid-column:span 4}
.tile p{font-size:15px;color:var(--ink2)}
.tile__art{margin-top:auto;padding-top:16px}
@media (max-width:900px){.tile--2,.tile--3,.tile--4{grid-column:span 3}}
@media (max-width:600px){.bento{grid-template-columns:1fr}.tile--2,.tile--3,.tile--4{grid-column:span 1}}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:28px;text-align:center}
.stats--6{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.stat b{display:block;font-size:clamp(2.2rem,5vw,3.2rem);font-weight:700;letter-spacing:-.025em;line-height:1.05}
.stat > span{display:block;margin-top:6px;font-size:14px;color:var(--ink2);max-width:230px;margin-left:auto;margin-right:auto}
.dk .stat > span{color:var(--dink2)}

/* ---------- Segmented control ---------- */
.seg{display:inline-flex;background:#e8e8ed;border-radius:var(--pill);padding:3px;gap:2px;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg button{border-radius:var(--pill);padding:7px 16px;font-size:14px;font-weight:500;color:var(--ink2);white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
.seg button.is-on{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.12)}
.dk .seg{background:rgba(255,255,255,.1)}
.dk .seg button{color:var(--dink2)}
.dk .seg button.is-on{background:#f5f5f7;color:#000}

/* ---------- Bars (report mix) ---------- */
.bar{height:8px;border-radius:6px;background:var(--line2);overflow:hidden}
.bar i{display:block;height:100%;border-radius:6px;background:#1d1d1f;width:0;transition:width .7s cubic-bezier(.3,.7,.3,1)}
.bar--hot i{background:var(--hot)}
.bar--warm i{background:var(--warm)}
.bar--cold i{background:#a9a9ae}
.rep__stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:16px;text-align:center}
.rep__stats .stat b{font-size:clamp(1.7rem,3.4vw,2.3rem)}
.rep__lbl{display:flex;justify-content:space-between;font-size:14px;color:var(--ink2)}
.rep__lbl b{color:var(--ink)}

/* ---------- Compare (cost bars) ---------- */
.cmp__bar{height:12px;border-radius:7px;background:var(--line2);overflow:hidden;margin-top:14px}
.cmp__bar i{display:block;height:100%;background:#1d1d1f;border-radius:7px;width:0;transition:width .8s cubic-bezier(.3,.7,.3,1)}
.cmp__cap{display:flex;justify-content:space-between;gap:10px;font-size:13.5px;color:var(--ink3);margin-top:8px}

/* ---------- Tables ---------- */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line2);border-radius:var(--r-md);background:#fff}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px}
.tbl th{text-align:left;font-weight:600;color:var(--ink3);font-size:13px;letter-spacing:.02em;padding:12px 14px;border-bottom:1px solid var(--line2);background:#fafafa}
.tbl td{padding:12px 14px;border-bottom:1px solid var(--line2)}
.tbl tr:last-child td{border-bottom:0}

/* ---------- FAQ ---------- */
.faq details{border-bottom:1px solid var(--line2)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 2px;font-weight:600;font-size:17px;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:12px;height:12px;flex:none;border-right:1.8px solid var(--ink3);border-bottom:1.8px solid var(--ink3);transform:rotate(45deg);transition:transform .25s;margin-right:4px}
.faq details[open] summary::after{transform:rotate(225deg) translate(-2px,-2px)}
.faq__a{padding:0 2px 22px;color:var(--ink2);max-width:640px}
.faq details.is-hide{display:none}
.dk .faq details{border-bottom-color:var(--dline2)}
.dk .faq__a{color:var(--dink2)}
.dk .faq summary::after{border-color:var(--dink2)}

/* ---------- Forms ---------- */
.field{margin-bottom:16px}
.field label{display:block;font-size:14px;font-weight:500;color:var(--ink2);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;font:inherit;font-size:16px;background:#fff;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(29,29,31,.12)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media (max-width:560px){.two-col{grid-template-columns:1fr}}
.check{display:flex;gap:10px;font-size:14px;color:var(--ink2);align-items:flex-start}
.check input{width:17px;height:17px;margin-top:2px;accent-color:#1d1d1f}
.dk .field label{color:var(--dink2)}
.dk .field input,.dk .field select,.dk .field textarea{background:var(--dcard);border-color:var(--dline);color:var(--dink)}
.dk .field input:focus,.dk .field select:focus,.dk .field textarea:focus{border-color:var(--dink);box-shadow:0 0 0 3px rgba(245,245,247,.15)}

/* ---------- Calculator sliders ---------- */
.calc__row{display:grid;grid-template-columns:1fr auto;gap:6px 16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--dline2)}
.calc__row:last-of-type{border-bottom:0}
.calc__row label{font-size:15px;color:var(--dink2)}
.calc__val{font-variant-numeric:tabular-nums;font-weight:600;font-size:17px;min-width:86px;text-align:right}
.calc__row input[type=range]{grid-column:1/-1;width:100%;accent-color:#f5f5f7;height:22px}
.light .calc__row{border-bottom-color:var(--line2)}
.light .calc__row label{color:var(--ink2)}
.light .calc__row input[type=range]{accent-color:#1d1d1f}
.calc__out{text-align:center;padding:clamp(22px,3.4vw,34px);border-radius:var(--r-md);background:rgba(255,255,255,.06);border:1px solid var(--dline2);margin-top:22px}
.calc__out b{font-size:clamp(2.5rem,6.4vw,3.8rem);font-weight:700;letter-spacing:-.025em;display:block;line-height:1.05;font-variant-numeric:tabular-nums}

/* ---------- Pipeline (scroll-driven, dark) ---------- */
.pipe__track{height:520vh;position:relative}
.pipe--flat .pipe__track{height:auto}
.pipe__stick{position:sticky;top:0;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:calc(var(--nav-h) + 24px) 0 40px;overflow:hidden}
.pipe--flat .pipe__stick{position:static;min-height:0;display:block;padding:clamp(72px,10vw,128px) 0}
.pipe__rail{position:relative;height:2px;background:var(--dline2);border-radius:2px;margin:clamp(30px,5vw,52px) 0 14px}
.pipe__rail i{position:absolute;inset:0 auto 0 0;width:0;background:#f5f5f7;border-radius:2px}
.pipe__node{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;background:var(--dline);transform:translate(-50%,-50%);transition:background .3s,box-shadow .3s}
.pipe__node.is-on{background:#f5f5f7;box-shadow:0 0 0 5px rgba(245,245,247,.18)}
.pipe__car{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);width:34px;height:24px;border-radius:7px;background:#f5f5f7;color:#000;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.5)}
.pipe__car svg{width:16px;height:16px}
.pipe__labels{display:flex;justify-content:space-between;font-size:12px;color:var(--dink3);letter-spacing:.02em}
.pipe__labels span{flex:1;text-align:center}
.pipe__labels span:first-child{text-align:left}
.pipe__labels span:last-child{text-align:right}
.pipe__stages{position:relative;min-height:220px;margin-top:clamp(22px,3.4vw,36px)}
.pipe__stage{position:absolute;inset:0;opacity:0;transform:translateY(18px);transition:opacity .45s,transform .45s;pointer-events:none;max-width:680px}
.pipe__stage.is-on{opacity:1;transform:none;pointer-events:auto}
.pipe--flat .pipe__stage{position:static;opacity:1;transform:none;margin-bottom:34px}
.pipe--flat .pipe__rail,.pipe--flat .pipe__car,.pipe--flat .pipe__dots{display:none}
.pipe__dots{display:flex;gap:8px;margin-top:clamp(20px,3vw,30px)}
.pipe__dots button{width:34px;height:34px;border-radius:50%;border:1px solid var(--dline);color:var(--dink2);font-size:13px;font-weight:600;transition:all .25s}
.pipe__dots button.is-on{background:#f5f5f7;color:#000;border-color:#f5f5f7}
@media (max-height:560px){.pipe__stages{min-height:260px}}

/* ---------- Speed to lead ---------- */
.s2l__grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(24px,4vw,44px);align-items:end}
@media (max-width:760px){.s2l__grid{grid-template-columns:1fr}}
.s2l__bars{display:flex;gap:clamp(10px,2vw,18px);align-items:flex-end;height:220px}
.s2l__bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;height:100%}
.s2l__bar i{display:block;background:var(--line);border-radius:10px 10px 4px 4px;transition:background .3s,transform .3s;transform-origin:bottom;transform:scaleY(0)}
.s2l.is-live .s2l__bar i{transform:scaleY(1)}
.s2l__bar:nth-child(1) i{transition-delay:.05s}.s2l__bar:nth-child(2) i{transition-delay:.15s}
.s2l__bar:nth-child(3) i{transition-delay:.25s}.s2l__bar:nth-child(4) i{transition-delay:.35s}
.s2l__bar i{transition:transform .6s cubic-bezier(.3,.7,.3,1),background .3s}
.s2l__bar.is-on i{background:#1d1d1f}
.s2l__bar span{font-size:13px;color:var(--ink3);text-align:center}
.s2l__bar.is-on span{color:var(--ink);font-weight:600}
.s2l__big{font-size:clamp(3rem,8vw,4.6rem);font-weight:700;letter-spacing:-.03em;line-height:1;display:block;margin-bottom:8px}
.s2l__big.is-bad{color:var(--hot)}

/* ---------- Timelines (7-day build, 60-day pilot) ---------- */
.tl{position:relative;padding-left:26px}
.tl::before{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:var(--dline2);border-radius:2px}
.tl__fill{position:absolute;left:6px;top:8px;width:2px;background:#f5f5f7;border-radius:2px;height:0;transition:height .5s ease}
.tl__item{position:relative;padding:0 0 26px 12px}
.tl__item:last-child{padding-bottom:0}
.tl__item::before{content:"";position:absolute;left:-26px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--dbg);border:2px solid var(--dline);transition:border-color .3s,background .3s;box-sizing:border-box}
.tl__item.is-on::before{background:#f5f5f7;border-color:#f5f5f7}
.tl__item b{display:block;font-size:16px;letter-spacing:-.01em}
.tl__item p{font-size:15px;color:var(--dink2);max-width:560px}
.tl__day{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dink3);display:block;margin-bottom:3px}
.light .tl::before{background:var(--line2)}
.light .tl__fill{background:#1d1d1f}
.light .tl__item::before{background:#fff;border-color:var(--line)}
.light .tl__item.is-on::before{background:#1d1d1f;border-color:#1d1d1f}
.light .tl__item p{color:var(--ink2)}
.light .tl__day{color:var(--ink3)}

/* ---------- Flow diagram (security) ---------- */
.flow{display:grid;gap:0;position:relative}
.flow__node{background:var(--dcard);border:1px solid var(--dline2);border-radius:var(--r-md);padding:18px 20px;position:relative;transition:border-color .3s,box-shadow .3s}
.flow__node.is-on{border-color:rgba(245,245,247,.55);box-shadow:0 0 0 4px rgba(245,245,247,.08)}
.flow__node b{display:block;font-size:16px;letter-spacing:-.01em}
.flow__node p{font-size:14px;color:var(--dink2);margin-top:3px}
.flow__node .small{margin-top:8px}
.flow__link{height:34px;width:2px;background:var(--dline2);margin:0 auto;position:relative;overflow:visible}
.flow__pulse{position:absolute;left:50%;top:0;width:8px;height:8px;border-radius:50%;background:#f5f5f7;transform:translate(-50%,-50%);opacity:0;box-shadow:0 0 12px rgba(245,245,247,.9)}
.flow.is-live .flow__pulse{animation:pulseDown 1.2s linear infinite}
@keyframes pulseDown{0%{top:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:100%;opacity:0}}
@media (prefers-reduced-motion: reduce){.flow.is-live .flow__pulse{animation:none;opacity:0}}

/* ---------- Checklist (founders) ---------- */
.cl{display:grid;grid-template-columns:1fr 1fr;gap:10px 26px}
@media (max-width:640px){.cl{grid-template-columns:1fr}}
.cl__item{display:flex;gap:11px;align-items:flex-start;font-size:15.5px;padding:9px 0;border-bottom:1px solid var(--line2)}
.cl__item svg{width:20px;height:20px;flex:none;margin-top:1px}
.cl__item circle{fill:none;stroke:var(--line);stroke-width:1.6}
.cl__item path{fill:none;stroke:#1d1d1f;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:14;stroke-dashoffset:14;transition:stroke-dashoffset .4s ease .1s}
.cl__item.is-on path{stroke-dashoffset:0}
.cl__item.is-on circle{stroke:#1d1d1f}

/* ---------- Demo processing steps ---------- */
.proc{display:grid;gap:9px;margin:4px 0}
.proc__step{display:flex;gap:10px;align-items:center;font-size:14.5px;color:var(--ink3);transition:color .25s}
.proc__step i{width:16px;height:16px;flex:none;border-radius:50%;border:1.6px solid var(--line);position:relative;transition:border-color .25s,background .25s}
.proc__step.is-run{color:var(--ink)}
.proc__step.is-run i{border-color:var(--ink)}
.proc__step.is-run i::after{content:"";position:absolute;inset:2.4px;border-radius:50%;border:1.8px solid transparent;border-top-color:var(--ink);animation:spin .7s linear infinite}
.proc__step.is-done{color:var(--ink)}
.proc__step.is-done i{background:#1d1d1f;border-color:#1d1d1f}
.proc__step.is-done i::after{content:"";position:absolute;left:4.4px;top:1.6px;width:4px;height:8px;border:solid #fff;border-width:0 1.8px 1.8px 0;transform:rotate(42deg)}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){.proc__step.is-run i::after{animation:none}}

/* ---------- Ack email preview ---------- */
.mail{font-size:15px}
.mail__meta{display:grid;gap:4px;padding-bottom:14px;border-bottom:1px solid var(--dline2);margin-bottom:14px;font-size:14px;color:var(--dink2)}
.mail__meta b{color:var(--dink)}
.mail p+p{margin-top:12px}
.mail .btnish{display:inline-block;background:#f5f5f7;color:#000;border-radius:var(--pill);padding:9px 18px;font-weight:500;font-size:14.5px;margin:6px 0}

/* ---------- Study step rail ---------- */
.study{display:grid;grid-template-columns:200px 1fr;gap:clamp(28px,5vw,60px)}
@media (max-width:860px){.study{grid-template-columns:1fr}.study__rail{display:none}}
.study__rail{position:sticky;top:calc(var(--nav-h) + 28px);align-self:start;display:grid;gap:2px}
.study__rail a{padding:9px 12px;border-left:2px solid var(--line2);font-size:14px;color:var(--ink3);transition:color .2s,border-color .2s}
.study__rail a.is-on{color:var(--ink);border-left-color:var(--ink);font-weight:600}

/* ---------- Avatars ---------- */
.avatar{width:76px;height:76px;border-radius:50%;object-fit:cover}
.avatar--txt{display:flex;align-items:center;justify-content:center;background:#1d1d1f;color:#fff;font-weight:700;font-size:22px;letter-spacing:.01em;filter:none}

/* ---------- Pricing ---------- */
.plist{list-style:none;margin-top:20px;display:grid;gap:11px}
.plist li{display:flex;gap:10px;font-size:15.5px;align-items:flex-start}
.plist li::before{content:"";width:16px;height:16px;flex:none;margin-top:3px;background:#1d1d1f;border-radius:50%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.4 2.4 4.6-5' stroke='%23fff' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.price__num{font-size:clamp(2.6rem,6vw,3.6rem);font-weight:700;letter-spacing:-.025em}

/* ---------- Spec / try grids ---------- */
.spec__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,32px)}
@media (max-width:820px){.spec__grid{grid-template-columns:1fr}}
.try__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3.4vw,36px);align-items:start}
@media (max-width:860px){.try__grid{grid-template-columns:1fr}}

/* ---------- Reveal ----------
   Hiding is gated on html.js, set inline in <head>. If JavaScript fails to
   load or run, every .rv stays visible: the animation is decoration, never
   a dependency. Print always shows everything. */
html.js .rv{opacity:0;transform:translateY(26px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)}
html.js .rv.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){html.js .rv{opacity:1;transform:none;transition:none}}
@media print{.rv,.mrow,.osr{opacity:1!important;transform:none!important}}

/* ---------- Footer (dark) ---------- */
.foot{background:var(--dbg);color:var(--dink2);border-top:1px solid var(--dline2);padding:clamp(44px,6vw,64px) 0 34px}
.foot__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:30px;margin-bottom:34px}
.foot__cols b{display:block;color:var(--dink);font-size:14px;margin-bottom:12px}
.foot__cols a{display:block;font-size:14px;color:var(--dink2);padding:4px 0;transition:color .2s}
.foot__cols a:hover{color:var(--dink)}
.foot__legal{font-size:12.5px;color:var(--dink3);border-top:1px solid var(--dline2);padding-top:22px;line-height:1.6}

/* Pipe section: sticky track manages its own vertical space */
.pipe{padding:0}

/* ---------- v5.1 additions ---------- */

/* Stats band: hairline dividers on desktop */
@media (min-width:760px){
  .stats--rule .stat + .stat{border-left:1px solid var(--line2)}
  .dk .stats--rule .stat + .stat{border-left-color:var(--dline2)}
}

/* Light window forced inside dark bands (Apple app-window-on-black) */
.dk .window.lite{background:#fff;border-color:rgba(255,255,255,.14);box-shadow:0 50px 120px rgba(0,0,0,.65);color:var(--ink)}
.dk .window.lite .window__bar{background:linear-gradient(180deg,#fafafa,#f5f5f7);border-bottom-color:var(--line2)}
.dk .window.lite .window__dot{background:#d2d2d7}
.dk .window.lite .window__title{color:var(--ink3)}
.dk .lite .muted{color:var(--ink2)}
.dk .lite .small{color:var(--ink3)}
.dk .lite .chip,.dk .os .chip{background:#fff;border-color:var(--line);color:var(--ink)}
.dk .lite .chip--fill,.dk .os .chip--fill{background:#1d1d1f;color:#fff;border-color:#1d1d1f}
.dk .lite .chip--fill::before,.dk .os .chip--fill::before{background:#fff}
.dk .lite .brief{background:#fff;border-color:var(--line2)}
.dk .lite .brief__head{background:#fafafa;border-bottom-color:var(--line2)}
.dk .lite .brief__row{border-bottom-color:var(--line2)}
.dk .lite .brief__k{color:var(--ink3)}

/* Analysis email */
.mailx{font-size:15px;text-align:left}
.mailx__meta{display:grid;gap:3px;font-size:13.5px;color:var(--ink3);padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid var(--line2)}
.mailx__meta b{color:var(--ink);font-weight:500}
.mailx__sub{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:14px}
.mailx__sub b{font-size:16.5px;letter-spacing:-.012em;line-height:1.3;min-height:1.3em}
.mrow{opacity:0;transform:translateY(7px);transition:opacity .45s ease,transform .45s ease}
.mailx.is-run .mrow{opacity:1;transform:none}
.mailx.is-run .mrow:nth-child(1){transition-delay:.05s}
.mailx.is-run .mrow:nth-child(2){transition-delay:.16s}
.mailx.is-run .mrow:nth-child(3){transition-delay:.27s}
.mailx.is-run .mrow:nth-child(4){transition-delay:.38s}
.mailx.is-run .mrow:nth-child(5){transition-delay:.49s}
.mailx.is-run .mrow:nth-child(6){transition-delay:.6s}
@media (prefers-reduced-motion: reduce){.mrow{opacity:1;transform:none;transition:none}}
.mailx__lbl{display:block;font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);margin-bottom:4px}
.mailx .mrow{padding:11px 0;border-bottom:1px solid var(--line2)}
.mailx .mrow:last-of-type{border-bottom:0}
.mailx__wait{display:flex;align-items:center;gap:9px;color:var(--ink3);font-size:14px;padding:8px 0 2px}
.mailx__wait i{width:14px;height:14px;flex:none;border-radius:50%;border:1.8px solid var(--line);border-top-color:var(--ink2);animation:spin .7s linear infinite}
@media (prefers-reduced-motion: reduce){.mailx__wait i{animation:none}}
.mailx__foot{font-size:12.5px;color:var(--ink3);padding-top:12px;line-height:1.5}

/* Glyph icons */
.gly{display:inline-block;width:28px;height:28px;color:var(--ink);margin-bottom:12px}
.gly svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.dk .gly{color:var(--dink)}

/* Guarantee certificate card */
.gcard{max-width:560px;margin:0 auto;background:linear-gradient(155deg,#232326 0%,#0a0a0b 55%,#000 100%);color:#f5f5f7;border:1px solid #2d2d2f;border-radius:24px;padding:clamp(28px,4.5vw,42px);position:relative;overflow:hidden;box-shadow:0 40px 110px rgba(0,0,0,.35);transition:transform .35s ease,box-shadow .35s ease;text-align:left}
.gcard::after{content:"";position:absolute;top:-60%;left:-30%;width:70%;height:220%;background:linear-gradient(75deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.07) 50%,rgba(255,255,255,0) 100%);transform:rotate(8deg);transition:transform .8s ease}
.gcard:hover{transform:translateY(-5px);box-shadow:0 55px 130px rgba(0,0,0,.45)}
.gcard:hover::after{transform:rotate(8deg) translateX(60%)}
.gcard__brand{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#8b8b90}
.gcard__title{font-size:clamp(1.7rem,3.4vw,2.2rem);font-weight:700;letter-spacing:-.02em;margin:10px 0 22px}
.gcard__row{display:grid;grid-template-columns:minmax(110px,max-content) 1fr;gap:16px;padding:13px 0;border-top:1px solid #2d2d2f;font-size:15px}
.gcard__row span:first-child{color:#8b8b90;font-size:13px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding-top:1px}
.gcard__num{font-variant-numeric:tabular-nums;font-weight:700}
@media (max-width:480px){.gcard__row{grid-template-columns:1fr;gap:3px}}

/* Underline that draws itself */
.uline{position:relative;display:inline-block}
.uline::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:4px;border-radius:3px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.3,.7,.2,1) .2s}
.is-in .uline::after,.uline.is-in::after{transform:scaleX(1)}
@media (prefers-reduced-motion: reduce){.uline::after{transform:scaleX(1);transition:none}}

/* Founder editorial rows */
.frs{display:grid;gap:clamp(44px,7vw,84px)}
.fr{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:clamp(24px,4.5vw,56px);align-items:center}
.fr--flip{grid-template-columns:1fr minmax(220px,300px)}
.fr--flip .fr__photo{order:2}
.fr__photo{aspect-ratio:4/5;width:100%;border-radius:28px;overflow:hidden;background:var(--soft);box-shadow:var(--shadow-md)}
.fr__photo img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.6,.2,1)}
.fr:hover .fr__photo img{transform:scale(1.03)}
.fr h3{font-size:clamp(1.7rem,3.4vw,2.3rem);letter-spacing:-.022em;font-weight:700}
.fr__role{display:block;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin-bottom:8px}
.fr__edu{font-size:14px;color:var(--ink3);margin-top:2px}
.fr__label{display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin-top:22px;margin-bottom:9px}
.fr__owns{display:flex;gap:7px;flex-wrap:wrap}
@media (max-width:720px){
  .fr,.fr--flip{grid-template-columns:1fr}
  .fr--flip .fr__photo{order:0}
  .fr__photo{max-width:340px}
}

/* ---------- v5.2 mobile refinements ---------- */
@media (max-width:520px){
  .pipe__stages{min-height:340px}
  .pipe__labels{font-size:10.5px}
  .window__body{padding:18px}
  .gcard__title{font-size:1.55rem}
  .fr__photo{max-width:420px}
  .frs{gap:52px}
  .btn--lg{padding:15px 26px;font-size:17px}
  .cta-row{gap:16px}
}
@media (pointer:coarse){
  .seg button{padding:9px 17px}
  .s2l__bars{height:190px}
}

/* ---------- v5.3 channels section ---------- */
.em{display:flex;gap:13px;align-items:flex-start}
.em__av{width:40px;height:40px;border-radius:50%;background:#1d1d1f;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex:none}
.em__body{min-width:0;flex:1}
.em__top{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.em__top b{font-size:15px}
.em__time{font-size:12.5px;color:var(--ink3);flex:none}
.em__sub{font-weight:600;font-size:14.5px;margin-top:2px}
.em__prev{font-size:14px;color:var(--ink2);margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.em__dot{width:9px;height:9px;border-radius:50%;background:#0a84ff;flex:none;margin-top:15px}

.call__row{display:flex;gap:13px;align-items:center}
.call__ic{width:40px;height:40px;border-radius:50%;background:var(--soft);display:flex;align-items:center;justify-content:center;flex:none}
.call__ic svg{width:19px;height:19px;stroke:var(--hot);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.call__row b{font-size:16px;display:block}
.call__row .small{margin-top:1px}
.call__miss{color:var(--hot);font-size:13px;font-weight:600}
.chan__fu{opacity:0;transform:translateY(9px);margin-top:16px;background:var(--soft);border-radius:var(--r-md);padding:14px 16px;font-size:14.5px;display:flex;gap:11px;align-items:flex-start}
.chan__fu.is-go{animation:fuIn .55s ease .85s forwards}
@keyframes fuIn{to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.chan__fu{opacity:1;transform:none}.chan__fu.is-go{animation:none}}
.chan__fu .gly{width:20px;height:20px;margin:1px 0 0;flex:none}

.stepl{list-style:none;display:grid;gap:16px}
.stepl li{display:flex;gap:13px;font-size:15px;align-items:flex-start}
.stepl li span:first-child{width:24px;height:24px;border-radius:50%;background:#1d1d1f;color:#fff;font-size:12.5px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px}
.dk .stepl li span:first-child{background:var(--dink);color:#000}

/* ---------- v5.5 whole-site phone adaptation ---------- */

/* Anchored sections must clear the fixed nav when jumped to */
[id]{scroll-margin-top:calc(var(--nav-h) + 14px)}

/* Touch feel: no grey flash, tactile press states */
html{-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.97)}
.seg button:active{opacity:.75}
.pipe__dots button:active{transform:scale(.92)}
.s2l__bar:active i{opacity:.75}

@media (max-width:520px){
  /* Compact scroll pipeline so the sticky frame fits small viewports */
  .pipe .d2{font-size:1.9rem}
  .pipe__stick{padding:calc(var(--nav-h) + 16px) 0 22px}
  .pipe__rail{margin:22px 0 12px}
  .pipe__stages{min-height:250px;margin-top:18px}
  .pipe__dots{margin-top:14px}
  .pipe__dots button{width:38px;height:38px}
  .pipe__stage .lead{font-size:1.08rem}

  /* Lighter shadows: calmer scrolling, less repaint cost */
  .window{box-shadow:var(--shadow-md)}
  .dk .window{box-shadow:0 18px 48px rgba(0,0,0,.5)}
  .dk .window.lite{box-shadow:0 22px 56px rgba(0,0,0,.55)}
  .gcard{box-shadow:0 22px 60px rgba(0,0,0,.3)}

  /* Tighter vertical rhythm on small screens */
  .hero .mt-56{margin-top:38px}
  .sec-head{margin-bottom:34px}
  .mt-56{margin-top:44px}
  .d2{letter-spacing:-.018em}
  .stats{gap:22px}
  .cards,.bento{gap:13px}
  .rep__stats{grid-template-columns:repeat(3,1fr)}
  .foot__cols{gap:24px}
}

@media (max-width:380px){
  .d1{font-size:2.55rem}
  .chip{font-size:12.5px;padding:4px 10px}
  .calc__val{min-width:74px;font-size:16px}
}

/* ---------- v5.6 accent system: colour lives only in visuals ---------- */
:root{--acc1:#0a84ff;--acc2:#5e5ce6;--accg:linear-gradient(90deg,#0a84ff,#5e5ce6)}

/* Pipeline */
.pipe__rail i{background:var(--accg)}
.pipe__node.is-on{background:var(--acc1);box-shadow:0 0 0 5px rgba(10,132,255,.22)}

/* Timelines */
.tl__fill{background:linear-gradient(180deg,var(--acc1),var(--acc2))}
.tl__item.is-on::before{background:var(--acc1);border-color:var(--acc1)}
.light .tl__fill{background:linear-gradient(180deg,var(--acc1),var(--acc2))}
.light .tl__item.is-on::before{background:var(--acc1);border-color:var(--acc1)}

/* Speed to lead: tone carried by the bars, text stays ink */
.s2l__big,.s2l__big.is-bad,.s2l__big.is-ok{color:var(--ink)}
.s2l__bar.is-on i{background:linear-gradient(180deg,var(--acc1),var(--acc2))}
.s2l.is-bad .s2l__bar.is-on i{background:linear-gradient(180deg,#ff453a,#ff375f)}

/* Calculator output: gradient hairline, numbers stay text-coloured */
.calc__out{position:relative;overflow:hidden}
.calc__out::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accg)}
.calc__out--light{position:relative;overflow:hidden}
.calc__out--light::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accg)}

/* Drawn underline */
.uline::after{background:var(--accg)}

/* Security flow */
.flow__pulse{background:var(--acc1);box-shadow:0 0 14px rgba(10,132,255,.9)}
.flow__node.is-on{border-color:rgba(10,132,255,.65);box-shadow:0 0 0 4px rgba(10,132,255,.12)}

/* Checklist ticks */
.cl__item path{stroke:var(--acc1)}
.cl__item.is-on circle{stroke:var(--acc1)}

/* Processing steps */
.proc__step.is-run i{border-color:var(--line)}
.proc__step.is-run i::after{border-top-color:var(--acc1)}
.proc__step.is-done i{background:var(--acc1);border-color:var(--acc1)}
.mailx__wait i{border-top-color:var(--acc1)}

/* Compare: our option's bar carries the accent */
.cmp__bar--acc i{background:var(--accg)}

/* ---------- v5.6 channel interactives ---------- */
.chan{position:relative}

/* Form: rows type on, then the send button confirms */
.anim-form .brief__row{opacity:0;transform:translateY(7px);transition:opacity .4s ease,transform .4s ease}
.anim-form.play .brief__row{opacity:1;transform:none}
.anim-form.play .brief__row:nth-child(1){transition-delay:.1s}
.anim-form.play .brief__row:nth-child(2){transition-delay:.32s}
.anim-form.play .brief__row:nth-child(3){transition-delay:.54s}
.anim-form.play .brief__row:nth-child(4){transition-delay:.76s}
.sendbtn{margin-top:16px;background:#1d1d1f;color:#fff;border-radius:var(--pill);padding:12px 22px;text-align:center;font-weight:500;font-size:15.5px;opacity:0;transform:translateY(7px);transition:opacity .4s ease 1.1s,transform .4s ease 1.1s,background .3s}
.anim-form.play .sendbtn{opacity:1;transform:none}
.sendbtn .s2{display:none}
.anim-form.is-sent .sendbtn{background:var(--acc1)}
.anim-form.is-sent .sendbtn .s1{display:none}
.anim-form.is-sent .sendbtn .s2{display:inline-flex;align-items:center;gap:8px;justify-content:center}
.sendbtn .s2 svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* Email: slides in unread, then reads itself */
.anim-email .em{opacity:0;transform:translateX(-12px);transition:opacity .5s ease .15s,transform .5s ease .15s}
.anim-email.play .em{opacity:1;transform:none}
.anim-email .em__dot{animation:none}
.anim-email.play .em__dot{animation:dotPulse 1.1s ease-in-out infinite .6s}
@keyframes dotPulse{0%,100%{box-shadow:0 0 0 0 rgba(10,132,255,.45)}50%{box-shadow:0 0 0 6px rgba(10,132,255,0)}}
.anim-email.is-read .em__dot{animation:none;opacity:.22}
.readchip{opacity:0;transform:translateY(7px);transition:opacity .45s ease,transform .45s ease;margin-top:16px}
.anim-email.is-read .readchip{opacity:1;transform:none}

/* Phone: rings, misses, recovers */
.anim-phone .call__ic{transform-origin:50% 40%}
.anim-phone.play .call__ic{animation:ring .9s ease}
@keyframes ring{0%,100%{transform:rotate(0)}15%{transform:rotate(-14deg)}30%{transform:rotate(12deg)}45%{transform:rotate(-9deg)}60%{transform:rotate(7deg)}75%{transform:rotate(-4deg)}}
.anim-phone .call__miss{opacity:0;transition:opacity .35s ease .85s}
.anim-phone.play .call__miss{opacity:1}
.anim-phone .chan__fu{opacity:0;transform:translateY(9px)}
.anim-phone.play .chan__fu{animation:fuIn .55s ease 1.5s forwards}
.anim-phone .late{opacity:0}
.anim-phone.play .late{animation:fuIn .45s ease 2.15s forwards}
.chan__fu .gly{color:var(--acc1)}

@media (prefers-reduced-motion: reduce){
  .anim-form .brief__row,.sendbtn,.anim-email .em,.readchip,.anim-phone .call__miss,.anim-phone .chan__fu,.anim-phone .late{opacity:1;transform:none;transition:none;animation:none}
  .anim-email.play .em__dot,.anim-phone.play .call__ic{animation:none}
}

/* ---------- v5.7 overflow repair (root cause) ---------- */
/* Grid/flex items default to min-width:auto; wide children (560px table,
   long monospace strings) were forcing the page wider than the viewport. */
body{overflow-x:clip}
.bento > .tile,.try__grid > *,.spec__grid > *,.s2l__grid > *,.study > *,.fr > *,
.cards > .card,.window,.window__body,.em__body{min-width:0}
.mailx__sub b,.em__sub,.brief__head b{overflow-wrap:anywhere}

/* ---------- v5.7 conversion: persistent mobile CTA ---------- */
.mcta{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;padding:10px max(16px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-right));background:rgba(0,0,0,.78);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);transform:translateY(110%);transition:transform .35s cubic-bezier(.3,.7,.3,1)}
.mcta.is-show{transform:none}
.mcta .btn{width:100%;justify-content:center;background:#f5f5f7;color:#000}
@media (max-width:840px){.mcta{display:block}}
@media (prefers-reduced-motion: reduce){.mcta{transition:none}}

/* ---------- v5.8 doors triptych (homepage) ---------- */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:760px){.doors{grid-template-columns:1fr}}
.door{position:relative;display:flex;flex-direction:column;gap:10px;background:rgba(255,255,255,.045);border:1px solid var(--dline2);border-radius:var(--r-lg);padding:clamp(22px,3vw,30px);overflow:hidden;transition:transform .3s ease,border-color .3s ease,background .3s ease}
.door::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accg)}
.door:hover{transform:translateY(-4px);border-color:#5a5a5e;background:rgba(255,255,255,.07)}
.door__ic{width:34px;height:34px;color:var(--dink);display:inline-block}
.door__ic svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.door h3{font-size:20px;letter-spacing:-.014em}
.door p{font-size:15px;color:var(--dink2)}
.door .link{margin-top:auto;padding-top:14px;font-size:14.5px}
.door__viz{display:flex;align-items:center;gap:8px;min-height:14px;margin-top:4px}
.door__lines{display:grid;gap:6px;width:100%}
.door__lines i{display:block;height:6px;border-radius:4px;background:rgba(255,255,255,.14);width:0;transition:width .7s ease}
.door__lines i:first-child{background:var(--accg)}
.doors.play .door__lines i:nth-child(1){width:88%;transition-delay:.15s}
.doors.play .door__lines i:nth-child(2){width:64%;transition-delay:.4s}
.doors.play .door__lines i:nth-child(3){width:42%;transition-delay:.65s}
.door__dot{width:10px;height:10px;border-radius:50%;background:var(--acc1);flex:none}
.doors.play .door__dot{animation:dotPulse 1.1s ease-in-out .45s 3}
.doors.play .door__ic--ring{animation:ring .9s ease .35s;transform-origin:50% 40%}
@media (prefers-reduced-motion: reduce){
  .door__lines i,.doors.play .door__lines i{transition:none}
  .door__lines i:nth-child(1){width:88%}.door__lines i:nth-child(2){width:64%}.door__lines i:nth-child(3){width:42%}
  .doors.play .door__dot,.doors.play .door__ic--ring{animation:none}
}

/* ---------- v5.9 trust pages ---------- */
.pav{width:96px;height:96px;border-radius:22px;object-fit:cover;flex:none;box-shadow:var(--shadow-md)}
.lin{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:500;color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:1px;transition:border-color .2s}
.lin:hover{border-bottom-color:var(--ink)}
.lin svg{width:15px;height:15px;flex:none}
.dk .lin{color:var(--dink);border-bottom-color:var(--dline)}
.dk .lin:hover{border-bottom-color:var(--dink)}
@media (max-width:420px){.pav{width:80px;height:80px;border-radius:18px}}

/* ---------- v6.0 trust and destinations ---------- */
.gcard__sub{color:#8b8b90;font-size:15px;margin:-14px 0 22px}

/* Flow node control chips */
.flow__node .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.flow__node .chip{font-size:12px;padding:3px 10px}

/* Sees / never-sees on dark */
.dk .cl__item{border-bottom-color:var(--dline2)}
.dk .cl__item circle{stroke:var(--dline)}
.dk .cl__item.is-on circle{stroke:var(--acc1)}
.cl--x .cl__item path{stroke:#ff6961}
.cl--x .cl__item.is-on circle{stroke:#ff6961}
.cl--solo{grid-template-columns:1fr}

/* Live tracker mock */
.anim-track .trk{opacity:0;transform:translateY(7px);transition:opacity .4s ease,transform .4s ease}
.anim-track.play .trk{opacity:1;transform:none}
.anim-track.play .trk:nth-of-type(1){transition-delay:.1s}
.anim-track.play .trk:nth-of-type(2){transition-delay:.3s}
.anim-track.play .trk:nth-of-type(3){transition-delay:.5s}
.anim-track.play .trk:nth-of-type(4){transition-delay:.7s}
.swap .s2{display:none}
.anim-track.is-flag .swap .s1{display:none}
.anim-track.is-flag .swap .s2{display:inline-flex}
@media (prefers-reduced-motion: reduce){.anim-track .trk{opacity:1;transform:none;transition:none}}

/* ---------- v6.2 split hero: the complete first view ---------- */
.hero--split{text-align:left;padding:calc(var(--nav-h) + clamp(36px,5vw,64px)) 0 clamp(44px,6vw,72px)}
@media (min-width:1000px){
  .hero--split{min-height:100svh;display:flex;align-items:center}
  .hero__grid{display:grid;grid-template-columns:1.02fr 1fr;gap:clamp(32px,4.5vw,64px);align-items:center;width:100%}
  .hero--split .d1{font-size:clamp(2.7rem,4.6vw,4.3rem)}
  .hero--split .lead{margin-left:0;font-size:clamp(1.1rem,1.5vw,1.3rem)}
  .hero--split .cta-row{justify-content:flex-start}
  .hero--split .hero__chips{justify-content:flex-start !important}
  .hero--split .hero__note{text-align:left}
}
.hero__stage .seg{margin-bottom:18px}
.stagewrap{position:relative}
.stage__enq{position:relative;z-index:2;width:min(340px,86%);margin-bottom:-34px;margin-left:0}
.stage__brief{position:relative;z-index:1;margin-left:auto;width:min(560px,100%)}
@media (min-width:1000px){
  .stage__enq{position:absolute;top:-26px;left:84px;margin:0}
  .stage__brief{margin-left:44px}
  .hero__stage .mailx{font-size:14px}
  .hero__stage .mailx .mrow{padding:9px 0}
  .hero__stage .mailx__foot{padding-top:10px}
}
.stage__enq .brief__row{grid-template-columns:88px 1fr;padding:8px 12px;font-size:13px}
.stage__enq .window__body{padding:14px}
.stage__enq .window__bar{padding:9px 14px}
@media (max-width:999px){
  .hero--split{text-align:center}
  .hero--split .hero__copy .lead{margin-left:auto;margin-right:auto}
  .hero__stage{margin-top:44px}
  .hero__stage .seg-row{display:flex;justify-content:center}
  .stage__enq{width:100%;margin-bottom:16px}
}
@media (min-width:1000px){.hero__stage .seg-row{display:flex;justify-content:flex-end}}

/* ---------- hero overlay correction: keep system intact, anchor enquiry to the right ---------- */
@media (min-width:1000px){
  .hero__stage{position:relative;justify-self:end;width:min(590px,100%);}
  .stagewrap{position:relative;min-height:650px;}
  .stage__brief{width:min(520px,100%);margin-left:0;margin-right:auto;}
  .stage__enq{
    position:absolute;
    top:-28px;
    left:auto;
    right:-18px;
    width:min(340px,64%);
    margin:0;
    z-index:3;
  }
  .hero__stage .seg-row{justify-content:flex-end;padding-right:24px;}
}
@media (min-width:1280px){
  .stage__enq{right:-42px;}
  .hero__stage .seg-row{padding-right:0;}
}

/* ---------- hero stage: size correctly from first paint, no JS needed ----------
   Previously home.js measured all five example states in a hidden clone and
   set a JS-computed min-height once it finished loading (lockStage()). That
   left a window between first paint and script execution where the cards
   sat at their natural, near-empty height, then visibly grew or shrank the
   moment the script caught up or the viewport was resized.
   This replaces that entirely. Every example's full content is now rendered
   statically inside .brief__stack / .mailx__stack, stacked in the same grid
   cell via grid-area:1/1. The browser sizes that cell to the tallest child
   the instant CSS is parsed, before any script runs, and it re-measures
   automatically on every resize because it is real layout, not a cached
   number. The four hidden copies (data-ballast) are invisible and inert;
   only the fifth, unmarked one carries the live ids home.js writes into. */
.brief__stack,.mailx__stack{display:grid}
.brief__stack > *,.mailx__stack > *{grid-area:1/1;min-width:0}
.brief__stack > [data-ballast],.mailx__stack > [data-ballast]{visibility:hidden;pointer-events:none;user-select:none}

@media (min-width:1500px){
  .stage__enq{right:-58px;}
}

/* ---------- final hero overlay placement: pull enquiry further right so the brief remains readable ---------- */
@media (min-width:1000px){
  .hero__stage{overflow:visible;}
  .stagewrap{overflow:visible;}
  .stage__enq{
    top:-28px;
    right:-78px;
    width:320px;
  }
}
@media (min-width:1280px){
  .stage__enq{right:-168px;width:330px;}
}
@media (min-width:1500px){
  .stage__enq{right:-208px;width:330px;}
}
@media (min-width:1000px) and (max-width:1180px){
  .stage__enq{right:-42px;width:300px;}
}

/* ---------- v6.3 hero enquiry placement: clear tabs and keep brief readable ---------- */
@media (min-width:1000px){
  .hero__stage{overflow:visible;}
  .stagewrap{overflow:visible;}
  .stage__enq{
    top:30px;
    right:-126px;
    width:300px;
    z-index:3;
  }
}
@media (min-width:1181px){
  .stage__enq{
    top:34px;
    right:-190px;
    width:320px;
  }
}
@media (min-width:1500px){
  .stage__enq{
    top:38px;
    right:-250px;
    width:320px;
  }
}
@media (min-width:1800px){
  .stage__enq{
    right:-280px;
  }
}

/* ========== Pricing comparison + Boundaries polish ========== */
/* Comparison cards: shared structure, cost read pinned to a common baseline */
.cmp-grid{grid-template-columns:repeat(auto-fit,minmax(234px,1fr))}
.cmp-grid > .card{display:flex;flex-direction:column;position:relative;border-color:var(--line);border-radius:var(--r-lg);padding:clamp(22px,3vw,30px)}
.cmp__foot{margin-top:auto;padding-top:20px;border-top:1px solid var(--line2)}
.cmp-grid .cmp__bar{height:8px;border-radius:6px;margin-top:0}
.cmp-grid .cmp__bar i{border-radius:6px;min-width:8px}
.cmp-grid .cmp__cap{margin-top:14px;gap:12px;font-size:13px;line-height:1.4;min-height:57px;align-items:flex-start}
.cmp-grid .cmp__cap span{flex:1 1 0;min-width:0}
.cmp-grid .cmp__cap span:first-child{color:var(--ink);font-weight:600}
.cmp-grid .cmp__cap span:last-child{text-align:right}
.cmp-grid > .card--hl{border:1.5px solid var(--acc1);background:linear-gradient(180deg,rgba(10,132,255,.05),rgba(255,255,255,0) 62%);box-shadow:0 18px 46px rgba(10,132,255,.13),0 4px 14px rgba(0,0,0,.05)}
.cmp-grid > .card--hl:hover{box-shadow:0 22px 54px rgba(10,132,255,.18),0 6px 18px rgba(0,0,0,.06)}

/* Boundaries: defined cards, glyphs, centred final row */
.bd-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
.bd-grid > .card{flex:1 1 300px;max-width:360px;border-color:var(--line);border-radius:var(--r-lg);padding:clamp(22px,3vw,28px)}
.bd-grid .gly{margin-bottom:14px}

/* Founders strip (home, guarantee section) */
.fstrip{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:18px}
.fstrip__p{display:flex;align-items:center;gap:12px;padding:10px 18px 10px 10px;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:inherit;background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s}
.fstrip__p:hover{border-color:var(--ink);box-shadow:var(--shadow-md);transform:translateY(-1px)}
.fstrip__p img{width:44px;height:44px;border-radius:12px;object-fit:cover;flex:none}
.fstrip__p span{display:flex;flex-direction:column;text-align:left;line-height:1.3}
.fstrip__p b{font-size:15px;letter-spacing:-.01em}
.fstrip__p i{font-style:normal;font-size:13px;color:var(--ink3)}

/* ---------- v7 platform explorer ----------
   The platform page and the home teaser share one component family.
   Colour stays inside product windows, as everywhere else on the site. */

/* App frame: light product window on black, sidebar + screen */
.os{background:#fff;color:var(--ink);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-lg);box-shadow:0 50px 120px rgba(0,0,0,.65);overflow:hidden;text-align:left}
.os__bar{display:flex;align-items:center;gap:7px;padding:13px 18px;border-bottom:1px solid var(--line2);background:linear-gradient(180deg,#fafafa,#f5f5f7)}
.os__bar .window__title{margin-left:8px}
.os__who{margin-left:auto;display:flex;gap:6px;align-items:center}
.os__body{display:grid;grid-template-columns:216px minmax(0,1fr)}
.os__nav{background:#fafafa;border-right:1px solid var(--line2);padding:12px 10px;display:flex;flex-direction:column;gap:2px}
.os__nav button{display:flex;gap:10px;align-items:center;padding:8px 11px;border-radius:10px;font-size:13.5px;font-weight:500;color:var(--ink2);text-align:left;transition:background .2s,color .2s;white-space:nowrap}
.os__nav button svg{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.os__nav button:hover{color:var(--ink)}
.os__nav button.is-on{background:#e8e8ed;color:var(--ink);font-weight:600}
.os__navlbl{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);padding:10px 11px 4px}
.os__main{min-width:0;display:flex;flex-direction:column}
.os__top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line2);font-size:13.5px;color:var(--ink3);min-height:47px}
.os__top b{color:var(--ink);font-weight:600;letter-spacing:-.01em}
.os__screens{position:relative;padding:clamp(16px,2.6vw,26px)}
.os__screen{max-width:640px;display:flex;flex-direction:column}
.os__screen[hidden]{display:none}
.os__screens{display:grid;grid-template-columns:minmax(0,1fr)}
.os__screens > .os__screen{grid-area:1/1;align-self:stretch}
@keyframes osIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.os__screen.is-run{animation:osIn .4s cubic-bezier(.2,.6,.2,1)}
@media (prefers-reduced-motion: reduce){.os__screen.is-run{animation:none}}
.os__cap{font-size:12.5px;color:var(--ink3);padding:10px 18px 14px;border-top:1px solid var(--line2);display:flex;gap:6px;flex-wrap:wrap;align-items:center;justify-content:space-between}
@media (max-width:860px){
  .os__body{grid-template-columns:1fr}
  .os__nav{flex-direction:row;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-right:0;border-bottom:1px solid var(--line2);padding:10px 12px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent)}
  .os__nav::-webkit-scrollbar{display:none}
  .os__nav button{padding:9px 13px}
  .os__navlbl{display:none}
}
/* Compact teaser variant: rail on top at every width */
.os--mini .os__body{grid-template-columns:1fr}
.os--mini .os__nav{flex-direction:row;overflow-x:auto;scrollbar-width:none;border-right:0;border-bottom:1px solid var(--line2);padding:10px 12px}
.os--mini .os__nav::-webkit-scrollbar{display:none}
.os--mini .os__navlbl{display:none}
.os--mini .os__screens{padding:clamp(16px,2.4vw,22px)}
.os--mini .os__screen{max-width:none}

/* Generic reveal rows inside a screen: land when the panel runs */
.osr{opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .45s ease}
.is-run .osr{opacity:1;transform:none}
.is-run .osr:nth-child(2){transition-delay:.12s}
.is-run .osr:nth-child(3){transition-delay:.24s}
.is-run .osr:nth-child(4){transition-delay:.36s}
.is-run .osr:nth-child(5){transition-delay:.48s}
@media (prefers-reduced-motion: reduce){.osr{opacity:1;transform:none;transition:none}}

/* Bars that grow to a per-element width when the panel runs */
.os .bar i{transition:width .8s cubic-bezier(.3,.7,.3,1)}
.is-run .bar i{width:var(--w,60%)}
.bar--acc i{background:var(--accg)}

/* Pipeline board */
.kb{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;flex:1;align-items:stretch}
.kb__col{background:var(--soft);border-radius:12px;padding:9px;min-width:0}
@media (max-width:560px){
  .kb{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x proximity;margin:0 calc(-1*clamp(16px,2.6vw,26px));padding:0 clamp(16px,2.6vw,26px) 4px}
  .kb::-webkit-scrollbar{display:none}
  .kb__col{flex:0 0 62%;scroll-snap-align:start}
}
.kb__h{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;font-weight:600;color:var(--ink3);padding:2px 4px 8px;letter-spacing:.02em}
.kb__card{background:#fff;border:1px solid var(--line2);border-radius:10px;padding:9px 10px;font-size:12.5px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.kb__card+.kb__card{margin-top:8px}
.kb__card b{display:block;font-size:13px;letter-spacing:-.01em}
.kb__meta{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.kb__meta .chip{font-size:10.5px;padding:2px 8px;gap:5px}
.kb__meta .chip::before{width:5px;height:5px}
.kb__ghost{overflow:hidden;max-height:120px;transition:max-height .5s ease .9s,opacity .4s ease .9s,margin .5s ease .9s;opacity:1}
.is-run .kb__ghost{max-height:0;opacity:0;margin-top:0}
.kb__in{opacity:0;transform:translateY(-8px) scale(.97);transition:opacity .45s ease 1.25s,transform .45s cubic-bezier(.2,.7,.3,1.2) 1.25s}
.is-run .kb__in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .kb__ghost{display:none}
  .kb__in{opacity:1;transform:none;transition:none}
}

/* Portal message thread */
.msg{display:grid;gap:8px}
.msg__b{max-width:86%;border-radius:14px;padding:9px 12px;font-size:13.5px;line-height:1.45;background:var(--soft);border:1px solid var(--line2)}
.msg__b--me{margin-left:auto;background:#1d1d1f;color:#fff;border-color:#1d1d1f}
.msg__t{display:block;font-size:11px;color:var(--ink3);margin-top:3px}
.msg__b--me .msg__t{color:rgba(255,255,255,.6)}

/* Editorial gate rail (marketing workflow) */
.wfr{display:flex;align-items:center;gap:0;margin:6px 0 2px}
.wfr__s{display:flex;flex-direction:column;align-items:center;gap:7px;flex:1;min-width:0}
.wfr__dot{width:26px;height:26px;border-radius:50%;border:1.6px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;transition:border-color .3s,background .3s;position:relative}
.wfr__dot svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:opacity .25s}
.wfr__s span{font-size:11.5px;color:var(--ink3);white-space:nowrap}
.wfr__ln{height:1.6px;background:var(--line2);flex:1;max-width:52px;margin-bottom:19px;position:relative;overflow:hidden}
.wfr__ln i{position:absolute;inset:0;background:var(--accg);transform:scaleX(0);transform-origin:left;transition:transform .45s ease}
.wfr__s.is-on .wfr__dot{background:var(--acc1);border-color:var(--acc1)}
.wfr__s.is-on .wfr__dot svg{opacity:1}
.wfr__s.is-on span{color:var(--ink);font-weight:600}
.wfr__ln.is-on i{transform:scaleX(1)}
.wfr__lock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:opacity .25s}
.wfr__lock svg{width:12px;height:12px;stroke:var(--ink3);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:1}
.wfr__s.is-on .wfr__lock{opacity:0}

/* Agent execution log */
.logx{font-family:var(--mono);font-size:12.5px;line-height:1.65;background:#0d0d0e;color:#d6d6db;border-radius:12px;padding:14px 16px;overflow:hidden;flex:1;display:flex;flex-direction:column;justify-content:flex-start}
.logx div{opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.logx div.is-on{opacity:1;transform:none}
.logx .t{color:#6e6e73;margin-right:10px}
.logx .ok{color:#5dd27d}
@media (prefers-reduced-motion: reduce){.logx div{opacity:1;transform:none;transition:none}}

/* Referral lifecycle stepper */
.rsteps{display:grid;gap:9px;flex:1;align-content:space-evenly}
.rstep{display:flex;gap:10px;align-items:center;font-size:13.5px;color:var(--ink3);transition:color .25s}
.rstep i{width:15px;height:15px;flex:none;border-radius:50%;border:1.6px solid var(--line);transition:all .25s;position:relative}
.rstep.is-on{color:var(--ink)}
.rstep.is-on i{background:#1d1d1f;border-color:#1d1d1f}
.rstep.is-on i::after{content:"";position:absolute;left:4px;top:1.4px;width:3.6px;height:7.4px;border:solid #fff;border-width:0 1.7px 1.7px 0;transform:rotate(42deg)}
.rstep .chip{margin-left:auto}

/* Inside explorer panels: compact the tallest screens so the height lock
   stays close to every panel. Document checks run two-up, and paired cards
   sit side by side once there is room. */
.os__screen .osgrid2{margin-top:9px}
.os__screen .osgrid2 .oscard+.oscard{margin-top:9px}
@media (min-width:600px){
  .os__screen .proc{grid-template-columns:1fr 1fr;column-gap:14px}
  .os__screen .osgrid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:stretch}
  .os__screen .osgrid2 .oscard{margin-top:0}
}

/* Search field mock (knowledge) */
.srch{display:flex;gap:9px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 13px;font-size:14px;background:#fff}
.srch svg{width:15px;height:15px;flex:none;stroke:var(--ink3);fill:none;stroke-width:1.8;stroke-linecap:round}
.srch span{min-height:1.4em}

/* Screen-level product cards and stat chips */
.oscard{border:1px solid var(--line2);border-radius:12px;padding:12px 14px;background:#fff}
.oscard+.oscard{margin-top:9px}
.oscard b{font-size:13.5px;letter-spacing:-.01em}
.oscard p{font-size:12.5px;color:var(--ink2);margin-top:2px}
.osnum{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.osnum div{background:var(--soft);border-radius:12px;padding:11px 12px;text-align:center}
.osnum b{display:block;font-size:19px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.osnum div > span{font-size:11px;color:var(--ink3)}
.oshead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.oshead b{font-size:15px;letter-spacing:-.012em}
.osfoot{font-size:12px;color:var(--ink3);margin-top:auto;padding-top:14px;border-top:1px solid var(--line2);display:flex;gap:6px;align-items:flex-start}
.osfoot svg{width:13px;height:13px;flex:none;margin-top:2px;stroke:var(--ink3);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------- v7 de-identification gateway ---------- */
.pii{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(14px,2.4vw,22px);align-items:stretch}
@media (max-width:880px){.pii{grid-template-columns:1fr}}
.pii .window__body{padding:18px 20px;font-size:14.5px;line-height:1.65}
.tk{position:relative;display:inline-block;border-radius:6px;padding:0 3px;margin:0 1px;background:rgba(10,132,255,.10);white-space:nowrap;vertical-align:baseline}
.tk s{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-decoration:none;font-family:var(--mono);font-size:.82em;font-weight:600;color:var(--acc1);opacity:0;transform:translateY(5px);transition:opacity .4s ease,transform .4s ease}
.tk em{font-style:normal;transition:opacity .4s ease,transform .4s ease;display:inline-block}
.pii.is-run .tk em{opacity:0;transform:translateY(-5px)}
.pii.is-run .tk s{opacity:1;transform:none}
.pii.is-run .tk:nth-of-type(2) em,.pii.is-run .tk:nth-of-type(2) s{transition-delay:.12s}
.pii.is-run .tk:nth-of-type(3) em,.pii.is-run .tk:nth-of-type(3) s{transition-delay:.24s}
.pii.is-run .tk:nth-of-type(4) em,.pii.is-run .tk:nth-of-type(4) s{transition-delay:.36s}
@media (prefers-reduced-motion: reduce){
  .pii.is-run .tk em{opacity:0;transform:none;transition:none}
  .pii.is-run .tk s{opacity:1;transform:none;transition:none}
}
.pii__mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-width:150px}
.pii__node{border:1px solid var(--line);border-radius:14px;padding:12px 16px;text-align:center;background:#fff;font-size:13px;font-weight:600;letter-spacing:-.01em}
.pii__node .small{display:block;font-weight:400;margin-top:2px}
.pii__wire{width:2px;flex:1;min-height:26px;background:var(--line2);position:relative;overflow:visible}
.pii__wire i{position:absolute;left:50%;top:0;width:7px;height:7px;border-radius:50%;background:var(--acc1);transform:translate(-50%,-50%);opacity:0;box-shadow:0 0 10px rgba(10,132,255,.8)}
.pii.is-run .pii__wire--in i{animation:pulseDown 1.3s linear infinite}
.pii.is-run .pii__wire--out i{animation:pulseDown 1.3s linear .65s infinite}
@media (max-width:880px){
  .pii__mid{flex-direction:row;min-width:0}
  .pii__wire{width:auto;height:2px;flex:1;min-height:0;min-width:26px}
  .pii__wire i{left:0;top:50%;transform:translate(-50%,-50%)}
  .pii.is-run .pii__wire--in i{animation:pulseRight 1.3s linear infinite}
  .pii.is-run .pii__wire--out i{animation:pulseRight 1.3s linear .65s infinite}
}
@keyframes pulseRight{0%{left:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
@media (prefers-reduced-motion: reduce){.pii.is-run .pii__wire i{animation:none;opacity:0}}
.pii__sw{font-size:12px;color:var(--ink3);display:flex;gap:6px;align-items:center}
.pii__sw b{font-family:var(--mono);font-size:11.5px;font-weight:600;color:var(--ink2);background:var(--soft);border-radius:6px;padding:2px 7px}

/* ---------- v7 module index cards ---------- */
.mods .card{position:relative;padding-bottom:18px}
.mods .card .link{margin-top:10px;font-size:14px}
.mods .gly{width:24px;height:24px;margin-bottom:10px}

/* ---------- v7 proof strip ---------- */
.proofs{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}
.proofs span{font-family:var(--mono);font-size:12.5px;border:1px solid var(--dline);border-radius:10px;padding:7px 13px;color:var(--dink2);background:rgba(255,255,255,.04)}
.proofs b{color:var(--dink);font-weight:600}

/* Late reveals inside a screen: shown by the module's own choreography */
.osl{opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .45s ease}
.osl.is-on{opacity:1;transform:none}
[data-docout]{opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .45s ease}
[data-docout].is-run{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .osl,[data-docout]{transition:none;transform:none}
}

/* ============================================================
   v8 platform value layer
   New sections on /platform.html: the value ledger, the leak
   instrument (the uncomfortable maths) and the Tuesday
   comparison. Everything inherits the monochrome system.
   The accent gradient touches type exactly once on the site:
   the recovered-income figure, the number the page exists
   to show.
   ============================================================ */

/* Gradient numeral, reserved for the recovered-income figure */
.grad-acc{background:var(--accg);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Value ledger ---------- */
.pfl{display:grid;grid-template-columns:repeat(3,1fr)}
.pfl__col{min-width:0;padding:0 clamp(22px,3.4vw,40px)}
.pfl__col:first-child{padding-left:0}
.pfl__col:last-child{padding-right:0}
.pfl__col + .pfl__col{border-left:1px solid var(--line2)}
.pfl__k{display:block;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin-bottom:16px}
.pfl__n{font-size:clamp(2.5rem,5.4vw,3.5rem);font-weight:700;letter-spacing:-.028em;line-height:1;font-variant-numeric:tabular-nums}
.pfl__s{display:block;font-size:14.5px;color:var(--ink2);margin-top:10px;line-height:1.45;max-width:300px}
.pfl__col > p{font-size:15px;color:var(--ink2);margin-top:16px;padding-top:16px;border-top:1px solid var(--line2)}
@media (max-width:820px){
  .pfl{grid-template-columns:1fr;gap:32px}
  .pfl__col{padding:0}
  .pfl__col + .pfl__col{border-left:0;border-top:1px solid var(--line2);padding-top:30px}
}

/* ---------- Leak instrument ---------- */
.pfm__grid{display:grid;grid-template-columns:1.06fr 1fr;gap:clamp(22px,3.6vw,44px);align-items:center}
@media (max-width:880px){.pfm__grid{grid-template-columns:1fr}}
.pfm__ctl .small{margin-top:14px}
.pfm__out{text-align:center;border:1px solid var(--line2);border-radius:var(--r-md);padding:clamp(20px,3vw,30px);position:relative;overflow:hidden;background:linear-gradient(180deg,#fbfbfd,#fff)}
.pfm__out::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accg)}
.pfm__flow{font-size:13px;color:var(--ink3);text-align:left}
.pfm__flow b{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:600}
.pfm__bar{display:flex;height:14px;border-radius:8px;overflow:hidden;background:var(--line2);margin:8px 0 8px}
.pfm__bar i{display:block;height:100%}
.pfm__bar .pfm__keep{background:var(--accg);width:75%;transition:width .45s cubic-bezier(.3,.7,.3,1);border-radius:8px 0 0 8px}
.pfm__bar .pfm__slip{flex:1;background:repeating-linear-gradient(135deg,#e8e8ed 0 6px,#dcdce1 6px 12px)}
.pfm__cap{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--ink3);text-align:left}
.pfm__cap b{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:600}
.pfm__cap .is-slip b{color:var(--hot)}
.pfm__hr{height:1px;background:var(--line2);margin:18px -6px}
.pfm__lbl{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.pfm__big{display:block;font-size:clamp(2.7rem,6vw,4rem);font-weight:700;letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums;margin-top:8px;padding-bottom:.06em}
.pfm__sub{font-size:14.5px;color:var(--ink2);margin-top:10px}
.pfm__sub b{color:var(--ink);font-variant-numeric:tabular-nums}
.pfm__seg{margin-top:16px}
@media (prefers-reduced-motion: reduce){.pfm__bar .pfm__keep{transition:none}}

/* Light controls inside the lite window on a dark band */
.dk .lite .seg{background:#e8e8ed}
.dk .lite .seg button{color:var(--ink2)}
.dk .lite .seg button.is-on{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.12)}

/* ---------- One Tuesday, twice ---------- */
.pfd__seg{display:flex;justify-content:center;margin-bottom:clamp(22px,3.6vw,34px)}
.pfd__panels{position:relative}
.pfd__panel[hidden]{display:none}
html.js .pfd__panel{animation:pfdIn .45s cubic-bezier(.2,.6,.2,1)}
@keyframes pfdIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){html.js .pfd__panel{animation:none}}
.pfd__end{margin-top:22px;padding:14px 18px;border-radius:var(--r-md);font-size:15px;display:flex;gap:11px;align-items:flex-start;line-height:1.5}
.pfd__end svg{width:17px;height:17px;flex:none;margin-top:2px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.pfd__end--bad{background:rgba(224,64,46,.07);color:#8f2c1f}
.pfd__end--good{background:rgba(49,162,76,.09);color:#1e6b34}

/* ---------- Pays-in line on module cards ---------- */
.pay{display:flex;gap:8px;align-items:baseline;margin-top:12px}
.pay b{font-weight:600;letter-spacing:.07em;text-transform:uppercase;font-size:10.5px;color:var(--ink3);white-space:nowrap}
.pay span{color:var(--ink);font-weight:500;font-size:13px}

/* ---------- Language toggle (EN/FR) ---------- */
.nav__lang{display:flex;align-items:center;gap:2px;padding:3px;border:1px solid rgba(245,245,247,.28);border-radius:var(--pill);flex:0 0 auto}
.nav__lang span{font-size:11.5px;font-weight:500;letter-spacing:.02em;line-height:1;padding:5px 9px;border-radius:var(--pill);color:rgba(245,245,247,.62);transition:color .2s,background .2s}
.nav__lang span.is-on{background:#f5f5f7;color:#000}
.nav__lang:hover span:not(.is-on){color:#fff}
@media (max-width:840px){
  .nav__lang{margin-left:-6px}
}

/* ---------- FR sizing (longer strings than EN) ---------- */
@media (min-width:1000px){
  .nav__brand,.nav__links a,.nav__cta,.nav__lang{white-space:nowrap}
}
html[lang="fr"] .nav__in{gap:24px}
html[lang="fr"] .nav__links{gap:20px}
html[lang="fr"] .nav__links a{font-size:13px}
html[lang="fr"] .d1{font-size:clamp(2.5rem,6.4vw,4.3rem)}
html[lang="fr"] .seg button{font-size:13px;padding:7px 12px}
@media (min-width:1000px){
  html[lang="fr"] .hero--split .d1{font-size:clamp(2.4rem,4vw,3.8rem)}
}
@media (max-width:380px){
  html[lang="fr"] .d1{font-size:2.25rem}
}

/* ---------- Platform story chapters ---------- */
.story{display:grid;gap:clamp(52px,7vw,92px)}
.chap{display:grid;gap:clamp(22px,3.5vw,56px);align-items:center}
@media (min-width:900px){
  .chap{grid-template-columns:1fr 1.15fr}
  .chap--flip .chap__txt{order:2}
  .chap--flip .window{order:1}
}
.chap--full{grid-template-columns:1fr}
.chap__k{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink3);margin-bottom:14px}
.chap__txt h3{font-size:clamp(1.45rem,2.6vw,2.05rem);letter-spacing:-.02em;line-height:1.15;margin-bottom:10px}
.chap__txt p{color:var(--ink2);font-size:16.5px;max-width:46ch}
.chap .window__body{padding:18px 18px 16px}
.chap .kb__card{font-size:13px}

/* ---------- Platform app shell (chapters) ---------- */
.appwin{background:#fff;border:1px solid var(--line2);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;color:var(--ink)}
.appwin__bar{display:flex;align-items:center;gap:7px;padding:11px 16px;border-bottom:1px solid var(--line2);background:linear-gradient(180deg,#fafafa,#f5f5f7)}
.appwin__t{font-size:12.5px;color:var(--ink3);margin-right:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appwin__wrap{display:grid;grid-template-columns:148px 1fr;min-height:320px}
.appwin__side{border-right:1px solid var(--line2);background:var(--soft);padding:10px 7px;display:flex;flex-direction:column;gap:2px}
.appwin__lbl{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink3);padding:8px 8px 4px}
.appwin__it{font-size:12.5px;color:var(--ink2);padding:6px 9px;border-radius:8px;white-space:nowrap}
.appwin__it.is-on{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.appwin__main{padding:15px 18px 17px;min-width:0;display:flex;flex-direction:column}
.appwin__crumb{font-size:12.5px;font-weight:600;color:var(--ink3);margin-bottom:12px}
.chap--flip .appwin{order:1}
@media (max-width:760px){
  .appwin__side{display:none}
  .appwin__wrap{grid-template-columns:1fr}
}

/* ---------- Value-first module cards ---------- */
.mod__top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:2px}
.mod__top .gly{margin-bottom:0}
.mod__pay{font-size:11px;font-weight:650;letter-spacing:.03em;text-transform:uppercase;padding:5px 10px;border-radius:var(--pill);background:rgba(10,132,255,.09);color:#0a66d0;white-space:nowrap}
.dk .mod__pay{background:rgba(10,132,255,.16);color:#7cb8ff}


/* ================================================================
   Premium interaction layer. Physics, light, and focus polish.
   Everything here is progressive: reduced motion strips movement,
   no-JS pages simply never receive the trigger classes.
   ================================================================ */

/* System polish */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3{text-wrap:balance}
::selection{background:rgba(10,132,255,.28)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
[id]{scroll-margin-top:calc(var(--nav-h) + 18px)}
:where(a,button,input,select,textarea,summary):focus-visible{outline:2px solid #0a84ff;outline-offset:3px;border-radius:6px}
.tbl-scroll{scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.tbl-scroll::-webkit-scrollbar{height:8px}
.tbl-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px}

/* Nav: condenses once the page moves */
.nav{transition:background .4s ease,box-shadow .4s ease}
html.is-scrolled .nav{background:rgba(0,0,0,.86);box-shadow:inset 0 -1px 0 rgba(255,255,255,.09)}

/* Press physics on every control */
.btn{will-change:transform}
.btn:active{transform:scale(.965)}
.nav__cta:active{transform:scale(.95)}
.seg button{transition:transform .18s cubic-bezier(.2,.8,.2,1)}
.seg button:active{transform:scale(.94)}
main a > svg{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
main a:hover > svg{transform:translateX(3px)}

/* Ambient depth on the dark hero */
.hero{background-image:radial-gradient(920px 480px at 78% -12%,rgba(10,132,255,.15),transparent 62%),radial-gradient(720px 420px at 8% 112%,rgba(255,255,255,.05),transparent 60%)}


/* Damped 3D tilt on the hero stage and app windows */

/* Card hover: a touch more lift and light */
.card:hover{transform:translateY(-4px)}
.gcard:hover{transform:translateY(-4px)}

/* ================================================================
   Full-canvas desktop. The container reaches 90vw (max 1680px) and,
   from 1440px up, the display type and product visuals scale with it
   so wide screens feel inhabited rather than framed. Prose keeps its
   narrow measure via .wrap--n and existing caps.
   ================================================================ */
/* The hero is a composed scene: its enquiry card, brief window and tabs were
   calibrated against a fixed frame. So the hero keeps that frame at every
   width while the rest of the site uses the full canvas. */
.hero .wrap{max-width:min(95vw,1280px)}
/* Definitive desktop placement for the enquiry popup: absolutely positioned,
   title bar level with the brief window's title bar (top:0), overhanging to
   the right. Tiers keep it fully visible against the 1180px hero frame. */
@media (min-width:1000px){
  .stage__enq{position:absolute;top:0;left:auto;right:-40px;width:292px;margin:0;z-index:3}
}
@media (min-width:1200px){
  .hero__grid{grid-template-columns:minmax(0,1fr) 560px;gap:clamp(40px,4.5vw,88px)}
  .hero__copy{max-width:680px}
  .hero__copy .d1{font-size:clamp(2.9rem,5.1vw,4.7rem)}
}
@media (min-width:1240px){ .stage__enq{right:-80px;width:310px} }
@media (min-width:1460px){ .stage__enq{right:-110px;width:320px} }
@media (min-width:1560px){ .stage__enq{right:-150px} }
@media (min-width:1620px){ .stage__enq{right:-190px} }
@media (min-width:1800px){ .stage__enq{right:-280px} }
@media (min-width:1440px){
  .d2{font-size:3.8rem}
  .d3{font-size:2.05rem}
  .lead{font-size:1.5rem}
  .hero .lead{font-size:1.4rem}
  .s2l__big{font-size:5.2rem}
  .stat b{font-size:3.6rem}
  .sec-head{max-width:920px}
  .os__screen{max-width:720px}
  .gcard{max-width:620px}
}

/* ================================================================
   Phone polish: comfortable tap targets, readable rail labels,
   native-feel touch, and notch safe areas. Desktop untouched.
   ================================================================ */
html{-webkit-tap-highlight-color:transparent}
a,button,summary,input,label{touch-action:manipulation}
.nav__in{padding-left:max(22px, env(safe-area-inset-left));padding-right:max(22px, env(safe-area-inset-right))}
@media (max-width:820px){
  .pipe__labels span{font-size:12.5px}
  .seg button{padding:10px 16px;min-height:40px}
  .nav__lang{padding:5px;min-height:38px}
  .link{padding:8px 0;margin:-8px 0}
  .nav__links a{padding:12px 0;margin:-12px 0}
  footer a,.footer a,.foot a{display:inline-block;padding:11px 0;margin:-11px 0}
}

/* ================================================================
   Guarantee page: composed like a product page. The certificate is
   the hero object; numbers speak for themselves; claiming is three
   ghost-numeral steps.
   ================================================================ */
.ghero{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(36px,5vw,72px);align-items:center}
.ghero__cert{justify-self:end;width:100%;max-width:560px;position:relative}
.ghero__cert::before{content:"";position:absolute;inset:-12% -16%;background:radial-gradient(60% 60% at 50% 42%,rgba(10,132,255,.22),transparent 70%);filter:blur(6px);pointer-events:none}
.ghero .gcard{position:relative;box-shadow:0 40px 90px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.10)}
.gnums-sec{padding-top:64px;padding-bottom:64px}
.gnums{display:grid;grid-template-columns:repeat(3,1fr);gap:0;text-align:center}
.gnum{padding:8px 28px}
.gnum + .gnum{border-left:1px solid var(--line2)}
.gnum b{display:block;font-size:clamp(3.4rem,7vw,6rem);font-weight:700;letter-spacing:-.035em;line-height:1;background:linear-gradient(180deg,var(--ink) 40%,rgba(29,29,31,.55));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gnum span{display:block;margin-top:12px;font-size:15px;color:var(--ink3);max-width:26ch;margin-inline:auto}
.gsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:gstep}
.gstep{position:relative;border-top:1px solid var(--line2);padding:74px 8px 8px;counter-increment:gstep}
.gstep::before{content:counter(gstep,decimal-leading-zero);position:absolute;top:14px;left:0;font-size:64px;font-weight:700;letter-spacing:-.04em;line-height:1;color:rgba(29,29,31,.08)}
.gstep p{font-size:15.5px;color:var(--ink2)}
.gnote{margin-top:40px;border:1px solid var(--line2);border-radius:var(--r-lg,20px);padding:26px 28px;background:var(--soft,#f5f5f7)}
.gnote h3{margin-bottom:8px}
@media (max-width:980px){
  .ghero{grid-template-columns:1fr;gap:44px}
  .ghero__cert{justify-self:center;max-width:520px}
}
@media (max-width:820px){
  .gnums{grid-template-columns:1fr;text-align:left}
  .gnum{padding:20px 0}
  .gnum + .gnum{border-left:0;border-top:1px solid var(--line2)}
  .gnum span{margin-inline:0}
  .gsteps{grid-template-columns:1fr}
}

/* Trust layer on the guarantee certificate and page */
.gsig{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14)}
.gsig__lbl{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:rgba(245,245,247,.55)}
.gsig__name{display:block;font-size:21px;font-weight:650;letter-spacing:-.01em;margin-top:4px}
.gsig__role{display:block;font-size:12.5px;color:rgba(245,245,247,.62);margin-top:2px}
.gseal{flex:none;width:76px;height:76px;border-radius:50%;border:1px solid rgba(245,245,247,.35);box-shadow:inset 0 0 0 4px rgba(245,245,247,.06);display:flex;flex-direction:column;align-items:center;justify-content:center;color:rgba(245,245,247,.85)}
.gseal b{font-size:23px;font-weight:700;letter-spacing:-.02em;line-height:1}
.gseal span{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;margin-top:3px;color:rgba(245,245,247,.6)}
.gcert-note{margin-top:14px;text-align:center;font-size:13px;color:rgba(245,245,247,.55)}
.gsteps-note{margin-top:18px;text-align:center;font-size:14px;color:var(--ink3)}
.gverify{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px}
.gver{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border:1px solid var(--line2);border-radius:14px;background:#fff;font-weight:550;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.gver span{color:var(--ink3);transition:transform .3s}
.gver:hover{transform:translateY(-3px);box-shadow:var(--shadow-md,0 10px 30px rgba(0,0,0,.08))}
.gver:hover span{transform:translateX(3px)}
@media (max-width:820px){.gverify{grid-template-columns:1fr}.gsig{flex-wrap:wrap}}

/* ================================================================
   Guarantee as a typeset document. Its own visual identity:
   serif display, paper column, numbered articles, sticky rail,
   executed signature. Distinct from every other page by design.
   ================================================================ */
.docpage{--serif:ui-serif,'New York','Iowan Old Style',Georgia,'Times New Roman',serif;background:#fbfbfa}
.doc{padding:calc(var(--nav-h) + 56px) 22px 40px;background:
  radial-gradient(700px 340px at 50% -80px,rgba(10,132,255,.06),transparent 70%),#fbfbfa}
.doc__wrap{max-width:1060px;margin:0 auto;display:grid;grid-template-columns:64px minmax(0,760px);gap:44px;justify-content:center}
.docnav{position:sticky;top:calc(var(--nav-h) + 40px);align-self:start;display:flex;flex-direction:column;gap:4px}
.docnav a{font-size:12.5px;letter-spacing:.08em;color:var(--ink3);padding:7px 10px;border-left:1.5px solid var(--line2);transition:color .25s,border-color .25s}
.docnav a.is-here{color:var(--ink);border-color:var(--ink)}
.doc__body{min-width:0}
.doc__head{text-align:center;padding-bottom:40px;border-bottom:1px solid var(--line2)}
.doc__kicker{display:inline-block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}
.doc__title{font-family:var(--serif);font-weight:600;font-size:clamp(2.9rem,7vw,4.9rem);letter-spacing:-.015em;line-height:1.04;margin-top:16px}
.doc__sub{max-width:56ch;margin:20px auto 0;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.55;color:var(--ink2)}
.doc__meta{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:22px}
.doc__meta span{font-size:12.5px;letter-spacing:.02em;color:var(--ink3);border:1px solid var(--line2);border-radius:var(--pill);padding:6px 14px;background:#fff}
.doc__figs{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;padding:36px 0;border-bottom:1px solid var(--line2)}
.fig{padding:6px 18px}
.fig + .fig{border-left:1px solid var(--line2)}
.fig b{display:block;font-family:var(--serif);font-weight:600;font-size:clamp(2.6rem,5.4vw,4rem);letter-spacing:-.02em;line-height:1}
.fig span{display:block;margin-top:10px;font-size:13.5px;color:var(--ink3);max-width:22ch;margin-inline:auto}
.art{position:relative;padding:34px 0 30px 92px;border-bottom:1px solid var(--line2)}
.art__n{position:absolute;left:0;top:30px;font-family:var(--serif);font-size:44px;font-weight:600;letter-spacing:-.02em;color:rgba(29,29,31,.16);line-height:1}
.art h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.35rem,2vw,1.7rem);letter-spacing:-.01em}
.art p{margin-top:10px;font-size:16.5px;line-height:1.65;color:var(--ink2);max-width:62ch}
.doc__sig{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:38px 0 34px;border-bottom:1px solid var(--line2)}
.doc__siglbl{display:block;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.doc__signame{display:block;font-family:var(--serif);font-size:30px;font-weight:600;letter-spacing:-.01em;margin-top:8px}
.doc__sigrole{display:block;font-size:13.5px;color:var(--ink2);margin-top:3px}
.doc__sigplace{display:block;font-size:13px;color:var(--ink3);margin-top:12px}
.doc__seal{flex:none;width:88px;height:88px;border-radius:50%;border:1px solid rgba(29,29,31,.4);box-shadow:inset 0 0 0 4px rgba(29,29,31,.05);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink);transform:rotate(-6deg)}
.doc__seal b{font-family:var(--serif);font-size:27px;font-weight:600;line-height:1}
.doc__seal span{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin-top:3px}
.doc__refs{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:26px 0 8px}
.doc__refslbl{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin-right:6px}
.doc__refs a{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:550;border:1px solid var(--line2);border-radius:var(--pill);padding:9px 16px;background:#fff;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.doc__refs a span{color:var(--ink3);transition:transform .3s}
.doc__refs a:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.07)}
.doc__refs a:hover span{transform:translateX(3px)}
.doc__cta{background:var(--dbg,#000);color:#f5f5f7;padding:88px 22px;text-align:center;background-image:radial-gradient(640px 300px at 50% 120%,rgba(10,132,255,.16),transparent 70%)}
.doc__ctaline{font-family:var(--serif);font-weight:600;font-size:clamp(2rem,4.6vw,3.2rem);letter-spacing:-.01em}
.doc__ctasub{color:rgba(245,245,247,.6);font-size:14.5px}
@media (max-width:1099px){.doc__wrap{grid-template-columns:minmax(0,760px)}.docnav{display:none}}
@media (max-width:820px){
  .doc{padding-top:calc(var(--nav-h) + 36px)}
  .doc__figs{grid-template-columns:1fr;text-align:left;padding:8px 0}
  .fig{padding:20px 0}
  .fig + .fig{border-left:0;border-top:1px solid var(--line2)}
  .fig span{margin-inline:0}
  .art{padding:26px 0 24px 0}
  .art__n{position:static;display:block;font-size:30px;margin-bottom:6px}
  .doc__sig{flex-direction:column;align-items:flex-start}
}

/* The seven articles, in the site's own type */
.gterms{display:grid;gap:0;counter-reset:gt}
.gterm{position:relative;padding:26px 0 24px 88px;border-top:1px solid var(--line2);counter-increment:gt}
.gterm:last-child{border-bottom:1px solid var(--line2)}
.gterm::before{content:counter(gt,decimal-leading-zero);position:absolute;left:0;top:24px;font-size:44px;font-weight:700;letter-spacing:-.04em;line-height:1;color:rgba(29,29,31,.10)}
.gterm h3{font-size:17.5px;font-weight:650;letter-spacing:-.01em}
.gterm p{margin-top:6px;font-size:15.5px;line-height:1.6;color:var(--ink2);max-width:64ch}
@media (max-width:820px){
  .gterm{padding-left:0}
  .gterm::before{position:static;display:block;font-size:28px;margin-bottom:4px}
}

/* ================================================================
   v7.4 Hero headline fit
   The h1 was staircasing into three lines on desktop because the
   copy column was narrower than the second segment at the sizes the
   clamps produced. The copy column now gets more room (slimmer stage
   column, tighter gap), the display sizes are refit per language,
   and the enquiry card no longer crosses the viewport edge in the
   1240 to 1399 band, where the wrap has not yet reached its 1280px
   cap.
   ================================================================ */
@media (min-width:1000px){
  .hero--split .d1{font-size:clamp(2.6rem,4.2vw,4rem)}
}
@media (min-width:1000px) and (max-width:1199px){
  /* The stage column's min-content (tab row, mail meta) was crushing
     the copy column to ~240px. Inner windows already size with
     min(…,100%) and the tab row scrolls, so the track can shrink. */
  .hero__grid{grid-template-columns:1.02fr minmax(0,1fr)}
}
@media (min-width:1200px){
  .hero__grid{grid-template-columns:minmax(0,1fr) 540px;gap:clamp(36px,3.2vw,60px)}
  .hero__copy{max-width:700px}
  .hero__copy .d1{font-size:clamp(2.8rem,4.35vw,4rem)}
}

/* FR runs longer than EN: its own type fit, and the regrouped
   headline breaks as two block lines on desktop. On phones the
   spans flow naturally and the browser balances the lines. */
@media (min-width:1000px){
  html[lang="fr"] .hero--split .d1{font-size:clamp(2.3rem,3.55vw,3.5rem)}
  html[lang="fr"] .hero--split .d1 .h1l{display:block}
}
@media (max-width:999px){
  html[lang="fr"] .hero--split .d1{text-wrap:balance}
}

/* The -80px overhang tier assumed the wrap had reached 1280px,
   which only happens from ~1400px viewports. Below that the card
   was clipped by the screen edge. */
@media (min-width:1240px) and (max-width:1399px){
  .stage__enq{right:-40px;width:292px}
}

/* ================================================================
   v7.5 Section fit pass
   ================================================================ */

/* Guarantee promise: a display h2 inside the 720px narrow wrap was
   stacking five lines. The block gets its own wider measure and a
   size that holds one thought per line, in both languages. */
.wrap--p{max-width:1020px}
.promise-h{font-size:clamp(1.9rem,3.3vw,2.8rem)}
@media (max-width:719px){
  .promise-h{text-wrap:balance}
}

/* Platform modules: tracks compressed to ~230px on wide screens,
   and the nowrap pill crushed the flex icon to zero width, then
   overflowed the card. Wider tracks; the icon never shrinks; the
   pill drops to its own line instead of escaping the card. */
.mods{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.mod__top{flex-wrap:wrap}
.mod__top .gly{flex:none}
.mod__pay{white-space:normal;max-width:100%}

/* ================================================================
   v7.6 Pricing card header + mobile display headings
   Desktop keeps the title with the cohort chip on one row. On
   phones the chip was wrapping to its own line and floating right;
   it now stacks under the title, left-aligned. Long display
   headings balance their lines on small screens instead of leaving
   a short orphan word.
   ================================================================ */
.plan__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.plan__top .chip{margin-left:auto}
@media (max-width:719px){
  .plan__top{flex-direction:column;align-items:flex-start;gap:10px}
  .plan__top .chip{margin-left:0}
  .d2{text-wrap:balance}
}

/* ================================================================
   v7.7 Calm hover
   Nothing moves because the pointer passes over it. Hover keeps its
   non-positional feedback (border colour, shadow, background) so
   clickable things still read as clickable, and press feedback
   (:active) stays. All demos remain click-driven inside.
   ================================================================ */
.btn:hover{transform:none}
.link:hover svg,main a:hover>svg{transform:none}
.card:hover,.tile:hover,.gcard:hover,.door:hover,.fstrip__p:hover,.gver:hover,.doc__refs a:hover{transform:none}
.gcard:hover::after{transform:none}
.fr:hover .fr__photo img{transform:none}
.gver:hover span,.doc__refs a:hover span{transform:none}

/* ================================================================
   v7.9 Pipe section: full width, self-sizing stages
   The sticky flexbox was shrink-wrapping the wrap to its intrinsic
   width (~240px), and the stage texts were absolutely positioned
   inside a hardcoded min-height, overflowing onto the step buttons.
   The wrap now takes the full width, and the stages grid-stack in
   one cell so the container always equals the tallest stage: no
   overlap possible at any width or language.
   ================================================================ */
.pipe__stick .wrap{width:100%}
.pipe .d2{font-size:clamp(2.5rem,4.6vw,3.9rem)}
.pipe__stages{display:grid;min-height:0;margin-top:clamp(26px,3.4vw,40px)}
.pipe__stage{grid-area:1/1;position:static;inset:auto;max-width:none}
.pipe__stage h3{font-size:clamp(1.6rem,2.6vw,2.3rem)}
.pipe__stage .lead{max-width:62ch;font-size:clamp(1.08rem,1.4vw,1.35rem);margin-left:0}
.pipe--flat .pipe__stage{grid-area:auto}

/* ================================================================
   v8.0 PII gateway: one stage per column, legible replay
   The left window keeps the real names under its truthful title;
   the AI node visibly receives the neutral tokens; the brief and
   its chip reveal on the right. The sequence is staged by JS and
   fully replayable; at rest all three stages stay readable.
   ================================================================ */
.pii .tk s{display:none}
.pii.is-run .tk em{opacity:1;transform:none}
.pii .tk{transition:background .3s ease,box-shadow .3s ease}
.pii .tk.is-hl{background:rgba(10,132,255,.22);box-shadow:0 0 0 2px rgba(10,132,255,.22)}
.pii__toks{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin-top:9px}
.pii__toks b{font-family:var(--mono);font-weight:600;font-size:11px;color:var(--acc1);background:rgba(10,132,255,.10);border-radius:6px;padding:2px 6px;opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s ease}
.pii__toks b.is-on{opacity:1;transform:none}
.pii__brief{display:inline-block;opacity:0;transform:translateY(6px);transition:opacity .45s ease,transform .45s ease}
.pii__brief.is-on{opacity:1;transform:none}
.pii .chip--good{opacity:0;transition:opacity .4s ease .1s}
.pii .chip--good.is-on{opacity:1}
.pii.is-run .pii__wire--in i,.pii.is-run .pii__wire--out i{animation:none}
.pii.is-wiring .pii__wire--in i{animation:pulseDown 1.1s linear 2}
.pii.is-wiring2 .pii__wire--out i{animation:pulseDown 1.1s linear 2}
@media (max-width:880px){
  .pii.is-wiring .pii__wire--in i{animation:pulseRight 1.1s linear 2}
  .pii.is-wiring2 .pii__wire--out i{animation:pulseRight 1.1s linear 2}
}
@media (prefers-reduced-motion: reduce){
  .pii .tk,.pii__toks b,.pii__brief,.pii .chip--good{transition:none}
}

/* ================================================================
   v8.1 ROI calculator: the Vigie payback block
   ================================================================ */
.calc__out--vs{margin-top:14px}
.calc__vsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;text-align:center;margin-top:12px}
.calc__vsgrid b{display:block;font-size:1.55rem;letter-spacing:-.02em;line-height:1.1}
.calc__vsgrid span{display:block;font-size:12.5px;color:var(--ink3);margin-top:4px}
@media (max-width:640px){.calc__vsgrid{grid-template-columns:1fr;gap:12px}}

/* ================================================================
   v8.2 Leak calculator: controls left, live impact right
   ================================================================ */
.calc2{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(20px,3.2vw,38px);align-items:start}
@media (max-width:760px){.calc2{grid-template-columns:1fr}}
.calc2__big{display:block;font-size:clamp(2.2rem,4.4vw,3.3rem);letter-spacing:-.03em;line-height:1.05;margin:4px 0 6px}
.calc2__bar{height:10px;border-radius:99px;background:var(--line2);overflow:hidden;margin:18px 0 8px;position:relative}
.calc2__bar i{position:absolute;top:0;left:0;bottom:0;width:60%;background:#1d1d1f;border-radius:99px;transition:width .35s ease}
.calc2__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.calc2__grid b{display:block;font-size:1.4rem;letter-spacing:-.02em}
.calc2__grid span{display:block;font-size:12.5px;color:var(--ink3);margin-top:3px}
@media (prefers-reduced-motion: reduce){.calc2__bar i{transition:none}}

/* ================================================================
   v8 · Hero film: one enquiry, from tonight to 2046.
   The stage follows a single enquiry across five moments. Scenes are
   stacked in one grid cell (same ballast idea as v6): the container
   sizes to the tallest scene at CSS parse time, so nothing jumps.
   ================================================================ */
.film{width:100%}
.film__win .window__title{flex:1}
.film__clock{flex:none;margin-left:8px;position:relative;font-family:var(--mono);font-size:12px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--line2);border-radius:var(--pill);padding:3px 10px 3px 22px;font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap}
.film__clock::before{content:"";position:absolute;left:9px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:var(--good)}
@media (prefers-reduced-motion: no-preference){
  .film__clock::before{animation:filmPulse 2.2s ease-in-out infinite}
  @keyframes filmPulse{0%,100%{opacity:1}50%{opacity:.35}}
  .film__clock.is-tick{animation:filmTick .5s cubic-bezier(.2,.7,.3,1)}
  @keyframes filmTick{0%{transform:translateY(4px);opacity:.3}100%{transform:none;opacity:1}}
}
.film__win .window__body{padding:clamp(16px,2.4vw,24px) clamp(16px,2.4vw,24px) 14px}

.film__stack{display:grid}
.film__scene{grid-area:1/1;min-width:0;display:flex;flex-direction:column;gap:13px;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .5s cubic-bezier(.2,.7,.2,1),transform .5s cubic-bezier(.2,.7,.2,1),visibility 0s .5s}
.film__scene.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .5s cubic-bezier(.2,.7,.2,1) .08s,transform .5s cubic-bezier(.2,.7,.2,1) .08s,visibility 0s 0s}
@media (prefers-reduced-motion: reduce){.film__scene{transition:none;transform:none}}

.fs__kick{display:flex;flex-direction:column;gap:2px;text-align:left}
.fs__kick b{font-size:16.5px;letter-spacing:-.012em;font-weight:600}
.fs__kick span{font-size:13px;color:var(--ink3)}

.fs__doors{display:flex;gap:6px;flex-wrap:wrap}
.fs__doors span{font-size:12.5px;font-weight:500;color:var(--ink3);border:1px dashed var(--line);border-radius:var(--pill);padding:4px 11px;white-space:nowrap}
.fs__doors .is-lit{position:relative;color:var(--ink);border-style:solid;border-color:var(--ink);background:#fff;padding-left:23px;box-shadow:0 3px 10px rgba(0,0,0,.07)}
.fs__doors .is-lit::before{content:"";position:absolute;left:10px;top:50%;margin-top:-3.5px;width:7px;height:7px;border-radius:50%;background:var(--good)}

.fs__card{border:1px solid var(--line2);border-radius:var(--r-md);background:#fff;overflow:hidden;text-align:left}
.fs__chips{display:flex;gap:6px;flex-wrap:wrap;padding:11px 14px;border-bottom:1px solid var(--line2)}
.fs__chips--free{padding:0;border:0;justify-content:center}
.fs__row{display:grid;grid-template-columns:118px 1fr;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line2);font-size:13.5px;align-items:baseline}
.fs__row:last-child{border-bottom:0}
.fs__row>span{color:var(--ink3);font-weight:600;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.fs__row>b{font-weight:500;color:var(--ink);overflow-wrap:anywhere;line-height:1.45}
.fs__row .mono{font-size:.94em}
@media (max-width:460px){.fs__row{grid-template-columns:92px 1fr;gap:9px}}
html[lang="fr"] .fs__row{grid-template-columns:140px 1fr}
@media (max-width:460px){html[lang="fr"] .fs__row{grid-template-columns:104px 1fr}}

.fs__reply{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:11px 14px;font-size:12.5px;color:var(--ink2);text-align:left}
.fs__btn{flex:none;display:inline-flex;background:#1d1d1f;color:#fff;border-radius:var(--pill);padding:7px 14px;font-size:12.5px;font-weight:500;letter-spacing:-.005em}

.fs__stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fs__stats>div{border:1px solid var(--line2);border-radius:var(--r-md);padding:12px 14px;background:#fafafa;text-align:left}
.fs__stats b{display:block;font-size:clamp(1.45rem,2.4vw,1.8rem);font-weight:700;letter-spacing:-.02em;line-height:1.05;font-variant-numeric:tabular-nums}
.fs__stats span{display:block;margin-top:3px;font-size:12.5px;color:var(--ink3);line-height:1.45}
@media (max-width:380px){.fs__stats{grid-template-columns:1fr}}

.fs__gate{position:relative;display:inline-grid;vertical-align:top}
.fs__gate>.chip{grid-area:1/1;justify-self:start;transition:opacity .35s,transform .35s}
.fs__gate .fs__g2{opacity:0;transform:translateY(5px)}
.fs__gate.is-ok .fs__g1{opacity:0;transform:translateY(-5px)}
.fs__gate.is-ok .fs__g2{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.fs__gate>.chip{transition:none}}

.fs__foot{font-size:12.5px;color:var(--ink3);line-height:1.55;text-align:left}
.fs__foot--c{text-align:center}
.fs__sig{display:block;margin-top:7px;color:var(--ink);font-weight:600;font-size:13px;letter-spacing:-.01em}

.fs__seal{display:flex;justify-content:center;padding:2px 0}
.fs__seal svg{width:132px;height:98px;overflow:visible}
.fs__seal .s-doc{fill:#fff;stroke:var(--line);stroke-width:1.4}
.fs__seal .s-fold{fill:none;stroke:var(--line);stroke-width:1.4;stroke-linejoin:round}
.fs__seal .s-line{stroke:var(--line2);stroke-width:2;stroke-linecap:round}
.fs__seal .s-hub{fill:#fff;stroke:var(--ink);stroke-width:1.5}
.fs__seal .s-key{stroke:var(--ink);stroke-width:1.5;stroke-linecap:round;fill:none}
.fs__seal circle.s-key{fill:none}
.fs__seal .s-ring{fill:none;stroke:var(--acc1);stroke-width:1.3;stroke-dasharray:3 7;opacity:.6;transform-box:fill-box;transform-origin:center}
.fs__seal .s-ring2{stroke:var(--acc2);stroke-dasharray:2 9;opacity:.4}
@media (prefers-reduced-motion: no-preference){
  .film__scene.is-on .s-ring{animation:sealSpin 30s linear infinite}
  .film__scene.is-on .s-ring2{animation:sealSpin 44s linear infinite reverse}
  @keyframes sealSpin{to{transform:rotate(360deg)}}
}

.film__rail{display:flex;gap:8px;margin-top:16px;padding-top:13px;border-top:1px solid var(--line2)}
.film__node{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px;padding:0 0 2px;cursor:pointer;border-radius:6px}
.film__track{display:block;height:3px;border-radius:2px;background:var(--line2);overflow:hidden}
.film__fill{display:block;height:100%;width:0;border-radius:2px;background:var(--ink)}
.film__node.is-done .film__fill{width:100%}
.film__node.is-on .film__fill{width:100%}
@media (prefers-reduced-motion: no-preference){
  .film:not(.is-manual) .film__node.is-on .film__fill{width:0;animation:filmFill var(--film-dur,7s) linear forwards}
  .film.is-paused .film__fill{animation-play-state:paused}
  @keyframes filmFill{to{width:100%}}
}
.film__t{font-size:11px;font-family:var(--mono);color:var(--ink3);letter-spacing:.01em;white-space:nowrap;font-variant-numeric:tabular-nums;text-align:left}
.film__t em{font-style:normal;opacity:.6}
.film__node.is-on .film__t{color:var(--ink);font-weight:700}
.film__node:hover .film__t{color:var(--ink)}
@media (max-width:560px){.film__rail{gap:6px}.film__t{font-size:9.5px;letter-spacing:0}}

/* ================================================================
   v8 · Twenty-year band: drag the year, the promises hold.
   ================================================================ */
.lvh{padding:clamp(60px,8vw,110px) 0}
.lvh__grid{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(30px,4.5vw,72px);align-items:center}
@media (max-width:980px){.lvh__grid{grid-template-columns:1fr;gap:34px}}
.lvh__lede .d2{margin-top:2px}
.lvh__lede .lead{font-size:clamp(1.05rem,1.45vw,1.22rem)}
.lvh__lab{position:relative;border:1px solid var(--dline2);border-radius:var(--r-lg);padding:clamp(20px,2.8vw,30px);background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));box-shadow:0 30px 80px rgba(0,0,0,.45)}
.lvh__top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.lvh__what b{display:block;font-size:15.5px;letter-spacing:-.01em;font-weight:600}
.lvh__what span{display:block;margin-top:3px;font-size:12.5px;color:var(--dink3);max-width:300px;line-height:1.5}
.lvh__year{font-size:clamp(2.8rem,4.6vw,4rem);font-weight:700;line-height:.92;letter-spacing:-.03em;font-variant-numeric:tabular-nums;background:var(--accg);-webkit-background-clip:text;background-clip:text;color:transparent}

.lvh__range{-webkit-appearance:none;appearance:none;display:block;width:100%;height:32px;margin-top:10px;background:transparent;cursor:ew-resize;--p:0%}
.lvh__range:focus-visible{outline:2px solid #f5f5f7;outline-offset:4px;border-radius:8px}
.lvh__range::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(90deg,#f5f5f7 var(--p),rgba(245,245,247,.16) var(--p))}
.lvh__range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:-10.5px;border-radius:50%;background:#fff;border:0;box-shadow:0 3px 12px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.12);transition:transform .18s}
.lvh__range:hover::-webkit-slider-thumb,.lvh__range:active::-webkit-slider-thumb{transform:scale(1.12)}
.lvh__range::-moz-range-track{height:3px;border-radius:2px;background:rgba(245,245,247,.16)}
.lvh__range::-moz-range-progress{height:3px;border-radius:2px;background:#f5f5f7}
.lvh__range::-moz-range-thumb{width:24px;height:24px;border:0;border-radius:50%;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.55)}
.lvh__ticks{display:flex;justify-content:space-between;margin-top:4px;font-family:var(--mono);font-size:10.5px;color:var(--dink3);font-variant-numeric:tabular-nums}

.lvh__eras{display:grid;margin-top:20px}
.lvh__era{grid-area:1/1;min-width:0;font-size:clamp(1.02rem,1.5vw,1.24rem);line-height:1.45;font-weight:500;letter-spacing:-.012em;color:var(--dink);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .45s,transform .45s,visibility 0s .45s}
.lvh__era.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .45s .05s,transform .45s .05s,visibility 0s 0s}
@media (prefers-reduced-motion: reduce){.lvh__era{transition:none;transform:none}}

.lvh__status{display:flex;gap:8px 20px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--dline2)}
.lvh__status span{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--dink)}
.lvh__status svg{width:15px;height:15px;flex:none;stroke:var(--good);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lvh__cap{margin-top:10px;font-size:12px;color:var(--dink3)}

.lvh__marks{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(36px,5vw,54px)}
@media (max-width:860px){.lvh__marks{grid-template-columns:1fr}}
.lvh__mark{position:relative;display:block;border:1px solid var(--dline2);border-radius:var(--r-md);padding:20px 22px;background:rgba(255,255,255,.02);color:inherit;transition:border-color .2s,transform .2s,background .2s}
.lvh__mark:hover{border-color:rgba(245,245,247,.45);transform:translateY(-3px);background:rgba(255,255,255,.05)}
.lvh__ic{display:inline-flex;width:29px;height:29px;margin-bottom:12px;color:var(--dink)}
.lvh__ic svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lvh__mark b{display:block;font-size:15.5px;font-weight:600;letter-spacing:-.012em;background:var(--accg);-webkit-background-clip:text;background-clip:text;color:transparent}
.lvh__mark>span{display:block;margin-top:6px;font-size:13px;line-height:1.55;color:var(--dink3)}
.lvh__go{position:absolute;top:20px;right:18px;width:22px;height:22px;display:grid;place-items:center;color:var(--dink2);opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .2s}
.lvh__mark:hover .lvh__go{opacity:1;transform:none}
.lvh__go svg{width:8px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media (prefers-reduced-motion: reduce){.lvh__mark,.lvh__go{transition:none}}

/* ================================================================
   v8.1 · Platform: the seal under every module.
   Five modules flip above; the seal apparatus below never moves.
   The invariance is the message.
   ================================================================ */
.pq__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(30px,4.5vw,72px);align-items:center}
@media (max-width:980px){.pq__grid{grid-template-columns:minmax(0,1fr);gap:34px}}
.pq__lede .lead{font-size:clamp(1.05rem,1.45vw,1.22rem)}
.pq__lab{min-width:0;border:1px solid var(--dline2);border-radius:var(--r-lg);padding:clamp(20px,2.8vw,30px);background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));box-shadow:0 30px 80px rgba(0,0,0,.45)}
.pq__tabs{display:flex;margin-bottom:18px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.pq__tabs::-webkit-scrollbar{display:none}
.pq__tabs button{white-space:nowrap}

.pq__stage{display:grid}
.pq__scene{grid-area:1/1;min-width:0;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .45s cubic-bezier(.2,.7,.2,1),transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s .45s}
.pq__scene.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .45s cubic-bezier(.2,.7,.2,1) .05s,transform .45s cubic-bezier(.2,.7,.2,1) .05s,visibility 0s 0s}
@media (prefers-reduced-motion: reduce){.pq__scene{transition:none;transform:none}}

.pq__art{position:relative}
.pq__badge{position:absolute;top:-11px;right:-8px;z-index:2;width:27px;height:27px;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;box-shadow:0 5px 14px rgba(0,0,0,.4);opacity:0;transform:scale(.5);transition:opacity .35s .45s,transform .35s .45s}
.pq__scene.is-on .pq__badge{opacity:1;transform:none}
.pq__badge svg{width:13px;height:13px;stroke:var(--ink);fill:none;stroke-width:1.8;stroke-linecap:round}
@media (prefers-reduced-motion: reduce){.pq__badge{transition:none;opacity:1;transform:none}}
.pq__line{margin-top:12px;font-size:13.5px;font-weight:500;letter-spacing:-.008em;color:var(--dink)}

.pq__kit{margin-top:16px;padding-top:16px;border-top:1px solid var(--dline2)}
.pq__locks{display:flex;gap:7px;flex-wrap:wrap}
.pq__sub{margin-top:9px;font-family:var(--mono);font-size:11px;letter-spacing:.02em;color:var(--dink3)}
.pq__chain{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12.5px;color:var(--dink)}
.pq__chain svg{width:15px;height:15px;flex:none;stroke:var(--good);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pq__chain .mono{font-size:12px;font-variant-numeric:tabular-nums}
.pq__chain b{font-weight:700}
.pq__const{margin-top:14px;font-size:14.5px;font-weight:600;letter-spacing:-.01em}
.pq__note{margin-top:6px;font-size:12.5px;line-height:1.55;color:var(--dink3)}
@media (prefers-reduced-motion: no-preference){
  .pq__kit.is-pop .pq__locks .chip{animation:pqPop .45s cubic-bezier(.2,.7,.3,1) both}
  .pq__kit.is-pop .pq__locks .chip:nth-child(2){animation-delay:.14s}
  .pq__kit.is-pop .pq__chain{animation:pqPop .45s cubic-bezier(.2,.7,.3,1) .3s both}
  @keyframes pqPop{0%{opacity:0;transform:translateY(6px) scale(.96)}100%{opacity:1;transform:none}}
}

/* ================================================================
   v8.2 · Guarantee hero: drag the days, then test the slip.
   Reuses the lvh lab primitives; adds the slip test and signature.
   ================================================================ */
.gh{padding:calc(var(--nav-h) + clamp(40px,6vw,72px)) 0 clamp(48px,6.5vw,80px)}
.gh__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:38px;align-items:center}
@media (min-width:1000px){
  .gh{text-align:left}
  .gh__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,4.5vw,72px)}
  .gh .d1{font-size:clamp(2.5rem,3.9vw,3.7rem)}
  .gh .lead{margin-left:0;font-size:clamp(1.08rem,1.45vw,1.26rem)}
  .gh .cta-row{justify-content:flex-start}
  .gh .gh__chips{justify-content:flex-start !important}
  .gh .h1l{display:block}
  html[lang="fr"] .gh .d1{font-size:clamp(2.15rem,3.35vw,3.25rem)}
}
@media (max-width:999px){.gh .d1{text-wrap:balance}}
.gh__lab{text-align:left}
.gh__lab .lvh__what span{max-width:340px}
.gh__eras .lvh__era{font-size:clamp(.98rem,1.35vw,1.14rem)}
.gh__lab .gsig{margin-top:16px;padding-top:16px}
.gh__lab .gsig__name{font-size:15px}
.gh__lab .gseal{width:64px;height:64px}
.gh__lab .gseal b{font-size:19px}
.gcert-note{margin-top:12px}

.gh__slipbtn{appearance:none;display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:8px 16px;border-radius:var(--pill);border:1px solid rgba(224,64,46,.55);background:transparent;color:#ff6a57;font:inherit;font-size:13px;font-weight:600;letter-spacing:-.005em;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.gh__slipbtn::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--hot)}
.gh__slipbtn:hover{background:rgba(224,64,46,.12);border-color:rgba(224,64,46,.8)}
.gh__slipbtn:focus-visible{outline:2px solid #f5f5f7;outline-offset:3px}
.gh__slipbtn[aria-expanded="true"]{background:rgba(224,64,46,.14);color:#ff8272}

.gh__slip{margin-top:12px;border:1px solid rgba(224,64,46,.35);border-radius:var(--r-md);padding:14px 16px;background:rgba(224,64,46,.07)}
@media (prefers-reduced-motion: no-preference){
  .gh__slip{animation:ghSlipIn .4s cubic-bezier(.2,.7,.3,1)}
  @keyframes ghSlipIn{0%{opacity:0;transform:translateY(-6px)}100%{opacity:1;transform:none}}
}
.gh__sliphead{margin-bottom:10px}
.gh__sliphead .chip{white-space:normal;text-align:left;line-height:1.45;padding-top:6px;padding-bottom:6px;height:auto}
.gh__sliphead b{font-variant-numeric:tabular-nums}
.gh__slipline{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;font-weight:500;color:var(--dink);line-height:1.5}
.gh__slipline + .gh__slipline{margin-top:7px}
.gh__slipline svg{width:15px;height:15px;flex:none;margin-top:2px;stroke:var(--good);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gh__slipfoot{margin-top:10px;font-size:12px;color:var(--dink3)}
.gh__ex{margin-top:12px;font-size:12px;color:var(--dink3)}

/* ================================================================
   v8.3 · Contact: the page runs on the intake we sell.
   Split hero, live clock, reason pills, dark form, acknowledgement.
   ================================================================ */
.ct{padding:calc(var(--nav-h) + clamp(40px,6vw,72px)) 0 clamp(48px,6.5vw,80px)}
.ct__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:38px;align-items:start}
@media (min-width:1000px){
  .ct{text-align:left}
  .ct__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,4.5vw,72px);align-items:center}
  .ct .d1{font-size:clamp(2.35rem,3.6vw,3.4rem)}
  .ct .lead{margin-left:0;font-size:clamp(1.06rem,1.4vw,1.22rem)}
  .ct .cta-row{justify-content:flex-start}
  .ct .ct__chips{justify-content:flex-start !important}
  .ct .h1l{display:block}
  .ct__ch{justify-items:start}
  html[lang="fr"] .ct .d1{font-size:clamp(2rem,3vw,2.9rem)}
}
@media (max-width:999px){.ct .d1{text-wrap:balance}.ct__ch{justify-items:center}.ct__row{justify-content:center}}
.ct__ch{margin-top:24px;display:grid;gap:10px}
.ct__row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px}
.ct__k{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--dink3);min-width:52px;text-align:left}
.ct__v{color:var(--dink)}
.ct__v.mono{font-size:12.5px}
.ct__copy{appearance:none;font:inherit;font-size:11.5px;font-weight:600;color:var(--dink2);background:transparent;border:1px solid var(--dline2);border-radius:var(--pill);padding:4px 11px;cursor:pointer;transition:border-color .2s,color .2s}
.ct__copy:hover{border-color:rgba(245,245,247,.6);color:#fff}
.ct__copy:focus-visible{outline:2px solid #f5f5f7;outline-offset:2px}
.ct__copy.is-done{color:var(--good);border-color:rgba(48,209,88,.55)}

.ct__lab{text-align:left}
.ct__lab .lvh__what span{max-width:300px}
.ct__clock{display:inline-flex;align-items:center;gap:7px;flex:none}
.ct__clock .mono{font-size:12px;font-variant-numeric:tabular-nums}
.ct__clock i{width:7px;height:7px;border-radius:50%;background:var(--good)}
@media (prefers-reduced-motion: no-preference){
  .ct__clock i{animation:ctPulse 2.2s ease-in-out infinite}
  @keyframes ctPulse{0%,100%{opacity:1}50%{opacity:.35}}
}
.ct__tabs{display:flex;margin:4px 0 12px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.ct__tabs::-webkit-scrollbar{display:none}
.ct__tabs button{white-space:nowrap}
.ct__hints{display:grid;margin-bottom:16px}
.ct__hint{grid-area:1/1;font-size:12.5px;line-height:1.55;color:var(--dink3);opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .35s,transform .35s,visibility 0s .35s}
.ct__hint.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .35s .05s,transform .35s .05s,visibility 0s 0s}
.ct__hint a{color:var(--dink);text-decoration:underline;text-underline-offset:3px}
@media (prefers-reduced-motion: reduce){.ct__hint{transition:none;transform:none}}

.ct__lab .field{margin-bottom:12px}
.ct__lab .field label{display:block;font-size:12px;color:var(--dink2);margin-bottom:6px}
.ct__lab .field input,.ct__lab .field textarea{width:100%;background:rgba(255,255,255,.06);border:1px solid var(--dline2);border-radius:var(--r-sm);color:var(--dink);padding:10px 12px;font:inherit;font-size:14px;transition:border-color .2s,background .2s}
.ct__lab .field input:focus,.ct__lab .field textarea:focus{outline:none;border-color:rgba(245,245,247,.55);background:rgba(255,255,255,.09)}
.ct__lab .field textarea{resize:vertical;min-height:96px}
.ct__frow{display:grid;gap:0 12px}
@media (min-width:640px){.ct__frow{grid-template-columns:1fr 1fr}}
.ct__legal{color:var(--dink3)}
.ct__lab #ctFallback{color:var(--dink2)}

.ct__ack{padding-top:2px}
.ct__ackhead{margin-bottom:12px}
.ct__ackhead .mono{font-variant-numeric:tabular-nums}
.ct__ackline{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;font-weight:500;color:var(--dink);line-height:1.5}
.ct__ackline + .ct__ackline{margin-top:7px}
.ct__ackline svg{width:15px;height:15px;flex:none;margin-top:2px;stroke:var(--good);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ct__ackfoot{margin-top:14px;font-size:12.5px;line-height:1.6;color:var(--dink3)}
.ct__ackfoot .link{color:var(--dink)}
@media (prefers-reduced-motion: no-preference){
  .ct__ack.is-in .ct__ackline{opacity:0;animation:ctIn .45s cubic-bezier(.2,.7,.3,1) both}
  .ct__ack.is-in .ct__ackline:nth-of-type(2){animation-delay:.16s}
  .ct__ack.is-in .ct__ackline:nth-of-type(3){animation-delay:.32s}
  .ct__ack.is-in .ct__ackfoot{opacity:0;animation:ctIn .45s cubic-bezier(.2,.7,.3,1) .5s both}
  @keyframes ctIn{0%{opacity:0;transform:translateY(6px)}100%{opacity:1;transform:none}}
}
@media (min-width:1000px) and (max-width:1280px){
  .nav__links{gap:18px}
  html[lang="fr"] .nav__links{gap:15px}
  .nav__links a{font-size:13px}
}
