/* Hallmark · macrostructure: Portfolio Grid (lookbook-led) + Split Studio hero · tone: editorial calmo
 * theme: studied-DNA (source: plantilla "Opción A · Editorial blanca") · nav: N1b compacta + barra fija de turno · footer: Ft5 statement
 * paper #FFFFFF · ink #1C1C1C · lila #D8C4E6 · nude #E8C2B7 · piedra #E5E3DF
 * display: Cormorant Garamond · logotipo: Antic Didone · texto: Montserrat
 * Hallmark · pre-emit critique: P5 H4 E4 S5 R4 V4
 */
:root {
  /* Marca (bloqueada por la plantilla de Agustina) */
  --color-paper: #FFFFFF;
  --color-ink: #1C1C1C;
  --color-lila: #D8C4E6;
  --color-nude: #E8C2B7;
  --color-piedra: #E5E3DF;

  /* Derivados funcionales */
  --color-paper-2: #F7F5F2;          /* fondo de panel, un paso bajo el blanco */
  --color-ink-2: #4A4542;            /* texto secundario: 9.4:1 sobre blanco */
  --color-ink-3: #6B6460;            /* texto terciario: 5.8:1 sobre blanco */
  --color-line: #E5E3DF;             /* = piedra, filetes */
  --color-line-strong: #8A837D;      /* bordes de campos y controles: 3.7:1 contra blanco */
  --color-lila-deep: #6E4E86;        /* lila oscuro para texto/acento sobre blanco: 7.4:1 */
  --color-nude-deep: #8A4B3B;        /* nude oscuro para texto: 7.2:1 */
  --color-ok: #2F6B4F;               /* confirmado: 6.4:1 */
  --color-ok-bg: #E6F0EA;
  --color-warn: #8A5A12;             /* pendiente: 6.0:1 */
  --color-warn-bg: #F8EEDC;
  --color-danger: #A3324A;           /* cancelar: 6.3:1 */
  --color-danger-bg: #F7E4E8;
  --color-focus: #6E4E86;
  --color-ink-hover: #34302E;
  --color-lila-hover: #CDB5DE;
  --color-lila-wash: #F6F0FA;
  --color-veil: rgba(255, 255, 255, 0.92);
  --color-scrim: rgba(28, 28, 28, 0.45);

  /* Tipografía */
  /* Amarego es la tipografía de la marca (nombre, logo y titulares). No está en Google Fonts: cuando Agus pase el
   * archivo, va en public/fonts/ y se activa con el @font-face de abajo. Mientras tanto se ve Cormorant Garamond. */
  --font-display: 'Amarego', 'Cormorant Garamond', 'Times New Roman', serif;
  --font-logo: 'Antic Didone', 'Cormorant Garamond', serif;
  --font-text: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --text-xs: 0.75rem;     /* 12 */
  --text-sm: 0.875rem;    /* 14 */
  --text-base: 1rem;      /* 16 */
  --text-md: 1.125rem;    /* 18 */
  --text-lg: 1.5rem;      /* 24 */
  --text-xl: 2rem;        /* 32 */
  --text-2xl: 2.5rem;     /* 40 */
  --text-display: clamp(2.9rem, 9vw, 5.25rem);
  --text-display-s: clamp(2.2rem, 6vw, 3.5rem);

  /* Espaciado (4 pt) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  --radius-0: 0;
  --radius-arch: 999px 999px 0 0;
  --radius-sm: 6px;
  --radius-btn: 8px;        /* botones y campos (diseño 2026-10-11) */
  --radius-opt: 12px;       /* opciones del cotizador */
  --radius-card: 16px;      /* tarjetas */
  --radius-lg: 20px;        /* tarjetas grandes */
  --color-ink-card: #2A2A2A; /* solo tarjetas sobre negro en el ingreso */
  --color-muted: #444444;   /* texto secundario sobre gris y blanco: 9.7:1 */
  --color-muted-2: #5C5C5C; /* 6.7:1 sobre blanco */
  --color-err: #8A1C1C;
  --radius-pill: 999px;

  --rule: 1px solid var(--color-line);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0, 1, 0.45);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 120ms;
  --dur-mid: 220ms;
  --dur-slow: 380ms;

  --z-sticky: 20;
  --z-sheet: 40;
  --z-toast: 60;

  --max-w: 1180px;
  --gutter: 20px;
}

@media (min-width: 768px) {
  :root { --gutter: 40px; }
}
/* Activar cuando esté el archivo de Amarego:
@font-face { font-family: 'Amarego'; src: url('/fonts/Amarego.woff2') format('woff2'); font-weight: 400 600; font-display: swap; }
*/

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-mid: 120ms; --dur-slow: 120ms; }
}