.tx-preview .tx-hero{
  color:var(--ink);
  font-family:var(--font);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.tx-preview .tx-hero{
  --bg:#f5f7fb;
  --ink:#0e1526;
  --muted:#4a5468;
  --blue:#174cf2;
  --font: Figtree, ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}
.tx-preview .tx-hero,.tx-preview .tx-hero *{box-sizing:border-box;margin:0;padding:0}

/* ---------- hero shell (light, matches the site) ---------- */
.tx-preview .tx-hero{position:relative;min-height:100svh;background:var(--bg);padding:calc(env(safe-area-inset-top,0px) + 30px) 14px 28px;overflow:hidden}
.tx-preview .tx-hero .tx-copy{padding:0 8px;max-width:560px}
.tx-preview .tx-hero .tx-copy h1{font-size:clamp(42px,12vw,62px);line-height:.92;font-weight:800;letter-spacing:-.03em;text-transform:uppercase}
.tx-preview .tx-hero .tx-copy h1 span{display:block;white-space:nowrap}
.tx-preview .tx-hero .tx-lede{margin-top:14px;font-size:16px;line-height:1.5;color:var(--muted);max-width:34em}
.tx-preview .tx-hero .tx-cta{margin-top:18px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.tx-preview .tx-hero .tx-btn{display:inline-flex;align-items:center;background:var(--blue);color:#fff;text-decoration:none;font-weight:700;font-size:16px;line-height:1;padding:15px 22px;border-radius:999px;box-shadow:0 12px 26px -12px rgba(23,76,242,.7);transition:transform .2s ease,box-shadow .2s ease}
.tx-preview .tx-hero .tx-btn:hover{transform:translateY(-1px);box-shadow:0 16px 30px -12px rgba(23,76,242,.8)}
.tx-preview .tx-hero .tx-fine{font-size:14px;color:var(--muted)}
.tx-preview .tx-hero :focus-visible{outline:3px solid rgba(23,76,242,.5);outline-offset:3px}

/* ---------- the film ---------- */
.tx-preview .tx-hero .film{position:relative;margin-top:24px;width:100%;aspect-ratio:4/5;border-radius:24px;overflow:hidden;background:#04060d;box-shadow:0 40px 90px -40px rgba(8,14,40,.65),0 0 0 1px rgba(14,21,38,.08);isolation:isolate}
.tx-preview .tx-hero .film canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.tx-preview .tx-hero .stage{position:absolute;left:0;top:0;width:800px;height:1000px;transform-origin:0 0;color:#fff;pointer-events:none}
.tx-preview .tx-hero .film.wide .stage{width:1280px;height:800px}
.tx-preview .tx-hero .a{position:absolute;left:0;top:0;visibility:hidden;will-change:transform,opacity,filter}
.tx-preview .tx-hero #viz{position:absolute;left:0;top:0;overflow:visible}

.tx-preview .tx-hero .mega{font-weight:900;text-transform:uppercase;letter-spacing:-.035em;line-height:.9;text-align:center;color:#fff;text-shadow:0 0 38px rgba(90,140,255,.35)}
.tx-preview .tx-hero .mega .ln{display:block;white-space:nowrap}
.tx-preview .tx-hero .mega.clip .ln{overflow:hidden;padding:.08em .06em;margin:-.08em -.06em}
.tx-preview .tx-hero .ch{display:inline-block;white-space:pre;will-change:transform,opacity}
.tx-preview .tx-hero .fixw .ch{text-align:center;overflow:hidden;vertical-align:top}
.tx-preview .tx-hero .ch.g{background-image:linear-gradient(92deg,#b6d0ff 0%,#6a9aff 45%,#2f63ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.tx-preview .tx-hero .dim .ch:not(.g){color:rgba(212,220,240,.8);text-shadow:none}
.tx-preview .tx-hero .wm{font-weight:900;letter-spacing:.1em;color:#fff;white-space:nowrap;text-shadow:0 0 50px rgba(120,160,255,.5)}
.tx-preview .tx-hero .mo{font-weight:800;letter-spacing:.06em}

.tx-preview .tx-hero .pill{display:inline-flex;align-items:center;gap:12px;font-weight:800;color:#fff;background:rgba(47,99,255,.28);border:2px solid rgba(150,180,255,.65);border-radius:999px;white-space:nowrap;box-shadow:0 0 44px -12px rgba(79,134,255,.9);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.tx-preview .tx-hero .pill::before{content:"";width:12px;height:12px;border-radius:50%;background:#a9c8ff;box-shadow:0 0 12px #4f86ff}

.tx-preview .tx-hero .fw{font-weight:800;color:#fff;white-space:nowrap;display:inline-flex;align-items:center;gap:.4em;text-shadow:0 0 16px rgba(255,196,90,.95),0 0 38px rgba(255,160,50,.55)}
.tx-preview .tx-hero .fw::before{content:"$";display:inline-flex;align-items:center;justify-content:center;width:1.25em;height:1.25em;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff1b8,#ffc93c 55%,#e89b12);color:#4a2a00;font-weight:900;font-size:.72em;text-shadow:none;box-shadow:0 0 18px rgba(255,190,60,.9)}
.tx-preview .tx-hero .tally{width:400px;padding:22px 24px 20px;border-radius:22px;background:rgba(8,14,38,.62);border:1px solid rgba(170,195,255,.22);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.tx-preview .tx-hero .tally h5{font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:rgba(215,225,255,.62);font-weight:800;margin-bottom:10px;white-space:nowrap}
.tx-preview .tx-hero .trow{display:flex;justify-content:space-between;gap:16px;font-size:21px;font-weight:700;color:#e8eeff;padding:3px 10px;margin:0 -10px;border-radius:8px;white-space:nowrap;opacity:0}
.tx-preview .tx-hero .trow b,.tx-preview .tx-hero .ttot b,.tx-preview .tx-hero .svn{font-variant-numeric:tabular-nums}
.tx-preview .tx-hero .trow b{color:#ffd34d;font-weight:800}
.tx-preview .tx-hero .ttot{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid rgba(255,211,77,.45);margin-top:10px;padding-top:12px;white-space:nowrap}
.tx-preview .tx-hero .ttot span{font-size:15px;letter-spacing:.14em;font-weight:800;color:#ffe7a3;text-transform:uppercase}
.tx-preview .tx-hero .ttot b{font-size:46px;font-weight:900;color:#ffd34d;text-shadow:0 0 24px rgba(255,190,60,.6)}
.tx-preview .tx-hero .tally.cmp{width:320px;padding:18px 22px}
.tx-preview .tx-hero .tally.cmp .trow{opacity:1;font-size:21px}
.tx-preview .tx-hero .tally.cmp .ttot b{font-size:46px}
.tx-preview .tx-hero .svn{font-weight:900;letter-spacing:-.03em;line-height:.95;white-space:nowrap;background:linear-gradient(180deg,#fff6cf 0%,#ffd34d 45%,#f0a21c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 30px rgba(255,180,50,.55))}
.tx-preview .tx-hero .svw{font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#fff;white-space:nowrap;text-shadow:0 0 40px rgba(255,200,90,.6)}
.tx-preview .tx-hero .svbar{width:26px;border-radius:13px;background:linear-gradient(180deg,rgba(255,240,200,0),#fff6d8 30%,#ffd34d 50%,#fff6d8 70%,rgba(255,240,200,0));box-shadow:0 0 60px 20px rgba(255,200,80,.55)}
.tx-preview .tx-hero .svc{font-weight:700;color:rgba(215,225,255,.72);white-space:nowrap;text-align:center}
.tx-preview .tx-hero .scard{position:absolute;left:0;top:0;border-radius:14px;border:1.5px dashed rgba(170,195,255,.26);background:rgba(10,16,40,.32);display:flex;flex-direction:column;justify-content:center;gap:5px;overflow:hidden;will-change:transform,opacity}
.tx-preview .tx-hero .scard .nm,.tx-preview .tx-hero .scard .am{opacity:0}
.tx-preview .tx-hero .scard .nm{font-weight:800;color:#e8eeff;line-height:1.08}
.tx-preview .tx-hero .scard .am{font-weight:900;color:#ffd34d;font-variant-numeric:tabular-nums;white-space:nowrap;text-shadow:0 0 18px rgba(255,190,60,.45)}
.tx-preview .tx-hero .scard.on{border:1.5px solid rgba(255,211,77,.6);background:linear-gradient(180deg,rgba(38,62,150,.62),rgba(12,20,52,.72));box-shadow:0 0 34px -10px rgba(255,190,60,.7)}
.tx-preview .tx-hero .scard.on .nm,.tx-preview .tx-hero .scard.on .am{opacity:1}
.tx-preview .tx-hero .chead{position:absolute;left:0;top:0;display:flex;justify-content:space-between;align-items:baseline;white-space:nowrap}
.tx-preview .tx-hero .chead span{font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(215,225,255,.6)}
.tx-preview .tx-hero .chead b{font-weight:900;color:#ffd34d;font-variant-numeric:tabular-nums;text-shadow:0 0 24px rgba(255,190,60,.55)}
.tx-preview .tx-hero .chead b i{font-style:normal;font-weight:800;letter-spacing:.12em;font-size:.45em;color:#ffe7a3;margin-right:.6em;vertical-align:middle}
.tx-preview .tx-hero .fine{white-space:nowrap;font-weight:600;color:rgba(210,220,245,.55);letter-spacing:.01em}
.tx-preview .tx-hero .cta{white-space:nowrap;pointer-events:auto;display:inline-flex;align-items:center;justify-content:center;background:#2f63ff;color:#fff;text-decoration:none;font-weight:800;padding:22px 38px;border-radius:999px;box-shadow:0 18px 44px -12px rgba(47,99,255,.85),inset 0 1px 0 rgba(255,255,255,.25)}
.tx-preview .tx-hero .url{white-space:nowrap;font-weight:700;color:rgba(215,225,255,.7);letter-spacing:.02em}

.tx-preview .tx-hero .f-ctrl{position:absolute;right:14px;bottom:14px;z-index:3;display:flex;gap:8px}
.tx-preview .tx-hero .f-btn{font:inherit;font-size:13px;font-weight:700;height:36px;min-width:36px;padding:0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(20,25,42,.7);color:#e8eeff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;backdrop-filter:blur(8px)}
.tx-preview .tx-hero .f-replay{opacity:0;visibility:hidden;transition:opacity .4s ease}
.tx-preview .tx-hero .f-replay.on{opacity:1;visibility:visible}
.tx-preview .tx-hero .f-pause{padding:0}
.tx-preview .tx-hero .f-pause::before{content:"";width:10px;height:12px;border-left:3.5px solid #e8eeff;border-right:3.5px solid #e8eeff}
.tx-preview .tx-hero .f-pause[aria-pressed="true"]::before{width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #e8eeff;margin-left:2px}

@media (min-width:900px){
  .tx-preview .tx-hero{display:flex;align-items:center;min-height:max(700px,100svh);padding:40px clamp(24px,4vw,64px)}
  .tx-preview .tx-hero .tx-copy{flex:0 0 min(440px,32vw);padding:0}
  .tx-preview .tx-hero .tx-copy h1{font-size:clamp(50px,4.8vw,84px)}
  .tx-preview .tx-hero .tx-lede{font-size:clamp(17px,1.2vw,19px);margin-top:22px}
  .tx-preview .tx-hero .tx-cta{margin-top:28px}
  .tx-preview .tx-hero .film{flex:1;margin:0 0 0 clamp(24px,3vw,56px);aspect-ratio:16/10;max-height:82vh}
}
.tx-preview .tx-hero .film.no-gl{background:radial-gradient(120% 90% at 30% 70%,#123a9c 0%,#06091a 60%)}
