/* ---------- Header ---------- */
.site-header .site-branding { margin-left: -0.5rem; }
.header-navigation .header-menu-container > ul > li > a { font-size: 1.08rem; font-weight: 500; letter-spacing: .01em; }

/* ---------- Menú desplegable de Stickers: grilla de 3 filas, fondo blanco ---------- */
.header-navigation .header-menu-container ul ul.sub-menu {
	background: #faf7f2 !important;
	border-radius: 10px;
	box-shadow: 0 18px 40px rgba(0, 0, 0, .14), 0 2px 6px rgba(0, 0, 0, .06);
	padding: .9rem 1rem;
}
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item > a {
	font-size: 1rem;
	color: #222 !important;
	background: transparent !important;
	width: auto !important;
	padding: .55em .9em !important;
	border-radius: 6px;
	white-space: nowrap;
	border: 0 !important;
}
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item > a:hover { background: #f0e9df !important; color: #000 !important; }
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item { border: 0 !important; }
/* Sólo los desplegables con muchas opciones (Stickers) pasan a grilla. */
.header-navigation .header-menu-container ul ul.sub-menu:has(> li:nth-child(5)) {
	grid-template-rows: repeat(3, auto);
	grid-auto-flow: column;
	gap: .1rem 1.2rem;
}
.header-navigation .header-menu-container li.menu-item--toggled-on > ul.sub-menu:has(> li:nth-child(5)),
.header-navigation .header-menu-container li.menu-item:hover > ul.sub-menu:has(> li:nth-child(5)),
.header-navigation .header-menu-container li.menu-item:focus-within > ul.sub-menu:has(> li:nth-child(5)) { display: grid; }

/* ---------- Efecto prismático (se activa desde prisma.js) ---------- */
.sutekka-prisma {
	position: relative;
	display: block;
	line-height: 0;
	transform: perspective(700px) translate(var(--tx, 0px), var(--ty, 0px)) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(var(--lift, 0px));
	transition: transform .25s ease, filter .25s ease;
}
/* En reposo sin transformación (ni capa propia): con una transformación 3D "vacía" el navegador dibuja el sticker en una capa aparte y,
   con la escala de pantalla de Windows (125%, 150%), lo muestra algo desenfocado. Sólo se inclina mientras está el mouse (o el giro del celu). */
.sutekka-prisma:not(.activo) { transform: none; }
.sutekka-prisma.activo { will-change: transform; }
.sutekka-prisma::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0;
	transition: opacity .3s ease;
	/* El brillo sólo se pinta sobre la forma del sticker (su transparencia hace de máscara). */
	-webkit-mask: var(--mascara) center / 100% 100% no-repeat;
	mask: var(--mascara) center / 100% 100% no-repeat;
	/* Sin material conocido: apenas un reflejo de luz. */
	background: radial-gradient(circle at var(--x, 50%) var(--y, 50%), rgba(255, 255, 255, .45) 0%, rgba(255, 255, 255, 0) 40%);
	mix-blend-mode: soft-light;
}
/* Fotos del sticker real (prisma.js les pone "foto"): quietas, sin inclinación ni brillo ni despegue. Los PNG (planchitas incluidas) llevan todos los efectos. */
.sutekka-prisma.foto { transform: none !important; filter: none !important; transition: none; will-change: auto; }
.sutekka-prisma.foto::after { display: none !important; }
/* Ojo: la sombra de "levantado" va en la imagen y NO en la caja que se inclina: un filtro sobre un elemento con transform 3D hace que el
   navegador lo dibuje a baja resolución y lo estire (el sticker se ve desenfocado mientras se mueve). */
.sutekka-prisma.activo { --lift: -6px; }
.sutekka-prisma.recortado.activo img { filter: drop-shadow(0 14px 18px rgba(0, 0, 0, .22)) drop-shadow(0 1px 2px rgba(0, 0, 0, .15)); }
.sutekka-prisma.activo::after { opacity: .7; }

/* Holográfico: bandas de arcoíris que se mueven con el mouse. */
.sutekka-prisma.material-holo::after {
	background:
		radial-gradient(circle at var(--x, 50%) var(--y, 50%), rgba(255, 255, 255, .75) 0%, rgba(255, 255, 255, 0) 38%),
		repeating-linear-gradient(calc(var(--angulo, 0) * 1deg + 115deg),
			rgba(255, 94, 196, .0) 0%, rgba(255, 94, 196, .9) 4%, rgba(255, 211, 107, .9) 8%, rgba(125, 255, 156, .9) 12%,
			rgba(79, 216, 255, .9) 16%, rgba(139, 107, 255, .9) 20%, rgba(139, 107, 255, 0) 26%, rgba(0, 0, 0, 0) 34%);
	background-size: 100% 100%, 250% 250%;
	background-position: center, var(--bx, 50%) var(--by, 50%);
	mix-blend-mode: plus-lighter; /* suma de luz: estable (el color-dodge divide y en algunas placas de video deja puntitos y rayas) */
}
.sutekka-prisma.material-holo.activo::after { opacity: .55; }
/* Stickers claros (casi blancos): el "color-dodge" sobre blanco se vuelve ruido (puntitos y rayas) en algunas placas de video; ahí el arcoíris se multiplica. */
.sutekka-prisma.material-holo.claro::after { mix-blend-mode: multiply; }
.sutekka-prisma.material-holo.claro.activo::after { opacity: .85; }

/* Prismático: puntitos de colores como facetas de prisma que titilan con el movimiento. */
.sutekka-prisma.material-prisma::after {
	background:
		radial-gradient(circle at var(--x, 50%) var(--y, 50%), rgba(255, 255, 255, .8) 0%, rgba(255, 255, 255, 0) 30%),
		repeating-conic-gradient(from calc(var(--angulo, 0) * 2deg) at var(--x, 50%) var(--y, 50%),
			rgba(255, 94, 196, .8) 0deg 2deg, transparent 2deg 9deg, rgba(79, 216, 255, .8) 9deg 11deg, transparent 11deg 18deg,
			rgba(255, 211, 107, .8) 18deg 20deg, transparent 20deg 27deg, rgba(139, 107, 255, .8) 27deg 29deg, transparent 29deg 36deg),
		radial-gradient(circle, rgba(255, 255, 255, .7) 0 1px, transparent 1.6px) 0 0 / 8px 8px;
	mix-blend-mode: plus-lighter; /* suma de luz: estable (el color-dodge divide y en algunas placas de video deja puntitos y rayas) */
}
.sutekka-prisma.material-prisma.activo::after { opacity: .45; }

/* Dorado: reflejo de metal dorado que barre el sticker siguiendo al mouse. */
.sutekka-prisma.material-oro::after {
	background:
		radial-gradient(circle at var(--x, 50%) var(--y, 50%), rgba(255, 250, 225, .95) 0%, rgba(255, 236, 170, 0) 35%),
		linear-gradient(calc(var(--angulo, 0) * 1deg + 120deg),
			rgba(120, 80, 10, 0) 20%, rgba(255, 215, 90, .85) 42%, rgba(255, 249, 220, 1) 50%, rgba(214, 160, 30, .85) 58%, rgba(120, 80, 10, 0) 80%);
	background-size: 100% 100%, 220% 220%;
	background-position: center, var(--bx, 50%) var(--by, 50%);
	mix-blend-mode: overlay;
}
.sutekka-prisma.material-oro.activo::after { opacity: .95; }

/* Laca sectorizada: un reflejo blanco de brillo (como barniz) y el sticker con su borde blanco marcado. */
.sutekka-prisma.material-laca::after {
	background:
		linear-gradient(calc(var(--angulo, 0) * 1deg + 125deg),
			rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, .95) 48%, rgba(255, 255, 255, .95) 52%, rgba(255, 255, 255, 0) 62%);
	background-size: 260% 260%;
	background-position: var(--bx, 50%) var(--by, 50%);
	mix-blend-mode: soft-light;
}
.sutekka-prisma.material-laca.activo::after { opacity: 1; }
.sutekka-prisma.material-laca.activo img {
	filter: drop-shadow(1.5px 0 0 #fff) drop-shadow(-1.5px 0 0 #fff) drop-shadow(0 1.5px 0 #fff) drop-shadow(0 -1.5px 0 #fff)
		drop-shadow(0 6px 10px rgba(0, 0, 0, .22)) !important;
}
/* En celular la caja ya se suaviza en prisma.js: sin transición responde al instante al mover el teléfono. */
@media (hover: none) { .sutekka-prisma { transition: filter .25s ease; } }
@media (prefers-reduced-motion: reduce) {
	.sutekka-prisma { transform: none !important; }
}

/* ---------- Sticker que se despega (peel.js) ---------- */
.sutekka-peel { position: relative; display: inline-block; line-height: 0; touch-action: pan-y; -webkit-user-select: none; user-select: none; filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .28)); }
.sutekka-peel.listo { cursor: grab; }
.sutekka-peel.despegando { cursor: grabbing; }
.sutekka-peel img { -webkit-user-drag: none; }
/* Mientras se despega, sombra y brillo los da la caja entera (peel.js le copia los filtros): así siguen la silueta del sticker pegado y levantado, sin cortarse en la línea de doblez.
   El sticker no se inclina ni se mueve mientras se arrastra (también con el giroscopio en el celu). */
.sutekka-peel.despegando .sutekka-prisma, .sutekka-peel.despegando .sutekka-prisma img { filter: none !important; transform: none !important; transition: none !important; }
/* El dorso: se da vuelta sobre la línea de doblez (peel.js le pone la máscara de la mitad y la matriz del reflejo). */
.sutekka-peel-forma { display: none; position: absolute; inset: 0; pointer-events: none; transform-origin: 0 0; }
.sutekka-peel-dorso { position: absolute; inset: 0; }
.sutekka-peel-envol { display: none; position: absolute; inset: 0; pointer-events: none; }
.sutekka-peel-papel { position: absolute; display: block; -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
/* Con el despegue no se inclina con el mouse (chocan), pero en el celu sí sigue al giroscopio. */
@media (hover: hover) { .sutekka-prisma.sin-inclinar { transform: none !important; } }
.wp-block-cover .sutekka-hero-sticker { position: absolute; right: 9%; top: 50%; transform: translateY(-50%) rotate(4deg); width: min(26vw, 330px); z-index: 2; margin: 0 !important; }
.sutekka-hero-sticker img { width: 100%; height: auto; }
.sutekka-hero-sticker .sutekka-peel { display: block; }
@media (max-width: 900px) { .sutekka-hero-sticker { display: none; } }

/* ---------- Footer ---------- */
.sutekka-footer { background: #f4f4f2; color: #333; margin-top: 4rem; border-top: 1px solid #e4e4e0; }
.sutekka-footer-grilla {
	max-width: 1290px; margin: 0 auto; padding: 3.5rem 1.5rem 2.5rem;
	display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.3fr auto; gap: 2.5rem;
}
.sutekka-footer h4 { font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; margin: 0 0 1rem; color: #111; }
.sutekka-footer ul { list-style: none; margin: 0; padding: 0; }
.sutekka-footer li { margin: 0 0 .55rem; }
.sutekka-footer a { color: #333; text-decoration: none; }
.sutekka-footer a:hover { color: #000; text-decoration: underline; }
.sutekka-footer-logo { width: 170px; height: auto; margin-bottom: .8rem; }
.sutekka-footer-marca p { font-size: .92rem; line-height: 1.5; max-width: 22rem; color: #555; }
.sutekka-redes { display: flex; gap: .6rem; margin-top: 1rem; }
.sutekka-redes a { width: 38px; height: 38px; border-radius: 50%; background: #111; display: grid; place-items: center; transition: transform .2s; }
.sutekka-redes a:hover { transform: translateY(-2px); }
.sutekka-redes svg { width: 19px; height: 19px; fill: #fff; }
.sutekka-arrepentimiento {
	display: inline-block; border: 2px solid #111; border-radius: 6px; padding: .55rem 1rem;
	font-weight: 700; font-size: .9rem; color: #111 !important; white-space: nowrap;
}
.sutekka-arrepentimiento:hover { background: #111; color: #fff !important; text-decoration: none !important; }
.sutekka-footer-base {
	border-top: 1px solid #e4e4e0; max-width: 1290px; margin: 0 auto; padding: 1.2rem 1.5rem;
	display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; font-size: .82rem; color: #666;
}
.sutekka-footer-base a { color: #666; }
@media (max-width: 1000px) {
	.sutekka-footer-grilla { grid-template-columns: 1fr 1fr; }
	.sutekka-footer-marca { grid-column: 1 / -1; }
}
/* El sticker grande se ubica respecto de todo el hero, no de la columna de texto. */
.wp-block-cover.sutekka-hero .wp-block-cover__inner-container { position: static; }
.wp-block-cover.sutekka-hero .wp-block-cover__inner-container > *:not(.sutekka-hero-sticker) { position: relative; z-index: 1; }

/* ---------- Fichas de producto como las grandes tiendas: fondo gris claro y el sticker con relieve ---------- */
.woocommerce ul.products li.product a.woocommerce-loop-image-link { display: block; background: #efefec; }
.woocommerce div.product .woocommerce-product-gallery__image { background: #efefec; border-radius: 6px; }
/* Sólo los stickers recortados (fondo transparente) llevan sombra: las fotos con fondo ya tienen la suya. */
.woocommerce ul.products li.product .sutekka-prisma.recortado { padding: 5%; }
.woocommerce ul.products li.product .sutekka-prisma.recortado::after { inset: 5%; }
.sutekka-prisma.recortado img { filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .22)) drop-shadow(0 1px 2px rgba(0, 0, 0, .15)); }
/* Tarjetas de temática ("Elegí tu temática" y subcategorías): fondo crema que se despega del blanco de la página, sin
   caja blanca encima del sticker (tapaba la sombra al inclinarse), título grande con flechita y naranja al pasar el mouse. */
.woocommerce ul.products li.product-category {
	background: #f5efe7; border-radius: 18px; box-shadow: none; overflow: visible; transition: background .25s ease, transform .25s ease;
}
.woocommerce ul.products li.product-category:hover { background: #fde2d3; box-shadow: none; transform: translateY(-3px); }
.woocommerce ul.products li.product-category > a { display: block; padding: 9% 9% 0; text-decoration: none; }
.woocommerce ul.products li.product-category .sutekka-prisma.recortado { padding: 0; aspect-ratio: 1; }
.woocommerce ul.products li.product-category .sutekka-prisma.recortado::after { inset: 0; -webkit-mask-size: contain; mask-size: contain; }
.woocommerce ul.products li.product-category .sutekka-prisma img { width: 100%; height: 100%; object-fit: contain; }
.woocommerce ul.products li.product-category.loop-entry .product-details.content-bg { background: transparent; padding: 0; margin: 0; }
.woocommerce ul.products li.product-category .woocommerce-loop-category__title {
	display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin: 0; padding: .9rem .15rem 1.15rem;
	font-family: 'Poppins', system-ui, sans-serif; font-size: 1.22rem; font-weight: 700; color: #1a1a1a; letter-spacing: -.01em;
}
.woocommerce ul.products li.product-category .woocommerce-loop-category__title::after {
	content: "→"; flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%;
	background: #fff; color: var(--sutekka-naranja); font-size: 1rem; transition: transform .25s ease, background .25s ease, color .25s ease;
}
.woocommerce ul.products li.product-category:hover .woocommerce-loop-category__title::after { background: var(--sutekka-naranja); color: #fff; transform: translateX(3px); }
.woocommerce ul.products li.product-category .sutekka-prisma:not(.recortado) img { border-radius: 10px; }
@media (max-width: 767px) { /* en celu, de a dos (de a uno quedaban enormes) */
	.woocommerce ul.products:has(> li.product-category) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
	.woocommerce ul.products:has(> li.product-category) > li.product-category { width: auto; margin: 0; }
	.woocommerce ul.products li.product-category .woocommerce-loop-category__title { font-size: 1rem; padding: .7rem 0 .9rem; }
	.woocommerce ul.products li.product-category .woocommerce-loop-category__title::after { width: 1.6rem; height: 1.6rem; font-size: .85rem; }
}
.sutekka-precio-transf { display: block; font-size: .82em; font-weight: 600; color: #1a7f4b; margin-top: .15em; }

/* ---------- Barra de anuncios ---------- */
.sutekka-anuncios { background: #111; color: #fff; overflow: hidden; font-size: .86rem; line-height: 2.5; white-space: nowrap; }
.sutekka-anuncios-pista { display: inline-flex; animation: sutekka-marquesina 190s linear infinite; }
.sutekka-anuncios-pista > span { margin-right: 2.2rem; }
.sutekka-anuncios a { color: #fff; text-decoration: underline; }
.sutekka-anuncios .sep { opacity: .5; }
@keyframes sutekka-marquesina { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .sutekka-anuncios-pista { animation: none; } }

/* ---------- WhatsApp flotante ---------- */
.sutekka-wa-flotante {
	position: fixed; right: 22px; bottom: 22px; z-index: 999; width: 56px; height: 56px; border-radius: 50%;
	background: #25d366; display: grid; place-items: center; box-shadow: 0 6px 18px rgba(0, 0, 0, .25); transition: transform .2s;
}
.sutekka-wa-flotante:hover { transform: scale(1.07); }
.sutekka-wa-flotante svg { width: 30px; height: 30px; fill: #fff; }


/* En las tarjetas, la caja del despegue ocupa todo el ancho de la foto. */
.woocommerce ul.products li.product .sutekka-peel { display: block; }

/* ---------- Header: fijo arriba, con sombra; menú pegado al logo; buscador desplegado ---------- */
#masthead { position: relative; z-index: 100; }
#masthead .site-main-header-wrap, #masthead .kadence-sticky-header { box-shadow: 0 4px 18px rgba(0, 0, 0, .08); }
.site-header .site-header-main-section-left { gap: 2.2rem; }

/* ---------- Ficha de producto ---------- */
.single-product div.product .summary { padding-top: .5rem; }
.sutekka-ficha-cats { display: flex; gap: .4rem; margin-bottom: .8rem; }
.sutekka-chip { display: inline-block; background: #efefec; color: #333 !important; border-radius: 999px; padding: .28rem .8rem; font-size: .8rem; font-weight: 600; text-decoration: none !important; letter-spacing: .02em; }
.sutekka-chip:hover { background: #111; color: #fff !important; }
.single-product div.product .product_title { font-size: clamp(1.9rem, 3vw, 2.6rem); font-weight: 800; line-height: 1.08; margin-bottom: .7rem; letter-spacing: -.01em; }
.single-product div.product .summary p.price { font-size: 2rem; font-weight: 800; color: #111; margin-bottom: 1rem; }
.single-product div.product .summary .sutekka-precio-transf {
	display: inline-block; margin-top: .5rem; font-size: .95rem; font-weight: 700; color: #136c3e;
	background: #e3f6ea; border-radius: 6px; padding: .3rem .7rem;
}
.sutekka-ficha-desc { color: #444; line-height: 1.6; margin-bottom: 1.4rem; max-width: 34rem; }
.sutekka-ficha-desc p { margin: 0 0 .6rem; }
.sutekka-stock { font-weight: 700; margin: 0 0 .8rem; }
.sutekka-stock-poco { color: #c2410c; }
.single-product form.cart { display: flex; gap: .8rem; align-items: stretch; flex-wrap: wrap; margin-bottom: 1.6rem !important; }
.single-product form.cart .quantity { display: flex; align-items: center; border: 2px solid #111; border-radius: 999px; overflow: hidden; margin: 0 !important; }
.single-product form.cart .quantity input.qty { width: 3rem; border: 0 !important; text-align: center; font-weight: 700; font-size: 1.05rem; background: transparent; box-shadow: none !important; -moz-appearance: textfield; }
.single-product form.cart .quantity input.qty::-webkit-inner-spin-button,
.single-product form.cart .quantity input.qty::-webkit-outer-spin-button { -webkit-appearance: none; }
.sutekka-qty-btn { background: transparent !important; border: 0; width: 2.6rem; height: 100%; font-size: 1.3rem; font-weight: 600; color: #111 !important; cursor: pointer; padding: 0 !important; }
.sutekka-qty-btn:hover { background: #efefec !important; }
.single-product form.cart .single_add_to_cart_button {
	flex: 1; min-width: 220px; border-radius: 999px !important; background: #111 !important; color: #fff !important;
	font-size: 1.05rem !important; font-weight: 700 !important; letter-spacing: .02em; padding: .95rem 2rem !important;
	position: relative; overflow: hidden; isolation: isolate; transition: transform .15s, box-shadow .2s, color .2s;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
}
.single-product form.cart .single_add_to_cart_button::before {
	content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .3s;
	background: linear-gradient(110deg, #ff7ad9, #8f7bff, #3fd5ff, #7dffb0, #ffe36e, #ff7ad9); background-size: 300% 100%;
	animation: sutekka-holo 6s linear infinite;
}
.single-product form.cart .single_add_to_cart_button:hover { transform: translateY(-2px); color: #111 !important; }
.single-product form.cart .single_add_to_cart_button:hover::before { opacity: 1; }
.sutekka-confianza { list-style: none; margin: 0 0 1.5rem; padding: 1.1rem 1.3rem; background: #f6f6f3; border-radius: 12px; display: grid; gap: .8rem; max-width: 34rem; }
.sutekka-confianza li { display: flex; align-items: center; gap: .9rem; font-size: .9rem; color: #444; margin: 0; }
.sutekka-confianza li > img, .sutekka-confianza li > svg { width: 62px; flex: none; }
.sutekka-confianza li > img { height: 15px; object-fit: contain; object-position: left; }
.sutekka-confianza svg { height: 24px; fill: none; stroke: #111; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.single-product .woocommerce-tabs ul.tabs { display: none; }
.single-product .woocommerce-tabs .panel { background: #f6f6f3; border-radius: 12px; padding: 1.4rem 1.6rem !important; margin-top: 1rem; }
.single-product .woocommerce-tabs .panel h2 { font-size: 1.15rem; }

/* Ajustes: el menú entra en una sola fila junto al buscador y los envíos. */
.header-navigation .header-menu-container > ul > li > a { padding-left: .85em !important; padding-right: .85em !important; font-size: 1.02rem; white-space: nowrap; }
.site-header .site-header-main-section-left { gap: 1.4rem; }
.single-product form.cart .single_add_to_cart_button { display: inline-flex !important; align-items: center; justify-content: center; line-height: 1.2 !important; min-height: 54px; }

/* ---------- Instagram ---------- */
.sutekka-ig { max-width: 1290px; margin: 4rem auto 0; padding: 0 1.5rem; }
.sutekka-ig-cabecera { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; }
.sutekka-ig-cabecera h2 { margin: 0; }
.sutekka-ig-perfil { font-weight: 700; color: #111 !important; text-decoration: none !important; border-bottom: 2px solid transparent;
	background: linear-gradient(90deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5) bottom / 100% 2px no-repeat; padding-bottom: 2px; }
.sutekka-ig-carrusel { display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 1rem; scrollbar-width: thin; }
.sutekka-ig-item { flex: 0 0 328px; scroll-snap-align: start; }
.sutekka-ig-item .instagram-media { min-width: 0 !important; width: 100% !important; margin: 0 !important; border-radius: 12px !important; }

/* ---------- Acento naranja (la pared del local y el fondo del logo de Instagram) ----------
   Blanco y negro mandan; el naranja va en detalles (anuncios, menú, insignias) y de fondo en el footer. */
:root { --sutekka-naranja: #d4441f; --sutekka-naranja-osc: #b5361a; }
::selection { background: var(--sutekka-naranja); color: #fff; }
:focus-visible { outline-color: var(--sutekka-naranja); }
.sutekka-anuncios { background: var(--sutekka-naranja); }
/* Menú: subrayado naranja en hover y en la sección actual. */
.header-navigation .header-menu-container > ul > li > a { position: relative; }
.header-navigation .header-menu-container > ul > li > a:hover,
.header-navigation .header-menu-container > ul > li.current-menu-item > a { color: #111 !important; }
.header-navigation .header-menu-container > ul > li > a::after {
	content: ""; position: absolute; left: .85em; right: .85em; bottom: .35em; height: 2px; border-radius: 2px;
	background: var(--sutekka-naranja); transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
}
.header-navigation .header-menu-container > ul > li > a:hover::after,
.header-navigation .header-menu-container > ul > li.current-menu-item > a::after,
.header-navigation .header-menu-container > ul > li.current-menu-ancestor > a::after { transform: scaleX(1); }
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item > a:hover { color: var(--sutekka-naranja-osc) !important; }
/* Tarjetas y ficha. */
.woocommerce span.onsale { background: var(--sutekka-naranja) !important; color: #fff !important; }
.woocommerce ul.products li.product .woocommerce-loop-product__title:hover { color: var(--sutekka-naranja-osc); }
.sutekka-chip:hover { background: var(--sutekka-naranja); }
.sutekka-stock-poco { color: var(--sutekka-naranja-osc); }
/* Títulos de sección de la home: una rayita naranja abajo. */
.home .entry-content > h2::after, .sutekka-ig-cabecera h2::after {
	content: ""; display: block; width: 46px; height: 4px; border-radius: 2px; background: var(--sutekka-naranja); margin: .5rem auto 0;
}
.sutekka-ig-cabecera h2::after { margin-left: 0; }
/* Footer. */

/* ---------- Header, lado derecho: buscador ancho | envíos | carrito ----------
   El buscador ocupa el espacio libre que deja el menú; envíos y carrito separados con una línea fina. */
#masthead .site-main-header-inner-wrap { display: flex; }
#masthead .site-header-main-section-right { flex: 1; justify-content: flex-end; gap: 0; }
#masthead .site-header-main-section-right .site-header-item[data-section="kadence_customizer_header_html"] { flex: 1; justify-content: flex-end; margin-right: 0; }
#masthead .site-header-main-section-left { flex: none; }
#masthead .header-menu-container > ul { flex-wrap: nowrap; }
#masthead .header-html { flex: 1; }
.header-html-inner { display: flex; align-items: center; justify-content: flex-end; gap: 0; padding-left: 2rem; margin: 0; }
.sutekka-buscador {
	display: flex; align-items: center; flex: 1; min-width: 190px; max-width: 560px; height: 48px;
	background: #f2f2ef; border: 1.5px solid transparent; border-radius: 999px; padding: 0 .35rem 0 1.3rem;
	transition: border-color .2s, background .2s;
}
.sutekka-buscador:focus-within { background: #fff; border-color: #111; }
.sutekka-buscador input[type=search] { flex: 1; border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0; font-size: .98rem; min-width: 0; color: #111; }
.sutekka-buscador button { background: #111; border: 0; border-radius: 50%; width: 38px; height: 38px; display: grid; place-items: center; padding: 0; cursor: pointer; flex: none; }
.sutekka-buscador button:hover { background: #333; }
.sutekka-buscador svg { width: 17px; height: 17px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; }
.sutekka-envio-header {
	display: flex; flex-direction: column; align-items: flex-start; gap: .3rem; flex: none;
	margin-left: 1.6rem; padding-left: 1.6rem; border-left: 1px solid #e2e2de;
	text-decoration: none !important; color: #333 !important; font-size: .74rem; line-height: 1.2; white-space: nowrap;
}
.sutekka-envio-header small { color: #777; font-size: .74rem; }
.sutekka-andreani { height: 17px; width: auto; display: block; }
@media (max-width: 1540px) { .sutekka-envio-header { display: none; } }
/* Carrito: círculo negro sólo con el ícono; la cantidad en una burbujita blanca arriba a la derecha. */
#masthead .site-header-main-section-right .header-cart-wrap { margin-left: 1.1rem; }
#masthead .header-cart-button {
	position: relative; display: grid; place-items: center; width: 48px; height: 48px; padding: 0 !important;
	background: #111; color: #fff !important; border-radius: 50%; transition: background .2s, transform .2s;
}
#masthead .header-cart-button:hover { background: #333; transform: translateY(-1px); }
#masthead .header-cart-button .kadence-svg-iconset svg { width: 21px; height: 21px; }
#masthead .header-cart-button .header-cart-total {
	position: absolute; top: -3px; right: -4px; background: #fff !important; color: #111 !important; min-width: 21px; height: 21px;
	border: 2px solid #111; border-radius: 999px; display: grid; place-items: center; font-size: .72rem; font-weight: 800; padding: 0 .3rem; margin: 0;
}

/* ---------- Footer naranja con texto blanco ---------- */
.sutekka-footer { background: var(--sutekka-naranja); color: #fdf7f2; border-top: 0; }
.sutekka-footer h4, .sutekka-footer a, .sutekka-footer-base a { color: #fdf7f2; }
.sutekka-footer a:hover { color: #fdf7f2; }
.sutekka-footer-marca p, .sutekka-footer-base { color: rgba(253, 247, 242, .9); }
.sutekka-footer-base { border-top-color: rgba(255, 255, 255, .3); }
.sutekka-redes a { background: #fff; }
.sutekka-redes svg { fill: var(--sutekka-naranja); }
.sutekka-arrepentimiento { border-color: #fdf7f2; color: #fdf7f2 !important; }
.sutekka-arrepentimiento:hover { background: #fff; color: var(--sutekka-naranja) !important; }
/* Menú principal: letra más grande y más aire entre ítems (el carrito sin texto deja lugar). */
#masthead .header-navigation .header-menu-container > ul > li > a { padding-left: .8em !important; padding-right: .8em !important; font-size: 1.1rem; }
#masthead .header-navigation .header-menu-container > ul > li > a::after { left: .8em; right: .8em; }
@media (max-width: 1500px) {
	#masthead .header-navigation .header-menu-container > ul > li > a { padding-left: .6em !important; padding-right: .6em !important; font-size: 1.04rem; }
	#masthead .header-navigation .header-menu-container > ul > li > a::after { left: .6em; right: .6em; }
}
@media (max-width: 1380px) {
	#masthead .header-navigation .header-menu-container > ul > li > a { padding-left: .45em !important; padding-right: .45em !important; font-size: .98rem; }
	.header-html-inner { padding-left: 1.2rem; }
}

/* ---------- Footer: bloque fijo igual en todas las páginas ----------
   Todo naranja con degradé (oscuro en los dos bordes, más claro al centro), textura de puntitos en los dos costados
   (la de la derecha espejada: mismo ángulo pero al revés), textos en negrita y "¿Dudas con tu pedido?" a la derecha. */
.sutekka-footer { --margen: max(1.5rem, calc((100vw - 1290px) / 2 + 1.5rem)); margin-top: 4rem; border-top: 0; }
.sutekka-footer, .sutekka-footer h4 {
	font-family: 'Poppins', system-ui, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
.sutekka-footer-naranja {
	position: relative; isolation: isolate; overflow: hidden; color: #fdf7f2;
	background: linear-gradient(90deg, #bd3518 0%, #d4441f 28%, #dc4f25 50%, #d4441f 72%, #bd3518 100%);
	padding: 2.4rem var(--margen) 1.1rem;
}
.sutekka-footer-naranja::before, .sutekka-footer-naranja::after {
	content: ""; position: absolute; z-index: -1; pointer-events: none;
	left: -12%; top: -30%; width: 74%; height: 160%; background: #5e1505; opacity: .3;
	-webkit-mask: url(img/trama-textura.svg) 0 0 / 24px 48px, radial-gradient(closest-side, #000 35%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask: url(img/trama-textura.svg) 0 0 / 24px 48px, radial-gradient(closest-side, #000 35%, transparent 100%);
	mask-composite: intersect;
}
.sutekka-footer-naranja::after { left: auto; right: -12%; }
.sutekka-footer .sutekka-footer-grilla { max-width: none; margin: 0; padding: 0; grid-template-columns: 1.4fr .8fr 1fr 1.5fr; gap: 2rem; align-items: start; }
.sutekka-footer-logo { width: 182px; margin-bottom: .5rem; }
.sutekka-footer-marca p { font-size: .9rem; font-weight: 500; margin: 0; }
.sutekka-footer h4 { font-size: 1.08rem; font-weight: 800; letter-spacing: .06em; margin-bottom: .7rem; }
.sutekka-footer li { margin-bottom: .35rem; }
.sutekka-footer li a { font-size: .97rem; font-weight: 600; }
/* Redes: uno abajo del otro, ícono de línea + el dato al lado. */
.sutekka-footer .sutekka-redes { display: flex; flex-direction: column; gap: .7rem; margin: 1.2rem 0 0; }
.sutekka-footer .sutekka-redes li { margin: 0; }
.sutekka-footer .sutekka-redes a {
	display: inline-flex; align-items: center; gap: .65rem; width: auto; height: auto; background: none; border-radius: 0;
	font-size: .97rem; font-weight: 600;
}
.sutekka-footer .sutekka-redes svg {
	flex: none; width: 24px; height: 24px; fill: none; stroke: #fdf7f2; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
	shape-rendering: geometricPrecision;
}
.sutekka-footer .sutekka-redes svg .relleno { fill: #fdf7f2; stroke: none; }
.sutekka-footer .sutekka-arrepentimiento { display: inline-block; margin-top: .9rem; padding: .4rem .8rem; font-size: .82rem; }
.sutekka-footer .sutekka-footer-base {
	display: block; max-width: none; margin: 1.6rem 0 0; padding: .9rem 0 0; border-top: 1px solid rgba(255, 255, 255, .3);
	text-align: center; font-size: .95rem; font-weight: 600; color: #fdf7f2;
}
/* Columna del local: mapa (OpenStreetMap con pin, abre Google Maps), dirección y horarios. */
.sutekka-footer .sutekka-mapa {
	position: relative; display: block; max-width: 320px; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 12px;
	border: 3px solid #fdf7f2; box-shadow: 0 8px 20px rgba(0, 0, 0, .25); transition: transform .2s;
}
.sutekka-footer .sutekka-mapa:hover { transform: translateY(-2px); }
/* El iframe es más alto que la caja y está corrido para arriba: así se esconde el cartel blanco que Google pone arriba a
   la izquierda y el pin queda en el centro. No recibe clics: los toma el link. */
.sutekka-mapa iframe { position: absolute; left: 0; top: -110px; width: 100%; height: calc(100% + 220px); border: 0; pointer-events: none; }
.sutekka-footer-panel .sutekka-local { margin: 1rem 0 0; font-size: 1rem; line-height: 1.6; }
.sutekka-footer-panel .sutekka-local strong { font-weight: 700; }
@media (max-width: 1000px) {
	.sutekka-footer .sutekka-footer-grilla { grid-template-columns: 1fr 1fr; }
	.sutekka-footer-panel { grid-column: 1 / -1; }
}

/* ---------- Menú Stickers: "Por temática" | "Por material" | "Formato" (scripts/configurar-menu-materiales.php) ----------
   Todas las columnas de 4 filas para que queden parejas; títulos más grandes y con aire. */
.header-navigation .header-menu-container li.menu-item:hover > ul.sub-menu:has(> li.sutekka-menu-columna),
.header-navigation .header-menu-container li.menu-item:focus-within > ul.sub-menu:has(> li.sutekka-menu-columna),
.header-navigation .header-menu-container li.menu-item--toggled-on > ul.sub-menu:has(> li.sutekka-menu-columna) {
	display: flex !important; flex-direction: row !important; gap: 0; padding: 1.5rem 1rem 1.3rem;
}
.header-navigation .header-menu-container li.sutekka-menu-columna { position: static; padding: 0 1.1rem; }
/* Abre alineado con "Stickers"; si no entra en la pantalla, menu.js lo corre a la izquierda lo justo. */
.header-navigation .header-menu-container ul.sub-menu:has(> li.sutekka-menu-columna) { right: auto; }
.header-navigation .header-menu-container li.sutekka-menu-columna + li.sutekka-menu-columna { border-left: 1px solid #e8e1d6; }
.header-navigation .header-menu-container ul ul li.sutekka-menu-columna > a {
	font-size: .92rem !important; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: #111 !important;
	padding: 0 .8em .9rem !important; margin-bottom: .5rem; border-bottom: 2px solid var(--sutekka-naranja); width: auto !important; display: inline-block;
}
.header-navigation .header-menu-container ul ul li.sutekka-menu-columna > a:hover { color: var(--sutekka-naranja) !important; background: transparent !important; }
.header-navigation li.sutekka-menu-columna > a .dropdown-nav-toggle { display: none; }
.header-navigation li.sutekka-menu-columna > a .nav-drop-title-wrap { padding-right: 0; }
.header-navigation .header-menu-container ul ul li.sutekka-menu-columna > ul.sub-menu {
	position: static; display: grid !important; opacity: 1; visibility: visible; clip: auto; height: auto; overflow: visible;
	transform: none; box-shadow: none; padding: 0; min-height: 0; border-radius: 0; border-top: 0; background: transparent !important;
	grid-auto-flow: column; grid-template-rows: repeat(4, auto); gap: 0 .4rem;
}
.header-navigation .header-menu-container ul ul li.sutekka-menu-columna > ul.sub-menu li.menu-item > a { padding: .45em .8em !important; font-size: .98rem; }
/* Íconos del desplegable (menu.php): un sticker por temática, una muestrita del acabado por material. */
.header-navigation .header-menu-container ul ul li.sutekka-menu-columna > ul.sub-menu li.menu-item > a { display: flex; align-items: center; gap: .6rem; }
.sutekka-menu-icono { width: 30px; height: 30px; object-fit: contain; flex: none; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .2)); transition: transform .2s; }
.header-navigation li.menu-item > a:hover .sutekka-menu-icono { transform: rotate(-8deg) scale(1.12); }
.sutekka-muestra { width: 22px; height: 22px; border-radius: 50%; flex: none; margin: 0 4px; box-shadow: 0 1px 3px rgba(0, 0, 0, .25), inset 0 0 0 1px rgba(0, 0, 0, .08); }
.sutekka-muestra-holografico { background: conic-gradient(from 30deg, #ff9de2, #ffe08a, #9dffc3, #8ad8ff, #c3a3ff, #ff9de2); }
.sutekka-muestra-prismatico { background: repeating-conic-gradient(from 10deg, #ff6fcf 0 15deg, #fff 15deg 30deg, #57d7ff 30deg 45deg, #ffe06e 45deg 60deg); }
.sutekka-muestra-dorado { background: linear-gradient(135deg, #8a5a10, #ffd766 40%, #fff3c4 50%, #d6a020 62%, #7a4f0c); }
.sutekka-muestra-laca-sectorizada { background: radial-gradient(circle at 32% 28%, #fff 0 18%, transparent 30%), linear-gradient(135deg, #ececec, #bdbdbd); }
.sutekka-muestra-laca-brillante { background: linear-gradient(120deg, transparent 38%, #fff 48%, transparent 58%), linear-gradient(135deg, #f2f2f2, #c9c9c9); }
.sutekka-muestra-transparente { background: repeating-conic-gradient(#e2e2e2 0 25%, #fff 0 50%) 0 0 / 8px 8px; }
.sutekka-muestra-atrapasol { background: radial-gradient(circle, #fff 0 15%, #ffe86e 30%, #ff9a6e 48%, #d77bff 66%, #6ec8ff 84%); }
.sutekka-muestra-dtf-uv { background: radial-gradient(circle at 35% 30%, #a98bff, #3b1f8f 70%); }

/* ---------- Hero de la home con dos banners (slider.js) ---------- */
.sutekka-slider-caja { position: relative; overflow: hidden; isolation: isolate; }
.sutekka-slider { position: relative; z-index: 0; } /* todo lo de adentro queda debajo de las flechas */
.sutekka-slider {
	display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
	width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; cursor: grab;
}
.sutekka-slider::-webkit-scrollbar { display: none; }
.sutekka-slider.arrastrando { scroll-snap-type: none; cursor: grabbing; user-select: none; }
.sutekka-slider.moviendo { scroll-snap-type: none; }
.sutekka-slider { scroll-behavior: auto !important; }
.sutekka-slider > .wp-block-group__inner-container { display: contents; }
.sutekka-slider .sutekka-slide {
	flex: 0 0 100%; width: 100% !important; max-width: 100% !important; min-height: 600px; margin: 0 !important;
	scroll-snap-align: start; scroll-snap-stop: always;
}
.sutekka-slider-puntos { position: absolute; left: 50%; bottom: 1.1rem; transform: translateX(-50%); display: flex; gap: .5rem; z-index: 5; }
.sutekka-slider-puntos button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .5); cursor: pointer; transition: width .3s, background .3s; }
.sutekka-slider-puntos button.activo { width: 26px; background: #fff; }
/* Flechas: sólo el trazo, finas y altas, sin círculo. */
.sutekka-slider-flecha {
	position: absolute; top: 50%; z-index: 5; width: 44px; height: 72px; margin-top: -36px; padding: 0; border: 0;
	background: none; color: #fff; cursor: pointer; opacity: .9; transition: opacity .2s, transform .2s;
	filter: drop-shadow(0 0 1px #000) drop-shadow(0 0 1px #000) drop-shadow(0 0 6px rgba(0, 0, 0, .85));
}
.sutekka-slider-flecha:hover, .sutekka-slider-flecha:focus, .sutekka-slider-flecha:active { opacity: 1; background: none !important; box-shadow: none !important; outline: none; }
.sutekka-slider-flecha:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.sutekka-slider-flecha svg { width: 22px; height: 44px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.sutekka-slider-flecha.anterior { left: 10px; }
.sutekka-slider-flecha.siguiente { right: 10px; }
.sutekka-slider-flecha.anterior:hover { transform: translateX(-3px); }
.sutekka-slider-flecha.siguiente:hover { transform: translateX(3px); }
.sutekka-slider-caja.tono-claro .sutekka-slider-flecha { color: #111; filter: none; }
.sutekka-slider-caja.tono-claro .sutekka-slider-puntos button { background: rgba(0, 0, 0, .2); }
.sutekka-slider-caja.tono-claro .sutekka-slider-puntos button.activo { background: #111; }
@media (hover: none) { .sutekka-slider-flecha { display: none; } }

/* Banner 2: cómo armar tus stickers. Papel crema y una plancha de corte verde con el mismo diseño en 3 medidas y cortes. */
.sutekka-slide-armador {
	position: relative; display: flex; align-items: center; color: #1a1a1a; background: #f3ede4; --tinta: 26, 26, 26;
	background-image: linear-gradient(rgba(var(--tinta), .045) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--tinta), .045) 1px, transparent 1px);
	background-size: 32px 32px;
	padding: 3rem max(4.5rem, calc((100vw - 1240px) / 2));
}
.sutekka-armador-banner { display: grid; grid-template-columns: 1fr 1.05fr; gap: 3.5rem; align-items: center; width: 100%; max-width: 1240px; margin: 0 auto; }
.sutekka-antetitulo { margin: 0 0 .6rem; font-size: .82rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--sutekka-naranja); }
.sutekka-armador-banner h2 { font-family: 'Poppins', system-ui, sans-serif; font-size: clamp(2.2rem, 4vw, 3.4rem); line-height: 1.04; font-weight: 800; letter-spacing: -.02em; color: #111; margin: 0 0 .9rem; }
.sutekka-bajada { font-size: 1.08rem; color: #444; max-width: 30rem; margin: 0 0 1.4rem; }
.sutekka-specs { margin: 0 0 1.8rem; border-top: 1px solid #d9cfc1; }
.sutekka-specs > div { display: grid; grid-template-columns: 6.5rem 1fr; gap: 1rem; padding: .62rem 0; border-bottom: 1px solid #d9cfc1; align-items: center; }
.sutekka-specs dt { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #777; }
.sutekka-specs dd { margin: 0; font-size: .98rem; color: #222; display: flex; align-items: center; flex-wrap: wrap; gap: .1rem .35rem; }
.sutekka-specs strong { font-weight: 700; color: #111; }
.sutekka-muestras { display: inline-flex; margin-right: .45rem; }
.sutekka-muestras .sutekka-muestra { width: 18px; height: 18px; margin: 0 -3px 0 0; border: 2px solid #f3ede4; }
.sutekka-muestra-blanco { background: #fff; }
.sutekka-armador-acciones { display: flex; align-items: center; flex-wrap: wrap; gap: 1.4rem; }
.sutekka-boton-negro {
	display: inline-block; background: #111; color: #fff !important; padding: .9rem 1.6rem; border-radius: 999px; font-weight: 700;
	text-decoration: none !important; transition: transform .2s, background .2s;
}
.sutekka-boton-negro:hover { background: #2a2a2a; transform: translateY(-2px); }
.sutekka-link-poster { color: #111 !important; font-weight: 600; text-decoration: underline !important; text-underline-offset: 3px; }

/* La plancha: 17 x 12 cm de cuadrícula (cada cuadradito = 1 cm), así los stickers quedan a escala entre sí. */
.sutekka-plancha {
	position: relative; aspect-ratio: 17 / 12; border-radius: 14px; background-color: #2e6b52;
	background-image:
		linear-gradient(rgba(255, 255, 255, .22) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .22) 1px, transparent 1px),
		linear-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .08) 1px, transparent 1px);
	background-size: calc(100% / 17 * 5) calc(100% / 12 * 5), calc(100% / 17 * 5) calc(100% / 12 * 5), calc(100% / 17) calc(100% / 12), calc(100% / 17) calc(100% / 12);
	box-shadow: 0 20px 40px rgba(60, 40, 20, .18), inset 0 0 0 1px rgba(0, 0, 0, .15);
}
.sutekka-plancha figure { position: absolute; margin: 0; display: flex; flex-direction: column; align-items: center; }
.sutekka-plancha img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .35)); }
.sutekka-plancha figcaption {
	display: inline-flex; align-items: baseline; gap: .4rem; margin-top: .6rem; padding: .3rem .75rem; border-radius: 999px; background: #17171c; color: #fff;
	font: 600 .7rem/1 'Poppins', system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; box-shadow: 0 4px 10px rgba(0, 0, 0, .3);
}
.sutekka-plancha figcaption b { font-size: .86rem; font-weight: 800; letter-spacing: 0; color: #ffd23f; }
.sutekka-plancha figcaption i { font-style: normal; color: #d8d8e0; }
.sutekka-plancha .s8 { left: calc(100% / 17 * .9); top: calc(100% / 12 * .8); width: calc(100% / 17 * 6.4); }
.sutekka-plancha .s8 img { height: auto; aspect-ratio: 6.4 / 8; transform: rotate(-5deg); }
.sutekka-plancha .s6 { left: calc(100% / 17 * 10.2); top: calc(100% / 12 * .7); width: calc(100% / 17 * 6); }
.sutekka-plancha .s4 { left: calc(100% / 17 * 8); top: calc(100% / 12 * 6.9); width: calc(100% / 17 * 4); }
.sutekka-plancha figure > span { display: block; width: 100%; aspect-ratio: 1; background: #fff; padding: 12%; box-shadow: 0 6px 10px rgba(0, 0, 0, .3); }
.sutekka-plancha figure > span img { filter: none; }
/* Muestras genéricas "tu logo aquí" (SVG con degradé prismático) para los tres cortes. */
.sutekka-plancha figure svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .35)); }
.sutekka-plancha .s8 svg { transform: rotate(-5deg); }
.sutekka-plancha .s6 svg { transform: rotate(4deg); }
.sutekka-plancha .s4 svg { transform: rotate(-8deg); }
.sutekka-plancha .cuadrado { border-radius: 10%; transform: rotate(4deg); }
.sutekka-plancha .circular { border-radius: 50%; transform: rotate(-8deg); }
/* Etiqueta de precios, como un papelito apoyado en la plancha. */
.sutekka-etiqueta {
	position: absolute; right: calc(100% / 17 * .5); bottom: calc(100% / 12 * .5); width: calc(100% / 17 * 4.4); display: grid; gap: .1rem; padding: .8rem .9rem .6rem;
	background: #fffdf8; border-radius: 10px; font: 500 .8rem/1.2 'Poppins', system-ui, sans-serif; color: #333; transform: rotate(2deg); box-shadow: 0 10px 22px rgba(0, 0, 0, .3);
}
.sutekka-etiqueta::before { content: ""; position: absolute; left: 50%; top: -9px; width: 54px; height: 18px; margin-left: -27px; background: rgba(255, 210, 63, .85); transform: rotate(-3deg); }
.sutekka-etiqueta header { display: grid; padding-bottom: .5rem; margin-bottom: .2rem; border-bottom: 1px dashed #d9cfc1; }
.sutekka-etiqueta header b { font-size: .95rem; font-weight: 800; color: #111; }
.sutekka-etiqueta header small { font-size: .7rem; color: #888; }
.sutekka-etiqueta span { display: flex; align-items: baseline; gap: .4rem; white-space: nowrap; }
.sutekka-etiqueta span b { font-weight: 600; color: #555; }
.sutekka-etiqueta span em { flex: 1; border-bottom: 2px dotted #cfc6b8; transform: translateY(-3px); }
.sutekka-etiqueta span strong { font-size: 1.02rem; font-weight: 800; color: #111; }
.sutekka-etiqueta span:last-of-type strong { color: #2e6b52; }
@media (max-width: 1100px) { .sutekka-etiqueta { display: none; } }

/* Marcas de imprenta de fondo (banners 2 y 3): marcas de corte en las esquinas, registro, barras CMYK y ficha técnica. */
.sutekka-imprenta { position: absolute; inset: 0; pointer-events: none; color: rgba(var(--tinta), .38); }
.sutekka-imprenta .corte { position: absolute; width: 34px; height: 34px; }
.sutekka-imprenta .corte::before, .sutekka-imprenta .corte::after { content: ""; position: absolute; background: currentColor; }
.sutekka-imprenta .corte::before { width: 22px; height: 1px; }
.sutekka-imprenta .corte::after { width: 1px; height: 22px; }
.sutekka-imprenta .ai { left: 22px; top: 22px; } .sutekka-imprenta .ai::before { left: -12px; top: 12px; } .sutekka-imprenta .ai::after { left: 12px; top: -12px; }
.sutekka-imprenta .ad { right: 22px; top: 22px; } .sutekka-imprenta .ad::before { right: -12px; top: 12px; } .sutekka-imprenta .ad::after { right: 12px; top: -12px; }
.sutekka-imprenta .bi { left: 22px; bottom: 22px; } .sutekka-imprenta .bi::before { left: -12px; bottom: 12px; } .sutekka-imprenta .bi::after { left: 12px; bottom: -12px; }
.sutekka-imprenta .bd { right: 22px; bottom: 22px; } .sutekka-imprenta .bd::before { right: -12px; bottom: 12px; } .sutekka-imprenta .bd::after { right: 12px; bottom: -12px; }
.sutekka-imprenta .registro { position: absolute; left: 50%; top: 14px; width: 26px; height: 26px; margin-left: -13px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.sutekka-imprenta .cmyk { position: absolute; left: 60px; bottom: 18px; display: flex; gap: 2px; opacity: .8; }
.sutekka-imprenta .cmyk b { width: 13px; height: 13px; }
.sutekka-imprenta .c { background: #00aeef; } .sutekka-imprenta .m { background: #ec008c; } .sutekka-imprenta .y { background: #fff200; }
.sutekka-imprenta .k { background: #111; } .sutekka-imprenta .k75 { background: #404040; } .sutekka-imprenta .k50 { background: #808080; } .sutekka-imprenta .k25 { background: #bfbfbf; }
.sutekka-imprenta .ficha { position: absolute; right: 64px; top: 18px; font: 600 .66rem/1 ui-monospace, Consolas, monospace; letter-spacing: .12em; }

/* Banner 3: mayoristas. Fondo carbón con las mismas marcas en blanco; un sobre kraft con stickers asomando. */
.sutekka-slide-mayorista { --tinta: 255, 255, 255; background-color: #1c1b19; color: #f3f3f3; }
.sutekka-slide-mayorista h2 { color: #fff; font-size: clamp(2rem, 3.4vw, 3rem); }
.sutekka-slide-mayorista .sutekka-bajada { color: #cfcfcf; }
.sutekka-slide-mayorista .sutekka-specs, .sutekka-slide-mayorista .sutekka-specs > div { border-color: rgba(255, 255, 255, .16); }
.sutekka-slide-mayorista .sutekka-specs dt { color: #9a9a9a; }
.sutekka-slide-mayorista .sutekka-specs dd, .sutekka-slide-mayorista .sutekka-specs strong { color: #f3f3f3; }
.sutekka-slide-mayorista .sutekka-boton-negro { background: #fff; color: #111 !important; }
.sutekka-slide-mayorista .sutekka-boton-negro:hover { background: #e9e9e9; }
.sutekka-slide-mayorista .sutekka-link-poster { color: #fff !important; }
.sutekka-pack { position: relative; width: min(100%, 440px); aspect-ratio: 1 / 1.05; margin: 0 auto; }
.sutekka-abanico { position: absolute; left: 6%; right: 6%; top: -4%; height: 62%; }
.sutekka-abanico img {
	position: absolute; left: 50%; bottom: 0; width: 42%; height: auto; margin-left: -21%; transform-origin: 50% 210%;
	filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .45));
}
.sutekka-abanico img:nth-child(1) { transform: rotate(-34deg); }
.sutekka-abanico img:nth-child(2) { transform: rotate(-17deg); }
.sutekka-abanico img:nth-child(3) { transform: translateY(-10%); }
.sutekka-abanico img:nth-child(4) { transform: rotate(17deg); }
.sutekka-abanico img:nth-child(5) { transform: rotate(34deg); }
.sutekka-sobre {
	position: absolute; left: 4%; right: 4%; bottom: 0; height: 46%; border-radius: 6px 6px 10px 10px; z-index: 1;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem; color: #3b2a16;
	background: linear-gradient(170deg, #d6b07a, #c39a5f 60%, #b88d52);
	box-shadow: 0 22px 40px rgba(0, 0, 0, .5), inset 0 2px 0 rgba(255, 255, 255, .25);
}
.sutekka-sobre::before { /* la solapa del sobre */
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 26%; border-radius: 6px 6px 0 0;
	background: linear-gradient(#c79f66, #bb9058); clip-path: polygon(0 0, 100% 0, 100% 40%, 50% 100%, 0 40%);
}
.sutekka-sobre > * { position: relative; }
.sutekka-sobre-marca { font-family: 'Poppins', system-ui, sans-serif; font-weight: 800; font-size: .8rem; letter-spacing: .3em; text-transform: uppercase; opacity: .7; margin-top: 1.4rem; }
.sutekka-sobre strong { font-family: 'Poppins', system-ui, sans-serif; font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 800; line-height: 1; }
.sutekka-sobre span:last-child { font: 700 .95rem ui-monospace, Consolas, monospace; padding: .25rem .6rem; border: 1.5px dashed rgba(59, 42, 22, .55); border-radius: 4px; }
@media (max-width: 900px) {
	.sutekka-imprenta .ficha, .sutekka-imprenta .registro { display: none; }
	.sutekka-pack { width: min(100%, 320px); }
}
@media (max-width: 900px) {
	.sutekka-slider .sutekka-slide { min-height: 0; }
	.sutekka-slide-armador { padding: 2.5rem 1.25rem 3.5rem; }
	.sutekka-armador-banner { grid-template-columns: 1fr; gap: 2rem; }
	.sutekka-specs > div { grid-template-columns: 5.2rem 1fr; }
	.sutekka-plancha figcaption { font-size: .62rem; }
}

/* ---------- Banner de temporada: Halloween (primero del hero, se va solo el 01/11 por data-hasta) ---------- */
.sutekka-slide-halloween {
	position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; text-align: center; color: #fff;
	background: radial-gradient(ellipse 70% 55% at 50% 100%, rgba(255, 122, 26, .38), transparent 70%), linear-gradient(#17141c 0%, #26202a 55%, #4a2a12 100%);
}
.hw-defs { position: absolute; }
.hw-texto { position: relative; z-index: 3; padding: 0 1.5rem 7rem; }
.hw-ante, .hw-fechas { margin: 0; font-family: 'Poppins', system-ui, sans-serif; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; color: #f1ece4; }
.hw-ante { font-size: clamp(.85rem, 1.4vw, 1.15rem); }
.hw-fechas { font-size: clamp(.8rem, 1.3vw, 1.1rem); }
/* El título es un sticker: letras naranjas con borde blanco troquelado, apenas torcido. */
.hw-titulo {
	margin: .6rem 0 1.1rem; font-family: 'Rubik Wet Paint', 'Poppins', system-ui, sans-serif; font-weight: 400; line-height: .95;
	font-size: clamp(3rem, 8.2vw, 7rem); color: #ff7a1a; letter-spacing: .02em; transform: rotate(-3deg);
	-webkit-text-stroke: .14em #fff; paint-order: stroke fill; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .55));
}
.hw-luna { position: absolute; left: 50%; top: 9%; width: min(34vw, 420px); aspect-ratio: 1; margin-left: max(-17vw, -210px); border-radius: 50%; background: radial-gradient(circle, rgba(255, 214, 150, .16), transparent 62%); }
.hw-telarana { position: absolute; right: 0; top: 0; width: min(22vw, 260px); fill: none; stroke: rgba(255, 255, 255, .28); stroke-width: 1.2; }
.hw-sticker { position: absolute; z-index: 2; overflow: visible; filter: url(#hw-troquel) drop-shadow(0 8px 10px rgba(0, 0, 0, .5)); transition: transform .3s cubic-bezier(.3, 1.6, .5, 1); }
.hw-sticker:hover { transform: rotate(var(--r)) translateY(-6px) scale(1.06); }
.hw-sticker, .hw-boo { transform: rotate(var(--r)); }
.hw-s1 { --r: -12deg; left: 8%; top: 18%; width: min(13vw, 170px); }
.hw-s2 { --r: 9deg; right: 11%; top: 30%; width: min(10vw, 130px); }
.hw-s3 { --r: -8deg; left: 22%; top: 9%; width: min(9vw, 120px); }
.hw-s4 { --r: 14deg; right: 26%; top: 8%; width: min(6vw, 80px); }
.hw-s5 { --r: 10deg; right: 5%; bottom: 30%; width: min(8vw, 100px); }
/* Sticker holográfico "BOO!" (el material que más venden). */
.hw-boo {
	--r: -9deg; position: absolute; z-index: 2; left: 12%; bottom: 33%; padding: .3em .55em; border: 5px solid #fff; border-radius: 14px;
	font: 800 clamp(1.1rem, 2.2vw, 1.9rem)/1 'Poppins', system-ui, sans-serif; color: #2b1840; letter-spacing: .04em;
	background: linear-gradient(115deg, #ffc6f0, #b9f3ff, #d9c2ff, #fff1a8, #ffc6f0) 0 0 / 300% 100%;
	box-shadow: 0 8px 14px rgba(0, 0, 0, .45); animation: hw-holo 6s linear infinite;
}
@keyframes hw-holo { to { background-position: 300% 0; } }
.hw-suelo { position: absolute; left: 0; bottom: 0; width: 100%; height: 34%; fill: #0b090c; z-index: 1; }
/* Cintas cruzadas abajo, con el texto corriendo. */
.hw-cinta { position: absolute; left: -10%; width: 120%; z-index: 4; overflow: hidden; white-space: nowrap; box-shadow: 0 4px 10px rgba(0, 0, 0, .4); }
.hw-cinta > div { display: inline-flex; animation: hw-cinta 60s linear infinite; }
.hw-cinta span { padding: .45rem .5rem; font: 800 clamp(.72rem, 1.1vw, .95rem)/1 'Poppins', system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; }
.hw-cinta-a { bottom: 15%; background: #6a1fb0; color: #ffb36b; transform: rotate(-3.5deg); }
.hw-cinta-b { bottom: 8%; background: #f9a45c; color: #4a137f; transform: rotate(3deg); }
.hw-cinta-b > div { animation-direction: reverse; }
@keyframes hw-cinta { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .hw-cinta > div, .hw-boo { animation: none; } }
@media (max-width: 900px) {
	.sutekka-slide-halloween { min-height: 480px !important; }
	.hw-texto { padding-bottom: 5.5rem; }
	.hw-s1 { width: 86px; left: 4%; top: 6%; } .hw-s2 { width: 64px; right: 6%; top: 10%; }
	.hw-s3, .hw-s4, .hw-s5, .hw-boo { display: none; }
	.hw-telarana { width: 120px; opacity: .6; }
}

/* Logo de Halloween animado en el header (mismo ancho que el logo normal en cada medida de Kadence). */
.site-branding a.brand .sutekka-logo-hw { display: block; width: 220px; height: auto; overflow: visible; }
@media (max-width: 1024px) { .site-branding a.brand .sutekka-logo-hw { width: 170px; } }
@media (max-width: 767px) { .site-branding a.brand .sutekka-logo-hw { width: 130px; } }

/* Barra de envío gratis (carrito, checkout y mini-carrito) */
.sutekka-envio-gratis { margin: 0 0 1.2em; padding: .8em 1em; border-radius: 12px; background: #f6f3ff; font-size: .95em; }
.sutekka-envio-gratis p { margin: 0 0 .5em; }
.sutekka-envio-gratis .barra { height: 8px; border-radius: 8px; background: #e2dcf5; overflow: hidden; }
.sutekka-envio-gratis .barra span { display: block; height: 100%; border-radius: 8px; background: linear-gradient(90deg, #7c5cff, #ff6bd6, #ffd36b); transition: width .4s ease; }
.sutekka-envio-gratis.listo { background: #eafaf0; }

/* 404 propia: papel crema con cuadrícula, un sticker holográfico gigante medio despegado y confeti de stickers flotando */
.sutekka-404 {
	position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 78vh; padding: 3rem 1.2rem 4rem; text-align: center;
	background-color: #f3ede4; background-image: linear-gradient(rgba(26, 26, 26, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(26, 26, 26, .045) 1px, transparent 1px); background-size: 32px 32px;
}
.sutekka-404 > * { position: relative; z-index: 1; }
.sutekka-404-sticker {
	position: relative; width: min(64vw, 340px); aspect-ratio: 1; margin-bottom: 1.6rem; display: grid; place-items: center; border-radius: 34%; border: 9px solid #fff;
	background: linear-gradient(135deg, #ffc9ec, #cdbbff 24%, #b5eeff 46%, #d6ffd0 68%, #fff2b0 86%, #ffc4d6); box-shadow: 0 22px 40px rgba(60, 40, 20, .28);
	transform: rotate(-6deg); animation: sutekka-404-vaiven 5s ease-in-out infinite; overflow: hidden;
}
.sutekka-404-sticker::before { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .55) 48%, transparent 60%); background-size: 250% 100%; animation: sutekka-404-brillo 3.6s ease-in-out infinite; }
.sutekka-404-sticker::after { content: ""; position: absolute; right: 0; bottom: 0; width: 34%; aspect-ratio: 1; background: linear-gradient(315deg, #f3ede4 50%, #e6dccd 50%, #fff 100%); border-top-left-radius: 14px; box-shadow: -6px -6px 12px rgba(0, 0, 0, .18); }
.sutekka-404-sticker span { position: relative; font: 800 clamp(4.4rem, 17vw, 7.4rem)/1 'Poppins', system-ui, sans-serif; letter-spacing: -.05em; color: #2c2c3d; text-shadow: 0 3px 0 rgba(255, 255, 255, .7); }
.sutekka-404 h1 { margin: 0 0 .5rem; font-family: 'Poppins', system-ui, sans-serif; font-weight: 800; letter-spacing: -.02em; font-size: clamp(2rem, 5vw, 3rem); color: #111; }
.sutekka-404 p { margin: 0 0 1.6rem; font-size: 1.1rem; color: #444; }
.sutekka-404 .s { position: absolute; z-index: 0; width: 56px; height: 56px; border: 4px solid #fff; box-shadow: 0 8px 14px rgba(60, 40, 20, .22); animation: sutekka-404-flota 6s ease-in-out infinite; }
.sutekka-404 .s1 { left: 9%; top: 16%; border-radius: 50%; background: linear-gradient(135deg, #b5eeff, #cdbbff); }
.sutekka-404 .s2 { right: 11%; top: 12%; border-radius: 14px; background: linear-gradient(135deg, #ffc9ec, #fff2b0); transform: rotate(14deg); animation-delay: -2s; }
.sutekka-404 .s3 { left: 15%; bottom: 14%; width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg, #d6ffd0, #b5eeff); transform: rotate(-12deg); animation-delay: -4s; }
.sutekka-404 .s4 { right: 14%; bottom: 18%; width: 70px; height: 70px; border-radius: 50%; background: linear-gradient(135deg, #fff2b0, #ffc4d6); animation-delay: -1s; }
.sutekka-404 .s5 { right: 30%; top: 8%; width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, #cdbbff, #ffc9ec); animation-delay: -3s; }
@keyframes sutekka-404-vaiven { 50% { transform: rotate(-2deg) translateY(-8px); } }
@keyframes sutekka-404-brillo { from { background-position: 150% 0; } to { background-position: -100% 0; } }
@keyframes sutekka-404-flota { 50% { translate: 0 -14px; } }
@media (prefers-reduced-motion: reduce) { .sutekka-404-sticker, .sutekka-404-sticker::before, .sutekka-404 .s { animation: none; } }

/* Página de gracias */
.sutekka-gracias { max-width: 640px; margin: 0 0 2rem; padding: 1.4rem 1.6rem; border-radius: 12px; background: #f3ede4; }
.sutekka-gracias h2 { margin: 0 0 .6rem; font-family: 'Poppins', system-ui, sans-serif; font-weight: 800; font-size: 1.3rem; }
.sutekka-gracias ol { margin: 0 0 1rem 1.2rem; padding: 0; }
.sutekka-gracias li { margin-bottom: .35rem; }

/* Páginas legales (Privacidad y Términos): papel crema con cuadrícula y una tarjeta numerada por sección */
body.page-template-default:has(.sutekka-legal) .content-area, body:has(.sutekka-legal) .content-area { margin: 0; }
body:has(.sutekka-legal) #primary, body:has(.sutekka-legal) .site-main { background-color: #f3ede4; background-image: linear-gradient(rgba(26, 26, 26, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(26, 26, 26, .045) 1px, transparent 1px); background-size: 32px 32px; }
.sutekka-legal { counter-reset: legal; max-width: 760px; margin: 0 auto; padding: 1rem 0 3rem; }
.sutekka-legal section { margin-top: 1.2rem; padding: 1.2rem 1.5rem 1.1rem; background: #fff; border-radius: 16px; box-shadow: 0 10px 22px rgba(60, 40, 20, .08); }
.sutekka-legal h2 { counter-increment: legal; display: flex; align-items: center; gap: .8rem; margin: 0 0 .6rem; font: 800 1.2rem/1.2 'Poppins', system-ui, sans-serif; letter-spacing: -.01em; color: #111; }
.sutekka-legal h2::before {
	content: counter(legal); flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; border: 3px solid #fff;
	background: linear-gradient(135deg, #ffc9ec, #cdbbff 30%, #b5eeff 60%, #fff2b0); box-shadow: 0 2px 6px rgba(60, 40, 20, .3); font-size: .85rem; color: #2c2c3d;
}
.sutekka-legal section p, .sutekka-legal section ul { margin: 0 0 .5rem; padding-left: 2.8rem; color: #333; line-height: 1.6; }
.sutekka-legal section ul { padding-left: 4.2rem; }
.sutekka-legal li { margin-bottom: .3rem; }
.sutekka-legal a { color: #c9501a; font-weight: 600; }

/* CTA fijo en celu */
.sutekka-cta-movil { display: none; }
@media (max-width: 768px) {
	.sutekka-cta-movil {
		display: block; position: fixed; left: .8rem; right: 5rem; bottom: .8rem; z-index: 9980; padding: .85rem 1rem; border-radius: 999px; background: #111; color: #fff !important;
		font-weight: 700; text-align: center; text-decoration: none !important; box-shadow: 0 8px 20px rgba(0, 0, 0, .3); transition: transform .25s, opacity .25s;
	}
	.sutekka-cta-movil.oculto { transform: translateY(150%); opacity: 0; pointer-events: none; }
}

/* Estados de carga y de error de los formularios y botones */
button.loading, .button.loading, .sutekka-enviando { position: relative; pointer-events: none; opacity: .75; }
button.loading::after, .button.loading::after, .sutekka-enviando::after {
	content: ""; display: inline-block; width: .9em; height: .9em; margin-left: .55em; vertical-align: -.1em;
	border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: sutekka-giro .7s linear infinite;
}
@keyframes sutekka-giro { to { transform: rotate(360deg); } }
button:disabled, .button:disabled { cursor: not-allowed; opacity: .55; }
.woocommerce form .form-row.woocommerce-invalid input.input-text, .woocommerce form .form-row.woocommerce-invalid select, .woocommerce form .form-row.woocommerce-invalid textarea { border-color: #c62828 !important; box-shadow: 0 0 0 3px rgba(198, 40, 40, .15); }
.woocommerce form .form-row.woocommerce-invalid label { color: #c62828; }
.woocommerce form .form-row.woocommerce-validated input.input-text { border-color: #2e6b52; }
.woocommerce-error, .woocommerce-message, .woocommerce-info { border-radius: 10px !important; }
.woocommerce-error { border-top-color: #c62828 !important; background: #fdf0ef !important; }
.sa-error, .sutekka-error { margin: .5rem 0; padding: .6rem .8rem; border-radius: 8px; background: #fdf0ef; color: #a31515; font-size: .9rem; }
@media (prefers-reduced-motion: reduce) { button.loading::after, .sutekka-enviando::after { animation-duration: 2s; } }
body:has(.sutekka-legal) .entry, body:has(.sutekka-legal) .entry-content-wrap { background: transparent; box-shadow: none; }
body:has(.sutekka-legal) .entry-hero-container-inner, body:has(.sutekka-legal) .page-hero-section { background: #f3ede4; }
body:has(.sutekka-legal) .entry-hero-container-inner .entry-title { font-family: 'Poppins', system-ui, sans-serif; font-weight: 800; letter-spacing: -.02em; }
body:has(.sutekka-legal) .content-container { background: #f3ede4; }

/* Hero en celu: los banners 2 y 3 se compactan para que ninguno pase de ~una pantalla (el slider toma la altura del más alto). */
@media (max-width: 900px) {
	.sutekka-slide-armador { padding: 2rem 1.25rem 3rem; }
	.sutekka-slide-armador .sutekka-bajada, .sutekka-slide-armador:not(.sutekka-slide-mayorista) .sutekka-specs { display: none; }
	.sutekka-slide-armador h2 { font-size: 2rem; margin-bottom: 1rem; }
	.sutekka-slide-mayorista .sutekka-specs > div:nth-child(n+3) { display: none; }
	.sutekka-slide-mayorista .sutekka-specs { margin-bottom: 1.2rem; }
	.sutekka-slide-mayorista .sutekka-pack { width: min(100%, 250px); }
	.sutekka-armador-banner { gap: 1.4rem; }
	.sutekka-plancha .s4 { left: calc(100% / 17 * 6.6); top: calc(100% / 12 * 7.2); }
	.sutekka-plancha figcaption { margin-top: .35rem; padding: .22rem .5rem; font-size: .54rem; }
	.sutekka-plancha figcaption b { font-size: .7rem; }
}

/* Tienda en celu: de a dos productos por fila (de a uno son 909 pantallas largas). */
@media (max-width: 600px) {
	.woocommerce ul.products.product-archive { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: .7rem !important; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: .85rem; line-height: 1.25; }
	.woocommerce ul.products li.product .product-details { padding: .6rem .7rem .8rem; }
}