/* A quiet ivory gallery separates the real photographs from the dark page. */
#tratamientos {
  --ink: #302a23;
  --muted: #675f55;
  --gold: #80694f;
  --line: #cfc5b7;
  background: #f4f0e9;
  color: var(--ink);
  border-block: 1px solid #ddd4c7;
}
#tratamientos .treat-hdr,
#tratamientos .treat-grid { max-width: 1280px; margin-inline: auto; }
#tratamientos .treat-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 52px 32px;
  align-items: start;
}
#tratamientos .tcard,
#tratamientos .tcard:first-child { grid-column: span 2; min-width: 0; margin: 0; }
#tratamientos .tcard:nth-child(4),
#tratamientos .tcard:nth-child(5) { grid-column: span 3; }
#tratamientos .sec-title,
#tratamientos .tcard-name { color: var(--ink); }
#tratamientos .sec-eye,
#tratamientos .tcard-cat { color: #78634d; }
#tratamientos .tcard-line { color: var(--muted); }
#tratamientos .btn-ghost,
#tratamientos .tcard-action,
#tratamientos .brows-video-details summary { color: var(--ink); border-color: var(--line); }
#tratamientos .tcard-body,
#tratamientos .brows-video-details { border-color: var(--line); }
#tratamientos .tcard-body { padding-top: 26px; }
#tratamientos .tcard-img-wrap {
  background: #e8e0d4;
  border: 1px solid #d8cdbc;
  box-shadow: 0 8px 25px #382b1d0c;
}
/* One shared portrait ratio: all three visible images fill the same area. */
#tratamientos .tcard:nth-child(-n+3) .tcard-img-wrap {
  position: relative;
  height: auto;
  aspect-ratio: 2 / 3;
  padding: 0;
  display: block;
}
#tratamientos .tcard:nth-child(-n+3) .tcard-img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover;
  object-position: 50% 50%;
  background: transparent;
  transform: none !important;
  transition: none;
}
#tratamientos .tcard:nth-child(2) .tcard-img { object-position: 50% 40%; }
/* Keep the two horizontal comparisons and their existing alignment. */
#tratamientos .lash-frame,
#tratamientos .brows-frame { height: auto; aspect-ratio: 1669 / 942; }
@media (max-width: 899.98px) {
  #tratamientos .treat-hdr,
  #tratamientos .treat-grid { max-width: 610px; }
  #tratamientos .treat-grid { grid-template-columns: minmax(0, 1fr); gap: 44px; }
  #tratamientos .tcard,
  #tratamientos .tcard:first-child,
  #tratamientos .tcard:nth-child(4),
  #tratamientos .tcard:nth-child(5) { grid-column: auto; }
}
@media (max-width: 480px) {
  #tratamientos .treat-hdr { display: block; }
  #tratamientos .treat-hdr .btn-ghost { margin-top: 24px; }
}
