/* =========================================================
   Página de Contacto — page-contacto.php
   ========================================================= */
.contact-page { padding-block: 56px 72px; }

.contact-page__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
}
@media (min-width: 992px) {
  .contact-page__grid { grid-template-columns: 1.1fr 1fr; gap: 64px; }
}

/* Columna izquierda: intro + mapa + sucursales */
.contact-intro h1 {
  font-size: clamp(1.8rem, 3.2vw, 2.3rem);
  color: var(--color-brand-orange);
  margin-bottom: 16px;
}
.contact-intro > p {
  color: var(--color-neutral-dark);
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 28px;
  max-width: 46ch;
}

.contact-branches {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
@media (min-width: 560px) {
  .contact-branches { grid-template-columns: repeat(2, 1fr); }
}

.contact-branch-card {
  padding: 20px;
  border-radius: var(--radius-md);
  background: var(--color-brand-orange-light);
}
.contact-branch-card h3 {
  font-size: 1rem;
  margin-bottom: 10px;
}
.contact-branch-card p {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.88rem;
  color: var(--color-neutral-darker);
  line-height: 1.5;
  margin-bottom: 12px;
}
.contact-branch-card p svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; color: var(--color-brand-orange-dark); }
.contact-branch-card a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--color-brand-orange-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.contact-branch-card a svg { width: 14px; height: 14px; }
.contact-branch-card a:hover { color: var(--color-black); }

/* Columna derecha: formulario centrado */
.contact-form-panel { text-align: center; }
.contact-form-panel h2 {
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  color: var(--color-brand-orange);
  max-width: 22ch;
  margin-inline: auto;
  margin-bottom: 14px;
}
.contact-form-panel__subtitle {
  color: var(--color-neutral-dark);
  max-width: 42ch;
  margin-inline: auto;
  margin-bottom: 32px;
}

.contact-form-panel .quote-form { text-align: left; margin-top: 0; }

.contact-form-panel .quote-form__submit {
  align-self: center;
  margin-inline: auto;
  margin-top: 8px;
  display: flex;
}

.contact-form-panel__call,
.contact-form-panel__note { margin-inline: auto; }
