/* =============================================================
   BELLO — THE ESTATE DOSSIER (public funnel design layer)
   Build brief v1.0 (2026-07-10). Loaded AFTER stays-premium.css on
   stays.html / stay.html / book-checkout.html / booking-confirmed.html.
   PR2 ships the foundation (tokens, type roles, editorial block,
   Particulars ledger, honest-review plaque, ledger rule); later
   slices add the seal, hero plates, calendar, and motion layers.
   ============================================================= */

:root {
  /* Palette — extends the existing brass/navy system (§2.1) */
  --cream-50:  var(--flo-paper-1);   /* page ground, cards */
  --cream-100: var(--flo-paper-3);   /* alternating bands, calendar cells, img placeholders */
  --ink-900:   var(--flo-ink-0);   /* display type, prose */
  --ink-600:   var(--flo-ink-1);   /* body secondary */
  --ink-400:   #6b6457;   /* labels, captions — contrast floor, do not lighten */
  --bhds-gold: #7a5512;   /* brass text: eyebrows, №, links, margin notes */
  --brass-grad: linear-gradient(90deg, var(--flo-brass-300) 0%, var(--flo-brass-500) 55%, #a67c46 100%);
  --dossier-red: var(--flo-strike); /* calendar strikes, struck OTA figure, form errors ONLY */
  --bhds-warn: var(--flo-hold);   /* THE HOLD CLOCK ONLY (G4 — scarcity by color rarity) */
  --emboss: 0 1px 0 rgba(255, 255, 255, 0.55) inset, 0 1px 2px rgba(28, 24, 18, 0.12);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---- Type roles (§2.2) — Fraunces + Inter, already loaded ---------- */
.d-display {
  font-family: 'Fraunces', serif;
  font-weight: 480;
  letter-spacing: -0.01em;
  line-height: 1.04;
  font-optical-sizing: auto;
  color: var(--ink-900);
}
.d-prose {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 1.04rem;
  line-height: 1.72;
  color: var(--ink-600);
  max-width: 65ch;
}
.d-prose-serif {
  font-family: 'Fraunces', serif;
  font-weight: 330;
  font-size: 1.14rem;
  line-height: 1.8;
  color: var(--ink-600);
  max-width: 65ch;
}
/* Every numeral in the funnel — prices, dates, counts, folio numbers —
   rides this class. This one rule is 40% of the feel. */
.d-ledger {
  font-family: 'Inter', sans-serif;
  font-variant-numeric: tabular-nums;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ink-900);
}
.lg-label {
  font-family: 'Inter', sans-serif;
  font-size: 0.66rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--ink-400);
}
.d-folio {
  font-family: 'Inter', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--bhds-gold);
}
/* Margin Note (G1) — max ONE per page, one sentence, signed. */
.d-note {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--bhds-gold);
  max-width: 34ch;
}

/* ---- The Ledger Line (§3.2, G5 continuity thread) ------------------ */
.d-rule {
  height: 1px;
  background: var(--brass-grad);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 520ms var(--ease-out);
}
.d-rule.is-inked { transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) {
  .d-rule { transform: scaleX(1); transition: none; }
}

/* On portrait tablets the first dossier leaf already peeks into the
   viewport below the mosaic. Keep that visible at first paint so the
   legacy 2.5s reveal failsafe cannot become the page's LCP. */
@media (min-width: 721px) and (max-width: 1024px) and (min-height: 900px) {
  html.js .stay-quickfacts + .stay-reveal { opacity: 1; transform: none; }
}

/* ---- Editorial description (§7.2) ---------------------------------- */
.d-editorial { max-width: 65ch; }
.d-lede {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.4;
  color: var(--ink-900);
  border-left: 3px solid;
  border-image: var(--brass-grad) 1;
  padding-left: 1.4rem;
  margin: 0 0 1.4rem;
}
.d-editorial p {
  font-family: 'Fraunces', serif;
  font-weight: 330;
  font-size: 1.14rem;
  line-height: 1.8;
  color: var(--ink-600);
  margin: 0 0 1.25rem;
}
.d-editorial p.d-first::first-letter {
  font-family: 'Fraunces', serif;
  font-weight: 600;
  font-size: 3.4em;
  line-height: 0.82;
  float: left;
  padding: 0.06em 0.12em 0 0;
  color: var(--ink-900);
}
.d-divider {
  text-align: center;
  color: var(--ink-400);
  letter-spacing: 0.35em;
  font-size: 0.8rem;
  margin: 1.6rem 0;
  user-select: none;
}
/* Long stories clamp at 4 paragraphs behind a paper fade. */
.d-editorial.is-clamped .d-clamp {
  max-height: 30rem;
  overflow: hidden;
  position: relative;
}
.d-editorial.is-clamped .d-clamp::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 7rem;
  background: linear-gradient(180deg, rgba(250, 245, 235, 0) 0%, var(--cream-50) 88%);
  pointer-events: none;
}
.d-editorial .d-clamp { transition: max-height 460ms var(--ease-out); }
@media (prefers-reduced-motion: reduce) {
  .d-editorial .d-clamp { transition: none; }
}
.d-readmore {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.4rem;
  background: none;
  border: 0;
  padding: 0.35rem 0;
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bhds-gold);
  cursor: pointer;
}
.d-readmore::before { content: '──'; letter-spacing: -0.1em; color: #c9a06a; }
.d-readmore:focus-visible { outline: 2px solid var(--bhds-gold); outline-offset: 3px; }

/* ---- Particulars ledger (§7.2) — sparse-content backbone ----------- */
.d-part { border-top: 1px solid rgba(166, 124, 70, 0.28); }
.d-part__row {
  display: grid;
  grid-template-columns: 3.2rem 1fr auto;
  align-items: baseline;
  gap: 0.9rem;
  padding: 0.72rem 0.15rem;
  border-bottom: 1px solid rgba(166, 124, 70, 0.16);
}
.d-part__num {
  font-family: 'Inter', sans-serif;
  font-variant-numeric: tabular-nums;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--bhds-gold);
}
.d-part__key { composes: none; }
.d-part__row .lg-label { letter-spacing: 0.14em; font-size: 0.7rem; }
.d-part__val {
  font-family: 'Inter', sans-serif;
  font-variant-numeric: tabular-nums;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ink-900);
  text-align: right;
}

/* ---- Honest-review plaque (Law 2) ---------------------------------- */
.d-plaque {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.42rem 0.85rem;
  border: 1px solid rgba(166, 124, 70, 0.4);
  border-radius: 3px;
  background: var(--cream-100);
  box-shadow: var(--emboss);
  font-family: 'Inter', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bhds-gold);
}

/* ---- Dated-search result line (PR1) -------------------------------- */
.d-searchline {
  display: inline-flex;
  align-items: baseline;
  gap: 0.7rem;
  font-family: 'Inter', sans-serif;
  font-variant-numeric: tabular-nums;
  font-size: 0.9rem;
  color: var(--ink-600);
}
.d-searchline button {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  font-weight: 600;
  color: var(--bhds-gold);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
