/* ── FEATURED LISTING SHOWCASE ─────────────────────────────────────
   Full-bleed, nav-width layout — same breakout trick as the directory. */
.tdr-fl {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  padding-left: max(24px, calc(50vw - 600px));
  padding-right: max(24px, calc(50vw - 600px));
  box-sizing: border-box;
  background: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  color: #1f2937;
}
.tdr-fl * { box-sizing: border-box; }

/* ── Hero gallery ── */
.tdr-fl-hero {
  position: relative;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 8px;
  height: 480px;
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 22px;
}
.tdr-fl-hero--few { grid-template-columns: 1fr; }
.tdr-fl-hero-main, .tdr-fl-hero-thumb {
  border: none; padding: 0; cursor: pointer;
  background-size: cover; background-position: center;
  width: 100%; height: 100%;
  transition: filter .15s;
}
.tdr-fl-hero-main:hover, .tdr-fl-hero-thumb:hover { filter: brightness(1.06); }
.tdr-fl-hero-side {
  display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 8px;
}
.tdr-fl-seeall {
  position: absolute; right: 14px; bottom: 14px;
  background: #fff; color: #111; border: none; border-radius: 8px;
  padding: 9px 14px; font-size: 13px; font-weight: 700; cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
}
.tdr-fl-seeall:hover { background: #f3f4f6; }

/* ── Lightbox ── */
.tdr-fl-lightbox {
  position: fixed; inset: 0; z-index: 999999;
  background: rgba(10,10,12,.96);
  display: flex; align-items: center; justify-content: center;
}
.tdr-fl-lightbox[hidden] { display: none !important; }
.tdr-fl-lb-img { max-width: 92vw; max-height: 88vh; object-fit: contain; border-radius: 4px; }
.tdr-fl-lb-close, .tdr-fl-lb-prev, .tdr-fl-lb-next {
  position: fixed; background: rgba(255,255,255,.12); color: #fff;
  border: none; cursor: pointer; border-radius: 50%;
  width: 48px; height: 48px; font-size: 24px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.tdr-fl-lb-close:hover, .tdr-fl-lb-prev:hover, .tdr-fl-lb-next:hover { background: rgba(255,255,255,.28); }
.tdr-fl-lb-close { top: 18px; right: 18px; font-size: 18px; }
.tdr-fl-lb-prev  { left: 18px;  top: 50%; transform: translateY(-50%); }
.tdr-fl-lb-next  { right: 18px; top: 50%; transform: translateY(-50%); }
.tdr-fl-lb-count {
  position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%);
  color: #d1d5db; font-size: 13px; letter-spacing: .08em;
}

/* ── Open house banner ── */
.tdr-fl-openhouse {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 16px;
  background: #b91c1c; color: #fff; border-radius: 10px;
  padding: 14px 20px; margin: 0 0 18px; text-align: center;
}
.tdr-fl-oh-label {
  font-size: 13px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase;
  border: 2px solid rgba(255,255,255,.65); border-radius: 6px; padding: 4px 10px;
}
.tdr-fl-oh-when { font-size: 19px; font-weight: 800; }
@media (max-width: 600px) { .tdr-fl-oh-when { font-size: 16px; } }

/* ── Body: main column + sidebar ── */
.tdr-fl-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 36px; align-items: start; }
.tdr-fl-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 24px; }
.tdr-fl-card {
  border: 1px solid #e5e7eb; border-radius: 12px; background: #fff;
  padding: 18px; box-shadow: 0 1px 6px rgba(0,0,0,.05);
}
.tdr-fl-card--showing { background: #102a52; color: #fff; border-color: #102a52; }
.tdr-fl-card--showing p { margin: 0 0 14px; font-size: 14px; line-height: 1.55; color: #d7deeb !important; }
.tdr-fl-card--showing .tdr-fl-card-h { margin: 0 0 8px; font-family: Georgia, "Times New Roman", serif; font-size: 20px; color: #fff !important; }
a.tdr-fl-card-btn, a.tdr-fl-card-btn:visited {
  display: block; text-align: center; background: #c9a551; color: #102a52 !important;
  font-weight: 800; font-size: 15px; padding: 12px 16px; border-radius: 8px;
  text-decoration: none !important;
}
a.tdr-fl-card-btn:hover, a.tdr-fl-card-btn:focus {
  background: #fff; color: #102a52 !important; text-decoration: none !important;
}
.tdr-fl-card--biz { display: block; text-decoration: none; color: inherit; overflow: hidden; padding: 0; }
.tdr-fl-card--biz:hover { box-shadow: 0 4px 14px rgba(0,0,0,.12); }
.tdr-fl-card-img { display: block; width: 100%; height: 140px; background-size: cover; background-position: center; }
.tdr-fl-card-biz-body { display: block; padding: 14px 16px 16px; }
.tdr-fl-card-kicker { display: block; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #c9a551; margin-bottom: 4px; }
.tdr-fl-card-biz-name { display: block; font-size: 17px; font-weight: 800; color: #102a52; }
.tdr-fl-card-biz-cat { display: block; font-size: 13px; color: #6b7280; margin-top: 2px; }
.tdr-fl-card-biz-phone { display: block; font-size: 14px; color: #374151; margin-top: 8px; }
@media (max-width: 900px) {
  .tdr-fl-body { grid-template-columns: 1fr; }
  .tdr-fl-side { position: static; }
}

/* ── Fact bar ── */
.tdr-fl-facts {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 26px;
  padding: 4px 0 18px; border-bottom: 1px solid #e5e7eb; margin-bottom: 22px;
}
.tdr-fl-price { font-size: 32px; font-weight: 800; color: #102a52; }
.tdr-fl-stats { display: flex; gap: 18px; font-size: 16px; color: #374151; }
.tdr-fl-stats strong { font-size: 19px; color: #111; }
.tdr-fl-addr { width: 100%; font-size: 14px; color: #6b7280; }

/* ── Romance ── */
.tdr-fl-romance { max-width: 780px; font-size: 17px; line-height: 1.75; margin-bottom: 34px; }

/* ── Sections ── */
.tdr-fl-section { margin-bottom: 40px; }
.tdr-fl-h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 26px; margin: 0 0 14px; color: #111;
}
.tdr-fl-h2::after {
  content: ''; display: block; width: 56px; height: 3px;
  background: #c9a551; margin-top: 8px;
}

/* ── Virtual tour ── */
.tdr-fl-tour-wrap { position: relative; padding-top: 62%; border-radius: 12px; overflow: hidden; background: #f3f4f6; }
.tdr-fl-tour { position: absolute; inset: 0; width: 100%; height: 100%; }
.tdr-fl-tour-link { display: inline-block; margin-top: 10px; font-size: 14px; font-weight: 700; color: #c9a551; text-decoration: none; }
.tdr-fl-tour-link:hover { text-decoration: underline; }

/* ── Plans ── */
.tdr-fl-plans { display: flex; flex-wrap: wrap; gap: 16px; }
.tdr-fl-plans a { flex: 1 1 340px; max-width: 560px; }
.tdr-fl-plans img { width: 100%; border: 1px solid #e5e7eb; border-radius: 10px; }

/* ── Videos ── */
.tdr-fl-videos { display: flex; flex-wrap: wrap; gap: 22px; align-items: flex-start; }
.tdr-fl-video-wrap-landscape { flex: 1 1 520px; max-width: 760px; position: relative; padding-top: 0; }
.tdr-fl-video-wrap-landscape iframe.tdr-fl-video-landscape,
.tdr-fl-video-wrap-landscape video.tdr-fl-video-landscape {
  width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; background: #000;
}
.tdr-fl-video-wrap-portrait { flex: 0 0 280px; }
.tdr-fl-video-wrap-portrait iframe.tdr-fl-video-portrait,
.tdr-fl-video-wrap-portrait video.tdr-fl-video-portrait {
  width: 280px; aspect-ratio: 9 / 16; border-radius: 18px; background: #000;
  box-shadow: 0 8px 28px rgba(0,0,0,.18);
}

/* ── Map + nearby ── */
.tdr-fl-mapwrap { display: grid; grid-template-columns: 1.6fr 1fr; gap: 18px; align-items: stretch; }
#tdr-fl-map { min-height: 420px; border-radius: 12px; z-index: 0; }
.tdr-fl-nearby { display: flex; flex-direction: column; overflow-y: auto; max-height: 420px; border: 1px solid #e5e7eb; border-radius: 12px; }
.tdr-fl-nb-row {
  display: flex; align-items: baseline; gap: 10px;
  padding: 11px 14px; border-bottom: 1px solid #f1f5f9; text-decoration: none;
}
.tdr-fl-nb-row:last-child { border-bottom: none; }
.tdr-fl-nb-row:hover { background: #fafaf7; }
.tdr-fl-nb-name { font-weight: 700; font-size: 14px; color: #102a52; flex: 1; min-width: 0; }
.tdr-fl-nb-cat  { font-size: 11px; color: #6b7280; white-space: nowrap; }
.tdr-fl-nb-dist { font-size: 12px; font-weight: 700; color: #c9a551; white-space: nowrap; }

/* ── Mobile ── */
@media (max-width: 800px) {
  .tdr-fl-hero { height: 300px; grid-template-columns: 1fr; }
  .tdr-fl-hero-side { display: none; }
  .tdr-fl-mapwrap { grid-template-columns: 1fr; }
  .tdr-fl-nearby { max-height: 300px; }
  .tdr-fl-price { font-size: 26px; }
  .tdr-fl-video-wrap-portrait { flex: 1 1 100%; display: flex; justify-content: center; }
}
