/* ============================================================
   stil.css — dijeljeni izgled za podstranice (o-nama.html, usluge.html)
   index.html ima svoj kompletan CSS ugrađen (kolaž/chat su prezahtjevni
   da bi ih vrijedilo dijeliti) — ova datoteka postoji da podstranice
   izgledaju kao dio iste stranice, bez ponavljanja tog koda.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400;0,6..96,500;1,6..96,400&family=Archivo:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root{
  --noc:#100C08; --orah:#35230F; --orah-sv:#5E3F1E;
  --jantar:#D9993F; --jantar-sv:#F3CB8C; --mjed:#A8834E;
  --lan:#EFE5D2; --lan-sj:#E2D3B6; --tinta:#1D1610;
  --f-disp:'Bodoni Moda',Georgia,serif; --f-body:'Archivo',system-ui,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:linear-gradient(168deg,#241708,#160E06 55%,#0D0805);
  background-attachment:fixed;
  color:var(--lan);font-family:var(--f-body);font-size:16px;line-height:1.6;
}
a{color:inherit}
:focus-visible{outline:2px solid var(--jantar);outline-offset:3px}

.traka{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:20px clamp(16px,4vw,42px);
  border-bottom:1px solid rgba(168,131,78,.18);
}
.znak{font-family:var(--f-disp);font-size:1.15rem;color:var(--lan);white-space:nowrap;text-decoration:none}
.znak em{font-style:italic;color:var(--jantar-sv)}
.traka nav{display:flex;gap:22px}
.traka nav a{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#C9B698;text-decoration:none}
.traka nav a:hover{color:var(--jantar-sv)}
@media(max-width:700px){.traka nav{gap:14px}}

.sadrzaj{max-width:760px;margin:0 auto;padding:clamp(40px,7vw,84px) clamp(18px,6vw,32px) 100px}
.oko{font-family:var(--f-mono);font-size:.63rem;letter-spacing:.2em;text-transform:uppercase;color:var(--jantar);margin-bottom:12px}
.sadrzaj h1{font-family:var(--f-disp);font-weight:400;font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.16;color:#FBF4E7;margin-bottom:28px}
.sadrzaj h1 em{font-style:italic;color:var(--jantar-sv)}
.sadrzaj h2{font-family:var(--f-disp);font-weight:400;font-size:clamp(1.25rem,2.6vw,1.7rem);color:#F3CB8C;margin:44px 0 14px}
.sadrzaj h3{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--jantar);margin:30px 0 10px}
.sadrzaj p{color:#D8C7A8;margin-bottom:16px;max-width:66ch}
.sadrzaj p.vodeci{font-size:1.08rem;color:#EFE5D2}
.sadrzaj ul{margin:0 0 16px 20px;color:#D8C7A8}
.sadrzaj li{margin-bottom:6px}
.sadrzaj strong{color:#F3CB8C;font-weight:600}

.natrag{display:inline-flex;align-items:center;gap:6px;margin-bottom:30px;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.06em;color:#C9B698;text-decoration:none}
.natrag:hover{color:var(--jantar-sv)}

.trazi-chat{
  margin-top:52px;padding:24px 26px;border-left:2px solid var(--jantar);
  background:rgba(217,153,63,.06);
}
.trazi-chat p{margin-bottom:14px;color:#D8C7A8}
.gumb{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border:0;border-radius:2px;background:var(--jantar);color:#241609;font-weight:600;font-size:.9rem;text-decoration:none;transition:.15s}
.gumb:hover{background:var(--jantar-sv)}

footer{
  padding:26px clamp(18px,6vw,64px) 34px;background:#0B0704;
  border-top:1px solid rgba(168,131,78,.16);
  display:flex;flex-wrap:wrap;gap:12px 26px;justify-content:space-between;align-items:center;
  font-family:var(--f-mono);font-size:.62rem;color:#6E5C44;
}
footer a{color:#8B765A;text-decoration:none}
footer a:hover{color:var(--jantar)}