/* =============================================================
   Contacto / CTA final (index.html only)
   ============================================================= */
.section-cta { background: var(--ink); color: var(--bg); }
.section-cta .eyebrow { color: var(--accent-2); }
.section-cta .section-title { color: var(--bg); }
.cta-sub { color: rgba(248,246,241,.75); max-width: 50ch; margin-bottom: 2.5rem; }
.cta-grid { display: grid; gap: 2.5rem; grid-template-columns: 1fr; }
/* Los hijos del grid deben poder encogerse por debajo de su contenido mínimo
   (el input de archivos tiene un ancho intrínseco grande que, con min-width:auto,
   desbordaba la columna y sacaba la página hacia la derecha en móvil). */
.cta-grid > * { min-width: 0; }
.contact-form { display: flex; flex-direction: column; gap: 1.1rem; background: rgba(248,246,241,.05); padding: 2rem; border-radius: 20px; border: 1px solid rgba(248,246,241,.15); min-width: 0; }
.contact-form input, .contact-form textarea { max-width: 100%; }
.contact-form label { display: flex; flex-direction: column; gap: .4rem; font-size: .85rem; font-weight: 600; color: rgba(248,246,241,.85); }
.contact-form input, .contact-form textarea {
  font: inherit; padding: .75rem 1rem; border-radius: 10px; border: 1px solid rgba(248,246,241,.25);
  background: rgba(248,246,241,.08); color: var(--bg);
}
.contact-form input:focus, .contact-form textarea:focus { outline: 2px solid var(--accent-2); }

/* Campo de adjuntar documentos */
.contact-form .field-optional { font-weight: 400; color: rgba(248,246,241,.5); }
.contact-form .field-hint { font-weight: 400; font-size: .75rem; color: rgba(248,246,241,.6); }
.contact-form input[type="file"] { padding: .55rem .7rem; cursor: pointer; color: rgba(248,246,241,.8); font-size: .82rem; }
.contact-form input[type="file"]::file-selector-button {
  font: inherit; font-size: .8rem; font-weight: 600; margin-right: .8rem;
  padding: .5rem .9rem; border-radius: 8px; border: 1px solid rgba(169,121,43,.5);
  background: rgba(169,121,43,.14); color: var(--accent-2); cursor: pointer;
  transition: background .2s var(--ease-out);
}
.contact-form input[type="file"]::file-selector-button:hover { background: rgba(169,121,43,.28); }

/* Casilla de consentimiento RGPD (datos de salud) */
.contact-form .consent { flex-direction: row; align-items: flex-start; gap: .6rem; font-weight: 400; font-size: .78rem; line-height: 1.45; color: rgba(248,246,241,.7); }
.contact-form .consent input[type="checkbox"] { width: 18px; height: 18px; margin-top: .12rem; flex-shrink: 0; accent-color: var(--accent-2); }
.contact-form .consent a { color: var(--accent-2); text-decoration: underline; text-underline-offset: 2px; }
.contact-form .consent .req { color: var(--accent-2); }

.form-status { font-size: .85rem; color: var(--accent-2); min-height: 1.2em; }
.form-status.is-ok { color: #7fc99a; }
.form-status.is-error { color: #e39b9b; }
.cta-side { display: flex; flex-direction: column; gap: 1.2rem; }
.cta-address { color: rgba(248,246,241,.7); font-size: .9rem; }

/* Resumen de centros dentro del bloque de contacto (fondo navy) */
.cta-locations { background: rgba(248,246,241,.05); border: 1px solid rgba(248,246,241,.15); border-radius: 16px; padding: 1.25rem 1.4rem; display: flex; flex-direction: column; gap: .7rem; }
.cta-locations-title { color: var(--accent-2); font-family: var(--sans); font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.cta-locations p { color: rgba(248,246,241,.9); font-size: .9rem; line-height: 1.4; }
.cta-locations p span { color: rgba(248,246,241,.6); font-size: .82rem; }
.cta-locations-link { color: var(--accent-2); font-weight: 600; font-size: .9rem; text-decoration: underline; text-underline-offset: 2px; }

@media (min-width: 720px) {
  .cta-grid { grid-template-columns: 1.3fr 1fr; }
}
