/* ===============================
   POLITIKA KOLAČIĆA
   =============================== */

:root{
  --brand:#7f1d1d;
  --brand-600:#991b1b;
  --text:#111827;
  --muted:#6b7280;
  --card:#ffffff;
  --line:#e5e7eb;
  --bg:#f8fafc;
  --radius-lg:16px;
  --shadow-md:0 10px 24px rgba(0,0,0,.10);
}

/* Page */
.ck-page{ background:var(--bg); color:var(--text); }

/* HERO */
.ck-hero{ position:relative; color:#fff; padding:64px 0 72px; overflow:hidden; }
.ck-hero__overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.35)); }
.ck-hero__content{ position:relative; z-index:1; text-align:center; max-width:1000px; }
.ck-hero h1{ font-size:clamp(28px,4vw,40px); line-height:1.1; margin-bottom:12px; }
.ck-hero p{ font-size:clamp(15px,2.2vw,18px); opacity:.95; }
.ck-hero__meta{ margin-top:14px; font-size:14px; opacity:.9; }

/* CONTENT */
.ck-content{ padding:48px 0 80px; }
.ck-grid{ display:grid; grid-template-columns:280px 1fr; gap:32px; }

/* TOC */
.ck-toc{
  position:sticky; top:96px; align-self:start;
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:16px 18px; box-shadow:var(--shadow-md);
}
.ck-toc__title{ font-size:16px; margin:2px 0 10px; color:var(--brand); }
.ck-toc ol{ list-style:none; padding:0; margin:0; counter-reset:toc; }
.ck-toc li{ counter-increment:toc; margin:6px 0; }
.ck-toc a{
  display:block; padding:6px 8px; text-decoration:none; color:var(--text);
  border-radius:10px; transition:background .18s ease, color .18s ease;
}
.ck-toc a::before{ content:counter(toc) ". "; color:var(--muted); }
.ck-toc a:hover{ background:#fafafa; color:var(--brand); }

/* ARTICLE */
.ck-article{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md); padding:28px;
}
.ck-section + .ck-section{ margin-top:28px; }
.ck-section h2{ font-size:22px; line-height:1.25; margin-bottom:10px; color:var(--brand-600); }
.ck-section h3{ font-size:18px; margin:12px 0 6px; color:var(--brand); }
.ck-section p, .ck-section li{ font-size:16px; line-height:1.7; color:var(--text); }
.ck-section ul{ margin:10px 0 0 18px; }

/* Kontakt blok */
.ck-contact{
  display:grid; gap:6px; background:#f9fafb;
  border:1px dashed var(--line); border-radius:12px; padding:14px;
}
.ck-contact a{ color:var(--brand-600); text-decoration:none; }
.ck-contact a:hover{ text-decoration:underline; }

/* Tabela (details) */
.ck-table{ margin-top:12px; }
.ck-table summary{
  cursor:pointer; user-select:none; padding:8px 10px; border-radius:10px;
  background:#f3f4f6; border:1px solid var(--line);
}
.ck-table[open] summary{ background:#eef2f7; }
.ck-table__wrap{ overflow:auto; margin-top:10px; }
.ck-table table{ width:100%; border-collapse:collapse; min-width:700px; }
.ck-table th, .ck-table td{
  text-align:left; padding:10px 12px; border-bottom:1px solid var(--line);
  font-size:14px;
}
.ck-table th{ font-weight:600; color:#111827; }

/* Responsive */
@media (max-width:1024px){
  .ck-grid{ grid-template-columns:1fr; }
  .ck-toc{ position:relative; top:0; }
}
@media (max-width:480px){
  .ck-hero{ padding:48px 0 56px; }
  .ck-article{ padding:18px; }
  .ck-table table{ min-width:600px; }
}

:root { --header-offset: 96px; }
html { scroll-behavior: smooth; }

.ck-section { scroll-margin-top: var(--header-offset); }
