/* ---------- Header ---------- */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  height:var(--header-h);
  z-index:50;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease;
  border-bottom:1px solid transparent;
}
.site-header .header-inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.site-header.is-transparent{
  background:transparent;
}
.site-header.is-solid{
  background:rgba(243, 243, 243, 0.441);
  border-color:#e7dece5f;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  backdrop-filter: blur(12px);
}
.brand{display:flex; align-items:center; gap:.7rem}
.brand-mark{
  width:32px; height:32px;
  border-radius:12px;
  background:
    radial-gradient( circle at 30% 30%, rgba(255,255,255,.75), transparent 55%),
    linear-gradient(135deg, var(--accent), #1f3f38);
  box-shadow: 0 12px 24px rgba(47,93,80,.18);
}
.brand-name{
  font-weight:850;
  letter-spacing:.3px;
  font-size:1.05rem;
}
.nav{display:flex; align-items:center; gap:10px}
.nav-list{
  display:flex; align-items:center; gap:14px;
  list-style:none; padding:0; margin:0;
}
.nav-link{
  padding:.55rem .7rem;
  border-radius:999px;
  font-weight:650;
  color:var(--text);
  opacity:.92;
  transition: background .2s ease, opacity .2s ease, color .2s ease;
}
.nav-link:hover{background:rgba(47,93,80,.10); opacity:1}
.nav-link.active{background:rgba(47,93,80,.14); color:var(--accent)}

.header-actions{display:flex; align-items:center; gap:12px}
.lang-switch{
  display:flex;
  border:1px solid #e7dece;
  background:rgba(255,255,255,.55);
  border-radius:999px;
  overflow:hidden;
}
.lang-btn{
  border:0;
  background:transparent;
  padding:.45rem .7rem;
  cursor:pointer;
  font-weight:750;
  color:var(--muted);
}
.lang-btn.active{color:var(--accent); background:rgba(47,93,80,.10)}

.nav-toggle{
  display:none;
  position:relative;
  width:42px; height:42px;
  border-radius:999px;
  border:1px solid #e7dece;
  background:rgba(255,255,255,.55);
  cursor:pointer;
}
.nav-toggle span{
  position:absolute;
  left:8px;
  width:26px;
  height:3px;
  transition: transform .2s ease;
}
.nav-toggle span::before,
.nav-toggle span::after{
  content:"";
  position:absolute;
  width:50%;
  height:3px;
  background:var(--text);
  transition: .2s;
  border-radius:4px;
}
.nav-toggle span::before{
  left:0;
  border-radius:4px 0 0 4px;
  transform-origin: 100% 50%;
}
.nav-toggle span::after{
  right:0;
  border-radius:0 4px 4px 0;
  transform-origin: 0 50%;
}
.nav-toggle span:nth-of-type(1){
  top:11px;
}
.nav-toggle span:nth-of-type(2){
  top:20px;
}
.nav-toggle span:nth-of-type(3){
  bottom:11px;
}
.nav-toggle.open span:nth-of-type(1)::before{
  transform: rotate(45deg);
}
.nav-toggle.open span:nth-of-type(1)::after{
  transform: rotate(-45deg);
}
.nav-toggle.open span:nth-of-type(2)::before{
  transform: translateX(-75%);
  opacity:0;
}
.nav-toggle.open span:nth-of-type(2)::after{
  transform: translateX(75%);
  opacity:0;
}
.nav-toggle.open span:nth-of-type(3)::before{
  transform: rotate(-45deg);
}
.nav-toggle.open span:nth-of-type(3)::after{
  transform: rotate(45deg);
}
.nav-toggle.open span:nth-of-type(1){
  transform: translateY(7px);
}
.nav-toggle.open span:nth-of-type(3){
  transform: translateY(-8px);
}
@media (max-width: 840px){
  .nav-toggle{display:inline-flex; align-items:center; justify-content:center}
  .nav-list{
    position:fixed;
    top: calc(var(--header-h) + 10px);
    right: 18px;
    width: min(340px, calc(100% - 36px));
    flex-direction:column;
    gap:8px;
    padding:12px;
    background: rgba(244,240,230,.95);
    border:1px solid #e7dece;
    border-radius: 18px;
    box-shadow: var(--shadow);
    transform: translateY(-6px);
    opacity:0;
    pointer-events:none;
    transition: opacity .18s ease, transform .18s ease;
    backdrop-filter: blur(12px);
  }
  .nav-list.open{
    opacity:1;
    pointer-events:auto;
    transform: translateY(0);
  }
  .nav-link{width:100%; text-align:center}
}
