/*
Theme Name: CompraTuLicencia
Description: Tema hijo de Kadence para CompraTuLicencia.com. Dirección holográfica: vidrio, iridiscencia y el neón del logo sobre azul noche.
Template: kadence
Version: 0.2.0
Text Domain: compratulicencia
*/

/* =====================================================================
   Tokens
   Contraste verificado (WCAG AA): texto #B9C3D6 sobre #070B14 = 11,4:1;
   lima sobre fondo = 12,4:1; texto oscuro sobre botón lima = 12,4:1;
   texto suave #8A96AD sobre fondo = 6,8:1.
   ===================================================================== */
:root {
	--fondo: #070B14;
	--fondo-2: #0B111C;
	--fondo-3: #111A2B;
	--borde: rgba(255, 255, 255, .09);
	--borde-fuerte: rgba(255, 255, 255, .16);
	--lima: #6BE52E;
	--lima-2: #86F04F;
	--cian: #22D3EE;
	--blanco: #FFFFFF;
	--texto: #B9C3D6;
	--texto-suave: #8A96AD;
	--iris: linear-gradient(100deg, var(--lima), var(--cian) 50%, var(--lima));
	--vidrio: linear-gradient(160deg, rgba(30, 42, 64, .55), rgba(11, 17, 28, .6));
	--radio: 22px;
	--titulos: 'Montserrat', system-ui, sans-serif;
	--cuerpo: 'DM Sans', system-ui, sans-serif;
	--mono: 'JetBrains Mono', ui-monospace, monospace;
	--global-body-font-family: var(--cuerpo);
	--global-heading-font-family: var(--titulos);
}

@property --angulo {
	syntax: '<angle>';
	inherits: false;
	initial-value: 0deg;
}

/* ---------- Base oscura ---------- */
html { background: var(--fondo); }
body, #wrapper, .site, #inner-wrap, .content-bg, body.content-style-unboxed .site { background: var(--fondo) !important; }
body { font-family: var(--cuerpo); color: var(--texto); }
h1, h2, h3, h4, h5, h6, .woocommerce-loop-product__title, .product_title { font-family: var(--titulos); color: var(--blanco); letter-spacing: -0.015em; text-wrap: balance; }
h1, h2 { font-weight: 800; }
h3, h4 { font-weight: 700; }
p { text-wrap: pretty; }
a { color: var(--lima); }
a:hover { color: var(--lima-2); }
::selection { background: var(--lima); color: var(--fondo); }
:focus-visible { outline: 2px solid var(--lima); outline-offset: 3px; }

/* ---------- Botones: lima con brillo; texto oscuro (12,4:1) ---------- */
.button, button.button, .wp-block-button__link, .wp-element-button,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.single_add_to_cart_button, .checkout-button, #place_order, .holo-boton {
	position: relative;
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	background: var(--lima) !important;
	color: var(--fondo) !important;
	border: 0 !important;
	border-radius: 999px !important;
	font-family: var(--titulos);
	font-weight: 700 !important;
	padding: .9em 1.7em !important;
	text-decoration: none;
	box-shadow: 0 0 0 1px rgba(107, 229, 46, .4), 0 10px 30px rgba(107, 229, 46, .25);
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.button:hover, button.button:hover, .wp-block-button__link:hover, .wp-element-button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover,
.single_add_to_cart_button:hover, .checkout-button:hover, #place_order:hover, .holo-boton:hover {
	background: var(--lima-2) !important;
	color: var(--fondo) !important;
	transform: translateY(-2px);
	box-shadow: 0 0 0 1px rgba(107, 229, 46, .6), 0 16px 44px rgba(107, 229, 46, .38);
}
.holo-boton-vidrio, .wp-block-button.is-style-outline .wp-block-button__link {
	background: rgba(255, 255, 255, .04) !important;
	color: var(--blanco) !important;
	box-shadow: inset 0 0 0 1px var(--borde-fuerte) !important;
	backdrop-filter: blur(8px);
}
.holo-boton-vidrio:hover, .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: rgba(255, 255, 255, .08) !important;
	color: var(--lima) !important;
	box-shadow: inset 0 0 0 1px var(--lima) !important;
}

/* ---------- Piezas holográficas reutilizables ---------- */
.holo-iris {
	background: var(--iris);
	background-size: 250% 100%;
	-webkit-background-clip: text; background-clip: text;
	color: transparent;
	animation: holo-desplazar 9s linear infinite;
}
@keyframes holo-desplazar { to { background-position: -250% 0; } }

.holo-vidrio {
	background: var(--vidrio);
	border: 1px solid var(--borde);
	border-radius: var(--radio);
	backdrop-filter: blur(14px) saturate(130%);
	-webkit-backdrop-filter: blur(14px) saturate(130%);
}

/* Borde iridiscente que gira (máscara: solo pinta el contorno de 1 px). */
.holo-borde { position: relative; isolation: isolate; }
.holo-borde::before {
	content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; z-index: -1;
	background: conic-gradient(from var(--angulo), var(--lima), var(--cian), var(--lima));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	opacity: .7;
	animation: holo-girar 6s linear infinite;
}
@keyframes holo-girar { to { --angulo: 360deg; } }

.holo-antetitulo {
	display: inline-flex; align-items: center; gap: .55rem;
	font-family: var(--mono); font-size: .78rem; font-weight: 500;
	letter-spacing: .14em; text-transform: uppercase;
	color: var(--lima);
	padding: .4rem .85rem; border-radius: 999px;
	background: rgba(107, 229, 46, .08);
	border: 1px solid rgba(107, 229, 46, .25);
	margin: 0 0 1.2rem;
}
.holo-punto { width: 8px; height: 8px; border-radius: 50%; background: var(--lima); box-shadow: 0 0 0 0 rgba(107, 229, 46, .6); animation: holo-pulso 2s infinite; }
@keyframes holo-pulso { 70% { box-shadow: 0 0 0 10px rgba(107, 229, 46, 0); } 100% { box-shadow: 0 0 0 0 rgba(107, 229, 46, 0); } }

.holo-seccion { position: relative; padding: clamp(4rem, 9vw, 7rem) 0; }
.holo-cabecera { text-align: center; max-width: 720px; margin: 0 auto clamp(2.5rem, 5vw, 3.5rem); }
.holo-cabecera h2 { font-size: clamp(2rem, 4.4vw, 3.2rem); line-height: 1.08; margin: 0 0 1rem; }
.holo-cabecera p { font-size: 1.08rem; margin: 0; }

/* ---------- Encabezado de vidrio ---------- */
#masthead { position: relative; z-index: 20; }
#masthead .site-header-row-container-inner, #mobile-header .site-header-row-container-inner {
	background: rgba(7, 11, 20, .72) !important;
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
}
#masthead::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
	background: var(--iris); background-size: 200% 100%; opacity: .45;
	animation: holo-desplazar 12s linear infinite;
}
.header-navigation .menu > li > a { font-family: var(--titulos); font-weight: 600; }
.header-navigation .sub-menu { background: rgba(11, 17, 28, .96) !important; border: 1px solid var(--borde); border-radius: 14px; overflow: hidden; backdrop-filter: blur(16px); }
.header-navigation .sub-menu a { color: var(--texto) !important; }
.header-navigation .sub-menu a:hover { color: var(--lima) !important; background: rgba(255, 255, 255, .04) !important; }
.header-cart-total { background: var(--lima) !important; color: var(--fondo) !important; }

/* =====================================================================
   Portada
   ===================================================================== */
.holo-heroe { position: relative; overflow: hidden; padding: clamp(3.5rem, 8vw, 6.5rem) 0 clamp(5rem, 10vw, 8rem); }
.holo-estrellas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.holo-aurora { position: absolute; inset: 0; pointer-events: none; }
.holo-aurora i { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .5; animation: holo-flotar-aurora 18s ease-in-out infinite alternate; }
.holo-aurora i:nth-child(1) { width: 520px; height: 520px; left: -140px; top: -180px; background: var(--lima); opacity: .22; }
.holo-aurora i:nth-child(2) { width: 560px; height: 560px; right: -160px; top: 40px; background: var(--cian); opacity: .18; animation-delay: -6s; }
.holo-aurora i:nth-child(3) { width: 420px; height: 420px; left: 38%; bottom: -220px; background: var(--lima); opacity: .12; animation-delay: -12s; }
@keyframes holo-flotar-aurora { to { transform: translate(60px, 40px) scale(1.15); } }
.holo-piso {
	position: absolute; left: -50%; right: -50%; bottom: 0; height: 46%;
	background-image:
		linear-gradient(rgba(107, 229, 46, .22) 1px, transparent 1px),
		linear-gradient(90deg, rgba(107, 229, 46, .22) 1px, transparent 1px);
	background-size: 64px 64px;
	transform: perspective(500px) rotateX(62deg);
	transform-origin: bottom center;
	-webkit-mask-image: linear-gradient(to top, #000 10%, transparent 85%);
	mask-image: linear-gradient(to top, #000 10%, transparent 85%);
	animation: holo-avanzar 3.5s linear infinite;
	pointer-events: none;
}
@keyframes holo-avanzar { to { background-position: 0 64px, 0 0; } }

.holo-heroe-rejilla { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: 3rem; align-items: center; }
.holo-heroe-rejilla > * { min-width: 0; } /* sin esto, la fila de sugerencias ensancha la columna */
.holo-heroe h1 { font-size: clamp(2.6rem, 6vw, 4.9rem); line-height: 1; margin: 0 0 1.4rem; }
.holo-bajada { font-size: clamp(1.05rem, 1.6vw, 1.2rem); max-width: 560px; margin: 0 0 2rem; }

.holo-buscador {
	display: flex; align-items: center; gap: .4rem;
	max-width: 560px; padding: .4rem .4rem .4rem 1.2rem;
	border-radius: 999px;
}
.holo-buscador > svg { flex: none; color: var(--texto-suave); }
.holo-buscador input[type="search"] {
	flex: 1; min-width: 0; background: transparent !important; border: 0 !important; box-shadow: none !important;
	color: var(--blanco); font-size: 1.02rem; padding: .7rem .4rem;
}
.holo-buscador input::placeholder { color: var(--texto-suave); }
.holo-buscador .holo-boton { padding: .75em 1.4em !important; }
.holo-sugerencias { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: 1.1rem; font-size: .9rem; color: var(--texto-suave); }
.holo-sugerencias a {
	color: var(--texto); text-decoration: none; padding: .3rem .8rem; border-radius: 999px;
	border: 1px solid var(--borde); background: rgba(255, 255, 255, .03);
}
.holo-sugerencias a:hover { color: var(--lima); border-color: rgba(107, 229, 46, .45); }

/* Escena: tarjeta de licencia holográfica */
.holo-escena { position: relative; height: 480px; perspective: 1200px; display: grid; place-items: center; }
.holo-anillo { position: absolute; left: 50%; top: 50%; border-radius: 50%; border: 1px solid rgba(107, 229, 46, .35); transform-style: preserve-3d; pointer-events: none; }
.holo-anillo.a1 { width: 520px; height: 520px; margin: -260px 0 0 -260px; transform: rotateX(74deg); animation: holo-anillo 14s linear infinite; border-style: dashed; }
.holo-anillo.a2 { width: 400px; height: 400px; margin: -200px 0 0 -200px; transform: rotateX(74deg) rotateY(18deg); border-color: rgba(34, 211, 238, .35); animation: holo-anillo 10s linear infinite reverse; }
@keyframes holo-anillo { to { transform: rotateX(74deg) rotateZ(360deg); } }

.holo-tarjeta {
	--rx: 8deg; --ry: -16deg; --mx: 50%; --my: 50%;
	position: relative; width: min(420px, 86vw); aspect-ratio: 1.586;
	border-radius: 26px; padding: 2px;
	background: conic-gradient(from var(--angulo), var(--lima), var(--cian), var(--lima));
	transform: rotateX(var(--rx)) rotateY(var(--ry));
	transform-style: preserve-3d;
	box-shadow: 0 40px 100px rgba(0, 0, 0, .6), 0 0 80px rgba(107, 229, 46, .18);
	animation: holo-girar 8s linear infinite;
	transition: transform .25s ease-out;
}
.holo-flota { animation: holo-levitar 6s ease-in-out infinite; }
@keyframes holo-levitar { 50% { transform: translateY(-14px); } }
.holo-cara {
	position: relative; height: 100%; border-radius: 24px; overflow: hidden;
	padding: 1.4rem 1.5rem; display: flex; flex-direction: column;
	background: linear-gradient(150deg, rgba(22, 31, 48, .97), rgba(7, 11, 20, .98));
}
/* Lámina holográfica: se mueve con el puntero (--mx/--my desde holo.js). */
.holo-cara::before {
	content: ''; position: absolute; inset: -40%;
	background: linear-gradient(115deg, transparent 35%, rgba(107, 229, 46, .16) 44%, rgba(34, 211, 238, .2) 50%, transparent 60%);
	transform: translate(calc((var(--mx) - 50%) * .6), calc((var(--my) - 50%) * .6));
	mix-blend-mode: screen; pointer-events: none;
}
.holo-cara::after {
	content: ''; position: absolute; inset: 0;
	background: radial-gradient(circle at var(--mx) var(--my), rgba(255, 255, 255, .16), transparent 40%);
	pointer-events: none;
}
.holo-cara-cabeza { display: flex; align-items: center; gap: .6rem; position: relative; }
.holo-cara-cabeza img { width: 40px; height: 40px; }
.holo-cara-cabeza span { font-family: var(--mono); font-size: .72rem; letter-spacing: .18em; color: var(--texto-suave); }
.holo-chip-oro {
	margin-left: auto; width: 46px; height: 34px; border-radius: 8px;
	background: linear-gradient(135deg, #F5E9B8, #C9A94B 45%, #F1DC93 70%, #A8862F);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .2);
}
.holo-cara-producto { position: relative; margin-top: auto; font-family: var(--titulos); font-weight: 800; font-size: clamp(1.25rem, 2.6vw, 1.6rem); color: var(--blanco); line-height: 1.1; }
.holo-cara-clave {
	position: relative; margin-top: .7rem;
	font-family: var(--mono); font-weight: 700; font-size: clamp(.78rem, 1.6vw, .95rem); letter-spacing: .06em;
	color: var(--lima); white-space: nowrap; overflow: hidden;
	text-shadow: 0 0 12px rgba(107, 229, 46, .5);
}
.holo-cara-pie { position: relative; display: flex; justify-content: space-between; margin-top: .9rem; font-size: .78rem; color: var(--texto-suave); }
.holo-cara-pie b { color: var(--texto-suave); transition: color .4s ease; }
.holo-entregada .holo-cara-pie b { color: var(--lima); }

.holo-flotante {
	position: absolute; z-index: 2;
	display: inline-flex; align-items: center; gap: .45rem;
	padding: .55rem .95rem; border-radius: 999px;
	font-family: var(--titulos); font-weight: 700; font-size: .85rem; color: var(--blanco);
	animation: holo-levitar 5s ease-in-out infinite;
}
.holo-flotante i { width: 8px; height: 8px; border-radius: 50%; background: var(--acento, var(--lima)); box-shadow: 0 0 12px var(--acento, var(--lima)); }
.holo-flotante.f1 { left: 2%; top: 14%; }
.holo-flotante.f2 { right: 0; top: 6%; animation-delay: -1.2s; }
.holo-flotante.f3 { left: 6%; bottom: 10%; animation-delay: -2.4s; }
.holo-flotante.f4 { right: 4%; bottom: 16%; animation-delay: -3.6s; }

/* ---------- Cinta en movimiento ---------- */
.holo-cinta {
	position: relative; overflow: hidden; padding: 1.1rem 0;
	border-block: 1px solid var(--borde);
	background: rgba(11, 17, 28, .7);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.holo-cinta-pista { display: flex; gap: 3rem; width: max-content; animation: holo-cinta 38s linear infinite; }
.holo-cinta span { display: inline-flex; align-items: center; gap: 3rem; font-family: var(--titulos); font-weight: 800; font-size: 1.15rem; color: var(--texto-suave); white-space: nowrap; }
.holo-cinta span::after { content: '✦'; color: var(--lima); font-size: .9rem; }
@keyframes holo-cinta { to { transform: translateX(-50%); } }

/* ---------- Categorías en «bento» ---------- */
/* 6 categorías: 2 grandes arriba (2 columnas cada una) y 4 abajo. */
.holo-bento { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
.holo-categoria {
	--acento: var(--lima);
	position: relative; overflow: hidden; grid-column: span 1;
	display: flex; flex-direction: column; gap: .5rem;
	min-height: 220px; padding: 1.6rem;
	color: var(--texto); text-decoration: none;
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.holo-categoria:nth-child(1), .holo-categoria:nth-child(2) { grid-column: span 2; min-height: 260px; }
/* La rejilla se acomoda al número de tarjetas (nN, con la de «Te la conseguimos»). */
.holo-bento.n2 .holo-categoria, .holo-bento.n4 .holo-categoria { grid-column: span 2; }
.holo-bento.n3 .holo-categoria:first-child { grid-column: span 4; }
.holo-bento.n3 .holo-categoria:not(:first-child) { grid-column: span 2; }
.holo-bento.n5 .holo-categoria:last-child { grid-column: span 2; }
.holo-bento.n7 .holo-categoria:last-child { grid-column: span 4; }
.holo-pedido { --acento: var(--cian); }
.holo-categoria::before { /* orbe de color */
	content: ''; position: absolute; width: 240px; height: 240px; right: -80px; top: -90px; border-radius: 50%;
	background: var(--acento); filter: blur(60px); opacity: .28; transition: opacity .3s ease, transform .3s ease;
}
.holo-categoria:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--acento) 60%, transparent); box-shadow: 0 20px 60px rgba(0, 0, 0, .4), 0 0 40px color-mix(in srgb, var(--acento) 25%, transparent); color: var(--texto); }
.holo-categoria:hover::before { opacity: .5; transform: scale(1.15); }
.holo-categoria-icono {
	position: relative; width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center;
	color: var(--acento); background: color-mix(in srgb, var(--acento) 14%, transparent);
	border: 1px solid color-mix(in srgb, var(--acento) 35%, transparent);
	margin-bottom: auto;
}
.holo-categoria h3 { position: relative; font-size: 1.3rem; margin: 1.2rem 0 0; }
.holo-categoria p { position: relative; margin: 0; font-size: .95rem; }
.holo-categoria-pie { position: relative; display: flex; justify-content: space-between; align-items: center; margin-top: .6rem; font-family: var(--mono); font-size: .78rem; color: var(--texto-suave); }
.holo-categoria-pie .flecha { color: var(--acento); font-size: 1.1rem; transition: transform .25s ease; }
.holo-categoria:hover .flecha { transform: translateX(4px); }

/* ---------- Productos ---------- */
.woocommerce ul.products li.product {
	--acento: var(--lima);
	position: relative;
	background: var(--vidrio) !important;
	border: 1px solid var(--borde) !important;
	border-radius: var(--radio);
	overflow: hidden;
	transform-style: preserve-3d;
	transition: transform .2s ease-out, box-shadow .25s ease, border-color .25s ease;
}
.woocommerce ul.products li.product:hover {
	border-color: color-mix(in srgb, var(--acento) 55%, transparent) !important;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .45), 0 0 40px color-mix(in srgb, var(--acento) 22%, transparent);
}
.woocommerce ul.products li.product::after { /* brillo que sigue al puntero */
	content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .25s ease;
	background: radial-gradient(circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .12), transparent 45%);
}
.woocommerce ul.products li.product:hover::after { opacity: 1; }
.woocommerce ul.products li.product a img { border-radius: 0; margin: 0; }
.woocommerce ul.products li.product .product-details { padding: 1.1rem 1.25rem 1.35rem; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 1.05rem; color: var(--blanco); }
.woocommerce ul.products li.product .price { color: var(--blanco) !important; font-family: var(--titulos); font-weight: 800; font-size: 1.35rem; }
.woocommerce ul.products li.product .button { width: 100%; white-space: nowrap; }
.woocommerce ul.products li.product .product-action-wrap { margin-top: .4rem; }
@media (max-width: 767px) {
	.woocommerce ul.products li.product .product-details { padding: .8rem .8rem 1rem; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: .92rem; }
	.woocommerce ul.products li.product .price { font-size: 1.1rem; }
	.woocommerce ul.products li.product .button { padding: .7em .8em !important; font-size: .88rem; }
}
.holo-mas { text-align: center; margin-top: 2.5rem; }

/* ---------- Cómo funciona: línea de tiempo ---------- */
.holo-pasos { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.holo-pasos::before, .holo-pasos::after {
	content: ''; position: absolute; left: 8%; right: 8%; top: 38px; height: 2px; border-radius: 2px;
}
.holo-pasos::before { background: var(--borde); }
.holo-pasos::after { background: var(--iris); transform: scaleX(0); transform-origin: left; transition: transform 1.6s cubic-bezier(.2, .7, .2, 1); }
.holo-pasos.ctl-visible::after { transform: scaleX(1); }
.holo-paso { position: relative; padding: 1.6rem; text-align: left; }
.holo-paso-numero {
	position: relative; z-index: 1;
	width: 76px; height: 76px; border-radius: 22px; display: grid; place-items: center; margin: -3.2rem 0 1.2rem;
	font-family: var(--mono); font-weight: 700; font-size: 1.4rem; color: var(--lima);
	background: var(--fondo-2); border: 1px solid rgba(107, 229, 46, .35);
	box-shadow: 0 0 30px rgba(107, 229, 46, .2);
}
.holo-paso h3 { font-size: 1.25rem; margin: 0 0 .5rem; }
.holo-paso p { margin: 0; }
.holo-pasos { margin-top: 3.5rem; }

/* ---------- Beneficios ---------- */
.holo-beneficios { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
.holo-beneficio { padding: 1.6rem; }
.holo-beneficio .holo-categoria-icono { --acento: var(--lima); margin-bottom: 1.1rem; }
.holo-beneficio h3 { font-size: 1.1rem; margin: 0 0 .4rem; }
.holo-beneficio p { margin: 0; font-size: .95rem; }

/* ---------- Preguntas frecuentes ---------- */
.ctl-faq { max-width: 820px; margin: 0 auto; }
.ctl-faq details {
	background: var(--vidrio); border: 1px solid var(--borde); border-radius: 16px;
	padding: 1.1rem 1.35rem; margin-bottom: .75rem;
	transition: border-color .2s ease;
}
.ctl-faq details[open] { border-color: rgba(107, 229, 46, .4); }
.ctl-faq summary { font-family: var(--titulos); font-weight: 700; color: var(--blanco); cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.ctl-faq summary::-webkit-details-marker { display: none; }
.ctl-faq summary::after { content: '+'; color: var(--lima); font-family: var(--mono); font-size: 1.2rem; line-height: 1; transition: transform .2s ease; }
.ctl-faq details[open] summary::after { transform: rotate(45deg); }
.ctl-faq details p { margin: .8rem 0 0; }

/* ---------- Cierre ---------- */
.holo-cierre { position: relative; overflow: hidden; text-align: center; padding: clamp(3rem, 7vw, 5rem) 1.5rem; }
.holo-cierre::before {
	content: ''; position: absolute; left: 50%; top: 50%; width: 600px; height: 600px; margin: -300px 0 0 -300px; border-radius: 50%;
	background: radial-gradient(circle, rgba(107, 229, 46, .22), rgba(34, 211, 238, .10) 40%, transparent 70%);
	pointer-events: none;
}
.holo-cierre > * { position: relative; }
.holo-cierre h2 { font-size: clamp(2rem, 4.6vw, 3.4rem); margin: 0 0 1rem; }
.holo-cierre p { max-width: 560px; margin: 0 auto 2rem; font-size: 1.08rem; }
.holo-acciones { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: center; }

/* Revelado al hacer scroll (lo activa holo.js solo para lo que está bajo la pantalla). */
.ctl-revelar { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1); }
.ctl-revelar.ctl-visible { opacity: 1; transform: none; }

/* Entrada del héroe, escalonada */
.holo-entrada > * { animation: holo-subir .8s cubic-bezier(.2, .7, .2, 1) both; }
.holo-entrada > *:nth-child(2) { animation-delay: .08s; }
.holo-entrada > *:nth-child(3) { animation-delay: .16s; }
.holo-entrada > *:nth-child(4) { animation-delay: .24s; }
.holo-entrada > *:nth-child(5) { animation-delay: .32s; }
@keyframes holo-subir { from { opacity: 0; transform: translateY(20px); filter: blur(6px); } }

/* =====================================================================
   Tienda, ficha, carrito y pago sobre fondo oscuro
   ===================================================================== */
.entry-hero .entry-hero-container-inner {
	background: var(--fondo) !important;
	background-image:
		radial-gradient(circle at 85% 0%, rgba(34, 211, 238, .14), transparent 40%),
		radial-gradient(circle at 10% 100%, rgba(107, 229, 46, .14), transparent 40%) !important;
}
.product-archive-hero-section .entry-hero-container-inner,
.product-archive-hero-section .hero-container,
.product-archive-hero-section .entry-header { min-height: 0 !important; }
.product-archive-hero-section .hero-container { padding-top: 3.2rem; padding-bottom: .4rem; }
.product-archive-hero-section .entry-header { text-align: left !important; align-items: flex-start !important; justify-content: flex-start !important; }
.product-archive-hero-section .page-title { color: var(--blanco); font-size: clamp(2.2rem, 4.6vw, 3.4rem); margin: 0; }
.product-archive-hero-section .archive-description { display: none; }
.entry-hero .entry-title, .entry-hero .page-title { color: var(--blanco); }
.entry-hero { border-bottom: 1px solid var(--borde); }
/* En la tienda el título sigue en .ctl-tienda-banda: brillo solo arriba, sin corte. */
.product-archive-hero-section { border-bottom: 0; }
.product-archive-hero-section .entry-hero-container-inner {
	background-image: radial-gradient(ellipse at 80% 0%, rgba(34, 211, 238, .14), transparent 60%) !important;
}
.ctl-tienda-banda { padding: .2rem 0 2.6rem; border-bottom: 1px solid var(--borde); }
.ctl-tienda-descripcion p { margin: 0 0 1.3rem; max-width: 640px; }
.ctl-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.ctl-chips a {
	font-family: var(--titulos); font-weight: 700; font-size: .9rem;
	padding: .5rem 1.1rem; border-radius: 999px;
	color: var(--texto); text-decoration: none;
	border: 1px solid var(--borde-fuerte); background: rgba(255, 255, 255, .03);
}
.ctl-chips a:hover { border-color: var(--lima); color: var(--lima); }
.ctl-chips a[aria-current="page"] { background: var(--lima); border-color: var(--lima); color: var(--fondo); }
.woocommerce-products-header:empty { display: none; }
.woocommerce-result-count, .woocommerce-ordering select { color: var(--texto-suave); }

/* Ficha */
.single-product .summary .price { color: var(--blanco) !important; font-family: var(--titulos); font-weight: 800; font-size: 2.2rem; }
.single-product .woocommerce-product-details__short-description li::marker { color: var(--lima); }
.single-product div.product div.images img { border-radius: var(--radio); }
.single-product form.cart { display: flex; align-items: stretch; gap: .75rem; flex-wrap: wrap; }
.single-product form.cart .quantity input.qty { height: 100%; min-height: 54px; border-radius: 999px; }
.single-product form.cart .single_add_to_cart_button { min-height: 54px; line-height: 1; padding: 0 2.2rem !important; flex: 1 1 auto; max-width: 340px; }
.ctl-confianza {
	list-style: none; margin: 1.4rem 0 0; padding: 1.1rem 1.3rem;
	border-radius: 16px; background: var(--vidrio); border: 1px solid var(--borde);
	display: grid; gap: .55rem;
}
.ctl-confianza li { display: flex; gap: .6rem; align-items: baseline; margin: 0; }
.ctl-confianza li::before { content: '✓'; font-weight: 800; color: var(--lima); }
.product_meta { font-family: var(--mono); font-size: .78rem; color: var(--texto-suave); }
.woocommerce-tabs ul.tabs li { background: transparent !important; border-color: var(--borde) !important; }
.woocommerce-tabs ul.tabs li.active { border-bottom-color: var(--lima) !important; }
.woocommerce-tabs ul.tabs li a { color: var(--texto) !important; }
.woocommerce-tabs ul.tabs li.active a { color: var(--blanco) !important; }

/* Formularios, tablas y avisos */
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], input[type="search"],
select, textarea, .select2-container .select2-selection {
	background: var(--fondo-2) !important; color: var(--blanco) !important;
	border: 1px solid var(--borde-fuerte) !important; border-radius: 12px !important;
}
input:focus, select:focus, textarea:focus { border-color: var(--lima) !important; box-shadow: 0 0 0 3px rgba(107, 229, 46, .18) !important; }
.woocommerce table.shop_table, .woocommerce table.shop_table td, .woocommerce table.shop_table th { border-color: var(--borde) !important; color: var(--texto); }
.woocommerce table.shop_table { background: var(--vidrio); border-radius: var(--radio); overflow: hidden; }
.woocommerce .cart_totals, #order_review, .woocommerce-checkout-review-order { background: transparent; }
.woocommerce-checkout #payment { background: var(--vidrio) !important; border: 1px solid var(--borde); border-radius: var(--radio); }
.woocommerce-checkout #payment div.payment_box { background: var(--fondo-3) !important; color: var(--texto) !important; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--fondo-3) !important; }
.woocommerce-info, .woocommerce-message, .woocommerce-error, .woocommerce-notice {
	background: var(--fondo-2) !important; color: var(--texto) !important;
	border: 1px solid var(--borde) !important; border-left: 3px solid var(--lima) !important; border-radius: 14px;
}
.woocommerce-error { border-left-color: #F87171 !important; }
label, .woocommerce form .form-row label { color: var(--texto); }
.woocommerce form.login, .woocommerce form.register, .woocommerce form.lost_reset_password {
	background: var(--vidrio); border: 1px solid var(--borde) !important; border-radius: var(--radio); padding: 1.6rem !important;
}
.wc-empty-cart-message .cart-empty, .woocommerce-cart .cart-empty {
	font-size: 1.1rem !important; font-family: var(--cuerpo); text-align: center; padding: 1.2rem 1.4rem !important;
}
.woocommerce-cart .return-to-shop { text-align: center; }
.woocommerce form .form-row .required { color: #F87171; }

/* =====================================================================
   Pie
   ===================================================================== */
.ctl-pie { position: relative; background: #05080F; color: var(--texto-suave); padding: 4rem 0 1.6rem; font-size: .95rem; }
.ctl-pie::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: var(--iris); opacity: .5; }
.ctl-pie a { color: var(--texto); text-decoration: none; }
.ctl-pie a:hover { color: var(--lima); }
.ctl-pie .ctl-pie-rejilla { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2rem; }
.ctl-pie .ctl-pie-titulo { color: var(--blanco); font-size: 1rem; margin: 0 0 .9rem; }
.ctl-pie ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.ctl-pie .ctl-pie-logo { width: 210px; height: auto; margin-bottom: 1rem; }
.ctl-pie .ctl-pagos { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .8rem; }
.ctl-pie .ctl-pagos span { font-size: .78rem; font-weight: 600; border: 1px solid var(--borde-fuerte); border-radius: 6px; padding: .2rem .5rem; color: var(--texto); }
.ctl-pie .ctl-pie-legal {
	margin-top: 2.5rem; padding-top: 1.2rem; border-top: 1px solid var(--borde);
	font-size: .82rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem;
}
.ctl-pie .ctl-pie-aviso { margin-top: 1rem; font-size: .75rem; color: var(--texto-suave); }

/* ---------- WhatsApp: #128C7E con blanco = 4,1:1 (el #25D366 da 1,98:1) ---------- */
.ctl-whatsapp {
	position: fixed; right: 18px; bottom: 18px; z-index: 50;
	width: 58px; height: 58px; border-radius: 50%;
	background: #128C7E; color: #fff;
	display: grid; place-items: center;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .4), 0 0 0 1px rgba(255, 255, 255, .12);
}
.ctl-whatsapp:hover { color: #fff; transform: scale(1.06); }
.ctl-whatsapp svg { width: 30px; height: 30px; }

/* ---------- 404 ---------- */
.holo-404 { padding-bottom: clamp(3rem, 7vw, 5rem); }
.holo-404-contenido { position: relative; max-width: 760px; text-align: center; }
.holo-404 .holo-bajada { margin-left: auto; margin-right: auto; }
.holo-404 .holo-buscador { margin: 0 auto; }
.holo-404-chips { justify-content: center; margin-top: 1.4rem; }

/* ---------- Blog ---------- */
.blog .loop-entry, .archive.category .loop-entry {
	background: var(--vidrio) !important; border: 1px solid var(--borde); border-radius: var(--radio); overflow: hidden;
	transition: transform .2s ease, border-color .2s ease;
}
.blog .loop-entry:hover, .archive.category .loop-entry:hover { transform: translateY(-3px); border-color: rgba(107, 229, 46, .45); }
.loop-entry .entry-title a { color: var(--blanco); text-decoration: none; }
.loop-entry .entry-taxonomies a, .single-post .entry-taxonomies a { color: var(--lima) !important; font-family: var(--mono); letter-spacing: .08em; }
.single-post .entry-content { font-size: 1.08rem; line-height: 1.75; }
.single-post .entry-content h2 { font-size: 1.6rem; margin-top: 2.2rem; }
.single-post .entry-content li { margin-bottom: .35rem; }
.single-post .entry-content code { background: var(--fondo-3); color: var(--lima); padding: .1em .4em; border-radius: 6px; font-family: var(--mono); }
.single-post .post-thumbnail img { border-radius: var(--radio); }

/* Texto SEO bajo los productos de una categoría */
.ctl-seo-texto { margin: 3rem 0 1rem; padding: clamp(1.4rem, 3vw, 2.2rem); }
.ctl-seo-texto h2 { font-size: 1.5rem; margin: 0 0 .8rem; }
.ctl-seo-texto h3 { font-size: 1.15rem; margin: 1.4rem 0 .5rem; }
.ctl-seo-texto p { margin: 0 0 .8rem; max-width: 820px; }

/* ---------- Aviso de cookies ---------- */
.ctl-cookies {
	position: fixed; left: 18px; bottom: 18px; z-index: 60;
	max-width: 440px; padding: 1.1rem 1.2rem;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
	background: rgba(11, 17, 28, .92);
	font-size: .92rem;
}
.ctl-cookies[hidden] { display: none; }
.ctl-cookies p { margin: 0 0 .9rem; }
.ctl-cookies-acciones { display: flex; gap: .6rem; justify-content: flex-end; flex-wrap: wrap; }
.ctl-cookies .holo-boton { padding: .6em 1.2em !important; font-size: .9rem; }
@media (max-width: 560px) {
	.ctl-cookies { left: 10px; right: 10px; bottom: 10px; max-width: none; }
	.ctl-cookies-acciones .holo-boton { flex: 1; }
}
.ctl-pendiente { background: rgba(250, 204, 21, .18); color: #FDE68A; padding: 0 .3em; border-radius: 4px; }

/* =====================================================================
   Responsive
   ===================================================================== */
@media (max-width: 1024px) {
	.holo-heroe-rejilla { grid-template-columns: 1fr; gap: 1rem; }
	.holo-escena { height: 380px; }
	.holo-beneficios { grid-template-columns: repeat(2, 1fr); }
	.ctl-pie .ctl-pie-rejilla { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
	.holo-bento { grid-template-columns: 1fr 1fr; gap: .8rem; }
	.holo-bento .holo-categoria { grid-column: span 1 !important; min-height: 180px; padding: 1.1rem; }
	.holo-bento .holo-categoria:first-child, .holo-bento .holo-pedido { grid-column: span 2 !important; min-height: 160px; }
	.holo-categoria h3 { font-size: 1.05rem; }
	.holo-categoria p { display: none; }
	.holo-pasos { grid-template-columns: 1fr; gap: 2.8rem; }
	.holo-pasos::before, .holo-pasos::after { display: none; }
	.holo-beneficios { grid-template-columns: 1fr; }
	.holo-escena { height: 330px; }
	.holo-anillo.a1 { width: 340px; height: 340px; margin: -170px 0 0 -170px; }
	.holo-anillo.a2 { width: 260px; height: 260px; margin: -130px 0 0 -130px; }
	.holo-flotante { font-size: .75rem; padding: .4rem .7rem; }
	.holo-buscador .holo-boton span { display: none; }
	.holo-sugerencias { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-right: -16px; padding-right: 16px; }
	.holo-sugerencias::-webkit-scrollbar { display: none; }
	.holo-sugerencias a, .holo-sugerencias span { flex: none; white-space: nowrap; }
	.holo-bajada { font-size: 1rem; }
	.ctl-pie .ctl-pie-rejilla { grid-template-columns: 1fr; }
}

/* Quien pide menos movimiento: todo quieto y visible. */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.ctl-revelar { opacity: 1; transform: none; }
	.holo-pasos::after { transform: scaleX(1); }
}

/* =====================================================================
   Correcciones visuales (2026-11-01)
   ===================================================================== */

/* Carrito: Kadence fija 38px de alto en estos botones; con el relleno del tema el texto se salía. */
.woocommerce-cart table.cart td.actions .button,
.woocommerce-cart table.cart td.actions .coupon .button {
	height: auto !important;
	min-height: 44px;
	line-height: 1.2 !important;
	padding: .7em 1.3em !important;
	font-size: 1rem;
	white-space: nowrap;
}
.woocommerce-cart table.cart td.actions .coupon .input-text {
	height: 44px;
	min-height: 44px;
}
@media (max-width: 768px) {
	.woocommerce-cart table.cart td.actions .coupon {
		display: flex; flex-wrap: wrap; gap: .6rem; width: 100%; padding-bottom: .6rem;
	}
	.woocommerce-cart table.cart td.actions .coupon .input-text {
		flex: 1 1 100%; width: 100% !important; margin: 0 !important;
	}
	.woocommerce-cart table.cart td.actions .button {
		width: 100%; margin: 0 !important;
	}
}

/* Avisos ("se ha añadido a tu carrito"): el botón iba gigante y encima del texto. */
.woocommerce-message, .woocommerce-info {
	display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.2rem;
}
.woocommerce-message .button, .woocommerce-info .button {
	order: 2; float: none !important; margin: 0 !important;
	padding: .55em 1.2em !important; font-size: .9rem; min-height: 0;
	box-shadow: none;
}

/* Botón flotante de WhatsApp: tapaba precios en el carrito. */
.woocommerce-cart .ctl-whatsapp { display: none; }
@media (max-width: 768px) {
	.ctl-whatsapp { width: 48px; height: 48px; right: 14px; bottom: 14px; }
}

/* Checkout: logo de Wompi gigante y casi invisible sobre el fondo oscuro. */
.woocommerce-checkout #payment li.payment_method_wompi label img {
	display: inline-block; vertical-align: middle;
	width: auto !important; max-height: 26px !important; max-width: 110px;
	margin: 0 0 0 .6rem !important; padding: 3px 8px;
	background: #fff; border-radius: 6px;
}
/* Refuerzo de especificidad: la regla global de botones usa !important. */
.woocommerce .woocommerce-notices-wrapper .woocommerce-message,
.woocommerce .woocommerce-notices-wrapper .woocommerce-info {
	display: flex !important; flex-wrap: wrap; align-items: center; gap: .8rem 1.2rem;
}
.woocommerce .woocommerce-notices-wrapper .woocommerce-message a.button,
.woocommerce .woocommerce-notices-wrapper .woocommerce-info a.button {
	order: 2; float: none !important; margin: 0 !important;
	padding: .55em 1.2em !important; font-size: .9rem; box-shadow: none !important;
}
@media (max-width: 768px) {
	.woocommerce-cart table.cart td.actions .coupon .button { flex: 1 1 100%; width: 100% !important; }
}