/* =========================================================================
   Sobre nosotros (/sobre-nosotros/) · WordPress wp-page#38769 (post-38769.css), medido a 1440 px.
   Clases con prefijo sobre-. El carrusel del equipo va en equipo-tarjetas.css.
   ========================================================================= */

/* WordPress pinta Roboto Serif con tamaño óptico 14 a cualquier tamaño (medido: 48 y 24 px coinciden al
   decimal). La fuente local, con el tamaño óptico automático, sale un 7 % más estrecha y parte distinto los
   títulos. Hasta que base.css lo fije para toda la web, se fija aquí para el contenido de esta página. */
.pagina-sobre-nosotros #contenido { font-variation-settings: 'opsz' 14; }

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

/* Píldora de sección: en esta página es un h6 (17 px) con sombra suave */
.etiqueta.sobre-etiqueta {
  padding: 3px 15px;
  border-radius: 30px;
  font-size: var(--t-h6);
  line-height: 1.65;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

/* ---------- Cabecera: fondo claro bajo la barra de navegación ---------- */
.sobre-portada {
  display: flex;
  justify-content: center;
  margin-bottom: 150px;
  /* La barra de navegación va superpuesta (como en WordPress): el hueco superior la incluye */
  padding: 245px var(--margen) 100px;
  background: url('/assets/img/sobre-fondo-cabecera.webp') center / cover no-repeat;
}
.sobre-portada__contenido {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: min(100%, 650px);
  text-align: center;
}
.sobre-portada__titulo {
  font-size: var(--t-h3);
  line-height: 1.15;
  letter-spacing: -1px;
}
.sobre-portada .sobre-portada__entradilla {
  margin: 0 0 37px;
  font-size: var(--t-entradilla);
  font-weight: 500;
  line-height: 1.5;
}

/* ---------- Nuestra historia: texto a la izquierda, foto a la derecha ---------- */
.sobre-historia { margin-bottom: 150px; }
.sobre-historia__rejilla {
  display: grid;
  grid-template-columns: 54fr 46fr;
  gap: 20px;
  width: min(100% - 2 * var(--margen), 1280px);
  min-height: 480px;
  margin-inline: auto;
}
.sobre-historia__texto {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 40px;
  padding-right: 20px;
}
.sobre-historia .sobre-historia__parrafo { width: 90%; margin: 0 0 27px; }
.sobre-historia__foto {
  position: relative;
  min-height: 480px;
  overflow: hidden;
  border-radius: var(--radio);
}
.sobre-historia__foto img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---------- Nuestro equipo ---------- */
.sobre-equipo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  width: min(100% - 2 * var(--margen), var(--ancho));
  margin: 0 auto 150px;
}
.sobre-equipo__titulo {
  max-width: 700px;
  padding-bottom: 40px;
  text-align: center;
}
.sobre-equipo__carrusel { width: 100%; margin-bottom: 50px; }
.sobre-equipo__boton .boton {
  transition: background var(--transicion), color var(--transicion), box-shadow var(--transicion), transform 0.4s;
}
.sobre-equipo__boton .boton:hover { transform: translateX(5px); }
.sobre-equipo__boton .boton__icono .icono { width: 12px; height: 12px; }

/* ---------- Tableta ---------- */
@media (max-width: 1180px) {
  .sobre-portada { margin-bottom: 100px; padding-top: 200px; padding-bottom: 60px; }
  .sobre-historia { margin-bottom: 100px; }
  .sobre-historia__rejilla { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .sobre-historia__texto { padding: 0 0 40px; }
  .sobre-historia__foto { min-height: 500px; }
  .sobre-equipo { gap: 50px; margin-bottom: 100px; }
  .sobre-equipo__carrusel { margin-bottom: 20px; }
}

/* ---------- Móvil ---------- */
@media (max-width: 767px) {
  .sobre-portada { margin-bottom: 80px; padding-top: 180px; }
  .sobre-historia { margin-bottom: 80px; }
  .sobre-historia__foto { min-height: 400px; }
  .sobre-equipo { gap: 30px; margin-bottom: 80px; }
  .sobre-equipo__titulo { max-width: 100%; }
}