/* ==========================================================================
   UnikaWeb Studio — estructura del theme
   Header, menú a pantalla completa, footer y plantillas (portada, páginas,
   blog, post, tienda, contacto, 404) y piezas de las páginas de Divi.
   ========================================================================== */

:root {
	--ukst-container: 1440px;
	--ukst-side: clamp(16px, 4vw, 60px);
	/* --ukst-logo-h y el resto de valores del panel están en main.css: los ajustes guardados
	   se imprimen justo después de ese archivo y no deben redefinirse aquí. */
	--ukst-section: clamp(64px, 9vw, 140px);
}

/* Divi mete paddings/ anchos en sus contenedores: aquí mandamos nosotros */
body.ukst #page-container { padding-top: 0 !important; overflow: clip; }
/* Lienzo del editor de Divi: ahí se pinta el header de Divi (fijo). Se deja en su sitio
   para que no tape la primera sección de la página. */
body.ukst-vb-canvas #top-header,
body.ukst-vb-canvas #main-header { position: relative !important; top: auto !important; }
/* En el lienzo se ve el pie del theme, no el de Divi. */
body.ukst-vb-canvas #main-footer,
body.ukst-vb-canvas .et_pb_scroll_top { display: none !important; }
body.ukst #et-main-area { background: transparent; }
body.ukst .ukst-main > #main-content { background: transparent; }
body.ukst .ukst-main > #main-content .container { width: auto; max-width: none; padding-top: 0; }
body.ukst .ukst-main > #main-content .container::before { display: none; }

.ukst-container {
	width: 100%;
	max-width: calc(var(--ukst-container) + var(--ukst-side) * 2);
	margin-inline: auto;
	padding-inline: var(--ukst-side);
	box-sizing: border-box;
}
.ukst-container--narrow { max-width: calc(820px + var(--ukst-side) * 2); }
.ukst-section { padding-block: var(--ukst-section); }
.ukst-section--tight { padding-block: calc(var(--ukst-section) / 2); }
.ukst-center { margin-top: 40px; text-align: center; }

.ukst-section__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: clamp(28px, 4vw, 56px);
}
.ukst .ukst-section__title { margin: 0; padding: 0; font-size: clamp(36px, 4.5vw, 64px); line-height: .9; }
.ukst .ukst-section__title--xl { font-size: clamp(56px, 10vw, 160px); line-height: .82; }
.ukst .ukst-section__title--sm { font-size: clamp(26px, 2.6vw, 36px); }

.ukst-skip {
	position: absolute;
	left: 16px; top: -100px;
	z-index: 100002;
	padding: 12px 18px;
	background: var(--ukst-accent);
	color: var(--ukst-accent-ink) !important;
	font-weight: 700;
}
.ukst-skip:focus { top: 16px; }
.ukst-admin-hint { padding: 20px; border: 1px dashed var(--ukst-line); color: var(--ukst-muted); font-size: 14px; }

/* Botón claro (sobre fotos / fondos oscuros) */
.ukst .ukst-btn--light { background: var(--ukst-bg) !important; border-color: var(--ukst-bg) !important; color: var(--ukst-ink) !important; }
.ukst .ukst-btn--light:hover { color: var(--ukst-accent-ink) !important; border-color: var(--ukst-accent) !important; }

/* --------------------------------------------------------------------------
   Header: barra blanca translúcida con desenfoque, iconos redondos y botón
   "Menú" naranja en forma de píldora.
   ----------------------------------------------------------------------- */
.ukst .ukst-site-header {
	border-bottom: 0;
	background: color-mix(in srgb, var(--ukst-surface) 82%, transparent) !important;
	-webkit-backdrop-filter: saturate(1.4) blur(14px);
	backdrop-filter: saturate(1.4) blur(14px);
}
.ukst .ukst-site-header.is-scrolled { box-shadow: 0 10px 30px -18px rgba(42, 45, 52, .35); }
.ukst-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
	max-width: calc(var(--ukst-container) + var(--ukst-side) * 2);
	min-height: var(--ukst-header-h);
	margin-inline: auto;
	padding-inline: var(--ukst-side);
}
.ukst-logo { display: inline-flex; align-items: center; gap: 12px; min-width: 0; color: var(--ukst-ink) !important; text-decoration: none; }
.ukst-logo--both .ukst-logo__text { font-size: min(calc(var(--ukst-logo-h) * .55), 6vw); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ukst-logo img { display: block; width: auto; height: var(--ukst-logo-h); max-width: 240px; object-fit: contain; }
.ukst-logo__text {
	font-family: var(--ukst-font-display);
	font-size: min(calc(var(--ukst-logo-h) * .68), 7vw);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.03em;
}
/* Punto naranja al final del logo de texto */
.ukst-logo__text::after { content: "."; color: var(--ukst-accent); }
.ukst-logo--light { color: #fff !important; }
.ukst-header__brand .ukst-logo--light { display: none; }
.ukst-header__brand { min-width: 0; }
.ukst-header__actions { flex-shrink: 0; gap: 6px !important; }
.ukst .ukst-header .ukst-header-icon {
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 50%;
	transition: background .3s, color .3s;
}
.ukst .ukst-header .ukst-header-icon:hover { background: color-mix(in srgb, var(--ukst-accent) 12%, transparent); color: var(--ukst-accent); }
.ukst .ukst-header .ukst-count { top: 2px; right: 0; }

/* Hamburguesa: píldora naranja con el texto y dos rayas */
.ukst-burger,
.ukst-overlay__close {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin-left: clamp(4px, 1vw, 14px);
	border: 0;
	background: none;
	color: inherit;
	font-family: var(--ukst-font-body);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
.ukst .ukst-burger {
	position: relative;
	min-height: 48px;
	padding: 0 16px 0 22px;
	border-radius: 999px;
	background: var(--ukst-accent);
	color: var(--ukst-accent-ink);
	box-shadow: 0 12px 24px -12px color-mix(in srgb, var(--ukst-accent) 90%, transparent);
	overflow: hidden;
	isolation: isolate;
	transition: transform .4s var(--ukst-ease), box-shadow .4s var(--ukst-ease);
}
.ukst .ukst-burger::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: var(--ukst-ink);
	transform: scale(0);
	transition: transform .5s var(--ukst-ease);
}
.ukst .ukst-burger:hover { transform: translateY(-2px); }
.ukst .ukst-burger:hover::before { transform: scale(1.05); }
.ukst .ukst-burger:not(:has(.ukst-burger__label)) { padding: 0; width: 48px; justify-content: center; }
.ukst-burger__lines {
	position: relative;
	display: block;
	width: 22px;
	height: 10px;
}
.ukst-burger__lines span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform .5s var(--ukst-ease), width .4s var(--ukst-ease), top .4s var(--ukst-ease);
}
.ukst-burger__lines span:first-child { top: 0; }
.ukst-burger__lines span:last-child { top: 8px; width: 60%; }
.ukst-burger:hover .ukst-burger__lines span:last-child { width: 100%; }
.ukst-burger__lines.is-open span { top: 4px; width: 100%; }
.ukst-burger__lines.is-open span:first-child { transform: rotate(45deg); }
.ukst-burger__lines.is-open span:last-child { transform: rotate(-45deg); }

/* Header transparente sobre el hero de la portada */
.ukst-header-over .ukst-site-header:not(.is-scrolled) { background: transparent !important; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }

/* --------------------------------------------------------------------------
   Menú a pantalla completa
   Se abre como un círculo que nace del botón "Menú" (main.js pone su centro),
   con manchas de color que flotan, una rejilla de puntos, un halo que sigue
   al cursor y cada enlace letra a letra. Sin efectos (Personalizar → Menú):
   cortina de abajo arriba y enlaces que suben.
   ----------------------------------------------------------------------- */
.ukst-overlay {
	--ukst-overlay-bg: var(--ukst-menu-bg, var(--ukst-ink));
	--ukst-overlay-fg: var(--ukst-menu-fg, #fff);
	--ukst-ox: calc(100% - 70px);
	--ukst-oy: 40px;
	position: fixed;
	inset: 0;
	z-index: 2147483000; /* por encima de la barra de admin y de cualquier capa de Divi */
	display: flex;
	flex-direction: column;
	color: var(--ukst-overlay-fg);
	background: var(--ukst-overlay-bg);
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	clip-path: inset(0 0 100% 0);
	transition: clip-path .8s cubic-bezier(.77, 0, .18, 1);
}
.ukst-menu-fx .ukst-overlay { clip-path: circle(0 at var(--ukst-ox) var(--ukst-oy)); transition: clip-path 1s cubic-bezier(.77, 0, .18, 1); }
/* Tamaño de los enlaces: el que quepa en la altura de la pantalla. */
.ukst-overlay {
	--ukst-menu-pad: clamp(20px, 5vh, 70px);
	--ukst-menu-reserve: calc(clamp(44px, 8vw, 130px) * 1.3);
	--ukst-menu-fit: calc((100vh - var(--ukst-header-h) - 2 * var(--ukst-menu-pad) - var(--ukst-menu-reserve)) / (var(--ukst-menu-n, 5) * 1.12));
}
@supports (height: 100svh) {
	.ukst-overlay { --ukst-menu-fit: calc((100svh - var(--ukst-header-h) - 2 * var(--ukst-menu-pad) - var(--ukst-menu-reserve)) / (var(--ukst-menu-n, 5) * 1.12)); }
}
@media (max-height: 900px) {
	.ukst-overlay { --ukst-menu-reserve: 16px; }
	.ukst .ukst-overlay__marquee { position: absolute; left: 0; right: 0; bottom: 0; z-index: 0; }
}
.ukst-overlay[hidden] { display: none; }
.ukst-overlay.is-open { clip-path: inset(0 0 0 0); }
.ukst-overlay.is-closing { clip-path: inset(100% 0 0 0); transition-duration: .6s; }
.ukst-menu-fx .ukst-overlay.is-open { clip-path: circle(150vmax at var(--ukst-ox) var(--ukst-oy)); }
.ukst-menu-fx .ukst-overlay.is-closing { clip-path: circle(0 at var(--ukst-ox) var(--ukst-oy)); transition-duration: .75s; }

.ukst-overlay__bg {
	position: fixed;
	inset: 0;
	z-index: -2;
	background: var(--ukst-overlay-img, none) center / cover no-repeat;
	opacity: .18;
	transform: scale(1.08);
	transition: transform 1.6s var(--ukst-ease);
}
.ukst-overlay.is-open .ukst-overlay__bg { transform: scale(1); }

/* Capa de efectos */
.ukst-overlay__fx { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; display: none; }
.ukst-menu-fx .ukst-overlay__fx { display: block; }
.ukst-blob {
	position: absolute;
	width: 46vmax;
	height: 46vmax;
	border-radius: 50%;
	filter: blur(70px);
	opacity: 0;
	transform: scale(.3);
	transition: opacity 1.2s var(--ukst-ease), transform 1.6s var(--ukst-ease);
	animation: ukst-blob 22s ease-in-out infinite alternate;
	animation-play-state: paused;
}
.ukst-blob--1 { top: -18vmax; right: -12vmax; background: var(--ukst-accent); }
.ukst-blob--2 { bottom: -22vmax; left: -14vmax; background: var(--ukst-pop-2); animation-duration: 26s; animation-delay: -6s; }
.ukst-blob--3 { top: 30%; left: 38%; width: 30vmax; height: 30vmax; background: var(--ukst-pop-1); animation-duration: 19s; animation-delay: -12s; }
.ukst-blob--4 { bottom: -10vmax; right: 18%; width: 26vmax; height: 26vmax; background: var(--ukst-alt); animation-duration: 24s; animation-delay: -3s; }
.ukst-overlay.is-open .ukst-blob { opacity: .38; transform: none; animation-play-state: running; }
.ukst-overlay.is-open .ukst-blob--3 { opacity: .22; }
.ukst-overlay.is-open .ukst-blob--4 { opacity: .2; }
@keyframes ukst-blob {
	0% { translate: 0 0; scale: 1; }
	33% { translate: 6vw -5vh; scale: 1.12; }
	66% { translate: -5vw 6vh; scale: .9; }
	100% { translate: 3vw 3vh; scale: 1.05; }
}
.ukst-overlay__dots {
	position: absolute;
	top: 12%;
	right: 6%;
	width: 220px;
	height: 160px;
	background: radial-gradient(circle, color-mix(in srgb, var(--ukst-overlay-fg) 40%, transparent) 2.5px, transparent 3px) 0 0 / 22px 22px;
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 1s var(--ukst-ease) .5s, transform 1.2s var(--ukst-ease) .5s;
}
.ukst-overlay.is-open .ukst-overlay__dots { opacity: .5; transform: none; animation: ukst-drift 9s ease-in-out infinite alternate; }
@keyframes ukst-drift { to { translate: -24px 18px; } }
/* Halo que sigue al cursor (main.js mueve --ukst-hx / --ukst-hy) */
.ukst-overlay__halo {
	position: absolute;
	left: 0;
	top: 0;
	width: 340px;
	height: 340px;
	margin: -170px 0 0 -170px;
	border-radius: 50%;
	background: radial-gradient(circle, color-mix(in srgb, var(--ukst-halo, var(--ukst-accent)) 55%, transparent) 0%, transparent 65%);
	opacity: 0;
	transform: translate3d(var(--ukst-hx, 50vw), var(--ukst-hy, 50vh), 0) scale(var(--ukst-hs, 1));
	transition: opacity .5s, background .5s;
	will-change: transform;
}
.ukst-overlay.has-cursor .ukst-overlay__halo { opacity: .55; }
@media (hover: none) { .ukst-overlay__halo { display: none; } }

.ukst-overlay__top {
	position: sticky; /* la X se queda arriba aunque el menú haga scroll */
	top: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	max-width: calc(var(--ukst-container) + var(--ukst-side) * 2);
	min-height: var(--ukst-header-h);
	margin-inline: auto;
	padding-inline: var(--ukst-side);
}
.ukst .ukst-overlay__close {
	flex-shrink: 0;
	justify-content: center;
	min-height: 48px;
	padding: 0 16px 0 22px;
	border: 1px solid color-mix(in srgb, var(--ukst-overlay-fg) 25%, transparent);
	border-radius: 999px;
	color: var(--ukst-overlay-fg) !important;
	opacity: 1 !important;
	visibility: visible !important;
	transition: background .3s, border-color .3s, color .3s;
}
.ukst .ukst-overlay__close .ukst-burger__lines { width: 20px; transition: transform .5s var(--ukst-ease); }
.ukst .ukst-overlay__close:hover,
.ukst .ukst-overlay__close:focus-visible { background: var(--ukst-overlay-fg); border-color: var(--ukst-overlay-fg); color: var(--ukst-overlay-bg) !important; }
.ukst .ukst-overlay__close:hover .ukst-burger__lines { transform: rotate(90deg); }
.ukst-overlay .ukst-logo { color: var(--ukst-overlay-fg) !important; min-width: 0; }

.ukst-overlay__body {
	flex: 1;
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
	align-items: center;
	gap: 40px clamp(32px, 6vw, 120px);
	width: 100%;
	max-width: calc(var(--ukst-container) + var(--ukst-side) * 2);
	margin-inline: auto;
	padding: var(--ukst-menu-pad) var(--ukst-side);
	position: relative;
	z-index: 1;
}

/* Lista principal */
.ukst-overlay__menu,
.ukst-overlay__menu .sub-menu { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.ukst-overlay__menu { counter-reset: ukst-menu; }
.ukst-overlay__menu > li {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 0 !important;
	counter-increment: ukst-menu;
}
.ukst-overlay__menu > li > a {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: .35em;
	padding: .06em 0;
	color: var(--ukst-overlay-fg) !important;
	font-family: var(--ukst-font-display);
	font-size: clamp(30px, min(7vw, var(--ukst-menu-fit)), 104px);
	font-weight: var(--ukst-display-weight);
	line-height: 1.04;
	letter-spacing: -.03em;
	text-transform: var(--ukst-heading-transform);
	text-decoration: none;
	clip-path: inset(-.2em -1em -.25em -.2em);
	transition: color .35s, opacity .35s;
}
/* Sin efectos: el enlace entero sube */
.ukst-overlay__menu > li > a > .ukst-ml {
	display: inline-block;
	transform: translateY(115%);
	transition: transform .9s cubic-bezier(.2, .8, .2, 1);
	transition-delay: calc(var(--i, 0) * 70ms + 250ms);
}
.ukst-overlay.is-open .ukst-overlay__menu > li > a > .ukst-ml { transform: none; }
/* Con efectos: letra a letra (main.js parte el texto en .ukst-ch) */
.ukst-overlay__menu .ukst-ch {
	display: inline-block;
	white-space: pre;
	transform: translateY(110%) rotate(12deg);
	transform-origin: 0 100%;
	transition: transform .8s cubic-bezier(.2, .9, .2, 1), color .3s;
	transition-delay: calc(var(--i, 0) * 80ms + var(--c, 0) * 22ms + 280ms), calc(var(--c, 0) * 25ms);
}
.ukst-overlay.is-open .ukst-overlay__menu .ukst-ch { transform: none; }
.ukst-menu-fx .ukst-overlay__menu > li > a > .ukst-ml { transform: none; transition: none; }
/* Hover: ola de letras con los colores del theme */
.ukst-overlay__menu > li > a:hover .ukst-ch,
.ukst-overlay__menu > li > a:focus-visible .ukst-ch {
	color: var(--ukst-chc, var(--ukst-accent));
	animation: ukst-wave .6s var(--ukst-ease) both;
	animation-delay: calc(var(--c, 0) * 30ms);
}
.ukst-overlay__menu .ukst-ch:nth-child(4n + 2) { --ukst-chc: var(--ukst-pop-1); }
.ukst-overlay__menu .ukst-ch:nth-child(4n + 3) { --ukst-chc: var(--ukst-pop-3); }
.ukst-overlay__menu .ukst-ch:nth-child(4n + 4) { --ukst-chc: var(--ukst-pop-2); }
@keyframes ukst-wave { 40% { transform: translateY(-.14em) rotate(-4deg); } }
/* Número del enlace */
.has-numbers .ukst-overlay__menu > li > a::before {
	content: counter(ukst-menu, decimal-leading-zero);
	align-self: flex-start;
	margin-top: .7em;
	padding: 4px 8px;
	border: 1px solid color-mix(in srgb, var(--ukst-overlay-fg) 25%, transparent);
	border-radius: 999px;
	font-family: var(--ukst-font-body);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	line-height: 1;
	color: color-mix(in srgb, var(--ukst-overlay-fg) 70%, transparent);
	transition: background .3s, border-color .3s, color .3s;
}
.has-numbers .ukst-overlay__menu > li > a:hover::before { background: var(--ukst-accent); border-color: var(--ukst-accent); color: var(--ukst-accent-ink); }
/* Flecha que entra al pasar */
.ukst-overlay__menu > li > a::after {
	content: "";
	width: .6em;
	height: .6em;
	margin-left: .1em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M8 6h10v10'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M8 6h10v10'/%3E%3C/svg%3E") center / contain no-repeat;
	color: var(--ukst-accent);
	opacity: 0;
	transform: translate(-.4em, .4em) scale(.6);
	transition: opacity .35s var(--ukst-ease), transform .45s var(--ukst-ease);
}
.ukst-overlay__menu > li > a:hover::after,
.ukst-overlay__menu > li > a:focus-visible::after { opacity: 1; transform: none; }
/* Al pasar por uno, los demás se apagan */
.ukst-overlay__menu:hover > li > a { opacity: .3; }
.ukst-overlay__menu > li > a:hover,
.ukst-overlay__menu > li > a:focus-visible { opacity: 1; }
.ukst-overlay__menu > li.current-menu-item > a,
.ukst-overlay__menu > li.current-menu-ancestor > a,
.ukst-overlay__menu > li.current_page_item > a { color: var(--ukst-accent) !important; }

/* Submenús */
.ukst-sub-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-left: 16px;
	border: 1px solid color-mix(in srgb, var(--ukst-overlay-fg) 30%, transparent);
	border-radius: 50%;
	background: none;
	color: var(--ukst-overlay-fg);
	cursor: pointer;
	transition: transform .4s var(--ukst-ease), background .3s, border-color .3s;
}
.ukst-sub-toggle .ukst-icon { width: 18px; height: 18px; }
.ukst-sub-toggle:hover { border-color: var(--ukst-accent); background: var(--ukst-accent); }
.ukst-sub-toggle[aria-expanded="true"] { transform: rotate(45deg); }
.ukst-overlay__menu .sub-menu {
	flex-basis: 100%;
	display: none;
	flex-wrap: wrap;
	gap: 8px;
	padding: 10px 0 18px !important;
	/* Divi posiciona los submenús en absolute: aquí no */
	position: static !important;
	visibility: visible !important;
	opacity: 1 !important;
	width: auto !important;
	background: none !important;
	box-shadow: none !important;
	border: 0 !important;
}
.ukst-overlay__menu li.is-sub-open > .sub-menu { display: flex; animation: ukst-rise .5s var(--ukst-ease); }
.ukst-overlay__menu .sub-menu li { padding: 0 !important; }
.ukst-overlay__menu .sub-menu a {
	display: inline-block;
	padding: 9px 16px !important;
	border: 1px solid color-mix(in srgb, var(--ukst-overlay-fg) 20%, transparent);
	border-radius: 999px;
	color: color-mix(in srgb, var(--ukst-overlay-fg) 85%, transparent) !important;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: background .3s, border-color .3s, color .3s;
}
.ukst-overlay__menu .sub-menu a:hover { background: var(--ukst-overlay-fg); border-color: var(--ukst-overlay-fg); color: var(--ukst-overlay-bg) !important; }

/* Tarjeta de información (cristal) */
.ukst-overlay__aside {
	display: grid;
	gap: 22px;
	padding: clamp(24px, 3vw, 36px);
	border: 1px solid color-mix(in srgb, var(--ukst-overlay-fg) 12%, transparent);
	border-radius: 28px;
	background: color-mix(in srgb, var(--ukst-overlay-fg) 6%, transparent);
	-webkit-backdrop-filter: blur(18px);
	backdrop-filter: blur(18px);
	opacity: 0;
	transform: translateY(40px) scale(.96);
	transition: opacity .8s var(--ukst-ease) .65s, transform 1s var(--ukst-ease) .65s;
}
.ukst-overlay.is-open .ukst-overlay__aside { opacity: 1; transform: none; }
.ukst-overlay__info .ukst-eyebrow { color: color-mix(in srgb, var(--ukst-overlay-fg) 55%, transparent); font-size: 12px; }
.ukst-overlay__info p { margin: 4px 0 0; padding: 0; font-size: 17px; line-height: 1.5; }
.ukst-overlay__info a { color: var(--ukst-overlay-fg) !important; }
.ukst-overlay__info a:hover { color: var(--ukst-accent) !important; }
.ukst .ukst-overlay__cta { justify-self: start; }
.ukst .ukst-overlay__cta .ukst-icon { width: 18px; height: 18px; transition: transform .4s var(--ukst-ease); }
.ukst .ukst-overlay__cta:hover .ukst-icon { transform: translateX(4px); }

.ukst-overlay__marquee { position: relative; z-index: 0; opacity: .08; pointer-events: none; }
.ukst-overlay__marquee .ukst-marquee--outline .ukst-marquee__item { -webkit-text-stroke-color: var(--ukst-overlay-fg); }
.ukst-overlay__marquee .ukst-marquee--outline .ukst-marquee__item:nth-child(even) { color: var(--ukst-overlay-fg); }

body.ukst-menu-open { overflow: hidden; }

/* --------------------------------------------------------------------------
   Redes y compartir
   ----------------------------------------------------------------------- */
.ukst .ukst-social { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0 !important; list-style: none !important; }
.ukst .ukst-social li { padding: 0 !important; }
.ukst .ukst-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--ukst-surface);
	color: var(--ukst-ink) !important;
	box-shadow: var(--ukst-shadow-sm);
	transition: background .3s, color .3s, transform .4s var(--ukst-ease);
}
.ukst .ukst-social svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ukst .ukst-social a:hover { background: var(--ukst-accent); color: var(--ukst-accent-ink) !important; transform: translateY(-3px); }
.ukst .ukst-social--light a { background: rgba(255, 255, 255, .08); box-shadow: none; color: #fff !important; }
.ukst-share { display: flex; align-items: center; gap: 16px; }

/* --------------------------------------------------------------------------
   Footer: panel blanco con esquinas redondeadas arriba
   ----------------------------------------------------------------------- */
.ukst-site-footer {
	position: relative;
	margin-top: clamp(40px, 6vw, 80px);
	border-radius: clamp(28px, 4vw, 48px) clamp(28px, 4vw, 48px) 0 0;
	background: var(--ukst-surface);
	color: var(--ukst-muted);
	box-shadow: 0 -20px 60px -40px rgba(42, 45, 52, .25);
}
.ukst-site-footer__marquee { padding: clamp(24px, 4vw, 48px) 0 0; overflow: hidden; }
.ukst-site-footer__marquee .ukst-marquee--outline .ukst-marquee__item { -webkit-text-stroke-color: var(--ukst-line); color: transparent; }
.ukst-site-footer__marquee .ukst-marquee--outline .ukst-marquee__item:nth-child(even) { color: var(--ukst-accent); -webkit-text-stroke: 0; }
.ukst-site-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
	gap: 48px clamp(24px, 4vw, 64px);
	padding-block: clamp(56px, 6vw, 90px);
}
.ukst-site-footer__brand p { max-width: 36ch; margin: 20px 0 26px; padding: 0; font-size: 15px; }
.ukst .ukst-site-footer h4 {
	margin: 0 0 18px;
	padding: 0;
	color: var(--ukst-ink);
	font-family: var(--ukst-font-body);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
}
.ukst-site-footer ul { margin: 0; padding: 0 !important; list-style: none !important; }
.ukst-site-footer li { padding: 5px 0 !important; font-size: 15px; }
.ukst .ukst-site-footer a { color: var(--ukst-muted); text-decoration: none; }
.ukst .ukst-site-footer ul a { background: linear-gradient(var(--ukst-accent), var(--ukst-accent)) 0 100% / 0 2px no-repeat; transition: color .3s, background-size .4s var(--ukst-ease); }
.ukst .ukst-site-footer a:hover { color: var(--ukst-accent); }
.ukst .ukst-site-footer ul a:hover { background-size: 100% 2px; }
.ukst-site-footer__contact li { line-height: 1.5; }
.ukst-site-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 32px;
	padding-block: 22px;
	border-top: 1px solid var(--ukst-line);
	font-size: 14px;
}
.ukst-site-footer__payments { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.ukst .ukst-site-footer__badge { display: block; width: auto; max-width: min(100%, 420px); height: var(--ukst-badge-h, 32px); object-fit: contain; }
.ukst .ukst-to-top { font-size: 14px; font-weight: 600; color: var(--ukst-ink) !important; }

/* Botón flotante de WhatsApp */
.ukst .ukst-wa-float {
	position: fixed;
	left: 20px;
	bottom: 20px;
	z-index: 9990;
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #25d366;
	color: #fff !important;
	box-shadow: 0 12px 28px -8px rgba(37, 211, 102, .7);
	transition: transform .4s var(--ukst-ease);
}
.ukst .ukst-wa-float::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #25d366; animation: ukst-ping 2.4s var(--ukst-ease) infinite; }
.ukst .ukst-wa-float:hover { transform: scale(1.08) rotate(-6deg); }
.ukst .ukst-wa-float svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@keyframes ukst-ping { 0% { opacity: .8; transform: scale(1); } 100% { opacity: 0; transform: scale(1.6); } }

/* Filtro como enlaces (categorías reales): píldoras */
.ukst-filter--links a {
	position: relative;
	padding: 11px 20px;
	border-radius: 999px;
	background: var(--ukst-surface);
	color: var(--ukst-ink);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	box-shadow: var(--ukst-shadow-sm);
	transition: color .3s, background .3s, transform var(--ukst-speed) var(--ukst-ease);
}
.ukst-filter--links a:hover { color: var(--ukst-accent); transform: translateY(-2px); }
.ukst-filter--links a.is-active { background: var(--ukst-accent); color: var(--ukst-accent-ink); }

/* Buscador genérico */
.ukst-searchform { display: flex; border-bottom: 2px solid currentColor; }
.ukst .ukst-searchform input[type="search"] { flex: 1; min-height: 56px; border: 0 !important; background: transparent !important; font-size: 20px !important; padding-inline: 0 !important; color: inherit !important; }
.ukst-searchform button { border: 0; background: none; color: inherit; cursor: pointer; }
.ukst-searchform button:hover { color: var(--ukst-accent); }

/* Páginas normales */
.ukst-page-body .ukst-post-content { margin-inline: auto; }
.ukst-page-body--wide { max-width: calc(var(--ukst-container) + var(--ukst-side) * 2); }

/* --------------------------------------------------------------------------
   Portada
   ----------------------------------------------------------------------- */
.ukst-home-hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: calc(100svh - var(--ukst-header-h));
	padding-block: clamp(48px, 8vw, 110px);
	overflow: hidden;
	isolation: isolate;
}
.ukst-header-over .ukst-home-hero { min-height: 100svh; }
.ukst-home-hero.has-media { color: var(--ukst-bg); }
.ukst-home-hero__media {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
	animation: ukst-zoom 2.4s var(--ukst-ease) both;
}
.ukst-home-hero.has-media::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(to top, rgba(14, 14, 14, .75) 0%, rgba(14, 14, 14, .1) 60%);
}
@keyframes ukst-zoom { from { transform: scale(1.12); } }
.ukst-home-hero__content > * { animation: ukst-rise 1s var(--ukst-ease) both; }
.ukst-home-hero__content > *:nth-child(2) { animation-delay: .12s; }
.ukst-home-hero__content > *:nth-child(3) { animation-delay: .24s; }
.ukst-home-hero__content > *:nth-child(4) { animation-delay: .36s; }
.ukst-home-hero .ukst-eyebrow { color: inherit; opacity: .8; margin-bottom: 18px; }
.ukst .ukst-home-hero__title {
	max-width: 12ch;
	margin: 0;
	padding: 0;
	font-size: clamp(64px, 13vw, 230px);
	line-height: .82;
}
.ukst-home-hero__text { max-width: 520px; margin: 26px 0 0; padding: 0; font-size: 18px; opacity: .85; }
.ukst-home-hero .ukst-btn { margin-top: 34px; }
.ukst-home-hero__scroll {
	position: absolute;
	right: var(--ukst-side);
	bottom: clamp(48px, 8vw, 110px);
	width: 1px;
	height: 90px;
	background: currentColor;
	opacity: .35;
	overflow: hidden;
}
.ukst-home-hero.has-media .ukst-home-hero__scroll { background: var(--ukst-bg); }
.ukst-home-hero__scroll span { position: absolute; left: 0; top: -40%; width: 100%; height: 40%; background: var(--ukst-accent); animation: ukst-scroll 2s ease-in-out infinite; }
@keyframes ukst-scroll { to { top: 100%; } }

.ukst-home-marquee { padding-block: clamp(24px, 4vw, 48px); border-bottom: 1px solid var(--ukst-line); }

/* Categorías destacadas */
.ukst-cat-tiles { display: grid; gap: var(--ukst-gap); }
.ukst-cat-tiles--2 { grid-template-columns: 1fr 1fr; }
.ukst-cat-tiles--3 { grid-template-columns: 1.3fr 1fr; grid-template-rows: 1fr 1fr; }
.ukst-cat-tiles--3 .ukst-cat-tile:first-child { grid-row: span 2; }
.ukst-cat-tile {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 320px;
	overflow: hidden;
	border-radius: var(--ukst-radius);
	background: var(--ukst-ink);
	color: var(--ukst-bg) !important;
	text-decoration: none;
	isolation: isolate;
}
.ukst-cat-tiles--3 .ukst-cat-tile:first-child { min-height: 660px; }
.ukst-cat-tile__img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100% !important; object-fit: cover; transition: transform 1.2s var(--ukst-ease); }
.ukst-cat-tile::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(14, 14, 14, .8), rgba(14, 14, 14, 0) 60%); }
.ukst-cat-tile:hover .ukst-cat-tile__img { transform: scale(1.06); }
.ukst-cat-tile__body { display: grid; gap: 8px; padding: clamp(22px, 3vw, 40px); }
.ukst-cat-tile__count { font-size: 12px; font-weight: 700; letter-spacing: var(--ukst-tracking-wide); text-transform: uppercase; opacity: .75; }
.ukst-cat-tile__name { font-family: var(--ukst-font-display); font-size: clamp(40px, 5vw, 80px); line-height: .9; text-transform: var(--ukst-heading-transform); }
.ukst .ukst-cat-tile .ukst-link-arrow { color: var(--ukst-bg); }
.ukst-cat-tile:hover .ukst-link-arrow .ukst-icon { transform: translateX(6px); }

/* Banner dividido */
.ukst-home-banner { display: grid; grid-template-columns: 1fr 1fr; min-height: 80vh; }
.ukst-home-banner__media { position: relative; overflow: hidden; background: #1b1b1b; }
.ukst-home-banner__media img { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; }
.ukst-home-banner__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ukst-font-display);
	font-size: clamp(80px, 14vw, 240px);
	text-transform: uppercase;
	color: transparent;
	-webkit-text-stroke: 1px rgba(243, 241, 236, .25);
	writing-mode: vertical-rl;
	transform: rotate(180deg);
}
.ukst-home-banner__body { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(40px, 7vw, 120px); }
.ukst-home-banner .ukst-eyebrow { color: var(--ukst-accent); margin-bottom: 18px; }
.ukst .ukst-home-banner__title { margin: 0 0 22px; padding: 0; font-size: clamp(48px, 7vw, 120px); line-height: .86; color: var(--ukst-bg); }
.ukst-home-banner__body p { max-width: 44ch; margin: 0 0 32px; padding: 0; color: rgba(243, 241, 236, .7); font-size: 18px; }

/* Blog: primera entrada destacada */
.ukst-blog__grid.has-featured > .ukst-post-card:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--ukst-gap); align-items: center; }
.ukst-blog__grid.has-featured > .ukst-post-card:first-child .ukst-post-card__title { font-size: clamp(36px, 4.4vw, 64px); }
.ukst-blog__grid.has-featured > .ukst-post-card:first-child .ukst-post-card__media img { aspect-ratio: 16 / 10; }
.ukst-blog__grid.has-featured > .ukst-post-card.no-thumb:first-child { display: block; }
.ukst-empty-state { padding: 60px 0; text-align: center; }
.ukst-empty-state__title { font-family: var(--ukst-font-display); font-size: clamp(36px, 5vw, 72px); text-transform: uppercase; color: var(--ukst-muted); }
.ukst-empty-state .ukst-searchform { max-width: 520px; margin: 24px auto 0; }

/* --------------------------------------------------------------------------
   Entrada individual
   ----------------------------------------------------------------------- */
.ukst-single__hero {
	position: relative;
	padding-block: clamp(56px, 9vw, 140px) clamp(40px, 6vw, 80px);
	text-align: center;
	isolation: isolate;
}
.ukst-single__hero .ukst-meta { justify-content: center; margin-bottom: 22px; }
.ukst .ukst-single__title { max-width: 16ch; margin: 0 auto; padding: 0; font-size: clamp(44px, 7vw, 112px); line-height: .88; }
.ukst-single__lead { max-width: 640px; margin: 26px auto 0; padding: 0; font-size: 20px; color: var(--ukst-muted); }
.ukst-single__author { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ukst-single__author img { border-radius: 50%; filter: grayscale(1); }
.ukst-single__hero.has-image { min-height: 78vh; display: flex; align-items: flex-end; color: var(--ukst-bg); }
.ukst-single__hero.has-image::before,
.ukst-single__hero.has-image::after { content: ""; position: absolute; inset: 0; z-index: -1; }
.ukst-single__hero.has-image::before { background: var(--ukst-hero-img) center / cover no-repeat; }
.ukst-single__hero.has-image::after { background: linear-gradient(to top, rgba(14, 14, 14, .9), rgba(14, 14, 14, .2)); }
.ukst-single__hero.has-image .ukst-meta,
.ukst-single__hero.has-image .ukst-single__lead { color: rgba(243, 241, 236, .8); }
.ukst-single__hero.has-image .ukst-meta > * + *::before { color: rgba(243, 241, 236, .35); }

.ukst-single__body { padding-block: clamp(48px, 7vw, 100px); }
.ukst-single__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	max-width: 760px;
	margin: 56px auto 0;
	padding-top: 28px;
	border-top: 1px solid var(--ukst-line);
}
.ukst-related-posts { border-top: 1px solid var(--ukst-line); }
.ukst-related-posts .ukst-section__title { margin-bottom: 40px; }

/* Comentarios */
.ukst-comments { border-top: 1px solid var(--ukst-line); }
.ukst-comment-list { margin: 32px 0 56px; padding: 0 !important; list-style: none !important; }
.ukst-comment-list .comment { padding: 0 !important; }
.ukst-comment-list .comment-body { position: relative; padding: 24px 0 24px 68px; border-bottom: 1px solid var(--ukst-line); }
.ukst-comment-list .children { margin: 0; padding-left: 40px !important; list-style: none; }
.ukst-comment-list .avatar { position: absolute; left: 0; top: 24px; border-radius: 50%; filter: grayscale(1); }
.ukst-comment-list .fn { font-style: normal; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ukst-comment-list .says { display: none; }
.ukst-comment-list .comment-metadata { font-size: 13px; }
.ukst-comment-list .comment-metadata a { color: var(--ukst-muted); }
.ukst-comment-list .reply a { font-size: 12px; font-weight: 700; letter-spacing: var(--ukst-tracking-wide); text-transform: uppercase; color: var(--ukst-accent); }
.ukst .comment-form p { padding-bottom: 0; margin-bottom: 18px; }
.ukst .comment-form .comment-notes,
.ukst .comment-form .logged-in-as { font-size: 14px; color: var(--ukst-muted); }

/* --------------------------------------------------------------------------
   Contacto
   ----------------------------------------------------------------------- */
.ukst-contact__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(40px, 7vw, 120px); align-items: start; }
.ukst-contact__info { display: grid; gap: 36px; }
.ukst-contact__item .ukst-eyebrow { display: block; margin-bottom: 8px; }
.ukst-contact__value { font-family: var(--ukst-font-display); font-size: clamp(26px, 2.8vw, 40px); line-height: 1.05; text-transform: var(--ukst-heading-transform); }
.ukst .ukst-contact__value a { color: var(--ukst-ink); }
.ukst .ukst-contact__value a:hover { color: var(--ukst-accent); }
.ukst-contact__extra { margin-top: var(--ukst-section); }
.ukst-contact__map { height: clamp(320px, 50vh, 560px); filter: grayscale(1) contrast(1.1); }
.ukst-contact__map iframe { display: block; width: 100%; height: 100%; border: 0; }

.ukst-form { display: grid; gap: 0; padding: clamp(28px, 4vw, 56px); background: var(--ukst-surface); border-radius: var(--ukst-radius); }
.ukst-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.ukst-field { margin: 0 0 20px; padding: 0 !important; }
.ukst-field label { display: block; margin-bottom: 8px; }
.ukst-field--check label { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.ukst-field--check input { margin-top: 3px; accent-color: var(--ukst-accent); }
.ukst-form .ukst-btn { justify-self: start; }
.ukst-form__notice { margin-bottom: 22px; padding: 16px 18px; border-left: 4px solid; font-weight: 600; }
.ukst-form__notice.is-success { border-color: var(--ukst-alt); background: rgba(75, 81, 50, .08); }
.ukst-form__notice.is-error { border-color: var(--ukst-accent); background: rgba(226, 35, 26, .06); }
.ukst-hp { position: absolute !important; left: -9999px !important; }

/* Visor de fotos */
.ukst-lightbox-view {
	position: fixed;
	inset: 0;
	z-index: 100003;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(14, 14, 14, .96);
	color: var(--ukst-bg);
	animation: ukst-fade .3s;
}
.ukst-lightbox-view[hidden] { display: none; }
.ukst-lightbox-view img { max-width: 88vw; max-height: 82vh; object-fit: contain; }
.ukst-lightbox-view figcaption { position: absolute; left: 0; right: 0; bottom: 24px; text-align: center; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; }
.ukst-lightbox-view button { position: absolute; border: 0; background: none; color: var(--ukst-bg); cursor: pointer; padding: 16px; font-size: 28px; }
.ukst-lightbox-view button:hover { color: var(--ukst-accent); }
.ukst-lightbox-view .is-close { top: 16px; right: 16px; }
.ukst-lightbox-view .is-prev { left: 8px; top: 50%; transform: translateY(-50%); }
.ukst-lightbox-view .is-next { right: 8px; top: 50%; transform: translateY(-50%); }

/* --------------------------------------------------------------------------
   404
   ----------------------------------------------------------------------- */
.ukst-404 { padding-block: clamp(60px, 10vw, 160px); text-align: center; }
.ukst-404__code {
	margin: 0;
	padding: 0;
	font-family: var(--ukst-font-display);
	font-size: clamp(140px, 32vw, 460px);
	line-height: .8;
	color: transparent;
	-webkit-text-stroke: 2px var(--ukst-ink);
}
.ukst .ukst-404__title { margin: 20px 0 12px; font-size: clamp(40px, 6vw, 90px); }
.ukst-404 p { color: var(--ukst-muted); }
.ukst-404__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 32px 0 40px; }
.ukst-404 .ukst-searchform { max-width: 520px; margin-inline: auto; }

/* --------------------------------------------------------------------------
   Tienda y ficha (estructura; los estilos de producto están en woocommerce.css)
   ----------------------------------------------------------------------- */
.ukst-hero-page--shop .ukst-hero-page__text { color: var(--ukst-muted); }
.ukst-shop-wrap .woocommerce-notices-wrapper:empty { display: none; }
.ukst-shop-wrap .woocommerce-result-count { float: left; }
.ukst-shop-wrap .woocommerce-ordering { float: right; }
.ukst-shop-wrap ul.products { clear: both; }

.ukst-product-wrap { padding-block: 28px var(--ukst-section); }
.ukst .woocommerce-breadcrumb {
	margin: 0 0 28px !important;
	padding: 0 !important;
	font-size: 12px !important;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ukst-muted) !important;
}
.ukst .woocommerce-breadcrumb a { color: var(--ukst-muted) !important; }
.ukst .woocommerce-breadcrumb a:hover { color: var(--ukst-accent) !important; }
.ukst-product-wrap div.product { display: block; }
.ukst-product-wrap div.product::before,
.ukst-product-wrap div.product::after { display: none !important; }
/* Galería + resumen a dos columnas (50/50). Divi los mete dentro de un <div class="clearfix">:
   la rejilla se aplica a quien los contenga directamente, con o sin ese envoltorio. */
.ukst-product-wrap .ukst-product-main {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 0 clamp(32px, 5vw, 90px);
	align-items: start;
	float: none !important;
	width: 100% !important;
	margin: 0 !important;
}
.ukst-product-wrap .ukst-product-main::before,
.ukst-product-wrap .ukst-product-main::after { display: none !important; content: none !important; }
.ukst-product-wrap .ukst-product-main > .onsale { grid-column: 1; grid-row: 1; justify-self: start; align-self: start; position: relative !important; z-index: 5; margin: 14px !important; }
.ukst-product-wrap .ukst-product-main > .woocommerce-product-gallery {
	grid-column: 1;
	grid-row: 1;
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	position: sticky !important; /* la columna más corta acompaña al hacer scroll hasta justo antes de las pestañas (WooCommerce la fuerza a relative) */
	top: var(--ukst-sticky-top, calc(var(--ukst-header-h) + 24px));
}
.ukst-product-wrap .ukst-product-main > .summary {
	grid-column: 2;
	grid-row: 1;
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	position: sticky;
	top: var(--ukst-sticky-top, calc(var(--ukst-header-h) + 24px));
}
.ukst-product-wrap div.product > .woocommerce-tabs,
.ukst-product-wrap div.product > .related,
.ukst-product-wrap div.product > .upsells,
.ukst-product-wrap div.product > section { clear: both; margin-top: var(--ukst-section); }

/* --------------------------------------------------------------------------
   Responsive
   ----------------------------------------------------------------------- */
@media (max-width: 1100px) {
	.ukst-site-footer__grid { grid-template-columns: 1fr 1fr; }
	.ukst-overlay__body { grid-template-columns: 1fr; align-items: start; }
	.ukst-overlay__aside { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); align-items: start; }
}
@media (max-width: 980px) {
	.ukst-home-banner { grid-template-columns: 1fr; min-height: 0; }
	.ukst-home-banner__media { min-height: 70vw; }
	.ukst-contact__grid { grid-template-columns: 1fr; }
	.ukst-product-wrap .ukst-product-main { grid-template-columns: minmax(0, 1fr); }
	.ukst-product-wrap .ukst-product-main > .woocommerce-product-gallery { position: relative !important; top: auto !important; }
	.ukst-product-wrap .ukst-product-main > .summary { grid-column: 1; grid-row: auto; position: static; top: auto !important; margin-top: 32px !important; }
	.ukst-blog__grid.has-featured > .ukst-post-card:first-child { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	:root { --ukst-header-h: 64px; }
	.ukst-hide-sm { display: none !important; }
	.ukst-burger__label { display: none; }
	.ukst-header__inner { gap: 12px; }
	.ukst-logo img { max-width: 150px; }
	.ukst-overlay__menu > li > a { font-size: clamp(30px, min(13vw, var(--ukst-menu-fit)), 72px); }
	.ukst-sub-toggle { width: 36px; height: 36px; margin-left: 10px; }
	.ukst-site-footer__grid { grid-template-columns: 1fr; gap: 36px; }
	.ukst-site-footer__bottom { flex-direction: column; align-items: flex-start; }
	.ukst-section__head { flex-direction: column; align-items: flex-start; }
	.ukst-cat-tiles--2,
	.ukst-cat-tiles--3 { grid-template-columns: 1fr; grid-template-rows: none; }
	.ukst-cat-tiles--3 .ukst-cat-tile:first-child { grid-row: auto; min-height: 420px; }
	.ukst-cat-tile { min-height: 260px; }
	.ukst-home-hero__scroll { display: none; }
	.ukst-form__row { grid-template-columns: 1fr; }
	.ukst-single__footer { flex-direction: column; align-items: flex-start; }
	.ukst-shop-wrap .woocommerce-result-count,
	.ukst-shop-wrap .woocommerce-ordering { float: none; }
	.ukst-hero-page .ukst-filter { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
	.ukst-overlay { transition: none; }
	.ukst-overlay__menu > li > a,
	.ukst-overlay__aside { transition: none; transform: none; opacity: 1; }
}

/* Redes dentro del menú con los colores propios del menú */
.ukst .ukst-overlay .ukst-social a { color: var(--ukst-overlay-fg) !important; border-color: color-mix(in srgb, var(--ukst-overlay-fg) 25%, transparent); }
.ukst .ukst-overlay .ukst-social a:hover { color: var(--ukst-accent-ink) !important; border-color: var(--ukst-accent); }

/* Contenido de Divi metido dentro de las plantillas del theme (portada, contacto) */
.ukst-home-free--divi,
.ukst-contact__extra--divi { width: 100%; }
.ukst-contact__extra--divi { margin-top: var(--ukst-section); }

/* ==========================================================================
   Páginas construidas con Divi por el theme (Apariencia → UnikaWeb Studio →
   "Crear portada y contacto editables con Divi"). Las secciones llevan la clase
   ukst-d; las filas que añadas tú mantienen el estilo normal de Divi.
   ========================================================================== */
/* Espaciados y anchos de las secciones y filas del theme (1.3.0)
   Las secciones y filas guardan en Divi "var(--ukst-d-…)" como espaciado y ancho: el valor
   lo pone aquí cada clase (y cambia en el móvil), y si el usuario escribe otro en Divi, gana el suyo. */
.ukst .et_pb_section.ukst-d { --ukst-d-pt: 0px; --ukst-d-pb: 0px; }
/* Espaciado de las secciones del theme: en Divi el relleno queda vacío. Peso (0,2,0): gana al
   relleno por defecto de Divi (.et_pb_section) y el que escribas en la sección gana a este
   (Divi lo pinta después con el mismo peso). Cada clase cambia las variables. */
:where(.ukst) .et_pb_section.ukst-d { padding-top: var(--ukst-d-pt, 0px); padding-bottom: var(--ukst-d-pb, 0px); }
/* En las plantillas del Theme Builder Divi pinta su relleno general con .et-db #et-boc .et-l: el
   mismo prefijo aquí (y el de la sección del usuario, que va después, sigue ganando). */
.et-db #et-boc .et-l .et_pb_section.ukst-d { padding-top: var(--ukst-d-pt, 0px); padding-bottom: var(--ukst-d-pb, 0px); }
:where(.ukst) .ukst-d:where(.et_pb_section:not(.et_pb_with_background):not(.ukst-dark)) { background-color: transparent; }
.ukst .ukst-d .et_pb_row.ukst-d-row { --ukst-d-rwd: 100%; --ukst-d-rw: calc(var(--ukst-container) + var(--ukst-side) * 2); --ukst-d-rx: var(--ukst-side); --ukst-d-rt: 0px; --ukst-d-rb: 0px; box-sizing: border-box; }
/* Filas del theme: ancho, ancho máximo y relleno por defecto. En Divi esos campos quedan vacíos
   (muestran el valor por defecto de Divi). Peso de ID SIN !important: gana al 80 % / 1080px de
   Divi y a sus ajustes globales, y lo que escribas en la fila gana a esto (Divi lo pinta con
   !important). Las variables las ajusta cada clase (tarjetas, llamada a la acción, móvil…). */
:is(html, #ukst-guard) .ukst .et_pb_row.ukst-d-row.ukst-d-row {
	width: var(--ukst-d-rwd, 100%);
	max-width: var(--ukst-d-rw, calc(var(--ukst-container) + var(--ukst-side) * 2));
	margin-inline: auto;
	padding: var(--ukst-d-rt, 0px) var(--ukst-d-rx, var(--ukst-side)) var(--ukst-d-rb, 0px);
}
:is(html, #ukst-guard) .ukst .ukst-d .et_pb_row.ukst-d-row { margin-inline: auto; }
.ukst .ukst-d .et_pb_row.ukst-d-row--full { --ukst-d-rw: none; --ukst-d-rx: 0px; }
:is(html, #ukst-guard) .ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column > .et_pb_module { margin-bottom: 0; }
.ukst .et_pb_section.ukst-d-pad { --ukst-d-pt: var(--ukst-section); --ukst-d-pb: var(--ukst-section); }

/* Botón claro (módulo Botón con la clase ukst-d-btn-light) */
:where(.ukst) .ukst-d-btn-light:where(.et_pb_button),
:where(.ukst) .ukst-d-btn-light .et_pb_button {
	margin-top: 34px;
	background: var(--ukst-bg) ;
	border-color: var(--ukst-bg) ;
	color: var(--ukst-ink) !important;
}
:where(.ukst) .ukst-d-btn-light:where(.et_pb_button):hover,
:where(.ukst) .ukst-d-btn-light .et_pb_button:hover { color: var(--ukst-accent-ink) !important; border-color: var(--ukst-accent) ; }

/* Cinta */
.ukst .et_pb_section.ukst-d-marquee { --ukst-d-pt: clamp(24px, 4vw, 48px); --ukst-d-pb: clamp(24px, 4vw, 48px); }
:where(.ukst) .ukst-d-marquee:where(.et_pb_section) { border-bottom: 1px solid var(--ukst-line); }

/* Cabecera de página (contacto) */
.ukst .et_pb_section.ukst-d-pagehead { --ukst-d-pt: clamp(56px, 9vw, 140px); --ukst-d-pb: clamp(40px, 6vw, 90px); }
:where(.ukst) .ukst-d-pagehead:where(.et_pb_section) { border-bottom: 1px solid var(--ukst-line); text-align: center; }
.ukst .ukst-d-pagehead .ukst-eyebrow { margin-bottom: 18px; }
.ukst .ukst-d-pagehead .ukst-hero-page__title { max-width: none; }
:where(.ukst) .ukst-d-pagehead .ukst-hero-page__title { font-size: clamp(44px, 12vw, 230px); line-height: .82; }
.ukst .ukst-d-pagehead .ukst-hero-page__text { margin-inline: auto; }

/* Mapa */
.ukst .et_pb_section.ukst-d-map { --ukst-d-pt: 0px; --ukst-d-pb: 0px; }

@media (max-width: 980px) {
	.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column { margin-bottom: 40px; }
	.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column:last-child { margin-bottom: 0; }
}

/* Las columnas de Divi flotan: la fila tiene que envolverlas siempre */
.ukst .et_pb_row::after { content: ""; display: table; clear: both; }
.ukst .ukst-d .et_pb_row.ukst-d-row:not(.ukst-d-row--full) { display: flow-root; }

/* Columnas de las secciones del theme: rejilla propia (Divi 5 no siempre carga la antigua) */
.ukst .ukst-d .et_pb_row.ukst-d-row:has(> .et_pb_column + .et_pb_column) { display: flex; flex-wrap: wrap; gap: clamp(32px, 5vw, 96px); }
.ukst .ukst-d .et_pb_row.ukst-d-row:has(> .et_pb_column + .et_pb_column)::after { display: none; }
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column { float: none; margin-right: 0; min-width: 0; }
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column_1_2,
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column_1_3,
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column_1_4 { flex: 1 1 0; }
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column_2_5,
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column_2_3 { flex: 2 1 0; }
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column_3_5,
.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column_3_4 { flex: 3 1 0; }
:where(.ukst .ukst-d-pagehead) .et_pb_text { text-align: center ; }
:where(.ukst) .ukst-d-pagehead .et_pb_text_inner { text-align: center ; }
@media (max-width: 980px) {
	.ukst .ukst-d .et_pb_row.ukst-d-row > .et_pb_column { flex-basis: 100% !important; }
}

/* Plantilla de tienda hecha con el Theme Builder de Divi */
.ukst-shop-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.ukst-shop-toolbar .woocommerce-result-count,
.ukst-shop-toolbar .woocommerce-ordering { float: none !important; margin: 0 0 24px !important; }
.ukst .ukst-d-shop .woocommerce-pagination { margin-top: clamp(40px, 6vw, 80px); }

/* Cabecera de tienda dentro de la plantilla de Divi */
.ukst .et_pb_section.ukst-d-shophead { --ukst-d-pt: 0px; --ukst-d-pb: 0px; }
.ukst .ukst-d-shop-loop ul.products { margin-top: 0 !important; }

/* Cabecera compacta (carrito, checkout, mi cuenta, favoritos hechos con Divi) */
.ukst .et_pb_section.ukst-d-pagehead--compact { --ukst-d-pt: clamp(40px, 5vw, 70px); --ukst-d-pb: clamp(28px, 3vw, 44px); }
:where(.ukst) .ukst-d-pagehead--compact .ukst-hero-page__title { font-size: clamp(44px, 7vw, 110px); }
.ukst .ukst-d-woo .et_pb_code_inner > .woocommerce { width: 100%; }

/* ==========================================================================
   Blindaje frente a Divi (1.1.2)
   Con ajustes globales de Divi (color de enlaces, anchos de fila) o al guardar
   una plantilla en el Theme Builder, Divi genera reglas con #et-boc (peso de ID)
   que ganan a las del theme: las filas pasaban a 2560 px y los enlaces del theme
   (píldoras, tarjetas de producto) cogían el color de enlace de Divi.
   :is(html, #ukst-guard) da peso de ID y funciona en todas las páginas, haya o no #et-boc.
   ========================================================================== */
:is(html, #ukst-guard) .ukst .ukst-filter.ukst-filter--links a { color: var(--ukst-ink); }
:is(html, #ukst-guard) .ukst .ukst-filter.ukst-filter--links a:hover { color: var(--ukst-accent); }
:is(html, #ukst-guard) .ukst .ukst-filter.ukst-filter--links a.is-active { color: var(--ukst-accent-ink); }
:is(html, #ukst-guard) .ukst ul.products li.product a:not(.button):not(.added_to_cart) { color: var(--ukst-ink); }