.hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  align-items: end;
  padding: calc(var(--ajeb-nav-h) + 1rem) 0 2.5rem;
  overflow: hidden;
  background:
    radial-gradient(ellipse 80% 60% at 72% 42%, oklch(0.96 0.03 85) 0%, transparent 58%),
    linear-gradient(180deg, oklch(0.975 0.014 85), var(--ajeb-ivory) 72%);
}

.hero__atmosphere {
  position: absolute;
  inset: 8% 6% auto auto;
  width: min(52vw, 42rem);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, oklch(0.96 0.04 90 / 0.7), transparent 68%);
  filter: blur(8px);
  pointer-events: none;
}

.hero__smoke {
  position: absolute;
  inset: 0 0 auto auto;
  width: min(70vw, 56rem);
  height: 80%;
  object-fit: cover;
  opacity: 0.28;
  mix-blend-mode: multiply;
  pointer-events: none;
}

.hero__grid {
  width: min(100% - (var(--ajeb-pad) * 2), var(--ajeb-wide));
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(1rem, 4vw, 4rem);
  align-items: end;
  position: relative;
  z-index: 1;
}

.hero__copy {
  padding-bottom: 4vh;
}

.hero__index {
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ajeb-champagne);
  margin-bottom: 1.4rem;
}

.hero h1 {
  font-size: var(--ajeb-fs-display);
  max-width: 9.4ch;
  font-weight: 430;
}

.hero__lead {
  margin-top: 1.5rem;
  max-width: 36ch;
  color: var(--ajeb-muted);
  font-size: 1.05rem;
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 2.2rem;
}

.hero__stage {
  position: relative;
  min-height: min(78vh, 46rem);
}

.hero__light {
  position: absolute;
  inset: 12% 10% 18%;
  background: radial-gradient(circle, oklch(0.99 0.01 85) 0%, transparent 70%);
  opacity: 0.9;
}

.hero__shadow {
  position: absolute;
  left: 22%;
  right: 18%;
  bottom: 7%;
  height: 3.2rem;
  background: radial-gradient(ellipse, oklch(0.3 0.02 55 / 0.22), transparent 70%);
  filter: blur(6px);
}

.hero__product {
  position: absolute;
  left: 50%;
  bottom: 8%;
  width: min(62%, 26rem);
  transform: translateX(-50%);
  filter: drop-shadow(0 28px 28px oklch(0.3 0.02 55 / 0.18));
  z-index: 3;
}

.hero__fruit {
  position: absolute;
  width: min(38%, 16rem);
  mix-blend-mode: multiply;
  pointer-events: none;
}

.hero__fruit--grapes {
  left: 2%;
  top: 8%;
  width: min(46%, 20rem);
  z-index: 2;
}

.hero__fruit--apple {
  right: -2%;
  top: 18%;
  width: min(34%, 14rem);
  z-index: 4;
}

.hero__fruit--berries {
  left: 8%;
  bottom: 6%;
  width: min(32%, 13rem);
  z-index: 4;
}

.hero__meta {
  width: min(100% - (var(--ajeb-pad) * 2), var(--ajeb-wide));
  margin: 1.5rem auto 0;
  display: flex;
  gap: 2rem;
  position: relative;
  z-index: 2;
  color: var(--ajeb-muted);
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

@media (max-width: 980px) {
  .hero {
    align-items: stretch;
  }

  .hero__grid {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .hero h1 {
    max-width: 11ch;
  }

  .hero__stage {
    min-height: 62vh;
    order: -1;
  }

  .hero__copy {
    padding-bottom: 1rem;
  }
}