/**
 * Sistema de diseño de BONISA.
 *
 * Toda decisión de color, tipografía y espacio vive acá. Cambiar una variable cambia el
 * sitio entero; no hay colores sueltos en el resto de las hojas.
 *
 * ── Sobre la paleta ──────────────────────────────────────────────────────────
 * Los tonos parten de la referencia entregada (energía y bloques de color), no de un
 * brand kit oficial de BONISA todavía. Por eso están en dos capas: los tonos crudos y,
 * encima, los papeles semánticos. Cuando llegue la paleta aprobada se cambian los
 * primeros y el resto sigue funcionando.
 *
 * ── Sobre el contraste ───────────────────────────────────────────────────────
 * Varios de esos tonos son medios y NO alcanzan AA con texto normal. Se midió cada uno:
 *   coral    3.59:1  → bloques y titulares grandes; nunca texto corrido
 *   violeta  4.03:1  → ídem
 *   oliva    3.25:1  → ídem
 *   naranja  4.53:1  → en su variante oscurecida #d3451e, relleno de botón en blanco
 *   amarillo 7.00:1  → relleno con texto carbón; solo como acento, nunca como
 *                      fondo dominante de una sección entera
 *   cielo    7.12:1  → relleno con texto carbón
 * De los que no llegan hay una variante `--b-*-texto` oscurecida hasta pasar 4.5:1.
 */

:root {
	/* ── Tonos crudos ──────────────────────────────────────────────────── */
	--b-coral:    #f04f23;
	--b-azul:     #163a5f;
	--b-amarillo: #f0b841;
	--b-cielo:    #72cfeb;
	--b-violeta:  #6f73e0;
	--b-oliva:    #749a4b;
	--b-carbon:   #333333;
	--b-blanco:   #ffffff;
	/* Azul más profundo para el velo del hero y los bloques oscuros. */
	--b-azul-hondo: #0c223a;
	/* Crema cálido: el fondo alternativo del sitio, en lugar del amarillo pleno. */
	--b-crema:    #faf6ef;

	/* Variantes aptas para TEXTO sobre blanco (todas ≥ 4.5:1). */
	--b-coral-texto:    #d3451e;
	--b-amarillo-texto: #8f6e26;
	--b-cielo-texto:    #447c8c;
	--b-violeta-texto:  #686cd2;
	--b-oliva-texto:    #5f7e3d;

	/* ── Papeles semánticos ────────────────────────────────────────────── */
	--bonisa-ink:       var(--b-carbon);
	--bonisa-ink-soft:  #5c5c5c;
	--bonisa-ink-faint: #8a8a8a;
	--bonisa-paper:     var(--b-blanco);
	--bonisa-surface:   #f7f5f2;
	--bonisa-line:      #e4e0da;

	/* Acento dominante: naranja y azul. El rojo vino salió de la paleta por
	   completo. El naranja puro (3.59:1) sirve para bloques y subrayados; el
	   relleno de botón usa el naranja oscurecido, que sí llega a AA en blanco. */
	--bonisa-accent:      var(--b-coral);
	--bonisa-accent-text: var(--b-coral-texto);
	/*
	 * Paleta única del sitio. Home, Productos, Experiencias y Contacto usaban azules
	 * ligeramente distintos porque cada bloque traía su propio hexadecimal; ahora
	 * todos apuntan aquí.
	 */
	--bonisa-blue:       #0c223a;
	--bonisa-blue-rgb:   12, 34, 58;
	--bonisa-footer:     #071827;
	--bonisa-orange:     #e95420;
	--bonisa-cream:      #f7f3ec;
	--bonisa-sky:        #71c9e2;

	--bonisa-azul:        var(--bonisa-blue);
	--bonisa-azul-medio:  var(--b-azul);
	--bonisa-crema:       var(--bonisa-cream);
	/*
	 * Acento sobre fondo oscuro. El naranja pleno sobre el azul del hero da 3.4:1 y
	 * no llega a AA; este tono aclarado mide 7.1:1 contra #0c223a.
	 */
	--bonisa-acento-claro: #ffb08a;
	--bonisa-aqua:         var(--b-cielo);
	--bonisa-cta:         var(--b-coral-texto);
	--bonisa-cta-hover:   #b93a17;
	--bonisa-cta-ink:     var(--b-blanco);
	/* Subrayado del menú y demás marcas de estado: naranja pleno. */
	--bonisa-estado:      var(--b-coral);

	--bonisa-error: #b32d2e;

	/* ── Tipografía ────────────────────────────────────────────────────── */
	/* Propia de BONISA, no tomada de la referencia. Se cambia en un solo lugar. */
	--bonisa-font-body:    'Heebo', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--bonisa-font-display: 'Montserrat', var(--bonisa-font-body);

	/* ── Medidas ───────────────────────────────────────────────────────── */
	--bonisa-radius:    14px;
	--bonisa-shell:     min(1240px, 92vw);
	--bonisa-section-y: clamp(56px, 8vw, 112px);
	--bonisa-measure:   66ch;
}

/* ─────────────────────────────────────────────────────────────── Base ── */

body {
	font-family: var(--bonisa-font-body);
	color: var(--bonisa-ink);
	background: var(--bonisa-paper);
	/* Ningún componente debe empujar la página a lo ancho en móvil. */
	overflow-x: hidden;
}

h1, h2, h3, h4 {
	font-family: var(--bonisa-font-display);
	color: var(--bonisa-ink);
	line-height: 1.12;
	text-wrap: balance;
	letter-spacing: -.02em;
}

h1 { font-size: clamp(2.2rem, 6.4vw, 4.4rem); }
h2 { font-size: clamp(1.7rem, 3.8vw, 2.7rem); }
h3 { font-size: clamp(1.15rem, 2.2vw, 1.45rem); }

p, li { line-height: 1.65; }

/* Un párrafo de 140 caracteres por línea no se lee. */
.entry-content p,
.entry-content li { max-width: var(--bonisa-measure); }

a { color: var(--bonisa-accent-text); }
a:hover { color: var(--bonisa-cta); }

/* ────────────────────────────────────────────── Foco y accesibilidad ── */

/* Nunca se elimina el indicador de foco: es la única pista de dónde está el teclado. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid var(--bonisa-ink);
	outline-offset: 2px;
	border-radius: 4px;
}

.bonisa-skip-link:focus {
	position: fixed !important;
	top: 12px;
	left: 12px;
	z-index: 100000;
	width: auto;
	height: auto;
	clip: auto;
	clip-path: none;
	padding: 12px 20px;
	background: var(--bonisa-ink);
	color: var(--bonisa-paper);
	border-radius: 8px;
	font-weight: 700;
	text-decoration: none;
}

@media (pointer: coarse) {
	a.elementor-button, button, input[type="submit"] { min-height: 48px; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
}

/* ─────────────────────────────────────────────────────── Estructura ── */

img, svg, video { max-width: 100%; height: auto; }

.entry-content table,
.entry-content pre { display: block; max-width: 100%; overflow-x: auto; }