/* ================================================================
   CONTACT.MOBILE.CSS — Contact Page Mobile Responsive
   ================================================================ */

/* ── Hero ─────────────────────────────────────────────────────── */
.contact-hero {
  padding: 5.5rem 0 3rem;
}

.contact-hero h2 {
  font-size: 1.8rem;
}

.contact-hero p {
  font-size: 0.95rem;
}

.c-shape-1 { width: 180px; height: 180px; }
.c-shape-2 { width: 100px; height: 100px; }
.c-shape-3 { width: 70px; height: 70px; }

/* ── Info Cards ───────────────────────────────────────────────── */
.contact-cards-section {
  padding: 2.5rem 0 1.5rem;
  margin-top: -1.5rem;
}

.contact-cards-grid {
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.contact-info-card {
  padding: 1.5rem 1.25rem;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.06);
  border: 1px solid var(--color-border-light);
  background: #fff;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.contact-info-card:active {
  transform: scale(0.98);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.contact-card-icon {
  width: 50px; height: 50px;
}

.contact-info-card h4 {
  font-size: 0.92rem;
}

.contact-card-value {
  font-size: 0.88rem;
}

.contact-card-note {
  font-size: 0.75rem;
}

/* ── Form + Map ───────────────────────────────────────────────── */
.contact-main-section {
  padding: 2.5rem 0;
}

.contact-main-grid {
  grid-template-columns: 1fr;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.contact-form-wrapper {
  padding: 1.75rem 1.25rem;
  border-radius: 16px;
  box-shadow: 0 8px 30px rgba(0,0,0,0.08);
  border: 1px solid var(--color-border-light);
  background: #fff;
}

.form-row {
  grid-template-columns: 1fr;
  gap: 0;
}

.map-embed {
  min-height: 280px;
}

/* ── Section Headers ──────────────────────────────────────────── */
.section-title {
  font-size: 1.5rem;
}

.section-subtitle {
  font-size: 0.88rem;
}

/* ── Social Grid ──────────────────────────────────────────────── */
.social-media-section {
  padding: 2.5rem 0 3.5rem;
}

.social-grid {
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 1.5rem;
}

.social-card {
  padding: 1.5rem 1rem;
  border-radius: 16px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.05);
  border: 1px solid var(--color-border-light);
  background: #fff;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.social-card:active {
  transform: scale(0.98);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.social-card-icon {
  width: 55px; height: 55px;
}

.social-card-icon svg {
  width: 26px; height: 26px;
}

.social-card h4 {
  font-size: 0.95rem;
}

.social-card p {
  font-size: 0.78rem;
}

.social-follow-btn {
  font-size: 0.75rem;
  padding: 0.35rem 1.2rem;
}

/* ── Extra Small ──────────────────────────────────────────────── */
@media (max-width: 480px) {
  .contact-cards-grid {
    grid-template-columns: 1fr;
  }
  .social-grid {
    grid-template-columns: 1fr;
  }
}
