/* Magda Sweet Cakes — spacing, radius, elevation, motion. */

:root {
  /* Spacing (4px base) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* Radii — soft, pastry-like; the arch is the signature shape */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --radius-arch: 999px 999px 0 0;   /* horseshoe-arch top for images & frames */

  /* Elevation — warm chocolate-tinted shadows, never gray */
  --shadow-card: 0 1px 2px rgba(101, 56, 42, 0.06), 0 4px 14px rgba(101, 56, 42, 0.08);
  --shadow-lift: 0 2px 6px rgba(101, 56, 42, 0.08), 0 12px 28px rgba(101, 56, 42, 0.14);
  --shadow-pop: 0 24px 60px rgba(26, 23, 28, 0.22);

  /* Motion — gentle, confectionery-soft */
  --ease-soft: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --duration-fast: 150ms; /* @kind other */
  --duration-base: 250ms; /* @kind other */
  --duration-slow: 450ms; /* @kind other */
}