/* Homepage revision: a single classroom scene. All rules are hero-scoped. */
.hero-v2 { background: #f3f8fc; }
.hero-v2 .hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  gap: clamp(32px, 5vw, 76px);
  min-height: 610px;
  padding-block: 64px;
}
.hero-v2 h1 {
  font-size: clamp(44px, 4.7vw, 68px);
  line-height: 1.08;
  max-width: 560px;
  margin-bottom: 24px;
}
.hero-v2 .eyebrow { font-size: 14px; letter-spacing: .11em; }
.hero-v2 .lede { font-size: 19px; max-width: 490px; }
.hero-v2 .hero-note { font-size: 14px; }
.hero-v2 .hero-scene {
  margin: 0;
  overflow: hidden;
  border-radius: 96px 22px 96px 22px;
  border-bottom: 6px solid var(--gold);
  background: #e9f3f9;
}
.hero-v2 .hero-scene img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
@media (max-width: 1050px) and (min-width: 761px) {
  .hero-v2 .hero-grid { gap: 32px; min-height: 560px; }
  .hero-v2 h1 { font-size: clamp(44px, 4.7vw, 56px); }
  .hero-v2 .hero-scene { border-radius: 64px 18px 64px 18px; }
}
@media (max-width: 760px) {
  .hero-v2 .hero-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; min-height: 0; padding-block: 40px; }
  .hero-v2 h1 { font-size: clamp(40px, 10.8vw, 52px); max-width: 520px; }
  .hero-v2 .eyebrow { font-size: 13px; letter-spacing: .09em; }
  .hero-v2 .lede { font-size: 18px; }
  .hero-v2 .hero-note { font-size: 14px; max-width: none; }
  .hero-v2 .hero-scene { width: 100%; max-width: 560px; margin-inline: auto; border-radius: 54px 16px 54px 16px; border-bottom-width: 4px; }
}