/* ============================================================
   Compradores — Spacing, radii, shadows, motion
   Architectural restraint: tight radii, hairline borders,
   low warm-tinted shadows.
   ============================================================ */

:root {
  /* ---- Spacing (4px base) ---- */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  32px;
  --space-8:  40px;
  --space-9:  48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 96px;
  --space-13: 128px;
  --space-14: 160px;

  /* ---- Radii (architectural — restrained) ---- */
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   10px;
  --radius-xl:   14px;
  --radius-2xl:  20px;
  --radius-pill: 999px;
  --radius-card: var(--radius-lg);

  /* ---- Borders ---- */
  --border-hair:  1px;
  --border-thick: 1.5px;

  /* ---- Shadows (warm-tinted, low) ---- */
  --shadow-xs: 0 1px 2px rgba(26, 23, 20, 0.05);
  --shadow-sm: 0 1px 3px rgba(26, 23, 20, 0.07), 0 1px 2px rgba(26, 23, 20, 0.04);
  --shadow-md: 0 4px 12px rgba(26, 23, 20, 0.08), 0 1px 3px rgba(26, 23, 20, 0.05);
  --shadow-lg: 0 12px 28px rgba(26, 23, 20, 0.10), 0 4px 10px rgba(26, 23, 20, 0.05);
  --shadow-xl: 0 24px 56px rgba(26, 23, 20, 0.14), 0 8px 20px rgba(26, 23, 20, 0.07);
  --shadow-gold: 0 8px 24px rgba(138, 111, 73, 0.22);
  --shadow-inset: inset 0 1px 2px rgba(26, 23, 20, 0.06);

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(0.2, 0.7, 0.3, 1);   /* @kind other */
  --ease-inout: cubic-bezier(0.6, 0, 0.2, 1);     /* @kind other */
  --ease-soft:  cubic-bezier(0.33, 1, 0.68, 1);   /* @kind other */
  --dur-fast:   120ms;  /* @kind other */
  --dur-base:   200ms;  /* @kind other */
  --dur-slow:   360ms;  /* @kind other */

  /* ---- Layout ---- */
  --container-sm:  680px;
  --container-md:  960px;
  --container-lg:  1200px;
  --container-xl:  1360px;
  --sidebar-w:     264px;
  --header-h:      68px;

  /* ---- Z ---- */
  --z-base: 0;       /* @kind other */
  --z-sticky: 100;   /* @kind other */
  --z-overlay: 800;  /* @kind other */
  --z-modal: 900;    /* @kind other */
  --z-toast: 1000;   /* @kind other */
}