/* ============================================================================
   MÓDULO DOCTORALIA · reserva + opiniones
   Dos columnas: a la izquierda el texto y el widget de reserva (que es una
   tira ancha y baja, de unos 150px de alto); a la derecha las opiniones del
   perfil. La cabecera va alineada a la izquierda, no centrada.
   ============================================================================ */

.doc-section { padding: 6rem 0; }
.doc-inner {
  max-width: 75rem; margin: 0 auto; padding: 0 1.5rem;
  display: grid; grid-template-columns: minmax(0, 1fr) 24rem;
  column-gap: 4rem;
  /* stretch, no start: así el filete divisorio recorre toda la altura de la
     fila y las dos columnas se leen como un bloque, no como una columna corta
     al lado de otra larga. */
  align-items: stretch;
}

/* ---- Columna izquierda ---- */
.doc-pre {
  display: block; margin-bottom: 0.75rem;
  font-size: 0.875rem; letter-spacing: 3.5px; text-transform: uppercase;
  color: var(--color-primary);
}
.doc-title {
  margin: 0 0 1.25rem;
  font-family: 'Lora', sans-serif; font-weight: 400;
  font-size: 2.5rem; line-height: 3rem; letter-spacing: -0.75px;
  color: var(--color-neutral);
}
.doc-text {
  margin: 0 0 2.5rem; max-width: 34rem;
  font-size: 1.0625rem; line-height: 1.875rem; color: var(--color-neutral-80);
}
.doc-widget { min-height: 9.375rem; }

/* ---- Columna derecha: opiniones ---- */
.doc-opiniones {
  border-left: 1px solid var(--color-neutral-10);
  padding-left: 4rem;
}
.doc-op-head { margin-bottom: 1.75rem; }
.doc-op-head .doc-total {
  display: block;
  font-size: 0.8125rem; letter-spacing: 2px; text-transform: uppercase;
  color: var(--color-secondary);
}

.doc-opinion { margin: 0; padding: 1.5rem 0; border-top: 1px solid var(--color-neutral-10); }
.doc-opinion:first-of-type { border-top: 0; padding-top: 0; }
.doc-opinion blockquote {
  margin: 0 0 1rem; padding: 0; border: 0;
  font-family: 'Lora', sans-serif; font-size: 1rem; line-height: 1.75rem;
  color: var(--color-neutral-80); text-wrap: pretty;
}
.doc-opinion blockquote::before { content: '“'; }
.doc-opinion blockquote::after { content: '”'; }
.doc-autor {
  display: block;
  font-size: 0.875rem; letter-spacing: 1.25px;
  color: var(--color-neutral);
}
.doc-meta {
  display: block; margin-top: 0.25rem;
  font-size: 0.75rem; letter-spacing: 1px; text-transform: uppercase;
  color: var(--color-neutral-40);
}
.doc-ver-todas {
  display: inline-block; margin-top: 1.5rem;
  font-size: 0.875rem; letter-spacing: 1.25px; text-transform: uppercase;
  color: var(--color-primary);
  border-bottom: 1px solid var(--color-primary-25); padding-bottom: 0.25rem;
  transition: border-color .2s ease;
}
.doc-ver-todas:hover { border-bottom-color: var(--color-primary); }

/* ---- Responsive ---- */
@media (max-width: 1199px) {
  .doc-inner { grid-template-columns: minmax(0, 1fr) 20rem; column-gap: 3rem; }
  .doc-opiniones { padding-left: 3rem; }
}
@media (max-width: 991px) {
  .doc-section { padding: 4rem 0; }
  .doc-inner { grid-template-columns: 1fr; row-gap: 3rem; }
  .doc-title { font-size: 2rem; line-height: 2.5rem; }
  .doc-opiniones {
    border-left: 0; padding-left: 0;
    border-top: 1px solid var(--color-neutral-10); padding-top: 2.5rem;
  }
}
