/* SONYYAR: opt-in television story. Self-contained and free of external libraries. */
.storefront:has(.tv-experience) > main { max-width:none; padding:0; margin:0; }
.storefront:has(.tv-experience) { background:#05090f; }
.tv-experience { color:#f5f9ff; background:#05090f; position:relative; isolation:isolate; font-family:inherit; }
.tv-experience * { box-sizing:border-box; }
.tv-experience :is(h1,h2,h3,p) { color:inherit; }
.tv-scroll-stage { min-height:600vh; position:relative; }
.tv-sticky { height:100svh; min-height:630px; position:sticky; top:0; overflow:hidden; background:radial-gradient(ellipse at 52% 63%,#1d3148 0%,#090f1c 48%,#03070d 85%); }
.tv-ambient { position:absolute; width:46vw; height:46vw; border-radius:50%; filter:blur(90px); pointer-events:none; opacity:.3; }
.tv-ambient-one { background:#2169aa; left:30%; top:10%; } .tv-ambient-two { background:#cf7555; width:22vw; height:22vw; left:55%; top:61%; opacity:.13; }
.tv-grain { position:absolute; inset:0; opacity:.15; pointer-events:none; background-image:radial-gradient(#d3e8ff 0.5px,transparent .5px); background-size:23px 23px; mask-image:linear-gradient(#000,transparent 75%); }
.tv-topline { position:absolute; z-index:30; top:30px; left:max(5vw,22px); right:max(5vw,22px); display:flex; align-items:center; justify-content:space-between; gap:20px; direction:ltr; }
.tv-ident { display:flex; gap:10px; align-items:center; font:700 13px/1.2 ui-sans-serif,system-ui; letter-spacing:.13em; color:#e9f4ff; }
.tv-ident small { color:#8c9db7; font-size:10px; letter-spacing:0; }
.tv-ident-mark { width:15px; height:15px; display:block; border:1px solid #fff; transform:rotate(45deg); background:linear-gradient(135deg,#fff9,#579fd455); }
.tv-topline-note { font-size:11px; color:#adbdcc; letter-spacing:.04em; direction:rtl; }
.tv-motion-toggle { appearance:none; border:1px solid #a9c5e646; background:#ffffff10; border-radius:99px; color:#dceaff; font-size:11px; padding:9px 15px; cursor:pointer; transition:background .2s; }
.tv-motion-toggle:hover,.tv-motion-toggle:focus-visible { background:#ffffff26; }
.tv-stage { position:absolute; inset:0; perspective:1450px; perspective-origin:50% 45%; pointer-events:none; }
.tv-halo { position:absolute; width:min(75vw,850px); height:min(75vw,850px); left:50%; top:46%; transform:translate(-50%,-50%); background:radial-gradient(circle,#82c5fc18,transparent 67%); filter:blur(12px); }
.tv-orbit { position:absolute; width:min(76vw,1000px); aspect-ratio:1; border:1px solid #d5ebff0d; border-radius:50%; top:50%; left:50%; transform:translate(-50%,-50%) rotateX(67deg); }
.tv-orbit-inner { width:min(58vw,730px); border-color:#d5ebff16; }
.tv-device { width:min(67vw,970px); aspect-ratio:16/10; position:absolute; left:50%; top:48%; transform-style:preserve-3d; transform:translate(-50%,-50%) rotateY(0deg) rotateX(2deg) scale(1); will-change:transform; }
.tv-layer { position:absolute; width:88%; height:80%; left:6%; top:6%; transform-style:preserve-3d; will-change:transform; }
.tv-panel-frame,.tv-back-shell,.tv-audio-body,.tv-board,.tv-led-matrix,.tv-diffuser-surface { width:100%; height:100%; position:absolute; overflow:hidden; border-radius:5px; }
.tv-panel-frame { padding:1.6%; background:linear-gradient(145deg,#555d67,#05090f 11%,#080b10 85%,#566277); border:1px solid #9eaab54d; box-shadow:0 0 0 2px #0c151f,0 28px 75px #000b,0 0 65px #73bcfa16; }
.tv-glass { width:100%; height:100%; overflow:hidden; position:relative; background:#0f243d; border:1px solid #56677a; }
.tv-glass img { width:100%; height:100%; object-fit:cover; display:block; }
.tv-glass-glow { position:absolute; inset:0; background:linear-gradient(115deg,#ffffff29,transparent 35%,transparent 74%,#b2d4ff20); pointer-events:none; }
.tv-glass-copy { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; text-align:center; color:#fff; background:linear-gradient(0deg,#060d18a8,#050b1647); text-shadow:0 4px 18px #000a; }
.tv-glass-copy span { font-size:clamp(7px,.75vw,11px); letter-spacing:.36em; direction:ltr; color:#d9eaff; }
.tv-glass-copy strong { font-size:clamp(26px,3.5vw,59px); line-height:1.2; font-weight:850; letter-spacing:-.035em; color:#fff; }
.tv-glass-copy small { font-size:clamp(7px,.8vw,12px); letter-spacing:.12em; }
.tv-frame-brand { position:absolute; bottom:2px; left:50%; transform:translateX(-50%); color:#b3c5d6; font:600 7px system-ui; letter-spacing:2px; }
.tv-back-shell { background:linear-gradient(130deg,#2e3844,#10141b 24%,#242d37 70%,#11151c); border:3px solid #485461; box-shadow:inset 0 0 0 6px #121820,0 16px 44px #000b; }
.tv-back-shell:before { content:""; position:absolute; inset:16%; border:1px solid #73839544; border-radius:2px; background:repeating-linear-gradient(0deg,#ffffff05 0px,#ffffff05 1px,transparent 2px,transparent 11px); }
.tv-vents { position:absolute; width:50%; height:10%; left:25%; bottom:9%; background:repeating-linear-gradient(90deg,#02050a 0 4px,#8a949b26 4px 6px); border:1px solid #8592a02c; }
.tv-screw { position:absolute; width:6px; height:6px; border-radius:50%; background:#8e9bab; box-shadow:inset 0 0 0 2px #303b45; }
.tv-screw-a { top:4%; left:4%; }.tv-screw-b { top:4%; right:4%; }.tv-screw-c { bottom:4%; left:4%; }.tv-screw-d { bottom:4%; right:4%; }
.tv-back-badge { position:absolute; inset:40% 0 auto; text-align:center; font:700 clamp(10px,1.3vw,18px) system-ui; letter-spacing:.2em; color:#c2cbd480; }
.tv-back-badge small { display:block; font-size:6px; margin-top:5px; }
.tv-audio-body { border:1px solid #53657a; background:linear-gradient(110deg,#0d121b,#232d3b 50%,#070d15); box-shadow:inset 0 0 35px #000; }
.tv-audio-body:before { content:""; position:absolute; inset:7%; border:1px solid #3b5560; background:repeating-linear-gradient(90deg,#ffffff03 0 1px,transparent 1px 9px); }
.tv-driver { position:absolute; top:24%; width:18%; aspect-ratio:1; border:7px solid #18232d; border-radius:50%; background:radial-gradient(circle,#1b2738 0 13%,#6c8290 15%,#1b2531 23%,#070b10 40%,#283340 58%,#080d13 68%); box-shadow:0 0 0 3px #6579897d,0 0 22px #000; }
.tv-driver-a { left:9%; }.tv-driver-b { left:41%; }.tv-driver-c { right:9%; }
.tv-audio-name { position:absolute; bottom:9%; left:10%; color:#93b3ce; font:10px system-ui; letter-spacing:.2em; }
.tv-board { background:radial-gradient(ellipse at 45% 42%,#193c43,#091820 68%); border:2px solid #618d90; box-shadow:inset 0 0 0 5px #062020,0 0 40px #0bcbbd20; }
.tv-circuit-grid { position:absolute; inset:0; opacity:.58; background:repeating-linear-gradient(0deg,transparent 0 18px,#4b9d882d 19px,#4b9d882d 20px),repeating-linear-gradient(90deg,transparent 0 18px,#4b9d882d 19px,#4b9d882d 20px); }
.tv-board:after { content:""; position:absolute; inset:10% 8%; background:repeating-linear-gradient(45deg,transparent 0 12px,#9fcfaa48 13px,#9fcfaa48 14px,transparent 15px 22px); opacity:.4; }
.tv-chip { position:absolute; z-index:3; width:23%; aspect-ratio:1; left:38.5%; top:30%; display:flex; align-items:center; justify-content:center; flex-direction:column; background:linear-gradient(145deg,#1b2c37,#04090f); border:7px solid #53646a; box-shadow:0 0 0 7px #121e26,0 12px 30px #000b; font:700 clamp(13px,2.1vw,30px)/1 system-ui; color:#d9f8ff; letter-spacing:.02em; }
.tv-chip span { color:#57ddcf; } .tv-chip small { font-size:clamp(5px,.6vw,9px); color:#62a7ac; margin-top:8px; }
.tv-circuit-path { position:absolute; width:24%; height:23%; border:3px solid #42b1a5; border-top:0; border-left:0; opacity:.6; }
.path-one { left:11%; top:20%; }.path-two { right:14%; top:42%; transform:rotate(180deg); }.path-three { left:36%; bottom:7%; transform:rotate(40deg); }
.tv-resistors { position:absolute; inset:0; background:radial-gradient(circle,#89e4c8 0 2px,transparent 3px) 9px 6px / 24px 25px; opacity:.5; }
.tv-led-matrix { border:2px solid #80bcfc99; box-shadow:0 0 50px #2d8cfb43,inset 0 0 45px #2878cb53; background:radial-gradient(circle,#def8ff 0 2px,#8bd8ff 2.5px,#26639d 4px,#071c36 5px) 0 0 / 16px 16px; }
.tv-led-shine { position:absolute; inset:0; background:linear-gradient(135deg,#ffffff35,transparent 65%); }
.tv-diffuser-surface { border:1px solid #b1e6ffac; background:linear-gradient(115deg,#ffffff22,#83c3ff68 33%,#ffffff35 70%,#51acff52),repeating-linear-gradient(90deg,transparent 0 3px,#ffffff15 4px 5px); box-shadow:0 0 37px #b4ddff32,inset 0 0 70px #abdcff66; backdrop-filter:blur(2px); }
.tv-stand { position:absolute; width:42%; height:25%; bottom:-12%; left:29%; opacity:1; transform:translateZ(-20px); }
.tv-stand:before { content:""; position:absolute; width:5%; height:70%; top:0; left:47.5%; background:linear-gradient(90deg,#222d38,#67798a,#1b2631); }
.tv-stand span { position:absolute; width:100%; height:12%; bottom:0; left:0; border-radius:50% 50% 25% 25%; background:linear-gradient(#5e7185,#1b2632); box-shadow:0 12px 30px #0008; }
.tv-floor { position:absolute; left:50%; bottom:7%; transform:translateX(-50%); width:min(80vw,1050px); height:80px; background:radial-gradient(ellipse,#84bfff39,transparent 65%); filter:blur(22px); }
.tv-chapter { position:absolute; z-index:12; pointer-events:none; }
.tv-chapter-intro { bottom:13%; left:6%; right:6%; display:flex; justify-content:space-between; align-items:flex-end; gap:24px; direction:rtl; }
.tv-intro-head { max-width:520px; }
.tv-kicker,.tv-chapter-index,.tv-eyebrow { font-size:10px; font-weight:700; letter-spacing:.15em; color:#9ddafc; }
.tv-intro-head h1 { font-size:clamp(28px,3.5vw,60px); line-height:1.33; margin:11px 0 12px; color:#f0f9ff; font-weight:850; }
.tv-intro-head h1 em,.tv-story-card h2 em,.tv-after h2 em { font-style:normal; color:#84d9ff; }
.tv-intro-head p { color:#a7baca; font-size:clamp(12px,1.05vw,15px); line-height:1.9; max-width:390px; margin:0; }
.tv-intro-link { pointer-events:auto; color:#f4faff; display:flex; gap:12px; align-items:center; text-decoration:none; white-space:nowrap; font-size:12px; border-bottom:1px solid #ffffff68; padding-bottom:12px; }
.tv-intro-link span { font-size:24px; }
.tv-story { position:absolute; z-index:15; top:30%; right:6%; width:min(350px,30vw); min-height:290px; direction:rtl; }
.tv-story-card { position:absolute; width:100%; top:0; right:0; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(24px); transition:opacity .25s,transform .3s,visibility .3s; }
.tv-story-card[data-active="true"] { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); }
.tv-story-card h2 { color:#f8fdff; font-size:clamp(30px,3.2vw,54px); line-height:1.38; margin:18px 0; font-weight:850; letter-spacing:-.04em; }
.tv-story-card p { font-size:clamp(12px,1.05vw,15px); line-height:2; color:#b1c5d7; max-width:360px; }
.tv-story-label { display:inline-block; margin-top:15px; padding-top:15px; border-top:1px solid #a8cff04d; color:#9cc4df; font:10px system-ui; letter-spacing:.12em; direction:ltr; }
.tv-story-cta { display:inline-flex; align-items:center; gap:15px; text-decoration:none; margin-top:15px; padding:13px 18px; color:#071522; background:#d8f2ff; border-radius:99px; font-size:12px; font-weight:800; }
.tv-scroll-ui { position:absolute; z-index:20; bottom:25px; left:5%; right:5%; display:flex; align-items:center; gap:14px; direction:ltr; font:10px system-ui; color:#d7e9fc91; letter-spacing:.1em; }
.tv-progress-track { flex:1; height:2px; background:#d6ebfa2a; max-width:200px; }
.tv-progress-track i { display:block; width:0; height:100%; background:#97dcff; }
.tv-after { max-width:1440px; padding:130px 5% 145px; margin:auto; }
.tv-after-heading { max-width:800px; }
.tv-after h2 { font-size:clamp(36px,5.5vw,76px); line-height:1.25; font-weight:850; letter-spacing:-.04em; margin:25px 0; }
.tv-after-heading p { max-width:520px; font-size:15px; line-height:2.1; color:#9eafbd; }
.tv-benefit-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:#223143; border:1px solid #223143; margin-top:70px; }
.tv-benefit-grid article { padding:35px 25px 45px; background:#0b111b; min-height:255px; position:relative; }
.tv-benefit-no { font:12px system-ui; color:#719cbb; } .tv-benefit-icon { display:block; margin:24px 0 27px; font-size:29px; color:#90dfff; }
.tv-benefit-grid h3 { font-size:18px; margin:0 0 12px; font-weight:780; } .tv-benefit-grid p { font-size:12px; line-height:2; color:#99aab9; margin:0; }
.tv-products { max-width:1440px; padding:0 5% 130px; margin:auto; }
.tv-products-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:35px; }
.tv-products-heading h2 { font-size:clamp(29px,3.6vw,52px); margin:12px 0 0; }
.tv-products-heading a { color:#cae8ff; text-decoration:none; border-bottom:1px solid #80c4ed77; font-size:13px; padding-bottom:7px; }
.tv-products .product-grid { color:var(--text); }
.tv-experience .studio-sections { padding-bottom:100px; }
.tv-sticky.is-reduced { position:relative; min-height:0; height:auto; padding:95px 5% 35px; overflow:visible; }
.tv-sticky.is-reduced .tv-stage { position:relative; height:min(70vw,530px); inset:auto; margin-top:0; }
.tv-sticky.is-reduced .tv-device { top:46%; transform:translate(-50%,-50%) scale(.9) !important; }
.tv-sticky.is-reduced .tv-layer { transform:translate3d(0,0,0) !important; }
.tv-sticky.is-reduced .tv-stand { opacity:1 !important; }
.tv-sticky.is-reduced .tv-glass-copy { opacity:1 !important; }
.tv-sticky.is-reduced .tv-chapter-intro { position:relative; bottom:auto; left:auto; right:auto; display:block; padding:0; }
.tv-sticky.is-reduced .tv-intro-link { display:none; }
.tv-sticky.is-reduced .tv-story { position:relative; top:auto; right:auto; width:100%; min-height:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:45px; }
.tv-sticky.is-reduced .tv-story-card { position:relative; opacity:1; visibility:visible; pointer-events:auto; transform:none; min-height:235px; border:1px solid #35516a; padding:22px; background:#091522; }
.tv-sticky.is-reduced .tv-story-card h2 { font-size:clamp(23px,2.8vw,39px); margin:10px 0; }
.tv-sticky.is-reduced .tv-story-card p { font-size:12px; }
.tv-sticky.is-reduced .tv-scroll-ui { display:none; }
.tv-scroll-stage.is-reduced { min-height:0; }
.tv-sticky.is-reduced .tv-topline { top:22px; }
@media(max-width:900px) {
 .tv-topline-note { display:none; }
 .tv-device { width:94vw; }
 .tv-story { top:auto; bottom:12%; right:6%; width:72%; min-height:190px; }
 .tv-story-card h2 { font-size:clamp(25px,4.5vw,43px); margin:8px 0; }
 .tv-story-card p { max-width:330px; }
 .tv-chapter-intro { bottom:13%; }
 .tv-benefit-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:600px) {
 .tv-scroll-stage { min-height:620vh; }
 .tv-sticky { min-height:0; }
 .tv-topline { top:18px; left:20px; right:20px; }
 .tv-device { width:110vw; top:38%; }
 .tv-floor { bottom:28%; }
 .tv-chapter-intro { bottom:11%; left:6%; right:6%; display:block; }
 .tv-intro-head h1 { font-size:clamp(29px,8vw,43px); }
 .tv-intro-head p { font-size:12px; }
 .tv-intro-link { display:none; }
 .tv-story { bottom:10%; right:6%; width:88%; min-height:200px; }
 .tv-story-card h2 { font-size:clamp(28px,7vw,39px); margin:8px 0; }
 .tv-story-card p { font-size:12px; line-height:1.9; }
 .tv-scroll-ui { bottom:16px; }
 .tv-scroll-ui>span:first-child { font-size:8px; }
 .tv-after { padding:80px 6%; }
 .tv-benefit-grid { margin-top:38px; gap:1px; }
 .tv-benefit-grid article { padding:23px 15px; min-height:220px; }
 .tv-benefit-grid h3 { font-size:15px; }
 .tv-products { padding:0 6% 80px; }
 .tv-products-heading { align-items:start; flex-direction:column; }
 .tv-sticky.is-reduced .tv-stage { height:45vh; margin-top:10px; }
 .tv-sticky.is-reduced .tv-story { grid-template-columns:1fr; }
 .tv-sticky.is-reduced .tv-story-card { min-height:0; }
}
@media(prefers-reduced-motion:reduce) {
 .tv-device,.tv-layer,.tv-story-card { transition:none !important; will-change:auto; }
}
/* Landscape atmospherics inspired by the approved cinematic TV concept. */
.tv-sticky::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#050a13ee 0%,#080e1fa6 45%,#030710a8 100%),url('images/television/alpine-dusk.svg') center 68% / cover no-repeat; opacity:.28; filter:saturate(.55) blur(4px); pointer-events:none; }
.tv-sticky.is-reduced::before { opacity:.18; }
.tv-experience .tv-story-card a:focus-visible,.tv-experience .tv-story-cta:focus-visible { outline:2px solid #a6edff; outline-offset:4px; }


/* Cinematic 2026 redesign: this entire presentation is independent of
   inherited store variables, including the user's light-mode preference. */
body.storefront:has(.tv-experience) { --primary:#a9dfff; --primary-deep:#a9dfff; --surface:#05090f; --text:#f3f8ff; --muted:#aabbd0; --border:#ffffff24; --panel:#0c1422; background:#05090f; color:#f3f8ff; }
body.storefront:has(.tv-experience) > .announcement,
body.storefront:has(.tv-experience) > .store-header,
body.storefront:has(.tv-experience) > .store-nav-backdrop,
body.storefront:has(.tv-experience) > .mobile-bottom-nav { display:none !important; }
body.storefront:has(.tv-experience) .store-footer { background:#05090f !important; border-top:1px solid #ffffff24 !important; color:#c9d8ea !important; margin-top:0; }
body.storefront:has(.tv-experience) .store-footer :is(a,p,strong,span) { color:inherit; }
body.storefront:has(.tv-experience) #main-content { max-width:none; padding:0; margin:0; }
body.storefront:has(.tv-experience) .tv-experience { --text:#f3f8ff; --muted:#b9c8dc; background:#040811 !important; color:#f3f8ff !important; }
.tv-global-header { position:absolute; top:0; left:0; right:0; height:80px; z-index:60; padding:0 clamp(22px,5vw,80px); display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:35px; direction:ltr; background:linear-gradient(180deg,#02060eea,transparent); }
.tv-global-header a { text-decoration:none; color:#eaf3ff !important; }
.tv-global-logo { font:700 20px/1 ui-sans-serif,system-ui; letter-spacing:.22em; white-space:nowrap; }
.tv-global-logo span { font:500 11px/1.3 Vazirmatn,system-ui; letter-spacing:0; color:#88b7d7; }
.tv-global-links { display:flex; align-items:center; justify-content:center; gap:clamp(14px,2.3vw,44px); direction:rtl; }
.tv-global-links a { font-size:12px; color:#b5c8dd !important; white-space:nowrap; }
.tv-global-links a:hover { color:#fff !important; }
.tv-global-actions { display:flex; gap:15px; align-items:center; direction:rtl; white-space:nowrap; }
.tv-global-actions .tv-account { font-size:12px; }
.tv-global-actions .tv-shop-link { border:1px solid #b8cee3; border-radius:100px; padding:10px 18px; font-size:12px; background:#eef8ff; color:#0a1727 !important; font-weight:800; }
.tv-global-actions .tv-shop-link:hover { background:#c8e9ff; }
.tv-sticky { overflow:hidden; background:radial-gradient(ellipse at 45% 53%,#1b314f 0%,#07101f 54%,#02050d 96%) !important; }
.tv-sticky::before { opacity:.4 !important; filter:saturate(.85) blur(1px) !important; background:linear-gradient(180deg,#020610e3 0%,#06101d57 35%,#020710f0 98%),url('images/television/alpine-dusk.svg') center 58% / cover no-repeat !important; }
.tv-topline { top:93px; }
.tv-stage { perspective:2600px; perspective-origin:49% 46%; }
.tv-device { width:min(66vw,1100px); left:44%; top:44%; }
.tv-layer { width:90%; height:81%; left:5%; top:4%; }
.tv-panel-frame { border-radius:2px; border:1px solid #aac4da91; background:linear-gradient(140deg,#34465d,#05070d 12%,#0c1423 86%,#5c6e80); box-shadow:0 0 0 2px #050b16,0 22px 60px #0009,0 0 100px #7db4ff1d; }
.tv-glass img { filter:saturate(1.15) contrast(1.06); }
.tv-back-shell,.tv-board,.tv-audio-body { overflow:visible; background:transparent; border:0; box-shadow:none; }
.tv-back-shell:before,.tv-vents,.tv-back-badge,.tv-circuit-grid,.tv-board:after,.tv-resistors { display:none !important; }
.tv-technical-image { display:block; width:100%; height:100%; object-fit:contain; max-width:none; filter:drop-shadow(0 18px 28px #000b); user-select:none; }
.tv-board { width:94%; height:78%; left:3%; top:11%; }
.tv-audio-body { width:95%; height:65%; left:2.5%; top:17.5%; }
.tv-back-shell { width:100%; height:100%; }
.tv-led-matrix { box-shadow:0 0 0 5px #0b1622,0 0 50px #52b6fd44,inset 0 0 45px #07132a90; border:3px solid #6ab7f0b8; background:radial-gradient(circle,#f4ffff 0px,#f4ffff 1.35px,#5cbeec 2.2px,#14538c 4px,#071626 5px) 0 0 / 13px 13px; }
.tv-led-controller { position:absolute; bottom:0; left:20%; right:20%; height:8%; background:linear-gradient(90deg,#071a35,#305779,#0a253d); border:1px solid #78afcf; }
.tv-diffuser-surface { backdrop-filter:blur(1px); opacity:.82; background:linear-gradient(110deg,#daeaff48,#81bce562 42%,#ffffff80 65%,#4ca2d34e),repeating-linear-gradient(90deg,transparent 0 8px,#ffffff2b 9px 10px); border:3px solid #b5e9ffb3; }
.tv-component-tag { position:absolute; bottom:-9%; left:50%; transform:translateX(-50%); z-index:8; white-space:nowrap; display:block; padding:9px 18px; border:1px solid #bbdeed7d; color:#fff !important; background:#03101ef0; border-radius:99px; box-shadow:0 8px 24px #000c; font:750 16px/1.6 Vazirmatn,Tahoma,sans-serif; text-align:center; opacity:0; transition:opacity .25s ease; pointer-events:none; }
.tv-experience[data-exploded="true"] .tv-component-tag { opacity:1; }
.tv-engineering-index { position:absolute; z-index:4; left:9%; right:9%; bottom:12%; display:flex; justify-content:center; gap:20px; flex-wrap:wrap; opacity:0; transition:opacity .4s; color:#cce6f9; font-size:12px; pointer-events:none; }
.tv-engineering-index span { padding-inline:12px; border-right:1px solid #a2c8e84c; }
.tv-experience[data-exploded="true"] .tv-engineering-index { opacity:.85; }
.tv-chapter-intro { top:32%; right:5%; bottom:auto; left:auto; max-width:34%; display:block; direction:rtl; text-align:right; }
.tv-intro-head { max-width:100%; }
.tv-intro-head h1 { font-size:clamp(38px,3.4vw,68px); line-height:1.27; text-shadow:0 3px 24px #02050de8; }
.tv-intro-head p { color:#e0eaf4; text-shadow:0 2px 12px #000; }
.tv-intro-link { display:inline-flex; margin-top:24px; }
.tv-story { top:28%; right:5%; width:min(390px,33vw); }
.tv-story-card { background:linear-gradient(115deg,#020711f8 0%,#051122f0 86%); border:1px solid #5d82a75e; border-radius:14px; padding:clamp(18px,2vw,28px); box-shadow:0 18px 60px #000b; backdrop-filter:blur(16px); }
body.storefront .tv-experience .tv-story-card h2,
body.storefront[data-mode=light] .tv-experience .tv-story-card h2 { color:#fff !important; text-shadow:0 2px 12px #030713; }
body.storefront .tv-experience .tv-story-card h2 em { color:#8de0ff !important; }
body.storefront .tv-experience .tv-story-card p { color:#d7e4f2 !important; }
body.storefront .tv-experience .tv-intro-head h1 { color:#fff !important; }
body.storefront .tv-experience :is(.tv-kicker,.tv-chapter-index,.tv-eyebrow) { color:#b2e6ff !important; }
body.storefront .tv-experience .tv-story-cta { background:#e6f6ff !important; color:#08131f !important; }
.tv-scroll-ui { bottom:21px; }
.tv-scroll-ui span { color:#e4f5ff; }
.tv-technology { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:#253243; border-top:1px solid #34485a; border-bottom:1px solid #34485a; }
.tv-experience .tv-tech-card { min-width:0; margin:0 !important; padding:32px 32px 42px !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; background:linear-gradient(150deg,#111d2d,#050b15) !important; color:#f3f7ff !important; }
.tv-tech-art { height:260px; overflow:hidden; position:relative; display:flex; align-items:center; justify-content:center; margin:-32px -32px 28px; background:radial-gradient(ellipse,#203c62,#050d19 69%); }
.tv-tech-art img { width:90%; height:88%; object-fit:contain; filter:drop-shadow(0 0 30px #4f9cff3f); }
.tv-tech-picture { background:linear-gradient(90deg,#02071299,#07121f44),url('images/television/alpine-dusk.svg') center / cover; }
.tv-tech-picture:before { content:""; position:absolute; width:77%; aspect-ratio:16/9; border:8px solid #0b1725; background:url('images/television/alpine-dusk.svg') center/cover; box-shadow:0 0 0 1px #a4bacb,0 12px 36px #000b; transform:perspective(900px) rotateY(-15deg); }
.tv-tech-number { color:#b5dfff; font-size:11px; }
body.storefront .tv-experience .tv-tech-card h2 { color:#fff !important; font-size:clamp(24px,2.25vw,34px); margin:12px 0; line-height:1.45; }
body.storefront .tv-experience .tv-tech-card p { color:#c1d1e4 !important; font-size:13px; line-height:2; }
.tv-tech-card a { display:inline-flex; gap:16px; align-items:center; margin-top:16px; padding-bottom:6px; border-bottom:1px solid #a4cef5; color:#e7f7ff !important; font-size:12px; }
.tv-after { max-width:none; margin:0; padding:125px clamp(25px,6vw,105px) 135px; background:radial-gradient(ellipse at 76% 15%,#152945,#050a13 69%); }
.tv-after-heading { max-width:1100px; }
body.storefront .tv-experience .tv-after h2 { color:#fff !important; }
.tv-after-heading p { color:#c0d0e0 !important; }
.tv-benefit-grid { border:0; background:transparent; gap:10px; }
body.storefront .tv-experience .tv-benefit-grid article { background:#0f1a2a !important; border:1px solid #34495f !important; border-radius:6px !important; box-shadow:none !important; margin:0 !important; color:#fff !important; }
body.storefront .tv-experience .tv-benefit-grid article :is(h3,p) { color:inherit !important; }
body.storefront .tv-experience .tv-benefit-grid article p { color:#bacee0 !important; }
.tv-products { max-width:none; padding:90px clamp(25px,6vw,105px) 140px; background:#090f19; }
body.storefront .tv-experience .tv-products h2 { color:#fff !important; }
.tv-products .product-grid { color:#e1efff; }
.tv-products .product-card { background:#141e2e !important; border-color:#34465f !important; color:#e8f2ff !important; }
.tv-products .product-card h3 { color:#ecf4ff !important; }
.tv-products .product-card p { color:#bacee1 !important; }
.tv-products .product-media { background:#0b1422 !important; }
.tv-products .card-bottom .icon-button { background:#e5f5ff !important; color:#061528 !important; }
.tv-products .product-price { color:#fff !important; }
body.storefront .tv-experience .tv-products-heading a { color:#e3f3ff !important; }
.tv-experience .studio-sections { background:#090f19; color:#eaf3ff; max-width:none; }
.tv-sticky.is-reduced .tv-component-tag,.tv-sticky.is-reduced .tv-engineering-index { opacity:0 !important; }
.tv-sticky.is-reduced .tv-device { left:50%; top:46%; }
.tv-sticky.is-reduced .tv-chapter-intro { max-width:100%; }
.tv-sticky.is-reduced .tv-story { width:100%; }
.tv-sticky.is-reduced .tv-story-card { background:#0b1624 !important; }
@media(max-width:1020px){
 .tv-global-header { gap:14px; height:70px; padding-inline:22px; }
 .tv-global-links { gap:13px; }
 .tv-global-logo { font-size:17px; }
 .tv-global-links a { font-size:11px; }
 .tv-global-actions { gap:8px; }
 .tv-chapter-intro { max-width:38%; }
 .tv-intro-head h1 { font-size:clamp(28px,4.1vw,46px); }
 .tv-technology .tv-tech-art { height:210px; }
}
@media(max-width:760px) {
 .tv-global-header { height:65px; grid-template-columns:1fr auto; }
 .tv-global-links { display:none; }
 .tv-global-actions .tv-account { display:none; }
 .tv-topline { top:78px; }
 .tv-topline-note { display:none; }
 .tv-sticky { height:100svh; }
 .tv-device { width:110vw; left:50%; top:34%; }
 .tv-chapter-intro { top:auto; left:6%; right:6%; bottom:11%; max-width:none; }
 .tv-intro-head h1 { font-size:clamp(30px,7vw,43px); }
 .tv-story { top:auto; right:5%; bottom:9%; width:90%; }
 .tv-story-card { padding:16px 18px; }
 .tv-story-card h2 { font-size:clamp(27px,6.5vw,36px); }
 .tv-story-card p { margin-bottom:0; }
 .tv-component-tag { font-size:12px; bottom:-13%; padding:3px 10px; }
 .tv-engineering-index { display:none; }
 .tv-technology { grid-template-columns:1fr; }
 .tv-tech-art { height:240px !important; }
 .tv-benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .tv-sticky.is-reduced .tv-stage { height:min(65vw,370px); }
 .tv-sticky.is-reduced .tv-topline { top:74px; }
 .tv-sticky.is-reduced { padding-top:135px; }
}
@media(max-width:440px) {
 .tv-global-actions .tv-shop-link { padding:9px 12px; font-size:11px; }
 .tv-global-logo span { display:none; }
 .tv-story { bottom:9%; }
 .tv-story-card h2 { font-size:27px; }
 .tv-story-card p { font-size:11px; }
 .tv-benefit-grid { grid-template-columns:1fr; }
}

/* Prevent the shared .storefront article rule from painting white cards in day mode. */
body.storefront .tv-experience .tv-story-card,
body.storefront[data-mode=light] .tv-experience .tv-story-card {
  margin:0 !important;
  padding:clamp(18px,2vw,28px) !important;
  background:linear-gradient(115deg,#020711fa,#07172bf2) !important;
  border:1px solid #648cb271 !important;
  border-radius:14px !important;
  color:#f8fdff !important;
  box-shadow:0 18px 65px #000b !important;
}
body.storefront .tv-experience .tv-story-card[data-active="true"] {
  opacity:1;
  visibility:visible;
}
@media(max-width:760px) {
  body.storefront .tv-experience .tv-story-card { padding:16px 18px !important; }
}

/* Component-specific showcase lighting; their artwork is intentionally not a
   rectangular simulated display. */
.tv-tech-processor { background:radial-gradient(ellipse at 50% 55%,#1e5a66,#091521 68%,#040a12); }
.tv-tech-processor img { width:94%; height:94%; object-fit:contain; transform:perspective(950px) rotateY(-9deg) rotateX(5deg); filter:drop-shadow(0 12px 35px #00a7a35e); }
.tv-tech-sound { background:radial-gradient(ellipse at 47% 50%,#233956,#08101e 72%); }
.tv-tech-sound img { width:95%; height:95%; object-fit:contain; transform:perspective(950px) rotateY(12deg); filter:drop-shadow(0 12px 37px #3688fb70); }


/* Engineering-level texture for the two transparent optical assemblies. */
.tv-led-matrix,.tv-diffuser-surface {background:transparent !important;border:0 !important;box-shadow:none !important;overflow:visible !important;}
.tv-led-matrix .tv-technical-image {filter:drop-shadow(0 0 18px #39baff95) drop-shadow(0 15px 22px #000b);}
.tv-diffuser-surface .tv-technical-image {filter:drop-shadow(0 0 12px #a7e9ff5e) drop-shadow(0 13px 20px #000a);opacity:.9;}
.tv-device .tv-layer {backface-visibility:visible;transform-origin:center;}
.tv-experience[data-exploded="true"] .tv-component-tag {text-shadow:0 1px 4px #000;}
@media(max-width:760px) {
  .tv-experience[data-exploded="true"] .tv-component-tag {font-size:10px;padding:3px 7px;white-space:nowrap;}
}


/* 2026-10-28: physical assembly + isolated narrative dock.
   Reserve the bottom 230–250px solely for captions, never over the TV parts. */
.tv-sticky:not(.is-reduced) { --tv-caption-space:clamp(215px,26svh,248px); }
.tv-sticky:not(.is-reduced) .tv-stage { inset:0 0 var(--tv-caption-space) 0; perspective:2400px; perspective-origin:50% 46%; }
.tv-sticky:not(.is-reduced) .tv-device { left:50%; top:43%; width:min(60vw,960px); }
.tv-sticky:not(.is-reduced) .tv-floor { bottom:1%; opacity:.7; }
.tv-sticky:not(.is-reduced) .tv-engineering-index { bottom:3%; }

/* The bezel ends 85% down the device: the neck starts at 84.5%.
   This intentionally overlaps the metal bezel by 0.5% to eliminate the
   visible floating gap in both front-facing and rotated views. */
.tv-device .tv-stand {
  top:84.5%;
  bottom:auto;
  left:37%;
  width:26%;
  height:29%;
  opacity:1;
  transform:translateZ(-12px);
  transform-origin:top center;
  pointer-events:none;
}
.tv-device .tv-stand:before {
  content:"";
  position:absolute;
  top:0;
  left:44%;
  width:12%;
  height:83%;
  background:linear-gradient(90deg,#111c2a 0%,#788b9c 45%,#263847 80%,#0c1421 100%);
  border:1px solid #8fa7b963;
  clip-path:polygon(9% 0,91% 0,78% 100%,22% 100%);
  box-shadow:0 12px 24px #0007;
}
.tv-device .tv-stand span {
  position:absolute;
  left:0;
  width:100%;
  bottom:1%;
  height:12%;
  background:linear-gradient(180deg,#64798c 0%,#293b4e 45%,#0a1623 100%);
  border:1px solid #8497a94f;
  border-radius:65% 65% 22% 22%;
  box-shadow:0 8px 18px #0009;
}

/* The scroll story is a separate bottom panel BELOW the bounded 3-D stage.
   It cannot cover the circuit board, acoustics or optical stack. */
.tv-sticky:not(.is-reduced) .tv-story {
  position:absolute;
  inset:auto 0 34px 0;
  width:100%;
  height:calc(var(--tv-caption-space) - 34px);
  min-height:0;
  direction:rtl;
  z-index:22;
  background:linear-gradient(180deg,#060e1b,#091629);
  border-top:1px solid #6286a34b;
  box-shadow:0 -15px 42px #0003;
  pointer-events:none;
}
body.storefront.tv-site .tv-experience .tv-sticky:not(.is-reduced) .tv-story-card {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  margin:0 !important;
  padding:clamp(14px,2.3svh,24px) clamp(20px,6vw,95px) !important;
  display:grid;
  grid-template-columns:minmax(230px,0.9fr) minmax(250px,1.35fr) auto;
  grid-template-rows:24px 1fr;
  gap:0 clamp(20px,3vw,50px);
  align-items:center;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none;
  color:#f3faff !important;
}
.tv-sticky:not(.is-reduced) .tv-story-card .tv-chapter-index { grid-column:1;grid-row:1;align-self:center; }
.tv-sticky:not(.is-reduced) .tv-story-card h2 {
  grid-column:1;grid-row:2;align-self:center;
  margin:0;font-size:clamp(25px,2.7vw,39px);line-height:1.36;
}
.tv-sticky:not(.is-reduced) .tv-story-card p {
  grid-column:2;grid-row:2;align-self:center;
  max-width:600px;
  margin:0;
  line-height:1.85;
  font-size:clamp(12px,1.02vw,15px);
}
.tv-sticky:not(.is-reduced) .tv-story-card .tv-story-label,
.tv-sticky:not(.is-reduced) .tv-story-card .tv-story-cta {
  grid-column:3;grid-row:2;
  justify-self:end;
  align-self:center;
  margin:0;
}
.tv-sticky:not(.is-reduced) .tv-story-card .tv-story-label { white-space:nowrap;font-size:10px; }
.tv-sticky:not(.is-reduced) .tv-scroll-ui {
  z-index:26;
  bottom:10px;
  padding-inline:clamp(18px,5vw,90px);
  left:0;right:0;
}
@media(max-width:920px) {
  .tv-sticky:not(.is-reduced) .tv-device { width:min(77vw,680px);top:43%; }
  body.storefront.tv-site .tv-experience .tv-sticky:not(.is-reduced) .tv-story-card { grid-template-columns:minmax(160px,.9fr) minmax(160px,1.3fr);column-gap:20px; }
  .tv-sticky:not(.is-reduced) .tv-story-card .tv-story-label,
  .tv-sticky:not(.is-reduced) .tv-story-card .tv-story-cta { grid-column:2;grid-row:1;justify-self:end; }
  .tv-sticky:not(.is-reduced) .tv-story-card h2 { font-size:clamp(24px,3.1vw,34px); }
}
@media(max-width:650px) {
  .tv-sticky:not(.is-reduced) { --tv-caption-space:clamp(232px,35svh,275px); }
  .tv-sticky:not(.is-reduced) .tv-device { width:min(97vw,570px);left:50%;top:43%; }
  .tv-sticky:not(.is-reduced) .tv-story { bottom:29px;height:calc(var(--tv-caption-space) - 29px); }
  body.storefront.tv-site .tv-experience .tv-sticky:not(.is-reduced) .tv-story-card {
    grid-template-columns:1fr;
    grid-template-rows:auto auto 1fr;
    align-content:start;
    gap:6px 0;
    padding:12px 20px !important;
  }
  .tv-sticky:not(.is-reduced) .tv-story-card .tv-chapter-index { grid-column:1;grid-row:1; }
  .tv-sticky:not(.is-reduced) .tv-story-card h2 { grid-column:1;grid-row:2;font-size:clamp(22px,5.5vw,31px);line-height:1.32; }
  .tv-sticky:not(.is-reduced) .tv-story-card p { grid-column:1;grid-row:3;font-size:11px;line-height:1.65; }
  .tv-sticky:not(.is-reduced) .tv-story-card .tv-story-label { display:none; }
  .tv-sticky:not(.is-reduced) .tv-story-card .tv-story-cta { grid-column:1;grid-row:3;justify-self:start;align-self:end;padding:7px 13px;font-size:11px; }
  .tv-sticky:not(.is-reduced) .tv-scroll-ui { bottom:7px; }
  .tv-sticky:not(.is-reduced) .tv-component-tag { font-size:10px;bottom:-10%;padding:2px 6px; }
}
/* Reduced-motion/editor fallback remains a full, vertically scrollable page,
   with every chapter visible, rather than an inaccessible scroll animation. */
.tv-sticky.is-reduced .tv-stage { position:relative;inset:auto;height:min(65vw,500px); }
.tv-sticky.is-reduced .tv-device { top:42%;left:50%; }
.tv-sticky.is-reduced .tv-story { background:transparent;box-shadow:none; }


/* Keep the bezel, pedestal and entire exploded assembly above the caption
   boundary even on short laptops, mobile landscape or compact browser windows. */
.tv-sticky:not(.is-reduced) { min-height:0;height:100svh; }
.tv-sticky:not(.is-reduced) .tv-device {
  width:min(60vw,960px,calc((100svh - var(--tv-caption-space) - 56px) * 1.35));
}
@media(max-width:920px) {
  .tv-sticky:not(.is-reduced) .tv-device {
    width:min(77vw,680px,calc((100svh - var(--tv-caption-space) - 45px) * 1.35));
  }
}
@media(max-width:650px) {
  .tv-sticky:not(.is-reduced) .tv-device {
    width:min(97vw,570px,calc((100svh - var(--tv-caption-space) - 38px) * 1.35));
  }
}


/* Detailed internal components: T-CON, IPS pixel matrix and polarizing film. */
.tv-tcon-body,.tv-ips-body,.tv-polarizer-body {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:visible;}
.tv-tcon-body {top:23%;bottom:23%;inset-inline:4%;height:54%;background:transparent;}
.tv-tcon-body .tv-technical-image {filter:drop-shadow(0 14px 21px #000c) drop-shadow(0 0 20px #41cbb146);}
.tv-ips-body img {filter:drop-shadow(0 0 19px #7bc9ff6b) drop-shadow(0 14px 25px #0009);}
.tv-polarizer-body .tv-technical-image {opacity:.76;filter:drop-shadow(0 0 16px #b3dcf87a) drop-shadow(0 12px 18px #0009);}
.tv-technology .tv-tech-card {position:relative;}
.tv-tech-card:after {content:"";position:absolute;inset-inline:31px 31px;bottom:0;height:2px;background:linear-gradient(90deg,#767676,#63c4fa,#9C9C9C);opacity:.75;}
.tv-after {background:radial-gradient(ellipse at 75% 0%,#243e65 0%,#11192c 43%,#080d1a 100%);}
.tv-benefit-grid article:nth-child(odd) {background:linear-gradient(160deg,#192740,#0c1629) !important;}
.tv-benefit-grid article:nth-child(even) {background:linear-gradient(160deg,#2c2038,#101627) !important;}
.tv-benefit-grid article:nth-child(odd) .tv-benefit-icon {color:#95dffc;}
.tv-benefit-grid article:nth-child(even) .tv-benefit-icon {color:#79A8CC;}
.tv-products {background:linear-gradient(165deg,#081426,#1c1931 55%,#080c19);}
.tv-recommended {padding:105px clamp(25px,6vw,105px) 145px;background:linear-gradient(135deg,#171d38,#10213a 48%,#251b36);color:#f4faff;}
.tv-recommended-heading {display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:35px;}
.tv-recommended-heading h2 {font-size:clamp(30px,4vw,57px);margin:12px 0;line-height:1.3;color:#fff;}
.tv-recommended-heading h2 em {font-style:normal;color:#9BC2DF;}
.tv-recommended-heading p {font-size:14px;color:#bcd0e7;max-width:600px;line-height:1.9;}
.tv-recommended-heading>a {font-size:13px;color:#c6eaff !important;white-space:nowrap;border-bottom:1px solid #8cc4ec;padding-bottom:9px;}
.tv-recommended-empty {padding:20px;background:#132c41;color:#dce9f4;border:1px solid #436887;border-radius:14px;grid-column:1/-1;}
.tv-recommended code {direction:ltr;unicode-bidi:isolate;}
.tv-recommended .product-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
@media(max-width:1100px) {.tv-recommended .product-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:650px) {.tv-recommended {padding:70px 6%;}.tv-recommended-heading {display:block;}.tv-recommended-heading>a {display:inline-block;margin-top:14px;}.tv-recommended .product-grid {gap:10px;}}

/* Standalone close-up imagery of IPS subpixels rather than a whole TV. */
.tv-tech-ips {background:radial-gradient(ellipse at 52% 49%,#3a5980,#09182d 75%);}
.tv-tech-ips img {width:94%;height:92%;object-fit:contain;transform:perspective(900px) rotateY(-9deg) rotateX(3deg);filter:drop-shadow(0 16px 28px #060f1a9c) drop-shadow(0 0 23px #4da3ed65);}


/* SONYYAR chrome and hardware: neutral display typography with assured
   readability for the introductory text on the physical glass in both modes. */
.tv-experience .tv-glass-copy {
 background:linear-gradient(180deg,rgba(0,0,0,.47),rgba(0,0,0,.65));
}
body.storefront.tv-site .tv-experience .tv-glass-copy strong,
body.storefront.tv-site .tv-experience .tv-glass-copy :is(span,small) {
 color:#FFFFFF !important;text-shadow:0 3px 13px #000000D9 !important;
}
.tv-ambient-two {background:#B5B5B5 !important;opacity:.07 !important;}
.tv-benefit-grid article:nth-child(odd) {
 background:linear-gradient(155deg,#1D1D1D,#101010) !important;
}
.tv-benefit-grid article:nth-child(even) {
 background:linear-gradient(155deg,#222222,#101010) !important;
}
.tv-benefit-grid article:nth-child(even) .tv-benefit-icon {color:#89BCE0 !important;}
.tv-after {background:radial-gradient(ellipse at 75% 0%,#262626,#080808 70%) !important;}
.tv-products {background:linear-gradient(155deg,#080808,#171717) !important;}
.tv-recommended {background:linear-gradient(135deg,#101010,#252525) !important;}
.tv-recommended-heading h2 em {color:#83B9DF !important;}


/* Preserve the same restrained SONYYAR palette within dark scroll chapters. */
body.storefront.tv-site:not([data-sonyyar-mode=day]) .tv-tech-card {
 background:linear-gradient(155deg,#232323,#101010) !important;
 border-color:#414141 !important;
}
body.storefront.tv-site:not([data-sonyyar-mode=day]) .tv-sticky:not(.is-reduced) .tv-story {
 background:linear-gradient(135deg,#151515,#060606) !important;
 border-color:#444444 !important;
}
body.storefront.tv-site:not([data-sonyyar-mode=day]) .tv-benefit-grid article:nth-child(odd),
body.storefront.tv-site:not([data-sonyyar-mode=day]) .tv-benefit-grid article:nth-child(even) {
 background:linear-gradient(155deg,#222222,#101010) !important;
 border-color:#414141 !important;
}
