:root{--bg:#f1f7f3;--card:#ffffff;--text:#0f2e1f;--muted:#4d6b5c;--accent:#2e7d32;--accent2:#1b5e20}
*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Noto Sans',sans-serif;color:var(--text);background:var(--bg)}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:24px}
.nav{display:flex;align-items:center;gap:16px;justify-content:space-between;padding:12px 24px;background:#e9f3ec;position:sticky;top:0;border-bottom:1px solid #dce7df}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:20px;color:var(--text);text-decoration:none}
.brand img{width:36px;height:36px;object-fit:contain;border-radius:6px}
.navlinks{display:flex;gap:16px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--accent);color:#fff;padding:10px 16px;border-radius:10px;border:none;cursor:pointer;font-weight:600}
.btn:hover{background:var(--accent2)}
.hero{display:grid;grid-template-columns:1.1fr 0.9fr;gap:28px;align-items:center;padding:40px 0}
@media(max-width:900px){.hero{grid-template-columns:1fr}}
.card{background:var(--card);padding:18px;border-radius:16px;box-shadow:0 6px 18px rgba(10,30,25,.08)}
.h2{font-size:38px;line-height:1.12;margin:0 0 12px}.muted{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media(max-width:800px){.grid{grid-template-columns:1fr}}
.input,textarea{width:100%;padding:12px 14px;border:1px solid #cddbd1;border-radius:12px;background:#fff}
textarea{min-height:120px;resize:vertical}
.badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.badge{background:#dff1e5;color:#0b3a23;padding:8px 12px;border-radius:999px;font-size:14px}
.footer{padding:28px;text-align:center;color:var(--muted)}
.embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:16px;background:#000}
.embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}



/* ========== EKO VANJA — Dark Forest tema ========== */
:root{
  --bg-dark:#0b1d14;
  --bg-darker:#08130f;
  --ink:#e6f2ea;
  --muted:#cfe3d6;
  --accent:#6bd08c;
  --card:#133024;
  --shadow: 0 16px 36px rgba(0,0,0,.45);
}

html,body{background: var(--bg-darker); color: var(--ink);}

/* HERO */
.hero{
  position: relative;
  min-height: clamp(340px, 70vh, 640px);
  display: grid;
  place-items: center;
  background:
    radial-gradient(1200px 60% at 50% 10%, rgba(107,208,140,.12), transparent 70%),
    linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.65)),
    url('hero.jpg') center/cover no-repeat;
}
.hero__overlay{
  position:absolute; inset:0;
  background: radial-gradient(800px 50% at 50% 0%, rgba(107,208,140,.20), transparent 60%);
  pointer-events:none;
}
.hero__inner{
  position: relative; text-align:center; padding: 0 16px;
}
.brand{
  font-family: 'Georgia', serif;
  font-size: clamp(36px, 8vw, 72px);
  font-weight: 800;
  letter-spacing: 2px;
  text-shadow: 0 6px 24px rgba(0,0,0,.55);
}
.tagline{
  margin-top: 8px;
  font-size: clamp(16px, 2.2vw, 22px);
  color: var(--muted);
}
.btn-cta{
  display:inline-block;
  margin-top: 18px;
  padding: 12px 20px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.15);
  background: linear-gradient(180deg, rgba(107,208,140,.15), rgba(107,208,140,.05));
  color: var(--ink); text-decoration:none;
  backdrop-filter: blur(4px);
  transition: transform .15s ease, background .2s ease;
}
.btn-cta:hover{ transform: translateY(-2px); background: rgba(107,208,140,.22); }

/* Sekcija O inicijativi */
.section-inicijativa{
  background: linear-gradient(180deg, rgba(11,29,20,.0), rgba(11,29,20,.35));
  padding: clamp(36px, 5vw, 72px) 20px;
  color: var(--ink);
}
.inicijativa-wrap{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(18px, 3vw, 36px);
  align-items: center;
}
.inicijativa-media{
  background: var(--card);
  border-radius: 18px;
  padding: clamp(10px, 2vw, 16px);
  box-shadow: var(--shadow);
}
.inicijativa-media img{
  width: 100%;
  height: clamp(260px, 36vw, 420px);
  object-fit: cover;
  border-radius: 12px;
  display: block;
  filter: saturate(.95) contrast(1.06) brightness(.98);
}
.inicijativa-content h2{
  font-size: clamp(28px, 4vw, 40px);
  margin: 0 0 8px;
  color: var(--ink);
  letter-spacing:.5px;
}
.inicijativa-content .underline{
  width: 90px; height: 4px; background: var(--accent);
  border-radius: 6px; margin: 8px 0 18px;
}
.inicijativa-content h3{
  font-size: clamp(22px, 3vw, 28px);
  color: var(--accent); margin: 8px 0 12px;
}
.inicijativa-content p{
  line-height: 1.7; margin: 0 0 14px; color: #d7e6dd;
}
@media (max-width: 860px){
  .inicijativa-wrap{ grid-template-columns: 1fr; }
  .inicijativa-media{ order: -1; }
}
/* ========== /EKO VANJA Dark Forest ========== */


/* Social cards */
.social-grid{
  margin-top:14px;
  display:grid;
  grid-template-columns: repeat(4, minmax(120px,1fr));
  gap:14px;
}
@media (max-width: 720px){
  .social-grid{ grid-template-columns: repeat(2, minmax(140px,1fr)); }
}
.social-card{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; padding:16px 12px; border-radius:16px;
  background:#10192214; text-decoration:none; color:#1b291b;
  border:1px solid #dfe7df; transition:transform .15s ease, box-shadow .15s ease, background .2s ease;
}
.social-card:hover{ transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.08); background:#ffffffcf; }
.social-card .label{ font-weight:600; font-size:.98rem }
.social-card .icon{ display:grid; place-items:center }
.social-card.tiktok{ color:#111 }
.social-card.instagram{ color:#b43a8f }
.social-card.youtube{ color:#d62828 }
.social-card.email{ color:#2a6f97 }

/* smaller social grid under contact */
.social-grid.small{margin-top:8px; gap:12px; grid-template-columns:repeat(3, minmax(160px,1fr));}
@media (max-width: 720px){ .social-grid.small{ grid-template-columns: repeat(2, minmax(140px,1fr)); } }
.social-grid.small .social-card{ padding:10px 8px; border-radius:14px; }
.social-grid.small .social-card .icon svg{ width: 22px; height: 22px; }
.social-card.facebook{ color:#1a73e8 }
.social-card.linkedin{ color:#0a66c2 }
.social-card.x{ color:#111 }
.kontakt-form .row.two{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.kontakt-form textarea, .kontakt-form input{ width:100%; padding:12px 14px; border-radius:10px; border:1px solid #dfe7df; }
.kontakt-form .btn{ margin-top:12px; padding:10px 16px; border-radius:10px; background:#2f7a3e; color:#fff; border:none; cursor:pointer; }
.kontakt-form .btn:hover{ filter:brightness(1.05); }
@media (max-width:720px){ .kontakt-form .row.two{ grid-template-columns:1fr; } }

/* Force smaller social icons and labels */
.social-grid .social-card .icon svg { width: 18px !important; height: 18px !important; }
.social-grid.small .social-card .icon svg { width: 18px !important; height: 18px !important; }
.social-grid.small .social-card { padding: 8px 8px !important; }
.social-grid.small .label { font-size: 0.85rem !important; }


.aspect-video{position:relative;width:100%;padding-top:56.25%;}
.aspect-video iframe{position:absolute;inset:0;width:100%;height:100%;}
