/* Layout: dark imperial "command deck"; a full-bleed hero with a live console, then divisions as a three-column grid, then the founder, then contact. */
:root {
  --onyx: #120d0e;        /* page ground */
  --basalt: #1d1517;      /* raised surfaces */
  --seam: #3a2a2d;        /* hairlines */
  --crimson: #8e1b2b;     /* brand red, from the shield */
  --ember: #c23a4c;       /* crimson lifted for text on dark */
  --brass: #c8963e;       /* brand gold, from the shield trim */
  --parchment: #faf6ef;   /* primary text */
  --ash: #b8aaa6;         /* secondary text */
  --display: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --body: "Instrument Sans", "Segoe UI", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--onyx); color: var(--parchment); font: 17px/1.6 var(--body); }
a { color: var(--brass); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; border-radius: 4px; }
.wrap { max-width: 1160px; margin: 0 auto; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
.eyebrow { font: 600 12px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--brass); }
h1, h2, h3 { font-family: var(--display); line-height: 1.05; text-wrap: balance; margin: 0; }

/* Header */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 10; background: var(--onyx); }
.top { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 5; background: color-mix(in srgb, var(--onyx) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--seam); }
.top .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 14px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--parchment); text-decoration: none; }
.brand img { width: 42px; height: 42px; }
.brand b { font: 700 21px/1 var(--display); letter-spacing: -.01em; }
.brand b span { color: var(--brass); }
.top nav { display: flex; gap: 22px; flex-wrap: wrap; }
.top nav a { color: var(--ash); text-decoration: none; font-size: 15px; }
.top nav a:hover { color: var(--parchment); }
@media (max-width: 720px) { .top nav { display: none; } }

/* Footer */
.foot { border-top: 1px solid var(--seam); margin-top: 96px; }
.foot .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; padding-block: 36px; color: var(--ash); font-size: 14px; }
.foot nav { display: flex; gap: 20px; flex-wrap: wrap; }
.foot a { color: var(--ash); }
.foot a:hover { color: var(--parchment); }

/* Legal pages */
.legal { max-width: 720px; margin: 0 auto; padding-block: 64px 0; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
.legal h1 { font-size: clamp(36px, 6vw, 56px); margin: 14px 0 10px; }
.legal .meta { color: var(--ash); font-size: 15px; margin: 0 0 32px; }
.legal h2 { font-size: 21px; margin: 36px 0 8px; color: var(--parchment); }
.legal p { color: #e6ddd8; margin: 0 0 14px; }
