/* =====================================================================
   HOJA DE ESTE SITIO. Es lo ÚNICO que cambia entre las cinco webs.

   Se carga DESPUÉS de base.css, así que lo que se declare aquí gana. No
   añada reglas: si necesita una, probablemente deba ir en la base con su
   variable, para que los cinco sitios la compartan.
   ===================================================================== */

/* =====================================================================
   registresumarcaenlinea.com — sistema visual
   Paleta y tipografías tomadas del sitio en producción, no inventadas.
   Este archivo es la plantilla para los 5 sitios hermanos: lo único que
   cambia entre ellos son los tokens del bloque :root.
   ===================================================================== */

:root{
  /* --- Color. Medido sobre logo-registro-marca.jpg, no elegido a ojo.
     El azul marino hace todo el trabajo legible (15,33:1 sobre la crema) y el
     oro es acento: sobre crema da 1,80:1, así que NUNCA es texto en claro.
     Donde el oro tenga que leerse sobre fondo claro se usa --acento-texto. --- */
  --tinta:      #08203C;   /* títulos — el azul del logo */
  --texto:      #333333;   /* cuerpo — 11,82:1 sobre la crema */
  --apagado:    #6B6B6B;   /* secundario — 4,99:1; el #828282 anterior daba 3,60 */
  --accion:       #08203C;   /* enlaces, viñetas, filetes */
  --accion-hover: #0F3560;
  --acento:       #D2B87F;   /* oro: fondo de botón y detalles sobre oscuro */
  --acento-texto: #8A6D28;   /* el oro cuando deba ser texto en claro (4,57:1) */
  --azul:       #08203C;   /* ancla de sección */
  --azul-claro: #0F3560;
  --fondo:      #FAF7F2;   /* la crema del logo, no blanco */
  --superficie: #F2EDE4;
  --borde:      #E6DFD4;

  /* --- Espaciado: 7 pasos, ningún valor fuera de la escala --- */
  --e-xs:.5rem; --e-sm:.75rem; --e-md:1rem;
  --e-lg:1.5rem; --e-xl:2.5rem; --e-2xl:4rem; --e-3xl:6rem;
  /* Respiro vertical de una sección del Home. Tiene nombre propio —y no es
     uno de los siete pasos— porque marca el ritmo de la página entera y se
     ajusta a ojo mirando el sitio, no la escala. */
  --e-seccion:5rem;

  /* --- Tipografía fluida (editable desde §7 del panel) --- */
  --paso--1:clamp(.82rem,.79rem + .15vw,.88rem);
  --paso-0: clamp(1rem,.96rem + .2vw,1.09rem);
  --paso-1: clamp(1.19rem,1.11rem + .4vw,1.44rem);
  --paso-2: clamp(1.42rem,1.28rem + .7vw,1.9rem);
  --paso-3: clamp(1.69rem,1.46rem + 1.15vw,2.5rem);
  --paso-4: clamp(2.01rem,1.63rem + 1.9vw,3.3rem);

  --display:'Lexend',system-ui,sans-serif;
  --nav:'Roboto Condensed',system-ui,sans-serif;
  --cuerpo:'Lato',system-ui,-apple-system,sans-serif;

  --ancho:1180px; --radio:10px; --radio-btn:999px;
  --sombra:0 1px 2px rgba(19,25,73,.05), 0 8px 24px rgba(19,25,73,.06);
  --sombra-alta:0 2px 6px rgba(19,25,73,.07), 0 16px 36px rgba(19,25,73,.12);
}

/* --- Lo que este sitio hace distinto de la base ---
   Antes estas seis reglas estaban escritas a mano al final de la hoja; ahora
   son variables, que es lo que permite que la base sea una sola.

   El botón va en color de ACENTO con el texto en tinta, no en el color de
   acción: es la combinación que da contraste sobre el oro. */
:root{
  --cabecera-fondo:  #FFFFFF;   /* blanco aunque el fondo del sitio no lo sea */
  --btn-fondo:       var(--acento);
  --btn-texto:       var(--tinta);
  --btn-fondo-hover: #C4A868;   /* su propio acento (#D2B87F) oscurecido */
  --btn-texto-hover: var(--tinta);
  --btn2-texto:      var(--accion);
  --btn2-borde:      var(--accion);
  --btn2-fondo-hover:var(--accion);
  --btn2-texto-hover:var(--fondo);
  --btn-oscura-fondo:var(--acento);
  --btn-oscura-texto:var(--tinta);
}