/* Colores del logo para todo el sitio.
   Divi trae sus colores globales por defecto (celeste #2ea3f2 en enlaces, gris #666 en
   títulos); las páginas hechas a mano los tapan, pero las de WooCommerce no. */

:root {
	--ta-azul: #023ea7;          /* azul del logo */
	--ta-azul-oscuro: #012a73;
	--ta-azul-claro: #0a56d0;
	--ta-verde: #04aa42;         /* verde del logo: fondos y bordes */
	--ta-verde-texto: #057a32;   /* el verde del logo sobre blanco no llega a 4.5:1 */
	--ta-verde-fondo: #e8f6ed;
	--ta-tinta: #17243d;
	--ta-gris: #5a6a88;
	--ta-niebla: #f2f5fb;
	--ta-linea: #dce3f1;
	--ta-radio: 10px;

	--gcid-primary-color: var(--ta-azul);
	--gcid-secondary-color: var(--ta-verde);
	--gcid-heading-color: var(--ta-tinta);
	--gcid-body-color: #3d4a63;
	--gcid-link-color: var(--ta-azul);
}

body { color: #3d4a63; }
a { color: var(--ta-azul); }
a:hover { color: var(--ta-azul-oscuro); }
h1, h2, h3, h4, h5, h6 { color: var(--ta-tinta); }

/* Menú: Divi no carga los estilos del header en las páginas de WooCommerce. */
.et-l--header .et_pb_fullwidth_menu ul li a,
.et-l--header .et_pb_menu ul li a {
	color: var(--ta-tinta);
	font-weight: 700;
}
.et-l--header .et_pb_fullwidth_menu ul li a:hover,
.et-l--header .et_pb_menu ul li a:hover { color: var(--ta-azul); opacity: 1; }
.et-l--header .et_pb_fullwidth_menu ul li.current-menu-item > a,
.et-l--header .et_pb_fullwidth_menu ul li.current_page_item > a,
.et-l--header .et_pb_menu ul li.current-menu-item > a { color: var(--ta-azul); }
.et-l--header .et_mobile_menu,
.et-l--header .nav li ul { border-color: var(--ta-verde) !important; }

/* Banda de título de las páginas de tienda: la misma idea que el encabezado de Nosotros o Contacto. */
.todoaseo-banda {
	background: linear-gradient(120deg, var(--ta-azul-oscuro) 0%, var(--ta-azul) 55%, var(--ta-azul-claro) 100%);
	color: #fff;
	padding: 56px 0 50px;
	border-bottom: 4px solid var(--ta-verde);
}
.todoaseo-banda .container { width: 80%; max-width: 1080px; margin: 0 auto; }
.todoaseo-banda h1 {
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: clamp(30px, 3.6vw, 44px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.015em;
}
.todoaseo-banda p {
	margin: 12px 0 0;
	padding: 0;
	max-width: 62ch;
	color: rgba(255, 255, 255, 0.86);
	font-size: 16px;
	line-height: 1.55;
}
@media (max-width: 980px) {
	.todoaseo-banda { padding: 36px 0 32px; }
	.todoaseo-banda .container { width: 90%; }
}