/* ==========================================================================
   pages/profesionisti.html · page "Profesioniști" (theme: assets/pages/profesionisti.css; prefix pg-prof-)
   The trade page for HoReCa, importers, retail chains and the press, from content/pages/brand/trade.json
   (RO): the ranges for the trade, EAN codes, IGP Codru at line level, distinctions and critic scores,
   production figures, private label, samples and price lists, press kit, company data. Facts only from
   content/facts.yaml (the ids trade.json cites); its pending items stay quiet ("se confirmă") or out, and
   the 2026 catalogue (unsourced claims) is not shown. Requests go by e-mail to contact@doinavin.md, with
   the Romanian mailto subjects trade.json sets. Photos: real winery photos of the old brand site
   (img/profesionisti/). Layout only: kit tokens and components.
   ========================================================================== */
.pg-prof-sec { padding-block: var(--section); }
.pg-prof-sec--band { background: var(--band); }
.pg-prof-sechead { display: grid; gap: var(--sp-3); max-width: 46rem; margin-bottom: var(--sp-7); }
.pg-prof-sechead h2 { font-size: var(--fs-h1); line-height: var(--lh-h1); }
.pg-prof-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3) var(--sp-5); margin-top: var(--sp-6); }
/* the action buttons may wrap (the kit's buttons never do): at 320 px (400 % zoom) "Scrieți-ne despre marca privată"
   on one line would push its column past the screen. One line keeps the 48 px box; a second line grows it. */
.pg-prof-actions .dvh-btn { max-width: 100%; padding-block: calc((48px - 2px - 1.2em) / 2); white-space: normal; text-align: start; }   /* 2px: the border */
.pg-prof-frame { position: relative; margin: 0; overflow: clip; border-radius: var(--radius-media); background: var(--band); }
.pg-prof-frame > img { width: 100%; height: 100%; object-fit: cover; }
.pg-prof-fig { margin: 0; }
.pg-prof-fig figcaption { display: grid; gap: 2px; margin-top: var(--sp-2); }
.pg-prof-fig__name { font-size: var(--fs-meta); line-height: var(--lh-meta); font-weight: var(--fw-ui); color: var(--ink); }
.pg-prof-text > * + * { margin-top: var(--sp-4); }
.pg-prof-text h2 { font-size: var(--fs-h1); line-height: var(--lh-h1); margin-top: var(--sp-2); }
.pg-prof-text p:not(.dvh-kicker) { max-width: var(--text-measure); text-wrap: pretty; }

/* head: who the page is for, the one filled action, the address; the tank hall; the chapter index */
.pg-prof-head { padding-block: var(--sp-6) var(--sp-7); }
.pg-prof-head__grid { display: grid; gap: var(--sp-6); }
.pg-prof-head h1 { margin-top: var(--sp-2); }
.pg-prof-head .dvh-lead { margin-top: var(--sp-4); }
.pg-prof-mail { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1) var(--sp-2); margin-top: var(--sp-4); }
.pg-prof-mail .dvh-icon { color: var(--muted); }
.pg-prof-head .pg-prof-frame { aspect-ratio: 3 / 2; }
.pg-prof-toc { margin-top: var(--sp-7); }
.pg-prof-toc ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--col-gap); border-top: 1px solid var(--line); }
.pg-prof-toc a { display: flex; align-items: baseline; gap: var(--sp-2); min-height: var(--tap); height: 100%; 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-prof-toc a span { font-family: var(--font-text); font-size: var(--fs-meta); color: var(--muted); font-variant-numeric: tabular-nums; }
.pg-prof-toc a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }

/* 01 the ranges: one row card per line (neutral well, the house's own bottle, dot and origin), the whole
   card links to the house; the focus ring follows the card */
.pg-prof-ranges { display: grid; gap: var(--sp-3) var(--col-gap); }
.pg-prof-range.dvh-card { display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: start; column-gap: var(--sp-4); padding: 6px; }
.pg-prof-range .dvh-card__well { aspect-ratio: 4 / 5; }
.pg-prof-range__body { min-width: 0; padding: var(--sp-2) var(--sp-2) var(--sp-3) 0; }
.pg-prof-range .dvh-card__title { margin-top: var(--sp-1); }
.pg-prof-range__link { color: inherit; text-decoration: none; }
.pg-prof-range__link::after { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: var(--radius-media); }
.pg-prof-range:hover .dvh-card__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
@supports selector(:has(a)) {
  .pg-prof-range__link:focus-visible { outline: none; }
  .pg-prof-range:has(.pg-prof-range__link:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }
}
.pg-prof-range__text { margin-top: var(--sp-2); font-size: var(--fs-ui); line-height: 1.55; text-wrap: pretty; }
.pg-prof-more { margin-top: var(--sp-6); }

/* 02 EAN codes: head and request on the left, one row per wine (thumb, name and facts, the code, the shop
   link); phones stack the code under the facts, from 600 px it stands in its own right-hand column */
.pg-prof-codesgrid { display: grid; gap: var(--sp-6); }
.pg-prof-codesgrid .pg-prof-sechead { margin-bottom: 0; }
.pg-prof-codes { border-top: 1px solid var(--line); }
.pg-prof-code {
  display: grid; grid-template-columns: 48px minmax(0, 1fr); grid-template-areas: "thumb text" "thumb ean" "thumb shop";
  column-gap: var(--sp-4); row-gap: var(--sp-2); padding-block: var(--sp-4); border-bottom: 1px solid var(--line);
}
.pg-prof-code > .dvh-thumb { grid-area: thumb; }
.pg-prof-code__text { grid-area: text; min-width: 0; }
.pg-prof-code__name { font-family: var(--font-display); font-size: var(--fs-card); line-height: var(--lh-card); font-weight: var(--fw-title); text-wrap: balance; }
.pg-prof-code__meta { margin-top: 2px; }
.pg-prof-code__shop { grid-area: shop; justify-self: start; font-size: var(--fs-meta); line-height: var(--lh-meta); }
.pg-prof-code__ean { grid-area: ean; display: flex; align-items: baseline; gap: var(--sp-2); }
.pg-prof-code__num { font-size: var(--fs-body); line-height: var(--lh-ui); font-weight: var(--fw-strong); font-variant-numeric: tabular-nums lining-nums; letter-spacing: .02em; white-space: nowrap; }

/* 03 IGP Codru: the cellar photo beside the text, the three IGP houses as chips */
.pg-prof-split { display: grid; gap: var(--sp-6); align-items: center; }
.pg-prof-split .pg-prof-frame { aspect-ratio: 4 / 3; }
.pg-prof-split .dvh-cluster { margin-top: var(--sp-5); --cluster: var(--sp-3) var(--sp-2); }

/* 04 and 05 figures: hairline, numeral, label */
.pg-prof-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5) var(--sp-4); }
.pg-prof-figures > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: var(--sp-2); padding-top: var(--sp-3); border-top: 1px solid var(--ink); }
.pg-prof-figures dd { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: var(--sp-2); font-family: var(--font-display); font-size: var(--fs-numeral); line-height: var(--lh-numeral); font-variant-numeric: tabular-nums lining-nums; white-space: nowrap; }
.pg-prof-figures dd small { font-family: var(--font-text); font-size: var(--fs-ui); line-height: var(--lh-ui); color: var(--muted); white-space: normal; }
.pg-prof-figures dt { font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); max-width: 28ch; }
.pg-prof-figures--3 { --cols: 3; grid-template-columns: minmax(0, 1fr); }   /* "6.000 sticle/oră" needs the full phone width */

/* 04 distinctions: the 2026 results and the critic scores side by side */
.pg-prof-honours { display: grid; gap: var(--sp-7); margin-top: var(--sp-8); }
.pg-prof-honours h3 { font-size: var(--fs-h3); line-height: var(--lh-h3); }
.pg-prof-honours .dvh-meta { margin-top: var(--sp-2); max-width: 52ch; }
.pg-prof-honours .dvh-awardlist, .pg-prof-honours .dvh-critics { margin-top: var(--sp-4); }
.pg-prof-honours .dvh-awardlist li { gap: var(--sp-1); }
.pg-prof-honours .dvh-awardlist__what b { font-weight: var(--fw-strong); }
.pg-prof-honours .dvh-critic { grid-template-columns: 5.5rem minmax(0, 1fr); }
.pg-prof-honours .dvh-critic__score { white-space: nowrap; }
.pg-prof-honours .pg-prof-more { margin-top: var(--sp-4); }

/* 06 private label: text beside the Dolofana pair on the house tint (a single-house surface) */
.pg-prof-pl__well { position: relative; aspect-ratio: 4 / 3; overflow: clip; isolation: isolate; border-radius: var(--radius-media); background: var(--house-tint); }
.pg-prof-pl__well::before { content: ""; position: absolute; left: 50%; bottom: 9%; z-index: 0; width: 52%; height: 5%; translate: -50% 50%; background: var(--contact-shadow); }
.pg-prof-pl__well img { position: absolute; bottom: 7%; z-index: 1; height: 80%; width: auto; max-width: none; translate: -50% 0; }
.pg-prof-pl__well img:first-of-type { left: 39%; }
.pg-prof-pl__well img:last-of-type { left: 61%; }  /* -of-type: the 360 turntable (cards.js) inserts a <video> after each bottle */
.pg-prof-pl .pg-prof-fig figcaption { margin-top: var(--sp-3); }

/* 07 requests: one row per request on a white panel, the mailto button on the right from 600 px */
.pg-prof-desk { background: var(--surface); border-radius: var(--radius-media); padding: var(--sp-2) var(--sp-5); }
.pg-prof-req { display: grid; gap: var(--sp-3); padding-block: var(--sp-5); border-bottom: 1px solid var(--line); }
.pg-prof-req:last-child { border-bottom: 0; }
.pg-prof-req h3 { font-size: var(--fs-h3); line-height: var(--lh-h3); }
.pg-prof-req p { margin-top: var(--sp-2); max-width: 60ch; font-size: var(--fs-ui); line-height: 1.55; text-wrap: pretty; }
.pg-prof-req__acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-5); }
.pg-prof-desk + .pg-prof-mail { margin-top: var(--sp-5); }

/* 08 company data: the requisites as a fact list beside the courtyard */
.pg-prof-company { display: grid; gap: var(--sp-6); align-items: start; }
.pg-prof-company .pg-prof-frame { aspect-ratio: 16 / 9; }
.pg-prof-company .dvh-factlist dd { overflow-wrap: anywhere; }

/* closing call: the bottles beside the invitation */
.pg-prof-close { display: grid; gap: var(--sp-6); align-items: center; }
.pg-prof-close .pg-prof-frame { aspect-ratio: 4 / 3; }
.pg-prof-close .pg-prof-frame > img { object-position: 50% 62%; }
.pg-prof-close h2 { font-size: var(--fs-h1); line-height: var(--lh-h1); }
.pg-prof-close .dvh-lead { margin-top: var(--sp-4); }

/* pages-trade (2026-10-20): the trade pages under the head, the HoReCa chapter, the export questions, the public
   procurement sentence. Kit tokens only. */
.pg-prof-subpages { margin-top: var(--sp-7); }
.pg-prof-subpages__title { font-family: var(--font-text); font-size: var(--fs-eyebrow); line-height: var(--lh-eyebrow); font-weight: var(--fw-strong); letter-spacing: var(--track-eyebrow); text-transform: uppercase; color: var(--muted); }
.pg-prof-subpages__list { display: grid; gap: var(--sp-3); margin-top: var(--sp-3); }
.pg-prof-subpage {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name icon" "text icon";
  align-items: center; column-gap: var(--sp-4); row-gap: var(--sp-1); min-height: var(--tap); height: 100%;
  padding: var(--sp-4) var(--sp-5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-media);
  color: var(--ink); text-decoration: none;
}
.pg-prof-subpage:hover { border-color: var(--control); }
.pg-prof-subpage:hover .pg-prof-subpage__name { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.pg-prof-subpage__name { grid-area: name; font-family: var(--font-display); font-size: var(--fs-card); line-height: var(--lh-card); font-weight: var(--fw-title); text-wrap: balance; }
.pg-prof-subpage__text { grid-area: text; font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); text-wrap: pretty; }
.pg-prof-subpage > .dvh-icon { grid-area: icon; color: var(--muted); }

.pg-prof-horeca { display: grid; gap: var(--sp-5) var(--col-gap); }
.pg-prof-horeca > li { display: grid; align-content: start; gap: var(--sp-2); padding-top: var(--sp-4); border-top: 1px solid var(--ink); }
.pg-prof-horeca h3 { font-size: var(--fs-h3); line-height: var(--lh-h3); }
.pg-prof-horeca p { max-width: 60ch; font-size: var(--fs-ui); line-height: 1.55; text-wrap: pretty; }

.pg-prof-faq { margin-top: var(--sp-7); max-width: 60rem; }
.pg-prof-faq__q, .tr-faq__q { font-family: inherit; font-size: inherit; line-height: inherit; font-weight: inherit; }
.pg-prof-faq .dvh-acc > summary > .dvh-icon, .tr-faq .dvh-acc > summary > .dvh-icon { flex: none; }
.pg-prof-faq .dvh-acc__body, .tr-faq .dvh-acc__body { font-size: var(--fs-body); line-height: var(--lh-body); }

.pg-prof-procurement { max-width: var(--text-measure); font-size: var(--fs-ui); line-height: 1.55; color: var(--muted); text-wrap: pretty; }

@media (min-width: 600px) {
  .pg-prof-figures { grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); }
  .pg-prof-code { grid-template-columns: 48px minmax(0, 1fr) auto; grid-template-areas: "thumb text ean" "thumb shop ean"; row-gap: var(--sp-1); }
  .pg-prof-code > .dvh-thumb, .pg-prof-code__ean { align-self: center; }
  .pg-prof-code__ean { display: grid; justify-items: end; gap: 2px; text-align: right; }
  .pg-prof-req { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: var(--sp-6); }
  .pg-prof-company .dvh-factlist > div { grid-template-columns: 168px minmax(0, 1fr); }
}
@media (min-width: 700px) {
  .pg-prof-ranges { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-prof-subpages__list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
}
@media (min-width: 900px) {
  .pg-prof-head { padding-block: var(--sp-7); }
  .pg-prof-head__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--sp-8); align-items: center; }
  .pg-prof-head .pg-prof-frame { aspect-ratio: 4 / 3; }
  .pg-prof-toc ol { grid-template-columns: repeat(5, minmax(0, 1fr)); }   /* ten chapters: two even rows */
  .pg-prof-horeca { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-prof-range.dvh-card { grid-template-columns: 120px minmax(0, 1fr); column-gap: var(--sp-5); }
  .pg-prof-codesgrid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-8); align-items: start; }
  .pg-prof-split { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--sp-8); }
  .pg-prof-honours { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-8); align-items: start; }
  .pg-prof-desk { padding: var(--sp-2) var(--sp-6); }
  .pg-prof-company { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-8); }
  .pg-prof-close { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-8); }
  .pg-prof-close .pg-prof-frame { aspect-ratio: 4 / 5; }
}
