/* XALO STUDIO / V13 — one visual language, many thematic worlds.
   A lightweight progressive enhancement: existing content, navigation and tools remain intact. */
:root{--xs13-curve:cubic-bezier(.22,1,.36,1);--xs13-shell:min(1240px,calc(100% - clamp(32px,6vw,96px)));--xs13-brd:rgba(231,244,255,.12);--xs13-ink:#eaf4ff;--xs13-muted:#aab9c7;--xs13-surface:rgba(10,16,25,.76)}
body.cinematic-universe{--xs13-tone:125,205,255;--xs13-secondary:145,122,255;--xs13-ambient-opacity:.95;--xs13-focal:72% 15%;--xs13-symbol:"✦";--xs13-angle:30deg;background-color:#05080e;color-scheme:dark}
body[data-cinema-theme="software"]{--xs13-tone:111,221,248;--xs13-secondary:70,139,239;--xs13-focal:72% 20%;--xs13-symbol:"⌘"}
body[data-cinema-theme="games"]{--xs13-tone:193,151,255;--xs13-secondary:104,113,247;--xs13-focal:68% 28%;--xs13-symbol:"◇"}
body[data-cinema-theme="books"]{--xs13-tone:237,185,132;--xs13-secondary:166,107,74;--xs13-focal:78% 22%;--xs13-symbol:"◈"}
body[data-cinema-theme="digital"]{--xs13-tone:255,149,197;--xs13-secondary:160,117,242;--xs13-focal:70% 25%;--xs13-symbol:"✧"}
body[data-cinema-theme="creative"]{--xs13-tone:210,241,165;--xs13-secondary:151,128,255;--xs13-focal:82% 19%;--xs13-symbol:"✺"}
body[data-cinema-theme="tools"]{--xs13-tone:124,233,234;--xs13-secondary:107,149,236;--xs13-focal:76% 17%;--xs13-symbol:"⊕"}
body[data-cinema-theme="support"]{--xs13-tone:155,228,192;--xs13-secondary:109,174,215;--xs13-focal:72% 14%;--xs13-symbol:"✳"}
body[data-cinema-theme="journal"]{--xs13-tone:178,196,235;--xs13-secondary:136,162,206;--xs13-focal:77% 21%;--xs13-symbol:"≋"}
body[data-cinema-theme="legal"]{--xs13-tone:156,184,205;--xs13-secondary:123,150,187;--xs13-ambient-opacity:.48;--xs13-focal:76% 15%;--xs13-symbol:"·"}
/* Fixed scene: low layer count, transform-only movement, noninteractive. */
.xs13-scene{position:fixed;inset:0;z-index:-3;overflow:hidden;pointer-events:none;isolation:isolate;contain:paint;opacity:var(--xs13-ambient-opacity)}
.xs13-scene__base{position:absolute;inset:0;background:radial-gradient(ellipse 70% 63% at var(--xs13-focal),rgba(var(--xs13-tone),.12),transparent 70%),radial-gradient(ellipse 60% 48% at 12% 88%,rgba(var(--xs13-secondary),.075),transparent 74%),repeating-linear-gradient(90deg,rgba(255,255,255,.011) 0 1px,transparent 1px 106px),repeating-linear-gradient(0deg,rgba(255,255,255,.008) 0 1px,transparent 1px 106px)}
.xs13-scene__halo{position:absolute;inset:-15%;opacity:.55;background:conic-gradient(from 15deg at 72% 33%,transparent 0 34%,rgba(var(--xs13-tone),.08) 39%,transparent 46% 74%,rgba(var(--xs13-secondary),.07) 81%,transparent 88%);animation:xs13-breathe 28s ease-in-out infinite alternate}
.xs13-scene__ornament{position:absolute;width:min(60vw,760px);aspect-ratio:1;right:-13vw;top:-20vh;opacity:.34;border-radius:50%;border:1px solid rgba(var(--xs13-tone),.28);box-shadow:0 0 0 56px rgba(var(--xs13-tone),.014),0 0 0 115px rgba(var(--xs13-tone),.009),inset 0 0 150px rgba(var(--xs13-tone),.055);transform:rotate(-14deg);animation:xs13-orbit 44s ease-in-out infinite alternate}
.xs13-scene__ornament::before{content:"";position:absolute;inset:11%;border:1px dashed rgba(var(--xs13-tone),.22);border-radius:50%;transform:rotate(22deg)}
.xs13-scene__ornament::after{content:"";position:absolute;inset:34%;border-radius:50%;border:1px solid rgba(var(--xs13-tone),.2);box-shadow:0 0 60px rgba(var(--xs13-secondary),.07)}
/* Per-topic geometry, same spatial and lighting system */
body[data-cinema-theme="software"] .xs13-scene__ornament,body[data-cinema-theme="tools"] .xs13-scene__ornament{border-radius:23%;transform:rotate(-24deg);box-shadow:0 0 0 35px rgba(var(--xs13-tone),.017),0 0 0 87px rgba(var(--xs13-tone),.011),inset 0 0 150px rgba(var(--xs13-tone),.055)}
body[data-cinema-theme="software"] .xs13-scene__ornament::before,body[data-cinema-theme="tools"] .xs13-scene__ornament::before{border-radius:23%}
body[data-cinema-theme="games"] .xs13-scene__ornament{clip-path:polygon(50% 0%,94% 22%,95% 74%,50% 100%,6% 74%,5% 22%);border-radius:0;background:radial-gradient(circle at 50% 50%,rgba(var(--xs13-tone),.12),transparent 70%)}
body[data-cinema-theme="books"] .xs13-scene__ornament{width:min(43vw,520px);aspect-ratio:.72;border-radius:10px;transform:rotate(14deg);border-left:10px solid rgba(var(--xs13-tone),.12);top:-12vh;right:0}
body[data-cinema-theme="creative"] .xs13-scene__ornament{width:min(65vw,900px);aspect-ratio:1.5;top:10vh;border-radius:50%;transform:rotate(-18deg);border-width:2px;opacity:.2}
body[data-cinema-theme="digital"] .xs13-scene__ornament{border-radius:33%;transform:rotate(27deg)}
body[data-cinema-theme="journal"] .xs13-scene__ornament{width:min(40vw,520px);aspect-ratio:.75;top:-20vh;border-radius:4px}
body[data-cinema-theme="legal"] .xs13-scene__ornament{display:none}
/* Shared brand rhythm and clear accessible focus across every section */
body.cinematic-universe h1,body.cinematic-universe h2,body.cinematic-universe h3{font-feature-settings:"kern" 1;text-wrap:balance}
body.cinematic-universe p{overflow-wrap:break-word}
body.cinematic-universe :where(a,button,input,select,textarea):focus-visible{outline:2px solid rgb(var(--xs13-tone));outline-offset:4px}
body.cinematic-universe .site-header{z-index:1500}
body.cinematic-universe .site-header .nav-links a[aria-current="page"],body.cinematic-universe .site-header a[aria-current="page"]{color:#fff!important;text-shadow:0 0 18px rgba(var(--xs13-tone),.5)}
body.cinematic-universe .site-header a[aria-current="page"]::after{opacity:1}
body.cinematic-universe .page-hero,body.cinematic-universe .product-hero,body.cinematic-universe .photo-hero{background-color:transparent!important}
body.cinematic-universe .page-hero::before{background:radial-gradient(ellipse 55% 45% at 73% 36%,rgba(var(--xs13-tone),.2),transparent 72%),conic-gradient(from 224deg at 61% 45%,transparent 0 23%,rgba(var(--xs13-tone),.04) 33%,transparent 43% 68%,rgba(var(--xs13-secondary),.06) 78%,transparent 88%)}
body.cinematic-universe .page-hero h1,body.cinematic-universe .product-hero h1{letter-spacing:-.055em}
body.cinematic-universe .page-hero .eyebrow{border-color:rgba(var(--xs13-tone),.3);background:rgba(7,13,22,.56)}
body.cinematic-universe .page-hero .eyebrow::before{background:rgb(var(--xs13-tone));box-shadow:0 0 20px rgba(var(--xs13-tone),.56)}
body.cinematic-universe .page-hero h1::after{background:linear-gradient(90deg,rgba(var(--xs13-tone),.9),rgba(var(--xs13-secondary),.5),transparent)}
body.cinematic-universe .page-hero p{color:rgba(225,236,245,.83)}
/* Section-to-section visual harmony: no random photo loops or frame-heavy video */
body.cinematic-universe main > .section,body.cinematic-universe main > section.section{position:relative}
body.cinematic-universe main > .section:nth-of-type(even)::before,body.cinematic-universe main > section.section:nth-of-type(even)::before{background:radial-gradient(circle,rgba(var(--xs13-secondary),.075),transparent 72%)}
body.cinematic-universe :is(.product-card,.release,.feature-panel,.news-card,.cap-card,.universe-card,.xalo-editorial-depth){backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
body.cinematic-universe :is(.product-card,.release,.feature-panel,.news-card,.cap-card){border-color:var(--xs13-brd);transition:transform .32s var(--xs13-curve),border-color .28s ease,box-shadow .35s ease}
body.cinematic-universe :is(.product-card,.feature-panel,.news-card,.cap-card):is(:hover,:focus-within){border-color:rgba(var(--xs13-tone),.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 30px 85px rgba(0,0,0,.28)}
body.cinematic-universe .section-head .eyebrow{color:rgb(var(--xs13-tone))}
/* Breadcrumb is inside source page hero: responsive, doesn't cover nav or the body content. */
.xs13-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:11px;margin:0 0 clamp(22px,3vw,36px);font:600 11px/1.5 Manrope,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgba(227,237,248,.66)}
.xs13-crumbs a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.xs13-crumbs a:hover{color:#fff;border-color:rgb(var(--xs13-tone))}
.xs13-crumbs .xs13-sep{color:rgba(var(--xs13-tone),.65)}
.xs13-crumbs [aria-current="page"]{color:rgb(var(--xs13-tone));font-weight:750}
body.cinematic-universe .product-hero .xs13-crumbs{margin-bottom:27px}
/* Cross-page continuity: curated next destinations, a consistent closing chapter. */
.xs13-explore{position:relative;isolation:isolate;width:var(--xs13-shell);max-width:1240px;margin:clamp(56px,8vw,120px) auto 0;padding:clamp(34px,5vw,64px) 0 clamp(66px,9vw,130px);border-top:1px solid rgba(var(--xs13-tone),.22)}
.xs13-explore::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 12% 0%,rgba(var(--xs13-tone),.045),transparent 65%);pointer-events:none}
.xs13-explore__header{display:flex;justify-content:space-between;gap:28px;align-items:flex-end;margin-bottom:32px}
.xs13-explore__eyebrow{display:block;font:700 11px/1.4 Manrope,sans-serif;letter-spacing:.2em;color:rgb(var(--xs13-tone));margin-bottom:16px}
.xs13-explore__header h2{margin:0;font-family:Syne,Manrope,sans-serif;font-size:clamp(1.9rem,4.2vw,3.35rem);letter-spacing:-.06em;line-height:1.09;color:#f0f8ff}
.xs13-explore__header p{color:var(--xs13-muted);font-size:clamp(.89rem,1.3vw,1rem);max-width:340px;line-height:1.7;margin:0}
.xs13-explore__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.8vw,21px)}
.xs13-explore__card{display:flex;min-width:0;min-height:clamp(172px,18vw,220px);flex-direction:column;justify-content:space-between;padding:clamp(22px,2.5vw,32px);border:1px solid rgba(255,255,255,.105);border-radius:22px;background:linear-gradient(146deg,rgba(23,31,45,.8),rgba(6,10,17,.88));text-decoration:none;color:#eef6ff;position:relative;overflow:hidden;transition:transform .3s var(--xs13-curve),border-color .3s,background .3s}
.xs13-explore__card::before{content:"";position:absolute;inset:-30%;z-index:0;background:radial-gradient(circle at 98% 0%,rgba(var(--xs13-tone),.12),transparent 57%);pointer-events:none}
.xs13-explore__card>*{position:relative;z-index:1}
.xs13-explore__card small{color:rgba(var(--xs13-tone),.92);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.xs13-explore__card strong{display:block;font-family:Syne,Manrope,sans-serif;font-size:clamp(1.05rem,1.65vw,1.4rem);letter-spacing:-.03em;line-height:1.4}
.xs13-explore__card .xs13-explore__arrow{align-self:flex-end;color:rgb(var(--xs13-tone));font-size:22px;transition:transform .3s var(--xs13-curve)}
@media(hover:hover){.xs13-explore__card:hover{transform:translateY(-5px);border-color:rgba(var(--xs13-tone),.37)}.xs13-explore__card:hover .xs13-explore__arrow{transform:translate(3px,-3px)}}
html[dir="rtl"] .xs13-explore__card .xs13-explore__arrow{transform:scaleX(-1)}
/* Original brand mark, editor and product art keep their identity; only the journey is shared. */
body.xp-page .xs13-explore{width:min(1120px,calc(100% - clamp(28px,6vw,84px)));margin-top:48px}
body.xp-page .xp-main{padding-bottom:24px}
body.xp-page .xs13-crumbs{margin-bottom:30px}
body[data-cinema-theme="legal"] .xs13-explore{margin-top:56px;padding-bottom:72px}
/* New single-video watch page: video, not decoration, is the primary content */
.xs13-film-hero{padding:clamp(150px,15vw,190px) 0 68px;position:relative}
.xs13-film-hero .xs13-kicker{color:rgb(var(--xs13-tone));font:700 11px Manrope,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.xs13-film-hero h1{font-size:clamp(2.8rem,6.5vw,6.5rem);line-height:1;max-width:1050px;margin:22px 0;letter-spacing:-.07em}
.xs13-film-hero .xs13-film-dek{max-width:730px;color:rgba(228,237,247,.78);font-size:clamp(1rem,1.4vw,1.2rem);line-height:1.8}
.xs13-film-stage{position:relative;max-width:1080px;margin:20px auto 0;padding:clamp(8px,1.1vw,14px);border:1px solid rgba(var(--xs13-tone),.32);border-radius:25px;background:linear-gradient(135deg,rgba(var(--xs13-tone),.085),rgba(2,5,9,.9));box-shadow:0 44px 120px rgba(0,0,0,.42)}
.xs13-film-player{position:relative;aspect-ratio:16/9;width:100%;background:#020306;border-radius:17px;overflow:hidden}
.xs13-film-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.xs13-film-meta{display:flex;justify-content:space-between;gap:24px;align-items:center;margin:24px 0 0;color:var(--xs13-muted);font-size:.9rem;line-height:1.6}
.xs13-film-meta a{color:rgb(var(--xs13-tone))}
.xs13-film-notes{max-width:950px;margin:0 auto;padding:clamp(48px,7vw,95px) 0 12px;display:grid;grid-template-columns:minmax(180px,.55fr) 1fr;gap:clamp(20px,4vw,60px);border-top:1px solid rgba(255,255,255,.1)}
.xs13-film-notes h2{margin:0;font-size:clamp(1.6rem,3vw,2.7rem);letter-spacing:-.055em}
.xs13-film-notes p{margin:0 0 20px;color:rgba(230,238,245,.77);line-height:1.9}
.xs13-film-notes a{color:rgb(var(--xs13-tone))}
/* Tight mobile composition, less memory and paint. */
@media(max-width:900px){.xs13-scene__ornament{width:80vw;right:-44vw;top:-12vh}.xs13-explore__header{align-items:flex-start;flex-direction:column;gap:13px}.xs13-explore__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xs13-explore__card:last-child{grid-column:span 2;min-height:140px}.xs13-film-notes{grid-template-columns:1fr}}
@media(max-width:640px){.xs13-scene__base{background:radial-gradient(ellipse 100% 55% at 100% 0%,rgba(var(--xs13-tone),.1),transparent 80%),linear-gradient(180deg,transparent,rgba(var(--xs13-secondary),.025))}.xs13-scene__ornament{opacity:.14;width:110vw;right:-77vw}.xs13-scene__halo{opacity:.25;animation:none}.xs13-explore{width:calc(100% - 36px);padding-bottom:60px}.xs13-explore__grid{grid-template-columns:1fr;gap:12px}.xs13-explore__card,.xs13-explore__card:last-child{grid-column:auto;min-height:142px;padding:22px;border-radius:18px}.xs13-explore__header h2{font-size:clamp(1.85rem,8vw,2.6rem)}.xs13-crumbs{gap:8px;font-size:10px;margin-bottom:21px}.xs13-film-hero{padding-top:120px;padding-bottom:26px}.xs13-film-stage{padding:5px;border-radius:15px}.xs13-film-player{border-radius:11px}.xs13-film-meta{flex-direction:column;align-items:flex-start;gap:7px}}
@media(prefers-reduced-motion:reduce){.xs13-scene *{animation:none!important;transition:none!important}.xs13-explore__card,.xs13-explore__arrow{transition:none!important;transform:none!important}}
body.xs13-lite .xs13-scene__halo,body.xs13-lite .xs13-scene__ornament{animation:none!important;opacity:.15}body.xs13-lite .xs13-scene__base{background:radial-gradient(ellipse at 70% 10%,rgba(var(--xs13-tone),.065),transparent 80%)}
body.xp-page .xp-record-list a[href="/films/strassensound/"]{border-color:rgba(var(--xs13-tone),.26);background:linear-gradient(100deg,rgba(var(--xs13-tone),.11),transparent)}
body.xp-page .xp-record-list a[href="/films/strassensound/"] b{color:rgb(var(--xs13-tone))}
/* The ambient shapes never create a horizontal document scroll region. */
html:has(body.xs13-experience),body.xs13-experience{overflow-x:clip}
