/* Deploy polish: strengthen first-fold food/brand signal without rebuilding source. */
.hero__visual::before {
  content: "";
  pointer-events: none;
  z-index: 1;
  position: absolute;
  inset: 8% 5% 4% 5%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 48%, rgba(224, 122, 31, 0.18), transparent 58%),
    url("/food/freshroot-mix.png") center / contain no-repeat;
  filter: drop-shadow(0 42px 70px rgba(0, 0, 0, 0.58));
  opacity: 0.94;
}

.hero__visual::after {
  content: "";
  pointer-events: none;
  z-index: 2;
  position: absolute;
  right: 6%;
  bottom: 9%;
  width: clamp(82px, 9vw, 128px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(210, 166, 79, 0.42);
  background:
    linear-gradient(160deg, rgba(10, 10, 11, 0.54), rgba(10, 10, 11, 0.08)),
    url("/logos/freshroot-parent.jpg") center / cover no-repeat;
  box-shadow:
    0 26px 54px rgba(0, 0, 0, 0.46),
    0 0 0 10px rgba(224, 122, 31, 0.08);
}

.hero__canvas {
  opacity: 0.58;
}

.hero__float {
  z-index: 4;
  filter: drop-shadow(0 34px 54px rgba(0, 0, 0, 0.65)) saturate(1.08);
}

.hero__sub {
  color: rgba(244, 237, 224, 0.76);
}

@media (max-width: 980px) {
  .hero__visual {
    height: clamp(320px, 44vh, 460px);
  }

  .hero__visual::before {
    inset: 0 0 2% 0;
    opacity: 0.9;
  }

  .hero__visual::after {
    width: 84px;
    right: 8%;
    bottom: 6%;
  }
}

@media (max-width: 520px) {
  .hero {
    padding-top: calc(var(--header-h) + 0.7rem);
  }

  .hero__visual {
    height: 300px;
  }

  .hero__visual::before {
    inset: 0 -8% 0 -8%;
  }

  .hero__float {
    width: 92px;
  }

  .hero__float--2 {
    width: 108px;
  }
}