/* Zajednički izgled pratećih stranica (o projektu, politika privatnosti,
   uslovi korištenja). Iste boje i isti znak kao odredišna stranica, ali
   bez ijednog pokreta: ovo su dokumenti koji se čitaju, ne prezentacija.
   Jedan fajl za tri stranice — pravni tekst se mijenja, izgled ne. */

:root{
  --bg:#171210;
  --bg-lamp:#261b11;
  --ink:#F2ECE2;
  --sec:#C4B4A0;
  --amber:#E5A659;
  --amber-hi:#EDB26C;
  --line:#3A2F26;
  --tiho:#8C7C6B;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip;scroll-behavior:smooth}
body{
  background:
    radial-gradient(1100px 780px at 86% 72%, var(--bg-lamp), rgba(38,27,17,0) 68%),
    var(--bg);
  background-attachment:fixed;
  color:var(--sec);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  min-height:100svh;
  display:flex;flex-direction:column;
}
a{color:var(--amber)}
a:hover{color:var(--amber-hi)}
:is(a,button):focus-visible{outline:2px solid var(--amber);outline-offset:4px;border-radius:4px}

/* ---------- zaglavlje ---------- */
.vrh{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;
  padding:clamp(20px,3.5vw,52px) clamp(20px,3.5vw,52px) 0;
}
/* Ista mjera znaka kao na odredišnoj stranici: crtež nosi prozirni rub,
   pa ga lijeva margina poništava, a pomak naviše vraća šoljicu u sredinu
   reda. Vrijednosti su prepisane, ne izmišljene. */
.marka{
  display:flex;align-items:center;gap:.1625em;
  font-size:1.15rem;font-weight:650;letter-spacing:.005em;
  color:var(--ink);text-decoration:none;
}
.marka-znak{
  flex:none;width:2.85em;height:2.85em;object-fit:contain;
  margin-left:-.4175em;transform:translateY(-2.345%);
}
.marka-rijec{transform:translateY(.28em)}
.nazad{font-size:.92rem;text-decoration:none}
.nazad:hover{text-decoration:underline}

/* ---------- tijelo dokumenta ---------- */
.dokument{
  flex:1;
  width:100%;max-width:52rem;
  margin:0 auto;
  padding:clamp(2rem,6vw,4rem) clamp(20px,3.5vw,52px) clamp(3rem,8vw,5rem);
}
.nadnaslov{
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--amber);font-weight:600;margin-bottom:1rem;
}
.dokument h1{
  font-size:clamp(2rem,4.6vw,3rem);
  line-height:1.14;letter-spacing:-.02em;
  color:var(--ink);font-weight:700;
  margin-bottom:1.5rem;text-wrap:balance;
}
.dokument h2{
  font-size:clamp(1.2rem,2.4vw,1.5rem);
  line-height:1.25;letter-spacing:-.01em;
  color:var(--ink);font-weight:700;
  margin:2.75rem 0 .9rem;
}
.dokument h3{
  font-size:1.02rem;line-height:1.35;
  color:var(--ink);font-weight:650;
  margin:1.75rem 0 .6rem;
}
.dokument p{margin-bottom:1rem}
.dokument strong{color:var(--ink);font-weight:650}
.dokument ul,.dokument ol{margin:0 0 1rem 1.35rem}
.dokument li{margin-bottom:.45rem}
.dokument li::marker{color:var(--tiho)}
.dokument hr{
  border:0;border-top:1px solid var(--line);
  margin:2.5rem 0;
}

/* ---------- meta zaglavlje dokumenta ---------- */
.zaglavlje{
  border:1px solid var(--line);border-radius:14px;
  padding:1.1rem 1.25rem;
  margin-bottom:2rem;
  font-size:.94rem;
  display:grid;gap:.55rem .9rem;
  grid-template-columns:auto 1fr;
}
.zaglavlje dt{color:var(--tiho)}
.zaglavlje dd{color:var(--ink)}

/* Nepopunjeno polje iz nacrta. Namjerno je vidljivo kao rupa: kad bi
   izgledalo kao običan tekst, nacrt bi se mogao objaviti kao gotov. */
.polje{
  display:inline-block;
  padding:.05em .45em;
  border:1px dashed var(--amber);border-radius:5px;
  color:var(--amber);
  font-size:.92em;
  white-space:nowrap;
}

/* ---------- napomena o nacrtu ---------- */
.nacrt{
  border:1px solid var(--amber);
  border-left-width:4px;
  border-radius:10px;
  padding:1rem 1.15rem;
  margin-bottom:2rem;
  font-size:.94rem;
  background:rgba(229,166,89,.06);
}
.nacrt strong{color:var(--amber)}
.zavrsna-napomena{
  font-size:.9rem;font-style:italic;
  color:var(--tiho);
}

/* ---------- tabela ---------- */
.tabela-okvir{overflow-x:auto;margin-bottom:1.25rem}
.dokument table{
  border-collapse:collapse;
  width:100%;min-width:34rem;
  font-size:.94rem;
}
.dokument th,.dokument td{
  border:1px solid var(--line);
  padding:.6rem .8rem;
  text-align:left;
  vertical-align:top;
}
.dokument th{color:var(--ink);font-weight:650;background:rgba(255,255,255,.03)}

/* ---------- podnožje ---------- */
footer{
  border-top:1px solid var(--line);
  padding:2rem clamp(1.25rem,4vw,3rem) 3rem;
  text-align:center;
  font-size:.88rem;
  background:var(--bg);
}
/* Razmaknica je element, a ne znak u tekstu: tako se red lomi između
   stavki, a tačka nikad ne ostane sama na početku novog reda. */
.veze{
  display:flex;flex-wrap:wrap;
  align-items:center;justify-content:center;
  gap:.25rem .6rem;
}
.veze .tacka{color:var(--tiho)}
.veze a{text-decoration:none}
.veze a:hover{text-decoration:underline}
/* Ispod ~525 px red se lomi u dva. Tada tačke smetaju — jedna ostane visjeti
   na kraju prvog reda. Bez njih su stavke razdvojene razmakom, a veze i
   ionako nose drugu boju od godine. */
@media (max-width:540px){
  .veze{gap:.3rem 1rem}
  .veze .tacka{display:none}
}
