/* ==========================================================================
   ZEON — apple.css   (ƏN SONDA YÜKLƏNİR)
   Apple interfeys prinsipləri: dərhal reaksiya, birbaşa toxunuş hissi,
   şəffaf materiallar, ölçüyə görə tipoqrafiya, əlçatanlıq.
   Əsas hədəf: telefon formatı.
   ========================================================================== */

/* ═══ 1. REAKSİYA — gecikməni öldür ══════════════════════════════════════
   Apple: «geribildirim buraxanda yox, basanda gəlməlidir».               */

* { -webkit-tap-highlight-color: transparent; }

a, button, label, summary,
.module__btn, .faq-item__btn, .cal__day, .slot, .tab,
.agent__chip, .msg__chip, .shot, .fab, .aifab {
  touch-action: manipulation;          /* 300 ms tap gecikməsi yoxdur */
}

/* basan an — 100 ms, dərhal görünən */
.btn-brand:active,
.btn-soft:active,
.btn-cta:active,
.btn-pill:active,
.nav__btn:active,
.chat__send:active,
.fab:active,
.aifab:active {
  transform: scale(.965);
  transition-duration: 100ms;
  transition-timing-function: ease-out;
}

/* sətir tipli hədəflər — miqyas yox, fon reaksiyası */
.module__btn:active,
.faq-item__btn:active,
.lesson:active,
.drawer a:active,
.nav__link:active {
  background: rgba(15, 98, 254, .07);
  transition-duration: 80ms;
}

.cal__day:active:not(:disabled),
.slot:active:not(:disabled),
.agent__chip:active,
.msg__chip:active,
.tab:active {
  transform: scale(.94);
  transition-duration: 90ms;
}

/* kartlar basılanda azca «basılır» */
.card:active, .advc:active, .prob:active, .plan:active,
.market:active, .fcard:active, .srv:active, .shot:active {
  transform: scale(.99);
  transition-duration: 120ms;
}

/* toxunma cihazlarında hover effektləri işə düşməsin —
   yoxsa barmaq götürüləndən sonra element «ilişib» qalır */
@media (hover: none) {
  .btn-brand:hover, .btn-soft:hover, .btn-cta:hover, .btn-pill:hover,
  .nav__btn:hover, .card:hover, .advc:hover, .prob:hover, .plan:hover,
  .market:hover, .fcard:hover, .srv:hover, .shot:hover, .legal__row:hover,
  .fab:hover, .aifab:hover, .chat__send:hover, .foot__soc a:hover {
    transform: none;
  }
  .fab:hover, .aifab:hover { padding-right: 7px; }
  .fab:hover .fab__txt, .aifab:hover .aifab__txt { max-width: 0; opacity: 0; }
  .foot__col a:hover { padding-left: 0; }
}

/* ═══ 2. TOXUNUŞ HƏDƏFLƏRİ — ən azı 44 px ═══════════════════════════════ */
@media (pointer: coarse), (max-width: 680px) {
  .nav__link      { min-height: 44px; display: flex; align-items: center; }
  .brand          { padding-block: 10px; }
  .drawer a       { min-height: 52px; }
  .foot__col a    { display: inline-block; padding-block: 8px; }
  .foot__soc a    { width: 44px; height: 44px; }
  .modal__x,
  .chatpop__x     { width: 44px; height: 44px; }
  .shopnote__x    { width: 28px; height: 28px; margin: -6px -4px -6px 0; }
  .cal__nav button{ width: 44px; height: 44px; }
  .burger         { width: 44px; height: 44px; }
  .chat__send     { width: 46px; height: 46px; }
  .slot           { min-height: 44px; }
  .agent__chip,
  .msg__chip      { min-height: 38px; display: inline-flex; align-items: center; }
  .sound-toggle   { min-height: 38px; }
  .tab            { min-height: 40px; display: inline-flex; align-items: center; }
  /* təqvim günləri kvadrat qalır, amma kliklənən sahə böyüdülür */
  .cal__grid      { gap: 6px; }
}

/* ═══ 3. TİPOQRAFİYA — hərf aralığı ÖLÇÜYƏ görə dəyişir ═════════════════
   Apple: böyük mətn sıxılır, kiçik mətn bir az açılır.                   */
@media (max-width: 680px) {
  .h-hero            { letter-spacing: -.024em; line-height: 1.12; }
  .h-sec             { letter-spacing: -.021em; line-height: 1.15; }
  .h-sec--caps       { letter-spacing: -.018em; line-height: 1.08; }
  h3                 { letter-spacing: -.015em; }
  h4                 { letter-spacing: -.008em; }
  .lead              { letter-spacing: .002em; line-height: 1.6; }
  .small, .tiny      { letter-spacing: .006em; }
  .kicker span       { letter-spacing: .075em; }
  .fcard__name,
  .plan__name,
  .market__num       { letter-spacing: -.028em; }
  .advc p, .prob p,
  .srv > p, .aud p   { letter-spacing: .003em; }
}

/* çox kiçik ekranlarda daha da yumşaq */
@media (max-width: 380px) {
  .h-hero { font-size: 1.66rem; letter-spacing: -.02em; }
  .h-sec, .h-sec--caps { font-size: 1.38rem; }
  :root { --pad-x: 15px; }
}

/* ═══ 4. TƏHLÜKƏSİZ SAHƏ — çərçivəsiz telefonlar (notch / home bar) ═════ */
@supports (padding: env(safe-area-inset-bottom)) {
  .fabstack     { bottom: calc(12px + env(safe-area-inset-bottom)); }
  .toasts       { bottom: calc(12px + env(safe-area-inset-bottom)); }
  .sound-toggle { bottom: calc(88px + env(safe-area-inset-bottom)); }
  .chatpop      { bottom: calc(70px + env(safe-area-inset-bottom)); }
  .drawer       { padding-bottom: calc(36px + env(safe-area-inset-bottom)); }
  .shell        { padding-left: max(var(--pad-x), env(safe-area-inset-left));
                  padding-right: max(var(--pad-x), env(safe-area-inset-right)); }
}

/* ═══ 5. SÜRÜŞMƏ DAVRANIŞI ═════════════════════════════════════════════
   Panel içində sürüşmə səhifəni sürüşdürməsin (scroll chaining).        */
.chat__body, .slots, .modal__panel, .drawer, .rev-grid {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.modal.open, .drawer.open { overscroll-behavior: none; }

/* ═══ 6. ÜZƏN CHROME — məzmun altından keçir ════════════════════════════
   Apple: sərt ayırıcı xətt yerinə yumşaq keçid.                          */
.nav::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 76px;
  background: linear-gradient(180deg, var(--white) 34%, rgba(255, 255, 255, 0));
  pointer-events: none;
  z-index: -1;
}

/* ═══ 7. MATERİAL — şəffaflıq dərinlik yaradır ═════════════════════════ */
.nav__pill {
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  backdrop-filter: blur(18px) saturate(180%);
  border-top-color: rgba(255, 255, 255, .9);   /* işığı tutan üst kənar */
}
.chatpop, .modal__panel {
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  backdrop-filter: blur(20px) saturate(160%);
}

/* ═══ 8. MOBİL — daha aydın və rahat ═══════════════════════════════════ */
@media (max-width: 680px) {

  /* nav: yüngül və qısa */
  .nav__pill { padding: 8px 14px; border-radius: 15px; margin-block: 10px; }
  .brand img { height: 24px; }
  .burger { border-radius: 12px; }

  /* bölmə ritmi — Apple sadəlik: az element, çox nəfəs */
  .sec { padding-block: 50px; }
  .sec-head { margin-bottom: 4px; }

  /* kartlar arasında bərabər boşluq */
  .prob-grid, .adv-grid, .srv-grid, .aud-grid { gap: 12px; }

  /* CTA-lar başparmaq zonasında rahat olsun */
  .btn-brand, .btn-soft, .btn-cta, .btn-pill { min-height: 50px; border-radius: 14px; }
  .btn-cta { font-size: .92rem; padding: 15px 22px; }

  /* uzun sətirlər qırılmasın */
  .market__num, .plan__price b, .fbar b { white-space: nowrap; }

  /* modal telefonda «sheet» kimi aşağıdan qalxsın */
  .modal { align-items: flex-end; padding: 0; }
  .modal__panel {
    width: 100%; max-height: 92vh;
    border-radius: 22px 22px 0 0;
    transform: translateY(24px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .modal.open .modal__panel { transform: none; }
  .modal__x { top: 10px; right: 10px; }
  /* sheet üçün tutacaq */
  .modal__panel::before {
    content: '';
    position: sticky; top: 8px; z-index: 4;
    display: block; width: 38px; height: 4px;
    margin: 8px auto -4px;
    border-radius: 99px; background: var(--line);
  }
}

/* ═══ 9. ƏLÇATANLIQ — istifadəçinin ayarlarına hörmət ══════════════════ */

/* şəffaflığı azalt */
@media (prefers-reduced-transparency: reduce) {
  .nav__pill    { background: var(--white); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .chatpop,
  .modal__panel { backdrop-filter: none; -webkit-backdrop-filter: none; }
  .modal__veil  { backdrop-filter: none; background: rgba(23, 29, 44, .72); }
  .fcard__live  { backdrop-filter: none; background: #fff; }
  .glow         { display: none; }
}

/* kontrastı artır */
@media (prefers-contrast: more) {
  :root { --line: #98A1B2; --ink-muted: #3C4557; --line-soft2: rgba(23,29,44,.2); }
  .card, .advc, .plan, .prob, .module, .faq-item,
  .market, .fcard, .srv, .chat, .fbar, .vs { border-width: 1.5px; }
  .btn-soft { border-width: 1.5px; }
  .glow { display: none; }
}

/* hərəkəti azalt — Apple: hərəkət yox, amma geribildiriş qalır */
@media (prefers-reduced-motion: reduce) {
  .anim-float, .anim-float-slow,
  .claim::after, .fcard__photo::after,
  .advc.in .advc__ico::after,
  .advc.in .route__line, .advc.in .route__dot,
  .eq i, .fab::before, .aifab.nudge::after,
  .marquee__track, .preload__mark {
    animation: none !important;
  }
  .fcard.in .fcard__photo img, .fcard.in .fcard__mono { animation: none !important; transform: none !important; }
  /* geribildiriş qalır — sadəcə miqyas əvəzinə opaklıq */
  .btn-brand:active, .btn-soft:active, .btn-cta:active,
  .btn-pill:active, .nav__btn:active { transform: none; opacity: .8; }
}

/* ═══ 10. DYNAMIC TYPE — istifadəçinin şrift ölçüsünə uyğunlaş ═════════ */
body { font-size: 1rem; }   /* px deyil — brauzer ayarı ilə böyüyür */