/* Ancient Languages — homepage styles.
   Base derived from /proofs/ancient_languages_homepage_proof.html (inline-styled proof);
   section classes + mobile responsiveness per Phase 5b brief. */

/* HERO */
.hero { padding: 5rem 0 4rem; background: var(--white); }
.hero-inner { display: flex; gap: 3rem; align-items: center; }
.hero-content { flex: 1; min-width: 0; }
.hero h1 { font-family: 'Cormorant Garamond', serif; font-size: 54px; font-weight: 600; font-style: italic; color: var(--text); line-height: 1.1; margin-bottom: 1.5rem; }
.hero h1 .underline { display: inline-block; border-bottom: 2px solid var(--gold); padding-bottom: 2px; color: var(--blue); }
.hero-sub { font-family: 'Inter', sans-serif; font-size: 17px; color: var(--text-mid); line-height: 1.7; margin-bottom: 2rem; max-width: 520px; }
.hero-image { width: 220px; flex-shrink: 0; }
.hero-photo { width: 220px; height: 280px; background: var(--blue-light); border-radius: 4px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.hero-photo span { font-family: 'Cormorant Garamond', serif; font-size: 80px; font-style: italic; color: var(--blue); opacity: 0.3; line-height: 1; }
.hero-photo p { font-family: 'Inter', sans-serif; font-size: 11px; color: var(--text-muted); margin-top: 8px; }
.hero-photo-img { width: 220px; height: 280px; object-fit: cover; border-radius: 4px; }

/* STATS BAR (grid so it collapses cleanly on mobile) */
.stats { padding: 1rem 0 3rem; background: var(--white); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3rem; border-top: 1px solid var(--border); padding-top: 2rem; }
.stats-grid > div { text-align: center; }
.stat-number { font-family: 'Cormorant Garamond', serif; font-size: 36px; font-weight: 600; color: var(--blue); }
.stat-label { font-family: 'Inter', sans-serif; font-size: 13px; color: var(--text-muted); }

/* HELPERS */
.view-all { text-align: center; margin-top: 2rem; }

/* About snippet — homepage */
.home-about { padding: 5rem 0; }
.home-about-inner { display: flex; gap: 3rem; align-items: center; }
.home-about-photo { width: 200px; flex-shrink: 0; }
.home-about-circle { width: 200px; height: 200px; border-radius: 50%; background: var(--blue-light); display: flex; align-items: center; justify-content: center; }
.home-about-circle span { font-family: var(--font-serif); font-size: 52px; font-style: italic; color: var(--blue); opacity: 0.4; }
.home-about-photo img { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; }
.home-about-content h2 { font-family: var(--font-serif); font-size: 34px; font-weight: 500; color: var(--text); margin-bottom: 1rem; line-height: 1.25; }
.home-about-content p:not(.section-eyebrow) { font-size: 15px; color: var(--text-mid); line-height: 1.75; margin-bottom: 1.5rem; }

/* Testimonials — homepage */
.home-testimonials { padding: 5rem 0; background: var(--surface); }
.home-testimonial-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }

/* YouTube + Etymology — homepage */
.home-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
.home-col-heading { font-family: var(--font-serif); font-size: 32px; font-weight: 500; color: var(--text); margin-bottom: 1.5rem; line-height: 1.2; }
.home-video-placeholder { background: var(--surface); border-radius: 4px; height: 210px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; border: 1px solid var(--border); }
.home-video-placeholder p { font-size: 12px; color: var(--text-muted); }
.home-etymology-block { border-left: 3px solid var(--gold); padding-left: 1.5rem; }
.home-etymology-word { font-family: var(--font-serif); font-size: 36px; font-weight: 600; color: var(--blue); margin-bottom: 0.5rem; }
.home-etymology-text { font-size: 13px; color: var(--text-mid); line-height: 1.7; margin-bottom: 1rem; }

/* RESPONSIVE */
@media (max-width: 900px) {
  .hero h1 { font-size: 44px; }
  .hero-inner { flex-direction: column-reverse; gap: 2rem; }
  .hero-image { width: 100%; }
  .hero-photo { width: 100%; height: 220px; }
  .hero-photo-img { width: 100%; height: 220px; object-fit: cover; }
  .home-about-inner { flex-direction: column; gap: 2rem; }
  .home-about-photo { width: 140px; }
  .home-about-circle { width: 140px; height: 140px; }
  .home-about-photo img { width: 140px; height: 140px; }
  .home-about-content h2 { font-size: 28px; }
  .home-testimonial-grid { grid-template-columns: 1fr 1fr; }
  .home-two-col { grid-template-columns: 1fr; gap: 2.5rem; }
}
@media (max-width: 600px) {
  .hero h1 { font-size: 34px; }
  .hero-sub { font-size: 15px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .home-testimonial-grid { grid-template-columns: 1fr; }
}

/* Section padding — Featured courses + YouTube/Etymology (Phase 5c) */
.home-featured { padding: 5rem 0; }
.home-media { padding: 5rem 0; }