@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;800;900&family=Noto+Sans+JP:wght@400;700;900&display=swap');
:root{--blue:#0866f5;--navy:#031b49;--cyan:#20d8ff;--yellow:#ffd52c;--paper:#f5fbff;--ink:#071938}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'Noto Sans JP',sans-serif;background:var(--paper);overflow-x:hidden}a{color:inherit;text-decoration:none}.site-header{height:70px;position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;gap:38px;padding:0 4vw;color:white;background:rgba(3,17,52,.78);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.18)}.brand{font:900 18px Montserrat;letter-spacing:-.03em}.site-header nav{display:flex;gap:28px;margin-left:auto;font-size:12px;font-weight:700}.site-header nav a{opacity:.76}.site-header nav a:hover{opacity:1}.header-cta{border:1px solid white;border-radius:99px;padding:9px 19px;font:800 11px Montserrat;letter-spacing:.12em}.hero{height:min(900px,100vh);min-height:690px;position:relative;display:grid;place-items:center;text-align:center;color:white;background:#006ff5;isolation:isolate}.hero-bg{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(0,62,180,.15),rgba(0,28,100,.6)),url('../steam-assets/library_hero.png') center/cover}.hero:after{content:"";position:absolute;inset:auto 0 0;height:34%;z-index:-1;background:linear-gradient(transparent,var(--paper))}.hero-content{padding-top:45px}.eyebrow,.section-no{font:800 11px Montserrat;letter-spacing:.24em}.hero-logo{display:block;width:min(660px,74vw);height:290px;object-fit:contain;margin:-30px auto -35px;filter:drop-shadow(0 20px 26px rgba(0,20,80,.28))}.lead{font-size:clamp(18px,2.1vw,29px);font-weight:900;line-height:1.7;text-shadow:0 3px 18px rgba(0,20,80,.4)}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:28px}.button{padding:16px 27px;border-radius:99px;font-size:13px;font-weight:900;letter-spacing:.04em;transition:.2s transform,.2s box-shadow}.button:hover{transform:translateY(-3px)}.button.primary{color:#07316c;background:var(--yellow);box-shadow:0 10px 28px rgba(0,20,80,.3)}.button.ghost{color:white;border:1px solid rgba(255,255,255,.8);background:rgba(0,29,90,.2)}.release{font:700 10px Montserrat;letter-spacing:.22em;margin-top:22px;opacity:.7}.scroll-cue{position:absolute;bottom:25px;font:800 9px Montserrat;letter-spacing:.2em}.scroll-cue span{display:block;font-size:18px;margin-top:4px}.section{max-width:1180px;margin:auto;padding:130px 5vw}.about{display:grid;grid-template-columns:.85fr 1.25fr;gap:9vw;align-items:center}.section-no{color:var(--blue);margin-bottom:24px}.section h1,.section h2,.cta-section h2,.info h2{font-size:clamp(38px,5vw,72px);line-height:1.08;letter-spacing:-.06em;margin:0 0 30px;font-weight:900}.section h1 em{font-style:normal;color:var(--blue)}.section-copy>p:not(.section-no){font-size:15px;line-height:2}.tilted-shot{margin:0;transform:rotate(2deg);background:white;padding:10px;border-radius:15px;box-shadow:0 30px 70px rgba(7,44,100,.22)}.tilted-shot img{width:100%;display:block;border-radius:9px}.tilted-shot figcaption{text-align:right;padding:10px 7px 1px;font:800 9px Montserrat;letter-spacing:.2em}.features{max-width:none;background:var(--navy);color:white;padding-left:max(5vw,calc((100vw - 1180px)/2));padding-right:max(5vw,calc((100vw - 1180px)/2))}.features .section-title{display:flex;justify-content:space-between}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:65px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.2)}.feature-grid article{background:var(--navy);padding:45px 38px;min-height:260px}.feature-grid span{font:900 48px Montserrat;color:var(--cyan);opacity:.25}.feature-grid h3{font-size:20px;margin:18px 0}.feature-grid p{font-size:13px;line-height:1.9;opacity:.7}.gallery{max-width:1280px}.gallery-heading{display:flex;align-items:end;justify-content:space-between}.gallery-heading>p{font-size:11px;color:#68809f}.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.shot{border:0;padding:0;background:none;overflow:hidden;border-radius:16px;cursor:pointer;aspect-ratio:16/9}.shot.wide{grid-column:span 2;aspect-ratio:2.3/1}.shot img{width:100%;height:100%;object-fit:cover;transition:.45s transform}.shot:hover img{transform:scale(1.035)}.cta-section{display:grid;grid-template-columns:minmax(230px,420px) 1fr;gap:7vw;align-items:center;max-width:1180px;margin:50px auto 0;padding:70px 7vw;background:linear-gradient(135deg,#ffd939,#ffb914);border-radius:36px}.cta-section img{width:100%;border-radius:50%;box-shadow:0 20px 50px rgba(111,65,0,.22)}.cta-section h2{margin-bottom:12px}.button.dark{background:var(--navy);color:white;box-shadow:none}.cta-section .actions{justify-content:flex-start}.info{max-width:1180px;margin:auto;padding:130px 5vw;display:grid;grid-template-columns:1fr 1fr;gap:7vw}.info dl{margin:0}.info dl div{display:flex;justify-content:space-between;border-top:1px solid #c9d8e8;padding:18px 0}.info dt{font-size:12px;color:#64809d}.info dd{font-weight:700;margin:0;font-size:13px}footer{display:flex;align-items:center;gap:25px;padding:35px 5vw;background:#020f2d;color:white;font-size:11px}footer strong{font:900 16px Montserrat}footer p{opacity:.5;margin-right:auto}footer a{text-transform:uppercase;font-weight:900}dialog{border:0;padding:0;background:transparent;max-width:min(1100px,94vw)}dialog::backdrop{background:rgba(0,10,35,.9)}dialog img{display:block;max-width:100%;max-height:88vh;border-radius:12px}dialog button{position:fixed;right:3vw;top:2vw;border:0;background:none;color:white;font-size:40px;cursor:pointer}
@media(max-width:760px){.site-header nav{display:none}.about,.cta-section,.info{grid-template-columns:1fr}.about{gap:55px}.section{padding:90px 6vw}.hero-logo{height:210px}.lead{font-size:17px}.feature-grid{grid-template-columns:1fr}.feature-grid article{min-height:0}.gallery-grid{grid-template-columns:1fr}.shot.wide{grid-column:auto;aspect-ratio:16/9}.gallery-heading{align-items:start;flex-direction:column}.cta-section{border-radius:0;margin-top:0;padding:70px 10vw}.cta-section img{max-width:280px;margin:auto}.info{padding:90px 7vw}footer{flex-wrap:wrap}footer p{width:100%;order:3}}
.steam-note{margin:13px 0 0;font-size:11px;font-weight:700;letter-spacing:.04em;color:rgba(255,255,255,.86)}
.movie-hero{position:relative;margin-top:0;height:100vh;min-height:620px;background:#020b22;display:grid;place-items:center;overflow:hidden}.movie-hero video{width:100%;height:100%;object-fit:cover;background:#020b22}.trailer-play{position:absolute;display:grid;place-items:center;gap:12px;border:0;background:none;color:white;cursor:pointer;text-shadow:0 2px 18px rgba(0,0,0,.65)}.trailer-play span{display:grid;place-items:center;width:94px;height:94px;padding-left:7px;border:2px solid white;border-radius:50%;font-size:35px;background:rgba(0,24,74,.42);backdrop-filter:blur(7px);box-shadow:0 12px 40px rgba(0,0,0,.32);transition:.2s transform,.2s background}.trailer-play strong{font:800 11px Montserrat;letter-spacing:.22em}.trailer-play:hover span{transform:scale(1.08);background:var(--blue)}.movie-hero.is-playing .trailer-play{display:none}
.feature-grid{grid-template-columns:repeat(2,1fr)}.feature-grid article{padding:0;overflow:hidden}.feature-grid .howto{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}.feature-copy{padding:34px 38px 42px}.feature-grid h3{margin:8px 0 14px}.gallery-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){.movie-hero{height:58vh;min-height:380px;padding-top:70px}.trailer-play span{width:72px;height:72px;font-size:28px}.feature-grid,.gallery-grid{grid-template-columns:1fr}}

/* Additional content */
.hero-bg-character{position:absolute;z-index:-1;width:clamp(300px,42vw,650px);max-height:82%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 28px 34px rgba(0,20,80,.34));opacity:.96}.hero-bg-luma{right:-6%;bottom:-2%;transform:rotate(8deg)}.hero-content{position:relative;z-index:2}.hero-content .hero-logo{position:relative;z-index:3}
.achievements{display:grid;grid-template-columns:.72fr 1.28fr;gap:7vw;align-items:center}.achievement-copy>p:not(.section-no){font-size:15px;line-height:2}.achievement-screen{margin:0;background:white;padding:10px;border-radius:18px;box-shadow:0 30px 70px rgba(7,44,100,.18);transform:rotate(-1deg)}.achievement-screen img{display:block;width:100%;border-radius:11px}
.characters{max-width:none;padding-left:max(5vw,calc((100vw - 1180px)/2));padding-right:max(5vw,calc((100vw - 1180px)/2));background:#e9f8ff}.characters .section-title{display:flex;justify-content:space-between;align-items:start}.character-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:58px}.character-grid article{position:relative;overflow:hidden;border-radius:18px;background:var(--navy);box-shadow:0 18px 38px rgba(7,44,100,.14)}.character-grid img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}.character-grid h3{position:absolute;left:20px;bottom:15px;margin:0;padding:8px 13px;border-radius:8px;color:white;background:rgba(3,17,52,.84);font:900 13px Montserrat;letter-spacing:.08em}
.info dd{max-width:68%;text-align:right}
@media(max-width:760px){.hero-bg-character{width:62vw;max-height:56%;opacity:.88}.hero-bg-luma{right:-24%;bottom:11%}.achievements{grid-template-columns:1fr;gap:45px}.characters .section-title{display:block}.character-grid{grid-template-columns:1fr;gap:14px;margin-top:38px}.info dl div{gap:20px}.info dd{max-width:65%}}

/* Clean hero background: the center character is removed; the side characters remain. */
.hero-bg{background:linear-gradient(180deg,rgba(0,62,180,.08),rgba(0,28,100,.48)),url('assets/background-day.webp') center/cover}
.hero-bg-main{left:-5%;bottom:4%;transform:rotate(-9deg)}
@media(max-width:760px){.hero-bg-main{left:-22%;bottom:17%}}

/* Hero composition adjustments */
.hero-content .hero-logo{transform:translateX(-10vw)}
.hero-bg-main{width:clamp(240px,32vw,500px);left:-3%;bottom:8%}
.hero-bg-luma{width:clamp(520px,60vw,900px);right:-10%;bottom:-8%}
@media(max-width:760px){.hero-content .hero-logo{transform:translateX(-7vw)}.hero-bg-main{width:48vw;left:-17%;bottom:20%}.hero-bg-luma{width:82vw;right:-34%;bottom:8%}}

.hero-bg-luma{width:clamp(650px,72vw,1080px);right:-16%;bottom:7%}
@media(max-width:760px){.hero-bg-luma{width:98vw;right:-42%;bottom:18%}}

/* Align the complete logo/copy group and tighten the space above Luma. */
.hero-content{transform:translateX(-5vw);text-align:center}
.hero-content .hero-logo{transform:none;margin-left:auto;margin-right:auto}
.hero-bg-luma{bottom:13%}
@media(max-width:760px){.hero-content{transform:translateX(-4vw)}.hero-content .hero-logo{transform:none}.hero-bg-luma{bottom:23%}}

.hero-content{transform:translateX(-7vw)}
@media(max-width:760px){.hero-content{transform:translateX(-6vw)}}

.hero-content{transform:translateX(-23vw)}
@media(max-width:760px){.hero-content{transform:translateX(-18vw)}}