/**
 * Mifoto — Venta Directa · Estilo BLITZ
 *
 * Estética inspirada en la referencia BLITZ: tiles de producto con fondo pastel
 * redondeado, tipografía marcada, precios en negrita y botón "COMPRAR" negro
 * tipo píldora. Todo por variables CSS para poder ajustar sin tocar el archivo.
 *
 * Ámbito: la grilla (shortcode) y, vía body.mvd-single, la ficha de producto
 * de venta directa. No afecta a ningún otro producto del sitio.
 */

:root {
	--mvd-ink:        #111114;   /* texto / botón */
	--mvd-ink-soft:   #6b7280;   /* texto tenue */
	--mvd-line:       #ececec;   /* bordes suaves */
	--mvd-tile:       #f7eef0;   /* fondo pastel del tile */
	--mvd-tile-2:     #eef1f7;   /* fondo pastel alterno */
	--mvd-card:       #ffffff;   /* fondo de card */
	--mvd-accent:      #ed746f;  /* coral oficial (botón/precio/título hover) */
	--mvd-accent-dark: #d95a55;  /* coral oscuro para hovers */
	--mvd-brand:       #5192ac;  /* azul MiFoto (acentos de secciones) */
	--mvd-radius:     16px;
	--mvd-radius-sm:  12px;
	--mvd-gap:        22px;
	--mvd-font:       inherit;
}

/* ============================================================
   SECCIÓN + ENCABEZADO
   ============================================================ */

.mvd-section {
	margin: 0 0 3rem;
	font-family: var(--mvd-font);
}

.mvd-section__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	margin: 0 0 1.4rem;
}

.mvd-section__title {
	margin: 0;
	font-size: clamp(20px, 2.4vw, 28px);
	font-weight: 800;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--mvd-ink);
	line-height: 1.1;
}

.mvd-section__sub {
	margin: 0;
	font-size: 14px;
	color: var(--mvd-ink-soft);
	text-align: right;
	max-width: 46ch;
}

/* ============================================================
   GRILLA DE CARDS
   ============================================================ */

.mvd-grid {
	display: grid;
	grid-template-columns: repeat(var(--mvd-columns, 4), minmax(0, 1fr));
	gap: var(--mvd-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.mvd-cols-1 { --mvd-columns: 1; }
.mvd-cols-2 { --mvd-columns: 2; }
.mvd-cols-3 { --mvd-columns: 3; }
.mvd-cols-4 { --mvd-columns: 4; }
.mvd-cols-5 { --mvd-columns: 5; }
.mvd-cols-6 { --mvd-columns: 6; }

.mvd-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--mvd-card);
	border-radius: var(--mvd-radius);
	padding: 10px;
	transition: transform .18s ease, box-shadow .18s ease;
}

.mvd-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(17, 17, 20, .08);
}

/* Tile de imagen con fondo pastel */
.mvd-card__media {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	background: var(--mvd-tile);
	border-radius: var(--mvd-radius-sm);
	overflow: hidden;
}

.mvd-grid > .mvd-card:nth-child(even) .mvd-card__media {
	background: var(--mvd-tile-2);
}

/* Cards de imagen vertical (carcasas 2:3): contenedor alto para que se vean
   completas, sin recorte. */
.mvd-card--tall .mvd-card__media {
	aspect-ratio: 2 / 3;
	background: #f4f4f6;
}

.mvd-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .35s ease;
}

.mvd-card:hover .mvd-card__media img { transform: scale(1.04); }

.mvd-badge {
	position: absolute;
	top: 10px;
	right: 10px;
	background: var(--mvd-ink);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 5px 9px;
	border-radius: 999px;
}
/* Distintivo del par "mismo diseño" en el carrusel de recomendación */
.mvd-badge--par { background: var(--mvd-accent); }
.mvd-carousel__slide--par .mvd-card {
	border-color: var(--mvd-accent);
	box-shadow: 0 8px 24px rgba(237, 116, 111, .18);
}

.mvd-card__body {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 8px 8px;
	flex: 1 1 auto;
}

.mvd-card__title {
	font-size: 15px;
	font-weight: 700;
	color: var(--mvd-ink);
	text-decoration: none;
	line-height: 1.3;
	/* Siempre 2 líneas: cards de igual alto */
	min-height: 2.6em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .15s ease;
}

.mvd-card__title:hover { text-decoration: none; }
/* Al pasar el mouse por el card, el título cambia a naranja */
.mvd-card:hover .mvd-card__title { color: var(--mvd-accent); }

.mvd-card__sub {
	margin: 0;
	font-size: 12.5px;
	color: var(--mvd-ink-soft);
	line-height: 1.35;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.mvd-card__price {
	margin-top: 4px;
	font-size: 16px;
	font-weight: 800;
	color: var(--mvd-ink);
}

.mvd-card__price del { color: var(--mvd-ink-soft); font-weight: 500; margin-right: 6px; }
.mvd-card__price ins { text-decoration: none; }

.mvd-card__actions {
	margin-top: auto;
	padding-top: 12px;
}

/* Botón naranja MiFoto, hover negro (el theme pisa el color en algunos) */
.mvd-card__actions .mvd-btn,
.mvd-card__actions a.mvd-btn {
	background: var(--mvd-accent) !important;
	color: #fff !important;
	border: 0 !important;
}
.mvd-card__actions .mvd-btn:hover,
.mvd-card__actions a.mvd-btn:hover {
	background: var(--mvd-ink) !important;
	color: #fff !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(17, 17, 20, .22);
}

/* ============================================================
   BOTÓN "COMPRAR" (píldora negra)
   ============================================================ */

.mvd-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 12px 16px;
	border: 0;
	border-radius: 999px;
	background: var(--mvd-ink);
	color: #fff;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: opacity .15s ease, transform .1s ease;
}

.mvd-btn:hover { color: #fff; opacity: .86; }
.mvd-btn:active { transform: scale(.98); }
.mvd-btn.loading { opacity: .55; pointer-events: none; }
.mvd-btn.added { opacity: .7; }

.mvd-empty { color: var(--mvd-ink-soft); font-style: italic; }

/* ============================================================
   FICHA DE PRODUCTO (body.mvd-single) — estilo BLITZ
   Solo aplica a productos de venta directa.
   ============================================================ */

/* Aprovechar el ancho del contenedor del theme en la ficha */
body.mvd-single .col-full { max-width: 1280px; }

body.mvd-single .sOrdenesCOntent {
	max-width: 1280px;
	margin: 0 auto;
	padding: 2.5rem 1rem 3.5rem;
}

body.mvd-single .mifoto_product {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}

/* El theme fija width:40%/30% a las columnas y aplasta el texto: lo anulamos
   para que cada columna llene su celda del grid. */
body.mvd-single .mifoto_product_c1,
body.mvd-single .mifoto_product_c2 {
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
}

/* Anular anchos/float por defecto de WooCommerce (dejaban todo angosto y la
   imagen pequeña). Forzamos que galería y resumen llenen su columna. */
body.mvd-single .mifoto_product .woocommerce-product-gallery,
body.mvd-single .mifoto_product div.images,
body.mvd-single .mifoto_product .summary.entry-summary {
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
	margin: 0 !important;
}

/* Columna de imágenes: tile amplio + imagen grande que llena */
body.mvd-single .mifoto_product_c1 {
	position: sticky;
	top: 90px;
	/* Fondo neutro (no rosado) para que combine con fotos de fondo gris/blanco */
	background: #f3f3f5;
	border-radius: var(--mvd-radius);
	padding: 34px;
}

body.mvd-single .mifoto_product_c1 .woocommerce-product-gallery__image img {
	border-radius: var(--mvd-radius-sm);
}

/* Galería: imagen principal arriba y miniaturas ABAJO en fila */
body.mvd-single .mifoto_product_c1 .woocommerce-product-gallery {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
}
body.mvd-single .mifoto_product_c1 .flex-viewport {
	width: 100% !important;
	margin: 0 0 14px !important;
}
body.mvd-single .mifoto_product_c1 .flex-control-thumbs {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap;
	gap: 10px;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}
body.mvd-single .mifoto_product_c1 .flex-control-thumbs li {
	width: calc(25% - 8px) !important;
	margin: 0 !important;
	float: none !important;
}
body.mvd-single .mifoto_product_c1 .flex-control-thumbs img {
	width: 100% !important;
	border-radius: 8px;
	opacity: .55;
	cursor: pointer;
	transition: opacity .15s ease;
}
body.mvd-single .mifoto_product_c1 .flex-control-thumbs img.flex-active,
body.mvd-single .mifoto_product_c1 .flex-control-thumbs img:hover { opacity: 1; }

/* Columna de resumen */
body.mvd-single .mifoto_product_c2 .summary { margin: 0; }

body.mvd-single .mifoto_product_c2 h1 {
	font-size: clamp(28px, 3.2vw, 42px);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.08;
	margin: 0 0 14px;
	color: var(--mvd-ink);
	overflow-wrap: break-word;
	word-break: normal;
	hyphens: none;
}

body.mvd-single .mifoto_product_c2 .price {
	font-size: 26px;
	font-weight: 800;
	color: var(--mvd-accent);
	margin: 0 0 18px;
}

body.mvd-single .mifoto_product_c2 .price del { color: var(--mvd-ink-soft); font-weight: 500; margin-right: 8px; }
body.mvd-single .mifoto_product_c2 .price ins { text-decoration: none; }

body.mvd-single .woocommerce-product-details__short-description {
	color: var(--mvd-ink-soft);
	font-size: 15px;
	line-height: 1.6;
	margin: 0 0 22px;
}

/* Cantidad + botón */
/* Producto simple: cantidad + botón en fila */
body.mvd-single form.cart:not(.variations_form) {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin: 0 0 22px;
}

/* Producto variable: cantidad + botón en la misma fila */
body.mvd-single .woocommerce-variation-add-to-cart {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin: 6px 0 22px;
}

body.mvd-single form.cart .quantity .qty {
	height: 52px;
	width: 84px;
	border: 1px solid var(--mvd-line);
	border-radius: 999px;
	text-align: center;
	font-size: 16px;
	font-weight: 600;
}

body.mvd-single .single_add_to_cart_button.button {
	flex: 1 1 auto;
	min-width: 220px;
	height: 52px;
	padding: 0 28px;
	border: 0;
	border-radius: 999px;
	background: var(--mvd-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	transition: background .15s ease;
}

body.mvd-single .single_add_to_cart_button.button:hover { background: var(--mvd-accent-dark); color: #fff; }

body.mvd-single .product_meta {
	border-top: 1px solid var(--mvd-line);
	padding-top: 16px;
	font-size: 13px;
	color: var(--mvd-ink-soft);
}

body.mvd-single .product_meta a { color: var(--mvd-accent); text-decoration: none; }
body.mvd-single .product_meta a:hover { text-decoration: underline; }

/* ---- Selectores de variante (swatches tipo botón) ---- */
body.mvd-single .variations { border: 0; margin: 0 0 22px; }
body.mvd-single .variations td, body.mvd-single .variations th { border: 0; padding: 6px 0; }

/* Etiqueta del atributo (Capacidad / Compatibilidad) */
body.mvd-single .variations .label label {
	font-weight: 700;
	color: var(--mvd-ink);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .04em;
}

/* Swatch base */
body.mvd-single .rtwpvs-button-term {
	border-radius: 10px !important;
	border: 1.5px solid var(--mvd-line) !important;
	background: #fff !important;
	color: var(--mvd-ink) !important;
	font-weight: 600 !important;
	padding: 11px 18px !important;
	min-height: auto !important;
	transition: border-color .15s ease, color .15s ease, background .15s ease, box-shadow .15s ease !important;
}

/* Hover */
body.mvd-single .rtwpvs-button-term:not(.disabled):hover {
	border-color: var(--mvd-accent) !important;
	color: var(--mvd-accent) !important;
}

/* Seleccionado (coral, con relleno suave) — sin borde negro de foco */
body.mvd-single .rtwpvs-term.selected,
body.mvd-single .rtwpvs-button-term.selected,
body.mvd-single .rtwpvs-term.rtwpvs-selected,
body.mvd-single .rtwpvs-button-term:focus {
	border-color: var(--mvd-accent) !important;
	color: var(--mvd-accent) !important;
	background: rgba(237, 116, 111, .08) !important;
	box-shadow: 0 0 0 1px var(--mvd-accent) inset !important;
	outline: none !important;
}

/* Ocultar el tooltip negro de rtwpvs (la burbuja al pasar el mouse) */
body.mvd-single .rtwpvs-term[data-rtwpvs-tooltip]:not(.disabled)::before,
body.mvd-single .rtwpvs-term[data-rtwpvs-tooltip]:not(.disabled)::after {
	display: none !important;
	content: none !important;
}

/* Fila del atributo "code" oculta (el JS lo auto-selecciona por detrás) */
body.mvd-single .variations .mvd-attr-oculto,
body.mvd-single .variations tr.mvd-attr-oculto { display: none !important; }

/* Capacidad/Compatibilidad nunca "deshabilitadas": siempre clickeables y sin la
   X (el code se resuelve por detrás, así que la capacidad debe poder cambiarse). */
body.mvd-single .rtwpvs-terms-wrapper:not([data-attribute_name*="code"]) .rtwpvs-term.disabled {
	pointer-events: auto !important;
	opacity: 1 !important;
	cursor: pointer !important;
}
body.mvd-single .rtwpvs-terms-wrapper:not([data-attribute_name*="code"]) .rtwpvs-term.disabled::before,
body.mvd-single .rtwpvs-terms-wrapper:not([data-attribute_name*="code"]) .rtwpvs-term.disabled::after {
	display: none !important;
	content: none !important;
}

/* ---- Pestañas (Descripción / Info / Valoraciones) ---- */
body.mvd-single .woocommerce-tabs { max-width: 1280px; margin: 3rem auto 0; padding: 0 1rem; }

/* ---- Productos relacionados (venta directa) ---- */
body.mvd-single .related.products {
	max-width: 1280px;
	margin: 3.5rem auto 0;
	padding: 2.5rem 1rem 0;
	border-top: 1px solid var(--mvd-line);
}

body.mvd-single .related.products > h2 {
	font-size: clamp(20px, 2.6vw, 28px);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin: 0 0 1.6rem;
}

body.mvd-single .related.products ul.products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.mvd-single .related.products ul.products::before,
body.mvd-single .related.products ul.products::after { content: none !important; display: none !important; }

body.mvd-single .related.products ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	background: var(--mvd-card);
	border-radius: var(--mvd-radius);
	padding: 10px;
}

body.mvd-single .related.products ul.products li.product img { border-radius: var(--mvd-radius-sm); margin-bottom: 10px; }
body.mvd-single .related.products .woocommerce-loop-product__title { font-size: 15px; font-weight: 700; padding: 0 6px; }
body.mvd-single .related.products .description { display: none; }
body.mvd-single .related.products .price { padding: 0 6px; font-weight: 800; }

body.mvd-single .related.products .botonseccion {
	display: inline-flex;
	margin: 10px 6px 6px;
	padding: 10px 18px;
	border-radius: 999px;
	background: var(--mvd-ink);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
}
body.mvd-single .related.products .botonseccion:hover { opacity: .86; color: #fff; }

@media (max-width: 900px) {
	body.mvd-single .related.products ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
	body.mvd-single .related.products ul.products { grid-template-columns: 1fr; }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 1024px) {
	.mvd-cols-5, .mvd-cols-6 { --mvd-columns: 4; }
}

@media (max-width: 900px) {
	body.mvd-single .mifoto_product { grid-template-columns: 1fr; gap: 28px; }
	body.mvd-single .mifoto_product_c1 { position: static; }
}

@media (max-width: 768px) {
	.mvd-grid { --mvd-gap: 14px; }
	.mvd-cols-3, .mvd-cols-4, .mvd-cols-5, .mvd-cols-6 { --mvd-columns: 2; }
	.mvd-section__sub { text-align: left; }
}

@media (max-width: 480px) {
	/* Mantener cantidad + botón en la misma fila en móvil */
	body.mvd-single form.cart .quantity .qty { width: 64px; }
	body.mvd-single .single_add_to_cart_button.button { min-width: 0; flex: 1 1 auto; }
}

@media (max-width: 520px) {
	/* Botón de card en una sola línea en móvil */
	.mvd-card__actions .mvd-btn {
		font-size: 11px;
		letter-spacing: .02em;
		padding: 11px 8px;
		white-space: nowrap;
	}
}

/* ============================================================
   BLOQUES DE LANDING (hero / features / promo / testimonios)
   ============================================================ */

.vd-hero, .vd-features, .vd-promo, .vd-testimonios {
	font-family: var(--mvd-font);
	margin: 0 0 3rem;
}

/* Botones compartidos */
.vd-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 26px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: opacity .15s ease, transform .1s ease;
}

.vd-btn:active { transform: scale(.98); }
.vd-btn--dark  { background: var(--mvd-ink); color: #fff; }
.vd-btn--dark:hover { color: #fff; opacity: .86; }
.vd-btn--light { background: #fff; color: var(--mvd-ink); }
.vd-btn--light:hover { color: var(--mvd-ink); opacity: .9; }
.vd-btn--ghost { background: transparent; color: var(--mvd-ink); border: 1.5px solid var(--mvd-ink); }
.vd-btn--ghost:hover { color: var(--mvd-ink); background: rgba(17,17,20,.05); }

/* ---------- HERO ---------- */
.vd-hero { border-radius: var(--mvd-radius); overflow: hidden; }

.vd-hero__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: 40px;
	padding: 56px 40px;
}

.vd-hero__badge {
	display: inline-block;
	background: rgba(17,17,20,.08);
	color: var(--mvd-ink);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: 7px 14px;
	border-radius: 999px;
	margin-bottom: 18px;
}

.vd-hero__title {
	margin: 0 0 14px;
	font-size: clamp(32px, 5vw, 56px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.02em;
	color: var(--mvd-ink);
}

.vd-hero__lead {
	margin: 0 0 26px;
	font-size: 17px;
	line-height: 1.55;
	color: var(--mvd-ink-soft);
	max-width: 42ch;
}

.vd-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 26px; }

.vd-hero__features {
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.vd-hero__features li {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--mvd-ink);
}

.vd-hero__ficon { display: inline-flex; }
.vd-hero__ficon .mvd-ico { width: 20px; height: 20px; }

.vd-hero__media img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: var(--mvd-radius-sm);
}

/* ---------- FEATURES / TESTIMONIOS head ---------- */
.vd-features__head { text-align: center; margin: 0 auto 2rem; max-width: 720px; }

.vd-features__title {
	margin: 0 0 8px;
	font-size: clamp(22px, 3vw, 32px);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--mvd-ink);
}

.vd-features__sub { margin: 0; font-size: 15px; color: var(--mvd-ink-soft); }

.vd-features__grid {
	display: grid;
	grid-template-columns: repeat(var(--vd-fcols, 4), minmax(0, 1fr));
	gap: 24px;
}

.vd-feature { text-align: center; padding: 8px; }
.vd-feature__icon { display: flex; justify-content: center; margin-bottom: 12px; color: var(--mvd-ink); }
.vd-feature__icon .mvd-ico { width: 30px; height: 30px; }
.vd-feature__title { font-size: 15px; font-weight: 700; color: var(--mvd-ink); margin-bottom: 4px; }
.vd-feature__text { font-size: 13.5px; color: var(--mvd-ink-soft); line-height: 1.45; }

/* ---------- PROMO ---------- */
.vd-promo { border-radius: var(--mvd-radius); overflow: hidden; }

.vd-promo__inner {
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	align-items: center;
	gap: 32px;
	padding: 48px 40px;
}

.vd-promo__title { margin: 0 0 12px; font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; line-height: 1.05; letter-spacing: -0.02em; }
.vd-promo__lead { margin: 0 0 20px; font-size: 16px; opacity: .85; max-width: 46ch; }

.vd-promo__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.vd-chip {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 7px 14px;
	border-radius: 999px;
	border: 1.5px solid currentColor;
}

.vd-promo__badge {
	position: absolute;
	top: 24px;
	right: 40px;
	width: 72px;
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: #ffd5e0;
	color: #111114;
	border-radius: 50%;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.05;
}

.vd-promo__media img { width: 100%; height: auto; display: block; border-radius: var(--mvd-radius-sm); }

/* ---------- TESTIMONIOS ---------- */
.vd-testi__grid {
	display: grid;
	grid-template-columns: repeat(var(--vd-fcols, 3), minmax(0, 1fr));
	gap: 22px;
}

.vd-testi {
	margin: 0;
	background: var(--mvd-tile);
	border-radius: var(--mvd-radius);
	padding: 24px;
}

.vd-testi__stars { color: #f5a623; font-size: 15px; letter-spacing: 2px; margin-bottom: 12px; }
.vd-testi__text { margin: 0 0 14px; font-size: 15px; line-height: 1.5; color: var(--mvd-ink); }
.vd-testi__author { font-size: 13px; font-weight: 700; color: var(--mvd-ink); }

/* ---------- responsive bloques ---------- */
@media (max-width: 900px) {
	.vd-hero__inner, .vd-promo__inner { grid-template-columns: 1fr; padding: 40px 24px; }
	.vd-hero__media { order: -1; }
	.vd-promo__badge { top: 16px; right: 20px; width: 60px; height: 60px; font-size: 12px; }
	.vd-features__grid { --vd-fcols: 2 !important; }
	.vd-testi__grid { --vd-fcols: 2 !important; }
}

@media (max-width: 560px) {
	.vd-features__grid, .vd-testi__grid { --vd-fcols: 1 !important; }
	.vd-hero__cta .vd-btn { flex: 1 1 100%; }
}

/* ============================================================
   SECCIONES PARA COPIAR/PEGAR (HTML personalizado)
   Clases genéricas vd-* para armar landings a mano.
   ============================================================ */

.vd-wrap { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

.vd-sec {
	padding: 64px 0;
	font-family: var(--mvd-font);
	color: var(--mvd-ink);
}

.vd-eyebrow {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--mvd-ink-soft);
	background: rgba(17, 17, 20, .06);
	padding: 6px 12px;
	border-radius: 999px;
	margin-bottom: 14px;
}

.vd-h2 {
	font-size: clamp(24px, 3vw, 34px);
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.1;
	margin: 0 0 10px;
}

.vd-lead {
	color: var(--mvd-ink-soft);
	font-size: 16px;
	line-height: 1.55;
	max-width: 62ch;
	margin: 0 0 30px;
}

.vd-center { text-align: center; }
.vd-center .vd-lead { margin-left: auto; margin-right: auto; }
.vd-ico { width: 22px; height: 22px; }

/* ---------- 1. Banner ---------- */
.vd-banner { background: var(--mvd-tile); }
.vd-banner__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 44px;
	align-items: center;
	padding: 56px 0;
}
.vd-banner__title {
	font-size: clamp(32px, 5vw, 54px);
	font-weight: 800;
	line-height: 1.03;
	letter-spacing: -0.02em;
	margin: 0 0 14px;
}
.vd-banner__sub { font-size: 17px; color: var(--mvd-ink-soft); margin: 0 0 26px; max-width: 46ch; }
.vd-banner__cta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
.vd-banner__points { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.vd-banner__points li {
	font-size: 13px; font-weight: 600; background: #fff;
	border-radius: 999px; padding: 8px 15px;
}
.vd-banner__media img { width: 100%; height: auto; display: block; border-radius: var(--mvd-radius); }

/* ---------- 3. Beneficios ---------- */
.vd-benefits__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.vd-benefit {
	background: var(--mvd-card);
	border: 1px solid var(--mvd-line);
	border-radius: var(--mvd-radius);
	padding: 30px 26px;
	text-align: center;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.vd-benefit:hover {
	transform: translateY(-4px);
	border-color: var(--mvd-accent);
	box-shadow: 0 14px 30px rgba(237, 116, 111, .15);
}
.vd-benefit__ico {
	width: 52px; height: 52px; border-radius: 14px;
	background: rgba(237, 116, 111, .12); color: var(--mvd-accent);
	display: flex; align-items: center; justify-content: center;
	margin: 0 auto 16px;
	transition: transform .25s ease, background .2s ease, color .2s ease;
}
.vd-benefit__ico .vd-ico { width: 24px; height: 24px; }
.vd-benefit:hover .vd-benefit__ico {
	transform: scale(1.1) rotate(-4deg);
	background: var(--mvd-accent);
	color: #fff;
}
.vd-benefit h3 { font-size: 16px; font-weight: 700; margin: 0 0 6px; }
.vd-benefit p { font-size: 14px; color: var(--mvd-ink-soft); margin: 0; line-height: 1.55; }

/* ---------- 4. Características técnicas ---------- */
.vd-specs__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.vd-spec {
	display: flex; gap: 16px; align-items: baseline;
	background: var(--mvd-card); border: 1px solid var(--mvd-line);
	border-left: 3px solid var(--mvd-accent);
	border-radius: 12px; padding: 18px 20px;
	transition: transform .2s ease, box-shadow .2s ease;
}
.vd-spec:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(237, 116, 111, .13); }
.vd-spec__k { font-weight: 700; min-width: 150px; flex: 0 0 auto; color: var(--mvd-accent); }
.vd-spec__v { color: var(--mvd-ink-soft); }

/* ---------- 5. Cómo elegir ---------- */
.vd-choose__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.vd-choose__card {
	border: 1px solid var(--mvd-line); border-radius: var(--mvd-radius);
	padding: 28px; text-align: center; background: var(--mvd-card);
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.vd-choose__card:hover {
	transform: translateY(-4px);
	border-color: var(--mvd-accent);
	box-shadow: 0 14px 30px rgba(237, 116, 111, .15);
}
.vd-choose__cap { font-size: 30px; font-weight: 800; margin: 0 0 8px; color: var(--mvd-accent); }
.vd-choose__card p { color: var(--mvd-ink-soft); margin: 0; line-height: 1.5; }

/* ---------- 6. Packs (banda oscura) ---------- */
.vd-packs { background: var(--mvd-ink); color: #fff; border-radius: var(--mvd-radius); }
.vd-packs .vd-wrap { padding-top: 48px; padding-bottom: 48px; }
.vd-packs .vd-h2 { color: #fff; }
.vd-packs .vd-lead { color: rgba(255, 255, 255, .82); }
.vd-packs__opts { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 26px; }
.vd-packs__opts span {
	border: 1.5px solid rgba(255, 255, 255, .4); border-radius: 999px;
	padding: 8px 16px; font-size: 13px; font-weight: 600;
}

/* ---------- 7. Confianza ---------- */
.vd-trust__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.vd-trust__item { text-align: center; }
.vd-trust__ico {
	width: 48px; height: 48px; margin: 0 auto 12px; border-radius: 12px;
	background: var(--mvd-tile); color: var(--mvd-ink);
	display: flex; align-items: center; justify-content: center;
}
.vd-trust__item h4 { font-size: 15px; font-weight: 700; margin: 0 0 4px; }
.vd-trust__item p { font-size: 13px; color: var(--mvd-ink-soft); margin: 0; }

/* ---------- 8. FAQ (details/summary, sin JS) ---------- */
.vd-faq__list { max-width: 820px; margin: 0 auto; }
.vd-faq__item {
	border: 1px solid var(--mvd-line); border-radius: 12px;
	margin-bottom: 12px; background: var(--mvd-card); overflow: hidden;
}
.vd-faq__item summary {
	list-style: none; cursor: pointer; padding: 18px 20px;
	font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 16px;
}
.vd-faq__item summary::-webkit-details-marker { display: none; }
.vd-faq__item summary:hover { color: var(--mvd-accent); }
.vd-faq__item summary::after { content: '+'; font-size: 26px; font-weight: 400; color: var(--mvd-accent); }
.vd-faq__item[open] summary::after { content: '\2013'; }
.vd-faq__item[open] { border-color: var(--mvd-accent); box-shadow: 0 6px 18px rgba(237, 116, 111, .1); }
.vd-faq__item[open] summary { color: var(--mvd-accent); }
.vd-faq__item p { margin: 0; padding: 0 20px 20px; color: var(--mvd-ink-soft); line-height: 1.6; }

/* ---------- responsive secciones ---------- */
@media (max-width: 900px) {
	.vd-banner__grid { grid-template-columns: 1fr; }
	.vd-banner__media { order: -1; }
	.vd-benefits__grid { grid-template-columns: repeat(2, 1fr); }
	.vd-choose__grid { grid-template-columns: 1fr; }
	.vd-trust__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.vd-sec { padding: 44px 0; }
	.vd-benefits__grid, .vd-specs__grid { grid-template-columns: 1fr; }
	.vd-banner__cta .vd-btn { flex: 1 1 100%; }
}

/* ============================================================
   DESCRIPCIÓN POWERBANK POR CAPACIDAD (dinámica 5.000 / 10.000)
   ============================================================ */

.mvd-pbdesc {
	max-width: 1280px;
	margin: 2.5rem auto 0;
	padding: 0 20px;
}
.mvd-pbdesc__wrap {
	max-width: 900px;
	margin: 0 auto;
	border-top: 1px solid var(--mvd-line);
	padding-top: 2rem;
}
.mvd-pbdesc__eyebrow {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--mvd-accent);
	background: rgba(237, 116, 111, .1);
	padding: 6px 13px;
	border-radius: 999px;
	margin: 0 0 14px;
}
.mvd-pbdesc__title {
	font-size: 26px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -.01em;
	margin: 0 0 10px;
	color: var(--mvd-ink);
}
.mvd-pbdesc__intro {
	font-size: 16px;
	line-height: 1.7;
	color: var(--mvd-ink-soft);
	margin: 0 0 24px;
}
.mvd-pbdesc__cap {
	border: 1px solid var(--mvd-line);
	border-radius: 16px;
	padding: 22px;
	margin: 0 0 18px;
}
.mvd-pbdesc__caphead {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 14px;
}
.mvd-pbdesc__chip--cap {
	font-size: 14px;
	font-weight: 800;
	color: #fff;
	background: var(--mvd-accent);
	padding: 5px 12px;
	border-radius: 999px;
}
.mvd-pbdesc__sub { font-size: 15px; font-weight: 700; color: var(--mvd-ink); }
.mvd-pbdesc__text {
	font-size: 15px;
	line-height: 1.65;
	color: var(--mvd-ink-soft);
	margin: 0 0 16px;
}
.mvd-pbdesc__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 6px;
}
.mvd-pbdesc__chip--feat {
	font-size: 13px;
	font-weight: 600;
	color: var(--mvd-ink);
	border: 1px solid var(--mvd-line);
	border-radius: 999px;
	padding: 7px 14px;
}

/* ============================================================
   BOTÓN "VOLVER A BLITZ" (arriba de la ficha) — venta directa
   ============================================================ */

.mvd-volver {
	max-width: 1280px;
	margin: 0 auto;
	padding: 18px 20px 0;
}
.mvd-volver__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--mvd-ink);
	text-decoration: none;
	border: 1.5px solid var(--mvd-line);
	border-radius: 999px;
	padding: 9px 18px;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.mvd-volver__btn:hover {
	border-color: var(--mvd-accent);
	color: var(--mvd-accent);
}
.mvd-volver__ico { font-size: 16px; line-height: 1; }

/* ============================================================
   "COMPLETA TU SET" — mini-card del par (mismo diseño), bajo COMPRAR
   ============================================================ */

.mvd-companion {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin: 18px 0 0;
	padding: 14px;
	border: 1px solid var(--mvd-line);
	border-radius: 14px;
	background: var(--mvd-tile);
}
.mvd-companion__media {
	flex: 0 0 auto;
	width: 76px;
	height: 76px;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	display: block;
}
.mvd-companion__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
/* Par de imagen vertical (carcasa 2:3): miniatura alta para verla completa */
.mvd-companion--vert .mvd-companion__media {
	width: 76px;
	height: 114px;
}
.mvd-companion__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.mvd-companion__eyebrow {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--mvd-accent);
}
.mvd-companion__title {
	font-size: 15px;
	font-weight: 700;
	color: var(--mvd-ink);
	text-decoration: none;
	line-height: 1.25;
}
.mvd-companion__title:hover { color: var(--mvd-accent); }
.mvd-companion__price { font-size: 14px; color: var(--mvd-ink-soft); }
.mvd-companion__price .amount { color: var(--mvd-ink); font-weight: 700; }

/* Pills de opción (Modelo / Capacidad) */
.mvd-companion__opts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.mvd-companion__opt {
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	border: 1.5px solid var(--mvd-line);
	background: #fff;
	color: var(--mvd-ink);
	font-size: 13px;
	font-weight: 600;
	padding: 8px 14px;
	border-radius: 999px;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.mvd-companion__opt:hover { border-color: var(--mvd-accent); color: var(--mvd-accent); }
/* Modelo único: se muestra como etiqueta fija (no invita a elegir) */
.mvd-companion__opts--single .mvd-companion__opt { cursor: default; }
.mvd-companion__opt.is-selected {
	border-color: var(--mvd-accent);
	color: var(--mvd-accent);
	background: rgba(237, 116, 111, .08);
	box-shadow: 0 0 0 1px var(--mvd-accent) inset;
}

/* Acciones: botón Agregar + mensaje */
.mvd-companion__actions { display: flex; align-items: center; gap: 12px; margin-top: 6px; }
.mvd-companion__add {
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	border: 0;
	background: var(--mvd-accent);
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	padding: 10px 24px;
	border-radius: 999px;
	transition: background .15s ease, opacity .15s ease;
}
.mvd-companion__add:hover:not(:disabled) { background: var(--mvd-accent-dark); }
.mvd-companion__add:disabled { opacity: .5; cursor: default; }
.mvd-companion__add.is-loading { opacity: .7; cursor: wait; }
.mvd-companion__add.is-done { background: #3a9d5d; cursor: default; }
.mvd-companion__msg { font-size: 13px; color: var(--mvd-ink-soft); }

@media (max-width: 480px) {
	.mvd-companion__actions { flex-wrap: wrap; }
	.mvd-companion__add { flex: 1 1 100%; }
}

/* Movimiento para llamar la atención: la card da un pequeño "salto" con brillo
   coral cada ~3s. La mayor parte del ciclo está quieta (guiño, no distracción).
   Se pausa al pasar el mouse y se desactiva si el sistema pide menos animación. */
@keyframes mvd-companion-attn {
	0%, 82%, 100% { transform: none; box-shadow: 0 0 0 rgba(237, 116, 111, 0); }
	86%           { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(237, 116, 111, .28); }
	90%           { transform: translateY(0); box-shadow: 0 6px 16px rgba(237, 116, 111, .18); }
	94%           { transform: translateY(-2px); }
}
.mvd-companion {
	animation: mvd-companion-attn 3s ease-in-out infinite;
	will-change: transform;
}
.mvd-companion:hover { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
	.mvd-companion { animation: none; }
}

/* Shake cuando intentan agregar sin elegir opción */
@keyframes mvd-shake {
	0%, 100% { transform: translateX(0); }
	20%, 60% { transform: translateX(-5px); }
	40%, 80% { transform: translateX(5px); }
}
.mvd-companion__opts.mvd-shake { animation: mvd-shake .45s ease; }

/* ============================================================
   MODAL "TENEMOS ESTE MISMO DISEÑO" (carrito)
   ============================================================ */

body.mvd-modal-open { overflow: hidden; }
.mvd-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.mvd-modal[hidden] { display: none; }
.mvd-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .5);
}
.mvd-modal__dialog {
	position: relative;
	z-index: 1;
	background: #fff;
	border-radius: 18px;
	max-width: 460px;
	width: 100%;
	padding: 26px;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .3);
	animation: mvd-modal-in .25s ease;
}
@keyframes mvd-modal-in {
	from { opacity: 0; transform: translateY(16px) scale(.98); }
	to   { opacity: 1; transform: none; }
}
.mvd-modal__x {
	position: absolute;
	top: 10px;
	right: 14px;
	border: 0;
	background: transparent;
	font-size: 26px;
	line-height: 1;
	color: var(--mvd-ink-soft);
	cursor: pointer;
}
.mvd-modal__x:hover { color: var(--mvd-ink); }
.mvd-modal__eyebrow {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--mvd-accent);
	margin: 0 0 4px;
}
.mvd-modal__title {
	font-size: 20px;
	font-weight: 800;
	margin: 0 0 14px;
	color: var(--mvd-ink);
	line-height: 1.2;
}
.mvd-companion--modal { animation: none; margin: 0; }
.mvd-modal__no {
	display: block;
	margin: 14px auto 0;
	border: 0;
	background: transparent;
	color: var(--mvd-ink-soft);
	font-size: 13px;
	text-decoration: underline;
	cursor: pointer;
}
.mvd-modal__no:hover { color: var(--mvd-ink); }

/* ============================================================
   TILES DE CATEGORÍA (pegar en una página) — estilo BLITZ
   Uso: <div class="vd-cats"> con dos <a class="vd-cat"> ...
   ============================================================ */

.vd-cats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px;
}
.vd-cat {
	position: relative;
	display: block;
	height: 360px;
	border-radius: var(--mvd-radius);
	overflow: hidden;
	text-decoration: none;
}
.vd-cat__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform .6s ease;
}
.vd-cat::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient( 180deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .4) 100% );
	z-index: 1;
}
.vd-cat:hover .vd-cat__bg { transform: scale(1.06); }
.vd-cat__inner {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 18px;
	padding: 20px;
	text-align: center;
}
.vd-cat__title {
	color: #fff;
	font-size: 28px;
	font-weight: 800;
	letter-spacing: .02em;
	text-transform: uppercase;
	line-height: 1.15;
	text-shadow: 0 2px 14px rgba(0, 0, 0, .35);
}
.vd-cat__btn {
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	border: 2px solid rgba(255, 255, 255, .9);
	padding: 11px 28px;
	border-radius: 999px;
	transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.vd-cat:hover .vd-cat__btn {
	background: var(--mvd-accent);
	border-color: var(--mvd-accent);
	color: #fff;
}
@media (max-width: 700px) {
	.vd-cats { grid-template-columns: 1fr; gap: 14px; }
	.vd-cat { height: 240px; }
	.vd-cat__title { font-size: 22px; }
}

/* ============================================================
   DESCRIPCIÓN DEL PRODUCTO (ficha) — venta directa
   ============================================================ */

.mvd-descripcion {
	max-width: 1280px;
	margin: 5rem auto 0;
	padding: 0 20px;
}
.mvd-descripcion__wrap {
	border-top: 1px solid var(--mvd-line);
	padding-top: 2.5rem;
}
.mvd-descripcion__title {
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -0.01em;
	margin: 0 0 0.9rem;
	color: var(--mvd-ink);
}
.mvd-descripcion__body {
	max-width: 820px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--mvd-ink-soft);
}
.mvd-descripcion__body p { margin: 0 0 1rem; }
.mvd-descripcion__body p:last-child { margin-bottom: 0; }
.mvd-descripcion__body strong { color: var(--mvd-ink); }
.mvd-descripcion__body a { color: var(--mvd-accent); }
/* Imágenes pegadas en la descripción (HTML directo): ocupan el ancho de lectura */
.mvd-descripcion__body img { max-width: 100%; height: auto; border-radius: var(--mvd-radius); }

/* Fila de imágenes en la descripción: horizontal en escritorio, columna en móvil.
   Se usa con <div class="mvd-desc-row">...imágenes...</div> */
.mvd-desc-row {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin: 0 0 12px;
}
.mvd-desc-row:last-child { margin-bottom: 0; }
.mvd-desc-row img {
	flex: 1 1 0;
	min-width: 0;
	width: 100%;
	height: auto;
	border-radius: 12px;
	display: block;
	margin: 0;
}
@media (max-width: 600px) {
	.mvd-desc-row { flex-direction: column; }
}

/* ============================================================
   CARRUSEL DE PRODUCTOS (ficha) — venta directa
   ============================================================ */

.mvd-carousel-sec {
	max-width: 1280px;
	margin: 3.5rem auto 0;
	padding: 2.5rem 1rem 0;
	border-top: 1px solid var(--mvd-line);
	font-family: var(--mvd-font);
}

.mvd-carousel-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 1.6rem;
}

.mvd-carousel-head h2 {
	margin: 0;
	font-size: clamp(20px, 2.6vw, 28px);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	color: var(--mvd-ink);
}

.mvd-carousel-nav { display: flex; gap: 10px; }
.mvd-carousel-nav button {
	width: 44px; height: 44px; border-radius: 50%;
	border: 1px solid var(--mvd-line); background: #fff; color: var(--mvd-ink);
	font-size: 20px; line-height: 1; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.mvd-carousel-nav button:hover { background: var(--mvd-ink); color: #fff; border-color: var(--mvd-ink); }

.mvd-carousel { overflow: hidden; }
.mvd-carousel__track { display: flex; transition: transform .5s ease; will-change: transform; }
.mvd-carousel__slide { flex: 0 0 25%; max-width: 25%; padding: 0 11px; box-sizing: border-box; }

@media (max-width: 900px) { .mvd-carousel__slide { flex-basis: 50%; max-width: 50%; } }
@media (max-width: 560px) { .mvd-carousel__slide { flex-basis: 100%; max-width: 100%; } }

/* ============================================================
   ARCHIVOS (tienda / categorías / marca) — estilo BLITZ
   Solo se aplica vía body.mvd-archive (archivos de venta directa).
   ============================================================ */

/* Ancho completo, centrado y sin barra lateral (solo venta directa) */
body.mvd-archive #secondary,
body.mvd-archive .widget-area { display: none !important; }

body.mvd-archive #primary,
body.mvd-archive .content-area,
body.mvd-archive #main,
body.mvd-archive .site-main {
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

body.mvd-archive .col-full {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
}

body.mvd-archive ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 22px;
	margin: 2rem 0 3rem;
	padding: 0;
	list-style: none;
}
body.mvd-archive ul.products::before,
body.mvd-archive ul.products::after { content: none !important; display: none !important; }

body.mvd-archive ul.products li.product {
	position: relative;
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	background: var(--mvd-card);
	border-radius: var(--mvd-radius);
	padding: 10px;
	display: flex;
	flex-direction: column;
	transition: transform .18s ease, box-shadow .18s ease;
}
body.mvd-archive ul.products li.product:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(17, 17, 20, .08);
}

body.mvd-archive li.product img {
	width: 100% !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: var(--mvd-tile);
	border-radius: var(--mvd-radius-sm);
	margin: 0 0 12px !important;
}

body.mvd-archive li.product .woocommerce-loop-product__title {
	font-size: 15px;
	font-weight: 700;
	color: var(--mvd-ink);
	padding: 0 6px;
	margin: 0 0 4px;
	min-height: 2.6em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .15s ease;
}
body.mvd-archive li.product:hover .woocommerce-loop-product__title { color: var(--mvd-accent); }

body.mvd-archive li.product .description { display: none; }

body.mvd-archive li.product .price {
	display: block;
	padding: 0 6px;
	margin: 4px 0 0;
	font-size: 16px;
	font-weight: 800;
	color: var(--mvd-ink);
}
body.mvd-archive li.product .price del { color: var(--mvd-ink-soft); font-weight: 500; margin-right: 6px; }
body.mvd-archive li.product .price ins { text-decoration: none; }

body.mvd-archive li.product .onsale {
	position: absolute;
	top: 16px; right: 16px; left: auto;
	margin: 0;
	background: var(--mvd-ink);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 5px 9px;
	border-radius: 999px;
	min-height: 0;
	line-height: 1.4;
}

body.mvd-archive li.product .botonseccion,
body.mvd-archive li.product .button,
body.mvd-archive li.product a.add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 12px 6px 6px;
	margin-top: auto;
	padding: 11px 16px;
	border-radius: 999px;
	background: var(--mvd-accent);
	color: #fff;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
}
body.mvd-archive li.product .botonseccion:hover,
body.mvd-archive li.product .button:hover,
body.mvd-archive li.product a.add_to_cart_button:hover { background: var(--mvd-ink); color: #fff; }

@media (max-width: 900px) { body.mvd-archive ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { body.mvd-archive ul.products { grid-template-columns: 1fr; } }

/* ============================================================
   VARIACIONES NO DISPONIBLES (swatches) — diseño limpio
   Reemplaza la X roja del plugin por un estado gris con
   texto tachado. Solo en venta directa (body.mvd-single).
   ============================================================ */

/* Swatch deshabilitado: gris suave, sin la imagen/opacidad tan baja */
body.mvd-single .rtwpvs-attribute-behavior-blur .rtwpvs-term:not(.rtwpvs-radio-term).disabled,
body.mvd-single .rtwpvs-attribute-behavior-cross .rtwpvs-term:not(.rtwpvs-radio-term).disabled {
	background: #f6f7f8 !important;
	border-color: var(--mvd-line) !important;
	cursor: not-allowed;
}

/* Texto del swatch: tenue y tachado (en vez de la X) */
body.mvd-single .rtwpvs-attribute-behavior-blur .rtwpvs-term:not(.rtwpvs-radio-term).disabled span,
body.mvd-single .rtwpvs-attribute-behavior-cross .rtwpvs-term:not(.rtwpvs-radio-term).disabled span {
	opacity: 1 !important;
	color: var(--mvd-ink-soft) !important;
	text-decoration: line-through !important;
	text-decoration-color: rgba(17, 17, 20, .35) !important;
}

/* Quitar la X roja (líneas ::before / ::after) */
body.mvd-single .rtwpvs-attribute-behavior-blur .rtwpvs-term:not(.rtwpvs-radio-term).disabled::before,
body.mvd-single .rtwpvs-attribute-behavior-blur .rtwpvs-term:not(.rtwpvs-radio-term).disabled::after,
body.mvd-single .rtwpvs-attribute-behavior-blur .rtwpvs-term:not(.rtwpvs-radio-term).disabled:hover::before,
body.mvd-single .rtwpvs-attribute-behavior-blur .rtwpvs-term:not(.rtwpvs-radio-term).disabled:hover::after,
body.mvd-single .rtwpvs-attribute-behavior-cross .rtwpvs-term:not(.rtwpvs-radio-term).disabled::before,
body.mvd-single .rtwpvs-attribute-behavior-cross .rtwpvs-term:not(.rtwpvs-radio-term).disabled::after {
	display: none !important;
}
