/*
 * Tienda NuboTravel. Una sola hoja, solo tema claro.
 *
 * La piel es la de Bivid (www.bivid.es, su paleta «telecom»): blanco con lavados lila, el
 * degradado morado → magenta, Montserrat muy gruesa en titulares y precios, botones en píldora y
 * su «lazo» (la forma blanda de la marca) sobre las fotos. Los valores están sacados de sus hojas
 * de estilo, no a ojo. La estructura es la de las tiendas de eSIM que mejor venden: buscador lo
 * primero, destinos con bandera, tramos bien separados y la ficha con la foto a un lado y el
 * configurador al otro.
 *
 * Formas: botones y fichas, en píldora; tarjetas, 20 px; campos, 14 px; paneles grandes, 28 px.
 * Un solo acento (el morado y su degradado): no hay verde ni azul de botón.
 *
 * Índice: 1 fichas de diseño · 2 base · 3 piezas · 4 cabecera y pie · 5 portada · 6 destinos ·
 * 7 ficha de un destino · 8 cesta y pago · 9 la eSIM · 10 cuenta · 11 entrar · 12 ayuda y legal ·
 * 12b el asistente · 13 movimiento · 14 pantallas pequeñas
 */

/* ── 1. Fichas de diseño ─────────────────────────────────────────────────── */
@font-face { font-family: Montserrat; font-weight: 400 900; font-style: normal; font-display: swap; src: url(/recursos/fuentes/montserrat-latin.woff2) format("woff2"); }

:root {
    --bv-morado: #7938AD;
    --bv-magenta: #B53486;
    --bv-morado-texto: #6B2F9A;
    --bv-degradado: linear-gradient(115deg, #7938AD 0%, #B53486 100%);
    --bv-lazo: linear-gradient(115deg, rgba(121, 56, 173, .82) 0%, rgba(121, 56, 173, .845) 42%, rgba(181, 52, 134, .92) 100%);
    --bv-velo: linear-gradient(115deg, rgba(121, 56, 173, .88) 0%, rgba(181, 52, 134, .80) 100%);
    --bv-grano: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='.55'/%3E%3C/svg%3E");
    --bv-onda: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'%3E%3Cpath d='M0 0H100V7C82 19 62 3 40 11C24 17 10 17 0 12Z'/%3E%3C/svg%3E");

    --nt-pagina: #FFFFFF;
    --nt-suave: #F8F6FB;
    --nt-lavado: #F3ECFA;
    --nt-lavado-2: #E9DEF6;
    --nt-raya: #E9E3F1;
    --nt-raya-2: #DCD3EC;
    --nt-raya-marca: #D3BCE9;
    --nt-tinta: #262626;
    --nt-tinta-2: #525251;
    --nt-tinta-3: #6E6E6D;

    --nt-bien: #0A5A2E;
    --nt-bien-fondo: #E2F5E9;
    --nt-ojo: #663D00;
    --nt-ojo-fondo: #FFF0D1;
    --nt-mal: #981D16;
    --nt-mal-fondo: #FCE8E6;

    --nt-radio: 20px;
    --nt-radio-m: 16px;
    --nt-radio-s: 14px;
    --nt-radio-panel: 28px;
    --nt-sombra: 0 1px 2px rgba(82, 82, 81, .06), 0 8px 24px rgba(82, 82, 81, .07);
    --nt-sombra-2: 0 2px 6px rgba(82, 82, 81, .08), 0 20px 48px rgba(121, 56, 173, .16);
    --nt-muelle: cubic-bezier(.22, 1, .36, 1);

    /* Nombres que usa también la administración (admin.css) */
    --nt-fondo: var(--nt-suave);
    --nt-hoja: #FFFFFF;
    --nt-hoja-2: var(--nt-lavado);
    --nt-borde: var(--nt-raya-2);
    --nt-borde-suave: var(--nt-raya);
    --nt-texto: var(--nt-tinta);
    --nt-texto-2: var(--nt-tinta-2);
    --nt-texto-3: var(--nt-tinta-3);
    --nt-noche: var(--bv-morado);
    --nt-primario: var(--bv-morado);
    --nt-primario-suave: var(--nt-lavado);
}

/* ── 2. Base ─────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 5.5rem; scrollbar-color: var(--nt-raya-marca) transparent; }
body {
    margin: 0; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column;
    background: var(--nt-pagina); color: var(--nt-tinta); caret-color: var(--bv-morado); accent-color: var(--bv-morado);
    font: 400 1rem/1.6 Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, p, ul, ol, dl, dd, figure, fieldset { margin: 0; padding: 0; }
ul, ol { list-style: none; }
h1, h2, h3 { font-weight: 800; line-height: 1.12; letter-spacing: -.02em; text-wrap: balance; }
p { text-wrap: pretty; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--bv-morado-texto); text-underline-offset: .2em; text-decoration-thickness: .08em; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
fieldset { border: 0; min-width: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--bv-morado); outline-offset: 3px; }
::selection { background: var(--bv-morado); color: #fff; }

.nt-ancho { width: min(100% - 2.5rem, 76rem); margin-inline: auto; }
.nt-contenido { flex: 1; }
.nt-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.nt-icono { width: 1.25em; height: 1.25em; flex: none; }
.nt-icono--s { width: 1em; height: 1em; }
.sin-js [data-solo-js] { display: none !important; }
html:not(.sin-js) [data-sin-js], html:not(.sin-js) [data-pestana-oculta] { display: none !important; }

.nt-saltar { position: absolute; left: 1rem; top: -4rem; z-index: 100; padding: .75rem 1.25rem; border-radius: 999px; background: var(--bv-morado); color: #fff; font-weight: 700; text-decoration: none; }
.nt-saltar:focus { top: 1rem; }

/* Banderas: redondas, con su aro blanco. Las zonas de varios países llevan un globo sobre el degradado. */
.nt-bandera { flex: none; border-radius: 50%; object-fit: cover; background: var(--nt-lavado); box-shadow: 0 0 0 3px #fff, 0 2px 8px rgba(82, 82, 81, .2); }
.nt-bandera--24 { width: 1.5rem; height: 1.5rem; box-shadow: 0 0 0 2px #fff, 0 1px 4px rgba(82, 82, 81, .2); }
.nt-bandera--28 { width: 1.75rem; height: 1.75rem; box-shadow: 0 0 0 2px #fff, 0 1px 4px rgba(82, 82, 81, .2); }
.nt-bandera--36 { width: 2.25rem; height: 2.25rem; }
.nt-bandera--40 { width: 2.5rem; height: 2.5rem; }
.nt-bandera--44 { width: 2.75rem; height: 2.75rem; }
.nt-bandera--48 { width: 3rem; height: 3rem; }
.nt-bandera--64 { width: 4rem; height: 4rem; }
.nt-bandera--zona { display: grid; place-items: center; background: var(--bv-degradado); color: #fff; }
.nt-bandera--zona .nt-icono { width: 60%; height: 60%; }

/* El lazo de la marca: una caja que se pinta con su degradado y se recorta con su forma. Lo que
   lleva escrito va en la «tripa» de la forma (a la izquierda y centrado), como en su web. */
.nt-lazo { position: relative; display: block; isolation: isolate; aspect-ratio: 2.45 / 1; color: #fff; text-decoration: none; }
.nt-lazo::before, .nt-lazo::after { content: ""; position: absolute; inset: 0; z-index: -1; -webkit-mask: url(/recursos/img/lazo.svg) center / 100% 100% no-repeat; mask: url(/recursos/img/lazo.svg) center / 100% 100% no-repeat; }
.nt-lazo::before { background: var(--bv-lazo); }
.nt-lazo::after { background: var(--bv-grano); opacity: .16; mix-blend-mode: overlay; }
.nt-lazo__texto { position: absolute; left: 9%; right: 31%; top: 27%; bottom: 27%; display: grid; align-content: center; gap: .125rem; color: #fff; }

/* ── 3. Piezas ───────────────────────────────────────────────────────────── */
.nt-boton {
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
    min-height: 3.25rem; padding: .5rem 1.75rem; border: 2px solid transparent; border-radius: 999px;
    font-weight: 700; font-size: 1rem; line-height: 1.2; text-decoration: none; text-align: center;
    transition: transform .2s var(--nt-muelle), box-shadow .2s, background-position .45s cubic-bezier(.4, 0, .2, 1), background-color .2s, border-color .2s, color .2s;
    -webkit-tap-highlight-color: transparent;
}
.nt-boton:active { transform: scale(.98); }
.nt-boton[disabled] { opacity: .5; cursor: default; }
.nt-boton--primario, .nt-boton--comprar { background: linear-gradient(115deg, #7938AD 0%, #B53486 50%, #7938AD 100%) 0% 50% / 200% 100%; color: #fff; box-shadow: 0 6px 18px rgba(121, 56, 173, .26); }
.nt-boton--primario:hover, .nt-boton--comprar:hover { background-position: 100% 50%; transform: translateY(-2px); box-shadow: 0 12px 30px rgba(121, 56, 173, .34); }
.nt-boton--marca { background: var(--bv-morado); color: #fff; box-shadow: 0 4px 12px rgba(121, 56, 173, .28); }
.nt-boton--marca:hover { background: var(--bv-morado-texto); }
.nt-boton--linea { background: #fff; border-color: var(--nt-raya-2); color: var(--nt-tinta); font-weight: 600; }
.nt-boton--linea:hover { border-color: var(--bv-morado); color: var(--bv-morado-texto); }
.nt-boton--suave { background: var(--nt-lavado); color: var(--bv-morado-texto); }
.nt-boton--suave:hover { background: var(--nt-lavado-2); }
.nt-boton--blanco { background: #fff; color: var(--bv-morado-texto); box-shadow: 0 8px 24px rgba(38, 38, 38, .18); }
.nt-boton--blanco:hover { transform: translateY(-2px); }
.nt-boton--mayus { text-transform: uppercase; letter-spacing: .03em; font-size: .9375rem; white-space: nowrap; }
.nt-boton--s { min-height: 2.5rem; padding: .25rem 1.125rem; font-size: .875rem; }
.nt-boton--ancho { width: 100%; }
.nt-enlace { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; text-decoration: none; }
.nt-enlace:hover { text-decoration: underline; }

.nt-hoja, .nt-tarjeta { background: #fff; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio); box-shadow: var(--nt-sombra); padding: clamp(1.25rem, 2.5vw, 2rem); }
.nt-bloque { margin-top: 1.25rem; }
.nt-bloque > h2 { font-size: 1.375rem; margin-bottom: 1rem; }
.nt-bloque > h3 { font-size: 1rem; letter-spacing: 0; margin: 1.5rem 0 .625rem; color: var(--nt-tinta-2); }
.nt-bloque > p { color: var(--nt-tinta-2); }

.nt-campo { display: grid; gap: .375rem; margin-bottom: 1rem; }
.nt-campo label { font-weight: 700; font-size: .875rem; }
.nt-campo small { color: var(--nt-tinta-3); font-size: .8125rem; }
.nt-campo input, .nt-campo select, .nt-campo textarea {
    width: 100%; min-height: 3.25rem; padding: .625rem 1rem; border: 1.5px solid var(--nt-raya-2); border-radius: var(--nt-radio-s);
    background: #fff; font-size: 1rem; transition: border-color .15s, box-shadow .15s;
}
.nt-campo select { appearance: none; padding-right: 2.75rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23525251'%3E%3Cpath d='M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center; background-size: 1.125rem; }
.nt-campo input:hover, .nt-campo select:hover { border-color: var(--nt-raya-marca); }
.nt-campo input:focus, .nt-campo select:focus, .nt-campo textarea:focus { outline: none; border-color: var(--bv-morado); box-shadow: 0 0 0 4px rgba(121, 56, 173, .16); }
.nt-campo input:disabled { background: var(--nt-suave); color: var(--nt-tinta-3); }
.nt-campo input::placeholder { color: var(--nt-tinta-3); }
.nt-casilla { display: grid; grid-template-columns: auto 1fr; gap: .75rem; align-items: start; margin-bottom: .875rem; font-size: .875rem; line-height: 1.5; color: var(--nt-tinta-2); cursor: pointer; }
.nt-casilla input { width: 1.375rem; height: 1.375rem; margin: 0; }

.nt-aviso { display: flex; gap: .625rem; align-items: flex-start; margin-block: 1rem; padding: .875rem 1rem; border-radius: var(--nt-radio-m); font-size: .9375rem; line-height: 1.5; background: var(--nt-lavado); color: var(--bv-morado-texto); }
.nt-aviso .nt-icono { margin-top: .125rem; }
.nt-aviso--bien { background: var(--nt-bien-fondo); color: var(--nt-bien); }
.nt-aviso--mal { background: var(--nt-mal-fondo); color: var(--nt-mal); }
.nt-aviso--ojo { background: var(--nt-ojo-fondo); color: var(--nt-ojo); }
.nt-aviso a { color: inherit; font-weight: 700; }

.nt-sello { display: inline-flex; align-items: center; padding: .25rem .75rem; border-radius: 999px; font-size: .8125rem; font-weight: 700; line-height: 1.4; white-space: nowrap; background: var(--nt-suave); color: var(--nt-tinta-2); }
.nt-sello--bien { background: var(--nt-bien-fondo); color: var(--nt-bien); }
.nt-sello--ojo { background: var(--nt-ojo-fondo); color: var(--nt-ojo); }
.nt-sello--azul { background: var(--nt-lavado); color: var(--bv-morado-texto); }

.nt-fichas { display: flex; flex-wrap: wrap; gap: .5rem; }
.nt-fichas a { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: .375rem 1.125rem; border: 1px solid var(--nt-raya); border-radius: 999px; background: #fff; color: var(--nt-tinta); font-weight: 600; font-size: .9375rem; text-decoration: none; transition: background-color .2s, color .2s, border-color .2s; }
.nt-fichas a:hover { border-color: var(--bv-morado); color: var(--bv-morado-texto); }
.nt-fichas a[aria-current] { background: var(--bv-morado); border-color: var(--bv-morado); color: #fff; }
.nt-fichas a span { color: var(--nt-tinta-3); font-size: .8125rem; font-weight: 500; }

/* El conmutador de dos opciones (qué incluye / dónde funciona, ilimitados / por gigas) */
.nt-modos { display: grid; grid-template-columns: 1fr 1fr; gap: .25rem; padding: .25rem; border-radius: 999px; background: var(--nt-lavado); }
.nt-modos button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.75rem; padding: .25rem .75rem; border: 0; border-radius: 999px; background: transparent; color: var(--nt-tinta-2); font-weight: 700; font-size: .9375rem; transition: background-color .2s, color .2s, box-shadow .2s; }
.nt-modos button:hover { color: var(--bv-morado-texto); }
.nt-modos button[aria-selected="true"] { background: #fff; color: var(--bv-morado-texto); box-shadow: 0 1px 3px rgba(82, 82, 81, .16); }

.nt-solo { padding-block: clamp(3rem, 10vw, 7rem); text-align: center; display: grid; justify-items: center; gap: .875rem; }
.nt-solo h1, .nt-solo h2 { font-size: clamp(1.625rem, 1.2rem + 1.8vw, 2.25rem); }
.nt-solo > p { color: var(--nt-tinta-2); max-width: 32rem; }
.nt-solo__dibujo { width: 5rem; height: 5rem; display: grid; place-items: center; border-radius: 50%; background: var(--nt-lavado); color: var(--bv-morado); }
.nt-solo__dibujo .nt-icono { width: 2.25rem; height: 2.25rem; }
.nt-solo--hoja { width: min(100% - 2.5rem, 36rem); margin: clamp(2rem, 6vw, 4rem) auto 0; padding: clamp(2rem, 6vw, 3.5rem) 1.5rem; background: #fff; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio); box-shadow: var(--nt-sombra); }
.nt-cesta .nt-solo--hoja, .nt-cuenta .nt-solo--hoja { width: 100%; max-width: 36rem; }
.nt-solo__nota { font-size: .8125rem; color: var(--nt-tinta-3); }

.nt-banda { display: flex; justify-content: center; align-items: center; gap: .5rem; padding: .5rem 1rem; background: var(--nt-ojo-fondo); color: var(--nt-ojo); font-size: .8125rem; font-weight: 600; line-height: 1.4; text-align: center; }

.nt-dudas { border-top: 1px solid var(--nt-raya); }
.nt-duda { border-bottom: 1px solid var(--nt-raya); }
.nt-duda summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.125rem 0; font-weight: 700; font-size: 1.0625rem; line-height: 1.35; cursor: pointer; list-style: none; }
.nt-duda summary::-webkit-details-marker { display: none; }
.nt-duda summary:hover { color: var(--bv-morado-texto); }
.nt-duda summary > span { display: inline-flex; align-items: center; gap: .625rem; }
.nt-duda summary > .nt-icono { color: var(--bv-morado); transition: transform .3s var(--nt-muelle); }
.nt-duda[open] summary > .nt-icono { transform: rotate(45deg); }
.nt-duda > p, .nt-duda > ol, .nt-duda > dl { padding-bottom: 1.25rem; color: var(--nt-tinta-2); max-width: 42rem; }
.nt-duda > ol { list-style: decimal; padding-left: 1.375rem; display: grid; gap: .375rem; }
.nt-duda > p + dl { margin-top: -.5rem; }

/* ── 4. Cabecera y pie ───────────────────────────────────────────────────── */
.nt-cabecera { position: sticky; top: 0; z-index: 40; background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--nt-raya); }
.nt-cabecera__fila { display: flex; align-items: center; gap: 2rem; min-height: 4.25rem; }
.nt-logo { flex: none; display: block; }
.nt-logo img { width: 150px; height: auto; }
.nt-nav { display: flex; gap: 1.75rem; margin-right: auto; }
.nt-nav a { color: var(--nt-tinta); font-weight: 500; font-size: .9375rem; text-decoration: none; transition: color .15s; }
.nt-nav a:hover, .nt-nav a[aria-current] { color: var(--bv-morado-texto); }
.nt-cabecera__lado { display: flex; align-items: center; gap: .625rem; margin-left: auto; }
.nt-desplegable { position: relative; }
.nt-desplegable > summary { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.5rem; cursor: pointer; list-style: none; font-weight: 600; font-size: .875rem; }
.nt-desplegable > summary::-webkit-details-marker { display: none; }
.nt-idiomas > summary { padding: .25rem .75rem .25rem .375rem; border: 1px solid var(--nt-raya); border-radius: 999px; transition: border-color .15s; }
.nt-idiomas > summary:hover, .nt-idiomas[open] > summary { border-color: var(--bv-morado); }
.nt-idiomas__sigla { display: grid; place-items: center; min-width: 2rem; height: 1.625rem; padding: 0 .375rem; border-radius: 8px; background: var(--bv-morado); color: #fff; font-size: .75rem; font-weight: 800; }
.nt-idiomas .nt-icono { color: var(--nt-tinta-3); }
.nt-desplegable > ul { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 5; min-width: 12rem; padding: .5rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio-m); background: #fff; box-shadow: var(--nt-sombra-2); transform-origin: top right; animation: nt-brota .22s var(--nt-muelle); }
.nt-desplegable > ul a { display: block; padding: .625rem .875rem; border-radius: 10px; color: var(--nt-tinta); font-weight: 600; text-decoration: none; }
.nt-desplegable > ul a:hover { background: var(--nt-suave); color: var(--bv-morado-texto); }
.nt-desplegable > ul a[aria-current] { color: var(--bv-morado-texto); }
.nt-cabecera__cesta { position: relative; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; color: var(--nt-tinta); transition: background-color .15s, color .15s; }
.nt-cabecera__cesta:hover { background: var(--nt-lavado); color: var(--bv-morado-texto); }
.nt-cabecera__cesta .nt-icono { width: 1.5rem; height: 1.5rem; }
.nt-cabecera__cuantos { position: absolute; top: .125rem; right: .125rem; min-width: 1.25rem; height: 1.25rem; padding: 0 .3125rem; display: grid; place-items: center; border-radius: 999px; background: var(--bv-magenta); color: #fff; font-size: .6875rem; font-weight: 800; line-height: 1; }
.nt-menu { display: none; }
.nt-menu > summary { justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; }
.nt-menu > summary .nt-icono { width: 1.625rem; height: 1.625rem; }
.nt-menu__idioma a { color: var(--nt-tinta-2) !important; font-weight: 500 !important; }
.nt-menu li:not(.nt-menu__idioma) + .nt-menu__idioma { margin-top: .375rem; padding-top: .375rem; border-top: 1px solid var(--nt-raya); }

.nt-pie { margin-top: clamp(4rem, 8vw, 7rem); padding: clamp(2.5rem, 5vw, 3.5rem) 0 2rem; background: var(--nt-suave); border-top: 1px solid var(--nt-raya); font-size: .9375rem; }
.nt-pie__rejilla { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 2rem; }
.nt-pie__marca { display: grid; gap: .875rem; align-content: start; color: var(--nt-tinta-2); }
.nt-pie__marca img { width: 131px; height: auto; }
.nt-pie__pago { display: flex; align-items: center; gap: .5rem; color: var(--bv-morado-texto); font-weight: 600; }
.nt-pie h2 { font-size: .9375rem; font-weight: 800; letter-spacing: 0; margin-bottom: .75rem; }
.nt-pie ul { display: grid; gap: .5rem; }
.nt-pie a { color: var(--nt-tinta-2); text-decoration: none; }
.nt-pie a:hover { color: var(--bv-morado-texto); text-decoration: underline; }
.nt-pie a[aria-current] { color: var(--nt-tinta); font-weight: 700; }
.nt-pie__final { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--nt-raya-2); display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 2rem; color: var(--nt-tinta-3); font-size: .8125rem; }

/* ── 5. Portada ──────────────────────────────────────────────────────────── */
.nt-portada { padding-block: clamp(2rem, 4.5vw, 4rem) clamp(2.5rem, 5vw, 4.5rem); background: linear-gradient(180deg, var(--nt-suave) 0%, #fff 72%); overflow: clip; }
.nt-portada__rejilla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.nt-portada h1 { font-size: clamp(2rem, 1rem + 3.3vw, 3.375rem); line-height: 1.06; letter-spacing: -.03em; }
.nt-portada h1 span { display: block; color: var(--bv-morado); }
.nt-portada__sub { margin-top: 1.125rem; max-width: 31rem; font-size: 1.125rem; line-height: 1.55; color: var(--nt-tinta-2); }

.nt-busca { margin-top: 1.75rem; display: grid; gap: .75rem; max-width: 27rem; }
.nt-busca__campo { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .875rem; align-items: center; padding: .5rem 1rem; border: 1.5px solid var(--nt-raya-2); border-radius: var(--nt-radio-s); background: #fff; transition: border-color .15s, box-shadow .15s; }
.nt-busca__campo:hover { border-color: var(--nt-raya-marca); }
.nt-busca__campo:focus-within { border-color: var(--bv-morado); box-shadow: 0 0 0 4px rgba(121, 56, 173, .16); }
.nt-busca__campo > .nt-icono { grid-row: 1 / span 2; width: 1.5rem; height: 1.5rem; color: var(--bv-morado); }
.nt-busca__campo label { font-size: .75rem; font-weight: 700; color: var(--nt-tinta-3); line-height: 1.3; }
.nt-busca__campo input, .nt-busca__campo select { width: 100%; min-width: 0; padding: 0; border: 0; background: transparent; font-size: 1.0625rem; font-weight: 600; line-height: 1.5; text-overflow: ellipsis; }
.nt-busca__campo input::placeholder { color: var(--nt-tinta-3); font-weight: 400; }
.nt-busca__campo input:focus, .nt-busca__campo select:focus { outline: none; }
.nt-busca__campo input::-webkit-search-cancel-button { display: none; }
.nt-busca__campo select { appearance: none; cursor: pointer; }
.nt-busca .nt-boton { min-height: 3.5rem; }
.nt-busca__lista { position: absolute; left: -1.5px; right: -1.5px; top: calc(100% + .5rem); z-index: 20; max-height: 21rem; overflow-y: auto; overscroll-behavior: contain; padding: .5rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio-m); background: #fff; box-shadow: var(--nt-sombra-2); transform-origin: top center; animation: nt-brota .22s var(--nt-muelle); }
.nt-busca__lista li { display: flex; align-items: center; gap: .75rem; padding: .625rem .75rem; border-radius: 10px; cursor: pointer; }
.nt-busca__lista li[aria-selected="true"], .nt-busca__lista li:hover { background: var(--nt-lavado); }
.nt-busca__lista li strong { font-weight: 600; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt-busca__lista li small { color: var(--nt-tinta-3); font-size: .8125rem; white-space: nowrap; }
.nt-busca__lista .nt-busca__nada { cursor: default; color: var(--nt-tinta-2); font-size: .9375rem; }
.nt-busca__lista .nt-busca__nada:hover { background: none; }

/* La foto del destino, con el borde de abajo ondulado, y el lazo cruzándola con su «desde» */
.nt-portada__arte { position: relative; aspect-ratio: 1 / .94; }
.nt-portada__foto { position: absolute; right: 0; top: 0; width: 82%; height: 100%; object-fit: cover; object-position: 80% center; border-radius: var(--nt-radio-panel) var(--nt-radio-panel) 0 0;
    -webkit-mask: linear-gradient(#000, #000) top / 100% calc(100% - 3.5rem) no-repeat, var(--bv-onda) bottom / 100% 3.6rem no-repeat;
    mask: linear-gradient(#000, #000) top / 100% calc(100% - 3.5rem) no-repeat, var(--bv-onda) bottom / 100% 3.6rem no-repeat; }
.nt-portada__lazo { position: absolute; left: -7%; bottom: 9%; width: 97%; transition: transform .5s var(--nt-muelle); }
.nt-portada__lazo:hover { transform: translateY(-.25rem) scale(1.015); }
.nt-lazo__linea { font-weight: 600; font-size: clamp(.8125rem, .55rem + .7vw, 1.0625rem); line-height: 1.25; }
.nt-lazo__texto strong { font-weight: 900; font-size: clamp(1.25rem, .6rem + 2.1vw, 2.375rem); line-height: 1.05; letter-spacing: -.03em; }

.nt-hechos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid var(--nt-raya); }
.nt-hechos li { display: flex; align-items: center; gap: .875rem; padding: 1.375rem 1.5rem; }
.nt-hechos li:first-child { padding-left: 0; }
.nt-hechos li + li { border-left: 1px solid var(--nt-raya); }
.nt-hechos .nt-icono { width: 1.75rem; height: 1.75rem; color: var(--bv-morado); }
.nt-hechos span { display: grid; font-size: .875rem; line-height: 1.35; color: var(--nt-tinta-3); }
.nt-hechos strong { font-size: 1.0625rem; font-weight: 800; color: var(--nt-tinta); letter-spacing: -.01em; }

.nt-tramo { padding-top: clamp(3.5rem, 7vw, 6rem); scroll-margin-top: 2rem; }
.nt-tramo__cabeza { max-width: 44rem; margin: 0 auto clamp(1.75rem, 3vw, 2.5rem); text-align: center; display: grid; gap: .75rem; }
.nt-tramo__cabeza h2, .nt-preguntas__cabeza h2 { font-size: clamp(1.75rem, 1.15rem + 2.1vw, 2.7rem); }
.nt-tramo__cabeza p, .nt-preguntas__cabeza p { color: var(--nt-tinta-2); font-size: 1.125rem; }
.nt-tramo__mas { margin-top: 2rem; display: flex; justify-content: center; }

/* El destino con su bandera: la tarjeta blanca de borde lila */
.nt-destinosc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.nt-destinoc { display: flex; align-items: center; gap: 1rem; min-height: 5.5rem; padding: 1rem 1.25rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio); background: #fff; box-shadow: var(--nt-sombra); color: var(--nt-tinta); text-decoration: none; transition: border-color .2s, box-shadow .25s, transform .25s var(--nt-muelle); }
.nt-destinoc:hover { border-color: var(--bv-morado); box-shadow: var(--nt-sombra-2); transform: translateY(-2px); }
.nt-destinoc__texto { flex: 1; min-width: 0; display: grid; line-height: 1.3; }
.nt-destinoc__nombre { font-weight: 700; font-size: 1.125rem; letter-spacing: -.01em; overflow-wrap: anywhere; }
.nt-destinoc__dato { color: var(--nt-tinta-3); font-size: .875rem; }
.nt-destinoc > .nt-icono { color: var(--bv-morado); transition: transform .25s var(--nt-muelle); }
.nt-destinoc:hover > .nt-icono { transform: translateX(.25rem); }

.nt-destinosc--pocas { display: flex; flex-wrap: wrap; justify-content: center; }
.nt-destinosc--pocas .nt-destinoc { flex: 0 1 24rem; }

/* El destino con su foto: el nombre va debajo, no encima */
.nt-postal { display: grid; align-content: start; color: var(--nt-tinta); text-decoration: none; }
.nt-postal__marco { position: relative; display: block; aspect-ratio: 4 / 3; margin-bottom: .75rem; border-radius: var(--nt-radio); overflow: hidden; background: var(--nt-lavado); }
.nt-postal__marco img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--nt-muelle); }
.nt-postal:hover .nt-postal__marco img { transform: scale(1.05); }
.nt-postal__nombre { font-weight: 800; font-size: 1.1875rem; letter-spacing: -.015em; line-height: 1.25; }
.nt-postal:hover .nt-postal__nombre { color: var(--bv-morado-texto); }
.nt-postal__dato { color: var(--nt-tinta-3); font-size: .9375rem; }
.nt-postales { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.75rem 1.25rem; }
.nt-mosaico { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1.75rem 1.25rem; }
.nt-mosaico .nt-postal:first-child { grid-row: span 2; grid-template-rows: minmax(16rem, 1fr) auto auto; align-content: stretch; }
.nt-mosaico .nt-postal:first-child .nt-postal__marco { aspect-ratio: auto; }
.nt-mosaico .nt-postal:first-child .nt-postal__nombre { font-size: 1.5rem; }

/* Cómo funciona: la foto con el titular dentro del lazo, y los tres pasos al lado */
.nt-como { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; padding: clamp(1rem, 2.5vw, 2rem); border-radius: var(--nt-radio-panel); background: var(--nt-suave); }
.nt-como__arte { position: relative; aspect-ratio: 5 / 4; border-radius: var(--nt-radio); overflow: hidden; }
.nt-como__arte img { width: 100%; height: 100%; object-fit: cover; }
.nt-como__lazo { position: absolute; left: 3%; right: 3%; top: 50%; transform: translateY(-50%); }
.nt-como__lazo .nt-lazo__texto { right: 26%; font-size: clamp(1.375rem, .5rem + 2.6vw, 2.5rem); line-height: 1.06; }
.nt-pasos { padding-right: clamp(0rem, 2vw, 2rem); }
.nt-pasos li { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 1.25rem; padding: 1.5rem 0; border-bottom: 1px solid var(--nt-raya-2); }
.nt-pasos li:last-child { border-bottom: 0; }
.nt-pasos__numero { font-weight: 900; font-size: 2.75rem; line-height: .95; letter-spacing: -.04em; color: var(--bv-morado); font-variant-numeric: lining-nums; }
.nt-pasos h3 { font-size: 1.3125rem; margin-bottom: .375rem; }
.nt-pasos p { color: var(--nt-tinta-2); }

/* Lo que conviene saber: cinco piezas, cinco huecos. La primera, grande y con el degradado. */
.nt-saber { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1rem; }
.nt-saber__pieza { grid-column: span 2; display: grid; align-content: start; gap: .625rem; padding: 1.75rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio); background: #fff; box-shadow: var(--nt-sombra); }
.nt-saber__pieza h3 { font-size: 1.1875rem; line-height: 1.25; margin-top: .5rem; }
.nt-saber__pieza p { color: var(--nt-tinta-2); font-size: .9375rem; }
.nt-saber__dibujo { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: var(--nt-radio-s); background: var(--nt-lavado); color: var(--bv-morado); }
.nt-saber__dibujo .nt-icono { width: 1.5rem; height: 1.5rem; }
.nt-saber__pieza--numero { position: relative; isolation: isolate; overflow: hidden; grid-column: span 4; align-content: end; min-height: 16rem; padding: clamp(1.75rem, 3vw, 2.5rem); border: 0; background: var(--bv-degradado); color: #fff; box-shadow: var(--nt-sombra-2); }
.nt-saber__pieza--numero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--bv-grano); opacity: .14; mix-blend-mode: overlay; }
.nt-saber__pieza--numero h3 { font-size: clamp(1.5rem, 1rem + 1.7vw, 2.25rem); line-height: 1.1; max-width: 22ch; }
.nt-saber__pieza--numero p { color: rgba(255, 255, 255, .94); font-size: 1.0625rem; max-width: 34rem; }
.nt-saber__pieza--numero .nt-saber__dibujo { background: rgba(255, 255, 255, .2); color: #fff; }
.nt-saber__pieza--recarga { border-color: transparent; background: var(--nt-lavado); box-shadow: none; }
.nt-saber__pieza--recarga .nt-saber__dibujo { background: #fff; }

.nt-preguntas { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.nt-preguntas__cabeza { display: grid; justify-items: start; gap: .875rem; }
.nt-preguntas__cabeza .nt-boton { margin-top: .5rem; }

/* El cierre: una foto con el velo de la marca */
.nt-cierre { position: relative; isolation: isolate; overflow: hidden; display: grid; place-items: center; min-height: 22rem; padding: clamp(2.5rem, 6vw, 4.5rem) 1.5rem; border-radius: var(--nt-radio-panel); color: #fff; text-align: center; }
.nt-cierre > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.nt-cierre::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--bv-velo); }
.nt-cierre__texto { display: grid; justify-items: center; gap: 1rem; max-width: 40rem; }
.nt-cierre h2 { font-size: clamp(1.75rem, 1.15rem + 2.2vw, 2.9rem); }
.nt-cierre p { font-size: 1.125rem; color: rgba(255, 255, 255, .95); }
.nt-cierre .nt-boton { margin-top: .5rem; }
.nt-cierre--suave { display: grid; justify-items: center; gap: .75rem; min-height: 0; margin-top: 1.25rem; padding-block: clamp(2rem, 5vw, 3rem); background: var(--nt-lavado); color: var(--nt-tinta); }
.nt-cierre--suave::before { content: none; }
.nt-cierre--suave h2 { font-size: 1.5rem; }
.nt-cierre--suave p { color: var(--nt-tinta-2); font-size: 1rem; }

/* ── 6. Todos los destinos ───────────────────────────────────────────────── */
.nt-lista { padding-top: clamp(2rem, 5vw, 3.5rem); }
.nt-lista__cabeza { display: grid; gap: 1rem; margin-bottom: 2rem; }
.nt-lista__cabeza h1 { font-size: clamp(2rem, 1.3rem + 2.6vw, 3rem); letter-spacing: -.03em; }
.nt-lista__cabeza > p { color: var(--nt-tinta-2); font-size: 1.125rem; }
.nt-filtro { position: relative; max-width: 30rem; }
.nt-filtro .nt-icono { position: absolute; left: 1.125rem; top: 50%; transform: translateY(-50%); color: var(--bv-morado); pointer-events: none; }
.nt-filtro input { width: 100%; min-height: 3.5rem; padding: .5rem 1.25rem .5rem 3.125rem; border: 1.5px solid var(--nt-raya-2); border-radius: 999px; background: #fff; font-size: 1.0625rem; transition: border-color .15s, box-shadow .15s; }
.nt-filtro input::placeholder { color: var(--nt-tinta-3); }
.nt-filtro input:focus { outline: none; border-color: var(--bv-morado); box-shadow: 0 0 0 4px rgba(121, 56, 173, .16); }
.nt-lista section { scroll-margin-top: 5.5rem; }
.nt-lista section + section { margin-top: 3.5rem; }
.nt-lista section > h2 { font-size: 1.625rem; margin-bottom: 1.25rem; }
.nt-lista__nada { padding: 2rem; border-radius: var(--nt-radio); background: var(--nt-suave); color: var(--nt-tinta-2); text-align: center; }
.nt-lista .nt-destinoc { min-height: 4.75rem; padding-block: .75rem; box-shadow: none; }
.nt-lista .nt-destinoc:hover { box-shadow: var(--nt-sombra-2); }
.nt-lista .nt-destinoc__nombre { font-size: 1.0625rem; }

/* ── 7. La ficha de un destino ───────────────────────────────────────────── */
.nt-migas { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding-block: 1.25rem; color: var(--nt-tinta-3); font-size: .9375rem; }
.nt-migas a { display: inline-flex; color: var(--nt-tinta); font-weight: 600; text-decoration: none; }
.nt-migas a:hover { color: var(--bv-morado-texto); }
.nt-producto { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 3vw, 2.5rem); align-items: start; }
.nt-producto__foto { position: sticky; top: 5.5rem; }
.nt-producto__foto img { width: 100%; aspect-ratio: 4 / 4.9; object-fit: cover; border-radius: var(--nt-radio) var(--nt-radio) 0 0;
    -webkit-mask: linear-gradient(#000, #000) top / 100% calc(100% - 3rem) no-repeat, var(--bv-onda) bottom / 100% 3.1rem no-repeat;
    mask: linear-gradient(#000, #000) top / 100% calc(100% - 3rem) no-repeat, var(--bv-onda) bottom / 100% 3.1rem no-repeat; }
.nt-producto__cuerpo { display: grid; gap: 1.25rem; min-width: 0; }
.nt-producto__cabeza { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1rem 1.125rem; margin-bottom: 1.5rem; }
.nt-producto__cabeza h1 { font-size: clamp(1.625rem, 1.1rem + 1.9vw, 2.5rem); letter-spacing: -.03em; overflow-wrap: anywhere; }
.nt-producto__desde { display: grid; justify-items: end; color: var(--nt-tinta-3); font-size: .875rem; line-height: 1.15; white-space: nowrap; }
.nt-producto__desde strong { font-size: clamp(1.625rem, 1.2rem + 1.2vw, 2.125rem); font-weight: 900; letter-spacing: -.03em; color: var(--nt-tinta); font-variant-numeric: tabular-nums; }
.nt-producto__panel { margin-top: 1.25rem; }
.nt-producto__panel > h2 { font-size: 1.125rem; margin-bottom: .5rem; }
.nt-producto__nada { color: var(--nt-tinta-3); font-size: .9375rem; }
.nt-incluye { display: grid; grid-template-columns: 1fr 1fr; gap: .25rem 1.5rem; }
.nt-incluye li { display: flex; gap: .75rem; align-items: flex-start; padding: .5rem 0; font-size: .9375rem; line-height: 1.45; }
.nt-incluye .nt-icono { margin-top: .0625rem; width: 1.375rem; height: 1.375rem; color: var(--bv-morado); }
.nt-redes { display: flex; flex-wrap: wrap; gap: .5rem; }
.nt-redes li { display: inline-flex; align-items: center; gap: .5rem; padding: .4375rem .875rem; border-radius: 999px; background: var(--nt-suave); font-size: .9375rem; font-weight: 600; }
.nt-redes .nt-icono { color: var(--bv-morado); width: 1em; height: 1em; }
.nt-redes small { color: var(--nt-tinta-3); font-weight: 700; font-size: .75rem; }
.nt-cubre { display: grid; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); gap: .75rem; max-height: 17rem; overflow-y: auto; padding: .25rem; }
.nt-cubre li { display: flex; align-items: center; gap: .625rem; font-size: .9375rem; line-height: 1.25; }

.nt-elige { padding: clamp(1.25rem, 2.5vw, 2rem); border: 1.5px solid var(--nt-raya-marca); border-radius: var(--nt-radio); background: var(--nt-suave); }
.nt-elige > h2 { font-size: 1.5rem; margin-bottom: 1.125rem; }
.nt-elige .nt-modos { background: var(--nt-lavado-2); }
.nt-elige__pregunta { margin: 1.5rem 0 .75rem; font-weight: 700; }
.nt-elige__rotulo { margin: 1.75rem 0 .5rem; font-size: 1.25rem; }
.nt-elige__nota { margin-top: 1rem; color: var(--nt-tinta-3); font-size: .875rem; }
.nt-dias { display: flex; flex-wrap: wrap; gap: .5rem; }
.nt-dia { display: grid; justify-items: center; min-width: 4.25rem; padding: .5rem .75rem; border: 1.5px solid var(--nt-raya-2); border-radius: var(--nt-radio-s); background: #fff; line-height: 1.15; transition: border-color .15s, background-color .15s, transform .18s var(--nt-muelle); }
.nt-dia:hover { border-color: var(--bv-morado); }
.nt-dia:active { transform: scale(.96); }
.nt-dia strong { font-size: 1.375rem; font-weight: 900; letter-spacing: -.03em; }
.nt-dia span { font-size: .75rem; color: var(--nt-tinta-3); font-weight: 500; }
.nt-dia[aria-pressed="true"] { border-color: transparent; background: var(--bv-degradado); color: #fff; box-shadow: 0 6px 16px rgba(121, 56, 173, .26); }
.nt-dia[aria-pressed="true"] span { color: rgba(255, 255, 255, .92); }
.nt-grupo { display: grid; gap: .625rem; }
.nt-grupo > legend { padding: 0; margin: 1.25rem 0 .625rem; font-weight: 700; }
html:not(.sin-js) .nt-grupo[data-dias-grupo] > legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
html:not(.sin-js) .nt-grupo[data-dias-grupo]:not(.es-elegido), html:not(.sin-js) .nt-elige__modo:not(.es-elegido) { display: none; }

.nt-opcion { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .875rem 1rem; padding: 1rem 1.125rem; border: 1.5px solid var(--nt-raya-2); border-radius: var(--nt-radio-m); background: #fff; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.nt-opcion:hover { border-color: var(--bv-morado); }
.nt-opcion input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nt-opcion__marca { display: grid; place-items: center; width: 1.625rem; height: 1.625rem; border: 1.5px solid var(--nt-raya-marca); border-radius: 50%; color: transparent; transition: background-color .15s, border-color .15s, color .15s; }
.nt-opcion__marca .nt-icono { width: .875rem; height: .875rem; }
.nt-opcion input:checked + .nt-opcion__marca { background: var(--bv-morado); border-color: var(--bv-morado); color: #fff; }
.nt-opcion:has(input:checked) { border-color: var(--bv-morado); box-shadow: inset 0 0 0 1px var(--bv-morado), 0 6px 18px rgba(121, 56, 173, .12); }
.nt-opcion:has(input:focus-visible) { outline: 3px solid var(--bv-morado); outline-offset: 3px; }
.nt-opcion__texto { display: grid; min-width: 0; }
.nt-opcion__titulo { font-weight: 800; font-size: 1.0625rem; line-height: 1.3; letter-spacing: -.01em; }
.nt-opcion__detalle { color: var(--nt-tinta-3); font-size: .875rem; line-height: 1.4; }
.nt-opcion__precio { display: grid; justify-items: end; line-height: 1.2; font-variant-numeric: tabular-nums; }
.nt-opcion__precio strong { font-size: 1.25rem; font-weight: 900; letter-spacing: -.03em; white-space: nowrap; }
.nt-opcion__precio small { color: var(--nt-tinta-3); font-size: .75rem; white-space: nowrap; }

.nt-barra { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px dashed var(--nt-raya-marca); }
.nt-barra__resumen { display: grid; min-width: 0; }
.nt-barra__plan { color: var(--nt-tinta-2); font-size: .875rem; font-weight: 600; }
.nt-barra__total { display: flex; align-items: baseline; gap: .625rem; }
.nt-barra__total span { color: var(--nt-tinta-2); font-weight: 600; }
.nt-barra__total strong { font-size: 2.25rem; font-weight: 900; letter-spacing: -.03em; line-height: 1.05; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nt-barra__dia { min-height: 1.2em; color: var(--nt-tinta-3); font-size: .8125rem; line-height: 1.2; }
.nt-barra__boton { min-width: 13rem; min-height: 3.5rem; }
.nt-producto__nota { display: flex; gap: .75rem; align-items: flex-start; padding: 1rem 1.25rem; border: 1px dashed var(--nt-raya-marca); border-radius: var(--nt-radio-m); background: var(--nt-lavado); color: var(--bv-morado-texto); font-size: .9375rem; font-weight: 500; }
.nt-producto__nota .nt-icono { margin-top: .1875rem; }
.nt-producto__pago { display: flex; justify-content: center; align-items: center; gap: .5rem; color: var(--nt-tinta-3); font-size: .875rem; }

/* ── 8. Cesta y pago ─────────────────────────────────────────────────────── */
.nt-cesta { padding-top: clamp(2rem, 5vw, 3.5rem); }
.nt-cesta > h1 { font-size: clamp(2rem, 1.3rem + 2.6vw, 3rem); letter-spacing: -.03em; margin-bottom: 1.5rem; }
.nt-cesta__rejilla { display: grid; grid-template-columns: minmax(0, 1fr) 25.5rem; gap: 1.5rem; align-items: start; }
.nt-lineas { display: grid; gap: .75rem; margin-bottom: 1.25rem; }
.nt-linea { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: 1.125rem 1.25rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio); background: #fff; box-shadow: var(--nt-sombra); }
.nt-linea__destino { font-weight: 800; font-size: 1.125rem; line-height: 1.25; letter-spacing: -.01em; }
.nt-linea__plan { color: var(--nt-tinta-2); }
.nt-linea__detalle { margin-top: .125rem; color: var(--nt-tinta-3); font-size: .8125rem; line-height: 1.4; }
.nt-linea__nota { display: inline-flex; align-items: center; gap: .375rem; margin-top: .25rem; color: var(--bv-morado-texto); font-size: .8125rem; font-weight: 600; }
.nt-linea__cuenta { display: grid; justify-items: end; gap: .375rem; }
.nt-linea__precio { font-weight: 900; font-size: 1.25rem; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.nt-linea__quitar { display: inline-flex; align-items: center; gap: .375rem; min-height: 2rem; padding: 0 .25rem; border: 0; background: none; color: var(--nt-tinta-3); font-size: .8125rem; }
.nt-linea__quitar:hover { color: var(--nt-mal); }
.nt-unidades { display: inline-flex; align-items: center; gap: .125rem; padding: .1875rem; border: 1.5px solid var(--nt-raya-2); border-radius: 999px; }
.nt-unidades form { display: contents; }
.nt-unidades button { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border: 0; border-radius: 50%; background: transparent; transition: background-color .15s; }
.nt-unidades button:hover:not([disabled]) { background: var(--nt-lavado); color: var(--bv-morado-texto); }
.nt-unidades button[disabled] { opacity: .35; cursor: default; }
.nt-unidades span { min-width: 1.5rem; text-align: center; font-weight: 700; font-variant-numeric: tabular-nums; }
.nt-pagar { position: sticky; top: 5.5rem; }
.nt-pagar h2 { font-size: 1.375rem; margin-bottom: 1.125rem; }
.nt-pagar__como { display: flex; align-items: center; gap: .625rem; margin-bottom: 1.125rem; padding: .875rem 1rem; border-radius: var(--nt-radio-m); background: var(--nt-suave); font-size: .9375rem; overflow-wrap: anywhere; }
.nt-pagar__cuenta { margin: -.25rem 0 1.125rem; font-size: .875rem; color: var(--nt-tinta-2); }
.nt-pagar__total { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin: 1.25rem 0 1rem; padding-top: 1.125rem; border-top: 1px dashed var(--nt-raya-marca); }
.nt-pagar__total dt { font-weight: 700; display: grid; }
.nt-pagar__total dt small { font-weight: 400; color: var(--nt-tinta-3); font-size: .8125rem; }
.nt-pagar__total dd { font-size: 2.25rem; font-weight: 900; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.nt-pagar__seguro { margin-top: .875rem; color: var(--nt-tinta-3); font-size: .8125rem; line-height: 1.5; text-align: center; }

.nt-pago { max-width: 48rem; padding-top: clamp(2rem, 5vw, 3.5rem); }
.nt-pago__cabeza { display: grid; justify-items: center; gap: .875rem; text-align: center; padding-block: clamp(1rem, 4vw, 2.5rem); }
.nt-pago__cabeza h1 { font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.7rem); letter-spacing: -.03em; }
.nt-pago__cabeza > p { color: var(--nt-tinta-2); max-width: 34rem; overflow-wrap: anywhere; }
.nt-pago__dibujo { display: grid; place-items: center; width: 5rem; height: 5rem; border-radius: 50%; background: var(--nt-lavado); color: var(--bv-morado); }
.nt-pago__dibujo .nt-icono { width: 2.25rem; height: 2.25rem; }
.nt-pago__cabeza--bien .nt-pago__dibujo { background: var(--bv-degradado); color: #fff; box-shadow: 0 10px 28px rgba(121, 56, 173, .32); animation: nt-llega .6s var(--nt-muelle) both; }
.nt-pago__cabeza--mal .nt-pago__dibujo { background: var(--nt-mal-fondo); color: var(--nt-mal); }
.nt-pago__dibujo--espera, .nt-solo__dibujo--gira { animation: nt-late 1.6s ease-in-out infinite; }
.nt-pago__sigue { margin-top: 1.5rem; display: grid; justify-items: center; }
.nt-pago__sigue > p { display: flex; gap: .75rem; align-items: flex-start; padding: 1rem 1.25rem; border: 1px dashed var(--nt-raya-marca); border-radius: var(--nt-radio-m); background: var(--nt-lavado); color: var(--bv-morado-texto); font-weight: 500; }
.nt-pago__sigue .nt-icono { margin-top: .1875rem; }

/* ── 9. La eSIM: una tarjeta de embarque ─────────────────────────────────── */
.nt-pase { position: relative; overflow: hidden; margin-block: 1.25rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio); background: #fff; box-shadow: var(--nt-sombra); }
.nt-pase__cabeza { position: relative; isolation: isolate; display: flex; align-items: center; gap: 1rem; padding: 1.375rem 1.5rem; background: var(--bv-degradado); color: #fff; }
.nt-pase__cabeza::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--bv-grano); opacity: .14; mix-blend-mode: overlay; }
.nt-pase__destino { flex: 1; min-width: 0; }
.nt-pase__tipo { font-size: .75rem; font-weight: 600; color: rgba(255, 255, 255, .9); }
.nt-pase__nombre { font-size: 1.5rem; line-height: 1.15; overflow-wrap: anywhere; }
.nt-pase__cabeza .nt-sello { background: #fff; color: var(--bv-morado-texto); }
.nt-pase__datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1rem 1.5rem; padding: 1.25rem 1.5rem; }
.nt-pase__datos dt { font-size: .75rem; font-weight: 600; color: var(--nt-tinta-3); }
.nt-pase__datos dd { font-weight: 700; line-height: 1.35; }
.nt-pase__consumo progress { display: block; margin-top: .5rem; }
.nt-pase__corte { position: relative; height: 0; margin: .25rem 1.5rem; border-top: 2px dashed var(--nt-raya-marca); }
.nt-pase__corte::before, .nt-pase__corte::after { content: ""; position: absolute; top: -.9375rem; width: 1.75rem; height: 1.75rem; border: 1px solid var(--nt-raya); border-radius: 50%; background: var(--nt-pagina); }
.nt-pase__corte::before { left: -2.4375rem; }
.nt-pase__corte::after { right: -2.4375rem; }
.nt-pase__pie { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: 1.25rem 1.5rem 1.5rem; }
.nt-pase__red { display: inline-flex; align-items: center; gap: .375rem; color: var(--nt-tinta-3); font-size: .875rem; }
.nt-pases { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 25rem), 1fr)); gap: 0 1.25rem; }
progress { appearance: none; -webkit-appearance: none; width: 100%; height: .5rem; border: 0; border-radius: 999px; overflow: hidden; background: var(--nt-lavado); }
progress::-webkit-progress-bar { background: var(--nt-lavado); }
progress::-webkit-progress-value { border-radius: 999px; background: var(--bv-degradado); }
progress::-moz-progress-bar { border-radius: 999px; background: var(--bv-degradado); }

.nt-instalar { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 2rem; align-items: start; width: 100%; }
.nt-instalar__qr { display: grid; justify-items: center; gap: .75rem; text-align: center; }
.nt-instalar__qr img { width: 15rem; height: auto; aspect-ratio: 1; border: 1.5px solid var(--nt-raya); border-radius: var(--nt-radio-m); background: #fff; }
.nt-instalar__qr p { color: var(--nt-tinta-3); font-size: .875rem; line-height: 1.45; }
.nt-instalar__pasos { counter-reset: paso; display: grid; gap: .875rem; margin-bottom: 1.25rem; }
.nt-instalar__pasos li { counter-increment: paso; display: grid; grid-template-columns: auto 1fr; gap: .875rem; color: var(--nt-tinta-2); }
.nt-instalar__pasos li::before { content: counter(paso); display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--nt-lavado); color: var(--bv-morado-texto); font-size: .875rem; font-weight: 800; }
.nt-instalar .nt-duda:first-of-type { border-top: 1px solid var(--nt-raya); }
.nt-amano { display: grid; gap: .75rem; }
.nt-amano dt { font-size: .8125rem; color: var(--nt-tinta-3); }
.nt-amano dd { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.nt-amano code { padding: .375rem .625rem; border-radius: 10px; background: var(--nt-suave); font: 500 .8125rem/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; overflow-wrap: anywhere; }
.nt-copiar { display: inline-flex; align-items: center; gap: .375rem; min-height: 2rem; padding: 0 .75rem; border: 1.5px solid var(--nt-raya-2); border-radius: 999px; background: #fff; font-size: .8125rem; font-weight: 600; }
.nt-copiar:hover { border-color: var(--bv-morado); color: var(--bv-morado-texto); }
.nt-copiar.es-hecho { border-color: var(--nt-bien); color: var(--nt-bien); }

/* ── 10. La cuenta ───────────────────────────────────────────────────────── */
.nt-cuenta { padding-top: clamp(2rem, 5vw, 3.5rem); }
.nt-cuenta > p { margin-bottom: 1rem; }
.nt-cuenta__cabeza { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.nt-cuenta__hola { font-size: clamp(1.75rem, 1.3rem + 2vw, 2.5rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.nt-cuenta__correo { color: var(--nt-tinta-3); overflow-wrap: anywhere; }
.nt-cuenta__fichas { margin-block: 1.5rem 1.25rem; }
.nt-compras { display: grid; gap: .625rem; margin-top: 1.25rem; }
.nt-compra { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) auto auto auto; align-items: center; gap: .5rem 1.25rem; min-height: 4.25rem; padding: .875rem 1.25rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio); background: #fff; color: var(--nt-tinta); text-decoration: none; transition: border-color .2s, box-shadow .25s, transform .25s var(--nt-muelle); }
.nt-compra:hover { border-color: var(--bv-morado); box-shadow: var(--nt-sombra-2); transform: translateY(-2px); }
.nt-compra__codigo { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.nt-compra__fecha { color: var(--nt-tinta-2); font-size: .9375rem; }
.nt-compra__total { font-weight: 800; font-variant-numeric: tabular-nums; text-align: right; }
.nt-compra > .nt-icono { color: var(--bv-morado); }
.nt-recibo header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.nt-recibo h1 { font-size: 1.625rem; font-variant-numeric: tabular-nums; }
.nt-recibo__datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1rem 1.5rem; margin-block: 1.5rem; }
.nt-recibo__datos dt { font-size: .75rem; font-weight: 600; color: var(--nt-tinta-3); }
.nt-recibo__datos dd { font-weight: 500; line-height: 1.4; }
.nt-recibo__lineas li { display: flex; justify-content: space-between; gap: 1.5rem; padding: .875rem 0; border-top: 1px dashed var(--nt-raya-marca); }
.nt-recibo__lineas li span:last-child { font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.nt-recibo__total { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-top: 1rem; border-top: 2px solid var(--nt-tinta); }
.nt-recibo__total small { color: var(--nt-tinta-3); font-weight: 400; }
.nt-recibo__total strong { font-size: 1.75rem; font-weight: 900; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.nt-recibo__devolucion { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-top: .625rem; color: var(--nt-tinta-2); font-size: .9375rem; }
.nt-recibo__devolucion strong { font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.nt-perfil { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; align-items: start; }
.nt-perfil .nt-bloque { margin-top: 0; }
.nt-recargas { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: .625rem; }
.nt-recarga { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem .75rem .75rem 1.125rem; border: 1.5px solid var(--nt-raya); border-radius: var(--nt-radio-m); }
.nt-recarga__titulo { font-weight: 700; line-height: 1.3; }
.nt-recarga__detalle { color: var(--nt-tinta-3); font-size: .8125rem; }

/* ── 11. Entrar, registro y contraseña ───────────────────────────────────── */
.nt-puerta { max-width: 27.5rem; padding-top: clamp(2rem, 8vw, 5rem); }
.nt-puerta__hoja { box-shadow: var(--nt-sombra-2); }
.nt-puerta h1 { font-size: 1.75rem; margin-bottom: 1.25rem; }
.nt-puerta__sub { margin: -.5rem 0 1.25rem; color: var(--nt-tinta-2); overflow-wrap: anywhere; }
.nt-puerta__enlace { margin-top: 1rem; text-align: center; font-weight: 600; }
.nt-puerta__nota { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--nt-raya); color: var(--nt-tinta-3); font-size: .8125rem; text-align: center; }
.nt-puerta__otra { margin-top: 1.25rem; text-align: center; color: var(--nt-tinta-2); }
.nt-puerta__otra a { font-weight: 700; }

/* ── 12. Ayuda y legal ───────────────────────────────────────────────────── */
.nt-seccion { padding-top: clamp(2.5rem, 6vw, 4.5rem); }
.nt-seccion--estrecha { max-width: 50rem; }
.nt-seccion__cabeza { max-width: 44rem; margin-bottom: clamp(1.5rem, 3vw, 2.25rem); display: grid; gap: .75rem; }
.nt-seccion__cabeza h1 { font-size: clamp(2rem, 1.3rem + 2.6vw, 3rem); letter-spacing: -.03em; }
.nt-seccion__cabeza p { color: var(--nt-tinta-2); font-size: 1.125rem; }
.nt-ayuda__movil { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; margin-top: 2.5rem; }
.nt-ayuda__movil h2 { font-size: 1.375rem; margin-bottom: .5rem; }
.nt-ayuda__movil p { color: var(--nt-tinta-2); }
.nt-legal__texto h2 { font-size: 1.125rem; letter-spacing: -.01em; margin: 2rem 0 .5rem; }
.nt-legal__texto h2:first-child { margin-top: 0; }
.nt-legal__texto p { color: var(--nt-tinta-2); }
.nt-legal__texto p + p { margin-top: .75rem; }
.nt-legal__texto ul { margin: .625rem 0 .75rem; padding-left: 1.25rem; color: var(--nt-tinta-2); display: grid; gap: .5rem; }
.nt-legal__texto ul + p, .nt-legal__tabla + p { margin-top: .75rem; }
.nt-legal__texto li::marker { color: var(--bv-morado); }
.nt-legal__texto a { overflow-wrap: anywhere; }
.nt-seccion__cabeza .nt-legal__version { font-size: .875rem; color: var(--nt-tinta-3); }
.nt-legal__indice { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.nt-legal__indice a { padding: .5rem 1rem; border: 1px solid var(--nt-raya-2); border-radius: 999px; background: #fff; color: var(--nt-tinta-2); font-size: .875rem; font-weight: 600; text-decoration: none; transition: border-color .15s, color .15s; }
.nt-legal__indice a:hover { border-color: var(--nt-raya-marca); color: var(--bv-morado-texto); }
.nt-legal__indice a[aria-current] { border-color: transparent; background: var(--nt-lavado-2); color: var(--bv-morado-texto); }
.nt-legal__tabla { margin: .75rem 0; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio-s); overflow-x: auto; }
.nt-legal__tabla table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.nt-legal__tabla th, .nt-legal__tabla td { padding: .75rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--nt-raya); color: var(--nt-tinta-2); }
.nt-legal__tabla thead th { font-size: .8125rem; color: var(--nt-tinta-3); background: var(--nt-lavado); white-space: nowrap; }
.nt-legal__tabla tbody th { font-weight: 700; color: var(--nt-tinta); overflow-wrap: anywhere; }
.nt-legal__tabla tbody tr:last-child > * { border-bottom: 0; }
.nt-legal__accion { margin-top: 1.5rem; }
.nt-pagar__legal { margin: .25rem 0 1rem; padding: .75rem .875rem; border-radius: var(--nt-radio-s); background: var(--nt-lavado); color: var(--nt-tinta-2); font-size: .8125rem; line-height: 1.5; }
.nt-pagar__legal a { font-weight: 600; white-space: nowrap; }
.nt-desistible { margin-top: 1.25rem; display: grid; gap: .75rem; }
.nt-desistible h2 { font-size: 1.125rem; }
.nt-desistible > p { color: var(--nt-tinta-2); }
.nt-desistir__texto { margin: 0 0 1.25rem; padding: 1rem 1.125rem; border: 1px dashed var(--nt-raya-marca); border-radius: var(--nt-radio-s); background: var(--nt-lavado); display: grid; gap: .375rem; overflow-wrap: anywhere; }
.nt-desistir__texto p:first-child { font-weight: 700; color: var(--nt-tinta); }
.nt-desistir__texto p { color: var(--nt-tinta-2); }
.nt-desistir__cambiar { margin-top: 1rem; text-align: center; }
.nt-desistir__cambiar button { border: 0; background: none; cursor: pointer; font: inherit; }
.nt-acuse { text-align: left; }
.nt-acuse__dibujo { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; margin-bottom: 1rem; border-radius: 50%; background: var(--bv-degradado); color: #fff; }
.nt-acuse__dibujo .nt-icono { width: 1.625rem; height: 1.625rem; }
.nt-acuse__datos { display: grid; gap: .75rem; margin: 0 0 1.25rem; padding: 1rem 1.125rem; border: 1px solid var(--nt-raya); border-radius: var(--nt-radio-s); }
.nt-acuse__datos dt { font-size: .75rem; font-weight: 600; color: var(--nt-tinta-3); }
.nt-acuse__datos dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }

/* ── 12b. El asistente ───────────────────────────────────────────────────── */
/* Un botón que flota abajo a la derecha y su ventana (en el móvil, la pantalla entera). Se lee como
   una conversación de mensajes: lo que escribe quien visita, a la derecha y en morado; lo que
   contesta el asistente, a la izquierda y en gris lila. La misma pieza hace de página (.nt-asistente). */
.nt-chat { position: fixed; right: 1.25rem; bottom: calc(1.25rem + env(safe-area-inset-bottom)); z-index: 45; }
.nt-chat__boton {
    display: inline-flex; align-items: center; gap: .5rem; min-height: 3.25rem; padding: .5rem 1.375rem .5rem 1.125rem; border-radius: 999px;
    background: var(--bv-morado); color: #fff; font-weight: 700; font-size: .9375rem; line-height: 1.2; text-decoration: none;
    box-shadow: 0 2px 6px rgba(38, 38, 38, .14), 0 10px 26px rgba(121, 56, 173, .34);
    transition: transform .2s var(--nt-muelle), background-color .2s; -webkit-tap-highlight-color: transparent;
}
.nt-chat__boton:hover { background: var(--bv-morado-texto); transform: translateY(-2px); }
.nt-chat__boton:active { transform: scale(.97); }
.nt-chat__boton .nt-icono { width: 1.5rem; height: 1.5rem; }
.nt-chat.es-abierto .nt-chat__boton { display: none; }
.nt-chat__panel {
    display: flex; flex-direction: column; width: min(25rem, calc(100vw - 2.5rem)); height: min(39rem, calc(100dvh - 7rem));
    border: 1px solid var(--nt-raya); border-radius: var(--nt-radio-panel); background: #fff; box-shadow: var(--nt-sombra-2); overflow: hidden;
    transform-origin: bottom right; animation: nt-chat-abre .26s var(--nt-muelle);
}
.nt-chat__panel:focus { outline: none; }
.nt-chat__cabeza { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .75rem; padding: .875rem .875rem .875rem 1.125rem; border-bottom: 1px solid var(--nt-raya); }
.nt-chat__cabeza h2 { font-size: 1rem; letter-spacing: -.01em; }
.nt-chat__cabeza p { color: var(--nt-tinta-3); font-size: .8125rem; line-height: 1.3; }
.nt-chat__cerrar { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: none; color: var(--nt-tinta-2); transition: background-color .15s, color .15s; }
.nt-chat__cerrar:hover { background: var(--nt-suave); color: var(--nt-tinta); }
.nt-chat__cuerpo { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.nt-chat__hilo { display: flex; flex-direction: column; gap: 1rem; flex: 1; min-height: 0; padding: 1.125rem; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.nt-chat__hilo:focus-visible { outline-offset: -3px; }
.nt-chat__turno { display: grid; gap: .5rem; }
.nt-chat__pregunta, .nt-chat__respuesta, .nt-chat__hola { max-width: 88%; padding: .6875rem 1rem; font-size: .9375rem; line-height: 1.5; overflow-wrap: anywhere; }
.nt-chat__pregunta { justify-self: end; border-radius: 20px 20px 6px 20px; background: var(--bv-morado); color: #fff; }
.nt-chat__respuesta, .nt-chat__hola { display: grid; gap: .5rem; justify-self: start; align-self: flex-start; border-radius: 20px 20px 20px 6px; background: var(--nt-suave); }
.nt-chat__respuesta ul, .nt-chat__respuesta ol { display: grid; gap: .375rem; padding-left: 1.25rem; }
.nt-chat__respuesta ul { list-style: disc; }
.nt-chat__respuesta ol { list-style: decimal; }
.nt-chat__respuesta li::marker { color: var(--bv-morado); font-weight: 700; }
.nt-chat__respuesta a { font-weight: 600; }
.nt-chat__respuesta--fallo { background: var(--nt-ojo-fondo); color: var(--nt-ojo); }
.nt-chat__respuesta--fallo a { color: inherit; }
.nt-chat__respuesta--fallo .nt-chat__contacto a { color: var(--bv-morado-texto); }
.nt-chat__contacto { display: flex; flex-wrap: wrap; gap: .5rem; }
.nt-chat__contacto a { display: inline-flex; align-items: center; gap: .375rem; min-height: 2.25rem; padding: .25rem .875rem; border: 1px solid var(--nt-raya-2); border-radius: 999px; background: #fff; color: var(--bv-morado-texto); font-size: .875rem; text-decoration: none; }
.nt-chat__contacto a:hover { border-color: var(--bv-morado); }
.nt-chat__puntos { display: inline-flex; align-items: center; gap: .3125rem; height: 1.5rem; }
.nt-chat__puntos i { width: .4375rem; height: .4375rem; border-radius: 50%; background: var(--nt-tinta-3); animation: nt-chat-punto 1.2s ease-in-out infinite; }
.nt-chat__puntos i:nth-child(2) { animation-delay: .16s; }
.nt-chat__puntos i:nth-child(3) { animation-delay: .32s; }
.nt-chat__ideas { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0 1.125rem .75rem; }
.nt-chat__ideas button { min-height: 2.5rem; padding: .375rem .9375rem; border: 1px solid var(--nt-raya-marca); border-radius: 999px; background: #fff; color: var(--bv-morado-texto); font-weight: 600; font-size: .875rem; line-height: 1.3; text-align: left; transition: background-color .15s, border-color .15s; }
.nt-chat__ideas button:hover { background: var(--nt-lavado); border-color: var(--bv-morado); }
.nt-chat__aviso { margin: 0 1.125rem .625rem; padding: .625rem .875rem; border-radius: var(--nt-radio-s); background: var(--nt-mal-fondo); color: var(--nt-mal); font-size: .875rem; line-height: 1.45; }
.nt-chat__forma { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: .5rem; margin: 0 1.125rem; padding: .3125rem .3125rem .3125rem 1.125rem; border: 1.5px solid var(--nt-raya-2); border-radius: 1.75rem; background: #fff; transition: border-color .15s, box-shadow .15s; }
.nt-chat__forma:focus-within { border-color: var(--bv-morado); box-shadow: 0 0 0 4px rgba(121, 56, 173, .16); }
.nt-chat__forma textarea { display: block; width: 100%; min-height: 2.75rem; max-height: 8rem; padding: .625rem 0; border: 0; outline: 0; background: none; resize: none; font-size: 1rem; line-height: 1.5; field-sizing: content; }
.nt-chat__forma textarea::placeholder { color: var(--nt-tinta-3); }
.nt-chat__enviar { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: var(--bv-morado); color: #fff; transition: transform .2s var(--nt-muelle), background-color .2s; }
.nt-chat__enviar:hover { background: var(--bv-morado-texto); }
.nt-chat__enviar:active { transform: scale(.94); }
.nt-chat__enviar[disabled] { background: var(--nt-raya-2); cursor: default; transform: none; }
.nt-chat__pie { display: flex; flex-wrap: wrap; align-items: baseline; gap: .125rem .875rem; padding: .625rem 1.25rem .875rem; color: var(--nt-tinta-3); font-size: .75rem; line-height: 1.5; }
.nt-chat__pie form { margin-left: auto; }
.nt-chat__pie a, .nt-chat__pie button { color: var(--nt-tinta-2); }
.nt-chat__pie a:hover, .nt-chat__pie button:hover { color: var(--bv-morado-texto); }
.nt-chat__pie button { min-height: 1.5rem; padding: 0; border: 0; background: none; font-size: inherit; text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: .08em; }
.nt-asistente__hoja { padding: 0; overflow: hidden; }
.nt-asistente .nt-chat__hilo { overflow: visible; padding: clamp(1.25rem, 2.5vw, 2rem) clamp(1.25rem, 2.5vw, 2rem) 1.25rem; }
.nt-asistente .nt-chat__ideas, .nt-asistente .nt-chat__pie { padding-inline: clamp(1.25rem, 2.5vw, 2rem); }
.nt-asistente .nt-chat__forma, .nt-asistente .nt-chat__aviso { margin-inline: clamp(1.25rem, 2.5vw, 2rem); }
.nt-asistente .nt-chat__pie { padding-bottom: 1.25rem; }

/* ── 13. Movimiento ──────────────────────────────────────────────────────── */
/* Un solo momento con intención: al abrir la portada, el lazo cruza la foto de izquierda a derecha. */
@keyframes nt-brota { from { opacity: 0; transform: scale(.96) translateY(-.375rem); } }
@keyframes nt-sube { from { opacity: 0; transform: translateY(1rem); } }
@keyframes nt-late { 50% { transform: scale(1.08); opacity: .72; } }
@keyframes nt-llega { from { transform: scale(.4); opacity: 0; } }
@keyframes nt-cruza { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes nt-chat-abre { from { opacity: 0; transform: translateY(.75rem) scale(.97); } }
@keyframes nt-chat-llega { from { opacity: 0; transform: translateY(.375rem); } }
@keyframes nt-chat-punto { 0%, 60%, 100% { transform: none; opacity: .35; } 30% { transform: translateY(-.1875rem); opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
    .nt-portada__texto > * { animation: nt-sube .7s var(--nt-muelle) both; }
    .nt-portada__texto > :nth-child(2) { animation-delay: .07s; }
    .nt-portada__texto > :nth-child(3) { animation-delay: .14s; }
    .nt-portada__foto { animation: nt-sube .9s var(--nt-muelle) both; }
    .nt-portada__lazo { animation: nt-cruza 1s cubic-bezier(.65, 0, .25, 1) .25s both; }
    .nt-chat__turno.es-nuevo { animation: nt-chat-llega .3s var(--nt-muelle); }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media (prefers-reduced-transparency: reduce) {
    .nt-cabecera { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* ── 14. Pantallas medianas y pequeñas ───────────────────────────────────── */
@media (max-width: 64rem) {
    .nt-nav { gap: 1.25rem; }
    .nt-idiomas__nombre { display: none; }
    .nt-cesta__rejilla { grid-template-columns: minmax(0, 1fr); }
    .nt-pagar { position: static; }
    .nt-preguntas { grid-template-columns: minmax(0, 1fr); }
    .nt-destinosc { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nt-postales { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .nt-hechos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nt-hechos li:nth-child(odd) { padding-left: 0; border-left: 0; }
    .nt-hechos li:nth-child(n+3) { border-top: 1px solid var(--nt-raya); }
    .nt-saber__pieza { grid-column: span 3; }
    .nt-saber__pieza--numero, .nt-saber__pieza--cuenta { grid-column: span 6; }
    .nt-saber__pieza--numero { min-height: 13rem; }
}
@media (max-width: 56rem) {
    .nt-nav, .nt-idiomas, .nt-cabecera__cuenta span { display: none; }
    .nt-menu { display: block; }
    .nt-cabecera__fila { gap: 1rem; }
    .nt-cabecera__cuenta { min-width: 2.75rem; min-height: 2.75rem; padding: 0; background: none; box-shadow: none; color: var(--nt-tinta); }
    .nt-cabecera__cuenta:hover { background: var(--nt-lavado); color: var(--bv-morado-texto); }
    .nt-cabecera__cuenta .nt-icono { width: 1.5rem; height: 1.5rem; }
    .nt-portada__rejilla { grid-template-columns: minmax(0, 1fr); }
    .nt-portada__arte { aspect-ratio: 1 / .78; max-width: 34rem; }
    .nt-busca { max-width: none; }
    .nt-como { grid-template-columns: minmax(0, 1fr); }
    .nt-pasos { padding: 0 .5rem; }
    .nt-mosaico { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nt-mosaico .nt-postal:first-child { grid-column: 1 / -1; grid-row: auto; }
    .nt-mosaico .nt-postal:first-child { grid-template-rows: auto; }
    .nt-mosaico .nt-postal:first-child .nt-postal__marco { aspect-ratio: 16 / 9; }
    .nt-pie__rejilla { grid-template-columns: 1fr 1fr; }
    .nt-pie__marca { grid-column: 1 / -1; }
    .nt-perfil, .nt-instalar { grid-template-columns: minmax(0, 1fr); }

    /* La ficha: la foto arriba, más baja, y el total con su botón fijo al pie de la pantalla */
    .nt-producto { grid-template-columns: minmax(0, 1fr); }
    .nt-producto__foto { position: static; }
    .nt-producto__foto img { aspect-ratio: 16 / 9; }
    .nt-barra { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; margin: 0; padding: .875rem 1.25rem calc(.875rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--nt-raya); background: #fff; box-shadow: 0 -10px 34px rgba(82, 82, 81, .16); gap: 1rem; }
    .nt-barra__plan { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8125rem; }
    .nt-barra__total span { display: none; }
    .nt-barra__total strong { font-size: 1.625rem; }
    .nt-barra__boton { min-width: 0; min-height: 3.25rem; padding-inline: 1.375rem; }
    .nt--destino .nt-pie { padding-bottom: 7.5rem; }
    /* El asistente no tapa el total ni «Comprar» */
    .nt--destino .nt-chat { bottom: calc(6.25rem + env(safe-area-inset-bottom)); }
    .nt--destino .nt-chat__panel { height: min(39rem, calc(100dvh - 12rem)); }

    .nt-compra { grid-template-columns: minmax(0, 1fr) auto auto; }
    .nt-compra__fecha { grid-column: 1; grid-row: 2; font-size: .8125rem; }
    .nt-compra .nt-sello { grid-column: 2; grid-row: 1 / span 2; }
    .nt-compra__total { grid-column: 2; grid-row: 1 / span 2; }
    .nt-compra .nt-sello + .nt-compra__total { grid-column: 1; grid-row: 3; text-align: left; }
    .nt-compra > .nt-icono { grid-column: 3; grid-row: 1 / span 3; }
}
@media (max-width: 40rem) {
    .nt-ancho { width: min(100% - 2rem, 76rem); }
    .nt-destinosc { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
    .nt-postales { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem .875rem; }
    .nt-portada__arte { aspect-ratio: 1 / .86; }
    .nt-portada__foto { width: 88%; }
    .nt-portada__lazo { left: -4%; width: 100%; }
    .nt-hechos li { padding: 1rem .75rem; gap: .625rem; }
    .nt-hechos .nt-icono { width: 1.5rem; height: 1.5rem; }
    .nt-hechos strong { font-size: .9375rem; }
    .nt-hechos span { font-size: .8125rem; }
    .nt-saber { grid-template-columns: minmax(0, 1fr); }
    .nt-saber__pieza, .nt-saber__pieza--numero, .nt-saber__pieza--cuenta { grid-column: auto; }
    .nt-incluye { grid-template-columns: minmax(0, 1fr); }
    .nt-producto__cabeza { grid-template-columns: auto minmax(0, 1fr); }
    .nt-producto__cabeza .nt-bandera { width: 3.25rem; height: 3.25rem; }
    .nt-producto__desde { grid-column: 1 / -1; justify-items: start; display: flex; align-items: baseline; gap: .5rem; }
    .nt-linea { grid-template-columns: auto minmax(0, 1fr); }
    .nt-linea__cuenta { grid-column: 1 / -1; grid-template-columns: auto 1fr auto; align-items: center; justify-items: start; padding-top: .875rem; border-top: 1px dashed var(--nt-raya-marca); }
    .nt-linea__precio { justify-self: end; order: 3; }
    .nt-opcion { padding: .875rem 1rem; gap: .75rem; }
    .nt-pase__cabeza { flex-wrap: wrap; }
    .nt-pase__pie .nt-boton { flex: 1 1 100%; }
    .nt-pie__final { flex-direction: column; }
    .nt-legal__tabla thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
    .nt-legal__tabla tr { display: grid; gap: .25rem; padding: .875rem 1rem; border-bottom: 1px solid var(--nt-raya); }
    .nt-legal__tabla tbody tr:last-child { border-bottom: 0; }
    .nt-legal__tabla th, .nt-legal__tabla td { padding: 0; border: 0; }
    .nt-legal__tabla td::before { content: attr(data-rotulo) ": "; font-weight: 600; color: var(--nt-tinta-3); }
    .nt-banda { font-size: .75rem; }
    .nt-boton--mayus { white-space: normal; }

    /* El asistente: el botón se queda en un círculo y la ventana ocupa la pantalla */
    .nt-chat { right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom)); }
    .nt-chat__boton { justify-content: center; width: 3.5rem; min-height: 3.5rem; padding: 0; }
    .nt-chat__boton span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .nt-chat.es-abierto, .nt--destino .nt-chat.es-abierto { top: 0; right: 0; bottom: auto; left: 0; height: 100dvh; z-index: 60; }
    .nt-chat.es-abierto .nt-chat__panel { width: 100%; height: 100%; border: 0; border-radius: 0; transform-origin: bottom center; }
    .nt-chat__cabeza { padding-top: calc(.875rem + env(safe-area-inset-top)); }
    .nt-chat__panel .nt-chat__pie { padding-bottom: calc(.875rem + env(safe-area-inset-bottom)); }
    html.nt-chat-abierto { overflow: hidden; }
}

/* ── 14. Con el dedo ─────────────────────────────────────────────────────── */
/* Más de la mitad de las visitas llegan desde un teléfono. Aquí está lo que hace falta para usar la
   tienda con el dedo: lo que se toca mide al menos 44 px, en un teléfono de 320 px nada ensancha la
   página, apaisado lo fijo no se come la pantalla, y nada queda debajo de la muesca. */

/* Con viewport-fit=cover la página llega hasta los bordes: apaisado, que nada quede bajo la muesca */
body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }

/* El buscador de la portada: toda la caja es el campo (antes solo se podía tocar la línea del texto).
   El campo ocupa la caja entera y deja sitio, con su relleno, al dibujo y al rótulo. */
.nt-busca__campo { grid-template-rows: auto 1.59375rem; }
.nt-busca__campo > .nt-icono, .nt-busca__campo label { pointer-events: none; }
.nt-busca__campo input, .nt-busca__campo select { position: absolute; inset: 0; height: 100%; padding: 1.475rem 1rem .5rem 3.375rem; border-radius: inherit; }

/* Al tocar, un botón no se queda «levantado» como si el ratón siguiera encima */
@media (hover: none) {
    .nt-boton--primario:hover, .nt-boton--comprar:hover, .nt-boton--blanco:hover, .nt-chat__boton:hover { transform: none; }
}

@media (pointer: coarse), (max-width: 56rem) {
    .nt-boton--s, .nt-copiar, .nt-linea__quitar, .nt-enlace, .nt-chat__ideas button, .nt-desplegable > summary, .nt-legal__indice a { min-height: 2.75rem; }
    .nt-legal__indice a { display: inline-flex; align-items: center; }
    .nt-copiar { padding-inline: 1rem; }
    .nt-linea__quitar { padding-inline: .5rem; }
    .nt-logo { display: grid; align-content: center; min-height: 2.75rem; }
    .nt-migas { gap: 0 .125rem; padding-block: .625rem; }
    .nt-migas a { align-items: center; justify-content: center; min-width: 2.75rem; min-height: 2.75rem; }
    .nt-unidades button { width: 2.75rem; height: 2.75rem; }
    .nt-casilla { min-height: 2.75rem; align-content: center; }
    .nt-pie ul { gap: 0; }
    .nt-pie li > a { display: flex; align-items: center; min-height: 2.75rem; }
}

@media (max-width: 40rem) {
    /* El botón del asistente flota abajo a la derecha: las últimas líneas del pie le dejan sitio */
    .nt-pie__final { padding-right: 4.5rem; }
    /* En el propio teléfono no se puede apuntar la cámara a la pantalla: primero, instalarla aquí */
    .nt-instalar__aqui { order: -1; }
}

/* En un teléfono de 360 px o menos, la línea de la cesta no cabe en una fila (los botones de las
   unidades miden ya 44 px): el precio baja a su propia línea */
@media (max-width: 23.4rem) {
    .nt-linea__cuenta { grid-template-columns: auto 1fr; row-gap: .5rem; }
    .nt-linea__precio { grid-column: 1 / -1; }
}

/* Teléfonos estrechos (320 px): la cabecera cabe entera y nada ensancha la página */
@media (max-width: 22.4rem) {
    .nt-cabecera__fila { gap: .5rem; }
    .nt-cabecera__lado { gap: .125rem; }
    .nt-logo img { width: 124px; }
    .nt-modos button { gap: .375rem; padding-inline: .5rem; font-size: .875rem; }
    .nt-linea__cuenta { gap: .25rem; }
    .nt-linea__precio { font-size: 1.125rem; }
}

/* El teléfono apaisado: poco alto. La cabecera no acompaña, la barra de compra adelgaza y el botón
   del asistente se queda en su círculo. */
@media (orientation: landscape) and (max-height: 30rem) {
    .nt-cabecera { position: static; }
    .nt-barra { padding: .5rem max(1.25rem, env(safe-area-inset-right)) calc(.5rem + env(safe-area-inset-bottom)) max(1.25rem, env(safe-area-inset-left)); }
    .nt-barra__total strong { font-size: 1.375rem; }
    .nt-barra__boton { min-height: 2.75rem; }
    .nt--destino .nt-pie { padding-bottom: 5.5rem; }
    .nt-chat { right: max(1rem, env(safe-area-inset-right)); bottom: calc(1rem + env(safe-area-inset-bottom)); }
    .nt--destino .nt-chat { bottom: calc(4.75rem + env(safe-area-inset-bottom)); }
    .nt-chat__boton { justify-content: center; width: 3.5rem; min-height: 3.5rem; padding: 0; }
    .nt-chat__boton span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

/* Instalar la eSIM en el mismo teléfono desde el que se mira */
.nt-instalar__aqui { display: grid; justify-items: center; gap: .625rem; width: 100%; padding: 1rem; border: 1px dashed var(--nt-raya-marca); border-radius: var(--nt-radio-m); background: var(--nt-lavado); }
.nt-instalar__aqui .nt-boton { width: 100%; padding-inline: 1rem; }
.nt-instalar__aqui p { color: var(--bv-morado-texto); font-size: .875rem; line-height: 1.45; }