/* Il Casale — space, shape, layers */
:root {
  --space-0: 0; --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; --space-10: 112px; --space-11: 160px;

  --section-y: var(--space-10);
  --section-y-tight: var(--space-8);
  --gutter: var(--space-5);
  --gutter-lg: var(--space-8);
  --container-max: 1280px;
  --container-text: 680px;
  --container-narrow: 520px;

  /* Shape. Two shapes only: the square edge and the arch. */
  --radius-none: 0px;
  --radius-arch: 999px 999px 0 0;     /* the niche — portrait media, feature frames */
  --radius-round: 999px;              /* the dome — avatars, the single icon button */
  --radius-card: var(--radius-none);
  --radius-control: var(--radius-none);
  --radius-image: var(--radius-none);

  /* The cornice: a hairline border plus a second hairline set 4px outside it. */
  --line-hairline: 1px;
  --cornice-gap: 4px;

  --control-sm: 40px; --control-md: 48px; --control-lg: 58px;

  --ratio-hero: 16/9;
  --ratio-arch: 3/4;
  --ratio-dish: 4/5;
  --ratio-wide: 5/3;
  --ratio-square: 1/1;

  --z-base: 0; --z-sticky: 100; --z-header: 200; --z-overlay: 300; --z-modal: 400;
}