/* ==========================================================================
   Clima Pergamino — Design Tokens
   Base institucional (inspirado en pergamino.ar)
   Fuente: Manrope
   ========================================================================== */

:root{
  /* =========================
     Typography
     ========================= */
  --font-sans: "Manrope", system-ui, -apple-system, "Segoe UI",
               Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* =========================
     Colors
     ========================= */
  --white: #ffffff;
  --black: #000000;

  --ink: #101828;
  --ink-strong: #1D2939;
  --muted: #667085;
  --muted-2: #98A2B3;

  --line: #EAECF0;
  --bg: #F6F7F9;

  /* Brand (amarillo municipal) */
  --brand: #F4B63E;
  --brand-600: #EAA321;
  --brand-700: #D98E12;

  --brand-soft: rgba(244,182,62,.18);
  --brand-soft-2: rgba(244,182,62,.28);

  /* Dark / footer */
  --dark: #0B1220;
  --dark-ink: #E6EAF2;
  --dark-muted: #A9B3C5;
  --dark-line: rgba(255,255,255,.12);

  /* Status */
  --ok: #12B76A;
  --warn: #F79009;
  --danger: #F04438;
  --info: #2E90FA;

  --ok-soft: rgba(18,183,106,.14);
  --warn-soft: rgba(247,144,9,.14);
  --danger-soft: rgba(240,68,56,.14);
  --info-soft: rgba(46,144,250,.14);

  /* =========================
     Radius
     ========================= */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;
  --r-xl: 22px;

  /* =========================
     Shadows
     ========================= */
  --shadow-xs: 0 1px 2px rgba(16,24,40,.06);
  --shadow-sm: 0 4px 10px rgba(16,24,40,.08);
  --shadow-md: 0 10px 24px rgba(16,24,40,.12);

  /* =========================
     Spacing
     ========================= */
  --p-1: 4px;
  --p-2: 8px;
  --p-3: 12px;
  --p-4: 16px;
  --p-5: 20px;
  --p-6: 24px;
  --p-7: 32px;

  /* =========================
     Layout
     ========================= */
  --container-max: 1140px;
  --gutter: 16px;

  /* =========================
     Controls & motion
     ========================= */
  --btn-h: 44px;
  --focus-ring: 0 0 0 4px rgba(46,144,250,.18);

  --t-fast: 120ms;
  --t: 180ms;
  --e: cubic-bezier(.2,.8,.2,1);
}

/* Mejor render de fuentes */
html{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}