/* =========================================================
   CAFCER · Tokens (DESIGN.md · Propuesta C "Altura")
   Fuentes autoalojadas + variables de diseño.
   ========================================================= */
@font-face { font-family: "Poppins"; src: url("../assets/fonts/poppins-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("../assets/fonts/poppins-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("../assets/fonts/poppins-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../assets/fonts/inter-var.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  /* Color */
  --bg: #FAFBF7;
  --surface: #FFFFFF;
  --tint: #EDF2E4;
  --tint-2: #DCE7CB;
  --ink: #0F2418;
  --ink-2: #46544B;          /* 7.6:1 sobre --bg */
  --line: #E1E6DA;
  --green: #0B4022;          /* verde del brochure: acentos */
  --olive: #6C8E38;          /* oliva del logo: detalles y foco */
  --olive-ink: #4E6A26;      /* oliva oscurecido para texto pequeño (AA) */
  --olive-lt: #B9D98A;
  --copper: #A46829;         /* cobre del logo: SOLO CTAs (y anillos, excepción del cliente) */
  --copper-dk: #8A5520;
  --on-green: #D7E5D0;

  /* Mapa del territorio (tomados de la ilustración del brochure) */
  --prov-moyobamba: #0B4022;
  --prov-lamas: #55703A;
  --prov-eldorado: #A9C46F;
  --geo: #E4EBD3;

  /* Tipografía */
  --display: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-display: clamp(44px, 6.4vw, 96px);
  --fs-h2: clamp(36px, 4.4vw, 64px);
  --fs-h3: clamp(22px, 2vw, 28px);
  --fs-body-lg: 19px;
  --fs-body: 17px;
  --fs-small: 15px;

  /* Espaciado (múltiplos de 8) */
  --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px; --s5: 48px; --s6: 64px; --s7: 96px; --s8: 128px;
  --section: clamp(96px, 11vw, 144px);

  /* Forma: controles pill, tarjetas 24/32 */
  --r-pill: 999px;
  --r-sm: 16px;
  --r: 24px;
  --r-lg: 32px;

  /* Sombra teñida de verde */
  --shadow: 0 1px 2px rgba(11, 64, 34, .06), 0 12px 32px rgba(11, 64, 34, .08);
  --shadow-hover: 0 2px 4px rgba(11, 64, 34, .06), 0 24px 56px rgba(11, 64, 34, .14);
  --shadow-cta: 0 10px 24px rgba(164, 104, 41, .28);

  /* Movimiento */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --t-micro: 200ms;
  --t-ui: 350ms;
  --t-reveal: 900ms;

  /* Capas */
  --z-header: 50;
  --z-drawer: 60;
  --z-skip: 100;

  --hdr-h: 72px;
}
@media (min-width: 1080px) { :root { --hdr-h: 80px; } }