:root{
  --brand:#1fb8a5;
  --brand-600:#18a392;
  --ink:#122033;
  --muted:#6b7a8a;
  --bg:#f7f9fb;
}
*{box-sizing:border-box}
html,body{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  color:var(--ink)
}
.navbar .nav-link{padding:.5rem .75rem}
.navbar .btn{font-weight:600}
.hero{
  padding-top:6.5rem;
  padding-bottom:3rem;
  background:linear-gradient(180deg,#fff, var(--bg));
  min-height:80vh
}
.hero .brand{color:var(--brand)}
.section{padding:4rem 0}
.section.alt{background:var(--bg)}
.section-title{font-weight:700}
.icon-card{border:1px solid #e6ecf2;border-radius:1rem;padding:1rem;height:100%}
.icon-card i{font-size:1.5rem;color:var(--brand)}
.icon-card .ic-title{font-weight:600}
.feature{background:#fff;border:1px solid #e6ecf2}
.program{background:#fff;border:1px solid #e6ecf2}
.btn-primary{background:var(--brand);border-color:var(--brand)}
.btn-primary:hover{background:var(--brand-600);border-color:var(--brand-600)}
footer a{color:var(--muted)}
.hero-img{max-height:420px;object-fit:cover}

/* Navbar shrink on scroll */
.navbar.is-scrolled{box-shadow:0 .25rem .75rem rgba(16,24,40,.08)}

/* Tables (NEW) */
.table td, .table th{vertical-align:middle}

@media (max-width: 991.98px){
  .hero{min-height:unset}
}
.brand-logo{
  width:32px; height:32px; object-fit:contain;
}
@media (min-width: 992px){
  .brand-logo{ width:36px; height:36px; }
}
/* Za tamni hero/footer možeš koristiti bijelu varijantu */
.dark .brand-logo{ content: url("img/logo-white-128.png"); }


.reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease;}
.reveal.show{opacity:1; transform:none;}


.btn-ripple{position:relative; overflow:hidden;}
.btn-ripple span.r{position:absolute;border-radius:50%;transform:scale(0);
 background:rgba(255,255,255,.5);animation:rip .6s linear;}
@keyframes rip{to{transform:scale(12);opacity:0;}}


.hero-logo{
  width:64px; height:64px; object-fit:contain;
}
@media (min-width: 992px){
  .hero-logo{ width:80px; height:80px; }
}














#galleryGrid .gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  background: #fff;
}
#galleryGrid .gallery-item img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
  transition: transform .25s ease;
}
#galleryGrid .gallery-item:hover img {
  transform: scale(1.03);
}
#lightbox::backdrop {
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(2px);
}



#o-meni .col-lg-5 img {
  max-width: 100%;
  height: auto;
  display: block;
}