:root{
  --bg-top:#112022;
  --bg-bottom:#27322b;
  --ink:#f4f6fb;
  --muted:#a6b6ad;
  --hair:rgba(180,200,185,0.14);
  --candle:#e9b84a;
  --candle-bright:#f4c869;
  --link:#ff4d4d;
  --link-hover:#ff6b6b;
  --link-visited:#c50000;
  --btn-ink:#12201b;
  --font-en:"Space Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-jp:"Noto Sans JP", system-ui, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  --font:var(--font-en);
}
html[lang="ja"]{ --font:var(--font-jp); }

*{box-sizing:border-box; margin:0; padding:0}
body{
  font-family:var(--font);
  color:var(--ink);
  background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%) var(--bg-top);
  background-attachment:fixed;
  min-height:100vh;
  display:flex; flex-direction:column; align-items:center;
  -webkit-font-smoothing:antialiased;
}

/* ---- language switch ---- */
.langbar{
  position:fixed; top:16px; right:16px; z-index:10;
  display:flex; gap:2px; padding:4px;
  background:rgba(0,0,0,.28); border:1px solid var(--hair);
  border-radius:999px; backdrop-filter:blur(6px);
}
.langbar a, .langbar span{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:28px; border-radius:999px;
  font-size:1.05rem; line-height:1; text-decoration:none;
  transition:background .15s ease, opacity .15s ease;
}
.langbar a{opacity:.5}
.langbar a:hover{opacity:1; background:rgba(255,255,255,.06)}
.langbar a:focus-visible{outline:2px solid var(--candle-bright); outline-offset:2px}
.langbar .active{background:var(--candle); opacity:1}

/* ---- landing ---- */
main.landing{
  position:relative; z-index:1;
  width:100%; max-width:760px; flex:1;
  padding:clamp(40px,7vw,84px) 22px 40px;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:clamp(26px,4.5vw,44px);
}
.game-logo{width:min(440px,82%); height:auto; display:block; filter:drop-shadow(0 6px 30px rgba(0,0,0,.5))}
.trailer{
  width:100%; aspect-ratio:16/9; border-radius:14px; overflow:hidden;
  border:1px solid rgba(233,184,74,.28); box-shadow:0 20px 60px rgba(0,0,0,.5); background:#000;
}
.trailer iframe{width:100%; height:100%; border:0; display:block}
.cta{
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:clamp(1rem,2.4vw,1.18rem); letter-spacing:.01em;
  color:var(--btn-ink); background:var(--candle);
  padding:.95em 1.8em; border-radius:999px; text-decoration:none;
  box-shadow:0 10px 30px rgba(233,184,74,.28);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.cta:hover{background:var(--candle-bright); transform:translateY(-2px); box-shadow:0 16px 40px rgba(233,184,74,.42)}
.cta:focus-visible{outline:3px solid var(--candle-bright); outline-offset:3px}
.presskit{
  color:var(--link); text-decoration:none; font-weight:500; font-size:.98rem; letter-spacing:.02em;
  border-bottom:1px solid var(--hair); padding-bottom:2px; transition:color .18s, border-color .18s;
}
.presskit:visited{color:var(--link-visited)}
.presskit:hover{color:var(--link-hover); border-color:var(--link-hover)}
.presskit:focus-visible{outline:2px solid var(--candle-bright); outline-offset:4px}

footer.site{
  position:relative; z-index:1; width:100%; padding:28px 22px 40px;
  display:flex; flex-direction:column; align-items:center; gap:12px; border-top:1px solid var(--hair);
}
.studio-logo{height:34px; width:auto; opacity:.85}
.copyright{color:var(--muted); font-size:.8rem; letter-spacing:.04em}

/* ---- press kit ---- */
main.press{
  position:relative; z-index:1; width:100%; max-width:880px; flex:1;
  padding:clamp(40px,6vw,72px) 22px 56px;
  display:flex; flex-direction:column; gap:40px;
}
.press .top{display:flex; flex-direction:column; gap:14px; align-items:flex-start}
.press .kicker{font-size:.78rem; letter-spacing:.28em; text-transform:uppercase; color:var(--muted)}
.press h1{font-size:clamp(1.8rem,5vw,2.8rem); font-weight:700; line-height:1.05}
.press h1.press-logo{margin:0; line-height:0}
.press h1.press-logo img{display:block; width:auto; max-width:min(300px,70%); height:auto; filter:drop-shadow(0 4px 18px rgba(0,0,0,.4))}
.press .lede{color:var(--muted); font-size:1.05rem; max-width:56ch; line-height:1.6}
.press .backlink{color:var(--link); text-decoration:none; font-size:.92rem; border-bottom:1px solid var(--hair); padding-bottom:2px}
.press .backlink:visited{color:var(--link-visited)}
.press .backlink:hover{color:var(--link-hover); border-color:var(--link-hover)}

.section{display:flex; flex-direction:column; gap:16px}
.section > h2{
  font-size:.82rem; letter-spacing:.22em; text-transform:uppercase; color:var(--candle);
  font-weight:600; padding-bottom:10px; border-bottom:1px solid var(--hair);
}
.factsheet{display:grid; grid-template-columns:auto 1fr; gap:10px 22px; font-size:.98rem}
.factsheet dt{color:var(--muted)}
.factsheet dd{color:var(--ink)}
.factsheet dd a{color:var(--link); text-decoration:none}
.factsheet dd a:visited{color:var(--link-visited)}
.factsheet dd a:hover{text-decoration:underline}
.gallery{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
.gallery img{width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:8px; border:1px solid var(--hair); background:#000; display:block}
.gallery img:first-child{grid-column:1 / -1}
@media (max-width:560px){ .gallery{grid-template-columns:1fr} }
.prose{color:var(--ink); line-height:1.7; max-width:66ch}
.prose a{color:var(--link)}
.prose a:visited{color:var(--link-visited)}
.dl{
  align-self:flex-start; display:inline-flex; align-items:center; gap:.5em;
  color:var(--btn-ink); background:var(--candle); font-weight:700;
  padding:.8em 1.4em; border-radius:999px; text-decoration:none;
  transition:transform .18s, box-shadow .18s, background .18s; box-shadow:0 10px 30px rgba(233,184,74,.24);
}
.dl:hover{background:var(--candle-bright); transform:translateY(-2px)}
.contact a{color:var(--link); text-decoration:none}
.contact a:visited{color:var(--link-visited)}
.contact a:hover{text-decoration:underline}

.links{display:grid; grid-template-columns:auto 1fr; gap:10px 22px; font-size:.98rem}
.links dt{color:var(--muted)}
.links dd a{color:var(--link); text-decoration:none; word-break:break-all}
.links dd a:visited{color:var(--link-visited)}
.links dd a:hover{text-decoration:underline}

.clips{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
.clips video{
  width:100%; aspect-ratio:16/9; display:block; border-radius:8px;
  border:1px solid var(--hair); background:#000; object-fit:cover;
}
@media (max-width:560px){ .clips{grid-template-columns:1fr} }

.feature{display:flex; flex-direction:column; gap:6px}
.section h3{font-size:1.06rem; font-weight:600; color:var(--ink)}
.intro{color:var(--ink); line-height:1.75; max-width:66ch; font-size:1.02rem}
blockquote.devquote{
  border-left:3px solid var(--candle); padding:2px 0 2px 18px;
  color:var(--ink); line-height:1.75; max-width:66ch; font-style:normal;
}
blockquote.devquote cite{display:block; margin-top:10px; color:var(--muted); font-style:normal; font-size:.9rem}

@media (prefers-reduced-motion:no-preference){
  main.landing > *{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
  main.landing > *:nth-child(2){animation-delay:.06s}
  main.landing > *:nth-child(3){animation-delay:.12s}
  main.landing > *:nth-child(4){animation-delay:.18s}
}
@keyframes rise{from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none}}