/* ===== NAVBAR ===== */

.navbar{

position:fixed;

top:20px;

left:50%;

transform:translateX(-50%);

width:92%;

max-width:1500px;

height:82px;

display:flex;

justify-content:space-between;

align-items:center;

padding:0 45px;

border-radius:24px;

background:rgba(255,255,255,.10);

backdrop-filter:blur(20px);

-webkit-backdrop-filter:blur(20px);

border:1px solid rgba(255,255,255,.18);

box-shadow:

0 8px 32px rgba(0,0,0,.18),

inset 0 1px 0 rgba(255,255,255,.15);

z-index:999;

transition:.45s ease;

}

/* po scrollování */

.navbar.scrolled{

background:rgba(255,255,255,.92);

backdrop-filter:blur(24px);

box-shadow:

0 12px 40px rgba(0,0,0,.15);

}

.logo{

display:flex;

align-items:center;

gap:15px;

}

.logo img{

width: 80px;

transition:.4s;

}

.logo span{

font-size:21px;

font-weight:700;

color:white;

letter-spacing:.5px;

transition:.4s;

}

.navbar ul{

display:flex;

gap:34px;

}

.navbar ul li{

position:relative;

}

.navbar ul li a{

font-size:16px;

font-weight:600;

color:white;

transition:.35s;

}

/* podtržení */

.navbar ul li::after{

content:"";

position:absolute;

bottom:-8px;

left:0;

width:0;

height:2px;

background:#D4AF37;

transition:.35s;

}

.navbar ul li:hover::after{

width:100%;

}

.navbar ul li:hover a{

color:#D4AF37;

}

/* tlačítko */

.button{

padding:15px 34px;

border-radius:50px;

background:linear-gradient(

135deg,

#D4AF37,

#f3d56a

);

font-weight:700;

color:white;

transition:.35s;

box-shadow:

0 10px 25px rgba(212,175,55,.35);

}

.button:hover{

transform:translateY(-4px);

box-shadow:

0 18px 40px rgba(212,175,55,.45);

}

/* scroll */

.navbar.scrolled .logo span{

color:#111;

}

.navbar.scrolled ul li a{

color:#111;

}

.navbar.scrolled ul li:hover a{

color:#D4AF37;

}
/* ===========================
   HAMBURGER MENU
=========================== */

.hamburger{

display:none;

flex-direction:column;

justify-content:center;

gap:7px;

cursor:pointer;

z-index:1001;

}

.hamburger span{

width:32px;

height:3px;

background:white;

border-radius:20px;

transition:.35s;

}

/* Animace do X */

.hamburger.active span:nth-child(1){

transform:rotate(45deg) translate(7px,7px);

}

.hamburger.active span:nth-child(2){

opacity:0;

}

.hamburger.active span:nth-child(3){

transform:rotate(-45deg) translate(7px,-7px);

}

/* Mobilní menu */

@media(max-width:900px){

.navbar{

padding:20px 30px;

}

.navbar ul{

position:fixed;

top:0;

right:-100%;

width:300px;

height:100vh;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

gap:35px;

background:rgba(10,20,40,.96);

backdrop-filter:blur(18px);

transition:.45s;

}

.navbar ul.active{

right:0;

}

.navbar ul li a{

font-size:22px;

color:white;

}

.button{

display:none;

}

.hamburger{

display:flex;

}

}