:root {
  color-scheme: light;
  --porcelain: #fdf5ea;
  --paper: #fffaf3;
  --navy: #052a64;
  --coral: #fc5a39;
  --aqua: #02c4d9;
  --violet: #7f4fd8;
  --amber: #fdb40c;
  --ink-muted: #425574;
  --line: rgba(5, 42, 100, 0.16);
  --shadow: 0 24px 70px rgba(5, 42, 100, 0.12);
}

* { box-sizing: border-box; }

/* ac-no-horizontal-scroll v1 */
html, body { overflow-x: clip; max-width: 100%; }
img, video, iframe { max-width: 100%; height: auto; }
pre, table { max-width: 100%; overflow-x: auto; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  min-width: 320px;
  overflow-x: clip;
  color: var(--navy);
  background:
    radial-gradient(circle at 8% 4%, rgba(253, 180, 12, 0.18), transparent 26rem),
    radial-gradient(circle at 92% 18%, rgba(2, 196, 217, 0.15), transparent 28rem),
    var(--porcelain);
  font-family: ui-rounded, "SF Pro Rounded", system-ui, sans-serif;
  line-height: 1.55;
}

a { color: inherit; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 10;
  border-bottom: 1px solid var(--line);
  background: rgba(253, 245, 234, 0.9);
  backdrop-filter: blur(18px);
}

.nav-shell {
  width: min(1120px, calc(100% - 32px));
  min-height: 72px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.brand { display: flex; align-items: center; gap: 12px; font-weight: 800; text-decoration: none; }
.brand img { width: 42px; height: 42px; border-radius: 11px; }
.nav-links { display: flex; align-items: center; gap: 22px; }
.nav-links a { text-decoration: none; font-weight: 700; }
.nav-links a:hover, .nav-links a:focus-visible { color: #00596a; }

.language-button, .menu-button {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--navy);
  background: var(--paper);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.menu-button { display: none; } /* ac-nav-hamburger v1 */

main { width: min(1120px, calc(100% - 32px)); margin: auto; }
main, section, article, .hero > *, .hero-copy { min-width: 0; }
h1, h2, h3, p { overflow-wrap: break-word; }

.hero {
  min-height: 680px;
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  align-items: center;
  gap: clamp(40px, 7vw, 96px);
  padding: 80px 0;
}

.eyebrow { color: #965f00; font-weight: 900; letter-spacing: 0.16em; text-transform: uppercase; }
h1, h2 { margin: 0; font-family: ui-serif, Georgia, serif; line-height: 1.04; letter-spacing: -0.035em; }
h1 { max-width: 760px; font-size: clamp(3.5rem, 8vw, 6.8rem); }
h2 { font-size: clamp(2.3rem, 5vw, 4rem); }
.lede { max-width: 650px; margin: 24px 0 32px; color: var(--ink-muted); font-size: clamp(1.1rem, 2vw, 1.35rem); }
.cta-row { display: flex; flex-wrap: wrap; gap: 14px; }
.button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; padding: 0 22px; border: 2px solid var(--navy); border-radius: 999px; font-weight: 900; text-decoration: none; }
.button.primary { color: white; background: var(--navy); box-shadow: 5px 5px 0 var(--amber); }
.button.secondary { background: var(--paper); }

.observatory-mark {
  position: relative;
  width: min(440px, 78vw);
  aspect-ratio: 1;
  margin: auto;
  display: grid;
  place-items: center;
  border: 22px solid transparent;
  border-radius: 50%;
  background: linear-gradient(var(--porcelain), var(--porcelain)) padding-box,
    conic-gradient(var(--coral), var(--aqua), var(--violet), var(--amber), var(--coral)) border-box;
  box-shadow: var(--shadow);
}
.observatory-mark::before, .observatory-mark::after { content: ""; position: absolute; width: 60px; height: 60px; border: 14px solid var(--porcelain); border-radius: 50%; }
.observatory-mark::before { top: -40px; background: var(--coral); }
.observatory-mark::after { bottom: -40px; background: var(--amber); }
.observatory-mark img { width: 58%; border-radius: 27%; box-shadow: 0 18px 48px rgba(5, 42, 100, 0.24); }

.section { padding: 92px 0; }
.section-intro { max-width: 720px; margin: 20px 0 42px; color: var(--ink-muted); font-size: 1.15rem; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.feature { min-height: 230px; padding: 28px; border: 1px solid var(--line); border-radius: 28px; background: rgba(255, 250, 243, 0.82); box-shadow: 0 10px 40px rgba(5, 42, 100, 0.07); }
.feature-dot { width: 16px; height: 16px; margin-bottom: 44px; border-radius: 50%; background: var(--accent); box-shadow: 24px 0 0 color-mix(in srgb, var(--accent), transparent 45%); }
.feature h3 { font-family: ui-serif, Georgia, serif; font-size: 1.5rem; }
.feature p { color: var(--ink-muted); }
.legal { max-width: 780px; padding: 70px 0 100px; }
.legal h1 { font-size: clamp(3rem, 7vw, 5rem); }
.legal h2 { margin-top: 44px; font-size: 1.8rem; }
.legal p, .legal li { color: var(--ink-muted); }

footer { border-top: 1px solid var(--line); } /* ac-footer-mobile v1 */
.footer-shell { width: min(1120px, calc(100% - 32px)); margin: auto; padding: 30px 0 42px; display: flex; justify-content: space-between; gap: 24px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 20px; }

@media (max-width: 840px) {
  .menu-button { display: inline-grid; place-items: center; }
  .nav-links { position: absolute; inset: 72px 16px auto; display: none; align-items: stretch; padding: 16px; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: var(--shadow); }
  .nav-links.open { display: grid; }
  .nav-links a { min-height: 44px; display: flex; align-items: center; }
  .hero { min-height: auto; grid-template-columns: 1fr; padding-top: 64px; text-align: center; }
  .hero-copy { display: grid; justify-items: center; }
  h1 { font-size: clamp(3rem, 14vw, 4.25rem); }
  .eyebrow { max-width: 100%; font-size: 0.82rem; letter-spacing: 0.1em; }
  .cta-row { width: 100%; justify-content: center; }
  .button { max-width: 100%; }
  .observatory-mark { width: min(310px, 76vw); order: -1; border-width: 16px; }
  .observatory-mark::before, .observatory-mark::after { width: 48px; height: 48px; border-width: 10px; }
  .feature-grid { grid-template-columns: 1fr; }
  .section { padding: 68px 0; }
  .footer-shell { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* product-story refinement v1 */
.hero{padding:56px 0}.hero h1{font-size:clamp(3rem,5vw,4.6rem)}.observatory-mark{width:min(360px,32vw)}
.game-preview{padding:40px 0 20px}.game-introduction{display:grid;grid-template-columns:1.15fr 1fr;gap:32px;align-items:center;margin-top:28px}.game-proof{margin:0}.game-proof img{display:block;width:100%;border-radius:20px}.game-proof figcaption{margin-top:10px;color:var(--ink-muted);font-size:.9rem}.game-goals{display:grid;gap:18px;margin:0}.game-goals dt,.instrument-list dt{font-weight:800}.game-goals dd,.instrument-list dd{margin:4px 0 0;color:var(--ink-muted)}.game-catalog{margin-top:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.game-catalog summary{padding:18px 0;min-height:56px;font-weight:800;cursor:pointer}.instrument-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 32px;padding-bottom:24px}.daily-brief{max-width:620px;font-size:.92rem;color:var(--ink-muted);margin:0 0 22px}.game-preview a:focus-visible,.game-catalog summary:focus-visible{outline:3px solid var(--navy);outline-offset:5px}
@media(max-width:840px){.hero{min-height:0;padding:36px 0 24px;gap:28px;text-align:start}.hero-copy{display:block}.hero h1{font-size:clamp(2.7rem,11.5vw,3.4rem)}.hero .lede{margin:20px 0;font-size:1.08rem}.hero .section-intro{margin:12px 0 20px;font-size:1rem}.hero .cta-row{justify-content:flex-start}.observatory-mark{order:1;width:112px;border-width:7px;margin:8px auto 0}.observatory-mark::before,.observatory-mark::after{width:20px;height:20px;border-width:4px}.observatory-mark::before{top:-16px}.observatory-mark::after{bottom:-16px}.game-introduction{grid-template-columns:1fr;gap:22px}.game-goals{gap:14px}.instrument-list{grid-template-columns:1fr}.game-preview{padding-top:28px}.daily-brief{font-size:.9rem}}