/* ==========================================================================
   assets/pages/povestea.css = the page <style> of pages/povestea.html (copied verbatim): the story page "Povestea" (owner 2026-10-17: "where is the pitch info and menu?",
   the old brand pages come back in the house kit). The family and brand story after the cellar film: the
   name Doina, then seven chapters (the 1875 cellar, the estate 1878-1940, the sovhoz, Feodosie Borș 1993,
   Doina Borș 2017, Artitude, today in Codru), the visit invitation and the way on to Crama and Premii.
   Copy: content/pages/brand/story.json (RO). Its pending items stay off the page: the landowner's name
   (FOUNDER_NAME), the exact year the cellar was taken over (CELLAR_ACQUISITION_YEAR, only "Anii 2000"),
   the Artitude artists after 2017 (ARTITUDE_ARTISTS), the vineyard area (VINEYARD_FACTS) and the booklet.
   Facts: content/facts.yaml (data-fact names the fact id). Photos: CMB shoot of 6 September 2025
   (img/povestea/, no people) and the period photo of the heritage booklet. Layout only: kit tokens.
   ========================================================================== */
.pg-povestea-sec { padding-block: var(--section); }
.pg-povestea-sec--band { background: var(--band); }
.pg-povestea-head { display: grid; gap: var(--sp-3); max-width: 46rem; margin-bottom: var(--sp-7); }
.pg-povestea-head h2, .pg-povestea-text h2 { font-size: var(--fs-h1); line-height: var(--lh-h1); }
.pg-povestea-frame { position: relative; margin: 0; overflow: clip; border-radius: var(--radius-media); background: var(--band); }
.pg-povestea-sec--band .pg-povestea-frame { background: var(--ground); }
.pg-povestea-frame > img { width: 100%; height: 100%; object-fit: cover; }
.pg-povestea-fig { margin: 0; }
.pg-povestea-fig figcaption { margin-top: var(--sp-2); }
.pg-povestea-src { font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); }
.pg-povestea-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3) var(--sp-5); }

/* the name: "Doina" the daughter and "doina" the song, then the chapter index */
.pg-povestea-intro { padding-block: var(--section) var(--sp-7); }
.pg-povestea-intro__grid { display: grid; gap: var(--sp-6); }
.pg-povestea-intro__head { display: grid; gap: var(--sp-3); align-content: start; }
.pg-povestea-intro__head h2:not(.dvh-kicker) { font-size: var(--fs-h1); line-height: var(--lh-h1); }
.pg-povestea-name { display: grid; gap: var(--sp-6) var(--col-gap); }
.pg-povestea-name > div { display: grid; align-content: start; gap: var(--sp-3); padding-top: var(--sp-3); border-top: 1px solid var(--ink); }
.pg-povestea-name dt { display: grid; gap: var(--sp-2); }
.pg-povestea-name__word { font-family: var(--font-display); font-size: var(--fs-numeral); line-height: var(--lh-numeral); }
.pg-povestea-name dd { max-width: 40ch; text-wrap: pretty; }
.pg-povestea-toc { margin-top: var(--sp-8); }
.pg-povestea-toc__lead { margin-bottom: var(--sp-4); max-width: var(--text-measure); color: var(--muted); text-wrap: pretty; }
.pg-povestea-toc ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--col-gap); border-top: 1px solid var(--line); }
.pg-povestea-toc a { display: flex; align-items: baseline; gap: var(--sp-2); min-height: var(--tap); padding-block: var(--sp-3); border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; font-family: var(--font-display); font-size: var(--fs-card); line-height: var(--lh-card); }
.pg-povestea-toc a span { font-family: var(--font-text); font-size: var(--fs-meta); color: var(--muted); font-variant-numeric: tabular-nums; }
.pg-povestea-toc a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }

/* chapters 1 and 7: a photo beside the text */
.pg-povestea-split { display: grid; gap: var(--sp-6); align-items: center; }
.pg-povestea-split .pg-povestea-frame { aspect-ratio: 3 / 2; }
.pg-povestea-text > * + * { margin-top: var(--sp-4); }
.pg-povestea-text p, .pg-povestea-event__body p, .pg-povestea-date p, .pg-povestea-artists p { text-wrap: pretty; }
.pg-povestea-text > h2 { margin-top: var(--sp-2); }
.pg-povestea-text > .pg-povestea-actions { margin-top: var(--sp-5); }

/* chapters 2 and 3: dated events, each with its source, beside a photo */
.pg-povestea-chapter { display: grid; gap: var(--sp-7); }
.pg-povestea-timeline { border-bottom: 1px solid var(--line); }
.pg-povestea-event { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: var(--sp-4); padding-block: var(--sp-5); border-top: 1px solid var(--line); }
.pg-povestea-event__when { font-family: var(--font-display); font-size: var(--fs-h3); line-height: var(--lh-h3); font-variant-numeric: tabular-nums lining-nums; text-wrap: balance; }
.pg-povestea-event__body > * + * { margin-top: var(--sp-2); }
.pg-povestea-event__body p { max-width: var(--text-measure); }
.pg-povestea-aside { align-self: start; }
.pg-povestea-aside .pg-povestea-frame { aspect-ratio: 3 / 2; }
.pg-povestea-period .pg-povestea-frame { aspect-ratio: 1525 / 938; }
.pg-povestea-period figcaption { display: grid; gap: 2px; font-size: var(--fs-ui); line-height: 1.55; }

/* chapter 4: four dates side by side */
.pg-povestea-dates { display: grid; gap: var(--sp-6) var(--col-gap); }
.pg-povestea-date { display: grid; align-content: start; gap: var(--sp-2); padding-top: var(--sp-4); border-top: 1px solid var(--ink); }
.pg-povestea-date__when { font-family: var(--font-display); font-size: var(--fs-h1); line-height: var(--lh-numeral); font-variant-numeric: tabular-nums lining-nums; white-space: nowrap; }
.pg-povestea-date p { max-width: 40ch; }

/* chapter 5: Doina Borș, her return and her own words */
.pg-povestea-voice { display: grid; gap: var(--sp-7); }
.pg-povestea-voice .dvh-prose { margin-top: var(--sp-5); }

/* chapter 6: Artitude, one artist per vintage (the label of each documented vintage, from the bottle) */
.pg-povestea-art { display: grid; gap: var(--sp-7); }
.pg-povestea-art .pg-povestea-head { margin-bottom: 0; }
.pg-povestea-art .pg-povestea-actions { margin-top: var(--sp-2); }
.pg-povestea-artists.dvh-labelstrip { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr); gap: var(--sp-5) var(--col-gap); overflow: visible; padding-bottom: 0; }
.pg-povestea-artists figure { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.pg-povestea-artists figcaption { margin-top: 0; }
.pg-povestea-artists figcaption p { font-size: var(--fs-ui); line-height: 1.55; }
.pg-povestea-artists figcaption .pg-povestea-src { font-size: var(--fs-meta); line-height: var(--lh-meta); }

/* chapter 7: today, the houses as one family (each a link to its house) */
.pg-povestea-houses { --cluster: var(--sp-2); }
.pg-povestea-coda { font-family: var(--font-display); font-size: var(--fs-h3); line-height: var(--lh-h3); text-wrap: balance; }

/* the way on: Crama (the place) and Premii */
.pg-povestea-next { padding-block: var(--sp-8); }
.pg-povestea-next__list { display: grid; gap: var(--sp-5) var(--col-gap); margin-top: var(--sp-5); }
.pg-povestea-next__item { display: grid; gap: var(--sp-2); min-height: var(--tap); padding-top: var(--sp-4); border-top: 1px solid var(--ink); color: var(--ink); text-decoration: none; }
.pg-povestea-next__title { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); font-family: var(--font-display); font-size: var(--fs-h3); line-height: var(--lh-h3); font-weight: var(--fw-title); }
.pg-povestea-next__item p { font-size: var(--fs-ui); line-height: 1.55; color: var(--muted); max-width: 46ch; }
.pg-povestea-next__item:hover .pg-povestea-next__title span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .pg-povestea-next__title .dvh-icon { transition: translate var(--dur-hover) var(--ease-out); }
  .pg-povestea-next__item:hover .pg-povestea-next__title .dvh-icon { translate: 4px 0; }
}

@media (min-width: 600px) {
  .pg-povestea-name { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-povestea-dates { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-povestea-artists.dvh-labelstrip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-povestea-artists figure { display: block; }
  .pg-povestea-artists figcaption { margin-top: var(--sp-3); }
  .pg-povestea-next__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .pg-povestea-intro__grid { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--sp-8); align-items: start; }
  .pg-povestea-toc ol { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .pg-povestea-split { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-8); }
  .pg-povestea-chapter { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-8); align-items: start; }
  .pg-povestea-event { grid-template-columns: 168px minmax(0, 1fr); gap: var(--sp-5); }
  .pg-povestea-event__when { font-size: var(--fs-h2); line-height: var(--lh-h2); }
  .pg-povestea-dates { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pg-povestea-voice { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-8); align-items: center; }
  .pg-povestea-art { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--sp-8); align-items: start; }
}
@media (min-width: 900px) and (min-height: 820px) {
  .pg-povestea-aside { position: sticky; top: calc(var(--header-h) + var(--sp-5)); }
}