/* TENET AI hero — styles isolated from the rest of the site. */
    /* ─── Sección ─────────────────────────────────────────── */
    .ai-hero {
      position: relative;
      min-height: 100svh;
      display: grid;
      place-items: center;
      overflow: hidden;
      isolation: isolate;
      background: var(--ink);
      cursor: default;
    }
    .ai-hero canvas {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: -2;
    }
    /* viñeta cinematográfica + grano de película */
    .ai-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      background:
        radial-gradient(ellipse 38% 30% at 50% 50%, color-mix(in srgb, var(--ink) 50%, transparent), transparent 100%),
        radial-gradient(ellipse 120% 90% at 50% 50%, transparent 60%, color-mix(in srgb, var(--ink) 65%, transparent) 100%);
    }
    .ai-hero::after {
      content: "";
      position: absolute;
      inset: -50%;
      z-index: 2;
      pointer-events: none;
      opacity: .035;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
      animation: ai-hero-grain 1s steps(6) infinite;
    }
    @keyframes ai-hero-grain {
      0% { transform: translate(0,0); } 20% { transform: translate(-4%,3%); } 40% { transform: translate(3%,-5%); }
      60% { transform: translate(-2%,-2%); } 80% { transform: translate(5%,4%); } 100% { transform: translate(0,0); }
    }

    .ai-hero__copy {
      position: relative;
      z-index: 1;
      width: min(1180px, 100%);
      padding: 120px var(--page) 110px;
      text-align: center;
      pointer-events: none;
    }
    .ai-hero__eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin: 0 0 28px;
      font: 600 11px/1 var(--mono);
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--muted);
    }
    .ai-hero__eyebrow i {
      width: 7px; height: 7px; border-radius: 50%;
      background: var(--signal);
      box-shadow: 0 0 0 0 color-mix(in srgb, var(--signal) 60%, transparent);
      animation: ai-hero-ping 2.4s var(--ease) infinite;
    }
    @keyframes ai-hero-ping { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--signal) 55%, transparent); } 70%,100% { box-shadow: 0 0 0 12px transparent; } }

    .ai-hero h2 {
      margin: 0;
      font-size: clamp(46px, 8.6vw, 138px);
      font-weight: 300;
      line-height: .94;
      letter-spacing: -.065em;
      text-wrap: balance;
      text-shadow: 0 0 40px color-mix(in srgb, var(--ink) 85%, transparent);
    }
    /* el punto cian: la misma señal del logo */
    .ai-hero h2 .dot { color: var(--signal); }
    .ai-hero .ai-hero__caret {
      display: inline-block;
      width: .07em;
      height: .82em;
      margin-left: .05em;
      vertical-align: baseline;
      background: var(--signal);
      animation: ai-hero-caret-blink 1s steps(1) infinite;
    }
    @keyframes ai-hero-caret-blink { 50% { opacity: 0; } }
    .ai-hero__lead {
      max-width: 34em;
      margin: 30px auto 0;
      font-size: clamp(16px, 1.35vw, 19px);
      line-height: 1.5;
      color: var(--paper); opacity: .82;
      text-shadow: 0 0 24px color-mix(in srgb, var(--ink) 90%, transparent);
    }
    .ai-hero__cta { margin-top: 40px; pointer-events: auto; }

    .ai-hero .button:focus-visible { outline: 2px solid var(--signal-2); outline-offset: 4px; }

    .ai-hero__hint {
      position: absolute;
      left: 50%;
      bottom: 28px;
      transform: translateX(-50%);
      z-index: 1;
      font: 500 10px/1 var(--mono);
      letter-spacing: .16em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 55%, transparent);
      pointer-events: none;
      transition: opacity .8s var(--ease);
    }
    .ai-hero.is-touched .ai-hero__hint { opacity: 0; }

    /* entrada */
    .ai-hero__copy > * { opacity: 0; transform: translateY(18px); animation: ai-hero-rise 1.1s var(--ease) forwards; }
    .ai-hero__copy > :nth-child(2) { animation-delay: .12s; }
    .ai-hero__copy > :nth-child(3) { animation-delay: .26s; }
    .ai-hero__copy > :nth-child(4) { animation-delay: .38s; }
    @keyframes ai-hero-rise { to { opacity: 1; transform: none; } }


    /* Cursor: el punto cian del logo (solo con mouse) */
    .ai-hero .ai-cursor {
      position: absolute;
      left: 0; top: 0;
      z-index: 3;
      width: 14px; height: 14px;
      margin: -7px 0 0 -7px;
      border-radius: 50%;
      background: var(--signal);
      box-shadow: 0 0 18px 2px color-mix(in srgb, var(--signal) 28%, transparent);
      pointer-events: none;
      opacity: 0;
      transition: opacity .24s var(--ease), width .24s var(--ease), height .24s var(--ease), margin .24s var(--ease);
      will-change: transform;
    }
    .ai-hero.has-cursor .ai-cursor { opacity: 1; }
    .ai-hero.over-cta .ai-cursor { width: 6px; height: 6px; margin: -3px 0 0 -3px; }
    @media (hover: hover) and (pointer: fine) {
      .ai-hero, .ai-hero * { cursor: none; }
      .ai-hero .button { cursor: pointer; }
    }
    @media (hover: none) { .ai-hero .ai-cursor { display: none; } }
    @media (hover: none) { .ai-hero { cursor: auto; } .ai-hero__hint { display: none; } }
    @media (prefers-reduced-motion: reduce) {
      .ai-hero::after, .ai-hero__eyebrow i { animation: none; }
      .ai-hero__copy > * { animation: none; opacity: 1; transform: none; }
    }
    @media (max-width: 600px) {
      .ai-hero { min-height: min(760px, 100svh); }
      .ai-hero__copy { padding-block: 104px 92px; }
      .ai-hero h2 { font-weight: 400; }
    }
