.logo{
display:block;
width:180px;
height:100px;
background:url('/assets/images/logo.png') no-repeat center center;
background-size:contain;
}



header nav a,
header nav a:link,
header nav a:visited{
color:white !important;
text-decoration:none !important;
margin-left:25px !important;
font-weight:bold !important;
transition:color .3s ease !important;
}

header nav a:hover,
header nav a:focus,
header nav a:active{
color:#ff00aa !important;
}

.footer-link{
display:block;
color:white;
text-decoration:none;
margin-bottom:12px;
transition:color .3s ease;
}

.footer-link:hover{
color:#ff00aa;
}

.footer{
background:#05070c;
padding:50px 50px;
display:grid;
grid-template-columns:2fr 1fr 1fr;
gap:40px;
color:#ccc;
font-size:18px;
}

.footer h3{
font-size:32px;
margin-bottom:20px;
color:white;
}

.footer p{
font-size:18px;
line-height:1.6;
}


.footer-link{
display:block;
color:white;
text-decoration:none;
margin-bottom:12px;
transition:color .3s ease;
}

.footer a:hover{
color:#ff00aa;
}

nav{
display:flex;
align-items:center;
gap:25px;
}

.dropdown{
position:relative;
display:inline-block;
}

.dropdown-menu{
display:none;
position:absolute;
top:100%;
left:0;
background:#171b24;
min-width:180px;
border:1px solid #252b36;
border-radius:10px;
padding:10px 0;
z-index:9999;
}

.dropdown-menu a{
display:block;
padding:12px 18px;
margin:0 !important;
color:white !important;
}

.dropdown:hover .dropdown-menu{
display:block;
}

.dropdown-menu a:hover{
background:#252b36;
color:#ff00aa !important;
}

header *{
pointer-events:auto;
}

.dropdown-menu{
z-index:999999;
}
.dropdown:hover .dropdown-menu{
display:block !important;
}

.dropdown-menu a,
.dropdown-menu a:link,
.dropdown-menu a:visited{
display:block !important;
margin:0 !important;
padding:12px 18px !important;
color:white !important;
white-space:nowrap;
}

.dropdown-menu a:hover{
background:#252b36 !important;
color:#ff00aa !important;
}


.dropdown-menu{
display:none !important;
position:absolute;
top:100%;
left:0;
background:#171b24;
min-width:220px;
border:1px solid #252b36;
border-radius:10px;
padding:10px 0;
z-index:999999;
}

.dropdown:hover .dropdown-menu{
display:block !important;
}
.logo-link{
display:block;
width:180px;
height:100px;
position:relative;
z-index:1000000;
}

.logo-link img{
width:100%;
height:100%;
object-fit:contain;
display:block;
}
header{
position:sticky !important;
top:0 !important;
z-index:9999999 !important;
background:#05070c;
}

.logo-link{
display:block;
width:180px;
height:100px;
flex-shrink:0;
}

.logo-link img{
width:100%;
height:100%;
object-fit:contain;
display:block;
}

.poruci-css-btn{
display:block;
width:500px;
padding:22px 0;
font-size:26px;
margin:20px auto 0;
text-align:center;
color:white;
text-decoration:none;
font-weight:bold;
border-radius:16px;
border:3px solid #00bfff;
box-shadow:0 0 0 3px #ff00aa, 0 0 22px rgba(255,0,170,.55);
}


@media screen and (max-width:768px){

html, body{
overflow-x:hidden !important;
}

header{
padding:8px 10px !important;
flex-direction:column !important;
gap:6px !important;
}

.logo-link{
width:90px !important;
height:50px !important;
}

nav{
display:flex !important;
flex-wrap:wrap !important;
justify-content:center !important;
gap:8px !important;
}

header nav a{
font-size:12px !important;
margin:0 !important;
}

.hero{
display:block !important;
padding:25px 15px !important;
min-height:auto !important;
overflow:hidden !important;
}

.hero-inner{
display:block !important;
max-width:100% !important;
width:100% !important;
text-align:center !important;
}

.hero-image img{
max-width:230px !important;
width:230px !important;
height:auto !important;
}

.hero h1{
font-size:32px !important;
line-height:1.05 !important;
}

.hero p{
font-size:15px !important;
}

.hero-btn img{
width:160px !important;
}

@media screen and (max-width:768px){

html, body{
width:100%;
overflow-x:hidden !important;
}

/* HEADER */
header{
padding:8px 10px !important;
flex-direction:column !important;
gap:6px !important;
align-items:center !important;
}

.logo-link{
width:90px !important;
height:50px !important;
}

nav{
display:flex !important;
flex-wrap:wrap !important;
justify-content:center !important;
align-items:center !important;
gap:8px !important;
}

header nav a{
font-size:12px !important;
margin:0 !important;
}

/* DROPDOWN NA TELEFONU */
.dropdown{
position:relative !important;
}

.dropdown-menu{
position:absolute !important;
top:100% !important;
left:50% !important;
transform:translateX(-50%) !important;
min-width:170px !important;
z-index:999999 !important;
}

/* OPŠTE */
.container,
.box,
.content,
.section{
width:100% !important;
max-width:100% !important;
padding-left:15px !important;
padding-right:15px !important;
box-sizing:border-box !important;
}

/* SLIKE */
img{
max-width:100% !important;
height:auto;
}

/* KARTICE */
.card,
.latest-card,
.cat{
max-width:320px !important;
width:100% !important;
margin-left:auto !important;
margin-right:auto !important;
}

/* GRIDOVI */
.grid,
.products,
.latest-products,
.categories,
.cards{
grid-template-columns:1fr !important;
justify-items:center !important;
}

/* FORME */
input,
textarea,
select,
button{
max-width:100% !important;
box-sizing:border-box !important;
}

/* TABELA */
table{
display:block !important;
width:100% !important;
overflow-x:auto !important;
}

.logo-link{
width:90px !important;
height:50px !important;
}

.logo-link img{
width:100% !important;
height:100% !important;
object-fit:contain !important;
}

}

body header{
position:fixed !important;
top:0 !important;
left:0 !important;
right:0 !important;
width:100% !important;
z-index:99999999 !important;
background:#05070c !important;
}

body{
padding-top:110px !important;
}