/* ============================================================
   AEROSPACE — SHARED SITE STYLESHEET
   Single source of truth for design tokens, base reset, layout
   primitives, page chrome, and the cross-site navigation.

   Loaded on every page BEFORE that page's own inline <style>,
   so any rule here can still be overridden per page. Rules that
   match a page's inline copy exactly have been removed from that
   page; rules that a page deliberately tweaked stay inline and
   continue to win.
   ============================================================ */

/* --- design tokens ---------------------------------------- */
:root{
  --ink:#0b0b0c;
  --paper:#f6f6f2;
  --white:#ffffff;
  --line:#c9c9c1;
  --mid:#7a7a74;
  --font-display:'IBM Plex Sans Condensed', sans-serif;
  --font-body:'IBM Plex Sans', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
  --edge: clamp(16px, 4vw, 56px);
  --maxw: 1280px;
}
:root{
  /* shared extensions (previously defined ad hoc on some pages) */
  --line-strong:#0b0b0c;
  --hatch: repeating-linear-gradient(135deg, var(--ink) 0, var(--ink) 1px, transparent 1px, transparent 7px);
}

/* --- base reset ------------------------------------------- */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-body); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;}
img,svg{display:block; max-width:100%;}
a{color:inherit;}
h1,h2,h3,h4{margin:0; font-family:var(--font-display); font-weight:700; text-transform:uppercase; letter-spacing:0.01em;}
p{margin:0;}
button{font-family:inherit; cursor:pointer;}

/* --- layout primitives ----------------------------------- */
.section{position:relative; padding:96px var(--edge) 96px; border-bottom:1px solid var(--line);}
.section-inner{max-width:var(--maxw); margin:0 auto;}
.eyebrow{font-family:var(--font-mono); font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--mid); display:flex; align-items:center; gap:10px; margin-bottom:18px;}
.eyebrow::before{content:''; width:22px; height:1px; background:var(--ink);}
.fig-num{font-family:var(--font-mono); font-size:12px; color:var(--mid);}
.h-lg{font-size:clamp(1.9rem, 4vw, 3.2rem); line-height:1.02; margin-bottom:28px;}
.lede{font-size:clamp(1.05rem, 1.4vw, 1.25rem); max-width:640px; color:#28282a;}
.body-col{max-width:620px;}
.mono{font-family:var(--font-mono);}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:48px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);}
@media (max-width:860px){
  .grid-2{grid-template-columns:1fr; gap:36px;}
  .grid-3{grid-template-columns:1fr;}
  .grid-4{grid-template-columns:1fr 1fr;}
}
.corner-frame{position:relative;}
.corner-frame::before,.corner-frame::after{content:''; position:absolute; width:12px; height:12px; pointer-events:none;}
.corner-frame::before{top:-1px; left:-1px; border-top:2px solid var(--ink); border-left:2px solid var(--ink);}
.corner-frame::after{bottom:-1px; right:-1px; border-bottom:2px solid var(--ink); border-right:2px solid var(--ink);}

/* --- page chrome ----------------------------------------- */
#progress{position:fixed; top:0; left:0; height:2px; background:var(--ink); width:0%; z-index:60; transition:width 0.08s linear;}
#chrome{position:fixed; top:0; left:0; right:0; z-index:50; display:flex; justify-content:space-between; align-items:center; padding:14px var(--edge); pointer-events:none;}
#chrome > *{pointer-events:auto;}
.brand{font-family:var(--font-mono); font-size:12px; letter-spacing:0.14em; background:var(--paper); padding:6px 10px; border:1px solid var(--ink);}
#langtoggle{display:flex; border:1px solid var(--ink); background:var(--paper); overflow:hidden;}
#langtoggle button{background:none; border:none; font-family:var(--font-mono); font-size:12px; letter-spacing:0.08em; padding:7px 12px; color:var(--ink);}
#langtoggle button.active{background:var(--ink); color:var(--white);}

#hud{position:fixed; bottom:16px; left:16px; z-index:50; font-family:var(--font-mono); font-size:11px; letter-spacing:0.04em; background:var(--paper); border:1px solid var(--ink); padding:10px 12px; min-width:198px; display:grid; row-gap:4px;}
@media (max-width:640px){ #hud{display:none;} }
.hud-row{display:flex; justify-content:space-between; gap:14px;}
.hud-label{color:var(--mid);}
.hud-dot{width:6px; height:6px; border-radius:50%; background:var(--ink); display:inline-block; margin-right:6px; animation:blink 1.6s steps(1) infinite;}
@keyframes blink{50%{opacity:0.15;}}

#hero{min-height:100svh; display:flex; flex-direction:column; justify-content:center; border-bottom:1px solid var(--ink); padding-top:140px;}
#hero .frame{border:1px solid var(--ink); padding:clamp(24px,5vw,64px); position:relative;}
#hero .kicker{font-family:var(--font-mono); font-size:12px; letter-spacing:0.18em; color:var(--mid); display:flex; justify-content:space-between; margin-bottom:24px; flex-wrap:wrap; gap:8px;}
#hero h1{font-size:clamp(2.6rem, 9vw, 7.2rem); line-height:0.92; margin-bottom:28px;}
#hero h1 em{font-style:normal; color:var(--mid);}
#hero .sub{max-width:640px; margin-bottom:40px;}
#hero .cta{display:inline-flex; align-items:center; gap:10px; font-family:var(--font-mono); font-size:13px; letter-spacing:0.08em; border:1px solid var(--ink); padding:12px 18px; background:var(--ink); color:var(--white); text-decoration:none;}
#hero .cta:hover{background:var(--paper); color:var(--ink);}

.schematic-wrap{display:grid; grid-template-columns:1.5fr 1fr; gap:32px; align-items:start;}
@media (max-width:860px){.schematic-wrap{grid-template-columns:1fr;}}
.schematic-svg{border:1px solid var(--ink); background:var(--white); width:100%;}
.hotspot{cursor:pointer;}
.hotspot rect,.hotspot circle,.hotspot path,.hotspot ellipse{transition:fill 0.15s ease;}
.hotspot:hover rect, .hotspot.active rect,
.hotspot:hover circle, .hotspot.active circle,
.hotspot:hover ellipse, .hotspot.active ellipse{fill:var(--ink);}
.hotspot text{font-family:var(--font-mono); font-size:9px; fill:var(--ink); pointer-events:none;}
.hotspot:hover text, .hotspot.active text{fill:var(--white);}
.module-panel{border:1px solid var(--ink); background:var(--white); padding:24px; min-height:220px;}
.module-panel .mp-name{font-family:var(--font-display); font-size:1.5rem; margin-bottom:6px;}
.module-panel .mp-meta{font-family:var(--font-mono); font-size:12px; color:var(--mid); margin-bottom:14px; text-transform:uppercase; letter-spacing:0.06em;}
.module-panel .mp-desc{font-size:14.5px;}
.module-list{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
.module-chip{font-family:var(--font-mono); font-size:11px; border:1px solid var(--line); padding:6px 10px; background:var(--paper);}
.module-chip.active{border-color:var(--ink); background:var(--ink); color:var(--white);}

.exp-card{border-bottom:1px solid var(--line); padding:20px 0; cursor:pointer;}
.exp-card:first-child{border-top:1px solid var(--ink);}
.exp-head{display:flex; justify-content:space-between; align-items:center; gap:16px;}
.exp-head h4{font-size:1.05rem; font-weight:600; text-transform:none; letter-spacing:0;}
.exp-toggle{font-family:var(--font-mono); font-size:18px; width:22px; text-align:center; flex-shrink:0;}
.exp-body{max-height:0; overflow:hidden; transition:max-height 0.35s ease;}
.exp-card.open .exp-body{max-height:400px;}
.exp-body-inner{padding-top:14px; font-size:14px; max-width:640px;}

.mir-timeline{position:relative; padding-top:20px;}
.mt-track{position:relative; height:2px; background:var(--line); margin:0 4px;}
.mt-events{display:flex; justify-content:space-between; position:relative; top:-1px;}
.mt-dot{width:11px; height:11px; border-radius:50%; background:var(--paper); border:2px solid var(--ink); cursor:pointer; position:relative;}
.mt-dot.crisis{background:var(--ink);}
.mt-dot.active{transform:scale(1.5);}
.mt-year{position:absolute; top:16px; left:50%; transform:translateX(-50%); font-family:var(--font-mono); font-size:9.5px; color:var(--mid); white-space:nowrap; text-align:center;}
.mt-detail{margin-top:56px; border:1px solid var(--ink); background:var(--white); padding:24px; min-height:150px;}
.mt-detail .mt-y{font-family:var(--font-display); font-size:1.5rem; margin-bottom:8px;}
.mt-detail .mt-t{font-family:var(--font-mono); font-size:11px; color:var(--mid); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:12px;}

.dash-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); margin-top:32px;}
@media (max-width:760px){.dash-grid{grid-template-columns:1fr;}}
.dash-card{background:var(--white); padding:24px;}
.dash-card .dc-head{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px;}
.dash-card .dc-name{font-family:var(--font-display); font-size:1.3rem;}
.dash-card .dc-status{font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:0.06em; padding:3px 8px; border:1px solid var(--ink);}
.dash-row{display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:12.5px; padding:6px 0; border-top:1px solid var(--line);}
.dash-row span:first-child{color:var(--mid);}

.legacy-row{display:flex; align-items:flex-end; gap:0; border-top:1px solid var(--ink); padding-top:28px; overflow-x:auto;}
.legacy-item{flex:1 0 150px; text-align:center; padding:0 10px; border-right:1px solid var(--line);}
.legacy-item:last-child{border-right:none;}
.legacy-item .ly-year{font-family:var(--font-mono); font-size:11px; color:var(--mid); margin-bottom:10px;}
.legacy-item svg{height:60px; margin:0 auto 12px;}
.legacy-item .ly-name{font-family:var(--font-display); font-size:0.9rem;}
.legacy-item .ly-note{font-size:11.5px; color:var(--mid); margin-top:6px;}

footer{padding:56px var(--edge) 80px; font-family:var(--font-mono); font-size:12px; color:var(--mid); display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;}
.skip-link{position:absolute; left:-9999px;}
.skip-link:focus{left:16px; top:16px; z-index:100; background:var(--ink); color:var(--white); padding:8px 12px;}
:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}

/* ============================================================
   CROSS-SITE NAVIGATION
   New in the shared layer — not present on the legacy pages.
   Injected and wired by assets/site.js.
   ============================================================ */

/* brand becomes a home link */
a.brand{text-decoration:none; display:inline-block; transition:background .15s ease, color .15s ease;}
a.brand:hover,a.brand:focus-visible{background:var(--ink); color:var(--white);}

/* right-hand cluster in the fixed chrome */
.chrome-actions{display:flex; align-items:center; gap:8px;}
.site-menu-btn{font-family:var(--font-mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  background:var(--paper); border:1px solid var(--ink); color:var(--ink); padding:7px 12px; line-height:1;}
.site-menu-btn:hover,.site-menu-btn[aria-expanded="true"]{background:var(--ink); color:var(--white);}

/* full-screen index overlay */
.site-overlay{position:fixed; inset:0; z-index:80; background:var(--paper);
  overflow-y:auto; padding:84px var(--edge) 64px; -webkit-overflow-scrolling:touch;}
.site-overlay[hidden]{display:none;}
.site-overlay .so-top{position:absolute; top:14px; right:var(--edge); left:var(--edge);
  display:flex; justify-content:space-between; align-items:center;}
.site-overlay .so-title{font-family:var(--font-mono); font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--mid);}
.site-overlay .so-close{font-family:var(--font-mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  background:var(--paper); border:1px solid var(--ink); color:var(--ink); padding:7px 12px; line-height:1;}
.site-overlay .so-close:hover{background:var(--ink); color:var(--white);}
.so-cats{max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:36px 44px;}
.so-cat h2{font-family:var(--font-display); font-size:1rem; text-transform:uppercase; letter-spacing:0.04em; margin:0 0 4px;}
.so-cat ul{list-style:none; margin:8px 0 0; padding:0;}
.so-cat li{border-top:1px solid var(--line);}
.so-cat li:last-child{border-bottom:1px solid var(--line);}
.so-cat a{display:flex; gap:10px; align-items:baseline; padding:9px 0; text-decoration:none;}
.so-cat a .cn{font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.06em; color:var(--mid); flex:0 0 auto; min-width:74px;}
.so-cat a .cl{font-size:14px;}
.so-cat a:hover .cl{text-decoration:underline;}
.so-cat a[aria-current="page"]{background:var(--ink);}
.so-cat a[aria-current="page"] .cn,.so-cat a[aria-current="page"] .cl{color:var(--white);}
.so-cat a[aria-current="page"]{padding-left:8px; padding-right:8px;}
.so-cat li.so-soon .np{display:flex; gap:10px; align-items:baseline; padding:9px 0;}
.so-cat li.so-soon .cl{color:var(--mid);}
.so-cat li.so-ext .cn{color:var(--ink);}

/* previous / next + breadcrumb, placed between <main> and <footer> */
.page-nav{max-width:var(--maxw); margin:0 auto; padding:36px var(--edge) 8px;
  border-top:1px solid var(--ink); display:grid; gap:16px;
  font-family:var(--font-mono); font-size:12px;}
.page-nav .pn-crumb{font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--mid);}
.page-nav .pn-crumb a{text-decoration:none;}
.page-nav .pn-crumb a:hover{text-decoration:underline;}
.page-nav .pn-links{display:flex; justify-content:space-between; gap:20px;}
.page-nav .pn-links a{text-decoration:none; max-width:47%; display:block;}
.page-nav .pn-links a:hover .pn-t{text-decoration:underline;}
.page-nav .pn-next{margin-left:auto; text-align:right;}
.page-nav .pn-dir{display:block; font-size:10px; letter-spacing:0.12em; color:var(--mid); margin-bottom:5px;}
.page-nav .pn-t{font-size:13px;}
@media (max-width:560px){ .page-nav .pn-links{flex-direction:column; gap:14px;}
  .page-nav .pn-links a,.page-nav .pn-next{max-width:100%; text-align:left; margin-left:0;} }