/*
 * Compatibilidad con las páginas que siguen con Elementor y con la tienda.
 * Temporal: se borra cuando ya no quede contenido de Elementor.
 *
 * 1. Escudo de la cabecera, el pie y los flotantes frente al kit global de Elementor
 *    (post-11.css), que fija Open Sans en todos los <a> y en h1-h3, y peso 500 en los h2,
 *    con especificidad (0,1,1): más que las clases del sistema.
 * 2. La base que tenía el contenido de Elementor antes del sistema de diseño (tema de la
 *    Fase 1): bundle.css trae reglas globales (márgenes a 0, imágenes en bloque, 17/26 px)
 *    que cambiarían su aspecto. Se restablecen solo dentro de .ma-sitio-contenido, con
 *    especificidad (0,0,1): ganan a bundle.css (va antes) y pierden ante Elementor, el kit
 *    y legacy-contenido.css (va después), como antes.
 */

/* Titulares h4-h6 del contenido de Elementor: Barlow Condensed 700, como hasta ahora. */
@font-face {
	font-family: "Barlow Condensed";
	src: url("../fonts/barlow-condensed-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* «Reducir movimiento»: sin el desplazamiento suave que legacy-contenido.css pone en html (revisión
   de accesibilidad, etapa 8b). :root (0,1,0) gana a su html (0,0,1), que va después. */
@media (prefers-reduced-motion: reduce) {
	:root {
		scroll-behavior: auto;
	}
}

/* 1. Escudo (0,2,2) --------------------------------------------------------- */
body[class*="elementor-kit-"] :is(.ma-cab, .ma-pie, .ma-botonera, .ma-whatsapp) :is(a, h1, h2, h3) {
	font-family: inherit;
}

/* El kit pinta el texto de <body> en #424A52; la cabecera hereda la tinta del sistema. */
body[class*="elementor-kit-"] .ma-cab {
	color: var(--tinta);
}

/* Enlaces que en bundle.css llevan la fuente de titulares (0,3,1). */
body[class*="elementor-kit-"] :is(.ma-cab, .ma-pie) :is(.ma-t-2, .ma-mega__grande, .ma-menu-movil__item, .ma-pie__telefono) {
	font-family: var(--font-display);
}

/* El kit deja los h2 en peso 500; los títulos del pie son 600 (bundle.css). */
body[class*="elementor-kit-"] .ma-pie h2.ma-pie__titulo {
	font-weight: 600;
}

/* 2. Base del contenido, como antes ------------------------------------------ */
:where(.ma-sitio-contenido) {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
}

:where(.ma-sitio-contenido) img {
	display: inline;
	vertical-align: middle;
}

:where(.ma-sitio-contenido) h1,
:where(.ma-sitio-contenido) h2,
:where(.ma-sitio-contenido) h3,
:where(.ma-sitio-contenido) h4,
:where(.ma-sitio-contenido) h5,
:where(.ma-sitio-contenido) h6 {
	margin: 0 0 .5em;
	font-family: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
	font-weight: 700;
	line-height: 1.1;
	color: #1a1a1a;
}

:where(.ma-sitio-contenido) p {
	margin: 0 0 1em;
}

:where(.ma-sitio-contenido) ul,
:where(.ma-sitio-contenido) figure {
	margin: revert;
}

:where(.ma-sitio-contenido) a {
	color: #d51f26;
}

:where(.ma-sitio-contenido) a:hover {
	color: #b0161c;
}

:where(.ma-sitio-contenido) :is(button, input, select, textarea) {
	font: inherit;
}
