﻿:root{
  --bg:#f9f8f3;        /* svijetla pergament podloga */
  --ink:#2c2926;       /* tamna tipografija */
  --muted:#6d665e;     /* sekundarni ton */
  --accent:#1f3d2c;    /* duboka zelena (glavna boja) */
  --gold:#c9a646;      /* zlatna (naglasci) */
  --radius:10px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.65;
  color:var(--ink);
  background:var(--bg);
}

.container{max-width:880px;margin:0 auto;padding:20px}
.container.narrow{max-width:720px}
.container.center{text-align:center}
.small{font-size:.9rem;color:var(--muted)}

.site-header{
  position:sticky; top:0; z-index:10;
  background:rgba(249,248,243,.95);
  backdrop-filter:saturate(120%) blur(6px);
  border-bottom:1px solid #e4dccf;
}
.brand{
  font-family:"Marcellus",serif;
  font-size:1.2rem;
  color:var(--accent);
  text-decoration:none;
}
.nav a{
  margin-left:16px;
  color:var(--ink);
  text-decoration:none;
  padding-bottom:3px;
}
.nav a[aria-current="page"]{
  border-bottom:2px solid var(--gold);
}

.hero{padding:64px 0; text-align:center}
.hero h1{
  font-family:"Marcellus",serif;
  font-size:2.4rem;
  margin:0 0 12px;
  color:var(--accent);
}
.lead{
  font-size:1.125rem;
  color:var(--muted);
  margin:0 auto 24px;
  max-width:48ch;
}

h1,h2,h3{
  font-family:"Marcellus",serif;
  color:var(--accent);
}
h1{font-size:2rem; margin:18px 0}
h2{font-size:1.35rem; margin:8px 0 4px}
h3{font-size:1.15rem; margin:18px 0 8px}

p{margin:10px 0 14px}
em{color:var(--muted)}

.btn, button{
  display:inline-block;
  padding:14px 18px;
  border-radius:var(--radius);
  border:0;
  background:var(--accent);
  color:#fff;
  font-weight:600;
  text-decoration:none;
  cursor:pointer;
  transition:.15s ease-in-out;
}
.btn:hover, button:hover{
  background:var(--gold);
  color:var(--ink);
  transform:translateY(-1px);
}
.btn:active, button:active{transform:translateY(0)}

.card{
  background:#fff;
  border:1px solid #e6e0d5;
  border-radius:var(--radius);
  padding:22px;
  margin:24px 0;
}

.site-footer{
  border-top:1px solid #e4dccf;
  margin-top:48px;
  padding:16px 0;
  font-size:.9rem;
  color:var(--muted);
  text-align:center;
}
