/* Fuentes servidas desde el propio sitio (oct 2026). Anton y Archivo, SIL Open Font License 1.1, descargadas de Google Fonts. Ver /fonts/README.txt */
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/anton-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:'Archivo';font-style:normal;font-weight:300 900;font-display:swap;src:url(/fonts/archivo-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:'Archivo';font-style:italic;font-weight:300 900;font-display:swap;src:url(/fonts/archivo-italic-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}
/* ──────────────────────────────────────────────────────────
   MODO INGLÉS — marca.css
   La marca vive AQUÍ y solo aquí. Colores y tipografías de todo
   el sitio. Para cambiar la marca, cambia este archivo; ninguna
   página debe tener colores de marca escritos a mano.

   Regla (CLAUDE.md): nunca escribir #FF4500 (ni ningún color de
   marca) en una página; usar var(--naranja) etc.

   Cargado ANTES de base.css en <head> (y en las 8 páginas
   especiales, que no cargan base.css).
   ────────────────────────────────────────────────────────── */

:root {
  /* Marca — sistema riso, bloqueado 10 oct 2026 (brand book v1) */
  --naranja: #FF4500;           /* Naranja Flinch: botones, lo que aterriza. Texto encima SIEMPRE negro */
  --naranja-rgb: 255, 69, 0;
  --naranja-hover: #E03D00;
  --naranja-profundo: #C23500;

  --azul: #000080;              /* Azul Modo: títulos, secciones oscuras */
  --azul-rgb: 0, 0, 128;

  --tinta: #0A0A0A;             /* Negro Habla: texto y donde se cruzan las tintas */
  --noche: #000080;             /* secciones oscuras → azul Modo */
  --noche-2: #00006B;           /* variante de sección oscura */
  --noche-3: #0A0A0A;           /* variante de sección oscura → negro */

  --blanco: #FFFFFF;
  --crema: #E7E6EC;             /* fondo de página → Lavanda gris */
  --crema-calida: #FFFFFF;      /* tarjetas → blanco */
  --crema-calida-2: #F4F3F7;
  --crema-calida-3: #F4F3F7;

  --linea: #D3D2DA;             /* bordes y divisores */
  --linea-2: #DCDBE2;
  --linea-calida: #D3D2DA;

  --gris: #4E4D57;              /* texto secundario (contraste AA sobre lavanda) */
  --gris-2: #44434C;
  --gris-3: #5F5E68;

  /* Funcionales — no cambian con la marca */
  --whatsapp: #25d366;
  --whatsapp-hover: #1ebe5d;

  /* Tipografía — Anton para titulares grandes (h1/h2, ver base.css), Archivo para todo lo demás */
  --fuente-display: 'Anton', Impact, 'Arial Narrow', sans-serif;
  --fuente-titulos: 'Archivo', Arial, sans-serif;
  --fuente-texto: 'Archivo', Arial, sans-serif;
}

/* Medios de pago con logos oficiales (Ronda 18, 12 oct 2026). Fuentes y reglas: /images/pagos/README.txt
   Cada logo va tal cual, a color, sobre una ficha blanca. Tarjetas: Visa, Mastercard y American Express (las que acepta Wompi). */
.pl{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px;--h:34px}
.pl li,.pl-tile{height:var(--h);min-width:calc(var(--h)*1.72);padding:0 calc(var(--h)*.26);background:#fff;border-radius:calc(var(--h)*.17);display:inline-flex;align-items:center;justify-content:center;box-shadow:0 0 0 1px #D3D2DA;flex:none;box-sizing:border-box}
.pl li.cd{padding:0}
.pl li.cd img{height:100%;width:auto}
.pl img,.pl-tile img{display:block;width:auto;max-width:none;height:calc(var(--h)*var(--k,.5))}
.pl .lg-pse,.pl .lg-davi{--k:.78}
.pl .lg-nequi{--k:.4}
.pl .lg-banco{--k:.34}
.pl-tile .lg-wompi{--k:.44}
.pl-tile{--h:26px;vertical-align:middle;margin:0 2px}
.pl--dark li,.pl-tile--dark{box-shadow:none}
@media (max-width:640px){
  .pl:not(.pl--dark){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;--h:32px}
  .pl:not(.pl--dark) li{min-width:0;padding:0 4px}
  .pl:not(.pl--dark) li.w2{grid-column:span 2}
  .pl:not(.pl--dark) li img{max-width:100%;object-fit:contain}
}

/* Accesibilidad: enlace «Saltar al contenido» (16 oct 2026). Vive aquí porque marca.css es la
   única hoja que cargan las 70 páginas. Invisible hasta que recibe el foco del teclado. */
.salto{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--azul);color:#fff;padding:12px 18px;font:800 15px var(--fuente-texto);text-decoration:none}
.salto:focus{left:16px;top:16px;outline:3px solid var(--naranja);outline-offset:2px}
