/* =========================================================
   NEWWEST — Tokens de diseño
   Fuente: Brand Book 1.0 (taupe #896B5F, blanco, marfil #F4F1EA)
   + dirección visual aprobada en referencia/landing-v1
   ========================================================= */

:root {
  /* Color — marca */
  --taupe: #896B5F;          /* color tipográfico y de marca (Brand Book) */
  --taupe-dark: #6E5449;     /* hover, fondos secundarios */
  --taupe-deep: #3B2E28;     /* overlays sobre foto y video */
  --ink: #896B5F;            /* texto de párrafo: nada en negro, todo en taupe */
  --ink-soft: #896B5F;       /* texto secundario */
  --whatsapp: #25D366;       /* verde oficial de WhatsApp */

  /* Color — fondos */
  --paper: #FFFFFF;          /* fondo principal (Brand Book) */
  --marfil: #F4F1EA;         /* fondo alterno (Brand Book) */
  --marfil-2: #E9E3D8;       /* placeholders, divisiones suaves */

  /* Líneas */
  --line: rgba(137, 107, 95, .26);
  --line-strong: rgba(137, 107, 95, .6);
  --line-light: rgba(255, 255, 255, .26);
  --line-light-soft: rgba(255, 255, 255, .12);

  /* Tipografía (gratuitas, licencia SIL OFL) */
  --display: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --sans: "Manrope", "Helvetica Neue", Arial, sans-serif;

  /* Escala tipográfica — ÚNICA para todo el sitio (definida en la Home).
     Ninguna página debe declarar tamaños de texto propios: usar estas clases/tokens. */
  --fs-hero: clamp(2.6rem, min(6.4vw, 10.5vh), 6.6rem);   /* .t-hero: título del hero de cada página */
  --fs-hero-sub: clamp(1.15rem, min(1.8vw, 2.8vh), 1.65rem); /* .t-hero-sub: bajada en itálica del hero */
  --fs-title: clamp(2.3rem, 4.8vw, 4.9rem);                /* .t-title: títulos de sección en mayúsculas */
  --fs-subtitle: clamp(1.7rem, 2.8vw, 2.6rem);             /* .t-subtitle: subtítulos en mayúsculas (servicios, misión...) */
  --fs-list: clamp(1.3rem, 1.7vw, 1.6rem);                 /* listas en serif (principios, valores) */
  --fs-lead: clamp(1.35rem, 1.9vw, 1.8rem);                /* .t-lead: párrafo de entrada en serif */
  --fs-body: clamp(.98rem, 1.05vw, 1.06rem);
  --fs-label: .7rem;

  /* Espaciado y grilla */
  --gutter: clamp(16px, 4vw, 64px);
  --max: 1440px;
  --section: clamp(96px, 12vw, 190px);
  --hero-h: 100vh;           /* Home: video de entrada a pantalla completa (100svh en navegadores modernos, ver abajo) */
  --hero-min-h: 600px;
  --page-hero-h: 82vh;       /* TODAS las demás páginas: mismo alto que Acerca de (82svh en navegadores modernos) */
  --page-hero-min-h: 520px;
  --header-h: 104px;
  --header-h-compact: 70px;

  /* Movimiento */
  --ease: cubic-bezier(.2, .7, .1, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --t-reveal: 1.1s;
  --t-header: 1s;            /* cambio del header al hacer scroll: pausado, sin ser lento */
}

/* Navegadores modernos: alto "svh" (descuenta las barras del navegador en celulares).
   Los anteriores a 2022 no lo entienden y usan el "vh" de arriba (sin esto, la portada podía colapsar). */
@supports (height: 100svh) {
  :root { --hero-h: 100svh; --page-hero-h: 82svh; }
}