/* === Global container (agar boshqa faylda bo'lmasa) === */
/* Global box sizing – ixtiyoriy, tavsiya qilinadi */
*, *::before, *::after { box-sizing: border-box; }

/* Bazaviy container */
.container{
  max-width: 1200px;        /* desktop “chegara” */
  width: 100%;              /* mobil + tablet to‘liq eni */
  margin-inline: auto;
  padding-inline: 24px;     /* yon chetlar – default */
}

/* Mobil va kichik ekranlar */
@media (max-width: 768px){
  .container{
    padding-inline: 16px;   /* mobil chetlar qisqartiriladi */
    max-width: 100%;
  }
}

/* Seksiyalar orasidagi vertikal bo'shliq – xohishga ko'ra */
.section{
  padding-block: 56px;
}
@media (max-width: 768px){
  .section{
    padding-block: 32px;
  }
}

/* === Header bazasi === */
.site-header{
  position: sticky; top: 0; z-index: 50;
  background: rgba(10,12,14,.85);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(195,154,111,.12);
}
.header-row{
  display:flex; align-items:center; justify-content:space-between;
  min-height:56px; gap:12px;
}
.logo img{ height:28px; display:block; }
@media (min-width: 900px){ .logo img{ height:32px; } }

/* === DESKTOP NAV + LIQUID GLASS === */
.nav-desktop{ display:flex; }
.nav{
  position: relative; display: inline-flex; gap: 6px;
  padding: 6px; border-radius: 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(195,154,111,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.nav-link{
  position: relative; z-index: 1;
  display: inline-flex; align-items:center;
  height: 36px; padding: 0 14px; border-radius: 10px;
  color: var(--muted, #b9c0c7); text-decoration: none; font-weight: 600;
  transition: color .18s;
}
.nav-link:hover{ color: var(--text, #e9e9e9); }

/* Liquid "pill" – default yashirin, hover/focusda ko'rinadi */
.nav-glass{
  position: absolute; top: 6px; left: 6px;
  height: 36px; width: 120px; border-radius: 10px;
  background:
    radial-gradient(90% 120% at 20% 10%, rgba(255,255,255,.25), rgba(255,255,255,.06) 60%, transparent),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(195,154,111,.28);
  box-shadow: 0 6px 18px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
  backdrop-filter: blur(8px) saturate(130%);
  -webkit-backdrop-filter: blur(8px) saturate(130%);
  transition: transform .26s cubic-bezier(.18,.8,.25,1), width .26s, left .26s, opacity .18s;
  pointer-events: none;
  opacity: 0; transform: scale(.98);
}
.nav:hover .nav-glass,
.nav:focus-within .nav-glass{ opacity: 1; transform: scale(1); }

/* === LANGUAGE SWITCHER === */
.lang-switch{ display:flex; gap:6px; align-items:center; margin-left:8px; }
.lang-btn{
  display:inline-flex; align-items:center; gap:6px;
  height: 36px; padding: 0 10px; border-radius:10px;
  border:1px solid rgba(195,154,111,.25);
  background: rgba(255,255,255,.04);
  color: var(--text); font-weight:700; cursor:pointer;
  -webkit-appearance: none; appearance: none; /* iOS default button styling off */
  outline: none;
}
.lang-btn[aria-current="true"]{ background: rgba(195,154,111,.12); border-color: rgba(195,154,111,.45); }

/* === MOBIL HAMBURGER === */
.hamburger{
  display: none;
  width: 40px; height: 40px;
  border: 1px solid rgba(195,154,111,.25);
  border-radius: 10px;
  background: rgba(255,255,255,.04);
  position: relative;
}
.hamburger span{
  position:absolute; left:9px; right:9px; height:2px;
  background:#e7c39a; border-radius:1px;
  transition: transform .25s ease, opacity .2s ease, top .25s ease;
}
.hamburger span:nth-child(1){ top:12px; }
.hamburger span:nth-child(2){ top:19px; }
.hamburger span:nth-child(3){ top:26px; }

/* Active -> "X" */
.site-header.is-open .hamburger span:nth-child(1){ top:19px; transform: rotate(45deg); }
.site-header.is-open .hamburger span:nth-child(2){ opacity:0; }
.site-header.is-open .hamburger span:nth-child(3){ top:19px; transform: rotate(-45deg); }

/* === MOBIL TOP-SHEET MENYU === */
.mobile-menu{
  position: fixed; top:0; left:0; right:0;
  transform: translateY(-105%);
  background: rgba(10,12,14,.96);
  border-bottom: 1px solid rgba(195,154,111,.18);
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
  padding: 72px 16px 18px;      /* header uchun bo'shliq */
  display:flex; flex-direction:column; gap:14px;
  transition: transform .32s ease;
  z-index: 1001;                 /* header(50) va boshqa UI ustida turishi uchun */
  pointer-events: none;          /* yopiq paytda pastdagiga bosish o‘tadi */
}
.site-header.is-open .mobile-menu{ transform: translateY(0); pointer-events:auto; }

.mobile-menu .mm-close{
  position:absolute; top:12px; right:12px;
  display:inline-flex; align-items:center; justify-content:center;
  padding:0; inline-size:36px; block-size:36px; border-radius:10px;
  border:1px solid rgba(195,154,111,.25);
  background: rgba(255,255,255,.06);
  color: var(--text); font-weight:800; line-height:1; font-size:18px;
  cursor:pointer; pointer-events:auto;
  z-index: 1002;
}
.mobile-menu .mm-close:active{ transform: scale(.98); }

.mobile-menu .mm-link{
  display:block; padding:14px 12px; border-radius:12px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(195,154,111,.2);
  color: var(--text, #e9e9e9); text-decoration:none; font-weight:700;
}

/* Body scroll bloklash */
.no-scroll{ overflow:hidden; }

/* === RESPONSIVE === */
@media (max-width: 768px){
  .nav-desktop{ display:none; }    /* Desktop nav yashirin */
  .hamburger{ display:inline-flex; align-items:center; justify-content:center; }
  .logo img{ height:24px; }
  .lang-switch{ margin-left:auto; }
}
@media (min-width: 769px){
  .mobile-menu{ display:none; }
}
