/*!
 * AeroStrut — tema
 * Estructura del sitio: cabecera, pie, ficha de producto y páginas.
 * Los tokens de color y tipografía los inyecta el plugin en :root.
 */

/* ================================================================== 1. BASE */

*,
*::before,
*::after { box-sizing: border-box; }

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

body.as-body {
	margin: 0;
	font-family: var(--as-font-body);
	font-size: var(--as-base);
	line-height: 1.65;
	color: var(--as-text);
	background: var(--as-bg);
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img, svg, video { max-width: 100%; height: auto; }

.as-prose a,
.as-page__body a,
.entry-content a,
.as-acc__inner a {
	color: var(--as-gold);
	text-decoration: underline;
	text-underline-offset: .18em;
	text-decoration-thickness: 1px;
}

::selection {
	background: rgba(var(--as-gold-rgb), .28);
	color: var(--as-text);
}

/* Barra de scroll sobria */
* { scrollbar-width: thin; scrollbar-color: var(--as-silver-dim) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb {
	background: var(--as-silver-dim);
	border-radius: 10px;
	border: 3px solid var(--as-bg);
}

.as-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 1000;
	padding: 12px 20px;
	background: var(--as-gold);
	color: var(--as-on-gold);
	font-weight: 700;
}

.as-skip:focus { left: 12px; top: 12px; }

/* Transición entre páginas. La regla @view-transition que la activa la imprime
   el plugin en la cabecera, para que respete el interruptor del panel. */
::view-transition-old(root) {
	animation: as-vt-out 90ms ease both;
}

::view-transition-new(root) {
	animation: as-vt-in 220ms ease both;
}

/* Fundido puro: cualquier desplazamiento se percibe como un salto al cambiar
   de página, porque cabecera y pie son idénticos en los dos documentos. */
@keyframes as-vt-out { to { opacity: 0; } }
@keyframes as-vt-in  { from { opacity: 0; } }

/* ================================================================ 2. TOPBAR */

.as-topbar {
	position: relative;
	z-index: 60;
	background: var(--as-carbon);
	color: var(--as-dark-muted);
	font-size: .78rem;
	border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.as-topbar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	min-height: 40px;
	padding-block: 8px;
}

.as-topbar__text {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	letter-spacing: .04em;
}

.as-topbar__dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--as-gold);
	box-shadow: 0 0 0 0 rgba(var(--as-gold-rgb), .7);
	animation: as-beacon 2.4s ease-out infinite;
}

@keyframes as-beacon {
	0%   { box-shadow: 0 0 0 0 rgba(var(--as-gold-rgb), .6); }
	70%  { box-shadow: 0 0 0 8px rgba(var(--as-gold-rgb), 0); }
	100% { box-shadow: 0 0 0 0 rgba(var(--as-gold-rgb), 0); }
}

.as-topbar__links { display: flex; gap: 22px; }

.as-topbar__links a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: inherit;
	text-decoration: none;
	transition: color 180ms ease;
}

.as-topbar__links a:hover { color: var(--as-gold); }
.as-topbar__links svg { color: var(--as-gold); }

@media (max-width: 860px) {
	.as-topbar { display: none; }
}

/* ============================================================== 3. CABECERA */

.as-header {
	position: relative;
	z-index: 70;
	background: var(--as-bg);
	transition:
		transform 320ms cubic-bezier(.23, 1, .32, 1),
		background-color 260ms ease,
		box-shadow 260ms ease,
		backdrop-filter 260ms ease;
}

.as-header.is-sticky {
	position: sticky;
	top: var(--as-bar-h, 0px);
}

/* La barra de administración de WordPress es fija y taparía la cabecera. */
body.admin-bar { --as-bar-h: 32px; }

@media screen and (max-width: 782px) {
	body.admin-bar { --as-bar-h: 46px; }
}

/* En móvil la barra de administración deja de ser fija al hacer scroll. */
@media screen and (max-width: 600px) {
	body.admin-bar { --as-bar-h: 0px; }
}

/* Sobre el hero: sin fondo, y la cabecera flota encima.
   Se queda en `absolute` mientras no se hace scroll, así respeta el sitio que
   ocupa la barra superior en el flujo normal. Si se fijara desde el principio
   se montaría encima de ella. Solo pasa a `fixed` al volverse sólida. */
.as-header.is-transparent {
	position: absolute;
	inset: auto 0 auto 0;
	background: transparent;
}

.as-header.is-transparent.is-solid {
	position: fixed;
	top: var(--as-bar-h, 0px);
	background: rgba(var(--as-carbon-rgb), .86);
	backdrop-filter: blur(18px) saturate(150%);
	-webkit-backdrop-filter: blur(18px) saturate(150%);
	box-shadow: 0 10px 40px rgba(0, 0, 0, .3);
}

.as-header.is-solid:not(.is-transparent) {
	box-shadow: 0 1px 0 var(--as-line), 0 10px 30px rgba(0, 0, 0, .05);
	background: rgba(255, 255, 255, .92);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}

.as-header.is-hidden { transform: translate3d(0, -100%, 0); }

.as-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 26px;
	min-height: 78px;
	transition: min-height 260ms cubic-bezier(.23, 1, .32, 1);
}

.as-header.is-solid .as-header__inner { min-height: 66px; }

.as-header__line {
	position: absolute;
	inset: auto 0 0 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(var(--as-gold-rgb), .5), transparent);
	opacity: 0;
	transition: opacity 260ms ease;
}

.as-header.is-solid .as-header__line { opacity: 1; }

/* ------------------------------------------------------------------ Marca */

.as-brand {
	display: inline-flex;
	align-items: center;
	flex: none;
	line-height: 0;
	transition: opacity 180ms ease;
}

.as-brand__img {
	width: auto;
	height: var(--as-logo-h);
	transition: height 260ms cubic-bezier(.23, 1, .32, 1), filter 260ms ease;
}

.as-header.is-solid .as-brand__img { height: calc(var(--as-logo-h) * .86); }

.as-brand__img--light { display: none; }

/* Con logo claro disponible, se alterna según el fondo */
.as-header.is-transparent:not(.is-solid):not(.has-mono-logo) .as-brand__img--dark { display: none; }
.as-header.is-transparent:not(.is-solid):not(.has-mono-logo) .as-brand__img--light { display: block; }
.as-header.is-transparent.is-solid:not(.has-mono-logo) .as-brand__img--dark { display: none; }
.as-header.is-transparent.is-solid:not(.has-mono-logo) .as-brand__img--light { display: block; }

/* Sin logo claro: se pasa a blanco puro sobre la fotografía.
   Pierde el oro del isotipo, pero es un lockup limpio y legible. */
.as-header.is-transparent.has-mono-logo .as-brand__img--dark {
	filter: brightness(0) invert(1);
}

.as-brand__text {
	font-family: var(--as-font-display);
	font-size: 1.4rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1;
	color: var(--as-text);
	text-decoration: none;
}

.as-header.is-transparent .as-brand__text { color: #fff; }

/* -------------------------------------------------------------- Navegación */

.as-nav { flex: 1; display: flex; justify-content: center; }

.as-nav__list {
	display: flex;
	align-items: center;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-nav__list li { position: relative; }

.as-nav__list a {
	position: relative;
	display: inline-block;
	padding: 10px 14px;
	font-family: var(--as-font-display);
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .11em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--as-text);
	transition: color 180ms ease;
}

.as-header.is-transparent .as-nav__list a { color: rgba(255, 255, 255, .88); }

/* Subrayado que crece desde el centro */
.as-nav__list > li > a::after {
	content: "";
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 4px;
	height: 2px;
	background: var(--as-gold-grad);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform 260ms cubic-bezier(.23, 1, .32, 1);
}

@media (hover: hover) and (pointer: fine) {
	.as-nav__list > li > a:hover { color: var(--as-gold); }
	.as-nav__list > li > a:hover::after { transform: scaleX(1); }
}

.as-nav__list > li.current-menu-item > a,
.as-nav__list > li.current_page_item > a { color: var(--as-gold); }
.as-nav__list > li.current-menu-item > a::after,
.as-nav__list > li.current_page_item > a::after { transform: scaleX(1); }

/* Submenús */
.as-nav__list .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 210px;
	margin: 0;
	padding: 8px;
	list-style: none;
	background: var(--as-bg);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	box-shadow: var(--as-shadow-lg);
	transform-origin: top left;
	opacity: 0;
	transform: scale(.97) translateY(-4px);
	pointer-events: none;
	transition: opacity 180ms cubic-bezier(.23, 1, .32, 1), transform 180ms cubic-bezier(.23, 1, .32, 1);
}

.as-nav__list li:hover > .sub-menu,
.as-nav__list li:focus-within > .sub-menu {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

.as-nav__list .sub-menu a {
	display: block;
	padding: 9px 12px;
	color: var(--as-text) !important;
	border-radius: calc(var(--as-radius) - 1px);
	letter-spacing: .06em;
	transition: background-color 140ms ease, color 140ms ease;
}

.as-nav__list .sub-menu a:hover { background: var(--as-mist); }
.as-nav__list .sub-menu a::after { display: none; }

@media (max-width: 1080px) {
	.as-nav { display: none; }
}

/* ---------------------------------------------------------------- Acciones */

.as-header__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: none;
}

.as-header__wa {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: var(--as-text);
	border: 1px solid var(--as-line);
	transition: color 180ms ease, border-color 180ms ease, transform 200ms cubic-bezier(.34, 1.4, .64, 1);
}

.as-header.is-transparent .as-header__wa {
	color: #fff;
	border-color: rgba(255, 255, 255, .3);
}

@media (hover: hover) and (pointer: fine) {
	.as-header__wa:hover {
		color: #25d366;
		border-color: #25d366;
		transform: scale(1.08);
	}
}

.as-header__cta { padding: 12px 20px; font-size: .74rem; }

@media (max-width: 620px) {
	.as-header__cta .as-btn__label { display: none; }
	.as-header__cta { padding: 12px; }
	.as-header__wa { display: none; }
	.as-header__inner { gap: 12px; min-height: 66px; }
	/* El logo deja de ser rígido: en pantallas estrechas se ajusta al hueco
	   disponible en vez de empujar la cabecera fuera de la pantalla. */
	.as-brand { flex: 0 1 auto; min-width: 0; }
	.as-brand__img { height: auto; max-height: var(--as-logo-h); max-width: 100%; }
	.as-header.is-solid .as-brand__img { max-height: calc(var(--as-logo-h) * .86); height: auto; }
}

/* Botón hamburguesa */
.as-burger {
	display: none;
	width: 42px;
	height: 42px;
	padding: 11px 9px;
	border: 0;
	background: none;
	cursor: pointer;
}

.as-burger span {
	display: block;
	height: 2px;
	background: var(--as-text);
	border-radius: 2px;
	transition: transform 280ms cubic-bezier(.23, 1, .32, 1), opacity 160ms ease, background-color 200ms ease;
}

.as-burger span + span { margin-top: 5px; }

.as-header.is-transparent .as-burger span { background: #fff; }

.as-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.as-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; transform: scaleX(.4); }
.as-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1080px) {
	.as-burger { display: block; }
}

/* ================================================================ 4. DRAWER */

.as-drawer {
	position: fixed;
	inset: 0;
	z-index: 200;
}

.as-drawer[hidden] { display: none; }

.as-drawer__scrim {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .6);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity 260ms cubic-bezier(.32, .72, 0, 1);
}

.as-drawer__panel {
	position: absolute;
	inset: 0 0 0 auto;
	width: min(400px, 88vw);
	display: flex;
	flex-direction: column;
	gap: 28px;
	padding: 26px 28px 34px;
	background: var(--as-carbon);
	color: var(--as-dark-text);
	box-shadow: -20px 0 60px rgba(0, 0, 0, .5);
	/* translateX en porcentaje: da igual el ancho real del panel */
	transform: translateX(100%);
	transition: transform 320ms cubic-bezier(.32, .72, 0, 1);
	overflow-y: auto;
	overscroll-behavior: contain;
}

.as-drawer.is-open .as-drawer__scrim { opacity: 1; }
.as-drawer.is-open .as-drawer__panel { transform: translateX(0); }

.as-drawer__close {
	align-self: flex-end;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .3);
	background: rgba(255, 255, 255, .07);
	cursor: pointer;
	transition: transform 180ms cubic-bezier(.23, 1, .32, 1),
	            border-color 180ms ease,
	            background-color 180ms ease;
}

.as-drawer__close:active { transform: scale(.94); }
.as-drawer__close:hover { border-color: var(--as-gold); color: var(--as-gold); }

.as-drawer__nav .as-nav__list {
	flex-direction: column;
	align-items: stretch;
	gap: 0;
}

.as-drawer__nav .as-nav__list > li {
	opacity: 0;
	transform: translateX(20px);
}

.as-drawer.is-open .as-drawer__nav .as-nav__list > li {
	opacity: 1;
	transform: none;
	transition: opacity 380ms cubic-bezier(.23, 1, .32, 1), transform 380ms cubic-bezier(.23, 1, .32, 1);
}

.as-drawer.is-open .as-nav__list > li:nth-child(1) { transition-delay: 100ms; }
.as-drawer.is-open .as-nav__list > li:nth-child(2) { transition-delay: 150ms; }
.as-drawer.is-open .as-nav__list > li:nth-child(3) { transition-delay: 200ms; }
.as-drawer.is-open .as-nav__list > li:nth-child(4) { transition-delay: 250ms; }
.as-drawer.is-open .as-nav__list > li:nth-child(5) { transition-delay: 300ms; }
.as-drawer.is-open .as-nav__list > li:nth-child(6) { transition-delay: 350ms; }

.as-drawer__nav a {
	display: block;
	padding: 15px 0;
	font-family: var(--as-font-display);
	font-size: 1.24rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff !important;
	border-bottom: 1px solid rgba(255, 255, 255, .09);
}

.as-drawer__nav a::after { display: none; }
.as-drawer__nav a:hover { color: var(--as-gold) !important; }

.as-drawer__nav .sub-menu {
	position: static;
	opacity: 1;
	transform: none;
	pointer-events: auto;
	background: none;
	border: 0;
	box-shadow: none;
	padding: 0 0 0 16px;
	min-width: 0;
}

.as-drawer__nav .sub-menu a {
	font-size: .92rem;
	letter-spacing: .08em;
	padding: 10px 0;
	color: rgba(255, 255, 255, .72) !important;
	background: none !important;
}

.as-drawer__foot {
	margin-top: auto;
	display: grid;
	gap: 12px;
	padding-top: 22px;
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.as-drawer__foot a {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	color: var(--as-dark-muted);
	text-decoration: none;
	font-size: .94rem;
	transition: color 180ms ease;
}

.as-drawer__foot a:hover { color: var(--as-gold); }
.as-drawer__foot svg { color: var(--as-gold); }

/* ================================================================= 5. MAIN */

.as-main { display: block; min-height: 40vh; }

.as-crumbs { font-size: .8rem; color: var(--as-muted); }

.as-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-crumbs li + li::before {
	content: "/";
	margin-right: 8px;
	color: var(--as-silver-dim);
}

.as-crumbs a {
	color: var(--as-muted);
	text-decoration: none;
	transition: color 160ms ease;
}

.as-crumbs a:hover { color: var(--as-gold); }
.as-crumbs [aria-current] { color: var(--as-text); font-weight: 600; }

/* -------------------------------------------------------------- Páginas */

.as-page__head {
	padding-block: var(--as-page-top) clamp(26px, 3vw, 40px);
	background: var(--as-mist);
	border-bottom: 1px solid var(--as-line);
}

.as-page__title {
	margin: 16px 0 0;
	font-size: calc(var(--as-fs-5) * var(--as-h2-scale, 1));
	text-transform: var(--as-case-display);
}

.as-page__body { padding-block: clamp(40px, 6vw, 76px); }

.as-prose--page {
	max-width: 72ch;
	color: var(--as-text);
	font-size: 1.04rem;
}

.as-prose--page h2,
.as-prose--page h3 {
	font-family: var(--as-font-display);
	font-weight: var(--as-w-display);
	letter-spacing: var(--as-track-display);
	text-transform: var(--as-case-display);
	margin: 2em 0 .6em;
	line-height: 1.15;
}

.as-prose--page h2 { font-size: var(--as-fs-3); }
.as-prose--page h3 { font-size: var(--as-fs-2); }

.as-prose--page ul,
.as-prose--page ol { padding-left: 1.3em; margin: 0 0 1.3em; }
.as-prose--page li { margin-bottom: .5em; }

.as-prose--page blockquote {
	margin: 1.8em 0;
	padding: 4px 0 4px 24px;
	border-left: 3px solid var(--as-gold);
	font-size: 1.1rem;
	color: var(--as-muted);
}

.as-404__inner { max-width: 720px; margin-inline: auto; text-align: center; }
.as-404__inner .as-lead { margin: 18px auto 38px; }

/* ========================================================= 6. FICHA PRODUCTO */

.as-product { display: block; }

.as-product__top {
	padding-block: 26px 0;
	background: var(--as-bg);
}

.as-product__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: clamp(30px, 4.5vw, 68px);
	align-items: start;
	padding-block: clamp(28px, 4vw, 52px) clamp(40px, 6vw, 80px);
}

.as-product__figure {
	position: relative;
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--as-radius-lg);
	background: var(--as-mist);
	display: grid;
	place-items: center;
}

.as-product__figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms cubic-bezier(.23, 1, .32, 1), opacity 260ms ease;
}

@media (hover: hover) and (pointer: fine) {
	.as-product__figure:hover img { transform: scale(1.045); }
}

.as-product__figure--empty { color: var(--as-silver-dim); }
.as-product__figure--empty svg { opacity: .45; }

.as-product__frame {
	position: absolute;
	inset: 14px;
	pointer-events: none;
	border: 1px solid rgba(var(--as-gold-rgb), .38);
	clip-path: inset(0 100% 0 0);
}

.as-product__gallery.is-in .as-product__frame {
	clip-path: inset(0 0 0 0);
	transition: clip-path 1000ms cubic-bezier(.23, 1, .32, 1) 280ms;
}

.as-product__thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px;
}

.as-product__thumb {
	width: 76px;
	height: 76px;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	background: var(--as-mist);
	cursor: pointer;
	opacity: 0;
	transform: translateY(8px);
	animation: as-thumb-in 420ms cubic-bezier(.23, 1, .32, 1) forwards;
	animation-delay: calc(var(--as-i, 0) * 55ms + 220ms);
	transition: border-color 180ms ease, transform 180ms cubic-bezier(.23, 1, .32, 1);
}

@keyframes as-thumb-in {
	to { opacity: 1; transform: none; }
}

.as-product__thumb img { width: 100%; height: 100%; object-fit: cover; }
.as-product__thumb:hover,
.as-product__thumb.is-active { border-color: var(--as-gold); }
.as-product__thumb:active { transform: scale(.95); }

/* ----------------------------------------------------------------- Resumen */

.as-product__maker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px;
	padding: 7px 14px;
	border-radius: 100px;
	font-family: var(--as-font-display);
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--as-gold);
	background: rgba(var(--as-gold-rgb), .1);
	border: 1px solid rgba(var(--as-gold-rgb), .28);
}

.as-product__title {
	font-size: calc(var(--as-fs-5) * var(--as-h2-scale, 1));
	font-family: var(--as-font-display);
	font-weight: var(--as-w-display);
	font-style: var(--as-style-display);
	letter-spacing: var(--as-track-display);
	text-transform: var(--as-case-display);
	line-height: 1.04;
	margin: 0 0 10px;
}

.as-product__sub {
	margin: 0 0 26px;
	font-size: 1.06rem;
	color: var(--as-muted);
	font-variant-numeric: tabular-nums;
}

.as-product__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 1px;
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
	background: var(--as-line);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	overflow: hidden;
}

.as-product__facts li {
	padding: 15px 16px;
	background: var(--as-bg);
}

.as-product__fact-k {
	display: block;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--as-muted);
	margin-bottom: 5px;
}

.as-product__fact-v {
	display: block;
	font-family: var(--as-font-display);
	font-size: 1.24rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}

.as-product__excerpt { margin-bottom: 28px; }

.as-product__buy { display: grid; gap: 12px; }

.as-product__cta,
.as-product__ask {
	width: 100%;
	padding: 18px 26px;
	font-size: .86rem;
}

.as-product__note {
	margin: 4px 0 0;
	font-size: .82rem;
	color: var(--as-muted);
	text-align: center;
}

.as-product__trust {
	display: grid;
	gap: 11px;
	margin: 28px 0 0;
	padding: 22px 0 0;
	list-style: none;
	border-top: 1px solid var(--as-line);
}

.as-product__trust li {
	display: flex;
	align-items: center;
	gap: 11px;
	font-size: .92rem;
	color: var(--as-muted);
}

.as-product__trust svg { color: var(--as-gold); flex: none; }

/* ------------------------------------------------------- Detalle inferior */

.as-product__detail {
	padding-block: clamp(36px, 5vw, 64px);
	border-top: 1px solid var(--as-line);
}

.as-product__detail-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: clamp(30px, 4.5vw, 64px);
	align-items: start;
}

.as-product__desc { margin-top: 44px; }

.as-fitcard {
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-lg);
	overflow: hidden;
	background: var(--as-mist);
}

.as-fitcard__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 18px;
	border-bottom: 1px solid var(--as-line);
}

.as-fitcard__row:last-child { border-bottom: 0; }

.as-fitcard__row span {
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--as-muted);
}

.as-fitcard__row strong {
	font-family: var(--as-font-display);
	font-size: 1rem;
	font-variant-numeric: tabular-nums;
	text-align: right;
}

.as-product__fitnote {
	margin: 18px 0 0;
	padding: 16px 18px;
	font-size: .88rem;
	line-height: 1.6;
	color: var(--as-muted);
	background: rgba(var(--as-gold-rgb), .06);
	border-left: 3px solid var(--as-gold);
	border-radius: 0 var(--as-radius) var(--as-radius) 0;
}

@media (max-width: 980px) {
	.as-product__grid,
	.as-product__detail-grid {
		grid-template-columns: 1fr;
	}
}

/* Barra de compra pegada al pie en móvil */
@media (max-width: 760px) {
	body.as-single-product { padding-bottom: 84px; }

	.as-product__buy {
		position: fixed;
		inset: auto 0 0 0;
		z-index: 120;
		gap: 8px;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
		background: rgba(255, 255, 255, .96);
		backdrop-filter: blur(14px);
		-webkit-backdrop-filter: blur(14px);
		border-top: 1px solid var(--as-line);
		box-shadow: 0 -6px 26px rgba(0, 0, 0, .1);
	}

	.as-product__cta { padding: 15px 22px; }
	.as-product__ask,
	.as-product__note { display: none; }
	.as-dock { bottom: 88px; }
}

/* ================================================================== 7. PIE */

.as-footer {
	position: relative;
	background: var(--as-carbon);
	color: var(--as-dark-muted);
	padding-top: clamp(48px, 6vw, 76px);
	font-size: .92rem;
}

.as-footer__rule {
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: var(--as-gold-grad);
}

.as-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
	gap: clamp(28px, 4vw, 56px);
	padding-bottom: clamp(38px, 5vw, 60px);
}

.as-footer__logo { display: inline-block; line-height: 0; margin-bottom: 20px; }

.as-footer__logo img {
	width: auto;
	height: calc(var(--as-logo-h) * .95);
}

.as-footer.has-mono-logo .as-footer__logo img {
	filter: brightness(0) invert(1);
	opacity: .92;
}

.as-footer__about {
	margin: 0;
	max-width: 42ch;
	line-height: 1.7;
}

.as-footer__title {
	margin: 0 0 18px;
	font-family: var(--as-font-display);
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--as-gold);
}

.as-footer .as-nav__list {
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
}

.as-footer .as-nav__list a {
	padding: 6px 0;
	font-family: var(--as-font-body);
	font-size: .92rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--as-dark-muted);
	transition: color 180ms ease, transform 200ms cubic-bezier(.23, 1, .32, 1);
}

.as-footer .as-nav__list a::after { display: none; }

@media (hover: hover) and (pointer: fine) {
	.as-footer .as-nav__list a:hover {
		color: var(--as-gold);
		transform: translateX(4px);
	}
}

.as-footer__contact {
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-footer__contact li > * {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	padding: 6px 0;
	color: var(--as-dark-muted);
	text-decoration: none;
	transition: color 180ms ease;
}

.as-footer__contact svg { color: var(--as-gold); flex: none; }
.as-footer__contact a:hover { color: var(--as-gold); }

.as-footer__social {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.as-footer__social a {
	display: inline-block;
	padding: 7px 15px;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 100px;
	font-size: .8rem;
	color: var(--as-dark-muted);
	text-decoration: none;
	transition: border-color 180ms ease, color 180ms ease;
}

.as-footer__social a:hover { border-color: var(--as-gold); color: var(--as-gold); }

/* Las redes con icono van en botón redondo; las entradas sueltas del
   repetidor siguen mostrándose como píldora de texto. */
/* Selector con clase + elemento a propósito: `.as-footer__social a` ya vale
   (0,2,0) y ganaba al color de esta regla, dejando los glifos casi invisibles. */
.as-footer__social a.as-footer__soc {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border-radius: 50%;
	color: #fff;
	border-color: rgba(255, 255, 255, .3);
	transition: border-color var(--as-t-hover) ease,
	            color var(--as-t-hover) ease,
	            background-color var(--as-t-hover) ease,
	            transform 220ms cubic-bezier(.34, 1.4, .64, 1);
}

@media (hover: hover) and (pointer: fine) {
	.as-footer__social a.as-footer__soc:hover {
		transform: translateY(-2px);
		border-color: transparent;
		background: var(--as-gold);
		color: var(--as-on-gold);
	}
}

/* El bloque de cierre va centrado: es texto legal y aviso de copyright, no
   navegación, así que alineado a la izquierda quedaba descolgado del resto. */
.as-footer__legal {
	padding-block: 26px 34px;
	border-top: 1px solid rgba(255, 255, 255, .08);
	text-align: center;
}

/* Selector con dos clases a propósito: el reset del plugin usa `.as p`, que
   tiene más especificidad que una sola clase y anulaba el margen automático,
   dejando el bloque pegado a la izquierda. */
.as-footer__legal .as-footer__disclaimer {
	margin: 0 auto 16px;
	max-width: 92ch;
	font-size: .8rem;
	line-height: 1.7;
	text-wrap: pretty;
	color: rgba(255, 255, 255, .38);
}

.as-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 22px;
	font-size: .82rem;
	color: rgba(255, 255, 255, .45);
}

.as-footer__bottom p { margin: 0; }

.as-footer__legalnav {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-footer__legalnav a {
	color: rgba(255, 255, 255, .45);
	text-decoration: none;
	transition: color 180ms ease;
}

.as-footer__legalnav a:hover { color: var(--as-gold); }

@media (max-width: 900px) {
	.as-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.as-footer__col--brand { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
	.as-footer__grid { grid-template-columns: 1fr; }
}

/* ========================================================== 8. PAGINACIÓN */

.as-catalog__more .nav-links {
	display: flex;
	gap: 6px;
	align-items: center;
}

.as-catalog__more .page-numbers {
	display: grid;
	place-items: center;
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	font-family: var(--as-font-display);
	font-weight: 700;
	font-size: .9rem;
	color: var(--as-text);
	text-decoration: none;
	transition: border-color 180ms ease, color 180ms ease, transform 180ms cubic-bezier(.23, 1, .32, 1);
}

.as-catalog__more .page-numbers:hover {
	border-color: var(--as-gold);
	color: var(--as-gold);
}

.as-catalog__more .page-numbers.current {
	background: var(--as-gold-grad);
	border-color: transparent;
	color: var(--as-on-gold);
}

/* =============================================== 9. FORMULARIO DE BÚSQUEDA */

.as-searchform {
	display: flex;
	gap: 8px;
}

.as-searchform input[type="search"] {
	flex: 1;
	padding: 12px 15px;
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	font-family: var(--as-font-body);
	font-size: .95rem;
}

.as-searchform button {
	padding: 12px 20px;
	border: 0;
	border-radius: var(--as-radius);
	background: var(--as-gold-grad);
	color: var(--as-on-gold);
	font-family: var(--as-font-display);
	font-weight: 700;
	font-size: .8rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
}

/* ========================================== 10. AJUSTES DE MOVIMIENTO REDUCIDO */

@media (prefers-reduced-motion: reduce) {
	.as-header,
	.as-drawer__panel,
	.as-drawer__scrim,
	.as-drawer__nav .as-nav__list > li,
	.as-product__thumb,
	.as-topbar__dot {
		transition-duration: .01ms !important;
		animation: none !important;
	}

	.as-drawer__nav .as-nav__list > li { opacity: 1; transform: none; }
	.as-product__thumb { opacity: 1; transform: none; }
	.as-header.is-hidden { transform: none; }
}