/* Sundral's cinematic identity. Content is visible before animation loads. */
:root{--night:#08090c;--gold:#d4b98a;--muted:#acb0b8;--line:#dad9e022}
html{scroll-padding-top:156px}
.release-announcement{background:#1b1812}
.release-announcement-inner{padding-block:9px;max-width:1510px}
.release-announcement-copy p{font-size:13px}
.release-announcement-next{display:none}
.release-announcement-label{font-size:10px;letter-spacing:.14em}
.release-announcement-play{border:0;padding:3px 0;min-height:32px;font-size:12px}
.release-announcement-play::after{content:'↗';margin-left:12px}
.site-header{height:78px;background:#08090ce8;border-color:#fff2;transition:background .3s}
.site-nav a{font-size:12px;letter-spacing:.1em}
.site-nav .nav-play{background:transparent;border-color:#d4b98a66;padding:11px 17px}
.hero{min-height:clamp(680px,82svh,950px);background:#030407;isolation:isolate}
.hero-atmosphere{z-index:0;background:radial-gradient(ellipse at 88% 27%,#25344355,transparent 55%),radial-gradient(ellipse at 28% 90%,#5c413528,transparent 60%),#030407}
.hero-atmosphere::before{inset:0;background:linear-gradient(90deg,#030407 10%,#03040799 70%,#030407bb),url('assets/starveil-odyssey.webp') center 28%/cover;opacity:.32;mask-image:linear-gradient(#000,transparent 100%)}
.hero-atmosphere::after{bottom:11%;height:1px;background:linear-gradient(90deg,transparent,#cdb58333,transparent);box-shadow:none}
.hero-inner{z-index:auto;width:min(100% - clamp(44px,9.6vw,172px),1510px);grid-template-columns:1.3fr .85fr;gap:0;padding:78px 0 148px;text-align:left}
.hero-copy{grid-area:1/1;position:relative;z-index:2}
.hero-brand{grid-area:1/2;position:relative;isolation:isolate;mix-blend-mode:screen;margin-left:-40px;transform:translateY(-20px)}
.hero-brand::before{content:'';position:absolute;inset:12%;border-radius:50%;background:radial-gradient(ellipse,#849db516,transparent 68%)}
.hero-logo{width:100%;max-width:660px;margin:0;mix-blend-mode:screen;animation:none;position:relative}
.hero-glint{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;mix-blend-mode:screen;filter:brightness(2);mask-image:linear-gradient(105deg,transparent 42%,#fff 49%,transparent 56%);mask-size:300% 100%;mask-position:100% 0;opacity:.6;animation:emblem-light 10s ease-in-out infinite;animation-play-state:paused;pointer-events:none}
.hero-brand.is-playing .hero-glint{animation-play-state:running}
@keyframes emblem-light{0%,20%{mask-position:100% 0;opacity:0}32%{opacity:.65}52%,100%{mask-position:0 0;opacity:0}}
.hero-kicker{font-size:10px;letter-spacing:.24em;margin-bottom:36px;color:#c4ad86}
.hero h1{font-size:clamp(54px,6.6vw,104px);line-height:1.01;letter-spacing:-.055em}
.hero-line{display:block;white-space:nowrap}
.hero h1 em{color:#d5c3a8;font-weight:400}
.hero-deck{font-size:17px;max-width:360px;line-height:1.7;margin-top:30px;color:#b5b8c0}
.hero-actions{gap:28px;margin-top:32px}
.game-button{border:1px solid #dcc197;background:linear-gradient(120deg,#e4cfad,#c6a772);box-shadow:inset 0 1px #fff5;min-height:52px;font-size:12px;letter-spacing:.11em;transition:background .25s,box-shadow .25s,transform .25s}
.game-button::after{content:'↗';font-size:17px;line-height:1;font-weight:400;margin-left:8px}
.game-button:hover{background:#eed8b4;box-shadow:0 6px 32px #c6a77222;transform:translateY(-2px)}
.text-link{font-size:11px;letter-spacing:.12em}
.text-link::after{content:'↗';font-size:17px}
.hero-release-note{font-size:12px;margin-top:22px;color:#9096a1}
.hero-bottom{height:74px;grid-template-columns:1fr auto;gap:24px;font-size:10px;letter-spacing:.12em;color:#b0b4bd}
.hero-bottom>a{display:flex;align-items:center;gap:22px;min-height:44px}
.hero-bottom>a b{font-size:20px;font-weight:400;color:var(--gold)}
.section-heading{padding-bottom:48px}
.section-heading h2,.studio-section h2,.contact-section h2{letter-spacing:-.045em}
.section-heading-row>p{font-size:16px;max-width:350px}
.games-section{background:#0e1015;padding-block:100px 112px}
.games-heading .section-heading-row{margin-top:26px}
.game-feature{border-color:#d4b98a33;box-shadow:0 30px 75px #0003;grid-template-columns:1.15fr 1fr}
.game-feature-copy{background:radial-gradient(ellipse at 0 0,#45382444,transparent 75%),#13151a}
.game-feature-copy h3{font-size:clamp(43px,4.2vw,68px)}
.game-description{font-size:16px}
.game-details,.play-note{font-size:12px}
.game-feature-art::after{background:linear-gradient(90deg,transparent 70%,#11141a90),linear-gradient(0deg,#080a10b0,transparent 40%)}
.game-grid{gap:32px;margin-top:40px}
.game-card{background:none;border:0}
.game-card-image{height:clamp(300px,27vw,450px);border:1px solid #fff2}
.game-card-copy{padding:30px 0 0;min-height:0}
.game-card-copy h3{font-size:clamp(38px,3.7vw,56px);margin:18px 0}
.game-card-copy p:not(.eyebrow){font-size:15px;max-width:450px}
.game-card-copy .eyebrow{font-size:10px}
.game-card-image img{transition:transform 1.2s cubic-bezier(.22,1,.36,1)}
.game-card:hover img{transform:scale(1.045)}
.worlds-section{padding-block:110px 100px}
.world-index{position:sticky;top:77px;z-index:12;display:grid;grid-template-columns:repeat(4,1fr);background:#0b0e13f2;backdrop-filter:blur(18px);border-top:1px solid #fff2;border-bottom:1px solid #fff2;margin-bottom:28px}
.world-index a{position:relative;display:flex;align-items:center;gap:15px;min-height:64px;padding:12px 20px;font-size:12px;color:#c5c8cd;letter-spacing:.06em;transition:background .3s,color .3s;border-right:1px solid #fff1}
.world-index a:last-child{border-right:0}
.world-index a span{font-size:10px;font-variant-numeric:tabular-nums;color:#898f9b}
.world-index a::after{content:'';position:absolute;inset:auto 0 -1px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s}
.world-index a:hover,.world-index a[aria-current=location]{color:#f4eee4;background:#d4b98a0b}
.world-index a[aria-current=location]::after{transform:scaleX(1)}
.feature-stack,.world-grid{display:grid;grid-template-columns:1fr;gap:28px}
.world-grid{margin-top:28px}
.cinema-world{--world-accent:#dac49a;position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(620px,50vw,820px);border:1px solid #fff2;background:#0c1017;overflow:hidden;scroll-margin-top:164px;cursor:default}
.cinema-world::after{content:'';position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,var(--world-accent),transparent 75%);opacity:.65;z-index:5}
.cinema-world>.feature-image,.cinema-world>.world-card-image{position:absolute;inset:0 0 0 30%;height:auto;z-index:0}
.cinema-world .feature-image img,.cinema-world .world-card-image img{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.cinema-world>.feature-image::after,.cinema-world>.world-card-image::after{z-index:4;background:linear-gradient(90deg,#0c1017 0%,#0c1017bb 17%,#0c101700 52%),linear-gradient(0deg,#080b11b0,transparent 35%)}
.cinema-world .feature-copy,.cinema-world .world-card-copy{position:relative;z-index:5;width:56%;min-height:0;padding:clamp(32px,4.5vw,72px);background:none;pointer-events:none}
.cinema-world .feature-copy::before{display:none}
.cinema-world .feature-copy>* , .cinema-world .world-card-copy>*{pointer-events:auto}
.cinema-world .eyebrow{color:var(--world-accent);font-size:10px;letter-spacing:.19em}
.cinema-world h3,.feature-greywatch h3{margin:30px 0 26px;font-size:clamp(54px,6vw,94px);line-height:1;letter-spacing:-.045em}
.cinema-world h3 em{color:var(--world-accent);font-weight:400}
.cinema-world .feature-description,.cinema-world .world-card-copy>p:not(.eyebrow){max-width:365px;color:#d0d2d7;font-size:16px;line-height:1.8;margin:0}
.cinema-world .feature-note{font-size:12px!important;color:#a5acb7;max-width:320px;margin-top:24px}
.cinema-world .universe-trigger{color:var(--world-accent);border-color:var(--world-accent);font-size:12px;letter-spacing:.08em;margin-top:30px;min-height:48px;text-transform:uppercase;transition:gap .25s}
.universe-trigger::after{content:'↗';font-size:20px;margin-left:8px}
.universe-trigger:hover{gap:30px}
.cinema-world .feature-corner{display:none}
.cinema-world .image-caption{left:auto;right:28px;bottom:27px;font-size:9px;letter-spacing:.19em}
.cinema-world[data-universe=greywatch]{--world-accent:#e5b194;background:#110e0f}
.cinema-world[data-universe=greywatch]>.feature-image::after{background:linear-gradient(90deg,#110e0f,#110e0faa 22%,transparent 60%),linear-gradient(0deg,#100909cc,transparent 50%)}
.cinema-world[data-universe=starveil]{--world-accent:#aacfe3}
.cinema-world[data-universe=starveil]>.world-card-image{inset:0}
.cinema-world[data-universe=starveil]>.world-card-image::after{background:linear-gradient(90deg,#070e18ed,#080e17aa 34%,#080e1700 76%),linear-gradient(0deg,#070d16aa,transparent 60%)}
.cinema-world[data-universe=infinity]{--world-accent:#c4b9ec}
.cinema-world[data-universe=infinity]>.world-card-image::after{background:linear-gradient(90deg,#0c1017,#0c1017a0 26%,transparent 62%),linear-gradient(0deg,#0e0e1ccc,transparent 44%)}
.cinema-world[data-universe=infinity] img{object-position:center 30%}
.starveil-image.world-window>img{animation:none!important;transform:none!important;translate:none!important;transition:none}
.cinema-world .starveil-image img{object-position:center center}
.starveil-lights{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen}
.studio-section{position:relative;background:radial-gradient(ellipse at 82% 5%,#38324435,transparent 60%),#12151b}
.studio-section::before{content:'SUNDRAL';position:absolute;bottom:-.24em;left:0;font:400 clamp(120px,22vw,380px)/1 var(--display);letter-spacing:.04em;color:#ffffff03;pointer-events:none}
.studio-inner{position:relative;padding-block:100px 60px}
.studio-copy p{font-size:16px}
.studio-rule{margin-top:65px;color:#c1c5cf}
.contact-section{padding-block:110px 120px}
.contact-email{transition:color .25s,border-color .25s;border-color:#d4b98a55}
.contact-email:hover{color:#f6dcaf;border-color:#f6dcaf}
.universe-dialog{border-color:#ffffff30;box-shadow:0 30px 160px #000e}
.universe-dialog[open]{animation:dossier-in .38s cubic-bezier(.2,.8,.2,1)}
@keyframes dossier-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.universe-dialog::backdrop{background:#02050bdc;backdrop-filter:blur(12px)}
.universe-dialog-art{height:clamp(190px,30vh,320px)}
.universe-dialog-copy{background:#12161e}
.motion-paused .universe-dialog[open]{animation:none}
@media(min-width:1700px){.hero-brand{margin-left:0}.hero-inner{grid-template-columns:1.2fr 1fr}}
@media(max-width:1100px){.hero h1{font-size:clamp(48px,6.5vw,76px)}.hero-inner{grid-template-columns:1.3fr .8fr}.hero-brand{margin-right:-25px;margin-left:-10px}.cinema-world .feature-copy,.cinema-world .world-card-copy{width:64%;padding:38px}.cinema-world h3,.feature-greywatch h3{font-size:64px}.world-index a{padding-inline:16px;gap:9px}.hero-kicker{font-size:9px;letter-spacing:.15em}.hero-bottom{font-size:9px}}
@media(max-width:760px){
 html{scroll-padding-top:140px}
 .release-announcement-inner{flex-wrap:nowrap;gap:14px;padding-block:9px}.release-announcement-copy p{font-size:11px;line-height:1.5}.release-announcement-label{display:none}.release-announcement-play{font-size:11px;min-height:36px;white-space:nowrap}
 .site-header{height:70px}.site-nav a{font-size:13px}
 .hero{min-height:0}.hero-inner{display:flex;flex-direction:column;gap:0;text-align:center;padding:0 0 36px}
 .hero-brand{order:0;width:230px;margin:-14px auto -24px;transform:none}.hero-logo{width:100%;margin:0}.hero-copy{order:1;width:100%}
 .hero-kicker{justify-content:center;font-size:9px;letter-spacing:.14em;margin-bottom:22px}.hero-kicker .eyebrow-line{width:18px}
 .hero h1{font-size:clamp(38px,8.4vw,64px);line-height:1.06;letter-spacing:-.05em}.hero-deck{font-size:15px;max-width:310px;margin:22px auto 0}
 .hero-actions{justify-content:center;gap:16px 26px;margin-top:27px}.hero-release-note{font-size:11px;max-width:320px;margin:20px auto 0}
 .hero-bottom{position:relative;display:flex;left:auto;right:auto;justify-content:center;height:65px;width:calc(100% - 44px);gap:12px;font-size:9px}.hero-bottom>span{display:none}.hero-bottom>a{gap:8px;letter-spacing:.08em}
 .games-section,.worlds-section{padding-block:64px}.section-heading{padding-bottom:34px}.section-heading-row{margin-top:24px}.section-heading h2,.studio-section h2,.contact-section h2{font-size:clamp(40px,9vw,64px)}.section-heading-row>p{font-size:15px;margin-top:23px}
 .game-feature{display:flex}.game-feature-copy{padding:30px 24px 36px}.game-feature-copy h3{font-size:44px}.game-feature-art{aspect-ratio:16/11}.game-art-overlay{font-size:10px}.game-description{font-size:15px}
 .game-grid{gap:38px;margin-top:38px}.game-card-copy{padding:24px 0 0}.game-card-copy h3{font-size:40px}.game-card-image{height:min(85vw,470px)}
 .world-index{top:69px;margin-inline:-22px;margin-bottom:22px;grid-template-columns:repeat(4,minmax(0,1fr))}.world-index a{min-height:61px;font-size:10px;padding:10px 4px;gap:5px;flex-direction:column;justify-content:center}.world-index a span{font-size:9px}
 .feature-stack,.world-grid{gap:22px}.world-grid{margin-top:22px}
 .cinema-world{display:flex;flex-direction:column;align-items:stretch;min-height:0;scroll-margin-top:148px}
 .cinema-world>.feature-image,.cinema-world>.world-card-image,.cinema-world[data-universe=starveil]>.world-card-image{position:relative;inset:auto;order:0;height:390px;min-height:0;width:100%}
 .cinema-world>.feature-image::after,.cinema-world>.world-card-image::after,.cinema-world[data-universe=greywatch]>.feature-image::after,.cinema-world[data-universe=starveil]>.world-card-image::after,.cinema-world[data-universe=infinity]>.world-card-image::after{background:linear-gradient(0deg,#0c1017,transparent 38%)}
 .cinema-world[data-universe=greywatch]>.feature-image::after{background:linear-gradient(0deg,#110e0f,transparent 38%)}
 .cinema-world[data-universe=starveil]>.world-card-image{height:auto;aspect-ratio:16/10}
 .cinema-world .feature-copy,.cinema-world .world-card-copy{order:1;width:100%;min-height:0;padding:0 26px 34px;margin-top:-8px}
 .cinema-world h3,.feature-greywatch h3{font-size:clamp(44px,10vw,66px);margin:23px 0 21px}.cinema-world .eyebrow{font-size:9px;letter-spacing:.13em;gap:10px}.cinema-world .feature-description,.cinema-world .world-card-copy>p:not(.eyebrow){font-size:15px}.cinema-world .feature-note{font-size:12px!important}.cinema-world .image-caption{right:20px;top:20px;bottom:auto;max-width:75%;font-size:8px}.cinema-world .universe-trigger{font-size:11px;margin-top:23px}
 .studio-inner{padding-block:65px 45px}.studio-copy p{font-size:15px}.studio-rule{margin-top:42px}.contact-section{padding-block:70px 80px}.contact-section>p:not(.eyebrow){font-size:15px}.contact-email{font-size:clamp(20px,5.5vw,34px)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-glint{display:none}.universe-dialog[open]{animation:none}.game-button:hover{transform:none}.game-card:hover img{transform:none}}
