/* Production tech landing desktop correction.
   Keeps the current compiled release usable until its source snapshot is restored. */

@media screen and (min-width: 1101px) {
  :root {
    --nuteva-wide-max: 2560px;
    --nuteva-wide-gutter: clamp(24px, 2vw, 40px);
    --nuteva-wide-inset: max(
      var(--nuteva-wide-gutter),
      calc((100vw - var(--nuteva-wide-max)) / 2)
    );
  }

  /* One width contract for navigation, routes and footer. */
  .n2-main,
  .n2-header,
  .n2-shell .site-footer {
    width: min(
      calc(100% - 2 * var(--nuteva-wide-gutter)),
      var(--nuteva-wide-max)
    );
  }

  /* The technical home is intentionally full bleed. */
  .n2-shell.is-tech-home .n2-main {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  .n2-shell.is-tech-home .n2-nav,
  .n2-shell.is-tech-home .site-footer {
    width: min(
      calc(100% - 2 * var(--nuteva-wide-gutter)),
      var(--nuteva-wide-max)
    );
  }

  /* The LCP copy and React copy must share the same fixed geometry. */
  .ts-hero-copy,
  .nuteva-lcp-copy {
    top: clamp(178px, 25vh, 258px);
    left: var(--nuteva-wide-inset);
    width: min(64vw, 1080px);
    transform: none;
  }

  .ts-hero-copy h1,
  .nuteva-lcp-copy h1 {
    font-size: clamp(54px, 6.6vw, 116px);
    line-height: .9;
  }

  .ts-hero-copy h1 span,
  .nuteva-lcp-copy h1 span {
    white-space: nowrap;
  }

  .ts-hero-copy h1 span:last-child,
  .nuteva-lcp-copy h1 span:last-child {
    margin-left: clamp(20px, 5vw, 88px);
  }

  .ts-lead {
    width: min(100%, 600px);
    margin-top: 28px;
  }

  .ts-actions {
    margin-top: 28px;
  }

  /* Reuse the same wide inset across the desktop story. */
  .ts-stream {
    padding-inline: var(--nuteva-wide-inset);
  }

  .ts-stream-visual {
    margin-inline: calc(-1 * var(--nuteva-wide-inset));
  }

  .ts-stream-labels {
    left: var(--nuteva-wide-inset);
    right: var(--nuteva-wide-inset);
  }

  .ts-stream-visual > strong {
    right: var(--nuteva-wide-inset);
  }

  .ts-context-copy,
  .ts-final-copy {
    left: var(--nuteva-wide-inset);
  }

  /* Keep the context story in two independent safe zones.
     The generated signal map may fill the viewport, but controls never enter
     the editorial text lane. */
  .ts-context-copy {
    top: 15%;
    width: clamp(520px, 50vw, 900px);
  }

  .ts-context-copy h2 {
    max-width: 100%;
    font-size: clamp(46px, 3.9vw, 72px);
    line-height: .97;
  }

  .ts-context-copy > p:last-child {
    width: min(100%, 520px);
  }

  .ts-context-readout {
    left: 76%;
  }

  .ts-signal-switch button:first-child {
    top: 14%;
    left: 61%;
  }

  .ts-signal-switch button:nth-child(2) {
    top: 25%;
    right: 3%;
  }

  .ts-signal-switch button:nth-child(3) {
    right: 4%;
    bottom: 16%;
  }

  .ts-signal-switch button:nth-child(4) {
    bottom: 7%;
    left: 66%;
  }

  .ts-signal-switch button:nth-child(5) {
    top: 58%;
    left: 60%;
  }

  .ts-workspace,
  .ts-identity {
    padding-inline: var(--nuteva-wide-inset);
  }

  .ts-final-copy {
    width: min(70vw, 1240px);
  }

  .ts-stream-head {
    grid-template-columns: minmax(80px, .35fr) minmax(520px, 1.9fr) minmax(250px, .65fr);
  }

  .ts-stream-head h2 {
    font-size: clamp(48px, 4.8vw, 84px);
  }

  .ts-workspace-head {
    grid-template-columns: minmax(80px, .3fr) minmax(600px, 2fr) minmax(220px, .6fr);
  }

  .ts-workspace-head h2 {
    font-size: clamp(48px, 4.8vw, 84px);
  }

  .ts-ai-copy {
    width: 68%;
    margin-left: 32%;
  }

  .ts-ai-copy h2 {
    max-width: 960px;
    font-size: clamp(46px, 4vw, 72px);
  }

  .ts-identity-copy {
    width: min(60%, 980px);
  }

  .ts-identity-copy h2 {
    font-size: clamp(50px, 5vw, 84px);
  }

  /* A moving glint, not a neon tube: the artwork already carries the main
     amber filament, so this SVG layer only adds a restrained pulse. */
  .ts-identity-current {
    stroke-dasharray: .045 .955;
  }

  .ts-identity-current-halo {
    stroke-width: 6.5px;
    filter: blur(2.6px) drop-shadow(0 0 4px rgb(255 113 89 / .42));
  }

  .ts-identity-current-core {
    stroke-width: 1.15px;
    filter:
      drop-shadow(0 0 1px rgb(255 255 255 / .76))
      drop-shadow(0 0 3.5px rgb(255 181 107 / .64));
  }

  .ts-final-copy h2 {
    font-size: clamp(50px, 5.2vw, 92px);
  }

  /* True alpha fades prevent generated-image rectangles on dark backgrounds. */
  .ts-core-visual canvas {
    -webkit-mask-image: radial-gradient(
      ellipse 88% 94% at 70% 50%,
      #000 0 58%,
      rgb(0 0 0 / .9) 70%,
      transparent 100%
    );
    mask-image: radial-gradient(
      ellipse 88% 94% at 70% 50%,
      #000 0 58%,
      rgb(0 0 0 / .9) 70%,
      transparent 100%
    );
  }

  .ts-stream-media {
    -webkit-mask-image: radial-gradient(
      ellipse 92% 91% at 50% 50%,
      #000 0 62%,
      rgb(0 0 0 / .88) 76%,
      transparent 100%
    );
    mask-image: radial-gradient(
      ellipse 92% 91% at 50% 50%,
      #000 0 62%,
      rgb(0 0 0 / .88) 76%,
      transparent 100%
    );
  }

  .ts-ai-visual {
    -webkit-mask-image: radial-gradient(
      ellipse 93% 91% at 42% 50%,
      #000 0 60%,
      rgb(0 0 0 / .88) 76%,
      transparent 100%
    );
    mask-image: radial-gradient(
      ellipse 93% 91% at 42% 50%,
      #000 0 60%,
      rgb(0 0 0 / .88) 76%,
      transparent 100%
    );
  }

  .ts-workspace-parallax {
    -webkit-mask-image: radial-gradient(
      ellipse 94% 92% at 50% 50%,
      #000 0 64%,
      rgb(0 0 0 / .9) 79%,
      transparent 100%
    );
    mask-image: radial-gradient(
      ellipse 94% 92% at 50% 50%,
      #000 0 64%,
      rgb(0 0 0 / .9) 79%,
      transparent 100%
    );
  }

  .ts-identity-visual {
    -webkit-mask-image: radial-gradient(
      ellipse 94% 91% at 72% 50%,
      #000 0 61%,
      rgb(0 0 0 / .88) 77%,
      transparent 100%
    );
    mask-image: radial-gradient(
      ellipse 94% 91% at 72% 50%,
      #000 0 61%,
      rgb(0 0 0 / .88) 77%,
      transparent 100%
    );
  }

  .ts-final-aperture {
    -webkit-mask-image: radial-gradient(
      ellipse 96% 94% at 72% 50%,
      #000 0 61%,
      rgb(0 0 0 / .9) 78%,
      transparent 100%
    );
    mask-image: radial-gradient(
      ellipse 96% 94% at 72% 50%,
      #000 0 61%,
      rgb(0 0 0 / .9) 78%,
      transparent 100%
    );
  }
}