:root{--bg:#fff;--bg2:#F3F6FB;--surface:#fff;--line:#E3E8F0;--line2:#CBD5E4;--text:#0B1F44;--muted:#51607A;--dim:#6B7893;--gold:#E4002B;--gold-d:#B80022;--ink:#fff;--navy:#0B1F44;--navy2:#13306A;--serif:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;--sans:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;--shadow:0 10px 30px rgba(11,31,68,.08);color-scheme:light}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
:focus-visible{outline:3px solid #2F6BFF;outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--serif);font-weight:800;margin:0;text-wrap:balance;letter-spacing:-.02em}
em{font-style:normal;color:var(--gold)}
p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding-inline:max(20px,env(safe-area-inset-left,0px)) max(20px,env(safe-area-inset-right,0px))}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:10px 16px;border-radius:8px;z-index:50}
.skip:focus{left:12px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.eyebrow:before{content:"";width:26px;height:3px;border-radius:3px;background:var(--gold)}
.center .eyebrow{justify-content:center}
.announce{background:#FFF4CC;color:#6B4F00;text-align:center;font-size:13px;padding:9px 16px}
mark.ph{background:#FFE58F;color:#5A4300;padding:0 4px;border-radius:4px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;border-radius:14px;font:800 14px var(--sans);letter-spacing:.02em;cursor:pointer;border:2px solid transparent;transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:var(--gold);color:#fff;box-shadow:0 8px 22px rgba(228,0,43,.28)}
.btn-gold:hover{background:var(--gold-d)}
.btn-line{border-color:var(--navy);color:var(--navy);background:transparent}
.btn-line:hover{background:var(--navy);color:#fff}
.btn-sm{min-height:44px;padding:0 20px;font-size:13px;border-radius:12px}
.link-arrow{font-weight:700;font-size:15px;display:inline-flex;gap:8px;align-items:center}

/* header */
.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.bar{display:flex;align-items:center;gap:20px;padding-block:14px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:22px;margin-right:auto}
#nav{display:flex;gap:6px 30px;font-size:14px;font-weight:700;color:var(--muted)}
#nav a:hover{color:var(--gold)}
#nav a[aria-current="page"]{color:var(--gold)}
.menu-btn{display:none;min-height:44px;padding:0 18px;border-radius:12px;border:2px solid var(--navy);background:transparent;color:var(--navy);font:800 13px var(--sans);cursor:pointer}
@media(max-width:900px){
  .js #nav{display:none;order:5;flex-basis:100%;flex-direction:column;gap:4px;padding:8px 0 4px}
  .js #nav.open{display:flex}
  .js #nav a{padding:12px 0;border-top:1px solid var(--line);font-size:15px}
  .js .menu-btn{display:inline-flex;align-items:center}
  .bar{flex-wrap:wrap}
}
@media(max-width:560px){.bar .btn-sm{display:none}}

/* hero */
.hero{position:relative;padding:72px 0 88px;background:radial-gradient(60% 70% at 85% 10%,rgba(228,0,43,.10),transparent 70%),linear-gradient(180deg,#F3F6FB,#fff 85%);overflow:hidden}
.hero .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:56px}
.hero-text{flex:1 1 460px;min-width:0}
.hero h1{font-size:clamp(40px,6vw,68px);line-height:1.04;margin:20px 0 22px}
.hero .lead{max-width:540px;font-size:19px;color:var(--muted);margin-bottom:34px}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 16px}
.chips{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:38px;padding-top:22px;border-top:1px solid var(--line2);font-size:14px;font-weight:600;color:var(--muted)}
.chips span{display:inline-flex;align-items:center;gap:9px}
.chips span:before{content:"";width:18px;height:18px;border-radius:50%;background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.5l2.6 2.6L13 6.8' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}

/* tv mock */
.tv-wrap{flex:1 1 440px;min-width:0}
.tv{position:relative;max-width:600px;margin-inline:auto}
.tv-frame{padding:12px;border-radius:24px;background:linear-gradient(160deg,#1c2a4a,#0B1F44);box-shadow:0 40px 80px rgba(11,31,68,.35)}
.tv-screen{display:grid;grid-template-columns:31% 1fr;aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#07122b}
.tv-list{padding:12px 9px;display:flex;flex-direction:column;gap:5px;border-right:1px solid rgba(255,255,255,.1);font-size:11px;color:#9fb0cc}
.tv-list span{padding:7px 9px;border-radius:8px;white-space:nowrap}
.tv-list span.on{background:var(--gold);color:#fff;font-weight:800}
.tv-main{display:flex;flex-direction:column;gap:10px;padding:12px;min-width:0}
.tv-hero{flex:1;border-radius:10px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:14px;position:relative;overflow:hidden}
.tv-hero small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#e6eefc}
.tv-hero b{font:800 20px var(--sans);color:#fff}
.tv-bar{height:4px;border-radius:4px;background:rgba(255,255,255,.25);overflow:hidden;margin-top:6px}
.tv-bar i{display:block;width:62%;height:100%;background:var(--gold)}
.tv-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tv-tiles i{display:block;height:48px;border-radius:8px;background:#1B2B4F;position:relative;overflow:hidden}
.tv-stand{width:34%;height:10px;margin:0 auto;background:#0B1F44;border-radius:0 0 10px 10px}
.pill{position:absolute;display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border-radius:999px;background:#fff;color:var(--navy);font-size:12px;font-weight:800;letter-spacing:.06em;box-shadow:0 12px 30px rgba(11,31,68,.2);z-index:2}
.pill i{width:8px;height:8px;border-radius:50%;background:var(--gold)}
.pill.a{left:-8px;top:-14px}
.pill.e{right:-6px;bottom:30px}
.pill.e i{background:#12A150}
.tv-hero,.tv-tiles i{position:relative;overflow:hidden}
.tv-art{position:absolute;inset:0;width:100%;height:100%}
.tv-hero small,.tv-hero b,.tv-hero .tv-bar{position:relative;z-index:1}
.tv-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(0,0,0,.8))}

/* sections */
.sec{padding:96px 0}
.sec.alt{background:var(--bg2)}
.sec-head{max-width:720px;margin:0 auto 52px;text-align:center}
.sec-head h2{font-size:clamp(30px,4.4vw,48px);line-height:1.1;margin:14px 0}
.sec-head p{color:var(--muted);font-size:18px}
.strip{background:#fff;border-block:1px solid var(--line)}
.strip .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.strip .item{padding:28px 24px;border-right:1px solid var(--line)}
.strip .item:last-child{border-right:0}
.strip h3{font:800 17px var(--sans);margin-bottom:6px;color:var(--navy)}
.strip p{font-size:14px;color:var(--muted)}
@media(max-width:700px){.strip .item{border-right:0;border-bottom:1px solid var(--line)}.sec{padding:64px 0}.hero{padding:48px 0 56px}}

/* poster wall */
.wall-sec{padding:80px 0 64px;background:var(--navy);color:#fff}
.wall-head{text-align:center;max-width:780px;margin:0 auto 40px}
.wall-head .eyebrow{color:#FF8A9C}
.wall-head .eyebrow:before{background:#FF8A9C}
.wall-head h2{font-size:clamp(28px,4vw,44px);line-height:1.1;margin:12px 0}
.wall-head h2 em{color:#FF8A9C}
.wall-head p{color:#B9C6E0;font-size:14px}
.wall{overflow:hidden;margin-bottom:14px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.row{display:flex;gap:14px;width:max-content;animation:mq 70s linear infinite}
.row.rev{animation-direction:reverse;animation-duration:85s}
@keyframes mq{to{transform:translateX(-50%)}}
.poster{position:relative;flex:none;width:156px;aspect-ratio:2/3;border-radius:14px;overflow:hidden;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.poster .art{position:absolute;inset:0;width:100%;height:100%}
.poster span{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 11px;background:linear-gradient(transparent,rgba(0,0,0,.85));font:800 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#fff}
@media(prefers-reduced-motion:reduce){.row{animation:none}}
@media(max-width:700px){.poster{width:120px}}

/* categories */
.cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.cat{position:relative;min-height:250px;padding:26px;border-radius:22px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;color:#fff;box-shadow:var(--shadow)}
.cat .cat-art{position:absolute;inset:0;width:100%;height:100%;z-index:0;transition:transform .6s}
.cat:hover .cat-art{transform:scale(1.06)}
.cat:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,18,43,0) 30%,rgba(7,18,43,.92))}
.cat h3,.cat p{position:relative;z-index:1}
.cat h3{font:800 24px var(--sans);margin-bottom:6px}
.cat p{font-size:14px;color:#D8E1F2}

/* pricing */
#plans{background:var(--navy);color:#fff}
#plans .sec-head h2{color:#fff}
#plans .sec-head p{color:#B9C6E0}
#plans .eyebrow{color:#FF8A9C}
#plans .eyebrow:before{background:#FF8A9C}
#plans em{color:#FF8A9C}
.tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:34px}
.tier{min-height:46px;padding:0 22px;border-radius:12px;border:2px solid var(--line2);background:#fff;color:var(--navy);font:800 14px var(--sans);cursor:pointer}
.tier[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#fff}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.plan{position:relative;display:flex;flex-direction:column;gap:20px;padding:32px 26px;border-radius:22px;background:#fff;color:var(--text);border:2px solid var(--line);box-shadow:var(--shadow)}
.plan.best{border-color:var(--gold);box-shadow:0 18px 44px rgba(228,0,43,.22)}
.plan-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:26px}
.plan-name{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.badge{padding:4px 12px;border-radius:999px;background:var(--gold);color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;white-space:nowrap}
.price{display:flex;flex-direction:column;gap:4px}
.price b{font:800 48px/1 var(--sans);letter-spacing:-.03em;color:var(--navy)}
.price small{font-size:14px;color:var(--dim)}
.save{display:inline-block;margin-top:2px;font-size:12px;font-weight:800;color:#0A8F4E}
.plan ul{margin:0;padding:20px 0 0;list-style:none;display:flex;flex-direction:column;gap:12px;flex:1;border-top:1px solid var(--line);font-size:14.5px;color:var(--text)}
.plan li{display:flex;gap:12px}
.plan li:before,.inc span:before,.list li:before{content:"";flex:none;width:13px;height:7px;margin-top:8px;border-left:3px solid #0A8F4E;border-bottom:3px solid #0A8F4E;transform:rotate(-45deg) scale(.85)}
.fine{margin-top:26px;text-align:center;font-size:13px;color:var(--dim)}
#plans .fine{color:#B9C6E0}
#plans .fine a{color:#fff!important}
.inc{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px 28px;margin-top:40px;padding:28px;border:1px solid var(--line);border-radius:22px;background:#fff;color:var(--text);box-shadow:var(--shadow)}
.inc h3{grid-column:1/-1;font:800 20px var(--sans)}
.inc span{display:flex;gap:12px;font-size:14.5px;color:var(--text)}

/* steps, devices, why */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.step{padding:30px 26px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.step .n{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;background:var(--gold);color:#fff;font:800 18px var(--sans)}
.step h3{font:800 22px var(--sans);margin:18px 0 8px}
.step p{color:var(--muted)}
.devs{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.devs div{display:flex;align-items:center;gap:14px;padding:20px 20px;border:1px solid var(--line);border-radius:16px;background:#fff;font-weight:700;font-size:15px}
.devs svg{flex:none}
.devs svg *{stroke:var(--gold)}
.app-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.app-tile{display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--text);font-size:13px;font-weight:800;text-align:center;transition:border-color .2s,transform .2s;box-shadow:var(--shadow)}
.app-tile:hover{border-color:var(--gold);transform:translateY(-3px)}
.app-logo{display:flex;align-items:center;justify-content:center;width:100%;height:84px;border-radius:10px;background:#000}
.app-logo.app-noimg{background:var(--bg2)}
.app-logo img{max-width:82%;max-height:70px;object-fit:contain}
.why{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.card{padding:30px 26px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.card .mark{width:42px;height:5px;border-radius:5px;background:var(--gold);margin-bottom:18px}
.card h3{font:800 20px var(--sans);margin-bottom:8px}
.card p{color:var(--muted);font-size:15px}
.table-box{overflow-x:auto;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:var(--shadow)}
.cmp{width:100%;min-width:620px;border-collapse:collapse;font-size:15px}
.cmp th,.cmp td{padding:18px 22px;text-align:left;border-bottom:1px solid var(--line)}
.cmp tr:last-child td{border-bottom:0}
.cmp thead th{font:800 17px var(--sans);color:var(--muted)}
.cmp thead th.us{color:#fff;background:var(--gold)}
.cmp td:first-child{color:var(--dim);font-weight:800;width:20%}
.cmp td.us{color:var(--text);font-weight:700;background:#FFF1F3}
.cmp td.them{color:var(--muted)}
.split{display:flex;flex-wrap:wrap;gap:56px;align-items:center}
.split>*{flex:1 1 380px;min-width:0}
.split h2{font-size:clamp(28px,3.8vw,42px);line-height:1.1;margin:14px 0}
.split p{color:var(--muted);font-size:17px}
.prov{display:flex;flex-wrap:wrap;gap:10px}
.prov span{padding:9px 16px;border:1px solid var(--line2);border-radius:999px;font-size:13px;font-weight:700;color:var(--navy);background:#fff}
.list{margin:22px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px}
.list li{display:flex;gap:14px;color:var(--text)}
.list li:before{margin-top:9px}

/* faq */
.faq{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq details{border:1px solid var(--line);border-radius:16px;background:#fff;padding:0 24px;box-shadow:var(--shadow)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:68px;font:800 17px var(--sans)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";color:var(--gold);font:600 28px var(--sans)}
.faq details[open] summary:after{content:"\2212"}
.faq details p{margin:0 0 22px;max-width:720px;color:var(--muted)}
.faq-group{max-width:860px;margin:0 auto 52px}
.faq-group>h2{font:800 26px var(--sans);margin-bottom:18px;color:var(--navy)}

/* inner pages */
.page-hero{padding:68px 0 52px;background:radial-gradient(50% 90% at 90% 0,rgba(228,0,43,.09),transparent 70%),linear-gradient(180deg,#F3F6FB,#fff);border-bottom:1px solid var(--line)}
.page-hero h1{font-size:clamp(34px,5vw,54px);line-height:1.06;margin:16px 0 14px}
.page-hero p{max-width:640px;color:var(--muted);font-size:18px}
.guides{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px}
.guide{padding:30px 26px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.guide h3{font:800 21px var(--sans);margin-bottom:14px}
.guide ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:10px;color:var(--text);font-size:15px}
.guide li::marker{color:var(--gold);font-weight:800}
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.contact .card p{margin-bottom:16px;word-break:break-word}
.prose{max-width:780px;margin:0 auto;padding:56px 0 88px}
.prose .meta{color:var(--dim);font-size:14px;margin-bottom:30px}
.prose h2{font:800 24px var(--sans);margin:40px 0 12px;color:var(--navy)}
.prose p,.prose li{color:var(--muted);font-size:16px}
.prose p{margin-bottom:14px}
.prose ul{margin:0 0 14px;padding-left:22px;display:flex;flex-direction:column;gap:8px}
.prose a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;font-weight:600}
.note-box,.callout{background:#FFF8E1;border:1px solid #F5DE95;color:#5A4300;padding:14px 18px;border-radius:12px;margin-bottom:24px;font-size:14px}

/* cta band */
.cta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;padding:48px;border-radius:28px;background:linear-gradient(135deg,#E4002B,#8F001B);color:#fff;box-shadow:0 24px 60px rgba(228,0,43,.25)}
.cta-band .eyebrow{color:#FFD3DA}
.cta-band .eyebrow:before{background:#FFD3DA}
.cta-band h2{font-size:clamp(26px,3.6vw,38px);line-height:1.12;margin:10px 0}
.cta-band h2 em{color:#fff;text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:6px;text-decoration-color:rgba(255,255,255,.5)}
.cta-band p{color:#FFE3E7}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px}
.cta-band .btn-gold{background:#fff;color:var(--gold);box-shadow:none}
.cta-band .btn-line{border-color:#fff;color:#fff}
.cta-band .btn-line:hover{background:#fff;color:var(--gold)}

/* footer */
footer{background:var(--navy);color:#C5D1E8;margin-top:0}
.foot{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px;padding:64px 0 36px}
.foot .brand{font:800 22px var(--sans);color:#fff;margin-bottom:12px}
.foot h4{font:800 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#fff;margin:0 0 14px}
.foot a,.foot span{display:block;margin-bottom:9px;font-size:14.5px;color:#C5D1E8;word-break:break-word}
.foot a:hover{color:#fff}
.foot p{font-size:14.5px;color:#C5D1E8}
.legal-line{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px;border-top:1px solid rgba(255,255,255,.14);padding:22px 0 30px;font-size:13px;color:#9FB0CC}
.legal-line a{color:#fff}
@media(max-width:900px){.foot{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot{grid-template-columns:1fr}.cta-band{padding:32px 24px}}

.wa-float{position:fixed;right:18px;bottom:18px;z-index:40;background:#25D366;color:#06210f;font:800 14px var(--sans);padding:13px 20px;border-radius:999px;box-shadow:0 8px 28px rgba(0,0,0,.3)}
.wa-float:hover{filter:brightness(1.06)}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.titles-sec{padding:72px 0 64px;background:var(--bg2)}
.titles{display:flex;gap:16px;overflow-x:auto;padding:6px max(20px,calc((100vw - 1160px)/2)) 22px;scroll-snap-type:x proximity}
.title{flex:none;width:176px;margin:0;scroll-snap-align:start}
.title img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:14px;box-shadow:0 12px 30px rgba(11,31,68,.25)}
.title figcaption{margin-top:10px;font-size:13px;font-weight:700;color:var(--navy);text-align:center}

.chan-head{margin-top:52px;margin-bottom:26px}
.chan-head h3{font-size:clamp(22px,3vw,32px);line-height:1.15;margin:10px 0}
.chan-head h3 em{color:#FF8A9C}
.chan-row{animation-duration:60s}
.chan{position:relative;flex:none;width:210px;height:104px;border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;box-shadow:0 10px 26px rgba(0,0,0,.35);overflow:hidden}
.chan:before{content:"";position:absolute;right:-18px;top:-18px;width:84px;height:84px;border-radius:50%;background:rgba(255,255,255,.14)}
.chan .live{position:absolute;left:14px;top:12px;display:inline-flex;align-items:center;gap:6px;font:800 10px var(--sans);letter-spacing:.1em;background:rgba(0,0,0,.35);padding:3px 8px;border-radius:999px}
.chan .live i{width:6px;height:6px;border-radius:50%;background:#ff4d4d}
.chan b{font:800 18px var(--sans);position:relative}
.chan small{font:700 11px var(--sans);letter-spacing:.1em;opacity:.8;position:relative}
@media(max-width:700px){.chan{width:168px;height:92px}}

/* bento */
.bento-sec{background:radial-gradient(60% 60% at 15% 0,rgba(228,0,43,.28),transparent 65%),radial-gradient(50% 60% at 100% 100%,rgba(47,107,255,.25),transparent 65%),#07122B;color:#fff}
.bento-sec .sec-head h2{color:#fff;font-size:clamp(34px,5.4vw,64px);line-height:1.04}
.bento-sec .sec-head h2 em{color:#FF5C77;text-shadow:0 0 36px rgba(255,92,119,.55)}
.bento-sec .sec-head p{color:#B9C6E0}
.bento-sec .eyebrow{color:#FF8A9C}.bento-sec .eyebrow:before{background:#FF8A9C}
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:230px;gap:16px}
.b{position:relative;border-radius:26px;overflow:hidden;isolation:isolate;color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 24px 60px rgba(0,0,0,.4);transition:transform .35s,box-shadow .35s}
.b:hover{transform:translateY(-6px);box-shadow:0 0 0 2px #FF5C77,0 30px 70px rgba(228,0,43,.35)}
.b-art{position:absolute;inset:0;width:100%;height:100%;z-index:-2;transition:transform .8s}
.b:hover .b-art{transform:scale(1.08)}
.b:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(4,10,28,0) 35%,rgba(4,10,28,.92))}
.b-txt{position:absolute;left:24px;right:24px;bottom:20px}
.b-txt h3{font:800 clamp(24px,2.6vw,34px)/1 var(--sans);letter-spacing:-.02em}
.b-txt p{margin-top:6px;font-size:14px;color:#D8E1F2}
.b-sport{grid-column:span 2;grid-row:span 2}
.b-movies{grid-row:span 2}
.b-kids{grid-column:span 2}
.b-intl{grid-column:span 2}
.b-sport .b-txt h3{font-size:clamp(32px,4vw,52px)}
.b-live{position:absolute;left:22px;top:20px;display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:#E4002B;font:800 12px var(--sans);letter-spacing:.14em;box-shadow:0 0 30px rgba(228,0,43,.7)}
.b-live i{width:8px;height:8px;border-radius:50%;background:#fff;animation:pulse 1.2s infinite}
@keyframes pulse{50%{opacity:.25;transform:scale(.7)}}
.score{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:14px;padding:14px 26px;border-radius:20px;background:rgba(4,10,28,.72);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);font-family:var(--sans)}
.score span{font:800 12px var(--sans);letter-spacing:.14em;opacity:.8}
.score b{font:800 clamp(40px,5vw,64px)/1 var(--sans)}
.score u{text-decoration:none;font:800 36px var(--sans);opacity:.6}
.score em{font:800 13px var(--sans);font-style:normal;color:#FF8A9C;margin-left:6px}
.strip-l,.strip-r{position:absolute;top:0;bottom:0;width:26px;z-index:0;background:repeating-linear-gradient(180deg,transparent 0 14px,rgba(255,255,255,.85) 14px 30px,transparent 30px 44px);background-size:10px 44px;background-repeat:repeat-y;background-position:center;background-color:rgba(0,0,0,.55)}
.strip-l{left:0}.strip-r{right:0}
.eps{position:absolute;left:22px;right:22px;top:18px;display:flex;flex-direction:column;gap:8px}
.eps div{display:flex;align-items:center;gap:10px;font:800 11px var(--sans);letter-spacing:.08em}
.eps span{width:44px}
.eps i{flex:1;height:6px;border-radius:6px;background:rgba(255,255,255,.2);overflow:hidden}
.eps u{display:block;height:100%;background:#22D3EE;box-shadow:0 0 12px #22D3EE}
.ticker{position:absolute;left:0;right:0;top:22px;overflow:hidden;background:#E4002B;padding:8px 0}
.ticker div{display:flex;gap:34px;width:max-content;animation:mq 30s linear infinite;font:800 12px var(--sans);letter-spacing:.16em}
.ticker span:after{content:"\25CF";margin-left:34px;opacity:.6}
.ball{position:absolute;z-index:0;border-radius:50%;animation:bob 3s ease-in-out infinite}
.b1{width:46px;height:46px;background:#EF4444;left:16%;top:22%}
.b2{width:30px;height:30px;background:#FACC15;left:48%;top:14%;animation-delay:.6s}
.b3{width:38px;height:38px;background:#22C55E;left:74%;top:26%;animation-delay:1.2s}
@keyframes bob{50%{transform:translateY(-16px)}}
.hello{position:absolute;inset:18px 18px auto 18px;display:flex;flex-wrap:wrap;gap:8px}
.hello span{padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.3);font:700 14px var(--sans);animation:bob 3.4s ease-in-out infinite;animation-delay:var(--d)}
@media(max-width:1000px){.bento{grid-template-columns:repeat(2,1fr)}.b-sport{grid-column:span 2}.b-kids,.b-intl{grid-column:span 2}.b-movies{grid-row:span 1}}
@media(max-width:560px){.bento{grid-template-columns:1fr;grid-auto-rows:210px}.b-sport,.b-kids,.b-intl{grid-column:auto}.b-sport{grid-row:span 2}.score{top:40%;padding:10px 16px}}
@media(prefers-reduced-motion:reduce){.ticker div,.ball,.hello span,.b-live i{animation:none}}

.inc.pay span.payi:before{display:none}
.inc.pay .payi{align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--bg2);font-weight:700}
.inc.pay .payi svg{flex:none}

.pay-box{margin-top:40px;padding:26px 28px;border-radius:22px;background:#fff;color:var(--text);box-shadow:var(--shadow);border:1px solid var(--line)}
.pay-box h3{font:800 18px var(--sans);margin-bottom:16px;text-align:center}
.paylogos{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.payi{display:inline-flex;align-items:center;justify-content:center;height:68px;min-width:92px;padding:0 16px;border:1px solid var(--line);border-radius:12px;background:#fff;font-weight:700;font-size:14px}
.payi img{display:block;height:44px;width:auto;max-width:96px;object-fit:contain}
.payi.logo{padding:0 14px}

/* how it works */
.how{position:relative;overflow:hidden}
.deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(2px);animation:float 9s ease-in-out infinite}
.d1{width:220px;height:220px;left:-60px;top:40px;background:radial-gradient(circle,rgba(228,0,43,.16),transparent 70%)}
.d2{width:300px;height:300px;right:-80px;bottom:20px;background:radial-gradient(circle,rgba(47,107,255,.16),transparent 70%);animation-delay:2s}
.d3{width:14px;height:14px;left:12%;bottom:18%;background:var(--gold);opacity:.5;animation-delay:1s}
@keyframes float{50%{transform:translateY(-22px)}}
.flow{position:relative;display:grid;grid-template-columns:repeat(var(--n,4),1fr);gap:22px;margin-top:8px}
.flow:before{content:"";position:absolute;left:calc(100%/var(--n)/2);right:calc(100%/var(--n)/2);top:42px;height:4px;border-radius:4px;background:repeating-linear-gradient(90deg,var(--line2) 0 10px,transparent 10px 20px)}
.flow:after{content:"";position:absolute;left:calc(100%/var(--n)/2);top:42px;height:4px;border-radius:4px;width:0;background:var(--gold);box-shadow:0 0 14px rgba(228,0,43,.6);transition:width 2.2s cubic-bezier(.2,.7,.2,1) .3s}
.flow.in:after{width:calc(100% - 100%/var(--n))}
.fstep{position:relative;z-index:1;padding:0 8px 8px;text-align:center;transition:transform .25s,box-shadow .25s}
.ficon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:88px;height:88px;border-radius:26px;background:linear-gradient(135deg,#E4002B,#a8001f);box-shadow:0 14px 30px rgba(228,0,43,.35);margin-bottom:22px;transition:transform .3s}
.ficon:before{content:"";position:absolute;inset:-8px;border-radius:32px;border:2px solid rgba(228,0,43,.25);animation:ring 2.6s ease-out infinite}
@keyframes ring{0%{transform:scale(.92);opacity:.9}100%{transform:scale(1.25);opacity:0}}
.fstep:nth-child(2) .ficon:before{animation-delay:.5s}.fstep:nth-child(3) .ficon:before{animation-delay:1s}.fstep:nth-child(4) .ficon:before{animation-delay:1.5s}
.fn{position:absolute;right:-10px;top:-10px;width:32px;height:32px;border-radius:50%;background:var(--navy);color:#fff;font:800 12px var(--sans);display:flex;align-items:center;justify-content:center;border:3px solid #fff}
.fstep:hover .ficon{transform:translateY(-6px) rotate(-6deg) scale(1.06)}
.fstep h3{font:800 20px var(--sans);margin-bottom:8px}
.fstep p{color:var(--muted);font-size:15px;max-width:260px;margin:0 auto}
.fstep:active .ficon{transform:scale(.92)}
@media(max-width:900px){.flow{grid-template-columns:1fr 1fr;row-gap:36px}.flow:before,.flow:after{display:none}}
@media(max-width:560px){.flow{grid-template-columns:1fr}}
/* general motion */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rd,0s)}
.js .reveal.in{opacity:1;transform:none}
.tilt{transform-style:preserve-3d;will-change:transform}
.sec.alt{background-image:radial-gradient(rgba(11,31,68,.07) 1.2px,transparent 1.4px);background-size:22px 22px;background-color:var(--bg2)}
.btn-gold{position:relative;overflow:hidden}
.btn-gold:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:sheen 4.5s ease-in-out infinite}
@keyframes sheen{0%,60%{left:-60%}100%{left:140%}}
.btn:active{transform:scale(.96)}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.5);transform:scale(0);animation:rip .6s linear;pointer-events:none}
@keyframes rip{to{transform:scale(4);opacity:0}}
.hero .tv{animation:float 7s ease-in-out infinite}
.plan,.card,.app-tile,.step{transition:transform .25s,box-shadow .25s,border-color .25s}
.plan:hover,.card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(11,31,68,.16)}
@media(prefers-reduced-motion:reduce){.deco,.ficon:before,.hero .tv,.btn-gold:after{animation:none}.js .reveal{opacity:1;transform:none}.flow:after{transition:none}}
.why .card:nth-child(6n+1) .mark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 5-3 8-7 10-4-2-7-5-7-10V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.strip .item:nth-child(6n+1):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 5-3 8-7 10-4-2-7-5-7-10V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.why .card:nth-child(6n+2) .mark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E")}
.strip .item:nth-child(6n+2):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E")}
.why .card:nth-child(6n+3) .mark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 01-12 7l-5 1 1-4a8 8 0 1116-4z'/%3E%3C/svg%3E")}
.strip .item:nth-child(6n+3):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 01-12 7l-5 1 1-4a8 8 0 1116-4z'/%3E%3C/svg%3E")}
.why .card:nth-child(6n+4) .mark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='12' rx='2'/%3E%3Cpath d='M8 21h8M12 17v4'/%3E%3C/svg%3E")}
.strip .item:nth-child(6n+4):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='12' rx='2'/%3E%3Cpath d='M8 21h8M12 17v4'/%3E%3C/svg%3E")}
.why .card:nth-child(6n+5) .mark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 018 0v3'/%3E%3C/svg%3E")}
.strip .item:nth-child(6n+5):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 018 0v3'/%3E%3C/svg%3E")}
.why .card:nth-child(6n+6) .mark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.6 5.6 6.1.7-4.5 4.2 1.2 6L12 16.5 6.6 19.5l1.2-6L3.3 9.3l6.1-.7z'/%3E%3C/svg%3E")}
.strip .item:nth-child(6n+6):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.6 5.6 6.1.7-4.5 4.2 1.2 6L12 16.5 6.6 19.5l1.2-6L3.3 9.3l6.1-.7z'/%3E%3C/svg%3E")}

.why .card .mark{width:52px;height:52px;border-radius:16px;background-color:var(--gold);background-size:26px;background-repeat:no-repeat;background-position:center;box-shadow:0 10px 22px rgba(228,0,43,.28);margin-bottom:18px;transition:transform .35s}
.why .card:hover .mark{transform:rotate(-8deg) scale(1.1)}
.strip .item{position:relative;transition:background .3s}
.strip .item:hover{background:#FFF5F6}
.strip .item:before{content:"";display:block;width:44px;height:44px;border-radius:14px;background-color:var(--gold);background-size:22px;background-repeat:no-repeat;background-position:center;margin-bottom:12px;box-shadow:0 8px 18px rgba(228,0,43,.25);transition:transform .35s}
.strip .item:hover:before{transform:translateY(-4px) rotate(-8deg)}

/* scroll progress + header */
.progress{position:fixed;left:0;top:0;height:4px;width:0;background:linear-gradient(90deg,#E4002B,#FF8A9C);z-index:60;transition:width .1s}
.site-header{transition:box-shadow .3s,background .3s}
.site-header.scrolled{box-shadow:0 10px 30px rgba(11,31,68,.12)}

/* hero extras */
.pill.c{left:-26px;bottom:70px;animation:float 6s ease-in-out infinite .8s}
.pill.d{right:20px;top:-22px;animation:float 7s ease-in-out infinite 1.6s}
.pill.a,.pill.e{animation:float 6.5s ease-in-out infinite}
.pill.c i{background:#2F6BFF}.pill.d i{background:#F59E0B}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.hero:before{width:380px;height:380px;right:-120px;top:-120px;background:radial-gradient(circle,rgba(228,0,43,.18),transparent 70%);animation:float 10s ease-in-out infinite}
.hero:after{width:260px;height:260px;left:-80px;bottom:-60px;background:radial-gradient(circle,rgba(47,107,255,.14),transparent 70%);animation:float 12s ease-in-out infinite 2s}
.hero .wrap{position:relative;z-index:1}

/* spotlight on dark sections */
.bento-sec,.wall-sec,#plans{position:relative;overflow:hidden}
.bento-sec:before,.wall-sec:before,#plans:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle 340px at var(--mx,50%) var(--my,30%),rgba(255,255,255,.09),transparent 70%);transition:background .1s}
.bento-sec .wrap,.wall-sec>*,#plans .wrap{position:relative}

/* sections: decorations */
.sec{position:relative;overflow:hidden}
.sec.alt:before{content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(228,0,43,.10),transparent 70%);animation:float 11s ease-in-out infinite;pointer-events:none}
.sec.alt:after{content:"";position:absolute;left:-70px;bottom:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(47,107,255,.10),transparent 70%);animation:float 13s ease-in-out infinite 1s;pointer-events:none}
.sec>.wrap{position:relative;z-index:1}
.sec-head h2{background:none}
.sec-head .eyebrow{animation:none}

/* devices */
.devs div{transition:transform .25s,box-shadow .25s,border-color .25s}
.devs div:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 14px 30px rgba(228,0,43,.14)}
.devs div:hover svg{animation:bounce .6s}
@keyframes bounce{40%{transform:translateY(-6px) scale(1.15)}}

/* plans */
.plan.best{position:relative}
.plan.best:before{content:"";position:absolute;inset:-3px;border-radius:25px;background:linear-gradient(120deg,#E4002B,#FF8A9C,#2F6BFF,#E4002B);background-size:300% 300%;animation:borderflow 5s linear infinite;z-index:-1}
.plan.best{background:#fff}
@keyframes borderflow{to{background-position:300% 0}}
.badge{position:relative;overflow:hidden}
.badge:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-20deg);animation:sheen 3.5s ease-in-out infinite}
.tier{transition:transform .2s,background .2s,color .2s}
.tier:hover{transform:translateY(-2px)}
.tier:active{transform:scale(.94)}

/* comparison */
.cmp tbody tr{transition:background .2s}
.cmp tbody tr:hover td{background:#F6F8FC}
.cmp tbody tr:hover td.us{background:#FFE4E8}
.cmp thead th.us{position:relative;overflow:hidden}
.cmp thead th.us:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:sheen 5s ease-in-out infinite}

/* Canada */
.prov span{transition:transform .25s,background .25s,color .25s,border-color .25s;cursor:default}
.prov span:hover{transform:translateY(-4px) scale(1.06);background:var(--gold);color:#fff;border-color:var(--gold)}
.split{position:relative}
.split:before{content:"";position:absolute;right:-30px;top:-40px;width:260px;height:260px;opacity:.08;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 3L58 21L68 16L65 44L80 33L78 40L96 43L90 49L94 62L72 58L74 64L52 62L52 96L48 96L48 62L26 64L28 58L6 62L10 49L4 43L22 40L20 33L35 44L32 16L42 21Z' fill='%23E4002B'/%3E%3C/svg%3E") center/contain no-repeat;animation:float 9s ease-in-out infinite;pointer-events:none}

/* FAQ */
.faq details{transition:border-color .2s,box-shadow .2s,transform .2s}
.faq details:hover{border-color:var(--gold);transform:translateX(4px)}
.faq details[open]{border-color:var(--gold);box-shadow:0 14px 36px rgba(228,0,43,.12)}
.faq details[open] p{animation:fadein .4s ease}
@keyframes fadein{from{opacity:0;transform:translateY(-6px)}}
.faq summary:after{transition:transform .3s}
.faq details[open] summary:after{transform:rotate(180deg)}

/* CTA band */
.cta-band{position:relative;overflow:hidden;background:linear-gradient(120deg,#E4002B,#8F001B,#13306A,#E4002B);background-size:300% 300%;animation:borderflow 12s ease infinite}
.cta-band:before,.cta-band:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.12);pointer-events:none;animation:float 8s ease-in-out infinite}
.cta-band:before{width:220px;height:220px;right:-60px;top:-80px}
.cta-band:after{width:140px;height:140px;left:30%;bottom:-70px;animation-delay:2s}
.cta-band>*{position:relative;z-index:1}
.cta-band .btn-gold{animation:glow 2.4s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 10px rgba(255,255,255,.18)}}

/* inner page hero */
.page-hero{position:relative;overflow:hidden}
.page-hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(11,31,68,.08) 1.2px,transparent 1.4px);background-size:22px 22px;pointer-events:none}
.page-hero:after{content:"";position:absolute;right:-60px;top:-80px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(228,0,43,.16),transparent 70%);animation:float 9s ease-in-out infinite;pointer-events:none}
.page-hero .wrap{position:relative;z-index:1}
.guide,.contact .card,.guides a.card{transition:transform .25s,box-shadow .25s}
.guide:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(11,31,68,.16)}
a.card:hover h3{color:var(--gold)}

/* footer wave */
footer{position:relative}
footer:before{content:"";position:absolute;left:0;right:0;top:-1px;height:28px;background:#fff;clip-path:ellipse(60% 100% at 50% 0)}
.sec:last-of-type + footer:before{background:var(--bg)}
.wa-float{animation:glow2 2.8s ease-in-out infinite}
@keyframes glow2{50%{box-shadow:0 0 0 12px rgba(37,211,102,.2)}}
@media(prefers-reduced-motion:reduce){.plan.best:before,.cta-band,.cta-band:before,.cta-band:after,.hero:before,.hero:after,.sec.alt:before,.sec.alt:after,.page-hero:after,.split:before,.badge:after,.cmp thead th.us:after,.wa-float,.cta-band .btn-gold,.pill{animation:none}}
@media(max-width:700px){.pill.c,.pill.d{display:none}}

/* versus */
.vs{max-width:1040px;margin:0 auto;display:grid;gap:12px}
.vs-head,.vs-row{display:grid;grid-template-columns:1fr 1.5fr 1.5fr;gap:12px;align-items:stretch}
.vs-head>div{padding:16px 20px;border-radius:16px;font:800 14px var(--sans);display:flex;align-items:center}
.vs-head .vs-bad{background:#E6EAF2;color:var(--muted)}
.vs-head .vs-good{background:linear-gradient(135deg,#E4002B,#a8001f);color:#fff;font-size:16px;position:relative;overflow:hidden;box-shadow:0 14px 34px rgba(228,0,43,.3)}
.vs-head .vs-good:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);animation:sheen 4s ease-in-out infinite}
.vs-row{transition:transform .25s}
.vs-row:hover{transform:translateX(6px)}
.vs-f{display:flex;align-items:center;gap:12px;padding:14px 8px 14px 0;font-size:15px}
.vs-ico{flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:var(--navy)}
.vs-bad,.vs-good{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border-radius:16px;font-size:14.5px;line-height:1.5}
.vs-row .vs-bad{background:#EEF1F7;color:var(--muted)}
.vs-row .vs-good{background:#fff;color:var(--navy);font-weight:600;border:2px solid #FFC9D1;box-shadow:0 8px 24px rgba(228,0,43,.08);transition:border-color .25s,box-shadow .25s}
.vs-row:hover .vs-good{border-color:var(--gold);box-shadow:0 14px 34px rgba(228,0,43,.2)}
.vs-row i{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font:800 15px/1 var(--sans);font-style:normal;margin-top:1px}
.vs-row .vs-bad i{background:#FDE2E6;color:#D0021B}
.vs-row .vs-good i{background:#0A8F4E;color:#fff;animation:pop 2.6s ease-in-out infinite}
@keyframes pop{50%{transform:scale(1.15)}}
@media(max-width:760px){.vs-head{display:none}.vs-row{grid-template-columns:1fr;gap:8px;padding:14px;border-radius:20px;background:#fff;box-shadow:var(--shadow)}.vs-f{padding:0}.vs-row:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.vs-head .vs-good:after,.vs-row .vs-good i{animation:none}}

/* stats */
.stats{position:relative;z-index:2;margin-top:-52px;padding-bottom:12px}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.stat{padding:26px 22px;border-radius:22px;background:#fff;box-shadow:0 20px 50px rgba(11,31,68,.16);border:1px solid var(--line);text-align:center;transition:transform .3s}
.stat:hover{transform:translateY(-6px)}
.stat b{display:block;font:800 clamp(34px,4vw,48px)/1 var(--sans);letter-spacing:-.03em;background:linear-gradient(135deg,#E4002B,#13306A);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{display:block;margin-top:8px;font-size:14px;font-weight:700;color:var(--muted)}
.hero{padding-bottom:104px}
.price b{display:flex;align-items:baseline;gap:2px;font-size:44px;letter-spacing:0;white-space:nowrap}
.price b .cur{font-size:18px;font-weight:800;margin-right:4px;color:var(--dim);letter-spacing:.02em}
.price b .dec{font-size:22px;font-weight:800;letter-spacing:0}
.plan{min-width:0}
.price b{gap:0}.price b .cur{margin-right:6px}
.tv-tab{all:unset;box-sizing:border-box;padding:7px 9px;border-radius:8px;white-space:nowrap;cursor:pointer;font-size:11px;color:#9fb0cc;transition:background .2s,color .2s}
.tv-tab:hover{background:rgba(255,255,255,.08);color:#fff}
.tv-tab.on{background:var(--gold);color:#fff;font-weight:800}
.tv-tab:focus-visible,.tv-tile:focus-visible{outline:2px solid #fff;outline-offset:1px}
.tv-panel{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0}
.tv-panel[hidden]{display:none}
.tv-panel:not([hidden]){animation:tvIn .45s ease}
@keyframes tvIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tv-slide{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:14px;opacity:0;transition:opacity .4s}
.tv-slide.on{opacity:1}
.tv-slide:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(0,0,0,.8))}
.tv-slide small,.tv-slide b{position:relative;z-index:1}
.tv-slide small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#e6eefc}
.tv-slide b{font:800 20px var(--sans);color:#fff}
.tv-hero{min-height:100px}
.tv-hero:after{display:none}
.tv-hero .tv-bar{position:absolute;left:14px;right:14px;bottom:10px;z-index:2;margin:0}
.tv-slide{padding-bottom:30px}
.tv-tile{all:unset;box-sizing:border-box;display:block;height:48px;border-radius:8px;position:relative;overflow:hidden;cursor:pointer;opacity:.7;transition:opacity .2s,transform .2s,box-shadow .2s}
.tv-tile:hover{opacity:1;transform:translateY(-2px)}
.tv-tile.on{opacity:1;box-shadow:0 0 0 2px #fff}
.tv-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.explain{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start;margin-bottom:28px}
.explain p{font-size:17px;line-height:1.7;color:var(--text);margin:0 0 14px}
.ex-note{background:#fff1f3;border-left:4px solid var(--gold);padding:14px 16px;border-radius:10px}
.ex-steps{list-style:none;counter-reset:ex;margin:0;padding:0;display:grid;gap:12px}
.ex-steps li{counter-increment:ex;position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px 16px 62px;box-shadow:var(--shadow)}
.ex-steps li:before{content:counter(ex);position:absolute;left:16px;top:16px;width:32px;height:32px;border-radius:50%;background:var(--gold);color:#fff;font:800 15px/32px var(--sans);text-align:center}
.ex-steps b{display:block;color:var(--navy);margin-bottom:3px}
.ex-steps span{font-size:14.5px;line-height:1.55;color:var(--dim)}
.two-ways{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:860px){.explain,.two-ways{grid-template-columns:1fr}}
.pill.e{right:24px;bottom:-14px}

/* ===== mobile polish ===== */
@media(max-width:700px){
  body{padding-bottom:0}
  .sec{padding:52px 0}
  .sec-head{margin-bottom:30px}
  .hero{padding:36px 0 84px}
  .hero .wrap{gap:36px}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .hero-actions .btn{padding-inline:10px;text-align:center;justify-content:center}
  .chips{gap:10px 18px;margin-top:26px;padding-top:18px;font-size:13px}
  /* WhatsApp floating button: round icon */
  .wa-float{width:56px;height:56px;padding:0;font-size:0;right:14px;bottom:14px;display:flex;align-items:center;justify-content:center;background:#25D366 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M12 2a10 10 0 00-8.6 15.1L2 22l5-1.3A10 10 0 1012 2zm0 18.2c-1.5 0-3-.4-4.2-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1112 20.2zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8-.2-.1-.4-.1-.6.1l-.8 1c-.1.2-.3.2-.5.1a6.700 6.700 0 01-3.300-2.900c-.2-.4.2-.4.700-1.300.1-.2 0-.3 0-.5l-.8-1.800c-.2-.5-.4-.4-.6-.4h-.5c-.2 0-.5.1-.7.300-.8.800-1 1.700-1 2.500.1 1.600 1.500 3.200 2.600 4.100 1.800 1.500 3.200 1.900 4.400 1.700.8-.1 1.700-.7 1.900-1.300.2-.6.2-1.100.2-1.200-.1-.2-.2-.2-.5-.4z'/%3E%3C/svg%3E") center/30px no-repeat}
  .foot{padding-bottom:70px}
  /* promise strip: compact 2-col grid */
  .strip .wrap{grid-template-columns:1fr 1fr;padding-inline:0}
  .strip .item{padding:20px 16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
  .strip .item:nth-child(2n){border-right:0}
  .strip .item:last-child{grid-column:1/-1;border-right:0;border-bottom:0}
  .strip .item:before{width:38px;height:38px;border-radius:12px;background-size:19px;margin-bottom:10px}
  .strip h3{font-size:15px}
  .strip p{font-size:13px;line-height:1.45}
  /* stats 2x2 */
  .stat{padding:20px 12px;border-radius:18px}
  /* pricing: swipe carousel */
  #plans .plans,.plans{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:-20px;padding:10px 20px 22px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .plans::-webkit-scrollbar{display:none}
  .plans>.plan{flex:0 0 80%;scroll-snap-align:center;padding:26px 22px}
  .tiers{gap:8px}
  /* hero TV: tabs on top as chips, screen stacked */
  .tv-screen{grid-template-columns:1fr;grid-template-rows:auto 1fr;aspect-ratio:auto}
  .tv-list{flex-direction:row;overflow-x:auto;gap:6px;padding:10px;border-right:0;border-bottom:1px solid rgba(255,255,255,.1);scrollbar-width:none}
  .tv-list::-webkit-scrollbar{display:none}
  .tv-tab{padding:9px 13px;font-size:12.5px;flex:none;background:rgba(255,255,255,.07)}
  .tv-main{padding:10px}
  .tv-hero{min-height:150px}
  .tv-tile{height:56px}
  .tv-slide b{font-size:18px}
  .pill.a{left:6px;top:-16px}.pill.e{right:10px}
  .pill{padding:9px 14px;font-size:11px}
  .cta-band{padding:28px 20px;border-radius:22px;text-align:center;justify-content:center}
  .sec-head h2{font-size:clamp(26px,8vw,34px)}
}
@media(max-width:420px){
  .plans>.plan{flex-basis:86%}
}
@media(max-width:700px){.stat-grid{grid-template-columns:1fr 1fr;gap:12px}.stat b{font-size:30px}.stat span{font-size:12.5px}.stats{margin-top:-44px}}
.send-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin:0 0 28px;padding:24px 28px;border-radius:20px;background:linear-gradient(135deg,#0B1F44,#13306A);color:#fff;box-shadow:var(--shadow)}
.send-box h3{font:800 20px var(--sans);margin-bottom:10px}
.send-box ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:15px;color:#dbe5f7}
.send-box li b:first-child{color:#FF8A9C;margin-right:4px}
.plans{cursor:grab}.plans.drag{cursor:grabbing;scroll-snap-type:none!important;scroll-behavior:auto}
.plan-dots{display:none;justify-content:center;gap:7px;margin:-6px 0 6px}
.plan-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3);transition:all .25s}
.plan-dots i.on{width:22px;border-radius:6px;background:#fff}
@media(max-width:700px){
  .plan-dots{display:flex}
  .pay-box{margin-top:12px;padding:12px 12px 14px;border-radius:14px}
  .pay-box h3{font-size:12px;margin-bottom:10px;color:var(--dim);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
  .paylogos{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
  .payi{height:38px;min-width:0;padding:0 6px;border-radius:9px;font-size:11px}
  .payi img{height:24px;max-width:100%}
  .send-box{padding:20px;text-align:left}.send-box .btn{width:100%;text-align:center}
}
@media(max-width:700px){.paylogos .payi{display:flex;width:100%}.paylogos .payi img{max-width:78%}}
.row.drv{animation:none!important;will-change:transform;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.row.drv.grab{cursor:grabbing}
.row.drv img{-webkit-user-drag:none;pointer-events:none}
.row-label{margin:6px auto 12px}
.row-label h3{font:800 13px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#FF8A9C;display:flex;align-items:center;gap:10px}
.row-label h3:before{content:"";width:22px;height:2px;background:#FF8A9C}
.wall-slim{margin-top:6px}
.slim{position:relative;flex:none;width:240px;height:96px;border-radius:14px;overflow:hidden;box-shadow:0 10px 26px rgba(0,0,0,.35);background:#13306A}
.slim .art{position:absolute;inset:0;width:100%;height:100%}
.slim img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){.slim{width:200px;height:80px}}
.tv-pic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tv-slide:after{z-index:0}.tv-slide small,.tv-slide b{z-index:2}

/* checkout */
.co-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:start}
.co-main{display:flex;flex-direction:column;gap:18px}
.co-card{margin:0;padding:24px 26px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow)}
.co-card legend{float:left;width:100%;display:flex;align-items:center;gap:12px;font:800 18px var(--sans);margin:0 0 16px;padding:0}
.co-card legend+*{clear:both}
.co-card legend span{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--gold);color:#fff;font-size:14px}
.opts{display:grid;gap:12px}.opts.two{grid-template-columns:repeat(2,1fr)}.opts.four{grid-template-columns:repeat(4,1fr)}
.opt{position:relative;cursor:pointer;display:block}
.opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.opt-box{display:flex;flex-direction:column;gap:4px;min-height:64px;justify-content:center;padding:14px 16px;border:2px solid var(--line2);border-radius:14px;background:#fff;transition:border-color .2s,box-shadow .2s,background .2s}
.opt-box b{font:800 15px var(--sans)}.opt-box small{font-size:12.5px;color:var(--muted);line-height:1.4}
.opt input:checked+.opt-box{border-color:var(--gold);background:#FFF5F6;box-shadow:0 8px 22px rgba(228,0,43,.14)}
.opt input:focus-visible+.opt-box{outline:3px solid #2F6BFF;outline-offset:2px}
.co-fields{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.co-fields label{display:flex;flex-direction:column;gap:6px;font:700 13.5px var(--sans);color:var(--navy)}
.co-fields input,.co-fields select{min-height:48px;padding:0 14px;border:2px solid var(--line2);border-radius:12px;font:500 16px var(--sans);background:#fff;color:var(--text)}
.co-fields input:focus,.co-fields select:focus{outline:none;border-color:var(--gold)}
.opt-tag{font-style:normal;font-weight:600;color:var(--dim);font-size:12px}
.hint{margin-top:14px;font-size:13.5px;color:var(--muted)}
.agree{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--muted);padding:6px 4px}
.agree input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--gold)}
.agree a{text-decoration:underline;color:var(--navy)}
.co-sum{position:sticky;top:92px;padding:26px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.co-sum h2{font-size:20px;margin-bottom:14px}
.co-sum dl{margin:0 0 14px}.co-sum dl div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
.co-sum dt{color:var(--muted)}.co-sum dd{margin:0;font-weight:800}
.co-total{display:flex;justify-content:space-between;align-items:baseline;margin:6px 0 10px;font-weight:800}
.co-total b{font:800 32px var(--serif);color:var(--gold)}
.co-sum .btn{width:100%;margin-top:12px}
.co-alt{width:100%;margin-top:10px;background:none;border:0;color:var(--navy);font:700 13.5px var(--sans);text-decoration:underline;cursor:pointer;min-height:44px}
.co-err{margin-top:10px;padding:10px 12px;border-radius:10px;background:#FFF0F2;color:#9A0020;font-size:14px;font-weight:600}
.co-trust{list-style:none;margin:16px 0 10px;padding:14px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px;font-size:13.5px}
.co-trust li{display:flex;gap:10px}
.co-trust li:before{content:"";flex:none;width:13px;height:7px;margin-top:7px;border-left:3px solid #0A8F4E;border-bottom:3px solid #0A8F4E;transform:rotate(-45deg) scale(.85)}
@media(max-width:900px){.co-grid{grid-template-columns:1fr}.co-sum{position:static}.opts.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.opts.two,.co-fields{grid-template-columns:1fr}.co-card{padding:20px 18px}}

.tv-slide.has-pic small,.tv-slide.has-pic b{display:none}

.chan.chanimg{padding:0;background:#0B1F44;border:1px solid rgba(255,255,255,.12)}
.chan.chanimg:before{display:none}
.chan.chanimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}