@font-face {
  font-family: "Exo 2";
  src: url("/fonts/Exo2-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Exo 2";
  src: url("/fonts/Exo2-Italic-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: optional;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("/fonts/JetBrainsMono-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 800;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("/fonts/JetBrainsMono-Italic-VariableFont_wght.ttf")
    format("truetype");
  font-weight: 100 800;
  font-style: italic;
  font-display: optional;
}

:root {
  --accent: #d41c47;
  font-size: 16.8px;

  /* ── Layout widths ── */
  --width-wide: 1600px; /* photos / gallery */
  --width-shell: 1020px; /* nav, footer */
  --width-content: 1020px; /* page containers */
  --width-hero: 1020px; /* homepage hero */
  --width-prose: 680px; /* reading width */
  --width-sidebar: 250px; /* articles index sidebar */
  --width-sidebar-toc: 250px; /* article detail toc */

  /* ── Type scale ── */
  --text-xl: clamp(1.75rem, 4.5vw, 2.5rem);
  --text-lg: clamp(1.4rem, 3.5vw, 1.9rem);
  --text-md: clamp(1.2rem, 2.5vw, 1.5rem);
  --text-sm: clamp(1.05rem, 2vw, 1.2rem);
  --text-xs: clamp(1rem, 1.5vw, 1.1rem);
}

body {
  font-family: "Exo 2", system-ui, sans-serif;
  background: #f5f5f3;
}

h1,
h2,
h3,
h4,
h5 {
  line-height: 1.2;
  text-wrap: balance;
}

p,
li,
blockquote,
figcaption {
  text-wrap: pretty;
}

h1 {
  font-size: var(--text-xl);
}
h2 {
  font-size: var(--text-lg);
}
h3 {
  font-size: var(--text-md);
}
h4 {
  font-size: var(--text-sm);
}
h5 {
  font-size: var(--text-xs);
}

a[target="_blank"]:not(:has(svg))::after {
  content: "↗";
  font-size: 0.7em;
  vertical-align: super;
  margin-left: 0.15em;
  opacity: 0.6;
  text-decoration: none;
  display: inline-block;
}

code,
pre,
kbd,
samp {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  max-height: 40rem;
}
