/* God of Finance: discipline, power, speed. Warm black, bone, ember. */

@font-face { font-family: "Cormorant Garamond"; src: url("fonts/cormorant-600i.woff2") format("woff2"); font-weight: 600; font-style: italic; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("fonts/cormorant-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("fonts/jbmono-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Hanken Grotesk"; src: url("fonts/hankengrotesk-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Hanken Grotesk"; src: url("fonts/hankengrotesk-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Hanken Grotesk"; src: url("fonts/hankengrotesk-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --ink: #efe7d8;
  --muted: #a89e8c;
  --hair: rgba(239, 231, 216, 0.13);
  --accent: #3fd080;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --display: "Cormorant Garamond", Georgia, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sans: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --gutter: clamp(20px, 5vw, 40px);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

body { display: flex; flex-direction: column; font-family: var(--sans); overflow-x: hidden; }
.page { flex: 1 1 auto; min-width: 0; }

/* -------------------------------- Lockup -------------------------------- */
.brand { display: inline-flex; align-items: center; gap: 14px; }
.brand__rule { width: 30px; height: 1px; background: var(--accent); }
.brand__word em { color: var(--accent); }
.brand__word {
  font-family: var(--display);
  font-weight: 400;
  font-size: 1.6rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.01em;
  color: var(--ink);
  white-space: nowrap;
  line-height: 1;
}

/* ------------------------------ Brand bar ------------------------------- */
.brandbar { display: flex; justify-content: center; padding: 26px var(--gutter); }
.brandbar .brand__word { font-size: 1.55rem; }

/* -------------------------------- Footer -------------------------------- */
.brandfoot { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 48px var(--gutter) 40px; }
.brandfoot .brand__word { font-size: 1.25rem; color: var(--muted); }
.brandfoot__legal { font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.02em; color: var(--muted); }

/* --------------------------- Reduced motion ----------------------------- */
@media (prefers-reduced-motion: reduce) {
      }

/* ---- mobile hardening (references/mobile.md) ---- */
img, svg, video, canvas, iframe { max-width: 100%; height: auto; }
p, li, td, th, blockquote, figcaption,
h1, h2, h3, h4, h5, h6 { overflow-wrap: anywhere; }
table, pre { display: block; max-width: 100%; overflow-x: auto; }
@media (max-width: 700px) {
  .tag, [class*="badge"], [class*="pill"] { margin-left: 0; }
}
@media (max-width: 420px) {
  .tok-merge, .tok-link, code { white-space: normal; }
}