:root{--sky:#0b78d0;--navy:#07182f;--navy2:#0b2445;--white:#f7f2e9;--gold:#ffc21c;--line:#2d5689}
*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--navy);color:var(--white);font-family:"Press Start 2P","Courier New",monospace}a{color:inherit}

/* V3.1: scenery and interface are deliberately separate. */
.hero{position:relative;width:100%;height:100svh;min-height:620px;overflow:hidden;background:var(--sky)}
.scene{position:absolute;inset:0;background-color:var(--sky);background-image:url("assets/skyspeak-airport-art.png");background-repeat:no-repeat;background-position:center bottom;background-size:auto 100%;image-rendering:pixelated}
.hero-ui{position:relative;z-index:2;height:100%;padding-top:clamp(28px,4.3vh,58px);pointer-events:none}
.branding{text-align:center;width:min(1040px,92vw);margin:0 auto}.branding h1{margin:0;font-size:clamp(38px,5vw,76px);line-height:1.08;letter-spacing:.015em;text-shadow:5px 6px 0 rgba(4,44,97,.68)}
.tagline-row{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:16px}.tagline-row .rule{height:3px;background:var(--white);width:clamp(45px,8vw,130px);box-shadow:2px 2px 0 rgba(4,44,97,.45)}.tagline-row p{margin:0;font-size:clamp(10px,1.22vw,18px);line-height:1.5;white-space:nowrap;text-shadow:2px 2px 0 rgba(4,44,97,.5)}
.desktop-menu{position:absolute;left:50%;top:27%;transform:translateX(-50%);display:flex;flex-direction:column;gap:clamp(14px,1.8vh,22px);min-width:310px;pointer-events:auto}.desktop-menu a{display:flex;align-items:center;gap:16px;text-decoration:none;font-size:clamp(17px,1.65vw,26px);line-height:1;color:var(--white);text-shadow:3px 3px 0 rgba(4,44,97,.5);transition:color .12s ease,transform .12s ease}.desktop-menu a:hover,.desktop-menu a:focus-visible{color:var(--gold);transform:translateX(5px);outline:none}.triangle{color:transparent;font-size:.92em;text-shadow:none}.desktop-menu a:hover .triangle,.desktop-menu a:focus-visible .triangle{color:var(--gold)}
.mobile-nav-section{display:none}

/* Existing content pages */
body.page{min-height:100vh;background:linear-gradient(180deg,#0b78d0 0,#0b78d0 210px,#07182f 210px,#07182f 100%)}.page-header{display:flex;justify-content:space-between;align-items:center;padding:28px clamp(18px,5vw,68px);gap:20px}.page-header a{text-decoration:none}.brand{font-size:clamp(18px,2.6vw,34px);text-shadow:3px 3px 0 #083c75}.back{font-size:11px}.content{max-width:900px;margin:90px auto 0;padding:0 22px 80px}.content h1{font-size:clamp(28px,5vw,58px);margin:0 0 28px}.pixel-box{border:4px solid #2d5689;background:#0b2445;padding:28px;box-shadow:8px 8px 0 #04101f}.pixel-box p{font-family:"Courier New",monospace;font-size:18px;line-height:1.7;margin:0;color:#e8eef6}

@media (max-width:760px){
  body.home{overflow-y:auto;background:var(--navy)}
  .hero{height:auto;min-height:0;background:var(--sky);padding-top:0;overflow:hidden}
  .scene{position:relative;inset:auto;width:100%;height:58vh;min-height:390px;max-height:560px;background-size:auto 100%;background-position:center bottom}
  .hero-ui{position:absolute;inset:0;height:auto;padding:24px 12px 0}
  .branding{width:100%}.branding h1{font-size:clamp(27px,8.2vw,43px);white-space:nowrap;text-shadow:4px 4px 0 rgba(4,44,97,.65)}
  .tagline-row{gap:7px;margin-top:14px}.tagline-row .rule{width:clamp(18px,7vw,42px);height:2px}.tagline-row p{font-size:clamp(7px,2.15vw,11px)}
  .desktop-menu{display:none}
  .mobile-nav-section{display:block;background:linear-gradient(#081a34,#06152a);padding:18px 16px 22px;border-top:4px solid #0a2a50}
  .mobile-menu{display:grid;gap:12px}.mobile-menu a{display:grid;grid-template-columns:44px 1fr 30px;align-items:center;min-height:72px;padding:0 16px;border:3px solid var(--line);box-shadow:inset 0 0 0 2px #081a34;text-decoration:none;font-size:clamp(14px,4.5vw,20px);background:linear-gradient(90deg,#0b2445,#07182f)}.mobile-menu a:active,.mobile-menu a:focus-visible{color:var(--gold);border-color:var(--gold);outline:none}.mobile-icon{font-family:"Courier New",monospace;font-size:25px;font-weight:900;text-align:center;color:#e7edf7}.mobile-info{display:grid;place-items:center;width:27px;height:27px;margin:auto;border:3px solid #e7edf7;border-radius:50%;font-size:17px}.chevron{font-family:Arial,sans-serif;font-size:38px;text-align:right;color:#e7edf7}.mobile-nav-section footer{text-align:center;padding:18px 8px 0;color:#6f8baa;font-size:8px;letter-spacing:.04em}
  body.page{background:linear-gradient(180deg,#0b78d0 0,#0b78d0 150px,#07182f 150px,#07182f 100%)}.page-header{padding:22px 16px}.content{margin-top:56px}
}
@media (min-width:761px){body.home{overflow:hidden}}
@media (max-height:760px) and (min-width:761px){.hero{min-height:560px}.hero-ui{padding-top:22px}.branding h1{font-size:clamp(34px,4.4vw,60px)}.tagline-row{margin-top:11px}.desktop-menu{top:28%;gap:12px}}
@media (prefers-reduced-motion:reduce){.triangle{animation:none}.desktop-menu a{transition:none}}
