/* ===========================================
   PAGE: Home (index.html)
   Layout only: grid, spacing, section alignment
   =========================================== */

.home-page .hero-home { min-height: 100vh; }

/* Hero location strip */
.hero-location {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.85rem;
  font-family: var(--font-sans);
  font-size: 0.78rem;
  color: rgba(255,255,255,0.55);
  letter-spacing: 0.03em;
}
.hero-pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10B981;
  box-shadow: 0 0 0 0 rgba(16,185,129,0.5);
  flex-shrink: 0;
  animation: heroPulse 2s ease-in-out infinite;
}
@keyframes heroPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(16,185,129,0.5); }
  60%      { box-shadow: 0 0 0 6px rgba(16,185,129,0); }
}

.home-page .values-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-6);
}

.home-page .final-cta-inner {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: var(--space-16);
  align-items: center;
}

.home-page .section.fx-mesh-teal .treatments-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: auto;
  align-items: start;
  gap: var(--space-3);
}

.home-page .section.fx-mesh-teal .treatment-card {
  aspect-ratio: 3 / 2;
  width: 100%;
}

@media (max-width: 1024px) {
  .home-page .values-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .final-cta-inner { grid-template-columns: 1fr; }
  .home-page .final-cta-form { display: none; }
  .home-page .section.fx-mesh-teal .treatments-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .home-page .final-cta-form {
    display: block;
  }
  .home-page .section.fx-mesh-teal .treatments-grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 86vw;
    grid-template-columns: none;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding: 0 10px 6px 0;
  }
  .home-page .section.fx-mesh-teal .treatments-grid::-webkit-scrollbar { display: none; }
  .home-page .section.fx-mesh-teal .treatment-card {
    width: 86vw;
    max-width: 86vw;
    aspect-ratio: 4 / 3;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  .home-page .mission-vision-cards,
  .home-page .steps-grid,
  .home-page .values-grid {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: none;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .home-page .mission-vision-cards {
    grid-auto-columns: 86vw;
    gap: 12px;
    padding: 0 10px 6px 0;
  }
  .home-page .steps-grid {
    grid-auto-columns: 86vw;
    gap: 10px;
    padding: 0 10px 6px 0;
  }
  .home-page .values-grid {
    grid-auto-columns: 86vw;
    gap: 10px;
    padding: 0 10px 6px 0;
  }
  .home-page .mission-vision-cards::-webkit-scrollbar,
  .home-page .steps-grid::-webkit-scrollbar,
  .home-page .values-grid::-webkit-scrollbar { display: none; }
  .home-page .mission-vision-cards .mv-card,
  .home-page .steps-grid .step-card,
  .home-page .values-grid .value-card {
    width: 86vw;
    max-width: 86vw;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
}

@media (max-width: 640px) {
  .home-page .values-grid { grid-template-columns: 1fr; }
  .home-page .section.fx-mesh-teal .treatments-grid {
    grid-auto-columns: 88vw;
    gap: 10px;
    padding-right: 8px;
  }
  .home-page .section.fx-mesh-teal .treatment-card {
    width: 88vw;
    max-width: 88vw;
    aspect-ratio: 3 / 2;
  }
  .home-page .mission-vision-cards,
  .home-page .steps-grid,
  .home-page .values-grid {
    grid-auto-columns: 88vw;
    gap: 10px;
    padding-right: 8px;
  }
  .home-page .mission-vision-cards .mv-card,
  .home-page .steps-grid .step-card,
  .home-page .values-grid .value-card {
    width: 88vw;
    max-width: 88vw;
  }
}

@media (max-width: 480px) {
  .home-page .section.fx-mesh-teal .treatments-grid { grid-auto-columns: 90vw; }
  .home-page .section.fx-mesh-teal .treatment-card {
    width: 90vw;
    max-width: 90vw;
  }
  .home-page .mission-vision-cards,
  .home-page .steps-grid,
  .home-page .values-grid { grid-auto-columns: 90vw; }
  .home-page .mission-vision-cards .mv-card,
  .home-page .steps-grid .step-card,
  .home-page .values-grid .value-card {
    width: 90vw;
    max-width: 90vw;
  }
}