/* =====================================================================
   HOME.CSS — Density redesign for the home page (index.html)
   Scoped under body.home-page so it doesn't affect other pages.
   ===================================================================== */

/* ---- Hero — cut huge padding ---- */
body.home-page .hero {
  padding: 60px 0 64px !important;
}
body.home-page .hero h1 {
  font-size: clamp(2rem, 4vw, 3rem) !important;
  line-height: 1.1 !important;
  margin: 0.4rem 0 0.8rem !important;
}
body.home-page .hero .hero-copy > p,
body.home-page .hero-copy p {
  font-size: 1.02rem !important;
  line-height: 1.55 !important;
  margin: 0 0 1.2rem !important;
}
body.home-page .hero-actions {
  margin-bottom: 1.5rem !important;
}
body.home-page .hero-trust {
  margin-top: 1.2rem !important;
  gap: 1.5rem !important;
}
body.home-page .hero-trust .item {
  font-size: 0.85rem !important;
}

/* ---- Form card (hero side) ---- */
body.home-page .hero .rate-card {
  padding: 24px 28px !important;
}
body.home-page .hero .rate-card h2 {
  font-size: 1.5rem !important;
  margin: 0 0 0.4rem !important;
}
body.home-page .hero .rate-card > p {
  font-size: 0.88rem !important;
  margin: 0 0 1rem !important;
}
body.home-page .hero .rate-card label {
  font-size: 0.7rem !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 4px !important;
}
body.home-page .hero .rate-card input,
body.home-page .hero .rate-card select {
  padding: 8px 12px !important;
  font-size: 0.92rem !important;
  margin-bottom: 8px !important;
}

/* ---- Trust strip — tighten ---- */
body.home-page .trust-strip {
  padding: 16px 0 !important;
}

/* ---- Quick-answer band below hero ---- */
body.home-page > main > .quick-answer-section,
body.home-page .quick-answer-section {
  padding: 18px 0 !important;
}
body.home-page .quick-answer-section .container {
  background: #fff8f1;
  border-left: 3px solid var(--brand-orange, #f08030);
  padding: 14px 18px;
  border-radius: 0 6px 6px 0;
}
body.home-page .quick-answer-section p {
  font-size: 0.95rem !important;
  line-height: 1.55 !important;
  margin: 0 !important;
}

/* ---- Section padding — cut everywhere ---- */
body.home-page section.program-section,
body.home-page .process-section,
body.home-page .cities-section,
body.home-page .faq-section,
body.home-page .learning-section,
body.home-page main > section {
  padding: 40px 0 !important;
}

/* ---- Section heads — tighten 60→24 margin ---- */
body.home-page .section-head {
  margin-bottom: 24px !important;
}
body.home-page .section-head.center {
  margin: 0 auto 24px !important;
}
body.home-page .section-head h2,
body.home-page section h2 {
  font-size: clamp(1.5rem, 2.8vw, 1.9rem) !important;
  line-height: 1.2 !important;
  margin: 0 0 0.4rem !important;
}
body.home-page .section-head p,
body.home-page .section-head .lead {
  font-size: 0.98rem !important;
  line-height: 1.55 !important;
  margin: 0 !important;
}
body.home-page .section-eyebrow,
body.home-page .eyebrow {
  font-size: 0.72rem !important;
  letter-spacing: 0.08em !important;
  margin-bottom: 0.5rem !important;
}

/* ---- Programs grid — 4 columns desktop, denser cards ---- */
body.home-page .programs-grid {
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 12px !important;
}
body.home-page .programs-grid .program-card,
body.home-page .programs-grid > a,
body.home-page .programs-grid > article {
  padding: 16px 18px !important;
  border-radius: 6px !important;
}
body.home-page .programs-grid h3,
body.home-page .programs-grid h4 {
  font-size: 1rem !important;
  margin: 0 0 0.3rem !important;
  line-height: 1.2 !important;
}
body.home-page .programs-grid p,
body.home-page .programs-grid span {
  font-size: 0.85rem !important;
  line-height: 1.45 !important;
  margin: 0 !important;
}
@media (max-width: 900px) {
  body.home-page .programs-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  body.home-page .programs-grid { grid-template-columns: 1fr !important; }
}

/* ---- Process / stats grid — compact ---- */
body.home-page .process-grid {
  gap: 20px !important;
}
body.home-page .process-step {
  padding-top: 48px !important;
}
body.home-page .process-step::before {
  font-size: 2.2rem !important;
}
body.home-page .process-step h3 {
  font-size: 1rem !important;
  margin: 0 0 0.3rem !important;
}
body.home-page .process-step p {
  font-size: 0.88rem !important;
  line-height: 1.45 !important;
  margin: 0 !important;
}

/* ---- Cities grid (locations served) ---- */
body.home-page .cities-section .cities-grid {
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 10px !important;
}
body.home-page .cities-section .cities-grid > a,
body.home-page .cities-section .cities-grid .city-tile {
  padding: 12px 16px !important;
  font-size: 0.92rem !important;
}
@media (max-width: 900px) {
  body.home-page .cities-section .cities-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 600px) {
  body.home-page .cities-section .cities-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ---- Testimonials grid ---- */
body.home-page .testimonials-grid {
  gap: 16px !important;
}
body.home-page .testimonials-grid > * {
  padding: 16px 20px !important;
  font-size: 0.92rem !important;
}
body.home-page .testimonials-grid blockquote,
body.home-page .testimonials-grid p {
  font-size: 0.92rem !important;
  line-height: 1.5 !important;
}

/* ---- FAQ accordion ---- */
body.home-page .faq-section .faq-list,
body.home-page .faq-list {
  gap: 6px !important;
  display: flex;
  flex-direction: column;
}
body.home-page .faq-section details,
body.home-page details.faq-item {
  border-radius: 6px !important;
  padding: 0 !important;
}
body.home-page .faq-section details summary,
body.home-page details.faq-item summary {
  padding: 12px 16px !important;
  font-size: 0.95rem !important;
}
body.home-page .faq-section details .answer,
body.home-page details.faq-item .answer {
  padding: 0 16px 14px !important;
  font-size: 0.92rem !important;
  line-height: 1.55 !important;
}

/* ---- Learning Center / guide cards ---- */
body.home-page .learning-section .guide-grid,
body.home-page .guide-grid {
  gap: 14px !important;
  grid-template-columns: repeat(4, 1fr) !important;
}
body.home-page .learning-section .guide-card,
body.home-page .guide-grid > * {
  padding: 16px 18px !important;
  border-radius: 6px !important;
}
body.home-page .learning-section .guide-card h3 {
  font-size: 1rem !important;
  margin: 0 0 0.3rem !important;
}
body.home-page .learning-section .guide-card p {
  font-size: 0.88rem !important;
  line-height: 1.5 !important;
}
@media (max-width: 900px) {
  body.home-page .learning-section .guide-grid,
  body.home-page .guide-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ---- Home calculator preview ---- */
body.home-page .home-calc {
  padding: 1.25rem 1.5rem !important;
  margin: 1rem auto 0 !important;
  border-radius: 10px !important;
}
body.home-page .home-calc-grid {
  gap: 1.5rem !important;
}
body.home-page .home-calc label {
  font-size: 0.78rem !important;
  margin-bottom: 4px !important;
}
body.home-page .home-calc input {
  padding: 8px 12px !important;
  font-size: 0.95rem !important;
}
body.home-page .home-calc .hc-big {
  font-size: 2rem !important;
}
body.home-page .home-calc .hc-row {
  padding: 6px 0 !important;
  font-size: 0.9rem !important;
}

/* ---- Team grid ---- */
body.home-page .team-grid {
  gap: 12px !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
}
body.home-page .team-grid > * {
  padding: 16px 20px !important;
  border-radius: 8px !important;
}
body.home-page .team-grid h3 {
  font-size: 1.05rem !important;
  margin: 0 0 0.2rem !important;
}
body.home-page .team-grid p {
  font-size: 0.88rem !important;
  line-height: 1.5 !important;
  margin: 0 0 0.3rem !important;
}

/* ---- Insights / blog grid ---- */
body.home-page .insights-grid {
  gap: 14px !important;
}
body.home-page .insights-grid > * {
  padding: 16px 18px !important;
  border-radius: 6px !important;
}
body.home-page .insights-grid h3 {
  font-size: 1rem !important;
  margin: 0 0 0.3rem !important;
  line-height: 1.25 !important;
}
body.home-page .insights-grid p {
  font-size: 0.88rem !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* ---- Centered CTA ---- */
body.home-page .centered-cta {
  margin-top: 1.2rem !important;
}

/* ---- Final CTA banner ---- */
body.home-page section.cta-banner,
body.home-page .cta-banner {
  padding: 40px 0 !important;
}
body.home-page .cta-banner h2 {
  font-size: 1.6rem !important;
  margin: 0 0 0.4rem !important;
}
body.home-page .cta-banner p {
  font-size: 0.95rem !important;
  margin: 0 0 1rem !important;
}

/* ---- $500 guarantee / 1% cashback callouts ---- */
body.home-page section[class*="guarantee"],
body.home-page section[class*="cashback"] {
  padding: 32px 0 !important;
}
body.home-page section[class*="guarantee"] h2,
body.home-page section[class*="cashback"] h2 {
  font-size: 1.6rem !important;
}

/* ---- Reduce gap between section heading and following grid ---- */
body.home-page section .section-head + .programs-grid,
body.home-page section .section-head + .process-grid,
body.home-page section .section-head + .testimonials-grid,
body.home-page section .section-head + .guide-grid,
body.home-page section .section-head + .insights-grid,
body.home-page section .section-head + .team-grid,
body.home-page section .section-head + .cities-grid {
  margin-top: 0;
}
