/* ── Spacing, radius & layout ────────────────────────────
   The portfolio rides on a small, even spacing set and a generous
   page margin. Cards round at 8px; the avatar squircle at 16px. */

:root {
  /* Spacing scale (taken from the Figma auto-layout gaps) */
  --space-1: 6px;    /* title ↔ subtitle within a card */
  --space-2: 16px;   /* thumbnail ↔ caption; logo ↔ name */
  --space-3: 24px;   /* gap between cards in a row; label ↔ grid */
  --space-4: 32px;   /* gap between card rows */
  --space-5: 60px;   /* major section rhythm */
  --space-6: 86px;   /* header ↔ first section */

  /* Page frame */
  --page-margin: 120px;   /* left/right gutter on desktop */
  --page-top: 32px;       /* top padding */
  --content-max: 960px;   /* max content width inside the gutters */

  /* Radius */
  --radius-card: 8px;     /* project thumbnails */
  --radius-avatar: 16px;  /* profile squircle */
  --radius-pill: 999px;

  /* Thumbnail aspect — 468 × 263.25 ≈ 16:9 */
  --thumb-aspect: 16 / 9; /* @kind other */
}