/* ============================================================
   32 PROYECTOS — Spacing, radii & geometry tokens
   Tight 4px corner radius (precision / fabricated edge), generous
   fluid section rhythm, 1240px max content width.
   ============================================================ */

:root {
  /* — Corner radius — */
  --r: 4px;                 /* canonical — buttons, inputs, chips (precise edge) */
  --r-sm: 4px;
  --r-md: 8px;              /* cards, panels */
  --r-lg: 12px;            /* feature cards, division panels */
  --r-pill: 100px;         /* filters, meta pills, badges */

  /* — Layout — */
  --maxw: 1240px;          /* max content width (.wrap) */
  --gutter: clamp(20px, 5vw, 72px) /* @kind spacing */;   /* page inline padding */

  /* — Section rhythm — */
  --section-y: clamp(64px, 9vw, 140px) /* @kind spacing */;
  --section-y-tight: clamp(56px, 8vw, 120px) /* @kind spacing */;

  /* — Spacing scale — */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 22px;
  --sp-6: 30px;
  --sp-7: 44px;
  --sp-8: 64px;

  /* — Shadows (soft, low, warm — no harsh black) — */
  --shadow-card: 0 16px 36px rgba(0, 0, 0, 0.06);
  --shadow-card-hover: 0 22px 50px rgba(0, 0, 0, 0.08);
  --shadow-pop: 0 18px 40px rgba(0, 0, 0, 0.22);   /* accent badges on photos */
}