/* Ritmik layout tokens — radii, shadows, spacing, container. */
:root {
  /* corner radii */
  --r: 28px;          /* default card radius */
  --r-card-sm: 20px;  /* small cards (example/composition cards) */
  --r-band: 42px;     /* full-bleed band */
  --r-inner: 12px;    /* chips-in-cards, small inner elements */
  --r-pill: 999px;    /* buttons, chips, nav, toggles — everything pill */

  /* container */
  --maxw: 1180px;
  --page-pad: 18px;

  /* shadows (warm-ink, never pure black on light surfaces) */
  --shadow-nav: 0 8px 30px rgba(24, 21, 9, 0.1), 0 1px 0 rgba(255, 255, 255, 0.7) inset;
  --shadow-card: 0 18px 40px rgba(24, 21, 9, 0.12);
  --shadow-card-hover: 0 28px 56px rgba(24, 21, 9, 0.18);
  --shadow-float: 0 14px 26px rgba(24, 21, 9, 0.18);
  --shadow-pop: 0 34px 64px rgba(0, 0, 0, 0.28);

  /* borders */
  --border-soft: 1.6px solid rgba(24, 21, 9, 0.16); /* @kind other */
  --border-hairline: 1px solid rgba(24, 21, 9, 0.06); /* @kind other */

  /* spacing scale (landing page rhythm) */
  --space-1: 4px;
  --space-2: 9px;
  --space-3: 12px;
  --space-4: 18px;
  --space-5: 28px;
  --space-6: 40px;
  --space-7: 60px;
  --space-8: 88px;
}