/**
 * Nórtica · Widgets para Elementor
 * Hoja de estilo única del sistema visual aprobado.
 *
 * Convenciones:
 *  - Todo va prefijado con .ntc- para no chocar con el tema ni con Elementor.
 *  - Los colores salen de variables; los controles de Elementor las sobrescriben
 *    por widget mediante selectores propios.
 *  - Media queries de escritorio a móvil: 1140px (menú), 900px, 767px y 480px.
 */

/* ============================================================ Tokens base */
.ntc {
	--ntc-tinta: #0E1330;
	--ntc-tinta-2: #1A2146;
	--ntc-hexa: #F07A00;
	--ntc-hexa-osc: #C75F00;
	--ntc-arena: #FBF0E4;
	--ntc-acero: #5A6378;
	--ntc-linea: #E4E6EC;
	--ntc-caliche: #F1F2F5;
	--ntc-verde: #128C4A;
	--ntc-display: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	--ntc-texto: "Instrument Sans", "Segoe UI", system-ui, sans-serif;
	--ntc-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;
	--ntc-hex: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
	--ntc-sombra: 0 1px 2px rgba(14, 19, 48, .06), 0 8px 24px rgba(14, 19, 48, .07);

	color: var(--ntc-tinta);
	font-family: var(--ntc-texto);
	font-size: 16px;
	line-height: 1.6;
}

/* Regla de oro para que nada desborde en móvil. */
.ntc,
.ntc *,
.ntc *::before,
.ntc *::after {
	box-sizing: border-box;
}

.ntc img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* Los enlaces heredan el color de su contenedor en vez del color de enlace
   del tema (Hello Elementor pinta `a { color: #c36 }`).
   Va dentro de :where() para que su especificidad sea la de `.ntc` y cualquier
   componente posterior (.ntc-linea, .ntc-via…) pueda fijar su propio color. */
.ntc :where(a) {
	color: inherit;
}

/* El mismo reset del tema subraya los enlaces visitados: lo anulamos con
   especificidad suficiente (0,2,1). */
.ntc a,
.ntc a:link,
.ntc a:visited,
.ntc a:hover,
.ntc a:focus {
	text-decoration: none;
}

.ntc :focus-visible {
	outline: 2px solid var(--ntc-hexa);
	outline-offset: 3px;
}

.ntc h1,
.ntc h2,
.ntc h3,
.ntc h4 {
	margin: 0;
	text-wrap: balance;
}

.ntc p {
	margin: 0;
}

/*
 * El guion muestra y esconde con el atributo hidden. El display:none que trae
 * el navegador para hidden pierde contra cualquier regla de clase —por ejemplo
 * .ntc-producto { display: flex }—, así que aquí se refuerza con una
 * especificidad que sí gana, y sin recurrir a !important.
 */
.ntc [hidden],
.ntc[hidden] {
	display: none;
}

.ntc-inner {
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 40px);
	width: 100%;
}

.ntc-bloque {
	padding-block: clamp(48px, 9vw, 112px);
}

.ntc-eyebrow {
	font: 500 12px/1 var(--ntc-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ntc-hexa-osc);
}

.ntc-h2 {
	font: 800 clamp(30px, 4.6vw, 56px)/.95 var(--ntc-display);
	text-transform: uppercase;
	letter-spacing: .005em;
	margin-top: 14px;
}

.ntc-lead {
	font-size: 18px;
	color: var(--ntc-acero);
	max-width: 60ch;
}

.ntc-cabecera {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px 48px;
	align-items: end;
	margin-bottom: 48px;
}

.ntc-aviso {
	font: 400 14px var(--ntc-mono);
	color: var(--ntc-acero);
	padding: 10px 0;
}

/* ================================================================ Botones */
.ntc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font: 600 15px/1 var(--ntc-texto);
	padding: 15px 22px;
	border-radius: 2px;
	text-decoration: none;
	border: 1.5px solid transparent;
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
	max-width: 100%;
	text-align: center;
}

.ntc-btn--solido {
	background: var(--ntc-hexa);
	color: var(--ntc-tinta);
}

.ntc-btn--solido:hover {
	background: #FF8A14;
}

.ntc-btn--linea {
	border-color: currentColor;
	background: transparent;
	color: inherit;
}

.ntc-btn--wsp {
	background: var(--ntc-verde);
	color: #fff;
}

.ntc-btn--wsp:hover {
	background: #0E7A3F;
}

/* Blindaje contra los estilos de enlace del tema.
   Muchos temas definen `a:hover { color: … }` — especificidad (0,1,1) — que
   le gana a una clase suelta (0,1,0) y repinta el texto de los botones. Aquí
   fijamos el color en todos los estados con dos clases (0,2,1), sin !important. */
.ntc a.ntc-btn,
.ntc a.ntc-btn:link,
.ntc a.ntc-btn:visited,
.ntc a.ntc-btn:hover,
.ntc a.ntc-btn:focus,
.ntc a.ntc-btn:active,
.ntc a.ntc-cotizar,
.ntc a.ntc-cotizar:link,
.ntc a.ntc-cotizar:visited,
.ntc a.ntc-cotizar:hover,
.ntc a.ntc-cotizar:focus,
.ntc a.ntc-cotizar:active,
.ntc a.ntc-plano,
.ntc a.ntc-plano:hover,
.ntc a.ntc-plano:focus {
	text-decoration: none;
}

/* Botón verde: texto siempre claro, en reposo y al pasar el cursor. */
.ntc a.ntc-btn--wsp,
.ntc a.ntc-btn--wsp:link,
.ntc a.ntc-btn--wsp:visited,
.ntc a.ntc-btn--wsp:hover,
.ntc a.ntc-btn--wsp:focus,
.ntc a.ntc-btn--wsp:active,
.ntc a.ntc-cotizar,
.ntc a.ntc-cotizar:link,
.ntc a.ntc-cotizar:visited,
.ntc a.ntc-cotizar:hover,
.ntc a.ntc-cotizar:focus,
.ntc a.ntc-cotizar:active {
	color: #fff;
}

/* Botón naranjo y botón de contorno. */
.ntc a.ntc-btn--solido,
.ntc a.ntc-btn--solido:link,
.ntc a.ntc-btn--solido:visited,
.ntc a.ntc-btn--solido:hover,
.ntc a.ntc-btn--solido:focus,
.ntc a.ntc-btn--solido:active {
	color: var(--ntc-tinta);
}

.ntc a.ntc-btn--linea,
.ntc a.ntc-btn--linea:link,
.ntc a.ntc-btn--linea:visited,
.ntc a.ntc-btn--linea:hover,
.ntc a.ntc-btn--linea:focus,
.ntc a.ntc-btn--linea:active {
	color: inherit;
}

/* Enlace al plano: azul tinta, nunca el color de enlace del tema. */
.ntc a.ntc-plano,
.ntc a.ntc-plano:link,
.ntc a.ntc-plano:visited,
.ntc a.ntc-plano:hover,
.ntc a.ntc-plano:focus,
.ntc a.ntc-plano:active {
	color: var(--ntc-tinta);
}

/* Resto de enlaces dentro de los widgets: heredan el color de su contenedor
   en vez del color de hover del tema. */
.ntc .ntc-inner a:hover,
.ntc .ntc-inner a:focus,
.ntc .ntc-inner a:active {
	color: inherit;
}

/* Botones <button>. Hello Elementor pinta en su reset:
   `button:hover { background-color: #c36; color: #fff }` — especificidad
   (0,1,1), que le gana a una clase suelta. De ahí el fondo rosado en las
   pestañas de productos. Fijamos cada estado con dos clases (0,2,1). */
.ntc .ntc-cat,
.ntc .ntc-cat:hover,
.ntc .ntc-cat:focus {
	background: var(--ntc-caliche);
	color: var(--ntc-tinta);
	border: 0;
}

.ntc .ntc-cat:hover,
.ntc .ntc-cat:focus {
	background: #E4E7EE;
}

.ntc .ntc-cat[aria-pressed="true"],
.ntc .ntc-cat[aria-pressed="true"]:hover,
.ntc .ntc-cat[aria-pressed="true"]:focus {
	background: var(--ntc-tinta);
	color: #fff;
}

.ntc .ntc-chip,
.ntc .ntc-chip:hover,
.ntc .ntc-chip:focus {
	background: transparent;
	color: var(--ntc-acero);
	border: 0;
}

.ntc .ntc-chip:hover,
.ntc .ntc-chip:focus,
.ntc .ntc-chip[aria-pressed="true"],
.ntc .ntc-chip[aria-pressed="true"]:hover,
.ntc .ntc-chip[aria-pressed="true"]:focus {
	background: var(--ntc-arena);
	color: var(--ntc-hexa-osc);
}

.ntc .ntc-talla,
.ntc .ntc-talla:hover,
.ntc .ntc-talla:focus {
	background: var(--ntc-caliche);
	color: var(--ntc-tinta);
	border: 0;
}

.ntc .ntc-talla:hover,
.ntc .ntc-talla:focus {
	background: #E4E7EE;
}

.ntc .ntc-talla[aria-pressed="true"],
.ntc .ntc-talla[aria-pressed="true"]:hover,
.ntc .ntc-talla[aria-pressed="true"]:focus {
	background: var(--ntc-hexa);
	color: var(--ntc-tinta);
}

.ntc button.ntc-btn--solido,
.ntc button.ntc-btn--solido:hover,
.ntc button.ntc-btn--solido:focus {
	color: var(--ntc-tinta);
	background: var(--ntc-hexa);
}

.ntc button.ntc-btn--solido:hover,
.ntc button.ntc-btn--solido:focus {
	background: #FF8A14;
}

.ntc button.ntc-btn--linea,
.ntc button.ntc-btn--linea:hover,
.ntc button.ntc-btn--linea:focus {
	background: transparent;
	color: inherit;
	border-color: currentColor;
}

.ntc-btn svg,
.ntc-btn i {
	width: 17px;
	height: 17px;
	font-size: 17px;
	flex: none;
}

/* ================================================== Cabecera y barra top */
/* Ojo: .ntc-sitio es el contenedor del widget de cabecera y .ntc-cabecera es
   el encabezado (antetítulo + título) de las secciones. Nombres distintos a
   propósito, para que no se pisen en la cascada. */
.ntc-sitio {
	position: relative;
}

.ntc-topbar {
	background: var(--ntc-tinta);
	color: #B9BFD3;
	font-size: 13px;
}

.ntc-topbar__inner {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 6px 24px;
	padding-block: 9px;
}

.ntc-topbar__grupo {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 22px;
}

.ntc-topbar a {
	text-decoration: none;
}

/* Dos clases para ganarle al blindaje general de arriba. */
.ntc .ntc-topbar a:hover,
.ntc .ntc-topbar a:focus {
	color: #fff;
}

.ntc-header {
	background: #fff;
	box-shadow: 0 1px 0 rgba(14, 19, 48, .07);
}

.ntc-sitio--fija .ntc-header {
	position: sticky;
	top: 0;
	z-index: 50;
}

/*
 * Tres columnas: logotipo, menú y acciones. El menú lleva "auto" para que la
 * rejilla le dé el ancho que necesita y quepa siempre en una sola fila; lo que
 * cede es la caja de búsqueda, que puede encogerse.
 */
.ntc-header__inner {
	display: grid;
	grid-template-columns: auto auto minmax(0, 1fr);
	align-items: center;
	gap: 20px;
	padding-block: 16px;
}

.ntc-logo {
	display: inline-flex;
	align-items: center;
	flex: none;
}

.ntc-logo img {
	height: 76px;
	width: auto;
	max-width: 240px;
	object-fit: contain;
}

.ntc-nav {
	min-width: 0;
}

.ntc-menu {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	gap: 8px 20px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ntc-menu li {
	position: relative;
}

/* Que ningún título se parta en dos líneas, por ejemplo "Ingeniería de réplica". */
.ntc-menu > li {
	white-space: nowrap;
}

.ntc-menu a {
	display: inline-block;
	text-decoration: none;
	font: 500 15px/1.4 var(--ntc-texto);
	padding-block: 6px;
	border-bottom: 2px solid transparent;
	color: var(--ntc-tinta);
}

.ntc-menu a:hover,
.ntc-menu .current-menu-item > a {
	border-bottom-color: var(--ntc-hexa);
}

/* Submenús: se despliegan al pasar el cursor en escritorio. */
.ntc-menu .sub-menu {
	list-style: none;
	margin: 0;
	padding: 8px 0;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: #fff;
	box-shadow: var(--ntc-sombra);
	display: none;
	z-index: 60;
}

.ntc-menu li:hover > .sub-menu,
.ntc-menu li:focus-within > .sub-menu {
	display: block;
}

.ntc-menu .sub-menu a {
	display: block;
	padding: 8px 16px;
	border: 0;
}

.ntc-header__acciones {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	min-width: 0;
}

/* Cede ancho cuando el menú es largo, pero nunca baja de un tamaño usable. */
.ntc-buscar {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--ntc-caliche);
	padding: 11px 13px;
	border-radius: 2px;
	flex: 0 1 230px;
	min-width: 120px;
	max-width: 100%;
	position: relative;
}

.ntc-buscar input {
	border: 0;
	background: transparent;
	font: 400 14px var(--ntc-texto);
	color: var(--ntc-tinta);
	width: 100%;
	min-width: 0;
	outline: 0;
}

.ntc-buscar svg {
	width: 18px;
	height: 18px;
	flex: none;
}

/* Sugerencias del buscador: se despliegan bajo el campo. */
.ntc-sugerencias {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	right: 0;
	min-width: 320px;
	max-height: 70vh;
	overflow-y: auto;
	background: #fff;
	box-shadow: var(--ntc-sombra);
	border-radius: 2px;
	z-index: 70;
	padding: 6px;
}

.ntc-sugerencias[hidden] {
	display: none;
}

.ntc-sugerencia {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px;
	border-radius: 2px;
	text-decoration: none;
}

.ntc .ntc-sugerencia,
.ntc .ntc-sugerencia:hover,
.ntc .ntc-sugerencia:focus {
	color: var(--ntc-tinta);
}

.ntc-sugerencia:hover,
.ntc-sugerencia:focus {
	background: var(--ntc-caliche);
	outline: 0;
}

.ntc-sugerencia img {
	width: 44px;
	height: 44px;
	object-fit: contain;
	background: #fff;
	flex: none;
}

.ntc-sugerencia span {
	display: grid;
	gap: 2px;
	min-width: 0;
}

.ntc-sugerencia strong {
	font: 500 14px/1.3 var(--ntc-texto);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ntc-sugerencia small {
	font: 400 12px/1.3 var(--ntc-mono);
	color: var(--ntc-acero);
}

.ntc-sugerencias__aviso {
	margin: 0;
	padding: 12px 8px;
	font: 400 13px/1.4 var(--ntc-texto);
	color: var(--ntc-acero);
}

.ntc-sugerencias__todos {
	display: block;
	margin-top: 4px;
	padding: 10px 8px;
	border-top: 1px solid var(--ntc-linea);
	font: 600 13px/1.3 var(--ntc-texto);
	text-decoration: none;
}

.ntc .ntc-sugerencias__todos,
.ntc .ntc-sugerencias__todos:hover,
.ntc .ntc-sugerencias__todos:focus {
	color: var(--ntc-hexa-osc);
}

/* En móvil el campo ocupa todo el ancho: el desplegable lo acompaña. */
@media (max-width: 560px) {
	.ntc-sugerencias {
		min-width: 0;
	}
}

.ntc-burger {
	display: none;
	align-items: center;
	gap: 10px;
	background: var(--ntc-caliche);
	border: 0;
	border-radius: 2px;
	padding: 12px 14px;
	font: 600 14px var(--ntc-texto);
	color: var(--ntc-tinta);
	cursor: pointer;
}

.ntc-burger__lineas,
.ntc-burger__lineas::before,
.ntc-burger__lineas::after {
	display: block;
	width: 18px;
	height: 2px;
	background: currentColor;
	position: relative;
}

.ntc-burger__lineas::before,
.ntc-burger__lineas::after {
	content: "";
	position: absolute;
	left: 0;
}

.ntc-burger__lineas::before {
	top: -6px;
}

.ntc-burger__lineas::after {
	top: 6px;
}

/* ================================================================ Portada */
.ntc-hero {
	background: var(--ntc-tinta);
	color: #fff;
	overflow: hidden;
}

.ntc-hero__inner {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: 40px;
	align-items: center;
	padding-block: clamp(40px, 7vw, 72px) clamp(36px, 6vw, 64px);
}

.ntc-hero__titulo {
	font: 800 clamp(38px, 6.6vw, 92px)/.9 var(--ntc-display);
	text-transform: uppercase;
	color: #fff;
	margin-block: 20px 24px;
}

.ntc-hero__titulo em {
	font-style: normal;
	color: var(--ntc-hexa);
}

.ntc-hero__bajada {
	color: #C4C9DA;
}

.ntc-hero__cta {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 32px;
}

.ntc-mosaico {
	position: relative;
	width: 100%;
	max-width: 560px;
	aspect-ratio: 1 / 1;
	margin-inline: auto;
}

.ntc-hex {
	position: absolute;
	clip-path: var(--ntc-hex);
	aspect-ratio: 1.155 / 1;
	overflow: hidden;
	background: var(--ntc-hexa);
	animation: ntc-aparece .8s cubic-bezier(.2, .7, .2, 1) both;
}

.ntc-hex img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(.85) contrast(1.05);
}

.ntc-hex--vacio::after {
	content: "";
	position: absolute;
	inset: 3px;
	clip-path: var(--ntc-hex);
	background: var(--ntc-tinta);
}

.ntc-hex:nth-of-type(2) { animation-delay: .06s; }
.ntc-hex:nth-of-type(3) { animation-delay: .12s; }
.ntc-hex:nth-of-type(4) { animation-delay: .18s; }
.ntc-hex:nth-of-type(5) { animation-delay: .24s; }
.ntc-hex:nth-of-type(6) { animation-delay: .3s; }

@keyframes ntc-aparece {
	from { transform: scale(.92); }
	to   { transform: none; }
}

.ntc-mosaico__rotulo {
	position: absolute;
	font: 500 11px/1.35 var(--ntc-mono);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #C4C9DA;
	max-width: 34%;
	margin: 0;
}

.ntc-mosaico__rotulo b {
	display: block;
	color: #fff;
	font-weight: 500;
}

.ntc-variables__inner {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 0;
	padding-bottom: 26px;
	font: 500 13px/1 var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #98A0B8;
}

.ntc-variables__inner span {
	display: flex;
	align-items: center;
}

.ntc-variables__inner span + span::before {
	content: "";
	width: 6px;
	height: 6px;
	background: var(--ntc-hexa);
	clip-path: var(--ntc-hex);
	margin-inline: 18px;
}

.ntc-variables__titulo {
	color: #fff;
	margin-right: 18px;
}

.ntc-variables__titulo::after {
	content: "→";
	margin-left: 12px;
	color: var(--ntc-hexa);
}

/* ============================================================= Industrias */
.ntc-industrias {
	background: #fff;
}

.ntc-industrias__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px 4px;
	padding-block: 28px;
}

.ntc-industrias__item {
	padding-right: 18px;
	text-decoration: none;
	display: block;
}

.ntc-industrias strong {
	display: block;
	font: 600 26px/1 var(--ntc-display);
	text-transform: uppercase;
	letter-spacing: .02em;
}

.ntc-industrias small {
	color: var(--ntc-acero);
	font-size: 14px;
}

/* ============================================================= Soluciones */
.ntc-soluciones {
	background: var(--ntc-caliche);
}

.ntc-lineas {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	grid-auto-rows: 240px;
	gap: 14px;
}

.ntc-linea {
	position: relative;
	overflow: hidden;
	background: var(--ntc-tinta);
	color: #fff;
	text-decoration: none;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 22px;
	border-radius: 2px;
}

.ntc-linea__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: var(--ntc-foto, .74);
	transition: transform .5s, opacity .3s;
}

/* El velo arranca más abajo y es menos denso que antes: la fotografía se ve
   y el texto blanco igual contrasta. Ambos valores son editables desde el
   widget (opacidad de la foto e intensidad del velo). */
.ntc-linea::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(14, 19, 48, 0) 38%, var(--ntc-velo, rgba(14, 19, 48, .8)));
}

.ntc-linea__texto {
	position: relative;
	z-index: 1;
}

.ntc-linea:hover .ntc-linea__img {
	transform: scale(1.04);
	opacity: calc(var(--ntc-foto, .74) + .1);
}

/* Colores fijados con dos clases: ni el tema ni la herencia los cambian. */
.ntc .ntc-linea,
.ntc a.ntc-linea {
	color: #fff;
}

.ntc .ntc-linea h3 {
	font: 800 clamp(22px, 2.4vw, 30px)/.95 var(--ntc-display);
	text-transform: uppercase;
	color: #fff;
	text-shadow: 0 1px 12px rgba(14, 19, 48, .45);
}

.ntc .ntc-linea p {
	font-size: 14px;
	color: #DDE1EA;
	margin-top: 8px;
	max-width: 38ch;
}

.ntc-linea__ir {
	display: inline-block;
	margin-top: 14px;
	font: 500 12px var(--ntc-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ntc-hexa);
}

.ntc-linea--span-2 { grid-column: span 2; }
.ntc-linea--span-3 { grid-column: span 3; }
.ntc-linea--span-4 { grid-column: span 4; }
.ntc-linea--span-6 { grid-column: span 6; }
.ntc-linea--alta   { grid-row: span 2; }

.ntc .ntc-linea--clara,
.ntc a.ntc-linea--clara {
	background: #fff;
	color: var(--ntc-tinta);
	box-shadow: var(--ntc-sombra);
}

.ntc-linea--clara::after {
	display: none;
}

.ntc .ntc-linea--clara h3 {
	color: var(--ntc-tinta);
	text-shadow: none;
}

.ntc .ntc-linea--clara p {
	color: var(--ntc-acero);
}

.ntc-linea--clara .ntc-linea__img {
	inset: auto;
	right: 10px;
	top: 10px;
	width: 42%;
	height: calc(100% - 20px);
	object-fit: contain;
	opacity: 1;
	mix-blend-mode: multiply;
}

.ntc-linea--clara .ntc-linea__texto {
	max-width: 56%;
}

/* ============================================================== Productos */
.ntc-productos {
	background: #fff;
}

.ntc-categorias {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 18px;
}

.ntc-cat {
	font: 600 15px/1 var(--ntc-texto);
	padding: 13px 18px;
	background: var(--ntc-caliche);
	color: var(--ntc-tinta);
	border: 0;
	border-radius: 2px;
	cursor: pointer;
	max-width: 100%;
}

.ntc-cat[aria-pressed="true"] {
	background: var(--ntc-tinta);
	color: #fff;
}

.ntc-cat small {
	font: 400 12px var(--ntc-mono);
	opacity: .7;
	margin-left: 7px;
}

.ntc-filtros {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 26px;
}

.ntc-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.ntc-chip {
	font: 500 14px/1 var(--ntc-texto);
	padding: 10px 14px;
	background: transparent;
	color: var(--ntc-acero);
	border: 0;
	border-radius: 2px;
	cursor: pointer;
}

.ntc-chip[aria-pressed="true"] {
	background: var(--ntc-arena);
	color: var(--ntc-hexa-osc);
}

.ntc-select {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	color: var(--ntc-acero);
	flex-wrap: wrap;
}

.ntc-select select {
	font: 500 14px var(--ntc-texto);
	padding: 10px;
	border: 1px solid var(--ntc-linea);
	background: #fff;
	color: var(--ntc-tinta);
	border-radius: 2px;
	max-width: 100%;
}

.ntc-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.ntc-producto {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 2px;
	box-shadow: var(--ntc-sombra);
	overflow: hidden;
	transition: transform .2s;
	min-width: 0;
}

.ntc-producto:hover {
	transform: translateY(-3px);
}

.ntc-producto__foto {
	background: var(--ntc-caliche);
	aspect-ratio: 4 / 3;
	position: relative;
	padding: 16px;
	overflow: hidden;
}

.ntc-producto__foto img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
}

/*
 * Producto sin fotografía. Las familias «a pedido» —materiales especiales,
 * conexión flange— no son un modelo concreto y no tienen foto, así que el
 * recuadro vacío sería la regla y no la excepción. Se dibuja una marca sobria
 * con el aviso, dentro del mismo cuadro que ocuparía la imagen.
 */
.ntc-producto__sinfoto {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 16px;
	box-sizing: border-box;
	text-align: center;
}

.ntc-producto__sinfoto-hexa {
	flex: none;
	width: 42px;
	height: 48px;
	background: #fff;
	clip-path: var(--ntc-hex);
}

.ntc-producto__sinfoto-nota {
	max-width: 100%;
	font: 500 11px/1.4 var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ntc-acero);
}

@media (max-width: 767px) {

	.ntc-producto__sinfoto {
		gap: 10px;
	}

	.ntc-producto__sinfoto-hexa {
		width: 34px;
		height: 39px;
	}

	.ntc-producto__sinfoto-nota {
		font-size: 10px;
	}
}

.ntc-producto__tipo {
	position: absolute;
	top: 12px;
	left: 12px;
	font: 500 11px/1 var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	background: #fff;
	padding: 6px 8px;
	color: var(--ntc-acero);
}

.ntc-producto__cuerpo {
	padding: 16px 16px 18px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}

.ntc-producto__sku {
	font: 400 12px var(--ntc-mono);
	color: var(--ntc-acero);
	word-break: break-word;
}

.ntc-producto h3 {
	font: 600 17px/1.25 var(--ntc-texto);
}

.ntc-spec {
	font: 400 12.5px/1.55 var(--ntc-mono);
	color: var(--ntc-acero);
}

.ntc-tallas {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}

.ntc-talla {
	font: 500 13px/1 var(--ntc-mono);
	padding: 9px 11px;
	background: var(--ntc-caliche);
	color: var(--ntc-tinta);
	border: 0;
	cursor: pointer;
	border-radius: 2px;
}

.ntc-talla[aria-pressed="true"] {
	background: var(--ntc-hexa);
	color: var(--ntc-tinta);
}

.ntc-stock {
	font: 500 11px var(--ntc-mono);
	text-transform: uppercase;
	letter-spacing: .06em;
	display: flex;
	align-items: center;
	gap: 7px;
	color: var(--ntc-acero);
}

.ntc-stock::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--ntc-verde);
	flex: none;
}

.ntc-stock--pedido::before {
	background: #D69E2E;
}

.ntc-producto__acciones {
	margin-top: auto;
	display: grid;
	gap: 8px;
	padding-top: 12px;
}

.ntc-cotizar {
	background: var(--ntc-verde);
	color: #fff;
	border: 0;
	padding: 13px 14px;
	font: 600 14px var(--ntc-texto);
	border-radius: 2px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	text-decoration: none;
	text-align: center;
}

.ntc-cotizar:hover {
	background: #0E7A3F;
}

.ntc-cotizar svg,
.ntc-cotizar i {
	width: 17px;
	height: 17px;
	font-size: 16px;
	flex: none;
}

.ntc-plano {
	font: 500 13px var(--ntc-texto);
	color: var(--ntc-tinta);
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
	padding: 11px;
	background: var(--ntc-caliche);
	border-radius: 2px;
	text-align: center;
}

.ntc-plano:hover {
	background: #E7E9EE;
}

.ntc-plano--pendiente {
	color: var(--ntc-acero);
	background: transparent;
	cursor: default;
}

.ntc-plano svg,
.ntc-plano i {
	width: 15px;
	height: 15px;
	font-size: 14px;
	flex: none;
}

.ntc-vacio {
	grid-column: 1 / -1;
	background: var(--ntc-caliche);
	padding: clamp(24px, 5vw, 56px);
	text-align: center;
	border-radius: 2px;
}

.ntc-vacio h3 {
	font: 800 clamp(24px, 3vw, 32px)/1 var(--ntc-display);
	text-transform: uppercase;
	margin-bottom: 10px;
}

.ntc-vacio p {
	color: var(--ntc-acero);
	max-width: 52ch;
	margin-inline: auto;
}

.ntc-vacio .ntc-btn {
	margin-top: 22px;
}

.ntc-pie-grid {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 26px;
}

.ntc-nota {
	font: 400 13px var(--ntc-mono);
	color: var(--ntc-acero);
}

.ntc-pie-grid .ntc-btn--linea {
	color: var(--ntc-tinta);
}

.ntc-especial {
	margin-top: 40px;
	background: var(--ntc-tinta);
	color: #fff;
	border-radius: 2px;
	padding: clamp(20px, 4vw, 40px);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px 40px;
	align-items: center;
}

.ntc-especial h3 {
	font: 800 clamp(24px, 3.4vw, 40px)/.98 var(--ntc-display);
	text-transform: uppercase;
	margin-block: 10px;
}

.ntc-especial p {
	color: #C4C9DA;
}

.ntc-especial__form {
	display: grid;
	gap: 12px;
}

/* Especificidad mayor que .ntc-campo (bloque sobre fondo oscuro). */
.ntc-especial .ntc-campo label {
	font: 500 11px var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #98A0B8;
	display: block;
	margin-bottom: 6px;
}

.ntc-especial .ntc-campo select,
.ntc-especial .ntc-campo input {
	font: 400 15px var(--ntc-texto);
	color: #fff;
	background: var(--ntc-tinta-2);
	border: 1px solid #333B63;
	padding: 12px;
	border-radius: 2px;
	width: 100%;
	max-width: 100%;
}

/* ================================================================ Método */
.ntc-metodo {
	background: var(--ntc-tinta);
	color: #fff;
}

.ntc-metodo .ntc-lead {
	color: #C4C9DA;
}

.ntc-metodo .ntc-eyebrow {
	color: var(--ntc-hexa);
}

.ntc-pasos {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: none;
}

.ntc-paso__n {
	font: 800 64px/1 var(--ntc-display);
	color: var(--ntc-hexa);
	display: block;
}

.ntc-paso h3 {
	font: 600 20px/1.2 var(--ntc-texto);
	margin-block: 12px 8px;
}

.ntc-paso p {
	color: #B9BFD3;
	font-size: 15px;
}

/* ======================================================= Réplica y TCO */
.ntc-replica-sec {
	background: var(--ntc-caliche);
}

.ntc-replica {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: clamp(28px, 5vw, 64px);
	align-items: center;
}

.ntc-replica__figura {
	margin: 0;
	position: relative;
}

.ntc-replica__img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 2px;
}

.ntc-replica__figura figcaption {
	font: 400 12px var(--ntc-mono);
	color: var(--ntc-acero);
	margin-top: 10px;
}

.ntc-sello {
	position: absolute;
	right: -18px;
	bottom: 36px;
	width: 150px;
	aspect-ratio: 1.155 / 1;
	clip-path: var(--ntc-hex);
	background: var(--ntc-hexa);
	display: grid;
	place-items: center;
	text-align: center;
	font: 800 18px/1 var(--ntc-display);
	text-transform: uppercase;
	color: var(--ntc-tinta);
	padding: 0 20px;
	hyphens: auto;
}

.ntc-tco {
	margin-top: 28px;
	background: #fff;
	border-radius: 2px;
	box-shadow: var(--ntc-sombra);
	overflow: hidden;
}

.ntc-tco__fila {
	display: grid;
	grid-template-columns: 150px 1fr;
	gap: 14px;
	align-items: center;
	padding: 14px 16px;
	font-size: 14px;
}

.ntc-tco__barra {
	display: flex;
	height: 14px;
	border-radius: 2px;
	overflow: hidden;
	min-width: 0;
}

.ntc-tco__barra i {
	display: block;
	height: 100%;
}

.ntc-tco__leyenda {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	padding: 12px 16px;
	background: var(--ntc-caliche);
	font: 400 12px var(--ntc-mono);
	color: var(--ntc-acero);
}

.ntc-tco__leyenda span {
	display: flex;
	align-items: center;
	gap: 6px;
}

.ntc-tco__leyenda i {
	width: 10px;
	height: 10px;
	display: block;
	flex: none;
}

.ntc-lista {
	list-style: none;
	padding: 0;
	margin: 24px 0 0;
	display: grid;
	gap: 10px;
}

.ntc-lista li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
}

.ntc-lista li::before {
	content: "";
	flex: none;
	width: 12px;
	height: 11px;
	margin-top: 7px;
	background: var(--ntc-hexa);
	clip-path: var(--ntc-hex);
}

/* ============================================================ Resultados */
.ntc-compromiso {
	background: #fff;
}

.ntc-resultados {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px 32px;
}

.ntc-resultado h3 {
	font: 800 clamp(22px, 2.6vw, 28px)/1 var(--ntc-display);
	text-transform: uppercase;
}

.ntc-resultado h3::before {
	content: "";
	display: block;
	width: 26px;
	height: 4px;
	background: var(--ntc-hexa);
	margin-bottom: 12px;
}

.ntc-resultado__icono {
	display: block;
	font-size: 22px;
	color: var(--ntc-hexa);
	margin-bottom: 10px;
}

.ntc-resultado p {
	color: var(--ntc-acero);
	font-size: 15px;
	margin-top: 10px;
	max-width: 34ch;
}

/* ============================================================== Noticias */
.ntc-noticias-sec {
	background: var(--ntc-caliche);
}

.ntc-noticias {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.ntc-noticia {
	margin: 0;
	background: #fff;
	border-radius: 2px;
	box-shadow: var(--ntc-sombra);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.ntc-noticia img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.ntc-noticia figcaption,
.ntc-noticia__txt {
	padding: 16px;
}

.ntc-noticia__fecha {
	font: 500 11px var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ntc-hexa-osc);
	display: block;
}

.ntc-noticia b {
	display: block;
	font-weight: 600;
	margin-top: 8px;
}

.ntc-noticia b a {
	text-decoration: none;
}

.ntc-noticia figcaption > span:last-child {
	font-size: 14px;
	color: var(--ntc-acero);
}

.ntc-noticia--destacada {
	grid-column: span 2;
	background: var(--ntc-tinta);
	color: #fff;
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	align-items: center;
}

.ntc-noticia--destacada img {
	height: 100%;
	aspect-ratio: auto;
	min-height: 260px;
}

.ntc-noticia--destacada .ntc-noticia__txt {
	padding: clamp(20px, 3vw, 34px);
}

.ntc-noticia--destacada h3 {
	font: 800 clamp(24px, 3.2vw, 40px)/.98 var(--ntc-display);
	text-transform: uppercase;
	margin-block: 10px 12px;
}

.ntc-noticia--destacada p {
	color: #C4C9DA;
	font-size: 15px;
	margin-bottom: 12px;
}

.ntc-noticia--destacada .ntc-noticia__fecha {
	color: var(--ntc-hexa);
}

.ntc-noticia__ir {
	font: 500 12px var(--ntc-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ntc-hexa);
	text-decoration: none;
	display: inline-block;
	margin-bottom: 10px;
}

.ntc-noticia__nota {
	display: block;
	font: 500 11px var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #98A0B8;
}

/* ============================================================== Contacto */
.ntc-contacto {
	background: var(--ntc-arena);
	color: var(--ntc-tinta);
}

.ntc-contacto__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(28px, 5vw, 72px);
	padding-block: clamp(48px, 8vw, 96px);
}

.ntc-contacto .ntc-lead {
	color: var(--ntc-acero);
}

.ntc-vias {
	display: grid;
	gap: 12px;
	margin-top: 28px;
}

.ntc-via {
	display: flex;
	align-items: center;
	gap: 14px;
	background: #fff;
	padding: 16px 18px;
	border-radius: 2px;
	text-decoration: none;
	box-shadow: var(--ntc-sombra);
	min-width: 0;
}

.ntc-via__icono {
	display: grid;
	place-items: center;
	width: 24px;
	flex: none;
	color: var(--ntc-hexa-osc);
	font-size: 20px;
}

.ntc-via__icono svg {
	width: 22px;
	height: 22px;
}

.ntc-via--wsp .ntc-via__icono {
	color: var(--ntc-verde);
}

.ntc-via__texto {
	min-width: 0;
}

.ntc-via b {
	display: block;
	font-weight: 600;
}

.ntc-via em {
	font: 400 13px var(--ntc-mono);
	font-style: normal;
	color: var(--ntc-acero);
	word-break: break-word;
}

.ntc-form {
	background: #fff;
	padding: clamp(20px, 3vw, 36px);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	border-radius: 2px;
	box-shadow: var(--ntc-sombra);
	align-content: start;
}

.ntc-form h3 {
	grid-column: 1 / -1;
	font: 800 30px/1 var(--ntc-display);
	text-transform: uppercase;
}

.ntc-form__ayuda {
	grid-column: 1 / -1;
	font-size: 14px;
	color: var(--ntc-acero);
	margin-top: -6px;
}

.ntc-campo {
	display: grid;
	gap: 6px;
	min-width: 0;
}

.ntc-campo--full {
	grid-column: 1 / -1;
}

.ntc-campo label {
	font: 500 11px var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ntc-acero);
}

.ntc-campo label em {
	font-style: normal;
	text-transform: none;
	letter-spacing: 0;
	color: #94A0B5;
}

.ntc-campo input,
.ntc-campo select,
.ntc-campo textarea {
	font: 400 15px var(--ntc-texto);
	color: var(--ntc-tinta);
	background: var(--ntc-caliche);
	border: 1px solid var(--ntc-linea);
	padding: 12px;
	border-radius: 2px;
	width: 100%;
	max-width: 100%;
}

.ntc-campo textarea {
	min-height: 92px;
	resize: vertical;
}

.ntc-adjunto {
	grid-column: 1 / -1;
	border: 1.5px dashed #D9CFC2;
	background: var(--ntc-arena);
	padding: 16px;
	border-radius: 2px;
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	color: var(--ntc-acero);
	cursor: pointer;
}

.ntc-adjunto svg {
	width: 20px;
	height: 20px;
	color: var(--ntc-hexa-osc);
	flex: none;
}

.ntc-adjunto input {
	display: none;
}

.ntc-form button {
	grid-column: 1 / -1;
	margin-top: 6px;
}

.ntc-form button[disabled] {
	opacity: .6;
	cursor: progress;
}

.ntc-form__estado {
	grid-column: 1 / -1;
	font-size: 14px;
	min-height: 1px;
}

.ntc-form__estado--ok {
	color: var(--ntc-verde);
}

.ntc-form__estado--error {
	color: #B3261E;
}

.ntc-honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ================================================================ Footer */
.ntc-footer {
	background: var(--ntc-tinta);
	color: #B9BFD3;
	font-size: 14px;
}

.ntc-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr));
	gap: 32px;
	padding-block: 56px 32px;
}

.ntc-footer__logo img {
	height: 84px;
	width: auto;
	max-width: 220px;
	margin-bottom: 16px;
	object-fit: contain;
}

.ntc-footer__lema {
	max-width: 34ch;
}

.ntc-footer h4 {
	margin: 0 0 12px;
	font: 500 12px var(--ntc-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
}

.ntc-footer__menu,
.ntc-footer__legal-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 8px;
}

.ntc-footer__legal-menu {
	grid-auto-flow: column;
	gap: 16px;
}

.ntc-footer a {
	text-decoration: none;
}

.ntc .ntc-footer a:hover,
.ntc .ntc-footer a:focus {
	color: #fff;
}

.ntc-footer__legal-inner {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	padding-block: 18px;
	font: 400 12px var(--ntc-mono);
	color: #7F879E;
	border-top: 1px solid rgba(255, 255, 255, .12);
}

/* =================================================== Portada de catálogo */

.ntc-portada {
	position: relative;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
	background: var(--ntc-tinta);
	color: var(--ntc-portada-texto, #fff);
	isolation: isolate;
}

.ntc-portada__fondo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -2;
}

.ntc-portada__velo {
	position: absolute;
	inset: 0;
	background: linear-gradient(105deg, var(--ntc-tinta) 20%, rgba(14, 19, 48, .45));
	opacity: .72;
	z-index: -1;
}

/* Conserva el centrado y los márgenes de .ntc-inner; solo apila el contenido. */
.ntc-portada__contenido {
	padding-block: 40px 36px;
	display: grid;
	gap: 12px;
	justify-items: start;
}

.ntc-portada__titulo,
.ntc-portada__accesos {
	max-width: 820px;
}

/* Dentro de la portada todo el texto hereda el color elegido. */
.ntc-portada .ntc-eyebrow,
.ntc-portada .ntc-migas,
.ntc-portada .ntc-migas a,
.ntc-portada .ntc-migas__actual {
	color: inherit;
}

.ntc-portada .ntc-migas {
	opacity: .78;
}

.ntc-portada .ntc-eyebrow {
	color: var(--ntc-hexa);
}

.ntc-portada__titulo {
	margin: 0;
	font: 800 clamp(34px, 5vw, 60px)/.98 var(--ntc-display);
	letter-spacing: -.01em;
	text-transform: uppercase;
}

.ntc-portada__bajada {
	margin: 0;
	max-width: 62ch;
	font: 400 17px/1.55 var(--ntc-texto);
	opacity: .9;
}

.ntc-portada__cuenta {
	margin: 0;
	font: 500 12px/1 var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	opacity: .72;
}

.ntc-portada__accesos {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 6px;
}

.ntc-acceso {
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	padding: 9px 14px;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 2px;
	font: 500 14px/1 var(--ntc-texto);
	text-decoration: none;
	transition: background-color .15s, border-color .15s;
}

/* El tema pinta los enlaces a su manera: aquí se fija el color en todos sus estados. */
.ntc .ntc-acceso,
.ntc .ntc-acceso:link,
.ntc .ntc-acceso:visited,
.ntc .ntc-acceso:hover,
.ntc .ntc-acceso:focus,
.ntc .ntc-acceso:active {
	color: var(--ntc-portada-texto, #fff);
	text-decoration: none;
}

.ntc .ntc-acceso:hover,
.ntc .ntc-acceso:focus {
	background: rgba(255, 255, 255, .12);
	border-color: rgba(255, 255, 255, .55);
}

.ntc .ntc-acceso--activo,
.ntc .ntc-acceso--activo:hover,
.ntc .ntc-acceso--activo:focus {
	background: var(--ntc-hexa);
	border-color: var(--ntc-hexa);
	color: #fff;
}

.ntc-acceso small {
	font: 500 11px/1 var(--ntc-mono);
	opacity: .7;
}

/* Nombre del producto enlazado a su ficha, en la grilla del inicio. */
.ntc .ntc-producto h3 a {
	text-decoration: none;
}

.ntc .ntc-producto h3 a:hover,
.ntc .ntc-producto h3 a:focus {
	color: var(--ntc-hexa-osc);
}

@media (max-width: 767px) {
	.ntc-portada__contenido {
		padding-block: 28px 24px;
	}

	.ntc-portada__bajada {
		font-size: 15px;
	}
}

/* =========================================================== Responsive */

/* Menú: pasa a botón desplegable antes de que se apriete. */
@media (max-width: 1140px) {
	.ntc-header__inner {
		grid-template-columns: auto 1fr;
		row-gap: 14px;
	}

	.ntc-burger {
		display: inline-flex;
		justify-self: end;
		order: 2;
	}

	.ntc-nav {
		order: 4;
		grid-column: 1 / -1;
		display: none;
	}

	.ntc-nav.ntc-nav--abierto {
		display: block;
	}

	.ntc-menu {
		flex-direction: column;
		justify-content: flex-start;
		gap: 0;
		border-top: 1px solid var(--ntc-linea);
		padding-top: 8px;
	}

	.ntc-menu a {
		display: block;
		padding: 12px 0;
		border-bottom: 1px solid var(--ntc-linea);
	}

	.ntc-menu a:hover,
	.ntc-menu .current-menu-item > a {
		border-bottom-color: var(--ntc-linea);
		color: var(--ntc-hexa-osc);
	}

	.ntc-menu .sub-menu {
		position: static;
		display: block;
		box-shadow: none;
		padding: 0 0 0 16px;
	}

	.ntc-header__acciones {
		order: 3;
		grid-column: 1 / -1;
		justify-content: space-between;
	}

	.ntc-buscar {
		flex: 1;
	}
}

@media (max-width: 900px) {
	.ntc-cabecera {
		grid-template-columns: 1fr;
	}

	.ntc-hero__inner {
		grid-template-columns: 1fr;
	}

	.ntc-mosaico {
		max-width: 440px;
	}

	.ntc-replica {
		grid-template-columns: 1fr;
	}

	.ntc-contacto__grid {
		grid-template-columns: 1fr;
	}

	.ntc-lineas {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ntc-linea--span-3,
	.ntc-linea--span-4,
	.ntc-linea--span-6 {
		grid-column: span 2;
	}

	.ntc-linea--alta {
		grid-row: span 1;
	}

	.ntc-noticias {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ntc-noticia--destacada {
		grid-column: span 2;
		grid-template-columns: 1fr;
	}

	.ntc-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
}

/* Móvil: nada debe desbordar ni quedar apretado. */
@media (max-width: 767px) {
	.ntc {
		font-size: 15px;
	}

	.ntc-inner {
		padding-inline: 16px;
	}

	.ntc-bloque {
		padding-block: 44px;
	}

	.ntc-cabecera {
		margin-bottom: 32px;
	}

	.ntc-lead {
		font-size: 16px;
	}

	/* Los botones ocupan el ancho disponible en vez de salirse. */
	.ntc-btn {
		width: 100%;
		max-width: 100%;
		padding: 14px 18px;
	}

	.ntc-hero__cta {
		flex-direction: column;
		align-items: stretch;
		width: 100%;
	}

	.ntc-header__acciones {
		flex-wrap: wrap;
		gap: 8px;
	}

	.ntc-header__acciones .ntc-btn {
		width: auto;
		flex: 1 1 140px;
	}

	.ntc-buscar {
		width: 100%;
		flex: 1 1 100%;
	}

	.ntc-topbar__inner {
		flex-direction: column;
		gap: 4px;
	}

	.ntc-topbar__grupo {
		gap: 2px 16px;
	}

	.ntc-logo img {
		max-width: 180px;
	}

	.ntc-mosaico {
		max-width: 100%;
	}

	.ntc-mosaico__rotulo {
		font-size: 10px;
		max-width: 40%;
	}

	.ntc-variables__inner span + span::before {
		margin-inline: 10px;
	}

	.ntc-industrias__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}

	.ntc-lineas {
		grid-template-columns: 1fr;
		grid-auto-rows: 210px;
	}

	.ntc-linea--span-2,
	.ntc-linea--span-3,
	.ntc-linea--span-4,
	.ntc-linea--span-6 {
		grid-column: span 1;
	}

	.ntc-linea--clara .ntc-linea__texto {
		max-width: 100%;
	}

	.ntc-linea--clara .ntc-linea__img {
		width: 34%;
		opacity: .9;
	}

	.ntc-grid {
		grid-template-columns: 1fr;
	}

	.ntc-pasos,
	.ntc-resultados,
	.ntc-noticias {
		grid-template-columns: 1fr;
	}

	.ntc-noticia--destacada {
		grid-column: span 1;
	}

	.ntc-especial {
		grid-template-columns: 1fr;
	}

	.ntc-tco__fila {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.ntc-sello {
		right: 8px;
		bottom: 20px;
		width: 118px;
		font-size: 15px;
		padding: 0 14px;
	}

	.ntc-form {
		grid-template-columns: 1fr;
	}

	.ntc-footer__grid {
		grid-template-columns: 1fr;
		padding-block: 40px 24px;
	}

	.ntc-footer__legal-menu {
		grid-auto-flow: row;
		gap: 8px;
	}

	.ntc-pie-grid {
		flex-direction: column;
		align-items: stretch;
	}

	.ntc-filtros {
		flex-direction: column;
		align-items: stretch;
	}

	.ntc-select {
		justify-content: space-between;
	}

	.ntc-cat {
		flex: 1 1 100%;
		text-align: left;
	}
}

@media (max-width: 480px) {
	.ntc-h2 {
		font-size: clamp(26px, 8vw, 34px);
	}

	.ntc-hero__titulo {
		font-size: clamp(34px, 11vw, 48px);
	}

	.ntc-via {
		align-items: flex-start;
	}

	.ntc-via em {
		font-size: 12px;
	}
}

/* ========================================= Ficha de producto (producto único) */
.ntc-ficha {
	background: #fff;
	padding-block: clamp(24px, 4vw, 48px) clamp(40px, 6vw, 72px);
}

.ntc-migas {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font: 400 12px/1.6 var(--ntc-mono);
	color: var(--ntc-acero);
	margin-bottom: 28px;
}

.ntc-migas a {
	text-decoration: none;
}

.ntc-migas a:hover {
	color: var(--ntc-hexa-osc);
}

.ntc-migas__actual {
	color: var(--ntc-tinta);
}

.ntc-ficha__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(28px, 5vw, 64px);
	align-items: start;
}

.ntc-ficha__foto {
	position: relative;
	background: var(--ntc-caliche);
	aspect-ratio: 1 / 1;
	padding: clamp(20px, 4vw, 48px);
	border-radius: 2px;
	overflow: hidden;
}

.ntc-ficha__foto img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
}

.ntc-miniaturas {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 12px;
}

.ntc-miniatura {
	width: 76px;
	height: 76px;
	padding: 6px;
	background: var(--ntc-caliche);
	border: 2px solid transparent;
	border-radius: 2px;
	cursor: pointer;
	flex: none;
}

.ntc-miniatura img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
}

.ntc .ntc-miniatura,
.ntc .ntc-miniatura:hover,
.ntc .ntc-miniatura:focus {
	background: var(--ntc-caliche);
	color: var(--ntc-tinta);
}

.ntc .ntc-miniatura[aria-pressed="true"] {
	border-color: var(--ntc-hexa);
}

.ntc-ficha__datos {
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: flex-start;
}

.ntc-ficha__titulo {
	font: 800 clamp(30px, 4vw, 48px)/.98 var(--ntc-display);
	text-transform: uppercase;
	color: var(--ntc-tinta);
	margin: 0;
}

.ntc-ficha__sku {
	font: 400 13px var(--ntc-mono);
	color: var(--ntc-acero);
	letter-spacing: .04em;
}

.ntc-ficha__sku span {
	color: var(--ntc-tinta);
}

.ntc-ficha__resumen {
	font-size: 17px;
	color: var(--ntc-acero);
	max-width: 52ch;
}

.ntc-ficha__resumen p {
	margin: 0 0 10px;
}

.ntc-ficha__rotulo {
	display: block;
	font: 500 11px var(--ntc-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ntc-acero);
	margin-bottom: 8px;
}

.ntc-medidas {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.ntc-medida {
	font: 500 15px/1 var(--ntc-mono);
	padding: 13px 16px;
	background: #fff;
	color: var(--ntc-tinta);
	border: 1px solid var(--ntc-linea);
	border-radius: 2px;
	cursor: pointer;
}

/* Fijamos los estados: el reset del tema pinta button:hover en rosado. */
.ntc .ntc-medida,
.ntc .ntc-medida:hover,
.ntc .ntc-medida:focus {
	background: #fff;
	color: var(--ntc-tinta);
}

.ntc .ntc-medida:hover,
.ntc .ntc-medida:focus {
	border-color: var(--ntc-tinta);
}

.ntc .ntc-medida[aria-pressed="true"],
.ntc .ntc-medida[aria-pressed="true"]:hover,
.ntc .ntc-medida[aria-pressed="true"]:focus {
	background: var(--ntc-hexa);
	border-color: var(--ntc-hexa);
	color: var(--ntc-tinta);
}

.ntc-ficha__clave {
	margin: 4px 0 0;
	display: grid;
	gap: 0;
	width: 100%;
	max-width: 480px;
}

.ntc-ficha__clave > div {
	display: grid;
	grid-template-columns: 40% 1fr;
	gap: 12px;
	padding: 10px 0;
	border-top: 1px solid var(--ntc-linea);
	font-size: 14px;
}

.ntc-ficha__clave dt {
	font: 500 11px/1.7 var(--ntc-mono);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ntc-acero);
}

.ntc-ficha__clave dd {
	margin: 0;
	font-weight: 500;
}

.ntc-ficha__acciones {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	width: 100%;
	margin-top: 6px;
}

.ntc-ficha__acciones .ntc-cotizar {
	flex: 1 1 260px;
	padding: 16px 20px;
	font-size: 15px;
}

.ntc-ficha__acciones .ntc-plano {
	flex: 1 1 200px;
	padding: 16px 20px;
}

.ntc-ficha__asesoria {
	font-size: 14px;
	color: var(--ntc-acero);
	max-width: 52ch;
}

.ntc-ficha__asesoria a {
	color: var(--ntc-hexa-osc);
	font-weight: 600;
	white-space: nowrap;
}

/* ------------------------------------------------- Especificaciones */
.ntc-specs-sec {
	background: var(--ntc-caliche);
}

.ntc-specs__texto {
	font-size: 16px;
}

.ntc-specs__texto p {
	margin: 0 0 10px;
}

.ntc-specs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 clamp(24px, 4vw, 56px);
	margin: 0;
	background: #fff;
	border-radius: 2px;
	box-shadow: var(--ntc-sombra);
	padding: clamp(16px, 3vw, 28px);
}

.ntc-specs__fila {
	display: grid;
	grid-template-columns: 42% 1fr;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid var(--ntc-linea);
}

.ntc-specs dt {
	font: 500 11px/1.7 var(--ntc-mono);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ntc-acero);
}

.ntc-specs dd {
	margin: 0;
	font-size: 15px;
	font-weight: 500;
	color: var(--ntc-tinta);
	word-break: break-word;
}

.ntc-specs__nota {
	margin-top: 16px;
	max-width: 70ch;
}

/* ------------------------------------------------------ Relacionados */
.ntc-relacionados {
	background: #fff;
}

.ntc-producto--enlace {
	text-decoration: none;
}

.ntc-producto--enlace .ntc-producto__cuerpo {
	gap: 8px;
}

.ntc-producto--enlace h3 {
	font: 600 16px/1.3 var(--ntc-texto);
}

.ntc-relacionados .ntc-pie-grid {
	justify-content: flex-end;
}

@media (max-width: 900px) {
	.ntc-ficha__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767px) {
	.ntc-specs {
		grid-template-columns: 1fr;
	}

	.ntc-specs__fila,
	.ntc-ficha__clave > div {
		grid-template-columns: 1fr;
		gap: 2px;
	}

	.ntc-ficha__acciones .ntc-cotizar,
	.ntc-ficha__acciones .ntc-plano {
		flex: 1 1 100%;
	}

	.ntc-miniatura {
		width: 64px;
		height: 64px;
	}

	.ntc-ficha__foto {
		aspect-ratio: 4 / 3;
	}
}

/* ================================================= Botón flotante WhatsApp */
.ntc-flotante-caja {
	position: relative;
}

.ntc-flotante {
	--ntc-flot-lateral: 24px;
	--ntc-flot-inferior: 24px;
	--ntc-flot-icono: 28px;

	position: fixed;
	bottom: var(--ntc-flot-inferior);
	z-index: 9990;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 14px 20px;
	border-radius: 999px;
	background: var(--ntc-verde);
	color: #fff;
	font: 600 15px/1 var(--ntc-texto);
	text-decoration: none;
	max-width: calc(100vw - (var(--ntc-flot-lateral) * 2));
	transition: background .2s, transform .2s;
}

/* Mismo blindaje que los demás botones: el tema no le cambia el color. */
.ntc a.ntc-flotante,
.ntc a.ntc-flotante:link,
.ntc a.ntc-flotante:visited,
.ntc a.ntc-flotante:hover,
.ntc a.ntc-flotante:focus,
.ntc a.ntc-flotante:active {
	color: #fff;
	text-decoration: none;
}

.ntc-flotante--derecha {
	right: var(--ntc-flot-lateral);
}

.ntc-flotante--izquierda {
	left: var(--ntc-flot-lateral);
}

.ntc-flotante--sombra {
	box-shadow: 0 6px 20px rgba(14, 19, 48, .28);
}

.ntc-flotante:hover {
	background: #0E7A3F;
	transform: translateY(-2px);
}

.ntc-flotante__icono {
	display: grid;
	place-items: center;
	width: var(--ntc-flot-icono);
	height: var(--ntc-flot-icono);
	flex: none;
	font-size: var(--ntc-flot-icono);
	line-height: 1;
}

.ntc-flotante__icono svg {
	width: 100%;
	height: 100%;
	fill: currentColor;
}

.ntc-flotante__texto {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Globo de mensaje: aparece al pasar el cursor o al enfocar con el teclado. */
.ntc-flotante__globo {
	position: absolute;
	bottom: calc(100% + 10px);
	background: #fff;
	color: var(--ntc-tinta);
	font: 500 13px/1.4 var(--ntc-texto);
	padding: 10px 14px;
	border-radius: 2px;
	box-shadow: 0 6px 20px rgba(14, 19, 48, .18);
	width: max-content;
	max-width: 220px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .2s, transform .2s, visibility .2s;
}

.ntc-flotante--derecha .ntc-flotante__globo {
	right: 0;
}

.ntc-flotante--izquierda .ntc-flotante__globo {
	left: 0;
}

.ntc-flotante:hover .ntc-flotante__globo,
.ntc-flotante:focus-visible .ntc-flotante__globo {
	opacity: 1;
	visibility: visible;
	transform: none;
}

/* Latido opcional. */
.ntc-flotante--pulso::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: 0 0 0 0 rgba(18, 140, 74, .55);
	animation: ntc-latido 2.4s ease-out infinite;
	pointer-events: none;
}

@keyframes ntc-latido {
	0%   { box-shadow: 0 0 0 0 rgba(18, 140, 74, .55); }
	70%  { box-shadow: 0 0 0 18px rgba(18, 140, 74, 0); }
	100% { box-shadow: 0 0 0 0 rgba(18, 140, 74, 0); }
}

@media (max-width: 767px) {
	/* En móvil el texto estorba: queda el icono en un botón circular. */
	.ntc-flotante--icono-movil {
		padding: 0;
		width: 58px;
		height: 58px;
		justify-content: center;
		gap: 0;
	}

	.ntc-flotante--icono-movil .ntc-flotante__texto {
		display: none;
	}

	.ntc-flotante--sin-movil {
		display: none;
	}
}

@media (min-width: 768px) {
	.ntc-flotante--sin-escritorio {
		display: none;
	}
}

/* Respeta la preferencia de movimiento reducido del sistema. */
@media (prefers-reduced-motion: reduce) {
	.ntc *,
	.ntc *::before,
	.ntc *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
}