/* css/quienes.css
   Centrado vertical del contenedor entre encabezado y pie.
   Margen inferior ampliado en 10px (padding-bottom aumentado de 4px a 14px).
*/

/* Reset básico */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }

/* Layout principal: columna, con header (incluido), main expandible y footer (incluido) */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  font-family: "Cormorant Garamond", Georgia, serif;
  background: #f2f2f2;
  color: #111;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.6;
}

/* main ocupa el espacio entre encabezado y pie; centra su contenido vertical y horizontalmente */
.qs-page {
  flex: 1 0 auto;                /* crecer para ocupar espacio disponible */
  display: flex;
  align-items: center;           /* centra verticalmente el .qs-box */
  justify-content: center;       /* centra horizontalmente */
  padding: 24px 12px 14px;       /* <-- bottom aumentado a 14px (24px top, 12px sides, 14px bottom) */
  box-sizing: border-box;
  overflow: auto;
}

/* Caja dorada centrada */
.qs-box {
  max-width: 860px;
  width: 100%;
  background: linear-gradient(180deg, #f7dc9a 0%, #e6bf4a 100%); /* dorado */
  color: #1b1208;
  padding: 36px;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.12);
  border: 1px solid rgba(0,0,0,0.08);
  overflow: auto;
  margin: 0; /* ya no necesita margen vertical */
}

/* Título caligráfico */
.qs-title {
  font-family: "Great Vibes", cursive;
  font-size: 48px;
  text-align: center;
  margin-bottom: 18px;
  color: #2b1b10;
  letter-spacing: 0.02em;
}

/* Contenido de texto */
.qs-content p {
  font-family: "Cormorant Garamond", serif;
  font-size: 18px;
  color: #2b1b10;
  margin-bottom: 18px;
  text-align: justify;
  text-justify: inter-word;
}

/* Ajustes para lectura en pantallas pequeñas */
@media (max-width: 720px) {
  .qs-box { padding: 20px; }
  .qs-title { font-size: 36px; }
  .qs-content p { font-size: 16px; }
}