/* statichex.dev — shared page shell
   Reset, theme variables, mobile nav, focus states, and the handful of
   light-mode overrides every page on the site needs. Page-specific styles
   (hero animations, card layouts, section-specific rules) stay inline per
   page — this file is only the boilerplate that was byte-identical across
   every page already. */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root { --panel: #242424; --line: #303030; --fg: #e8e8e8; --soft: #b2b2b2; --accent: #4d8fff; }
[data-theme="light"] { --panel: #f2efe9; --line: #ccc8c0; --fg: #1a1714; --soft: #4a4540; --accent: #4d8fff; }
html { scroll-behavior: smooth; scroll-padding-top: 70px; }
body { overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; }

/* ── Mobile nav open state ──────────────────── */
.nav-links.open{display:flex!important;flex-direction:column;position:absolute;top:62px;left:0;right:0;background:#242424;border-bottom:1px solid #303030;padding:12px 24px;gap:0;z-index:99;}
.nav-links.open li{border-bottom:1px solid #303030;}
.nav-links.open li:last-child{border-bottom:none;}
.nav-links.open li a{display:block;padding:12px 0;font-size:0.9rem;color:#b2b2b2;}

/* ── Focus ──────────────────────────────────── */
:focus-visible{outline:2px solid #4d8fff;outline-offset:3px;border-radius:2px;}
a:focus-visible,button:focus-visible{outline:2px solid #4d8fff;outline-offset:3px;}

/* ── Light mode (shared base) ───────────────── */
[data-theme="light"] body{background:#e9e5de;color:#1a1714;}
[data-theme="light"] nav{background:rgba(233,229,222,0.96)!important;}
[data-theme="light"] .lm-logo{color:#111;}
[data-theme="light"] .lm-ghost{color:#333;}