/* ═══════════════════════════════════════════════════════════════════
   adrianheredia.es · Sistema de diseño v1.1 · TOKENS
   Fuente única de valores. Si un valor no está aquí, no existe.
   Implementación de referencia: home-final.html (en el paquete: maquetas/home.html)
   ═══════════════════════════════════════════════════════════════════ */

:root{
  /* ── COLOR · paleta del Documento de Marca (+ base firmada por Estrategia) ──
     Jerarquía: base y cremas = el grueso · tinta = puntuación ·
     agua y verde = acentos que respiran · naranja = firma (presencia, nunca superficie) */
  --c-base:#FEFCF8;         /* papel cuaderno: fondo de todo */
  --c-crema:#F3EADA;        /* superficies suaves · texto sobre agua · brillo del reflejo */
  --c-papel:#E6D8BE;        /* líneas, bordes, separadores */
  --c-tierra:#6F4327;       /* texto secundario · fibras del papel · interior de El Cuaderno */
  --c-rufus:#A24E17;        /* naranja para texto pequeño (AA) · foco · partículas */
  --c-naranja:#F26322;      /* FIRMA: acentos, palabras cortas, luz. Nunca fondo */
  --c-agua:#5E8AA0;         /* el mar · interior de Sobre mí */
  --c-verde:#3F8A72;        /* Verde Cobalto · interior de Contacto */
  --c-verde-hondo:#2F6B58;  /* derivado: sombra del Verde Cobalto, solo para que el texto pase AA */
  --c-tinta:#1E1913;        /* títulos, texto, piezas dramáticas */

  /* ── TIPOGRAFÍA ── */
  --f-firma:var(--f-titular); /* la firma de la web es Archivo Black (decisión de Adrián, 12/10/2026). KHUJA descartada */
  --f-titular:'Archivo Black','Archivo',Impact,sans-serif;   /* puertas, H1 */
  --f-titulo:'Archivo',Impact,sans-serif;                    /* H2, menú (700/800) */
  --f-muro:'Archivo Narrow','Arial Narrow',Arial,sans-serif; /* solo el muro del nombre */
  --f-cuerpo:'Inter',-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;

  --t-h1:clamp(44px,6.4vw,86px);
  --t-h2:clamp(28px,4vw,44px);
  --t-menu:22px;
  --t-lead:clamp(16px,1.5vw,19px);
  --t-cuerpo:16px;
  --t-lectura:18px;         /* cartas de El Cuaderno · máx. 66 caracteres por línea */
  --t-meta:13px;
  --t-legal:12.5px;
  /* Títulos de puerta: escalan con el ancho de SU puerta (container queries) */
  --t-puerta:clamp(24px,13cqi,54px);
  --t-puerta-destacada:clamp(40px,14.5cqi,112px);

  --lh-titular:.9;  --lh-titulo:1;  --lh-cuerpo:1.6;  --lh-lectura:1.7;
  --contorno:1.5px; --contorno-destacado:2px;   /* títulos en reposo */

  /* ── ESPACIO (base 4/8) ── */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px;
  --pad-x:clamp(20px,4vw,32px);
  --container:1140px;       /* páginas interiores */
  /* Breakpoint único: 860px. Siempre tres columnas sobre el agua · <860: títulos en vertical y apertura al tocar */

  /* ── ESCENA (home) ── */
  --top:clamp(108px,17vh,180px);   /* banda superior: píldora + orejas */
  --sea-h:min(24vh,230px);         /* altura del agua */
  --foot-h:58px;                   /* el footer flota sobre el agua */

  /* ── FORMA ── */
  --r-pill:999px;           /* píldora, botones */
  --r-panel:16px;           /* desplegable, paneles */
  --r-media:10px;           /* fotos enmarcadas */
  --sh-pill:0 12px 30px -20px rgba(30,25,19,.4);
  --sh-panel:0 40px 80px -36px rgba(30,25,19,.5);

  /* ── MOVIMIENTO ── */
  --ease-emerge:cubic-bezier(.22,1,.36,1);   /* todo lo que aparece o se abre */
  --ease-trazo:cubic-bezier(.65,0,.35,1);    /* trazos dibujados (círculo) */
  --d-rapido:200ms;          /* hover */
  --d-base:350ms;            /* color, fundidos */
  --d-apertura:850ms;        /* revelado A: la puerta se abre desde la línea central */
  --d-entrada:1100ms;        /* títulos que se materializan */
  --d-trazo:1100ms;          /* círculo a mano */
  --d-respira-luz:4.6s;      /* la rendija */
  --d-respira-interior:26s;  /* interiores intuidos */
  /* Revelado B (muro del nombre): se llena 440ms · pausa 70ms · se deshace 620ms */

  /* ── CAPAS ── */
  --z-puerta:1; --z-fuego:2; --z-agua:2; --z-footer:3;
  --z-velo:50; --z-menu:55; --z-pildora:60; --z-aviso:80;
}

/* ── FUENTES · AUTOHOSPEDADAS (obligatorio: la política, apartado 09, lo declara) ──
   WOFF2 con subconjunto latino + ñ, tildes, ü, ¿ ¡ · font-display:swap · NUNCA Google Fonts */
@font-face{font-family:'Archivo Black';src:url('/assets/fonts/archivo-black-400.25f33e61.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('/assets/fonts/archivo-700.abada6cd.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('/assets/fonts/archivo-800.c26cda24.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo Narrow';src:url('/assets/fonts/archivo-narrow-700.062eae97.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/inter-400.8909904a.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/inter-500.f3779f1e.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/inter-600.f9a06e79.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/inter-700.6f56409f.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/inter-400-italic.7ea9d2f1.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;transition-delay:0s!important;animation:none!important}
}