/* Eco X — Spacing & layout tokens
   The system is built on a hairline grid: panels sit on a --rule background
   with 1px gaps, reading as thin dividing lines. Section padding is generous
   and vertical; content is capped at a fixed max width and gutters are a
   percentage of viewport. Corners are square everywhere — there is no radius
   scale by design. */
:root {
  /* ── Spacing scale ── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 44px;
  --space-8: 52px;
  --space-9: 64px;
  --space-10: 80px;
  --space-11: 88px;

  /* ── Layout ── */
  --content-max: 1240px;   /* inner content cap */
  --gutter: 5%;            /* page side padding (percentage of viewport) */
  --hairline: 1px;         /* the grid gap / border width */
  --section-y: 88px;       /* default vertical section rhythm */

  /* ── Component padding ── */
  --pad-card: 28px 24px;
  --pad-panel: 52px 44px;
  --pad-btn: 14px 32px;
  --pad-btn-sm: 10px 22px;

  /* ── Radius (intentionally square) ── */
  --radius-none: 0;
  --radius-pill: 999px;    /* only the round WhatsApp FAB & status dots */

  /* ── Sticky nav height ── */
  --nav-h: 72px;
  --topbar-h: 36px;
}