/* =============================================================
   Sistema de diseño Lúmina (compartido por la web y el panel)
   Los colores de marca --brand y --accent se sobrescriben desde
   el panel (Configuración > Branding) mediante un <style> en línea.
   ============================================================= */

@font-face {
  font-family: "Marcellus";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/marcellus-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Marcellus";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/marcellus-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+20A0-20AB, U+20AD-20C4, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/jost-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/jost-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+20A0-20AB, U+20AD-20C4, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* Marca (editable) */
  --brand: #55705A;          /* verde salvia profundo: botones, enlaces, foco */
  --accent: #B0894F;         /* dorado discreto: filetes, detalles */

  /* Derivados de marca */
  --brand-strong: color-mix(in srgb, var(--brand) 78%, #000);
  --brand-soft: color-mix(in srgb, var(--brand) 14%, #fff);
  --brand-wash: color-mix(in srgb, var(--brand) 7%, #fff);
  --accent-text: color-mix(in srgb, var(--accent) 70%, #000);

  /* Neutros cálidos */
  --ivory: #FBF8F2;          /* fondo general */
  --paper: #FFFFFF;          /* tarjetas */
  --beige: #E9DCC9;          /* bloques cálidos */
  --beige-soft: #F3EBDF;
  --sand: #D8C3A5;
  --ink: #2F322E;            /* gris oscuro: texto principal */
  --ink-2: #4E534B;          /* texto secundario */
  --muted: #646960;          /* etiquetas (≥ 4.5:1 sobre marfil y blanco) */
  --line: rgb(47 50 46 / .12);
  --line-strong: rgb(47 50 46 / .24);

  /* Estados de reserva (texto ≥ 4.5:1 sobre su fondo) */
  --st-pending: #8A5A12;     --st-pending-bg: #FBF0DC;
  --st-confirmed: #2F6B45;   --st-confirmed-bg: #E3F1E6;
  --st-completed: #45546B;   --st-completed-bg: #E6EBF2;
  --st-cancelled: #9A3434;   --st-cancelled-bg: #F8E4E2;
  --danger: #B3261E;

  /* Tipografía: escala 1.25 sobre base 17px */
  --font-display: "Marcellus", "Cormorant Garamond", Georgia, serif;
  --font-body: "Jost", "Segoe UI", system-ui, -apple-system, sans-serif;
  --fs-xs: .8125rem;   /* 13 */
  --fs-sm: .9375rem;   /* 15 */
  --fs-base: 1.0625rem;/* 17 */
  --fs-md: 1.3125rem;  /* 21 */
  --fs-lg: 1.625rem;   /* 26 */
  --fs-xl: 2.0625rem;  /* 33 */
  --fs-2xl: clamp(2.25rem, 1.6rem + 2.4vw, 3.25rem);
  --fs-hero: clamp(2.6rem, 1.6rem + 4.2vw, 4.75rem);

  /* Espaciado (8 px) */
  --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem; --s-5: 1.5rem;
  --s-6: 2rem; --s-7: 3rem; --s-8: 4rem; --s-9: 6rem; --s-10: 8rem;

  /* Formas: el arco es la firma de la marca; el resto es sobrio */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-arch: 999px 999px var(--r-md) var(--r-md);

  --shadow-card: 0 1px 2px rgb(47 50 46 / .05), 0 8px 24px -12px rgb(47 50 46 / .12);
  --shadow-pop: 0 18px 40px -16px rgb(47 50 46 / .28), 0 0 0 1px rgb(47 50 46 / .06);

  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --t-fast: 150ms;
  --t-med: 260ms;

  --focus: 0 0 0 3px var(--ivory), 0 0 0 5px var(--brand);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
