/* Estates shares the site's petrol, cream, gold, Fraunces and quiet 9px cards.
   A property brochure, not a shop: the price belongs to the fictional video. */
.estate-layout { display: grid; gap: 28px; align-items: start; }
.estate-photo { margin: 0; }
.estate-photo img { width: 100%; border-radius: var(--radius); aspect-ratio: 16 / 9; object-fit: cover; }
.estate-photo figcaption { margin-top: 8px; color: var(--sub); font-size: 14px; }
.estate-copy { display: grid; gap: 16px; }
.estate-copy h2 { font-size: clamp(1.7rem, 1.4rem + 1vw, 2.2rem); }
.estate-copy p { max-width: 42em; }
.estate-spec { padding: 16px 0; border-block: 1px solid var(--rule); color: var(--sub); }
.estate-download { padding: 24px; }
.estate-download h2 { font-size: 1.8rem; }
.estate-download p, .estate-download ul { margin-top: 14px; }
.estate-download ul { padding-left: 22px; }
.estate-download li + li { margin-top: 8px; }
.estate-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.estate-gallery { display: grid; gap: 24px; }
.estate-watch { display: grid; gap: 28px; align-items: start; }
.youtube-facade { position: relative; aspect-ratio: 9 / 16; max-height: 640px; width: min(100%, 360px); overflow: hidden;
  border-radius: var(--radius); background: var(--ink); }
.youtube-facade img, .youtube-facade iframe { width: 100%; height: 100%; object-fit: cover; border: 0; }
.youtube-facade button { position: absolute; inset: auto 16px 22px; cursor: pointer; min-height: 52px; white-space: normal; }
.youtube-facade button[hidden] { display: none; }
.play-mark { width: 0; height: 0; border-block: 6px solid transparent; border-left: 10px solid currentColor; }
.youtube-facade button:focus-visible { outline: 3px solid var(--cream); }
.estate-card { padding: 24px; display: grid; gap: 24px; align-items: center; }
.estate-card h2 { margin-bottom: 12px; }
.estate-card p + p { margin-top: 16px; }
.estate-card img { border-radius: var(--radius); }
@media (min-width: 760px) {
  .estate-layout { grid-template-columns: 1.55fr 1fr; }
  .estate-gallery { grid-template-columns: 1fr 1fr; }
  .estate-watch { grid-template-columns: 360px 1fr; gap: 40px; }
  .estate-card { grid-template-columns: 1.2fr 1fr; }
}