.page { display: grid; gap: var(--s3); }
.hero--small { padding: var(--s4); }

/* Mobile header nav stacking */
@media (max-width: 640px) {
  .header__inner { flex-direction: column; align-items: flex-start; gap: var(--s2); }
}

@media (max-width: 890px) { .grid-2 { grid-template-columns: 1fr; } }
@media (max-width: 890px) { .form__row { grid-template-columns: 1fr; } }
@media (max-width: 480px) {
  .schedule-grid { grid-template-columns: 1fr; }
}

/* Mobile typography and spacing refinements */
@media (max-width: 480px) {
  .main-spacing { padding-top: var(--s4); padding-bottom: var(--s5); }
  h1 { font-size: 18px; }
  h2 { font-size: 16px; }
  h3 { font-size: 16px; }
  p { font-size: 14px; }
  .site-title { font-size: 18px; } 
  .site-subtitle { font-size: 14px; }
  .nav { padding: 8px 12px; font-size: 14px; }
  .brand { padding: 8px 12px}
}

@media (max-width: 640px) {
  .nav {
    justify-content: center;   /* semua link di tengah */
    text-align: center;        /* kalau mau teksnya rata tengah */
  }
  .nav__link {
    flex: 0;                   /* biar link tidak melar */
  }
  .nav { margin: 0 auto; /* nav di tengah */ }
}


/* Testimonial responsive */
@media (max-width: 890px) {
  .testimonial-card {
    font-size: 10;
    padding: var(--s2);
  }
  .testimonial-card p {
    font-size: 10px;
  }
  .testimonial-card__name {
    font-weight: 600;
    font-size: 8;
  }
  .testimonial-card__role {
    font-size: 8px;
    color: var(--muted);
  }

  /* grid testimonial jadi satu kolom */
  .testimonial-track,
  .section .grid-3,
  .section .grid-2 {
    grid-template-columns: 1fr;
    gap: var(--s3);
  }
}

/* responsive: kalau layar kecil jadi satu kolom */
@media (max-width: 890px) {
  .footer-grid {
    grid-template-columns: 1fr; /* satu kolom */
  }
  .footer-left, .footer-right {
    width: 100%;
  }
  .footer-quote { font-size: 12px; line-height: 1.4; }
}


/* ===== Responsive ===== */
@media (max-width: 992px) {
  .schedule-grid {
    gap: 16px;
  }
  .psychologist-header img {
    width: 90px;
    height: 90px;
  }
}
@media (max-width: 890px) {
  .schedule-grid {
    grid-template-columns: 1fr; /* jadi satu kolom */
  }
  .psychologist-header img {
    width: 80px;
    height: 80px;
  }
  .slot-card {
    padding: 10px;
  }
  .schedule-tabs {
    flex-wrap: wrap;
    gap: 8px;
  }
  .schedule-tabs .tab {
    flex: 1;
    text-align: center;
  }
}

@media (max-width: 890px) {
  .faq-title {
    font-size: 20px;
  }
  .faq-question {
    font-size: 15px;
  }
  .faq-answer {
    font-size: 13px;
  }
}
