:root{--ink:#101516;--deep:#171b1a;--brass:#b38a50;--gold:#dfbd7d;--cream:#eee5cf;--paper:#d6cbb4;--rust:#76372d;--teal:#416d67}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--cream);font-family:'Quicksand',sans-serif}a{color:inherit;text-decoration:none}.hero{height:100svh;min-height:650px;position:relative;overflow:hidden;background:#182125}.hero-art{position:absolute;inset:0;background:url('assets/key-art.png') center 38%/cover no-repeat;transform:scale(1.012)}.hero-vignette{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,11,12,.02) 52%,rgba(8,11,12,.94) 100%),linear-gradient(90deg,rgba(8,11,12,.12),transparent 20%,transparent 80%,rgba(8,11,12,.12))}.hero-bottom{position:absolute;bottom:30px;left:5vw;right:5vw;display:flex;justify-content:space-between;align-items:center;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:.25em}.hero-bottom a{padding:11px 0;border-bottom:1px solid var(--brass)}.hero-bottom span{margin-left:14px;color:var(--gold)}.story{min-height:720px;position:relative;display:grid;place-items:center;padding:110px 7vw;overflow:hidden;background:radial-gradient(circle at 12% 50%,rgba(63,109,102,.25),transparent 29%),linear-gradient(125deg,#151918,#282119 65%,#171615)}.deco-rings{position:absolute;width:760px;height:760px;border:1px solid rgba(179,138,80,.22);border-radius:50%;left:-380px;top:50%;transform:translateY(-50%)}.deco-rings:before,.deco-rings:after{content:"";position:absolute;border:1px solid rgba(179,138,80,.22);border-radius:50%;inset:70px}.deco-rings:after{inset:145px}.story-card{max-width:850px;padding:58px 72px;border:1px solid rgba(179,138,80,.48);background:rgba(12,15,14,.6);position:relative;box-shadow:0 25px 80px rgba(0,0,0,.22)}.story-card:before,.story-card:after{content:"◆";position:absolute;left:50%;transform:translateX(-50%);color:var(--gold);background:#1b1b17;padding:0 13px;font-size:13px}.story-card:before{top:-10px}.story-card:after{bottom:-10px}.kicker,.section-heading span,.gallery-head span,.community-copy>span{font-family:'Poppins',sans-serif;color:var(--gold);font-size:10px;letter-spacing:.28em}.kicker b{font-size:8px;margin:0 9px}.story h1,.section-heading h2,.gallery h2,.community h2,.cinematic h2{font-family:'Roboto Slab',serif;font-weight:300}.story h1{font-size:clamp(40px,5vw,69px);line-height:1.05;margin:16px 0 28px;letter-spacing:-.025em}.story h1 strong{font-weight:400;color:var(--gold)}.story p{font-size:17px;line-height:1.8;color:#c8bfac}.story .lead{font-size:23px;line-height:1.55;color:var(--cream);font-weight:500}.cinematic{height:72vh;min-height:560px;position:relative;overflow:hidden}.cinematic img{width:100%;height:100%;object-fit:cover}.cinematic-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,11,11,.82),rgba(8,11,11,.08) 58%)}.cinematic.right .cinematic-shade{background:linear-gradient(270deg,rgba(8,11,11,.82),rgba(8,11,11,.08) 58%)}.cinematic-copy{position:absolute;left:7vw;top:50%;transform:translateY(-50%)}.cinematic.right .cinematic-copy{left:auto;right:7vw;text-align:right}.cinematic small{font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:.34em;color:var(--gold)}.cinematic h2{font-size:clamp(39px,4.5vw,67px);line-height:1.08;margin:13px 0}.trailer,.available{padding:100px 7vw 120px;position:relative;overflow:hidden;background:#171918}.section-heading{text-align:center;margin-bottom:46px}.section-heading h2,.gallery h2,.community h2{font-size:clamp(36px,4.4vw,58px);margin:8px 0 18px;letter-spacing:-.02em}.deco-line{width:150px;height:13px;margin:auto;position:relative}.deco-line:before,.deco-line:after{content:"";position:absolute;top:6px;width:62px;height:1px;background:var(--brass)}.deco-line:before{left:0}.deco-line:after{right:0}.deco-line i{position:absolute;width:8px;height:8px;border:1px solid var(--gold);transform:rotate(45deg);left:71px;top:2px}.video-shell{max-width:1180px;margin:auto;padding:9px;border:1px solid rgba(179,138,80,.55);box-shadow:0 30px 80px #090a0a;position:relative}.video-poster{border:0;padding:0;margin:0;width:100%;aspect-ratio:16/9;display:block;position:relative;cursor:pointer;background:#090b0b;color:white;overflow:hidden}.video-poster>img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.62)}.video-poster:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 0,rgba(0,0,0,.16) 70%)}.play{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%) rotate(45deg);width:92px;height:92px;border:1px solid var(--gold);background:rgba(15,19,18,.72);display:grid;place-items:center;transition:.2s}.play b{font-size:27px;transform:rotate(-45deg);margin-left:6px;font-family:sans-serif}.video-poster em{position:absolute;z-index:2;left:50%;top:calc(50% + 75px);transform:translateX(-50%);font:500 10px 'Poppins',sans-serif;letter-spacing:.3em;font-style:normal}.video-poster:hover .play{background:rgba(179,138,80,.85);transform:translate(-50%,-50%) rotate(45deg) scale(1.06)}#videoMount iframe{width:100%;aspect-ratio:16/9;border:0;display:block}.available{background:radial-gradient(circle at 50% -20%,#493227,#191a18 48%);padding-bottom:105px}.sunburst{position:absolute;width:620px;height:620px;left:50%;top:-450px;transform:translateX(-50%);border:1px solid rgba(179,138,80,.16);border-radius:50%;box-shadow:0 0 0 65px rgba(179,138,80,.035),0 0 0 130px rgba(179,138,80,.025)}.stores{max-width:1050px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;position:relative}.stores a{height:118px;border:1px solid rgba(179,138,80,.45);display:flex;flex-direction:column;gap:11px;align-items:center;justify-content:center;background:rgba(0,0,0,.18);transition:.2s}.stores a:hover{background:rgba(179,138,80,.12);border-color:var(--gold);transform:translateY(-3px)}.stores img{max-width:65%;max-height:48px}.stores span{font-family:'Poppins',sans-serif;font-size:8px;letter-spacing:.22em;color:#a99d89}.gallery{padding:100px 5vw;background:#0d1011}.gallery-head{max-width:1400px;margin:0 auto 36px}.gallery h2{margin:8px 0}.grid{max-width:1400px;margin:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.grid a{overflow:hidden;display:block;aspect-ratio:16/9;border:1px solid #2d3332;background:#111}.grid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s,filter .5s}.grid a:hover img{transform:scale(1.025);filter:brightness(1.08)}.community{padding:100px 8vw;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end;background:linear-gradient(135deg,#35251f,#17201f);border-top:1px solid rgba(179,138,80,.35)}.community h2{margin:7px 0 14px}.community p{color:#c5bdad;font-size:17px;line-height:1.7}.links{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(179,138,80,.5);border-left:1px solid rgba(179,138,80,.5)}.links a{font:500 10px 'Poppins',sans-serif;letter-spacing:.16em;padding:22px;border-right:1px solid rgba(179,138,80,.5);border-bottom:1px solid rgba(179,138,80,.5);display:flex;justify-content:space-between}.links a:hover{background:rgba(179,138,80,.12)}.links b{color:var(--gold)}footer{text-align:center;padding:55px;background:#090b0c;color:#6f7472;font:400 9px 'Poppins',sans-serif;letter-spacing:.2em}footer img{width:180px;height:auto;filter:grayscale(1);opacity:.4;margin-bottom:20px}@media(max-width:800px){.hero{height:72svh;min-height:520px}.hero-art{background-position:center center}.hero-bottom p{display:none}.hero-bottom{justify-content:flex-end}.story{padding:70px 22px;min-height:0}.story-card{padding:40px 27px}.story .lead{font-size:20px}.cinematic{height:55vh;min-height:410px}.cinematic-shade,.cinematic.right .cinematic-shade{background:linear-gradient(0deg,rgba(8,11,11,.9),transparent 72%)}.cinematic-copy,.cinematic.right .cinematic-copy{left:25px;right:25px;top:auto;bottom:32px;transform:none;text-align:left}.trailer,.available{padding:70px 20px}.play{width:70px;height:70px}.video-poster em{top:calc(50% + 58px)}.stores{grid-template-columns:1fr 1fr}.stores a{height:95px}.gallery{padding:70px 12px}.grid{grid-template-columns:1fr}.community{grid-template-columns:1fr;padding:70px 25px;gap:30px}.links{grid-template-columns:1fr 1fr}}
.discord-section{min-height:650px;display:grid;grid-template-columns:1.15fr .85fr;background:#101413;border-top:1px solid rgba(179,138,80,.35)}.discord-art{position:relative;min-height:650px;overflow:hidden}.discord-art img{width:100%;height:100%;object-fit:cover;display:block}.discord-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,#101413 100%),linear-gradient(0deg,rgba(9,12,12,.45),transparent 50%)}.discord-panel{align-self:center;padding:75px 8vw 75px 6vw;position:relative}.discord-panel>span,.utility>span{font:500 10px 'Poppins',sans-serif;letter-spacing:.28em;color:var(--gold)}.discord-panel h2{font:300 clamp(38px,4.2vw,61px)/1.08 'Roboto Slab',serif;margin:10px 0 22px}.discord-panel p{font-size:17px;line-height:1.75;color:#c5bdad;max-width:570px}.discord-cta{margin-top:30px;border:1px solid var(--brass);display:flex;align-items:center;justify-content:space-between;padding:22px 24px;background:rgba(179,138,80,.09);transition:.2s}.discord-cta strong{font:500 11px 'Poppins',sans-serif;letter-spacing:.18em}.discord-cta b{font-size:20px;color:var(--gold)}.discord-cta:hover{background:rgba(179,138,80,.2);border-color:var(--gold);transform:translateY(-2px)}.social-links{display:flex;gap:28px;margin-top:20px}.social-links a{font:500 9px 'Poppins',sans-serif;letter-spacing:.14em;color:#9f9a8e}.social-links a:hover{color:var(--gold)}.utility{padding:35px 8vw;background:#171918;border-top:1px solid rgba(179,138,80,.25);border-bottom:1px solid rgba(179,138,80,.25);display:flex;align-items:center;justify-content:space-between;gap:30px}.utility a{font:500 10px 'Poppins',sans-serif;letter-spacing:.18em;border-bottom:1px solid var(--brass);padding:9px 0}.utility b{color:var(--gold);margin-left:12px}footer{padding:52px 6vw 38px}.footer-logos{max-width:800px;margin:0 auto 34px;display:flex;align-items:center;justify-content:center;gap:58px}.footer-logos img{filter:none;opacity:1;margin:0;width:auto;object-fit:contain}.footer-logos .cb-logo{width:210px;max-height:80px}.footer-logos .iarc-logo{width:57px;max-height:77px}.footer-logos .ontario-logo{width:230px;max-height:100px}footer p{margin:0}@media(max-width:800px){.discord-section{grid-template-columns:1fr}.discord-art{min-height:360px}.discord-art:after{background:linear-gradient(0deg,#101413 0%,transparent 55%)}.discord-panel{padding:20px 25px 65px}.utility{align-items:flex-start;flex-direction:column;padding:30px 25px;gap:15px}.footer-logos{gap:28px;flex-wrap:wrap}.footer-logos .cb-logo{width:170px}.footer-logos .ontario-logo{width:190px}}
/* v5 gallery + footer refinements */
.gallery-head p{max-width:600px;margin:8px 0 0;color:#9f9a8e;font-size:15px;line-height:1.7}.grid{grid-template-columns:repeat(3,1fr)}.gallery-item{appearance:none;border:1px solid #2d3332;padding:0;margin:0;background:#111;overflow:hidden;display:block;aspect-ratio:16/9;cursor:pointer}.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s,filter .5s}.gallery-item:hover img{transform:scale(1.035);filter:brightness(1.09)}.view-gallery{display:flex;align-items:center;gap:16px;margin:28px auto 0;padding:15px 20px;border:1px solid rgba(179,138,80,.55);background:transparent;color:var(--cream);font:500 9px 'Poppins',sans-serif;letter-spacing:.18em;cursor:pointer}.view-gallery b{color:var(--gold);font-size:15px}.view-gallery:hover{background:rgba(179,138,80,.12);border-color:var(--gold)}.lightbox{position:fixed;z-index:1000;inset:0;background:rgba(5,7,7,.96);display:none;align-items:center;justify-content:center;padding:64px 90px}.lightbox.open{display:flex}.no-scroll{overflow:hidden}.lightbox figure{margin:0;max-width:min(1500px,calc(100vw - 180px));width:100%}.lightbox figure img{display:block;width:100%;max-height:calc(100vh - 150px);object-fit:contain}.lightbox figcaption{display:flex;justify-content:space-between;margin-top:14px;color:#898b86;font:500 9px 'Poppins',sans-serif;letter-spacing:.22em}.lightbox-close,.lightbox-nav{position:absolute;border:0;background:transparent;color:var(--cream);cursor:pointer;font-family:'Quicksand',sans-serif}.lightbox-close{right:28px;top:18px;font-size:42px;font-weight:300}.lightbox-nav{top:50%;transform:translateY(-50%);width:60px;height:100px;font-size:60px;color:var(--gold)}.lightbox-nav.prev{left:18px}.lightbox-nav.next{right:18px}.lightbox-nav:hover,.lightbox-close:hover{color:white}.footer-utility{max-width:800px;margin:0 auto 35px;padding-bottom:28px;border-bottom:1px solid rgba(179,138,80,.22);text-align:right}.footer-utility a{font:500 9px 'Poppins',sans-serif;letter-spacing:.18em;color:#a7a297}.footer-utility a:hover{color:var(--gold)}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.lightbox{padding:55px 15px}.lightbox figure{max-width:100%}.lightbox-nav{top:auto;bottom:8px;width:70px;height:55px;font-size:48px}.lightbox-nav.prev{left:20px}.lightbox-nav.next{right:20px}.lightbox figure img{max-height:calc(100vh - 135px)}.footer-utility{text-align:center}}
@media(max-width:560px){.grid{grid-template-columns:1fr}.gallery-item:nth-child(n+5){display:none}}
/* v6 — living title screen */
.hero{--hero-x:0px;--hero-y:0px;--glow-x:0px;--glow-y:0px;isolation:isolate}
.hero-art{transform:translate(var(--hero-x),var(--hero-y)) scale(1.035);animation:heroPush 16s ease-in-out infinite alternate;will-change:transform;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.hero-logo{position:absolute;z-index:4;left:50%;top:7.8%;width:min(57vw,930px);height:auto;transform:translate(-50%,12px) scale(.985);opacity:0;animation:logoReveal 1.35s .28s cubic-bezier(.18,.75,.22,1) forwards;filter:drop-shadow(0 8px 16px rgba(0,0,0,.18));pointer-events:none}
.hero-seal-glow{position:absolute;z-index:2;left:50%;top:52%;width:min(48vw,780px);aspect-ratio:1;transform:translate(calc(-50% + var(--glow-x)),calc(-50% + var(--glow-y)));border-radius:50%;pointer-events:none;transition:transform 1.1s cubic-bezier(.2,.7,.2,1);will-change:transform}
.hero-seal-glow:before,.hero-seal-glow:after,.hero-seal-glow i,.hero-seal-glow b{content:"";position:absolute;border-radius:50%;inset:8%;border:1px solid rgba(247,181,77,.0);box-shadow:0 0 38px rgba(247,157,55,0)}
.hero-seal-glow:before{animation:sealWake 5.8s 1.1s ease-in-out infinite}
.hero-seal-glow:after{inset:18%;animation:sealWake 5.8s 2s ease-in-out infinite}
.hero-seal-glow i{inset:29%;animation:sealWake 5.8s 2.9s ease-in-out infinite}
.hero-seal-glow b{inset:39%;animation:sealWake 5.8s 3.8s ease-in-out infinite}
.trailer-embed{display:block;width:100%;aspect-ratio:16/9;border:0;background:#090b0b}
@keyframes heroPush{from{transform:translate(var(--hero-x),var(--hero-y)) scale(1.025)}to{transform:translate(var(--hero-x),var(--hero-y)) scale(1.055)}}
@keyframes logoReveal{0%{opacity:0;transform:translate(-50%,20px) scale(.97);filter:blur(3px) drop-shadow(0 8px 16px rgba(0,0,0,.18))}100%{opacity:1;transform:translate(-50%,0) scale(1);filter:blur(0) drop-shadow(0 8px 16px rgba(0,0,0,.18))}}
@keyframes sealWake{0%,55%,100%{opacity:0;border-color:rgba(247,181,77,0);box-shadow:0 0 30px rgba(247,157,55,0)}68%{opacity:.42;border-color:rgba(247,181,77,.42);box-shadow:0 0 42px rgba(247,157,55,.16)}82%{opacity:0;border-color:rgba(247,181,77,0);box-shadow:0 0 62px rgba(247,157,55,0)}}
@media(max-width:800px){.hero-logo{top:9%;width:82vw}.hero-seal-glow{width:82vw;top:51%}}
@media(prefers-reduced-motion:reduce){.hero-art,.hero-logo,.hero-seal-glow:before,.hero-seal-glow:after,.hero-seal-glow i,.hero-seal-glow b{animation:none!important}.hero-logo{opacity:1;transform:translate(-50%,0)}.hero-art{transform:scale(1.025)}}

/* v7 hero: preserve the finished key-art composition; motion is atmospheric only. */
.hero{isolation:isolate;background:#10191d}
.hero-art{z-index:0;transform:none!important;animation:none!important;transition:none!important;background-position:center 38%}
.hero-atmosphere{position:absolute;z-index:1;inset:-12%;pointer-events:none;opacity:.22;mix-blend-mode:screen;background:radial-gradient(ellipse at 68% 19%,rgba(173,211,222,.24),transparent 23%),radial-gradient(ellipse at 22% 32%,rgba(223,235,233,.12),transparent 28%),linear-gradient(112deg,transparent 35%,rgba(255,225,168,.08) 49%,transparent 63%);filter:blur(9px);animation:atmosphereDrift 18s ease-in-out infinite alternate}
.hero-light{position:absolute;z-index:2;inset:0;pointer-events:none;overflow:hidden}
.hero-light:before{content:"";position:absolute;left:-38%;top:-25%;width:34%;height:150%;transform:rotate(13deg);background:linear-gradient(90deg,transparent,rgba(255,223,157,.07),rgba(255,245,220,.13),rgba(255,223,157,.05),transparent);filter:blur(14px);animation:heroLightSweep 12s 1.5s ease-in-out infinite}
.hero-light:after{content:"";position:absolute;inset:0;opacity:.055;background-image:repeating-radial-gradient(circle at 20% 30%,rgba(255,255,255,.9) 0 1px,transparent 1px 4px);background-size:7px 7px;animation:grainShift .32s steps(2) infinite}
.hero-vignette{z-index:3;background:linear-gradient(180deg,rgba(8,11,12,.01) 54%,rgba(8,11,12,.93) 100%),linear-gradient(90deg,rgba(8,11,12,.08),transparent 17%,transparent 83%,rgba(8,11,12,.08))}
.hero-bottom{z-index:4;opacity:0;transform:translateY(8px);animation:heroUiReveal .9s .55s ease-out forwards}
.hero-seal-glow,.hero-logo{display:none!important}
@keyframes atmosphereDrift{from{transform:translate3d(-.5%,-.2%,0) scale(1)}to{transform:translate3d(.8%,.45%,0) scale(1.015)}}
@keyframes heroLightSweep{0%,14%{transform:translateX(0) rotate(13deg);opacity:0}25%{opacity:1}52%{transform:translateX(500%) rotate(13deg);opacity:.9}65%,100%{transform:translateX(500%) rotate(13deg);opacity:0}}
@keyframes grainShift{0%{transform:translate(0,0)}25%{transform:translate(-2px,1px)}50%{transform:translate(1px,-2px)}75%{transform:translate(2px,2px)}100%{transform:translate(-1px,-1px)}}
@keyframes heroUiReveal{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.hero-atmosphere,.hero-light:before,.hero-light:after,.hero-bottom{animation:none!important}.hero-bottom{opacity:1;transform:none}}

/* v8 — selective environmental animation. The key art itself remains completely locked. */
.hero{--hero-exit:0;}
.hero-art{filter:brightness(calc(1 - (var(--hero-exit) * .20)));}
.hero-haze{position:absolute;z-index:1;left:-8%;right:-8%;bottom:-10%;height:54%;pointer-events:none;opacity:.34;mix-blend-mode:screen;background:radial-gradient(ellipse at 18% 58%,rgba(174,210,222,.20),transparent 34%),radial-gradient(ellipse at 79% 47%,rgba(204,222,221,.16),transparent 32%),linear-gradient(180deg,transparent 2%,rgba(170,207,217,.08) 46%,rgba(211,225,224,.11) 75%,transparent 100%);filter:blur(18px);animation:heroHazeDrift 12s ease-in-out infinite alternate;transform:translateY(calc(var(--hero-exit) * 26px));}
.hero-atmosphere{opacity:.28;animation:atmosphereDriftV8 14s ease-in-out infinite alternate;transform:translateY(calc(var(--hero-exit) * 12px));}
.hero-emissive{position:absolute;z-index:2;inset:0;pointer-events:none;background:url('assets/hero-grace-lights.png') center 38%/cover no-repeat;mix-blend-mode:screen;opacity:.25;filter:brightness(1.05) saturate(1.15);animation:graceBreathe 4.8s ease-in-out infinite;}
.hero-light{z-index:2;opacity:calc(1 - (var(--hero-exit) * .7));}
.hero-light:before{background:linear-gradient(90deg,transparent,rgba(255,210,130,.08),rgba(255,240,204,.17),rgba(255,205,120,.07),transparent);animation-duration:10.5s;}
.hero-vignette{opacity:calc(1 - (var(--hero-exit) * .08));}
.hero-bottom{transform:translateY(calc(var(--hero-exit) * 18px));opacity:calc(1 - var(--hero-exit));animation:heroUiReveal .9s .55s ease-out backwards;}
.hero:after{content:"";position:absolute;z-index:3;left:0;right:0;bottom:-1px;height:24vh;pointer-events:none;background:linear-gradient(to bottom,transparent,rgba(16,21,22,calc(.10 + var(--hero-exit) * .70)),#101516);opacity:calc(.35 + var(--hero-exit) * .65);}
@keyframes heroHazeDrift{0%{transform:translate3d(-1.4%,1%,0) scale(1.02)}50%{transform:translate3d(.5%,-1.2%,0) scale(1.045)}100%{transform:translate3d(1.5%,.4%,0) scale(1.02)}}
@keyframes atmosphereDriftV8{0%{transform:translate3d(-.8%,-.4%,0) scale(1)}100%{transform:translate3d(1.1%,.7%,0) scale(1.025)}}
@keyframes graceBreathe{0%,100%{opacity:.16;filter:brightness(.95) saturate(1.05) drop-shadow(0 0 0 rgba(255,76,52,0))}42%{opacity:.72;filter:brightness(1.35) saturate(1.4) drop-shadow(0 0 8px rgba(255,76,52,.42))}58%{opacity:.60;filter:brightness(1.22) saturate(1.28) drop-shadow(0 0 5px rgba(255,76,52,.28))}}
@media(prefers-reduced-motion:reduce){.hero-haze,.hero-atmosphere,.hero-emissive{animation:none!important}.hero-emissive{opacity:.28}.hero-art{filter:none}.hero-bottom{opacity:1;transform:none}.hero:after{opacity:.35}}
\n/* v9: pixel-locked hero image + emissive overlay. Both use the exact same replaced-element geometry. */
.hero-art{position:absolute;inset:0;background:none!important;overflow:hidden;z-index:0;filter:brightness(calc(1 - (var(--hero-exit) * .20)))}
.hero-art>img,.hero-emissive>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%;display:block}
.hero-emissive{position:absolute;z-index:2;inset:0;pointer-events:none;background:none!important;mix-blend-mode:screen;opacity:.25;filter:brightness(1.05) saturate(1.15);animation:graceBreathe 4.8s ease-in-out infinite;overflow:hidden}
.hero-emissive>img{filter:none}
@media(prefers-reduced-motion:reduce){.hero-emissive{animation:none!important;opacity:.28}}


/* v10: final selective-animation test.
   The five emissive centers were measured directly from the 1920x1080 key art. */
.hero-emissive{
  opacity:.18;
  filter:none;
  animation:graceBreatheV10 4.6s ease-in-out infinite;
}
@keyframes graceBreatheV10{
  0%,100%{opacity:.12;filter:brightness(.88)}
  48%{opacity:.62;filter:brightness(1.32)}
  62%{opacity:.50;filter:brightness(1.18)}
}

/* Soft illumination over the existing circular structure; no geometry moves. */
.hero-ring-pulse{
  position:absolute;
  z-index:1;
  left:50%;
  top:51.5%;
  width:min(61.5vw,1180px);
  aspect-ratio:1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  pointer-events:none;
  opacity:0;
  box-shadow:
    0 0 45px rgba(222,174,100,.12),
    inset 0 0 48px rgba(222,174,100,.08);
  border:1px solid rgba(222,174,100,.08);
  animation:ringBreatheV10 7.5s ease-in-out infinite;
}
@keyframes ringBreatheV10{
  0%,100%{opacity:.05}
  45%{opacity:.32}
  62%{opacity:.18}
}
@media(max-width:800px){
  .hero-ring-pulse{width:105vw;top:52%}
}
@media(prefers-reduced-motion:reduce){
  .hero-emissive,.hero-ring-pulse{animation:none!important}
  .hero-emissive{opacity:.20}
  .hero-ring-pulse{opacity:.08}
}


/* v13 — original website assets rebuilt as independent cinematic layers.
   Background moves, Grace moves slightly less, title remains completely static. */
.hero-v13-bg{
  position:absolute;
  inset:-6%;
  z-index:0;
  background:
    url("assets/MainMenuBackground1920x1080.png")
    center center / cover no-repeat;
  transform-origin:50% 48%;
  animation:rtgBgPushV13 16s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes rtgBgPushV13{
  0%{transform:scale(1.075) translate3d(0,16px,0)}
  100%{transform:scale(1.015) translate3d(0,-12px,0)}
}

.hero-v13-seal{
  position:absolute;
  z-index:2;
  left:50%;
  top:52%;
  width:min(64vw,850px);
  aspect-ratio:1;
  transform:translate(-50%,-50%) scale(1.025);
  opacity:.96;
  pointer-events:none;
  animation:rtgSealFloatV13 16s ease-in-out infinite alternate;
  will-change:transform;
}
.hero-v13-seal img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 20px 35px rgba(0,0,0,.32));
}
@keyframes rtgSealFloatV13{
  0%{transform:translate(-50%,-50%) scale(1.025)}
  100%{transform:translate(-50%,calc(-50% - 7px)) scale(1.00)}
}

.hero-v13-logo{
  position:absolute;
  z-index:6;
  left:50%;
  top:8.5%;
  width:min(31vw,430px);
  transform:translateX(-50%);
  pointer-events:none;
}
.hero-v13-logo img{
  display:block;
  width:100%;
  height:auto;
  filter:drop-shadow(0 5px 14px rgba(0,0,0,.58));
  image-rendering:auto;
}

.hero-v13-atmosphere{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 55%,rgba(230,167,87,.08),transparent 30%),
    linear-gradient(112deg,transparent 28%,rgba(255,231,184,0) 43%,rgba(255,231,184,.10) 49%,rgba(255,231,184,0) 55%,transparent 70%);
  background-size:100% 100%,220% 100%;
  animation:rtgSweepV13 9s ease-in-out infinite;
}
@keyframes rtgSweepV13{
  0%,58%{background-position:center,120% 0}
  78%,100%{background-position:center,-120% 0}
}

.hero-v13-vignette{
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  background:
    linear-gradient(to bottom,rgba(3,7,11,.16) 0%,transparent 32%,transparent 63%,rgba(3,7,11,.78) 100%),
    radial-gradient(ellipse at center,transparent 43%,rgba(2,5,8,.36) 100%);
}

/* Ensure old hero experiments cannot leak through. */
.hero-art,.hero-haze,.hero-atmosphere,.hero-emissive,.hero-ring-pulse,
.hero-light,.hero-vignette,.hero-particles,.hero-slideshow,.hero-static-logo{
  display:none!important;
}

@media(max-width:800px){
  .hero-v13-logo{top:10%;width:min(56vw,390px)}
  .hero-v13-seal{top:53%;width:min(94vw,720px)}
  .hero-v13-bg{inset:-9%}
}
@media(prefers-reduced-motion:reduce){
  .hero-v13-bg,.hero-v13-seal,.hero-v13-atmosphere{animation:none!important}
}


/* v14 — restore the original hero's oversized logo/medallion composition.
   Motion belongs primarily to the background. */
.hero-v13-bg{
  inset:-6%;
  animation:rtgBgPushV14 16s ease-in-out infinite alternate!important;
}
@keyframes rtgBgPushV14{
  0%   { transform:scale(1.085) translate3d(0,18px,0); }
  100% { transform:scale(1.015) translate3d(0,-14px,0); }
}

/* Grace becomes an architectural/background element again rather than a floating disc. */
.hero-v13-seal{
  left:50%!important;
  top:53%!important;
  width:min(112vw,1500px)!important;
  height:auto!important;
  aspect-ratio:1!important;
  opacity:.98!important;
  transform:translate(-50%,-50%)!important;
  animation:none!important;
}
.hero-v13-seal img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  filter:drop-shadow(0 24px 46px rgba(0,0,0,.30))!important;
}

/* Large, static title like the original landing screen. */
.hero-v13-logo{
  left:50%!important;
  top:7.5%!important;
  width:min(46vw,650px)!important;
  transform:translateX(-50%)!important;
  animation:none!important;
}
.hero-v13-logo img{
  width:100%!important;
  height:auto!important;
  filter:drop-shadow(0 6px 18px rgba(0,0,0,.56))!important;
}

/* Keep atmosphere behind the title but over the environmental layers. */
.hero-v13-atmosphere{z-index:3!important}
.hero-v13-vignette{z-index:4!important}
.hero-v13-logo{z-index:6!important}

@media(max-width:1100px){
  .hero-v13-seal{width:min(132vw,1400px)!important;top:54%!important}
  .hero-v13-logo{width:min(58vw,610px)!important}
}
@media(max-width:800px){
  .hero-v13-bg{inset:-10%!important}
  .hero-v13-seal{width:165vw!important;top:55%!important}
  .hero-v13-logo{top:9%!important;width:min(76vw,560px)!important}
}


/* v17 — high-resolution logo can now carry the larger original hero scale. */
.hero-v13-logo{
  top:5.5%!important;
  width:min(62vw,880px)!important;
}
@media(max-width:1100px){
  .hero-v13-logo{
    top:6.5%!important;
    width:min(70vw,800px)!important;
  }
}
@media(max-width:800px){
  .hero-v13-logo{
    top:8%!important;
    width:min(88vw,700px)!important;
  }
}


/* v18 — match the approved hero composition:
   oversized medallion filling the viewport, logo overlapping its upper arc.
   Background alone provides the cinematic push/pull. */
.hero-v13-seal{
  left:50%!important;
  top:55%!important;
  width:min(104vw,1400px)!important;
  height:auto!important;
  aspect-ratio:1!important;
  opacity:1!important;
  transform:translate(-50%,-50%)!important;
  animation:none!important;
}
.hero-v13-seal img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  filter:drop-shadow(0 22px 42px rgba(0,0,0,.30))!important;
}

.hero-v13-logo{
  left:50%!important;
  top:1.5%!important;
  width:min(48vw,650px)!important;
  transform:translateX(-50%)!important;
  animation:none!important;
  z-index:6!important;
}
.hero-v13-logo img{
  width:100%!important;
  height:auto!important;
  filter:drop-shadow(0 6px 16px rgba(0,0,0,.55))!important;
}

/* Keep the v14 background-only camera motion. */
.hero-v13-bg{
  inset:-6%!important;
  animation:rtgBgPushV18 16s ease-in-out infinite alternate!important;
}
@keyframes rtgBgPushV18{
  0%   {transform:scale(1.085) translate3d(0,18px,0)}
  100% {transform:scale(1.015) translate3d(0,-14px,0)}
}

@media(max-width:1100px){
  .hero-v13-seal{
    width:min(116vw,1300px)!important;
    top:55%!important;
  }
  .hero-v13-logo{
    top:2.5%!important;
    width:min(56vw,620px)!important;
  }
}
@media(max-width:800px){
  .hero-v13-seal{
    width:150vw!important;
    top:56%!important;
  }
  .hero-v13-logo{
    top:4%!important;
    width:min(76vw,580px)!important;
  }
}


/* v19 — compensate for the large transparent canvas in the new 2000x1280 logo.
   The CSS image box was large in v18, but the visible artwork occupies only part of it. */
.hero-v13-logo{
  top:-9%!important;
  width:min(82vw,1120px)!important;
}
@media(max-width:1100px){
  .hero-v13-logo{
    top:-7%!important;
    width:min(92vw,1050px)!important;
  }
}
@media(max-width:800px){
  .hero-v13-logo{
    top:-3%!important;
    width:118vw!important;
    max-width:none!important;
  }
}