/* hero.css — Slide 1 · Hero. OWNER hero.
   Usa variables de tokens.css. No redefine la paleta. */

#slide-2{
  height:100vh;                 /* exacto: sin banda muerta debajo */
  min-height:100vh;
  align-items:stretch;          /* el hero ocupa toda la slide */
}

.hero{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
}

/* ---- Imagen de fondo --------------------------------------------------- */
.hero__bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 42%;       /* conserva mano (abajo-izq) y codo (arriba-der) */
  z-index:0;                      /* fondo original estático (sin ken-burns ni glow) */
}

/* (El veil se retiró: el PNG del hero tiene el fondo recortado con alfa y la
   capa fluida global debe verse idéntica en todas las slides. La legibilidad
   del texto la dan los text-shadow.) */

/* ---- Marca (arriba-izquierda) ----------------------------------------- */
.hero__brand{
  position:absolute;
  z-index:3;
  top:clamp(40px,9vh,104px);
  left:clamp(24px,5vw,80px);
  max-width:min(54vw,680px);
}
.hero__wordmark{
  font-family:var(--font-head);
  font-weight:700;
  font-size:clamp(2.8rem,7.8vw,6.6rem);
  line-height:.92;
  letter-spacing:-.04em;
  color:var(--ink);
  text-shadow:0 4px 50px rgba(0,0,0,.55);
}
/* (El span .hero__wordmark-alt "ROBOTICS" se retiró del wordmark; regla eliminada.) */
.hero__tagline{
  margin-top:clamp(.7rem,1.6vh,1.1rem);
  font-family:var(--font-head);
  font-weight:600;
  font-size:clamp(.82rem,1.5vw,1.05rem);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent-soft);
}
/* línea de acento roja bajo el tagline — toque de marca */
.hero__tagline::after{
  content:"";
  display:block;
  width:clamp(48px,7vw,96px);
  height:2px;
  margin-top:.85rem;
  background:linear-gradient(90deg,var(--red),var(--red-soft));
  box-shadow:0 0 16px rgba(255,59,48,.55);
}

/* ---- Pitch (abajo-derecha) -------------------------------------------- */
.hero__pitch{
  position:absolute;
  z-index:3;
  right:clamp(24px,5vw,80px);
  bottom:clamp(96px,16vh,168px);
  max-width:min(86vw,470px);
  text-align:right;
}
.hero__lede{
  font-size:clamp(1.02rem,1.5vw,1.24rem);
  line-height:1.55;
  color:var(--ink);
  text-shadow:0 2px 28px rgba(0,0,0,.72);
}
.hero__stats{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.6rem;
  margin-top:1.25rem;
}
.hero__chip{
  display:inline-flex;
  align-items:baseline;
  gap:.4em;
  padding:.5rem .95rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--glass);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  font-size:.82rem;
  color:var(--muted);
  letter-spacing:.01em;
}
.hero__chip strong{
  font-family:var(--font-head);
  font-weight:700;
  color:var(--ink);
}
.hero__chip:nth-child(2) strong{color:var(--red-soft)}

/* ---- Indicador de scroll (abajo-centro) ------------------------------- */
.hero__scroll{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:clamp(22px,4vh,40px);
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.55rem;
  text-decoration:none;
}
.hero__scroll-label{
  font-family:var(--font-head);
  font-size:.64rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--steel-dim);
}
.hero__scroll-chevron{
  width:18px;
  height:18px;
  border-right:2px solid var(--accent-soft);
  border-bottom:2px solid var(--accent-soft);
  transform:rotate(45deg);
}

/* ---- Responsive -------------------------------------------------------- */
@media (max-width:760px){
  /* móvil: brazo a la izquierda; SIN escalado (no crece, se ve más alejada) y
     subida con translateY. El borde inferior queda navy pero lo cubre el velo. */
  .hero__bg{object-position:35% 46%; transform:translateY(-14%)}
  .hero__brand{max-width:84vw;top:clamp(32px,7vh,72px)}
  .hero__pitch{
    left:clamp(24px,6vw,40px);
    right:clamp(24px,6vw,40px);
    bottom:clamp(80px,13vh,112px);
    max-width:none;
    text-align:left;
  }
  .hero__stats{justify-content:flex-start}
  .hero__tagline::after{margin-inline:0}
}