/* ============================================================
   FYNC site styles v2 — dominant type, uniform cards,
   package INCLUDES/EXCLUDES, selectable add-ons.
   ============================================================ */
:root{
  --bg:#08090B;
  --panel:#101216;
  --panel2:#15181E;
  --ink:#F4F6F7;
  --muted:#8A9096;
  --line:rgba(255,255,255,.10);
  --teal:#05E6DD;
  --font:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Hanken Grotesk',system-ui,sans-serif;
  --font-display:'Plus Jakarta Sans','Poppins','Century Gothic',sans-serif;
  --max:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--font);line-height:1.6;overflow-x:hidden;font-weight:400}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding:0 7%}
.eyebrow{font-size:11px;letter-spacing:.42em;text-transform:uppercase;color:var(--muted);font-weight:500}
.rule{width:40px;height:2px;background:var(--teal);margin:18px 0 28px;opacity:.9}
.rule.center{margin-left:auto;margin-right:auto}

/* ---- dominant headline type ---- */
h1,h2,h3,.price,.brand{font-family:var(--font-display);font-weight:700;letter-spacing:-.028em;line-height:1.0}
/* Poppins (display) on labels, buttons and footer display type; Hanken Grotesk for body */
.eyebrow,.tag,.plan .nm,.ft-h,.mega-h,.world a,.navbtn,.ft-statement,.ft-cta,.ft-mark,.ft-giant .word{font-family:var(--font-display)}

/* nav (inner pages — scoped to #nav so the new .mc nav is unaffected) */
#nav{display:flex;align-items:center;justify-content:space-between;padding:24px 7%;position:sticky;top:0;z-index:30;
  background:rgba(8,9,11,.55);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .4s,background .4s}
#nav.scrolled{border-bottom:1px solid var(--line);background:rgba(8,9,11,.9)}
.brand{font-size:25px;letter-spacing:-.01em}
.brand b{color:var(--teal)}
/* word-only logo: teal registered mark where the dot used to sit */
.logo-r{color:#05E6DD;font-weight:700;font-size:.31em;position:relative;top:.42em}
.navr{display:flex;align-items:center;gap:34px;font-size:13px;letter-spacing:.04em;color:var(--muted);font-weight:400}
.navr a:hover{color:var(--ink)}
.navbtn{color:var(--ink)!important;border:1px solid var(--line);padding:11px 22px;border-radius:40px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;transition:.3s}
.navbtn:hover{border-color:var(--teal);color:var(--teal)!important}
.navtoggle{display:none;background:none;border:0;cursor:pointer;flex-direction:column;justify-content:center;gap:5px;padding:6px}
.navtoggle span{display:block;width:24px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s,opacity .2s}
.navtoggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.navtoggle.open span:nth-child(2){opacity:0}
.navtoggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* hero with video band */
.hero{position:relative;overflow:hidden;min-height:62vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:150px 7% 96px}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero .shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,9,11,.5) 0%,rgba(8,9,11,.6) 55%,rgba(8,9,11,.94) 100%)}
.hero .inner{position:relative;z-index:2;max-width:880px}
.hero h1{font-size:clamp(46px,7vw,96px)}
.hero p{margin:30px auto 0;max-width:46ch;color:var(--ink);opacity:.86;font-size:19px;font-weight:400;line-height:1.55}
.badge{margin-top:42px;display:inline-flex;align-items:center;gap:11px;font-size:13px;color:var(--muted)}
.stars{color:var(--teal);letter-spacing:3px;font-size:14px}
.badge b{color:var(--ink);font-weight:600}
/* dark video heroes: rating must read light, not near-black */
.hero .badge{color:rgba(255,255,255,.72)}
.hero .badge b{color:#fff}

/* sections */
.sec{padding:96px 0;border-top:1px solid var(--line)}
.sec.first{border-top:none}
.sechead{text-align:center;margin-bottom:10px}
.sechead h2{font-size:clamp(34px,4.4vw,60px);margin-top:18px}
.sechead p{color:var(--muted);margin-top:18px;font-weight:400;font-size:17px;max-width:52ch;margin-left:auto;margin-right:auto}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:11px;background:var(--teal);color:#06201F;padding:17px 36px;border-radius:40px;
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;border:none;cursor:pointer;font-family:var(--font-display);transition:transform .3s,filter .3s}
.btn:hover{transform:translateY(-2px);filter:brightness(1.06)}
.btn .arw{transition:transform .35s}
.btn:hover .arw{transform:translateX(6px)}
.btn-ghost{display:inline-flex;align-items:center;gap:11px;color:var(--ink);border:1px solid var(--line);padding:16px 32px;border-radius:40px;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;font-family:var(--font-display);background:none;transition:.3s}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal)}
.center-btn{text-align:center;margin-top:48px}
/* lender panel: uniform tiles, swap text for <img class="logo-img"> once logos are cleared */
.logo-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:48px auto 0;max-width:900px}
.logo-chip{display:inline-flex;align-items:center;justify-content:center;height:64px;padding:0 18px;background:#fff;border:1px solid var(--line);border-radius:14px;font-weight:600;font-size:15px;letter-spacing:-.01em;color:var(--ink);text-align:center;box-shadow:0 1px 2px rgba(20,20,19,.03)}
.logo-chip .logo-img{max-height:30px;max-width:120px;width:auto;object-fit:contain}
.logos .fine{text-align:center;margin-top:26px;color:var(--muted)}
@media(max-width:760px){.logo-row{grid-template-columns:repeat(3,1fr);max-width:560px}}
@media(max-width:460px){.logo-row{grid-template-columns:repeat(2,1fr)}.logo-chip{height:56px;font-size:14px}}

/* pricing toggle */
.toggle{display:flex;justify-content:center;width:fit-content;margin:44px auto 54px;border:1px solid var(--line);border-radius:40px;padding:5px}
.toggle button{background:none;border:none;color:var(--muted);font-family:var(--font-display);font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;padding:14px 30px;border-radius:40px;cursor:pointer;transition:.3s}
.toggle button.on{background:var(--ink);color:var(--bg)}

/* package cards — uniform grid, equal height */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.grid-fallback{grid-column:1/-1;text-align:center;color:var(--muted);font-size:15px;line-height:1.7;padding:28px 4%;margin:0}
.grid-fallback a{color:var(--ink);text-decoration:underline}
.plan{border:1px solid var(--line);border-radius:16px;padding:36px 30px;display:flex;flex-direction:column;background:var(--panel);transition:transform .4s,border-color .4s;position:relative}
.plan:hover{transform:translateY(-6px)}
.plan.best{border-color:var(--teal)}
.plan.selected{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal)}
.tag{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--teal);font-weight:600;height:14px;margin-bottom:16px}
.plan .nm{font-size:13px;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;font-weight:500;min-height:32px}
.price{margin:18px 0 2px;font-size:54px}
.price small{font-size:15px;color:var(--muted);letter-spacing:0;font-weight:400}
.gst{font-size:12px;color:var(--muted);font-weight:400}
.sell{margin:22px 0 8px;font-size:14px;color:var(--ink);opacity:.82;line-height:1.6;min-height:96px}
.inc-h{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);font-weight:600;margin:18px 0 4px}
.exc-h{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:18px 0 4px}
.feat{list-style:none;margin:8px 0 0;padding:0}
.feat li{font-size:13.5px;color:var(--muted);padding:9px 0;border-top:1px solid var(--line);display:flex;gap:11px;align-items:flex-start;line-height:1.45}
.feat li:before{content:"";width:6px;height:6px;margin-top:6px;background:var(--teal);border-radius:50%;flex:none;opacity:.9}
.feat.exc li:before{background:var(--muted);opacity:.5}
.foot-note{font-size:12px;color:var(--muted);margin-top:16px;font-weight:400}
.choose{margin-top:24px;text-align:center;padding:15px;border:1px solid var(--line);border-radius:40px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;cursor:pointer;transition:.3s}
.choose:hover{background:var(--ink);color:var(--bg)}
.plan.best .choose{background:var(--teal);color:#06201F;border-color:var(--teal)}
.plan.selected .choose{background:var(--teal);color:#06201F;border-color:var(--teal)}
.onboard{text-align:center;margin-top:38px;font-size:14px;color:var(--muted)}

/* uniform info cards (services / modules) */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:48px;align-items:stretch}
.card{border:1px solid var(--line);border-radius:14px;padding:30px 26px;transition:border-color .3s;display:flex;flex-direction:column}
.card:hover{border-color:var(--teal)}
.card h4{font-size:18px;font-weight:600;letter-spacing:-.01em;margin-bottom:10px;min-height:52px;display:flex;align-items:flex-start}
.card p{font-size:13.5px;color:var(--muted);flex:1}
.card .pr{margin-top:16px;font-size:13px;color:var(--teal);font-weight:500}

/* selectable add-ons */
.addons{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:44px}
/* flex-wrap + min-width:0 so the nowrap price drops to its own line in narrow cards
   instead of escaping the border (text must NEVER exceed its box, site-wide rule) */
.addon{border:1px solid var(--line);border-radius:14px;padding:24px 26px;cursor:pointer;transition:border-color .3s,background .3s;display:flex;flex-wrap:wrap;justify-content:space-between;gap:18px;align-items:flex-start}
.addon>div{min-width:0}
.addon>div>div{min-width:0}
.addon:hover{border-color:rgba(5,230,221,.5)}
.addon.on{border-color:var(--teal);background:rgba(5,230,221,.06)}
.addon .box{width:22px;height:22px;border:1px solid var(--line);border-radius:6px;flex:none;margin-top:3px;display:flex;align-items:center;justify-content:center;transition:.3s}
.addon.on .box{background:var(--teal);border-color:var(--teal)}
.addon.on .box:after{content:"";width:6px;height:11px;border:solid #06201F;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.addon h4{font-size:17px;font-weight:600;margin-bottom:6px}
.addon p{font-size:13.5px;color:var(--muted)}
.addon .pr{font-size:14px;color:var(--teal);font-weight:600;white-space:nowrap}

/* door toggle (start/switch) */
.door{display:flex;gap:12px;justify-content:center;margin:8px 0 0;flex-wrap:wrap}
.door button{background:var(--panel);border:1px solid var(--line);color:var(--muted);font-family:var(--font-display);font-size:13px;font-weight:500;padding:14px 26px;border-radius:40px;cursor:pointer;transition:.3s}
.door button.on{border-color:var(--teal);color:var(--ink)}

/* forms */
.form{max-width:780px;margin:46px auto 0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{margin-bottom:20px}
.field.full{grid-column:1/-1}
label{display:block;font-size:13px;letter-spacing:.04em;color:var(--muted);margin-bottom:9px;font-weight:400}
input,select,textarea{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:15px 16px;color:var(--ink);font-family:inherit;font-size:15px;font-weight:400;transition:border-color .3s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal)}
textarea{min-height:120px;resize:vertical}
.check{display:flex;align-items:flex-start;gap:12px;margin:6px 0 26px;font-size:14px;color:var(--ink);font-weight:400}
.check input{width:18px;height:18px;flex:none;margin-top:2px;accent-color:var(--teal)}
.check a{color:var(--teal);text-decoration:underline}
.submit-note{text-align:center;margin-top:18px;font-size:13px;color:var(--muted)}
.summary{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:8px 28px;margin-bottom:34px}
.summary .row{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:18px 0;border-top:1px solid var(--line);font-size:15px}
.summary .row:first-child{border-top:none}
.summary .row .k{color:var(--muted);font-weight:400}
.summary .row .v{font-weight:500;text-align:right}

/* notice banner */
.notice{max-width:780px;margin:0 auto 38px;border:1px solid var(--teal);border-radius:14px;background:rgba(5,230,221,.08);padding:24px 28px;color:var(--teal);font-size:17px;text-align:center}
.notice.err{border-color:#E2685A;background:rgba(226,104,90,.08);color:#F0a89c}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;margin-top:50px}
.contact-info .blk{margin-bottom:34px}
.contact-info .lbl{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:10px}
.contact-info .val{font-size:19px;font-weight:400;line-height:1.5}
.contact-info .val a{color:var(--teal)}
.cal-embed{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel);min-height:660px}
.cal-embed iframe{width:100%;height:680px;border:0;display:block}

/* talk / book a call */
.talk{text-align:center}
.talk h2{font-size:clamp(30px,4vw,52px)}
.talk p{color:var(--muted);margin-top:16px;font-size:17px;font-weight:400}
.talk .btn{margin-top:34px}

/* prose */
.prose{max-width:780px;margin:0 auto}
.prose h1{font-size:clamp(36px,5vw,60px);margin-bottom:10px}
.prose h2{font-size:23px;font-weight:600;margin:38px 0 14px;letter-spacing:-.01em}
.prose p,.prose li{color:var(--muted);font-weight:400;margin-bottom:12px}
.prose ul{padding-left:20px}
.prose a:not(.btn):not(.btn-ghost){color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.quote-invite{background:linear-gradient(180deg,rgba(5,230,221,.10),rgba(5,230,221,.02));border-bottom:1px solid var(--line);padding:48px 7%}
.quote-invite .qi-inner{max-width:720px;margin:0 auto;text-align:center}
.quote-invite h2{font-size:clamp(26px,3.4vw,38px);font-weight:600;letter-spacing:-.02em;margin:12px 0 14px;color:var(--ink)}
.quote-invite p{color:var(--muted);font-weight:400;font-size:16px;line-height:1.7;margin-bottom:26px}
#start .door{margin-top:14px}
.rev{max-width:760px;margin:0 auto 40px}
.rev-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.rev-head label{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:500}
#rev-readout{font-size:30px;font-weight:600;color:var(--teal);letter-spacing:-.01em}
#rev-slider{width:100%;-webkit-appearance:none;appearance:none;height:6px;padding:0;border:0;margin:0;border-radius:6px;background:var(--line);outline:none;cursor:pointer}
#rev-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;border-radius:50%;background:var(--teal);cursor:pointer;border:4px solid var(--bg);box-shadow:0 0 0 1px var(--teal),0 2px 10px rgba(5,230,221,.4)}
#rev-slider::-moz-range-thumb{width:22px;height:22px;border:3px solid var(--bg);border-radius:50%;background:var(--teal);cursor:pointer}
.rev-quote{margin-top:16px;font-size:14px;color:var(--muted);text-align:center}
.rev-quote a{color:var(--teal);text-decoration:underline}
.fcp-rec{margin:6px 0 4px}
.fcp-rec-btn{display:inline-flex;align-items:center;gap:8px;background:var(--teal);color:#06201F;padding:12px 20px;border-radius:30px;font-size:13px;font-weight:600;letter-spacing:.03em;text-decoration:none}
.fcp-rec-btn:hover{filter:brightness(1.06)}
/* AI helper entry (Siri-style orb) */
.fcl-orb{flex:0 0 auto;width:40px;height:40px}
.fcl-orb video{width:100%;height:100%;object-fit:cover;display:block;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%);mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%)}
.or-divider{display:flex;align-items:center;gap:16px;max-width:620px;margin:26px auto;color:var(--muted);font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.or-divider::before,.or-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.pick{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:22px}
.pick-label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* footer */
footer{border-top:1px solid var(--line);padding:56px 7% 62px;text-align:center;color:var(--muted)}
footer .brand{display:block;margin-bottom:22px;color:#fff;font-size:25px}
.flinks{display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:center;font-size:13px;margin-bottom:22px;font-weight:400}
.flinks a:hover{color:var(--ink)}
.fine{font-size:12px;line-height:1.9}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.18s}.d3{transition-delay:.26s}.d4{transition-delay:.34s}.d5{transition-delay:.42s}

@media (max-width:980px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.cards{grid-template-columns:1fr}}
@media (max-width:900px){
  .plans{grid-template-columns:1fr}
  .grid2,.addons,.contact-grid{grid-template-columns:1fr}
  .navtoggle{display:flex}
  .navr{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:rgba(8,9,11,.97);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:6px 7% 20px;display:none}
  .navr.open{display:flex}
  .navr a:not(.navbtn){padding:16px 2px;border-bottom:1px solid var(--line);font-size:15px;color:var(--ink)}
  .navbtn{margin-top:16px;text-align:center}
  .sell,.card h4,.plan .nm{min-height:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  *{animation:none!important}
}

/* ===================== v3 content blocks ===================== */
/* comparison table */
.compare-cap{text-align:center;color:var(--muted);font-size:14px;margin-bottom:30px;font-weight:400}
.ctable{width:100%;border-collapse:collapse;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.ctable th,.ctable td{padding:16px 18px;text-align:center;border-top:1px solid var(--line);font-size:14px;font-weight:400}
.ctable thead th{background:var(--panel);font-weight:600;letter-spacing:.02em;font-size:13px}
.ctable thead th:first-child{text-align:left}
.ctable tbody td:first-child{text-align:left;color:var(--ink);opacity:.9}
.ctable .grp td{background:rgba(255,255,255,.02);text-transform:uppercase;letter-spacing:.18em;font-size:11px;color:var(--muted);font-weight:600;text-align:left}
.ctable .tick{color:var(--teal);font-size:17px}
.ctable .addon-row td{color:var(--muted)}
.ctable .addon-row td:not(:first-child){color:var(--teal);font-weight:500}
.ctable .best-col{color:var(--teal)}

/* how it works */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:50px;counter-reset:step}
.step{border:1px solid var(--line);border-radius:14px;padding:30px 26px}
.step .n{width:40px;height:40px;border-radius:50%;border:1px solid var(--teal);color:var(--teal);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;margin-bottom:20px}
.step h4{font-size:17px;font-weight:600;margin-bottom:8px}
.step p{font-size:14px;color:var(--muted)}

/* trust band */
.trust{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding-top:54px;padding-bottom:54px}
.trust .t{display:flex;flex-direction:column;gap:8px}
.trust .t .ic{color:var(--teal);font-size:20px}
.trust .t h4{font-size:16px;font-weight:600}
.trust .t p{font-size:13.5px;color:var(--muted);font-weight:400}

/* proof / testimonials */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.quote{border:1px solid var(--line);border-radius:14px;padding:30px 28px;display:flex;flex-direction:column}
.quote .stars{margin-bottom:16px}
.quote p{font-size:15px;line-height:1.6;font-weight:400;flex:1}
.quote .who{margin-top:20px;font-size:13px;color:var(--muted)}
.quote .who b{color:var(--ink);font-weight:600;display:block;font-size:14px}

/* credentials */
.creds{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:44px}
.cred{border:1px solid var(--line);border-radius:40px;padding:13px 24px;font-size:13px;color:var(--muted);font-weight:400}
.cred b{color:var(--ink);font-weight:600}

/* faq */
.faq{max-width:820px;margin:44px auto 0}
.qa{border-top:1px solid var(--line)}
.qa:last-child{border-bottom:1px solid var(--line)}
.qa button{width:100%;background:none;border:none;color:var(--ink);font-family:inherit;font-size:17px;font-weight:400;text-align:left;padding:24px 0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px}
.qa .sign{color:var(--teal);font-size:22px;transition:transform .3s;flex:none}
.qa.open .sign{transform:rotate(45deg)}
.qa .a{max-height:0;overflow:hidden;transition:max-height .35s ease;color:var(--muted);font-weight:400;font-size:15px;line-height:1.6}
.qa .a p{padding-bottom:24px}

@media (max-width:980px){.steps,.trust .wrap,.quotes{grid-template-columns:1fr 1fr}}
@media (max-width:860px){
  .steps,.trust .wrap,.quotes{grid-template-columns:1fr}
  .ctable th,.ctable td{padding:12px 10px;font-size:12.5px}
}

/* ===================== AI helper widget ===================== */
.fync-chat-launch{position:fixed;right:22px;bottom:22px;z-index:60;display:inline-flex;align-items:center;gap:6px;
  background:rgba(8,9,11,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink);border:1px solid var(--line);cursor:pointer;font-family:var(--font);font-weight:600;font-size:13px;
  letter-spacing:.04em;padding:6px 18px 6px 6px;border-radius:44px;box-shadow:0 10px 30px rgba(0,0,0,.4);transition:transform .3s,opacity .3s,border-color .3s}
.fync-chat-launch:hover{transform:translateY(-2px);border-color:var(--teal)}
.fync-chat-launch.hide{opacity:0;pointer-events:none;transform:scale(.9)}
.fync-chat-launch .dot{width:8px;height:8px;border-radius:50%;background:#06201F;animation:fpulse 1.8s ease-in-out infinite}
@keyframes fpulse{0%,100%{opacity:1}50%{opacity:.35}}

.fync-chat-panel{position:fixed;right:22px;bottom:22px;z-index:1101;width:380px;max-width:calc(100vw - 32px);height:560px;max-height:calc(100vh - 44px);
  background:var(--bg);border:1px solid var(--line);border-radius:18px;display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.55);opacity:0;transform:translateY(16px) scale(.98);pointer-events:none;transition:opacity .3s,transform .3s}
.fync-chat-panel.on{opacity:1;transform:none;pointer-events:auto}
.fcp-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line);background:var(--panel)}
.fcp-head b{font-weight:600;font-size:15px;display:block}
.fcp-head span{font-size:11px;color:var(--muted);letter-spacing:.02em}
.fcp-id{display:flex;align-items:center;gap:12px}
.fcp-orb{width:96px;height:96px;flex:0 0 auto}
.fcp-orb video{width:100%;height:100%;object-fit:cover;display:block;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%);mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%)}
.fcp-x{background:none;border:none;color:var(--muted);font-size:24px;line-height:1;cursor:pointer;font-family:var(--font)}
.fcp-x:hover{color:var(--ink)}
.fcp-body{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:12px}
.fcp-msg{max-width:84%;padding:12px 15px;border-radius:14px;font-size:14.5px;line-height:1.55;font-weight:400;white-space:normal}
.fcp-msg .fcp-li{display:block;padding-left:1.05em;text-indent:-1.05em;margin:2px 0}
.fcp-msg.bot{align-self:flex-start;background:var(--panel);border:1px solid var(--line);border-bottom-left-radius:4px}
.fcp-msg.me{align-self:flex-end;background:var(--teal);color:#06201F;border-bottom-right-radius:4px;font-weight:400}
.fcp-chips{display:flex;flex-direction:column;gap:8px;align-items:flex-start;margin-top:2px}
.fcp-chips button{background:none;border:1px solid var(--line);color:var(--ink);font-family:var(--font);font-size:13px;font-weight:400;
  padding:9px 14px;border-radius:40px;cursor:pointer;transition:.25s;text-align:left}
.fcp-chips button:hover{border-color:var(--teal);color:var(--teal)}
.fcp-input{display:flex;align-items:flex-end;gap:8px;padding:14px;border-top:1px solid var(--line);background:var(--panel)}
.fcp-input textarea{flex:1;resize:none;background:var(--bg);border:1px solid var(--line);border-radius:12px;color:var(--ink);
  font-family:var(--font);font-size:14.5px;font-weight:400;padding:11px 13px;max-height:120px;line-height:1.4}
.fcp-input textarea:focus{outline:none;border-color:var(--teal)}
.fcp-input button{flex:none;width:42px;height:42px;border-radius:50%;background:var(--teal);color:#06201F;border:none;cursor:pointer;
  font-size:18px;font-weight:700;font-family:var(--font);transition:transform .2s}
.fcp-input button:hover{transform:translateY(-1px)}
.typing{display:inline-flex;gap:4px;padding:2px 0}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);display:inline-block;animation:ftyp 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes ftyp{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media (max-width:520px){.fync-chat-panel{inset:0;width:100%;max-width:none;height:100%;max-height:none;border-radius:0}.fync-chat-launch{right:14px;bottom:14px;padding:5px;gap:0}.fync-chat-launch .fcl-label{display:none}}
/* iOS Safari auto-zooms any focused input under 16px — keep every input at 16px on touch screens */
@media (max-width:760px){input,select,textarea,.fcp-input textarea{font-size:16px!important}}

/* ===================== nav: world switch + Solutions mega-menu ===================== */
.navl{display:flex;align-items:center;gap:18px}
.world{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:30px;padding:3px}
.world a{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:7px 13px;border-radius:30px;font-weight:600;transition:.3s;white-space:nowrap}
.world a.on{background:var(--teal);color:#06201F}
.world a:not(.on):hover{color:var(--ink)}
.solutions-trigger{cursor:pointer;display:inline-flex;align-items:center;gap:6px;background:none;border:0;font-family:inherit;color:var(--muted);font-size:13px;letter-spacing:.04em;font-weight:400;padding:0}
.solutions-trigger:hover{color:var(--ink)}
.solutions-trigger .caret{font-size:8px;transition:transform .3s}
.solutions-trigger.open .caret{transform:rotate(180deg)}
.mega{position:absolute;left:0;right:0;top:100%;background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 34px 70px rgba(0,0,0,.55);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s,transform .25s,visibility .25s;z-index:29}
.mega.open{opacity:1;visibility:visible;transform:none}
.mega-inner{display:grid;grid-template-columns:1fr 1fr 1fr;gap:44px;padding-top:42px;padding-bottom:46px}
.mega-h{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:14px}
.mega-item{display:block;padding:13px 0;border-top:1px solid var(--line)}
.mega-item b{display:block;font-size:16px;font-weight:600;color:var(--ink);margin-bottom:3px;letter-spacing:-.01em}
.mega-item span{font-size:13px;color:var(--muted);font-weight:400;line-height:1.45}
.mega-item:hover b{color:var(--teal)}
.mega-aside{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:26px;display:flex;flex-direction:column;gap:9px;align-self:start}
.mega-aside b{font-size:17px;font-weight:600}
.mega-aside span{font-size:13.5px;color:var(--muted);font-weight:400;line-height:1.5}
.mega-aside .btn-ghost{margin-top:10px;align-self:flex-start;padding:11px 20px;font-size:11px}
.mega-ask-row{margin-top:10px;display:flex;align-items:center;justify-content:flex-start;gap:18px}
.mega-aside .mega-ask-row .btn-ghost{margin-top:0;align-self:auto;flex:0 0 auto;white-space:nowrap}
.mega-orb{flex:0 0 auto;width:92px;height:92px}
.mega-orb video{width:100%;height:100%;object-fit:cover;display:block;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%);mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%)}
.navr-mobile{display:none}
.navr>.world{display:none}
@media (max-width:980px){.mega-inner{grid-template-columns:1fr 1fr;gap:32px}.mega-aside{grid-column:1/-1}}
@media (max-width:860px){
  .navl .world{display:none}
  .solutions-trigger{display:none}
  .mega{display:none}
  .navr-mobile{display:flex;flex-direction:column}
  .navr-mobile a{padding:16px 2px;border-bottom:1px solid var(--line);font-size:15px;color:var(--ink)!important}
  .navr>.world{display:inline-flex;align-self:flex-start;margin-top:18px}
}

/* ===================== rich site footer ===================== */
.site-footer{background:#050505;color:#fff;font-family:var(--font);position:relative;overflow:hidden;border-top:1px solid rgba(255,255,255,.08);text-align:left;padding:0}
.ft-wrap{max-width:1300px;margin:0 auto;padding:88px 6% 0}
.ft-top{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between;align-items:flex-end;padding-bottom:64px;border-bottom:1px solid rgba(255,255,255,.08)}
.ft-statement{font-weight:700;font-size:clamp(32px,4.4vw,42px);line-height:1.08;letter-spacing:-.02em;color:#fff}
.ft-sub{margin:18px 0 0;font-size:16px;line-height:1.55;color:rgba(255,255,255,.55);max-width:420px;font-weight:400}
.ft-cta{flex:none;display:inline-flex;align-items:center;gap:10px;background:var(--teal);color:#06201F;text-decoration:none;font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:16px 30px;border-radius:40px;transition:transform .3s,filter .3s}
.ft-cta:hover{transform:translateY(-2px);filter:brightness(1.06)}
.ft-cta .arw{transition:transform .35s}
.ft-cta:hover .arw{transform:translateX(5px)}
.ft-cols{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr 1.2fr;gap:26px;padding:64px 0}
.ft-brand{display:flex;flex-direction:column;gap:18px;padding-right:24px}
.ft-mark{font-weight:700;font-size:30px;letter-spacing:-.02em;color:#fff}
.ft-mark b{color:var(--teal)}
.ft-brand a{color:rgba(255,255,255,.78);text-decoration:none;font-size:16px;font-weight:400;transition:color .2s;width:fit-content}
.ft-brand a:hover{color:var(--teal)}
.ft-social{display:flex;gap:18px;margin-top:4px}
.ft-social a{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.5);text-decoration:none;font-size:14px;font-weight:400;transition:color .2s}
.ft-social a:hover{color:#fff}
.ft-social svg{width:16px;height:16px;fill:currentColor}
.ft-col{display:flex;flex-direction:column;gap:14px}
.ft-h{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.4);font-weight:600}
.ft-col a{color:rgba(255,255,255,.72);text-decoration:none;font-size:15px;font-weight:400;transition:color .2s;width:fit-content}
.ft-col a:hover{color:var(--teal)}
.ft-legal{padding:28px 0;border-top:1px solid rgba(255,255,255,.06)}
.ft-legal p{margin:0 0 12px;font-size:12.5px;line-height:1.7;color:rgba(255,255,255,.34);max-width:980px;font-weight:400}
.ft-legal p:last-child{margin-bottom:0}
.ft-legal a{color:rgba(255,255,255,.55);text-decoration:underline;text-underline-offset:2px;transition:color .2s}
.ft-legal a:hover{color:var(--teal)}
.ft-giant{position:relative;overflow:hidden;margin-top:8px}
.ft-giant-inner{max-width:1300px;margin:0 auto;padding:0 6%}
.ft-giant .word{display:block;font-weight:700;font-size:clamp(64px,9vw,120px);line-height:.9;letter-spacing:-.03em;color:rgba(255,255,255,.06);white-space:nowrap;user-select:none}
.ft-giant .word b{color:rgba(5,230,221,.28)}
.ft-bottom{border-top:1px solid rgba(255,255,255,.08)}
.ft-bottom-inner{max-width:1300px;margin:0 auto;padding:24px 6%;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}
.ft-copy{font-size:13.5px;color:rgba(255,255,255,.4)}
.ft-right{display:flex;flex-direction:column;gap:6px;align-items:flex-end;text-align:right}
.ft-right span{font-size:13.5px;color:rgba(255,255,255,.4);letter-spacing:.02em}
.ft-right .ft-au{color:rgba(255,255,255,.55);display:flex;align-items:center;gap:8px}
@media(max-width:860px){
  .ft-wrap{padding:56px 7% 0}
  .ft-top{padding-bottom:44px}
  .ft-cols{grid-template-columns:1fr 1fr;gap:30px;padding:44px 0}
  .ft-brand{grid-column:1/-1;padding-right:0}
  .ft-bottom-inner{flex-direction:column;align-items:flex-start}
  .ft-right{align-items:flex-start;text-align:left}
}

/* ========================================================================
   SITE-WIDE LIGHT THEME — light-theme re-skin (approved on the business
   pilot, promoted here so every page that links style.css flips together).
   Appended last, so it overrides the dark base rules above via the cascade.
   Look only; motion (GSAP/Lenis) is not included. Splash (index.html) is
   self-contained and keeps its dark entry. Added 21/06/2026.
   ======================================================================== */
:root{
  --bg:#F7F4EF;        /* cream page (redesign) */
  --panel:#FFFFFF;     /* white cards */
  --panel2:#EDE9E1;    /* cream-mid */
  --ink:#141413;       /* near-black ink (redesign) */
  --muted:#6B6866;
  --line:rgba(20,20,19,.09);
  --teal:#05E6DD;      /* Fync accent kept */
  /* redesign aliases — reuse existing token names where components below need them */
  --cream:#F7F4EF;
  --cream-mid:#EDE9E1;
  --ink-soft:#1e1d1c;
  --red:#000000;       /* dark accent is BLACK in the new look */
  --orange:#05E6DD;
  --overlap:#05E6DD;
  --gray-3:#F0EDE7;
  --gray-5:#E4E0D8;
  --gray-40:#9B9891;
  --gray-60:#6B6866;
  --border-light:rgba(20,20,19,0.09);
  --border-mid:rgba(20,20,19,0.16);
  --shadow-sm:0 1px 4px rgba(20,20,19,0.07);
  --shadow-md:0 4px 20px rgba(20,20,19,0.09);
  --shadow-lg:0 16px 56px rgba(20,20,19,0.15);
  --r-sm:10px;
  --r-md:18px;
  --r-lg:28px;
  --r-xl:44px;
}
body{background:var(--bg);color:var(--ink);font-family:var(--font);display:flow-root}
h1,h2,h3{letter-spacing:-.025em;font-weight:700}
.hero h1,.sechead h2{font-weight:700}

/* floating frosted pill nav (inner pages — scoped to #nav) */
#nav{position:sticky;top:14px;margin:14px auto 0;max-width:1160px;border-radius:999px;padding:14px 26px;
    background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);
    border:1px solid rgba(20,22,26,.07);box-shadow:0 14px 44px -18px rgba(0,0,0,.3)}
#nav.scrolled{background:rgba(255,255,255,.88);border-bottom:1px solid rgba(20,22,26,.07)}
.navr{color:var(--muted)} .navr a:hover{color:var(--ink)}
.world a{color:var(--muted)} .world a.on{color:var(--ink)}
.navbtn{color:var(--ink)!important;border-color:rgba(20,22,26,.22)} .navbtn:hover{border-color:var(--teal);color:var(--teal)!important}
.navtoggle span{background:var(--ink)}
/* mobile menu overlay was dark (#08090b) in the old theme — flip it to a light frosted panel so the now-dark links read */
@media (max-width:860px){.navr{background:rgba(255,255,255,.98);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 24px 50px -28px rgba(0,0,0,.35)}}
.mega{background:rgba(255,255,255,.98);border:1px solid var(--line);box-shadow:0 34px 90px -34px rgba(0,0,0,.32)}
.mega-h{color:var(--muted)} .mega-item b{color:var(--ink)} .mega-item span{color:var(--muted)} .mega-item:hover{background:rgba(20,22,26,.04)}
.btn-ghost{color:var(--ink);border-color:rgba(20,22,26,.2)} .btn-ghost:hover{border-color:var(--teal);color:var(--teal)}

/* hero: dark video as a rounded inset card on the light page */
.hero{margin:104px 16px 0;border-radius:30px;overflow:hidden;min-height:80vh}
/* Landing-page hero (For you / For business only): contained box (~82% width, generous side margins), larger rounded corners, fluid reveal + parallax video */
.hero.hero-landing{width:82%;max-width:1500px;margin:104px auto 0;border-radius:44px;opacity:0;animation:heroReveal 1.05s cubic-bezier(.22,1,.36,1) .05s both}
.hero.hero-landing video{transform:scale(1.1);will-change:transform}
@keyframes heroReveal{from{opacity:0;transform:translateY(30px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.hero.hero-landing{opacity:1;animation:none}.hero.hero-landing video{transform:none}}
.hero .inner,.hero h1,.hero .eyebrow{color:#fff}
.hero p{color:#fff;opacity:.92}
.hero .shade{background:linear-gradient(180deg,rgba(10,12,16,.32),rgba(10,12,16,.74))}
/* prepared-package hero (personal page opened from a shared quote link): shorter so the package peeks, with a scroll CTA */
.hero.hero-landing.prepared{min-height:52vh;margin-top:84px}
.hero .hero-cta{margin-top:38px;background:var(--teal);color:#06201F}
.hero .hero-cta:hover{background:#fff;color:#06201F}

/* big rounded headlines + airy body */
.sechead h2{font-size:clamp(40px,5.2vw,72px);color:var(--ink)}
.sechead p,.sell,.card p,.feat li,.foot-note,.onboard,.exc-h,.submit-note{color:var(--muted);line-height:1.6}
.inc-h{color:var(--ink)}
.sec .eyebrow{color:var(--ink);opacity:.65}
.sec .sechead .eyebrow::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--teal);margin-right:9px;vertical-align:middle;box-shadow:0 0 10px rgba(5,230,221,.7)}

/* whitespace */
.sec{padding:88px 0;border-top:none} .sec.first{padding-top:128px}
@media(max-width:760px){.sec{padding:60px 0}}

/* bento: white rounded cards, soft shadow */
.plan,.card,.compare-card,.step,.t,.rev,.summary{background:var(--panel);border:1px solid var(--line);border-radius:26px;box-shadow:0 18px 50px -34px rgba(0,0,0,.35)}
.plan,.card,.compare-card{padding:36px 32px}
.trust .t{padding:30px 28px}
.rev{padding:28px 32px}
.summary{padding:14px 30px}
.trust{background:var(--bg)}
.addon{background:var(--panel);border-radius:18px;box-shadow:0 10px 30px -22px rgba(0,0,0,.4)}
.addon:hover{box-shadow:0 18px 44px -22px rgba(5,230,221,.35)}
.addon.on{background:rgba(5,230,221,.08)}
.plan .nm,.rev-quote,.summary .k{color:var(--muted)} .summary .v{color:var(--ink)}
.feat li{border-top-color:rgba(20,22,26,.1)}
.plan:hover,.card:hover{border-color:rgba(5,230,221,.5);box-shadow:0 26px 64px -30px rgba(5,230,221,.4)}
.plan.selected,.compare-card.fync{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal),0 22px 60px -30px rgba(5,230,221,.45)}
.compare-card li{color:var(--muted);border-top-color:rgba(20,22,26,.1)} .compare-card li b,.compare-card .cfoot b{color:var(--ink)} .compare-card .cfoot{color:var(--muted)}

/* funnel + form controls on light */
.step .n{color:var(--teal)} .pick-label,.or-divider{color:var(--muted)}
.toggle{border-color:var(--line)} .toggle button{color:var(--muted)} .toggle button.on{background:var(--ink);color:#fff}
.door button{border:1px solid var(--line);color:var(--muted)} .door button.on{border-color:var(--teal);color:var(--ink)}
.field label{color:var(--muted)} input,textarea{background:#fff;border:1px solid var(--line);color:var(--ink)} .check span{color:var(--muted)}
.qa{border-bottom:1px solid var(--line)} .qa button{color:var(--ink)} .qa .a p{color:var(--muted)}
.creds .cred{color:var(--ink)}

/* buttons: dark/black primary pill (redesign .btn-dark), teal on hover */
.btn{background:var(--ink);color:#fff;border-radius:999px;border:none;box-shadow:var(--shadow-md);text-transform:none;letter-spacing:-.01em;font-weight:700;font-size:14px;padding:15px 30px}
.btn:hover{background:var(--teal);color:#000;transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn .arw{transition:transform .35s} .btn:hover .arw{transform:translateX(6px)}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--border-mid);border-radius:999px;text-transform:none;letter-spacing:-.01em;font-weight:600;font-size:14px}
.btn-ghost:hover{background:var(--teal);border-color:var(--teal);color:#000}

/* Ask Fync sphere: the orb video is mix-blend:screen, so the boxes it sits in go black and the sphere melts in (no disc). Bottom-corner launcher .fcl-orb left as-is. */
.mega-aside{background:#0a0c10;border-color:rgba(255,255,255,.08)}
.mega-aside b{color:#fff} .mega-aside span{color:rgba(255,255,255,.6)}
.mega-aside .btn-ghost{color:#fff;border-color:rgba(255,255,255,.28)}
.mega-aside .btn-ghost:hover{color:var(--teal);border-color:var(--teal)}
.fcp-head{background:#0a0c10;border-bottom-color:rgba(255,255,255,.08)}
.fcp-head b{color:#fff} .fcp-head span{color:rgba(255,255,255,.6)}
.fcp-x{color:rgba(255,255,255,.55)} .fcp-x:hover{color:#fff}
/* Ask Fync chat: keep legible on the cream theme (dark ink pill + white text) */
.fync-chat-launch{background:#08090B;-webkit-backdrop-filter:none;backdrop-filter:none;color:#fff;border:none;box-shadow:0 4px 14px rgba(8,9,11,.22)}
.fync-chat-launch:hover{border-color:var(--teal)}
.fync-chat-launch .dot{background:var(--teal)}
.fync-chat-panel{background:var(--bg);border-color:var(--line);box-shadow:0 24px 70px rgba(20,20,19,.22)}
.fcp-msg.bot{background:#fff;border-color:var(--line);color:var(--ink)}
.fcp-msg.me{background:var(--teal);color:#06201F}
.fcp-chips button{color:var(--ink);border-color:var(--line)} .fcp-chips button:hover{border-color:var(--teal);color:#0a8f88}
.fcp-input{background:#fff;border-top-color:var(--line)}
.fcp-input textarea{background:var(--bg);border-color:var(--line);color:var(--ink)}

/* footer on light — default the footer text colour to ink so nothing inherits the old white */
.site-footer{background:#fff;color:var(--ink);border-top:1px solid var(--line)}
footer .brand{color:var(--ink)}
.ft-statement,.ft-mark,.ft-h,.ft-cta,.ft-brand a{color:var(--ink)}
.ft-col a,.ft-sub,.ft-legal p,.ft-copy,.ft-right span,.ft-right .ft-au,.ft-social a{color:var(--muted)} .ft-col a:hover{color:var(--teal)}
.ft-social a:hover{color:var(--teal)}
.ft-legal a{color:var(--ink)} .ft-legal a:hover{color:var(--teal)}
.ft-giant .word{color:rgba(20,22,26,.04)}

/* ========================================================================
   REDESIGN COMPONENTS — ported from .claude/redesign-home.html so every page
   that links style.css can adopt the new homepage look. Uses the kept token
   names (retuned above). Hero ported under .hero-home (NOT .hero) so the
   inner-page video .hero is untouched. Nav is .mc (NOT bare nav). Added 23/06/2026.
   ======================================================================== */

/* ── brand mark (twin circles) ── */
.mark{position:relative;width:34px;height:22px;flex-shrink:0;display:inline-block}
.mark .c1,.mark .c2{position:absolute;top:0;width:22px;height:22px;border-radius:50%}
.mark .c1{left:0;background:var(--red)}
.mark .c2{right:0;background:var(--orange);mix-blend-mode:multiply}

/* ── PRIMARY NAV ── */
.mcwrap{position:fixed;top:18px;left:0;right:0;z-index:999;display:flex;justify-content:center;padding:0 24px;pointer-events:none}
.mc{pointer-events:auto;width:100%;max-width:1240px;background:rgba(247,244,239,0.6);-webkit-backdrop-filter:blur(26px) saturate(1.6);backdrop-filter:blur(26px) saturate(1.6);border:1px solid rgba(255,255,255,0.5);border-radius:var(--r-xl);box-shadow:var(--shadow-md);transition:border-radius .35s ease,box-shadow .35s ease}
.mc.open{border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}
.mc-bar{display:flex;align-items:center;height:74px;padding:0 16px 0 28px}
.mc-logo{position:relative;display:flex;align-items:baseline;gap:0;line-height:1;font-weight:800;font-size:1.65rem;letter-spacing:-.035em;margin-right:0;flex-shrink:0;font-family:var(--font);color:var(--ink)}
.mc-logo::after{content:'';position:absolute;inset:-7px -12px;border:1.5px solid var(--red);border-radius:100px;opacity:0;transform:scale(.9);transition:opacity .3s ease,transform .35s cubic-bezier(.22,1,.36,1);pointer-events:none}
.mc-logo:hover::after{opacity:1;transform:scale(1)}
.mc-nav{display:flex;align-items:center;justify-content:center;gap:2px;flex:1}
.mc-item{position:relative;background:none;border:0;font-family:var(--font);font-size:.92rem;font-weight:500;word-spacing:.16em;color:var(--ink);padding:11px 18px 13px;border-radius:100px;cursor:pointer;transition:background .2s}
.mc-item:hover{background:rgba(20,20,19,.05)}
.mc-item::after{content:'';position:absolute;left:18px;right:18px;bottom:6px;height:2px;background:var(--red);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.mc-item:hover::after,.mc-item.active::after{transform:scaleX(1)}
.mc-item.mc-current{background:rgba(20,20,19,.06);font-weight:700}
.mc-item.mc-current::after{transform:scaleX(1)}
.mc-cta{display:inline-flex;align-items:center;gap:7px;padding:11px 22px;background:var(--ink);color:#fff;border-radius:100px;font-size:.85rem;font-weight:700;letter-spacing:-.01em;transition:background .2s,color .2s,transform .2s;flex-shrink:0}
.mc-cta:hover{background:var(--orange);color:#000;transform:translateY(-1px)}
.mc-panels{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.22,1,.36,1)}
.mc.open .mc-panels{grid-template-rows:1fr}
.mc-panels-inner{overflow:hidden}
.mc-panel{display:none;grid-template-columns:320px 1fr;gap:22px;padding:6px 26px 26px}
.mc-panel.show{display:grid}
.mc-cats{display:flex;flex-direction:column}
.mc-cat{display:flex;align-items:center;justify-content:space-between;gap:16px;background:none;border:0;font-family:var(--font);font-size:1.04rem;font-weight:500;color:var(--ink);text-align:left;padding:15px 16px;border-radius:var(--r-sm);cursor:pointer;transition:background .2s}
.mc-cat:hover,.mc-cat.on{background:#fff;box-shadow:var(--shadow-sm)}
.mc-cat .chev{color:var(--gray-40);font-size:.9rem}
.mc-overview{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:1rem;font-weight:500;color:var(--gray-60);text-decoration:none;padding:13px 16px;border-radius:var(--r-sm);margin-bottom:2px;transition:background .2s,color .2s}
.mc-overview:hover{background:#fff;box-shadow:var(--shadow-sm);color:var(--ink)}
.mc-overview .chev{color:var(--gray-40);font-size:.9rem}
.mob-row.mob-current{font-weight:800}
.mob-over{font-weight:500;color:var(--gray-60)}
.mc-detailwrap{background:#fff;border-radius:var(--r-md);padding:24px 30px;box-shadow:var(--shadow-sm);align-self:start}
.mc-detail{display:none}
.mc-panel:not(.detail-open) .mc-detailwrap{display:none}
.mc-detail.on{display:block}
.mc-desc{font-size:1.02rem;line-height:1.6;color:var(--gray-60);margin:2px 0 20px;max-width:46ch}
.mc-more{display:inline-flex;align-items:center;gap:7px;font-size:.92rem;font-weight:700;color:var(--ink);transition:color .2s}
.mc-more:hover{color:var(--red)}
.mc-addons{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px}
.mc-addon{display:block;padding:8px 0}
.mc-addon b{display:block;font-size:.95rem;font-weight:700;color:var(--ink);margin-bottom:3px;transition:color .2s}
.mc-addon span{font-size:.82rem;line-height:1.5;color:var(--gray-60)}
.mc-addon:hover b{color:var(--red)}
.mc-ask{grid-column:1/-1;display:flex;align-items:center;gap:18px;margin-top:6px;background:var(--ink);border-radius:var(--r-md);padding:20px 26px}
.mc-ask .orb{width:56px;height:56px;flex:0 0 auto}
.mc-ask .orb video{width:100%;height:100%;object-fit:cover;display:block;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%);mask-image:radial-gradient(circle,#000 54%,rgba(0,0,0,0) 74%)}
.mc-ask b{color:#fff;font-size:.96rem;font-weight:700;display:block;margin-bottom:2px}
.mc-ask span{color:rgba(255,255,255,.5);font-size:.83rem}
.mc-ask .ask-btn{margin-left:auto;display:inline-flex;align-items:center;gap:7px;background:#fff;color:var(--ink);padding:11px 20px;border-radius:100px;font-size:.83rem;font-weight:700;flex-shrink:0;transition:background .2s,color .2s,transform .2s}
.mc-ask .ask-btn:hover{background:var(--orange);color:#000;transform:translateY(-1px)}
.mc-scrim{position:fixed;inset:0;z-index:998;background:transparent;display:none}
.mc-scrim.show{display:block}
.mc-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;background:none;border:0;cursor:pointer;padding:0}
.mc-burger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;margin:0 auto}

/* ── MOBILE DRILL-DOWN MENU ── */
.mob{position:fixed;inset:0;z-index:1100;background:var(--cream);transform:translateX(100%);transition:transform .35s cubic-bezier(.22,1,.36,1);overflow-y:auto;padding:14px 26px 48px}
.mob.open{transform:none}
.mob-bar{display:flex;align-items:center;justify-content:space-between;height:60px;margin-bottom:14px}
.mob-close{background:none;border:0;font-size:2rem;line-height:1;color:var(--ink);cursor:pointer;font-family:var(--font);width:42px;height:42px}
.mob-logo{font-weight:800;font-size:1.3rem;letter-spacing:-.035em;color:var(--ink)}
.mob-logo b{color:var(--orange)}
.mob-level{display:none}
.mob-level.show{display:block;animation:mobIn .3s ease}
@keyframes mobIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
.mob-row{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;background:none;border:0;border-top:1px solid var(--border-light);padding:22px 2px;font-family:var(--font);font-size:1.45rem;font-weight:600;letter-spacing:-.02em;color:var(--ink);text-align:left;cursor:pointer;text-decoration:none}
.mob-row .chev{color:var(--gray-40);font-size:1.3rem;font-weight:400}
.mob-back{background:none;border:0;font-family:var(--font);font-size:1rem;font-weight:600;color:var(--gray-60);cursor:pointer;padding:8px 0;margin-bottom:4px}
.mob-h{font-size:2.1rem;font-weight:800;letter-spacing:-.03em;margin:6px 0 8px}
.mob-cta{display:inline-flex;align-items:center;gap:8px;margin-top:30px;background:var(--ink);color:#fff;padding:15px 28px;border-radius:100px;font-size:.95rem;font-weight:700;text-decoration:none}

/* ── HOMEPAGE SHARED HELPERS ── */
.section{padding:96px max(48px,calc((100% - 1240px)/2))}
.label{font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:14px}
.heading{font-size:clamp(2.4rem,4vw,3.4rem);font-weight:800;letter-spacing:-.035em;line-height:1.04;margin-bottom:14px;max-width:560px;font-family:var(--font)}
.subtext{font-size:.98rem;line-height:1.68;color:var(--gray-60);max-width:440px;margin-bottom:56px}
.btn-dark{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:var(--ink);color:#fff;border-radius:100px;font-size:.88rem;font-weight:700;letter-spacing:-.01em;transition:background .2s,color .2s,transform .2s}
.btn-dark:hover{background:var(--teal);color:#06201F;transform:translateY(-1px)}
.btn-teal{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:var(--teal);color:#06201F;border-radius:100px;font-size:.88rem;font-weight:700;letter-spacing:-.01em;transition:background .2s,color .2s,transform .2s}
.btn-teal:hover{background:#000;color:#fff;transform:translateY(-1px)}

/* ── HERO (homepage — scoped to .hero-home, NOT .hero) ── */
.hero-home{min-height:86vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:150px max(48px,calc((100% - 1240px)/2)) 80px;gap:40px;position:relative;overflow:hidden;background:var(--cream)}
.hero-home::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 70% 50%,rgba(5,230,221,.07) 0%,transparent 70%);pointer-events:none}
.hero-home .hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.7rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gray-60);background:var(--gray-3);border:1px solid var(--border-light);padding:6px 14px;border-radius:100px;margin-bottom:30px}
.hero-home .hero-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex-shrink:0}
.hero-home .hero-h1{font-size:clamp(3rem,5.6vw,5.2rem);font-weight:800;line-height:1.0;letter-spacing:-.035em;margin-bottom:24px;color:var(--ink)}
.hero-home .hero-h1 em{font-style:italic;font-weight:300;letter-spacing:-.02em}
.hero-home .hero-sub{font-size:1.05rem;line-height:1.7;color:var(--gray-60);max-width:400px;margin-bottom:40px;font-weight:400}
.hero-home .hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero-home .hero-graphic{display:flex;align-items:center;justify-content:center;position:relative}
.hero-home .circles-wrap{position:relative;width:min(440px,100%);aspect-ratio:1}
.hero-home .orbit-ring{position:absolute;inset:-48px;border-radius:50%;border:1px solid var(--border-light);animation:orbit-spin 28s linear infinite}
.hero-home .orbit-ring::before{content:'';position:absolute;width:10px;height:10px;border-radius:50%;background:var(--red);top:14px;left:50%;transform:translateX(-50%)}
.hero-home .orbit-ring::after{content:'';position:absolute;width:6px;height:6px;border-radius:50%;background:var(--orange);bottom:20px;right:18%;transform:translateY(50%)}
.hero-home .orbit-ring-2{position:absolute;inset:-90px;border-radius:50%;border:1px dashed var(--border-light);animation:orbit-spin 52s linear infinite reverse}
.hero-home .hero-svg{width:100%;height:100%;position:relative;z-index:1}
@keyframes orbit-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* ── SPLIT PATHS (dark) ── */
.paths{display:grid;grid-template-columns:1fr 1fr;background:var(--ink);min-height:500px}
.path-panel{padding:64px 52px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;cursor:pointer;transition:background .4s}
.path-panel:first-child{border-right:1px solid rgba(255,255,255,.07);padding-left:max(48px,calc(50vw - 620px))}
.path-panel:last-child{padding-right:max(48px,calc(50vw - 620px))}
.path-panel:hover{background:rgba(255,255,255,.028)}
.path-glow{position:absolute;width:320px;height:320px;border-radius:50%;top:-100px;opacity:0;transition:opacity .55s,transform .55s;transform:scale(.75) translate(60px,-20px);pointer-events:none}
.path-panel:first-child .path-glow{background:radial-gradient(circle,rgba(5,230,221,.45) 0%,transparent 65%);right:-60px}
.path-panel:last-child .path-glow{background:radial-gradient(circle,rgba(5,230,221,.45) 0%,transparent 65%);left:-60px}
.path-panel:hover .path-glow{opacity:1;transform:scale(1) translate(0,0)}
.path-tag{font-size:.7rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.9);margin-bottom:18px;position:relative;z-index:1}
.path-title{font-size:clamp(2rem,3.2vw,2.9rem);font-weight:800;line-height:1.08;letter-spacing:-.03em;color:#fff;max-width:300px;margin-bottom:16px;position:relative;z-index:1;display:inline-block}
.path-title::after{content:'';position:absolute;left:0;bottom:-8px;width:100%;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.path-panel:hover .path-title::after{transform:scaleX(1)}
.path-desc{font-size:1.05rem;line-height:1.6;color:rgba(255,255,255,.85);max-width:360px;position:relative;z-index:1}
.path-enter{display:inline-flex;align-items:center;gap:12px;margin-top:40px;font-size:.85rem;font-weight:600;color:rgba(255,255,255,.55);transition:color .25s;position:relative;z-index:1}
.path-arrow{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:.85rem;transition:border-color .25s,transform .25s}
.path-panel:hover .path-enter{color:rgba(255,255,255,.9)}
.path-panel:hover .path-arrow{border-color:rgba(255,255,255,.6);transform:translateX(4px)}

/* ── SERVICES GRID ── */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--border-light);border-radius:var(--r-lg);overflow:hidden}
.svc-item{background:var(--cream);padding:36px 32px;border-right:1px solid var(--border-light);border-bottom:1px solid var(--border-light);transition:background .22s;cursor:default;position:relative;overflow:hidden}
.svc-item:nth-child(3n){border-right:none}
.svc-item:nth-child(4),.svc-item:nth-child(5),.svc-item:nth-child(6){border-bottom:none}
.svc-item::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--red),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .35s}
.svc-item:hover{background:#fff}
.svc-item:hover::after{transform:scaleX(1)}
.svc-dot{width:8px;height:8px;border-radius:50%;margin-bottom:22px;flex-shrink:0}
.dot-red{background:var(--red)}
.dot-orange{background:var(--orange)}
.svc-name{font-size:1rem;font-weight:700;letter-spacing:-.02em;margin-bottom:8px}
.svc-desc{font-size:.84rem;line-height:1.65;color:var(--gray-60)}
a.svc-item{text-decoration:none;color:inherit;cursor:pointer;display:block}
a.svc-item .svc-name{transition:color .2s}
a.svc-item:hover .svc-name{color:var(--red)}

/* ── STATS BAND ── */
.stats-band{background:var(--red);padding:72px max(48px,calc((100% - 1240px)/2));display:grid;grid-template-columns:repeat(4,1fr);gap:32px;position:relative;overflow:hidden}
.stats-band::before,.stats-band::after{content:'';position:absolute;border-radius:50%;opacity:.15}
.stats-band::before{width:600px;height:600px;background:#fff;left:-200px;top:-300px}
.stats-band::after{width:400px;height:400px;background:#fff;right:-100px;bottom:-200px}
.stat{text-align:center;position:relative;z-index:1}
.stat-n{font-size:clamp(2.4rem,4.5vw,4rem);font-weight:800;letter-spacing:-.035em;line-height:1;color:#fff;margin-bottom:8px}
.stat-l{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}

/* ── FEATURE SPOTLIGHT ── */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;padding:96px max(48px,calc((100% - 1240px)/2))}
.stadium{background:var(--cream-mid);border-radius:var(--r-xl);padding:44px;position:relative;overflow:hidden;aspect-ratio:4/3;display:flex;flex-direction:column;justify-content:flex-end}
.stadium-arc1{position:absolute;width:500px;height:500px;border-radius:50%;border:80px solid rgba(20,20,19,.04);top:-200px;right:-200px}
.stadium-arc2{position:absolute;width:280px;height:280px;border-radius:50%;border:1px solid var(--border-light);bottom:-80px;left:-60px}
.ui-card{background:#fff;color:#141413;border-radius:var(--r-md);padding:22px 26px;box-shadow:var(--shadow-lg);position:relative;z-index:1}
.ui-lbl{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gray-40);margin-bottom:8px}
.ui-val{font-size:2.2rem;font-weight:800;letter-spacing:-.03em;margin-bottom:6px}
.ui-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ui-sub{font-size:.82rem;color:var(--gray-60)}
.pill-ok{display:inline-flex;align-items:center;gap:4px;background:#eefaf3;color:#0d7a3e;font-size:.73rem;font-weight:700;padding:3px 10px;border-radius:100px;letter-spacing:-.005em}
.feat-content .label{margin-bottom:14px}
.feat-h{font-size:clamp(2rem,3.2vw,2.8rem);font-weight:800;letter-spacing:-.035em;line-height:1.08;margin-bottom:18px}
.feat-body{font-size:.97rem;line-height:1.7;color:var(--gray-60);margin-bottom:32px}
.checklist{list-style:none;display:flex;flex-direction:column;gap:11px}
.checklist li{display:flex;align-items:center;gap:12px;font-size:.88rem;font-weight:500;color:var(--ink)}
.chk{width:20px;height:20px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.6rem;flex-shrink:0;line-height:1}

/* ── WHY FYNC (dark section) ── */
.dark-section{background:var(--ink);padding:96px max(48px,calc((100% - 1240px)/2))}
.dark-section .heading{color:#fff}
.dark-section .label{color:rgba(255,255,255,.6)}
.ds-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:56px}
.ds-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:var(--r-lg);padding:36px 32px;transition:background .3s,border-color .3s;position:relative;overflow:hidden}
.ds-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;transform:scaleX(0);transform-origin:left;transition:transform .4s}
.ds-card:nth-child(odd)::before{background:linear-gradient(90deg,var(--red),var(--overlap))}
.ds-card:nth-child(even)::before{background:linear-gradient(90deg,var(--overlap),var(--orange))}
.ds-card:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12)}
.ds-card:hover::before{transform:scaleX(1)}
.ds-icon{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;margin-bottom:20px}
.icon-red{background:rgba(0,0,0,.16)}
.icon-orange{background:rgba(5,230,221,.16)}
.ds-title{font-size:1rem;font-weight:700;color:#fff;letter-spacing:-.015em;margin-bottom:9px}
.ds-desc{font-size:.85rem;line-height:1.65;color:rgba(255,255,255,.78)}

/* ── CTA SECTION ── */
.cta-wrap{padding:40px max(48px,calc((100% - 1240px)/2)) 64px}
.cta-inner{background:var(--ink);border-radius:var(--r-xl);padding:80px 60px;text-align:center;position:relative;overflow:hidden}
.cta-c1,.cta-c2{position:absolute;width:440px;height:440px;border-radius:50%;top:50%;transform:translateY(-50%);opacity:.12;pointer-events:none}
.cta-c1{background:var(--red);left:-160px}
.cta-c2{background:var(--orange);right:-160px}
.cta-eyebrow{font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.32);margin-bottom:20px;position:relative}
.cta-h{font-size:clamp(2.6rem,5vw,4rem);font-weight:800;letter-spacing:-.035em;line-height:1.0;color:#fff;margin-bottom:18px;position:relative}
.cta-sub{font-size:.98rem;line-height:1.68;color:rgba(255,255,255,.46);max-width:420px;margin:0 auto 40px;position:relative}
.btn-white{display:inline-flex;align-items:center;gap:8px;padding:15px 32px;background:#fff;color:var(--ink);border-radius:100px;font-size:.9rem;font-weight:800;letter-spacing:-.01em;transition:background .2s,color .2s,transform .2s;position:relative}
.btn-white:hover{background:var(--orange);color:#000;transform:translateY(-1px)}

/* ── PROGRESS BAR + ASK-FYNC LAUNCHER (redesign) ── */
.progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--red),var(--orange));transform-origin:left;transform:scaleX(0);z-index:1000;transition:transform .1s linear}
.ask-launch{position:fixed;right:22px;bottom:22px;z-index:900;display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:#fff;padding:9px 20px 9px 11px;border-radius:100px;box-shadow:0 12px 32px rgba(20,20,19,.28);font-size:.9rem;font-weight:700;letter-spacing:-.01em;opacity:0;transform:translateY(14px) scale(.96);pointer-events:none;transition:opacity .4s ease,transform .4s cubic-bezier(.22,1,.36,1)}
.ask-launch.show{opacity:1;transform:none;pointer-events:auto}
.ask-launch:hover{transform:translateY(-2px)}
.ask-orb{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--orange),var(--red));flex-shrink:0;box-shadow:0 0 0 3px rgba(5,230,221,.18)}

/* ── REDESIGN RESPONSIVE ── */
@media (max-width:900px){
  .mc-nav{display:none}
  .mc-cta{display:none}
  .mc-burger{display:flex;position:absolute;left:14px;top:50%;transform:translateY(-50%)}
  .mc-bar{position:relative;justify-content:center;padding:0 16px}
  .mc-logo{margin:0}
  .hero-home{grid-template-columns:1fr;padding:120px 28px 60px;min-height:auto}
  .hero-home .hero-graphic{display:none}
  .paths,.svc-grid,.stats-band,.feature,.ds-grid{grid-template-columns:1fr}
  .path-panel:first-child,.path-panel:last-child{padding:44px 28px}
  .svc-item:nth-child(3n){border-right:1px solid var(--border-light)}
  .section,.dark-section,.feature,.stats-band{padding-left:28px;padding-right:28px}
}

/* ── keyboard focus visibility (a11y) — restores a visible focus ring for keyboard
   users; overrides the outline:none rules above. :focus-visible = keyboard only,
   so mouse clicks stay ring-free. #0a8f88 (darker teal) keeps a usable contrast
   ratio on both the light and dark sections. Added 24/06/2026. ── */
:focus-visible{outline:2px solid #0a8f88;outline-offset:2px}
input:focus-visible,select:focus-visible,textarea:focus-visible,#rev-slider:focus-visible{outline:2px solid #0a8f88;outline-offset:1px}

/* ── Form-guard honeypot: parked off-screen so humans never see or tab into
   it; bots that fill it are dropped server-side. ── */
.hpfld{position:absolute!important;left:-9999px!important;top:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}

/* ═══════════════════════════════════════════════════════════════════════
   RESOURCES SECTION (/resources hub + /insights/* + /guides/*)
   Recreated from Ash's design handoff 27/07/2026 on the OFFICIAL tokens:
   accent #05E6DD (repo --teal), ink #141413, bg #F7F4EF. The accent scale
   below is DERIVED per the handoff contrast rules (never copy new values
   in without re-measuring — see design_handoff_fync_resources/START-HERE §3):
     --rs-deep   #086B67  5.78:1 on bg, 6.35:1 on white  (text-bearing teal)
     --rs-press  #064D4A  9.69:1 on white                (hover on deep fills)
     --rs-bright #50FBF4  14.4:1 on ink                  (dark panels only)
     --rs-tint   #EAF3EE / --rs-tint2 #D0F2EC            (washes + borders)
   HARD RULES the palette encodes: white text NEVER sits on the raw accent
   (1.57:1) and the raw accent is NEVER text on a light surface (1.44:1).
   Cyan fills carry ink text; teal that must read as text is --rs-deep.
   Bylines are dropped site-wide by Paul's call (27/07/2026): cards and
   templates carry dates + read time, never names.
   ═══════════════════════════════════════════════════════════════════════ */
:root{
  --rs-acc:#05E6DD; --rs-deep:#086B67; --rs-press:#064D4A; --rs-bright:#50FBF4;
  --rs-tint:#EAF3EE; --rs-tint2:#D0F2EC; --rs-ink2:#4A4846;
  --rs-line:#E7E4DE; --rs-line2:#D8D5CE; --rs-deep-panel:#071010;
  --rs-ease:cubic-bezier(.22,1,.36,1);
}
.rs-wrap{max-width:1240px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
@keyframes rsSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--rs-ease),transform .7s var(--rs-ease)}
[data-reveal].rs-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .rs-page *{animation:none!important;transition-duration:.01ms!important}
  [data-reveal]{opacity:1!important;transform:none!important}
}

/* ---- hub header ---- */
.rs-head{position:relative;overflow:hidden;padding-top:128px}
@media(max-width:760px){.rs-head{padding-top:104px}}
.rs-glow{position:absolute;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(5,230,221,.16) 0%,transparent 66%);top:-230px;right:-140px;pointer-events:none}
.rs-eyebrow{font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--rs-deep);margin-bottom:14px}
.rs-h1{font-size:clamp(2.6rem,5vw,4.2rem);font-weight:800;letter-spacing:-.04em;line-height:1.02;margin-bottom:20px;max-width:640px;text-wrap:pretty}
.rs-h1 em{font-style:italic;font-weight:300;letter-spacing:-.02em;color:var(--ink)}
.rs-sub{font-size:1.02rem;line-height:1.7;color:var(--rs-ink2);max-width:470px;text-wrap:pretty}

/* ---- switcher + search row ---- */
.rs-controls{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-top:56px}
.rs-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:relative;background:var(--gray-3);border:1px solid var(--rs-line);border-radius:100px;padding:5px;min-width:min(440px,100%);flex:1 1 340px;max-width:520px}
@media(max-width:760px){.rs-switch{min-width:min(340px,100%)}}
.rs-thumb{position:absolute;top:5px;bottom:5px;left:5px;width:calc((100% - 10px)/3);border-radius:100px;background:var(--ink);transition:transform .38s var(--rs-ease);z-index:0}
.rs-tab{position:relative;z-index:1;border:none;background:none;font-family:inherit;cursor:pointer;padding:11px 14px;border-radius:100px;font-size:.87rem;font-weight:600;color:var(--rs-ink2);display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:color .28s;min-width:0}
@media(max-width:420px){.rs-tab{padding:11px 4px;gap:6px;font-size:.78rem}}
.rs-tab:hover{color:var(--ink)}
.rs-tab[aria-selected="true"]{color:#fff}
/* glyphs: filled dot = insights, ring = guides, both = everything. Form, not colour. */
.rs-tab .gdot{width:10px;height:10px;border-radius:50%;background:var(--rs-deep);flex-shrink:0}
.rs-tab .gring{width:10px;height:10px;border-radius:50%;border:2px solid var(--rs-deep);box-sizing:border-box;flex-shrink:0;background:none}
.rs-tab .gpair{width:24px;height:10px;position:relative;flex-shrink:0}
.rs-tab .gpair .gdot{position:absolute;top:0;left:0}
.rs-tab .gpair .gring{position:absolute;top:0;right:0}
.rs-tab[aria-selected="true"] .gdot{background:var(--rs-bright)}
.rs-tab[aria-selected="true"] .gring{border-color:var(--rs-bright)}
.rs-searchwrap{position:relative;flex:0 1 300px}
.rs-searchwrap svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);opacity:.45;pointer-events:none;color:var(--rs-ink2)}
.rs-searchwrap input{width:100%;font-family:inherit;font-size:.88rem;padding:13px 18px 13px 42px;border-radius:100px;border:1px solid var(--rs-line2);background:#fff;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.rs-searchwrap input:focus{border-color:var(--rs-deep);box-shadow:0 0 0 3px var(--rs-tint);outline:none}
.rs-note{margin-top:20px;font-size:.86rem;line-height:1.6;color:var(--rs-ink2);max-width:580px;min-height:44px}
.rs-note strong{color:var(--ink);font-weight:700}

/* ---- filter bar ---- */
.rs-filters{display:flex;gap:28px;flex-wrap:wrap;align-items:center;border-top:1px solid var(--rs-line);margin-top:36px;padding-top:28px}
.rs-fgroup{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.rs-flabel{font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-right:2px;min-width:68px;flex:0 0 auto}   /* fixed label column so both rows' first chip lines up */
.rs-chip{border:1px solid var(--rs-line);background:transparent;font-family:inherit;cursor:pointer;padding:7px 15px;border-radius:100px;font-size:.81rem;font-weight:500;color:var(--rs-ink2);transition:background .2s,color .2s,border-color .2s}
.rs-chip:hover{background:var(--gray-3);color:var(--ink)}
.rs-chip[aria-pressed="true"]{background:var(--rs-deep);border-color:var(--rs-deep);color:#fff;font-weight:600}
.rs-count{padding-top:26px;font-size:.82rem;color:var(--muted);font-weight:500}

/* ---- featured card ---- */
.rs-feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));background:var(--ink);border-radius:var(--r-xl);overflow:hidden;position:relative;margin-top:32px}
@media(min-width:1081px){.rs-feat{grid-template-columns:1.15fr 1fr}}
.rs-feat-copy{padding:clamp(36px,4vw,56px) clamp(26px,4vw,52px);position:relative;z-index:1}
.rs-feat-tags{display:flex;align-items:center;gap:10px;margin-bottom:22px;flex-wrap:wrap}
.rs-feat-tag{font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:100px;background:rgba(255,255,255,.1);color:rgba(255,255,255,.8)}
.rs-feat-tag.acc{background:rgba(5,230,221,.16);color:var(--rs-bright)}
.rs-feat h2{font-size:clamp(1.8rem,3vw,2.6rem);font-weight:800;letter-spacing:-.035em;line-height:1.1;color:#fff;margin-bottom:16px;text-wrap:pretty}
.rs-feat h2 a{color:#fff;text-decoration:none}
.rs-feat-dek{font-size:.95rem;line-height:1.7;color:rgba(255,255,255,.62);margin-bottom:28px;max-width:450px;text-wrap:pretty}
.rs-feat-meta{font-size:.8rem;color:rgba(255,255,255,.5)}
.rs-feat-viz{position:relative;background:var(--rs-deep-panel);overflow:hidden;min-height:300px}
@media(max-width:1080px){.rs-feat-viz{order:-1;min-height:220px}}
.rs-feat-viz .halo{position:absolute;width:420px;height:420px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(5,230,221,.28) 0%,transparent 62%)}
.rs-feat-viz .ring1{position:absolute;border-radius:50%;border:1px dashed rgba(5,230,221,.18);width:470px;height:470px;left:50%;top:50%;transform:translate(-50%,-50%);animation:rsSpin 78s linear infinite reverse}
.rs-feat-viz .ring2{position:absolute;border-radius:50%;border:1px solid rgba(5,230,221,.26);width:360px;height:360px;left:50%;top:50%;transform:translate(-50%,-50%);animation:rsSpin 44s linear infinite}
.rs-feat-viz .ball{position:absolute;width:280px;height:280px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 34% 30%,var(--rs-bright) 0%,var(--rs-acc) 46%,#067F79 100%)}

/* ---- insight cards ---- */
.rs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:32px}
.rs-card{background:#fff;border:1px solid var(--rs-line);border-radius:var(--r-lg);padding:30px 28px 26px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:transform .3s var(--rs-ease),box-shadow .3s,border-color .3s;color:inherit;text-decoration:none}
.rs-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--rs-acc);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--rs-ease)}
.rs-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--rs-tint2)}
.rs-card:hover::before{transform:scaleX(1)}
.rs-tags{display:flex;align-items:center;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.rs-tag{font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:100px;background:var(--gray-3);color:var(--rs-ink2);border:1px solid var(--rs-line)}
.rs-tag.acc{background:var(--rs-tint);color:var(--rs-deep);border:none}
.rs-card h3{font-size:1.08rem;font-weight:700;letter-spacing:-.025em;line-height:1.3;margin-bottom:10px;text-wrap:pretty;color:var(--ink)}
.rs-card .dek{font-size:.85rem;line-height:1.65;color:var(--rs-ink2);margin-bottom:26px;flex:1;text-wrap:pretty}
.rs-card .meta{font-size:.75rem;color:var(--muted);padding-top:16px;border-top:1px solid var(--rs-line);font-variant-numeric:tabular-nums}

/* ---- guide list ---- */
.rs-groups{margin-top:32px}
.rs-group{margin-bottom:16px;border:1px solid var(--rs-line);border-radius:var(--r-lg);overflow:hidden;background:#fff}
.rs-ghead{display:flex;align-items:center;gap:12px;padding:22px 28px;background:var(--gray-3);border-bottom:1px solid var(--rs-line);flex-wrap:wrap}
.rs-ghead h3{font-size:.95rem;font-weight:700;letter-spacing:-.02em}
.rs-gaud{font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:100px;background:#fff;border:1px solid var(--rs-line);color:var(--rs-ink2)}
.rs-gcount{margin-left:auto;font-size:.75rem;color:var(--muted);font-weight:600}
.rs-row{display:flex;align-items:center;gap:20px;padding:19px 28px;border-bottom:1px solid var(--rs-line);transition:background .2s;flex-wrap:wrap;background:#fff;color:inherit;text-decoration:none}
.rs-row:last-child{border-bottom:none}
.rs-row:hover{background:var(--rs-tint)}
.rs-rnum{font-size:.7rem;font-weight:700;font-variant-numeric:tabular-nums;width:22px;flex-shrink:0;transition:color .2s;color:var(--muted)}
.rs-row:hover .rs-rnum{color:var(--rs-deep)}
.rs-rbody{flex:1 1 200px;min-width:0;overflow-wrap:break-word}
.rs-rtitle{font-size:.92rem;font-weight:600;letter-spacing:-.018em;margin-bottom:3px;display:flex;align-items:center;gap:9px;flex-wrap:wrap;color:var(--ink);min-width:0}
.rs-rsub{font-size:.79rem;color:var(--rs-ink2);overflow-wrap:break-word}
.rs-rdate{font-size:.72rem;color:var(--muted);white-space:nowrap;flex-shrink:0}
.rs-rdate b{display:block;color:var(--rs-ink2);font-weight:600;font-variant-numeric:tabular-nums}
.rs-rarrow{width:28px;height:28px;border-radius:50%;border:1px solid var(--rs-line);display:flex;align-items:center;justify-content:center;font-size:.75rem;flex-shrink:0;transition:background .2s,border-color .2s,color .2s,transform .2s;background:transparent;color:var(--muted)}
.rs-row:hover .rs-rarrow{background:var(--rs-deep);border-color:var(--rs-deep);color:#fff;transform:translateX(3px)}
.rs-lock{display:inline-flex;align-items:center;gap:5px;font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:3px 9px 3px 7px;border-radius:100px;background:var(--gray-3);border:1px solid var(--rs-line2);color:var(--muted)}

/* ---- empty state ---- */
.rs-emptystate{padding:72px 0;text-align:center;display:none}
.rs-emptystate h3{font-size:1.2rem;font-weight:700;letter-spacing:-.025em;margin-bottom:8px}
.rs-emptystate p{font-size:.9rem;color:var(--rs-ink2);margin-bottom:22px}
.rs-clear{display:inline-flex;align-items:center;gap:8px;padding:13px 26px;background:var(--rs-deep);color:#fff;border:none;font-family:inherit;cursor:pointer;border-radius:100px;font-size:.86rem;font-weight:700;transition:background .2s}
.rs-clear:hover{background:var(--rs-press)}

/* ---- editorial standards ---- */
.rs-standards{margin-top:88px;background:var(--panel2);border-radius:var(--r-xl);padding:clamp(32px,4vw,52px) clamp(26px,4vw,56px);display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(32px,4vw,56px);align-items:start}
.rs-standards h2{font-size:1.7rem;font-weight:800;letter-spacing:-.035em;line-height:1.12;margin-bottom:12px;text-wrap:pretty}
.rs-standards .lede{font-size:.9rem;line-height:1.7;color:var(--rs-ink2);text-wrap:pretty}
.rs-checks{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px 36px;margin:0;padding:0}
.rs-checks h4{font-size:.87rem;font-weight:700;letter-spacing:-.018em;margin-bottom:6px;display:flex;align-items:flex-start;gap:9px}
.rs-checks p{font-size:.82rem;line-height:1.65;color:var(--rs-ink2);text-wrap:pretty}
.rs-checkdot{width:18px;height:18px;border-radius:50%;background:var(--rs-deep);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.55rem;flex-shrink:0;margin-top:1px}

/* ═══ article + guide templates (/insights/*, /guides/*) ═══ */
.ra-crumb{padding-top:122px}
@media(max-width:760px){.ra-crumb{padding-top:100px}}
.ra-crumb ol{list-style:none;display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:.78rem;color:var(--muted);margin:0;padding:0}
.ra-crumb a{color:var(--rs-deep);text-decoration:none}
.ra-crumb a:hover{color:var(--rs-press)}
.ra-crumb [aria-current]{color:var(--rs-ink2)}
.ra-head{padding:36px 0 0;max-width:760px}
.ra-head h1{font-size:clamp(2.1rem,4vw,3.3rem);font-weight:800;letter-spacing:-.04em;line-height:1.05;margin-bottom:18px;text-wrap:pretty}
.ra-dek{font-size:1.14rem;line-height:1.62;color:var(--rs-ink2);text-wrap:pretty}
.ra-when{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:30px;padding:20px 0;border-top:1px solid var(--rs-line);border-bottom:1px solid var(--rs-line);font-size:.78rem;color:var(--muted)}
.ra-when b{display:block;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;font-size:.86rem}
.ra-cols{display:grid;grid-template-columns:minmax(0,760px) minmax(240px,1fr);gap:clamp(32px,5vw,72px);align-items:start;padding:44px 0 80px}
.rg-cols{grid-template-columns:minmax(240px,1fr) minmax(0,760px)}
/* pin the columns explicitly: with order alone, grid auto-placement dropped the
   BODY into the narrow sidebar column (caught live 27/07/2026). Sidebar left,
   body right, regardless of DOM order. */
.rg-cols .ra-side{grid-column:1;grid-row:1}
.rg-cols .ra-bodycol{grid-column:2;grid-row:1}
.ra-side{position:sticky;top:96px;display:grid;gap:20px}
@media(max-width:980px){
  .ra-cols{grid-template-columns:minmax(0,1fr)}
  .ra-side{position:static;top:auto}
  .rg-cols .ra-side,.rg-cols .ra-bodycol{grid-column:auto;grid-row:auto}
}
/* the short version / before you start */
.ra-short{background:#fff;border:1px solid var(--rs-line);border-left:3px solid var(--rs-acc);border-radius:var(--r-sm);padding:26px 30px;margin-bottom:40px}
.ra-short.onbg{background:var(--bg)}
.ra-short-h{font-size:.66rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--rs-deep);margin-bottom:14px}
.ra-short ul{list-style:none;display:grid;gap:11px;margin:0;padding:0}
.ra-short li{display:flex;gap:11px;font-size:.9rem;line-height:1.6;color:var(--rs-ink2)}
.ra-short .b{width:6px;height:6px;border-radius:50%;background:var(--rs-deep);flex-shrink:0;margin-top:8px}
.ra-short .ck{width:17px;height:17px;border-radius:50%;background:var(--rs-deep);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.52rem;flex-shrink:0;margin-top:3px}
/* prose */
.ra-prose{font-size:1.02rem;line-height:1.78;color:var(--rs-ink2)}
.ra-prose h2{font-size:1.55rem;font-weight:800;letter-spacing:-.035em;line-height:1.15;color:var(--ink);margin:36px 0 14px;text-wrap:pretty}
.ra-prose h2:first-child{margin-top:0}
.ra-prose p{margin-bottom:20px;text-wrap:pretty}
.ra-prose a{color:var(--rs-deep);text-decoration:underline;text-underline-offset:2px}
.ra-prose blockquote{margin:32px 0;padding:26px 30px;background:var(--panel2);border-radius:var(--r-md);font-size:1.1rem;line-height:1.6;font-weight:500;color:var(--ink);letter-spacing:-.015em;text-wrap:pretty}
/* rate disclosure (s160 NCC - render whenever a rate appears in the body) */
.ra-rate{margin-top:40px;padding:24px 28px;border:1px solid var(--rs-tint2);background:var(--rs-tint);border-radius:var(--r-md)}
.ra-rate-h{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.ra-rate-h .x{width:18px;height:18px;border-radius:50%;background:var(--rs-deep);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:800;flex-shrink:0}
.ra-rate-h strong{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--rs-deep)}
.ra-rate p{font-size:.83rem;line-height:1.68;color:var(--rs-ink2);text-wrap:pretty;margin:0}
/* general advice warning */
.ra-gaw{margin-top:24px;padding:26px 30px;border:1px solid var(--rs-line);border-left:3px solid var(--rs-acc);border-radius:var(--r-sm);background:#fff}
.ra-gaw strong{font-size:.8rem;font-weight:700;display:block;margin-bottom:6px}
.ra-gaw p{font-size:.79rem;line-height:1.68;color:var(--rs-ink2);text-wrap:pretty;margin:0}
.ra-gaw a{color:var(--rs-deep);text-decoration:underline;text-underline-offset:2px}
.ra-reviewed{margin-top:20px;font-size:.76rem;color:var(--muted);line-height:1.6}
/* sidebar cards */
.ra-pillar{background:var(--ink);border-radius:var(--r-lg);padding:28px 26px;position:relative;overflow:hidden}
.ra-pillar .halo{position:absolute;width:280px;height:280px;border-radius:50%;right:-120px;top:-110px;background:radial-gradient(circle,rgba(5,230,221,.26) 0%,transparent 66%)}
.ra-pillar .inner{position:relative}
.ra-pillar .kick{display:inline-flex;align-items:center;gap:8px;font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--rs-bright);margin-bottom:14px}
.ra-pillar .kick .gring{width:9px;height:9px;border-radius:50%;box-sizing:border-box;border:2px solid var(--rs-bright)}
.ra-pillar h3{font-size:1.02rem;font-weight:700;letter-spacing:-.022em;line-height:1.35;margin-bottom:9px;text-wrap:pretty}
.ra-pillar h3 a{color:#fff;text-decoration:none}
.ra-pillar p{font-size:.8rem;line-height:1.6;color:rgba(255,255,255,.62);margin-bottom:16px;text-wrap:pretty}
.ra-pillar .go{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:700;padding:10px 20px;background:var(--rs-deep);color:#fff;border-radius:100px;transition:background .2s,color .2s;text-decoration:none}
.ra-pillar .go:hover{background:var(--rs-acc);color:var(--ink)}
.ra-relcard{background:#fff;border:1px solid var(--rs-line);border-radius:var(--r-lg);padding:24px 26px}
.ra-relcard.onbg{background:var(--bg)}
.ra-relcard .kick{font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.ra-relcard ul,.ra-relcard ol{list-style:none;display:grid;gap:14px;margin:0;padding:0}
.ra-relcard li{padding-bottom:14px;border-bottom:1px solid var(--rs-line)}
.ra-relcard li:last-child{padding-bottom:0;border-bottom:none}
.ra-relcard li a{font-size:.87rem;font-weight:600;line-height:1.45;letter-spacing:-.015em;color:var(--ink);display:block;text-decoration:none}
.ra-relcard li a:hover{color:var(--rs-deep)}
.ra-relcard li span{font-size:.72rem;color:var(--muted)}
/* guide steps */
.rg-meta{display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding:20px 0;border-bottom:1px solid var(--rs-line);font-size:.78rem;color:var(--muted)}
.rg-meta b{display:block;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;font-size:.86rem}
.rg-steps{list-style:none;display:grid;gap:40px;margin:0;padding:0}
.rg-step{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;scroll-margin-top:112px}   /* jumping to #step-N must clear the floating nav (bottom edge ~94px) */
.rg-srail{display:flex;flex-direction:column;align-items:center;gap:10px}
.rg-snum{width:42px;height:42px;border-radius:50%;background:var(--rs-deep);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:800;font-variant-numeric:tabular-nums;flex-shrink:0}
.rg-sline{flex:1;width:1px;background:var(--rs-line)}
.rg-step h2{font-size:1.28rem;font-weight:700;letter-spacing:-.028em;line-height:1.25;margin-bottom:10px;text-wrap:pretty}
.rg-step p{font-size:.98rem;line-height:1.75;color:var(--rs-ink2);text-wrap:pretty}
.rg-know{margin-top:16px;padding:18px 22px;background:var(--rs-tint);border:1px solid var(--rs-tint2);border-radius:var(--r-sm);font-size:.85rem;line-height:1.65;color:var(--rs-ink2)}
.rg-know strong{color:var(--rs-deep)}
.rg-next{margin-top:48px;padding:30px 32px;background:var(--ink);border-radius:var(--r-lg);position:relative;overflow:hidden}
.rg-next .halo{position:absolute;width:300px;height:300px;border-radius:50%;right:-130px;bottom:-140px;background:radial-gradient(circle,rgba(5,230,221,.24) 0%,transparent 66%)}
.rg-next .inner{position:relative}
.rg-next .kick{font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--rs-bright);margin-bottom:12px}
.rg-next p{font-size:.95rem;line-height:1.7;color:rgba(255,255,255,.72);max-width:520px;text-wrap:pretty;margin:0}
.rg-cluster{margin-top:32px;padding:24px 28px;background:var(--bg);border:1px solid var(--rs-line);border-radius:var(--r-md)}
.rg-cluster .kick{font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.rg-cluster ul{list-style:none;display:grid;gap:12px;margin:0;padding:0}
.rg-cluster a{display:flex;align-items:baseline;gap:10px;font-size:.9rem;font-weight:600;letter-spacing:-.015em;color:var(--ink);text-decoration:none}
.rg-cluster a:hover{color:var(--rs-deep)}
.rg-cluster .b{width:8px;height:8px;border-radius:50%;background:var(--rs-deep);flex-shrink:0}
/* steps index (guide sidebar) */
.rg-index ol{counter-reset:s}
.rg-index li a{display:flex;gap:11px;font-size:.83rem;line-height:1.45;color:var(--rs-ink2);font-weight:500;text-decoration:none}
.rg-index li a:hover,.rg-index li a.on{color:var(--rs-deep);font-weight:600}
.rg-index li a .n{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:700;font-size:.74rem;padding-top:2px}
.rg-cta{background:var(--panel2);border-radius:var(--r-lg);padding:24px 26px}
.rg-cta .kick{font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.rg-cta p{font-size:.83rem;line-height:1.65;color:var(--rs-ink2);margin-bottom:16px;text-wrap:pretty}
.rg-cta .go{display:inline-flex;align-items:center;gap:7px;font-size:.8rem;font-weight:700;padding:11px 20px;background:var(--rs-deep);color:#fff;border-radius:100px;transition:background .2s,transform .2s;text-decoration:none}
.rg-cta .go:hover{background:var(--rs-press);transform:translateY(-1px)}