/* Stabil Systems — shared UI + dark/light theme (used by home, resources, mission, partner) */
html[data-theme="dark"]{
  --bg:#0a0908;--bg2:#080605;--card:#14110c;--card2:#1a1611;--panel:rgba(14,11,7,.5);
  --line:#241f18;--line2:#2c2519;--accent:#c9a227;--accent2:#d8b64a;
  --accent-soft:rgba(201,162,39,.32);--accent-glow:rgba(201,162,39,.12);
  --ink:#f1ece0;--ink2:#c8beac;--muted:#8a8071;--faint:#6a6252;--on-gold:#241a06;
  --nav-bg:rgba(10,9,8,.82);--shadow:0 40px 90px -44px rgba(0,0,0,.85);
  --atmos:radial-gradient(1100px 780px at 50% 0%,rgba(214,170,64,.16),transparent 55%),radial-gradient(760px 620px at 85% 18%,rgba(190,120,44,.13),transparent 58%),radial-gradient(720px 680px at 10% 78%,rgba(201,162,39,.11),transparent 56%),radial-gradient(900px 760px at 50% 108%,rgba(150,92,30,.12),transparent 60%),#080605;
  --moon-disp:none;--sun-disp:flex;
}
html[data-theme="light"]{
  --bg:#f6f1e7;--bg2:rgba(238,231,219,.6);--card:#fffdf8;--card2:#ffffff;--panel:rgba(255,252,246,.55);
  --line:#e7dece;--line2:#dbcfb6;--accent:#8a6a12;--accent2:#a3801d;
  --accent-soft:rgba(138,106,18,.30);--accent-glow:rgba(201,162,39,.14);
  --ink:#1c1810;--ink2:#4a4234;--muted:#6f6656;--faint:#8f8574;--on-gold:#241a06;
  --nav-bg:rgba(246,241,231,.85);--shadow:0 26px 56px -32px rgba(70,52,12,.32);
  --atmos:radial-gradient(1100px 800px at 50% -4%,#ffffff,transparent 58%),radial-gradient(820px 640px at 84% 14%,rgba(255,247,224,.9),transparent 60%),radial-gradient(780px 700px at 8% 82%,rgba(243,236,220,.85),transparent 58%),radial-gradient(960px 820px at 50% 112%,rgba(252,244,226,.8),transparent 60%),#f6f0e4;
  --moon-disp:flex;--sun-disp:none;
}
*{box-sizing:border-box}
body{margin:0;color:var(--ink2);font-family:'Hanken Grotesk',sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh;background:var(--atmos);background-attachment:fixed;transition:background .4s ease,color .35s ease}
a{color:inherit}
h1,h2,h3,h4{margin:0;color:var(--ink)}
.wrap{max-width:1080px;margin:0 auto;padding:0 32px}
.eyebrow{font-family:'Space Grotesk',monospace;font-weight:700;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--accent)}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:'Hanken Grotesk',sans-serif;font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#0a0908;background:linear-gradient(180deg,#d8b345,#c19a2e);padding:15px 28px;border-radius:4px;text-decoration:none;box-shadow:0 6px 16px -8px rgba(201,162,39,.5);transition:transform .1s,box-shadow .2s;cursor:pointer;border:none}
.btn:hover{box-shadow:0 10px 22px -8px rgba(201,162,39,.65)}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--line2);box-shadow:none;font-weight:600;text-transform:none;letter-spacing:normal;font-size:14px;padding:11px 18px}
/* nav */
nav{position:sticky;top:0;z-index:40;background:var(--nav-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
nav .in{max-width:1140px;margin:0 auto;padding:14px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
nav .mark{height:38px;width:auto;display:block}
nav .links{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
nav .links a{font-size:14px;color:var(--muted);text-decoration:none;transition:color .2s;white-space:nowrap}
nav .links a:hover{color:var(--ink)}
nav .links a.on{color:var(--accent)}
.ttoggle{width:38px;height:38px;border-radius:50%;border:1px solid var(--line2);background:transparent;color:var(--accent);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:border-color .2s}
.ttoggle:hover{border-color:var(--accent-soft)}
.ttoggle .moon{display:var(--moon-disp);align-items:center;justify-content:center}
.ttoggle .sun{display:var(--sun-disp);align-items:center;justify-content:center}
/* footer */
footer{margin-top:64px;padding:40px 0;background:var(--bg2);border-top:1px solid var(--line)}
footer .in{max-width:1080px;margin:0 auto;padding:0 32px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--faint)}
footer a{color:var(--accent);text-decoration:none}
@media(max-width:600px){ .wrap{padding:0 20px} nav .in{padding:12px 20px} }