/* ════════════════════════════════════════════════════════════════════
   AZEA NEO-LUXURY MOBILE DESIGN SYSTEM
   Bu fayl ən sonda yüklənir və bütün köhnə stil qatlarını vahidləşdirir.
   Strategiya: (1) canonical tokenlər + köhnə token aliasları,
   (2) desktop 430px app-shell, (3) vahid header, (4) komponent cilası.
   Heç bir mövcud qayda silinmir — yalnız override + əlavə.
   ════════════════════════════════════════════════════════════════════ */

:root {
  /* ─── Canonical AZEA palette (tək həqiqət mənbəyi) ─── */
  --azea-bg:          #07070a;
  --azea-surround:    #050506;
  --azea-surface:     rgba(255,255,255,0.045);
  --azea-surface-2:   rgba(255,255,255,0.025);
  --azea-gold:        #c9a96a;
  --azea-gold-soft:   #d9bd80;
  --azea-gold-deep:   #8a6520;
  --azea-gold-glow:   rgba(201,169,106,0.30);
  --azea-line:        rgba(201,169,106,0.18);
  --azea-line-soft:   rgba(255,255,255,0.08);
  --azea-ink:         #f5f5f7;
  --azea-ink-2:       #b8b8c0;
  --azea-ink-3:       #8a8a92;
  --azea-radius:      22px;
  --azea-radius-sm:   14px;
  --azea-radius-pill: 999px;
  --azea-shadow:      0 24px 60px -24px rgba(0,0,0,0.72);
  --azea-shadow-soft: 0 2px 24px rgba(0,0,0,0.40);
  --azea-shell-w:     430px;
  --azea-ease:        cubic-bezier(0.2, 0.7, 0.2, 1);

  /* ─── Köhnə adların aliası → hamısı eyni palitraya düşür ─── */
  --gold:        var(--azea-gold);
  --gold-soft:   var(--azea-gold-soft);
  --gold-300:    var(--azea-gold);
  --gold-500:    #b08a4a;
  --gold-700:    var(--azea-gold-deep);
  --gold-glow:   var(--azea-gold-glow);
  --bg-dark:     var(--azea-bg);
  --bg-dark-2:   #0d0d12;
  --bg-0:        var(--azea-bg);
  --bg-1:        #0d0d12;
  --bg-2:        #14141a;
  --bg-rise:     #11111a;
  --bg-glass:    var(--azea-surface);
  --glass:       var(--azea-surface);
  --border-gold: var(--azea-line);
  --line-faint:  var(--azea-line-soft);
  --line-firm:   rgba(255,255,255,0.12);
  --ink-1:       var(--azea-ink);
  --ink-2:       var(--azea-ink-2);
  --ink-3:       var(--azea-ink-3);
  --shadow-card: var(--azea-shadow);
  --shadow-lift: var(--azea-shadow);
  --r-md:        var(--azea-radius-sm);
  --r-lg:        var(--azea-radius);
}

html, body { background-color: var(--azea-bg); }

/* ════════════════════════════════════════════════════════════════════
   1. APP-SHELL — desktopda 430px telefon-çərçivəsi, mərkəzdə
   ════════════════════════════════════════════════════════════════════ */
@media (min-width: 480px) {
  html {
    background:
      radial-gradient(120% 80% at 50% 0%, #0c0c12 0%, var(--azea-surround) 60%, #000 100%)
      fixed;
    min-height: 100%;
  }
  body {
    max-width: var(--azea-shell-w);
    margin-inline: auto;
    min-height: 100vh;
    background-color: var(--azea-bg);
    box-shadow: 0 0 0 1px var(--azea-line), 0 40px 120px -20px rgba(0,0,0,0.9);
    overflow-x: hidden;
    position: relative;
    /* dock üçün alt boşluq desktopda da */
    padding-bottom: calc(106px + env(safe-area-inset-bottom)) !important;
  }

  /* Fixed elementlər shell-ə hizalansın */
  .site-header {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--azea-shell-w);
  }
  .site-header.is-hidden { transform: translateX(-50%) translateY(-100%); }

  /* Dock-nav desktopda da görünsün və shell-ə hizalansın */
  .dock-nav {
    display: flex !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--azea-shell-w);
  }

  /* Overlay menyu shell çərçivəsində qalsın */
  .overlay-menu {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--azea-shell-w);
  }

  /* Scroll progress bar da shell daxilində */
  .scroll-progress {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--azea-shell-w);
  }

  /* İçəri konteynerlər shell-ə uyğunlaşsın — geniş desktop grid söndürülür */
  .container { max-width: 100% !important; padding-inline: 18px !important; }
  .container.narrow { max-width: 100% !important; }
}

/* ════════════════════════════════════════════════════════════════════
   2. VAHİD HEADER — hər enlikdə yalnız brand + *0210, naviqasiya dock-da
   ════════════════════════════════════════════════════════════════════ */
.site-header .primary-nav ul > li.has-mega,
.site-header .primary-nav ul > li.nav-divider,
.site-header .primary-nav ul > li > a[href="#process"],
.site-header .mega-panel {
  display: none !important;
}
/* Header sağ tərəfdə yalnız telefon düyməsi + menyu burger qalır */
.site-header .header-inner { align-items: center; }
.phone-cta .phone-num { letter-spacing: 0.04em; }

/* ════════════════════════════════════════════════════════════════════
   3. DOCK-NAV — vahid, aktiv element gold highlight
   ════════════════════════════════════════════════════════════════════ */
.dock-nav {
  background: linear-gradient(180deg, rgba(10,10,14,0.86) 0%, rgba(7,7,10,0.97) 60%, rgba(7,7,10,1) 100%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(180%);
  backdrop-filter: blur(22px) saturate(180%);
  border-top: 1px solid var(--azea-line) !important;
}
.dock-item .dock-label,
.dock-cta-label { letter-spacing: 0.08em; }
.dock-item.active,
.dock-item.active .dock-icon,
.dock-item.active .dock-label {
  color: var(--azea-gold) !important;
}
.dock-item.active .dock-icon svg { filter: drop-shadow(0 0 8px var(--azea-gold-glow)); }
.dock-cta-smeta.active .dock-cta-bubble,
.dock-cta-smeta .dock-cta-bubble {
  box-shadow: 0 0 0 1px var(--azea-gold-deep) inset, 0 8px 24px -6px var(--azea-gold-glow);
}

/* ════════════════════════════════════════════════════════════════════
   4. KARTLAR — dark glass + gold hairline + premium shadow
   ════════════════════════════════════════════════════════════════════ */
.card,
.panel,
.calculator,
.service-tile,
.service-card,
.pr-card,
.legal-card,
.verify-card,
.stat,
.mega-card,
.lh-strip-card,
.mdash-hero-card,
.dash-stage-card {
  background:
    linear-gradient(165deg, var(--azea-surface) 0%, var(--azea-surface-2) 100%);
  border: 1px solid var(--azea-line);
  border-radius: var(--azea-radius);
  box-shadow: var(--azea-shadow-soft);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.service-tile:hover,
.service-card:hover,
.pr-card:hover,
.mega-card:hover,
.lh-strip-card:hover {
  border-color: var(--azea-gold);
  box-shadow: var(--azea-shadow), 0 0 0 1px var(--azea-gold-glow);
}
/* Şəkilli kartların foto guşələri radius-a uyğunlaşsın */
.service-photo,
.service-card-photo,
.mega-card-photo,
.lh-strip-card-img { border-radius: 0; }

/* ════════════════════════════════════════════════════════════════════
   5. FORMLAR — input/select/textarea/button luxury (default browser yox)
   ════════════════════════════════════════════════════════════════════ */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="date"],
select,
textarea,
.input {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  background: var(--azea-surface);
  border: 1px solid var(--line-firm);
  border-radius: var(--azea-radius-sm);
  color: var(--azea-ink);
  font-family: var(--font-sans, Georgia, serif);
  font-size: 1rem;
  line-height: 1.3;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color 0.2s var(--azea-ease), box-shadow 0.2s var(--azea-ease), background 0.2s;
}
input::placeholder, textarea::placeholder { color: var(--azea-ink-3); opacity: 1; }
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="date"]:focus,
select:focus,
textarea:focus,
.input:focus {
  border-color: var(--azea-gold);
  box-shadow: 0 0 0 3px var(--azea-gold-glow);
  background: var(--azea-surface-2);
}
textarea { min-height: 120px; resize: vertical; }

/* Custom select arrow (qızılı chevron) */
select {
  padding-right: 42px;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23c9a96a' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
}
select option { background: #14141a; color: var(--azea-ink); }

/* Checkbox & radio — gold accent */
input[type="checkbox"],
input[type="radio"] { accent-color: var(--azea-gold); }

/* Düymələr */
.btn { border-radius: var(--azea-radius-pill); }
.btn-primary {
  background: linear-gradient(180deg, var(--azea-gold-soft), var(--azea-gold-deep)) !important;
  color: #0a0a0a !important;
  box-shadow: 0 0 0 1px var(--azea-gold-deep) inset, 0 8px 22px -8px var(--azea-gold-glow) !important;
}
.btn-primary:hover { box-shadow: 0 0 0 1px var(--azea-gold) inset, 0 12px 30px -8px var(--azea-gold-glow) !important; }
.btn-ghost {
  background: var(--azea-surface);
  border-color: var(--azea-line);
  color: var(--azea-ink);
}
.btn-ghost:hover { border-color: var(--azea-gold); color: var(--azea-gold-soft); }

/* iOS-da number-input spinner və autofill fonu */
input:-webkit-autofill,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--azea-ink);
  -webkit-box-shadow: 0 0 0 1000px #14141a inset;
  caret-color: var(--azea-ink);
}

/* ════════════════════════════════════════════════════════════════════
   6. MODAL / OVERLAY — glass + gold
   ════════════════════════════════════════════════════════════════════ */
.modal, .popup, .dialog, .lightbox-inner, .sheet, .overlay-card {
  background: linear-gradient(165deg, #0f0f15 0%, #0a0a0e 100%);
  border: 1px solid var(--azea-line);
  border-radius: var(--azea-radius);
  box-shadow: var(--azea-shadow);
}
.overlay-menu { background: rgba(5,5,7,0.96); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); }
.overlay-min-cta {
  border: 1px solid var(--azea-line);
  border-radius: var(--azea-radius-sm);
}

/* Add-to-home-screen banner (layout.php) shell-ə uyğun */
#a2hs {
  border: 1px solid var(--azea-line) !important;
  border-radius: var(--azea-radius-sm) !important;
  background: linear-gradient(165deg, #0f0f15, #0a0a0e) !important;
}

/* ════════════════════════════════════════════════════════════════════
   7. KİÇİK CİLALAR
   ════════════════════════════════════════════════════════════════════ */
::selection { background: var(--azea-gold-glow); color: #fff; }
.azea-eye, .eyebrow, .label, .label-small {
  color: var(--azea-gold) !important;
  opacity: 0.9;
}
hr, .divider-line { background: var(--azea-line-soft); }
.site-footer { border-top: 1px solid var(--azea-line); }
.footer-legal { color: var(--azea-gold) !important; }