/* =========================================================================
   Nuestro equipo (/equipo/) · WordPress wp-page#55267 (post-55267.css), medido a 1440 px el 26-09-2026.
   Clases con prefijo equipo-. Las tarjetas van en equipo-tarjetas.css.
   ========================================================================= */

/* Aparición «pop-in» de la web (escala 0,75 → 1). El movimiento reducido lo anula base.css. */
.js .pagina-equipo [data-aparece="pop"]:not(.visible) { transform: scale(0.75); }

/* ---------- Cabecera: fondo claro bajo la barra de navegación, título y migas ---------- */
.equipo-portada {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 150px;
  /* La barra de navegación va superpuesta (como en WordPress): el hueco superior la incluye */
  padding: 245px var(--margen) 50px;
  background: url('/assets/img/equipo-fondo-cabecera.webp') bottom center / cover no-repeat;
  text-align: center;
}
.equipo-portada__titulo {
  font-size: var(--t-h1);
  line-height: 1.05;
  letter-spacing: -2px;
}

.equipo-migas ol {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--f-titulos);
  font-size: var(--t-meta);
  line-height: 1.6;
  color: var(--c-texto);
}
.equipo-migas li + li::before {
  content: '/';
  margin: 0 10px;
  color: var(--c-borde);
}
.equipo-migas a { color: var(--c-arena); }
.equipo-migas a:hover { color: var(--c-texto); }

/* ---------- Rejilla del equipo ---------- */
.equipo-listado {
  width: min(100% - 2 * var(--margen), 1280px);
  margin: 0 auto 150px;
}

/* ---------- Hable con nuestro equipo: foto a la izquierda, formulario a la derecha ---------- */
.equipo-contacto {
  display: flex;
  align-items: center;
  width: min(100% - 2 * var(--margen), 1280px);
  margin: 0 auto;
}
.equipo-contacto__foto { flex: 0 0 48%; min-width: 0; }
.equipo-contacto__foto img {
  width: 100%;
  height: 700px;
  object-fit: cover;
  border-radius: var(--radio);
}
.equipo-contacto__texto {
  display: flex;
  flex: 0 0 52%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 30px;
  min-width: 0;
  padding: 50px 20px 50px 100px;
}
.equipo-contacto__titulo {
  font-size: var(--t-h3);
  line-height: 1.15;
  letter-spacing: -1px;
  text-align: center;
}
.equipo-contacto .equipo-contacto__entradilla {
  margin: 0 0 67px;   /* 40 px del bloque + los 27 px del párrafo en WordPress */
  text-align: center;
}
.equipo-contacto__formulario { width: 100%; }

/* Formulario (Forminator 31 en WordPress): campos blancos con filete, 56 px de alto */
.equipo-formulario { display: flex; flex-direction: column; gap: 10px; }
.equipo-formulario__fila { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.equipo-formulario__campo { display: flex; flex-direction: column; }
.equipo-formulario__control {
  display: block;
  width: 100%;
  margin: 0;
  padding: 16px 25px;
  border: 1px solid var(--c-borde);
  border-radius: var(--radio-boton);
  background: var(--c-superficie);
  color: var(--c-texto);
  font-family: var(--f-texto);
  font-size: var(--t-pequeno);
  line-height: 1.55;
  transition: border-color var(--transicion);
}
.equipo-formulario__control::placeholder { color: var(--c-apagado); opacity: 1; }
.equipo-formulario__control:focus { outline: none; border-color: var(--c-primario); }
.equipo-formulario__control:focus-visible { outline: 2px solid var(--c-primario); outline-offset: 2px; }
.equipo-formulario__control[aria-invalid="true"] { border-color: var(--c-naranja); }
.equipo-formulario__mensaje { height: 168px; min-height: 120px; resize: vertical; }
.equipo-formulario__pie { display: flex; }
.equipo-formulario__enviar { padding: 13px 30px; }
.equipo-formulario__error,
.equipo-formulario__aviso { margin: 0; font-size: var(--t-pequeno); line-height: 1.55; }
.equipo-formulario__error:empty,
.equipo-formulario__aviso:empty { display: none; }
.equipo-formulario__error { color: #B3380A; }
.equipo-formulario__aviso {
  padding: 12px 16px;
  border: 1px solid var(--c-borde);
  border-radius: var(--radio-boton);
  background: var(--c-superficie);
  color: var(--c-grafito);
}
.equipo-formulario__aviso a { color: var(--c-grafito); text-decoration: underline; text-underline-offset: 2px; }
.equipo-formulario__aviso a:hover { color: var(--c-primario); }

/* Formulario de GHL incrustado (cuando exista sitio.formulario.ghlUrl) */
.equipo-formulario-ghl iframe {
  display: block;
  width: 100%;
  min-height: 560px;
  border: 0;
  border-radius: var(--radio-boton);
}

/* ---------- Tableta ---------- */
@media (max-width: 1180px) {
  .equipo-portada { margin-bottom: 100px; padding-top: 200px; }
  .equipo-listado { margin-bottom: 100px; }
  .equipo-contacto { flex-direction: column; align-items: stretch; gap: 50px; }
  .equipo-contacto__foto,
  .equipo-contacto__texto { flex-basis: auto; width: 100%; }
  .equipo-contacto__foto img { height: 600px; }
  .equipo-contacto__texto { padding: 0; }
  .equipo-contacto .equipo-contacto__entradilla { margin-bottom: 47px; }
}

/* ---------- Móvil ---------- */
@media (max-width: 767px) {
  .equipo-portada { margin-bottom: 80px; padding-top: 160px; }
  .equipo-listado { margin-bottom: 80px; }
  .equipo-contacto { gap: 40px; }
  .equipo-contacto__foto img { height: 400px; }
  .equipo-contacto .equipo-contacto__entradilla { margin-bottom: 27px; }
  /* 16 px evita el zoom automático de iOS al enfocar; con menos relleno, la caja sigue midiendo 54 px como en WordPress */
  .equipo-formulario__control { padding-block: 13px; font-size: 16px; line-height: 1.6; }
}

/* Forminator apila los campos y ensancha «Enviar» por debajo de 783 px (a 768 ya van uno debajo de otro) */
@media (max-width: 782px) {
  .equipo-formulario { padding-bottom: 10px; }   /* la última fila de Forminator mide 10 px más que el botón */
  .equipo-formulario__fila { grid-template-columns: 1fr; }
  .equipo-formulario__pie .boton { width: 100%; }
}