/*
Theme Name:   Betheme Child - Aqterra
Theme URI:    https://www.aqterra.cl
Description:  Child theme de Betheme para las mejoras visuales de la tienda Aqterra.
Author:       Proyecto mejoras visuales Aqterra
Template:     betheme
Version:      1.9.12
Text Domain:  betheme-child-aqterra
*/

/* ==========================================================================
   Mejoras visuales Aqterra
   Todo el CSS personalizado va debajo de esta línea, por secciones.
   ========================================================================== */

/* 1. Variables de marca (ajustar con los colores exactos) */
:root {
	--aq-turquesa: #17a8bd;
	--aq-turquesa-osc: #118ea2;
	--aq-azul-oscuro: #0b3a5c;
	--aq-texto: #4d6b7c;
	--aq-fondo-claro: #eaf6fa;
	--aq-radio: 14px;
	--aq-sombra: 0 2px 12px rgba(11, 58, 92, 0.07);
}

/* 2. Fondo general: degradado celeste con ondas suaves arriba y abajo */
html body #Wrapper {
	background-color: #f1f9fb !important;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V60C1200 120 960 110 720 62S240 10 0 56Z' fill='%2317a8bd' fill-opacity='.07'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 220' preserveAspectRatio='none'%3E%3Cpath d='M0 120C240 40 480 40 720 110S1200 190 1440 90V220H0Z' fill='%2317a8bd' fill-opacity='.07'/%3E%3Cpath d='M0 165C260 105 520 115 760 165S1220 215 1440 145V220H0Z' fill='%2317a8bd' fill-opacity='.09'/%3E%3C/svg%3E"),
		linear-gradient(180deg, #e3f4f8 0%, #f1f9fb 35%, #f8fcfd 100%);
	background-repeat: no-repeat, no-repeat, no-repeat;
	background-position: top center, bottom center, 0 0;
	background-size: 100% 120px, 100% 220px, 100% 100%;
}
html body #Content,
html body #Subheader {
	background: transparent !important;
}

/* Título de la página */
.woocommerce-shop #Subheader .title,
.woocommerce-shop h1.entry-title,
.mfn-shop-archive-tmpl-builder h1 {
	color: var(--aq-azul-oscuro) !important;
	font-weight: 700;
}

/* 3. Tarjetas de producto */
.woocommerce ul.products li.product.mfn-product-li-item,
li.product.mfn-product-li-item {
	background: #fff !important;
	border-radius: var(--aq-radius);
	box-shadow: var(--aq-sombra);
	padding: 14px 14px 16px;
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}
li.product.mfn-product-li-item:hover {
	box-shadow: 0 8px 24px rgba(11, 58, 92, 0.12);
	transform: translateY(-2px);
}
li.product .image_frame,
li.product .image_wrapper {
	border-radius: 10px;
}
li.product .mfn-li-product-row-title h5.title,
li.product .mfn-li-product-row-title h5.title a {
	color: var(--aq-azul-oscuro) !important;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.35;
	text-align: left;
	text-transform: none;
}
/* Sin descripción corta, como en el maquetado */
li.product .mfn-li-product-row-description {
	display: none !important;
}
/* Precio: turquesa y negrita; el precio anterior tachado y en gris */
li.product .mfn-li-product-row-price {
	text-align: left;
}
li.product .price,
li.product .price ins,
li.product .price > .amount {
	color: var(--aq-turquesa) !important;
	font-size: 21px;
	font-weight: 700;
	text-decoration: none;
}
li.product .price del,
li.product .price del .amount {
	color: #8a9ba6 !important;
	font-size: 14px;
	font-weight: 400;
	margin-right: 6px;
}
/* Insignias */
li.product .mfn-product-badges .onsale,
li.product .onsale {
	background: var(--aq-turquesa) !important;
	color: #fff !important;
	border-radius: 5px;
	padding: 3px 9px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.3px;
	line-height: 1.4;
	text-transform: uppercase;
}
li.product .mfn-product-badges .onsale.out-of-stock,
li.product.outofstock .onsale {
	background: #7e909c !important;
}

/* 4. Barra lateral de categorías, en tarjeta blanca */
/* Título + listado forman una sola tarjeta; el banner queda aparte debajo */
.mfn-shop-archive-tmpl-builder .mcb-item-sidebar_widget-inner {
	filter: drop-shadow(0 2px 6px rgba(11, 58, 92, 0.08));
}
.mfn-shop-archive-tmpl-builder .mcb-item-sidebar_widget-inner > aside.widget:first-child {
	background: #fff;
	border-radius: var(--aq-radius) var(--aq-radius) 0 0;
	margin: 0;
	padding: 22px 20px 4px;
}
.mfn-shop-archive-tmpl-builder .mcb-item-sidebar_widget-inner > aside.widget:nth-child(2) {
	background: #fff;
	border-radius: 0 0 var(--aq-radius) var(--aq-radius);
	margin: 0;
	padding: 0 20px 18px;
}
.mfn-shop-archive-tmpl-builder .mcb-item-sidebar_widget-inner h3.wp-block-heading {
	color: var(--aq-azul-oscuro) !important;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 10px;
}
.wc-block-product-categories-list-item > a {
	color: var(--aq-azul-oscuro);
	font-size: 15px;
}
.wc-block-product-categories-list-item > a:hover {
	color: var(--aq-turquesa);
}
.wc-block-product-categories-list-item-count {
	background: #e8f1f5;
	border: 0;
	border-radius: 999px;
	color: var(--aq-texto);
	font-size: 12px;
	padding: 2px 9px;
}

/* 5. Botones: turquesa, redondeados y a todo el ancho de la tarjeta */
/* Betheme oculta esta fila en la vista de cuadrícula: la mostramos siempre */
li.product .mfn-li-product-row-button,
li.product .mfn-li-product-row-button.button-list {
	display: block !important;
	margin-top: 10px;
	opacity: 1;
	visibility: visible;
}
/* Fuente de marca en títulos y precio, alineados a la izquierda */
li.product .mfn-li-product-row-title h5.title,
li.product .mfn-li-product-row-title h5.title a {
	font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}
li.product .mfn-li-product-row-price p.price {
	margin: 4px 0 0 !important;
	text-align: left !important;
	width: 100% !important;
	display: flex !important;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: flex-start !important;
	gap: 8px;
}
li.product .mfn-li-product-row-price p.price ins {
	order: 1;
}
li.product .mfn-li-product-row-price p.price del {
	order: 2;
	margin: 0 !important;
}
/* Cada fila de la tarjeta ocupa todo el ancho (Betheme las centra y encoge) */
li.product .mfn-li-product-row {
	align-self: stretch !important;
	box-sizing: border-box;
	max-width: 100% !important;
	width: 100% !important;
}
li.product .mfn-li-product-row-button {
	text-align: left !important;
}
li.product .mfn-li-product-row-button a.button {
	box-sizing: border-box !important;
	display: block !important;
	float: none !important;
	margin: 0 !important;
	width: 100% !important;
}
li.product a.button.add_to_cart_button,
li.product .button.product_type_simple,
li.product .button.product_type_variable {
	background: var(--aq-turquesa) !important;
	border: 0 !important;
	border-radius: 9px !important;
	box-shadow: none;
	color: #fff !important;
	display: block;
	font-size: 14px;
	font-weight: 600;
	padding: 11px 14px;
	text-align: center;
	width: 100%;
	transition: background 0.2s ease;
}
li.product a.button.add_to_cart_button:hover,
li.product .button.product_type_simple:hover,
li.product .button.product_type_variable:hover {
	background: var(--aq-turquesa-osc) !important;
}
li.product .button.disabled,
li.product.outofstock .button {
	background: #e3edf1 !important;
	color: #7e909c !important;
	pointer-events: none;
}
/* Ordenar y mostrar */
.woocommerce-result-count {
	color: var(--aq-texto);
}
.woocommerce-ordering select {
	background-color: #fff;
	border: 1px solid #dbe8ee;
	border-radius: 9px;
	color: var(--aq-azul-oscuro);
}

/* 6. Banner "Envíos a todo Chile" (bajo las categorías de la tienda)
   HTML en banner-envios.html, se pega en un bloque HTML personalizado. */
.aq-envio {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-top: 24px;
	padding: 22px 22px 56px;
	overflow: hidden;
	border-radius: 14px !important;
	background: linear-gradient(135deg, #e6f5f9 0%, #d3edf3 100%);
	color: var(--aq-azul-oscuro);
}
.aq-envio__icon {
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	color: var(--aq-turquesa);
}
.aq-envio__texto strong {
	display: block;
	margin-bottom: 6px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
}
.aq-envio__texto span {
	display: block;
	font-size: 13px;
	line-height: 1.45;
	color: var(--aq-texto);
}
.aq-envio__ola {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 34px;
	color: var(--aq-turquesa);
	opacity: 0.4;
	pointer-events: none;
}

/* 7. Fotos de producto: marco uniforme, producto completo y centrado */
li.product .image_frame.product-loop-thumb {
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
}
li.product .image_wrapper img {
	box-sizing: border-box;
	object-fit: contain;
	padding: 10px;
}

/* 8. Títulos a dos líneas, para que las tarjetas queden del mismo alto */
li.product .mfn-li-product-row-title h5.title {
	margin-bottom: 0;
	min-height: 2.7em;
}
li.product .mfn-li-product-row-title h5.title a {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* 9. Barra de ordenar: solo contador y "ordenar por" */
.mfn-woo-filters-wrapper .mfn-woo-list-options {
	display: none !important;
}

/* 10. Aviso de cookies: franja baja y discreta (no se toca display: lo
   controla el propio plugin al mostrar u ocultar el aviso) */
#mfn-gdpr {
	bottom: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 10px 24px !important;
	border-radius: 0 !important;
	box-sizing: border-box;
	overflow: hidden;
	text-align: left !important;
	background: #fff;
	box-shadow: 0 -2px 10px rgba(11, 58, 92, 0.08);
}
#mfn-gdpr .mfn-gdpr-image {
	display: none !important;
}
#mfn-gdpr .mfn-gdpr-content,
#mfn-gdpr .mfn-gdpr-readmore {
	display: inline !important;
	font-size: 13px;
	line-height: 1.5;
	margin: 0 8px 0 0 !important;
	padding: 0 !important;
	color: var(--aq-texto);
}
#mfn-gdpr .mfn-gdpr-readmore {
	color: var(--aq-turquesa);
}
#mfn-gdpr .mfn-gdpr-button {
	float: right;
	margin: 0 !important;
	padding: 7px 20px !important;
	border-radius: 8px !important;
	background: var(--aq-turquesa) !important;
	color: #fff !important;
	font-size: 13px;
	font-weight: 600;
}

/* 11. Franja de confianza (una vez, al final de la tienda) */
.aq-confianza {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin: 40px auto 40px;
	max-width: 1240px;
	padding: 22px 28px;
	border-radius: var(--aq-radius);
	background: rgba(255, 255, 255, 0.7);
}
.aq-confianza__item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}
.aq-confianza__item svg {
	flex: 0 0 30px;
	width: 30px;
	height: 30px;
	color: var(--aq-turquesa);
}
.aq-confianza__item strong {
	display: block;
	color: var(--aq-azul-oscuro);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
}
.aq-confianza__item span {
	display: block;
	margin-top: 2px;
	color: var(--aq-texto);
	font-size: 12.5px;
	line-height: 1.4;
}
@media (max-width: 767px) {
	.aq-confianza {
		grid-template-columns: 1fr;
		gap: 16px;
		margin: 28px 16px 0;
		padding: 18px;
	}
	#mfn-gdpr .mfn-gdpr-button {
		float: none;
		margin-top: 8px !important;
	}
}

/* 12. Encabezado: más compacto y coherente con el resto de la tienda */
#mfn-header-template {
	box-shadow: 0 2px 10px rgba(11, 58, 92, 0.06);
}
@media (min-width: 768px) {
	#mfn-header-template .mfn-header-tmpl-builder > section.mcb-header-section:nth-child(2) {
		padding-top: 10px !important;
		padding-bottom: 2px !important;
	}
	#mfn-header-template .mfn-header-tmpl-builder > section.mcb-header-section:nth-child(3) {
		padding-top: 2px !important;
		padding-bottom: 0 !important;
	}
	#mfn-header-template a.logo-wrapper img {
		height: 84px !important;
		width: auto !important;
	}
}
/* Eslogan en tono neutro para que no compita con los enlaces */
#mfn-header-template .column_attr p span {
	color: var(--aq-texto) !important;
}
/* Buscador redondeado, con fondo celeste muy claro y texto legible */
#mfn-header-template .search_wrapper input.field {
	background: #eef7fa !important;
	border: 0 !important;
	border-radius: 10px !important;
	color: var(--aq-azul-oscuro) !important;
}
#mfn-header-template .search_wrapper input.field::placeholder {
	color: #6a8696 !important;
	opacity: 1;
}
/* Íconos y textos de contacto en la misma familia de color */
#mfn-header-template a.mfn-header-link i,
#mfn-header-template a.mfn-header-link svg {
	color: var(--aq-turquesa) !important;
}
#mfn-header-template a.mfn-header-icon-box,
#mfn-header-template a.mfn-header-icon-box span,
#mfn-header-template a.mfn-header-icon-box .label {
	color: var(--aq-azul-oscuro);
}
#mfn-header-template a.mfn-header-account-link i,
#mfn-header-template a.mfn-header-cart-link i {
	color: var(--aq-azul-oscuro) !important;
}
/* Menú: efecto suave y activo en turquesa */
#mfn-header-template ul.mfn-header-mainmenu a.mfn-menu-link {
	transition: color 0.2s ease;
}
#mfn-header-template ul.mfn-header-mainmenu a.mfn-menu-link:hover,
#mfn-header-template ul.mfn-header-mainmenu li.current-menu-item > a.mfn-menu-link {
	color: var(--aq-turquesa) !important;
}

/* 13. Pie de página: foto de agua con capa azul oscuro, textos claros y onda */
#mfn-footer-template section.mcb-section {
	position: relative;
	overflow: hidden;
}
#mfn-footer-template .mcb-background-overlay {
	display: none !important;
}
#mfn-footer-template section.mcb-section::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(11, 58, 92, 0.90);
	pointer-events: none;
	z-index: 0;
}
#mfn-footer-template section.mcb-section::after {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	right: 0;
	height: 36px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V28C1200 62 960 56 720 30S240 0 0 24Z' fill='%23f8fcfd'/%3E%3C/svg%3E") top center / 100% 100% no-repeat;
	pointer-events: none;
	z-index: 1;
}
#mfn-footer-template .section_wrapper {
	position: relative;
	z-index: 2;
	padding-top: 28px;
}
#mfn-footer-template h3.title,
#mfn-footer-template h6.title,
#mfn-footer-template h6.title a {
	color: #fff !important;
}
#mfn-footer-template p,
#mfn-footer-template li,
#mfn-footer-template div,
#mfn-footer-template strong,
#mfn-footer-template span,
#mfn-footer-template a {
	color: #d8eef5 !important;
}
#mfn-footer-template a:hover {
	color: #fff !important;
}
#mfn-footer-template a.logo-wrapper img,
#mfn-footer-template .image_wrapper img {
	background: #fff;
	border-radius: 14px;
	padding: 8px;
}

/* ==========================================================================
   14. INICIO - hero propio (reemplaza al Slider Revolution)
   La foto de fondo ya incluye la bomba; el velo celeste y las olas están integrados en la imagen.
   ========================================================================== */
body.home .mfn-main-slider { display: none !important; }

.aq-hero { position: relative; overflow: hidden; background: #dff3f9; margin: 0; }
.aq-hero__track { position: relative; }
.aq-hero__slide { display: none; position: relative; }
.aq-hero__slide.is-active { display: block; animation: aq-fade .5s ease; }
@keyframes aq-fade { from { opacity: 0; } to { opacity: 1; } }
.aq-hero__bg {
	position: absolute; inset: 0;
	background: url("assets/hero-pc-b.webp") center bottom / cover no-repeat;
}
/* la bomba va tal cual (PNG con sus sombras e iluminación originales, sin filtros ni sombras agregadas).
   El PNG tiene un margen transparente: el ancho y el "bottom" negativo compensan para que la bomba mida 35% del fondo. */
.aq-hero__img { position: absolute; right: 3.5%; bottom: -1.9%; width: 38.5%; height: auto; z-index: 2; }
.aq-hero__inner {
	position: relative; z-index: 2;
	max-width: 1240px; margin: 0 auto; padding: 0 24px;
	min-height: clamp(380px, 27.5vw, 560px);
	display: flex; align-items: center;
}
.aq-hero__copy { max-width: 470px; }
.aq-hero__tag {
	display: inline-block; background: var(--aq-turquesa); color: #fff;
	font-size: 12px; font-weight: 700; letter-spacing: .08em;
	padding: 6px 14px; border-radius: 999px; margin-bottom: 18px;
}
.aq-hero__title {
	font-family: "Plus Jakarta Sans", sans-serif !important;
	font-size: 46px; line-height: 1.08; font-weight: 800;
	color: var(--aq-azul-oscuro) !important; margin: 0 0 14px;
}
.aq-hero__text { font-size: 19px; line-height: 1.5; color: var(--aq-texto); margin: 0 0 26px; }
.aq-hero__btn {
	display: inline-flex; align-items: center; gap: 10px;
	background: var(--aq-turquesa); color: #fff !important;
	font-weight: 700; font-size: 16px; padding: 13px 26px; border-radius: 999px;
	transition: background .2s, transform .2s;
}
.aq-hero__btn:hover { background: var(--aq-turquesa-osc); transform: translateY(-1px); }
.aq-hero__btn svg { width: 18px; height: 18px; }
.aq-hero__nav {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
	width: 40px; height: 40px; padding: 0; border-radius: 50%; border: 0;
	background: #fff; color: var(--aq-azul-oscuro); cursor: pointer;
	box-shadow: 0 4px 12px rgba(11,58,92,.2); display: flex; align-items: center; justify-content: center;
}
.aq-hero__nav svg { width: 20px; height: 20px; }
.aq-hero__nav--prev { left: 14px; } .aq-hero__nav--next { right: 14px; }
.aq-hero__dots { position: absolute; left: 0; right: 0; bottom: 14px; z-index: 5; display: flex; justify-content: center; gap: 8px; }
.aq-hero__dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.85); box-shadow: 0 0 0 1px rgba(11,58,92,.3); cursor: pointer; }
.aq-hero__dots button.is-active { background: var(--aq-turquesa); }
.aq-hero.is-single .aq-hero__nav, .aq-hero.is-single .aq-hero__dots { display: none; }

/* móvil / tablet angosta: texto arriba sobre celeste, foto completa debajo */
@media (max-width: 900px) {
	.aq-hero__slide.is-active { display: flex; flex-direction: column; }
	.aq-hero__inner { order: 1; min-height: 0; padding: 32px 20px 26px; background: linear-gradient(180deg, #e6f6fb, #d6eef7); max-width: none; }
	.aq-hero__bg { order: 2; position: relative; inset: auto; width: 100%; aspect-ratio: 1942 / 700; background-image: url("assets/hero-movil-2.webp"); background-position: center; }
	.aq-hero__img { width: 50.6%; right: 3%; bottom: 0.6%; }
	.aq-hero__title { font-size: 32px; }
	.aq-hero__text { font-size: 16px; margin-bottom: 20px; }
}

/* ---- slide 2: Sal para piscinas (proporciones del diseño entregado; --u = alto del hero / 810) ---- */
.aq-hero__slide--sal { --h: clamp(380px, 27.5vw, 560px); --u: calc(var(--h) / 810 * .9); }
.aq-hero__slide--sal .aq-hero__bg { background-image: url("assets/sal-pc-2.webp"); background-position: right bottom; }
.aq-hero__slide--sal .aq-hero__img { right: 12.9%; bottom: -5.2%; width: 28.8%; }
.aq-hero__slide--sal .aq-hero__copy { max-width: none; font-family: "Plus Jakarta Sans", sans-serif; color: var(--aq-azul-oscuro); }
.aq-hero__slide--sal .aq-hero__tag { font-size: calc(26 * var(--u)); padding: calc(11 * var(--u)) calc(34 * var(--u)); margin-bottom: calc(22 * var(--u)); background: #19d3f3; color: var(--aq-azul-oscuro); letter-spacing: .1em; font-weight: 800; }
.aq-hero__slide--sal .aq-hero__title { font-size: calc(128 * var(--u)); line-height: .98; font-weight: 800; margin: 0 0 calc(16 * var(--u)); }
.aq-sal__lead { font-size: calc(46 * var(--u)); line-height: 1.1; font-weight: 700; margin: 0 0 calc(18 * var(--u)); color: var(--aq-azul-oscuro); }
.aq-sal__strong { font-size: calc(28 * var(--u)); font-weight: 700; margin: 0 0 calc(8 * var(--u)); color: var(--aq-azul-oscuro); }
.aq-sal__text { font-size: calc(26 * var(--u)); line-height: 1.25; margin: 0 0 calc(22 * var(--u)); color: var(--aq-azul-oscuro); }
.aq-sal__offer { display: inline-flex; flex-direction: column; background: #19d3f3; border-radius: calc(18 * var(--u)); padding: calc(14 * var(--u)) calc(34 * var(--u)) calc(14 * var(--u)) calc(34 * var(--u)); margin-bottom: calc(18 * var(--u)); min-width: calc(655 * var(--u)); color: var(--aq-azul-oscuro); }
.aq-sal__offer strong { font-size: calc(38 * var(--u)); line-height: 1.1; font-weight: 800; }
.aq-sal__offer span { font-size: calc(30 * var(--u)); line-height: 1.2; font-weight: 700; }
.aq-sal__link { display: block; width: max-content; font-size: calc(27 * var(--u)); font-weight: 700; color: var(--aq-azul-oscuro) !important; padding-bottom: calc(6 * var(--u)); border-bottom: calc(4 * var(--u)) solid #19d3f3; }
@media (max-width: 900px) {
	.aq-hero__slide--sal { --u: .5px; }
	.aq-hero__slide--sal .aq-hero__bg { background-image: url("assets/sal-movil.webp"); background-position: center; overflow: hidden; }
	.aq-hero__slide--sal .aq-hero__img { right: 12.5%; bottom: -6.9%; width: 38.4%; }
	.aq-hero__slide--sal .aq-hero__tag { font-size: 12px; padding: 6px 14px; margin-bottom: 14px; }
	.aq-hero__slide--sal .aq-hero__title { font-size: 40px; margin-bottom: 12px; }
	.aq-sal__lead { font-size: 21px; } .aq-sal__strong { font-size: 15px; } .aq-sal__text { font-size: 14px; }
	.aq-sal__offer { min-width: 0; width: 100%; padding: 12px 16px; border-radius: 14px; }
	.aq-sal__offer strong { font-size: 19px; } .aq-sal__offer span { font-size: 15px; }
	.aq-sal__link { font-size: 15px; padding-bottom: 4px; border-bottom-width: 3px; }
}

/* ---- slide 3: Mosaicos para piscinas (mismo sistema de proporciones que el slide 2) ---- */
.aq-hero__slide--mos { --h: clamp(380px, 27.5vw, 560px); --u: calc(var(--h) / 810 * .9); }
.aq-hero__slide--mos .aq-hero__bg { background-image: url("assets/mos-pc.webp"); background-position: right bottom; }
.aq-hero__slide--mos .aq-hero__img { right: 5.9%; bottom: .6%; width: 33.4%; }
.aq-hero__slide--mos .aq-hero__copy { max-width: none; font-family: "Plus Jakarta Sans", sans-serif; color: var(--aq-azul-oscuro); }
.aq-hero__slide--mos .aq-hero__tag { font-size: calc(26 * var(--u)); padding: calc(11 * var(--u)) calc(34 * var(--u)); margin-bottom: calc(22 * var(--u)); background: #19d3f3; color: var(--aq-azul-oscuro); letter-spacing: .1em; font-weight: 800; }
.aq-hero__slide--mos .aq-hero__title { font-size: calc(128 * var(--u)); line-height: .98; font-weight: 800; margin: 0 0 calc(16 * var(--u)); }
.aq-hero__slide--mos .aq-sal__lead { margin-bottom: calc(14 * var(--u)); }
.aq-hero__slide--mos .aq-sal__text { font-size: calc(34 * var(--u)); margin-bottom: calc(26 * var(--u)); }
.aq-mos__btn { font-size: calc(40 * var(--u)) !important; padding: calc(20 * var(--u)) calc(54 * var(--u)) !important; gap: calc(18 * var(--u)) !important; }
.aq-mos__btn svg { width: calc(44 * var(--u)) !important; height: calc(44 * var(--u)) !important; }
@media (max-width: 900px) {
	.aq-hero__slide--mos .aq-hero__bg { background-image: url("assets/mos-movil.webp"); background-position: center; overflow: hidden; }
	.aq-hero__slide--mos .aq-hero__img { right: 3.3%; bottom: .6%; width: 44.7%; }
	.aq-hero__slide--mos .aq-hero__tag { font-size: 12px; padding: 6px 14px; margin-bottom: 14px; }
	.aq-hero__slide--mos .aq-hero__title { font-size: 40px; margin-bottom: 12px; }
	.aq-hero__slide--mos .aq-sal__lead { font-size: 21px; }
	.aq-hero__slide--mos .aq-sal__text { font-size: 15px; }
	.aq-mos__btn { font-size: 16px !important; padding: 12px 24px !important; gap: 10px !important; }
	.aq-mos__btn svg { width: 18px !important; height: 18px !important; }
}

/* ---- transiciones del slider: fundido cruzado + entrada escalonada del texto y del producto + barra de progreso ---- */
@keyframes aq-in-left { from { opacity: 0; transform: translateX(-34px); } to { opacity: 1; transform: none; } }
@keyframes aq-in-right { from { opacity: 0; transform: translateX(90px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes aq-settle { from { transform: scale(1.07); } to { transform: scale(1); } }
@keyframes aq-bar { from { width: 0; } to { width: 100%; } }
/* (sin transform en .aq-hero__bg: crearía un contexto de apilamiento y las ondas taparían al producto) */
.aq-hero__slide.is-active .aq-hero__copy > * { animation: aq-in-left .7s cubic-bezier(.2,.8,.2,1) both; }
.aq-hero__slide.is-active .aq-hero__copy > :nth-child(1) { animation-delay: .15s; }
.aq-hero__slide.is-active .aq-hero__copy > :nth-child(2) { animation-delay: .27s; }
.aq-hero__slide.is-active .aq-hero__copy > :nth-child(3) { animation-delay: .39s; }
.aq-hero__slide.is-active .aq-hero__copy > :nth-child(4) { animation-delay: .5s; }
.aq-hero__slide.is-active .aq-hero__copy > :nth-child(5) { animation-delay: .6s; }
.aq-hero__slide.is-active .aq-hero__copy > :nth-child(6) { animation-delay: .7s; }
.aq-hero__slide.is-active .aq-hero__copy > :nth-child(7) { animation-delay: .8s; }
.aq-hero__slide.is-active .aq-hero__img { animation: aq-in-right 1.05s cubic-bezier(.2,.8,.2,1) .3s both; }
.aq-hero__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255,255,255,.35); z-index: 5; }
.aq-hero__bar span { display: block; height: 100%; width: 0; background: var(--aq-turquesa); }
.aq-hero__bar span.run { animation: aq-bar 6.5s linear forwards; }
.aq-hero.is-paused .aq-hero__bar span { animation-play-state: paused; }
.aq-hero__dots button { transition: width .35s ease, background .35s ease; }
.aq-hero__dots button.is-active { width: 26px; border-radius: 999px; }
.aq-hero__nav { transition: transform .2s ease, box-shadow .2s ease; }
.aq-hero__nav:hover { transform: translateY(-50%) scale(1.1); box-shadow: 0 6px 16px rgba(11,58,92,.3); }
.aq-hero.is-single .aq-hero__bar { display: none; }
@media (min-width: 901px) {
	.aq-hero__track { display: grid; }
	.aq-hero__slide, .aq-hero__slide.is-active { display: block; grid-area: 1 / 1; animation: none; }
	.aq-hero__slide { opacity: 0; visibility: hidden; transition: opacity .9s ease, visibility 0s linear .9s; }
	.aq-hero__slide.is-active { opacity: 1; visibility: visible; z-index: 1; transition: opacity .9s ease; }
}
@media (prefers-reduced-motion: reduce) {
	.aq-hero__slide.is-active .aq-hero__bg, .aq-hero__slide.is-active .aq-hero__copy > *, .aq-hero__slide.is-active .aq-hero__img { animation: none; }
	.aq-hero__slide { transition: none !important; }
}

/* ---- ondas vectoriales (SVG): bordes nítidos a cualquier tamaño, tres tonos de celeste ---- */
.aq-waves { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; overflow: hidden; }
.aq-wave { transform-box: fill-box; }
@keyframes aq-drift { from { transform: translateX(0); } to { transform: translateX(26px); } }
.aq-hero__slide.is-active .aq-wave--1 { animation: aq-drift 7s ease-in-out infinite alternate; }
.aq-hero__slide.is-active .aq-wave--2 { animation: aq-drift 6s ease-in-out -2s infinite alternate; }
.aq-hero__slide.is-active .aq-wave--3 { animation: aq-drift 5s ease-in-out -4s infinite alternate; }
/* móvil: las ondas van detrás del texto, en la parte baja del bloque de texto (sobre el celeste), sin pasar sobre la foto */
@media (max-width: 900px) {
	.aq-hero__slide.is-active { background: linear-gradient(180deg, #e6f6fb, #d6eef7); }
	.aq-hero__inner { background: none !important; }
	.aq-waves { inset: auto auto 36.04vw 0; width: 230%; max-width: none; height: auto; aspect-ratio: 1858 / 512; overflow: hidden; -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 68%, transparent 92%); mask-image: linear-gradient(to bottom, #000 0, #000 68%, transparent 92%); }
	/* las flechas bajan a la franja de la foto para no tapar el texto */
	.aq-hero__nav { top: auto; bottom: calc(18vw - 18px); transform: none; width: 36px; height: 36px; }
	.aq-hero__nav:hover { transform: scale(1.1); }
	.aq-sal__offer { box-sizing: border-box; }
}
@media (prefers-reduced-motion: reduce) { .aq-hero__slide.is-active .aq-wave { animation: none; } }

/* ==========================================================================
   15. INICIO - categorías (reemplaza a "Nuestras Marcas")
   ========================================================================== */
body.home [data-id="ecfeb6c"] { display: none !important; }

.aq-cats { max-width: 1240px; margin: 38px auto 34px; padding: 0 24px; }
.aq-cats__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.aq-cats__title {
	display: flex; align-items: center; gap: 12px; margin: 0;
	font-family: "Plus Jakarta Sans", sans-serif !important;
	font-size: 26px; font-weight: 800; color: var(--aq-azul-oscuro) !important;
}
.aq-cats__title::before { content: ""; width: 22px; height: 3px; border-radius: 2px; background: var(--aq-turquesa); }
.aq-cats__all { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--aq-turquesa-osc) !important; }
.aq-cats__all svg { width: 15px; height: 15px; }
.aq-cats__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.aq-cat {
	display: flex; flex-direction: column; background: #fff; border-radius: var(--aq-radio);
	box-shadow: var(--aq-sombra); overflow: hidden; transition: transform .2s, box-shadow .2s;
}
.aq-cat:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(11,58,92,.14); }
.aq-cat__media { height: 128px; display: flex; align-items: center; justify-content: center; padding: 12px; color: var(--aq-turquesa); background: #fff; }
.aq-cat__media img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.aq-cat__media img:not(:only-child) { max-width: 46%; }
.aq-cat__media svg { width: 64px; height: 64px; }
.aq-cat__label {
	display: flex; align-items: center; justify-content: space-between; gap: 6px;
	padding: 12px 14px; border-top: 1px solid #e8f2f6;
	font-size: 13px; font-weight: 600; color: var(--aq-azul-oscuro);
}
.aq-cat__label svg { width: 14px; height: 14px; color: var(--aq-turquesa); flex: none; }
@media (max-width: 1100px) { .aq-cats__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) {
	.aq-cats__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.aq-cats__title { font-size: 22px; }
	.aq-cats__all { display: none; }
}


/* ==========================================================================
   16. INICIO - franja de beneficios bajo las categorías
   ========================================================================== */
.aq-benef {
	display: grid; grid-template-columns: repeat(4, 1fr);
	max-width: 1192px; margin: 28px auto 40px; padding: 18px 0;
	background: rgba(255,255,255,.7); border-radius: var(--aq-radio); box-shadow: var(--aq-sombra);
}
.aq-benef__item { display: flex; align-items: center; gap: 14px; padding: 4px 22px; }
.aq-benef__item + .aq-benef__item { border-left: 1px solid #d3e8ef; }
.aq-benef__item svg { width: 36px; height: 36px; flex: none; color: var(--aq-turquesa); }
.aq-benef__item strong { display: block; font-size: 14px; color: var(--aq-azul-oscuro); }
.aq-benef__item span { display: block; font-size: 12.5px; line-height: 1.4; color: var(--aq-texto); }
@media (max-width: 1100px) {
	.aq-benef { grid-template-columns: repeat(2, 1fr); row-gap: 14px; }
	.aq-benef__item:nth-child(3) { border-left: 0; }
}
@media (max-width: 600px) {
	.aq-benef { grid-template-columns: 1fr; margin: 20px 16px 30px; }
	.aq-benef__item + .aq-benef__item { border-left: 0; border-top: 1px solid #d3e8ef; padding-top: 14px; }
}

/* ==========================================================================
   17. INICIO - banner único (reemplaza a los 2 banners "Tu piscina desde 0" / "Limpieza piscina")
   ========================================================================== */
body.home [data-id="cd4fe37"] { display: none !important; }
.aq-banner { max-width: 1192px; margin: 8px auto 44px; padding: 0 24px; text-align: center; }
.aq-banner a { display: inline-block; width: min(100%, 420px); border-radius: var(--aq-radio); overflow: hidden; box-shadow: 0 10px 28px rgba(11,58,92,.18); transition: transform .2s, box-shadow .2s; }
.aq-banner a:hover { transform: translateY(-3px); box-shadow: 0 14px 32px rgba(11,58,92,.24); }
.aq-banner img { display: block; width: 100%; height: auto; }