/* ==========================================================================
   pages/confidentialitate.html · "Confidențialitate și cookie-uri": the privacy and cookies notice
   (Legea nr. 195/2024), a working draft until the lawyer's review. Text: content/pages/brand/
   privacy-cookies.json (RO); operator requisites: content/facts.yaml (data-fact names the fact id).
   A page to read: title and lead, the draft notice, the contents (a sticky column beside the text
   from 1200 px), nine numbered sections in one reading column, then the contact band.
   Layout only: every colour, type size, radius and duration is a kit token.
   ========================================================================== */

.pg-confidentialitate-doc,
.pg-confidentialitate-cta {
  --pg-n: 2.5rem;    /* the section-number column */
  --pg-col: 40rem;   /* the reading column: about 68 characters of body text */
}

/* ---- document grid: head, notice, contents, text; from 1200 px the contents stand to the left --- */
.pg-confidentialitate-doc {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "head" "notice" "toc" "main";
  padding-block: var(--sp-7) var(--sp-8);
}
.pg-confidentialitate-head { grid-area: head; display: grid; justify-items: start; gap: var(--sp-3); max-width: var(--pg-col); }
.pg-confidentialitate-head .dvh-lead { margin-top: var(--sp-2); }
/* 2026-10-18 (pages track, RU / EN): the Russian title holds a word wider than a phone's column ("Конфиденциальность"
   is 404 px at the kit's 36 px h1, the column 358 px at 390 px wide), so below about 470 px the RU title follows the
   screen width (8vw = 31 px at 390 px). RO and EN keep the kit size. A longer word typed later in Pagini >
   Confidențialitate breaks at the column's edge instead of widening the page. */
.pg-confidentialitate-head h1:lang(ru) { font-size: min(var(--fs-h1), 8vw); }
.pg-confidentialitate-head h1:is(:lang(ru), :lang(en)) { overflow-wrap: anywhere; }
.pg-confidentialitate-notice { grid-area: notice; max-width: var(--pg-col); margin-top: var(--sp-6); }
.pg-confidentialitate-notice .dvh-notice__body > * + * { margin-top: var(--sp-2); }
.pg-confidentialitate-toc { grid-area: toc; margin-top: var(--sp-7); }
.pg-confidentialitate-main { grid-area: main; min-width: 0; }

/* ---- contents: number and title per row, 44 px rows; beside the text (1200 px and up) the section
        in view is underlined where the browser knows scroll-target-group (no script) ----------------- */
.pg-confidentialitate-toc ol { margin-top: var(--sp-3); border-top: 1px solid var(--line); }
.pg-confidentialitate-toc a {
  display: grid; grid-template-columns: var(--pg-n) minmax(0, 1fr); align-items: baseline;
  min-height: var(--tap); padding-block: var(--sp-3); border-bottom: 1px solid var(--line);
  color: var(--ink); text-decoration: none;
  font-size: var(--fs-ui); line-height: var(--lh-ui); font-weight: var(--fw-ui);
}
.pg-confidentialitate-toc__n { font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); font-variant-numeric: tabular-nums lining-nums; }
.pg-confidentialitate-toc__t { text-decoration-line: underline; text-decoration-color: transparent; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.pg-confidentialitate-toc a:hover .pg-confidentialitate-toc__t { text-decoration-color: currentColor; }

/* ---- sections: a hairline, the number beside the heading, the quiet "De confirmat" under it ----- */
.pg-confidentialitate-sec { max-width: var(--pg-col); margin-top: var(--sp-7); padding-top: var(--sp-6); border-top: 1px solid var(--line); }
.pg-confidentialitate-sec h2 {
  display: grid; grid-template-columns: var(--pg-n) minmax(0, 1fr); align-items: baseline;
  font-size: var(--fs-h3); line-height: var(--lh-h3);
}
.pg-confidentialitate-n { font-size: var(--fs-kicker); line-height: var(--lh-kicker); color: var(--muted); font-variant-numeric: tabular-nums lining-nums; }
.pg-confidentialitate-status { margin-top: var(--sp-1); padding-left: var(--pg-n); font-size: var(--fs-meta); line-height: var(--lh-meta); }
.pg-confidentialitate-text { margin-top: var(--sp-4); }
.pg-confidentialitate-act { margin-top: var(--sp-3); }

/* run-in lists: a bold lead-in, then the sentence; hairlines between the items */
.pg-confidentialitate-items { margin-top: var(--sp-5); border-top: 1px solid var(--line); }
.pg-confidentialitate-items > li { padding-block: var(--sp-4); border-bottom: 1px solid var(--line); text-wrap: pretty; }
.pg-confidentialitate-items > li:last-child, .pg-confidentialitate-cookies > li:last-child { border-bottom: 0; padding-bottom: 0; }   /* the next section's hairline closes the list */

/* rights: a set of short entries, two columns from 600 px */
.pg-confidentialitate-rights { margin-top: var(--sp-5); display: grid; gap: var(--sp-5) var(--col-gap); }
.pg-confidentialitate-rights > li { padding-top: var(--sp-3); border-top: 1px solid var(--ink); }
.pg-confidentialitate-rights h3 { font-size: var(--fs-card); line-height: var(--lh-card); }
.pg-confidentialitate-rights p { margin-top: var(--sp-2); text-wrap: pretty; }

/* cookies: the name with where it lives and how necessary it is, then what it does */
.pg-confidentialitate-cookies { margin-top: var(--sp-5); border-top: 1px solid var(--line); }
.pg-confidentialitate-cookies > li { display: grid; gap: var(--sp-1) var(--sp-5); padding-block: var(--sp-4); border-bottom: 1px solid var(--line); }
.pg-confidentialitate-cookies h3 { font-family: var(--font-text); font-size: var(--fs-body); line-height: var(--lh-ui); font-weight: var(--fw-strong); }
.pg-confidentialitate-cookies p:last-child { margin-top: var(--sp-1); text-wrap: pretty; }

/* ---- contact band: the one filled action of the page ------------------------------------------- */
.pg-confidentialitate-cta { padding-block: var(--section); background: var(--band); }
.pg-confidentialitate-cta__body { max-width: var(--pg-col); }
.pg-confidentialitate-cta h2 { font-size: var(--fs-h2); line-height: var(--lh-h2); }
.pg-confidentialitate-cta .dvh-lead { margin-top: var(--sp-3); }
.pg-confidentialitate-cta__actions { margin-top: var(--sp-6); display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3) var(--sp-5); }

@media (min-width: 600px) {
  .pg-confidentialitate-rights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-confidentialitate-cookies > li { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name meta" "text text"; align-items: baseline; }
  .pg-confidentialitate-cookies h3 { grid-area: name; }
  .pg-confidentialitate-cookies .dvh-meta { grid-area: meta; justify-self: end; white-space: nowrap; }
  .pg-confidentialitate-cookies p:last-child { grid-area: text; }
}
@media (min-width: 600px) and (max-width: 1199.98px) {
  .pg-confidentialitate-toc ol { display: grid; grid-auto-flow: column; grid-template-rows: repeat(5, auto); grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--col-gap); }
}
@media (min-width: 900px) and (max-width: 1199.98px) {
  .pg-confidentialitate-toc ol { grid-template-rows: repeat(3, auto); grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
  .pg-confidentialitate-doc {
    grid-template-columns: minmax(0, 3fr) minmax(0, 8fr);
    grid-template-areas: "toc head" "toc notice" "toc main";
    column-gap: var(--sp-9);
    padding-top: var(--sp-8);
  }
  .pg-confidentialitate-toc { margin-top: 0; align-self: start; }
  /* the numbers hang in the gutter, so headings and text share one left edge */
  .pg-confidentialitate-sec h2 { margin-left: calc(-1 * var(--pg-n)); }
  .pg-confidentialitate-status { padding-left: 0; }
  .pg-confidentialitate-cta__inner { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 8fr); column-gap: var(--sp-9); }
  .pg-confidentialitate-cta__body { grid-column: 2; }
}
@media (min-width: 1200px) and (min-height: 640px) {
  .pg-confidentialitate-toc { position: sticky; top: calc(var(--header-h) + var(--sp-6)); }
  @supports (scroll-target-group: auto) {
    .pg-confidentialitate-toc ol { scroll-target-group: auto; }
    .pg-confidentialitate-toc a:target-current .pg-confidentialitate-toc__t { text-decoration-color: currentColor; text-decoration-thickness: 2px; }
    .pg-confidentialitate-toc a:target-current .pg-confidentialitate-toc__n { color: var(--ink); }
  }
}

/* ---- print: the notice alone, without the site chrome ------------------------------------------- */
@media print {
  .dvh-header, .dvh-footer, .dvh-cookie, .dvh-agegate, .dvh-skip, .pg-confidentialitate-toc, .pg-confidentialitate-act, .pg-confidentialitate-cta__actions .dvh-btn { display: none !important; }
  .pg-confidentialitate-doc { display: block; padding-block: 0; }
  .pg-confidentialitate-cta { padding-block: var(--sp-6); background: none; }
  .pg-confidentialitate-sec h2 { margin-left: 0; break-after: avoid; }
  .pg-confidentialitate-items > li, .pg-confidentialitate-rights > li, .pg-confidentialitate-cookies > li { break-inside: avoid; }
}
