/* =========================================================================
   Arte Vivo — estilos del front
   Las variables (--av-*) se generan desde los ajustes del plugin.
   ========================================================================= */

.av,
.av *,
.av *::before,
.av *::after {
	box-sizing: border-box;
}

.av {
	font-family: var(--av-font-body);
	color: var(--av-text);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

.av img {
	max-width: 100%;
	height: auto;
	display: block;
}

.av p {
	margin: 0 0 1em;
}

.av ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* --- Contenedores --------------------------------------------------------- */

.av-section {
	position: relative;
	background: var(--av-bg);
}

/*
 * Ancho completo descontando la barra de desplazamiento: 100vw la incluye y
 * eso provocaba unos píxeles de desbordamiento (recortados por los temas que
 * usan overflow-x: hidden). El JS del plugin calcula --av-scrollbar.
 */
.av-section.av-full {
	/* width:auto + márgenes negativos: el bloque crece hacia fuera hasta el
	   borde de la ventana. Si el contenedor ya es de ancho completo, los
	   márgenes valen 0 y no pasa nada. */
	width: auto;
	max-width: none;
	/* Nunca más estrecho que su contenedor: evita secciones en blanco. */
	min-width: 100%;
	/* min() con 0: el margen solo puede ser negativo (expandir). Así, aunque
	   el navegador resuelva mal vw (zoom, viewport visual del móvil), el
	   bloque nunca se estrecha ni se desplaza a la derecha. */
	margin-left: min(0px, calc(50% - 50vw + (var(--av-scrollbar, 0px) / 2)));
	margin-right: min(0px, calc(50% - 50vw + (var(--av-scrollbar, 0px) / 2)));
}

/*
 * --av-container es el ancho REAL del contenido. El margen lateral se suma por
 * fuera, así que al poner 1440 el contenido mide 1440 exactos. En pantallas
 * estrechas el margen se reduce solo (min con 5vw) para no comerse el ancho.
 */
:root {
	--av-pad: min(var(--av-gutter, 24px), 5vw);
}

.av-inner {
	width: 100%;
	max-width: calc(var(--av-container) + (var(--av-pad) * 2));
	margin: 0 auto;
	padding: 0 var(--av-pad);
}

/* --- Tipografía compartida ------------------------------------------------ */

.av[class] .av-eyebrow {
	margin: 0 0 14px;
	font-family: var(--av-font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--av-accent);
}

/*
 * Los temas suelen definir los encabezados como ".entry-content h2" (0,1,1),
 * lo que gana a un selector de una sola clase. Todos los bloques del plugin
 * llevan dos clases en su raíz (av + av-section / av-single), así que se usan
 * juntas para subir la especificidad a (0,2,1) y respetar el diseño.
 *
 * Por eso las reglas concretas de cada bloque se escriben ".av[class] .av-x":
 * el atributo cuenta como una clase más, así que llegan a (0,3,0) y ganan
 * tanto al tema como a esta regla base.
 */
.av h1,
.av h2,
.av h3,
.av.av-section h1,
.av.av-section h2,
.av.av-section h3,
.av.av-single h1,
.av.av-single h2,
.av.av-single h3 {
	font-family: var(--av-font-head);
	color: var(--av-text);
	font-weight: 500;
	letter-spacing: -.01em;
	margin: 0;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --- Botones -------------------------------------------------------------- */

.av[class] .av-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 15px 28px;
	border: 1px solid transparent;
	border-radius: var(--av-radius);
	font-family: var(--av-font-body);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

.av[class] .av-btn:focus-visible {
	outline: 2px solid var(--av-accent);
	outline-offset: 3px;
}

.av[class] .av-btn--primary {
	background: var(--av-primary);
	color: #fff;
}

.av[class] .av-btn--primary:hover {
	background: var(--av-accent);
	color: #fff;
}

.av[class] .av-btn--block {
	display: flex;
	width: 100%;
}

.av[class] .av-btn--sm {
	padding: 11px 16px;
	font-size: 14px;
}

.av[class] .av-btn--ghost {
	background: transparent;
	border-color: var(--av-primary);
	color: var(--av-primary);
}

.av[class] .av-btn--ghost:hover {
	background: var(--av-primary);
	color: #fff;
}

.av[class] .av-btn--light {
	background: #f2efe6;
	color: var(--av-primary);
}

.av[class] .av-btn--light:hover {
	background: #fff;
}

.av[class] .av-btn--outline {
	background: transparent;
	border-color: rgba(255, 255, 255, .85);
	color: #fff;
}

.av[class] .av-btn--outline:hover {
	background: rgba(255, 255, 255, .14);
}

.av[class] .av-btn--disabled,
.av[class] .av-btn[disabled] {
	background: #d9d6ce;
	color: #6f6f6f;
	cursor: not-allowed;
	pointer-events: none;
}

.av[class] .av-btn .av-icon {
	flex: none;
}

/* Estado de carga (spinner) */
.av-spinner {
	display: none;
	width: 16px;
	height: 16px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: av-spin .7s linear infinite;
}

.av .is-loading .av-spinner,
.av[class] .av-btn.is-loading .av-spinner {
	display: inline-block;
}

@keyframes av-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.av *,
	.av *::before,
	.av *::after {
		animation-duration: .001ms !important;
		transition-duration: .001ms !important;
	}
}

/* --- Etiquetas ------------------------------------------------------------ */

.av-badge {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .02em;
	line-height: 1;
	white-space: nowrap;
}

.av-badge--dark {
	background: var(--av-primary);
	color: #fff;
}

.av-badge--light {
	background: rgba(255, 255, 255, .82);
	color: var(--av-primary);
	backdrop-filter: blur(4px);
}

.av-badge--pill {
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 6px 14px;
}

/* --- Estrellas ------------------------------------------------------------ */

.av-stars {
	display: inline-flex;
	gap: 2px;
	line-height: 0;
}

.av-stars .is-on {
	color: var(--av-star);
}

.av-stars .is-off {
	color: #d8d4c9;
}

/* --- Marcador de imagen --------------------------------------------------- */

.av-placeholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	min-height: 180px;
	height: 100%;
	padding: 20px;
	background: repeating-linear-gradient(45deg, #eceadf, #eceadf 12px, #e5e2d5 12px, #e5e2d5 24px);
	color: var(--av-muted);
	font-size: 13px;
	text-align: center;
	border-radius: var(--av-radius);
}

.av-placeholder--mini {
	min-height: 120px;
}

/* =========================================================================
   1. HERO
   ========================================================================= */

.av-hero {
	background: var(--av-hero-bg, var(--av-bg));
}

/*
 * Sin max-width en el contenedor: la imagen llega siempre al borde de la
 * ventana. Es el texto el que se limita a media anchura del contenedor, de
 * modo que su margen izquierdo coincide con el del resto de bloques.
 */
.av-hero__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	min-height: var(--av-hero-h);
}

.av-hero--left .av-hero__content {
	order: 2;
}

.av-hero__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	max-width: calc((var(--av-container) / 2) + var(--av-pad));
	margin-left: auto;
	padding: 72px clamp(28px, 3vw, 56px) 72px var(--av-pad);
}

.av-hero--left .av-hero__content {
	margin-left: 0;
	margin-right: auto;
	padding: 72px var(--av-pad) 72px clamp(28px, 3vw, 56px);
}

.av[class] .av-hero__title {
	font-size: clamp(38px, 5.2vw, 68px);
	line-height: 1.06;
	margin: 0 0 24px;
	font-weight: 400;
}

.av[class] .av-hero__text {
	max-width: 46ch;
	font-size: 16px;
	color: #33403a;
	margin: 0 0 32px;
}

.av-hero__cta {
	margin: 0 0 28px;
}

.av-hero__proof {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.av[class] .av-hero__proof-text {
	font-size: 13px;
	color: var(--av-muted);
}

.av-hero__media {
	position: relative;
	min-height: 320px;
	background: #eae7dd;
}

.av-hero__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.av-hero__media .av-placeholder {
	border-radius: 0;
	height: 100%;
}

/* =========================================================================
   2. COLECCIÓN
   ========================================================================= */

.av-coleccion {
	padding: 64px 0 8px;
}

.av-coleccion--center {
	text-align: center;
}

.av-coleccion--center .av-coleccion__text {
	margin-left: auto;
	margin-right: auto;
}

.av[class] .av-coleccion__title {
	font-size: clamp(28px, 3.4vw, 42px);
	line-height: 1.15;
	margin: 0 0 12px;
	font-weight: 400;
}

.av[class] .av-coleccion__text {
	max-width: 68ch;
	color: var(--av-muted);
	font-size: 15px;
	margin: 0;
}

/* =========================================================================
   3. FILTROS
   ========================================================================= */

.av-filtros {
	padding: 28px 0 4px;
}

.av-filtros.is-sticky {
	position: sticky;
	top: 0;
	z-index: 20;
	padding-bottom: 16px;
	box-shadow: 0 8px 20px -18px rgba(0, 0, 0, .5);
}

.av-filters {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}

.av-filters__group {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.av-select {
	position: relative;
	display: inline-flex;
	align-items: center;
}

.av[class] .av-select__input {
	appearance: none;
	-webkit-appearance: none;
	min-width: 168px;
	padding: 14px 44px 14px 18px;
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
	background: var(--av-surface);
	color: var(--av-text);
	font-family: var(--av-font-body);
	font-size: 14px;
	line-height: 1.2;
	cursor: pointer;
	transition: border-color .2s ease;
}

.av-select__input:hover {
	border-color: #c9c4b5;
}

.av-select__input:focus-visible {
	outline: 2px solid var(--av-accent);
	outline-offset: 2px;
}

.av-select__arrow {
	position: absolute;
	right: 14px;
	pointer-events: none;
	color: var(--av-muted);
	line-height: 0;
}

.av-select.is-active .av-select__input {
	border-color: var(--av-accent);
	color: var(--av-accent);
	font-weight: 500;
}

.av[class] .av-filters__clear {
	background: none;
	border: 0;
	padding: 8px 4px;
	color: var(--av-muted);
	font-family: var(--av-font-body);
	font-size: 13px;
	text-decoration: underline;
	cursor: pointer;
}

.av-filters__clear:hover {
	color: var(--av-accent);
}

/* =========================================================================
   4. GRILLA
   ========================================================================= */

.av-grilla {
	padding: 24px 0 64px;
}

.av-grid-wrap {
	position: relative;
	transition: opacity .2s ease;
}

.av-grid-wrap.is-loading {
	opacity: .45;
	pointer-events: none;
}

.av[class] .av-grid__count {
	margin: 0 0 18px;
	font-size: 13px;
	color: var(--av-muted);
}

.av-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.av-grid--cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.av-grid--cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.av-card {
	display: flex;
	flex-direction: column;
	background: var(--av-surface);
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}

.av-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 18px 34px -26px rgba(20, 64, 31, .65);
}

.av-card__media {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	background: #eeece3;
	overflow: hidden;
}

.av-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}

.av-card:hover .av-card__media img {
	transform: scale(1.04);
}

.av-card__media .av-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
}

.av-card__body {
	padding: 16px 16px 8px;
	flex: 1;
}

.av[class] .av-card__title {
	font-family: var(--av-font-body);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.35;
	margin: 0 0 8px;
}

.av[class] .av-card__title a {
	color: var(--av-text);
	text-decoration: none;
}

.av-card__title a:hover {
	color: var(--av-accent);
}

.av[class] .av-card__price {
	margin: 0 0 14px;
	font-size: 18px;
	font-weight: 500;
	color: var(--av-text);
}

.av-card__price del {
	opacity: .55;
	font-size: .8em;
	margin-right: 6px;
}

.av-card__price ins {
	text-decoration: none;
}

.av-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
	padding-top: 12px;
	border-top: 1px solid var(--av-border);
}

.av[class] .av-card__meta li {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11.5px;
	color: var(--av-muted);
	line-height: 1.2;
}

.av-card__meta .av-icon {
	flex: none;
	color: var(--av-accent);
}

.av-card__foot {
	padding: 8px 16px 16px;
}

.av-card .added_to_cart {
	display: block;
	margin-top: 8px;
	text-align: center;
	font-size: 13px;
	color: var(--av-accent);
}

.av[class] .av-grid__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 64px 20px;
	text-align: center;
	color: var(--av-muted);
	border: 1px dashed var(--av-border);
	border-radius: var(--av-radius);
}

.av-grid__footer {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

.av-pagination {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.av[class] .av-pagination__item {
	min-width: 42px;
	padding: 10px 12px;
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
	background: var(--av-surface);
	color: var(--av-text);
	font-family: var(--av-font-body);
	font-size: 14px;
	cursor: pointer;
}

.av-pagination__item.is-current,
.av-pagination__item:hover {
	background: var(--av-primary);
	border-color: var(--av-primary);
	color: #fff;
}

/* =========================================================================
   5. ÍCONOS
   ========================================================================= */

.av-iconos {
	padding: 88px 0 92px;
}

.av-icons {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	text-align: center;
}

.av-icons--cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.av-icons--cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.av-icons__item {
	padding: 26px 34px;
}

.av-iconos.has-dividers .av-icons__item + .av-icons__item {
	border-left: 1px solid var(--av-border);
}

.av-icons__mark {
	display: inline-flex;
	color: var(--av-primary);
	margin-bottom: 24px;
}

.av-icons__mark .av-icon {
	width: var(--av-icon-size);
	height: var(--av-icon-size);
	stroke-width: 1.4;
}

.av[class] .av-icons__title {
	font-size: clamp(24px, 2.6vw, 32px);
	font-weight: 600;
	line-height: 1.2;
	margin: 0 0 12px;
}

.av[class] .av-icons__text {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--av-muted);
}

/* =========================================================================
   6. JARDÍN
   ========================================================================= */

.av-jardin {
	position: relative;
	display: flex;
	align-items: center;
	min-height: var(--av-garden-h);
	overflow: hidden;
	background: var(--av-primary);
}

.av-jardin__bg {
	position: absolute;
	inset: 0;
	background-image: var(--av-garden-image, none);
	background-size: cover;
	background-position: center;
}

.av-jardin__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg,
			rgba(11, 46, 22, calc(var(--av-garden-overlay, .62) + .18)) 0%,
			rgba(11, 46, 22, var(--av-garden-overlay, .62)) 55%,
			rgba(11, 46, 22, calc(var(--av-garden-overlay, .62) - .25)) 100%);
}

.av-jardin.has-no-image .av-jardin__bg {
	background-image: linear-gradient(120deg, #10361b, #1f5a2c 60%, #2d6b38);
}

.av-jardin__inner {
	position: relative;
	z-index: 2;
	padding-top: 72px;
	padding-bottom: 72px;
}

/*
 * Ancho suficiente para que el título entre en una sola línea; el párrafo se
 * limita aparte con su propio max-width, como en el diseño.
 */
.av-jardin__content {
	max-width: 780px;
	color: #fff;
}

.av[class] .av-jardin__title {
	font-size: clamp(34px, 4.4vw, 60px);
	line-height: 1.08;
	font-weight: 400;
	color: #fff;
	margin: 0 0 26px;
	text-wrap: balance;
}

/* El bloque va sobre una foto oscura: todo el texto en blanco. */
.av[class] .av-jardin__content,
.av[class] .av-jardin__content h2 {
	color: #fff;
}

.av[class] .av-jardin__text {
	font-size: 17px;
	line-height: 1.7;
	color: rgba(255, 255, 255, .92);
	margin: 0 0 42px;
	max-width: 46ch;
}

.av-jardin__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.av-jardin__hint {
	position: absolute;
	right: 16px;
	bottom: 10px;
	z-index: 3;
	margin: 0;
	font-size: 11px;
	color: rgba(255, 255, 255, .6);
}

/* =========================================================================
   7. FICHA DE PRODUCTO
   ========================================================================= */

/*
 * Contenedor del modo "Forzar plantilla completa".
 *
 * .av-force-bleed ensancha la ficha con márgenes negativos cuando el
 * contenedor del tema es más estrecho que el ancho configurado (min() con 0
 * para que nunca la estreche). .av-force-wrap la limita a ese ancho y la
 * centra cuando el contenedor es más ancho.
 */
.av-force-bleed {
	width: auto;

	/* Cuánto habría que ensanchar para llegar al ancho configurado.
	   min() con 0: nunca estrecha, solo ensancha. */
	--av-force-expand: min(0px, calc((100% - var(--av-single-w, 1440px) - (var(--av-pad) * 2)) / 2));

	/* Tope: el margen que deja la ficha justo del ancho de la ventana.
	   Sin esto, en móvil se ensancharía cientos de píxeles fuera de pantalla. */
	--av-force-limit: calc((100% - 100vw + var(--av-scrollbar, 0px)) / 2);

	margin-left: max(var(--av-force-limit), var(--av-force-expand));
	margin-right: max(var(--av-force-limit), var(--av-force-expand));
}

.av-force-wrap {
	width: 100%;
	max-width: calc(var(--av-single-w, 1440px) + (var(--av-pad) * 2));
	margin: 0 auto;
	padding: 0 var(--av-pad);
}

.av-single {
	font-family: var(--av-font-body);
	color: var(--av-text);
}

.av-single__top {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(24px, 4vw, 56px);
	align-items: start;
	margin-bottom: 48px;
}

/* Galería */
.av-single__gallery {
	position: relative;
}

.av-single__gallery .woocommerce-product-gallery {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	opacity: 1 !important;
}

.av-single__gallery .woocommerce-product-gallery__wrapper {
	border-radius: var(--av-radius);
	overflow: hidden;
	background: #f0eee6;
}

.av-single__gallery img {
	border-radius: var(--av-radius);
}

.av-single__gallery .flex-control-thumbs {
	display: flex !important;
	gap: 10px;
	margin: 14px 0 0 !important;
	padding: 0 !important;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: thin;
}

.av-single__gallery .flex-control-thumbs li {
	flex: 0 0 84px;
	width: 84px !important;
	margin: 0 !important;
	float: none !important;
}

.av-single__gallery .flex-control-thumbs img {
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
	opacity: 1;
	aspect-ratio: 1/1;
	object-fit: cover;
}

.av-single__gallery .flex-control-thumbs .flex-active {
	border-color: var(--av-accent);
	box-shadow: 0 0 0 1px var(--av-accent);
}

.av-single__badge {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 5;
}

.av-single__wishlist {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 5;
	background: rgba(255, 255, 255, .92);
	border-radius: 999px;
	padding: 6px 10px;
	line-height: 1;
}

/* Vídeo */
.av-video__thumb {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	margin-top: 10px;
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
	background: #eceadf;
	color: var(--av-primary);
	cursor: pointer;
}

.av-video__thumb:hover {
	border-color: var(--av-accent);
	color: var(--av-accent);
}

.av-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(10, 22, 14, .82);
}

.av-modal__box {
	position: relative;
	width: min(880px, 100%);
	background: #000;
	border-radius: var(--av-radius);
	overflow: hidden;
}

.av-modal__box iframe,
.av-modal__box video {
	width: 100%;
	aspect-ratio: 16/9;
	display: block;
	border: 0;
}

.av-modal__close {
	position: absolute;
	top: -42px;
	right: 0;
	background: none;
	border: 0;
	color: #fff;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
}

/* Resumen */
.av[class] .av-breadcrumb {
	font-size: 13px;
	color: var(--av-muted);
	margin-bottom: 14px;
}

.av-breadcrumb a {
	color: var(--av-muted);
	text-decoration: none;
}

.av-breadcrumb a:hover {
	color: var(--av-accent);
}

.av-single__heading {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin-bottom: 6px;
}

.av[class] .av-single__title {
	font-size: clamp(26px, 2.7vw, 34px);
	font-weight: 400;
	line-height: 1.15;
	margin: 0;
}

.av[class] .av-single__subtitle {
	font-family: var(--av-font-head);
	font-style: italic;
	font-size: 19px;
	color: #3f4a43;
	margin: 0 0 16px;
}

.av-single__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 22px;
	padding: 0 0 18px;
	margin: 0 0 18px;
	border-bottom: 1px solid var(--av-border);
}

.av[class] .av-single__meta li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 14px;
	color: #3f4a43;
}

.av-single__meta .av-icon {
	color: var(--av-accent);
	flex: none;
}

.av[class] .av-single__price {
	display: flex;
	align-items: baseline;
	gap: 8px;
	font-size: 34px;
	font-weight: 500;
	line-height: 1.1;
	margin-bottom: 12px;
}

.av[class] .av-single__price .price,
.av[class] .av-single__price .woocommerce-Price-amount {
	font-size: inherit;
	font-weight: inherit;
	color: var(--av-text);
}

.av-single__price del {
	opacity: .5;
	font-size: .6em;
}

.av-single__price ins {
	text-decoration: none;
}

.av[class] .av-single__currency {
	font-size: 14px;
	font-weight: 400;
	color: var(--av-muted);
}

.av[class] .av-single__excerpt {
	font-size: 15px;
	color: #3f4a43;
	margin-bottom: 10px;
}

.av-single__excerpt p:last-child {
	margin-bottom: 0;
}

.av[class] .av-single__unique {
	font-size: 14px;
	font-weight: 600;
	color: var(--av-primary);
	margin: 0 0 20px;
}

/* Formulario de compra */
.av-single__cart form.cart {
	display: flex;
	align-items: stretch;
	justify-content: flex-start;
	gap: 12px;
	flex-wrap: wrap;
	margin: 0 0 14px;
	padding: 0;
}

/*
 * Dos cosas desalineaban el botón respecto al resto de la columna:
 *
 * 1. El clearfix del tema (form.cart::before con content:" ") se convierte en
 *    un ítem flex y el gap lo separaba 12 px.
 * 2. En las piezas únicas WooCommerce imprime una caja de cantidad que solo
 *    lleva un input oculto: ocupaba sitio sin verse.
 */
.av-single__cart form.cart::before,
.av-single__cart form.cart::after {
	content: none !important;
	display: none !important;
}

.av-single__cart form.cart .quantity {
	margin: 0 !important;
}

.av-single__cart form.cart .quantity:not(:has(input:not([type="hidden"]))) {
	display: none !important;
}

.av-single__cart .quantity input.qty {
	height: 100%;
	min-height: 56px;
	width: 84px;
	padding: 0 10px;
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
	background: var(--av-surface);
	font-family: var(--av-font-body);
	font-size: 15px;
	text-align: center;
}

/*
 * Botón de compra.
 *
 * Los temas lo estilan con selectores muy específicos —Astra usa
 * ".woocommerce div.product form.cart .button.single_add_to_cart_button",
 * (0,5,2)— y algunos temas hijos añaden "button { width: 100% }". Por eso
 * estas declaraciones llevan !important: es la única forma de garantizar el
 * diseño sin entrar en una carrera de especificidad con cada tema.
 *
 * Se aplica solo con "Estilo del botón: el del plugin"; con "el del tema"
 * la clase av-atc-plugin no está y manda el tema.
 */
.av-single.av-atc-plugin .av-single__cart .single_add_to_cart_button {
	flex: 0 1 auto !important;
	width: auto !important;
	min-width: 240px;
	max-width: 420px;
	min-height: 0 !important;
	/* Pegado al margen izquierdo, al mismo nivel que "Disponibilidad". */
	margin: 0 !important;
	float: none !important;
	padding: 15px 30px !important;
	border: 0 !important;
	border-radius: var(--av-radius) !important;
	background: var(--av-primary) !important;
	color: #fff !important;
	font-family: var(--av-font-body) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 1.25 !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
	transition: background-color .2s ease;
}

.av-single.av-atc-plugin .av-single__cart .single_add_to_cart_button:hover {
	background: var(--av-accent) !important;
}

.av-single__cart .stock.out-of-stock {
	color: #b3261e;
	font-size: 14px;
}

.av[class] .av-single__secure {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--av-muted);
	margin: 0 0 26px;
}

.av-single__secure .av-icon {
	color: var(--av-accent);
}

/* Acordeones */
.av-accordion {
	border-top: 1px solid var(--av-border);
}

.av-accordion__item {
	border-bottom: 1px solid var(--av-border);
}

.av[class] .av-accordion__heading {
	margin: 0;
	font-size: inherit;
}

.av[class] .av-accordion__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	padding: 18px 4px;
	background: none;
	border: 0;
	font-family: var(--av-font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--av-text);
	text-align: left;
	cursor: pointer;
}

.av-accordion__trigger:hover {
	color: var(--av-accent);
}

.av-accordion__sign {
	position: relative;
	flex: none;
	width: 16px;
	height: 16px;
}

.av-accordion__sign::before,
.av-accordion__sign::after {
	content: "";
	position: absolute;
	background: currentColor;
	transition: transform .25s ease, opacity .25s ease;
}

.av-accordion__sign::before {
	top: 7px;
	left: 0;
	width: 16px;
	height: 1.5px;
}

.av-accordion__sign::after {
	top: 0;
	left: 7px;
	width: 1.5px;
	height: 16px;
}

.av-accordion__item.is-open .av-accordion__sign::after {
	transform: rotate(90deg);
	opacity: 0;
}

.av[class] .av-accordion__panel {
	padding: 0 4px 22px;
	font-size: 14.5px;
	color: #3f4a43;
}

.av-accordion__panel > :last-child {
	margin-bottom: 0;
}

.av-specs {
	width: 100%;
	border-collapse: collapse;
}

.av[class] .av-specs th,
.av[class] .av-specs td {
	padding: 9px 0;
	font-size: 14px;
	text-align: left;
	border-bottom: 1px solid var(--av-border);
	vertical-align: top;
}

.av-specs th {
	width: 45%;
	font-weight: 500;
	color: var(--av-muted);
}

.av-specs tr:last-child th,
.av-specs tr:last-child td {
	border-bottom: 0;
}

/* Barra de garantías */
.av-trust {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	padding: 32px 8px;
	margin-bottom: 48px;
	background: var(--av-surface);
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
}

.av-trust__item {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 8px 26px;
}

.av-trust__item + .av-trust__item {
	border-left: 1px solid var(--av-border);
}

.av-trust__icon {
	color: var(--av-primary);
	line-height: 0;
	flex: none;
	margin-top: 1px;
}

.av[class] .av-trust__title {
	margin: 0 0 6px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--av-text);
}

.av[class] .av-trust__text {
	margin: 0;
	font-size: 14.5px;
	color: var(--av-muted);
	line-height: 1.5;
}

.av-trust__pay {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

/*
 * El ancho sale del ajuste "Pago seguro · ancho de los logos". El alto se
 * calcula solo y nunca desborda su columna.
 */
.av-trust__pay img {
	width: var(--av-pay-w, 200px);
	max-width: 100%;
	height: auto;
	max-height: none;
}

.av-trust__pay .av-placeholder {
	width: var(--av-pay-w, 200px);
	max-width: 100%;
	min-height: 48px;
	padding: 8px 10px;
	font-size: 11px;
}

.av-trust__pay .av-placeholder .av-icon {
	display: none;
}

.av[class] .av-trust__paynote {
	font-size: 11.5px;
	color: var(--av-muted);
}

/* Historia */
.av-story {
	margin-bottom: 48px;
}

/* Cuando va en la columna del producto, antes de los acordeones. */
.av-story--summary {
	margin-bottom: 26px;
}

.av[class] .av-story--summary .av-story__title {
	font-size: clamp(20px, 2vw, 24px);
	margin-bottom: 10px;
}

.av-story--summary .av-story__body {
	font-size: 14.5px;
}

.av[class] .av-story__title {
	font-size: clamp(24px, 3vw, 34px);
	font-weight: 400;
	margin: 0 0 16px;
}

.av[class] .av-story__body {
	max-width: 76ch;
	font-size: 15px;
	color: #3f4a43;
}

/* Recomendados */
.av-cross {
	padding: 30px;
	margin-bottom: 48px;
	background: var(--av-surface);
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
}

.av-cross__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-bottom: 22px;
}

.av[class] .av-cross__title {
	font-family: var(--av-font-body);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	margin: 0 0 6px;
}

.av[class] .av-cross__text {
	margin: 0;
	font-size: 14px;
	color: var(--av-muted);
}

.av-cross__selall {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13.5px;
	color: var(--av-text);
	cursor: pointer;
	white-space: nowrap;
}

.av-cross__selall input {
	width: 17px;
	height: 17px;
	accent-color: var(--av-accent);
	cursor: pointer;
}

.av-cross__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.av-cross__card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 14px;
	border: 1px solid var(--av-border);
	border-radius: var(--av-radius);
	background: var(--av-bg);
	transition: border-color .2s ease;
}

.av-cross__card.is-selected {
	border-color: var(--av-accent);
	box-shadow: 0 0 0 1px var(--av-accent);
}

.av-cross__check {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
}

.av-cross__check input {
	width: 18px;
	height: 18px;
	accent-color: var(--av-accent);
	cursor: pointer;
}

.av-cross__media {
	display: block;
	aspect-ratio: 4 / 3;
	background: #fff;
	border-radius: var(--av-radius);
	overflow: hidden;
}

.av-cross__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.av[class] .av-cross__name {
	font-family: var(--av-font-body);
	font-size: 14px;
	font-weight: 600;
	margin: 0;
	line-height: 1.3;
}

.av-cross__name a {
	color: var(--av-text);
	text-decoration: none;
}

.av[class] .av-cross__desc {
	margin: 0;
	font-size: 12.5px;
	color: var(--av-muted);
	line-height: 1.45;
}

.av[class] .av-cross__price {
	margin: 0 0 4px;
	font-size: 15px;
	font-weight: 600;
}

.av-cross__card .av-btn {
	margin-top: auto;
}

.av-cross__foot {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 22px;
}

.av[class] .av-cross__feedback {
	margin: 0;
	font-size: 13px;
	color: var(--av-accent);
}

.av-reviews {
	margin-bottom: 40px;
}

/* Avisos de WooCommerce dentro de la ficha */
.av-single .woocommerce-notices-wrapper .woocommerce-message,
.av-single .woocommerce-notices-wrapper .woocommerce-error,
.av-single .woocommerce-notices-wrapper .woocommerce-info {
	border-top-color: var(--av-accent);
}

/* =========================================================================
   RESPONSIVE
   ========================================================================= */

/* --- Escritorio pequeño / portátil ---------------------------------------- */
@media (max-width: 1280px) {
	/* Con 4 columnas las tarjetas quedarían por debajo de 240 px. */
	.av-grid--cols-4 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 1180px) {
	.av-trust {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 22px;
	}

	.av-trust__item:nth-child(odd) {
		border-left: 0;
	}

	.av-cross__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* --- Tablet --------------------------------------------------------------- */
@media (max-width: 1024px) {
	.av-hero__inner {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.av-hero--left .av-hero__content {
		order: 0;
	}

	.av-hero .av-hero__content,
	.av-hero--left .av-hero__content {
		margin: 0;
		max-width: none;
		padding: 56px var(--av-pad) 40px;
		text-align: left;
	}

	.av-hero__media {
		min-height: 380px;
		aspect-ratio: 4 / 3;
	}

	.av-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.av-single__top {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.av-icons {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.av-icons__item {
		padding: 14px;
	}
}

/* --- Móvil ---------------------------------------------------------------- */
@media (max-width: 782px) {
	.av-coleccion {
		padding-top: 44px;
	}

	.av-filtros {
		padding-top: 22px;
	}

	.av-filters {
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
	}

	.av-filters__group {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.av-select,
	.av[class] .av-select__input {
		width: 100%;
		min-width: 0;
	}

	.av[class] .av-filters__clear {
		grid-column: 1 / -1;
		text-align: left;
	}

	.av-filters__sort .av-select {
		width: 100%;
	}

	.av-icons {
		grid-template-columns: 1fr;
	}

	.av-iconos.has-dividers .av-icons__item + .av-icons__item {
		border-left: 0;
		border-top: 1px solid var(--av-border);
	}

	.av-icons__item {
		padding: 24px 8px;
	}

	.av-jardin {
		min-height: 0;
	}

	.av-jardin__bg::after {
		background: linear-gradient(180deg, rgba(11, 46, 22, .55), rgba(11, 46, 22, .8));
	}

	.av-jardin__inner {
		padding-top: 56px;
		padding-bottom: 56px;
	}

	.av-jardin__actions .av-btn {
		flex: 1 1 100%;
	}

	.av-trust {
		grid-template-columns: 1fr;
		padding: 18px;
	}

	.av-trust__item {
		padding: 12px 4px;
		border-left: 0 !important;
	}

	.av-trust__item + .av-trust__item {
		border-top: 1px solid var(--av-border);
	}

	.av-cross {
		padding: 20px 16px;
	}

	.av-single__cart form.cart {
		flex-direction: column;
	}

	.av-single__cart .quantity input.qty {
		width: 100%;
	}
}

@media (max-width: 560px) {
	.av-grid {
		grid-template-columns: 1fr !important;
		gap: 18px;
	}

	.av-cross__grid {
		grid-template-columns: 1fr;
	}

	.av[class] .av-hero__title {
		font-size: clamp(30px, 9vw, 42px);
	}

	.av[class] .av-single__price {
		font-size: 28px;
	}

	.av-cross__foot .av-btn {
		width: 100%;
	}
}

/* --- Móviles estrechos ---------------------------------------------------- */
@media (max-width: 420px) {
	/* Un solo filtro por fila: dos no caben sin cortar el texto. */
	.av-filters__group {
		grid-template-columns: 1fr;
	}

	.av-hero__media {
		min-height: 260px;
		aspect-ratio: 1 / 1;
	}

	.av[class] .av-jardin__title {
		font-size: clamp(28px, 8.5vw, 34px);
	}

	.av-single__gallery .flex-control-thumbs li {
		flex: 0 0 64px;
		width: 64px !important;
	}

	.av-card__meta {
		gap: 4px 10px;
	}
}

/* Evita el desbordamiento horizontal si alguna palabra no cabe. */
.av h1,
.av h2,
.av h3,
.av p,
.av li,
.av td,
.av th {
	overflow-wrap: break-word;
}

