/* ══════════════════════════════════════════════════════════════════════════
   THEME V2 — Takealot Repricer
   Ported from the approved round-2 design:
   site-redesigns/repricer/v2/src/template.html + PARITY.md (2026-09-08).

   INERT UNLESS <html data-tv2> IS PRESENT. app/layout.js only emits that
   attribute (and the <link> to this file) when the THEME_V2 env flag is true,
   so with the flag off this stylesheet is never fetched and never applies.

   Two layers:
     1. SITE-WIDE  — html[data-tv2] …  tokens, fonts, nav, footer, buttons,
                     cards, inputs, tables, chat widget. Every route inherits it
                     (public .ap pages, dashboard/admin/globals.css pages).
     2. LANDING    — .tv2 …            the DNA-v2 homepage, class-for-class from
                     the approved template. Scoped to the landing container so it
                     can never touch app internals.
   Selectors are deliberately (0,2,x) so they beat globals.css / apple.css
   single-class rules regardless of stylesheet order.
   ══════════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────────────────
   1. SITE-WIDE LAYER
   ───────────────────────────────────────────────────────────────────────── */

/* 1a. globals.css tokens — dashboard, admin, /guide, /tools/stock-recon, login card */
html[data-tv2] {
  --bg-primary: #0A0F1A;
  --bg-secondary: #0E1524;
  --bg-tertiary: #121B2E;
  --bg-card: #121B2E;
  --bg-card-hover: #16203A;
  --bg-input: #0E1524;
  --bg-sidebar: #0A0F1A;
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);
  --text-secondary: #A7B4C7;
  --text-muted: #8494AA;
  --accent-blue-hover: #7DD3FC;
  --radius: 14px;
  --radius-lg: 20px;
  --radius-xl: 20px;
  --gradient-blue: linear-gradient(135deg, #3B82F6, #2563EB);
}

html[data-tv2] body {
  background: #0A0F1A;
  color: #F4F7FB;
}

/* 1b. app cards / buttons / badges / inputs / tables (globals.css component set) */
html[data-tv2] .card {
  background: #121B2E;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
html[data-tv2] .card:hover {
  border-color: rgba(59, 130, 246, 0.40);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}
html[data-tv2] .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: 999px;
  font-weight: 600; letter-spacing: -0.01em;
  border: 1px solid transparent;
  white-space: nowrap; cursor: pointer;
}
html[data-tv2] .btn-primary {
  background: #2563EB; color: #fff;
  box-shadow: 0 4px 20px rgba(59, 130, 246, 0.30);
}
html[data-tv2] .btn-primary:hover { background: #3B82F6; }
html[data-tv2] .btn-secondary {
  background: rgba(255, 255, 255, 0.06);
  color: #F4F7FB;
  border: 1px solid rgba(255, 255, 255, 0.16);
}
html[data-tv2] .btn-secondary:hover { background: rgba(255, 255, 255, 0.10); }
html[data-tv2] .badge {
  border-radius: 999px;
  letter-spacing: 0.04em;
}
html[data-tv2] .form-input,
html[data-tv2] .inline-input {
  background: #0E1524;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;
}
html[data-tv2] .form-input:focus,
html[data-tv2] .inline-input:focus {
  border-color: #3B82F6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.18);
}
html[data-tv2] .form-label {
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 11px;
}
html[data-tv2] .table-container { border-radius: 20px; }
html[data-tv2] thead th {
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: #A7B4C7;
}
html[data-tv2] .login-card {
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: #121B2E;
}
html[data-tv2] .sidebar { border-right: 1px solid rgba(255, 255, 255, 0.08); }
html[data-tv2] .sidebar-logo-icon,
html[data-tv2] .login-logo { border-radius: 11px; }

/* 1c. public pages (.ap = apple.css design system: /, /tour, /pay, /login,
       /fees, /calculator, /blog, /referrals). Token swap first — apple.css is
       fully var-driven, so this re-skins every one of them at once. */
html[data-tv2] .ap {
  --content: 1280px;
  --surface: #121B2E;
  --surface-solid: #121B2E;
  --surface-2: #0E1524;
  --card-hover: #16203A;
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.16);
  --edge: rgba(255, 255, 255, 0.14);
  --muted: #A7B4C7;
  --faint: #8494AA;
  --accent-hi: #60A5FA;
  --r-lg: 20px;
  --r-md: 14px;
  --r-sm: 10px;
  --shadow-card: 0 12px 40px rgba(0, 0, 0, 0.35);
  --shadow-float: 0 24px 60px -18px rgba(0, 0, 0, 0.55);
}

/* nav — 72px glass bar, 38px mark, pill CTA (DNA v2 §nav) */
html[data-tv2] .ap .nav { background: rgba(10, 15, 26, 0.72); }
html[data-tv2] .ap .nav.scrolled {
  background: rgba(10, 15, 26, 0.82);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
html[data-tv2] .ap .nav-inner { min-height: 72px; }
html[data-tv2] .ap .logo-mark {
  width: 38px; height: 38px; border-radius: 11px; font-size: 14px;
  background: linear-gradient(135deg, #3B82F6, #2563EB);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
html[data-tv2] .ap .logo-sub { font-size: 10px; letter-spacing: 0.14em; }
html[data-tv2] .ap .nav-links > a { padding: 8px 16px; }

/* buttons — 52px pill, deep-blue primary, glass secondary (DNA v2 §buttons) */
html[data-tv2] .ap .btn {
  gap: 12px; height: 52px; padding: 0 24px;
  font-size: 16px; border: 1px solid transparent;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
html[data-tv2] .ap .btn-primary {
  background: #2563EB;
  box-shadow: 0 4px 20px rgba(59, 130, 246, 0.30);
}
html[data-tv2] .ap .btn-primary:hover {
  background: #2563EB;
  transform: translateY(-1px);
  box-shadow: 0 6px 26px rgba(59, 130, 246, 0.40);
}
html[data-tv2] .ap .btn-secondary {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.16);
  backdrop-filter: none;
}
html[data-tv2] .ap .btn-secondary:hover {
  background: rgba(255, 255, 255, 0.10);
  transform: translateY(-1px);
}
html[data-tv2] .ap .nav-cta { height: 42px; padding: 0 24px; font-size: 14px; }
html[data-tv2] .ap .menu-btn { border-radius: 12px; }

/* cards — solid plate, 20px radius, blue hover edge (DNA v2 §cards) */
html[data-tv2] .ap .card {
  background: #121B2E;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 32px;
  box-shadow: none;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
html[data-tv2] .ap .card:hover {
  background: #121B2E;
  border-color: rgba(59, 130, 246, 0.40);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}

/* type + eyebrow rule — the DNA-v2 signature, applied on every public page */
html[data-tv2] .ap h2.title,
html[data-tv2] .ap .display { font-weight: 800; letter-spacing: -0.03em; }
html[data-tv2] .ap h3 { font-weight: 700; letter-spacing: -0.02em; }
html[data-tv2] .ap .eyebrow {
  display: flex; align-items: center; gap: 12px;
  font-size: 13px; letter-spacing: 0.12em;
  color: #7DD3FC;
}
html[data-tv2] .ap .eyebrow::before {
  content: ""; flex: none;
  width: 32px; height: 2px; border-radius: 2px;
  background: #3B82F6;
}
html[data-tv2] .ap .sec-head.center .eyebrow { justify-content: center; }

/* inputs on public pages (fees / calculator / login / pay forms) */
html[data-tv2] .ap input,
html[data-tv2] .ap select,
html[data-tv2] .ap textarea {
  border-radius: 12px;
}

/* tables on public pages (fees breakdown, comparison table) */
html[data-tv2] .ap table th {
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

/* footer — surface plate with a top rule (DNA v2 §footer) */
html[data-tv2] .ap .footer {
  padding: 56px 0 64px;
  background: #0E1524;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
html[data-tv2] .ap .footer-line { border-top: 0; padding-top: 0; }

/* 1d. the real chat widget (app/components/ChatWidget.js + chat.css) —
       skinned to the DNA-v2 bubble. The widget itself is untouched: same
       script, same /api/chat POST, same welcome message. */
html[data-tv2] .chat-widget-fab {
  border-radius: 999px;
  background: #2563EB;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45), 0 4px 20px rgba(59, 130, 246, 0.30);
}
html[data-tv2] .chat-widget-fab:hover { transform: translateY(-1px); }
html[data-tv2] .chat-widget-panel {
  border-radius: 20px;
  background: rgba(14, 21, 36, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 24px 60px -18px rgba(0, 0, 0, 0.75);
}
html[data-tv2] .chat-widget-avatar { background: linear-gradient(135deg, #3B82F6, #2563EB); }
html[data-tv2] .chat-bubble-bot {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
}
html[data-tv2] .chat-bubble-user { background: #2563EB; border-radius: 16px; }
html[data-tv2] .chat-widget-input input { border-radius: 999px; }
html[data-tv2] .chat-widget-input button { border-radius: 999px; }

/* 1e. reduced motion — nothing this theme adds may move */
@media (prefers-reduced-motion: reduce) {
  html[data-tv2] .ap .btn,
  html[data-tv2] .ap .card,
  html[data-tv2] .chat-widget-fab { transition: none !important; transform: none !important; }
}

/* ─────────────────────────────────────────────────────────────────────────
   2. LANDING LAYER — .tv2
   Class-for-class from repricer/v2/src/template.html, scoped to the landing
   container. Keyframes are renamed tv2* so they cannot collide with
   globals.css / apple.css animations.
   ───────────────────────────────────────────────────────────────────────── */
.tv2{--ground:#0A0F1A; --surface:#0E1524; --card:#121B2E; --ink:#F4F7FB; --muted:#A7B4C7;
  --accent:#3B82F6; --accent-light:#7DD3FC; --success:#34D399;
  --accent-deep:#2563EB; --glow:rgba(59,130,246,.30); --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.16);
  --grad:linear-gradient(100deg,#3B82F6 0%,#7DD3FC 90%);
  --hero-img:url("/theme-v2/hero-still.jpg");
  --poster-img:url("/explainer-poster.jpg");
  --wrap:1280px; --gut:32px;}
.tv2 *{box-sizing:border-box}
html[data-tv2]{scroll-behavior:smooth}
/* The template's `body` rule belongs to the LANDING, not the document: its
   values come from tokens that only exist on .tv2, and its 17px/1.6 type would
   resize every dashboard table if it were applied site-wide. Body-level colour
   for the rest of the site is set once, in literals, in the site-wide layer
   above (html[data-tv2] body). */
.tv2{background:var(--ground); color:var(--ink);
  font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:17px; line-height:1.6; font-weight:400;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;}
.tv2 img{max-width:100%; display:block}
.tv2 a{color:inherit; text-decoration:none}
.tv2 h1,.tv2 h2,.tv2 h3,.tv2 h4{margin:0; font-weight:800; letter-spacing:-.02em; line-height:1.05}
.tv2 p{margin:0}
.tv2 ul{margin:0; padding:0; list-style:none}
.tv2 .wrap{max-width:var(--wrap); margin:0 auto; padding:0 var(--gut)}
.tv2 .sect{padding:128px 0; position:relative}
.tv2 section[id]{scroll-margin-top:72px}
.tv2 .sect--surface{background:var(--surface)}
.tv2 .grad{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.tv2 .eyebrow{display:flex; align-items:center; gap:12px; font-size:13px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; color:var(--accent-light); margin-bottom:24px}
.tv2 .eyebrow::before{content:""; width:32px; height:2px; background:var(--accent); border-radius:2px; flex:none}
.tv2 h1{font-size:clamp(46px,6.45vw,94px); line-height:.98; letter-spacing:-.03em; font-weight:800}
.tv2 h2{font-size:clamp(36px,4.46vw,64px); line-height:1.02; letter-spacing:-.02em}
.tv2 h3{font-size:25px; line-height:1.15; letter-spacing:-.02em; font-weight:700}
.tv2 .lede{font-size:20px; line-height:1.55; color:var(--muted); max-width:62ch}
.tv2 .body{font-size:17px; line-height:1.6; color:var(--muted); max-width:62ch}
.tv2 .small{font-size:13px; line-height:1.5; color:var(--muted)}
.tv2 .btn{display:inline-flex; align-items:center; justify-content:center; gap:12px; height:52px;
  padding:0 24px; border-radius:999px; font-size:16px; font-weight:600; letter-spacing:-.01em;
  border:1px solid transparent; transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
  white-space:nowrap; cursor:pointer}
.tv2 .btn-primary{background:var(--accent-deep); color:#fff; box-shadow:0 4px 20px var(--glow)}
.tv2 .btn-primary:hover{transform:translateY(-1px); box-shadow:0 6px 26px rgba(59,130,246,.40)}
.tv2 .btn-secondary{background:rgba(255,255,255,.06); color:var(--ink); border-color:var(--line2)}
.tv2 .btn-secondary:hover{transform:translateY(-1px); background:rgba(255,255,255,.10)}
.tv2 .btn-row{display:flex; gap:16px; flex-wrap:wrap; margin-top:32px}
.tv2 .nav{position:sticky; top:0; z-index:60; height:72px; display:flex; align-items:center;
  background:rgba(10,15,26,.72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.tv2 .nav .wrap{display:flex; align-items:center; gap:24px; width:100%}
.tv2 .brand{display:flex; align-items:center; gap:12px; margin-right:auto}
.tv2 .mark{width:38px; height:38px; border-radius:11px; display:grid; place-items:center;
  background:linear-gradient(135deg,#3B82F6,#2563EB); color:#fff; font-weight:800; font-size:14px;
  letter-spacing:.02em; box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.tv2 .brand .name{display:block}
.tv2 .brand b{display:block; font-size:16px; font-weight:700; letter-spacing:-.01em; line-height:1.2}
.tv2 .brand .sub{display:block; font-size:10px; letter-spacing:.14em; color:var(--muted); text-transform:uppercase}
.tv2 .nav-links{display:flex; align-items:center; gap:8px}
.tv2 .nav-links a{padding:8px 16px; border-radius:999px; font-size:14px; font-weight:500; color:var(--muted);
  transition:color .2s ease, background .2s ease}
.tv2 .nav-links a:hover{color:var(--ink); background:rgba(255,255,255,.06)}
.tv2 .nav-cta{height:42px; padding:0 24px; font-size:14px}
.tv2 .nav-cta .short{display:none}
.tv2 .mnav{display:none; position:relative}
.tv2 .mnav summary{list-style:none; height:42px; width:42px; display:grid; place-items:center;
  border:1px solid var(--line2); border-radius:12px; background:rgba(255,255,255,.06); cursor:pointer}
.tv2 .mnav summary::-webkit-details-marker{display:none}
.tv2 .mnav-panel{position:absolute; right:0; top:52px; width:min(78vw,280px); background:var(--card);
  border:1px solid var(--line2); border-radius:20px; padding:12px; display:grid; gap:8px;
  box-shadow:0 24px 60px -18px rgba(0,0,0,.55)}
.tv2 .mnav-panel a{padding:12px 16px; border-radius:12px; font-size:16px; font-weight:600}
.tv2 .mnav-panel a:hover{background:rgba(255,255,255,.06)}
.tv2 .hero{position:relative; min-height:92vh; display:flex; align-items:center;
  padding:96px 0 80px; overflow:hidden; isolation:isolate}
.tv2 .hero-bg{position:absolute; inset:0; z-index:-3; overflow:hidden}
.tv2 .hero-bg img{width:100%; height:100%; object-fit:cover; object-position:70% 34%;
  transform:scaleX(-1) scale(1.05); transform-origin:50% 50%}
.tv2 .hero-veil{position:absolute; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(120% 90% at 74% 12%, rgba(59,130,246,.16), rgba(0,0,0,0) 50%),
    linear-gradient(90deg, rgba(10,15,26,.70) 0%, rgba(10,15,26,.62) 40%, rgba(10,15,26,.34) 68%, rgba(10,15,26,.26) 100%),
    linear-gradient(180deg, rgba(10,15,26,.66) 0%, rgba(10,15,26,.65) 34%, rgba(10,15,26,.76) 72%, rgba(10,15,26,.99) 100%)}
.tv2 .hero-inner{display:grid; grid-template-columns:7.3fr 4.7fr; gap:var(--gut); align-items:center; width:100%}
.tv2 .hero h1{margin-bottom:28px}
.tv2 .hero .lede{max-width:60ch}
.tv2 .proof-line{display:flex; gap:24px; flex-wrap:wrap; margin-top:32px; font-size:14px; color:var(--ink)}
.tv2 .proof-line span{display:flex; align-items:center; gap:8px}
.tv2 .proof-line span::before{content:""; width:6px; height:6px; border-radius:50%; background:rgba(59,130,246,.55)}
.tv2 .hero-media{position:relative}
.tv2 .frame{border-radius:20px; border:1px solid var(--line2); overflow:hidden; position:relative;
  background:var(--card); box-shadow:0 24px 60px -18px rgba(0,0,0,.55)}
.tv2 .frame img{width:100%; aspect-ratio:16/9; object-fit:cover}
.tv2 .frame-img{width:100%; aspect-ratio:16/9; background-image:var(--poster-img);
  background-size:cover; background-position:50% 50%}
.tv2 .frame .scrim{position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,15,26,.10),rgba(10,15,26,.55))}
.tv2 .play{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  display:inline-flex; align-items:center; gap:12px; height:56px; padding:0 24px;
  border-radius:999px; background:rgba(10,15,26,.72); border:1px solid var(--line2);
  backdrop-filter:blur(8px); font-weight:600; font-size:16px; color:var(--ink);
  box-shadow:0 8px 30px rgba(0,0,0,.45); transition:transform .2s ease, background .2s ease}
.tv2 .play:hover{transform:translate(-50%,-50%) scale(1.04); background:rgba(10,15,26,.86)}
.tv2 .play svg{fill:var(--ink)}
.tv2 .chip-time{position:absolute; right:16px; top:16px; height:28px; padding:0 12px; border-radius:999px;
  display:inline-flex; align-items:center; font-size:12px; font-weight:600; letter-spacing:.08em;
  background:rgba(10,15,26,.78); border:1px solid var(--line2); color:var(--ink)}
.tv2 .watch{margin-top:16px; padding:16px; border-radius:16px; background:rgba(18,27,46,.72);
  border:1px solid var(--line); font-size:14px; line-height:1.55; color:var(--muted);
  backdrop-filter:blur(6px)}
.tv2 .watch b{color:var(--ink)}
.tv2 .media-top{position:relative}
.tv2 .glow-stat{position:absolute; left:-28px; bottom:-32px; padding:16px 24px; border-radius:20px;
  background:rgba(14,21,36,.92); border:1px solid rgba(59,130,246,.35);
  box-shadow:0 24px 60px -18px rgba(0,0,0,.65); backdrop-filter:blur(8px)}
.tv2 .glow-stat .n{font-size:44px; font-weight:800; letter-spacing:-.03em; line-height:1;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow:0 0 24px rgba(59,130,246,.35)}
.tv2 .glow-stat .l{font-size:12px; letter-spacing:.10em; text-transform:uppercase; color:var(--muted); margin-top:8px}
.tv2 .strip{background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.tv2 .stats{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gut)}
.tv2 .stat .n{font-size:64px; font-weight:800; letter-spacing:-.03em; line-height:1;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.tv2 .stat .l{margin-top:16px; font-size:13px; letter-spacing:.10em; text-transform:uppercase; font-weight:600}
.tv2 .stat .s{margin-top:8px; font-size:13px; color:var(--muted); line-height:1.5}
.tv2 .grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:24px}
.tv2 .grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
.tv2 .card{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:32px;
  display:flex; flex-direction:column;
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease}
.tv2 .card:hover{border-color:rgba(59,130,246,.40); transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,0,0,.35)}
.tv2 .icon{width:44px; height:44px; border-radius:12px; background:rgba(59,130,246,.12);
  display:grid; place-items:center; margin-bottom:24px}
.tv2 .card .go{display:block; margin-top:auto; padding-top:24px; font-size:14px; font-weight:600; color:var(--accent-light)}
.tv2 .icon svg{width:20px; height:20px; stroke:var(--accent); fill:none; stroke-width:1.75;
  stroke-linecap:round; stroke-linejoin:round}
.tv2 .card h3{margin-bottom:12px}
.tv2 .card p{color:var(--muted); font-size:16px; line-height:1.6}
.tv2 .head{margin-bottom:64px; max-width:760px}
.tv2 .head h2{margin-bottom:24px}
.tv2 .split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.09fr); gap:64px; align-items:center}
.tv2 .split>*{min-width:0}
.tv2 .split--mirror{grid-template-columns:minmax(0,1.09fr) minmax(0,1fr)}
.tv2 .split--mirror .split-media{order:2}
.tv2 .split-copy h2{margin-bottom:24px}
.tv2 .checks{display:grid; gap:16px; margin-top:32px}
.tv2 .checks li{display:flex; gap:12px; align-items:flex-start; font-size:16px; color:var(--ink)}
.tv2 .checks svg{width:20px; height:20px; flex:none; margin-top:2px; stroke:var(--accent); fill:none;
  stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round}
.tv2 .shot{position:relative; border-radius:20px; border:1px solid var(--line2); overflow:hidden;
  background:var(--card); box-shadow:0 24px 60px -18px rgba(0,0,0,.55)}
.tv2 .shot img{width:100%; height:auto}
.tv2 .shot::after{content:""; position:absolute; left:0; right:0; top:0; height:100%; pointer-events:none;
  background:linear-gradient(180deg, rgba(59,130,246,0) 0%, rgba(59,130,246,.16) 50%, rgba(59,130,246,0) 100%);
  transform:translateY(-100%); animation:tv2sweep 9s ease-in-out infinite}

@keyframes tv2sweep{0%,62%{transform:translateY(-100%)}88%,100%{transform:translateY(100%)}}.tv2 .caption{margin-top:16px; font-size:13px; line-height:1.5; color:var(--muted)}
.tv2 .caption b{color:var(--ink); font-weight:600}
.tv2 .panel{border-radius:20px; border:1px solid var(--line2); overflow:hidden; background:var(--card);
  box-shadow:0 24px 60px -18px rgba(0,0,0,.55)}
.tv2 .panel-top{display:flex; align-items:center; gap:12px; padding:16px 24px;
  border-bottom:1px solid var(--line); background:rgba(255,255,255,.03)}
.tv2 .panel-top .dot{width:9px; height:9px; border-radius:50%; background:var(--line2)}
.tv2 .panel-title{font-size:13px; font-weight:600; letter-spacing:.02em}
.tv2 .tag{margin-left:auto; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent-light); background:rgba(59,130,246,.12); border:1px solid rgba(59,130,246,.30);
  padding:4px 12px; border-radius:999px}
.tv2 .acl li{display:flex; align-items:center; gap:16px; padding:16px 24px; border-bottom:1px solid var(--line);
  font-size:15px}
.tv2 .acl li:last-child{border-bottom:0}
.tv2 .acl .k{color:var(--ink); font-weight:600}
.tv2 .acl .v{margin-left:auto; color:var(--muted); font-size:14px; text-align:right}
.tv2 .acl .v.no{color:var(--accent-light); font-weight:600}
.tv2 .acl svg{width:20px; height:20px; flex:none; stroke:var(--accent); fill:none; stroke-width:1.75;
  stroke-linecap:round; stroke-linejoin:round}
.tv2 .panel-foot{display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 24px; border-top:1px solid var(--line); font-size:12px; color:var(--muted);
  background:rgba(255,255,255,.02); letter-spacing:.04em; text-transform:uppercase; font-weight:600}
.tv2 .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; counter-reset:s}
.tv2 .step{position:relative; background:var(--card); border:1px solid var(--line); border-radius:20px;
  padding:32px; transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease}
.tv2 .step:hover{border-color:rgba(59,130,246,.40); transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,0,0,.35)}
.tv2 .step .num{font-size:44px; font-weight:800; letter-spacing:-.03em; line-height:1;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; margin-bottom:24px}
.tv2 .step h3{margin-bottom:12px}
.tv2 .step p{color:var(--muted); font-size:16px}
.tv2 .step-line{position:absolute; top:48px; right:-16px; width:32px; height:1px;
  background:linear-gradient(90deg,rgba(59,130,246,.6),rgba(59,130,246,0))}
.tv2 .tour-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:64px; align-items:center}
.tv2 .tour-grid>*{min-width:0}
.tv2 .tour-grid h2{margin-bottom:24px}
.tv2 .strip-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:24px}
.tv2 .still{margin:0; border-radius:16px; overflow:hidden; border:1px solid var(--line); background:var(--card)}
.tv2 .still img{width:100%; aspect-ratio:16/9; object-fit:cover}
.tv2 .still figcaption{padding:12px 16px; font-size:13px; color:var(--muted); line-height:1.4}
.tv2 .note-card{margin-top:32px; padding:24px; border-radius:20px; border:1px solid var(--line);
  background:var(--card); font-size:15px; line-height:1.6; color:var(--muted)}
.tv2 .note-card b{color:var(--ink)}
.tv2 .note-card a{color:var(--accent-light); font-weight:600}
.tv2 .badges{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
.tv2 .badge{display:inline-flex; align-items:center; gap:12px; padding:12px 16px; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid var(--line2); font-size:14px; font-weight:500}
.tv2 .badge svg{width:16px; height:16px; stroke:var(--accent-light); fill:none; stroke-width:1.75;
  stroke-linecap:round; stroke-linejoin:round}
.tv2 .rail{display:grid; grid-template-columns:repeat(4,1fr); gap:24px}
.tv2 .tool{display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line);
  border-radius:20px; padding:32px; transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease}
.tv2 .tool:hover{border-color:rgba(59,130,246,.40); transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,0,0,.35)}
.tv2 .tool .chip{align-self:flex-start; font-size:12px; font-weight:700; letter-spacing:.10em;
  text-transform:uppercase; color:var(--accent-light); background:rgba(59,130,246,.12);
  border-radius:999px; padding:4px 12px; margin-bottom:16px}
.tv2 .tool-art{height:96px; border-radius:16px; margin-bottom:24px; border:1px solid var(--line);
  position:relative; overflow:hidden}
.tv2 .tool-art svg{position:absolute; inset:0; width:100%; height:100%}
.tv2 .tool:nth-child(1) .tool-art{background:linear-gradient(150deg,rgba(59,130,246,.30),rgba(59,130,246,.02))}
.tv2 .tool:nth-child(2) .tool-art{background:linear-gradient(150deg,rgba(37,99,235,.34),rgba(59,130,246,.02))}
.tv2 .tool:nth-child(3) .tool-art{background:linear-gradient(150deg,rgba(125,211,252,.22),rgba(59,130,246,.02))}
.tv2 .tool:nth-child(4) .tool-art{background:linear-gradient(150deg,rgba(59,130,246,.18),rgba(125,211,252,.06))}
.tv2 .tool h3{font-size:20px; margin-bottom:12px}
.tv2 .tool p{font-size:14px; color:var(--muted); line-height:1.55; margin-bottom:24px}
.tv2 .tool .price{margin-top:auto; font-size:25px; font-weight:800; letter-spacing:-.02em; color:var(--accent-light);
  line-height:1.15}
.tv2 .tool .go{font-size:14px; font-weight:600; color:var(--muted); margin-top:12px}
.tv2 .stat{display:block}
.tv2 .ticker{padding:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  background:var(--surface); overflow:hidden; position:relative}
.tv2 .ticker::before,.tv2 .ticker::after{content:""; position:absolute; top:0; bottom:0; width:140px; z-index:2; pointer-events:none}
.tv2 .ticker::before{left:0; background:linear-gradient(90deg,var(--surface),rgba(14,21,36,0))}
.tv2 .ticker::after{right:0; background:linear-gradient(270deg,var(--surface),rgba(14,21,36,0))}
.tv2 .tick-track{display:flex; width:max-content; animation:tv2marq 30s linear infinite}
.tv2 .tick-track ul{display:flex; align-items:center; gap:48px; padding-right:48px}
.tv2 .tick-track li{display:flex; align-items:center; gap:48px; font-size:13px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; color:var(--muted); white-space:nowrap}
.tv2 .tick-track li::after{content:""; width:6px; height:6px; border-radius:50%; background:var(--accent)}

@keyframes tv2marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}.tv2 .prices{display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start}
.tv2 .price-card{position:relative; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:32px}
.tv2 .price-card.pro{border-color:rgba(59,130,246,.40);
  background:radial-gradient(120% 90% at 50% 0%, rgba(59,130,246,.14), rgba(0,0,0,0) 55%), var(--card)}
.tv2 .pop{position:absolute; top:-14px; left:32px; font-size:11px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; background:var(--accent-deep); color:#fff; padding:8px 16px; border-radius:999px;
  box-shadow:0 4px 20px var(--glow)}
.tv2 .price-card .tier{font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-light); font-weight:700}
.tv2 .price-card .amt{display:flex; align-items:baseline; gap:12px; margin:24px 0 8px}
.tv2 .price-card .amt b{font-size:56px; font-weight:800; letter-spacing:-.03em; line-height:1}
.tv2 .price-card .amt s{font-size:20px; color:var(--muted)}
.tv2 .price-card .terms{font-size:13px; color:var(--muted)}
.tv2 .plist{display:grid; gap:12px; margin:32px 0}
.tv2 .plist li{display:flex; gap:12px; font-size:15px; color:var(--muted)}
.tv2 .plist svg{width:18px; height:18px; flex:none; margin-top:3px; stroke:var(--accent); fill:none;
  stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round}
.tv2 .price-card .btn{width:100%}
.tv2 .saver{margin-top:12px; text-align:center; font-size:13px; color:var(--accent-light)}
.tv2 .compare{margin-top:64px; border:1px solid var(--line); border-radius:20px; overflow:hidden; background:var(--card)}
.tv2 .compare table{width:100%; border-collapse:collapse; font-size:15px}
.tv2 .compare th{text-align:left; font-size:12px; letter-spacing:.10em; text-transform:uppercase;
  color:var(--muted); font-weight:600; padding:16px 24px; border-bottom:1px solid var(--line)}
.tv2 .compare td{padding:16px 24px; border-bottom:1px solid var(--line); color:var(--muted)}
.tv2 .compare td:first-child{color:var(--ink); font-weight:600}
.tv2 .compare td.us{color:var(--ink)}
.tv2 .compare tr:last-child td{border-bottom:0}
.tv2 .compare .yes{color:var(--accent-light); font-weight:700}
.tv2 .compare .no{color:var(--muted)}
.tv2 .foot-note{margin-top:16px; font-size:13px; color:var(--muted)}
.tv2 .faqs{display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start}
.tv2 .faq h3{font-size:20px; margin-bottom:12px; line-height:1.25}
.tv2 .faq p{font-size:15px; line-height:1.6; color:var(--muted)}
.tv2 .quote{position:relative; border-radius:20px; padding:2px; background:linear-gradient(135deg,rgba(59,130,246,.55),rgba(125,211,252,.15) 60%,rgba(255,255,255,.05));
  margin-bottom:24px}
.tv2 .quote-in{border-radius:19px; background:var(--card); padding:48px}
.tv2 .quote-in .q{font-size:25px; line-height:1.4; letter-spacing:-.01em; max-width:36ch}
.tv2 .quote-in .who{margin-top:32px; display:flex; align-items:center; gap:16px; font-size:14px; color:var(--muted)}
.tv2 .avatar{width:44px; height:44px; border-radius:50%; display:grid; place-items:center; font-weight:700;
  font-size:14px; color:var(--accent-light); background:rgba(59,130,246,.12); border:1px solid rgba(59,130,246,.30)}
.tv2 .stars{display:flex; gap:8px; margin-bottom:24px}
.tv2 .stars svg{width:16px; height:16px; fill:var(--accent-light)}
.tv2 .notes{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
.tv2 .note{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:32px;
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease}
.tv2 .note:hover{border-color:rgba(59,130,246,.40); transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,0,0,.35)}
.tv2 .note p{font-size:16px; line-height:1.55; margin-bottom:24px}
.tv2 .note .who{display:flex; align-items:center; gap:16px; font-size:13px; color:var(--muted)}
.tv2 .closer{position:relative; overflow:hidden; text-align:center; background:var(--ground)}
.tv2 .closer-bg{position:absolute; inset:0; z-index:0; background-image:var(--hero-img);
  background-size:cover; background-position:66% 26%; opacity:.62; filter:saturate(.85)}
.tv2 .closer-veil{position:absolute; inset:0; z-index:1;
  background:radial-gradient(70% 60% at 50% 18%, rgba(59,130,246,.26), rgba(0,0,0,0) 60%),
             linear-gradient(180deg, rgba(10,15,26,.72) 0%, rgba(10,15,26,.86) 42%, rgba(10,15,26,.99) 100%)}
.tv2 .closer .wrap{position:relative; z-index:2}
.tv2 .closer h2{margin:0 auto 24px; max-width:16ch}
.tv2 .closer .body{margin:0 auto; text-align:center}
.tv2 .closer .btn-row{justify-content:center}
.tv2 .reassure{margin-top:24px; font-size:14px; color:var(--muted)}
.tv2 .facts{margin-top:32px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:32px; font-size:14px; color:var(--muted)}
.tv2 .facts span{display:inline-flex; align-items:center; gap:12px}
.tv2 .facts svg{width:16px; height:16px; stroke:var(--accent-light); fill:none; stroke-width:1.75;
  stroke-linecap:round; stroke-linejoin:round}
.tv2 .facts a{color:var(--ink); font-weight:600}
.tv2 .refer{margin:64px auto 0; max-width:760px; display:grid; gap:16px; justify-items:center;
  padding:32px; border-radius:20px; border:1px solid var(--line);
  
  background:rgba(8,12,21,.95); font-size:14px; color:var(--muted)}
.tv2 .refer b{color:var(--ink)}
.tv2 .refer .lead{font-size:25px; font-weight:800; letter-spacing:-.02em; line-height:1.15; color:var(--ink)}
.tv2 .foot{background:var(--surface); border-top:1px solid var(--line); padding:80px 0}
.tv2 .foot-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:var(--gut)}
.tv2 .foot h4{font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); margin-bottom:24px; font-weight:700}
.tv2 .foot ul{display:grid; gap:12px}
.tv2 .foot a{font-size:15px; color:var(--muted)}
.tv2 .foot a:hover{color:var(--ink)}
.tv2 .foot .blurb{font-size:15px; color:var(--muted); max-width:34ch; margin-top:24px}
.tv2 .foot-badges{display:flex; flex-wrap:wrap; gap:12px; margin:48px 0 24px; padding-top:32px; border-top:1px solid var(--line)}
.tv2 .foot-badges span{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:8px 16px}
.tv2 .legal{font-size:13px; color:var(--muted)}

@keyframes tv2fadeUp{from{opacity:0; transform:translateY(18px)}to{opacity:1; transform:none}}html.js .tv2 .rv{animation:tv2fadeUp .5s cubic-bezier(.2,.7,.3,1) both}
html.js .tv2 .rv.d1{animation-delay:.08s}
html.js .tv2 .rv.d2{animation-delay:.16s}
html.js .tv2 .rv.d3{animation-delay:.24s}

@media print{html.js .tv2 .rv{animation:none !important; opacity:1 !important; transform:none !important}
}.tv2 .hero h1{animation:tv2fadeUp .8s cubic-bezier(.2,.7,.3,1) both; animation-delay:.06s}
.tv2 .hero h1 .grad{background-size:220% 100%; animation:tv2sheen 7s ease-in-out infinite alternate}

@keyframes tv2sheen{from{background-position:0% 50%}to{background-position:100% 50%}}.tv2 .hero .eyebrow,.tv2 .hero .lede,.tv2 .hero .btn-row,.tv2 .hero .proof-line{animation:tv2fadeUp .7s cubic-bezier(.2,.7,.3,1) both}
.tv2 .hero .lede{animation-delay:.26s}
.tv2 .hero .btn-row{animation-delay:.34s}
.tv2 .hero .proof-line{animation-delay:.42s}
.tv2 .hero-media{animation:tv2fadeUp .9s cubic-bezier(.2,.7,.3,1) both; animation-delay:.30s}

@keyframes tv2kb{from{transform:scaleX(-1) scale(1.05)}to{transform:scaleX(-1) scale(1.13)}}.tv2 .hero-bg img{animation:tv2kb 24s ease-in-out infinite alternate}
.tv2 .frame video{width:100%; aspect-ratio:16/9; object-fit:cover; display:block; background:#000}
.tv2 .frame video::cue{background:rgba(10,15,26,.82); color:#fff}
.tv2 .frame.is-playing .cc,.tv2 .frame.is-playing .chip-time{opacity:0; visibility:hidden}
.tv2 .frame .cc,.tv2 .frame .chip-time{transition:opacity .2s ease; pointer-events:none}

@media (min-width:901px){.tv2 .glow-stat{transition:opacity .18s ease}
.tv2 .media-top:hover .glow-stat,.tv2 .media-top:focus-within .glow-stat{opacity:0; pointer-events:none}

}.tv2 .watch .watch-out{color:#7DD3FC; font-weight:600; white-space:nowrap}
.tv2 .frame .cc{position:absolute; left:16px; top:16px; height:28px; padding:0 12px; border-radius:999px;
  display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:600; letter-spacing:.06em;
  background:rgba(10,15,26,.78); border:1px solid var(--line2); color:var(--ink)}
.tv2 .frame .cc svg{width:14px; height:14px; stroke:var(--accent-light); fill:none; stroke-width:1.75;
  stroke-linecap:round; stroke-linejoin:round}
.tv2 a.play:focus-visible{outline:2px solid var(--accent-light); outline-offset:3px}
.tv2 .faq{padding:0; display:block}
.tv2 .faq summary{list-style:none; display:flex; gap:16px; align-items:flex-start; cursor:pointer; padding:24px 32px}
.tv2 .faq summary::-webkit-details-marker{display:none}
.tv2 .faq summary h3{font-size:20px; line-height:1.25; margin:0}
.tv2 .faq summary::after{content:""; margin-left:auto; flex:none; width:11px; height:11px; margin-top:7px;
  border-right:2px solid var(--accent-light); border-bottom:2px solid var(--accent-light);
  transform:rotate(45deg); transition:transform .2s ease}
.tv2 .faq[open] summary::after{transform:rotate(-135deg)}
.tv2 .faq summary:focus-visible{outline:2px solid var(--accent-light); outline-offset:-3px; border-radius:20px}
.tv2 .faq .a{padding:0 32px 24px; font-size:15px; line-height:1.6; color:var(--muted)}
.tv2 .seg-wrap{display:none}
html.js .tv2 .seg-wrap{display:flex; flex-direction:column; align-items:center; gap:12px; margin:0 0 48px}
.tv2 .seg{display:inline-flex; padding:4px; border-radius:999px; background:rgba(255,255,255,.06);
  border:1px solid var(--line2)}
.tv2 .seg button{height:44px; padding:0 24px; border:0; background:none; cursor:pointer; border-radius:999px;
  font-family:inherit; font-size:15px; font-weight:600; letter-spacing:-.01em; color:var(--muted);
  transition:color .2s ease, background .2s ease, box-shadow .2s ease}
.tv2 .seg button[aria-selected="true"]{color:#fff; background:var(--accent-deep); box-shadow:0 4px 20px var(--glow)}
.tv2 .seg button:focus-visible{outline:2px solid var(--accent-light); outline-offset:2px}
.tv2 .seg-note{font-size:13px; color:var(--accent-light)}
.tv2 .caro-shell{position:relative}
.tv2 .caro{display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 48px)/3); gap:24px;
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding-bottom:8px;
  scrollbar-width:none; -ms-overflow-style:none; cursor:grab}
.tv2 .caro::-webkit-scrollbar{display:none}
.tv2 .caro.drag{cursor:grabbing; scroll-behavior:auto; scroll-snap-type:none}
.tv2 .caro>*{scroll-snap-align:start}
.tv2 .caro-card{padding:32px}
.tv2 .caro-card .eyebrow{margin-bottom:16px}
.tv2 .caro-card .q{font-size:20px; line-height:1.45; letter-spacing:-.01em}
.tv2 .caro-card p{font-size:16px; line-height:1.55; color:var(--ink)}
.tv2 .caro-card p.dim{color:var(--muted); font-size:15px}
.tv2 .caro-card .who{margin-top:auto; padding-top:24px; display:flex; align-items:center; gap:16px;
  font-size:13px; color:var(--muted)}
.tv2 .caro-card .stars{margin-bottom:16px}
.tv2 .caro-nav{display:none; align-items:center; gap:12px; margin-top:32px}
html.js .tv2 .caro-nav{display:flex}
html.js .tv2 .caro-static{display:none}
.tv2 .caro-static{margin-top:16px}
.tv2 .caro-btn{width:52px; height:52px; flex:none; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.06); border:1px solid var(--line2); color:var(--ink); cursor:pointer;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:background .2s ease, transform .2s ease, border-color .2s ease}
.tv2 .caro-btn:hover{background:rgba(255,255,255,.12); transform:translateY(-1px); border-color:rgba(59,130,246,.40)}
.tv2 .caro-btn:focus-visible{outline:2px solid var(--accent-light); outline-offset:3px}
.tv2 .caro-btn svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round}
.tv2 .caro-dots{display:flex; align-items:center; gap:8px; margin-left:8px}
.tv2 .caro-dots button{width:9px; height:9px; padding:0; border:0; border-radius:50%; cursor:pointer;
  background:rgba(255,255,255,.24); transition:background .2s ease, transform .2s ease}
.tv2 .caro-dots button[aria-current="true"]{background:var(--accent); transform:scale(1.4)}
.tv2 .caro-dots button:focus-visible{outline:2px solid var(--accent-light); outline-offset:3px}
.tv2 .caro-hint{margin-left:auto; font-size:13px; color:var(--muted); text-align:right}
.tv2 .refer-stats{display:flex; flex-wrap:wrap; justify-content:center; gap:32px; margin-top:24px}
.tv2 .refer-stat b{display:block; font-size:32px; font-weight:800; letter-spacing:-.03em; line-height:1}
.tv2 .refer-stat span{display:block; margin-top:8px; font-size:12px; letter-spacing:.10em;
  text-transform:uppercase; color:var(--muted)}

@media (max-width:1100px){.tv2 .grid-4,.tv2 .rail{grid-template-columns:repeat(2,1fr)}
.tv2 .foot-grid{grid-template-columns:1fr 1fr}
.tv2 .split,.tv2 .tour-grid{gap:48px}

}
@media (max-width:900px){.tv2{--gut:20px}
.tv2 .sect{padding:80px 0}
.tv2 .nav-links{display:none}
.tv2 .nav .wrap{gap:12px}
.tv2 .nav .nav-cta{display:inline-flex; padding:0 16px; font-size:14px}
.tv2 .brand .sub{display:none}
.tv2 .brand b{font-size:15px; white-space:nowrap}
.tv2 .mnav{display:block}
.tv2 .play{height:48px; padding:0 20px; font-size:15px; white-space:nowrap}
.tv2 .hero{min-height:640px; padding:64px 0}
.tv2 .hero-inner{grid-template-columns:1fr; gap:48px}
.tv2 .hero h1{max-width:none}
.tv2 .hero-bg img{object-position:100% 50%}
.tv2 .hero-veil{background:
    radial-gradient(120% 60% at 70% 8%, rgba(59,130,246,.12), rgba(0,0,0,0) 55%),
    linear-gradient(180deg, rgba(10,15,26,.90) 0%, rgba(10,15,26,.93) 34%, rgba(10,15,26,.96) 72%, rgba(10,15,26,1) 96%)}
.tv2 .glow-stat{position:static; margin-top:16px; padding:12px 16px; display:flex;
    align-items:center; gap:16px}
.tv2 .glow-stat .n{font-size:32px}
.tv2 .glow-stat .l{margin-top:0}
.tv2 .stats{grid-template-columns:1fr 1fr; gap:32px 24px}
.tv2 .stat .n{font-size:44px}
.tv2 .grid-4,.tv2 .grid-3,.tv2 .steps,.tv2 .notes,.tv2 .prices,.tv2 .foot-grid,.tv2 .faqs{grid-template-columns:1fr}
.tv2 .split,.tv2 .split--mirror,.tv2 .tour-grid{grid-template-columns:1fr}
.tv2 .split--mirror .split-media{order:0}
.tv2 .head{margin-bottom:48px}
.tv2 .step-line{display:none}
.tv2 .rail{grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:78%;
    overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:12px;
    margin:0 calc(var(--gut)*-1); padding-left:var(--gut); padding-right:var(--gut)}
.tv2 .tool{scroll-snap-align:start}
.tv2 .quote-in{padding:32px}
.tv2 .quote-in .q{font-size:20px}
.tv2 .compare{overflow-x:auto}
.tv2 .compare table{min-width:560px}
.tv2 .btn{width:auto}
.tv2 .ticker::before,.tv2 .ticker::after{width:60px}
.tv2 .facts{gap:16px 24px}
.tv2 .caro{grid-auto-columns:calc((100% - 24px)/2)}
.tv2 .caro-hint{display:none}
.tv2 .faq summary{padding:24px}
.tv2 .faq .a{padding:0 24px 24px}

}
@media (max-width:520px){.tv2 .acl li{flex-wrap:wrap; gap:8px 16px}
.tv2 .acl .v{margin-left:36px; text-align:left; width:100%}
.tv2 .brand b{font-size:14px}
.tv2 .nav-cta{padding:0 16px}
.tv2 .nav-cta .full{display:none}
.tv2 .nav-cta .short{display:inline}
.tv2 .strip-3{grid-template-columns:1fr}
.tv2 .caro{grid-auto-columns:80%}
.tv2 .seg button{padding:0 16px; font-size:14px}

}
@media (prefers-reduced-motion:reduce){html[data-tv2]{scroll-behavior:auto}
.tv2 .caro{scroll-behavior:auto}
.tv2 *,.tv2 *::before,.tv2 *::after{animation:none !important; transition:none !important}

}