:root{--ink:#0F1F1A;--ink-2:#36463F;--muted:#56645E;--line:#DCE4E0;--soft:#F3F7F5;--mint:#E3F3EC;--brand:#27AC7F;--brand-ink:#0F6E4E;--brand-ink-h:#0A573D;--warn-ink:#7A4300;--warn-bg:#FFF3DC;--warn-line:#D9962B}
*{box-sizing:border-box}
.rp{font-family:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink);background:#fff;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
.rp h1,.rp h2,.rp h3,.rp h4,.display{font-family:'Bricolage Grotesque','Geist',sans-serif;letter-spacing:-0.02em;line-height:1.08;margin:0;color:inherit}
.rp h1{font-size:clamp(38px,5vw,64px);font-weight:700}
.rp h2{font-size:clamp(28px,3.3vw,44px);font-weight:650}
.rp h3{font-size:21px;font-weight:600;letter-spacing:-0.01em;line-height:1.25}
.rp p{margin:0}
.rp ul{margin:0;padding:0;list-style:none}
/* Modern Full-Screen Responsive Layout */
.wrap{width:100%;max-width:1440px;margin:0 auto;padding:0 clamp(20px,3.5vw,56px)}
.narrow{max-width:960px}
.nav-in.wrap{max-width:1680px;padding:0 clamp(20px,3.5vw,64px)}
@media (min-width:1600px){
  .wrap{max-width:1560px;padding:0 clamp(32px,4vw,72px)}
  .nav-in.wrap{max-width:1760px;padding:0 clamp(32px,4vw,80px)}
  .narrow{max-width:1040px}
}
@media (min-width:1920px){
  .wrap{max-width:1680px;padding:0 clamp(40px,4.5vw,88px)}
  .nav-in.wrap{max-width:1880px;padding:0 clamp(40px,4.5vw,96px)}
  .narrow{max-width:1120px}
}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(36px,4.5vw,72px);align-items:center}
.hero-copy{max-width:820px}
.hd{width:100%;max-width:620px;margin-left:auto}
@media (max-width:1280px) and (min-width:901px){
  .plans{grid-template-columns:repeat(3,minmax(0,1fr))}
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .f-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .f-brand{grid-column:1/-1}
  .nav-links{gap:clamp(2px,1vw,8px)}
  .nav-btn{padding:0 8px;font-size:14.5px}
}
@media (max-width:1060px) and (min-width:901px){
  .hero-grid{gap:28px}
  .nav-login{padding:0 8px}
  .nav-cta-full{padding:0 12px;font-size:14px}
}
.narrow{max-width:860px}
.section{padding:96px 0}
.section.tight{padding:64px 0}
.section.soft{background:var(--soft)}
.eyebrow{font:600 13px/1.2 'Geist',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-ink);display:inline-flex;gap:8px;align-items:center}
.lede{font-size:20px;line-height:1.5;color:var(--ink-2);max-width:640px}
.body{color:var(--ink-2);max-width:720px}
.stack{display:flex;flex-direction:column;gap:16px}
.stack-lg{display:flex;flex-direction:column;gap:24px}
.head{max-width:760px;display:flex;flex-direction:column;gap:16px;margin-bottom:48px}
.head.center{margin-left:auto;margin-right:auto;text-align:center;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border-radius:10px;font:600 16px/1 'Geist',sans-serif;text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--brand-ink);color:#fff}
.btn-primary:hover{background:var(--brand-ink-h)}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--ink)}
.btn-sm{min-height:44px;padding:0 16px;font-size:15px}
.btn-block{width:100%}
.micro{font-size:14px;color:var(--muted)}
.link{color:var(--brand-ink);font-weight:600;text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.link:hover{text-decoration:underline}
.cta-block{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.cta-row{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.hero{padding:72px 0 96px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:24px}
.proof{display:flex;flex-wrap:wrap;gap:12px 24px;padding-top:20px;border-top:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.proof span{display:inline-flex;align-items:center;gap:8px}
.tick{width:20px;height:20px;border-radius:50%;background:var(--mint);color:var(--brand-ink);display:inline-grid;place-items:center;flex:none}
.footnote{font-size:13px;color:var(--muted)}
.mock{border:1px solid var(--line);border-radius:18px;background:var(--soft);padding:24px;position:relative}
.mock-tag{position:absolute;top:-13px;left:18px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 11px;font-size:12px;color:var(--muted);font-weight:500}
.mock-browser{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.mock-bar{height:34px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:6px;padding:0 12px}
.mock-bar i{width:9px;height:9px;border-radius:50%;background:var(--line);display:block}
.mock-body{display:grid;grid-template-columns:minmax(0,1fr) 240px;min-height:300px}
.mock-profile{padding:22px;display:flex;flex-direction:column;gap:10px}
.sk{height:10px;border-radius:6px;background:#E5ECE8}
.avatar{width:58px;height:58px;border-radius:50%;background:#D3E5DC}
.mock-name{font-weight:600;font-size:16px}
.mock-role{font-size:13px;color:var(--muted)}
.mock-panel{border-left:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:12px;background:#FBFDFC}
.panel-head{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px}
.field{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff}
.field-label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:6px}
.field-val{font-family:'Geist Mono',monospace;font-size:14px;margin-top:5px;color:var(--ink)}
.field-empty{font-family:'Geist Mono',monospace;font-size:14px;margin-top:5px;color:#9AA7A1}
.mock-cap{font-size:12.5px;color:var(--muted);margin-top:12px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.card{border:1px solid var(--line);border-radius:16px;padding:28px;background:#fff;display:flex;flex-direction:column;gap:12px}
.card.soft{background:var(--soft);border-color:var(--soft)}
.card p{color:var(--ink-2)}
.icon{width:46px;height:46px;border-radius:12px;background:var(--mint);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.num{font:600 14px/1 'Geist Mono',monospace;color:var(--brand-ink);background:var(--mint);width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex:none}
.note{font-size:14px;color:var(--muted);font-style:italic}
.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:13px;color:var(--ink-2);background:#fff;font-weight:500}
.checks{display:flex;flex-direction:column;gap:12px}
.checks li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-2)}
.crosses li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-2)}
.x{width:20px;height:20px;border-radius:50%;background:#EEF1F0;color:var(--muted);display:inline-grid;place-items:center;flex:none;margin-top:2px}
.table-box{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:#fff}
.rp table{width:100%;border-collapse:collapse;font-size:15px}
.rp th,.rp td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.rp th{font-weight:600;background:var(--soft);font-size:14px}
.rp tr:last-child td{border-bottom:0}
.rp td.c,.rp th.c{text-align:center}
.faq{border-top:1px solid var(--line);max-width:880px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;background:none;border:0;padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;text-align:left;font:600 18px/1.35 'Geist',sans-serif;color:var(--ink);cursor:pointer;min-height:44px}
.faq-q:hover{color:var(--brand-ink)}
.faq-a{padding:0 40px 24px 0;color:var(--ink-2);max-width:760px}
.gate{display:inline-flex;align-items:center;gap:6px;font:600 11px/1.3 'Geist Mono',monospace;color:var(--warn-ink);background:var(--warn-bg);border:1px dashed var(--warn-line);border-radius:6px;padding:3px 8px;letter-spacing:.01em;vertical-align:middle;white-space:normal;text-transform:none}
.gate.on{color:#0B5A40;background:#E3F3EC;border-color:#2E9C73}
.review{background:#14231E;color:#D3E2DB;font-size:13px}
.review .wrap{display:flex;gap:10px 16px;align-items:center;flex-wrap:wrap;padding-top:9px;padding-bottom:9px}
.review b{color:#fff;font-weight:600}
.blocked{border:2px dashed var(--warn-line);background:var(--warn-bg);color:var(--warn-ink);border-radius:14px;padding:18px 22px;display:flex;flex-direction:column;gap:6px;font-size:15px}
.blocked b{font-weight:700}
.nav{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--line)}
.nav-in{height:72px;display:flex;align-items:center;gap:24px}
.logo{display:inline-flex;align-items:center;gap:10px;font:700 21px/1 'Bricolage Grotesque',sans-serif;color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.logo-mark{width:32px;height:32px;border-radius:9px;background:var(--brand);display:grid;place-items:center;color:#fff;flex:none}
.nav-links{display:flex;gap:2px;align-items:center;flex:1}
.nav-item{position:relative}
.nav-btn{background:none;border:0;font:500 15.5px/1 'Geist',sans-serif;color:var(--ink);padding:0 12px;border-radius:8px;display:inline-flex;gap:6px;align-items:center;cursor:pointer;text-decoration:none;min-height:44px}
.nav-btn:hover,.nav-item.open .nav-btn{background:var(--soft)}
.dd{position:absolute;top:100%;left:-8px;padding-top:10px;display:none;z-index:40}
.nav-item:hover .dd,.nav-item:focus-within .dd,.nav-item.open .dd{display:block}
.dd-panel{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 44px rgba(15,31,26,.14);padding:14px;display:grid;gap:4px;min-width:320px}
.dd-panel.two{grid-template-columns:repeat(2,minmax(0,270px));gap:4px 14px}
.dd-group{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:8px 12px 4px}
.dd-link{display:flex;flex-direction:column;gap:3px;padding:11px 12px;border-radius:10px;text-decoration:none;color:var(--ink)}
.dd-link:hover{background:var(--soft)}
.dd-link b{font-weight:600;font-size:15px}
.dd-link span{font-size:13.5px;color:var(--muted);line-height:1.4}
.nav-right{display:flex;align-items:center;gap:6px;margin-left:auto}
.nav-login{color:var(--ink);text-decoration:none;font-weight:500;font-size:15.5px;padding:0 14px;min-height:44px;display:inline-flex;align-items:center;border-radius:8px}
.nav-login:hover{background:var(--soft)}
.nav-cta-short{display:none}
.burger{display:none;width:44px;height:44px;border-radius:10px;border:1px solid var(--line);background:#fff;place-items:center;cursor:pointer;color:var(--ink)}
.m-menu{border-top:1px solid var(--line);padding:8px 0 24px;background:#fff}
.m-sec{border-bottom:1px solid var(--line)}
.m-sec-btn{width:100%;background:none;border:0;display:flex;justify-content:space-between;align-items:center;font:600 17px 'Geist',sans-serif;color:var(--ink);padding:16px 0;cursor:pointer;min-height:52px}
.m-group{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:8px 0 2px}
.m-link{display:flex;justify-content:space-between;align-items:center;padding:12px 0;color:var(--ink);text-decoration:none;font-size:16px;min-height:44px}
.m-top{display:block;padding:16px 0;border-bottom:1px solid var(--line);font:600 17px 'Geist',sans-serif;color:var(--ink);text-decoration:none}
.m-cta{padding-top:20px;display:flex;flex-direction:column;gap:10px}
.tag-small{font-size:12px;color:var(--muted);font-weight:500}
.footer{background:var(--ink);color:#C9D9D2;padding:72px 0 32px;font-size:15px}
.f-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr));gap:32px}
.f-brand{display:flex;flex-direction:column;gap:16px;max-width:300px}
.f-brand .logo{color:#fff}
.f-col h4{font:600 12.5px/1.2 'Geist',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#fff;margin:0 0 14px}
.f-col a{display:flex;gap:6px;align-items:center;flex-wrap:wrap;color:#C9D9D2;text-decoration:none;padding:6px 0}
.f-col a:hover{color:#fff;text-decoration:underline}
.f-bottom{border-top:1px solid #2A3B35;margin-top:48px;padding-top:24px;display:flex;flex-direction:column;gap:8px;font-size:13px;color:#A6BBB2}
.cta-band{background:var(--ink);color:#fff;border-radius:24px;padding:64px;display:flex;justify-content:space-between;gap:32px;align-items:center;flex-wrap:wrap}
.cta-band h2{max-width:640px}
.cta-band p{color:#C9D9D2}
.cta-band .micro{color:#B6CBC2}
.cta-band .btn-primary{background:#3DBE8F;color:#0F1F1A}
.cta-band .btn-primary:hover{background:#5FD0A6}
.stat{font:700 clamp(80px,11vw,140px)/0.9 'Bricolage Grotesque',sans-serif;color:var(--brand-ink);letter-spacing:-.04em}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.plans{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:stretch}
.plan{border:1px solid var(--line);border-radius:18px;padding:24px;background:#fff;display:flex;flex-direction:column;gap:16px}
.plan-name{font:650 22px/1.1 'Bricolage Grotesque',sans-serif}
.price{font:700 34px/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.02em}
.price small{font:500 14px 'Geist',sans-serif;color:var(--muted);letter-spacing:0}
.credits{display:flex;flex-direction:column;gap:6px;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:14.5px}
.credits div{display:flex;justify-content:space-between;gap:8px}
.plan ul{display:flex;flex-direction:column;gap:9px;font-size:14.5px;color:var(--ink-2);flex:1}
.plan li{display:flex;gap:8px;align-items:flex-start}
.toggle{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:4px;background:#fff;gap:4px}
.toggle button{border:0;background:none;border-radius:999px;padding:0 18px;min-height:40px;font:600 14.5px 'Geist',sans-serif;color:var(--ink-2);cursor:pointer}
.toggle button.active{background:var(--ink);color:#fff}
.flow{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.node{border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:#fff;font-size:14px;font-weight:500;color:var(--ink);text-decoration:none}
.node.ext{border-style:dashed;background:var(--soft)}
.node.blk{border-style:dashed;border-color:var(--warn-line);background:var(--warn-bg);color:var(--warn-ink)}
.arrow{color:var(--muted);font-size:18px}
.swatch{height:84px;border-radius:12px;border:1px solid var(--line)}
.kbd{font:500 13px 'Geist Mono',monospace;background:var(--soft);border:1px solid var(--line);border-radius:6px;padding:2px 7px}
.legal-body{display:flex;flex-direction:column;gap:20px;color:var(--ink-2)}
.legal-body h3{color:var(--ink)}
.form{display:flex;flex-direction:column;gap:18px}
.form label{display:flex;flex-direction:column;gap:7px;font-weight:600;font-size:15px}
.form input,.form select,.form textarea{font:400 16px 'Geist',sans-serif;color:var(--ink);border:1px solid #C3CFC9;border-radius:10px;padding:12px 14px;min-height:48px;background:#fff}
.form textarea{min-height:130px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--brand);outline-offset:1px;border-color:var(--brand)}
.form .opt{font-weight:400;color:var(--muted);font-size:13.5px}
.alert-ok{background:var(--mint);border:1px solid #9FD4BE;border-radius:12px;padding:16px 18px;color:#0B5A40;font-weight:500}
.chip-row{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:0 16px;min-height:40px;font:600 14px 'Geist',sans-serif;color:var(--ink-2);cursor:pointer}
.chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.placeholder{font-family:'Geist Mono',monospace;font-size:13.5px;color:var(--warn-ink);background:var(--warn-bg);border-radius:6px;padding:2px 6px}
@media (max-width:1180px){.plans{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.f-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.f-brand{grid-column:1/-1}}
@media (max-width:900px){
.nav-links,.nav-login,.nav-cta-full{display:none}
.nav-cta-short{display:inline-flex}
.burger{display:grid}
.nav-in{height:64px;gap:12px}
.wrap{padding:0 20px}
.section{padding:64px 0}
.section.tight{padding:48px 0}
.hero{padding:40px 0 64px}
.hero-grid,.grid-2,.grid-3,.split{grid-template-columns:minmax(0,1fr);gap:28px}
.grid-4{grid-template-columns:minmax(0,1fr)}
.mock{padding:16px}
.mock-body{grid-template-columns:minmax(0,1fr)}
.mock-profile{display:none}
.mock-panel{border-left:0}
.lede{font-size:18px}
.card{padding:22px}
.head{margin-bottom:32px}
.cta-band{padding:36px 24px;border-radius:18px}
.plans{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding-bottom:8px}
.plan{flex:0 0 84%;scroll-snap-align:start}
.f-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.faq-q{font-size:17px}
.faq-a{padding-right:0}
.problem-copy{display:none}
.btn{white-space:normal;text-align:center}
}
/* v2 additions */
.logo img{width:30px;height:30px;object-fit:contain;display:block}
.f-brand .logo img{background:#fff;border-radius:8px;padding:3px;width:34px;height:34px}
.shot{margin:0;display:flex;flex-direction:column;gap:12px}
.shot-stage{background:#E6F2EC;border-radius:24px;padding:40px 32px;display:flex;justify-content:center;align-items:flex-start;gap:20px;position:relative;overflow:hidden}
.shot img{width:100%;max-width:340px;height:auto;border-radius:16px;box-shadow:0 24px 56px rgba(15,31,26,.16);border:1px solid #D3E2DB;display:block;background:#fff}
.shot .back{max-width:270px;margin-top:56px;opacity:.97}
.shot-cap{font-size:13px;color:var(--muted)}
.rail{display:flex;flex-direction:column;border-left:2px solid var(--line);margin-left:17px}
.rail-item{position:relative;padding:0 0 36px 36px;display:flex;flex-direction:column;gap:8px}
.rail-item:last-child{padding-bottom:0}
.rail-item .num{position:absolute;left:-18px;top:-2px;background:var(--brand-ink);color:#fff}
.rail-item p{color:var(--ink-2)}
.lanes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.lane{padding:28px;display:flex;flex-direction:column;gap:12px;border-right:1px solid var(--line)}
.lane:last-child{border-right:0}
.lane .tag{font:600 12px 'Geist Mono',monospace;color:var(--brand-ink);letter-spacing:.06em;text-transform:uppercase}
.dia{display:flex;align-items:stretch;gap:14px;flex-wrap:wrap}
.dia-node{flex:1 1 160px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:8px}
.dia-arrow{display:flex;align-items:center;color:var(--brand-ink)}
.plan-adds{background:var(--mint);color:#0B5A40;border-radius:10px;padding:10px 12px;font-weight:600;font-size:14px}
.yes{color:var(--brand-ink);font-weight:700}
.no{color:#A3B0AA}
.sticky-col th:first-child,.sticky-col td:first-child{position:sticky;left:0;background:#fff;z-index:1}
.sticky-col th:first-child{background:var(--soft)}
.legal-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;align-items:start}
.toc{position:sticky;top:96px;display:flex;flex-direction:column;gap:2px;font-size:14px;border-left:2px solid var(--line);padding-left:16px}
.toc a{color:var(--ink-2);text-decoration:none;padding:5px 0}
.toc a:hover{color:var(--brand-ink)}
.legal-body{font-size:16.5px;line-height:1.65}
.legal-body h2{font-size:24px;margin-top:20px}
.legal-body h3{font-size:19px;margin-top:6px}
.legal-body h4{font:600 16px 'Geist',sans-serif;margin:4px 0 0;color:var(--ink)}
.legal-body ul{list-style:disc;padding-left:22px;display:flex;flex-direction:column;gap:8px}
.legal-body a{color:var(--brand-ink)}
.vs-badges{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.vs-badge{border:1px solid var(--line);border-radius:12px;padding:10px 16px;font:650 18px 'Bricolage Grotesque',sans-serif;background:#fff}
.vs-badge.rp{display:inline-flex;gap:10px;align-items:center;border-color:#9FD4BE;background:var(--mint)}
.vs-badge.rp img{width:24px;height:24px}
.vs-x{font:600 14px 'Geist Mono',monospace;color:var(--muted)}
.src{font-size:13px;color:var(--muted)}
.statband{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.statband .card{gap:6px}
.statband .big{font:700 44px/1 'Bricolage Grotesque',sans-serif;color:var(--brand-ink);letter-spacing:-.02em}
@media (max-width:900px){
.shot-stage{padding:22px 16px}
.shot .back{display:none}
.lanes{grid-template-columns:minmax(0,1fr)}
.lane{border-right:0;border-bottom:1px solid var(--line)}
.lane:last-child{border-bottom:0}
.dia-arrow{transform:rotate(90deg);justify-content:center;width:100%}
.legal-layout{grid-template-columns:minmax(0,1fr);gap:24px}
.toc{position:static}
.statband{grid-template-columns:minmax(0,1fr)}
}
/* ===== RioPulse motion system (v3) ===== */
:root{--ease-out:cubic-bezier(.2,.7,.2,1);--ease-io:cubic-bezier(.65,0,.35,1);--m-fast:140ms;--m-base:220ms;--m-slow:420ms}
/* Buttons: hover lift, pressed sink, visible focus */
.btn{transition:transform var(--m-fast) var(--ease-out),box-shadow var(--m-fast) var(--ease-out),background-color var(--m-fast),border-color var(--m-fast)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(15,110,78,.22)}
.btn-ghost:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.98);box-shadow:none}
.rp a:focus-visible,.rp button:focus-visible,.rp [tabindex]:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:8px}
.toggle button{transition:background-color var(--m-base) var(--ease-out),color var(--m-base)}
/* Arrow indicators on links inside cards and on .arrow links */
.card .link::after,.link.arrow::after{content:"\2192";display:inline-block;transition:transform var(--m-base) var(--ease-out)}
.card:hover .link::after,.card:focus-within .link::after,.link.arrow:hover::after{transform:translateX(4px)}
/* Cards with a destination lift on hover */
.card:has(a.link),a.card,.lift{transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base) var(--ease-out),border-color var(--m-base)}
.card:has(a.link):hover,a.card:hover,.lift:hover,.card:has(a.link):focus-within,a.card:focus-within{transform:translateY(-4px);box-shadow:0 18px 40px rgba(15,31,26,.10);border-color:#B7D6C8}
/* Product cards reveal a short supporting explanation */
.pcard .more{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--m-slow) var(--ease-out),opacity var(--m-base)}
.pcard .more>div{overflow:hidden}
.pcard:hover .more,.pcard:focus-within .more,.pcard.open .more{grid-template-rows:1fr;opacity:1}
.pcard .more-hint{font-size:13px;color:var(--muted)}
.pcard:hover .more-hint,.pcard:focus-within .more-hint{opacity:0}
/* Touch devices: no hover. Reveal content is always shown; taps give a pressed state */
@media (hover:none){
 .pcard .more{grid-template-rows:1fr;opacity:1}
 .pcard .more-hint{display:none}
 .card:has(a.link):hover,a.card:hover,.lift:hover{transform:none;box-shadow:none}
 .card:has(a.link):active,a.card:active,.lift:active{transform:scale(.985);background:var(--soft)}
 .btn-primary:hover{transform:none;box-shadow:none}
}
/* Workflow stepper: Know the contact > Enrich > Verify > Reach out */
.flow4{display:flex;flex-direction:column;gap:28px}
.flow4-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.flow4-tab{position:relative;display:flex;gap:12px;align-items:flex-start;text-align:left;border:1px solid var(--line);background:#fff;border-radius:14px;padding:16px 16px 20px;cursor:pointer;font:inherit;color:var(--ink);overflow:hidden;transition:border-color var(--m-base),box-shadow var(--m-base),transform var(--m-fast) var(--ease-out)}
.flow4-tab:hover{border-color:#B7D6C8;transform:translateY(-2px)}
.flow4-tab:active{transform:scale(.98)}
.flow4-tab b{display:block;font:650 17px/1.2 'Bricolage Grotesque',sans-serif}
.flow4-sub{display:block;font-size:13.5px;color:var(--muted);margin-top:4px}
.flow4-tab .num{transition:background-color var(--m-base),color var(--m-base)}
.flow4-tab.on{border-color:var(--brand-ink);box-shadow:0 10px 26px rgba(15,110,78,.12)}
.flow4-tab.on .num{background:var(--brand-ink);color:#fff}
.flow4-tab.done .num{background:#CFEBDD}
.flow4-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--brand);transform:scaleX(0);transform-origin:left}
.flow4-tab.done .flow4-bar{transform:scaleX(1);background:#9FD4BE}
.flow4-tab.on .flow4-bar{transform:scaleX(1)}
.flow4-tab.on.playing .flow4-bar{animation:rp-fill 2.8s linear both}
.flow4-panel{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;align-items:center}
.flow4-copy{display:flex;flex-direction:column;gap:14px}
.flow4-copy .step-k{font:600 13px 'Geist Mono',monospace;color:var(--brand-ink);letter-spacing:.06em}
.flow4 .shot img.swap-a{animation:rp-swap-a var(--m-slow) var(--ease-out) both}
.flow4 .shot img.swap-b{animation:rp-swap-b var(--m-slow) var(--ease-out) both}
.flow4-copy.swap-a{animation:rp-swap-a var(--m-slow) var(--ease-out) both}
.flow4-copy.swap-b{animation:rp-swap-b var(--m-slow) var(--ease-out) both}
.flow4-ctrl{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.flow4-ctrl .btn-ghost{min-height:40px;padding:0 14px;font-size:14px}
@media (max-width:900px){.flow4-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.flow4-panel{grid-template-columns:minmax(0,1fr);gap:20px}.flow4-sub{display:none}}
@keyframes rp-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes rp-swap-a{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes rp-swap-b{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
/* Metrics count up once (handled in page logic); numbers keep tabular width */
.statband .big,.stat{font-variant-numeric:tabular-nums}
/* Booking stepper */
.steps3{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:14px;font-weight:600;color:var(--muted)}
.steps3 .s{display:inline-flex;gap:8px;align-items:center}
.steps3 .s .num{width:28px;height:28px;font-size:13px}
.steps3 .s.on{color:var(--ink)}
.steps3 .s.on .num{background:var(--brand-ink);color:#fff}
.steps3 .s.done .num{background:#CFEBDD}
.steps3 .sep{width:28px;height:1px;background:var(--line)}
.ph{border:2px dashed #C9A15A;background:#FFF8EA;border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:10px;color:#5C3D00}
.ph-tag{align-self:flex-start;font:600 12px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;background:#F5DFAE;color:#5C3D00;border-radius:6px;padding:4px 8px}
.fade-in{animation:rp-swap-a var(--m-slow) var(--ease-out) both}
.err{color:#B42318;font-size:13.5px;font-weight:500}
.form [aria-invalid="true"]{border-color:#D92D20}
/* Sections enter view with subtle staggered motion (CSS scroll-driven, no script) */
@keyframes rp-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
 @supports (animation-timeline:view()){
  .section .head,.grid-2>*,.grid-3>*,.grid-4>*,.statband>*,.lanes>*,.dia>.dia-node,.plans>.plan,.rail>.rail-item,.flow4-tabs>*,.shot{animation:rp-rise linear both;animation-timeline:view();animation-range:entry 5% entry 45%}
  .grid-2>:nth-child(2),.grid-3>:nth-child(2),.grid-4>:nth-child(2),.statband>:nth-child(2),.lanes>:nth-child(2),.plans>:nth-child(2),.flow4-tabs>:nth-child(2),.rail>:nth-child(2){animation-range:entry 10% entry 50%}
  .grid-3>:nth-child(3),.grid-4>:nth-child(3),.statband>:nth-child(3),.lanes>:nth-child(3),.plans>:nth-child(3),.flow4-tabs>:nth-child(3),.rail>:nth-child(3){animation-range:entry 15% entry 55%}
  .grid-4>:nth-child(4),.plans>:nth-child(4),.flow4-tabs>:nth-child(4),.rail>:nth-child(4){animation-range:entry 20% entry 60%}
  .plans>:nth-child(5){animation-range:entry 25% entry 65%}
 }
}
/* Reduced motion: everything static and fully visible */
@media (prefers-reduced-motion:reduce){
 .rp *,.rp *::before,.rp *::after{animation:none!important;transition:none!important}
 .btn:hover,.btn:active,.card:hover,a.card:hover,.lift:hover,.flow4-tab:hover{transform:none!important}
 .pcard .more{grid-template-rows:1fr;opacity:1}
 .pcard .more-hint{display:none}
}
/* Same static state on demand (motion examples board) */
.rm *,.rm *::before,.rm *::after{animation:none!important;transition:none!important}
.rm .btn:hover,.rm .btn:active,.rm .card:hover,.rm a.card:hover,.rm .lift:hover,.rm .flow4-tab:hover{transform:none!important;box-shadow:none!important}
.rm .pcard .more{grid-template-rows:1fr;opacity:1}
.rm .pcard .more-hint{display:none}

/* ===== RioPulse v4: motion-first components ===== */
:root{--spring:cubic-bezier(.34,1.4,.64,1);--glow:0 30px 80px rgba(15,110,78,.18);--depth-1:0 1px 2px rgba(15,31,26,.06),0 8px 24px rgba(15,31,26,.06);--depth-2:0 2px 4px rgba(15,31,26,.06),0 24px 56px rgba(15,31,26,.12)}

/* --- Navigation: animated dropdowns and mobile menu --- */
.dd{display:block;opacity:0;visibility:hidden;transform:translateY(8px) scale(.98);transform-origin:top left;transition:opacity var(--m-base) var(--ease-out),transform var(--m-base) var(--ease-out),visibility 0s linear var(--m-base)}
.nav-item:hover .dd,.nav-item:focus-within .dd,.nav-item.open .dd{opacity:1;visibility:visible;transform:none;transition:opacity var(--m-base) var(--ease-out),transform var(--m-base) var(--ease-out),visibility 0s}
.nav-btn svg{transition:transform var(--m-base) var(--ease-out)}
.nav-item:hover .nav-btn svg,.nav-item.open .nav-btn svg,.nav-item:focus-within .nav-btn svg{transform:rotate(180deg)}
.dd-link{position:relative;transition:background-color var(--m-fast),transform var(--m-fast) var(--ease-out)}
.dd-link b::after{content:"\2192";display:inline-block;margin-left:6px;opacity:0;transform:translateX(-4px);transition:opacity var(--m-fast),transform var(--m-base) var(--ease-out);color:var(--brand-ink)}
.dd-link:hover b::after,.dd-link:focus-visible b::after{opacity:1;transform:none}
.m-menu{animation:rp-drop var(--m-slow) var(--ease-out) both;transform-origin:top}
.m-menu .m-sec,.m-menu .m-top,.m-menu .m-cta{animation:rp-swap-a var(--m-slow) var(--ease-out) both}
.m-menu .m-sec:nth-child(2){animation-delay:40ms}.m-menu .m-top{animation-delay:80ms}.m-menu .m-cta{animation-delay:120ms}
.burger svg{transition:transform var(--m-base) var(--ease-out)}
.burger[aria-expanded="true"] svg{transform:rotate(90deg)}
@keyframes rp-drop{from{opacity:0;transform:translateY(-8px) scaleY(.96)}to{opacity:1;transform:none}}

/* --- FAQ: native details with smooth height --- */
.faq details{border-bottom:1px solid var(--line);interpolate-size:allow-keywords}
.faq summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;font:600 18px/1.35 'Geist',sans-serif;color:var(--ink);min-height:44px;transition:color var(--m-fast)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--brand-ink)}
.faq summary .pm{flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;transition:transform var(--m-base) var(--ease-out),background-color var(--m-base),border-color var(--m-base)}
.faq summary .pm::before{content:"+";font:500 20px/1 'Geist',sans-serif}
.faq details[open] summary .pm{transform:rotate(45deg);background:var(--mint);border-color:#9FD4BE}
.faq details::details-content{block-size:0;overflow:hidden;transition:block-size var(--m-slow) var(--ease-out),content-visibility var(--m-slow) allow-discrete}
.faq details[open]::details-content{block-size:auto}
.faq details .faq-a{animation:none}
.faq details[open] .faq-a{animation:rp-swap-a var(--m-slow) var(--ease-out) both}

/* --- Hero backdrop --- */
.hero.hx{position:relative;overflow:hidden;background:radial-gradient(1200px 520px at 85% 10%,#DDF3E8 0%,rgba(221,243,232,0) 60%),radial-gradient(800px 420px at 0% 100%,#EEF8F3 0%,rgba(238,248,243,0) 70%),#fff}
.hero.hx::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(15,110,78,.10) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,rgba(0,0,0,.6),transparent 75%);pointer-events:none}
.hero.hx .wrap{position:relative}
.hero h1 .hl{background:linear-gradient(90deg,var(--brand-ink),#27AC7F);-webkit-background-clip:text;background-clip:text;color:transparent}

/* --- Hero demo: animated enrichment composition --- */
.hd{position:relative;display:flex;flex-direction:column;gap:14px}
.hd-stage{position:relative;min-height:660px;border-radius:24px;background:linear-gradient(160deg,#F4FBF7,#E3F3EC);border:1px solid #D3E8DD;box-shadow:var(--glow);overflow:hidden;padding:26px}
.hd-label{position:absolute;top:14px;left:16px;font:600 11px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:#4D6B5E;background:rgba(255,255,255,.8);border:1px solid #D3E8DD;border-radius:999px;padding:4px 10px;z-index:5}
.hd-profile{position:absolute;left:26px;top:52px;width:52%;background:#fff;border-radius:16px;border:1px solid #E1EAE5;box-shadow:var(--depth-1);overflow:hidden}
.hd-cover{height:64px;background:linear-gradient(120deg,#C9D6DF,#E5ECF0)}
.hd-pbody{padding:0 18px 18px;display:flex;flex-direction:column;gap:6px}
.hd-avatar{width:64px;height:64px;border-radius:50%;border:4px solid #fff;margin-top:-32px;background:linear-gradient(135deg,#2E6FB7,#5A97D6);color:#fff;display:grid;place-items:center;font:700 22px 'Geist',sans-serif}
.hd-name{font:700 19px/1.2 'Geist',sans-serif;color:#111}
.hd-role{font-size:14px;color:#555}
.hd-loc{font-size:13px;color:#777}
.hd-line{height:8px;border-radius:4px;background:#EEF1F3}
.hd-panel{position:absolute;right:22px;top:84px;width:50%;background:#fff;border-radius:18px;border:1px solid #D9E6DF;box-shadow:var(--depth-2);padding:16px;display:flex;flex-direction:column;gap:10px;z-index:3}
.hd-ph{display:flex;align-items:center;gap:8px;font:650 14px 'Geist',sans-serif;color:var(--ink)}
.hd-ph img{width:22px;height:22px}
.hd-cred{margin-left:auto;white-space:nowrap;font:500 12px 'Geist Mono',monospace;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:3px 8px}
.hd-status{position:relative;height:20px;font-size:13px;font-weight:600;color:var(--brand-ink)}
.hd-status span{position:absolute;inset:0;white-space:nowrap}
.hd-bar{height:6px;border-radius:3px;background:#E6EFEA;overflow:hidden}
.hd-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#27AC7F,#0F6E4E);transform-origin:left}
.hd-chips{display:flex;flex-wrap:wrap;gap:6px}
.hd-chip{font:500 11.5px 'Geist Mono',monospace;color:#3E5A4E;background:var(--soft);border:1px solid var(--line);border-radius:6px;padding:3px 7px}
.hd-row{display:flex;gap:10px;align-items:flex-start;border:1px solid #E3ECE7;border-radius:12px;padding:10px 12px;background:#FBFDFC}
.hd-row .ic{width:30px;height:30px;border-radius:8px;background:var(--mint);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.hd-row .k{font:600 10.5px 'Geist',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hd-row .v{font:600 15px 'Geist Mono',monospace;color:var(--ink)}
.hd-badge{display:block;position:relative;height:24px;margin-top:5px}
.hd-badge span{position:absolute;left:0;top:0;display:inline-flex;gap:4px;align-items:center;white-space:nowrap;font:600 11.5px 'Geist',sans-serif;border-radius:999px;padding:4px 9px}
.hd-badge .wait{color:#7A5A1F;background:#FFF3DC;border:1px solid #F1D9A6}
.hd-badge .ok{color:#0B5A40;background:var(--mint);border:1px solid #9FD4BE}
.hd-save{display:flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;background:var(--brand-ink);color:#fff;font:600 14px 'Geist',sans-serif;padding:10px}
.hd-leads{position:absolute;left:26px;bottom:24px;width:60%;background:#fff;border-radius:16px;border:1px solid #E1EAE5;box-shadow:var(--depth-2);padding:14px 16px;display:flex;flex-direction:column;gap:8px;z-index:4}
.hd-lh{display:flex;justify-content:space-between;align-items:center;font:650 14px 'Geist',sans-serif}
.hd-lh small{font:500 11.5px 'Geist Mono',monospace;color:var(--muted)}
.hd-lr{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:8px;border-radius:10px;font-size:13px}
.hd-lr .av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 11px 'Geist',sans-serif}
.hd-lr b{display:block;font-size:13.5px}.hd-lr>div{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted);font-size:12px}.hd-lr .t{white-space:nowrap}
.hd-lr .t{font:600 11px 'Geist',sans-serif;color:#0B5A40;background:var(--mint);border-radius:999px;padding:3px 8px}
.hd-lr.new{background:#EAF7F0;box-shadow:inset 0 0 0 1px #9FD4BE}
.hd-toast{position:absolute;right:30px;bottom:26px;background:var(--ink);color:#fff;font:600 13px 'Geist',sans-serif;border-radius:999px;padding:9px 14px;display:flex;gap:8px;align-items:center;z-index:6;box-shadow:var(--depth-2)}
.hd-steps{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.hd-steps span{font:600 12px 'Geist',sans-serif;color:var(--muted);border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 10px}
.hd-ctrl{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.hd-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font:600 13px 'Geist',sans-serif;color:var(--ink);cursor:pointer;transition:transform var(--m-fast) var(--ease-out),border-color var(--m-fast)}
.hd-btn:hover{border-color:var(--ink);transform:translateY(-1px)}
.hd-btn:active{transform:scale(.96)}
/* timeline: base state = final frame (no-JS, reduced motion). .run plays it. */
.hd.run .hd-profile{animation:hd-in .6s var(--ease-out) .2s both}
.hd.run .hd-panel{animation:hd-pop .5s var(--spring) .9s both}
.hd.run .hd-bar i{animation:hd-fill 1.6s var(--ease-io) 1.3s both}
.hd.run .hd-chip{animation:hd-pop .35s var(--spring) both}
.hd.run .hd-chip:nth-child(1){animation-delay:1.5s}.hd.run .hd-chip:nth-child(2){animation-delay:1.75s}.hd.run .hd-chip:nth-child(3){animation-delay:2s}.hd.run .hd-chip:nth-child(4){animation-delay:2.25s}
.hd.run .hd-status .s1{animation:hd-out .3s ease 2.9s both,hd-blink 1s ease-in-out 1.3s 2}
.hd.run .hd-status .s2{animation:hd-in-s .3s ease 3s both}
.hd .hd-status .s1{opacity:0}
.hd.run .hd-status .s1{opacity:1}
.hd.run .r-email{animation:hd-row .45s var(--ease-out) 3.1s both}
.hd.run .r-email .wait{animation:hd-in-s .2s ease 3.2s both,hd-out .25s ease 4.3s both}
.hd.run .r-email .ok{animation:hd-ok .45s var(--spring) 4.35s both}
.hd.run .r-phone{animation:hd-row .45s var(--ease-out) 4.8s both}
.hd.run .r-phone .wait{animation:hd-in-s .2s ease 4.9s both,hd-out .25s ease 5.9s both}
.hd.run .r-phone .ok{animation:hd-ok .45s var(--spring) 5.95s both}
.hd .wait{opacity:0}
.hd.run .hd-save{animation:hd-row .4s var(--ease-out) 6.3s both,hd-press .3s ease 6.9s}
.hd.run .hd-toast{animation:hd-toast 2.6s var(--ease-out) 7.1s both}
.hd .hd-toast{opacity:0}
.hd.run .hd-leads{animation:hd-up .6s var(--ease-out) 7.4s both}
.hd.run .hd-lr.new{animation:hd-row .45s var(--ease-out) 7.9s both,hd-hl 1.6s ease 8.3s}
.hd.run .hd-steps .p1{animation:hd-step 9s linear 0s both}
.hd.run .hd-steps .p2{animation:hd-step 9s linear 1.3s both}
.hd.run .hd-steps .p3{animation:hd-step 9s linear 3.1s both}
.hd.run .hd-steps .p4{animation:hd-step 9s linear 7.3s both}
.hd.paused *, .hd.paused *::before, .hd.paused *::after{animation-play-state:paused!important}
@keyframes hd-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@keyframes hd-pop{from{opacity:0;transform:translateY(10px) scale(.94)}to{opacity:1;transform:none}}
@keyframes hd-up{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes hd-row{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes hd-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes hd-out{from{opacity:1}to{opacity:0}}
@keyframes hd-in-s{from{opacity:0}to{opacity:1}}
@keyframes hd-blink{50%{opacity:.45}}
@keyframes hd-ok{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes hd-press{50%{transform:scale(.96)}}
@keyframes hd-toast{0%{opacity:0;transform:translateY(10px)}12%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:translateY(-6px)}}
@keyframes hd-hl{0%,100%{background:#EAF7F0}40%{background:#CFEBDD}}
@keyframes hd-step{0%{color:var(--muted);background:#fff;border-color:var(--line)}2%,100%{color:#fff;background:var(--brand-ink);border-color:var(--brand-ink)}}
.hd:not(.run) .hd-steps span{color:#fff;background:var(--brand-ink);border-color:var(--brand-ink)}

/* --- Product cards: layered, interactive --- */
.pcs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.pc{position:relative;grid-column:span 3;display:flex;flex-direction:column;gap:12px;padding:26px;border-radius:22px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink);box-shadow:var(--depth-1);overflow:hidden;isolation:isolate;transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base) var(--ease-out),border-color var(--m-base)}
.pc.wide{grid-column:span 4}.pc.narrow{grid-column:span 2}
.pc::before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:radial-gradient(420px 220px at var(--mx,80%) var(--my,0%),rgba(39,172,127,.16),transparent 70%);opacity:0;transition:opacity var(--m-base);z-index:-1}
.pc:hover,.pc:focus-visible{transform:translateY(-6px);box-shadow:var(--depth-2);border-color:#A9D3C1}
.pc:hover::before,.pc:focus-visible::before{opacity:1}
.pc:active{transform:translateY(-2px) scale(.99)}
.pc .pc-ic{width:48px;height:48px;border-radius:14px;background:var(--mint);color:var(--brand-ink);display:grid;place-items:center;transition:transform var(--m-base) var(--spring),background-color var(--m-base),color var(--m-base)}
.pc:hover .pc-ic,.pc:focus-visible .pc-ic{transform:rotate(-8deg) scale(1.08);background:var(--brand-ink);color:#fff}
.pc h3{font-size:22px}
.pc .pc-tag{font:600 11.5px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--brand-ink)}
.pc .pc-more{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--m-slow) var(--ease-out),opacity var(--m-base)}
.pc .pc-more>div{overflow:hidden;color:var(--ink-2);font-size:15px}
.pc:hover .pc-more,.pc:focus-visible .pc-more{grid-template-rows:1fr;opacity:1}
.pc .pc-go{margin-top:auto;display:flex;align-items:center;justify-content:space-between;font:600 15px 'Geist',sans-serif;color:var(--brand-ink)}
.pc .pc-go i{width:40px;height:40px;border-radius:50%;border:1px solid #CFE3D9;display:grid;place-items:center;font-style:normal;transition:transform var(--m-base) var(--ease-out),background-color var(--m-base),color var(--m-base)}
.pc:hover .pc-go i,.pc:focus-visible .pc-go i{transform:translateX(4px) rotate(-45deg);background:var(--brand-ink);color:#fff;border-color:var(--brand-ink)}
.pc-vis{position:relative;border-radius:14px;background:linear-gradient(160deg,#F6FBF8,#E8F4EE);border:1px solid #E1EEE7;padding:14px;display:flex;flex-direction:column;gap:8px;min-height:120px}
.pc-vis .mini{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #E3ECE7;border-radius:10px;padding:8px 10px;font:600 13px 'Geist Mono',monospace;transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base)}
.pc-vis .mini .ok{margin-left:auto;font:600 11px 'Geist',sans-serif;color:#0B5A40;background:var(--mint);border-radius:999px;padding:3px 8px;opacity:0;transform:scale(.7);transition:opacity var(--m-base),transform var(--m-base) var(--spring)}
.pc:hover .pc-vis .mini .ok,.pc:focus-visible .pc-vis .mini .ok{opacity:1;transform:none}
.pc:hover .pc-vis .mini:nth-child(2) .ok{transition-delay:90ms}.pc:hover .pc-vis .mini:nth-child(3) .ok{transition-delay:180ms}
.pc:hover .pc-vis .mini,.pc:focus-visible .pc-vis .mini{box-shadow:var(--depth-1)}
.pc:hover .pc-vis .mini:nth-child(odd){transform:translateX(4px)}
.sig{display:inline-flex;gap:2px;align-items:flex-end;height:14px}
.sig i{width:3px;border-radius:1px;background:#C7D8CF;transition:background-color var(--m-base),height var(--m-base)}
.sig i:nth-child(1){height:4px}.sig i:nth-child(2){height:7px}.sig i:nth-child(3){height:10px}.sig i:nth-child(4){height:14px}
.pc:hover .sig i,.pc:focus-visible .sig i{background:var(--brand)}
.pc:hover .sig i:nth-child(2){transition-delay:60ms}.pc:hover .sig i:nth-child(3){transition-delay:120ms}.pc:hover .sig i:nth-child(4){transition-delay:180ms}
.li-mock{display:grid;grid-template-columns:1fr 46%;gap:10px;align-items:stretch}
.li-prof{background:#fff;border:1px solid #E3ECE7;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px}
.li-prof .bar{height:7px;border-radius:4px;background:#EEF1F3}
.li-side{background:#fff;border:1px solid #CFE3D9;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px;transform:translateX(18px);opacity:.55;transition:transform var(--m-slow) var(--ease-out),opacity var(--m-base)}
.pc:hover .li-side,.pc:focus-visible .li-side{transform:none;opacity:1}
.csv{display:flex;flex-direction:column;gap:5px;font:500 12px 'Geist Mono',monospace}
.csv div{display:grid;grid-template-columns:1fr 1fr 60px;gap:8px;align-items:center;background:#fff;border:1px solid #E3ECE7;border-radius:8px;padding:6px 8px;transition:background-color var(--m-base),border-color var(--m-base)}
.csv div b{font-weight:600}
.csv div em{font-style:normal;color:var(--muted);text-align:right;transition:color var(--m-base)}
.pc:hover .csv div,.pc:focus-visible .csv div{background:#EEF8F3;border-color:#BFE0D0}
.pc:hover .csv div em{color:#0B5A40}
.pc:hover .csv div:nth-child(2){transition-delay:120ms}.pc:hover .csv div:nth-child(3){transition-delay:240ms}.pc:hover .csv div:nth-child(4){transition-delay:360ms}
@media (max-width:1180px){.pc,.pc.wide,.pc.narrow{grid-column:span 3}}
@media (max-width:900px){.pcs{grid-template-columns:minmax(0,1fr)}.pc,.pc.wide,.pc.narrow{grid-column:auto}}
@media (hover:none){.pc .pc-more{grid-template-rows:1fr;opacity:1}.pc .pc-vis .mini .ok{opacity:1;transform:none}.li-side{transform:none;opacity:1}.pc:hover{transform:none}}

/* --- Walkthrough: sticky product stage + selectable steps (radio-driven) --- */
.wt{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start}
.wt-steps{display:flex;flex-direction:column;gap:14px}
.wt-step{font:inherit;color:inherit;text-align:left;width:100%;display:flex;gap:16px;align-items:flex-start;padding:22px;border-radius:18px;border:1px solid var(--line);background:#fff;cursor:pointer;transition:border-color var(--m-base),box-shadow var(--m-base),background-color var(--m-base),transform var(--m-fast) var(--ease-out);min-height:132px}
.wt-step:hover{border-color:#A9D3C1;transform:translateX(4px)}
.wt-step .num{transition:background-color var(--m-base),color var(--m-base),transform var(--m-base) var(--spring)}
.wt-step h3{font-size:21px}
.wt-step p{color:var(--ink-2);font-size:15.5px}
.wt-step .wt-state{font:600 11.5px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.wt-step .wt-state::before{content:"Up next"}
.wt-body{display:flex;flex-direction:column;gap:6px}
.wt-step .wt-detail{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--m-slow) var(--ease-out),opacity var(--m-base)}
.wt-step .wt-detail>div{overflow:hidden}
.wt-stage{position:sticky;top:96px;border-radius:24px;background:linear-gradient(160deg,#F4FBF7,#E3F3EC);border:1px solid #D3E8DD;box-shadow:var(--glow);min-height:540px;overflow:hidden}
.wt-layer{position:absolute;inset:0;display:grid;place-items:center;padding:30px;opacity:0;transform:translateY(16px) scale(.98);transition:opacity var(--m-slow) var(--ease-out),transform var(--m-slow) var(--ease-out);pointer-events:none}
.wt-layer img{max-width:100%;max-height:440px;border-radius:14px;box-shadow:var(--depth-2);border:1px solid #D3E2DB;background:#fff}
.wt-layer img.narrow{max-width:330px}
.wt-cap{position:absolute;left:20px;right:20px;bottom:16px;font-size:12.5px;color:#4D6B5E;text-align:center}
.wt-pin{position:absolute;display:flex;gap:6px;align-items:center;background:#fff;border:1px solid #9FD4BE;color:#0B5A40;font:600 12.5px 'Geist',sans-serif;border-radius:999px;padding:6px 11px;box-shadow:var(--depth-1);opacity:0;transform:translateY(6px) scale(.9);transition:opacity var(--m-base),transform var(--m-base) var(--spring)}
.wt-pin::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(39,172,127,.18)}
.wt-progress{position:absolute;left:24px;right:24px;top:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;z-index:3}
.wt-progress i{height:4px;border-radius:2px;background:#CFE3D9;transition:background-color var(--m-slow)}
/* selected / completed / next states */
.wt.at-1 .s1,.wt.at-2 .s2,.wt.at-3 .s3,.wt.at-4 .s4{border-color:var(--brand-ink);box-shadow:0 14px 34px rgba(15,110,78,.12);background:#FBFEFC}
.wt.at-1 .s1 .num,.wt.at-2 .s2 .num,.wt.at-3 .s3 .num,.wt.at-4 .s4 .num{background:var(--brand-ink);color:#fff;transform:scale(1.08)}
.wt.at-1 .s1 .wt-detail,.wt.at-2 .s2 .wt-detail,.wt.at-3 .s3 .wt-detail,.wt.at-4 .s4 .wt-detail{grid-template-rows:1fr;opacity:1}
.wt.at-1 .s1 .wt-state::before,.wt.at-2 .s2 .wt-state::before,.wt.at-3 .s3 .wt-state::before,.wt.at-4 .s4 .wt-state::before{content:"Now showing";color:var(--brand-ink)}
.wt.at-2 .s1,.wt.at-3 :is(.s1,.s2),.wt.at-4 :is(.s1,.s2,.s3){background:#F5FAF7}
.wt.at-2 .s1 .num,.wt.at-3 :is(.s1,.s2) .num,.wt.at-4 :is(.s1,.s2,.s3) .num{background:#CFEBDD}
.wt.at-2 .s1 .wt-state::before,.wt.at-3 :is(.s1,.s2) .wt-state::before,.wt.at-4 :is(.s1,.s2,.s3) .wt-state::before{content:"Done \2713";color:#0B5A40}
.wt.at-4 .s1 .wt-state::before{content:"Done \2713"}
.wt.at-1 .l1,.wt.at-2 .l2,.wt.at-3 .l3,.wt.at-4 .l4{opacity:1;transform:none;pointer-events:auto}
.wt.at-1 .l1 .wt-pin,.wt.at-2 .l2 .wt-pin,.wt.at-3 .l3 .wt-pin,.wt.at-4 .l4 .wt-pin{opacity:1;transform:none}
.wt-layer .wt-pin:nth-of-type(2){transition-delay:150ms}.wt-layer .wt-pin:nth-of-type(3){transition-delay:300ms}
.wt.at-1 .wt-progress i:nth-child(-n+1),.wt.at-2 .wt-progress i:nth-child(-n+2),.wt.at-3 .wt-progress i:nth-child(-n+3),.wt.at-4 .wt-progress i{background:var(--brand-ink)}
.wt-next{font:600 14px 'Geist',sans-serif;color:var(--brand-ink);cursor:pointer;display:none;align-items:center;gap:6px;margin-top:6px}
.wt.at-1 .s1 .wt-next,.wt.at-2 .s2 .wt-next,.wt.at-3 .s3 .wt-next{display:inline-flex}
@media (max-width:900px){
 .wt{grid-template-columns:minmax(0,1fr);gap:20px}
 .wt-stage{position:relative;top:auto;order:-1;min-height:380px}
 .wt-layer img{max-height:300px}
 .wt-steps{flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;padding-bottom:6px}
 .wt-step{flex:0 0 82%;scroll-snap-align:start;min-height:0}
 .wt-step:hover{transform:none}
}

/* --- Dark proof band with metrics --- */
.band-dark{background:radial-gradient(900px 400px at 15% 0%,#164E3B,#0F1F1A 70%);color:#E6F2EC}
.band-dark h2,.band-dark h3{color:#fff}
.band-dark .lede,.band-dark p{color:#BFD3CA}
.band-dark .card{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.12);color:#E6F2EC}
.band-dark .statband .big{color:#5FD0A6}
.band-dark .footnote{color:#9DB5AA}
.band-dark .checks li{color:#D5E5DD}
.band-dark .link{color:#7FE0B9}
.band-dark .tick{background:rgba(95,208,166,.18);color:#5FD0A6}

/* --- Refund timeline --- */
.tl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;position:relative}
.tl::before{content:"";position:absolute;left:12%;right:12%;top:26px;height:2px;background:linear-gradient(90deg,var(--brand),#CFE3D9)}
.tl>div{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:0 10px}
.tl .num{width:52px;height:52px;border-radius:50%;font-size:16px;background:#fff;border:2px solid var(--brand);color:var(--brand-ink);z-index:1;transition:transform var(--m-base) var(--spring),background-color var(--m-base),color var(--m-base)}
.tl>div:hover .num{transform:scale(1.1);background:var(--brand-ink);color:#fff}
@media (max-width:900px){.tl{grid-template-columns:minmax(0,1fr);gap:18px}.tl::before{left:25px;right:auto;top:10px;bottom:10px;width:2px;height:auto}.tl>div{flex-direction:row;text-align:left;align-items:flex-start}}

/* --- Floating layered product visuals on product pages --- */
.shot-stage{transition:box-shadow var(--m-slow)}
.shot-stage img{transition:transform var(--m-slow) var(--ease-out)}
.shot:hover .shot-stage img:not(.back){transform:translateY(-6px)}
.shot:hover .shot-stage .back{transform:translateY(4px) rotate(-1.5deg)}
.float-chip{position:absolute;z-index:4;display:flex;gap:6px;align-items:center;background:#fff;border:1px solid #9FD4BE;color:#0B5A40;font:600 12.5px 'Geist',sans-serif;border-radius:999px;padding:7px 12px;box-shadow:var(--depth-2)}
.float-chip::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand)}
.float-chip.c1{top:18px;left:18px}.float-chip.c2{bottom:22px;right:18px}.float-chip.c3{top:46%;left:12px}
@media (prefers-reduced-motion:no-preference){
 .float-chip{animation:hd-pop .5s var(--spring) both}
 .float-chip.c1{animation-delay:.5s}.float-chip.c2{animation-delay:.8s}.float-chip.c3{animation-delay:1.1s}
}

/* --- Pricing: interactive plan cards --- */
.plan{position:relative;transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base),border-color var(--m-base);overflow:hidden}
.plan::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--brand),var(--brand-ink));transform:scaleX(0);transform-origin:left;transition:transform var(--m-slow) var(--ease-out)}
.plan:hover,.plan:focus-within{transform:translateY(-6px);box-shadow:var(--depth-2);border-color:#A9D3C1}
.plan:hover::before,.plan:focus-within::before{transform:scaleX(1)}
.plan li{transition:transform var(--m-base) var(--ease-out)}
.plan:hover li{transform:translateX(3px)}
.plan:hover li:nth-child(2){transition-delay:40ms}.plan:hover li:nth-child(3){transition-delay:80ms}.plan:hover li:nth-child(4){transition-delay:120ms}
.plan .price{transition:color var(--m-base)}
.plan:hover .price{color:var(--brand-ink)}
.rp table tbody tr{transition:background-color var(--m-fast)}
.rp table tbody tr:hover{background:#F2FAF6}
.rp table tbody tr:hover td:first-child{box-shadow:inset 3px 0 0 var(--brand)}

/* --- Comparisons --- */
.vs-badges .vs-badge{transition:transform var(--m-base) var(--spring)}
.vs-x{transition:transform var(--m-base) var(--spring)}
a.card:hover .vs-badge.rp,.hero:hover .vs-badge.rp{transform:translateX(-6px)}
a.card:hover .vs-badge:not(.rp),.hero:hover .vs-badge:not(.rp){transform:translateX(6px)}
a.card:hover .vs-x{transform:scale(1.2) rotate(-8deg)}
.cmp-table td:nth-child(2),.cmp-table th:nth-child(2){background:#F3FAF6}

/* --- Reduced motion: final states, no movement --- */
@media (prefers-reduced-motion:reduce){
 .hd *{animation:none!important}
 .hd .hd-status .s1,.hd .wait,.hd .hd-toast{opacity:0!important}
 .dd{transition:none}
 .wt-layer,.wt-step,.pc,.plan{transition:none!important}
 .pc:hover,.plan:hover,.wt-step:hover{transform:none!important}
 .faq details::details-content{transition:none}
}
.rm .hd *{animation:none!important}
.rm .hd .hd-status .s1,.rm .hd .wait,.rm .hd .hd-toast{opacity:0!important}
.rm .pc:hover,.rm .plan:hover,.rm .wt-step:hover{transform:none!important}
.rm .pc .pc-more{grid-template-rows:1fr;opacity:1}

@media (max-width:900px){.hd-stage{min-height:620px;padding:18px}.hd-profile{width:auto;right:18px;left:18px;top:48px}.hd-panel{left:18px;right:18px;width:auto;top:200px}.hd-leads{left:18px;right:18px;width:auto;bottom:18px}.hd-toast{display:none}}

@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){
 .pcs>.pc,.tl>div,.wt-steps>.wt-step{animation:rp-rise linear both;animation-timeline:view();animation-range:entry 5% entry 45%}
 .pcs>.pc:nth-child(2),.tl>div:nth-child(2){animation-range:entry 10% entry 50%}
 .pcs>.pc:nth-child(3),.tl>div:nth-child(3){animation-range:entry 15% entry 55%}
 .pcs>.pc:nth-child(4),.tl>div:nth-child(4){animation-range:entry 20% entry 60%}
}}

/* ===== RioPulse v4.1: layered product heroes, verify cards, bulk run, pipelines ===== */
.lx{position:relative}
.vx{position:absolute;z-index:5;left:-34px;bottom:64px;width:292px;background:#fff;border:1px solid #D9E6DF;border-radius:16px;box-shadow:var(--depth-2);padding:12px;display:flex;flex-direction:column;gap:8px}
.vx.right{left:auto;right:-26px;bottom:auto;top:28px}
.vx.inline{position:relative;left:auto;right:auto;bottom:auto;top:auto;width:auto}
.vx-h{display:flex;justify-content:space-between;align-items:center;gap:8px;font:600 10px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.vx-h b{white-space:nowrap;font:650 12.5px 'Geist',sans-serif;letter-spacing:0;text-transform:none;color:var(--ink)}
.vx-bar{height:5px;border-radius:3px;background:#E3ECE7;overflow:hidden}
.vx-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-ink));transform-origin:left}
.vx .hd-row{padding:8px 10px}
.vx .hd-row .v{font-size:13.5px}
.vx .wait{opacity:0}
.vx-s{display:flex;gap:6px;align-items:center;justify-content:center;font:600 12.5px 'Geist',sans-serif;color:#0B5A40;background:var(--mint);border:1px solid #9FD4BE;border-radius:10px;padding:7px}
.lx:hover .vx{transform:translateY(-4px);box-shadow:0 24px 48px -20px rgba(11,58,40,.35)}
.vx{transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base)}

/* bulk run card */
.br{display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--depth-2);padding:20px}
.br-file{display:flex;align-items:center;gap:10px;border:1px dashed #9FD4BE;background:#F4FBF7;border-radius:12px;padding:10px 12px;font:600 13.5px 'Geist',sans-serif}
.br-file small{margin-left:auto;font:500 11.5px 'Geist Mono',monospace;color:var(--muted)}
.br-rows{display:flex;flex-direction:column;border:1px solid #E3ECE7;border-radius:12px;overflow:hidden}
.br-row{display:grid;grid-template-columns:1.1fr 1fr 1.25fr;gap:10px;align-items:center;padding:10px 12px;font:500 13px 'Geist',sans-serif;border-top:1px solid #EEF3F0}
.br-row:first-child{border-top:0;font:600 10.5px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:#FBFDFC}
.br-row .mono{font:500 12px 'Geist Mono',monospace;color:var(--ink-2)}
.br-st{position:relative;height:24px}
.br-st span{position:absolute;left:0;top:0;white-space:nowrap;font:600 11.5px 'Geist',sans-serif;border-radius:999px;padding:4px 9px}
.br-st .q{color:var(--muted);background:#F2F5F3;border:1px solid var(--line);opacity:0}
.br-st .e{color:#7A5A1F;background:#FFF3DC;border:1px solid #F1D9A6;opacity:0}
.br-st .d{color:#0B5A40;background:var(--mint);border:1px solid #9FD4BE}
.br-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;font:600 13px 'Geist',sans-serif;color:#0B5A40}
.br-foot small{font:500 11.5px 'Geist Mono',monospace;color:var(--muted)}

@media (prefers-reduced-motion:no-preference){
 .vx{animation:hd-pop .55s var(--spring) .6s both}
 .vx-bar i{animation:hd-fill 1.2s var(--ease-io) 1s both}
 .vx .v1{animation:hd-row .4s var(--ease-out) 2.2s both}
 .vx .v1 .wait{animation:hd-in-s .2s ease 2.3s both,hd-out .25s ease 3.2s both}
 .vx .v1 .ok{animation:hd-ok .45s var(--spring) 3.25s both}
 .vx .v2{animation:hd-row .4s var(--ease-out) 3.6s both}
 .vx .v2 .wait{animation:hd-in-s .2s ease 3.7s both,hd-out .25s ease 4.6s both}
 .vx .v2 .ok{animation:hd-ok .45s var(--spring) 4.65s both}
 .vx .vx-s{animation:hd-pop .4s var(--spring) 5.2s both}
 .br .br-row:nth-child(n+2){animation:hd-row .4s var(--ease-out) both}
 .br .br-row:nth-child(2){animation-delay:.5s}.br .br-row:nth-child(3){animation-delay:.65s}.br .br-row:nth-child(4){animation-delay:.8s}.br .br-row:nth-child(5){animation-delay:.95s}
 .br .br-row:nth-child(2) .q{animation:br-win 0.90s linear .6s}.br .br-row:nth-child(2) .e{animation:br-win 0.80s linear 1.5s}.br .br-row:nth-child(2) .d{animation:hd-ok .4s var(--spring) 2.3s both}
 .br .br-row:nth-child(3) .q{animation:br-win 1.30s linear .6s}.br .br-row:nth-child(3) .e{animation:br-win 0.90s linear 1.9s}.br .br-row:nth-child(3) .d{animation:hd-ok .4s var(--spring) 2.8s both}
 .br .br-row:nth-child(4) .q{animation:br-win 1.70s linear .6s}.br .br-row:nth-child(4) .e{animation:br-win 1.00s linear 2.3s}.br .br-row:nth-child(4) .d{animation:hd-ok .4s var(--spring) 3.3s both}
 .br .br-row:nth-child(5) .q{animation:br-win 2.10s linear .6s}.br .br-row:nth-child(5) .e{animation:br-win 1.10s linear 2.7s}.br .br-row:nth-child(5) .d{animation:hd-ok .4s var(--spring) 3.8s both}
 .br .vx-bar i{animation:hd-fill 2.8s var(--ease-io) 1.2s both}
 .br .br-foot{animation:hd-pop .4s var(--spring) 4.2s both}

 /* pipelines and rails: staggered entry + arrows that draw in */
 @supports (animation-timeline:view()){
  .dia>.dia-node:nth-child(3){animation-range:entry 10% entry 50%}
  .dia>.dia-node:nth-child(5){animation-range:entry 15% entry 55%}
  .dia>.dia-node:nth-child(7){animation-range:entry 20% entry 60%}
  .dia>.dia-node:nth-child(9){animation-range:entry 25% entry 65%}
  .dia>.dia-arrow{animation:rp-arrow linear both;animation-timeline:view();animation-range:entry 20% entry 70%}
  .rail>.rail-item:nth-child(2),.grid-3>*:nth-child(2),.lanes>*:nth-child(2),.grid-4>*:nth-child(2),.statband>*:nth-child(2),.plans>.plan:nth-child(2){animation-range:entry 10% entry 50%}
  .rail>.rail-item:nth-child(3),.grid-3>*:nth-child(3),.lanes>*:nth-child(3),.grid-4>*:nth-child(3),.statband>*:nth-child(3),.plans>.plan:nth-child(3){animation-range:entry 15% entry 55%}
  .rail>.rail-item:nth-child(4),.grid-4>*:nth-child(4),.plans>.plan:nth-child(4){animation-range:entry 20% entry 60%}
  .plans>.plan:nth-child(5){animation-range:entry 25% entry 65%}
 }
 .vs-badges .vs-badge.rp{animation:vs-l .6s var(--spring) .2s both}
 .vs-badges .vs-x{animation:hd-ok .4s var(--spring) .5s both}
 .vs-badges .vs-badge:not(.rp){animation:vs-r .6s var(--spring) .35s both}
}
@keyframes br-win{from,to{opacity:1}}
@keyframes rp-arrow{from{opacity:0;transform:translateX(-10px) scale(.7)}to{opacity:1;transform:none}}
@keyframes vs-l{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
@keyframes vs-r{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}

/* dia nodes respond to hover and focus */
.dia-node{transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base),border-color var(--m-base)}
.dia-node:hover{transform:translateY(-4px);box-shadow:var(--depth-2);border-color:#A9D3C1}
.dia-node .num{transition:transform var(--m-base) var(--spring),background-color var(--m-base),color var(--m-base)}
.dia-node:hover .num{transform:scale(1.12) rotate(-6deg);background:var(--brand-ink);color:#fff}
.rail-item .num{transition:transform var(--m-base) var(--spring),background-color var(--m-base),color var(--m-base)}
.rail-item:hover .num{transform:scale(1.12);background:var(--brand-ink);color:#fff}

/* comparison tables: RioPulse column tint, row hover */
.sticky-col td:nth-child(2),.sticky-col th:nth-child(2){background:#F2FAF6}
.sticky-col tbody tr{transition:background-color var(--m-fast)}
.sticky-col tbody tr:hover td{background:#EAF7F0}
.sticky-col tbody tr:hover td:first-child{box-shadow:inset 3px 0 0 var(--brand)}
.lanes>.lane,.grid-2>.card,.grid-3>.card{transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base),border-color var(--m-base)}
.lanes>.lane:hover,.grid-2>.card:hover,.grid-3>.card:hover{transform:translateY(-4px);box-shadow:var(--depth-2)}

/* three-up product cards on product pages */
.pcs.three .pc,.pcs.three .pc.wide,.pcs.three .pc.narrow{grid-column:span 2}

/* stat count-up element */
.stat,.statband .big{font-variant-numeric:tabular-nums}

@media (max-width:1180px){.vx{left:-12px}.vx.right{right:-8px}.pcs.three .pc{grid-column:span 3}}
@media (max-width:900px){.vx,.vx.right{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:auto;margin:-36px 12px 0}.pcs.three .pc{grid-column:auto}.br-row{grid-template-columns:1fr 1fr;}.br-row .mono{display:none}}
@media (prefers-reduced-motion:reduce){.vx,.vx *,.br,.br *,.dia>*,.vs-badges *{animation:none!important}.dia-node:hover,.lanes>.lane:hover,.grid-2>.card:hover,.grid-3>.card:hover,.lx:hover .vx{transform:none!important}}
.rm .vx,.rm .vx *,.rm .br,.rm .br *{animation:none!important}

/* comparison: focus a row */
.cmp-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}
.cmp-chips>span{font:600 13px 'Geist',sans-serif;color:var(--muted);margin-right:4px}
.cmp-chips button{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font:600 13px 'Geist',sans-serif;color:var(--ink);cursor:pointer;transition:background-color var(--m-base),color var(--m-base),border-color var(--m-base),transform var(--m-fast) var(--ease-out)}
.cmp-chips button:hover{border-color:var(--brand);transform:translateY(-1px)}
.cmp-chips button.on{background:var(--brand-ink);border-color:var(--brand-ink);color:#fff}
.cmp-chips button:focus-visible{outline:3px solid #9FD4BE;outline-offset:2px}
.sticky-col tbody tr td{transition:opacity var(--m-base),background-color var(--m-base)}
.sticky-col tbody tr.dim td{opacity:.32}
.sticky-col tbody tr.focus td{background:#EAF7F0}
.sticky-col tbody tr.focus td:first-child{box-shadow:inset 4px 0 0 var(--brand)}
@media (prefers-reduced-motion:reduce){.sticky-col tbody tr td,.cmp-chips button{transition:none}}

/* ===== RioPulse v4.2: scroll-linked motion. Variables come from the page's scroll engine:
   --p pass-through 0..1, --e entry 0..1, --x exit 0..1, --cover 0..1. Defaults = final state. ===== */

/* 1. Hero: layers drift apart as you scroll away */
.hero[data-sc] .hero-copy{translate:0 calc(var(--x,0) * 90px);opacity:calc(1 - var(--x,0) * 1.2)}
.hero[data-sc] .hd-profile{translate:0 calc(var(--x,0) * -40px)}
.hero[data-sc] .hd-panel{translate:0 calc(var(--x,0) * -90px)}
.hero[data-sc] .hd-leads{translate:0 calc(var(--x,0) * 50px)}
.hero[data-sc] .hd-stage{rotate:x calc(var(--x,0) * 10deg);transform-origin:50% 0}
.hero[data-sc] .hd{perspective:1400px}

/* 2. Contact rails: two rows of demo contact cards slide in opposite directions with scroll */
.rails-sec{overflow:hidden}
.rails{display:flex;flex-direction:column;gap:18px;padding:18px 0 8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.rail-row{display:flex;gap:18px;width:max-content;will-change:translate}
.rail-row.r1{translate:calc(-260px + (var(--p,.5) - .5) * -720px) 0}
.rail-row.r2{translate:calc(-900px + (var(--p,.5) - .5) * 720px) 0}
.ccard{width:268px;flex:none;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:var(--depth-1);display:flex;flex-direction:column;gap:9px;transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base),border-color var(--m-base)}
.ccard:hover{transform:translateY(-6px) rotate(-1.2deg);box-shadow:var(--depth-2);border-color:#A9D3C1}
.cc-top{display:flex;gap:10px;align-items:center}
.cc-top .av,.sv-row .av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 12px 'Geist',sans-serif;flex:none}
.cc-role{font:650 14px 'Geist',sans-serif;color:var(--ink)}
.cc-co{font-size:12.5px;color:var(--muted)}
.cc-line{display:flex;justify-content:space-between;align-items:center;gap:8px;font:500 12px 'Geist Mono',monospace;color:var(--ink-2);background:#F6FAF8;border:1px solid #E6EFEA;border-radius:10px;padding:7px 10px}
.cc-line .ok{font:600 11px 'Geist',sans-serif;color:#0B5A40;background:var(--mint);border-radius:999px;padding:2px 8px}
.cc-line.na{color:var(--muted);background:#FAFBFA}
.cc-line .na-t{font:600 11px 'Geist',sans-serif;color:var(--muted)}

/* 3. Product cards: dealt from a deck into the grid as the section scrolls in */
.pcs[data-sc]>.pc{animation:none!important;--k:clamp(0,calc(1 - var(--e,1) * var(--s,1.3)),1);translate:calc(var(--k) * var(--dx,0px)) calc(var(--k) * var(--dy,0px));rotate:calc(var(--k) * var(--r,0deg));scale:calc(1 - var(--k) * .1);opacity:calc(1 - var(--k) * .55)}
.pcs.three[data-sc]>.pc:nth-child(1){--dx:95%;--dy:70px;--r:-9deg;--s:1.3}
.pcs.three[data-sc]>.pc:nth-child(2){--dx:0%;--dy:140px;--r:2deg;--s:1.45}
.pcs.three[data-sc]>.pc:nth-child(3){--dx:-95%;--dy:70px;--r:9deg;--s:1.6}

/* 4. Proof band: stat cards tip up from flat, one after another */
.statband[data-sc]{perspective:1000px}
.statband[data-sc]>*{animation:none!important;--k:clamp(0,calc(1 - var(--e,1) * var(--s,1.3)),1);transform-origin:50% 100%;rotate:x calc(var(--k) * 55deg);translate:0 calc(var(--k) * 50px);opacity:calc(1 - var(--k) * .9)}
.statband[data-sc]>*:nth-child(1){--s:1.7}.statband[data-sc]>*:nth-child(2){--s:1.45}.statband[data-sc]>*:nth-child(3){--s:1.25}

/* 5. Refund timeline: the line draws with scroll and each step lights up as it passes */
.tl[data-sc]::before{background:#D9E9E1}
.tl[data-sc]::after{content:"";position:absolute;left:12%;right:12%;top:26px;height:2px;background:var(--brand-ink);transform-origin:0 50%;scale:clamp(0,calc(var(--e,1) * 1.5 - .3),1) 1}
.tl[data-sc]>div{--on:clamp(0,calc((var(--e,1) * 1.5 - .3 - var(--at,0)) * 8),1)}
.tl[data-sc]>div:nth-child(1){--at:0}.tl[data-sc]>div:nth-child(2){--at:.3}.tl[data-sc]>div:nth-child(3){--at:.6}.tl[data-sc]>div:nth-child(4){--at:.92}
.tl[data-sc] .num{background:color-mix(in srgb,var(--brand-ink) calc(var(--on) * 100%),#fff);color:color-mix(in srgb,#fff calc(var(--on) * 100%),var(--brand-ink));scale:calc(.86 + var(--on) * .14)}
.tl[data-sc]>div b,.tl[data-sc]>div p{opacity:calc(.35 + var(--on) * .65)}
@media (max-width:900px){.tl[data-sc]::after{left:25px;right:auto;top:10px;bottom:10px;width:2px;height:auto;transform-origin:50% 0;scale:1 clamp(0,calc(var(--e,1) * 1.5 - .3),1)}}

/* 6. Screenshots: gentle parallax inside the frame; product heroes float their layers at different speeds */
.shot[data-sc] .shot-stage>img{translate:0 calc((var(--p,.5) - .5) * -44px)}
.lx[data-sc] .float-chip{translate:0 calc((var(--p,.5) - .5) * -110px)}
.lx[data-sc] .vx{translate:0 calc((var(--p,.5) - .5) * 90px)}

/* 7. Use cases: sticky cards that stack, the one underneath shrinks back */
.stk-wrap{display:flex;flex-direction:column;gap:36px;padding-bottom:24px}
.stk{position:sticky;top:calc(104px + var(--i,0) * 22px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:44px;align-items:center;min-height:400px;padding:48px;border-radius:30px;background:#fff;border:1px solid var(--line);box-shadow:0 36px 70px -44px rgba(11,58,40,.45);transform-origin:50% 0;scale:calc(1 - var(--cover,0) * .07);filter:brightness(calc(1 - var(--cover,0) * .05))}
.stk:nth-child(2){background:linear-gradient(160deg,#F4FBF7,#DDF1E7)}
.stk.dark{background:radial-gradient(120% 120% at 0% 0%,#1D5B43,#0F2A20 60%);border-color:#0F2A20;color:#E8F3EE}
.stk.dark h3,.stk.dark .tag{color:#fff}.stk.dark p{color:#B9D6C9}.stk.dark .link{color:#7FE0B9}
.stk-copy{display:flex;flex-direction:column;gap:16px}
.stk-copy h3{font-size:32px;line-height:1.15}
.sv{background:#fff;border:1px solid #D9E6DF;border-radius:20px;box-shadow:var(--depth-2);padding:16px;display:flex;flex-direction:column;gap:10px;rotate:calc(var(--cover,0) * -2deg)}
.sv-h{display:flex;justify-content:space-between;align-items:center;font:600 10.5px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.sv-h b{font:650 14px 'Geist',sans-serif;letter-spacing:0;text-transform:none;color:var(--ink)}
.sv-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid #E6EFEA;border-radius:12px;background:#FBFDFC;transition:transform var(--m-base) var(--ease-out),border-color var(--m-base)}
.sv-row:hover{transform:translateX(6px);border-color:#9FD4BE}
.sv-row b{display:block;font-size:14px}.sv-row span{font-size:12.5px;color:var(--muted)}
.sv-row>div{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sv-chips{display:flex;gap:6px}
.sv-chips i{font:600 11px 'Geist',sans-serif;font-style:normal;border-radius:999px;padding:3px 8px;display:inline-flex;gap:3px;align-items:center;white-space:nowrap}
.sv-chips .ok{color:#0B5A40;background:var(--mint)}.sv-chips .na{color:var(--muted);background:#F1F4F2}
.sv-foot{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.sv-foot small{color:var(--muted);font-size:12px;margin-left:auto}
.sv.dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);box-shadow:none}
.sv.dark .sv-h,.sv.dark .sv-h b{color:#CFE7DC}
.vs-row{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;background:rgba(255,255,255,.08);text-decoration:none;color:#fff;transition:background-color var(--m-base),transform var(--m-base) var(--ease-out)}
.vs-row em{font-style:normal;color:#9CC3B3;font-size:13px}
.vs-row .vs-badge{background:#fff;color:var(--ink)}
.vs-row i{margin-left:auto;font-style:normal;transition:transform var(--m-base) var(--ease-out)}
.vs-row:hover{background:rgba(255,255,255,.16);transform:translateX(4px)}.vs-row:hover i{transform:translateX(4px)}

/* 8. Pricing plans rise as an arch, centre first */
.plans[data-sc]>.plan{animation:none!important;--k:clamp(0,calc(1 - var(--e,1) * var(--s,1.3)),1);translate:0 calc(var(--k) * var(--d,90px));rotate:calc(var(--k) * var(--r,0deg));opacity:calc(1 - var(--k) * .7)}
.plans[data-sc]>.plan:nth-child(1){--d:150px;--r:-5deg;--s:1.25}.plans[data-sc]>.plan:nth-child(2){--d:110px;--r:-2.5deg;--s:1.4}.plans[data-sc]>.plan:nth-child(3){--d:80px;--r:0deg;--s:1.6}.plans[data-sc]>.plan:nth-child(4){--d:110px;--r:2.5deg;--s:1.4}.plans[data-sc]>.plan:nth-child(5){--d:150px;--r:5deg;--s:1.25}

/* 9. Pipelines zig-zag into a straight line; lanes and comparison cards slide in from the sides */
.dia[data-sc]>*{animation:none!important;--k:clamp(0,calc(1 - var(--e,1) * 1.45),1)}
.dia[data-sc]>.dia-node:nth-child(4n+1){translate:0 calc(var(--k) * -70px);rotate:calc(var(--k) * -4deg)}
.dia[data-sc]>.dia-node:nth-child(4n+3){translate:0 calc(var(--k) * 70px);rotate:calc(var(--k) * 4deg)}
.dia[data-sc]>.dia-arrow{opacity:calc(1 - var(--k) * 1.6);scale:calc(1 - var(--k) * .6)}
.lanes[data-sc]>*{animation:none!important;--k:clamp(0,calc(1 - var(--e,1) * var(--s,1.3)),1);translate:0 calc(var(--k) * 90px);opacity:calc(1 - var(--k) * .8)}
.lanes[data-sc]>*:nth-child(1){--s:1.7}.lanes[data-sc]>*:nth-child(2){--s:1.45}.lanes[data-sc]>*:nth-child(3){--s:1.25}
.grid-2[data-sc]>*{animation:none!important;--k:clamp(0,calc(1 - var(--e,1) * 1.4),1);opacity:calc(1 - var(--k) * .7)}
.grid-2[data-sc]>*:first-child{translate:calc(var(--k) * -120px) 0;rotate:calc(var(--k) * -4deg)}
.grid-2[data-sc]>*:last-child{translate:calc(var(--k) * 120px) 0;rotate:calc(var(--k) * 4deg)}

/* phones: shorter distances, no sticky stacking, rails still move */
@media (max-width:900px){
 .pcs[data-sc]>.pc{translate:0 calc(var(--k) * 70px);rotate:calc(var(--k) * var(--r,0deg) * .5)}
 .rail-row.r1{translate:calc(-200px + (var(--p,.5) - .5) * -420px) 0}
 .rail-row.r2{translate:calc(-600px + (var(--p,.5) - .5) * 420px) 0}
 .ccard{width:236px}
 .stk{position:relative;top:auto;grid-template-columns:minmax(0,1fr);gap:24px;padding:24px;min-height:0;scale:1;filter:none}
 .stk-copy h3{font-size:24px}
 .grid-2[data-sc]>*:first-child,.grid-2[data-sc]>*:last-child{translate:0 calc(var(--k) * 60px);rotate:0deg}
 .plans[data-sc]>.plan{translate:0 calc(var(--k) * 60px);rotate:0deg}
 .hero[data-sc] .hd-stage{rotate:none}
}
@media (prefers-reduced-motion:reduce){
 [data-sc],[data-sc] *{--k:0!important;--on:1!important;--cover:0!important}
 .rail-row.r1{translate:-260px 0}.rail-row.r2{translate:-900px 0}
}

/* ===== RioPulse v5: signature interactions ===== */

/* --- Hero: the role in the headline cycles once, then rests on "person." --- */
.hero.hx h1{font-size:clamp(38px,4.4vw,64px)}
.rot{display:inline-block;height:1.08em;overflow:hidden;vertical-align:bottom;line-height:1.08}
.rot-in{display:flex;flex-direction:column}
.rot-in b{font-weight:inherit;display:block;height:1.08em;white-space:nowrap;color:var(--brand-ink)}
.rot-in b:last-child{color:inherit}
@media (prefers-reduced-motion:no-preference){.rot-in{animation:rp-rot 7.5s var(--ease-out) .9s 1 both}}
@keyframes rp-rot{0%,12%{transform:translateY(0)}18%,32%{transform:translateY(-1.08em)}38%,52%{transform:translateY(-2.16em)}58%,72%{transform:translateY(-3.24em)}78%,100%{transform:translateY(-4.32em)}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* --- Hero: the demo stage tilts toward the cursor, with a moving glare --- */
.hd-stage{transform:perspective(1300px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .35s var(--ease-out)}
.hd-stage::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:7;background:radial-gradient(600px circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.55),transparent 45%);opacity:var(--go,0);transition:opacity .3s}

/* --- Guess the email --- */
.gm{display:flex;flex-direction:column;gap:14px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--depth-2);padding:22px}
.gm-h{display:flex;justify-content:space-between;align-items:center;font:600 10.5px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.gm-h b{font:650 15px 'Geist',sans-serif;letter-spacing:0;text-transform:none;color:var(--ink)}
.gm-who{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:var(--soft)}
.gm-who .av{width:42px;height:42px;border-radius:50%;background:#2E6FB7;color:#fff;display:grid;place-items:center;font:700 14px 'Geist',sans-serif;flex:none}
.gm-who b{display:block}.gm-who span{font-size:13px;color:var(--muted)}
.gm-q{font:600 14px 'Geist',sans-serif;color:var(--ink-2)}
.gm-opts{display:flex;flex-direction:column;gap:8px}
.gm-opt{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;min-height:48px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:#fff;font:500 14.5px 'Geist Mono',monospace;color:var(--ink);cursor:pointer;text-align:left;transition:border-color var(--m-fast),background-color var(--m-fast),transform var(--m-fast) var(--ease-out)}
.gm-opt:hover{border-color:var(--ink);transform:translateX(3px)}
.gm-opt .res{font:600 11.5px 'Geist',sans-serif;border-radius:999px;padding:3px 9px;opacity:0;color:#9B2C2C;background:#FDECEC;border:1px solid #F3C2C2;transition:opacity var(--m-base)}
.gm-opt.tried{border-color:#F3C2C2;background:#FFF8F8;color:#9B2C2C;text-decoration:line-through;text-decoration-thickness:1.5px}
.gm-opt.tried .res{opacity:1;text-decoration:none}
.gm-opt.tried{animation:gm-shake .42s ease}
@keyframes gm-shake{20%{transform:translateX(-6px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.gm-meter{display:flex;gap:6px;align-items:center;font:600 12.5px 'Geist',sans-serif;color:var(--muted)}
.gm-meter i{width:26px;height:6px;border-radius:3px;background:#E3ECE7;transition:background-color var(--m-base)}
.gm-meter i.on{background:#E25555}
.gm-go{align-self:stretch}
.gm-win{display:none;flex-direction:column;gap:10px;padding:16px;border-radius:16px;background:linear-gradient(160deg,#F4FBF7,#DDF1E7);border:1px solid #9FD4BE}
.gm.won .gm-win{display:flex;animation:hd-pop .5s var(--spring) both}
.gm.won .gm-go{display:none}
.gm-steps{display:flex;gap:6px;flex-wrap:wrap}
.gm-steps span{font:600 11.5px 'Geist',sans-serif;color:#0B5A40;background:#fff;border:1px solid #9FD4BE;border-radius:999px;padding:3px 9px;opacity:0;animation:hd-ok .35s var(--spring) both}
.gm-steps span:nth-child(1){animation-delay:.25s}.gm-steps span:nth-child(2){animation-delay:.55s}.gm-steps span:nth-child(3){animation-delay:.85s}
.gm-ans{display:flex;justify-content:space-between;align-items:center;gap:10px;font:600 17px 'Geist Mono',monospace;color:var(--ink);opacity:0;animation:hd-row .45s var(--ease-out) 1.2s both}
.gm-ans .ok{font:600 12px 'Geist',sans-serif;color:#0B5A40;background:#fff;border:1px solid #9FD4BE;border-radius:999px;padding:4px 10px;white-space:nowrap}
.gm-reset{align-self:flex-start;background:none;border:0;padding:0;font:600 14px 'Geist',sans-serif;color:var(--brand-ink);text-decoration:underline;cursor:pointer}
@media (prefers-reduced-motion:reduce){.gm *,.gm{animation:none!important;opacity:1}.gm-steps span,.gm-ans{opacity:1}}

/* --- Verification conveyor: pinned, scroll-scrubbed --- */
.cv{position:relative;height:2600px;background:radial-gradient(90% 70% at 15% 0%,#1D5B43,#0B241B 62%);color:#E8F3EE}
.cv-pin{position:sticky;top:72px;height:780px;display:flex;flex-direction:column;justify-content:center;gap:24px;overflow:hidden}
.cv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.cv-head h2{color:#fff;max-width:640px}
.cv-head .eyebrow{color:#7FE0B9}
.cv-prog{font:600 12px 'Geist Mono',monospace;color:#9CC3B3;letter-spacing:.06em;text-transform:uppercase}
.cv-floor{position:relative;height:380px}
.cv-belt{position:absolute;left:0;right:0;bottom:46px;height:18px;border-radius:9px;background:repeating-linear-gradient(90deg,#2B6B52 0 22px,#1E4F3D 22px 44px);background-position:calc(var(--q,1) * -880px) 0;box-shadow:inset 0 2px 0 rgba(255,255,255,.12),0 10px 24px rgba(0,0,0,.35)}
.cv-belt::before,.cv-belt::after{content:"";position:absolute;top:50%;width:30px;height:30px;margin-top:-15px;border-radius:50%;background:#123A2C;border:3px solid #2B6B52}
.cv-belt::before{left:-8px}.cv-belt::after{right:-8px}
.cv-sts{position:absolute;left:0;right:0;top:0;height:190px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;align-items:start}
.cv-st{--on:clamp(0,calc((var(--q,1) - var(--t)) * 14),1);display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.cv-st .lamp{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,#5FD0A6 calc(var(--on) * 100%),#173F31);color:color-mix(in srgb,#0B241B calc(var(--on) * 100%),#7FA897);box-shadow:0 0 calc(var(--on) * 26px) color-mix(in srgb,#5FD0A6 calc(var(--on) * 70%),transparent);transition:none}
.cv-st b{font:650 14px 'Geist',sans-serif;color:color-mix(in srgb,#fff calc(var(--on) * 100%),#7FA897)}
.cv-st small{font-size:12px;color:#8FB5A5;max-width:150px}
.cv-st .arm{width:2px;height:28px;background:linear-gradient(#5FD0A6,transparent);opacity:calc(.25 + var(--on) * .75)}
.cv-st:nth-child(1){--t:.08}.cv-st:nth-child(2){--t:.26}.cv-st:nth-child(3){--t:.44}.cv-st:nth-child(4){--t:.62}.cv-st:nth-child(5){--t:.82}
.cv-card{--m:clamp(0,var(--q,1),1);position:absolute;bottom:72px;left:calc(var(--m) * (100% - 250px));width:250px;background:#fff;color:var(--ink);border-radius:16px;padding:12px;box-shadow:0 22px 40px rgba(0,0,0,.4);display:flex;flex-direction:column;gap:7px;z-index:3;rotate:calc(sin(var(--q,1) * 40) * 1.6deg)}
.cv-card .who{display:flex;gap:9px;align-items:center}.cv-card .who .av{width:30px;height:30px;border-radius:50%;background:#2E6FB7;color:#fff;display:grid;place-items:center;font:700 11px 'Geist',sans-serif}
.cv-card .who b{font-size:13.5px;display:block}.cv-card .who span{font-size:11.5px;color:var(--muted)}
.cv-row{position:relative;display:flex;justify-content:space-between;align-items:center;gap:6px;font:500 12px 'Geist Mono',monospace;background:#F6FAF8;border:1px solid #E6EFEA;border-radius:9px;padding:6px 8px;min-height:30px}
.cv-row .q{color:var(--muted)}
.cv-row .v{position:absolute;left:8px;top:6px;opacity:var(--found);color:var(--ink)}
.cv-row .q{opacity:calc(1 - var(--found))}
.cv-card{--found:clamp(0,calc((var(--q,1) - .14) * 14),1)}
.stamp{font:700 10px 'Geist',sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#0B5A40;background:var(--mint);border:1px solid #9FD4BE;border-radius:6px;padding:2px 6px;white-space:nowrap;opacity:var(--s);scale:calc(1.7 - var(--s) * .7);rotate:calc((1 - var(--s)) * -14deg)}
.stamp.s2{--s:clamp(0,calc((var(--q,1) - .32) * 14),1)}.stamp.s3{--s:clamp(0,calc((var(--q,1) - .5) * 14),1)}.stamp.s4{--s:clamp(0,calc((var(--q,1) - .68) * 14),1)}
.cv-stamps{display:flex;gap:5px;flex-wrap:wrap;min-height:20px}
.cv-cap{position:relative;min-height:84px;max-width:760px}
.cv-cap p{position:absolute;inset:0 auto auto 0;margin:0;font-size:19px;line-height:1.5;color:#D4E8DE;opacity:0;translate:0 10px}
.cv-cap p b{color:#fff}
.cv-cap p:nth-child(1){opacity:clamp(0,calc((.24 - var(--q,1)) * 14),1);translate:0 calc((1 - clamp(0,calc((.24 - var(--q,1)) * 14),1)) * 10px)}
.cv-cap p:nth-child(2){opacity:min(clamp(0,calc((var(--q,1) - .24) * 14),1),clamp(0,calc((.42 - var(--q,1)) * 14),1))}
.cv-cap p:nth-child(3){opacity:min(clamp(0,calc((var(--q,1) - .42) * 14),1),clamp(0,calc((.6 - var(--q,1)) * 14),1))}
.cv-cap p:nth-child(4){opacity:min(clamp(0,calc((var(--q,1) - .6) * 14),1),clamp(0,calc((.8 - var(--q,1)) * 14),1))}
.cv-cap p:nth-child(5){opacity:clamp(0,calc((var(--q,1) - .8) * 14),1);translate:0 0}
.cv-cap .fn{font-size:12.5px;color:#9CC3B3}
.cv-drawer{position:absolute;right:-6px;bottom:-14px;width:290px;height:64px;border-radius:14px 14px 0 0;background:#fff;color:var(--ink);display:flex;align-items:center;gap:10px;padding:0 16px;font:650 14px 'Geist',sans-serif;box-shadow:0 -10px 30px rgba(0,0,0,.25);translate:0 calc((1 - clamp(0,calc((var(--q,1) - .78) * 8),1)) * 90px);opacity:clamp(0,calc((var(--q,1) - .74) * 8),1);z-index:4}
.cv-drawer small{margin-left:auto;font:500 11.5px 'Geist Mono',monospace;color:var(--muted)}
.cv-foot{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.cv-foot .link{color:#7FE0B9}
@media (max-width:900px){
 .cv{height:auto;padding:56px 0}.cv[data-sc]{--q:1!important}
 .cv-pin{position:relative;top:auto;height:auto}
 .cv-floor{height:auto;display:flex;flex-direction:column;gap:18px}
 .cv-belt,.cv-drawer{display:none}
 .cv-sts{position:relative;inset:auto;grid-template-columns:minmax(0,1fr);gap:12px}
 .cv-st{flex-direction:row;text-align:left}.cv-st .arm{display:none}
 .cv-card{position:relative;left:auto;bottom:auto;width:auto;rotate:none}
 .cv-cap{min-height:0}.cv-cap p{position:relative;opacity:1!important;translate:none!important;display:none}.cv-cap p:last-child{display:block}
}
@media (prefers-reduced-motion:reduce){.cv[data-sc]{--q:1!important}.cv{height:auto;padding:80px 0}.cv-pin{position:relative;top:auto}}

/* --- Credit calculator --- */
.calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:stretch}
.calc-in,.calc-out{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:20px;box-shadow:var(--depth-1)}
.calc-out{background:radial-gradient(120% 120% at 100% 0%,#1D5B43,#0F2A20 60%);color:#E8F3EE;border-color:#0F2A20}
.sl{display:flex;flex-direction:column;gap:10px}
.sl-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font:600 15px 'Geist',sans-serif}
.sl-top output{font:650 30px 'Bricolage Grotesque',sans-serif;color:var(--brand-ink);font-variant-numeric:tabular-nums}
.sl-top output small{font:500 13px 'Geist',sans-serif;color:var(--muted)}
.sl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:10px;border-radius:5px;background:linear-gradient(90deg,var(--brand) 0 var(--f,30%),#E3ECE7 var(--f,30%));outline:none;cursor:pointer}
.sl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:#fff;border:3px solid var(--brand-ink);box-shadow:var(--depth-2);transition:transform var(--m-fast)}
.sl input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.12)}
.sl input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;border:3px solid var(--brand-ink)}
.sl input[type=range]:focus-visible{box-shadow:0 0 0 3px #9FD4BE}
.calc-opts{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font:600 13.5px 'Geist',sans-serif;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background-color var(--m-base),color var(--m-base),border-color var(--m-base)}
.chip::before{content:"";width:14px;height:14px;border-radius:4px;border:2px solid currentColor;opacity:.5}
.chip.on{background:var(--brand-ink);border-color:var(--brand-ink);color:#fff}
.chip.on::before{opacity:1;background:#fff;box-shadow:inset 0 0 0 2px var(--brand-ink)}
.calc-plans{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.cp{display:flex;flex-direction:column;gap:6px;padding:10px 8px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);font:600 12px 'Geist',sans-serif;color:#9CC3B3;text-align:center;transition:background-color var(--m-base),color var(--m-base),transform var(--m-base) var(--spring),border-color var(--m-base)}
.cp i{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.15)}
.cp.fits{color:#CFE7DC}.cp.fits i{background:#5FD0A6}
.cp.rec{background:#5FD0A6;color:#0B241B;border-color:#5FD0A6;transform:translateY(-4px)}
.cp.rec i{background:#0B241B}
.cp.small{opacity:.55}
.calc-rec{display:flex;flex-direction:column;gap:6px}
.calc-rec .eyebrow{color:#7FE0B9}
.calc-rec h3{font-size:34px;color:#fff}
.calc-rec .price{font:650 28px 'Bricolage Grotesque',sans-serif;color:#fff}
.calc-rec .price s{font:500 16px 'Geist',sans-serif;color:#8FB5A5;margin-right:8px}
.calc-rec .price small{font:500 14px 'Geist',sans-serif;color:#9CC3B3}
.calc-rec p{color:#B9D6C9;margin:0}
.calc-rec ul{margin:4px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;color:#D4E8DE;font-size:14.5px}
.calc-rec li::before{content:"✓ ";color:#5FD0A6;font-weight:700}
.calc-key{animation:hd-pop .4s var(--spring) both}
.calc-cta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:auto}
.calc-cta .link{color:#7FE0B9}
.calc-cta .btn-primary{background:#5FD0A6;color:#0B241B}
.calc-note{font-size:12.5px;color:#8FB5A5;margin:0}
@media (max-width:900px){.calc{grid-template-columns:minmax(0,1fr)}.calc-plans{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* --- Before / after slider --- */
.ba{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--depth-2);background:#EEF3F1;user-select:none;--cut:50%}
.ba-layer{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;padding:28px;min-height:420px;align-items:start}
.ba-after{position:absolute;inset:0;clip-path:inset(0 0 0 var(--cut));background:linear-gradient(160deg,#F4FBF7,#E0F2E9)}
.ba-before{background:#F1F3F2}
.ba-tag{position:absolute;top:14px;z-index:4;font:700 11px 'Geist',sans-serif;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 10px;background:#fff;border:1px solid var(--line);color:var(--muted)}
.ba-tag.l{left:14px}.ba-tag.r{right:14px;color:#0B5A40;border-color:#9FD4BE}
.ba-line{position:absolute;top:0;bottom:0;left:var(--cut);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px rgba(11,58,40,.15);z-index:5;pointer-events:none}
.ba-knob{position:absolute;top:50%;left:var(--cut);width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:var(--brand-ink);color:#fff;display:grid;place-items:center;font:700 18px 'Geist',sans-serif;box-shadow:var(--depth-2);z-index:6;pointer-events:none}
.ba-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:7;margin:0}
.ba-range:focus-visible+.ba-line{box-shadow:0 0 0 4px #9FD4BE}
.pf{background:#fff;border-radius:16px;border:1px solid #E1EAE5;overflow:hidden}
.pf-cover{height:84px;background:linear-gradient(120deg,#CBD8E6,#E3EAF2)}
.pf-body{padding:0 18px 18px;display:flex;flex-direction:column;gap:6px}
.pf .av{width:72px;height:72px;margin-top:-36px;border-radius:50%;border:4px solid #fff;background:#2E6FB7;color:#fff;display:grid;place-items:center;font:700 22px 'Geist',sans-serif}
.pf b.n{font:650 20px 'Geist',sans-serif}.pf .r{color:var(--ink-2);font-size:14px}.pf .l{color:var(--muted);font-size:13px}
.pf-ci{margin-top:8px;border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:var(--muted)}
.pf-ci div{display:flex;justify-content:space-between;gap:8px}
.pf-ci .miss{color:#9B2C2C;font-weight:600}
.guess{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.guess span{font:500 12.5px 'Geist Mono',monospace;color:#9B2C2C;text-decoration:line-through;opacity:.75}
.rpp{background:#fff;border-radius:16px;border:1px solid #CFE3D9;box-shadow:var(--depth-2);padding:14px;display:flex;flex-direction:column;gap:9px}
.rpp-h{display:flex;align-items:center;gap:8px;font:650 14px 'Geist',sans-serif}.rpp-h img{width:20px;height:20px}
.rpp-h small{margin-left:auto;font:500 11px 'Geist Mono',monospace;color:var(--muted)}
.rpp .cta{border-radius:10px;background:var(--brand-ink);color:#fff;text-align:center;font:600 13.5px 'Geist',sans-serif;padding:9px}
.rpp .rep{font-size:12px;color:var(--muted);text-align:center}
.ba-cap{font-size:13px;color:var(--muted);margin-top:12px}
@media (max-width:900px){.ba-layer{grid-template-columns:minmax(0,1fr);padding:18px;gap:14px}.ba-after .pf{display:none}.ba-before .ba-ghost{display:none}}

/* --- Comparison face-off --- */
.fo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;grid-auto-flow:dense}
.fo-card{position:relative;display:flex;flex-direction:column;gap:12px;text-align:left;min-height:190px;padding:22px;border-radius:20px;border:1px solid var(--line);background:#fff;box-shadow:var(--depth-1);cursor:pointer;font:inherit;color:inherit;transition:transform var(--m-base) var(--ease-out),box-shadow var(--m-base),border-color var(--m-base)}
.fo-card:hover{transform:translateY(-4px) rotate(-.6deg);box-shadow:var(--depth-2);border-color:#A9D3C1}
.fo-card:focus-visible{outline:3px solid #9FD4BE;outline-offset:2px}
.fo-front{display:flex;flex-direction:column;gap:10px;flex:1}
.fo-front .k{font:600 11px 'Geist Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--brand-ink)}
.fo-front h3{font-size:24px}
.fo-front .hint{margin-top:auto;display:flex;align-items:center;gap:8px;font:600 13px 'Geist',sans-serif;color:var(--muted)}
.fo-front .hint i{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-style:normal;transition:transform var(--m-base) var(--ease-out)}
.fo-card:hover .hint i{transform:rotate(180deg)}
.fo-back{display:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.fo-back>div{border-radius:12px;padding:12px;font-size:14px;line-height:1.45;display:flex;flex-direction:column;gap:6px}
.fo-back .us{background:#EAF7F0;border:1px solid #9FD4BE}.fo-back .them{background:#F4F5F4;border:1px solid var(--line)}
.fo-back b{font:700 11px 'Geist',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.fo-back .us b{color:#0B5A40}
.fo-card.on{grid-column:span 3;cursor:pointer;border-color:#9FD4BE}
.fo-card.on .fo-front h3{font-size:20px}.fo-card.on .fo-front .hint{display:none}
.fo-card.on .fo-back{display:grid;animation:fo-flip .5s var(--ease-out) both;transform-origin:50% 0}
.fo-card.on{animation:fo-pop .45s var(--spring) both}
@keyframes fo-flip{from{opacity:0;transform:perspective(900px) rotateX(-55deg)}to{opacity:1;transform:none}}
@keyframes fo-pop{from{transform:scale(.97)}to{transform:none}}
@media (max-width:900px){.fo{grid-template-columns:minmax(0,1fr)}.fo-card.on{grid-column:auto}.fo-back{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.fo-card,.fo-card.on,.fo-card.on .fo-back{animation:none!important;transition:none}}
.calc-key.k1{animation-name:ck1}
@keyframes ck1{from{opacity:0;transform:translateY(10px) scale(.94)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.calc-key{animation:none!important}.hd-stage{transform:none!important}.rot-in{animation:none!important}}