/*
 * Tokens de diseño de AFCE.
 *
 * Este es el único archivo donde se definen colores, tipografía y espaciado.
 * Si mañana hay que cambiar el verde de marca, se cambia aquí y en ningún
 * otro sitio. En el sitio viejo ese mismo cambio obligaba a tocar 50 hojas
 * de estilo y los ajustes de WPBakery, y siempre quedaba alguno sin migrar.
 */

:root{
  /* --- Paleta de marca AFCE (los tres colores oficiales) --- */
  --brand-teal:#04A99C;   /* Azul Verdoso   */
  --brand-blue:#233D82;   /* Azul Obscuro   */
  --brand-navy:#002060;   /* Azul Muy Obscuro */

  /* --- Superficies --- */
  --bg:#F5F7F8;
  --surface:#FFFFFF;
  --surface-2:#EAF1F1;

  /*
   * Neutros con una pizca de azul, no grises puros. Un gris neutro al lado
   * de esta paleta se ve sucio; estos comparten el matiz de la marca.
   */
  --text:#0E1A2B;
  --text-soft:#3B4C5E;
  --text-muted:#64768A;
  --border:#DCE2E6;
  --border-strong:#C3CBD1;

  /*
   * El verde de marca puro (#04A99C) sobre blanco da 2,6:1 de contraste:
   * no llega al mínimo accesible de 4,5:1 para texto. Por eso el texto en
   * verde usa --accent-ink (#04564F, 8,1:1) y el color puro queda para
   * fondos y bordes, donde el contraste no aplica igual.
   */
  --accent:var(--brand-teal);
  --accent-ink:#04564F;
  --accent-tint:#DEF3F0;

  /* --- Degradado de marca, usado en las bandas oscuras --- */
  --grad-dark:linear-gradient(120deg,var(--brand-navy) 0%,#0A3D8C 52%,var(--accent-ink) 100%);

  /*
   * Velo gris para las fotos de las tarjetas de servicio. Se decidió gris y
   * no de marca porque con velo de color las nueve fotos se veían teñidas
   * del mismo tono y perdían la fotografía.
   *
   * Empezó en un 55-62 % de opacidad y la sección entera se veía apagada: nueve
   * fotos oscurecidas seguidas pesan mucho más que una sola. Está ahora en un
   * 12-17 %, que es lo justo para que las fotos no compitan entre sí. El texto
   * NO va encima de la foto —vive en el cuerpo blanco de la tarjeta—, así que
   * el velo no tiene que garantizar ninguna legibilidad: sólo unificar.
   */
  --grey-wash:linear-gradient(135deg,rgba(52,60,70,.12),rgba(24,30,38,.17));

  /* --- Pie: se mantiene oscuro fijo, no cambia con el tema del visitante --- */
  --footer-bg:#041530;
  --footer-text:#EAF0F6;
  --footer-muted:#93A8C4;
  --footer-border:#1B3A5D;

  /* --- Tipografía --- */
  --font-display:'Newsreader',Georgia,'Times New Roman',serif;
  --font-body:'Public Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;

  /* --- Medidas --- */
  --wrap:1180px;
  --radius:12px;
  --radius-lg:20px;
  --shadow-card:0 1px 2px rgba(14,26,43,.04),0 8px 24px rgba(14,26,43,.06);
  --shadow-hover:0 6px 14px rgba(14,26,43,.08),0 22px 44px rgba(14,26,43,.13);
}

/*
 * Modo oscuro. Se respeta la preferencia del sistema del visitante.
 * Los tres colores de marca no cambian de valor: lo que cambia es el
 * fondo sobre el que se apoyan y los tonos de texto, para que el
 * contraste siga siendo legible.
 */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0A1420;
    --surface:#101B2A;
    --surface-2:#0C1D22;
    --text:#EDF2F5;
    --text-soft:#C4D0DA;
    --text-muted:#8FA1B2;
    --border:#223347;
    --border-strong:#2F4661;
    --accent:#22C9B4;
    --accent-ink:#BFF3E9;
    --accent-tint:#0E2B28;
    --brand-blue:#6E8FD1;
    --shadow-card:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);
    --shadow-hover:0 6px 14px rgba(0,0,0,.4),0 22px 44px rgba(0,0,0,.45);
  }
}
