/* Iliryan premium header — approved emblem */
header{
  height:88px;
  padding:0 18px;
  grid-template-columns:48px minmax(0,1fr) auto;
  gap:12px;
  background:linear-gradient(180deg,rgba(7,13,20,.985),rgba(7,13,20,.955));
  border-bottom:1px solid rgba(217,177,91,.18);
  box-shadow:0 10px 34px rgba(0,0,0,.18);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.brand{
  display:flex;
  align-items:center;
  justify-self:center;
  gap:12px;
  color:#f7f7f5;
  min-width:0;
}
.brand-emblem-img{
  width:52px;
  height:52px;
  display:block;
  flex:0 0 52px;
  object-fit:contain;
  filter:drop-shadow(0 7px 14px rgba(203,156,64,.16));
}
.brand-wordmark{
  white-space:nowrap;
  font-family:Georgia,"Times New Roman",serif;
  font-size:21px;
  font-weight:500;
  letter-spacing:.24em;
  line-height:1;
  color:#faf8f3;
  text-shadow:0 1px 12px rgba(255,255,255,.04);
}

.header-actions{gap:9px}
.language-button,.menu,#back{
  height:48px;
  border:1px solid rgba(190,157,91,.34);
  background:linear-gradient(180deg,#121a24,#0e151e);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 8px 22px rgba(0,0,0,.18);
  transition:border-color .18s ease,transform .18s ease,background .18s ease,box-shadow .18s ease;
}
.language-button:hover,.menu:hover,#back:hover{
  border-color:rgba(226,190,111,.62);
  background:linear-gradient(180deg,#17212c,#101821);
}
.language-button:active,.menu:active,#back:active{transform:scale(.97)}

.language-button{
  min-width:88px;
  padding:0 13px;
  gap:8px;
  border-radius:16px;
  font-weight:800;
  letter-spacing:.03em;
}
.language-globe-icon{
  width:22px;
  height:22px;
  display:block;
  color:#e7bd63!important;
  filter:drop-shadow(0 2px 6px rgba(222,176,83,.12));
}
.language-caret{font-size:11px;color:#d8c597;margin-left:1px}

.menu{
  width:48px;
  border-radius:16px;
  display:grid;
  place-items:center;
  padding:0;
}
.menu-lines{width:22px;height:17px;display:flex;flex-direction:column;justify-content:space-between}
.menu-lines i{
  display:block;
  height:2px;
  width:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#c9973f,#f1cf7b);
  box-shadow:0 0 8px rgba(224,181,93,.08);
}
.menu-lines i:nth-child(2){width:78%;margin-left:auto}

#back{
  width:48px;
  border-radius:16px;
  color:#ead094;
  font-size:23px;
}

.language-menu{
  top:58px;
  padding:9px;
  background:linear-gradient(180deg,rgba(15,23,32,.99),rgba(9,15,22,.99));
  border:1px solid rgba(190,157,91,.34);
  border-radius:18px;
  box-shadow:0 22px 60px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.025);
  overflow:hidden;
}
.language-option{border:1px solid transparent;padding:13px 14px;border-radius:12px}
.language-option:hover,.language-option.active{
  background:linear-gradient(90deg,rgba(217,177,91,.12),rgba(217,177,91,.035));
  border-color:rgba(217,177,91,.18);
}
.language-option strong{color:#e9c56f}
.language-note{border-top-color:rgba(217,177,91,.16)}

#drawer{
  right:18px;
  top:98px;
  padding:9px;
  background:linear-gradient(180deg,rgba(15,23,32,.99),rgba(9,15,22,.99));
  border:1px solid rgba(190,157,91,.34);
  border-radius:20px;
  box-shadow:0 24px 65px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.025);
}
#drawer button{
  position:relative;
  padding:14px 15px 14px 17px;
  border:1px solid transparent;
  border-radius:12px;
  font-weight:650;
  transition:.16s ease;
}
#drawer button:hover{
  background:linear-gradient(90deg,rgba(217,177,91,.12),rgba(217,177,91,.035));
  border-color:rgba(217,177,91,.17);
}
#drawer button::after{
  content:'›';
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-52%);
  color:#d8b768;
  font-size:20px;
  opacity:.8;
}
#drawer button:nth-child(2){color:#edcc7d}

@media(max-width:700px){
  header{height:84px;padding:0 13px;gap:7px}
  .brand{gap:9px}
  .brand-emblem-img{width:48px;height:48px;flex-basis:48px}
  .brand-wordmark{font-size:18px;letter-spacing:.19em}
  .header-actions{gap:6px}
  .language-button{height:46px;min-width:82px;padding:0 10px;border-radius:15px;gap:7px}
  .language-globe-icon{width:20px;height:20px}
  .menu,#back{width:46px;height:46px;border-radius:15px}
  #drawer{top:92px;right:12px;width:min(278px,calc(100vw - 24px))}
}

@media(max-width:390px){
  header{grid-template-columns:42px minmax(0,1fr) auto;padding:0 9px}
  .brand{gap:7px}
  .brand-emblem-img{width:43px;height:43px;flex-basis:43px}
  .brand-wordmark{font-size:16px;letter-spacing:.14em}
  .language-button{min-width:68px;padding:0 8px}
  .language-globe-icon{width:18px;height:18px}
  .menu,#back{width:42px;height:44px}
}

@media(max-width:345px){.brand-wordmark{display:none}}
