/* NT502 · Obsidiana — base global: tokens, tipografía, componentes, cabecera y pie.
   Portada: home.css. Páginas de servicio: service.css (se carga solo si existe).
   Regla: cero esquinas redondeadas; animaciones solo de transform/opacity. */

/* Archivo declarada aquí además de en theme.json: los títulos no dependen de los estilos globales
   guardados en el editor ni de que WordPress imprima el @font-face del preset. */
@font-face { font-family: "NT502 Archivo"; font-style: normal; font-weight: 600 900; font-display: swap; src: url("../fonts/archivo-latin-wght-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "NT502 Archivo"; font-style: normal; font-weight: 600 900; font-display: swap; src: url("../fonts/archivo-latin-ext-wght-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ── Tokens (derivados de theme.json) ───────────────────────── */
:root {
    --nt-ink: var(--wp--preset--color--base);
    --nt-steel: var(--wp--preset--color--steel);
    --nt-steel-2: var(--wp--preset--color--steel-2);
    --nt-rule: var(--wp--preset--color--rule);
    --nt-rule-hi: var(--wp--preset--color--rule-hi);
    --nt-line: var(--wp--preset--color--line);
    --nt-paper: var(--wp--preset--color--contrast);
    --nt-soft: var(--wp--preset--color--soft);
    --nt-mute: var(--wp--preset--color--mute);
    --nt-accent: var(--wp--preset--color--accent);
    --nt-blue: var(--wp--preset--color--blue);
    --nt-blue-hi: var(--wp--preset--color--blue-hi);
    --nt-accent-rgb: 0 206 217;
    --nt-blue-rgb: 23 90 150;
    --nt-ink-rgb: 7 9 13;
    --nt-display: "NT502 Archivo", Archivo, "Helvetica Neue", Arial, sans-serif;
    --nt-body: var(--wp--preset--font-family--ibm-plex-sans, "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif);
    --nt-mono: var(--wp--preset--font-family--ibm-plex-mono, "IBM Plex Mono", ui-monospace, Menlo, monospace);
    --nt-pad: var(--wp--custom--pad);
    --nt-max: var(--wp--custom--max-width);
    --nt-grid: var(--wp--custom--grid);
    --nt-header-h: var(--wp--custom--header-height);
    --nt-ease: var(--wp--custom--ease);
    --nt-grid-line: rgb(214 228 255 / .03);
    --nt-section-y: clamp(64px, 10vw, 128px);
    --nt-topbar-h: 41px;
    /* Errores de formulario: 9.0:1 sobre ink, 8.4:1 sobre steel (siempre con texto, nunca solo color). */
    --nt-alert: #ff8f80;
    --nt-alert-rgb: 255 143 128;
    /* Presets del tema padre que este child no define (comentarios, bloque de código, bordes heredados). */
    --wp--preset--color--accent-4: var(--wp--preset--color--mute);
    --wp--preset--color--accent-5: var(--wp--preset--color--steel);
    --wp--preset--color--accent-6: var(--wp--preset--color--rule-hi);
}

/* ── Base ───────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--nt-header-h) + 16px); scroll-padding-bottom: 88px;-webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--nt-ink); color: var(--nt-paper); font-family: var(--nt-body); -webkit-font-smoothing: antialiased; }
img, video { display: block; max-width: 100%; height: auto; }
/* "body" sube la especificidad sobre los h1–h4 de los estilos globales de WordPress, que se imprimen en otro orden según el servidor. */
body h1, body h2, body h3, body h4 { font-family: var(--nt-display); font-weight: 800; line-height: 1.05; letter-spacing: -.025em; color: var(--nt-paper); text-wrap: balance; }
p { text-wrap: pretty; }
.wp-site-blocks > * { margin-block: 0; }
.wp-site-blocks :is(input, textarea, select, button, .wp-block-search__input, .wp-block-search__button, .wp-block-image img, .wp-block-post-featured-image img) { border-radius: 0; }

/* En portada y servicios el espaciado lo dan grid/flex con gap, no los márgenes del layout "flow". */
body :is(.nt-home, .nt-service-page, .nt-404) > *,
body :is(.nt-home, .nt-service-page, .nt-404) .is-layout-flow > * { margin-block: 0; }

/* ── Utilidades ─────────────────────────────────────────────── */
.nt-wrap { width: 100%; max-width: var(--nt-max); margin-inline: auto; padding-inline: var(--nt-pad); }
.nt-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.nt-icon { flex: none; display: inline-block; vertical-align: middle; }
.nt-accent { color: var(--nt-accent); } /* Acento de los H1 (span en los patrones). */
.nt-nowrap { white-space: nowrap; }
.nt-grid-bg {
    background-image:
        repeating-linear-gradient(0deg, var(--nt-grid-line) 0 1px, transparent 1px var(--nt-grid)),
        repeating-linear-gradient(90deg, var(--nt-grid-line) 0 1px, transparent 1px var(--nt-grid));
}
.nt-eyebrow { display: inline-flex; align-items: center; gap: 12px; margin: 0; font: 500 12px/1.3 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--nt-accent); }
.nt-eyebrow::before { content: ""; width: 24px; height: 1px; background: currentColor; }

/* ── Foco y enlace de salto ─────────────────────────────────── */
:focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 3px; }
:focus:not(:focus-visible) { outline: none; }
body .skip-link.screen-reader-text:focus { top: 8px; left: 8px; padding: 14px 18px; background: var(--nt-accent); color: var(--nt-ink); font: 600 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; outline: 2px solid var(--nt-paper); }

/* ── Botones ────────────────────────────────────────────────── */
.nt-btn,
.wp-block-buttons .wp-block-button__link {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    min-height: 48px; padding: 14px 24px;
    border: 1px solid var(--nt-accent); background: var(--nt-accent); color: var(--nt-ink);
    font: 600 12px/1.2 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; text-decoration: none;
    cursor: pointer; transition: background-color .2s, border-color .2s, color .2s;
}
.nt-btn:hover,
.wp-block-buttons .wp-block-button__link:hover { border-color: var(--nt-paper); background: var(--nt-paper); color: var(--nt-ink); }
.nt-btn--ghost,
.wp-block-button.is-style-ghost > .wp-block-button__link { border-color: var(--nt-line); background: rgb(var(--nt-ink-rgb) / .6); color: var(--nt-paper); }
.nt-btn--ghost:hover,
.wp-block-button.is-style-ghost > .wp-block-button__link:hover { border-color: var(--nt-paper); background: var(--nt-paper); color: var(--nt-ink); }
.nt-btn--case { text-transform: none; letter-spacing: .04em; }
.nt-btn .nt-icon { width: 16px; height: 16px; }
.nt-actions, .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; }

.nt-top-anchor { display: block; height: 0; }

/* ── Barra superior ─────────────────────────────────────────── */
.nt-topbar { background: var(--nt-ink); border-bottom: 1px solid var(--nt-rule); font: 500 12px/1 var(--nt-mono); letter-spacing: .06em; }
.nt-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 40px; }
.nt-topbar__list { display: flex; flex-wrap: nowrap; gap: 0 24px; margin: 0; padding: 0; list-style: none; }
.nt-topbar a { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; color: var(--nt-soft); text-decoration: none; }
.nt-topbar a:hover { color: var(--nt-paper); }
.nt-topbar .nt-icon { width: 14px; height: 14px; color: var(--nt-accent); }
.nt-topbar__motion { min-height: 30px; white-space: nowrap; padding: 0 12px; border: 1px solid var(--nt-line); background: none; color: var(--nt-soft); font: inherit; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.nt-topbar__motion:hover { color: var(--nt-paper); border-color: var(--nt-paper); }
.nt-paused .nt-topbar__motion { color: var(--nt-accent); border-color: var(--nt-accent); }

/* ── Cabecera ───────────────────────────────────────────────── */
/* El <header> (barra superior + barra principal) es sticky con top negativo: al hacer scroll la barra
   superior sale de pantalla y solo queda fija la principal. Con el foco en la barra superior se ve entera. */
.nt-header { position: sticky; top: calc(var(--nt-topbar-h) * -1); z-index: 50; }
.nt-header:has(.nt-topbar :focus) { top: 0; }
.nt-header__bar { background: rgb(var(--nt-ink-rgb) / .94); border-bottom: 1px solid var(--nt-rule); }
.admin-bar .nt-header { top: calc(32px - var(--nt-topbar-h)); }
.admin-bar .nt-header:has(.nt-topbar :focus) { top: 32px; }
.nt-header__inner { display: flex; align-items: center; gap: 20px; min-height: var(--nt-header-h); }
.nt-header__logo { flex: none; margin-right: auto; }
.nt-header__logo img { width: auto; height: 40px; }
.nt-header__cta { min-height: 44px; padding-block: 12px; }
.nt-header__toggle { display: none; align-items: center; gap: 10px; min-height: 44px; padding: 0 14px; border: 1px solid var(--nt-line); background: none; color: var(--nt-paper); font: 500 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }
.nt-burger { display: grid; gap: 4px; width: 18px; }
.nt-burger i { display: block; height: 1.5px; background: currentColor; transition: transform .2s, opacity .2s; }
.nt-header__toggle[aria-expanded="true"] .nt-burger i:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.nt-header__toggle[aria-expanded="true"] .nt-burger i:nth-child(2) { opacity: 0; }
.nt-header__toggle[aria-expanded="true"] .nt-burger i:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

.nt-nav__list { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.nt-nav__link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; color: var(--nt-soft); font: 500 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; list-style: none; cursor: pointer; }
.nt-nav__link::-webkit-details-marker { display: none; }
.nt-nav__link:hover, .nt-nav__sub[open] > .nt-nav__link { color: var(--nt-paper); }
.nt-nav__link[aria-current="page"], .nt-nav__link.is-current { color: var(--nt-accent); box-shadow: inset 0 -2px 0 var(--nt-accent); }
.nt-nav__sub { position: relative; }
.nt-caret { width: 7px; height: 7px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: translateY(-2px) rotate(45deg); transition: transform .2s; }
.nt-nav__sub[open] .nt-caret { transform: translateY(2px) rotate(-135deg); }
.nt-nav__panel { position: absolute; top: calc(100% + 12px); left: 0; z-index: 2; min-width: 280px; margin: 0; padding: 8px; list-style: none; background: var(--nt-steel); border: 1px solid var(--nt-rule-hi); box-shadow: 0 24px 48px -16px rgb(0 0 0 / .8); }
.nt-nav__panel a { display: block; padding: 12px 14px; border-left: 2px solid transparent; color: var(--nt-paper); font-size: 15px; text-decoration: none; }
.nt-nav__panel a:hover { background: var(--nt-steel-2); border-left-color: var(--nt-accent); }
.nt-nav__panel a[aria-current="page"] { color: var(--nt-accent); border-left-color: var(--nt-accent); }

@media (max-width: 959.98px) {
    .nt-header__inner { flex-wrap: wrap; gap: 12px; }
    .nt-header__cta { order: 2; }
    .nt-header__toggle { order: 3; }
    .nt-nav { order: 4; flex-basis: 100%; }
    .nt-nav__list { flex-wrap: wrap; }
    .nt-nav__panel { position: static; min-width: 0; padding: 0 0 8px 16px; border: 0; background: none; box-shadow: none; }
    /* Menú plegado solo si design.js lo inicializó (html.nt-menu-ready); si no, queda visible en línea. */
    .nt-menu-ready .nt-header__toggle { display: inline-flex; }
    .nt-menu-ready .nt-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; max-height: calc(100vh - var(--nt-header-h) - 40px); overflow-y: auto; padding: 8px var(--nt-pad) 24px; background: var(--nt-ink); border-bottom: 1px solid var(--nt-rule-hi); }
    .nt-menu-ready .nt-nav.is-open { display: block; }
    .nt-menu-ready .nt-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
    .nt-menu-ready .nt-nav__link { width: 100%; min-height: 52px; border-bottom: 1px solid var(--nt-rule); font-size: 13px; }
    .nt-menu-ready .nt-nav__link[aria-current="page"], .nt-menu-ready .nt-nav__link.is-current { box-shadow: inset 2px 0 0 var(--nt-accent); }
}
@media (max-width: 782px) { .admin-bar .nt-header { top: calc(46px - var(--nt-topbar-h)); } .admin-bar .nt-header:has(.nt-topbar :focus) { top: 46px; } }
@media (max-width: 600px) { .admin-bar .nt-header { top: calc(var(--nt-topbar-h) * -1); } .admin-bar .nt-header:has(.nt-topbar :focus) { top: 0; } }
@media (max-width: 767.98px) {
    /* Sin "animaciones" la barra superior cabe en una línea (su alto es --nt-topbar-h). */
    .nt-topbar__motion-more { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
}
@media (max-width: 599.98px) {
    .nt-header__cta { display: none; }
    .nt-header__logo img { height: 34px; }
    .nt-topbar__list li:not(:first-child) .nt-topbar__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
    .nt-topbar__list { flex-wrap: nowrap; gap: 0 18px; }
}

/* ── Secciones y paneles ────────────────────────────────────── */
.nt-section { position: relative; padding-block: var(--nt-section-y); border-top: 1px solid var(--nt-rule); }
.nt-section .nt-wrap { display: grid; gap: clamp(32px, 5vw, 56px); }
.nt-section__head { display: grid; gap: 16px; justify-items: start; max-width: 780px; }
.nt-section__title { font-size: var(--wp--preset--font-size--x-large); max-width: 22ch; }
.nt-section__lead { margin: 0; max-width: 58ch; color: var(--nt-soft); font-size: var(--wp--preset--font-size--large); line-height: 1.5; }
.nt-panel { position: relative; isolation: isolate; display: grid; gap: 20px; justify-items: start; padding: clamp(32px, 6vw, 80px); border: 1px solid var(--nt-rule-hi); background-color: var(--nt-steel); }
.nt-panel::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(60% 90% at 100% 0%, rgb(var(--nt-blue-rgb) / .28), transparent 70%), radial-gradient(50% 70% at 0% 100%, rgb(var(--nt-accent-rgb) / .1), transparent 70%); }

/* ── Aparición al hacer scroll (solo con JS; ver design.js) ── */
.nt-reveal-on .nt-reveal { transition: opacity .8s var(--nt-ease), transform .8s var(--nt-ease); }
.nt-reveal-on .nt-reveal:not(.is-visible) { opacity: 0; transform: translate3d(0, 28px, 0); }
/* Si design.js no llega a ejecutarse, el contenido aparece igualmente a los 3 s. */
.nt-reveal-on:not(.nt-reveal-ready) .nt-reveal { animation: nt-reveal-failsafe 0s 3s forwards; }
@keyframes nt-reveal-failsafe { to { opacity: 1; transform: none; } }

/* ── Fichas de servicio ─────────────────────────────────────── */
/* Cuatro servicios: 4 columnas desde 1200 px, 2×2 en tablet y 1 columna en móvil. "Otros servicios" (3): service.css. */
.nt-fichas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.nt-fichas .nt-ficha {
    --rx: 0deg; --ry: 0deg; --mx: 50%; --my: 30%; --glow: 0;
    position: relative; isolation: isolate; overflow: hidden;
    display: flex; flex-direction: column; justify-content: flex-end; gap: 10px;
    min-height: clamp(240px, 34vh, 340px); padding: 24px;
    container-type: inline-size; /* el título se mide contra el ancho de la ficha */
    border: 1px solid var(--nt-rule-hi);
    background:
        radial-gradient(520px circle at var(--mx) var(--my), rgb(var(--nt-accent-rgb) / calc(var(--glow) * .16)), transparent 62%),
        radial-gradient(120% 80% at 50% 0%, rgb(var(--nt-blue-rgb) / .18), transparent 70%),
        repeating-linear-gradient(0deg, var(--nt-grid-line) 0 1px, transparent 1px var(--nt-grid)),
        repeating-linear-gradient(90deg, var(--nt-grid-line) 0 1px, transparent 1px var(--nt-grid)),
        rgb(10 13 18 / .78);
    box-shadow: 0 30px 60px -30px rgb(0 0 0 / .9), inset 0 1px 0 rgb(255 255 255 / .06);
    transform: perspective(1100px) rotateX(var(--rx)) rotateY(var(--ry));
    transform-origin: 50% 100%;
    transition: opacity .8s var(--nt-ease), transform .7s var(--nt-ease), border-color .3s;
}
.nt-fichas .nt-ficha.is-tilting { transition: opacity .8s var(--nt-ease), transform .12s linear, border-color .3s; }
.nt-reveal-on .nt-fichas .nt-ficha:not(.is-visible) { transform: perspective(1100px) translate3d(0, 56px, 0) rotateX(16deg); }
.nt-ficha:hover, .nt-ficha:focus-within { --glow: 1; border-color: var(--nt-line); }
.nt-ficha:focus-within { outline: 2px solid var(--nt-accent); outline-offset: -2px; }
/* El glifo ocupa su propio espacio arriba a la derecha (margin-bottom:auto lo separa del texto): nunca se monta sobre él. */
.nt-ficha__glyph { align-self: flex-end; margin-bottom: auto; width: clamp(96px, 40%, 170px); color: var(--nt-mute); }
.nt-ficha__kicker { margin: 0; font: 500 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--nt-accent); }
/* Título de ficha: tamaño fijo en px por ancho de pantalla (respaldo si un optimizador descarta "cqi")
   y, si el navegador lo admite, ajustado al ancho de la propia ficha. Nunca parte palabras a mitad. */
.nt-fichas .nt-ficha .nt-ficha__title {
    margin: 0; font-family: var(--nt-display); font-weight: 800; font-size: 26px; line-height: 1.08; letter-spacing: -.02em;
    overflow-wrap: normal; word-break: normal; hyphens: manual; text-wrap: balance; text-shadow: 0 2px 14px rgb(0 0 0 / .9);
}
@media (min-width: 1200px) { .nt-fichas .nt-ficha .nt-ficha__title { font-size: 22px; } }
@media (min-width: 1440px) { .nt-fichas .nt-ficha .nt-ficha__title { font-size: 24px; } }
@media (max-width: 400px) { .nt-fichas .nt-ficha .nt-ficha__title { font-size: 23px; } }
@supports (font-size: 1cqi) { .nt-fichas .nt-ficha .nt-ficha__title { font-size: clamp(20px, 8.6cqi, 30px); } }
.nt-ficha__link { color: var(--nt-paper); text-decoration: none; }
.nt-ficha__link::before { content: ""; position: absolute; inset: 0; z-index: 1; }
.nt-ficha__link:focus-visible { outline: none; }
.nt-ficha__text { margin: 0; max-width: 36ch; color: var(--nt-soft); line-height: 1.45; }
.nt-ficha__more { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; font: 500 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--nt-accent); }
.nt-ficha__more .nt-icon { width: 16px; height: 16px; transition: transform .3s var(--nt-ease); }
.nt-ficha:hover .nt-ficha__more .nt-icon, .nt-ficha:focus-within .nt-ficha__more .nt-icon { transform: translateX(6px); }
@media (max-width: 1199.98px) {
    .nt-fichas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nt-fichas .nt-ficha { min-height: clamp(220px, 26vh, 300px); }
}
@media (max-width: 860px) {
    .nt-fichas { grid-template-columns: 1fr; gap: 12px; }
    .nt-fichas .nt-ficha { min-height: 200px; padding: 20px; }
    .nt-ficha__glyph { width: 88px; }
}

/* Ilustraciones lineales (nt502_child_service_glyph). Se animan solo dentro de [data-nt-inview].is-inview. */
.nt-glyph { display: block; width: 100%; height: auto; overflow: visible; }
.nt-glyph__accent { stroke: var(--nt-accent); }
.nt-glyph__dim { opacity: .5; stroke-dasharray: 3 5; }
.nt-glyph__beam { fill: rgb(var(--nt-accent-rgb) / .12); stroke: rgb(var(--nt-accent-rgb) / .45); }
.nt-glyph__dot { fill: var(--nt-accent); stroke: none; }
.nt-glyph__pulse { stroke: var(--nt-accent); opacity: 0; transform-box: fill-box; transform-origin: center; }
.nt-glyph__cursor { stroke: var(--nt-accent); stroke-width: 2; }
.is-inview .nt-glyph__beam { animation: nt-fade 3.2s ease-in-out infinite; }
.is-inview .nt-glyph__dot { animation: nt-blink 1.6s steps(1) infinite; }
.is-inview .nt-glyph__cursor { animation: nt-blink 1.1s steps(1) infinite; }
.is-inview .nt-glyph__pulse { animation: nt-pulse 2.8s var(--nt-ease) infinite; }
.is-inview .nt-glyph__pulse--late { animation-delay: 1.4s; }
@keyframes nt-fade { 50% { opacity: .35; } }
@keyframes nt-blink { 50% { opacity: .1; } }
@keyframes nt-pulse { 0% { opacity: .9; transform: scale(.5); } 100% { opacity: 0; transform: scale(1.7); } }

/* ── Pasos numerados (patterns/process.php: portada y servicios) ── */
.nt-process {
    background-color: var(--nt-steel);
    background-image:
        repeating-linear-gradient(0deg, var(--nt-grid-line) 0 1px, transparent 1px var(--nt-grid)),
        repeating-linear-gradient(90deg, var(--nt-grid-line) 0 1px, transparent 1px var(--nt-grid));
}
.nt-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); border: 1px solid var(--nt-rule); background: rgb(var(--nt-ink-rgb) / .5); }
.nt-step { display: grid; align-content: start; gap: 12px; padding: clamp(24px, 3vw, 40px); border-left: 1px solid var(--nt-rule); }
.nt-step:first-child { border-left: 0; }
.nt-step__num { margin: 0; font: 500 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--nt-accent); }
.nt-step__title { margin: 0; font-size: clamp(20px, 1.8vw, 26px); }
.nt-step p:not(.nt-step__num) { margin: 0; color: var(--nt-soft); }
@media (max-width: 780px) {
    .nt-step { border-left: 0; border-top: 1px solid var(--nt-rule); }
    .nt-step:first-child { border-top: 0; }
}

/* ── Lista con marcas ───────────────────────────────────────── */
.nt-checklist { display: grid; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--nt-rule); }
.nt-checklist li { position: relative; display: grid; gap: 6px; padding: 20px 0 20px 36px; border-bottom: 1px solid var(--nt-rule); color: var(--nt-soft); }
.nt-checklist li::before { content: ""; position: absolute; left: 2px; top: 27px; width: 14px; height: 8px; border-left: 2px solid var(--nt-accent); border-bottom: 2px solid var(--nt-accent); transform: rotate(-45deg); }
.nt-checklist strong { color: var(--nt-paper); font-family: var(--nt-display); font-size: 20px; font-weight: 700; letter-spacing: -.01em; }

/* ── Páginas genéricas (templates/page.html y plantillas heredadas) ── */
.nt-page { padding-block: clamp(48px, 8vw, 96px); }
.nt-page__title { font-size: var(--wp--preset--font-size--xx-large); }
.nt-page :where(p, li) { color: var(--nt-soft); }

/* Formularios heredados (comentarios, búsqueda) en páginas con plantillas del tema padre. */
.wp-site-blocks :is(input:not([type="submit"], [type="button"], [type="checkbox"], [type="radio"], [type="hidden"]), textarea, select) {
    max-width: 100%; padding: 12px 14px; border: 1px solid var(--nt-line); border-radius: 0;
    background: var(--nt-steel); color: var(--nt-paper); font: inherit; font-size: 16px;
}
.wp-site-blocks :is(input, textarea, select):focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 2px; border-color: var(--nt-accent); }
/* El tema padre fija el borde del formulario de comentarios con !important (accent-6, decorativo): se repone line (≥3:1). */
.wp-site-blocks .wp-block-post-comments-form :is(textarea, input:not([type="submit"], [type="checkbox"])) { border-color: var(--nt-line) !important; border-radius: 0; }
.wp-site-blocks :is(.wp-block-search__button, .wp-block-post-comments-form [type="submit"]) {
    min-height: 48px; padding: 12px 20px; border: 1px solid var(--nt-accent); border-radius: 0;
    background: var(--nt-accent); color: var(--nt-ink); font: 600 12px/1.2 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; cursor: pointer;
}
.wp-site-blocks :is(.wp-block-search__button, .wp-block-post-comments-form [type="submit"]):hover { border-color: var(--nt-paper); background: var(--nt-paper); }
.wp-site-blocks ::placeholder { color: var(--nt-mute); opacity: 1; }

/* ── Panel de contacto con formulario (portada #contacto y llamado final de servicios) ── */
.nt-panel.nt-quote-panel {
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    grid-template-areas: "copy form" "direct form";
    grid-template-rows: auto 1fr;
    gap: clamp(28px, 4vw, 44px) clamp(32px, 5vw, 64px);
    padding: clamp(24px, 4.5vw, 56px);
    align-items: start; justify-items: stretch;
}
.nt-quote-panel__copy { grid-area: copy; display: grid; gap: 20px; justify-items: start; }
.nt-quote-panel__direct { grid-area: direct; display: grid; gap: 14px; justify-items: start; padding-top: 24px; border-top: 1px solid var(--nt-rule-hi); }
.nt-quote-panel__direct-title { margin: 0; font: 500 12px/1.3 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--nt-soft); }
.nt-quote-panel > .nt-quote { grid-area: form; }
@media (max-width: 959.98px) {
    .nt-panel.nt-quote-panel { grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "form" "direct"; grid-template-rows: none; }
}
@media (max-width: 600px) {
    .nt-panel.nt-quote-panel { padding: 28px 16px; }
}

/* ── Formulario de cotización (bloque nt502/quote-form, inc/quote-form.php + quote-form.js) ── */
.nt-quote {
    container-type: inline-size; position: relative; justify-self: stretch; width: 100%;
    display: grid; gap: 20px; align-content: start;
    padding: clamp(18px, 3vw, 36px); border: 1px solid var(--nt-rule-hi);
    background: rgb(var(--nt-ink-rgb) / .82); box-shadow: 0 30px 60px -30px rgb(0 0 0 / .9);
    color-scheme: dark;
}
.nt-quote [hidden] { display: none; }
.nt-quote__title { margin: 0; font-size: clamp(22px, 2vw, 28px); }
.nt-quote__form { display: grid; gap: 22px; }
.nt-quote__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px 16px; }
@container (min-width: 420px) {
    .nt-quote__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nt-quote__field--wide, .nt-quote__note { grid-column: 1 / -1; }
}
.nt-quote__field { display: grid; gap: 8px; align-content: start; }
.nt-quote__label { font: 500 12px/1.3 var(--nt-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--nt-soft); }
.nt-quote__opt { color: var(--nt-mute); letter-spacing: .04em; text-transform: none; }
.nt-quote__hint { margin: 0; color: var(--nt-mute); font-size: 14px; line-height: 1.45; }
.nt-quote__note { margin-top: -8px; }

/* Controles: más específicos que los "formularios heredados" de arriba. */
.wp-site-blocks .nt-quote .nt-quote__control {
    width: 100%; max-width: none; min-height: 48px; margin: 0; padding: 12px 14px;
    border: 1px solid var(--nt-line); border-radius: 0; background-color: var(--nt-ink); color: var(--nt-paper);
    font: 400 16px/1.4 var(--nt-body); transition: border-color .2s;
}
.wp-site-blocks .nt-quote .nt-quote__control:hover { border-color: var(--nt-soft); }
.wp-site-blocks .nt-quote .nt-quote__control:focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 2px; border-color: var(--nt-accent); }
.wp-site-blocks .nt-quote .nt-quote__control[aria-invalid="true"] { border-color: var(--nt-alert); box-shadow: inset 3px 0 0 var(--nt-alert); }
.wp-site-blocks .nt-quote textarea.nt-quote__control { min-height: 132px; resize: vertical; }
.wp-site-blocks .nt-quote select.nt-quote__control {
    appearance: none; padding-right: 44px; cursor: pointer;
    background-image: linear-gradient(45deg, transparent 50%, var(--nt-accent) 50%), linear-gradient(135deg, var(--nt-accent) 50%, transparent 50%);
    background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%;
    background-size: 6px 6px; background-repeat: no-repeat;
}
.nt-quote select.nt-quote__control option { background: var(--nt-steel); color: var(--nt-paper); }

.nt-quote__error { display: flex; align-items: flex-start; gap: 8px; margin: 0; color: var(--nt-alert); font-size: 14px; line-height: 1.45; }
.nt-quote__error::before { content: "!"; content: "!" / ""; flex: none; display: grid; place-items: center; width: 18px; height: 18px; margin-top: 1px; border: 1px solid currentColor; font: 600 11px/1 var(--nt-mono); }

.nt-quote__summary { display: grid; gap: 8px; padding: 16px 18px; border: 1px solid var(--nt-alert); border-left-width: 4px; background: rgb(var(--nt-alert-rgb) / .07); }
.nt-quote__summary:focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 3px; }
.nt-quote__summary-title { margin: 0; color: var(--nt-paper); font-weight: 600; line-height: 1.45; }
.nt-quote__summary-list { display: grid; gap: 4px; margin: 0; padding-left: 20px; }
.nt-quote__summary-list:empty { display: none; }
.nt-quote__summary-list a { color: var(--nt-alert); text-decoration: underline; text-underline-offset: 3px; }
.nt-quote__summary-list a:hover { color: var(--nt-paper); }

.nt-quote__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; }
.nt-quote__privacy { flex: 1 1 220px; margin: 0; color: var(--nt-mute); font-size: 14px; line-height: 1.45; }
.nt-quote__submit[aria-disabled="true"] { cursor: progress; opacity: .7; }
@container (max-width: 419.98px) { .nt-quote__submit { width: 100%; } }

.nt-quote__done { display: grid; gap: 16px; justify-items: start; padding: 22px; border: 1px solid var(--nt-accent); border-left-width: 4px; background: rgb(var(--nt-accent-rgb) / .06); }
.nt-quote__done:focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 3px; }
.nt-quote__done-title { display: inline-flex; align-items: center; gap: 10px; margin: 0; font: 600 12px/1.3 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--nt-accent); }
.nt-quote__done-title::before { content: ""; width: 12px; height: 6px; margin-top: -4px; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); }
.nt-quote__done-text { margin: 0; max-width: 52ch; color: var(--nt-paper); font-size: 17px; line-height: 1.5; }

/* Constancia en PDF dentro del panel de éxito. */
.nt-quote__pdf { display: grid; gap: 12px; justify-items: start; width: 100%; padding: 16px 18px; border: 1px solid var(--nt-line); background: rgb(var(--nt-ink-rgb) / .6); }
.nt-quote__pdf-folio { margin: 0; font: 500 12px/1.3 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--nt-soft); }
.nt-quote__pdf-folio span { margin-left: 6px; color: var(--nt-accent); letter-spacing: .08em; }
.nt-quote__pdf-text { margin: 0; max-width: 52ch; color: var(--nt-soft); font-size: 15px; line-height: 1.5; }
.nt-quote__pdf-btn:focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 3px; }
.nt-quote__pdf-fail { margin: 0; max-width: 52ch; padding-left: 12px; border-left: 2px solid var(--nt-line); color: var(--nt-soft); font-size: 15px; line-height: 1.5; }
@container (max-width: 419.98px) { .nt-quote__pdf-btn { width: 100%; } }

/* Honeypot: fuera de la vista y del árbol accesible (no display:none, que algunos bots detectan). */
.nt-quote__hp { position: absolute; left: -9999px; top: 0; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

/* ── Páginas de evento (templates/page-evento.html) ─────────── */
/* Columna de texto de 760 px (contentSize) y galería más ancha, alineada con el contenido de .nt-wrap. */
body .nt-event > *, body .nt-event__head-inner > * { margin-block: 0; }
.nt-event__head { border-bottom: 1px solid var(--nt-rule); background-color: var(--nt-steel); }
.nt-event__head-inner { display: grid; gap: 20px; justify-items: start; max-width: calc(var(--wp--style--global--content-size, 760px) + 2 * var(--nt-pad)); padding-block: clamp(48px, 8vw, 104px) clamp(36px, 5vw, 64px); }
body .nt-event__title { margin: 0; font-size: var(--wp--preset--font-size--xx-large); }
.nt-event__lead p { margin: 0; max-width: 60ch; color: var(--nt-soft); font-size: var(--wp--preset--font-size--large); line-height: 1.5; }
.nt-event__body { padding-block: clamp(40px, 6vw, 72px) var(--nt-section-y); }
.nt-event__content :where(p, li) { color: var(--nt-soft); }
.nt-event__content > p { font-size: 17px; }
.nt-event__content > .wp-block-gallery { max-width: calc(var(--nt-max) - 2 * var(--nt-pad)); margin-block-start: clamp(32px, 5vw, 56px); }

/* Galería (core/gallery): rejilla con huecos iguales, fotos 4:3 recortadas y pie debajo, no encima. */
.nt-event .nt-event__content .wp-block-gallery.has-nested-images { --nt-cols: 3; display: grid; grid-template-columns: repeat(var(--nt-cols), minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); align-items: start; }
.nt-event .nt-event__content .wp-block-gallery.has-nested-images.columns-1 { --nt-cols: 1; }
.nt-event .nt-event__content .wp-block-gallery.has-nested-images.columns-2 { --nt-cols: 2; }
.nt-event .nt-event__content .wp-block-gallery.has-nested-images:is(.columns-4, .columns-5, .columns-6, .columns-7, .columns-8) { --nt-cols: 4; }
.nt-event .nt-event__content .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) { display: flex; flex-direction: column; justify-content: flex-start; width: auto; margin: 0; }
.nt-event .nt-event__content .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) img {
    flex: none; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0;
    background: var(--nt-steel);
}
.nt-event .nt-event__content .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image):hover img { outline: 1px solid var(--nt-accent); outline-offset: -1px; }
.nt-event .nt-event__content .wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before { content: none; }
.nt-event .nt-event__content .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
    position: static; flex: none; max-height: none; overflow: visible; padding: 10px 0 0; margin: 0;
    background: none; text-shadow: none; text-align: left; color: var(--nt-mute); font-size: 14px; line-height: 1.45;
    scrollbar-gutter: auto; will-change: auto;
}
.nt-event .nt-event__content .wp-block-gallery.has-nested-images > .blocks-gallery-caption { grid-column: 1 / -1; margin: 4px 0 0; color: var(--nt-mute); font-size: 14px; text-align: left; }
.nt-event__content > .wp-block-image figcaption { color: var(--nt-mute); font-size: 14px; }
@media (max-width: 959.98px) { .nt-event .nt-event__content .wp-block-gallery.has-nested-images:not(.columns-1) { --nt-cols: 2; } }

/* ── Ampliar al hacer clic (lightbox de core/image, activo por defecto en theme.json) ── */
/* El botón de ampliar siempre visible (en pantallas táctiles no hay hover) y con foco claro. */
body .wp-site-blocks .wp-block-image.wp-lightbox-container button.lightbox-trigger {
    opacity: 1; width: 36px; height: 36px; border: 1px solid var(--nt-line); border-radius: 0;
    background-color: rgb(var(--nt-ink-rgb) / .72); backdrop-filter: none;
    transition: background-color .2s, border-color .2s;
}
body .wp-site-blocks .wp-block-image.wp-lightbox-container button.lightbox-trigger:hover { border-color: var(--nt-accent); background-color: var(--nt-ink); }
body .wp-site-blocks .wp-block-image.wp-lightbox-container button.lightbox-trigger:focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 2px; border-color: var(--nt-accent); }
.wp-lightbox-container:has(.lightbox-trigger:focus-visible) img { outline: 2px solid var(--nt-accent); outline-offset: 3px; }
.wp-lightbox-container button.lightbox-trigger svg { width: 14px; height: 14px; }

/* Ventana ampliada: fondo tinta y botones cuadrados. WordPress pone color de relleno y fondo en línea: de ahí los !important. */
.wp-lightbox-overlay .scrim { background-color: var(--nt-ink) !important; opacity: .96; }
body .wp-lightbox-overlay :is(.wp-lightbox-close-button, .wp-lightbox-navigation-button) {
    min-width: 44px; min-height: 44px; padding: 0 10px !important; border: 1px solid var(--nt-line) !important; border-radius: 0;
    background: rgb(var(--nt-ink-rgb) / .8) !important; color: var(--nt-paper); fill: var(--nt-paper) !important;
    font: 500 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase;
    transition: background-color .2s, border-color .2s, color .2s;
}
body .wp-lightbox-overlay .wp-lightbox-close-button { border-color: var(--nt-accent) !important; color: var(--nt-accent); fill: var(--nt-accent) !important; }
body .wp-lightbox-overlay :is(.wp-lightbox-close-button, .wp-lightbox-navigation-button):hover { border-color: var(--nt-accent) !important; background: var(--nt-accent) !important; color: var(--nt-ink); fill: var(--nt-ink) !important; }
body .wp-lightbox-overlay :is(.wp-lightbox-close-button, .wp-lightbox-navigation-button):focus-visible { outline: 2px solid var(--nt-accent); outline-offset: 3px; }
.wp-lightbox-overlay img { border-radius: 0; }

/* ── 404 (templates/404.html) ───────────────────────────────── */
.nt-404 .nt-section { border-top: 0; }
.nt-404__head { display: grid; gap: 20px; justify-items: start; max-width: 780px; }
.nt-404__title { margin: 0; font-size: var(--wp--preset--font-size--xx-large); }

/* ── Pie ────────────────────────────────────────────────────── */
.nt-footer { background: var(--nt-steel); border-top: 1px solid var(--nt-rule); color: var(--nt-soft); font-size: 15px; }
.nt-footer__grid { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: 40px; padding-block: clamp(48px, 7vw, 80px); }
.nt-footer__logo { display: inline-block; }
.nt-footer__logo img { width: auto; height: 44px; }
.nt-footer__brand p { max-width: 34ch; margin: 20px 0 0; }
.nt-footer__col ul { display: grid; gap: 2px; margin: 16px 0 0; padding: 0; list-style: none; }
.nt-footer a { display: inline-flex; align-items: center; gap: 10px; min-height: 32px; color: var(--nt-soft); text-decoration: none; }
.nt-footer a:hover { color: var(--nt-paper); }
.nt-footer .nt-icon { width: 16px; height: 16px; color: var(--nt-accent); }
.nt-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-block: 16px; border-top: 1px solid var(--nt-rule); color: var(--nt-mute); font: 500 12px/1.4 var(--nt-mono); letter-spacing: .08em; }
.nt-footer__bottom p { margin: 0; }
.nt-footer__bottom a { color: var(--nt-mute); }
@media (max-width: 860px) { .nt-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nt-footer__brand { grid-column: 1 / -1; } }
@media (max-width: 480px) { .nt-footer__grid { grid-template-columns: 1fr; } }

/* ── WhatsApp flotante ──────────────────────────────────────── */
.nt-wa-float { position: fixed; right: clamp(16px, 2.5vw, 28px); bottom: clamp(16px, 2.5vw, 28px); z-index: 60; display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 18px; background: var(--nt-accent); color: var(--nt-ink); font: 600 12px/1 var(--nt-mono); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; box-shadow: 0 16px 32px -12px rgb(0 0 0 / .8); transition: background-color .2s, color .2s, opacity .3s, transform .3s var(--nt-ease), visibility 0s; }
.nt-wa-float:hover { background: var(--nt-paper); color: var(--nt-ink); }
.nt-wa-float:focus-visible { outline: 2px solid var(--nt-paper); outline-offset: 3px; }
.nt-wa-float .nt-icon { width: 22px; height: 22px; }
/* design.js lo oculta mientras se ven los botones de contacto de la página (hero, CTA); sin JS siempre visible. */
.nt-wa-float.is-hidden { opacity: 0; visibility: hidden; transform: translate3d(0, 12px, 0); pointer-events: none; transition: background-color .2s, color .2s, opacity .3s, transform .3s var(--nt-ease), visibility 0s .3s; }
@media (max-width: 640px) {
    /* Espacio bajo el pie para que el botón no tape el final de la página. */
    .nt-footer { padding-bottom: 88px; }
    .nt-wa-float { width: 56px; height: 56px; padding: 0; justify-content: center; }
    .nt-wa-float__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
}

/* ── Movimiento: preferencia del sistema y botón "Pausar animaciones" (html.nt-paused) ── */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
html.nt-paused { scroll-behavior: auto; }
.nt-paused *, .nt-paused *::before, .nt-paused *::after { animation: none !important; transition-duration: .01ms !important; }

@media print {
    .nt-topbar, .nt-header, .nt-wa-float { display: none; }
    .nt-reveal-on .nt-reveal:not(.is-visible) { opacity: 1; transform: none; }
}