/* XALO STUDIO V12 / cinematic universe system — internal pages */
:root{--cinema-rgb:154,216,255;--cinema-rgb2:140,124,255;--cinema-warm-rgb:255,197,143;--cinema-green-rgb:139,245,195}
body.cinematic-universe{position:relative;background:#040609;min-height:100vh;isolation:isolate}
body.cinematic-universe::before{content:"";position:fixed;inset:0;z-index:-5;pointer-events:none;background:radial-gradient(75rem 45rem at 86% -8%,rgba(var(--cinema-rgb2),.09),transparent 67%),radial-gradient(65rem 40rem at 3% 32%,rgba(var(--cinema-rgb),.06),transparent 68%),linear-gradient(180deg,#05080d,#030507 58%,#020305)}
body.cinematic-universe::after{content:"";position:fixed;inset:0;z-index:99990;pointer-events:none;opacity:.075;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E")}
body.cinematic-universe[data-cinema-theme="software"]{--cinema-rgb:124,212,255;--cinema-rgb2:92,154,255}
body.cinematic-universe[data-cinema-theme="games"]{--cinema-rgb:164,133,255;--cinema-rgb2:92,155,255}
body.cinematic-universe[data-cinema-theme="books"]{--cinema-rgb:255,203,155;--cinema-rgb2:171,121,98}
body.cinematic-universe[data-cinema-theme="creative"]{--cinema-rgb:219,255,113;--cinema-rgb2:143,101,255}
body.cinematic-universe[data-cinema-theme="tools"]{--cinema-rgb:137,222,255;--cinema-rgb2:107,143,255}
body.cinematic-universe[data-cinema-theme="digital"]{--cinema-rgb:255,159,205;--cinema-rgb2:147,118,255}
body.cinematic-universe[data-cinema-theme="company"]{--cinema-rgb:161,222,255;--cinema-rgb2:150,132,255}
body.cinematic-universe[data-cinema-theme="support"]{--cinema-rgb:140,245,195;--cinema-rgb2:102,184,255}
body.cinematic-universe[data-cinema-theme="legal"]{--cinema-rgb:170,190,214;--cinema-rgb2:122,137,160}

.cinema-ambient{position:fixed;inset:0;z-index:-4;pointer-events:none;overflow:hidden;contain:paint}
.cinema-ambient span{position:absolute;border-radius:50%;filter:blur(80px);will-change:transform,opacity}
.cinema-ambient .a{width:min(58vw,900px);height:min(58vw,900px);right:-20vw;top:-18vw;background:radial-gradient(circle,rgba(var(--cinema-rgb),.16),rgba(var(--cinema-rgb2),.055) 45%,transparent 72%);animation:cinemaAmbientA 18s ease-in-out infinite alternate}
.cinema-ambient .b{width:min(48vw,760px);height:min(48vw,760px);left:-18vw;top:42vh;background:radial-gradient(circle,rgba(var(--cinema-rgb2),.12),transparent 68%);animation:cinemaAmbientB 22s ease-in-out infinite alternate}
.cinema-ambient .c{width:min(35vw,540px);height:min(35vw,540px);right:18vw;bottom:-20vw;background:radial-gradient(circle,rgba(var(--cinema-rgb),.08),transparent 70%);animation:cinemaAmbientC 16s ease-in-out infinite alternate}
.cinema-scroll-progress{position:fixed;z-index:99991;top:0;left:0;width:100%;height:2px;pointer-events:none;background:linear-gradient(90deg,rgba(var(--cinema-rgb),.95),rgba(255,255,255,.92),rgba(var(--cinema-rgb2),.95));transform:scaleX(var(--cinema-progress,0));transform-origin:left center;box-shadow:0 0 18px rgba(var(--cinema-rgb),.25)}
html[dir="rtl"] .cinema-scroll-progress{transform-origin:right center}

/* unified glass header */
body.cinematic-universe .site-header{transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,backdrop-filter .35s ease}
body.cinematic-universe .site-header.scrolled{background:rgba(3,5,9,.76)!important;backdrop-filter:blur(28px) saturate(145%);-webkit-backdrop-filter:blur(28px) saturate(145%);box-shadow:0 22px 90px rgba(0,0,0,.26);border-color:rgba(255,255,255,.075)!important}
body.cinematic-universe .site-header::after{content:"";position:absolute;left:50%;bottom:-1px;width:min(92vw,1180px);height:1px;transform:translateX(-50%) scaleX(.68);opacity:.35;background:linear-gradient(90deg,transparent,rgba(var(--cinema-rgb),.45),rgba(var(--cinema-rgb2),.36),transparent);transition:.35s ease}
body.cinematic-universe .site-header.scrolled::after{opacity:.75;transform:translateX(-50%) scaleX(1)}
body.cinematic-universe .brand-mark{box-shadow:inset 0 0 30px rgba(255,255,255,.04),0 0 28px rgba(var(--cinema-rgb),.065)}

/* page hero identity */
body.cinematic-universe .page-hero{position:relative;isolation:isolate;min-height:64vh;display:flex;align-items:flex-end;overflow:hidden;padding-top:180px;padding-bottom:86px;background:linear-gradient(180deg,rgba(4,6,10,.35),rgba(4,6,10,.95))!important}
body.cinematic-universe .page-hero::before{content:"";position:absolute;z-index:-2;inset:-24%;pointer-events:none;background:radial-gradient(ellipse at calc(72% + var(--hero-px,0px)) calc(30% + var(--hero-py,0px)),rgba(var(--cinema-rgb),.22),rgba(var(--cinema-rgb2),.075) 30%,transparent 62%),conic-gradient(from 205deg at 62% 38%,transparent 0 28%,rgba(var(--cinema-rgb),.045) 36%,transparent 44% 61%,rgba(var(--cinema-rgb2),.055) 70%,transparent 78%);filter:blur(24px);animation:cinemaHeroDrift 16s ease-in-out infinite alternate}
body.cinematic-universe .page-hero::after{content:attr(data-cinema-word);position:absolute;z-index:-1;right:-.04em;bottom:-.26em;font-family:Syne,Manrope,sans-serif;font-size:clamp(7rem,25vw,24rem);line-height:.8;font-weight:800;letter-spacing:-.09em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.035);opacity:.95;white-space:nowrap;pointer-events:none}
html[dir="rtl"] body.cinematic-universe .page-hero::after{right:auto;left:-.04em}
body.cinematic-universe .page-hero>.shell{position:relative;z-index:2}
body.cinematic-universe .page-hero .eyebrow{display:inline-flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid rgba(var(--cinema-rgb),.16);border-radius:999px;background:rgba(5,9,14,.4);backdrop-filter:blur(12px)}
body.cinematic-universe .page-hero .eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:rgb(var(--cinema-rgb));box-shadow:0 0 18px rgba(var(--cinema-rgb),.7);animation:cinemaPulse 2.6s ease-in-out infinite}
body.cinematic-universe .page-hero h1{position:relative;text-shadow:0 24px 80px rgba(0,0,0,.5);max-width:1050px}
body.cinematic-universe .page-hero h1::after{content:"";display:block;width:min(180px,25vw);height:2px;margin-top:24px;background:linear-gradient(90deg,rgba(var(--cinema-rgb),.95),rgba(var(--cinema-rgb2),.18),transparent);box-shadow:0 0 24px rgba(var(--cinema-rgb),.16)}
html[dir="rtl"] body.cinematic-universe .page-hero h1::after{background:linear-gradient(270deg,rgba(var(--cinema-rgb),.95),rgba(var(--cinema-rgb2),.18),transparent)}
body.cinematic-universe .page-hero p{max-width:760px;text-wrap:pretty}

/* cinematic sections */
body.cinematic-universe main>.section,body.cinematic-universe main>section.section{position:relative;isolation:isolate}
body.cinematic-universe main>.section::before,body.cinematic-universe main>section.section::before{content:"";position:absolute;z-index:-2;width:min(44vw,720px);height:min(44vw,720px);border-radius:50%;right:-20%;top:10%;filter:blur(70px);background:radial-gradient(circle,rgba(var(--cinema-rgb),.055),transparent 70%);pointer-events:none}
body.cinematic-universe .section-head{position:relative}
body.cinematic-universe .section-head::after{content:"";position:absolute;left:0;right:0;bottom:-20px;height:1px;background:linear-gradient(90deg,rgba(var(--cinema-rgb),.26),rgba(255,255,255,.05),transparent)}
html[dir="rtl"] body.cinematic-universe .section-head::after{background:linear-gradient(270deg,rgba(var(--cinema-rgb),.26),rgba(255,255,255,.05),transparent)}

/* cards: contextual glass, understandable visual cues */
body.cinematic-universe .product-card,body.cinematic-universe .release,body.cinematic-universe .feature-panel,body.cinematic-universe .news-card,body.cinematic-universe .cap-card{position:relative;overflow:hidden;isolation:isolate;border-color:rgba(255,255,255,.1);background:linear-gradient(145deg,rgba(15,20,29,.82),rgba(7,10,15,.91));box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 28px 90px rgba(0,0,0,.18);transition:transform .38s cubic-bezier(.2,.8,.2,1),border-color .35s ease,background .35s ease,box-shadow .35s ease}
body.cinematic-universe .product-card::before,body.cinematic-universe .feature-panel::before,body.cinematic-universe .news-card::before{content:"";position:absolute;z-index:-1;width:260px;height:260px;right:-100px;top:-110px;border-radius:50%;background:radial-gradient(circle at center,rgba(var(--card-rgb,var(--cinema-rgb)),.16),transparent 67%);filter:blur(8px);transform:translate3d(calc((var(--card-x,75%) - 75%)*.08),calc((var(--card-y,18%) - 18%)*.08),0);transition:opacity .3s ease}
body.cinematic-universe .product-card::after,body.cinematic-universe .feature-panel::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;background:linear-gradient(118deg,transparent 20%,rgba(255,255,255,.06) 47%,transparent 72%);transform:translateX(-120%);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
@media(hover:hover) and (pointer:fine){body.cinematic-universe .product-card:hover,body.cinematic-universe .release:hover,body.cinematic-universe .feature-panel:hover,body.cinematic-universe .news-card:hover{transform:translateY(-7px);border-color:rgba(var(--cinema-rgb),.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 38px 110px rgba(0,0,0,.3),0 0 0 1px rgba(var(--cinema-rgb),.025)}body.cinematic-universe .product-card:hover::after,body.cinematic-universe .feature-panel:hover::after{transform:translateX(120%)}}
body.cinematic-universe [data-cinema-card="software"]{--card-rgb:125,215,255}
body.cinematic-universe [data-cinema-card="game"]{--card-rgb:161,126,255}
body.cinematic-universe [data-cinema-card="book"]{--card-rgb:255,194,142}
body.cinematic-universe [data-cinema-card="tool"]{--card-rgb:120,225,255}
body.cinematic-universe [data-cinema-card="digital"]{--card-rgb:255,145,200}
body.cinematic-universe [data-cinema-card="creative"]{--card-rgb:216,255,95}
body.cinematic-universe [data-cinema-card] .status{backdrop-filter:blur(10px);background:rgba(4,7,11,.45)}
body.cinematic-universe [data-cinema-card] h3{position:relative;z-index:2}
body.cinematic-universe [data-cinema-card] h3::before{content:"";display:block;width:42px;height:3px;margin-bottom:18px;border-radius:999px;background:linear-gradient(90deg,rgba(var(--card-rgb,var(--cinema-rgb)),.95),transparent);box-shadow:0 0 18px rgba(var(--card-rgb,var(--cinema-rgb)),.18)}
html[dir="rtl"] body.cinematic-universe [data-cinema-card] h3::before{background:linear-gradient(270deg,rgba(var(--card-rgb,var(--cinema-rgb)),.95),transparent)}

/* nested product hero continuity */
body.cinematic-universe .product-hero{position:relative;isolation:isolate;overflow:hidden}
body.cinematic-universe .product-hero::after{content:"";position:absolute;z-index:-2;inset:-20%;background:radial-gradient(circle at 70% 28%,rgba(var(--cinema-rgb),.11),transparent 36%),radial-gradient(circle at 20% 72%,rgba(var(--cinema-rgb2),.075),transparent 42%);filter:blur(30px);animation:cinemaHeroDrift 18s ease-in-out infinite alternate}
body.cinematic-universe .product-keyart{filter:drop-shadow(0 45px 100px rgba(0,0,0,.52))}

/* reveal system */
body.cinematic-universe .cinema-reveal{opacity:0;transform:translate3d(0,24px,0) scale(.992);filter:blur(7px);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.8,.2,1),filter .8s ease}
body.cinematic-universe .cinema-reveal.cinema-visible{opacity:1;transform:none;filter:none}
body.cinematic-universe .cinema-reveal[data-cinema-delay="1"]{transition-delay:.06s}
body.cinematic-universe .cinema-reveal[data-cinema-delay="2"]{transition-delay:.12s}
body.cinematic-universe .cinema-reveal[data-cinema-delay="3"]{transition-delay:.18s}
body.cinematic-universe .cinema-reveal[data-cinema-delay="4"]{transition-delay:.24s}

/* page entry / exit */
.cinema-page-wipe{position:fixed;inset:0;z-index:99998;pointer-events:none;display:grid;place-items:center;background:#020305;transform:translateY(-100%);opacity:0;transition:transform .52s cubic-bezier(.76,0,.24,1),opacity .16s ease}
.cinema-page-wipe::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(var(--cinema-rgb),.12),transparent 43%)}
.cinema-page-wipe::after{content:"XALO STUDIO";font-family:Syne,Manrope,sans-serif;font-size:clamp(1rem,2vw,1.35rem);letter-spacing:.28em;font-weight:800;color:rgba(255,255,255,.78)}
body.cinema-leaving .cinema-page-wipe{transform:translateY(0);opacity:1}

/* footer continuity */
body.cinematic-universe .footer{position:relative;overflow:hidden}
body.cinematic-universe .footer::after{content:"";position:absolute;pointer-events:none;width:50vw;height:50vw;right:-20vw;bottom:-35vw;border-radius:50%;background:radial-gradient(circle,rgba(var(--cinema-rgb),.07),transparent 68%);filter:blur(35px)}

@keyframes cinemaAmbientA{0%{transform:translate3d(-2%,0,0) scale(.95);opacity:.68}100%{transform:translate3d(5%,7%,0) scale(1.1);opacity:1}}
@keyframes cinemaAmbientB{0%{transform:translate3d(0,5%,0) scale(.92);opacity:.55}100%{transform:translate3d(7%,-4%,0) scale(1.08);opacity:.9}}
@keyframes cinemaAmbientC{0%{transform:translate3d(0,0,0) scale(.95)}100%{transform:translate3d(-8%,-5%,0) scale(1.12)}}
@keyframes cinemaHeroDrift{0%{transform:translate3d(-2%,-2%,0) rotate(-2deg) scale(.98)}100%{transform:translate3d(4%,4%,0) rotate(2deg) scale(1.07)}}
@keyframes cinemaPulse{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.18)}}

@media(max-width:820px){body.cinematic-universe .page-hero{min-height:auto;padding-top:150px;padding-bottom:72px}body.cinematic-universe .page-hero::after{font-size:34vw;bottom:-.05em;opacity:.75}.cinema-ambient .a{width:105vw;height:105vw;right:-55vw}.cinema-ambient .b{width:85vw;height:85vw;left:-50vw}.cinema-ambient .c{display:none}}
@media(max-width:520px){body.cinematic-universe .page-hero{padding-top:130px;padding-bottom:58px}body.cinematic-universe .page-hero h1::after{margin-top:18px}body.cinematic-universe .page-hero::after{font-size:42vw}.cinema-ambient span{filter:blur(55px)}}
@media(prefers-reduced-motion:reduce){.cinema-ambient span,body.cinematic-universe .page-hero::before,body.cinematic-universe .page-hero .eyebrow::before,body.cinematic-universe .product-hero::after{animation:none!important}.cinema-page-wipe{display:none!important}body.cinematic-universe .cinema-reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}}

/* V12 full pass — semantic visual symbols */
.cinema-hero-symbol{position:absolute;z-index:-1;right:max(4vw,calc((100vw - 1240px)/2));top:50%;width:min(31vw,390px);aspect-ratio:1;transform:translateY(-48%);display:grid;place-items:center;color:rgba(var(--cinema-rgb),.16);pointer-events:none;filter:drop-shadow(0 0 45px rgba(var(--cinema-rgb),.08));opacity:.88}
.cinema-hero-symbol::before,.cinema-hero-symbol::after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(var(--cinema-rgb),.09)}
.cinema-hero-symbol::before{inset:5%;border-style:dashed;animation:cinemaSymbolSpin 24s linear infinite}.cinema-hero-symbol::after{inset:22%;border-color:rgba(var(--cinema-rgb2),.11);animation:cinemaSymbolSpin 18s linear infinite reverse}
.cinema-hero-symbol svg{width:40%;height:40%;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 18px rgba(var(--cinema-rgb),.12));animation:cinemaSymbolFloat 8s ease-in-out infinite alternate}
html[dir="rtl"] .cinema-hero-symbol{right:auto;left:max(4vw,calc((100vw - 1240px)/2))}
.cinema-card-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;margin-bottom:26px;border:1px solid rgba(var(--card-rgb,var(--cinema-rgb)),.16);background:linear-gradient(145deg,rgba(var(--card-rgb,var(--cinema-rgb)),.085),rgba(255,255,255,.018));color:rgba(var(--card-rgb,var(--cinema-rgb)),.9);box-shadow:inset 0 1px rgba(255,255,255,.05),0 12px 36px rgba(0,0,0,.16);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}
.cinema-card-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
@media(hover:hover) and (pointer:fine){[data-cinema-card]:hover .cinema-card-icon{transform:translateY(-3px) rotate(-2deg);box-shadow:inset 0 1px rgba(255,255,255,.07),0 16px 42px rgba(var(--card-rgb,var(--cinema-rgb)),.08)}}
@keyframes cinemaSymbolSpin{to{transform:rotate(360deg)}}
@keyframes cinemaSymbolFloat{from{transform:translateY(-5px) scale(.98)}to{transform:translateY(7px) scale(1.035)}}
@media(max-width:900px){.cinema-hero-symbol{width:38vw;right:-5vw;opacity:.46}.page-hero>.shell{padding-right:20vw}html[dir="rtl"] .page-hero>.shell{padding-right:0;padding-left:20vw}html[dir="rtl"] .cinema-hero-symbol{left:-5vw}}
@media(max-width:620px){.cinema-hero-symbol{width:54vw;right:-22vw;top:42%;opacity:.22}.page-hero>.shell{padding-right:0}html[dir="rtl"] .page-hero>.shell{padding-left:0}html[dir="rtl"] .cinema-hero-symbol{left:-22vw}.cinema-card-icon{width:46px;height:46px;border-radius:15px;margin-bottom:22px}.cinema-card-icon svg{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){.cinema-hero-symbol::before,.cinema-hero-symbol::after,.cinema-hero-symbol svg{animation:none!important}}
