/* css/v3-c.css — Obrero C (final): #contacto y el pie — bloque v3:C.
   Se carga después de css/site.css (congelado). Solo lo toca su dueño.
   v3 (28-sep): la ventana «primer-contacto.form» de la v15, centrada y a
   640 px como máximo (PDF 4.13 E, p. 16); información básica compacta en
   cuatro líneas; pie con el aspecto de la v15 (PDF 4.15, p. 18). */

/* --- Contacto: la ventana de la v15 ---------------------------------- */
#form[hidden], .form__ok[hidden] { display: none !important; }
.contacto .contacto__win .win__bar { gap: .55rem; }
.contacto .contacto__win .win__title { font-family: var(--f-text); }
.contacto .contacto__win .win__foot { display: flex; align-items: center; gap: .6rem; }
.contacto .contacto__win .win__foot .progress { flex: 1 1 auto; }

/* El plazo, como la nota de la v15: discreto, bajo el botón. */
:root .form__plazo { text-align: center; font-size: var(--t-small); font-weight: 400; color: var(--tx-2); margin: 0; }

/* Información básica (GATE-1, corrección 5): una frase de 2 o 3 líneas con enlace a Privacidad. */
:root .rgpd__corto { margin: 0; font-size: var(--t-label); line-height: 1.5; color: var(--tx-2); text-align: center; text-wrap: pretty; }
:root .rgpd__corto b { font-weight: 600; color: var(--tx-1); }
:root .rgpd { gap: .4rem; padding-top: .9rem; margin-top: 0; }
:root .rgpd__t { font-family: var(--f-text); font-weight: 600; font-size: var(--t-label); letter-spacing: .02em; color: var(--tx-2); }
:root .rgpd__dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .2rem .75rem; font-size: var(--t-label); line-height: 1.45; color: var(--tx-2); }
:root .rgpd__dl dt { font-weight: 600; color: var(--tx-1); }
:root .rgpd__dl dd { margin: 0; color: var(--tx-2); }
@media (max-width: 419px) {
  :root .rgpd__dl { grid-template-columns: minmax(0, 1fr); gap: 0; }
  :root .rgpd__dl dd { margin-bottom: .35rem; }
}

/* La confirmación del correo, dentro de la misma ventana. */
.contacto .form__ok { gap: .75rem; padding-block: .5rem; }
.contacto .form__ok h3 { font-family: var(--f-display); font-size: var(--t-h3); line-height: 1.2; color: var(--ink); }
.contacto .form__ok p { font-size: var(--t-body); color: var(--tx-1); }
.contacto .form__ok a { color: var(--coral-ink); text-decoration: underline; text-underline-offset: 3px; }
.contacto .form__ok:focus { outline: none; }

/* Ningún aviso rojo antes de enviar: los huecos de error no ocupan nada
   mientras están vacíos. */
#contacto .err:empty { min-height: 0; margin: 0; }

/* --- Pie: el aspecto de la v15 ------------------------------------- */
/* Títulos de columna: texto (no h2, PDF 5.4 p. 20) con la chapa mono de la v15. */
:root .pie__t { margin: 0 0 .55rem; font-family: var(--f-mono); font-size: var(--t-micro); font-weight: 400; letter-spacing: .06em; text-transform: uppercase; color: var(--tx-chrome); }
:root .pie__copy, :root .pie__copy span { font-family: var(--f-mono); font-size: var(--t-micro); color: var(--tx-3); }
.pie__redes a { color: var(--tx-2); }
/* El logo de botones, más bajo en móvil (PDF 4.15 A, p. 18). */
@media (max-width: 619px) {
  /* GATE-1, corrección 9: sin tope de 280 px. A ese tamaño cada celda medía menos de 3 px y el logo se leía como celdas en contorno; vuelve al ancho de la v15 (350 px a 390). */
  .pie__wordmark { margin-bottom: 1.5rem; gap: .75rem; }
}

/* A 390 el formulario se usa sin zoom: iOS amplía todo campo con letra
   por debajo de 16 px al tocarlo. */
@media (max-width: 619px) {
  #form .input, #form .textarea { font-size: 16px; }
}

/* 08-oct (Análisis web v2, 3.5): pie en tres grupos, SECCIONES · CONTACTO ·
   LEGAL. Secciones lleva seis enlaces: en dos columnas para que no estire el
   pie. En el móvil, Secciones a todo el ancho y Contacto y Legal debajo. */
.pie__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pie__col--secciones { grid-column: 1 / -1; }
.pie__col--secciones ul { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; }
@media (min-width: 620px) {
  .pie__cols { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
  .pie__col--secciones { grid-column: auto; }
}
/* Zonas táctiles (3.6, ch. 20): 44 px de alto en el móvil. */
@media (max-width: 619px) {
  .pie__col a { min-height: 44px; }
}
