/* ============================================================
   Heilpraxis in der Au — Spacing, Radii & Layout Tokens
   ------------------------------------------------------------
   Carousel render rules:
   - Pill padding is EXACTLY 10px (× supersample) — do not improvise.
   - Measure every spacing with textbbox before render; ascender
     offset on pills is corrected via textbbox.
   - Canvas: 1080×1350 (carousel), 1080×1920 (story, RGB PNG).
   ============================================================ */

:root {
  /* ---- canvas ---- */
  --canvas-w: 1080px;
  --canvas-h: 1350px;          /* carousel */
  --canvas-h-story: 1920px;    /* story */
  --supersample: 3; /* @kind other */

  /* ---- safe margins (1080 canvas) ---- */
  --margin-x: 96px;            /* side gutters */
  --margin-top: 110px;
  --margin-bottom: 110px;

  /* ---- pill ---- */
  --pill-pad: 10px;            /* HARD RULE: exact pill padding */
  --pill-pad-x: 22px;          /* horizontal breathing inside pill */
  --pill-radius: 999px;
  --pill-border: 2px;

  /* ---- dividers / hairlines ---- */
  --divider-weight: 2px;
  --divider-weight-heavy: 3px;

  /* ---- vertical rhythm (carousel) ---- */
  --gap-xs: 16px;
  --gap-sm: 28px;
  --gap-md: 48px;
  --gap-lg: 72px;
  --gap-xl: 120px;

  /* ---- corner radii ---- */
  --radius-none: 0px;
  --radius-sm: 8px;
  --radius-md: 18px;
  --radius-lg: 32px;
  --radius-pill: 10px;
  --radius-circle: 50%;

  /* ---- web specimen spacing (screen px) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* ---- profile ring (CI avatar badge) ---- */
  --ring-gold: 6px;            /* gold ring weight */
  --ring-gap: 10px;            /* gap between ring and photo */
}