.hero-media {
  margin: 0;
  min-height: 500px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 40px 80px #17242133;
  background: #c8d8d2;
}

.hero-media img {
  width: 100%;
  height: 500px;
  display: block;
  object-fit: cover;
}

.hero-media figcaption {
  position: absolute;
  right: 15px;
  bottom: 14px;
  padding: 7px 10px;
  background: #0c1512c7;
  color: #fff;
  font-size: 9px;
  letter-spacing: .08em;
  backdrop-filter: blur(8px);
}

.visual-library { background: #f7f4ed; }
.visual-intro { display: grid; grid-template-columns: 1.15fr .85fr; gap: 8vw; align-items: end; }
.visual-intro p { color: var(--muted); font-size: 13px; line-height: 1.8; margin: 0 0 42px; }
.visual-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.visual-card { background: #fff; border: 1px solid var(--line); overflow: hidden; }
.visual-wide { grid-column: 1 / -1; display: grid; grid-template-columns: 1.45fr .55fr; }
.visual-card .image-wrap { position: relative; min-height: 300px; overflow: hidden; background: #d8d9d2; }
.visual-wide .image-wrap { min-height: 480px; }
.visual-card img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; transition: transform .6s ease; }
.visual-card:hover img { transform: scale(1.025); }
.image-wrap > span { position: absolute; top: 16px; left: 16px; padding: 7px 9px; background: #101615d9; color: white; font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.visual-card > div:last-child { padding: 25px 27px 30px; }
.visual-card small { color: var(--teal); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.visual-card h3 { font: 30px Georgia, "Songti SC", serif; margin: 14px 0 12px; }
.visual-card p { font-size: 12px; line-height: 1.75; color: var(--muted); margin: 0; }
.exterior-card img { object-position: center 62%; }
.vietnam-study { background: #e9efec; }
.family-study { background: #f7f1e7; }
.source-link { display: inline-block; margin: -24px 0 42px; color: var(--teal); font-size: 11px; font-weight: 800; border-bottom: 1px solid #0d5b5655; padding-bottom: 3px; }
.study-grid .image-wrap { min-height: 390px; }
.video-derived-concepts { background: #101615; color: #fff; }
.video-derived-concepts .visual-intro p { color: #aeb8b4; }
.video-derived-concepts .visual-card { background: #19201e; border-color: #37413e; }
.video-derived-concepts .visual-card p { color: #aeb8b4; }
.concept-grid .image-wrap { min-height: 360px; }
.lighting-concept .image-wrap { min-height: 520px; }

@media (max-width: 900px) {
  .hero-media, .hero-media img { min-height: 400px; height: 400px; }
  .visual-intro { grid-template-columns: 1fr; gap: 0; }
  .visual-grid { grid-template-columns: 1fr; }
  .visual-wide { grid-column: auto; display: block; }
  .visual-wide .image-wrap { min-height: 360px; }
}

@media (max-width: 560px) {
  .hero-media, .hero-media img { min-height: 290px; height: 290px; }
  .visual-card .image-wrap, .visual-wide .image-wrap { min-height: 260px; }
}
