/* Futura (isti web font kao na produkciji: Elementor custom font) */
@font-face{font-family:"Futura";font-style:normal;font-weight:300;font-display:swap;src:url("/assets/fonts/futura-300.woff") format("woff")}
@font-face{font-family:"Futura";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/futura-400.woff") format("woff")}
@font-face{font-family:"Futura";font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/futura-600.woff") format("woff")}

/* GNP 2026 – statički sajt. Boje i tipografija prate Elementor kit sa produkcije. */
:root{
  --primary:#004177; --white:#fff; --text:#71777C; --dark:#1A1A1A; --grey:#D7D9DB;
  --orange:#F06E46; --orange-light:#E3835B; --bar:#5A5A5A;
  --font:"Futura","Futura PT","Century Gothic","Jost","Avenir Next",Avenir,"Segoe UI",sans-serif;
  --wrap:1140px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-weight:400;font-size:16px;line-height:1.8;color:var(--text);background:var(--white)}
img{max-width:100%;height:auto;display:block}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--font);margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Header */
.site-header{background:var(--white)}
.header-grid{display:grid;grid-template-columns:20% 1fr 10% 10%;align-items:center;gap:10px;min-height:110px}
.header-grid a{display:flex;align-items:center;justify-content:center}
.header-grid a:hover{text-decoration:none}
.logo img{max-height:70px;width:auto}
.logo-ucg img{max-height:80px;width:auto}
.logo-gf img{max-height:78px;width:auto}
@media (max-width:767px){
  .header-grid{grid-template-columns:40% 1fr 20% 20%;min-height:80px}
  .logo img{max-height:44px}.logo-ucg img,.logo-gf img{max-height:56px}
}

/* Hero + navigacija */
.hero{color:var(--white);position:relative}
.hero--page{background:linear-gradient(90deg,var(--orange) 50%,var(--orange-light) 100%)}
.hero--home{background:var(--bar)}
.nav{position:relative;display:flex;justify-content:center;align-items:center;min-height:57px;max-width:none;padding:0 20px}
.menu,.menu ul{list-style:none;margin:0;padding:0}
.menu{display:flex;flex-wrap:wrap;justify-content:center}
.menu li{position:relative}
.menu a{display:block;padding:8px 14px;color:var(--white);font-size:14px;line-height:1.4;white-space:nowrap}
.menu a:hover,.menu a:focus{text-decoration:none;color:var(--white)}
.menu li.current>a{text-decoration:underline;text-underline-offset:4px}
.menu ul{position:absolute;top:100%;left:0;min-width:230px;background:var(--orange);border:1px solid var(--grey);z-index:20;display:none}
.hero--home .menu ul{background:var(--bar)}
.menu ul ul{top:0;left:100%}
.menu ul a{padding:10px 20px;font-size:13px;color:var(--white)}
.menu ul a:hover,.menu ul a:focus{background:var(--white);color:var(--orange)}
.menu li:hover>ul,.menu li:focus-within>ul{display:block}
.menu .has-sub>a::after{content:"";display:inline-block;margin-left:6px;border:4px solid transparent;border-top-color:currentColor;vertical-align:1px}
.nav-toggle{display:none;background:var(--white);color:var(--orange);border:0;width:44px;height:40px;border-radius:2px;cursor:pointer;padding:0;margin-left:auto}
.hero--home .nav-toggle{color:var(--bar)}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{display:block;width:22px;height:3px;background:currentColor;position:relative;margin:0 auto;border-radius:2px}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0}
.nav-toggle span::before{top:-7px}.nav-toggle span::after{top:7px}
.hero-rule{border:0;border-top:1px solid var(--white);margin:0 0 0;opacity:.9}
.hero-title{font-size:60px;font-weight:300;text-align:center;padding:30px 20px 50px;line-height:1.1;color:var(--white)}
@media (max-width:1024px){
  .nav{justify-content:flex-end;min-height:61px;padding-right:20px}
  .nav-toggle{display:block}
  .menu{display:none;position:absolute;top:100%;right:0;left:0;flex-direction:column;background:var(--orange);border-top:1px solid var(--grey);z-index:30}
  .hero--home .menu{background:var(--bar)}
  .nav.open .menu{display:flex}
  .menu a{padding:12px 20px;white-space:normal}
  .menu ul,.menu ul ul{position:static;display:none;min-width:0;border:0;border-left:3px solid rgba(255,255,255,.35)}
  .menu li.open>ul{display:block}
  .menu li:hover>ul{display:none}.menu li.open:hover>ul{display:block}
  .menu ul a{padding-left:34px}.menu ul ul a{padding-left:50px}
  .hero-rule{display:none}
  .hero-title{padding:0 20px 50px}
}
@media (max-width:767px){.hero-title{font-size:34px}}

/* Naslovna – velika slika */
.home-visual{display:flex;justify-content:center;align-items:center;min-height:800px;background:var(--white)}
.home-visual img{max-height:800px;width:auto;max-width:100%;object-fit:contain}
/* Tablet i telefon: slika od ivice do ivice, visina po proporciji slike */
@media (max-width:1024px){.home-visual{display:block;min-height:0}.home-visual picture,.home-visual img{display:block;width:100%;max-width:none;max-height:none;height:auto}}

/* Sadržaj */
.content{padding:0 20px 40px}
.block{margin:50px 0 0}
.cols{display:grid;gap:20px}
.cols--2{grid-template-columns:1fr 1fr}
.cols--3{grid-template-columns:repeat(3,1fr)}
.col--bottom{align-self:end}.col--center{align-self:center}
@media (max-width:767px){.cols--2,.cols--3{grid-template-columns:1fr}}
.h2{font-size:20px;font-weight:600;color:var(--dark);line-height:1.3;margin:0 0 20px}
.h2--light{font-weight:400}
.h2--center{text-align:center}
.h2--lg{font-size:23px}
.rule{border:0;border-top:1px solid var(--grey);margin:0 0 20px}
.text{margin:0 0 20px}
.text p{margin:0 0 1em}.text p:last-child{margin-bottom:0}
.text--justify{text-align:justify}.text--center{text-align:center}
.text ul{padding-left:22px}
.text img{display:inline-block}
.html{margin:0 0 20px;overflow-x:auto}
.btn{display:inline-block;font-family:var(--font);font-size:14px;line-height:1;padding:14px 26px;border-radius:2px;border:1px solid transparent;text-transform:uppercase;letter-spacing:.3px}
.btn:hover{text-decoration:none;opacity:.9}
.btn--primary{background:var(--orange);color:var(--white)}
.btn--secondary{background:var(--orange-light);color:var(--white)}
.btn--outline{background:transparent;color:var(--dark);border-color:var(--dark)}
.btn--outline:hover{background:var(--dark);color:var(--white);opacity:1}
.btn-wrap{margin:0 0 20px}
.image{margin:0 0 20px}
.map{margin:0 0 20px}.map iframe{width:100%;height:400px;border:0;display:block}

/* Galerija – karusel */
.carousel{position:relative;margin:0 0 40px}
.carousel-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;gap:0;scrollbar-width:none}
.carousel-track::-webkit-scrollbar{display:none}
.carousel-track figure{flex:0 0 100%;margin:0;scroll-snap-align:start;display:flex;justify-content:center;background:#f4f4f4}
.carousel-track img{max-height:520px;width:auto;object-fit:contain}
.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.carousel-btn:hover{background:rgba(0,0,0,.7)}
.carousel-btn--prev{left:10px}.carousel-btn--next{right:10px}
.carousel-dots{display:flex;justify-content:center;gap:6px;margin-top:10px;flex-wrap:wrap}
.carousel-dots button{width:8px;height:8px;border-radius:50%;border:0;background:var(--grey);padding:0;cursor:pointer}
.carousel-dots button.active{background:var(--orange)}

/* Social ikonice */
.social{display:flex;gap:5px}
.social a{width:34px;height:34px;border-radius:50%;background:var(--orange);color:var(--white);display:flex;align-items:center;justify-content:center;transition:transform .2s}
.social a:hover{transform:scale(1.1);text-decoration:none}
.social svg{width:17px;height:17px;fill:currentColor}

/* Footer */
.site-footer{background:linear-gradient(90deg,var(--orange) 17%,var(--orange-light) 100%);min-height:50px;display:flex;align-items:center;margin-top:20px}
.site-footer .wrap{width:100%;display:flex;justify-content:flex-end;padding-right:50px}
.site-footer .social a{background:var(--white);color:var(--orange)}
@media (max-width:767px){.site-footer .wrap{padding-right:40px}}
