/* =====================================================================
   OPCIÓN 1 · «Precisión» (estilo Stripe)
   ===================================================================== */
.n {
    --c-bg: #ffffff;
    --c-ink: #0A2A36;
    --c-muted: #4F6B77;
    --c-line: #E1E9EC;
    --c-soft: #F5F8F9;
    --c-accent: #083646;
    --f-sans: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --sombra: 0 30px 60px -12px rgba(8, 54, 70, .22), 0 18px 36px -18px rgba(0, 0, 0, .28);
    --sombra-s: 0 13px 27px -5px rgba(8, 54, 70, .16), 0 8px 16px -8px rgba(0, 0, 0, .18);
    font-feature-settings: 'ss01', 'cv05';
}

/* ── Botones ────────────────────────────────────────────────────────── */
.n .btn--oscuro { --bg: #083646; --fg: #fff; box-shadow: 0 6px 20px -8px rgba(8, 54, 70, .6); }
.n .btn--oscuro:hover { --bg: #0A4457; box-shadow: 0 12px 28px -10px rgba(8, 54, 70, .7); }
.n .btn--vidrio { --bg: rgba(255, 255, 255, .62); --fg: #083646; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px rgba(8, 54, 70, .12); }
.n .btn--vidrio:hover { --bg: rgba(255, 255, 255, .9); }
.n .btn--sm { padding: .62em 1.05em; font-size: .88rem; }

/* ── Tipografía ─────────────────────────────────────────────────────── */
.n-kicker { display: inline-flex; align-items: center; gap: 8px; color: #0E7C86; font-weight: 700; font-size: .82rem; letter-spacing: .02em; margin-bottom: 14px; }
.n-kicker::before { content: ''; width: 18px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #0E7C86, #3FC6D4); }
.n-h1 { font-size: clamp(2.5rem, 6.2vw, 4.6rem); line-height: 1.02; letter-spacing: -.045em; font-weight: 800; color: #062A37; max-width: 12ch; }
.n-h2 { font-size: clamp(1.9rem, 3.8vw, 3rem); line-height: 1.08; letter-spacing: -.035em; font-weight: 800; max-width: 20ch; }
.n-lead { font-size: clamp(1.05rem, 1.5vw, 1.22rem); line-height: 1.6; color: #34525E; max-width: 34em; margin-top: 22px; }
.n-sub { color: var(--c-muted); font-size: 1.06rem; max-width: 40em; margin-top: 16px; }
.n-titular { margin-bottom: clamp(36px, 5vw, 60px); }
.n-titular--centro { text-align: center; }
.n-titular--centro .n-h2 { margin-inline: auto; }
.n-titular--fila { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.n-titular--claro .n-h2 { color: #fff; }
.n-titular--claro .n-kicker { color: #7FDCE6; }
.n-enlace { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: #083646; text-decoration: none; }
.n-enlace:hover .ico { transform: translateX(3px); }
.n-enlace .ico { transition: transform .3s var(--ease); }

.n-sec { padding-block: clamp(80px, 11vw, 140px); position: relative; }
.n-sec--gris { background: var(--c-soft); }

/* ── Cabecera ───────────────────────────────────────────────────────── */
.n-head { position: fixed; inset: 0 0 auto; z-index: 100; transition: background .3s, box-shadow .3s, backdrop-filter .3s; }
.n-head.is-scrolled { background: rgba(255, 255, 255, .82); backdrop-filter: saturate(1.6) blur(14px); -webkit-backdrop-filter: saturate(1.6) blur(14px); box-shadow: 0 1px 0 rgba(8, 54, 70, .08); }
.n-head__in { display: flex; align-items: center; gap: 28px; height: 76px; }
.n-marca img { width: 168px; height: auto; }
.n-nav { display: flex; gap: 4px; margin-left: auto; }
.n-nav a { padding: 8px 14px; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .93rem; color: #0A2A36; transition: background .2s, color .2s; }
.n-nav a:hover { background: rgba(8, 54, 70, .06); }
.n-nav__movil { display: none; }
.n-head__cta { display: flex; align-items: center; gap: 16px; }
.n-head__tel { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: .92rem; text-decoration: none; color: #083646; }
.n-burger { display: none; width: 44px; height: 44px; border: 0; background: transparent; position: relative; cursor: pointer; }
.n-burger span { position: absolute; left: 11px; right: 11px; height: 2px; border-radius: 2px; background: #083646; transition: transform .35s var(--ease), top .35s var(--ease); }
.n-burger span:first-child { top: 17px; } .n-burger span:last-child { top: 25px; }
.menu-abierto .n-burger span:first-child { top: 21px; transform: rotate(45deg); }
.menu-abierto .n-burger span:last-child { top: 21px; transform: rotate(-45deg); }

/* ── Hero ───────────────────────────────────────────────────────────── */
.n-hero { position: relative; padding: 150px 0 clamp(120px, 14vw, 190px); isolation: isolate; }
.n-hero__fondo {
    position: absolute; inset: 0 0 0 0; z-index: -1; overflow: hidden;
    clip-path: polygon(0 0, 100% 0, 100% 74%, 0 100%);
    background: linear-gradient(120deg, #BFE7EC, #3FC6D4 40%, #0E7C86 70%, #083646);
}
.n-hero__fondo canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1.4s var(--ease); }
.n-hero__fondo canvas.listo { opacity: 1; }
.n-hero__lavado { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 32%, rgba(255,255,255,0) 62%); }
.n-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: center; }
.n-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.n-garantias { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 30px; padding: 0; list-style: none; font-weight: 600; font-size: .9rem; color: #2E4C57; }
.n-garantias li { display: inline-flex; align-items: center; gap: 7px; }
.n-garantias .ico { color: #0E7C86; width: 18px; height: 18px; }



/* ── Banda oscura ───────────────────────────────────────────────────── */
.n-oscura { position: relative; padding-block: clamp(90px, 12vw, 150px); background: #062833; color: #D3E3E8; overflow: hidden; isolation: isolate; }
.n-oscura::before { content: ''; position: absolute; inset: -40% -10% auto auto; width: 70%; aspect-ratio: 1; z-index: -1; background: radial-gradient(closest-side, rgba(63, 198, 212, .22), transparent); }
.n-oscura__lineas { position: absolute; inset: 0; z-index: -1; display: flex; justify-content: space-evenly; pointer-events: none; }
.n-oscura__lineas span { width: 1px; height: 100%; background: rgba(255, 255, 255, .06); position: relative; overflow: hidden; }
.n-oscura__lineas span::after { content: ''; position: absolute; left: 0; width: 1px; height: 120px; top: -120px; background: linear-gradient(transparent, #3FC6D4); animation: nLluvia 6s linear infinite; }
.n-oscura__lineas span:nth-child(2)::after { animation-delay: -1.5s; } .n-oscura__lineas span:nth-child(3)::after { animation-delay: -3.2s; } .n-oscura__lineas span:nth-child(4)::after { animation-delay: -4.6s; }
@keyframes nLluvia { to { top: 110%; } }
.n-porque { display: grid; grid-template-columns: repeat(4, 1fr); gap: 36px; }
.n-porque__item { padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .14); position: relative; }
.n-porque__item::before { content: ''; position: absolute; top: -1px; left: 0; width: 0; height: 1px; background: #3FC6D4; transition: width 1.2s var(--ease) .3s; }
.n-porque__item.is-in::before { width: 42px; }
.n-porque__item .ico { width: 26px; height: 26px; color: #7FDCE6; }
.n-porque__item h3 { color: #fff; font-size: 1.08rem; margin-top: 16px; }
.n-porque__item p { font-size: .93rem; margin-top: 8px; color: #9FB8C0; }

/* ── Método ─────────────────────────────────────────────────────────── */
.n-pasos { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; padding: 0; margin: 0; list-style: none; --p: 0; }
.n-pasos__linea { position: absolute; left: 4%; right: 4%; top: 27px; height: 2px; background: var(--c-line); border-radius: 2px; }
.n-pasos__linea span { position: absolute; inset: 0; background: linear-gradient(90deg, #083646, #0E7C86, #3FC6D4); transform-origin: left; transform: scaleX(var(--p)); border-radius: inherit; }
.n-paso { position: relative; text-align: center; }
.n-paso__num { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 20px; border-radius: 50%; background: #fff; border: 2px solid var(--c-line); font-weight: 800; color: #083646; position: relative; z-index: 1; transition: border-color .4s, box-shadow .4s, background .4s, color .4s; }
.n-paso.is-in .n-paso__num { border-color: #0E7C86; box-shadow: 0 0 0 6px rgba(63, 198, 212, .16); }
.n-paso h3 { font-size: 1.02rem; }
.n-paso p { font-size: .9rem; color: var(--c-muted); margin-top: 8px; }

/* ── Sectores ───────────────────────────────────────────────────────── */
.n-sectores { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.n-sector {
    --mx: 50%; --my: 50%; --rx: 0deg; --ry: 0deg;
    position: relative; padding: 28px; border-radius: 20px; background: #fff; border: 1px solid var(--c-line);
    transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));
    transition: transform .4s var(--ease), box-shadow .4s; overflow: hidden;
}
.n-sector::before { content: ''; position: absolute; inset: 0; opacity: 0; transition: opacity .3s; background: radial-gradient(380px circle at var(--mx) var(--my), rgba(14, 124, 134, .1), transparent 60%); pointer-events: none; }
.n-sector:hover { box-shadow: var(--sombra-s); }
.n-sector:hover::before { opacity: 1; }
.n-sector__ico { width: 30px; height: 30px; color: #0E7C86; }
.n-sector h3 { font-size: 1.12rem; margin-top: 18px; }
.n-sector > p { color: var(--c-muted); font-size: .93rem; margin-top: 8px; }
.n-sector ul { list-style: none; padding: 16px 0 0; margin: 18px 0 0; border-top: 1px dashed var(--c-line); display: grid; gap: 8px; }
.n-sector li { display: flex; gap: 8px; align-items: center; font-size: .84rem; font-weight: 600; color: #22434F; }
.n-sector li .ico { width: 14px; height: 14px; color: #0E7C86; }

/* ── Zona ───────────────────────────────────────────────────────────── */
.n-zona { display: grid; grid-template-columns: 1fr 1.05fr; gap: 56px; align-items: center; }
.n-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; padding: 0; list-style: none; }
.n-chips li { font-size: .82rem; font-weight: 600; padding: 7px 12px; border-radius: 999px; background: var(--c-soft); border: 1px solid var(--c-line); }
.n-chips li:has(> a) { padding: 0; }
.n-chips li > a { display: block; padding: 7px 12px; border-radius: inherit; color: inherit; text-decoration: none; transition: border-color .2s, color .2s; }
.n-chips li > a:hover { color: var(--c-accent); text-decoration: underline; text-underline-offset: .2em; }
.n-mapa { border-radius: 24px; overflow: hidden; background: #fff; border: 1px solid var(--c-line); box-shadow: var(--sombra-s); }
.n-mapa svg { width: 100%; height: auto; }
.n-mapa__onda { fill: none; stroke: #3FC6D4; stroke-width: 1; opacity: 0; transform-box: fill-box; transform-origin: center; animation: nOnda 4.5s var(--ease) infinite; animation-delay: calc(var(--k) * 1.5s); }
@keyframes nOnda { 0% { opacity: .7; transform: scale(.2); } 100% { opacity: 0; transform: scale(1.3); } }
.n-mapa__enlace { stroke: #0E7C86; stroke-width: 1; stroke-opacity: .35; stroke-dasharray: 400; stroke-dashoffset: 400; }
.n-mapa.is-in .n-mapa__enlace { transition: stroke-dashoffset 1.6s var(--ease); transition-delay: calc(var(--k) * 60ms + 300ms); stroke-dashoffset: 0; }
.n-mapa__nodo circle { fill: #0E7C86; stroke: #fff; stroke-width: 2; }
.n-mapa__nodo.es-principal circle { fill: #083646; }
.n-mapa__nodo text { font: 700 11px var(--f-sans); fill: #22434F; paint-order: stroke; stroke: #fff; stroke-width: 3px; }
.n-mapa__nodo.es-principal text { font-size: 13px; fill: #083646; }
.js .n-mapa__nodo { transition: opacity .6s; transition-delay: calc(var(--k) * 60ms + 600ms); }
.js .n-mapa.rv:not(.is-in) .n-mapa__nodo { opacity: 0; }
.n-mapa.is-in .n-mapa__nodo { opacity: 1; }

/* ── Blog ───────────────────────────────────────────────────────────── */
.n-blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.n-post { display: block; text-decoration: none; padding: 14px 14px 22px; border-radius: 20px; border: 1px solid var(--c-line); background: #fff; transition: transform .45s var(--ease), box-shadow .45s; }
a.n-post:hover { transform: translateY(-5px); box-shadow: var(--sombra-s); }
.n-post__img { aspect-ratio: 16 / 10; border-radius: 12px; overflow: hidden; background: linear-gradient(135deg, #083646, #0E7C86 55%, #3FC6D4); display: grid; place-items: center; margin-bottom: 18px; }
.n-post__img img { width: 100%; height: 100%; object-fit: cover; }
.n-post__img .ico { width: 64px; height: 64px; color: rgba(255, 255, 255, .5); }
.n-post__meta { font-size: .76rem; font-weight: 700; color: #0E7C86; padding-inline: 6px; }
.n-post h3 { font-size: 1.08rem; line-height: 1.35; margin-top: 8px; padding-inline: 6px; letter-spacing: -.01em; }
.n-post > p:last-child { color: var(--c-muted); font-size: .9rem; margin-top: 8px; padding-inline: 6px; }

/* ── FAQ ────────────────────────────────────────────────────────────── */
.n-faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: 60px; align-items: start; }
.n-faq__intro { position: sticky; top: 110px; }
.n-faq__intro .btn { margin-top: 28px; }
.n-acordeon { display: grid; gap: 10px; }
.n-acordeon__item { border-radius: 16px; background: #fff; border: 1px solid var(--c-line); transition: box-shadow .3s, border-color .3s; }
.n-acordeon__item[open], .n-acordeon__item.abierto { box-shadow: var(--sombra-s); border-color: transparent; }
.n-acordeon__item summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px; }
.n-acordeon__item h3 { font-size: 1rem; font-weight: 700; }
.n-acordeon__mas { position: relative; flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--c-soft); }
.n-acordeon__mas::before, .n-acordeon__mas::after { content: ''; position: absolute; left: 50%; top: 50%; width: 11px; height: 2px; margin: -1px 0 0 -5.5px; background: #083646; border-radius: 2px; transition: transform .35s var(--ease); }
.n-acordeon__mas::after { transform: rotate(90deg); }
.n-acordeon__item[open] .n-acordeon__mas::after { transform: rotate(0); }
.acordeon__cuerpo { overflow: hidden; transition: height .38s var(--ease); }
.n-acordeon__item .acordeon__cuerpo p { padding: 0 22px 22px; color: var(--c-muted); font-size: .95rem; }

/* ── CTA / contacto ─────────────────────────────────────────────────── */
.n-cta {
    display: grid; grid-template-columns: .9fr 1.1fr; gap: 48px; padding: clamp(28px, 5vw, 56px); border-radius: 28px;
    background: radial-gradient(900px 400px at 0% 0%, rgba(63, 198, 212, .28), transparent 60%), linear-gradient(135deg, #062833, #083646 50%, #0B4A5E);
    color: #CFE1E6; position: relative; overflow: hidden;
}
.n-cta .n-h2 { color: #fff; }
.n-cta .n-kicker { color: #7FDCE6; }
.n-cta__texto > p:not(.n-kicker) { margin-top: 16px; color: #A9C3CB; }
.n-cta__canales { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 12px; font-size: .95rem; }
.n-cta__canales li { display: flex; align-items: center; gap: 10px; }
.n-cta__canales a { color: #fff; font-weight: 700; text-decoration: none; }
.n-cta__canales .ico { color: #7FDCE6; }
.n-cta__form { background: #fff; color: var(--c-ink); border-radius: 20px; padding: clamp(20px, 3vw, 32px); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .5); }

/* ── Pie ────────────────────────────────────────────────────────────── */
.n-pie { background: var(--c-soft); border-top: 1px solid var(--c-line); padding: 72px 0 28px; font-size: .92rem; }
.n-pie__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; }
.n-pie__marca img { width: 180px; }
.n-pie__marca p { color: var(--c-muted); margin-top: 16px; max-width: 30ch; }
.n-pie__t { font-weight: 800; font-size: .82rem; letter-spacing: .06em; text-transform: uppercase; color: #083646; margin-bottom: 14px; }
.n-pie ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; }
.n-pie a { text-decoration: none; color: #34525E; transition: color .2s; }
.n-pie a:hover { color: #083646; }
.n-pie__nap { font-style: normal; display: grid; gap: 7px; color: #34525E; }
.n-pie__legal { display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; justify-content: space-between; margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--c-line); font-size: .82rem; color: #587280; }
.n-pie__legal nav { display: flex; flex-wrap: wrap; gap: 18px; }
.n-pie__vloop strong { color: #083646; }

/* ── Responsive ─────────────────────────────────────────────────────── */
@media (max-width: 1020px) {
    .n-hero__grid, .n-zona, .n-faq, .n-cta { grid-template-columns: 1fr; }
    .n-hero__visual { height: 440px; max-width: 560px; }
    .n-hero__lavado { background: linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.86) 48%, rgba(255,255,255,.1) 78%); }
    /* El velo se desvanece antes de las garantías: cada una lleva fondo propio para leerse sobre el degradado. */
    .n-garantias { gap: 8px; }
    .n-garantias li { padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.9); box-shadow: 0 2px 10px -4px rgba(8, 54, 70, .25); }
    .n-faq__intro { position: static; }
    .n-porque { grid-template-columns: repeat(2, 1fr); }
    .n-pasos { grid-template-columns: 1fr; gap: 28px; }
    .n-pasos__linea { left: 27px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; }
    .n-pasos__linea span { transform: scaleY(var(--p)); transform-origin: top; }
    .n-paso { text-align: left; padding-left: 80px; min-height: 56px; }
    .n-paso__num { position: absolute; left: 0; top: -4px; margin: 0; }
    .n-pie__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    .n-nav { position: fixed; inset: 76px 0 auto; flex-direction: column; gap: 0; padding: 12px var(--gutter) 24px; background: #fff; box-shadow: 0 20px 40px -20px rgba(8, 54, 70, .3); transform: translateY(-12px); opacity: 0; visibility: hidden; transition: all .35s var(--ease); }
    .menu-abierto .n-nav { transform: none; opacity: 1; visibility: visible; }
    .menu-abierto .n-head { background: #fff; }
    .n-nav a { padding: 14px 4px; border-radius: 0; border-bottom: 1px solid var(--c-line); font-size: 1.05rem; }
    .n-nav__movil { display: block; color: #0E7C86 !important; }
    .n-burger { display: block; margin-left: auto; }
    .n-head__cta { display: none; }
    .n-bento, .n-sectores, .n-blog__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
    .n-hero { padding-top: 120px; }
    .n-bento, .n-sectores, .n-blog__grid, .n-porque, .n-pie__grid { grid-template-columns: 1fr; }
    .n-marca img { width: 140px; }
}
/* =====================================================================
   OPCIÓN 4 · «Síntesis»: se carga DESPUÉS de home-1.css y solo añade
   lo nuevo (índice de servicios con fotos, sectores en horizontal con
   fotos, mapa de zona limpio). Mismo lenguaje visual que la opción 1.
   ===================================================================== */

/* Cabecera legible desde el primer píxel (el degradado es oscuro a la derecha) */
.n .n-head { background: rgba(255, 255, 255, .78); backdrop-filter: saturate(1.6) blur(14px); -webkit-backdrop-filter: saturate(1.6) blur(14px); box-shadow: 0 1px 0 rgba(8, 54, 70, .06); }

/* ── Servicios: índice con número fijo y foto por área ──────────────── */
.n-indice { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: start; }
.n-indice__fijo { position: sticky; top: 110px; }
.n-indice__fotos { position: relative; aspect-ratio: 4 / 4.6; border-radius: 24px; overflow: hidden; background: #062833; box-shadow: var(--sombra); isolation: isolate; }
.n-indice__foto { position: absolute; inset: 0; opacity: 0; transform: scale(1.06); transition: opacity .8s var(--ease), transform 1.4s var(--ease); }
.n-indice__foto.activa { opacity: 1; transform: none; }
.n-indice__foto img { width: 100%; height: 100%; object-fit: cover; }
.n-indice__fotos::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(6, 40, 51, 0) 35%, rgba(6, 40, 51, .88)); pointer-events: none; }
.n-indice__cartela { position: absolute; left: 28px; right: 28px; bottom: 26px; z-index: 2; color: #fff; }
.n-indice__num { font-weight: 300; font-size: clamp(2.4rem, 3.6vw, 3.2rem); line-height: 1; letter-spacing: -.04em; }
.n-indice__num span { display: inline-block; color: #fff; transition: opacity .3s, transform .5s var(--ease); }
.n-indice__num span.cambia { opacity: 0; transform: translateY(16px); }
.n-indice__nombre { font-weight: 600; font-size: 1.1rem; letter-spacing: -.01em; margin-top: 6px; transition: opacity .3s; }

.n-indice__lista { margin: 0; padding: 0; list-style: none; border-top: 2px solid #083646; }
.n-area { padding: 30px 0 32px; border-bottom: 1px solid var(--c-line); opacity: .42; transition: opacity .5s var(--ease); }
.n-area.activa { opacity: 1; }
.n-area__movil { display: none; }
.n-area__cab { display: flex; align-items: center; gap: 14px; }
.n-area__n { font-family: var(--f-mono); font-size: .76rem; font-weight: 600; color: #0E7C86; }
.n-area h3 { font-size: clamp(1.35rem, 2.2vw, 1.75rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.15; }
.n-area__txt { color: var(--c-muted); margin: 12px 0 0; max-width: 48ch; }
.n-area ul { list-style: none; padding: 0; margin: 18px 0 0; }
.n-area li { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 11px 0; border-top: 1px dashed var(--c-line); font-size: .94rem; font-weight: 600; color: #22434F; }
.n-area li em { flex: none; font-style: normal; font-family: var(--f-mono); font-size: .72rem; font-weight: 500; color: #0E5E66; background: #EAF6F7; padding: 3px 8px; border-radius: 6px; }

/* ── Para quién trabajamos: scroll horizontal fijado ────────────────── */
.n-horiz { height: 320vh; position: relative; background: var(--c-soft); --p: 0; }
.n-horiz__fijo { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; justify-content: center; overflow: hidden; padding-top: 40px; }
.n-horiz__cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 40px; }
.n-horiz__pista-txt { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: .85rem; color: #0E7C86; }
.n-horiz__pista-txt .ico { animation: nEmpuja 1.6s var(--ease) infinite; }
@keyframes nEmpuja { 50% { transform: translateX(6px); } }
.n-horiz__pista { display: flex; gap: 20px; width: max-content; padding-inline: max(var(--gutter), calc((100vw - var(--wrap)) / 2 + var(--gutter))); transform: translateX(calc(var(--p) * (100vw - 100%))); will-change: transform; }
.n-tarjeta { width: min(380px, 80vw); flex: none; display: flex; flex-direction: column; border-radius: 22px; background: #fff; border: 1px solid var(--c-line); overflow: hidden; transition: box-shadow .45s var(--ease), transform .45s var(--ease); }
.n-tarjeta:hover { transform: translateY(-6px); box-shadow: var(--sombra-s); }
.n-tarjeta__foto { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #E7EEF0; }
.n-tarjeta__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.n-tarjeta:hover .n-tarjeta__foto img { transform: scale(1.06); }
.n-tarjeta__n { position: absolute; left: 16px; top: 14px; font-weight: 800; font-size: .8rem; color: #fff; padding: 5px 10px; border-radius: 999px; background: rgba(6, 40, 51, .55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.n-tarjeta__cuerpo { padding: 24px 24px 26px; display: flex; flex-direction: column; flex: 1; }
.n-tarjeta__ico { width: 28px; height: 28px; color: #0E7C86; }
.n-tarjeta h3 { font-size: 1.2rem; font-weight: 800; letter-spacing: -.02em; margin-top: 14px; }
.n-tarjeta p { color: var(--c-muted); font-size: .93rem; margin-top: 8px; }
.n-tarjeta ul { list-style: none; padding: 16px 0 0; margin: 18px 0 0; border-top: 1px dashed var(--c-line); display: grid; gap: 8px; }
.n-tarjeta li { display: flex; align-items: center; gap: 8px; font-size: .84rem; font-weight: 600; color: #22434F; }
.n-tarjeta li .ico { width: 14px; height: 14px; color: #0E7C86; }
.n-horiz__barra { height: 3px; border-radius: 3px; background: var(--c-line); margin-top: 36px; overflow: hidden; }
.n-horiz__barra span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #083646, #0E7C86, #3FC6D4); transform-origin: left; transform: scaleX(var(--p)); }

/* ── Zona: mapa de la opción 1, sobre fondo liso y sin ondas animadas ── */
.n-mapa svg { background: #fff; }
/* Relieve: contorno y Guadalquivir muy suaves; sin etiquetas, solo Sevilla
   destacada en azul y puntos mínimos al final de cada línea */
.n-mapa__provincia { fill: none; stroke: #9FB7BF; stroke-width: 1; stroke-linejoin: round; }
.n-mapa__rio { fill: none; stroke: #8FD0D8; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; opacity: .8; }
.n-mapa__nodo circle { fill: #0E7C86; stroke: none; opacity: .55; }
.n-mapa__nodo.es-principal circle { fill: #1593A8; stroke: #fff; stroke-width: 1.25; opacity: 1; }

/* ── Blog: las fotos cubren la cabecera de la tarjeta ───────────────── */
.n .n-post__img { background: #E7EEF0; }
.n .n-post__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.n .n-post:hover .n-post__img img { transform: scale(1.05); }

/* ── Responsive ─────────────────────────────────────────────────────── */
@media (max-width: 1020px) {
    .n-indice { grid-template-columns: 1fr; gap: 0; }
    .n-indice__fijo { display: none; }
    .n-area { opacity: 1; }
    .n-area__movil { display: block; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; margin-bottom: 20px; }
    .n-area__movil img { width: 100%; height: 100%; object-fit: cover; }
    /* Sectores: carrusel nativo con scroll-snap en lugar del scroll fijado */
    .n-horiz { height: auto; padding-block: 90px; }
    .n-horiz__fijo { position: static; height: auto; padding-top: 0; }
    .n-horiz__pista { transform: none !important; width: auto; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px; scrollbar-width: none; }
    .n-horiz__pista::-webkit-scrollbar { display: none; }
    .n-tarjeta { scroll-snap-align: start; }
    .n-horiz__barra { display: none; }
}
@media (max-width: 620px) {
    .n-area li { flex-direction: column; align-items: flex-start; gap: 6px; }
}

/* =====================================================================
   SITIO COMPLETO · componentes de páginas interiores (fase 2)
   ===================================================================== */

/* ── Cabecera: enlace activo y megamenú de servicios ────────────────── */
.n-nav a.es-actual { color: #083646; background: rgba(8, 54, 70, .07); }
.n-nav__grupo { position: relative; }
.n-nav__disparador { display: inline-flex; align-items: center; gap: 6px; }
.n-nav__flecha { width: 13px; height: 13px; transform: rotate(90deg); transition: transform .3s var(--ease); }
.n-mega { position: absolute; left: 50%; top: calc(100% + 12px); width: min(980px, 92vw); transform: translate(-44%, 8px); opacity: 0; visibility: hidden; transition: opacity .25s, transform .35s var(--ease), visibility .25s; z-index: 120; }
.n-mega::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.n-mega__in { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px 26px; padding: 26px 28px; border-radius: 20px; background: #fff; border: 1px solid var(--c-line); box-shadow: var(--sombra); }
.n-nav__grupo:hover .n-mega, .n-nav__grupo:focus-within .n-mega, .n-nav__grupo.abierto .n-mega { opacity: 1; visibility: visible; transform: translate(-44%, 0); }
.n-nav__grupo:hover .n-nav__flecha, .n-nav__grupo:focus-within .n-nav__flecha { transform: rotate(-90deg); }
.n-mega__t { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: .8rem; color: #0E7C86; margin-bottom: 8px; }
.n-mega__t .ico { width: 16px; height: 16px; }
.n-mega ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.n .n-mega a { display: block; padding: 5px 8px; margin-left: -8px; border-radius: 8px; font-size: .86rem; font-weight: 600; color: #22434F; line-height: 1.35; }
.n .n-mega a:hover { background: var(--c-soft); color: #083646; }
.n .n-mega .n-mega__todos { grid-column: 1 / -1; justify-self: start; display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 0; padding: 8px 14px; border-radius: 999px; background: #083646; color: #fff; font-weight: 700; }
.n .n-mega .n-mega__todos:hover { background: #0A4457; color: #fff; }

/* ── Botón flotante de WhatsApp ─────────────────────────────────────── */
.n-wa { position: fixed; right: 20px; bottom: 20px; z-index: 850; display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px 12px 14px; border-radius: 999px; background: #25D366; color: #fff; font-weight: 800; font-size: .92rem; text-decoration: none; box-shadow: 0 14px 30px -10px rgba(18, 140, 70, .6); transition: transform .35s var(--ease), box-shadow .35s; }
.n-wa .ico { width: 24px; height: 24px; }
.n-wa:hover { transform: translateY(-3px); box-shadow: 0 20px 36px -12px rgba(18, 140, 70, .7); }
body:has(.cookies:not([hidden])) .n-wa { bottom: 150px; }

/* ── Pie: newsletter ────────────────────────────────────────────────── */
.n-pie__boletin { display: grid; grid-template-columns: 1fr 1.1fr; gap: 32px; align-items: center; padding: 28px 32px; margin-bottom: 56px; border-radius: 22px; background: #fff; border: 1px solid var(--c-line); }
.n-pie__boletin-t { font-weight: 800; font-size: 1.15rem; color: #083646; letter-spacing: -.02em; }
.n-pie__boletin > div p:not(.n-pie__boletin-t) { color: var(--c-muted); margin-top: 6px; }
.n-pie__boletin-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.n-pie__boletin-form input[type="email"] { width: 100%; padding: .8em 1em; border-radius: 999px; border: 1px solid var(--c-line); background: var(--c-soft); }
.n-pie__boletin-form input[type="email"]:focus { outline: none; border-color: var(--c-focus); box-shadow: 0 0 0 4px rgba(63, 198, 212, .2); background: #fff; }
.n-pie__boletin-legal { grid-column: 1 / -1; font-size: .76rem; color: var(--c-muted); }
.n .n-pie__boletin-legal a { text-decoration: underline; }
.n-pie__boletin-ok { display: flex; align-items: center; gap: 10px; font-weight: 700; color: #0E7C86; }

/* ── Cabecera de página interior y migas ────────────────────────────── */
.n-pagcab { position: relative; padding: 132px 0 56px; overflow: hidden; isolation: isolate; }
.n-pagcab__fondo { position: absolute; inset: 0; z-index: -1; background:
    radial-gradient(900px 380px at 100% 0%, rgba(63, 198, 212, .22), transparent 60%),
    radial-gradient(700px 300px at 0% 0%, rgba(14, 124, 134, .10), transparent 60%),
    linear-gradient(180deg, #F3F9FA, #fff); }
.n-pagcab__fondo::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--c-line), transparent); }
.n-pagcab__h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 800; color: #062A37; max-width: 22ch; }
.n-pagcab__lead { font-size: clamp(1.02rem, 1.4vw, 1.15rem); color: #34525E; max-width: 46em; margin-top: 18px; }
.n-pagcab__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.n-pagcab .n-kicker a { color: inherit; text-decoration: none; }
.n-migas { margin-bottom: 22px; }
.n-migas ol { display: flex; flex-wrap: wrap; gap: 4px 0; list-style: none; padding: 0; margin: 0; font-size: .82rem; color: #587280; }
.n-migas li + li::before { content: "/"; margin: 0 8px; color: #B6C7CD; }
.n-migas a { color: #34525E; text-decoration: none; }
.n-migas a:hover { color: #083646; text-decoration: underline; }
.n-sec--ajustada { padding-top: clamp(48px, 6vw, 72px); }
.n-h3 { font-size: clamp(1.35rem, 2.2vw, 1.7rem); line-height: 1.2; letter-spacing: -.025em; font-weight: 800; color: #062A37; }

/* ── Prosa (textos largos, blog y legales) ──────────────────────────── */
.n-prosa { font-size: 1.04rem; line-height: 1.75; color: #22434F; }
.n-prosa > * + * { margin-top: 1.05em; }
.n-prosa h2 { font-size: 1.55rem; line-height: 1.25; letter-spacing: -.02em; font-weight: 800; color: #062A37; margin-top: 1.9em; scroll-margin-top: 100px; }
.n-prosa h3 { font-size: 1.2rem; font-weight: 800; color: #062A37; margin-top: 1.6em; scroll-margin-top: 100px; }
.n-prosa ul, .n-prosa ol { padding-left: 1.3em; }
.n-prosa li + li { margin-top: .4em; }
.n-prosa a { color: #0E7C86; font-weight: 600; text-underline-offset: 3px; }
.n-prosa strong { color: #062A37; }
.n-prosa blockquote { margin: 1.6em 0; padding: 18px 22px; border-left: 3px solid #3FC6D4; background: var(--c-soft); border-radius: 0 12px 12px 0; }
.n-prosa img { border-radius: 14px; margin: 1.6em 0; }
.n-prosa table { width: 100%; border-collapse: collapse; font-size: .92rem; }
/* En móvil, las tablas anchas se desplazan dentro de su propio marco en vez de ensanchar la página. */
@media (max-width: 760px) {
    .n-prosa table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
    .n-prosa th, .n-prosa td { min-width: 150px; }
}
.n-prosa th, .n-prosa td { padding: 10px 12px; border-bottom: 1px solid var(--c-line); text-align: left; }
.n-prosa th { background: var(--c-soft); font-weight: 800; }
.n-prosa code { font-family: var(--f-mono); font-size: .88em; background: var(--c-soft); padding: 1px 6px; border-radius: 5px; }
.n-prosa--legal { max-width: 780px; }
.n-prosa--legal h2 { font-size: 1.25rem; }
.n-prosa__fecha { color: #587280; font-size: .88rem; margin-top: 2.4em !important; }

/* ── Página de servicio ─────────────────────────────────────────────── */
.n-serv { padding-top: clamp(48px, 6vw, 80px); }
.n-serv__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 64px; align-items: start; }
.n-serv__intro p:first-child { font-size: 1.12rem; color: #0A2A36; }
.n-serv__bloque { margin-top: 56px; }
.n-serv__bloque > .n-h3 { margin-bottom: 20px; }
.n-lista-check { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.n-lista-check li { display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; border-radius: 14px; background: var(--c-soft); font-weight: 600; font-size: .95rem; color: #22434F; }
.n-lista-check .ico { width: 20px; height: 20px; flex: none; margin-top: 2px; color: #fff; background: #0E7C86; border-radius: 50%; padding: 3px; }
.n-incluye { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--c-line); }
.n-incluye li { display: flex; gap: 18px; align-items: baseline; padding: 15px 0; border-bottom: 1px solid var(--c-line); font-weight: 600; color: #0A2A36; }
.n-incluye span { font-family: var(--f-mono); font-size: .78rem; color: #0E7C86; flex: none; }
.n-lista-doc { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.n-lista-doc li { display: flex; gap: 12px; align-items: center; color: #22434F; }
.n-lista-doc .ico { width: 20px; height: 20px; color: #0E7C86; flex: none; }
.n-nota { margin-top: 18px; padding: 14px 18px; border-radius: 12px; background: #EAF6F7; color: #22434F; font-size: .92rem; }
.n-mini-pasos { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.n-mini-pasos li { display: flex; gap: 16px; align-items: flex-start; }
.n-mini-pasos__n { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 2px solid #0E7C86; font-weight: 800; font-size: .85rem; color: #083646; }
.n-mini-pasos strong { display: block; color: #0A2A36; }
.n-mini-pasos p { color: var(--c-muted); font-size: .93rem; margin-top: 2px; }
.n-chips-norma { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.n-chips-norma li { font-family: var(--f-mono); font-size: .8rem; padding: 7px 12px; border-radius: 8px; background: #EAF6F7; color: #0E5E66; }
.n-serv__aside, .n-articulo__aside { align-self: stretch; }
.n-serv__pegajoso { position: sticky; top: 100px; display: grid; gap: 16px; }
.n-serv__foto { margin: 0; border-radius: 20px; overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--sombra-s); }
.n-serv__foto img { width: 100%; height: 100%; object-fit: cover; }
.n-serv__caja { padding: 24px; border-radius: 20px; color: #CFE1E6; background: radial-gradient(400px 200px at 0% 0%, rgba(63, 198, 212, .28), transparent 60%), linear-gradient(135deg, #062833, #083646); }
.n-serv__caja-t { font-weight: 800; font-size: 1.1rem; color: #fff; }
.n-serv__caja > p:not(.n-serv__caja-t) { font-size: .92rem; margin-top: 6px; }
.n-serv__caja > p.n-serv__precio { margin-top: 10px; font-size: 1rem; }
.n-serv__precio strong { font-size: 1.7rem; font-weight: 800; color: #fff; letter-spacing: -.01em; }
.n-serv__caja > p.n-serv__plazo { color: #7FDCE6; font-weight: 700; }
.n .n-serv__btn { --bg: #fff; --fg: #083646; width: 100%; margin-top: 18px; }
.n-serv__canales { list-style: none; padding: 0; margin: 16px 0 0; display: flex; gap: 18px; flex-wrap: wrap; }
.n-serv__canales a { display: inline-flex; align-items: center; gap: 7px; color: #fff; font-weight: 700; text-decoration: none; font-size: .92rem; }
.n-serv__canales .ico { color: #7FDCE6; }
.n-serv__para { padding: 20px 24px; border-radius: 20px; border: 1px solid var(--c-line); }
.n-serv__para .n-serv__caja-t { color: #083646; font-size: .82rem; letter-spacing: .06em; text-transform: uppercase; }
.n-serv__para ul { list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.n-serv__para li { font-size: .82rem; font-weight: 600; padding: 5px 10px; border-radius: 999px; background: var(--c-soft); }

/* Tarjetas de servicio (relacionados y hub) */
.n-tarjetas-serv { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.n-tarjeta-serv { display: flex; flex-direction: column; gap: 8px; padding: 24px; border-radius: 18px; background: #fff; border: 1px solid var(--c-line); text-decoration: none; transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .3s; }
.n-tarjeta-serv:hover { transform: translateY(-4px); box-shadow: var(--sombra-s); border-color: transparent; }
.n-tarjeta-serv__cat { font-size: .74rem; font-weight: 800; color: #0E7C86; letter-spacing: .02em; }
.n-tarjeta-serv h3 { font-size: 1.08rem; font-weight: 800; letter-spacing: -.015em; color: #0A2A36; line-height: 1.3; }
.n-tarjeta-serv p { color: var(--c-muted); font-size: .9rem; }
.n-tarjeta-serv__normas { list-style: none; padding: 0; margin: 4px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.n-tarjeta-serv__normas li { font-family: var(--f-mono); font-size: .7rem; padding: 3px 8px; border-radius: 6px; background: #EAF6F7; color: #0E5E66; }
.n-tarjeta-serv__mas { margin-top: auto; padding-top: 8px; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: .88rem; color: #083646; }
.n-tarjeta-serv__mas .ico { transition: transform .3s var(--ease); }
.n-tarjeta-serv:hover .n-tarjeta-serv__mas .ico { transform: translateX(4px); }

/* ── Hub de servicios ───────────────────────────────────────────────── */
.n-filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 44px; }
.n .n-filtros a { padding: 8px 15px; border-radius: 999px; border: 1px solid var(--c-line); background: #fff; font-weight: 700; font-size: .86rem; color: #22434F; text-decoration: none; transition: background .2s, color .2s, border-color .2s; }
.n .n-filtros a:hover { border-color: #0E7C86; color: #083646; }
.n .n-filtros a.activo { background: #083646; border-color: #083646; color: #fff; }
.n-bloque { padding-top: 56px; margin-top: 56px; border-top: 1px solid var(--c-line); scroll-margin-top: 90px; }
.n-filtros + .n-bloque { margin-top: 0; padding-top: 0; border-top: 0; }
.n-bloque__cab { display: grid; grid-template-columns: 340px 1fr; gap: 40px; align-items: center; margin-bottom: 28px; }
.n-bloque__foto { position: relative; margin: 0; aspect-ratio: 16 / 10; border-radius: 20px; overflow: hidden; }
.n-bloque__foto img { width: 100%; height: 100%; object-fit: cover; }
.n-bloque__n { position: absolute; left: 14px; top: 12px; font-weight: 300; font-size: 1.6rem; color: #fff; text-shadow: 0 2px 10px rgba(0, 0, 0, .35); }

/* ── Blog ───────────────────────────────────────────────────────────── */
.n-vacio { text-align: center; max-width: 560px; margin: 20px auto; padding: 48px 24px; border-radius: 22px; background: var(--c-soft); }
.n-vacio .ico { width: 40px; height: 40px; color: #0E7C86; margin: 0 auto 14px; }
.n-vacio h2 { font-size: 1.3rem; }
.n-vacio p { color: var(--c-muted); margin-top: 8px; }
.n-vacio a { color: #0E7C86; font-weight: 700; }
.n-paginacion { display: flex; justify-content: center; align-items: center; gap: 24px; margin-top: 44px; font-weight: 700; }
.n-paginacion a { color: #083646; text-decoration: none; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--c-line); }
.n-pagcab--articulo { padding-bottom: 40px; }
.n-articulo__cab .n-pagcab__h1 { max-width: 28ch; }
.n-articulo__meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 22px; font-size: .88rem; color: #587280; font-weight: 600; }
.n-articulo__meta > * + *::before { content: "·"; margin-right: 18px; color: #B6C7CD; }
.n-articulo__portada { margin: 0 auto; }
.n-articulo__portada img { width: 100%; aspect-ratio: 1200 / 630; object-fit: cover; border-radius: 22px; }
.n-articulo__grid { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: 56px; padding-block: 48px 90px; }
.n-indice-art { position: sticky; top: 100px; font-size: .86rem; }
.n-indice-art p { font-weight: 800; font-size: .76rem; letter-spacing: .06em; text-transform: uppercase; color: #083646; margin-bottom: 10px; }
.n-indice-art ol { list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--c-line); }
.n-indice-art a { display: block; padding: 6px 0 6px 14px; margin-left: -2px; border-left: 2px solid transparent; color: #4F6B77; text-decoration: none; line-height: 1.35; }
.n-indice-art a:hover { color: #083646; border-left-color: #0E7C86; }
.n-prosa--articulo { font-size: 1.08rem; }
.n-articulo__cierre { margin-top: 48px; padding: 26px; border-radius: 20px; background: var(--c-soft); display: grid; gap: 16px; }
.n-articulo__cierre > div { display: flex; flex-wrap: wrap; gap: 10px; }
.n-compartir { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 14px; font-size: .88rem; color: #587280; font-weight: 600; }
.n-compartir a { color: #083646; }

/* ── Nosotros ───────────────────────────────────────────────────────── */
.n-nos { display: grid; grid-template-columns: 1.1fr .9fr; gap: 64px; align-items: start; }
.n-nos .n-prosa h2:first-child { margin-top: 0; }
.n-nos__foto { margin: 0; position: sticky; top: 110px; border-radius: 24px; overflow: hidden; aspect-ratio: 4 / 4.6; box-shadow: var(--sombra); }
.n-nos__foto img { width: 100%; height: 100%; object-fit: cover; }
.n-responsable { display: flex; gap: 22px; align-items: center; padding: 28px 32px; border-radius: 22px; border: 1px solid var(--c-line); max-width: 720px; }
.n-responsable > .ico { width: 56px; height: 56px; padding: 14px; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #083646, #0E7C86); flex: none; }
.n-responsable__nombre { font-weight: 800; font-size: 1.3rem; color: #062A37; }
.n-responsable p:last-child { color: var(--c-muted); }

/* ── FAQ ────────────────────────────────────────────────────────────── */
.n-faqpag { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 56px; align-items: start; }
.n-faqpag__indice { position: sticky; top: 100px; }
.n-faqpag__indice p { font-weight: 800; font-size: .76rem; letter-spacing: .06em; text-transform: uppercase; color: #083646; margin-bottom: 10px; }
.n-faqpag__indice ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.n-faqpag__indice a { display: block; padding: 7px 12px; border-radius: 10px; color: #34525E; text-decoration: none; font-weight: 600; font-size: .92rem; }
.n-faqpag__indice a:hover { background: var(--c-soft); color: #083646; }
.n-faqpag__grupo { scroll-margin-top: 100px; }
.n-faqpag__grupo + .n-faqpag__grupo { margin-top: 56px; }
.n-faqpag__grupo > .n-h3 { margin-bottom: 18px; }
.n-faqpag__serv { margin: 22px 0 10px; }
.n-faqpag__serv a { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: .92rem; color: #0E7C86; text-decoration: none; }
.n-faqpag__serv .ico { width: 14px; height: 14px; }
.n-faqpag .n-acordeon { gap: 8px; }

/* ── Contacto ───────────────────────────────────────────────────────── */
.n-contacto { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 48px; align-items: start; }
.n-contacto__form { padding: clamp(22px, 3vw, 36px); border-radius: 24px; background: #fff; border: 1px solid var(--c-line); box-shadow: var(--sombra-s); }
.n-contacto__form > .n-h3 { margin-bottom: 22px; }
.n-contacto__canales { display: grid; gap: 12px; }
.n-canal { display: flex; gap: 16px; align-items: flex-start; padding: 18px 20px; border-radius: 18px; border: 1px solid var(--c-line); text-decoration: none; color: inherit; transition: border-color .3s, box-shadow .3s, transform .4s var(--ease); }
a.n-canal:hover { border-color: transparent; box-shadow: var(--sombra-s); transform: translateY(-2px); }
.n-canal__ico { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #083646, #0E7C86); }
.n-canal__ico--wa { background: #25D366; }
.n-canal small { display: block; font-size: .76rem; font-weight: 700; color: #587280; text-transform: uppercase; letter-spacing: .05em; }
.n-canal strong { display: block; color: #0A2A36; font-size: 1.02rem; word-break: break-word; }
.n-canal span > span, .n-canal span > a { display: block; font-size: .88rem; color: var(--c-muted); margin-top: 2px; }
.n-canal span > a { color: #0E7C86; font-weight: 700; }

/* ── Páginas de estado (newsletter, 404) ────────────────────────────── */
.n-aviso { padding-top: 150px; min-height: 70vh; }
.n-aviso__caja { max-width: 560px; margin: 0 auto; text-align: center; display: grid; gap: 14px; justify-items: center; }
.n-aviso__caja--ancha { max-width: 720px; }
.n-aviso__caja .n-h2 { margin-inline: auto; }
.n-aviso__caja > p { color: var(--c-muted); }
.n-aviso__ico { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: #0E7C86; }
.n-aviso__ico.es-error { background: #8A9CA3; }
.n-aviso__ico .ico { width: 30px; height: 30px; }
.n-aviso__codigo { font-weight: 300; font-size: clamp(4rem, 10vw, 6rem); line-height: 1; color: #0E7C86; letter-spacing: -.04em; }
.n-aviso__enlaces { list-style: none; padding: 0; margin: 8px 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.n-aviso__enlaces a { display: block; padding: 8px 14px; border-radius: 999px; background: var(--c-soft); color: #083646; font-weight: 700; font-size: .88rem; text-decoration: none; }
.n-aviso__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 8px; }

/* ── Responsive de las páginas interiores ───────────────────────────── */
@media (max-width: 1020px) {
    .n-serv__grid, .n-nos, .n-contacto, .n-faqpag, .n-articulo__grid { grid-template-columns: 1fr; gap: 40px; }
    /* minmax(0, 1fr): el contenido ancho (tablas) no puede ensanchar la columna del artículo. */
    .n-articulo__grid { grid-template-columns: minmax(0, 1fr); }
    .n-serv__pegajoso, .n-nos__foto, .n-faqpag__indice, .n-indice-art { position: static; }
    .n-bloque__cab { grid-template-columns: 1fr; gap: 20px; }
    .n-pie__boletin { grid-template-columns: 1fr; }
    .n-mega__in { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .n-mega { display: none; }
    .n-nav__flecha { display: none; }
    .n-faqpag__indice ul { display: flex; flex-wrap: wrap; gap: 6px; }
    .n-faqpag__indice a { border: 1px solid var(--c-line); border-radius: 999px; padding: 6px 12px; }
}
@media (max-width: 620px) {
    .n-lista-check { grid-template-columns: 1fr; }
    .n-pie__boletin { padding: 22px; }
    .n-pie__boletin-form { grid-template-columns: 1fr; }
    .n-wa span { display: none; }
    .n-wa { padding: 14px; }
    .n-pagcab { padding-top: 110px; }
}

/* ── Proyectos reales (/proyectos/{slug}) ───────────────────────────── */
.n-proy__foto { margin: 0 0 8px; border-radius: 20px; overflow: hidden; box-shadow: var(--sombra-s); }
.n-proy__foto img { width: 100%; height: auto; display: block; }
.n-proy__galeria { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 18px; }
.n-proy__galeria figure { margin: 0; }
.n-proy__galeria img { width: 100%; height: auto; border-radius: 14px; display: block; }
.n-proy__galeria figcaption { font-size: .85rem; color: var(--c-muted); margin-top: 6px; }
.n-proy__ficha { margin: 10px 0 0; display: grid; gap: 10px; }
.n-proy__ficha div { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(255, 255, 255, .14); padding-bottom: 8px; }
.n-proy__ficha dt { color: #A9CBD3; font-size: .88rem; }
.n-proy__ficha dd { margin: 0; font-weight: 700; text-align: right; font-size: .92rem; color: #fff; }
.n-proy__servicios { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.n-proy__servicios a { color: #7FDCE6; font-weight: 700; text-underline-offset: 3px; }
@media (max-width: 620px) { .n-proy__galeria { grid-template-columns: 1fr; } }
/* ── Herramienta «¿Qué licencia necesita tu local?» ─────────────────── */
.n-herr { padding: 26px; border-radius: 20px; border: 1px solid var(--c-line); background: #fff; box-shadow: var(--sombra-s); display: grid; gap: 22px; }
.n-herr__ayuda { font-size: .88rem; color: var(--c-muted); }
.n-herr__paso { border: 0; padding: 0; margin: 0; min-width: 0; }
.n-herr__paso[hidden] { display: none; }
.n-herr__paso legend { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 1.05rem; color: #062A37; margin-bottom: 12px; padding: 0; }
.n-herr__paso legend span { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #083646; color: #fff; font-size: .85rem; }
.n-herr__opciones { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.n-herr__opciones--fila { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.n-herr__op { position: relative; display: flex; cursor: pointer; }
.n-herr__op input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.n-herr__op span { flex: 1; padding: 11px 14px; border-radius: 12px; border: 1px solid var(--c-line); background: var(--c-soft); font-size: .92rem; line-height: 1.35; color: #22434F; transition: border-color .2s, background .2s, box-shadow .2s; }
.n-herr__op:hover span { border-color: #3FC6D4; }
.n-herr__op input:checked + span { border-color: #0E7C86; background: #EAF6F7; color: #062A37; font-weight: 700; box-shadow: inset 0 0 0 1px #0E7C86; }
.n-herr__op input:focus-visible + span { outline: 3px solid #3FC6D4; outline-offset: 2px; }
.n-herr .btn { justify-self: start; }
.n-herr__error { color: #9B1C1C; font-weight: 700; font-size: .92rem; }
.n-herr__res { margin-top: 26px; padding: 26px; border-radius: 20px; border: 1px solid #BFE7EC; background: linear-gradient(180deg, #F2FAFB, #fff); outline: none; scroll-margin-top: 110px; }
.n-herr__res > * + * { margin-top: 12px; }
.n-herr__res h3 { font-size: 1.05rem; font-weight: 800; color: #062A37; margin-top: 20px; }
.n-herr__res ul { padding-left: 1.2em; color: #22434F; }
.n-herr__res li + li { margin-top: 4px; }
.n-herr__res a { color: #0E5E66; font-weight: 700; text-underline-offset: 3px; }
.n-herr__res-k { font-size: .8rem; font-weight: 800; color: #0E5E66; text-transform: uppercase; letter-spacing: .04em; }
.n-herr__res-cat { font-family: var(--f-mono); font-size: .8rem; color: #0E5E66; background: #EAF6F7; display: inline-block; padding: 4px 10px; border-radius: 8px; }
.n-herr__res-cuando { padding: 12px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--c-line); color: #22434F; }
.n-herr__res-nota { padding: 12px 14px; border-radius: 12px; background: #FFF7E6; color: #5C3D00; }
.n-herr__res-aviso { font-size: .86rem; color: var(--c-muted); }
.n-herr__res-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 20px !important; }
.n-herr__res-ctas .btn { color: #fff; }
@media (max-width: 620px) {
    .n-herr { padding: 18px; }
    .n-herr__opciones, .n-herr__opciones--fila { grid-template-columns: 1fr; }
}