/* ==========================================================================
	grid.css (single stylesheet, sections marked below)
	========================================================================== */

/* ---------- fonts (block from assets_fontface.css; paths moved to ../fonts) ---------- */
@font-face {
	font-family:"Space Grotesk";
	src:url("../fonts/nvq-grotesk-lat.woff2") format("woff2");
	font-display:swap;
	font-weight:300 700;
	font-style:normal;
	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:"Space Grotesk Fallback";
	src:local("Arial");
	ascent-override:91%;
	descent-override:27%;
	size-adjust:108%;
}
@font-face {
	font-family:"Space Grotesk";
	src:url("../fonts/nvq-grotesk-ext.woff2") format("woff2");
	font-display:swap;
	font-weight:300 700;
	font-style:normal;
	unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
	font-family:"Work Sans";
	src:url("../fonts/nvq-worksans-lat.woff2") format("woff2");
	font-display:swap;
	font-weight:100 900;
	font-style:normal;
	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:"Work Sans Fallback";
	src:local("Arial");
	ascent-override:85%;
	descent-override:22%;
	size-adjust:110%;
}
@font-face {
	font-family:"Work Sans";
	src:url("../fonts/nvq-worksans-ext.woff2") format("woff2");
	font-display:swap;
	font-weight:100 900;
	font-style:normal;
	unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---------- tokens ---------- */
:root {
	--c-lona: rgb(245, 247, 251);
	--c-cuerda: rgb(234, 238, 245);
	--c-vendaje: rgb(206, 213, 226);
	--c-sombra: rgb(104, 114, 132);
	--c-guante: rgb(16, 21, 33);
	--c-acero: rgb(40, 86, 104);
	--c-descarga: rgb(92, 40, 226);
	--c-descarga-hondo: rgb(70, 24, 186);
	--c-nieve: rgb(255, 255, 255);
	--c-alerta: rgb(150, 30, 52);
	--c-relieve-cerca: rgb(16 21 33 / 0.07);
	--c-relieve-lejos: rgb(16 21 33 / 0.09);

	--s-finta: 0.5rem;
	--s-guardia: 1rem;
	--s-asalto: 1.5rem;
	--s-round: 2.5rem;
	--s-ring: clamp(3.5rem, 2.6rem + 3vw, 5.5rem);
	--s-esquina: 10px;
	--s-ancho: 1240px;
	--s-borde: clamp(16px, 4vw, 40px);

	--s-titulo: "Space Grotesk", "Space Grotesk Fallback", Arial, sans-serif;
	--s-texto: "Work Sans", "Work Sans Fallback", Arial, sans-serif;
	--s-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html {
	scroll-padding-top: 1rem;
	-webkit-text-size-adjust: 100%;
}
body {
	margin: 0;

	font-family: var(--s-texto);
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--c-guante);

	background: var(--c-lona);
}
img {
	display: block;

	max-width: 100%;
	height: auto;
}
h1, h2, h3, h4 {
	margin: 0 0 var(--s-guardia);

	font-family: var(--s-titulo);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: normal;
}
h1 { font-size: clamp(1.9rem, 1.25rem + 2.3vw, 3rem); }
h2 { font-size: clamp(1.55rem, 1.2rem + 1.3vw, 2.15rem); }
h3 { font-size: 1.2rem; }
p { margin: 0 0 var(--s-guardia); }
a { color: var(--c-acero); text-underline-offset: 0.18em; }
a:hover { color: var(--c-guante); }
:focus-visible { outline: 3px solid var(--c-descarga); outline-offset: 2px; }
ul, ol { margin: 0; padding: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
table { border-collapse: collapse; }

.nvq-skip {
	position: absolute;
	top: -60px;
	left: 16px;
	z-index: 900;

	padding: 0.7rem 1.1rem;

	color: var(--c-nieve);

	background: var(--c-guante);
	border-radius: 999px;
}
.nvq-skip:focus { top: 12px; color: var(--c-nieve); }

.nvq-wrap {
	max-width: var(--s-ancho);
	margin-inline: auto;
	padding-inline: var(--s-borde);
}

/* ---------- labels, numbering, dotted dividers ---------- */
.nvq-kicker {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;

	margin: 0 0 0.75rem;

	font-family: var(--s-mono);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--c-acero);
}
.nvq-num {
	font-family: var(--s-mono);
	font-weight: 700;
	color: var(--c-acero);
}
.nvq-sec {
	padding-block-start: var(--s-ring);
}
.nvq-sec-head {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--s-asalto);
	align-items: start;

	margin-block-end: var(--s-round);
	padding-block-start: var(--s-asalto);

	border-top: 2px dotted var(--c-vendaje);
}
.nvq-sec-head .nvq-num { font-size: 1.05rem; padding-top: 0.35rem; }
.nvq-sec-head h2 { max-width: 30ch; }
.nvq-sec-head p { max-width: 62ch; color: var(--c-sombra); }
.nvq-lead { font-size: 1.15rem; max-width: 60ch; }

/* ---------- buttons and chips ---------- */
.nvq-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;

	min-height: 48px;
	padding: 0.7rem 1.5rem;

	font-family: var(--s-titulo);
	font-weight: 700;
	font-size: 1rem;
	text-decoration: none;
	line-height: 1.2;
	color: var(--c-guante);

	background: transparent;
	border: 2px solid var(--c-guante);
	border-radius: 999px; /* pill: fully round ends */

	cursor: pointer;
	transition: background-color 0.18s, color 0.18s, border-color 0.18s;
}
.nvq-btn:hover { background: var(--c-guante); color: var(--c-nieve); }
.nvq-btn-go {
	color: var(--c-nieve);

	background: var(--c-descarga);
	border-color: var(--c-descarga);
	box-shadow: 0 1px 2px var(--c-relieve-cerca), 0 10px 22px rgb(92 40 226 / 0.22);
}
.nvq-btn-go:hover { background: var(--c-descarga-hondo); border-color: var(--c-descarga-hondo); color: var(--c-nieve); }
.nvq-btn[disabled] { cursor: progress; background: var(--c-sombra); border-color: var(--c-sombra); box-shadow: none; }
.nvq-btns { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.nvq-chip {
	display: inline-flex;
	align-items: center;

	padding: 0.25rem 0.75rem;

	font-size: 0.875rem;
	font-weight: 600;

	background: var(--c-nieve);
	border-radius: 999px;
}

/* ---------- tiles (bento) ---------- */
.nvq-tile {
	padding: clamp(1.1rem, 0.8rem + 1vw, 1.75rem);

	background: var(--c-cuerda);
	border-radius: var(--s-esquina);
	box-shadow: 0 1px 2px var(--c-relieve-cerca), 0 12px 28px -10px var(--c-relieve-lejos); /* double layered */
}
.nvq-tile > :last-child { margin-bottom: 0; }
.nvq-tile, .nvq-card { min-width: 0; }
.nvq-tile-dark {
	color: var(--c-nieve);

	background: var(--c-guante);
}
.nvq-tile-dark a { color: var(--c-nieve); }
.nvq-tile-dark .nvq-kicker, .nvq-tile-dark .nvq-num { color: rgb(190, 202, 222); }
.nvq-tile-dark .nvq-btn { color: var(--c-nieve); border-color: var(--c-nieve); }
.nvq-tile-dark .nvq-btn:hover { background: var(--c-nieve); color: var(--c-guante); }
.nvq-tile-dark .nvq-btn-go { border-color: var(--c-descarga); }
.nvq-tile-dark .nvq-btn-go:hover { background: var(--c-descarga-hondo); color: var(--c-nieve); }

/* photo frame: square corners on purpose, grain is baked, vignette is an overlay */
.nvq-shot {
	position: relative;

	margin: 0;

	background: var(--c-cuerda);
}
.nvq-shot img { width: 100%; }
.nvq-shot::after {
	content: "";
	position: absolute;
	inset: 0;

	box-shadow: inset 0 0 70px rgb(16 21 33 / 0.2);

	pointer-events: none;
}
.nvq-fig { margin: 0; }
.nvq-fig figcaption {
	padding: 0.55rem 0 0;

	font-size: 0.875rem;
	color: var(--c-sombra);

	background: var(--c-lona);
}

/* ---------- header (logo centred, menu below) ---------- */
.nvq-top {
	position: relative;
	z-index: 500;

	background: var(--c-lona);
	border-bottom: 2px dotted var(--c-vendaje);
}
.nvq-top-row {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;

	min-height: 64px;
}
.nvq-top-note {
	font-family: var(--s-mono);
	font-size: 0.8125rem;
	color: var(--c-sombra);
}
.nvq-logo {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	justify-self: center;

	min-height: 48px;

	font-family: var(--s-titulo);
	font-weight: 800;
	font-size: 1.5rem;
	text-decoration: none;
	color: var(--c-guante);
}
.nvq-logo svg { width: 34px; height: 34px; }
.nvq-top-tel { justify-self: end; font-size: 0.9375rem; }
.nvq-top-tel a { display: inline-flex; align-items: center; min-height: 44px; }
.nvq-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;

	padding-block: 0 0.5rem;
}
.nvq-nav ul { display: flex; gap: 0.25rem; list-style: none; }
.nvq-nav a {
	display: inline-flex;
	align-items: center;

	min-height: 44px;
	padding-inline: 0.9rem;

	font-weight: 600;
	text-decoration: none;
	color: var(--c-guante);

	border-radius: 999px;
}
.nvq-nav a:hover, .nvq-nav a[aria-current="page"] { background: var(--c-cuerda); }
.nvq-bag {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;

	min-height: 44px;
	padding: 0.25rem 0.5rem 0.25rem 0.9rem;

	font-weight: 600;
	text-decoration: none;
	color: var(--c-guante);

	background: var(--c-nieve);
	border-radius: 999px;
	box-shadow: 0 1px 2px var(--c-relieve-cerca), 0 6px 14px -6px var(--c-relieve-lejos);
}
.nvq-bag svg { width: 20px; height: 20px; }
.nvq-bag-count {
	display: inline-grid;
	place-items: center;

	min-width: 30px;
	height: 30px;
	padding-inline: 0.4rem;

	font-family: var(--s-mono);
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--c-nieve);

	background: var(--c-descarga);
	border-radius: 999px;
}
.nvq-burger {
	display: none;
	align-items: center;
	justify-content: center;

	width: 48px;
	height: 48px;

	background: var(--c-cuerda);
	border: 0;
	border-radius: 999px;

	cursor: pointer;
}
.nvq-burger svg { width: 22px; height: 22px; }
.nvq-top-bag-m { display: none; justify-self: end; }

/* ---------- drawers: mobile menu + side cart (closed = visibility hidden) ---------- */
.nvq-drawer {
	position: fixed;
	inset: 0;
	z-index: 700;

	display: flex;
	flex-direction: column;

	padding: 1rem var(--s-borde) 2rem;
	overflow-y: auto;

	background: var(--c-lona);

	visibility: hidden;
	transform: translateX(-100%);
	transition: transform 0.25s ease, visibility 0s linear 0.25s;
}
.nvq-drawer.showing { visibility: visible; transform: none; transition: transform 0.25s ease; }
.nvq-drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;

	margin-bottom: 1.5rem;
}
.nvq-drawer ul { list-style: none; border-top: 2px dotted var(--c-vendaje); }
.nvq-drawer li { border-bottom: 2px dotted var(--c-vendaje); }
.nvq-drawer li a {
	display: flex;
	align-items: center;
	justify-content: space-between;

	min-height: 58px;

	font-family: var(--s-titulo);
	font-size: 1.35rem;
	font-weight: 700;
	text-decoration: none;
	color: var(--c-guante);
}
.nvq-drawer-foot { margin-top: auto; padding-top: 2rem; color: var(--c-sombra); }
.nvq-x {
	display: inline-grid;
	place-items: center;

	width: 48px;
	height: 48px;

	background: var(--c-cuerda);
	border: 0;
	border-radius: 999px;

	cursor: pointer;
}
.nvq-x svg { width: 20px; height: 20px; }

.nvq-side {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 680;

	display: flex;
	flex-direction: column;

	width: min(420px, 100%);
	padding: 1rem 1.25rem 1.25rem;

	background: var(--c-lona);
	box-shadow: -1px 0 0 var(--c-vendaje), -24px 0 48px -12px rgb(16 21 33 / 0.18);

	visibility: hidden;
	transform: translateX(100%);
	transition: transform 0.25s ease, visibility 0s linear 0.25s;
}
.nvq-side.showing { visibility: visible; transform: none; transition: transform 0.25s ease; }
.nvq-side-full {
	display: flex;
	flex-direction: column;
	flex: 1;

	min-height: 0;
}
.nvq-side-full .nvq-lines { flex: 1; overflow-y: auto; min-height: 0; }
.nvq-side-title { margin: 0; font-family: var(--s-titulo); font-size: 1.35rem; font-weight: 800; }
.nvq-side-empty .nvq-btn { margin-top: 0.25rem; }
.nvq-side-foot { padding-top: 1rem; border-top: 2px dotted var(--c-vendaje); }
.nvq-side-foot .nvq-btns { margin-top: 0.75rem; }
.nvq-side-foot .nvq-btn { flex: 1; }

/* ---------- hero: strip-intro ---------- */
.nvq-hero { padding-block-start: clamp(1.75rem, 1rem + 2.5vw, 3.25rem); }
.nvq-hero-top {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 2vw, 3rem);
	align-items: start;
}
.nvq-hero h1 { max-width: 19ch; }
.nvq-hero .nvq-lead { margin-bottom: 1.5rem; }
.nvq-facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;

	list-style: none;
}
.nvq-facts li {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;

	padding: 1rem 1.1rem;

	font-size: 0.9375rem;
	line-height: 1.4;

	background: var(--c-cuerda);
	border-radius: var(--s-esquina);
	box-shadow: 0 1px 2px var(--c-relieve-cerca), 0 12px 28px -10px var(--c-relieve-lejos);
}
.nvq-facts strong {
	font-family: var(--s-titulo);
	font-size: 1.45rem;
	font-weight: 800;
	line-height: 1.1;
}
.nvq-facts li:first-child { grid-column: span 2; background: var(--c-guante); color: var(--c-nieve); }
.nvq-facts li:first-child span { color: rgb(200, 210, 228); }
.nvq-strip {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;

	margin-top: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
	padding: 0;

	list-style: none;
}
.nvq-strip li { min-width: 0; }
.nvq-strip .nvq-shot img { aspect-ratio: 16 / 10; object-fit: cover; height: auto; }
.nvq-strip figcaption { display: flex; gap: 0.5rem; }

/* ---------- 01 stepped grid of categories ---------- */
.nvq-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;

	list-style: none;
}
.nvq-steps li:nth-child(3n+2) { margin-top: 2.5rem; } /* stepped offset per column */
.nvq-steps li:nth-child(3n) { margin-top: 5rem; }
.nvq-cat {
	display: grid;
	grid-template-columns: 42% 1fr;

	min-height: 100%;

	text-decoration: none;
	color: var(--c-guante);

	background: var(--c-cuerda);
	box-shadow: 0 1px 2px var(--c-relieve-cerca), 0 12px 28px -10px var(--c-relieve-lejos);

	transition: box-shadow 0.2s;
}
.nvq-cat:hover { box-shadow: 0 1px 2px var(--c-relieve-cerca), 0 18px 34px -10px rgb(16 21 33 / 0.16); color: var(--c-guante); }
.nvq-cat .nvq-shot { position: relative; min-height: 10rem; background: var(--c-vendaje); }
.nvq-cat .nvq-shot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } /* fills the whole column, no strip under the photo */
.nvq-cat-txt {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;

	padding: 1rem 1.1rem;
}
.nvq-cat-txt .nvq-num { font-size: 0.8125rem; }
.nvq-cat-txt b { font-family: var(--s-titulo); font-size: 1.3rem; line-height: 1.15; }
.nvq-cat-txt span { font-size: 0.9375rem; }
.nvq-cat-txt em {
	margin-top: auto;

	font-style: normal;
	font-weight: 700;
	color: var(--c-acero);
}

/* ---------- 02 sticky sidebar: workshop stages ---------- */
.nvq-proc {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr);
	gap: clamp(1.5rem, 1rem + 2vw, 3rem);
	align-items: start;
}
.nvq-proc-toc {
	position: sticky;
	top: 1.25rem;
}
.nvq-proc-toc ol { list-style: none; counter-reset: none; }
.nvq-proc-toc a {
	display: grid;
	grid-template-columns: 2.5rem 1fr;
	align-items: center;

	min-height: 52px;
	padding: 0.35rem 0.75rem;

	font-weight: 600;
	text-decoration: none;
	color: var(--c-guante);

	border-left: 3px solid var(--c-vendaje);
	transition: border-color 0.2s, background-color 0.2s;
}
.nvq-proc-toc a.showing { border-left-color: var(--c-descarga); background: var(--c-cuerda); }
.nvq-proc-toc .nvq-tile { margin-top: 1.25rem; font-size: 0.9375rem; }
.nvq-proc-list { display: grid; gap: 12px; }
.nvq-stage { scroll-margin-top: 1.25rem; }
.nvq-stage-sq { border-radius: 0; } /* holds a photo: photo frames stay square */
.nvq-stage h3 { display: flex; gap: 0.75rem; align-items: baseline; }
.nvq-quote {
	margin: 0;
	padding: 0.25rem 0 0.25rem 1rem;

	font-family: var(--s-titulo);
	font-size: 1.15rem;
	font-weight: 600;
	line-height: 1.4;

	border-left: 3px solid var(--c-acero);
}
.nvq-quote cite { display: block; margin-top: 0.4rem; font-family: var(--s-texto); font-size: 0.9rem; font-style: normal; font-weight: 400; color: var(--c-sombra); }
.nvq-proc-photo { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1.25rem; align-items: center; }

/* ---------- 03 svg path: from the workshop to your door ---------- */
.nvq-route { position: relative; }
.nvq-route-svg { display: block; width: 100%; height: auto; }
.nvq-route .nvq-route-base { stroke: var(--c-vendaje); }
.nvq-route .nvq-route-line { stroke: var(--c-acero); }
.nvq-route .nvq-route-dot { fill: var(--c-lona); stroke: var(--c-acero); }
.nvq-route-v { display: none; }
.nvq-route-stops {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;

	margin-top: 0.75rem;

	list-style: none;
}
.nvq-route-stops li { padding: 1rem 1.1rem; }
.nvq-route-stops b { display: block; font-family: var(--s-titulo); font-size: 1.1rem; margin: 0.15rem 0 0.35rem; }
.nvq-route-stops p { font-size: 0.9375rem; margin: 0; }

/* ---------- 04 accordion faq ---------- */
.nvq-faq {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.5fr);
	gap: 12px;
	align-items: start;
}
.nvq-acc { border-top: 2px dotted var(--c-vendaje); }
.nvq-acc details { border-bottom: 2px dotted var(--c-vendaje); }
.nvq-acc summary {
	display: grid;
	grid-template-columns: 2.5rem 1fr 1.5rem;
	align-items: center;

	min-height: 56px;
	padding-block: 0.6rem;

	font-family: var(--s-titulo);
	font-weight: 700;
	font-size: 1.08rem;

	cursor: pointer;
	list-style: none;
}
.nvq-acc summary::-webkit-details-marker { display: none; }
.nvq-acc summary::after {
	content: "+";

	font-family: var(--s-mono);
	font-size: 1.3rem;
	text-align: center;
	color: var(--c-acero);
}
.nvq-acc details[open] summary::after { content: "\2212"; }
.nvq-acc .nvq-acc-a { padding: 0 2rem 1rem 2.5rem; }

/* ---------- 05 crew ---------- */
.nvq-crew {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 clamp(1.5rem, 1rem + 2vw, 3rem);
}
.nvq-person {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
	gap: 1.25rem;
	align-items: start;

	padding-block: 1.25rem;

	border-top: 2px dotted var(--c-vendaje);
}
.nvq-person .nvq-shot { max-width: 420px; }
.nvq-person h3 { margin-bottom: 0.25rem; }
.nvq-person .nvq-role { font-size: 0.9375rem; color: var(--c-acero); font-weight: 600; margin-bottom: 0.75rem; }

/* ---------- 06 call band ---------- */
.nvq-band {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) auto;
	gap: 1.5rem;
	align-items: center;
}
.nvq-band h2 { margin-bottom: 0.5rem; }

/* ---------- internal page head ---------- */
.nvq-head { padding-block: clamp(1.75rem, 1.2rem + 2vw, 3rem) 0; }
.nvq-head h1 { max-width: 24ch; }
.nvq-crumbs { display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; list-style: none; font-size: 0.9375rem; }
.nvq-crumbs a { display: inline-flex; align-items: center; min-height: 44px; }
.nvq-crumbs li + li::before { content: "/"; margin-right: 0.5rem; color: var(--c-sombra); }
.nvq-crumbs li { display: inline-flex; align-items: center; }

/* ---------- generic layouts ---------- */
.nvq-split {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: 12px clamp(1.25rem, 0.8rem + 2vw, 2.5rem);
	align-items: start;
}
.nvq-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.nvq-cols-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nvq-stack { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; } /* minmax keeps wide tables inside their scroll box */
.nvq-aside-sticky { position: sticky; top: 1.25rem; }

/* legal pages: toc + cards */
.nvq-legal {
	display: grid;
	grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
	gap: 12px clamp(1.25rem, 0.8rem + 2vw, 2.5rem);
	align-items: start;
}
.nvq-toc { position: sticky; top: 1.25rem; }
.nvq-toc ol { list-style: none; border-top: 2px dotted var(--c-vendaje); }
.nvq-toc li { border-bottom: 2px dotted var(--c-vendaje); }
.nvq-toc a {
	display: grid;
	grid-template-columns: 2.25rem 1fr;
	align-items: center;

	min-height: 46px;

	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	color: var(--c-guante);
}
.nvq-toc a .nvq-num { font-size: 0.8125rem; }
.nvq-card { scroll-margin-top: 1.25rem; }
.nvq-card h2 { font-size: 1.35rem; display: flex; gap: 0.75rem; align-items: baseline; }
.nvq-card h3 { font-size: 1.08rem; margin-bottom: 0.4rem; }
.nvq-card ul { padding-left: 1.2rem; margin-bottom: 1rem; }
.nvq-card li { margin-bottom: 0.35rem; }
.nvq-card-accent { border-left: 4px solid var(--c-acero); }

/* tables */
.nvq-scroll { overflow-x: auto; max-width: 100%; }
.nvq-table {
	width: 100%;

	font-size: 0.975rem;
}
.nvq-table caption {
	padding-bottom: 0.6rem;

	font-family: var(--s-titulo);
	font-weight: 700;
	text-align: left;
}
.nvq-table th, .nvq-table td {
	padding: 0.65rem 0.75rem;

	text-align: left;
	vertical-align: top;

	border-bottom: 2px dotted var(--c-vendaje);
}
.nvq-table thead th { font-family: var(--s-mono); font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--c-acero); }
.nvq-table tbody th { font-weight: 600; }
.nvq-table-wide { min-width: 560px; }
.nvq-table-pair td { overflow-wrap: anywhere; } /* two-column data table only */
.nvq-table td a { display: inline-flex; align-items: center; min-height: 44px; }

/* ---------- forms ---------- */
.nvq-form { display: grid; gap: 1rem; }
.nvq-form > .nvq-btn { justify-self: start; } /* grid would stretch it full width */
.nvq-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.nvq-field { display: grid; gap: 0.35rem; min-width: 0; }
.nvq-field label { font-weight: 600; font-size: 0.975rem; }
.nvq-field input, .nvq-field select, .nvq-field textarea {
	width: 100%;
	min-height: 48px;
	padding: 0.65rem 0.85rem;

	background: var(--c-nieve);
	border: 2px solid var(--c-vendaje);
	border-radius: 8px;
}
.nvq-field textarea { min-height: 130px; resize: vertical; }
.nvq-field input:focus, .nvq-field select:focus, .nvq-field textarea:focus { border-color: var(--c-acero); outline: none; box-shadow: 0 0 0 3px rgb(40 86 104 / 0.2); }
.nvq-field small { font-size: 0.875rem; color: var(--c-sombra); }
.nvq-field.nvq-bad input, .nvq-field.nvq-bad textarea, .nvq-field.nvq-bad select { border-color: var(--c-alerta); }
.nvq-err { min-height: 0; margin: 0; font-size: 0.9rem; font-weight: 600; color: var(--c-alerta); }
.nvq-err:empty { display: none; }
.nvq-check {
	display: grid;
	grid-template-columns: 24px 1fr;
	gap: 0.6rem;
	align-items: start;

	font-size: 0.975rem;
}
.nvq-field .nvq-check { font-weight: 400; }
.nvq-check input { width: 22px; height: 22px; margin: 0.15rem 0 0; accent-color: var(--c-descarga); }
.nvq-hp {
	position: absolute;
	left: -9999px;
	top: auto;

	width: 1px;
	height: 1px;
	overflow: hidden;
}
.nvq-form-msg { margin: 0; padding: 0.75rem 1rem; font-weight: 600; background: var(--c-nieve); border-left: 4px solid var(--c-alerta); }
.nvq-form-msg:empty { display: none; }

/* ---------- catalogue ---------- */
.nvq-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;

	margin-bottom: 1.5rem;
}
.nvq-filter button {
	min-height: 44px;
	padding: 0.4rem 1.1rem;

	font-weight: 600;

	background: var(--c-cuerda);
	border: 2px solid transparent;
	border-radius: 999px;

	cursor: pointer;
}
.nvq-filter button[aria-pressed="true"] { background: var(--c-guante); color: var(--c-nieve); }
.nvq-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0 clamp(1rem, 0.6rem + 1vw, 1.75rem);

	list-style: none;
}
.nvq-item {
	padding-block: 1.25rem;

	border-bottom: 2px dotted var(--c-vendaje); /* cards without frames, split by lines */
}
.nvq-item a { display: block; text-decoration: none; color: var(--c-guante); }
.nvq-item .nvq-shot img { aspect-ratio: 1; object-fit: cover; }
.nvq-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nvq-item h2, .nvq-item h3 { font-size: 1.05rem; margin: 0.75rem 0 0.2rem; font-weight: 700; }
.nvq-item p { margin: 0; font-size: 0.9375rem; color: var(--c-sombra); }
.nvq-item .nvq-price { margin-top: 0.35rem; color: var(--c-guante); }
.nvq-price { font-family: var(--s-titulo); font-weight: 700; }
.nvq-price small { font-family: var(--s-texto); font-weight: 400; font-size: 0.8125rem; color: var(--c-sombra); }
.nvq-count-line { color: var(--c-sombra); font-size: 0.9375rem; }

/* ---------- product page ---------- */
.nvq-pdp {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	grid-template-areas: "shot info" "shot notes";
	grid-template-rows: auto 1fr;
	gap: 1.5rem clamp(1.25rem, 0.8rem + 2.5vw, 3.5rem);
	align-items: start;

	padding-block-start: 0.5rem;
}
.nvq-pdp-shot {
	position: sticky;
	top: 1.25rem;

	grid-area: shot;
}
.nvq-pdp-shot .nvq-shot { width: fit-content; max-width: 100%; margin-inline: auto; }
.nvq-pdp-shot .nvq-shot img { aspect-ratio: 1; object-fit: cover; width: auto; max-height: min(62vh, 640px); } /* keeps the photo under the img-giant ceiling */
.nvq-pdp-info { grid-area: info; }
.nvq-pdp-notes { grid-area: notes; }
.nvq-pdp-info h1 { font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.5rem); margin-bottom: 0.5rem; }
.nvq-pdp-price { font-family: var(--s-titulo); font-size: 1.75rem; font-weight: 800; margin-bottom: 0.25rem; }
.nvq-pdp-price small { font-family: var(--s-texto); font-size: 0.9375rem; font-weight: 400; color: var(--c-sombra); }
.nvq-pdp-meta { color: var(--c-sombra); margin-bottom: 1rem; }
.nvq-sizes { margin: 0 0 1rem; padding: 0; border: 0; }
.nvq-sizes legend { margin-bottom: 0.5rem; font-weight: 700; }
.nvq-sizes-list { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.nvq-size { position: relative; }
.nvq-size input {
	position: absolute;
	clip: rect(0 0 0 0); /* visually replaced by the label pill, still focusable */

	width: 1px;
	height: 1px;
	margin: 0;
	overflow: hidden;
}
.nvq-size label {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	min-width: 58px;
	min-height: 48px;
	padding: 0.3rem 0.7rem;

	font-weight: 700;
	line-height: 1.1;

	background: var(--c-nieve);
	border: 2px solid var(--c-vendaje);
	border-radius: 999px;

	cursor: pointer;
}
.nvq-size label small { font-size: 0.6875rem; font-weight: 500; color: var(--c-sombra); }
.nvq-size input:checked + label { background: var(--c-guante); border-color: var(--c-guante); color: var(--c-nieve); }
.nvq-size input:focus-visible + label { outline: 3px solid var(--c-descarga); outline-offset: 2px; }
.nvq-size input:disabled + label { color: var(--c-sombra); background: var(--c-cuerda); border-style: dashed; cursor: not-allowed; text-decoration: line-through; }
.nvq-buy { display: grid; grid-template-columns: 110px 1fr; gap: 0.75rem; align-items: end; margin-bottom: 0.5rem; }
.nvq-buy .nvq-btn { width: 100%; }
.nvq-buy-msg { min-height: 1.6rem; margin: 0 0 1rem; font-weight: 600; color: var(--c-acero); }
.nvq-buy-msg.nvq-bad { color: var(--c-alerta); }
.nvq-pdp-notes { display: grid; gap: 12px; margin-top: 0.5rem; }
.nvq-pdp-notes ul { padding-left: 1.15rem; }
.nvq-pdp-notes li { margin-bottom: 0.3rem; }
.nvq-linkrow { display: flex; flex-wrap: wrap; gap: 0 1.25rem; }
.nvq-linkrow a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }

/* ---------- cart lines, summary ---------- */
.nvq-lines { list-style: none; }
.nvq-line {
	display: grid;
	grid-template-columns: 76px minmax(0, 1fr) auto;
	gap: 0.85rem;
	align-items: start;

	padding-block: 0.9rem;

	border-bottom: 2px dotted var(--c-vendaje);
}
.nvq-line img { width: 76px; height: 76px; object-fit: cover; }
.nvq-line-name { display: block; font-weight: 700; line-height: 1.3; text-decoration: none; color: var(--c-guante); }
.nvq-line-meta { font-size: 0.875rem; color: var(--c-sombra); }
.nvq-line-ctrl { display: flex; align-items: center; gap: 0.35rem; margin-top: 0.4rem; }
.nvq-line-ctrl button {
	min-width: 44px;
	min-height: 44px;

	font-weight: 700;

	background: var(--c-cuerda);
	border: 0;
	border-radius: 999px;

	cursor: pointer;
}
.nvq-line-ctrl output { min-width: 1.75rem; text-align: center; font-family: var(--s-mono); font-weight: 700; }
.nvq-line-ctrl .nvq-del { padding-inline: 0.9rem; background: transparent; text-decoration: underline; color: var(--c-acero); font-weight: 600; }
.nvq-line-sum { font-family: var(--s-titulo); font-weight: 700; white-space: nowrap; }
.nvq-sum dl { display: grid; grid-template-columns: 1fr auto; gap: 0.4rem 1rem; margin: 0 0 0.75rem; }
.nvq-sum dt { color: var(--c-guante); }
.nvq-sum dd { margin: 0; text-align: right; font-family: var(--s-titulo); font-weight: 600; white-space: nowrap; }
.nvq-sum .nvq-total { padding-top: 0.6rem; border-top: 2px dotted var(--c-vendaje); font-weight: 800; font-size: 1.2rem; }
.nvq-sum-note { font-size: 0.9rem; color: var(--c-guante); }
.nvq-empty { text-align: left; }
.nvq-notice { margin: 0 0 1rem; padding: 0.75rem 1rem; font-weight: 600; background: var(--c-nieve); border-left: 4px solid var(--c-acero); }
.nvq-notice:empty { display: none; }

/* ---------- checkout ---------- */
.nvq-stepper { display: flex; gap: 0.5rem; list-style: none; margin-bottom: 1.25rem; }
.nvq-stepper li {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;

	min-height: 44px;
	padding: 0.35rem 1rem 0.35rem 0.4rem;

	font-weight: 600;

	background: var(--c-cuerda);
	border-radius: 999px;
}
.nvq-stepper span { display: inline-grid; place-items: center; width: 32px; height: 32px; font-family: var(--s-mono); background: var(--c-nieve); border-radius: 999px; }
.nvq-stepper li[aria-current="step"] { background: var(--c-guante); color: var(--c-nieve); }
.nvq-stepper li[aria-current="step"] span { color: var(--c-guante); }
.nvq-pay {
	display: grid;
	grid-template-columns: 24px 1fr;
	gap: 0.6rem;

	padding: 1rem;

	background: var(--c-nieve);
	border: 2px solid var(--c-acero);
	border-radius: var(--s-esquina);
}
.nvq-pay input { width: 20px; height: 20px; margin: 0.2rem 0 0; accent-color: var(--c-acero); }
.nvq-review dl { display: grid; grid-template-columns: minmax(0, 9rem) 1fr; gap: 0.35rem 1rem; margin: 0; }
.nvq-review dt { font-weight: 600; }
.nvq-review dd { margin: 0; overflow-wrap: anywhere; }
.nvq-textbtn {
	min-height: 44px;
	padding: 0 0.25rem;

	font-weight: 600;
	text-decoration: underline;
	color: var(--c-acero);

	background: none;
	border: 0;

	cursor: pointer;
}

/* ---------- order status ---------- */
.nvq-status { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; list-style: none; margin: 1rem 0; }
.nvq-status li {
	padding: 0.75rem;

	font-size: 0.9375rem;
	font-weight: 600;

	background: var(--c-nieve);
	border-top: 4px solid var(--c-vendaje);
}
.nvq-status li.showing { border-top-color: var(--c-descarga); }
.nvq-status li span { display: block; font-family: var(--s-mono); font-size: 0.8125rem; color: var(--c-acero); }

/* ---------- size guide figure ---------- */
.nvq-measure svg { width: 100%; max-width: 360px; height: auto; }
.nvq-measure .nvq-m-body { fill: var(--c-nieve); stroke: var(--c-guante); }
.nvq-measure .nvq-m-line { stroke: var(--c-descarga); }
.nvq-measure text { font-family: var(--s-mono); font-size: 12px; fill: var(--c-guante); }

/* ---------- 404 / thanks big numeral ---------- */
.nvq-bignum {
	font-family: var(--s-titulo);
	font-size: clamp(5rem, 3rem + 8vw, 11rem);
	font-weight: 800;
	line-height: 0.9;
	color: var(--c-vendaje);
}

/* ---------- footer ---------- */
.nvq-foot {
	margin-top: var(--s-ring);
	padding-block: var(--s-round) 1.5rem;

	border-top: 2px dotted var(--c-vendaje);
}
.nvq-foot-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
}
.nvq-foot h2 { font-family: var(--s-mono); font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--c-acero); margin-bottom: 0.5rem; }
.nvq-foot ul { list-style: none; }
.nvq-foot li a { display: inline-flex; align-items: center; min-height: 44px; color: var(--c-guante); text-decoration: none; }
.nvq-foot li a:hover { text-decoration: underline; }
.nvq-foot-base {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.5rem 1.5rem;

	margin-top: 1.5rem;
	padding-top: 1rem;

	font-size: 0.9rem;
	color: var(--c-sombra);

	border-top: 2px dotted var(--c-vendaje);
}

/* ---------- cookie tray (pinned bottom-right card, no backdrop) ---------- */
.privacy-tray {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 600;

	width: min(430px, calc(100% - 32px));
	padding: 1rem 1.1rem 1.1rem;

	font-size: 0.9375rem;
	line-height: 1.45;
	color: var(--c-guante);

	background: var(--c-nieve);
	border-top: 4px solid var(--c-acero);
	border-radius: var(--s-esquina);
	box-shadow: 0 2px 4px rgb(16 21 33 / 0.08), 0 18px 40px -8px rgb(16 21 33 / 0.28);

	visibility: hidden;
}
.privacy-tray.showing { visibility: visible; }
.privacy-tray p { margin: 0 0 0.75rem; }
.privacy-tray .nvq-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.privacy-tray .nvq-btn { min-height: 44px; padding: 0.5rem 0.75rem; font-size: 0.9375rem; }

/* ---------- small page parts ---------- */
.nvq-body { padding-block-start: var(--s-round); }
.nvq-pagecrumbs { padding-block-start: 1rem; }
fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.nvq-field-label { font-weight: 600; font-size: 0.975rem; }
.nvq-tile-title { font-size: 1.15rem; margin-bottom: 0.5rem; }
.nvq-sum h2 { font-size: 1.3rem; }
.nvq-next { display: grid; gap: 0.5rem; padding-left: 1.25rem; }
.nvq-done-num { font-family: var(--s-mono); font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.3rem); letter-spacing: 0.04em; }
.nvq-legal-text p { margin-bottom: 0.6rem; font-size: 0.975rem; }
.nvq-track-out { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 2px dotted var(--c-vendaje); }
.nvq-track-out h3 { font-family: var(--s-mono); }
.nvq-review { margin-bottom: 0.5rem; }

/* ---------- reveal (io owner: signup.js) ---------- */
.nvq-reveal.nvq-wait { opacity: 0; transform: translateY(14px); }
.nvq-reveal.faded-in { opacity: 1; transform: none; transition: opacity 0.5s ease, transform 0.5s ease; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
	.nvq-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.nvq-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nvq-steps li:nth-child(3n+2), .nvq-steps li:nth-child(3n) { margin-top: 0; }
	.nvq-steps li:nth-child(2n) { margin-top: 2.5rem; }
	.nvq-crew { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
	.nvq-hero-top, .nvq-proc, .nvq-faq, .nvq-split, .nvq-legal, .nvq-band, .nvq-pdp { grid-template-columns: minmax(0, 1fr); }
	.nvq-proc-toc, .nvq-toc, .nvq-aside-sticky, .nvq-pdp-shot { position: static; }
	.nvq-pdp { grid-template-areas: "info" "shot" "notes"; grid-template-rows: auto; }
	.nvq-route-stops { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nvq-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nvq-status { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.nvq-top-note, .nvq-top-tel, .nvq-nav { display: none; }
	.nvq-burger { display: inline-flex; }
	.nvq-top-bag-m { display: inline-flex; }
	.nvq-top-row { grid-template-columns: 48px 1fr auto; gap: 0.5rem; }
	.nvq-strip {
		grid-template-columns: repeat(3, 78%);
		overflow-x: auto;

		scroll-snap-type: x mandatory;
	}
	.nvq-strip li { scroll-snap-align: start; }
	.nvq-route-h { display: none; }
	.nvq-route-v { display: block; position: absolute; left: 0; top: 0; width: 28px; height: 100%; }
	.nvq-route-stops { grid-template-columns: minmax(0, 1fr); padding-left: 40px; margin-top: 0; }
	.nvq-proc-photo, .nvq-person, .nvq-cols-2, .nvq-form-row { grid-template-columns: minmax(0, 1fr); }
	.nvq-person .nvq-shot { max-width: none; }
	.nvq-facts strong { font-size: 1.25rem; }
	.nvq-sec-head { grid-template-columns: minmax(0, 1fr); gap: 0.25rem; }
	.privacy-tray { right: 12px; bottom: 12px; width: calc(100% - 24px); padding: 0.8rem 0.9rem 0.9rem; font-size: 0.875rem; }
	.privacy-tray p { margin-bottom: 0.6rem; }
}
@media (max-width: 560px) {
	.nvq-tray-more { display: none; }
	.nvq-pdp-info .nvq-kicker, .nvq-pdp-meta { display: none; } /* keeps add-to-bag above the consent tray on 360 */
	.nvq-steps { grid-template-columns: minmax(0, 1fr); }
	.nvq-steps li:nth-child(2n) { margin-top: 0; }
	.nvq-foot-grid { grid-template-columns: minmax(0, 1fr); }
	.nvq-facts { grid-template-columns: minmax(0, 1fr); }
	.nvq-facts li:first-child { grid-column: auto; }
	.nvq-status { grid-template-columns: minmax(0, 1fr); }
	.nvq-review dl { grid-template-columns: minmax(0, 1fr); }
	.nvq-logo { font-size: 1.3rem; }
}
@media (min-width: 1800px) {
	:root { --s-ancho: 1440px; }
	body { font-size: 1.125rem; }
}
@media (prefers-reduced-motion: reduce) {
	.nvq-reveal.nvq-wait { opacity: 1; transform: none; }
	.nvq-drawer, .nvq-side { transition: none; }
}

/* hidden must win over component display rules (kept last on purpose) */
[hidden] { display: none; }
