/* =============================================================
   SPACING, LAYOUT & SHAPE — Manoella Melim
   Generous, calm rhythm. Square corners. No shadows.
   ============================================================= */

:root {
  /* ---- Spacing scale (8px base, room to breathe) ---- */
  --space-2xs: 0.25rem;  /* 4px  */
  --space-xs:  0.5rem;   /* 8px  */
  --space-sm:  0.75rem;  /* 12px */
  --space-md:  1rem;     /* 16px */
  --space-lg:  1.5rem;   /* 24px */
  --space-xl:  2.5rem;   /* 40px */
  --space-2xl: 4rem;     /* 64px */
  --space-3xl: 6rem;     /* 96px */
  --space-4xl: 9rem;     /* 144px — section gutters */
  --space-5xl: 12rem;    /* 192px — full air */

  /* ---- Layout ---- */
  --container-max: 1440px;
  --container-text: 680px;     /* readable measure */
  --gutter-page: 4rem;         /* wide page margins */
  --gutter-page-sm: 1.5rem;
  --grid-gap: 1.5rem;

  /* ---- Shape: cantos vivos — everything is square ---- */
  --radius: 0;
  --radius-none: 0;

  /* ---- Borders ---- */
  --border-width: 1px;         /* hairline */
  --border-width-strong: 1.5px;

  /* ---- Elevation: there is none. Depth = space + photography. ---- */
  --shadow-none: none;

  /* ---- Motion: calm, subtle ---- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --dur-fast: 180ms; /* @kind other */
  --dur: 320ms; /* @kind other */
  --dur-slow: 420ms; /* @kind other */
}

/* ---- Reduced motion: honor the OS setting. Neutralizes transitions/animations
   everywhere (incl. inline styles, via !important). State still changes — just
   instantly, without movement. ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
