/*
 * Site — Privacy Policy page.
 *
 * Loaded on is_page_template('page-privacy-policy.php') via
 * `site-page-privacy` handle in theme/inc/60-enqueue.php.
 * Template: page-privacy-policy.php.
 *
 * Two-column reading layout: section headings on the left, body
 * paragraphs on the right — same vocabulary as logo-block /
 * mentions-block on the project detail. Collapses to a single
 * column on tablet and mobile.
 */

.page-header { padding-bottom: 24px; }

.privacy-intro {
  padding: 36px var(--gutter) calc(60px * var(--scale));
  display: grid; grid-template-columns: 220px 1fr; gap: 60px; align-items: start;
  border-bottom: 1px solid var(--rule);
}
.privacy-intro .meta {
  display: flex; flex-direction: column; gap: 4px;
}
.privacy-intro .meta .label {
  font-size: calc(13px * var(--read-scale));
  color: var(--accent); letter-spacing: 0.06em; font-weight: 500;
  text-transform: uppercase;
}
.privacy-intro .meta .date {
  font-size: calc(14px * var(--read-scale));
  color: var(--ink-dim); font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.privacy-intro .lead {
  font-size: calc(20px * var(--read-scale)); line-height: 1.55;
  color: var(--ink); max-width: 720px;
  text-wrap: pretty;
}

.privacy-sections {
  padding: calc(40px * var(--scale)) var(--gutter) calc(100px * var(--scale));
  display: flex; flex-direction: column;
}
/* Zploštěná HTML struktura (num + title + body jako 3 přímé děti
   <section>). Single grid s `align-items: start` zařídí, že top hrany
   všech 3 box-elementů začínají na stejné horizontální lince.
   `line-height: 1` na .num/.title zruší font leading → top of text =
   top of box, takže navzdory různým font-sizes mají texty stejný
   start-y v pixelech.
   Title kolona zúžena (1.2fr), body rozšířen (6fr), gap 24px —
   title sedí těsně vedle num, body má víc šířky pro odstavce. */
.privacy-section {
  display: grid;
  /* Title sloupec rozšířen na 2.4fr (cca 2× původní 1.2fr) — uživatelská
     žádost. Body zůstává 6fr; gap stejný; sekce dál respektuje page
     gutter dědicí z .privacy-sections wrapperu. */
  grid-template-columns: 60px minmax(0, 2.4fr) minmax(0, 6fr);
  gap: 0 24px;
  padding: calc(40px * var(--scale)) 0;
  border-bottom: 1px solid var(--rule);
  align-items: start;
}
.privacy-section:last-child { border-bottom: 0; }
.privacy-section .num {
  font-size: calc(13px * var(--read-scale));
  color: var(--ink-mute); letter-spacing: 0.06em; font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.privacy-section .title {
  font-size: calc(22px * var(--read-scale)); font-weight: 500;
  letter-spacing: -0.015em; color: var(--ink);
  line-height: 1;
  text-wrap: balance;
  margin: 0;
}
.privacy-section .body {
  display: flex; flex-direction: column; gap: 18px;
  /* max-width odebrán — body se táhne na celou šířku svého 6fr sloupce,
     takže obsah dosahuje až k pravému page gutteru (žádná mrtvá mezera). */
}
.privacy-section .body > :first-child { margin-top: 0; }
.privacy-section .body p {
  font-size: calc(16px * var(--read-scale)); line-height: 1.7;
  color: var(--ink); text-wrap: pretty;
  text-align: justify; hyphens: auto;
  margin: 0;
}

/* ─── Tablet (769–1024px) — stack num+title nahoře, body pod tím */
@media (min-width: 769px) and (max-width: 1024px) {
  .privacy-intro {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .privacy-section {
    grid-template-areas:
      'num title'
      'body body';
    grid-template-columns: 60px 1fr;
    gap: 8px 16px;
  }
  .privacy-section .num   { grid-area: num; }
  .privacy-section .title { grid-area: title; }
  .privacy-section .body  { grid-area: body; margin-top: 12px; }
}

/* ─── Mobile (≤768px) ─────────────────────────────────────── */
@media (max-width: 768px) {
  .privacy-intro {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px var(--gutter) 32px;
  }
  .privacy-intro .lead { font-size: 16px; line-height: 1.55; }

  .privacy-sections {
    padding: 32px var(--gutter) 60px;
  }
  .privacy-section {
    grid-template-areas:
      'num title'
      'body body';
    grid-template-columns: 44px 1fr;
    gap: 8px 12px;
    padding: 28px 0;
  }
  .privacy-section .num   { grid-area: num; }
  .privacy-section .title { grid-area: title; font-size: 19px; }
  .privacy-section .body  { grid-area: body; margin-top: 12px; }
  .privacy-section .body p {
    font-size: 15px; line-height: 1.65;
  }
}

/* ═══ v1.5.0 — Jednotná typografie ═══ */
.privacy-intro .lead,
.privacy-section .body p { font-size: var(--fs-text); }
.privacy-intro .meta .label,
.privacy-intro .meta .date,
.privacy-section .num { font-size: var(--fs-label); }
@media (max-width: 768px) {
  .privacy-intro .lead, .privacy-section .body p { font-size: var(--fs-text); }
}

/* ═══ v1.5.1 — Zásady cookies (page-cookie-policy.php, obsah z Complianz) ═══
   Stejný vzhled jako Zásady ochrany OÚ. Complianz vypisuje „plochý“ HTML
   (h2 / h3 / p / ul / details / table za sebou), proto na PC: nadpis sekce
   (h2) plave v levém sloupci, text teče v pravém sloupci; nad každým h2
   oddělovací linka. Tablet / mobil: pod sebou. */
.cookie-policy { padding-top: calc(40px * var(--scale)); }
.cookie-doc,
.cookie-doc .cmplz-document {
  color: var(--ink);
  font-size: var(--fs-text); line-height: 1.7;
  max-width: none;
}
.cookie-doc .cmplz-document { margin: 0; padding: 0; }
.cookie-doc p,
.cookie-doc li {
  font-size: var(--fs-text); line-height: 1.7; color: var(--ink);
  text-align: justify; hyphens: auto; text-wrap: pretty;
  margin: 0 0 18px;
}
.cookie-doc ul, .cookie-doc ol { padding-left: 1.2em; margin: 0 0 18px; }
.cookie-doc a { color: var(--accent); text-decoration: none; }
.cookie-doc a:hover { color: var(--ink); }
.cookie-doc h2 {
  position: relative;
  font-size: calc(22px * var(--read-scale)); font-weight: 500;
  letter-spacing: -0.015em; line-height: 1.15; color: var(--ink);
  text-wrap: balance;
  margin: 0; padding: calc(40px * var(--scale)) 0 18px;
}
.cookie-doc h2::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: calc(100vw - 2 * var(--gutter)); height: 1px;
  background: var(--rule);
}
.cookie-doc h2:first-of-type::before { display: none; }
.cookie-doc h3,
.cookie-doc h4 {
  font-size: var(--fs-small); font-weight: 600; color: var(--ink);
  margin: 26px 0 10px; letter-spacing: 0;
}
.cookie-doc strong { font-weight: 600; }
/* Complianz „Spravujte souhlas“ + výpis cookies (details / summary / tabulky) */
.cookie-doc details {
  border: 1px solid var(--rule); border-radius: 8px;
  padding: 12px 16px; margin: 0 0 12px; background: var(--bg-2);
}
.cookie-doc summary { cursor: pointer; font-size: var(--fs-small); font-weight: 500; color: var(--ink); }
.cookie-doc details[open] summary { margin-bottom: 10px; }
.cookie-doc details p, .cookie-doc details li { font-size: var(--fs-small); text-align: left; }
.cookie-doc table { width: 100%; border-collapse: collapse; margin: 0 0 18px; font-size: var(--fs-small); }
.cookie-doc th, .cookie-doc td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--rule); vertical-align: top; }
.cookie-doc th { color: var(--ink-mute); font-weight: 500; font-size: var(--fs-label); }
.cookie-doc input, .cookie-doc select, .cookie-doc button { font: inherit; }

@media (min-width: 1025px) {
  /* Levý sloupec ≈ název sekce (jako .privacy-section .title), pravý = text. */
  .cookie-doc { padding-left: 32%; }
  .cookie-doc h2 {
    float: left; clear: left;
    width: 44.1%;            /* 30 % celkové šířky / 68 % obsahu */
    margin-left: -47.06%;    /* posun do levého sloupce (32 % / 68 %) */
    padding-right: 24px;
  }
  .cookie-doc h2::before { left: 0; }
  .cookie-doc h2 + * { padding-top: calc(40px * var(--scale)); }
  .cookie-doc h2:first-of-type + * { padding-top: calc(40px * var(--scale)); }
}

/* ═══ v1.5.4 — Zásady OÚ + cookies = písmo Štábu / Hrají ═══ */
.privacy-intro .lead,
.privacy-section .body p,
.privacy-section .body li,
.cookie-doc,
.cookie-doc .cmplz-document,
.cookie-doc p,
.cookie-doc li {
  font-size: var(--fs-text); font-weight: var(--text-weight);
  color: var(--text-color); line-height: var(--text-leading);
}
.privacy-section .body { gap: 14px; }
.cookie-doc p, .cookie-doc li { margin-bottom: 14px; }
@media (max-width: 768px) {
  .privacy-intro .lead, .privacy-section .body p { font-size: var(--fs-text); line-height: var(--text-leading); }
}