/* ────────────────────────────────────────────────────────────────────
   Kronos v3 — shared page chrome partial
   Mirrors index.html's v3 (Revolut-rhythm) format for non-homepage pages.
   Loaded as <link rel="stylesheet" href="/v3.css"> on top of styles.css.
   ──────────────────────────────────────────────────────────────────── */

:root{
  --bg:#0A0A0F;
  --ink:#F5F3EE;
  --gold:#C9A84C;
  --gold-2:#A8893A;
  --line:rgba(245,243,238,0.08);
  --line-strong:rgba(245,243,238,0.16);
  --ink-2:rgba(245,243,238,0.72);
  --muted:#8A877E;
  --dim:#55544E;
  --serif:'Inter','Helvetica Neue',Arial,sans-serif;
  --sans:'Inter','Helvetica Neue',Arial,sans-serif;
  --mono:'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --shell:1180px;
}

/* Light-theme remap to keep brand inversion */
:root[data-theme="light"]{
  --bg:#F5F3EE;
  --ink:#0A0A0F;
  --line:rgba(10,10,15,0.10);
  --line-strong:rgba(10,10,15,0.20);
  --ink-2:rgba(10,10,15,0.72);
  --muted:#6F6A5C;
  --dim:#9A9582;
  --gold:#9A7E2E;
}

/* ───── Page reset for v3 pages ───── */
.v3-page,.v3-page *,.v3-page *::before,.v3-page *::after{box-sizing:border-box}
.v3-page{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"ss01","cv11"}
.v3-page h1,.v3-page h2,.v3-page h3,.v3-page h4{font-family:var(--sans);font-weight:800;letter-spacing:-0.03em;line-height:0.95;color:inherit;margin:0 0 16px}
/* Giant hero size scoped ONLY to v3-hero. Other h1/h2/h3 use sane defaults. */
.v3-page .v3-hero h1{font-size:clamp(56px,9vw,140px);line-height:1.06;letter-spacing:-0.045em}
.v3-page section:not(.v3-hero) h1, .v3-page header:not(.v3-hero) h1{font-size:clamp(32px,4.5vw,60px);line-height:1.08;letter-spacing:-0.025em}
.v3-page h2{font-size:clamp(28px,3.6vw,56px);line-height:1.06;letter-spacing:-0.025em}
.v3-page h3{font-size:clamp(20px,2vw,28px);line-height:1.2;letter-spacing:-0.015em;font-weight:700}
/* Center every non-hero section on pages without a phone mockup right-side */
.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])){text-align:center}
.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .shell{margin-left:auto;margin-right:auto}
.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .ctas{justify-content:center}
.v3-page h4{font-size:18px;font-weight:600;letter-spacing:-0.005em;margin:0 0 8px}
.v3-page p{font-family:var(--sans);color:var(--ink-2);line-height:1.55;margin:0 0 14px}
.v3-page a{color:inherit;text-decoration:none}
.v3-page ul{list-style:none;padding:0;margin:0}
.v3-page strong{font-weight:700}
.v3-page em{font-style:normal;color:var(--gold)}
.v3-page .accent{color:var(--gold)}
.v3-page .shell{max-width:var(--shell);margin:0 auto;padding:0 28px;width:100%}

/* ───── Sticky nav ───── */
.v3-nav{position:fixed;top:0;left:0;right:0;z-index:100;backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);background:rgba(10,10,15,0.55);transition:background .25s ease,border-color .25s ease,color .25s ease}
.v3-nav.scrolled{background:rgba(10,10,15,0.94);border-bottom:1px solid rgba(245,243,238,0.08)}
.v3-nav-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:18px 28px}
.v3-nav .brand{font-family:var(--sans);font-weight:700;letter-spacing:0.02em;font-size:18px;color:var(--ink)}
.v3-nav .brand .dot{color:var(--gold)}
.v3-nav ul{display:flex;gap:32px;list-style:none;padding:0;margin:0;align-items:center}
.v3-nav ul a{font-size:14px;color:var(--ink-2);font-weight:500;transition:color .15s ease}
.v3-nav ul a:hover{color:var(--ink)}
.v3-nav .cta{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;background:var(--gold);color:#0A0A10;font-weight:600;font-size:14px;transition:transform .2s ease,background .2s ease}
.v3-nav .cta:hover{background:#E2BF5E;transform:translateY(-1px)}
.v3-nav .ham{display:none;width:30px;height:30px;position:relative;background:none;border:0;cursor:pointer}
.v3-nav .ham span{position:absolute;left:4px;right:4px;height:1.5px;background:var(--ink);transition:transform .25s ease, top .25s ease}
.v3-nav .ham span:nth-child(1){top:11px}
.v3-nav .ham span:nth-child(2){top:18px}
.v3-nav .ham.open span:nth-child(1){top:14px;transform:rotate(45deg)}
.v3-nav .ham.open span:nth-child(2){top:14px;transform:rotate(-45deg)}
@media (max-width:880px){
  .v3-nav ul{position:fixed;inset:62px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;background:rgba(10,10,15,0.98);border-bottom:1px solid var(--line);padding:8px 24px 18px;transform:translateY(-120%);transition:transform .3s ease}
  .v3-nav ul.open{transform:translateY(0)}
  .v3-nav ul a{padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
  .v3-nav ul a:last-of-type{border-bottom:0}
  .v3-nav .cta{margin-top:10px;justify-content:center}
  .v3-nav .ham{display:block}
}
:root[data-theme="light"] .v3-nav{background:rgba(255,255,255,0.55)}
:root[data-theme="light"] .v3-nav.scrolled{background:rgba(255,255,255,0.95);border-bottom:1px solid rgba(10,10,15,0.06)}

/* ───── Buttons ───── */
.v3-page .btn-primary{display:inline-flex;align-items:center;gap:10px;padding:18px 32px;border-radius:999px;background:#C9A84C;color:#0A0A10;font-size:15px;font-weight:600;letter-spacing:-0.005em;transition:transform .2s ease,background .2s ease;cursor:pointer;border:0}
.v3-page .btn-primary:hover{background:#E2BF5E;transform:translateY(-1px)}
.v3-page .btn-secondary{display:inline-flex;align-items:center;gap:8px;padding:18px 28px;border-radius:999px;color:inherit;font-size:15px;font-weight:500;border:1px solid currentColor;transition:opacity .2s ease,transform .2s ease;cursor:pointer;background:transparent;opacity:.62}
.v3-page .btn-secondary:hover{opacity:1;transform:translateY(-1px)}
.v3-page .btn-arrow-r::after{content:" →";display:inline-block;transition:transform .2s ease}
.v3-page .btn-arrow-r:hover::after{transform:translateX(3px)}

/* ───── Section rhythm ───── */
.v3-section{position:relative;padding:120px 0;overflow:hidden}
.v3-section.tall{min-height:100vh;display:flex;flex-direction:column;justify-content:center}
.v3-dark{background:#0A0A0F;color:#F5F3EE}
.v3-dark p{color:rgba(245,243,238,0.68)}
.v3-light{background:#F5F3EE;color:#0A0A0F}
.v3-light p{color:rgba(10,10,15,0.68)}
.v3-light .accent{color:#9A7E2E}
.v3-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;font-weight:600;opacity:0.62;margin-bottom:24px;display:inline-block}

/* IntersectionObserver-driven reveals */
.v3-section h1,.v3-section h2,.v3-section h3,.v3-section .lede,.v3-section .ctas,.v3-section .v3-card{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.v3-section.in-view h1,.v3-section.in-view h2,.v3-section.in-view h3,.v3-section.in-view .lede,.v3-section.in-view .ctas,.v3-section.in-view .v3-card{opacity:1;transform:none}
.v3-section .ctas{transition-delay:.18s}
.v3-section .lede{transition-delay:.10s}
.v3-section .v3-card{transition-delay:calc(var(--i,0) * 80ms + 200ms)}
@media (prefers-reduced-motion:reduce){
  .v3-section h1,.v3-section h2,.v3-section h3,.v3-section .lede,.v3-section .ctas,.v3-section .v3-card{opacity:1;transform:none;transition:none}
}

/* ───── Hero (full viewport, dark) ───── */
.v3-hero{min-height:90vh;display:flex;align-items:center;background:radial-gradient(1200px 800px at 75% 20%,rgba(201,168,76,0.06),transparent 60%),#0A0A0F;color:#F5F3EE;padding:140px 0 80px;position:relative;overflow:hidden}
.v3-hero::after{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:rgba(245,243,238,0.08)}
.v3-hero h1{margin-bottom:28px;font-weight:800;max-width:18ch}
.v3-hero h1 em{font-style:normal;color:#C9A84C}
.v3-hero .sub{font-size:clamp(18px,1.5vw,22px);color:rgba(245,243,238,0.72);max-width:54ch;margin-bottom:40px;line-height:1.45;font-weight:400}
.v3-hero .ctas{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:48px}
.v3-hero .trust{display:flex;gap:24px;flex-wrap:wrap;align-items:center;font-size:13px;color:rgba(245,243,238,0.5);font-family:var(--mono);letter-spacing:0.04em}
.v3-hero .trust b{color:#F5F3EE;font-weight:600}
.v3-hero .trust .sep{width:3px;height:3px;border-radius:50%;background:rgba(245,243,238,0.3);display:inline-block}
:root[data-theme="light"] .v3-hero{background:radial-gradient(1200px 800px at 75% 20%,rgba(154,126,46,0.08),transparent 60%),#F5F3EE;color:#0A0A0F}
:root[data-theme="light"] .v3-hero .sub{color:rgba(10,10,15,0.72)}
:root[data-theme="light"] .v3-hero .trust{color:rgba(10,10,15,0.5)}
:root[data-theme="light"] .v3-hero .trust b{color:#0A0A0F}

/* ───── Cards / grid ───── */
.v3-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.v3-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.v3-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media (max-width:900px){.v3-grid-2,.v3-grid-3,.v3-grid-4{grid-template-columns:1fr}}
@media (min-width:600px) and (max-width:900px){.v3-grid-3,.v3-grid-4{grid-template-columns:1fr 1fr}}

.v3-card{padding:36px 32px;border-radius:18px;border:1px solid var(--line);background:rgba(245,243,238,0.02)}
.v3-light .v3-card{border-color:rgba(10,10,15,0.10);background:rgba(10,10,15,0.02)}
.v3-card.featured{border:1px solid rgba(201,168,76,0.55);background:linear-gradient(180deg,rgba(201,168,76,0.08) 0%,transparent 100%)}
.v3-card h3,.v3-card h4{margin:0 0 12px;font-family:var(--sans)}
.v3-card .price{font-size:48px;font-weight:800;letter-spacing:-.03em;margin:0 0 6px;line-height:1}
.v3-card .price small{font-size:15px;font-weight:500;opacity:.5;margin-left:6px}
.v3-card ul{display:grid;gap:8px;margin:8px 0 24px}
.v3-card ul li{font-size:14px;line-height:1.5;display:flex;gap:8px;align-items:flex-start}
.v3-card ul li::before{content:"·";color:#C9A84C;font-weight:700;font-size:18px;line-height:1;flex-shrink:0}

/* ───── Final CTA ───── */
.v3-final{text-align:center;background:#0A0A0F;color:#F5F3EE}
.v3-final h2{margin:0 auto 28px;max-width:14ch;font-size:clamp(56px,8vw,120px);line-height:.92;letter-spacing:-.045em}
.v3-final h2 em{font-style:normal;color:#C9A84C}
.v3-final .ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:8px}
:root[data-theme="light"] .v3-final{background:#F5F3EE;color:#0A0A0F}

/* ───── Long-form prose (for tools, savings, faq, banking, best, for, compare) ───── */
.v3-prose{max-width:760px;margin:0 auto}
.v3-prose h2{font-size:clamp(28px,3vw,44px);line-height:1.1;margin:48px 0 16px;letter-spacing:-.02em;font-weight:700}
.v3-prose h3{font-size:clamp(20px,2vw,26px);line-height:1.2;margin:36px 0 12px;letter-spacing:-.01em;font-weight:700}
.v3-prose p,.v3-prose li{font-size:16px;line-height:1.7;color:var(--ink-2)}
.v3-prose ul,.v3-prose ol{margin:0 0 18px 24px;padding:0}
.v3-prose ul li{list-style:disc;margin:0 0 8px}
.v3-prose ol li{list-style:decimal;margin:0 0 8px}
.v3-prose a{color:var(--gold);border-bottom:1px solid rgba(201,168,76,0.4)}
.v3-prose a:hover{border-bottom-color:var(--gold)}
.v3-prose table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px}
.v3-prose th,.v3-prose td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left}
.v3-prose th{font-weight:700;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}

/* ───── Trust strip beneath hero ───── */
.v3-trust-strip{padding:36px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0A0A0F;color:rgba(245,243,238,0.6)}
.v3-trust-strip .label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-align:center;margin-bottom:18px;font-weight:600;font-family:var(--mono);opacity:.6}
.v3-trust-strip .row{display:flex;justify-content:center;gap:32px;flex-wrap:wrap;font-size:13px;font-family:var(--mono);letter-spacing:.04em}
.v3-trust-strip .row b{color:#F5F3EE;font-weight:600}
:root[data-theme="light"] .v3-trust-strip{background:#F5F3EE;color:rgba(10,10,15,0.6)}
:root[data-theme="light"] .v3-trust-strip .row b{color:#0A0A0F}

/* ───── Reveal helper for non-section elements ───── */
.v3-reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.v3-reveal.in-view{opacity:1;transform:none}

/* Legacy security-page card overrides on v3 light bg */
.v3-light .sec-card{background:rgba(10,10,15,0.04);border:1px solid rgba(10,10,15,0.10);color:#0A0A0F}
.v3-light .sec-card h2{color:#9A7E2E}
.v3-light .sec-card p,.v3-light .sec-card ul{color:rgba(10,10,15,0.72)}
.v3-light .sec-card .stamp{background:rgba(10,10,15,0.05);border-color:rgba(10,10,15,0.10);color:rgba(10,10,15,0.55)}
.v3-light .sec-card .stamp.live{color:#1f7a4d;border-color:rgba(31,122,77,0.3)}
.v3-light .sec-card .stamp.pending{color:#9A7E2E;border-color:rgba(154,126,46,0.3)}

/* ==========================================================================
   v3 unification — force Inter + gold across all body content site-wide.
   Loaded after legacy styles in cascade; !important overrides win against
   stubborn inline-<style> declarations on legacy pages (pricing, claim-pro,
   refer, status, pay, tools/*, pro/*, statements, tax, help/, etc.).
   Excludes deck.html (own theme) and blog/* (founder hands-off — but blog
   only references --serif inside the help-fab widget which is fine to flip).
   ========================================================================== */

/* 1. Kill ALL serif fallbacks site-wide. Any element using var(--serif) now
      resolves to Inter even if the page hasn't been reskinned. The :root
      definition above already does this, but pages with their own inline
      :root override get caught here. */
:root,
:root[data-theme="dark"],
:root[data-theme="light"],
html, body {
  --serif: 'Inter','Helvetica Neue',Arial,sans-serif !important;
}

/* 2. Body-level + universal Inter enforcement. Selector specificity here
      beats inline styles UNLESS those inline styles also use !important.
      Direct font-family declarations on common body elements are
      neutralized to Inter. Mono-coded number/code elements opt out below. */
body, body p, body a, body span, body strong, body em, body label,
body li, body td, body th, body button, body input, body select, body textarea,
body h1, body h2, body h3, body h4, body h5, body h6,
body .brand, body .eyebrow, body .desc, body .sub, body .lede,
body .tier, body .tier h1, body .tier h2, body .tier h3, body .tier h4,
body .tier .desc, body .tier .price, body .tier .perday, body .tier li,
body .tier .badge, body .tier .recommend,
body .pricing-h, body .page-h, body .page-sub, body .section-h, body h2.section-h,
body .hero-h, body .hero-sub,
body .sec-hero h1, body .sec-hero p, body .sec-card h2, body .sec-card p,
body .footer-brand, body .footer-partners .item,
body .modal-head .title, body .modal-body h3,
body .legal h2, body .perks .title, body .stat .v, body .stat .l,
body .compare-tbl th, body .compare-tbl td,
body .shell-pricing,
body .v3-page, body .v3-page * {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
}

/* 3. Mono opt-out for numbers, code, and uppercase-tracked labels. These
      should keep JetBrains Mono. The selectors here re-apply mono after
      the global Inter sweep. */
body .mono, body code, body kbd, body pre,
body .tier .perday, body .tier .badge, body .tier .recommend,
body .stat .l, body .tier-row, body .tier-meta,
body .eyebrow, body .v3-eyebrow, body .v3-trust-strip .label, body .v3-trust-strip .row,
body .v3-hero .trust, body .last-upd, body .meta, body .recommend,
body .compare-tbl th, body .marq-item, body .footer-col h5,
body .stamp, body .k-row button, body .k-tx-toast,
body .legal h2, body .linkbox input, body .share-btn,
body .how .title, body .perks .title, body .receipt-amount, body .price-num,
body input[type="text"].mono, body input[type="email"].mono {
  font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace !important;
}

/* 4. Numbers in tier price + big stats: Inter heavy + tight tracking.
      Price gets back to Inter (sans), not mono — matches v3 vibe. */
body .tier .price, body .price-num, body .big-num, body .stat-num,
body .tier-price {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
}
body .tier .price small, body .tier .price .unit, body .price-currency {
  font-weight: 500 !important;
  opacity: 0.65 !important;
  letter-spacing: 0 !important;
}

/* 5. Replace decorative serif weights (often 500) with Inter heavy on the
      legacy "fancy display" elements. */
body .tier h2, body .sec-hero h1, body .sec-card h2,
body h2.section-h, body .pricing-h, body .page-h,
body h1, body h2 {
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}
body .v3-page h1, body .v3-hero h1 { font-weight: 800 !important; }

/* 6. Card surfaces unified — match landing-site card rhythm. The .tier
      class on pricing.html, .sec-card on security.html, generic .card on
      others all collapse to one visual language. */
body .tier, body .pricing-card, body .feature-card, body .plan, body .faq-item,
body .sec-card {
  background: rgba(245,243,238,0.04) !important;
  border: 1px solid rgba(245,243,238,0.08) !important;
  border-radius: 16px !important;
}
:root[data-theme="light"] body .tier,
:root[data-theme="light"] body .pricing-card,
:root[data-theme="light"] body .feature-card,
:root[data-theme="light"] body .plan,
:root[data-theme="light"] body .faq-item,
:root[data-theme="light"] body .sec-card {
  background: rgba(10,10,15,0.03) !important;
  border-color: rgba(10,10,15,0.10) !important;
}
body .tier.featured, body .tier.pricing-popular, body .pricing-card.featured,
body .plan.featured {
  border: 1px solid rgba(201,168,76,0.55) !important;
  background: linear-gradient(180deg,rgba(201,168,76,0.10) 0%,rgba(201,168,76,0.02) 100%) !important;
}

/* 7. Gold accents replace stale green/blue/red/pink decorations. */
body .tier.featured h2, body .tier.featured .price,
body .tier .badge, body [class*="popular"]:not(.tier),
body .featured-pill, body .pill-pro, body .pill-most-popular,
body .tier .stamp.pending {
  color: #C9A84C !important;
}
body .stamp.live { /* live status pill — keep its semantic green but tame it */
  color: #6FCF97 !important;
  border-color: rgba(111,207,151,0.30) !important;
}

/* 8. Buttons — match v3 system rhythm everywhere. */
body .btn, body .button, body .cta, body button.btn {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
  border-radius: 999px !important;
}
body .btn.primary, body .btn-primary, body .button-primary, body .cta-primary {
  background: #C9A84C !important;
  color: #0A0A10 !important;
  border: 0 !important;
}
body .btn.ghost, body .btn-secondary, body .btn-ghost {
  background: transparent !important;
  color: inherit !important;
}

/* 9. Section headings consistent across non-v3 pages. */
body section h1, body section h2, body section h3,
body .section-h, body h2.section-h, body .sec-hero h1 {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
}
body section h1 { letter-spacing: -0.03em !important; }
body section h2 { letter-spacing: -0.02em !important; }

/* 10. Help-fab widget (injected on every page) — Inter, gold, round. The
       legacy widget hardcodes font-family:var(--serif),Georgia,serif. The
       :root --serif override above already swaps Cinzel→Inter; this just
       belt-and-braces the Georgia fallback. */
body .k-help-fab, body .k-help-panel .k-h {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  letter-spacing: 0.02em !important;
}
body .k-help-fab { font-weight: 800 !important; }

/* 11. Footer brand letterspaced "KRONOS" — Inter heavy reads better than
       Cinzel display anyway; gold tint preserved. */
body .footer-brand {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-weight: 800 !important;
}

/* 12. Tables — Inter sans for labels, JetBrains Mono for numeric cells. */
body table.compare-tbl th, body .v3-prose th { font-family: 'JetBrains Mono', ui-monospace, monospace !important; }
body table.compare-tbl td:not(.label), body .v3-prose td:not(.label) {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
}


/* Safety: constrain footer + social-icon SVGs that lack explicit width/height.
   Prevents giant blue/red icons taking the whole viewport when v3 unification
   strips inline styles. */
.v3-footer svg, footer svg, [aria-label] svg, .social svg, .socials svg {
  width: 20px !important;
  height: 20px !important;
  display: inline-block;
  vertical-align: middle;
}

/* ============================================================
   PHONE MOCKUPS — INTERACTIVE LAYER (index.html only)
   Driven by /phones-interactive.js. Suppressed if real-shot loads.
   ============================================================ */
.rv-phone.demo-suppressed .phone-try-badge,
.rv-phone.demo-suppressed .phone-cta-wrap,
.rv-phone.demo-suppressed .phone-toast,
.rv-phone.demo-suppressed .demo-send-form,
.rv-phone.demo-suppressed .demo-coin-card,
.rv-phone.demo-suppressed .demo-sub-killer,
.rv-phone.demo-suppressed .tax-status { display: none !important; }

.rv-phone .phone-tap {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(201,168,76,0.18);
  min-height: 44px;
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}
.rv-phone .phone-tap:active { transform: scale(.97); }
.rv-phone .phone-tap:focus-visible {
  outline: 2px solid #C9A84C;
  outline-offset: 3px;
}

/* TAP TO TRY badge */
.phone-try-badge {
  position: absolute;
  top: 56px;
  right: 12px;
  background: #C9A84C;
  color: #0A0A0F;
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.10em;
  padding: 5px 9px;
  border: 0;
  border-radius: 999px;
  z-index: 6;
  cursor: pointer;
  box-shadow: 0 4px 14px -2px rgba(201,168,76,0.45);
  animation: phone-try-pulse 2s ease-in-out infinite;
}
@keyframes phone-try-pulse {
  0%,100% { opacity: .7; transform: scale(1); }
  50%     { opacity: 1;  transform: scale(1.06); }
}
.rv-phone.interacted .phone-try-badge {
  opacity: 0; pointer-events: none; transition: opacity .4s ease; animation: none;
}

/* Soft CTA at the bottom of the phone screen */
.phone-cta-wrap {
  position: absolute; left: 14px; right: 14px; bottom: 14px;
  background: rgba(10,10,15,0.72);
  border: 1px solid rgba(201,168,76,0.32);
  border-radius: 14px; padding: 10px 12px;
  text-align: center; z-index: 7;
  backdrop-filter: blur(6px);
  animation: phone-cta-up .42s cubic-bezier(.2,.7,.2,1) both;
}
.rv-phone-screen.light .phone-cta-wrap {
  background: rgba(255,255,255,0.92);
  border-color: rgba(201,168,76,0.45);
}
.phone-cta-wrap .phone-cta {
  color: #C9A84C;
  font-family: 'Inter',sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.005em;
  text-decoration: none;
  display: inline-block;
  padding: 4px 6px;
  min-height: 28px;
  line-height: 1.3;
}
.phone-cta-wrap .phone-cta:hover { text-decoration: underline; }
@keyframes phone-cta-up {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Toast (checkmark + text) */
.phone-toast {
  position: absolute; left: 50%; top: 18%;
  transform: translateX(-50%);
  background: rgba(201,168,76,0.95);
  color: #0A0A0F;
  font-family: 'Inter',sans-serif;
  font-size: 12px; font-weight: 700;
  padding: 9px 14px; border-radius: 999px;
  z-index: 8;
  box-shadow: 0 14px 30px -10px rgba(0,0,0,.4);
  animation: phone-toast-in .35s cubic-bezier(.2,.7,.2,1) both, phone-toast-out .4s ease 1.4s both;
  white-space: nowrap;
}
.phone-toast .ck { font-size: 14px; margin-right: 4px; }
@keyframes phone-toast-in  { from { opacity: 0; transform: translate(-50%, -10px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes phone-toast-out { from { opacity: 1; } to   { opacity: 0; transform: translate(-50%, -6px); } }

/* HERO · mini send form */
.demo-send-form {
  position: absolute; left: 16px; right: 16px; bottom: 16px;
  background: rgba(10,10,15,0.94);
  border: 1px solid rgba(201,168,76,0.30);
  border-radius: 18px; padding: 16px 16px 14px;
  z-index: 7;
  opacity: 0; transform: translateY(16px);
  transition: opacity .3s ease, transform .3s cubic-bezier(.2,.7,.2,1);
}
.demo-send-form.in  { opacity: 1; transform: translateY(0); }
.demo-send-form.out { opacity: 0; transform: translateY(8px); }
.demo-send-form .dsf-h   { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; opacity: .55; font-weight: 700; }
.demo-send-form .dsf-tag { font-size: 16px; color: #C9A84C; font-weight: 700; margin: 4px 0 8px; }
.demo-send-form .dsf-amt { font-size: 28px; font-weight: 800; letter-spacing: -.03em; color: #F5F3EE; }
.demo-send-form .dsf-amt small { font-size: 16px; opacity: .45; font-weight: 700; }
.demo-send-form .dsf-btn {
  margin-top: 12px; width: 100%; min-height: 44px;
  background: #C9A84C; color: #0A0A0F;
  border: 0; border-radius: 12px;
  font-family: 'Inter',sans-serif; font-weight: 700; font-size: 14px;
  cursor: pointer;
  transition: filter .15s ease;
}
.demo-send-form .dsf-btn:active { filter: brightness(.92); }

/* HERO · new tx row */
.scr-home .tx.demo-new.tx-anim-in { animation: tx-row-in .42s cubic-bezier(.2,.7,.2,1) both; }
@keyframes tx-row-in { from { opacity: 0; transform: translateX(-12px); } to { opacity: 1; transform: translateX(0); } }

/* BANKING · sending state */
.scr-send .send-cta.sending {
  background: #0A0A0F; color: #C9A84C;
  border: 1px solid rgba(201,168,76,0.55);
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
.scr-send .send-cta.reset { background: rgba(201,168,76,0.18); color: #C9A84C; border: 1px solid rgba(201,168,76,0.4); }
.ck-circle {
  display: inline-flex; width: 22px; height: 22px;
  align-items: center; justify-content: center;
  border-radius: 50%; background: #C9A84C; color: #0A0A0F;
  animation: ck-pop .3s cubic-bezier(.2,.7,.2,1.6) both;
}
.ck-circle .ck-mark { font-size: 14px; font-weight: 800; line-height: 1; }
@keyframes ck-pop { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* CRYPTO · coin detail card */
.demo-coin-card {
  position: absolute; left: 16px; right: 16px; bottom: 16px;
  background: rgba(255,255,255,0.98);
  border: 1px solid rgba(10,10,15,0.10);
  border-radius: 18px; padding: 14px 14px 12px;
  z-index: 7;
  opacity: 0; transform: translateY(16px);
  transition: opacity .26s ease, transform .26s cubic-bezier(.2,.7,.2,1);
  box-shadow: 0 30px 60px -20px rgba(0,0,0,0.35);
}
.rv-phone-screen:not(.light) .demo-coin-card {
  background: rgba(20,20,28,0.96); border-color: rgba(201,168,76,0.25);
}
.demo-coin-card.in  { opacity: 1; transform: translateY(0); }
.demo-coin-card.out { opacity: 0; transform: translateY(8px); }
.demo-coin-card .dcc-h {
  font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  font-weight: 700; opacity: .65; margin-bottom: 10px;
}
.demo-coin-card .dcc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.demo-coin-card .dcc-btn {
  min-height: 44px; border: 0; border-radius: 12px;
  font-family: 'Inter',sans-serif; font-weight: 700; font-size: 13px;
  cursor: pointer; transition: filter .15s ease;
}
.demo-coin-card .dcc-btn:active { filter: brightness(.92); }
.demo-coin-card .dcc-btn.buy  { background: #C9A84C; color: #0A0A0F; }
.demo-coin-card .dcc-btn.sell { background: rgba(10,10,15,0.10); color: #0A0A0F; }
.rv-phone-screen:not(.light) .demo-coin-card .dcc-btn.sell {
  background: rgba(245,243,238,0.10); color: #F5F3EE;
}
.demo-coin-card .dcc-close {
  position: absolute; top: 8px; right: 10px;
  background: transparent; border: 0;
  color: rgba(10,10,15,0.55);
  font-size: 18px; cursor: pointer; padding: 4px 8px;
  min-height: 28px;
}
.rv-phone-screen:not(.light) .demo-coin-card .dcc-close { color: rgba(245,243,238,0.55); }
.scr-crypto .coin .nm .demo-flash {
  font-size: 10px; color: #C9A84C; font-weight: 700;
  margin-top: 2px; letter-spacing: .04em;
  animation: flash-in .35s ease both;
}
@keyframes flash-in { from { opacity: 0; transform: translateX(-6px); } to { opacity: 1; transform: translateX(0); } }

/* TAXES · toggle off + dimmed rows */
.scr-tax .toggle.off { background: rgba(245,243,238,0.06); border-color: rgba(245,243,238,0.18); }
.rv-phone-screen.light .scr-tax .toggle.off { background: rgba(10,10,15,0.05); border-color: rgba(10,10,15,0.12); }
.scr-tax .toggle.off .sw { background: rgba(245,243,238,0.20); }
.rv-phone-screen.light .scr-tax .toggle.off .sw { background: rgba(10,10,15,0.20); }
.scr-tax .toggle .sw::after { transition: right .25s cubic-bezier(.2,.7,.2,1), background .2s ease; }
.scr-tax .toggle.off .sw::after { right: 21px; background: #F5F3EE; }
.rv-phone-screen.light .scr-tax .toggle.off .sw::after { background: #fff; }
.scr-tax .row { transition: opacity .3s ease, filter .3s ease; }
.scr-tax .row.dim { opacity: .35; filter: grayscale(1); }
.scr-tax .row.dim .v { color: rgba(245,243,238,0.45); }
.rv-phone-screen.light .scr-tax .row.dim .v { color: rgba(10,10,15,0.45); }
.tax-status {
  font-size: 11px; color: #C9A84C; font-weight: 700;
  letter-spacing: .04em; margin: -2px 0 12px;
  animation: tax-status-in .3s ease both;
}
.tax-status.paused { color: #E0A058; }
@keyframes tax-status-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

/* EARNINGS · sub killer view */
.demo-sub-killer {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,#FFFFFF 0%,#F4F0E3 100%);
  color: #14120C; border-radius: 34px;
  padding: 60px 18px 18px; z-index: 8;
  display: flex; flex-direction: column;
  opacity: 0; transform: translateY(20px);
  transition: opacity .3s ease, transform .3s cubic-bezier(.2,.7,.2,1);
}
.demo-sub-killer.in  { opacity: 1; transform: translateY(0); }
.demo-sub-killer.out { opacity: 0; transform: translateY(12px); }
.demo-sub-killer .dsk-top { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.demo-sub-killer .dsk-back {
  background: rgba(10,10,15,0.06); border: 0;
  width: 32px; height: 32px; border-radius: 50%;
  cursor: pointer; font-size: 16px; line-height: 1;
  color: #14120C;
}
.demo-sub-killer .dsk-h   { font-size: 18px; font-weight: 700; letter-spacing: -.02em; }
.demo-sub-killer .dsk-sub { font-size: 12px; opacity: .6; margin: 0 6px 14px; }
.demo-sub-killer .dsk-list { list-style: none; padding: 0; margin: 0 0 12px; }
.demo-sub-killer .dsk-list li {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 6px;
  border-bottom: 1px solid rgba(10,10,15,0.08);
  transition: opacity .3s ease;
}
.demo-sub-killer .dsk-list li.cancelled { opacity: .55; }
.demo-sub-killer .dsk-list li.cancelled .nm,
.demo-sub-killer .dsk-list li.cancelled .amt { text-decoration: line-through; }
.demo-sub-killer .dsk-list li .nm  { flex: 1; font-size: 13px; font-weight: 600; }
.demo-sub-killer .dsk-list li .amt { font-size: 12px; opacity: .6; font-variant-numeric: tabular-nums; min-width: 76px; text-align: right; }
.demo-sub-killer .dsk-cancel {
  min-height: 32px; padding: 6px 12px;
  background: #C9A84C; color: #0A0A0F;
  border: 0; border-radius: 999px;
  font-family: 'Inter',sans-serif; font-weight: 700; font-size: 11px;
  letter-spacing: .04em; cursor: pointer;
  transition: filter .15s ease;
}
.demo-sub-killer .dsk-cancel:active { filter: brightness(.92); }
.demo-sub-killer .dsk-cancel:disabled {
  background: rgba(10,10,15,0.10); color: rgba(10,10,15,0.55);
  cursor: default;
}
.demo-sub-killer .dsk-total {
  font-size: 18px; font-weight: 800; color: #C9A84C;
  letter-spacing: -.02em; margin-top: auto;
  font-variant-numeric: tabular-nums;
}
.demo-sub-killer .dsk-done {
  font-size: 11px; opacity: .8; margin-top: 6px;
  font-family: 'Inter',sans-serif; font-weight: 600;
}
.demo-sub-killer .dsk-done a { color: #C9A84C; font-weight: 700; }

/* Reduced-motion fallback: kill animations + transitions inside phone demos */
@media (prefers-reduced-motion: reduce) {
  .phone-try-badge { animation: none; }
  .phone-toast    { animation: none !important; }
  .demo-send-form, .demo-coin-card, .demo-sub-killer,
  .phone-cta-wrap, .scr-home .tx.demo-new.tx-anim-in,
  .scr-tax .toggle .sw::after, .scr-tax .row,
  .ck-circle, .scr-crypto .coin .nm .demo-flash,
  .tax-status {
    transition: none !important;
    animation: none !important;
  }
}


/* === SVG safety guard (re-added 2026-05-09 after comprehensive sweep) === */
.v3-footer svg, footer svg, [aria-label] svg, .social svg, .socials svg {
  width: 20px !important;
  height: 20px !important;
  display: inline-block;
  vertical-align: middle;
  flex: 0 0 auto;
}
/* tighter: explicit inline-svg in any anchor must size */
a > svg, button > svg {
  max-width: 24px;
  max-height: 24px;
}

/* v3-hero direct-children layout — pages reference v3-hero-inner /
   v3-hero-h / v3-hero-sub / v3-cta-lg without v3.css declaring them. */
body section.v3-hero,
section.v3-hero {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  min-height: 60vh !important;
  padding: 80px 28px 60px !important;
  background: radial-gradient(1200px 800px at 75% 20%,rgba(201,168,76,0.06),transparent 60%),#0A0A0F !important;
  color: #F5F3EE !important;
}
:root[data-theme="light"] body section.v3-hero,
:root[data-theme="light"] section.v3-hero {
  background: radial-gradient(1200px 800px at 75% 20%,rgba(154,126,46,0.08),transparent 60%),#F5F3EE !important;
  color: #0A0A0F !important;
}
body section.v3-hero .v3-hero-inner,
section.v3-hero .v3-hero-inner {
  max-width: 880px !important;
  width: 100% !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 22px !important;
}
body section.v3-hero h1.v3-hero-h,
body section.v3-hero .v3-hero-h,
section.v3-hero h1.v3-hero-h,
section.v3-hero .v3-hero-h {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(34px,5.5vw,68px) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.035em !important;
  margin: 0 !important;
  max-width: 22ch !important;
  color: inherit !important;
}
body section.v3-hero p.v3-hero-sub,
body section.v3-hero .v3-hero-sub,
section.v3-hero p.v3-hero-sub,
section.v3-hero .v3-hero-sub {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-size: clamp(15px,1.4vw,18px) !important;
  line-height: 1.55 !important;
  color: rgba(245,243,238,0.74) !important;
  max-width: 60ch !important;
  margin: 0 !important;
}
:root[data-theme="light"] body section.v3-hero p.v3-hero-sub,
:root[data-theme="light"] section.v3-hero p.v3-hero-sub,
:root[data-theme="light"] body section.v3-hero .v3-hero-sub {
  color: rgba(10,10,15,0.74) !important;
}
body a.v3-cta-lg,
a.v3-cta-lg {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 16px 30px !important;
  border-radius: 999px !important;
  background: #C9A84C !important;
  color: #0A0A10 !important;
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  margin-top: 8px !important;
  letter-spacing: -0.005em !important;
}
body a.v3-cta-lg:hover,
a.v3-cta-lg:hover { background: #E2BF5E !important; transform: translateY(-1px); }

/* On pages with their own native hero AFTER a v3-hero (e.g. doubled hero
   bug), the v3-hero is removed by the page; nothing for us to do here.
   But we DO want the second-section h1 to not also use serif — caught by
   the global h1 sweep above. */

/* ============================================================
   CANONICAL FOOTER (kr-footer-v1) — single source of truth.
   Frozen 2026-05-09 to match the homepage <footer> shape so every
   page renders an identical, fully-styled footer just by loading
   /v3.css. High specificity (body footer + body .footer-grid …) so
   page-local resets cannot turn it into a raw bullet list.
   ============================================================ */
body footer,
body footer.kr-footer {
  background: #050508 !important;
  padding: 100px 0 40px !important;
  border-top: 1px solid var(--line) !important;
  color: var(--ink-2) !important;
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
}
:root[data-theme="light"] body footer,
:root[data-theme="light"] body footer.kr-footer {
  background: #F0EDE6 !important;
  border-top-color: rgba(10,10,15,0.10) !important;
}
body footer .shell-wide,
body footer.kr-footer .shell-wide {
  max-width: 1440px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
body footer .footer-grid,
body footer.kr-footer .footer-grid {
  display: grid !important;
  grid-template-columns: 1.6fr repeat(4,1fr) !important;
  gap: 60px !important;
  margin-bottom: 80px !important;
  list-style: none !important;
  padding: 0 !important;
}
body footer .footer-brand,
body footer.kr-footer .footer-brand {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  letter-spacing: 0.38em !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: var(--gold) !important;
  margin: 0 0 20px !important;
}
body footer .footer-desc,
body footer.kr-footer .footer-desc {
  font-size: 14px !important;
  color: var(--ink-2) !important;
  max-width: 40ch !important;
  line-height: 1.65 !important;
  margin: 0 0 20px !important;
}
body footer .footer-socials,
body footer.kr-footer .footer-socials {
  display: flex !important;
  gap: 12px !important;
  margin-top: 16px !important;
}
body footer .footer-socials a,
body footer.kr-footer .footer-socials a {
  width: 36px !important;
  height: 36px !important;
  border: 1px solid var(--line) !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  color: var(--muted) !important;
  transition: color .2s ease, border-color .2s ease !important;
  text-decoration: none !important;
}
body footer .footer-socials a:hover,
body footer.kr-footer .footer-socials a:hover {
  color: var(--gold) !important;
  border-color: var(--gold) !important;
}
body footer .footer-socials svg,
body footer.kr-footer .footer-socials svg {
  width: 14px !important;
  height: 14px !important;
  fill: currentColor !important;
}
body footer .footer-col h5,
body footer.kr-footer .footer-col h5 {
  font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  margin: 0 0 20px !important;
  font-weight: 600 !important;
}
body footer .footer-col ul,
body footer.kr-footer .footer-col ul {
  display: grid !important;
  gap: 10px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
body footer .footer-col li,
body footer.kr-footer .footer-col li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
body footer .footer-col a,
body footer.kr-footer .footer-col a {
  font-size: 14px !important;
  color: var(--ink-2) !important;
  text-decoration: none !important;
  transition: color .2s ease !important;
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
}
body footer .footer-col a:hover,
body footer.kr-footer .footer-col a:hover {
  color: var(--gold) !important;
}
body footer .footer-partners,
body footer.kr-footer .footer-partners {
  border-top: 1px solid var(--line) !important;
  padding: 36px 0 28px !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 40px !important;
  align-items: center !important;
}
body footer .footer-partners .label,
body footer.kr-footer .footer-partners .label {
  font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: var(--dim) !important;
}
body footer .footer-partners .items,
body footer.kr-footer .footer-partners .items {
  display: flex !important;
  gap: 32px !important;
  flex-wrap: wrap !important;
}
body footer .footer-partners .item,
body footer.kr-footer .footer-partners .item {
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-size: 14px !important;
  color: var(--muted) !important;
  letter-spacing: 0.04em !important;
}
body footer .disclaimer,
body footer.kr-footer .disclaimer {
  font-size: 11px !important;
  color: var(--dim) !important;
  line-height: 1.7 !important;
  max-width: 80ch !important;
  margin: 24px 0 0 !important;
  font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace !important;
}
body footer .footer-bottom,
body footer.kr-footer .footer-bottom {
  border-top: 1px solid var(--line) !important;
  margin-top: 36px !important;
  padding-top: 28px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 24px !important;
  flex-wrap: wrap !important;
  font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace !important;
  font-size: 11px !important;
  color: var(--dim) !important;
  letter-spacing: 0.1em !important;
}
@media (max-width:1000px){
  body footer .footer-grid,
  body footer.kr-footer .footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 40px !important;
  }
  body footer .footer-partners,
  body footer.kr-footer .footer-partners {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width:600px){
  body footer .footer-grid,
  body footer.kr-footer .footer-grid {
    grid-template-columns: 1fr !important;
  }
  body footer .footer-bottom,
  body footer.kr-footer .footer-bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}

/* ============================================================
   HERO CENTERING — pages WITHOUT a right-side phone visual get
   centered hero text by default. The homepage keeps its split
   hero because it contains .rv-phone (excluded by :not()).
   ============================================================ */
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .v3-hero-inner,
body .v3-section.v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])),
body .v3-section.v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .shell,
body section.v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .shell,
body section.v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .shell-pricing {
  text-align: center !important;
}
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) h1,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .sub,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .lede,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) p,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .ctas,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .trust {
  margin-left: auto !important;
  margin-right: auto !important;
}
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .ctas,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .trust {
  justify-content: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) h1 {
  max-width: 22ch !important;
}
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .sub,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) .lede,
body .v3-hero:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has(img[data-real-shot])) p {
  max-width: 60ch !important;
}

/* ============================================================
   NON-HERO BODY CENTERING (2026-05-09 d) — comprehensive fix.
   Earlier rules text-align:center'd the .shell of non-hero
   sections inside .v3-page when no phone mockup was present,
   but block-level children with explicit max-width and no
   margin auto stayed flush-left, creating "drift" (about's
   mission split frame, founder bio, tools' "Why we build" p,
   claim-pro / refer / faq narrow blocks).

   This block forces:
   • Every non-hero <section>/<header> (without .rv-phone /
     .phone-frame / [data-real-shot]) inside body.v3-page to
     center itself + its .shell / .shell-narrow / .shell-pricing.
   • Every block-level descendant with bounded max-width to use
     margin: auto so it lands in the middle of the column.
   • Eyebrows, headings, paragraphs, .lede, .sub, .ctas, .trust
     all explicitly centered.
   • .v3-grid-2/3/4 keep their layouts but get margin auto.
   • Inline-styled max-width elements (style="max-width:60ch")
     also recenter — covered by [style*="max-width"].

   Excludes pages that DO have a phone mockup (homepage,
   banking, crypto sections) by both .v3-page wrapping AND the
   :has() phone exclusions used elsewhere.
   ============================================================ */
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])),
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) {
  text-align: center !important;
}

body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) > .shell,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) > .shell-narrow,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) > .shell-pricing,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) > .shell,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) > .shell-narrow,
body.v3-page > .shell:not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Block-level descendants of those centered sections that have
   their own max-width must also center horizontally. */
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) h1,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) h2,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) h3,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) h4,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) p,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .lede,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .sub,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .v3-eyebrow,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .eyebrow,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .ctas,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .trust,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .v3-grid-2,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .v3-grid-3,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .panel,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .split,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) h1,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) h2,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) p,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .lede,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .meta,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .eyebrow,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .ctas {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Flex containers (.ctas, .trust, .meta, .footer-partners are
   excluded for footer) need justify-content:center too. */
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .ctas,
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .trust,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .ctas,
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) .meta {
  justify-content: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
}

/* Inline style="max-width:..." blocks inside non-phone sections
   recentered — catches about's .lede with inline max-width. */
body.v3-page section:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) [style*="max-width"],
body.v3-page header:not(.v3-hero):not(:has(.rv-phone)):not(:has(.phone-frame)):not(:has([data-real-shot])) [style*="max-width"] {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ABOUT page mission/founder split-frame retrofit.
   The mission + founder bio sections are .v3-section.v3-light /
   .v3-dark with single .shell + h2 + p. Force the inline-style
   max-width:60ch <p> blocks to land centered. (Already covered
   by the [style*="max-width"] rule above, but keep an explicit
   higher-specificity rule for safety.) */
body.v3-page #mission .shell,
body.v3-page #mission h2,
body.v3-page #mission .lede,
body.v3-page #mission p {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* TOOLS page narrow .shell rule — the page's local <style> sets
   .shell{max-width:1080px;margin:0 auto} but the v3-page sweep
   above applies a broader 1180px. We let the page's narrower
   rule win for grid flow but keep the "Why we build" section's
   p+h2 centered. */
body.v3-page .tools-grid {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* COMPARE page hero + table — force center. */
body.v3-page .cmp-hero,
body.v3-page .cmp-hero .shell,
body.v3-page .cmp-table.shell,
body.v3-page .cmp-grid.shell {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
body.v3-page .cmp-table.shell table,
body.v3-page .cmp-grid.shell .grid {
  text-align: left !important; /* tables/grids stay left-aligned inside */
  margin-left: auto !important;
  margin-right: auto !important;
}

/* FAQ page header + sections (uses .shell-narrow). */
body.v3-page .faq-hero,
body.v3-page .faq-hero .shell-narrow,
body.v3-page .faq-section,
body.v3-page .faq-section .shell-narrow {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
body.v3-page .faq-section .faq-item,
body.v3-page .faq-section .qa,
body.v3-page .faq-section dl {
  text-align: left !important; /* Q/A bodies stay left-aligned */
}