/* Atlas interactivo. El scroll es nativo: no se captura ni se altera la rueda. */
.n-atlas { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.n-atlas__number { position: absolute; right: 7%; top: 12%; font: 300 clamp(180px,27vw,420px)/1 var(--font); letter-spacing: -.09em; color: #ffffff05; }
.n-atlas__ruler { position: absolute; top: 100px; bottom: 110px; right: 24px; width: 9px; border-right: 1px solid #ffffff15; background: repeating-linear-gradient(0deg,#ffffff24 0 1px,transparent 1px 13px); opacity: .55; }
.n-atlas__axis { position: absolute; right: 48px; bottom: 123px; width: 43px; height: 43px; border-left: 1px solid #bdc3cd55; border-bottom: 1px solid #bdc3cd55; opacity: .7; font: 8px var(--mono); color: #c4cad3; }
.n-atlas__axis span:first-child { position: absolute; top: -12px; left: -3px; }
.n-atlas__axis span:last-child { position: absolute; bottom: -4px; right: -12px; }
.n-atlas__axis i { position: absolute; left: -3px; bottom: -3px; width: 5px; height: 5px; border-radius: 50%; background: var(--brand); }
.n-atlas__legend { position: absolute; top: 78px; left: 24px; right: 24px; display: flex; justify-content: space-between; font: 7px var(--mono); letter-spacing: .1em; color: #aeb5bd; opacity: .4; border-top: 1px solid #ffffff15; padding-top: 10px; }
.n-atlas__legend span:first-child { display: none; }
.n-atlas-card__meta, .n-atlas-card__tags, .n-atlas-progress, .n-x__cue { display: none; }
.n-hot.is-hidden { visibility: hidden; }
.n-x__frame { background: radial-gradient(ellipse at 61% 34%,#5a5d60 0%,#3b3f44 42%,#25292f 100%); }
.n-x__frame::before { background-size: 28px 28px; opacity: .28; }

.has-scroll .n-x__outro { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 25px; background: #f8f8f5f5; color: var(--ink); border: 1px solid #ffffff9c; border-radius: 12px; box-shadow: 0 20px 60px -25px #10131880; }
.has-scroll .n-atlas-card__meta { display: flex; justify-content: space-between; gap: 10px; font: 7px var(--mono); letter-spacing: .08em; color: #80868b; padding-bottom: 24px; }
.n-atlas-card__meta b { font-weight: 500; color: var(--brand-700); }
.has-scroll .n-x__outro [data-outro-kicker] { display: block; font: 10px var(--mono); color: var(--brand-700); }
.has-scroll .n-x__outro h2 { display: block; font-size: clamp(23px,2.2vw,32px); line-height: 1.16; font-weight: 450; letter-spacing: -.045em; margin: 17px 0 16px; }
.has-scroll .n-x__outro h2 .n-accent { color: #969a9e; }
.has-scroll .n-x__outro p { display: block; font-size: 12px; line-height: 1.85; color: #757a80; margin: 0 0 19px; }
.has-scroll .n-atlas-card__tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 23px; }
.n-atlas-card__tags span { padding: 5px 7px; border: 1px solid #dadddf; border-radius: 4px; font-size: 8px; color: #777b80; }
.has-scroll .n-x__outro a { justify-content: space-between; padding-top: 18px; border-top: 1px solid #d9dcdf; color: var(--ink); font-size: 11px; }
.has-scroll .n-x__outro a i { color: var(--brand-600); }
.has-scroll .n-atlas-progress { display: flex; align-items: center; gap: 12px; font: 7px var(--mono); letter-spacing: .05em; color: #898e96; }
.n-atlas-progress > i { display: block; width: 65px; height: 1px; background: #8b929b40; }
.n-atlas-progress b { display: block; height: 1px; background: var(--brand); transform: scaleX(var(--explore,0)); transform-origin: left; }

@media (min-width: 901px) and (min-height: 650px) {
  .has-scroll.n-x { height: 270svh; }
  .has-scroll .n-x__sticky { position: sticky; top: 0; height: 100svh; min-height: 0; max-width: none; width: 100%; padding: 0; display: block; overflow: hidden; }
  .has-scroll .n-x__copy { position: absolute; top: 50%; left: max(var(--gutter),calc((100vw - var(--container))/2)); width: min(40vw,540px); height: auto; transform: translateY(calc(-44% - var(--copy-shift,0px))); opacity: var(--copy-alpha,1); padding: 0; z-index: 2; }
  .has-scroll .n-x__copy h1 { font-size: clamp(58px,6.7vw,96px); }
  .has-scroll .n-x__copy > * { max-width: 100%; }
  .has-scroll .n-x__copy .n-lead { max-width: 38ch; }
  .has-scroll .n-studio { position: absolute; inset: 0; width: auto; }
  .has-scroll .n-studio__heading { position: absolute; top: calc(var(--stage-t) - 25px); left: var(--stage-l); right: var(--stage-r); margin: 0 2px; opacity: calc(1 - var(--explore)); }
  .has-scroll .n-x__frame { position: absolute; inset: 0; height: 100%; border-radius: 0; --it: var(--stage-t); --ir: var(--stage-r); --ib: var(--stage-b); --il: var(--stage-l); --rad: var(--stage-radius,16px); clip-path: inset(var(--it) var(--ir) var(--ib) var(--il) round var(--rad)); }
  .has-scroll .n-x__hud, .has-scroll .n-atlas { inset: var(--stage-t) var(--stage-r) var(--stage-b) var(--stage-l); }
  .has-scroll .n-x__tabs { position: absolute; z-index: 5; left: var(--dock-l); right: var(--dock-r); bottom: var(--dock-b); border: 1px solid #dadcde; border-radius: var(--dock-radius,0px 0px 12px 12px); }
  .has-scroll .n-x__tab, .has-scroll .n-x__tab.is-active { height: 66px; }
  .has-scroll .n-studio__caption { position: absolute; z-index: 4; left: var(--dock-l); right: var(--dock-r); bottom: calc(var(--dock-b) - 27px); margin: 0; }
  .has-scroll .n-x__outro { position: absolute; left: calc(var(--stage-l) + 32px); top: 50%; width: clamp(290px,27vw,365px); margin: 0; transform: translateY(calc(-41% + var(--card-shift,30px))); opacity: var(--card-alpha,0); visibility: hidden; z-index: 4; }
  .has-scroll.is-exploring .n-x__outro { visibility: visible; }
  .has-scroll .n-x__cue { display: flex; bottom: 25px; opacity: var(--copy-alpha,1); }
  .n-x__cue span { font: 9px var(--mono); }
  .n-x__cue b { margin-left: 16px; color: var(--brand-600); }
  .has-scroll .n-atlas-progress { position: absolute; left: calc(var(--stage-l) + 32px); bottom: calc(var(--stage-b) + 85px); z-index: 4; opacity: var(--card-alpha,0); }
  .is-exploring .n-x__tabs { background: #ffffff0c; border-color: #ffffff25; backdrop-filter: blur(20px); }
  .is-exploring .n-x__tab { color: #b8bfc7; }
  .is-exploring .n-x__tab + .n-x__tab { border-color: #ffffff13; }
  .is-exploring .n-x__tab.is-active, .is-exploring .n-x__tab:hover { background: #ffffff15; color: #fff; }
  .is-exploring .n-studio__caption { color: #a8aeb7; }
  .is-exploring .n-x__readout { position: fixed; top: calc(var(--stage-t) + 90px); right: calc(var(--stage-r) + 24px); }
  .is-exploring .n-atlas__legend span:first-child { display: block; }
  .is-exploring .n-x__hud-bottom { padding: 25px 32px; }
  .is-exploring .n-x__hud-title { font-size: 16px !important; }
}
@media (min-width: 901px) and (min-height: 650px) and (max-height: 800px) {
  .has-scroll .n-x__copy h1 { font-size: clamp(56px,5.6vw,78px); margin: 20px 0; }
  .has-scroll .n-x__copy .n-hero__trust { margin-top: 25px; padding-top: 18px; }
  .has-scroll .n-x__outro { padding: 22px; }
  .has-scroll .n-atlas-card__meta { padding-bottom: 17px; }
  .has-scroll .n-x__outro h2 { font-size: 25px; }
}
@media (max-width: 900px), (max-height: 649px) {
  .has-scroll .n-x__sticky { display: flex; flex-direction: column; align-items: stretch; gap: 36px; padding-bottom: 24px; }
  /* A real spacer keeps the studio inside the sticky containing block;
     bottom padding alone cannot provide that scrolling distance. */
  .has-scroll .n-x__sticky::after { content: ''; display: block; order: 3; flex: 0 0 100svh; pointer-events: none; }
  .has-scroll .n-studio { position: sticky; top: 82px; height: calc(100svh - 100px); min-height: 530px; display: flex; flex-direction: column; align-self: center; width: calc(100% + var(--mobile-bleed,0px)*2); max-width: none; }
  .has-scroll .n-studio__heading { flex: none; }
  .has-scroll .n-x__frame { height: auto; flex: 1; min-height: 260px; border-radius: 14px 14px 0 0; }
  .has-scroll .n-x__tabs { flex: none; border-radius: 0; }
  .has-scroll .n-x__tab, .has-scroll .n-x__tab.is-active { height: 59px; padding: 9px 3px; gap: 6px; }
  .has-scroll .n-studio__caption { margin: 0; padding: 10px 14px; background: #e8e9e8; font-size: 8px; }
  .has-scroll .n-studio__caption > span:last-child { display: none; }
  .has-scroll .n-x__outro { flex: none; min-height: 145px; position: relative; width: 100%; margin: 0; padding: 16px 20px; border: 1px solid #dde0e1; border-top: 0; border-radius: 0 0 12px 12px; box-shadow: none; background: #f4f4f1; }
  .has-scroll .n-x__outro { inset: auto; transform: none; }
  .has-scroll .n-x__outro h2 { font-size: 21px; line-height: 1.2; margin: 9px 0 12px; max-width: 38ch; }
  .has-scroll .n-x__outro p, .has-scroll .n-atlas-card__tags { display: none; }
  .has-scroll .n-atlas-card__meta { position: absolute; right: 20px; top: 17px; padding: 0; }
  .has-scroll .n-atlas-card__meta > span:first-child { display: none; }
  .has-scroll .n-x__outro a { padding-top: 10px; font-size: 10px; }
  .has-scroll .n-atlas-progress { margin-top: 12px; justify-content: center; }
  .has-scroll .n-atlas__axis { display: none; }
  .has-scroll .n-atlas__number { top: 8%; right: 7%; font-size: 230px; }
  .has-scroll .n-atlas__ruler { right: 15px; opacity: .3; }
  .has-scroll .n-x__copy { width: 100%; }
}
@media (max-width: 600px) {
  .has-scroll .n-studio { top: 76px; height: calc(100svh - 100px); }
  .has-scroll .n-x__tabs { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .has-scroll .n-x__tab, .has-scroll .n-x__tab.is-active { height: 47px; flex-direction: row; gap: 6px; }
  .has-scroll .n-x__tab i { font-size: 12px; }
  .has-scroll .n-x__tab span { font-size: 8px; }
  .has-scroll .n-x__outro h2 { font-size: 19px; }
  .has-scroll .n-x__hud-bottom { padding: 12px; gap: 6px; }
  .has-scroll .n-x__tools { padding: 3px; }
  .has-scroll .n-x__tool { width: 28px; height: 31px; }
  .has-scroll .n-x__readout { padding: 7px; }
  .has-scroll .n-x__bar { width: 73px; }
  .has-scroll .n-x__outro { min-height: 150px; }
}
@media (prefers-reduced-motion: reduce) {
  .n-atlas__number { opacity: .6; }
}