/*
 * Hoja única del tema. Los colores de marca solo viven en :root
 * (y PHP los sobrescribe con los de Personalizar → Marca).
 * Editorial minimalista premium: carbón + volt + papel.
 * Móvil primero. Breakpoints: 640 / 900 / 1100 / 1440.
 */

/* ---------- Fuente ---------- */
@font-face {
	font-family: "Archivo";
	font-style: italic;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/archivo-latin-italic.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/archivo-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Tokens ---------- */
:root {
	--nn-ink: #1a1a1a;
	--nn-ink-2: #404040;
	--nn-muted: #5f5f5a; /* 6,4:1 sobre blanco y 5,8:1 sobre --nn-card (AA) */
	--nn-line: #e6e6e3;
	--nn-paper: #fff;
	--nn-card: #f4f4f2;
	--nn-white: #fff;
	--nn-volt: #e1fb0d;
	--nn-volt-ink: #1a1a1a;
	--nn-dark: #111;
	--nn-dark-ink: #fff; /* texto sobre --nn-dark (lo calcula PHP) */
	--nn-display-style: italic; /* Marca → estilo de titulares */
	--nn-display-transform: none; /* Marca → mayúsculas en titulares */
	--nn-ok: #17733f; /* 5,9:1 sobre blanco (antes #1f8a4c: 4,4:1) */
	--nn-error: #c8102e;
	--nn-radius: 18px;
	--nn-radius-s: 10px;
	--nn-gut: clamp(16px, 4vw, 56px);
	--nn-max: 1440px;
	--nn-ease: cubic-bezier(.2, .7, .1, 1);
	--nn-header-h: 68px;
	--nn-gap: clamp(12px, 1.4vw, 20px);
	--nn-font: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--nn-shadow: 0 24px 60px -24px rgba(22, 22, 22, .28);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--nn-header-h) + 16px); }
body {
	margin: 0;
	background: var(--nn-paper);
	color: var(--nn-ink);
	font-family: var(--nn-font);
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: clip;
}
body.nn-lock { overflow: hidden; }
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
.nn-icon { flex: none; max-width: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
h1, h2, h3, h4, h5, h6, p, ul, ol, figure, fieldset, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
fieldset { border: 0; padding: 0; min-width: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--nn-ink); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--nn-volt); color: var(--nn-volt-ink); }
.nn-main { display: block; min-height: 50vh; }
.nn-main:focus { outline: 0; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
.nn-skip {
	position: absolute; left: 16px; top: -100px; z-index: 200;
	background: var(--nn-ink); color: var(--nn-white); padding: 12px 18px; border-radius: 999px; font-weight: 600;
}
.nn-skip:focus { top: 12px; }
.nn-muted { color: var(--nn-muted); }

/* ---------- Layout ---------- */
.nn-wrap { width: 100%; max-width: var(--nn-max); margin-inline: auto; padding-inline: var(--nn-gut); }
.nn-section { padding-block: clamp(48px, 8vw, 112px); }
.nn-sec-soft { background: var(--nn-white); border-top: 1px solid var(--nn-line); }
.nn-sec-head {
	display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
	gap: 16px 32px; margin-bottom: clamp(24px, 3vw, 40px);
}
.nn-sec-head .nn-eyebrow { margin-bottom: 12px; }

/* ---------- Tipografía ---------- */
.nn-display {
	font-style: var(--nn-display-style);
	font-weight: 900;
	letter-spacing: -.02em;
	line-height: .95;
	text-transform: var(--nn-display-transform);
	overflow-wrap: normal;
	hyphens: none;
}
.nn-h1 { font-size: clamp(40px, 6vw, 88px); }
.nn-h2 { font-size: clamp(36px, 4.6vw, 60px); }
.nn-h3 { font-size: clamp(26px, 3vw, 40px); }
.nn-h4 { font-size: 22px; letter-spacing: -.01em; }

/* Palabra clave subrayada con «rotulador» volt (40 % de la altura, ligeramente inclinado). */
.nn-hl { position: relative; isolation: isolate; white-space: nowrap; padding-inline: .04em; }
.nn-hl::after {
	content: ""; position: absolute; z-index: -1; left: -.04em; right: -.06em; bottom: .04em; height: 40%;
	background: var(--nn-volt); border-radius: .1em; transform: skewX(-12deg) rotate(-1.5deg);
}
/* Marca → «subrayado tipo rotulador» desactivado. */
.nn-no-marker .nn-hl { padding-inline: 0; }
.nn-no-marker .nn-hl::after { display: none; }
/* Sobre volt el rotulador es blanco; sobre negro, una línea volt bajo la palabra (sin tapar el texto). */
.nn-club .nn-hl::after, .nn-tile--2 .nn-hl::after { background: var(--nn-white); }
.nn-banner .nn-hl::after, .nn-footer .nn-hl::after { bottom: -.1em; height: .14em; }
.nn-eyebrow {
	display: inline-block;
	font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
	color: var(--nn-muted);
	font-stretch: 100%;
}
.nn-eyebrow--dot::before {
	content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%;
	background: var(--nn-volt); box-shadow: 0 0 0 1px var(--nn-ink); vertical-align: 1px;
}
.nn-price { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nn-price del { color: var(--nn-muted); font-weight: 400; margin-right: 6px; }
.nn-price ins { text-decoration: none; }
.nn-price--l { font-size: 28px; letter-spacing: -.01em; }

.nn-prose { max-width: 72ch; color: var(--nn-ink-2); }
.nn-prose > * + * { margin-top: 1em; }
.nn-prose h2, .nn-prose h3 { color: var(--nn-ink); font-weight: 700; line-height: 1.2; margin-top: 1.6em; }
.nn-prose h2 { font-size: 24px; }
.nn-prose h3 { font-size: 19px; }
.nn-prose a { text-decoration: underline; text-underline-offset: 3px; }
.nn-prose ul { list-style: disc; padding-left: 1.2em; }
.nn-prose ol { list-style: decimal; padding-left: 1.2em; }
.nn-prose li + li { margin-top: .35em; }
.nn-prose strong { color: var(--nn-ink); }

.nn-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: 14px; }
.nn-table th, .nn-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--nn-line); }
.nn-table th { font-weight: 600; color: var(--nn-ink); background: var(--nn-paper); }

/* ---------- Botones ---------- */
.nn-btn,
.button,
button.button,
a.button,
input.button,
.single_add_to_cart_button,
.woocommerce-button {
	position: relative; isolation: isolate; overflow: hidden;
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	min-height: 52px; padding: 0 26px;
	border-radius: 999px; border: 0;
	background: var(--nn-ink); color: var(--nn-white);
	font-family: inherit; font-size: 15px; font-weight: 600; line-height: 1; letter-spacing: .01em;
	text-decoration: none; white-space: nowrap; cursor: pointer;
	transition: color .3s var(--nn-ease), box-shadow .3s var(--nn-ease);
}
.nn-btn::before,
.button::before,
.single_add_to_cart_button::before {
	content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
	background: var(--nn-volt); transform: translateY(101%); transition: transform .4s var(--nn-ease);
}
.nn-btn:hover, .button:hover, .single_add_to_cart_button:hover { color: var(--nn-volt-ink); }
.nn-btn:hover::before, .button:hover::before, .single_add_to_cart_button:hover::before { transform: none; }
.nn-btn .nn-icon { width: 18px; height: 18px; transition: transform .3s var(--nn-ease); }
.nn-btn:hover .nn-icon { transform: translateX(3px); }
.nn-btn--ghost { background: transparent; color: var(--nn-ink); box-shadow: inset 0 0 0 1.5px var(--nn-ink); }
.nn-btn--ghost::before { background: var(--nn-ink); }
.nn-btn--ghost:hover { color: var(--nn-white); }
.nn-btn--volt { background: var(--nn-volt); color: var(--nn-volt-ink); }
.nn-btn--volt::before { background: var(--nn-white); }
.nn-btn--s { min-height: 44px; padding: 0 18px; font-size: 14px; }
.nn-btn[disabled], .button.disabled, .button:disabled, .single_add_to_cart_button.disabled { opacity: .45; cursor: not-allowed; }
.nn-btn.is-loading, .single_add_to_cart_button.is-loading, .button.loading { pointer-events: none; opacity: .7; }
.single_add_to_cart_button.is-loading::after {
	content: ""; width: 16px; height: 16px; border-radius: 50%;
	border: 2px solid currentColor; border-right-color: transparent; animation: nn-spin .7s linear infinite;
}
@keyframes nn-spin { to { transform: rotate(360deg); } }

.nn-link-arrow {
	display: inline-flex; align-items: center; gap: 10px;
	font-weight: 600; font-size: 15px;
	padding-bottom: 4px; border-bottom: 1.5px solid currentColor;
}
.nn-link-arrow .nn-icon { width: 16px; height: 16px; transition: transform .3s var(--nn-ease); }
.nn-link-arrow:hover .nn-icon { transform: translateX(4px); }

.nn-icon-btn {
	position: relative; display: inline-grid; place-items: center;
	width: 44px; height: 44px; border-radius: 50%;
	transition: background-color .2s;
}
.nn-icon-btn:hover { background: color-mix(in srgb, var(--nn-ink) 6%, transparent); }
.nn-icon-btn .nn-icon { width: 22px; height: 22px; }

.nn-arrow {
	display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
	box-shadow: inset 0 0 0 1.5px currentColor; transition: background-color .2s, color .2s, opacity .2s;
}
.nn-arrow:hover { background: var(--nn-ink); color: var(--nn-white); }
.nn-arrow[disabled] { opacity: .3; pointer-events: none; }
.nn-arrow .nn-icon { width: 18px; height: 18px; }
.nn-arrow--s { width: 40px; height: 40px; }

/* ---------- Formularios ---------- */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="search"], input[type="number"], input[type="url"], select, textarea {
	width: 100%; min-height: 50px; padding: 0 16px;
	border: 1px solid var(--nn-line); border-radius: 12px;
	background: var(--nn-white); color: var(--nn-ink);
	font: inherit; font-size: 16px;
	transition: border-color .2s, box-shadow .2s;
	-webkit-appearance: none; appearance: none;
}
textarea { padding: 14px 16px; min-height: 110px; }
select {
	padding-right: 40px; cursor: pointer;
	background-image: linear-gradient(45deg, transparent 50%, var(--nn-ink) 50%), linear-gradient(135deg, var(--nn-ink) 50%, transparent 50%);
	background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; background-position: right 20px center, right 14px center;
}
::placeholder { color: var(--nn-muted); opacity: 1; } /* el gris por defecto del navegador da 2,3:1 */
input:focus, select:focus, textarea:focus { outline: 0; border-color: var(--nn-ink); box-shadow: 0 0 0 3px color-mix(in srgb, var(--nn-ink) 8%, transparent); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--nn-ink); width: 18px; height: 18px; }
.nn-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.45; cursor: pointer; }
.nn-check input { flex: none; margin: 1px 0 0; }
.nn-check a { text-decoration: underline; text-underline-offset: 2px; }

/* ---------- Avisos de WooCommerce ---------- */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
	margin: 0 0 20px; padding: 14px 18px; list-style: none;
	border-radius: var(--nn-radius-s); background: var(--nn-white); border: 1px solid var(--nn-line);
	font-size: 15px;
}
.woocommerce-message { border-left: 4px solid var(--nn-ok); }
.woocommerce-info { border-left: 4px solid var(--nn-ink); }
.woocommerce-error { border-left: 4px solid var(--nn-error); display: block; }
.woocommerce-error li + li { margin-top: 6px; }
.woocommerce-error ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-message .button, .woocommerce-info .button { min-height: 40px; padding: 0 16px; font-size: 13px; order: 2; }

/* ---------- Cinta superior ---------- */
.nn-ticker {
	position: relative; z-index: 51;
	background: var(--nn-volt); color: var(--nn-volt-ink);
	font-size: 12.5px; font-weight: 500; letter-spacing: .04em;
	overflow: hidden; white-space: nowrap;
}
.nn-ticker__track { display: flex; width: max-content; animation: nn-marquee 38s linear infinite; }
.nn-ticker:hover .nn-ticker__track, .nn-ticker:focus-within .nn-ticker__track { animation-play-state: paused; }
.nn-ticker__list { display: flex; flex: none; }
.nn-ticker__list li { display: flex; align-items: center; padding: 10px 0; }
.nn-ticker__list li { font-weight: 600; }
.nn-ticker__list li::after { content: "✦"; color: var(--nn-volt-ink); margin-inline: 28px; font-size: 10px; }
@keyframes nn-marquee { to { transform: translateX(-50%); } }

/* ---------- Cabecera ---------- */
.nn-header {
	position: sticky; top: 0; z-index: 50;
	background: color-mix(in srgb, var(--nn-white) 90%, transparent);
	-webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px);
	border-bottom: 1px solid transparent;
	transition: border-color .3s, box-shadow .3s;
}
.nn-header.is-scrolled { border-bottom-color: var(--nn-line); }
.nn-header__in { display: flex; align-items: center; gap: 12px; height: var(--nn-header-h); }
.nn-logo { display: inline-flex; align-items: center; gap: 10px; flex: none; }
.nn-logo__mark { width: 36px; height: 36px; flex: none; }
.nn-logo img { width: auto; height: 20px; }
.nn-logo__text { font-size: 22px; font-weight: 900; font-style: var(--nn-display-style); letter-spacing: -.02em; line-height: 1; white-space: nowrap; }
.nn-logo--footer .nn-logo__text { color: var(--nn-dark-ink); }
.nn-header .nn-logo { margin-right: auto; }
.nn-header__icons { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.nn-burger { margin-left: -10px; }
.nn-cart-btn { position: relative; }
.nn-cart-count {
	display: inline-grid; place-items: center; min-width: 19px; height: 19px; padding: 0 5px;
	border-radius: 999px; background: var(--nn-volt); color: var(--nn-volt-ink);
	box-shadow: 0 0 0 1.5px var(--nn-ink);
	font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1;
}
.nn-cart-btn .nn-cart-count { position: absolute; top: 3px; right: 0; }
.nn-cart-count.is-empty { display: none; }
.nn-cart-count.is-bump { animation: nn-bump .5s var(--nn-ease); }
@keyframes nn-bump { 40% { transform: scale(1.35); } }

/* Menú principal (escritorio) */
.nn-nav { display: none; }
.nn-nav__list { display: flex; align-items: center; gap: 2px; }
.nn-nav__item { display: flex; align-items: center; }
.nn-nav__link {
	position: relative; display: inline-flex; align-items: center; height: var(--nn-header-h); padding: 0 10px;
	font-size: 14px; font-weight: 600; letter-spacing: .005em; white-space: nowrap;
}
.nn-nav__link::after {
	content: ""; position: absolute; left: 10px; right: 10px; bottom: 20px; height: 3px; border-radius: 2px;
	background: var(--nn-volt); box-shadow: 0 0 0 .5px var(--nn-ink);
	transform: scaleX(0); transform-origin: left; transition: transform .35s var(--nn-ease);
}
.nn-nav__item:hover .nn-nav__link::after,
.nn-nav__link[aria-current]::after,
.nn-nav__item.is-open .nn-nav__link::after { transform: none; }
.nn-nav__toggle { display: grid; place-items: center; width: 28px; height: 32px; margin-left: -4px; border-radius: 6px; position: relative; z-index: 1; } /* objetivo táctil ≥ 24 px y sin solape con el enlace */
.nn-nav__toggle .nn-icon { width: 14px; height: 14px; transition: transform .25s; }
.nn-nav__item.is-open .nn-nav__toggle .nn-icon { transform: rotate(180deg); }

.nn-mega, .nn-dropdown {
	position: absolute; left: 0; right: 0; top: 100%;
	background: var(--nn-paper); border-top: 1px solid var(--nn-line); box-shadow: var(--nn-shadow);
	visibility: hidden; opacity: 0; transform: translateY(-6px);
	transition: opacity .25s var(--nn-ease), transform .25s var(--nn-ease), visibility 0s .25s;
}
.nn-dropdown { left: auto; right: auto; min-width: 240px; border-radius: 0 0 var(--nn-radius-s) var(--nn-radius-s); padding: 12px; }
.nn-nav__item { position: relative; }
.nn-nav__item.has-panel:has(.nn-mega) { position: static; }
.nn-dropdown a { display: block; padding: 8px 12px; border-radius: 8px; font-size: 14px; }
.nn-dropdown a:hover { background: var(--nn-card); }
.nn-nav__item.is-open > .nn-mega,
.nn-nav__item.is-open > .nn-dropdown,
.nn-nav__item.has-panel:hover:not(.is-closed) > .nn-mega,
.nn-nav__item.has-panel:hover:not(.is-closed) > .nn-dropdown,
.nn-nav__item.has-panel:focus-within:not(.is-closed) > .nn-mega,
.nn-nav__item.has-panel:focus-within:not(.is-closed) > .nn-dropdown {
	visibility: visible; opacity: 1; transform: none; transition-delay: 0s;
}
.nn-mega__in { display: grid; grid-template-columns: 260px 1fr; gap: 48px; padding-block: 40px 48px; }
.nn-mega__side { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.nn-mega__title { font-size: 40px; line-height: .95; }
.nn-mega__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 28px 24px; }
.nn-mega__league { display: flex; align-items: baseline; gap: 6px; font-weight: 700; font-size: 15px; margin-bottom: 10px; }
.nn-mega__league em { font-style: normal; font-weight: 500; font-size: 11px; color: var(--nn-muted); }
.nn-mega__league:hover { text-decoration: underline; text-decoration-color: var(--nn-volt); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.nn-mega__col ul li a { display: block; padding: 3px 0; font-size: 14px; color: var(--nn-ink-2); }
.nn-mega__col ul li a:hover { color: var(--nn-ink); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Cajones (drawer) y búsqueda ---------- */
.nn-drawer { position: fixed; inset: 0; z-index: 100; }
body.admin-bar .nn-drawer { top: var(--wp-admin--admin-bar--height, 0px); }
.nn-drawer__overlay {
	position: absolute; inset: 0; background: color-mix(in srgb, var(--nn-ink) 45%, transparent);
	opacity: 0; transition: opacity .35s var(--nn-ease);
}
.nn-drawer__panel {
	position: absolute; top: 0; bottom: 0; width: min(440px, 92vw);
	display: flex; flex-direction: column;
	background: var(--nn-paper); box-shadow: var(--nn-shadow);
	transition: transform .45s var(--nn-ease);
}
.nn-drawer--right .nn-drawer__panel { right: 0; transform: translateX(100%); }
.nn-drawer--left .nn-drawer__panel { left: 0; transform: translateX(-100%); }
.nn-drawer--top .nn-drawer__panel { left: 0; right: 0; bottom: auto; width: 100%; transform: translateY(-100%); padding-block: 24px 32px; }
.nn-drawer.is-open .nn-drawer__overlay { opacity: 1; }
.nn-drawer.is-open .nn-drawer__panel { transform: none; }
.nn-drawer__head {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 16px 16px 16px 24px; border-bottom: 1px solid var(--nn-line);
}
.nn-drawer__head .nn-h4 { display: flex; align-items: center; gap: 10px; }
.nn-drawer__head .nn-cart-count { font-stretch: 100%; letter-spacing: 0; }
.nn-drawer__scroll { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 8px 24px 24px; }
.nn-drawer__foot { display: grid; grid-template-columns: 1fr 1.4fr; gap: 10px; padding: 16px 24px 24px; border-top: 1px solid var(--nn-line); }
.nn-logo--s img { height: 16px; }
.nn-logo--s .nn-logo__mark { width: 30px; height: 30px; }

.nn-search__form {
	display: flex; align-items: center; gap: 10px;
	padding: 6px 6px 6px 20px; border-radius: 999px; background: var(--nn-white); border: 1px solid var(--nn-line);
}
.nn-search__form > .nn-icon { width: 22px; height: 22px; flex: none; color: var(--nn-muted); }
.nn-search__form input[type="search"] { border: 0; min-height: 52px; padding: 0 4px; font-size: 18px; background: transparent; box-shadow: none; }
.nn-search__popular { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 20px; }

/* Selector de idioma y moneda (WPML/WCML) */
.nn-switch { position: relative; }
.nn-switch--header { display: none; }
.nn-switch__btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 10px; border-radius: 999px; font-size: 13px; font-weight: 600; letter-spacing: .04em; }
.nn-switch__btn:hover { background: color-mix(in srgb, var(--nn-ink) 6%, transparent); }
.nn-switch__btn .nn-icon { width: 14px; height: 14px; transition: transform .25s; }
.nn-switch__btn[aria-expanded="true"] .nn-icon { transform: rotate(180deg); }
.nn-switch__flag, .nn-switch__list img { width: 18px; height: 12px; border-radius: 2px; object-fit: cover; box-shadow: 0 0 0 1px var(--nn-line); }
.nn-switch__panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; min-width: 220px; padding: 12px; border-radius: var(--nn-radius-s); background: var(--nn-white); border: 1px solid var(--nn-line); box-shadow: var(--nn-shadow); }
.nn-switch--drawer .nn-switch__panel { position: static; margin-top: 8px; box-shadow: none; }
.nn-switch__h { padding: 4px 6px; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--nn-muted); }
.nn-switch__list a { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 8px; border-radius: 8px; font-size: 14px; font-weight: 500; }
.nn-switch__list a:hover, .nn-switch__list a[aria-current] { background: var(--nn-card); }
.nn-switch__currency { padding: 4px 6px; font-size: 14px; }
.nn-switch__currency ul { display: flex; flex-wrap: wrap; gap: 6px; }
.nn-switch__currency a, .nn-switch__currency li > span { display: inline-flex; min-height: 36px; align-items: center; padding: 0 12px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--nn-line); }
.nn-switch__currency .wcml-cs-active-currency > * { background: var(--nn-ink); color: var(--nn-white); box-shadow: none; }
@media (min-width: 900px) { .nn-switch--header { display: block; } }

/* Sugerencias del buscador */
.nn-suggest { margin-top: 12px; max-height: min(60vh, 520px); overflow-y: auto; padding: 8px; border-radius: var(--nn-radius); background: var(--nn-white); border: 1px solid var(--nn-line); box-shadow: var(--nn-shadow); }
.nn-suggest__h { padding: 8px 10px 4px; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--nn-muted); }
.nn-suggest__opt { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 12px; }
.nn-suggest__opt[aria-selected="true"], .nn-suggest__opt:hover { background: var(--nn-card); }
.nn-suggest__img { flex: none; width: 44px; height: 44px; border-radius: 10px; background: var(--nn-card); overflow: hidden; }
.nn-suggest__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.nn-suggest__img:empty { display: grid; place-items: center; }
.nn-suggest__img:empty::before {
	content: ""; width: 22px; height: 22px; background: var(--nn-ink-2);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M8 3 3 6l2 5 2-1v11h10V10l2 1 2-5-5-3c-.5 1.7-2 3-4 3S8.5 4.7 8 3Z'/%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='%23000' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M8 3 3 6l2 5 2-1v11h10V10l2 1 2-5-5-3c-.5 1.7-2 3-4 3S8.5 4.7 8 3Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.nn-suggest__txt { display: flex; flex-direction: column; min-width: 0; font-size: 14px; font-weight: 600; }
.nn-suggest__txt span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nn-suggest__txt em { font-style: normal; font-weight: 500; font-size: 12.5px; color: var(--nn-muted); }
.nn-suggest__all { display: block; margin-top: 4px; padding: 12px 10px; border-top: 1px solid var(--nn-line); font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Menú móvil */
.nn-mnav { border-top: 1px solid var(--nn-line); margin-top: 8px; }
.nn-mnav__item { border-bottom: 1px solid var(--nn-line); }
.nn-mnav__row { display: flex; align-items: center; justify-content: space-between; min-height: 56px; }
.nn-mnav__row > a { flex: 1; padding: 14px 0; font-size: 17px; font-weight: 600; }
.nn-mnav__toggle { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; }
.nn-mnav__toggle .nn-icon { width: 18px; height: 18px; transition: transform .25s; }
.nn-mnav__toggle[aria-expanded="true"] .nn-icon { transform: rotate(180deg); }
.nn-mnav__sub { padding: 0 0 12px 12px; }
.nn-mnav__sub .nn-mnav__row { min-height: 44px; }
.nn-mnav__sub .nn-mnav__row > a, .nn-mnav__sub > li > a { display: block; padding: 10px 0; font-size: 15px; font-weight: 500; }
.nn-mnav__sub--3 { padding-left: 12px; border-left: 2px solid var(--nn-volt); margin-left: 2px; }
.nn-mnav__sub--3 a { color: var(--nn-ink-2); font-size: 14px !important; }
.nn-mnav__extra { display: grid; gap: 4px; margin-top: 20px; }
.nn-mnav__extra a { display: flex; align-items: center; gap: 12px; min-height: 44px; font-weight: 500; }
.nn-mnav__extra .nn-icon { width: 20px; height: 20px; }

/* ---------- Chips ---------- */
.nn-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nn-chip {
	display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px;
	border-radius: 999px; background: var(--nn-white); border: 1px solid var(--nn-line);
	font-size: 14px; font-weight: 600; white-space: nowrap;
	transition: background-color .2s, border-color .2s, color .2s;
}
.nn-chip em { font-style: normal; font-weight: 500; font-size: 12px; color: var(--nn-muted); }
.nn-chip:hover { border-color: var(--nn-ink); }
.nn-chip.is-active, .nn-chip--on { background: var(--nn-ink); color: var(--nn-white); border-color: var(--nn-ink); }
.nn-chip.is-active em, .nn-chip--on em { color: color-mix(in srgb, var(--nn-white) 70%, transparent); }
.nn-chip--on .nn-icon { width: 14px; height: 14px; }
.nn-chip--ghost { background: transparent; }
.nn-chips--scroll {
	flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
	margin-inline: calc(var(--nn-gut) * -1); padding-inline: var(--nn-gut);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--nn-gut), #000 calc(100% - 40px), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 var(--nn-gut), #000 calc(100% - 40px), transparent);
}
.nn-chips--scroll::-webkit-scrollbar { display: none; }

/* ---------- Insignias ---------- */
.nn-badges { position: absolute; top: 12px; left: 12px; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px; }
.nn-badge {
	display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 6px;
	font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1;
}
.nn-badge--new { background: var(--nn-volt); color: var(--nn-volt-ink); }
.nn-badge--sale { background: var(--nn-ink); color: var(--nn-white); }
.nn-badge--kids { background: var(--nn-paper); color: var(--nn-ink); box-shadow: inset 0 0 0 1px var(--nn-ink); }
.nn-badge--out { background: var(--nn-white); color: var(--nn-muted); }

/* ---------- Tarjeta de producto ---------- */
.nn-card { position: relative; display: flex; flex-direction: column; min-width: 0; }
.nn-card__media {
	position: relative; aspect-ratio: 1 / 1; overflow: hidden;
	border-radius: var(--nn-radius); background: var(--nn-card);
	isolation: isolate;
}
.nn-card__img {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: contain; mix-blend-mode: multiply;
	transition: transform .7s var(--nn-ease), opacity .45s var(--nn-ease);
}
.nn-card__img--alt { opacity: 0; }
.nn-card:hover .nn-card__img { transform: scale(1.04); }
.nn-card.has-alt:hover .nn-card__img:not(.nn-card__img--alt) { opacity: 0; }
.nn-card.has-alt:hover .nn-card__img--alt { opacity: 1; }
.nn-card__body { display: flex; flex-direction: column; gap: 4px; padding: 14px 4px 0; flex: 1; }
.nn-card__meta {
	font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--nn-muted);
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.nn-card__title {
	font-size: 15px; font-weight: 600; line-height: 1.3; letter-spacing: -.005em;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nn-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: var(--nn-radius); }
.nn-card__title a:focus-visible { outline: 0; }
.nn-card:has(.nn-card__title a:focus-visible) { outline: 2px solid var(--nn-ink); outline-offset: 4px; border-radius: var(--nn-radius); }
.nn-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 6px; }
.nn-card__cta {
	display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 999px;
	box-shadow: inset 0 0 0 1.5px var(--nn-ink); font-size: 13px; font-weight: 600;
	transition: background-color .25s, color .25s;
}
.nn-card__cta .nn-icon { width: 14px; height: 14px; }
.nn-card:hover .nn-card__cta { background: var(--nn-volt); box-shadow: inset 0 0 0 1.5px var(--nn-ink); }

/* ---------- Rejilla ---------- */
.nn-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px var(--nn-gap); }

/* ---------- Rail (carrusel) y pestañas ---------- */
.nn-rail {
	display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * var(--nn-gap)) / 2.2);
	gap: var(--nn-gap); overflow-x: auto; overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth;
	padding-bottom: 4px;
}
.nn-rail::-webkit-scrollbar { display: none; }
.nn-rail:focus-visible { outline-offset: 6px; }
.nn-rail__item { scroll-snap-align: start; min-width: 0; }
.nn-rail-nav { display: none; gap: 8px; }
.nn-rail__more { margin-top: 28px; }
.nn-tabs {
	display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-bottom: 28px;
	margin-inline: calc(var(--nn-gut) * -1); padding-inline: var(--nn-gut);
}
.nn-tabs::-webkit-scrollbar { display: none; }
.nn-tab {
	flex: none; min-height: 44px; padding: 0 18px; border-radius: 999px;
	font-size: 14px; font-weight: 600; color: var(--nn-muted);
	box-shadow: inset 0 0 0 1px var(--nn-line); transition: color .2s, background-color .2s, box-shadow .2s;
}
.nn-tab:hover { color: var(--nn-ink); box-shadow: inset 0 0 0 1px var(--nn-ink); }
.nn-tab[aria-selected="true"] { background: var(--nn-ink); color: var(--nn-white); box-shadow: none; }
.nn-tab[aria-selected="true"]::before, .nn-chip.is-active::before {
	content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--nn-volt); vertical-align: 1px;
}
.nn-chip.is-active::before { margin-right: 0; }
.nn-tabpanel { animation: nn-fade .5s var(--nn-ease); }
@keyframes nn-fade { from { opacity: 0; transform: translateY(8px); } }

/* ---------- Hero ---------- */
.nn-hero { position: relative; overflow: hidden; padding-top: clamp(20px, 4vw, 48px); }
.nn-hero__slides { display: grid; }
.nn-hero__slide {
	grid-area: 1 / 1; min-width: 0;
	opacity: 0; visibility: hidden; transition: opacity .8s var(--nn-ease), visibility 0s .8s;
}
.nn-hero__slide.is-active { opacity: 1; visibility: visible; transition-delay: 0s; }
.nn-hero__in { position: relative; display: grid; gap: 28px; align-items: center; padding-block: 8px 12px; }
.nn-hero__mark {
	position: absolute; z-index: 0; right: -2vw; top: 50%; transform: translateY(-50%);
	font-size: clamp(160px, 34vw, 520px); line-height: .8; color: var(--nn-ink); opacity: .03;
	white-space: nowrap; pointer-events: none; user-select: none;
}
.nn-hero__copy { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; min-width: 0; }
.nn-hero__title { font-size: clamp(40px, 12vw, 56px); max-width: 12ch; }
.nn-hero__text { max-width: 44ch; font-size: 17px; color: var(--nn-ink-2); }
.nn-hero__btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
/*
 * Regla del tema: mix-blend-mode solo cuando el fondo inmediato de la imagen es blanco o gris claro;
 * nunca sobre volt ni sobre negro (tiñe la foto). En el hero cada producto va en su propio
 * contenedor gris claro y la forma volt queda desplazada detrás, asomando por la esquina.
 */
.nn-hero__media { position: relative; z-index: 1; aspect-ratio: 1 / .86; min-width: 0; container-type: inline-size; }
/*
 * Blob volt (~55 % del alto de la tarjeta) centrado cerca de la esquina superior derecha
 * de la tarjeta principal: asoma por detrás sin formar un bloque vacío. Se coloca con
 * unidades de contenedor (cqw) porque la tarjeta se dimensiona por el ancho del bloque.
 */
.nn-hero__media::before {
	--nn-card-w: 60cqw; --nn-blob: calc(var(--nn-card-w) * .55);
	content: ""; position: absolute; z-index: 0; width: var(--nn-blob); aspect-ratio: 1;
	left: calc(var(--nn-card-w) - var(--nn-blob) * .62);
	bottom: calc(var(--nn-card-w) - var(--nn-blob) * .62);
	border-radius: 58% 42% 55% 45% / 48% 58% 42% 52%;
	background: var(--nn-volt); transform-origin: 30% 70%;
}
.nn-hero__slide.is-single .nn-hero__media::before { --nn-card-w: 78cqw; }
/* Con dos productos, el blob asoma por la esquina de la tarjeta trasera (arriba a la derecha). */
.nn-hero__slide:not(.is-single) .nn-hero__media::before {
	--nn-card-w: 46cqw; left: auto; bottom: auto;
	right: calc(4cqw - var(--nn-blob) * .38); top: calc(8% - var(--nn-blob) * .38);
}
.nn-hero__slide.is-active .nn-hero__media::before { animation: nn-pop .9s var(--nn-ease) both; }
@keyframes nn-pop { from { transform: scale(.6) rotate(-20deg); opacity: 0; } }
.nn-hero__prod {
	position: absolute; display: block; width: 68%; aspect-ratio: 1;
	border-radius: 32px; overflow: hidden; isolation: isolate; background: var(--nn-card);
	box-shadow: 0 30px 60px -30px color-mix(in srgb, var(--nn-ink) 35%, transparent);
}
.nn-hero__prod img {
	width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; /* fondo inmediato: gris claro */
	transition: transform 1.2s var(--nn-ease);
}
.nn-hero__slide.is-single .nn-hero__prod--a { left: 0; top: auto; bottom: 0; width: 78%; }
.nn-hero__prod--a { left: 0; bottom: 0; z-index: 2; width: 60%; }
.nn-hero__prod--b { right: 4%; top: 8%; z-index: 1; width: 46%; }
.nn-hero__slide.is-active .nn-hero__prod--a img { animation: nn-float-a 1.2s var(--nn-ease) both; }
.nn-hero__slide.is-active .nn-hero__prod--b img { animation: nn-float-b 1.4s var(--nn-ease) both; }
@keyframes nn-float-a { from { transform: translate(-4%, 4%) rotate(-3deg); opacity: 0; } }
@keyframes nn-float-b { from { transform: translate(6%, 2%) rotate(4deg); opacity: 0; } }
.nn-hero__prod:hover img { transform: scale(1.03) rotate(-1deg); }
.nn-hero__tag {
	position: absolute; left: 6%; bottom: 6%; z-index: 3;
	display: none; flex-direction: column; gap: 2px; max-width: 70%;
	padding: 10px 14px; border-radius: 12px; background: color-mix(in srgb, var(--nn-white) 86%, transparent);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	font-size: 12px; line-height: 1.3; box-shadow: 0 8px 24px -12px color-mix(in srgb, var(--nn-ink) 25%, transparent);
}
.nn-hero__tag > span { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nn-hero__prod--b .nn-hero__tag { display: none; }
.nn-hero__foot {
	position: relative; z-index: 2;
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px;
	padding-block: 20px clamp(28px, 4vw, 48px);
}
.nn-hero__from { display: flex; flex-wrap: wrap; gap: 8px; }
.nn-hero__from a {
	display: inline-flex; align-items: baseline; gap: 8px; padding: 10px 14px; border-radius: 12px;
	background: var(--nn-white); border: 1px solid var(--nn-line); font-size: 13px;
	transition: border-color .2s;
}
.nn-hero__from a:hover { border-color: var(--nn-ink); }
.nn-hero__from span { color: var(--nn-muted); font-weight: 500; }
.nn-hero__from strong { font-weight: 700; font-variant-numeric: tabular-nums; }
.nn-hero__ctrl { display: flex; align-items: center; gap: 10px; }
.nn-hero__count { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--nn-muted); min-width: 56px; text-align: center; }
.nn-hero__count b { color: var(--nn-ink); }
[data-nn-hero-pause] .is-play { display: none; }
[data-nn-hero-pause][aria-pressed="true"] .is-play { display: block; }
[data-nn-hero-pause][aria-pressed="true"] .is-pause { display: none; }

/* ---------- Bento de categorías ---------- */
.nn-bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 210px; gap: var(--nn-gap); }
.nn-tile {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-direction: column; justify-content: space-between;
	padding: 18px; border-radius: var(--nn-radius); background: var(--nn-white);
	border: 1px solid var(--nn-line);
	transition: border-color .3s var(--nn-ease);
}
.nn-tile:hover { border-color: var(--nn-ink); }
.nn-tile--1 { grid-column: span 2; grid-row: span 2; }
.nn-tile--2 { background: var(--nn-volt); border-color: var(--nn-volt); }
.nn-tile--2 .nn-eyebrow { color: var(--nn-volt-ink); }
.nn-tile--2:hover { border-color: var(--nn-ink); }
.nn-tile--2 .nn-tile__img { right: 14px; bottom: 14px; width: 58%; border-radius: 20px; overflow: hidden; background: var(--nn-white); }
.nn-tile--2 .nn-tile__img img { mix-blend-mode: normal; }
.nn-tile__img { position: absolute; right: -8%; bottom: -10%; width: 78%; aspect-ratio: 1; }
.nn-tile__img img {
	width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply;
	transition: transform .8s var(--nn-ease);
}
.nn-tile--1 .nn-tile__img { width: 72%; right: -4%; bottom: -6%; }
.nn-tile--1 .nn-tile__img { border-radius: 50%; background: var(--nn-card); overflow: hidden; isolation: isolate; }
.nn-tile--1 .nn-tile__img img { padding: 9%; }
.nn-tile:hover .nn-tile__img img { transform: scale(1.06) rotate(-2deg); }
.nn-tile__txt { position: relative; display: flex; flex-direction: column; gap: 8px; max-width: 80%; }
.nn-tile__title { font-size: clamp(22px, 2.4vw, 36px); }
.nn-tile--1 .nn-tile__title { font-size: clamp(34px, 4.6vw, 64px); }
.nn-tile__arrow {
	position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	background: var(--nn-card); color: var(--nn-ink);
	transition: background-color .3s, transform .4s var(--nn-ease);
}
.nn-tile__arrow .nn-icon { width: 18px; height: 18px; }
.nn-tile:hover .nn-tile__arrow { background: var(--nn-volt); transform: rotate(-45deg); }
.nn-tile--2 .nn-tile__arrow { background: var(--nn-white); }
.nn-tile--2:hover .nn-tile__arrow { background: var(--nn-ink); color: var(--nn-volt); }

/* ---------- Banner oscuro ---------- */
.nn-banner {
	position: relative; overflow: hidden; isolation: isolate;
	background: var(--nn-dark); color: var(--nn-dark-ink);
	padding-block: clamp(56px, 9vw, 128px);
}
.nn-banner::before {
	content: ""; position: absolute; inset: 0; z-index: -1; opacity: .09; pointer-events: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.nn-banner__in { display: grid; gap: 40px; align-items: center; }
.nn-banner__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.nn-banner .nn-eyebrow { color: color-mix(in srgb, var(--nn-dark-ink) 66%, transparent); }
.nn-banner__title { color: var(--nn-volt); font-size: clamp(40px, 5.6vw, 80px); max-width: 13ch; }
.nn-banner__text { max-width: 48ch; font-size: 17px; color: color-mix(in srgb, var(--nn-dark-ink) 78%, transparent); }
.nn-banner__list { display: flex; flex-wrap: wrap; gap: 8px; }
.nn-banner__list li {
	padding: 8px 14px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--nn-white) 22%, transparent);
	font-size: 13px; font-weight: 600;
}
.nn-banner__media { display: grid; place-items: center; }
.nn-banner__media img { border-radius: var(--nn-radius); }
.nn-jersey { width: min(100%, 420px); height: auto; filter: drop-shadow(0 40px 60px color-mix(in srgb, var(--nn-ink) 50%, transparent)); transform: rotate(4deg); }

/* ---------- Encuentra tu equipo ---------- */
.nn-equipos__in { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 28px; }
.nn-equipos__head { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.nn-finder { position: relative; width: 100%; max-width: 760px; display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 20px; border-radius: 999px; background: var(--nn-white); border: 1.5px solid var(--nn-ink); text-align: left; }
.nn-finder > .nn-icon { width: 22px; height: 22px; flex: none; color: var(--nn-muted); }
.nn-finder input[type="search"] { border: 0; background: transparent; min-height: 52px; padding: 0 4px; font-size: 17px; box-shadow: none; min-width: 0; }
.nn-finder--s { max-width: 560px; margin-block: 8px 16px; border-width: 1px; }
.nn-finder__list {
	position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 8px);
	max-height: 360px; overflow-y: auto; padding: 8px;
	background: var(--nn-white); border: 1px solid var(--nn-line); border-radius: var(--nn-radius); box-shadow: var(--nn-shadow);
}
.nn-finder__opt {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 12px 14px; border-radius: 12px; cursor: pointer; font-weight: 600;
}
.nn-finder__opt em { font-style: normal; font-weight: 500; font-size: 13px; color: var(--nn-muted); }
.nn-finder__opt img { width: 28px; height: 28px; object-fit: contain; }
.nn-finder__opt[aria-selected="true"], .nn-finder__opt:hover { background: var(--nn-card); }
.nn-finder__empty { padding: 12px 14px; color: var(--nn-muted); }
.nn-equipos__group { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 980px; }
.nn-equipos__label { font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--nn-muted); }
.nn-equipos .nn-chips { justify-content: center; }
/* Chips de equipo con escudo (archivos de liga) y escudo en la cabecera del equipo. */
.nn-chip--crest { gap: 8px; padding-left: 8px; }
.nn-chip--crest img { flex: none; width: 22px; height: 22px; object-fit: contain; border-radius: 6px; }

/* Marquesina de escudos: dos filas en bucle (la lista se repite) y en sentidos opuestos. */
.nn-crests {
	--nn-crest-w: 104px; --nn-crest-h: 80px; --nn-crest-gap: 12px;
	align-self: stretch; display: grid; gap: var(--nn-crest-gap);
	margin-inline: calc(var(--nn-gut) * -1); width: calc(100% + 2 * var(--nn-gut));
}
.nn-crests__row {
	display: flex; overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.nn-crests__track {
	display: flex; flex: none; gap: var(--nn-crest-gap); padding-right: var(--nn-crest-gap);
	animation: nn-crests-l var(--nn-crest-dur, 50s) linear infinite;
}
.nn-crests__row--r .nn-crests__track { --nn-crest-dur: 58s; animation-name: nn-crests-r; }
.nn-crests:hover .nn-crests__track,
.nn-crests:focus-within .nn-crests__track { animation-play-state: paused; }
.nn-crests__item {
	display: grid; place-items: center; width: var(--nn-crest-w); height: var(--nn-crest-h);
	border-radius: var(--nn-radius-s); background: var(--nn-white); border: 1px solid var(--nn-line);
	transition: border-color .3s, transform .3s var(--nn-ease);
}
.nn-crests__item img {
	width: auto; height: auto; max-width: 64%; max-height: 52px; object-fit: contain;
	filter: grayscale(1); opacity: .72; transition: filter .3s, opacity .3s;
}
.nn-crests__item:hover, .nn-crests__item:focus-visible { border-color: var(--nn-ink); transform: translateY(-2px); }
.nn-crests__item:hover img, .nn-crests__item:focus-visible img { filter: none; opacity: 1; }
@keyframes nn-crests-l { to { transform: translateX(-100%); } }
@keyframes nn-crests-r { from { transform: translateX(-100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) {
	.nn-crests__row { overflow-x: auto; -webkit-mask-image: none; mask-image: none; scrollbar-width: thin; }
	.nn-crests__track { animation: none; }
	.nn-crests__track[aria-hidden] { display: none; }
}

/* ---------- Ventajas ---------- */
.nn-usps { padding-bottom: clamp(48px, 8vw, 112px); }
.nn-usps__grid { display: grid; grid-template-columns: 1fr; gap: var(--nn-gap); }
.nn-usp { display: grid; grid-template-columns: auto 1fr; gap: 4px 16px; padding: 22px; border-radius: var(--nn-radius); background: var(--nn-white); border: 1px solid var(--nn-line); }
.nn-usp__icon { grid-row: span 2; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--nn-volt); box-shadow: inset 0 0 0 1.5px var(--nn-ink); }
.nn-usp__icon .nn-icon { width: 22px; height: 22px; }
.nn-usp__title { font-size: 16px; font-weight: 700; }
.nn-usp__text { font-size: 14px; color: var(--nn-muted); }

/* ---------- Club ---------- */
.nn-club { background: var(--nn-volt); color: var(--nn-volt-ink); padding-block: clamp(48px, 7vw, 96px); }
.nn-club__in { display: grid; gap: 28px; align-items: end; }
.nn-club .nn-eyebrow { color: var(--nn-ink-2); }
.nn-club__copy { display: flex; flex-direction: column; gap: 14px; }
.nn-club__title { font-size: clamp(40px, 5.6vw, 80px); }
.nn-club__text { font-size: 17px; max-width: 40ch; }
.nn-club__form { display: flex; flex-direction: column; gap: 14px; }
.nn-club__row { display: flex; flex-direction: column; gap: 8px; }
.nn-club__row input[type="email"] { min-height: 56px; border-radius: 999px; border: 1.5px solid var(--nn-ink); padding-inline: 22px; background: var(--nn-white); }
.nn-club__row .nn-btn { min-height: 56px; }
.nn-club .nn-btn--primary::before { background: var(--nn-white); }
.nn-club__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nn-club__msg { min-height: 1.4em; font-weight: 600; font-size: 14px; }
.nn-club__msg.is-error { color: var(--nn-error); }

/* ---------- Pie ---------- */
.nn-footer { background: var(--nn-dark); color: var(--nn-dark-ink); padding-block: clamp(48px, 7vw, 88px) 28px; }
.nn-footer__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 24px; }
.nn-footer__brand { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.nn-logo--footer img { height: 24px; }
.nn-logo__word.is-inverted { filter: brightness(0) invert(1); } /* sin logo para fondo oscuro */
.nn-logo--footer .nn-logo__mark { width: 40px; height: 40px; }
.nn-footer__claim { max-width: 36ch; color: color-mix(in srgb, var(--nn-dark-ink) 66%, transparent); font-size: 15px; }
.nn-footer__contact { display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.nn-footer__social { display: flex; gap: 4px; margin-left: -10px; }
.nn-footer__social .nn-icon-btn:hover { background: color-mix(in srgb, var(--nn-dark-ink) 10%, transparent); }
.nn-footer__h { font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--nn-volt); margin-bottom: 16px; }
.nn-footer__list { display: grid; gap: 2px; }
.nn-footer__list a { display: inline-block; padding: 6px 0; font-size: 15px; color: color-mix(in srgb, var(--nn-dark-ink) 90%, transparent); }
.nn-footer__list a:hover { color: var(--nn-volt); }
.nn-footer__bottom {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;
	margin-top: clamp(40px, 6vw, 72px); padding-top: 24px; border-top: 1px solid color-mix(in srgb, var(--nn-white) 14%, transparent);
	font-size: 13px; color: color-mix(in srgb, var(--nn-white) 55%, transparent);
}
.nn-pay { display: flex; flex-wrap: wrap; gap: 6px; color: color-mix(in srgb, var(--nn-dark-ink) 80%, transparent); }

/* ---------- Carrito lateral ---------- */
.nn-drawer-cart__body { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.nn-drawer-cart__empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 40px 24px; text-align: center; color: var(--nn-muted); }
.nn-drawer-cart__empty > .nn-icon { width: 48px; height: 48px; color: var(--nn-ink); margin-bottom: 8px; }
.nn-drawer-cart__empty .nn-h4 { color: var(--nn-ink); }
.nn-drawer-cart__empty .nn-btn { margin-top: 12px; }
.nn-ship { padding: 16px 24px; border-bottom: 1px solid var(--nn-line); }
.nn-ship__txt { font-size: 14px; margin-bottom: 10px; }
.nn-ship__bar { height: 6px; border-radius: 999px; background: var(--nn-card); overflow: hidden; }
.nn-ship__bar span { display: block; height: 100%; border-radius: inherit; background: var(--nn-ink); transition: width .6s var(--nn-ease); }
.nn-lines { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 4px 24px; }
.nn-drawer-cart__row { display: flex; justify-content: space-between; font-size: 14px; color: var(--nn-ok); margin-bottom: 6px; font-weight: 600; }

/* Tarjeta de línea (drawer, carrito, resumen y gracias) */
.nn-line {
	position: relative; display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 4px 14px;
	align-items: start; padding: 16px 0; border-bottom: 1px solid var(--nn-line);
}
.nn-line:last-child { border-bottom: 0; }
.nn-line__img { position: relative; aspect-ratio: 1; border-radius: 12px; background: var(--nn-card); }
.nn-line__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; border-radius: inherit; }
.nn-line__q {
	position: absolute; top: -7px; right: -7px; display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px;
	border-radius: 999px; background: var(--nn-ink); color: var(--nn-white); font-size: 12px; font-weight: 700; box-shadow: 0 0 0 2px var(--nn-white);
}
.nn-line__info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.nn-line__name { font-size: 14px; font-weight: 600; line-height: 1.3; }
.nn-line__meta { font-size: 12.5px; line-height: 1.4; color: var(--nn-muted); }
.nn-line__row { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.nn-line__price { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nn-line__price del { font-size: 12.5px; color: var(--nn-muted); }
.nn-line__unit { font-size: 14px; font-weight: 700; }
.nn-line__unit small { font-size: 11px; font-weight: 500; color: var(--nn-muted); margin-left: 2px; }
.nn-line__total, .nn-line__each { font-size: 12px; color: var(--nn-muted); }
.nn-line__remove { position: absolute; right: -8px; bottom: 10px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: var(--nn-muted); }
.nn-line__remove:hover { color: var(--nn-error); background: color-mix(in srgb, var(--nn-error) 6%, transparent); }
.nn-line__remove .nn-icon { width: 18px; height: 18px; }
.nn-line--cart { grid-template-columns: 104px minmax(0, 1fr) auto; padding: 20px 0; }
.nn-line--cart .nn-line__name { font-size: 16px; }
.nn-line--cart .nn-line__meta { font-size: 13.5px; }
.nn-line--cart .nn-line__unit { font-size: 16px; }
.nn-sum .nn-line__img { background: var(--nn-white); }
.nn-drawer-cart__foot { padding: 18px 24px 24px; border-top: 1px solid var(--nn-line); background: var(--nn-white); }
.nn-drawer-cart__total { display: flex; justify-content: space-between; align-items: baseline; font-size: 17px; }
.nn-drawer-cart__total strong { font-size: 20px; font-variant-numeric: tabular-nums; }
.nn-drawer-cart__note { font-size: 12px; color: var(--nn-muted); margin: 4px 0 16px; }
.nn-drawer-cart__actions { display: grid; grid-template-columns: 1fr 1.4fr; gap: 8px; }
.nn-drawer-cart__actions .nn-btn { padding: 0 14px; }
.nn-drawer-cart.is-busy .nn-drawer-cart__body, .nn-cartpage.is-busy { opacity: .55; pointer-events: none; transition: opacity .2s; }

/* Cantidad */
.nn-qty, .quantity {
	display: inline-flex; align-items: center; height: 52px; border-radius: 999px;
	box-shadow: inset 0 0 0 1px var(--nn-line); background: var(--nn-white);
}
.nn-qty--s { height: 36px; }
.nn-qty__btn { display: grid; place-items: center; width: 44px; height: 100%; border-radius: 999px; }
.nn-qty--s .nn-qty__btn { width: 34px; }
.nn-qty__btn .nn-icon { width: 16px; height: 16px; }
.nn-qty__btn:hover { background: var(--nn-card); }
.nn-qty__val { min-width: 22px; text-align: center; font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.quantity .qty {
	width: 40px; min-height: 0; height: 100%; padding: 0; border: 0; background: transparent; box-shadow: none;
	text-align: center; font-weight: 600; -moz-appearance: textfield;
}
.quantity .qty::-webkit-inner-spin-button, .quantity .qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* Toast */
.nn-toast {
	position: fixed; z-index: 120; left: 50%; bottom: 20px;
	display: flex; align-items: center; gap: 12px; max-width: calc(100vw - 32px);
	padding: 10px 10px 10px 14px; border-radius: 999px; background: var(--nn-ink); color: var(--nn-white);
	box-shadow: var(--nn-shadow); font-size: 14px; font-weight: 500;
	transform: translate(-50%, 140%); transition: transform .45s var(--nn-ease);
}
.nn-toast.is-in { transform: translate(-50%, 0); }
.nn-toast__icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--nn-volt); color: var(--nn-volt-ink); flex: none; }
.nn-toast__icon .nn-icon { width: 16px; height: 16px; }
.nn-toast__msg { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nn-toast__btn { min-height: 36px; padding: 0 16px; border-radius: 999px; background: var(--nn-white); color: var(--nn-ink); font-weight: 600; font-size: 13px; }
.nn-toast__btn:hover { background: var(--nn-volt); }

/* ---------- Páginas ---------- */
.nn-page { padding-block: clamp(32px, 6vw, 80px) clamp(56px, 8vw, 112px); }
.nn-page__head { display: flex; flex-direction: column; gap: 12px; margin-bottom: clamp(24px, 4vw, 48px); max-width: 1100px; }
.nn-page--wc { max-width: calc(1100px + 2 * var(--nn-gut)); }
.nn-404 { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding-block: clamp(56px, 10vw, 140px); position: relative; overflow: hidden; }
.nn-404__mark { position: absolute; right: -2vw; top: 50%; transform: translateY(-50%); font-size: clamp(160px, 36vw, 520px); opacity: .05; pointer-events: none; }
.nn-posts { display: grid; gap: 32px; }
/* ---------- Contacto ---------- */
.nn-contact__grid { display: grid; gap: clamp(32px, 5vw, 72px); align-items: start; }
@media (min-width: 960px) { .nn-contact__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }
.nn-contact__info { display: flex; flex-direction: column; gap: 16px; }
.nn-contact__info .nn-h1 { font-size: clamp(40px, 8.4vw, 64px); }
@media (min-width: 960px) { .nn-contact__info .nn-h1 { font-size: clamp(44px, 4.6vw, 72px); } }
.nn-contact__intro { max-width: 46ch; color: var(--nn-ink-2); }
.nn-contact__list { display: grid; gap: 4px; margin-top: 12px; border-top: 1px solid var(--nn-line); }
.nn-contact__list li { display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid var(--nn-line); }
.nn-contact__list .nn-icon { width: 20px; height: 20px; margin-top: 2px; }
.nn-contact__list span { display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
.nn-contact__list strong { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--nn-muted); }
.nn-contact__list a { text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.nn-contact__form { display: flex; flex-direction: column; gap: 18px; padding: clamp(20px, 3vw, 36px); border-radius: var(--nn-radius); background: var(--nn-card); }
.nn-contact__h { font-size: 22px; font-weight: 700; }
.nn-contact__form .nn-fields { display: grid; gap: 16px; }
@media (min-width: 600px) { .nn-contact__form .nn-fields { grid-template-columns: 1fr 1fr; } .nn-contact__form .form-row-wide { grid-column: 1 / -1; } }
.nn-contact__form .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.nn-contact__form label { font-size: 13px; font-weight: 600; }
.nn-contact__form .optional { font-weight: 400; color: var(--nn-muted); }
.nn-contact__form abbr { text-decoration: none; }
.nn-contact__form input:not([type="checkbox"]), .nn-contact__form select, .nn-contact__form textarea { width: 100%; background-color: var(--nn-white); }
.nn-contact__form textarea { min-height: 150px; resize: vertical; }
.nn-contact__form [aria-invalid="true"] { border-color: var(--nn-error); }
.nn-field-error { font-size: 13px; font-weight: 600; color: var(--nn-error); }
.nn-contact__status { min-height: 1.4em; font-size: 14px; font-weight: 600; }
.nn-contact__status:empty { display: none; }
.nn-contact__status.is-ok { padding: 14px 16px; border-radius: 12px; background: var(--nn-volt); color: var(--nn-volt-ink); }
.nn-contact__status.is-error { color: var(--nn-error); }
.nn-contact__more { display: grid; gap: 12px; margin-top: clamp(40px, 6vw, 80px); }
@media (min-width: 720px) { .nn-contact__more { grid-template-columns: repeat(3, 1fr); } }
.nn-contact__card { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 72px; padding: 18px 22px; border: 1px solid var(--nn-line); border-radius: var(--nn-radius); font-weight: 700; transition: border-color .3s, background-color .3s; }
.nn-contact__card:hover { border-color: var(--nn-ink); background: var(--nn-card); }
.nn-contact__card .nn-icon { width: 18px; height: 18px; transition: transform .3s var(--nn-ease); }
.nn-contact__card:hover .nn-icon { transform: translateX(4px); }

/* ---------- Preguntas frecuentes ---------- */
.nn-faq__list { max-width: 880px; }
.nn-faq__intro { margin-top: 4px; }
.nn-faq__item summary { min-height: 68px; padding-block: 12px; }
.nn-faq__q { font-size: clamp(16px, 1.6vw, 19px); font-weight: 700; line-height: 1.3; }
.nn-faq__item summary:hover .nn-faq__q { text-decoration: underline; text-underline-offset: 4px; }
.nn-faq__item .nn-acc__body { max-width: 72ch; color: var(--nn-ink-2); }
.nn-faq__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; max-width: 880px; margin-top: clamp(32px, 5vw, 56px); padding: 24px; border-radius: var(--nn-radius); background: var(--nn-card); }
.nn-faq__cta-t { font-size: 18px; font-weight: 700; }

/* ---------- Guía de tallas (página y modal del plugin) ---------- */
.nn-sizes__body { max-width: 880px; }
.nn-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-block: 12px 28px; border: 1px solid var(--nn-line); border-radius: 14px; }
.nn-table-wrap:focus-visible { outline: 2px solid var(--nn-ink); outline-offset: 2px; }
.nn-size-tables table { width: 100%; min-width: 360px; margin: 0; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.nn-size-tables th, .nn-size-tables td { padding: 12px 16px; border-bottom: 1px solid var(--nn-line); text-align: left; white-space: nowrap; }
.nn-size-tables tr:last-child > * { border-bottom: 0; }
.nn-size-tables thead th { background: var(--nn-card); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--nn-ink); }
.nn-size-tables tbody th { font-weight: 700; color: var(--nn-ink); }
.nn-size-tables h3 { scroll-margin-top: calc(var(--nn-header-h) + 16px); }
.nn-size-note { padding: 14px 18px; border-radius: 12px; background: var(--nn-card); color: var(--nn-ink); font-size: 14px; }
.nnp-guia__contenido .nn-size-tables h3 { margin: 18px 0 0; font-size: 16px; }
.nnp-guia__contenido .nn-size-tables table { min-width: 0; font-size: 13px; }
.nnp-guia__contenido .nn-size-tables thead th { letter-spacing: .04em; }
.nnp-guia__contenido .nn-size-tables th, .nnp-guia__contenido .nn-size-tables td { padding: 9px 10px; }
.nnp-guia__contenido > * + * { margin-top: .8em; }
.nnp-guia__contenido h2 { font-size: 17px; font-weight: 700; margin-top: 1.2em; }
.nnp-guia__contenido ul { list-style: disc; padding-left: 1.2em; }

.nn-post__title { font-size: 24px; font-weight: 700; }
.nn-post__date { color: var(--nn-muted); font-size: 14px; margin: 4px 0 10px; }

/* ---------- Categoría / tienda ---------- */
.nn-archive { padding-block: clamp(24px, 4vw, 56px) clamp(56px, 8vw, 112px); }
.nn-trail { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--nn-muted); }
.nn-trail a:hover { color: var(--nn-ink); }
.nn-archive__head { display: flex; flex-direction: column; gap: 16px; padding-bottom: clamp(20px, 3vw, 36px); }
.nn-archive__title { font-size: clamp(40px, 6vw, 88px); }
.nn-archive__titlerow { display: flex; align-items: center; gap: clamp(14px, 2vw, 24px); }
.nn-archive__crest { flex: none; width: clamp(56px, 6vw, 72px); aspect-ratio: 1; border-radius: 18px; background: var(--nn-card); display: grid; place-items: center; padding: 8px; }
.nn-archive__crest img { width: 100%; height: 100%; object-fit: contain; }
.nn-archive__sub { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 32px; }
.nn-archive__desc { max-width: 60ch; color: var(--nn-ink-2); }
.nn-archive__count { font-size: 14px; font-weight: 600; color: var(--nn-muted); font-variant-numeric: tabular-nums; }
.nn-bar {
	position: sticky; top: var(--nn-header-h); z-index: 20;
	display: flex; flex-direction: column; gap: 12px;
	margin-inline: calc(var(--nn-gut) * -1); padding: 12px var(--nn-gut);
	background: color-mix(in srgb, var(--nn-white) 92%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
	border-block: 1px solid var(--nn-line); margin-bottom: 28px;
}
.nn-bar__tools { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.nn-bar__n { display: inline-grid; place-items: center; min-width: 20px; height: 20px; border-radius: 999px; background: var(--nn-volt); color: var(--nn-volt-ink); font-size: 11px; font-weight: 700; }
.nn-btn--ghost .nn-icon { width: 18px; height: 18px; }
.nn-btn--ghost:hover .nn-icon { transform: none; }
.nn-sort .woocommerce-ordering { margin: 0; }
.nn-sort select { min-height: 44px; border-radius: 999px; font-size: 14px; font-weight: 600; width: auto; max-width: 62vw; background-color: var(--nn-white); }
.nn-active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: -12px 0 24px; }
.nn-active__clear { font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; margin-left: 6px; }
.nn-empty { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 48px 0; }
.nn-archive__seo { margin-top: clamp(48px, 7vw, 96px); padding-top: 32px; border-top: 1px solid var(--nn-line); font-size: 15px; }

.woocommerce-pagination { margin-top: clamp(40px, 6vw, 72px); padding-bottom: 8px; }
/* Woo pone la clase page-numbers también en el <ul>: se resetea la lista y se estilizan solo los enlaces. */
.woocommerce-pagination ul.page-numbers {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px;
	min-width: 0; height: auto; padding: 0; margin: 0; border-radius: 0; box-shadow: none; background: none;
}
.woocommerce-pagination li { display: block; }
.woocommerce-pagination li .page-numbers {
	display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: 999px;
	font-weight: 600; font-size: 14px; font-variant-numeric: tabular-nums; color: var(--nn-ink);
	box-shadow: inset 0 0 0 1px var(--nn-line); transition: box-shadow .2s, background-color .2s;
}
.woocommerce-pagination li a.page-numbers:hover { box-shadow: inset 0 0 0 1.5px var(--nn-ink); }
.woocommerce-pagination li .page-numbers.current { background: var(--nn-ink); color: var(--nn-white); box-shadow: none; }
.woocommerce-pagination li .page-numbers.dots { box-shadow: none; min-width: 24px; padding: 0; }
.woocommerce-pagination li .prev, .woocommerce-pagination li .next { padding: 0; }
.woocommerce-pagination .nn-icon { width: 18px; height: 18px; display: block; }

/* Panel de filtros */
.nn-facet { padding: 20px 0; border-bottom: 1px solid var(--nn-line); }
.nn-facet__h { font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 14px; padding: 0; }
.nn-facet__opts { display: flex; flex-wrap: wrap; gap: 8px; max-height: 340px; overflow-y: auto; padding: 2px; }
.nn-facet__q { min-height: 44px; margin-bottom: 12px; border-radius: 999px; font-size: 15px; }
.nn-facet .nn-pill.is-more { display: none; }
.nn-facet.is-expanded .nn-pill.is-more, .nn-facet.is-searching .nn-pill.is-more { display: inline-block; }
.nn-facet .nn-pill.is-nomatch { display: none !important; }
.nn-facet__more { margin-top: 12px; min-height: 40px; font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.nn-pill { position: relative; cursor: pointer; }
.nn-pill input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nn-pill span {
	display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px;
	background: var(--nn-white); box-shadow: inset 0 0 0 1px var(--nn-line); font-size: 14px; font-weight: 600;
	transition: background-color .2s, color .2s, box-shadow .2s;
}
.nn-pill em { font-style: normal; font-weight: 500; font-size: 12px; color: var(--nn-muted); }
.nn-pill:hover span { box-shadow: inset 0 0 0 1px var(--nn-ink); }
.nn-pill input:checked + span { background: var(--nn-ink); color: var(--nn-white); box-shadow: none; }
.nn-pill input:checked + span em { color: color-mix(in srgb, var(--nn-white) 70%, transparent); }
.nn-pill input:focus-visible + span { outline: 2px solid var(--nn-ink); outline-offset: 2px; }
.nn-facet__price { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.nn-facet__price label { display: grid; gap: 6px; font-size: 13px; color: var(--nn-muted); }

/* ---------- Ficha de producto ---------- */
.nn-pdp { padding-block: clamp(16px, 3vw, 32px) 0; }
.nn-pdp .nn-trail { margin-bottom: 20px; }
.nn-pdp__grid { display: grid; gap: 28px; }
.nn-pdp__gallery { min-width: 0; }
@media (min-width: 900px) { .nn-pdp__gallery { position: sticky; top: calc(var(--nn-header-h) + 20px); } }
.nn-pdp__summary { min-width: 0; }
.nn-pdp__sticky { display: flex; flex-direction: column; gap: 18px; }
.nn-pdp__meta { color: var(--nn-muted); }
.nn-pdp__title { font-size: clamp(28px, 3.2vw, 44px); font-weight: 900; font-style: var(--nn-display-style); line-height: 1; letter-spacing: -.02em; }
.nn-pdp__price { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.nn-pdp__price .nn-badges { position: static; }
.nn-pdp__rating { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--nn-muted); }
.nn-pdp__short { color: var(--nn-ink-2); font-size: 15px; }
.nn-pdp__short p + p { margin-top: .6em; }
.nn-pdp__buy .stock { font-size: 14px; font-weight: 600; margin-bottom: 12px; }
.nn-pdp__buy .stock.out-of-stock { color: var(--nn-error); }
.nn-pdp__buy form.cart { display: flex; flex-wrap: wrap; gap: 10px; }
.nn-pdp__buy form.cart > .nnp { flex: 1 1 100%; }
.nn-pdp__buy .single_add_to_cart_button { flex: 1 1 200px; min-height: 56px; font-size: 16px; }
.nn-atc-notices { flex: 1 1 100%; }
.nn-atc-notices:empty { display: none; }
.nn-atc-notices ul, .nn-atc-notices p {
	padding: 12px 16px; border-radius: var(--nn-radius-s); background: color-mix(in srgb, var(--nn-error) 10%, var(--nn-white)); color: color-mix(in srgb, var(--nn-error) 78%, var(--nn-ink));
	font-size: 14px; font-weight: 500; list-style: none;
}
.nn-atc-notices li + li { margin-top: 4px; }

.nn-trust { display: grid; gap: 10px; padding: 16px 18px; border-radius: var(--nn-radius); background: var(--nn-white); border: 1px solid var(--nn-line); }
.nn-trust li { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 500; }
.nn-trust .nn-icon { width: 20px; height: 20px; flex: none; }

.nn-acc { border-top: 1px solid var(--nn-line); }
.nn-acc__item { border-bottom: 1px solid var(--nn-line); }
.nn-acc__item summary {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	min-height: 60px; cursor: pointer; list-style: none; font-weight: 700; font-size: 15px;
}
.nn-acc__item summary::-webkit-details-marker { display: none; }
.nn-acc__item summary .nn-icon { width: 18px; height: 18px; transition: transform .3s var(--nn-ease); }
.nn-acc__item[open] summary .nn-icon { transform: rotate(45deg); }
.nn-acc__body { padding-bottom: 22px; font-size: 15px; }

/* Galería */
.nn-gallery { position: relative; display: grid; gap: 12px; }
.nn-gallery__main {
	display: grid; grid-auto-flow: column; grid-auto-columns: 100%;
	overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth;
	border-radius: var(--nn-radius); background: var(--nn-card);
}
.nn-gallery__main::-webkit-scrollbar { display: none; }
.nn-gallery__slide { position: relative; aspect-ratio: 1; scroll-snap-align: start; overflow: hidden; }
.nn-gallery__slide img {
	width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply;
	transition: transform .35s var(--nn-ease); transform-origin: var(--nn-zx, 50%) var(--nn-zy, 50%);
}
.nn-gallery__slide.is-zoom img { transform: scale(1.9); cursor: zoom-out; }
.nn-gallery__thumbs { display: none; }
.nn-gallery__dots { display: flex; justify-content: center; gap: 6px; }
.nn-gallery__dots span { width: 6px; height: 6px; border-radius: 999px; background: var(--nn-line); transition: width .3s var(--nn-ease), background-color .3s; }
.nn-gallery__dots span.is-active { width: 22px; background: var(--nn-ink); }

/* ---------- Bloque de personalización (plugin, clases .nnp-*) ---------- */
.nn-pdp .nnp {
	--nnp-gap: 14px;
	--nnp-radio: 12px;
	--nnp-borde: var(--nn-line);
	--nnp-suave: var(--nn-muted);
	--nnp-fondo: var(--nn-white);
	--nnp-activo: var(--nn-ink);
	--nnp-activo-texto: var(--nn-white);
	--nnp-error: var(--nn-error);
	--nnp-tam-talla: 52px;
	gap: 22px;
	margin-bottom: 4px;
}
.nn-pdp .nnp__titulo { font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--nn-ink); }
.nn-pdp .nnp__guia { font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 600; text-underline-offset: 3px; }
.nn-pdp .nnp-talla { font-weight: 600; font-size: 14px; transition: border-color .2s, background-color .2s, color .2s, transform .2s var(--nn-ease); }
.nn-pdp .nnp-talla:hover, .nn-pdp .nnp-modo:hover, .nn-pdp .nnp-parche:hover { border-color: var(--nn-ink); }
.nn-pdp .nnp-talla:active { transform: scale(.96); }
.nn-pdp .nnp-talla.is-active, .nn-pdp .nnp-modo.is-active { box-shadow: 0 0 0 2px var(--nn-volt) inset; }
.nn-pdp .nnp-modos { gap: 8px; }
.nn-pdp .nnp-modo { min-height: 44px; padding: 0 16px; border-radius: 999px; font-size: 14px; font-weight: 600; }
.nn-pdp .nnp-parches { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 10px; }
.nn-pdp .nnp-parche { padding: 12px 8px; border-radius: 14px; gap: 6px; font-weight: 600; }
/* Parches sin imagen (aún no subidas en el panel): se pintan como píldoras compactas. */
.nn-pdp .nnp-parche__imagen:not(:has(img)) { display: none; }
.nn-pdp .nnp-parches:not(:has(img)) { display: flex; flex-wrap: wrap; gap: 8px; }
.nn-pdp .nnp-parches:not(:has(img)) .nnp-parche { flex-direction: row; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px; font-size: 14px; }
.nn-pdp .nnp-parches:not(:has(img)) .nnp-parche.is-active::after { position: static; flex: none; order: -1; }
.nn-pdp .nnp-parche.is-active { background: var(--nn-white); color: var(--nn-ink); border-color: var(--nn-ink); box-shadow: inset 0 0 0 1px var(--nn-ink); }
.nn-pdp .nnp-parche.is-active::after {
	content: ""; position: absolute; top: 8px; right: 8px; width: 10px; height: 10px; border-radius: 50%;
	background: var(--nn-volt); box-shadow: 0 0 0 1.5px var(--nn-ink);
}
.nn-pdp .nnp-parche.is-active .nnp-parche__precio { color: var(--nn-muted); }
.nn-pdp .nnp-campo__etiqueta { font-weight: 600; font-size: 13px; }
.nn-pdp .nnp-campo__input { min-height: 50px; padding: 0 16px; border-radius: 12px; background: var(--nn-white); font-size: 16px; }
.nn-pdp .nnp-campo--nombre .nnp-campo__input, .nn-pdp .nnp-campo--dorsal .nnp-campo__input { font-weight: 700; letter-spacing: .06em; }
.nn-pdp .nnp-campos { grid-template-columns: 96px 1fr; }
.nn-pdp .nnp select, .nn-pdp .nnp textarea { border-radius: 12px; }
.nn-pdp .nnp-resumen {
	justify-content: space-between; padding: 14px 18px; border-radius: 14px;
	background: var(--nn-white); border: 1px dashed var(--nn-line); font-variant-numeric: tabular-nums;
}
.nn-pdp .nnp-error { font-weight: 600; }
.nn-pdp .nnp__bloque.is-error { animation: nn-shake .4s; }
@keyframes nn-shake { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.nnp-guia { border-radius: var(--nn-radius); }

/* ---------- Carrito, pago y cuenta (bloques y shortcodes de Woo) ---------- */
.nn-wc { font-size: 15px; }
.nn-wc .wc-block-components-button:not(.is-link),
.nn-wc .wc-block-cart__submit-button,
.nn-wc .wc-block-components-checkout-place-order-button {
	min-height: 54px; border-radius: 999px; background: var(--nn-ink); color: var(--nn-white); border: 0;
	font-family: inherit; font-weight: 600; font-size: 15px; transition: background-color .3s, color .3s;
}
.nn-wc .wc-block-components-button:not(.is-link):hover,
.nn-wc .wc-block-cart__submit-button:hover,
.nn-wc .wc-block-components-checkout-place-order-button:hover { background: var(--nn-volt); color: var(--nn-volt-ink); }
.nn-wc .wc-block-cart-items, .nn-wc .wc-block-components-sidebar .wc-block-components-panel,
.nn-wc .wc-block-components-totals-wrapper { border-color: var(--nn-line) !important; }
.nn-wc .wc-block-components-sidebar {
	padding: 24px; border-radius: var(--nn-radius); background: var(--nn-white); border: 1px solid var(--nn-line);
}
.nn-wc .wc-block-cart-item__image img { border-radius: 12px; background: var(--nn-card); mix-blend-mode: multiply; }
.nn-wc .wc-block-components-product-name { font-weight: 600; color: var(--nn-ink); text-decoration: none; }
.nn-wc .wc-block-components-product-metadata { font-size: 13px; color: var(--nn-muted); }
.nn-wc .wc-block-components-text-input input, .nn-wc .wc-block-components-combobox input,
.nn-wc .wc-blocks-components-select__select, .nn-wc .wc-block-components-textarea {
	border-radius: 12px !important; border-color: var(--nn-line) !important; background: var(--nn-white) !important;
}
.nn-wc .wc-block-components-title, .nn-wc .wc-block-cart__totals-title, .nn-wc .wc-block-components-checkout-step__title {
	font-family: inherit; font-weight: 900; font-style: var(--nn-display-style); letter-spacing: -.01em;
}
.nn-wc .wc-block-components-quantity-selector { border-radius: 999px; }
.nn-wc .wc-block-components-quantity-selector::after { border-radius: 999px; border-color: var(--nn-line); }
.nn-wc .wc-block-cart__empty-cart__title { font-weight: 900; font-style: var(--nn-display-style); }
.nn-wc .wc-block-grid__products, .nn-wc .wc-block-product-template { gap: var(--nn-gap); }
.nn-wc .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.nn-wc .woocommerce-MyAccount-navigation a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; background: var(--nn-white); border: 1px solid var(--nn-line); font-weight: 600; font-size: 14px; }
.nn-wc .woocommerce-MyAccount-navigation .is-active a { background: var(--nn-ink); color: var(--nn-white); border-color: var(--nn-ink); }
.nn-wc .woocommerce-form-row, .nn-wc .form-row { display: grid; gap: 6px; margin-bottom: 16px; }
.nn-wc .woocommerce-form-login, .nn-wc .woocommerce-form-register { max-width: 480px; }
.nn-wc table.shop_table { width: 100%; border-collapse: collapse; }
.nn-wc table.shop_table th, .nn-wc table.shop_table td { padding: 12px; border-bottom: 1px solid var(--nn-line); text-align: left; }

.nn-freeship { display: flex; align-items: center; gap: 10px; margin: -8px 0 0; font-size: 14px; color: var(--nn-ink-2); }
.nn-freeship:empty { display: none; }
.nn-freeship .nn-icon { width: 18px; height: 18px; flex: none; }
.nn-freeship strong { color: var(--nn-ink); }

/* ---------- Venta cruzada ---------- */
.nn-drawer-cart__scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.nn-drawer-cart__scroll .nn-lines { flex: none; overflow: visible; }
.nn-xsell { margin: 8px 24px 20px; padding: 16px; border-radius: var(--nn-radius); background: var(--nn-card); }
.nn-xsell--cart { margin: 24px 0 0; padding: 20px; }
.nn-xsell__t { margin-bottom: 12px; font-size: 18px; font-weight: 900; font-style: var(--nn-display-style); letter-spacing: -.01em; }
.nn-xsell--cart .nn-xsell__t { font-size: 22px; }
.nn-xsell__list { display: grid; gap: 10px; }
.nn-xsell__item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px; border-radius: 14px; background: var(--nn-white); }
.nn-xsell__img { aspect-ratio: 1; border-radius: 10px; background: var(--nn-card); overflow: hidden; }
.nn-xsell__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.nn-xsell__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 13px; }
.nn-xsell__name { font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nn-xsell__btn { min-height: 36px; padding: 0 14px; font-size: 13px; }
@media (min-width: 900px) {
	.nn-xsell--cart .nn-xsell__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.nn-xsell--cart .nn-xsell__item { grid-template-columns: 1fr; text-align: left; padding: 12px; }
	.nn-xsell--cart .nn-xsell__img { width: 100%; }
	.nn-xsell--cart .nn-xsell__btn { justify-self: start; }
}

/* ---------- Prueba social ---------- */
.nn-proof { padding-block: clamp(40px, 6vw, 80px); border-top: 1px solid var(--nn-line); }
.nn-proof__list { display: grid; gap: 28px 40px; }
.nn-proof__item { display: flex; flex-direction: column; gap: 10px; }
.nn-proof__num { font-size: clamp(44px, 4.6vw, 72px); line-height: .95; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nn-dispatch span { font-weight: 600; font-variant-numeric: tabular-nums; }
.nn-badge--top { background: var(--nn-white); color: var(--nn-ink); box-shadow: inset 0 0 0 1px var(--nn-line); }
.nn-badge--top::before { content: ""; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--nn-volt); box-shadow: 0 0 0 1px var(--nn-ink); }

/* ---------- Checkout clásico a medida ---------- */
.nn-header--co { position: relative; border-bottom: 1px solid var(--nn-line); }
.nn-header--co .nn-header__in { justify-content: space-between; }
.nn-header--co .nn-logo { margin-right: 0; }
.nn-secure { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; letter-spacing: .04em; }
.nn-secure .nn-icon { width: 16px; height: 16px; }
.nn-header__back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 14px; font-weight: 600; }
.nn-header__back .nn-icon { width: 16px; height: 16px; }
.nn-footer--co { padding-block: 8px 24px; }
.nn-footer--co .nn-footer__bottom { margin-top: 0; border-top: 0; }
.nn-footer--co .nn-footer__list { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.nn-footer--co .nn-footer__list a { font-size: 13px; color: color-mix(in srgb, var(--nn-dark-ink) 70%, transparent); }
.nn-page--co { max-width: calc(1240px + 2 * var(--nn-gut)); padding-block: clamp(16px, 3vw, 40px) clamp(48px, 6vw, 80px); }
.nn-page--co .nn-wc { font-size: 15px; }

.nn-co__grid { display: grid; gap: 24px; align-items: start; }
.nn-co__main { display: grid; gap: 12px; min-width: 0; }
.nn-co__step { padding: 4px 0 24px; border-bottom: 1px solid var(--nn-line); }
.nn-co__step:last-child { border-bottom: 0; }
.nn-co__h { display: flex; align-items: center; gap: 12px; margin: 16px 0 18px; font-size: 24px; font-weight: 900; font-style: var(--nn-display-style); letter-spacing: -.01em; }
.nn-co__h span {
	display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
	background: var(--nn-volt); color: var(--nn-volt-ink); font-size: 14px; font-style: normal; font-weight: 800;
}
.nn-co__lead { margin: -8px 0 16px; font-size: 14px; color: var(--nn-muted); }

/* Campos */
.nn-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.nn-fields .form-row { grid-column: 1 / -1; }
.nn-fields .form-row-first { grid-column: 1; }
.nn-fields .form-row-last { grid-column: 2; }
.woocommerce form .form-row, .nn-co .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px; padding: 0; }
.nn-co .form-row label, .nn-wc .form-row label { font-size: 13px; font-weight: 600; color: var(--nn-ink); }
.nn-co .form-row .required { color: var(--nn-error); text-decoration: none; border: 0; }
.nn-co .form-row .optional { font-weight: 400; color: var(--nn-muted); }
.nn-co .form-row.woocommerce-invalid input.input-text, .nn-co .form-row.woocommerce-invalid select,
.nn-co .form-row.woocommerce-invalid .select2-selection { border-color: var(--nn-error) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--nn-error) 8%, transparent); }
.nn-co .form-row.woocommerce-validated input.input-text { border-color: color-mix(in srgb, var(--nn-ok) 35%, var(--nn-white)); }
.nn-field-error, .checkout-inline-error-message { margin: 0; font-size: 13px; font-weight: 600; color: var(--nn-error); }
.nn-co .woocommerce-input-wrapper { display: block; }
.select2-container { width: 100% !important; }
.select2-container--default .select2-selection--single {
	height: 50px; display: flex; align-items: center; padding: 0 16px; border: 1px solid var(--nn-line); border-radius: 12px; background: var(--nn-white);
}
.select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0; line-height: 1.2; color: var(--nn-ink); }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 48px; right: 10px; }
.select2-dropdown { border-color: var(--nn-line); border-radius: 12px; overflow: hidden; box-shadow: var(--nn-shadow); }
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--nn-ink); color: var(--nn-white); }
.select2-search--dropdown .select2-search__field { border-radius: 8px; min-height: 40px; }
.nn-co__extra { display: grid; gap: 12px; }
.nn-co__shipto { margin: 0; font-size: 15px; font-weight: 600; }
.nn-co__shipto label { display: flex; gap: 10px; align-items: center; cursor: pointer; }
.nn-co .shipping_address { padding-top: 12px; }
.nn-co__notes { border: 1px solid var(--nn-line); border-radius: 14px; padding: 0 16px; margin-top: 4px; }
.nn-co__notes summary, .nn-coupon summary {
	display: flex; align-items: center; justify-content: space-between; min-height: 52px; cursor: pointer; list-style: none; font-weight: 600; font-size: 14px;
}
.nn-co__notes summary::-webkit-details-marker, .nn-coupon summary::-webkit-details-marker { display: none; }
.nn-co__notes summary .nn-icon, .nn-coupon summary .nn-icon { width: 16px; height: 16px; transition: transform .3s var(--nn-ease); }
.nn-co__notes[open] summary .nn-icon, .nn-coupon[open] summary .nn-icon { transform: rotate(45deg); }
.nn-co__notes textarea { margin-bottom: 4px; }

/* Avisos del checkout */
.woocommerce-NoticeGroup-checkout { margin-bottom: 16px; }
.nn-co .woocommerce-error { border-radius: 14px; }

/* Métodos de pago */
.nn-paymethods { display: grid; gap: 10px; margin: 0 0 18px; }
.nn-paymethod { position: relative; border: 1.5px solid var(--nn-line); border-radius: 16px; background: var(--nn-white); transition: border-color .2s; }
.nn-paymethod:has(input:checked) { border-color: var(--nn-ink); box-shadow: inset 0 0 0 1px var(--nn-ink); }
.nn-paymethod > input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nn-paymethod > label { display: flex; align-items: center; gap: 14px; min-height: 64px; padding: 12px 18px; cursor: pointer; font-weight: 700; font-size: 15px; }
.nn-paymethod__radio { flex: none; width: 20px; height: 20px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--nn-muted); transition: box-shadow .2s; }
.nn-paymethod > input:checked + label .nn-paymethod__radio { box-shadow: inset 0 0 0 6px var(--nn-ink); background: var(--nn-volt); }
.nn-paymethod > input:focus-visible + label { outline: 2px solid var(--nn-ink); outline-offset: 3px; border-radius: 14px; }
.nn-paymethod__title { flex: 1; }
.nn-paymethod__logos { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.nn-paymethod__logos img { max-height: 24px; width: auto; }
.nn-paylogo { display: inline-flex; align-items: center; height: 26px; padding: 0 8px; border-radius: 6px; border: 1px solid var(--nn-line); font-size: 11px; font-weight: 700; color: var(--nn-ink-2); background: var(--nn-white); }
.nn-paymethod .payment_box { margin: 0 14px 14px; padding: 14px 16px; border-radius: 12px; background: var(--nn-card); font-size: 14px; color: var(--nn-ink-2); }
.nn-paymethod .payment_box p:last-child { margin-bottom: 0; }
.nn-paymethods__none { padding: 16px; border-radius: 14px; background: var(--nn-card); font-size: 14px; }
.nn-pay__submit { display: grid; gap: 14px; margin: 0; }
.woocommerce-terms-and-conditions-wrapper { font-size: 13px; color: var(--nn-muted); }
.woocommerce-terms-and-conditions-wrapper a { text-decoration: underline; }
.woocommerce-privacy-policy-text p { margin: 0; }
.nn-paybtn { width: 100%; min-height: 60px; font-size: 17px; font-weight: 700; }
.nn-paybtn .nn-icon { width: 18px; height: 18px; }
.nn-trust--row { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; padding: 0; border: 0; background: none; }
.nn-trust--row li { font-size: 12.5px; color: var(--nn-muted); gap: 6px; }
.nn-trust--row .nn-icon { width: 16px; height: 16px; }

/* Resumen */
.nn-sum { background: var(--nn-card); border-radius: var(--nn-radius); }
.nn-co__sumbody, .nn-sum__card { padding: 20px; }
.nn-sum__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.nn-sum__title { font-size: 20px; font-weight: 900; font-style: var(--nn-display-style); letter-spacing: -.01em; }
.nn-sum__edit { font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.nn-sum .nn-lines { padding: 0; overflow: visible; }
.nn-sum .nn-line { border-color: color-mix(in srgb, var(--nn-ink) 8%, transparent); }
.nn-sum .nn-ship { padding: 12px 0 14px; border-bottom: 0; }
.nn-sum .nn-ship__bar { background: var(--nn-white); }
.nn-co__sum .nn-ship__bar span, .nn-sum .nn-ship__bar span { background: var(--nn-ink); }
.nn-ship.is-done .nn-ship__bar span { background: var(--nn-ok); }
.nn-coupon { border-block: 1px solid color-mix(in srgb, var(--nn-ink) 8%, transparent); margin: 6px 0 4px; }
.nn-coupon__row { display: flex; gap: 8px; padding-bottom: 14px; }
.nn-coupon__row input { min-height: 46px; border-radius: 999px; text-transform: uppercase; }
.nn-coupon__row.is-loading { opacity: .6; pointer-events: none; }
.nn-coupon__msg { font-size: 13px; padding-bottom: 8px; }
.nn-coupon__msg:empty { display: none; }
.nn-coupon__msg.is-error { color: var(--nn-error); font-weight: 600; }
.nn-tot { display: grid; gap: 10px; padding-top: 14px; font-size: 14px; font-variant-numeric: tabular-nums; }
.nn-tot__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nn-tot__row > span:last-child { text-align: right; }
.nn-tot__disc > span:last-child { color: var(--nn-ok); font-weight: 600; }
.nn-cchip {
	display: inline-flex; align-items: center; gap: 2px; margin-left: 8px; padding: 2px 4px 2px 10px; border-radius: 999px;
	background: var(--nn-ink); color: var(--nn-white); font-size: 11px; font-weight: 700; letter-spacing: .06em;
}
.nn-cchip::before { content: ""; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: var(--nn-volt); }
.nn-cchip__x { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: var(--nn-white); }
.nn-cchip__x:hover { background: color-mix(in srgb, var(--nn-white) 15%, transparent); }
.nn-cchip__x .nn-icon { width: 12px; height: 12px; }
.nn-tot__shipval, .nn-shipopt { display: inline-flex; align-items: center; gap: 10px; }
.nn-shipopt__name { font-weight: 500; }
.nn-shipopt__price { font-weight: 700; }
.nn-free { display: inline-block; padding: 3px 9px; border-radius: 6px; background: var(--nn-ink); color: var(--nn-volt); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.nn-shipopts { display: grid; gap: 8px; margin: -2px 0 2px; }
.nn-shipopt { width: 100%; justify-content: space-between; padding: 12px 14px; border-radius: 12px; background: var(--nn-white); border: 1.5px solid transparent; cursor: pointer; font-size: 14px; }
.nn-shipopt:has(input:checked) { border-color: var(--nn-ink); }
.nn-shipopt input { margin: 0; flex: none; }
.nn-shipopt .nn-shipopt__name { flex: 1; }
.nn-tot__total { padding-top: 14px; margin-top: 4px; border-top: 1px solid color-mix(in srgb, var(--nn-ink) 12%, transparent); font-size: 16px; font-weight: 700; }
.nn-tot__total strong, .nn-tot__total > span:last-child { font-size: 26px; font-weight: 900; letter-spacing: -.02em; }
.nn-tot__note { font-size: 12px; color: var(--nn-muted); text-align: right; margin-top: -6px; }
.woocommerce-checkout-review-order-table.processing, .woocommerce-checkout-payment.processing { opacity: .6; }
.blockUI.blockOverlay { background: color-mix(in srgb, var(--nn-white) 50%, transparent) !important; }

/* Resumen plegable en móvil */
.nn-co__toggle {
	display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 0 20px;
	font-size: 15px; font-weight: 600;
}
.nn-co__toggle > span { display: inline-flex; align-items: center; gap: 10px; }
.nn-co__toggle .nn-icon { width: 18px; height: 18px; }
.nn-co__toggle .nn-icon:last-child { width: 14px; height: 14px; transition: transform .25s; }
.nn-co__sum.is-open .nn-co__toggle .nn-icon:last-child { transform: rotate(180deg); }
.nn-co__toggle strong { font-size: 18px; font-weight: 800; }
.nn-co__sum:not(.is-open) .nn-co__sumbody { display: none; }
.nn-co__sum.is-open .nn-co__toggle { border-bottom: 1px solid color-mix(in srgb, var(--nn-ink) 8%, transparent); }

/* ---------- Carrito clásico ---------- */
.nn-cartpage__grid { display: grid; gap: 28px; align-items: start; }
.nn-cartpage__items { min-width: 0; }
.nn-cartpage__items .nn-ship { padding: 16px 18px; border: 1px solid var(--nn-line); border-radius: 14px; margin-bottom: 8px; }
.nn-cartpage__items .nn-lines { padding: 0; overflow: visible; }
.nn-cartpage__back { margin-top: 20px; }
.nn-sum--cart .wc-proceed-to-checkout { display: grid; gap: 10px; margin-top: 18px; }
.nn-sum--cart .nn-trust--row { margin-top: 16px; }
.nn-btn--block { width: 100%; }
.nn-cartempty { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; padding: clamp(32px, 6vw, 72px) 0; }
.nn-cartempty__icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 22px; background: var(--nn-volt); }
.nn-cartempty__icon .nn-icon { width: 32px; height: 32px; }
.nn-cartempty .nn-chips { justify-content: center; max-width: 640px; }

/* ---------- Página de gracias ---------- */
.nn-ty__head { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding-bottom: clamp(24px, 4vw, 40px); }
.nn-ty__check { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--nn-volt); }
.nn-ty__check .nn-icon { width: 28px; height: 28px; stroke-width: 2.4; }
.nn-ty__lead { font-size: 17px; color: var(--nn-ink-2); }
.nn-ty__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.nn-ty__grid { display: grid; gap: 28px; align-items: start; }
.nn-ty__main { display: grid; gap: 16px; justify-items: start; min-width: 0; }
.nn-ty__main > section { width: 100%; }
.nn-ty__box { padding: 20px 22px; border: 1px solid var(--nn-line); border-radius: var(--nn-radius); }
.nn-ty__box address { font-style: normal; line-height: 1.6; }
.nn-ty__h { font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 12px; }
.nn-ty__cols { display: grid; gap: 16px; width: 100%; }
.nn-ty__gateway h2 { font-size: 18px; font-weight: 800; margin: 0 0 10px; }
.nn-ty__gateway ul { display: grid; gap: 4px; }
.nn-ty__gateway .wc-bacs-bank-details { margin-top: 8px; }
.nn-steps { display: grid; gap: 14px; counter-reset: nn-step; }
.nn-steps li { position: relative; display: grid; gap: 2px; padding-left: 44px; counter-increment: nn-step; }
.nn-steps li::before {
	content: counter(nn-step); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 30px; height: 30px;
	border-radius: 50%; background: var(--nn-ink); color: var(--nn-volt); font-weight: 800; font-size: 14px;
}
.nn-steps span { font-size: 14px; color: var(--nn-muted); }
.nn-ty__sum { padding: 20px; }
.nn-ty__sum .nn-lines { padding: 0; }

@media (min-width: 640px) {
	.nn-ty__cols { grid-template-columns: 1fr 1fr; }
	.nn-proof__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.nn-proof__list--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
	.nn-proof__list--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
	.nn-co__grid { grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); grid-template-areas: "main sum"; gap: clamp(32px, 4vw, 64px); }
	.nn-co__main { grid-area: main; }
	.nn-co__sum { grid-area: sum; position: sticky; top: 24px; }
	.nn-co__toggle { display: none; }
	.nn-co__sum:not(.is-open) .nn-co__sumbody { display: block; }
	.nn-co__sumbody { padding: 28px; }
	.nn-cartpage__grid { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); }
	.nn-sum--cart { position: sticky; top: calc(var(--nn-header-h) + 20px); }
	.nn-sum__card { padding: 28px; }
	.nn-ty__grid { grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); gap: clamp(32px, 4vw, 64px); }
	.nn-ty__sum { padding: 28px; position: sticky; top: 24px; }
}
@media (max-width: 639px) {
	.nn-secure span, .nn-header__back span { display: none; }
	.nn-secure { font-size: 12px; }
	.nn-header__back { width: 44px; justify-content: center; }
	.nn-fields { grid-template-columns: 1fr; }
	.nn-fields .form-row-first, .nn-fields .form-row-last { grid-column: 1 / -1; }
	.nn-line--cart { grid-template-columns: 80px minmax(0, 1fr) auto; }
	.nn-co__sum { margin-inline: calc(var(--nn-gut) * -1); border-radius: 0; }
}

/* ---------- Aparición al hacer scroll ---------- */
.nn-js .nn-rv { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--nn-ease), transform .8s var(--nn-ease); }
.nn-js .nn-rv.is-in { opacity: 1; transform: none; }

/* ---------- Adaptación a pantallas ---------- */
@media (min-width: 640px) {
	.nn-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px var(--nn-gap); }
	.nn-rail { grid-auto-columns: calc((100% - 2 * var(--nn-gap)) / 3); }
	.nn-bento { grid-auto-rows: 240px; }
	.nn-usps__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nn-club__row { flex-direction: row; }
	.nn-club__row input[type="email"] { flex: 1; }
	.nn-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.nn-hero__tag { display: flex; }
	.nn-bar { flex-direction: row; align-items: center; }
	.nn-bar .nn-chips--scroll { flex: 1; min-width: 0; margin-inline: 0 0; padding-inline: 0; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); }
	.nn-bar__tools { flex: none; margin-left: auto; }
}

@media (min-width: 900px) {
	:root { --nn-header-h: 76px; }
	.nn-logo img { height: 22px; }
	.nn-rail-nav { display: flex; }
	.nn-hero__in { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 0 32px; min-height: clamp(520px, calc(100svh - 260px), 760px); }
	.nn-hero__title { max-width: 11ch; font-size: clamp(52px, 6.6vw, 96px); }
	.nn-hero__media { aspect-ratio: auto; height: 100%; min-height: 480px; }
	.nn-hero__prod--a { width: 60%; }
	.nn-hero__prod--b { width: 46%; }
	.nn-bento { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(220px, 21vw, 300px); }
	.nn-tile { padding: 24px; }
	.nn-tile--1 { padding: 32px; }
	.nn-banner__in { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 56px; }
	.nn-club__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; }
	.nn-pdp__grid { grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); gap: clamp(32px, 4vw, 72px); align-items: start; }
	.nn-pdp__sticky { position: sticky; top: calc(var(--nn-header-h) + 20px); }
	.nn-gallery.has-thumbs { grid-template-columns: 76px minmax(0, 1fr); align-items: start; }
	.nn-gallery__main { grid-column: 2; grid-row: 1; }
	.nn-gallery__thumbs {
		grid-column: 1; grid-row: 1; display: flex; flex-direction: column; gap: 10px;
		max-height: 100%; overflow-y: auto; scrollbar-width: none;
	}
	.nn-gallery__thumb { width: 76px; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--nn-card); box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s; }
	.nn-gallery__thumb img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
	.nn-gallery__thumb.is-active, .nn-gallery__thumb:hover { box-shadow: 0 0 0 1.5px var(--nn-ink); }
	.nn-gallery__dots { display: none; }
	.nn-gallery__slide img { cursor: zoom-in; }
	.nn-footer__grid { grid-template-columns: 1.6fr repeat(3, minmax(0, 1fr)); }
	.nn-footer__brand { grid-column: auto; }
}

@media (min-width: 1100px) {
	.nn-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.nn-rail { grid-auto-columns: calc((100% - 3 * var(--nn-gap)) / 4); }
	.nn-usps__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.nn-usp { grid-template-columns: 1fr; gap: 14px; padding: 28px; }
	.nn-usp__icon { grid-row: auto; }
}

@media (min-width: 1200px) {
	.nn-nav { display: block; }
	.nn-burger { display: none; }
	.nn-header .nn-logo { margin-right: 20px; }
}

@media (min-width: 1440px) {
	.nn-nav__link { padding: 0 13px; }
	.nn-nav__link::after { left: 13px; right: 13px; }
}
/* El JS añade .is-tight si el menú va justo (menos aire) y .is-compact si ni así cabe. */
.nn-header.is-tight .nn-nav__link { padding: 0 7px; font-size: 13px; letter-spacing: 0; }
.nn-header.is-tight .nn-nav__link::after { left: 7px; right: 7px; }
.nn-header.is-tight .nn-nav__list { gap: 0; }
.nn-header.is-compact .nn-nav { display: none; }
.nn-header.is-compact .nn-burger { display: inline-grid; }
.nn-header.is-compact .nn-logo { margin-right: auto; }

@media (max-width: 639px) {
	.nn-hide-s { display: none; }
	.nn-tile { padding: 14px; }
	.nn-tile:not(.nn-tile--1) .nn-tile__title { font-size: 20px; }
	.nn-tile .nn-eyebrow { font-size: 10px; letter-spacing: .14em; }
	.nn-hero__from a { white-space: nowrap; }
	.nn-hero__btns .nn-btn { flex: 1 1 auto; }
	.nn-hero__foot { display: grid; grid-template-columns: minmax(0, 1fr); }
	.nn-hero__from { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--nn-gut) * -1); padding-inline: var(--nn-gut); }
	.nn-hero__from a { flex: none; }
	.nn-hero__ctrl { justify-content: center; }
	.nn-finder { padding-left: 16px; }
	.nn-finder .nn-btn { padding: 0 14px; }
	.nn-drawer-cart__actions { grid-template-columns: 1fr; }
	.nn-pdp__buy .single_add_to_cart_button { flex-basis: 100%; }
	.nn-gallery__main { margin-inline: calc(var(--nn-gut) * -1); border-radius: 0; }
}

@media (hover: none) {
	.nn-card.has-alt:hover .nn-card__img:not(.nn-card__img--alt) { opacity: 1; }
	.nn-card.has-alt:hover .nn-card__img--alt { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
	.nn-ticker__track { animation: none; flex-wrap: wrap; }
	.nn-js .nn-rv { opacity: 1; transform: none; }
}
