/* Landing-page visual layer: intentionally scoped to the two shared service heroes. */
#root section.mx-auto.max-w-6xl.px-4.pb-12.pt-10,
#root section.mx-auto.max-w-3xl.px-4.pb-10.pt-10 {
  position: relative;
  isolation: isolate;
  margin-top: 1rem;
  margin-bottom: 1.75rem;
  padding: clamp(1.75rem, 4vw, 3.5rem);
  border: 1px solid hsl(var(--primary) / 0.13);
  border-radius: 2rem;
  background:
    radial-gradient(circle at 88% 10%, hsl(var(--secondary) / 0.95), transparent 32rem),
    linear-gradient(135deg, hsl(var(--mist) / 0.74), hsl(var(--background)) 58%);
  box-shadow: 0 24px 70px -42px hsl(var(--primary) / 0.82);
  overflow: hidden;
}

#root section.mx-auto.max-w-6xl.px-4.pb-12.pt-10::after,
#root section.mx-auto.max-w-3xl.px-4.pb-10.pt-10::after {
  position: absolute;
  z-index: -1;
  right: -5rem;
  bottom: -7rem;
  width: 17rem;
  height: 17rem;
  border-radius: 999px;
  background: hsl(var(--leaf) / 0.1);
  content: '';
}

#root section.mx-auto.max-w-6xl.px-4.pb-12.pt-10 h1,
#root section.mx-auto.max-w-3xl.px-4.pb-10.pt-10 h1 {
  max-width: 15ch;
  text-wrap: balance;
}

#root section.mx-auto.max-w-6xl.px-4.pb-12.pt-10 [data-slot='button'],
#root section.mx-auto.max-w-3xl.px-4.pb-10.pt-10 [data-slot='button'],
#root section.mx-auto.max-w-6xl.px-4.pb-12.pt-10 button,
#root section.mx-auto.max-w-3xl.px-4.pb-10.pt-10 button {
  box-shadow: 0 12px 24px -14px hsl(var(--primary) / 0.8);
}

@media (max-width: 640px) {
  #root section.mx-auto.max-w-6xl.px-4.pb-12.pt-10,
  #root section.mx-auto.max-w-3xl.px-4.pb-10.pt-10 {
    border-radius: 1.5rem;
  }
}