:root {
  color-scheme: dark;
  --bg: #090a0d;
  --panel: #111216;
  --panel-soft: #17181d;
  --text: #f3f1ed;
  --muted: #9a9ba2;
  --dim: #686a72;
  --line: rgba(255, 255, 255, .1);
  --accent: #ff554a;
  --accent-light: #ff8175;
  --gold: #d7b986;
  --font: 'DM Sans', 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); font-size: 15px; -webkit-font-smoothing: antialiased; }
body:has(.demo-dialog[open]) { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
::selection { color: #fff; background: #d64038; }

.site-header { height: 78px; padding: 0 7.1%; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.055); background: rgba(9,10,13,.83); backdrop-filter: blur(18px); position: absolute; z-index: 20; inset: 0 0 auto; }
.brand { display: inline-flex; gap: 11px; align-items: center; }
.brand-mark { width: 23px; height: 23px; display: inline-flex; gap: 2px; align-items: center; justify-content: center; transform: skew(-23deg); }
.brand-mark i { width: 5px; height: 14px; border-radius: 6px; background: var(--accent); display: block; }
.brand-mark i:nth-child(2) { height: 21px; background: #f1e4d1; }
.brand-mark i:nth-child(3) { height: 10px; background: #9a9da7; }
.brand-name { font-family: 'DM Sans', sans-serif; font-size: 19px; font-weight: 700; letter-spacing: .13em; }
.brand-name span, .screen-logo span, .preview-brand span, .setup-tv-screen > span span { color: var(--accent); }
.site-nav { display: flex; align-items: center; gap: 38px; margin-left: 65px; }
.site-nav a { color: #b6b6ba; font-size: 13px; transition: color .2s ease; }
.site-nav a:hover, .footer-note:hover { color: #fff; }
.header-cta { min-width: 116px; padding: 11px 16px; border: 1px solid rgba(255,255,255,.22); border-radius: 3px; font-size: 12px; text-align: center; transition: background .2s, border-color .2s; }
.header-cta span { padding-left: 8px; color: var(--accent-light); }
.header-cta:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.5); }
.menu-toggle { display: none; }

.hero { position: relative; overflow: hidden; min-height: 790px; padding: 170px 8.3% 96px; display: grid; grid-template-columns: minmax(330px, .82fr) minmax(500px, 1.18fr); align-items: center; }
.hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(9,10,13,.98) 0%, rgba(9,10,13,.95) 38%, rgba(9,10,13,.12) 100%), radial-gradient(ellipse at 75% 48%, rgba(101,39,35,.18), transparent 49%); }
.hero-glow { position: absolute; width: 660px; height: 480px; right: 3%; top: 21%; background: radial-gradient(ellipse, rgba(170,69,55,.16), transparent 67%); filter: blur(32px); }
.hero-copy { position: relative; z-index: 2; padding-bottom: 27px; }
.eyebrow { color: #b8b2aa; font-family: 'DM Sans', sans-serif; font-size: 10px; letter-spacing: .22em; display: flex; align-items: center; gap: 11px; margin: 0 0 24px; }
.eyebrow-line { display: inline-block; width: 24px; height: 1px; background: var(--accent); }
.hero h1 { font-size: clamp(58px, 6.8vw, 88px); letter-spacing: -.065em; line-height: 1.15; font-weight: 500; margin: 0 0 24px; }
.hero h1 span { color: var(--accent-light); }
.hero-description { color: #a8a8ad; font-size: 15px; line-height: 2.15; margin: 0 0 33px; font-weight: 300; }
.hero-actions { display: flex; gap: 22px; align-items: center; }
.button { cursor: pointer; border: 0; display: inline-flex; align-items: center; justify-content: center; gap: 22px; min-height: 49px; padding: 0 21px; font-size: 13px; transition: background .2s, transform .2s, border-color .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--accent); color: #fff; border-radius: 3px; font-weight: 600; box-shadow: 0 8px 26px rgba(255,85,74,.15); }
.button-primary:hover { background: #ff6a5e; }
.button-primary span { font-size: 17px; font-weight: 400; }
.button-quiet { background: transparent; padding-left: 0; padding-right: 0; color: #d0d0d2; gap: 10px; }
.button-quiet:hover { color: #fff; }
.play-icon { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; font-size: 9px; padding-left: 2px; }
.hero-note { display: flex; align-items: center; gap: 9px; margin-top: 61px; color: #888990; font-size: 11px; letter-spacing: .03em; }
.note-dot { height: 6px; width: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 11px rgba(255,85,74,.72); }

.hero-visual { position: relative; min-height: 525px; display: flex; align-items: center; justify-content: center; perspective: 1300px; z-index: 1; }
.visual-orbit { position: absolute; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; transform: rotate(-23deg); }
.orbit-one { width: 540px; height: 310px; }
.orbit-two { width: 620px; height: 410px; border-color: rgba(213,152,119,.08); transform: rotate(14deg); }
.screen-frame { position: absolute; z-index: 1; width: min(91%, 544px); aspect-ratio: 1.48; border: 1px solid rgba(255,255,255,.38); border-radius: 7px; padding: 8px; transform: rotateY(-12deg) rotateX(3deg); background: linear-gradient(140deg, #373941, #090a0e 22%, #16171d 82%, #55555a); box-shadow: 16px 21px 55px rgba(0,0,0,.65), 0 0 55px rgba(232,83,60,.08); }
.screen-glass { height: 100%; padding: 17px 19px 13px; border: 1px solid rgba(255,255,255,.06); border-radius: 3px; overflow: hidden; position: relative; background: radial-gradient(ellipse at 81% 35%, rgba(194,74,55,.3), transparent 37%), linear-gradient(130deg, #1d2027, #111217 48%, #281917); }
.screen-glass::before { content: ''; position: absolute; inset: 0; background: linear-gradient(122deg, rgba(255,255,255,.08), transparent 35%); pointer-events: none; }
.screen-topline { display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 1; }
.screen-logo { font-size: 10px; font-weight: 700; letter-spacing: .14em; }
.screen-weather { font-size: 8px; color: #b4b1b1; }
.screen-welcome { margin: 37px 0 20px; position: relative; z-index: 1; display: flex; flex-direction: column; gap: 8px; }
.screen-kicker { font-size: 6px; letter-spacing: .18em; color: #d7b986; }
.screen-welcome strong { font-size: 21px; letter-spacing: .05em; font-weight: 500; }
.screen-welcome > span:last-child { color: #bbb; font-size: 8px; }
.screen-apps { display: flex; gap: 9px; position: relative; z-index: 1; }
.app-tile { width: 66px; height: 66px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.055); border-radius: 4px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; box-shadow: 0 5px 16px rgba(0,0,0,.18); }
.app-tile > span { font-size: 16px; font-weight: 600; }
.app-tile small { color: #ccc; font-size: 6px; }
.app-live > span { color: var(--accent-light); font-size: 9px; letter-spacing: .06em; }
.app-film > span { width: 21px; height: 21px; border-radius: 50%; border: 1px solid #e8d2b3; color: #e8d2b3; display: grid; place-items: center; font-size: 8px; padding-left: 2px; }
.app-apps > span { color: #b0a5ec; }
.app-search > span { color: #8eb6bf; }
.screen-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 17px; color: #787880; font-size: 6px; }
.screen-progress { width: 35%; height: 1px; background: linear-gradient(90deg, var(--accent) 32%, rgba(255,255,255,.2) 32%); }
.device-shadow { position: absolute; z-index: 1; width: 270px; height: 50px; border-radius: 50%; top: 75%; background: rgba(0,0,0,.8); filter: blur(23px); }
.device { z-index: 2; position: absolute; top: 76%; width: 190px; height: 33px; border-radius: 14px 14px 8px 8px; transform: rotateX(60deg) rotateZ(-10deg); background: linear-gradient(115deg, #303138, #111216 33%, #28292e); border: 1px solid rgba(255,255,255,.22); box-shadow: inset 0 1px 3px rgba(255,255,255,.18), 6px 15px 19px rgba(0,0,0,.5); }
.device-top { height: 100%; display: flex; justify-content: center; align-items: center; gap: 6px; }
.device-label { color: #777980; font-family: 'DM Sans', sans-serif; font-size: 5px; letter-spacing: .22em; }
.device-light { display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: #d7735f; box-shadow: 0 0 8px rgba(255,102,81,.8); }
.device-front { position: absolute; inset: auto 0 -7px; display: flex; justify-content: center; gap: 8px; }
.device-port { width: 10px; height: 2px; border-radius: 1px; background: #06070a; box-shadow: inset 0 1px 1px rgba(255,255,255,.09); }
.floating-label { display: flex; align-items: center; gap: 10px; position: absolute; z-index: 3; right: 1%; bottom: 3%; padding: 12px 16px; border: 1px solid rgba(255,255,255,.12); border-radius: 4px; background: rgba(20,21,25,.83); box-shadow: 0 10px 35px rgba(0,0,0,.25); color: #e7e5e2; font-size: 10px; line-height: 1.6; backdrop-filter: blur(8px); }
.floating-check { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,85,74,.12); color: var(--accent-light); }
.floating-label small { color: #8c8d94; }
.visual-caption { position: absolute; right: 6%; bottom: -3%; font-family: 'DM Sans',sans-serif; letter-spacing: .22em; font-size: 7px; color: #64656b; }
.scroll-cue { position: absolute; bottom: 24px; left: 8.3%; color: #777980; font-size: 9px; letter-spacing: .08em; display: flex; align-items: center; gap: 10px; }
.scroll-cue span { width: 20px; height: 30px; border: 1px solid #65666c; border-radius: 12px; position: relative; }
.scroll-cue span::after { content: ''; width: 2px; height: 5px; background: var(--accent); position: absolute; left: 8px; top: 6px; border-radius: 2px; animation: scroll 1.4s infinite; }
@keyframes scroll { to { transform: translateY(8px); opacity: 0; } }

.trust-strip { min-height: 99px; display: flex; justify-content: space-between; align-items: center; padding: 0 8.3%; background: #101115; border-top: 1px solid rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.05); color: #b9b8ba; font-size: 12px; }
.trust-items { display: flex; gap: clamp(28px, 6vw, 90px); }
.trust-items span { display: flex; align-items: center; gap: 10px; color: #d2d0ce; }
.trust-items i { color: var(--accent); font-style: normal; font-size: 8px; font-family: 'DM Sans',sans-serif; letter-spacing: .1em; }
.section-wrap { padding-left: 10%; padding-right: 10%; }
.experience { padding-top: 136px; padding-bottom: 126px; }
.section-heading { max-width: 700px; margin-bottom: 49px; }
.section-heading .eyebrow { margin-bottom: 19px; }
.section-heading h2, .heading-inline h2, .setup-copy h2, .buy-copy h2, .faq-heading h2 { font-size: clamp(35px, 4vw, 50px); font-weight: 500; letter-spacing: -.045em; line-height: 1.36; margin: 0 0 17px; }
.section-heading > p:last-child { color: var(--muted); font-size: 13px; line-height: 1.9; max-width: 550px; margin: 0; }
.mobile-break { display: none; }
.experience-card { min-height: 430px; position: relative; display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 5%; overflow: hidden; padding: 53px 5%; border: 1px solid rgba(255,255,255,.08); background: linear-gradient(110deg, #15161a, #111216 48%, #191619); }
.experience-card::before { content: ''; position: absolute; width: 450px; height: 300px; left: 9%; bottom: -40%; background: rgba(165,66,47,.09); filter: blur(70px); }
.experience-copy { position: relative; z-index: 2; }
.number-index, .feature-index { color: #85858b; font-family: 'DM Sans',sans-serif; font-size: 9px; letter-spacing: .14em; }
.experience-copy h3 { font-weight: 500; font-size: 32px; letter-spacing: -.03em; line-height: 1.45; margin: 25px 0 13px; }
.experience-copy > p { max-width: 250px; font-size: 12px; line-height: 1.9; color: #a4a4aa; margin: 0 0 23px; }
.text-link { padding: 0; border: 0; background: transparent; cursor: pointer; display: inline-flex; align-items: center; gap: 13px; font-size: 11px; color: var(--accent-light); }
.text-link:hover { color: #fff; }
.interface-preview { min-width: 0; position: relative; z-index: 1; aspect-ratio: 1.6; padding: 15px 18px; border: 1px solid rgba(255,255,255,.24); border-radius: 5px; overflow: hidden; background: radial-gradient(ellipse at 80% 34%, rgba(153,63,48,.25), transparent 40%), linear-gradient(135deg,#24232a,#0d0f14 53%,#231918); box-shadow: 0 17px 45px rgba(0,0,0,.55); transform: perspective(800px) rotateY(-4deg); }
.interface-preview::after { content: ''; position: absolute; inset: 0; background: linear-gradient(120deg,rgba(255,255,255,.1),transparent 38%); pointer-events: none; }
.preview-top { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; }
.preview-brand { font-size: 9px; font-weight: 700; letter-spacing: .14em; }
.preview-pills { display: flex; gap: 12px; color: #9999a0; font-size: 6px; }
.preview-pills b { color: #fff; border-bottom: 1px solid var(--accent); padding-bottom: 4px; }
.preview-time { color: #aaa; font-size: 7px; }
.preview-hero { position: relative; z-index: 1; height: 53%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; padding-left: 7%; }
.preview-label { color: var(--gold); font-family: 'DM Sans',sans-serif; font-size: 5px; letter-spacing: .2em; }
.preview-hero strong { font-size: clamp(16px,2.1vw,25px); line-height: 1.4; font-weight: 500; }
.preview-button { color: #fff; border-radius: 2px; padding: 5px 8px; background: rgba(255,255,255,.16); font-size: 6px; }
.preview-row { position: relative; z-index: 1; display: flex; justify-content: space-between; font-size: 7px; color: #e2e0e0; margin-bottom: 8px; }
.preview-row small { font-size: 5px; color: #898990; }
.preview-cards { position: relative; z-index: 1; display: flex; gap: 8px; height: 28%; }
.preview-poster { flex: 1; position: relative; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 7px; border-radius: 2px; overflow: hidden; color: rgba(255,255,255,.78); font-size: 7px; letter-spacing: .12em; }
.preview-poster::before { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(0,0,0,.7),transparent 85%); }
.preview-poster span { position: relative; }
.poster-one { background: linear-gradient(145deg,#c9895f,#583f45 56%,#252a36); }
.poster-two { background: linear-gradient(140deg,#bea17a,#595266 55%,#191921); }
.poster-three { background: linear-gradient(145deg,#83a6a4,#4d5657 50%,#253b43); }
.poster-four { background: linear-gradient(140deg,#c65a46,#773947 48%,#242530); }
.preview-reflection { height: 40%; position: absolute; inset: auto 0 -39%; background: linear-gradient(180deg,rgba(255,255,255,.05),transparent); transform: scaleY(-1); opacity: .14; filter: blur(2px); }
.card-corner { position: absolute; right: 20px; bottom: 15px; color: #717179; font: 7px 'DM Sans',sans-serif; letter-spacing: .13em; }

.features { padding-top: 25px; padding-bottom: 138px; }
.heading-inline { display: flex; align-items: flex-end; justify-content: space-between; max-width: none; }
.heading-inline > p { max-width: 300px; margin: 0 0 8px !important; color: var(--muted); font-size: 12px; line-height: 1.9; }
.feature-grid { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: 16px; }
.feature-card { position: relative; min-height: 365px; padding: 0 20px 24px; overflow: hidden; background: #131419; border: 1px solid rgba(255,255,255,.075); transition: transform .25s,border-color .25s; }
.feature-card:hover { transform: translateY(-5px); border-color: rgba(255,255,255,.2); }
.feature-art { height: 170px; position: relative; margin: 0 -20px 19px; overflow: hidden; }
.art-cinema { background: radial-gradient(ellipse at 61% 40%,rgba(226,148,90,.5),transparent 28%), linear-gradient(155deg,#453438,#17191e 55%,#31231f); }
.art-cinema::before { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#15161a 0%,transparent 55%); }
.art-sun { position: absolute; width: 58px; height: 58px; right: 27%; top: 25px; border-radius: 50%; background: #d89c72; filter: blur(1px); box-shadow: 0 0 38px rgba(235,168,113,.38); }
.art-horizon { position: absolute; width: 120%; height: 80px; bottom: -38px; left: -10%; background: linear-gradient(170deg,transparent 23%,#1d2025 24% 43%,#111317 44%); transform: rotate(-5deg); }
.art-screen { position: absolute; bottom: 19px; left: 22px; padding: 6px 10px; border: 1px solid rgba(255,255,255,.23); border-radius: 2px; color: #fff; font: 8px 'DM Sans',sans-serif; letter-spacing: .18em; }
.art-live { background: radial-gradient(ellipse at 50% 25%,rgba(207,87,68,.5),transparent 38%),linear-gradient(130deg,#28252a,#17181c 55%,#322322); display: grid; place-items: center; }
.live-screen { height: 90px; width: 155px; border: 1px solid rgba(255,255,255,.28); background: linear-gradient(155deg,#704b42,#252b34 70%); box-shadow: 0 14px 28px rgba(0,0,0,.45); display: flex; flex-direction: column; justify-content: flex-end; gap: 5px; padding: 10px; transform: perspective(350px) rotateY(-13deg); }
.live-screen i { position: absolute; width: 120px; height: 1px; top: 20px; left: 13px; background: linear-gradient(90deg,var(--accent),transparent); box-shadow: 0 0 11px var(--accent); }
.live-screen b { font-size: 9px; letter-spacing: .2em; }
.live-screen small { font-size: 6px; color: #c3bdba; }
.live-signal { position: absolute; top: 39px; right: 27%; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
.art-simple { display: grid; place-items: center; background: radial-gradient(ellipse at 50% 70%,rgba(110,97,162,.23),transparent 47%),linear-gradient(140deg,#1d2027,#15161a); }
.simple-tiles { display: grid; grid-template-columns: repeat(2,54px); gap: 8px; transform: rotate(-8deg) perspective(350px) rotateY(17deg); }
.simple-tiles span { width: 54px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.17); background: rgba(255,255,255,.06); border-radius: 4px; font-size: 17px; color: #cdc0ec; }
.simple-tiles span:nth-child(2) { color: #f0b5a2; }
.simple-tiles span:nth-child(3) { color: #a1c9ca; }
.simple-cursor { position: absolute; right: 29%; bottom: 25px; color: #fff; font-size: 21px; text-shadow: 0 3px 12px #fff; }
.feature-index { font-size: 8px; }
.feature-card h3 { font-size: 18px; line-height: 1.6; font-weight: 500; margin: 12px 0 7px; }
.feature-card p { color: var(--muted); font-size: 10px; line-height: 1.8; max-width: 240px; margin: 0; }
.feature-arrow { position: absolute; right: 20px; bottom: 26px; font-size: 14px; color: #77777e; }
.feature-card-wide h3 { font-size: 21px; }

.setup { padding-bottom: 135px; }
.setup-panel { min-height: 427px; display: grid; grid-template-columns: .83fr 1.17fr; align-items: center; background: linear-gradient(110deg,#16171c,#111216); border: 1px solid rgba(255,255,255,.07); overflow: hidden; }
.setup-copy { padding: 50px 0 50px 12%; }
.setup-copy .eyebrow { margin-bottom: 19px; }
.setup-copy h2 { font-size: 43px; margin-bottom: 16px; }
.setup-copy h2 span { color: var(--accent-light); }
.setup-copy > p:not(.eyebrow) { max-width: 295px; color: var(--muted); font-size: 11px; line-height: 1.95; margin: 0 0 23px; }
.setup-art { position: relative; height: 340px; align-self: end; }
.setup-tv { position: absolute; bottom: 90px; right: 13%; width: min(74%,400px); }
.setup-tv-screen { aspect-ratio: 1.66; border: 1px solid rgba(255,255,255,.4); border-radius: 4px; background: radial-gradient(ellipse at 74% 42%,rgba(190,73,56,.3),transparent 48%),linear-gradient(145deg,#2c2d34,#111319 61%,#272123); box-shadow: 0 20px 38px rgba(0,0,0,.4); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; position: relative; }
.setup-tv-screen::after { content: ''; position: absolute; inset: 0; background: linear-gradient(125deg,rgba(255,255,255,.11),transparent 35%); }
.setup-tv-screen > span { font: 700 16px 'DM Sans',sans-serif; letter-spacing: .18em; position: relative; z-index: 1; }
.setup-tv-screen > i { color: #ccc; font-style: normal; font-size: 9px; letter-spacing: .2em; position: relative; z-index: 1; }
.setup-tv-neck { width: 28px; height: 31px; margin: auto; background: linear-gradient(90deg,#18191e,#292a30,#111216); }
.setup-tv-foot { width: 85px; height: 6px; border-radius: 50%; margin: -1px auto 0; background: #25262b; }
.setup-box { position: absolute; width: 125px; height: 22px; bottom: 37px; left: 25%; border-radius: 6px 6px 3px 3px; display: flex; align-items: center; justify-content: center; gap: 7px; transform: perspective(250px) rotateX(38deg) rotateZ(-6deg); background: linear-gradient(90deg,#37383f,#111216 45%,#292a30); border: 1px solid rgba(255,255,255,.21); box-shadow: 0 12px 19px rgba(0,0,0,.5); }
.setup-box small { color: #74757d; font: 5px 'DM Sans',sans-serif; letter-spacing: .2em; }
.setup-cable { position: absolute; width: 15%; height: 32px; bottom: 49px; left: 39%; border: 1px solid #55565b; border-top: 0; border-left: 0; border-radius: 0 0 20px 0; opacity: .6; transform: skewX(-15deg); }
.setup-tag { position: absolute; color: #b8b5b3; font-size: 8px; letter-spacing: .11em; }
.tag-tv { right: 14%; top: 14px; }
.tag-box { left: 24%; bottom: 10px; }
.setup-tag::after { content: ''; position: absolute; top: 50%; width: 27px; height: 1px; background: #68696d; }
.tag-tv::after { left: -36px; }
.tag-box::after { right: -36px; }
.setup-spark { position: absolute; color: #d5bd98; font-size: 11px; }
.spark-one { top: 50px; right: 24%; }
.spark-two { top: 101px; right: 9%; font-size: 7px; }

.buy-section { padding-bottom: 132px; }
.buy-panel { position: relative; min-height: 397px; padding: 60px 8%; display: flex; justify-content: space-between; align-items: center; overflow: hidden; background: radial-gradient(ellipse at 5% 68%,rgba(155,57,45,.21),transparent 44%),linear-gradient(110deg,#17171b,#111216); border: 1px solid rgba(255,255,255,.08); }
.buy-copy { max-width: 410px; position: relative; z-index: 1; }
.buy-copy h2 { font-size: 42px; margin-bottom: 15px; }
.buy-copy > p:last-child { max-width: 325px; color: var(--muted); font-size: 12px; line-height: 1.9; }
.buy-card { position: relative; z-index: 1; width: min(370px,45%); padding: 26px; background: rgba(10,11,14,.83); border: 1px solid rgba(255,255,255,.13); box-shadow: 0 17px 50px rgba(0,0,0,.27); }
.buy-card-top { display: flex; align-items: center; gap: 7px; color: #ddd; font: 8px 'DM Sans',sans-serif; letter-spacing: .1em; }
.buy-mark { display: flex; align-items: center; gap: 2px; height: 14px; transform: skew(-18deg); }
.buy-mark i { width: 3px; height: 9px; background: var(--accent); }
.buy-mark i:nth-child(2) { height: 13px; background: #f1e4d1; }
.buy-mark i:nth-child(3) { height: 7px; background: #9a9da7; }
.buy-badge { margin-left: auto; border: 1px solid rgba(255,255,255,.17); padding: 5px 7px; color: #a7a7ac; font-size: 7px; letter-spacing: 0; }
.buy-card h3 { font-size: 18px; font-weight: 500; margin: 25px 0 6px; }
.buy-card > p { margin: 0; color: #a0a0a7; font-size: 10px; }
.buy-divider { height: 1px; background: rgba(255,255,255,.1); margin: 22px 0 17px; }
.buy-price { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.buy-price span { color: #9b9ba1; font-size: 10px; }
.buy-price strong { color: var(--gold); font-size: 14px; font-weight: 500; }
.buy-button { width: 100%; min-height: 42px; justify-content: space-between; }
.buy-disclaimer { display: block; margin-top: 13px; color: #777980; font-size: 8px; line-height: 1.7; }

.faq { padding-bottom: 140px; display: grid; grid-template-columns: .7fr 1.3fr; gap: 7%; }
.faq-heading h2 { font-size: 40px; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list details:first-child { border-top: 1px solid var(--line); }
.faq-list summary { position: relative; padding: 21px 33px 21px 0; cursor: pointer; list-style: none; font-size: 12px; color: #e6e5e3; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-plus { position: absolute; right: 5px; top: 50%; width: 15px; height: 15px; transform: translateY(-50%); }
.faq-plus::before, .faq-plus::after { content: ''; position: absolute; background: #999; border-radius: 2px; }
.faq-plus::before { width: 12px; height: 1px; top: 7px; left: 1px; }
.faq-plus::after { width: 1px; height: 12px; top: 1px; left: 7px; transition: transform .2s; }
.faq-list details[open] .faq-plus::after { transform: rotate(90deg); }
.faq-list details p { margin: -4px 28px 20px 0; color: #9b9ba2; font-size: 10px; line-height: 1.9; max-width: 620px; }

.closing { min-height: 385px; padding: 80px 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; position: relative; overflow: hidden; border-top: 1px solid rgba(255,255,255,.06); }
.closing-glow { position: absolute; width: 500px; height: 310px; bottom: -230px; background: radial-gradient(ellipse,rgba(206,66,53,.28),transparent 70%); filter: blur(32px); }
.closing .eyebrow { position: relative; margin-bottom: 17px; font-size: 8px; }
.closing h2 { position: relative; font-size: clamp(34px,4.2vw,49px); font-weight: 500; letter-spacing: -.04em; line-height: 1.45; margin: 0 0 23px; }
.closing h2 span { color: var(--accent-light); }
.closing .button { position: relative; }
.closing-word { position: absolute; bottom: -23px; color: rgba(255,255,255,.018); font: 900 clamp(85px,16vw,190px)/1 'DM Sans',sans-serif; letter-spacing: .08em; white-space: nowrap; }
.site-footer { min-height: 81px; border-top: 1px solid rgba(255,255,255,.06); display: flex; align-items: center; justify-content: space-between; padding: 0 7.1%; color: #8a8b92; font-size: 9px; }
.footer-brand .brand-mark { transform: scale(.8) skew(-23deg); }
.footer-brand .brand-name { font-size: 14px; color: #ddd; }
.footer-note { color: #a7a7ac; }
.footer-legal { color: #686970; }
.back-top { color: #a0a0a6; }
.back-top:hover { color: #fff; }

.demo-dialog { width: min(880px,calc(100% - 32px)); padding: 25px; border: 1px solid rgba(255,255,255,.17); background: #101115; color: var(--text); box-shadow: 0 30px 110px rgba(0,0,0,.72); }
.demo-dialog::backdrop { background: rgba(0,0,0,.82); backdrop-filter: blur(7px); }
.dialog-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.dialog-kicker { color: var(--accent-light); font: 8px 'DM Sans',sans-serif; letter-spacing: .17em; }
.dialog-top h2 { font-size: 19px; font-weight: 500; margin: 7px 0 0; }
.dialog-close { width: 35px; height: 35px; cursor: pointer; border: 1px solid rgba(255,255,255,.16); background: transparent; color: #bbb; font-size: 24px; line-height: 1; }
.dialog-close:hover { background: rgba(255,255,255,.09); color: #fff; }
.demo-dialog video { display: block; width: 100%; max-height: 68vh; background: #050608; }
.dialog-note { color: #85868e; font-size: 9px; line-height: 1.7; margin: 14px 0 0; }
.toast { position: fixed; z-index: 40; bottom: 24px; left: 50%; transform: translate(-50%,18px); opacity: 0; pointer-events: none; padding: 12px 18px; border: 1px solid rgba(255,255,255,.12); background: #1c1d22; color: #f1efeb; font-size: 11px; box-shadow: 0 9px 28px rgba(0,0,0,.35); transition: opacity .2s,transform .2s; }
.toast.is-visible { opacity: 1; transform: translate(-50%,0); }

@media (min-width: 1500px) {
  .hero { padding-left: max(8.3%, calc((100% - 1300px)/2)); padding-right: max(8.3%, calc((100% - 1300px)/2)); }
  .section-wrap { padding-left: max(10%, calc((100% - 1180px)/2)); padding-right: max(10%, calc((100% - 1180px)/2)); }
}

@media (max-width: 1000px) {
  .site-header { padding: 0 5%; }
  .site-nav { margin-left: 0; gap: 23px; }
  .hero { padding-left: 6%; padding-right: 6%; grid-template-columns: .85fr 1.15fr; min-height: 720px; }
  .hero-visual { min-height: 450px; }
  .hero h1 { font-size: clamp(55px,7vw,72px); }
  .section-wrap { padding-left: 7%; padding-right: 7%; }
  .setup-copy { padding-left: 9%; }
  .buy-panel { padding-left: 6%; padding-right: 6%; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 70px; }
  .site-header { height: 65px; padding: 0 22px; }
  .brand-name { font-size: 16px; }
  .menu-toggle { display: flex; width: 34px; height: 34px; padding: 8px 4px; align-items: center; justify-content: center; flex-direction: column; gap: 6px; order: 3; border: 0; background: transparent; cursor: pointer; }
  .menu-toggle span { display: block; width: 20px; height: 1px; background: #e8e7e4; transition: transform .2s; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .site-nav { position: absolute; top: 64px; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 6px 22px 14px; background: rgba(12,13,16,.97); border-bottom: 1px solid var(--line); }
  .site-nav.is-open { display: flex; }
  .site-nav a { padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.05); font-size: 12px; }
  .site-nav a:last-child { border-bottom: 0; }
  .header-cta { margin-left: auto; margin-right: 13px; padding: 8px 11px; min-width: 94px; font-size: 10px; }
  .hero { min-height: auto; display: flex; flex-direction: column; align-items: stretch; padding: 132px 23px 67px; }
  .hero::before { background: linear-gradient(180deg,rgba(9,10,13,.97) 0%,rgba(9,10,13,.83) 45%,rgba(9,10,13,.25) 100%),radial-gradient(ellipse at 54% 76%,rgba(101,39,35,.2),transparent 55%); }
  .hero-copy { padding-bottom: 0; }
  .hero .eyebrow { font-size: 8px; margin-bottom: 18px; }
  .hero h1 { font-size: clamp(54px,13vw,73px); margin-bottom: 15px; }
  .hero-description { font-size: 13px; line-height: 1.95; margin-bottom: 22px; }
  .hero-actions { gap: 17px; }
  .button { min-height: 44px; padding: 0 16px; font-size: 11px; gap: 12px; }
  .button-quiet { padding: 0; }
  .play-icon { width: 26px; height: 26px; }
  .hero-note { margin-top: 28px; font-size: 9px; }
  .hero-visual { min-height: 325px; margin: 1px -8px 0; }
  .visual-orbit.orbit-one { width: 330px; height: 205px; }
  .orbit-two { width: 390px; height: 260px; }
  .screen-frame { width: min(87%,440px); padding: 5px; border-radius: 4px; }
  .screen-glass { padding: 10px 11px 8px; }
  .screen-welcome { margin: 21px 0 11px; gap: 5px; }
  .screen-welcome strong { font-size: 16px; }
  .screen-apps { gap: 6px; }
  .app-tile { width: 49px; height: 49px; gap: 4px; }
  .app-tile > span { font-size: 12px; }
  .app-tile small { font-size: 5px; }
  .screen-footer { margin-top: 10px; }
  .device { width: 145px; height: 26px; top: 76%; }
  .device-shadow { width: 200px; top: 75%; }
  .floating-label { right: 2%; bottom: 1%; padding: 8px 11px; font-size: 8px; }
  .floating-check { width: 18px; height: 18px; }
  .visual-caption { bottom: -8%; right: 8%; font-size: 6px; }
  .scroll-cue { display: none; }
  .trust-strip { padding: 21px 23px; min-height: auto; display: block; font-size: 10px; }
  .trust-items { margin-top: 16px; justify-content: space-between; gap: 8px; }
  .trust-items span { gap: 5px; font-size: 9px; }
  .trust-items i { font-size: 7px; }
  .section-wrap { padding-left: 23px; padding-right: 23px; }
  .experience { padding-top: 83px; padding-bottom: 81px; }
  .section-heading { margin-bottom: 26px; }
  .section-heading .eyebrow { font-size: 8px; margin-bottom: 15px; }
  .section-heading h2, .heading-inline h2, .faq-heading h2 { font-size: 34px; }
  .mobile-break { display: block; }
  .section-heading > p:last-child { font-size: 11px; }
  .experience-card { display: flex; flex-direction: column; align-items: stretch; gap: 25px; padding: 25px 19px 22px; min-height: 0; }
  .experience-copy h3 { font-size: 26px; margin: 15px 0 8px; }
  .experience-copy > p { max-width: none; font-size: 10px; }
  .interface-preview { width: 100%; aspect-ratio: 1.45; padding: 10px; }
  .preview-pills { gap: 7px; }
  .preview-hero { height: 53%; }
  .preview-hero strong { font-size: 17px; }
  .preview-cards { gap: 5px; }
  .card-corner { bottom: 8px; font-size: 6px; }
  .features { padding-top: 0; padding-bottom: 85px; }
  .heading-inline { display: block; margin-bottom: 25px; }
  .heading-inline > p { margin-top: 7px !important; max-width: 310px; }
  .feature-grid { grid-template-columns: 1fr; gap: 12px; }
  .feature-card { min-height: 0; padding: 0 17px 19px; display: grid; grid-template-columns: 106px 1fr; grid-template-rows: auto auto auto; column-gap: 15px; align-items: start; }
  .feature-art { grid-row: 1 / 4; width: 106px; height: 106px; margin: 0 0 0 -17px; }
  .feature-index { padding-top: 12px; }
  .feature-card h3, .feature-card-wide h3 { grid-column: 2; font-size: 15px; line-height: 1.45; margin: 5px 0 5px; }
  .feature-card p { grid-column: 2; font-size: 9px; line-height: 1.6; padding-right: 10px; }
  .feature-arrow { right: 13px; bottom: 17px; font-size: 11px; }
  .art-sun { width: 37px; height: 37px; right: 24%; top: 19px; }
  .art-horizon { height: 60px; bottom: -30px; }
  .art-screen { left: 12px; bottom: 11px; padding: 4px 6px; font-size: 6px; }
  .live-screen { width: 76px; height: 57px; padding: 6px; gap: 4px; }
  .live-screen i { width: 59px; left: 8px; top: 13px; }
  .live-screen b { font-size: 7px; }
  .live-screen small { font-size: 5px; }
  .live-signal { top: 25px; right: 24%; }
  .simple-tiles { grid-template-columns: repeat(2,34px); gap: 4px; }
  .simple-tiles span { width: 34px; height: 30px; font-size: 13px; }
  .simple-cursor { right: 21%; bottom: 18px; font-size: 15px; }
  .setup { padding-bottom: 84px; }
  .setup-panel { display: flex; flex-direction: column; align-items: stretch; }
  .setup-copy { padding: 34px 24px 0; }
  .setup-copy h2 { font-size: 35px; }
  .setup-copy > p:not(.eyebrow) { font-size: 10px; }
  .setup-art { height: 255px; }
  .setup-tv { width: 70%; bottom: 68px; right: 11%; }
  .setup-tv-screen > span { font-size: 11px; }
  .setup-tv-screen > i { font-size: 7px; }
  .setup-tv-neck { height: 22px; width: 21px; }
  .setup-tv-foot { width: 61px; }
  .setup-box { width: 95px; height: 17px; bottom: 28px; left: 21%; }
  .setup-box small { font-size: 4px; }
  .setup-cable { bottom: 38px; }
  .tag-tv { right: 12%; top: 8px; }
  .tag-box { left: 20%; bottom: 5px; }
  .buy-section { padding-bottom: 83px; }
  .buy-panel { display: flex; flex-direction: column; align-items: stretch; gap: 25px; padding: 35px 22px; }
  .buy-copy h2 { font-size: 35px; }
  .buy-copy > p:last-child { font-size: 10px; }
  .buy-card { width: 100%; padding: 20px; }
  .faq { display: block; padding-bottom: 88px; }
  .faq-heading { margin-bottom: 20px; }
  .faq-heading h2 { margin-bottom: 3px; }
  .faq-list summary { font-size: 11px; padding: 17px 28px 17px 0; }
  .faq-list details p { font-size: 9px; }
  .closing { min-height: 325px; padding: 67px 20px; }
  .closing h2 { font-size: 33px; }
  .site-footer { padding: 21px 23px; min-height: 0; display: grid; grid-template-columns: 1fr auto; row-gap: 12px; }
  .footer-brand .brand-name { font-size: 12px; }
  .footer-note { display: none; }
  .footer-legal { grid-column: 1; font-size: 8px; }
  .back-top { grid-column: 2; grid-row: 1 / 3; align-self: center; font-size: 9px; }
  .demo-dialog { padding: 16px; }
  .dialog-top h2 { font-size: 16px; }
  .dialog-note { font-size: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}