/* Módulo «ficha» del front: se carga solo si la página trae sus clases (App\Core\View\CssFront::MODULOS). */
.resenas { margin: 3rem 0; padding-top: 2.25rem; border-top: 1px solid var(--color-borde); scroll-margin-top: 7.5rem; }
.resenas__cabecera { margin-bottom: 2rem; }
.resenas__grid { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: clamp(2rem, 4vw, 4rem); align-items: start; }
.resenas__estadisticas, .resenas__contenido { min-width: 0; }
.resenas__balance { display: flex; align-items: center; gap: .85rem; margin-bottom: 1rem; }
.resenas__promedio { color: var(--color-texto); font-size: clamp(3.1rem, 5vw, 4rem); font-weight: 700; letter-spacing: -.055em; line-height: 1; }
.resenas__balance-detalle { display: grid; gap: .15rem; color: var(--color-texto-suave); font-size: .83rem; line-height: 1.3; }
.resenas__distribucion { display: grid; gap: .4rem; }
.resenas__fila { display: grid; grid-template-columns: 1rem 1rem minmax(0, 1fr) 1.35rem; align-items: center; gap: .35rem; color: var(--color-texto); font-size: .85rem; line-height: 1.1; }
.resenas__fila-numero { font-weight: 700; }
.resenas__fila-estrella { color: var(--color-valoracion, #0b69f6); font-size: 1rem; }
.resenas__fila-total { color: var(--color-texto-suave); text-align: right; }
.resenas__barra { height: .45rem; overflow: hidden; border-radius: 999px; background: var(--color-borde); }
.resenas__sin-resumen { margin: .2rem 0 .7rem; color: var(--color-texto-suave); }
.resenas-ficha:hover { color: var(--color-primario); }
.resenas-ficha:focus-visible { outline: 2px solid var(--campo-foco-color, var(--color-primario)); outline-offset: 3px; }
.resenas__toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .85rem; margin-bottom: 1.5rem; }
.resenas__orden { position: relative; order: 1; }
.resenas__flecha { width: .45rem; height: .45rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.resenas__orden[open] .resenas__flecha { transform: rotate(225deg) translateY(-2px); }
.resenas__orden-opciones { position: absolute; z-index: 5; top: calc(100% + .35rem); left: 0; min-width: 100%; width: max-content; max-width: min(85vw, 240px); padding: .35rem; border: var(--campo-borde-px, 1px) solid var(--campo-borde, #dddddd); border-radius: calc(var(--campo-radio, 8px) + 3px); background: var(--campo-fondo, var(--color-fondo)); box-shadow: 0 14px 32px color-mix(in srgb, var(--color-texto) 16%, transparent); }
.resenas__orden-opciones a[aria-current="true"]::after { content: '✓'; color: var(--color-primario); }
.resenas__formulario summary.resenas__abrir:hover { background: var(--color-primario); color: var(--resenas-boton-texto, var(--color-fondo)); }
.resenas__formulario .vc-select__trigger { font-weight: 400; }
.resenas__formulario form > p { margin: 0; color: var(--color-texto-suave); font-size: .85rem; }
.resenas__formulario form > button { justify-self: start; }
.resenas__campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.resenas__lista { display: grid; gap: 1rem; }
.resenas__opinion { padding: 1.35rem 1.45rem; border: 1px solid var(--color-borde); border-radius: var(--radio); background: var(--resenas-tarjeta-fondo, var(--color-fondo)); color: var(--resenas-tarjeta-texto, var(--color-texto)); }
.resenas__opinion-cabecera { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.resenas__opinion-cabecera .resenas-estrellas { font-size: 18px; }
.resenas__nota-demo { margin: 0 0 1rem; color: var(--color-texto-suave); font-size: .82rem; }
.resenas__demo { display: inline-block; margin-top: .85rem; padding: .18rem .5rem; border: 1px solid var(--color-borde); border-radius: 999px; color: var(--color-texto-suave); font-size: .72rem; font-weight: 700; }
.resenas__vacio { margin: 0; color: var(--color-texto-suave); }
.resenas__mensaje { margin: 0 0 1.5rem; padding: 1rem; border-radius: var(--radio); background: var(--color-fondo-suave); }
.resenas__trampa { position: absolute; left: -9999px; }
@media (max-width: 800px) {
.resenas__grid { grid-template-columns: 1fr; gap: 1.75rem; }
.resenas__estadisticas { max-width: 380px; }
}
@media (max-width: 600px) {
.resenas__cabecera { margin-bottom: 1.5rem; }
.resenas__campos { grid-template-columns: 1fr; }
.resenas__opinion { padding: 1rem; }
}
@media (max-width: 420px) {
.resenas__toolbar { display: grid; grid-template-columns: 1fr; }
.resenas__orden-opciones { position: static; width: 100%; max-width: none; margin-top: .35rem; box-shadow: none; }
}
/* El botón "Escribir una reseña" queda fijo arriba a la derecha: antes, al abrir el formulario, el <details>
   pasaba a ocupar toda la fila (flex-basis:100%) y el botón saltaba debajo del selector de orden. Ahora el
   <details> siempre ocupa su propia fila y solo el botón se ancla en la fila de arriba. */
@media (min-width: 421px) {
.resenas__toolbar { position: relative; min-height: var(--boton-altura, 40px); }
.resenas__orden ~ .resenas__formulario[open] { margin-top: 0; }
.resenas__formulario summary.resenas__abrir { position: absolute; top: 0; right: 0; margin: 0; }
}
/* ==========================================================================
   Producto
   ========================================================================== */
/* La ficha solo añade padding inferior; el breadcrumb aporta el espacio superior. */
.producto-detalle { padding: 0 0 3rem; }
.producto-detalle__grid {
	display: grid;
	grid-template-columns: var(--producto-galeria-cols, 1fr 1fr);
	gap: 2.5rem;
}
.producto-galeria { position: relative; min-width: 0; }
.producto-galeria__principal-envoltura { position: relative; }
.producto-galeria__principal,
.producto-galeria__sin-imagen {
	border-radius: var(--radio);
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	height: auto;
	display: block;
	background: var(--producto-galeria-fondo, var(--color-fondo-suave));
}
.producto-galeria__miniaturas-wrap { display: grid; grid-template-columns: 34px minmax(0, 1fr) 34px; align-items: center; gap: .35rem; margin-top: .75rem; }
.producto-galeria__miniaturas-wrap--sin-desborde { grid-template-columns: minmax(0, 1fr); }
.producto-galeria__miniaturas-flecha { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--color-borde); border-radius: 50%; background: var(--color-fondo); color: var(--color-texto); cursor: pointer; }
.producto-galeria__miniaturas-flecha:hover { border-color: var(--color-primario); color: var(--color-primario); }
.producto-galeria__miniaturas-flecha:focus-visible { outline: 2px solid var(--campo-foco-color, var(--color-primario)); outline-offset: 2px; }
.producto-galeria__miniaturas-flecha[hidden] { display: none; }
.producto-galeria__miniaturas {
	display: flex;
	gap: 0.5rem;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
}
.producto-galeria__miniaturas img:hover { opacity: 1; }
.producto-galeria__miniaturas img.activa { opacity: 1; border-color: var(--color-primario); }
/* Layout «grilla» de la ficha: fotos grandes en grilla, información fija al lado. Bajo 1025px las fotos se deslizan (scroll-snap, sin JS). */
.producto-galeria__grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.producto-galeria__grilla picture:only-child { grid-column: 1 / -1; }
/* «Foto completa» (Catálogo → Configuración → Listados): la galería de la ficha tampoco recorta; una foto muy alta o ancha queda entera dentro del cuadrado. */
body[data-miniatura-ajuste="completa"] .producto-galeria__principal,
body[data-miniatura-ajuste="completa"] .producto-galeria__grilla img,
body[data-miniatura-ajuste="completa"] .producto-galeria__miniaturas img { object-fit: contain; }
@media (min-width: 1025px) {
.producto-detalle--grilla .producto-detalle__grid { align-items: start; }
.producto-detalle--grilla .producto-info { position: sticky; top: 6rem; }
}
@media (max-width: 1024px) {
.producto-galeria__grilla { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: .5rem; }
.producto-galeria__grilla picture { flex: 0 0 85%; scroll-snap-align: start; }
}
/* Layout «secundario» de la ficha (Bloques HTML → Layout producto): miniaturas en columna junto a la foto, galería que acompaña el scroll y compra en tarjeta.
   Solo desde 1025px; debajo se apila igual que el principal. */
@media (min-width: 1025px) {
.producto-detalle--secundario .producto-detalle__grid { align-items: start; }
.producto-detalle--secundario .producto-galeria__miniaturas-flecha { display: none; }
.producto-detalle--secundario .producto-galeria__miniaturas { position: absolute; inset: 0; flex-direction: column; overflow-x: hidden; overflow-y: auto; }
.producto-detalle--secundario .producto-galeria:has(.producto-galeria__miniaturas-wrap) .etiquetas-wrap { left: calc(76px + .75rem + 10px); }
.producto-detalle--secundario .producto-galeria { position: sticky; top: 6rem; }
/* la columna más alta es la de información: la galería es la que acompaña */
.producto-detalle--secundario .producto-compra-panel {
		padding: 1.25rem;
		border: 1px solid var(--color-borde);
		border-radius: var(--radio);
		background: var(--color-fondo-suave);
	}
}
.producto-marca {
	display: inline-block;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--color-texto-suave);
	text-decoration: underline;
	margin-bottom: 0.3rem;
}
.producto-marca:hover { color: var(--color-primario); }
/* Con logo (foto alargada, cargada desde Marcas): reemplaza el nombre en
   texto por la imagen — mismo criterio "contain" que la tarjeta de marca. */
/* El enlace reserva los 44 px del logo desde el primer cuadro: sin alto en la imagen, mide 0 hasta que carga y luego empuja precio,
   botones y todo lo de abajo (el «rebote» de la ficha con fotos lentas). La imagen en bloque evita además el hueco de la línea base. */
.producto-marca--logo { text-decoration: none; display: flex; align-items: center; min-height: 44px; }
.producto-marca__imagen { display: block; max-height: 44px; max-width: 160px; width: auto; object-fit: contain; }
.producto-precio--oferta { color: var(--color-precio-oferta, var(--color-primario-oscuro)); }
/* Entrega estimada: botón informativo y diálogo antes de las acciones de compra. */
.entrega-estimada-trigger {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1.1rem;
	padding: 0.6em 1.1em;
	background: none;
	border: 1px solid var(--color-borde);
	color: var(--color-texto);
	font-size: 0.85rem;
	font-weight: 600;
	border-radius: var(--radio);
	cursor: pointer;
	transition: background var(--transicion), border-color var(--transicion);
}
.entrega-estimada-trigger:hover { background: var(--color-fondo-suave); border-color: var(--color-primario); }
.entrega-estimada-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: color-mix(in srgb, var(--color-velo) var(--velo-opacidad, 55%), transparent);
	z-index: 1000;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.entrega-estimada-overlay.is-open { display: flex; }
.entrega-estimada-modal {
	position: relative;
	background: var(--color-fondo);
	color: var(--color-texto);
	border-radius: var(--radio);
	padding: 1.6rem 1.6rem 1.4rem;
	width: 100%;
	max-width: 30rem;
	max-height: 88vh;
	overflow-y: auto;
}
.entrega-estimada-modal__cerrar {
	position: absolute;
	top: 0.6rem;
	right: 0.9rem;
	background: none;
	border: none;
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	color: var(--color-texto-suave);
}
.entrega-estimada-modal__titulo { margin: 0 0 1rem; font-size: 1.05rem; font-weight: 600; }
.entrega-estimada-modal__label { display: block; font-size: 0.82rem; font-weight: 600; margin: 0 0 0.4rem; }
.entrega-estimada-modal__select {
	width: 100%;
	padding: 0.55em 0.6em;
	margin-bottom: 0.9rem;
	border: var(--campo-borde-px, 1px) solid var(--campo-borde, #dddddd);
	border-radius: var(--campo-radio, 6px);
	font-size: 0.85rem;
	background-color: var(--campo-fondo, var(--color-fondo));
	color: var(--color-texto);
}
.entrega-estimada-modal__select:disabled { background-color: var(--color-fondo-suave); color: var(--color-texto-suave); }
.entrega-estimada-modal__calcular {
	width: 100%;
	padding: 0.7em;
	background: var(--color-boton-fondo);
	color: var(--color-boton-texto);
	border: none;
	border-radius: var(--boton-radio, var(--radio));
	font-weight: 700;
	font-size: 0.85rem;
	cursor: pointer;
	transition: background var(--transicion);
}
.entrega-estimada-modal__calcular:hover { background: var(--color-boton-hover-fondo, var(--color-primario-oscuro)); }
.entrega-estimada-modal__calcular:disabled { opacity: 0.6; cursor: default; }
.entrega-estimada-modal__resultado { margin-top: 1rem; }
.entrega-estimada-modal__leyenda { margin: 0.75rem 0 0; font-size: 0.72rem; color: var(--color-texto-suave); }
.entrega-estimada-modal__error {
	margin-top: 0.9rem;
	padding: 0.75rem;
	background: var(--color-error-fondo, #fdecea);
	color: var(--color-error, #7a2a20);
	border-radius: var(--radio);
	font-size: 0.82rem;
}
.entrega-opcion { padding: 0.75rem 0.9rem; background: var(--color-fondo-suave); border-radius: var(--radio); margin-bottom: 0.6rem; }
.entrega-opcion__cabecera { display: flex; align-items: baseline; justify-content: space-between; gap: 0.6rem; }
.entrega-opcion__nombre { font-size: 0.85rem; font-weight: 700; }
.entrega-opcion__precio { font-size: 0.85rem; font-weight: 700; white-space: nowrap; }
.entrega-opcion__fecha { margin-top: 0.35rem; font-size: 0.8rem; color: var(--color-texto-suave); line-height: 1.4; }
/* Tarjeta "¿Necesitas ayuda?" (WhatsApp) — pregunta + botón relleno, verde
   configurable junto al widget flotante desde el Theme editor. */
.producto-whatsapp-card {
	margin-top: 1.25rem;
	padding: 1rem 1.25rem 0 0;
	border-radius: var(--radio);
	text-align: left;
}
.producto-sku { color: var(--color-texto-suave); font-size: 0.82rem; margin-top: 0.75rem; }
/* Marca (logo o texto) reubicada bajo el SKU — bloque simétrico junto al
   resto de la meta-info, en vez de arriba pegada al título. */
.producto-marca-abajo { margin-top: 1.25rem; display: flex; justify-content: flex-start; }
.producto-stock {
	display: inline-block;
	font-size: var(--producto-stock-tamano, 0.85rem);
	font-weight: var(--producto-stock-peso, 600);
	padding: 0.3em 1.1em 0.4em 0.9em;
	border-radius: 999px;
	margin-bottom: 1rem;
}
.producto-stock--en-stock { background: var(--color-exito-fondo, #e4f3e9); color: var(--color-exito, #1f5c37); }
.producto-stock--agotado { background: var(--color-error-fondo, #fbe7e4); color: var(--color-error, #8a2c1f); }
.producto-stock__pulso { display: inline-block; width: 8px; height: 8px; margin-right: .65em; border-radius: 50%; background: currentColor; vertical-align: .05em; animation: stock-pulso 2.4s ease-in-out infinite; }
@keyframes stock-pulso { 0%, 100% { opacity: 1; } 50% { opacity: .28; } }
@media (prefers-reduced-motion: reduce) {
.producto-stock__pulso { animation: none; }
}
.producto-descripcion { color: var(--producto-descripcion-color, var(--color-texto-suave)); margin-bottom: 1.5rem; }
.producto-agregar {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
}
.producto-agregar .selector-cantidad { flex-shrink: 0; }
.producto-agregar__botones { display: flex; gap: 0.6rem; flex-wrap: nowrap; flex: 1; min-width: 240px; }
.producto-agregar__botones--doble { min-width: min(100%, 300px); }
.producto-agregar__boton:disabled { opacity: 0.5; cursor: not-allowed; }
/* Combinaciones: radios nativos y presentación tipo ficha; el servidor
   valida la combinación y el stock incluso con JavaScript desactivado. */
.producto-variantes { flex-basis: 100%; display: grid; gap: 1rem; margin: .35rem 0 .55rem; }
.producto-variantes__grupo { border: 0; background: transparent; padding: 0; margin: 0; min-width: 0; }
.producto-variantes__opciones { display: flex; gap: .5rem; flex-wrap: wrap; }
.producto-variantes__opcion { position: relative; cursor: pointer; }
.producto-variantes__swatch { display: inline-block; width: 1.25rem; height: 1.25rem; flex: 0 0 1.25rem; border-radius: 50%; background: var(--swatch); border: 1px solid color-mix(in srgb, var(--color-muestra-borde) 12%, transparent); }
.producto-variantes__ayuda { margin: -.35rem 0 0; font-size: .75rem; color: var(--color-texto-suave); }
.producto-variantes__error { color: var(--color-error, #8a2c1f); font-weight: 600; }
.producto-descripcion-larga { width: 100%; margin-top: 3rem; }
.producto-descripcion-larga__cuerpo { color: var(--producto-descripcion-color, var(--color-texto-suave)); }
.producto-tabs { margin-top: 2.5rem; }
.producto-tabs__items { border-top: 1px solid var(--color-borde); }
.producto-tabs__item { border-bottom: 1px solid var(--color-borde); }
.producto-tabs__item summary::-webkit-details-marker { display: none; }
.producto-tabs__item summary::after { content: '+'; position: absolute; right: .25rem; top: .75rem; color: var(--color-primario); font-size: 1.4rem; font-weight: 400; }
.producto-tabs__item[open] summary::after { content: '−'; }
.producto-tabs__contenido { max-width: none; padding: 0 0 1rem; color: var(--producto-pestana-texto-color, var(--color-texto-suave)); line-height: 1.7; }
/* En la ficha de producto va al lado del botón "Añadir al carrito" en la
   misma fila — mismo alto que ese botón, para que no se vea desnivelado. */
.producto-agregar .selector-cantidad__btn { width: 2.75rem; font-size: 1.15rem; }
.producto-agregar .selector-cantidad { height: var(--producto-compra-altura, 48px); box-sizing: border-box; }
.ficha-tecnica { margin-top: 3rem; }
/* Tabla de datos como tarjeta: etiqueta a la izquierda (legible, no atenuada) y valor a la derecha; filas alternadas para seguir la línea. */
.ficha-tecnica table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--color-borde); border-radius: var(--radio, 12px); }
.ficha-tecnica tr:nth-child(even) :is(th, td) { background: color-mix(in srgb, var(--color-fondo-suave) 55%, transparent); }
@media (max-width: 560px) {
.ficha-tecnica th { width: 40%; }
}
/* Galería de la ficha: las flechas van dentro de la foto, a la misma distancia de cada borde (fuera quedaban cortadas y asimétricas). */
.producto-galeria__principal-envoltura .flecha-slider--prev { left: .75rem; }
.producto-galeria__principal-envoltura .flecha-slider--next { right: .75rem; }
.producto-galeria__principal-envoltura .flecha-slider { border: 0; background: color-mix(in srgb, var(--color-fondo) 88%, transparent); box-shadow: 0 2px 10px color-mix(in srgb, var(--color-sombra, #000) 28%, transparent); backdrop-filter: blur(4px); }
.producto-galeria__principal-envoltura .flecha-slider:hover { background: var(--color-fondo); }
/* Centrado exacto: sin el padding por defecto del botón y con el chevron corrido 1px hacia su punta (el trazo en «V» pesa hacia la cola y se ve descentrado). */
.producto-galeria__principal-envoltura .flecha-slider, .producto-galeria__miniaturas-flecha { padding: 0; }
/* La ficha se apila hasta 1024px para reservar espacio a sus acciones de compra. */
@media (max-width: 1024px) {
.producto-detalle__grid { grid-template-columns: 1fr; }
}
/* Compartir producto: iconos monocromos y colores hover configurables desde ThemeCss. */
.compartir-producto {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 1rem 0;
	position: relative;
}
.compartir-producto__titulo {
	font-size: 0.85rem;
	font-weight: 600;
	margin-right: 0.25rem;
	color: var(--color-texto-suave);
}
.compartir-producto__boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--color-fondo-suave);
	color: var(--color-texto);
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}
.compartir-producto__boton--facebook:hover { background: var(--color-facebook, #1877f2); color: var(--color-redes-texto, #ffffff); }
.compartir-producto__boton--whatsapp:hover { background: var(--color-whatsapp, #25d366); color: var(--color-redes-texto, #ffffff); }
.compartir-producto__boton--pinterest:hover { background: var(--color-pinterest, #e60023); color: var(--color-redes-texto, #ffffff); }
.compartir-producto__boton--linkedin:hover { background: var(--color-linkedin, #0a66c2); color: var(--color-redes-texto, #ffffff); }
.compartir-producto__boton--copiar:hover,
.compartir-producto__boton--email:hover { background: var(--color-primario); color: var(--color-boton-texto); }
.compartir-producto__feedback {
	font-size: 0.78rem;
	color: var(--color-exito, #2a9d3f);
}
.compartir-producto__feedback[hidden] { display: none; }
/* Aviso de reposición, formulario sin JavaScript. */
.aviso-stock-form { margin: 16px 0 20px; padding: 16px; border: 1px solid var(--campo-borde, #ddd); border-radius: var(--panel-radio, 12px); background: var(--color-fondo, #fff); scroll-margin-top: 9rem; }
.aviso-stock-form__campos { display: flex; align-items: stretch; gap: 8px; }
.aviso-stock-form__trampa { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.aviso-stock-form__mensaje { margin: 12px 0 0; padding: .7rem .85rem; border-radius: var(--campo-radio, 8px); background: var(--color-exito-fondo, #e4f3e9); color: var(--color-exito, #1f5c37); font-size: .9rem; }
.aviso-stock-form__mensaje[data-estado="error"] { background: var(--color-error-fondo, #fbe7e4); color: var(--color-error, #8a2c1f); }
.aviso-stock-cancelar { max-width: 720px; padding-block: 48px; }
@media (max-width: 440px) {
.aviso-stock-form__campos { flex-direction: column; }
}
/* Ficha de producto: los envoltorios de descripción y especificaciones son invisibles en todos los layouts (`display: contents`); solo «Paneles» los usa. */
.producto-paneles, .producto-paneles__col { display: contents; }
/* Layout «Paneles»: tarjeta con foto e información centrada y, debajo, descripción y especificaciones lado a lado con cabecera de color. */
.producto-detalle--paneles { --panel-pad: clamp(1.25rem, 3vw, 2.25rem); --panel-sombra: 0 8px 30px color-mix(in srgb, var(--color-sombra) 10%, transparent); }
.producto-detalle--paneles .producto-detalle__grid { align-items: center; padding: var(--panel-pad); border-radius: var(--radio, 14px); background: var(--color-fondo); box-shadow: var(--panel-sombra); }
.producto-detalle--paneles .producto-info { display: flex; flex-direction: column; align-items: center; text-align: center; }
.producto-detalle--paneles .producto-info h1 { margin: 0 0 .75rem; font-size: clamp(1.45rem, 2.2vw, 2rem); line-height: 1.2; text-transform: uppercase; }
/* Todo centrado y en el orden del diseño: marca, SKU, título, precio y botones. */
.producto-detalle--paneles .producto-marca-abajo { order: -2; display: flex; justify-content: center; margin: 0 0 .15rem; font-size: .9rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.producto-detalle--paneles .producto-sku { order: -1; margin: 0 0 .75rem; color: var(--color-texto-suave); }
.producto-detalle--paneles .producto-compra-panel { display: flex; flex-direction: column; align-items: center; width: 100%; }
.producto-detalle--paneles .producto-precio { justify-content: center; }
.producto-detalle--paneles .producto-agregar, .producto-detalle--paneles .producto-agregar__botones { justify-content: center; }
.producto-detalle--paneles .producto-agregar { align-items: center; }
/* La descripción corta solo acompaña al precio cuando no hay panel de descripción (el panel ya trae el texto completo y repetirlo desordena la columna). */
.producto-detalle--paneles:has(.producto-paneles__col--descripcion section) .producto-compra-panel > .producto-descripcion { display: none; }
/* Cotizar (extensión): un botón con sus avisos, sin la caja gris, como el diseño. */
.producto-detalle--paneles .producto-compra-panel > .cotizar-producto { align-self: stretch; width: 100%; max-width: 24rem; margin-inline: auto; padding: 0; border: 0; background: none; }
.producto-detalle--paneles .cotizar-producto__confianza { justify-content: center; }
/* Línea vertical entre la galería y la información, como en el diseño. */
@media (min-width: 1025px) {
.producto-detalle--paneles .producto-info { align-self: stretch; justify-content: center; padding-left: var(--panel-pad); border-left: 1px solid var(--color-borde); }
}
.producto-detalle--paneles .producto-paneles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: clamp(1.5rem, 3vw, 2.5rem); overflow: hidden; border-radius: var(--radio, 14px); background: var(--color-fondo); box-shadow: var(--panel-sombra); }
.producto-detalle--paneles .producto-paneles__col { display: block; min-width: 0; }
.producto-detalle--paneles .producto-paneles__col:only-child { grid-column: 1 / -1; }
.producto-detalle--paneles .producto-paneles__col:not(:has(section, .producto-tabs)) { display: none; }
.producto-detalle--paneles .producto-paneles:not(:has(.producto-paneles__col:has(section, .producto-tabs))) { display: none; }
.producto-detalle--paneles .producto-paneles__col + .producto-paneles__col { border-left: 1px solid var(--color-borde); }
.producto-detalle--paneles .producto-paneles__col > section { margin: 0; padding: 0 var(--panel-pad) calc(var(--panel-pad) * .8); }
.producto-detalle--paneles .producto-paneles__col > section > h2 { margin: 0 calc(var(--panel-pad) * -1) 1.5rem; padding: .95rem 1rem; background: var(--producto-panel1-fondo); color: var(--producto-panel1-texto); font-size: clamp(1.05rem, 1.8vw, 1.35rem); letter-spacing: .01em; text-align: center; text-transform: uppercase; }
.producto-detalle--paneles .producto-paneles__col--especificaciones > section > h2 { background: var(--producto-panel2-fondo); color: var(--producto-panel2-texto); }
.producto-detalle--paneles .producto-paneles__col > section:not(:first-child) > h2 { margin: 1.25rem 0 1rem; padding: 0; background: none; color: var(--color-texto); font-size: 1.15rem; text-align: left; text-transform: none; }
@media (max-width: 900px) {
.producto-detalle--paneles .producto-paneles { grid-template-columns: minmax(0, 1fr); }
.producto-detalle--paneles .producto-paneles__col + .producto-paneles__col { border-left: 0; border-top: 1px solid var(--color-borde); }
}