/* Homepage-only styles. No upstream reset or global scroll behavior. */
.buddy-intro { min-height: 330px; isolation: isolate; }
.buddy-intro .hero-copy { max-width: 59%; }
.buddy-intro .hero-art { opacity: 1; width: 37%; height: 112%; top: -6%; }
.buddy-intro .hero-art img { width: 235%; left: -69%; top: auto; bottom: -14%; }
.buddy-intro .intro-board {
  position: absolute; width: 230px; height: 230px; right: 22%; bottom: -150px;
  background: repeating-conic-gradient(#d7eb9a22 0% 25%, transparent 0% 50%) 0 0 / 56px 56px;
  rotate: -12deg; border: 1px solid #d7eb9a33; border-radius: 12px; z-index: -1;
}
.buddy-intro .intro-route {
  position: absolute; right: 24px; bottom: 20px; display: flex; gap: 9px;
  padding: 11px 14px; background: #fff9e8; color: #214e3d;
  border-radius: 14px; box-shadow: 0 7px 18px #102c3433;
  font-weight: 900; font-size: 17px; align-items: center;
}
.buddy-intro .intro-route span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: #d7ec9b; }
.buddy-intro .intro-route small { font-size: 13px; }
.buddy-intro .intro-caption { margin-top: 14px; margin-bottom: 0; color: #e0ecd6; font-size: 12px; }
.buddy-intro :focus-visible { outline: 3px solid #fff9e8; outline-offset: 5px; }
@media (max-width: 700px) {
  .buddy-intro { display: block; min-height: 0; padding: 26px 22px 190px; }
  .buddy-intro .hero-copy { max-width: 100%; }
  .buddy-intro h1 { font-size: clamp(28px, 6.8vw, 38px); }
  .buddy-intro .hero-art { top: auto; bottom: -10px; width: 190px; height: 185px; border-radius: 90px 0 0 0; }
  .buddy-intro .hero-art img { top: auto; bottom: -14%; }
  .buddy-intro .intro-board { right: auto; left: 18px; bottom: -145px; }
  .buddy-intro .intro-route { left: 22px; right: auto; bottom: 26px; font-size: 15px; padding: 9px; gap: 6px; }
  .buddy-intro .intro-route small { max-width: 64px; line-height: 1.2; }
}
@media (prefers-reduced-motion: reduce) {
  .buddy-intro [data-sc-parallax] { transform: none !important; }
}