/* V5 — a continuous white-to-wine macro depth with a peripheral foreground cell. */
.hero-v5-depth-page .hero {
  padding: 0 0 74px;
  overflow-x: clip;
  background: #fdfbf8;
}

.hero-v5-depth-page .hero-frame {
  position: relative;
  display: block;
  min-height: 608px;
  overflow: hidden;
  width: 100%;
  max-width: none;
  border-radius: 0;
  background: #fffdf9;
  isolation: isolate;
}

.hero-v5-depth-page .hero-copy {
  position: relative;
  z-index: 3;
  width: min(51%, 560px);
  padding: 76px 0 62px max(64px, calc((100vw - 1200px) / 2 + 64px));
}

.hero-v5-depth-page .hero-copy h1 {
  max-width: 520px;
  color: #321f22;
  font-size: clamp(45px, 4.1vw, 62px);
  line-height: .98;
}

.hero-v5-depth-page .hero-lead { color: #5f5557; }

.hero-v5-depth-page .hero-art--v5-depth {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #fffdf9;
}

.hero-v5-depth-page .hero-art--v5-depth::before { display: none; }

.hero-v5-depth-page .hero-art--v5-depth::after { display: none; }

.hero-v5-depth-page .hero-art--v5-depth img {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: none;
  filter: none;
}

.hero-v5-depth-page .hero-art--v5-depth:hover img { transform: none; }

.hero-v5-depth-page .hero-chip {
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #fff8f4;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .025em;
  text-shadow: 0 1px 8px rgba(52,4,15,.68);
  white-space: nowrap;
}

.hero-v5-depth-page .hero-chip i { width: 6px; height: 6px; background: #ffc2cf; }
.hero-v5-depth-page .hero-chip::after { width: 38px; height: 1px; content: ""; background: currentColor; opacity: .7; }
.hero-v5-depth-page .hero-chip--one { top: 16%; left: 58%; }
.hero-v5-depth-page .hero-chip--two { right: 5%; bottom: 14%; }

@media (max-width: 900px) {
  .hero-v5-depth-page .hero-frame { min-height: 570px; border-radius: 0; }
  .hero-v5-depth-page .hero-copy { width: 60%; padding: 60px 0 48px 38px; }
  .hero-v5-depth-page .hero-copy h1 { font-size: clamp(42px, 6.2vw, 54px); }
  .hero-v5-depth-page .hero-chip--one { top: 18%; left: 62%; }
  .hero-v5-depth-page .hero-chip--two { right: 4%; bottom: 11%; }
}

@media (max-width: 540px) {
  .hero-v5-depth-page .hero { padding: 0 0 48px; }
  .hero-v5-depth-page .hero-frame { display: flex; min-height: 0; flex-direction: column; overflow: hidden; border-radius: 0; }
  .hero-v5-depth-page .hero-copy { width: auto; padding: 40px 24px 34px; background: #fffdf9; }
  .hero-v5-depth-page .hero-copy h1 { font-size: clamp(31px, 10.2vw, 41px); }
  .hero-v5-depth-page .hero-art--v5-depth { position: relative; inset: auto; height: clamp(260px, 80vw, 360px); min-height: 0; }
  .hero-v5-depth-page .hero-art--v5-depth img { object-position: 71% center; }
  .hero-v5-depth-page .hero-chip { gap: 7px; font-size: 13px; }
  .hero-v5-depth-page .hero-chip::after { width: 22px; }
  .hero-v5-depth-page .hero-chip--one { top: 10%; left: 7%; color: #76162b; text-shadow: 0 1px 0 rgba(255,255,255,.85); }
  .hero-v5-depth-page .hero-chip--one i { background: #a4203c; }
  .hero-v5-depth-page .hero-chip--two { right: 7%; bottom: 9%; }
}

@media (max-width: 350px) {
  .hero-v5-depth-page .hero-copy { padding-right: 18px; padding-left: 18px; }
  .hero-v5-depth-page .hero-copy h1 { font-size: 30px; }
  .hero-v5-depth-page .hero-chip { font-size: 12px; }
}