/* ════════════════════════════════════════════════════════════════════
   ZupiChat Deepotsav — PREMIUM HEADER MODULE (zdl-hdr.css)
   Alag module, alag root class: html.zdl-hdr. Revert ke teen raaste:
     1) URL me ?hdr=off            — sirf us visit ke liye
     2) bash /root/zdl-hdr-revert.sh — sab pages se hatao (rebuild)
     3) bash /root/zdl-hdr-restore.sh — wapas lagao
   Main theme (zdl.css/zdl.js) is file ke bina bhi poori chalti hai.

   Kya hai: (1) floating liquid-glass island header, (2) upar launch
   ribbon + live countdown, (3) bade nav + sliding glass pill + active
   bindu, (4) glass mega-menu, (5) badi screen par sahi chaudai,
   (6) CTA cluster — glass Login + gold Start Free (sheen).
   ════════════════════════════════════════════════════════════════════ */

/* island ke upar-neeche ki khaali jagah me site ka thanda grey (#f8fafc)
   dikhta tha — garam ivory */
html.zdl-hdr body:not(#_) { background-color: #FFFCF6 !important; }

/* ── (2) launch ribbon ────────────────────────────────────────────── */
html.zdl-hdr .zdl-ribbon {
  position: relative; z-index: 1001; display: flex; align-items: center; justify-content: center; gap: 16px;
  min-height: 40px; padding: 8px 48px; font-size: 13px; line-height: 1.3; text-align: center;
  color: var(--zdl-ink, #10262A);
  background:
    linear-gradient(90deg, rgba(255, 233, 186, .85), rgba(255, 249, 236, .9) 30%, rgba(255, 249, 236, .9) 70%, rgba(255, 233, 186, .85));
  box-shadow: inset 0 -1px 0 rgba(184, 134, 47, .28), inset 0 1px 0 rgba(255, 255, 255, .9);
}
html.zdl-hdr .zdl-ribbon::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, .7) 50%, rgba(255, 255, 255, 0) 60%) no-repeat;
  background-size: 300% 100%; background-position: 150% 0;
  animation: zdl-rib-sheen 7s ease-in-out infinite;
}
@keyframes zdl-rib-sheen { 0%, 60% { background-position: 150% 0; } 100% { background-position: -50% 0; } }
html.zdl-hdr .zdl-ribbon > * { position: relative; z-index: 1; }
html.zdl-hdr .zdl-rib-ed:not(#_) {
  font: italic 600 17px/1 var(--zdl-serif, Georgia, serif);
  background-image: linear-gradient(180deg, #D9AC5E, #8A5F1A); -webkit-background-clip: text; background-clip: text;
  color: transparent !important; -webkit-text-fill-color: transparent !important;
}
html.zdl-hdr .zdl-rib-sep { width: 4px; height: 4px; border-radius: 50%; background: #C9973B; opacity: .7; flex: none; }
html.zdl-hdr .zdl-rib-cd:not(#_) { color: var(--zdl-ink, #10262A) !important; }
html.zdl-hdr .zdl-rib-cd i, html.zdl-hdr .zdl-rib-ed i { font-style: inherit; }
html.zdl-hdr .zdl-rib-cd b:not(#_) {
  display: inline-block; min-width: 86px; margin-left: 4px; padding: 2px 8px; border-radius: 999px;
  font-weight: 700; font-variant-numeric: tabular-nums; color: #7A5216 !important; -webkit-text-fill-color: #7A5216 !important;
  background: rgba(255, 255, 255, .7); box-shadow: inset 0 0 0 1px rgba(184, 134, 47, .3);
}
html.zdl-hdr .zdl-rib-trust:not(#_) { color: rgba(16, 38, 42, .62) !important; }
html.zdl-hdr .zdl-rib-cta:not(#_) {
  font-weight: 700; color: #0A474C !important; -webkit-text-fill-color: #0A474C !important;
  text-decoration: none !important; border-bottom: 1px solid rgba(10, 71, 76, .35); padding-bottom: 1px;
  transition: border-color 180ms ease-out;
}
html.zdl-hdr .zdl-rib-cta:not(#_):hover { border-color: #0A474C; }
html.zdl-hdr .zdl-rib-cta:not(#_):focus-visible { outline: 2px solid #0A474C; outline-offset: 3px; border-radius: 4px; }
html.zdl-hdr .zdl-rib-x {
  position: absolute; right: 8px; top: 50%; width: 32px; height: 32px; margin-top: -16px; border: 0; border-radius: 50%;
  display: grid; place-items: center; cursor: pointer; background: transparent; color: rgba(16, 38, 42, .55);
  font-size: 18px; line-height: 1; transition: background-color 180ms ease-out, color 180ms ease-out;
}
html.zdl-hdr .zdl-rib-x:hover { background: rgba(255, 255, 255, .7); color: #10262A; }
html.zdl-hdr .zdl-rib-x:active { transform: scale(.94); }
html.zdl-hdr .zdl-rib-x:focus-visible { outline: 2px solid #0A474C; outline-offset: 2px; }

/* header ka kaanch — alag layer (desktop + mobile dono) */
html.zdl-hdr .zdl-hdr-bg {
  position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background-color: rgba(255, 253, 248, .66);
  background-image:
    radial-gradient(120% 120% at 0% 0%, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 40%),
    linear-gradient(180deg, rgba(255, 255, 255, .5), rgba(255, 255, 255, .14));
  -webkit-backdrop-filter: blur(24px) saturate(1.9); backdrop-filter: blur(24px) saturate(1.9);
  transition: background-color .3s ease-out;
}

/* ── (1)+(5) floating island ──────────────────────────────────────── */
@media (min-width: 992px) {
  html.zdl-hdr header.zc-header:not(#_):not(#_) {
    top: 12px !important; margin: 12px auto 0 !important;
    width: calc(100% - 48px); max-width: 1320px;
    border-radius: 22px !important;
    border: 1px solid rgba(255, 255, 255, .85) !important;
    /* kaanch .zdl-hdr-bg layer par — header khud saaf, taaki backdrop root na bane */
    background: transparent !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(184, 134, 47, .14),
      0 1px 2px rgba(120, 84, 24, .08), 0 12px 32px -14px rgba(120, 84, 24, .32), 0 30px 60px -40px rgba(184, 134, 47, .35) !important;
    transition: max-width .35s cubic-bezier(.22, .8, .24, 1), background-color .3s ease-out, box-shadow .3s ease-out !important;
  }
  html.zdl-hdr header.zc-header .container:not(#_) { max-width: none !important; width: 100% !important; padding: 0 24px !important; }
  html.zdl-hdr header.zc-header .zc-nav-inner:not(#_) { height: 68px !important; transition: height .3s cubic-bezier(.22, .8, .24, 1); }
  /* toran island ke neeche, gol kinaron ke andar */
  html.zdl-hdr header.zc-header .zdl-toran:not(#_) { left: 28px; right: 28px; transition: opacity .3s ease-out; }
  /* scroll par compact: patla island, toran sone ki ek rekha */
  html.zdl-hdr header.zc-header.zdl-compact:not(#_):not(#_) { max-width: 1180px; }
  html.zdl-hdr header.zc-header.zdl-compact .zdl-hdr-bg { background-color: rgba(255, 253, 248, .8); }
  html.zdl-hdr header.zc-header.zdl-compact .zc-nav-inner:not(#_):not(#_) { height: 58px !important; }
  html.zdl-hdr header.zc-header.zdl-compact .zdl-toran:not(#_) { opacity: 0; }
  html.zdl-hdr header.zc-header .zdl-hdr-line {
    position: absolute; left: 40px; right: 40px; bottom: -1px; height: 1px; pointer-events: none;
    background: linear-gradient(90deg, rgba(226, 182, 92, 0), rgba(226, 182, 92, .85), rgba(226, 182, 92, 0));
    opacity: 0; transition: opacity .3s ease-out;
  }
  html.zdl-hdr header.zc-header.zdl-compact .zdl-hdr-line { opacity: 1; }
  html.zdl-hdr header.zc-header .zc-brand img:not(#_) { transition: height .3s cubic-bezier(.22, .8, .24, 1); }
  html.zdl-hdr header.zc-header.zdl-compact .zc-brand img:not(#_) { height: 34px; width: auto; }
}

/* ── (3) nav: bada text, sliding glass pill, active bindu ──────────── */
@media (min-width: 992px) {
  html.zdl-hdr .zc-nav-links:not(#_) { position: relative; }
  html.zdl-hdr .zc-nav-link:not(#_) {
    position: relative; z-index: 1; font-size: 15px !important; font-weight: 600 !important; letter-spacing: -.005em;
    padding: 10px 14px !important; border-radius: 999px;
    color: rgba(16, 38, 42, .8) !important; -webkit-text-fill-color: currentcolor !important;
    background: transparent !important;
    transition: color 180ms ease-out !important;
  }
  html.zdl-hdr .zc-nav-link:not(#_):hover,
  html.zdl-hdr .zc-nav-link.active:not(#_) { color: #10262A !important; }
  /* site ki apni kaali hover-underline (::after) — pill uski jagah leti hai */
  html.zdl-hdr .zc-nav-link:not(.active):not(#_)::after { content: none !important; display: none !important; }
  html.zdl-hdr .zc-nav-link.active:not(#_)::after {
    content: "" !important; position: absolute !important; left: 50% !important; right: auto !important; bottom: 1px !important; top: auto !important;
    width: 5px !important; height: 5px !important; margin-left: -2.5px; border-radius: 50% !important; transform: none !important; opacity: 1 !important;
    background: radial-gradient(circle at 35% 35%, #FFE7A8, #B8862F) !important; box-shadow: 0 0 6px rgba(226, 182, 92, .8) !important;
  }
  html.zdl-hdr .zc-nav-link:not(#_):focus-visible { outline: 2px solid #0A474C; outline-offset: 2px; }
  html.zdl-hdr .zdl-navpill {
    position: absolute; z-index: 0; left: 0; top: 0; height: 40px; width: 60px; border-radius: 999px; pointer-events: none;
    /* safed header par safed pill dikhti nahi thi — halka sona tint */
    background:
      radial-gradient(120% 100% at 30% 0%, rgba(255, 255, 255, .95), rgba(255, 255, 255, 0) 60%),
      linear-gradient(180deg, rgba(255, 236, 190, .75), rgba(239, 203, 126, .45));
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(184, 134, 47, .2), 0 0 0 1px rgba(226, 182, 92, .5), 0 6px 16px -8px rgba(184, 134, 47, .55);
    opacity: 0; transition: opacity .2s ease-out;
  }
  html.zdl-hdr .zdl-navpill.on { opacity: 1; }
  @media (prefers-reduced-motion: no-preference) {
    html.zdl-hdr .zdl-navpill { transition: opacity .2s ease-out, transform .32s cubic-bezier(.22, .8, .24, 1), width .32s cubic-bezier(.22, .8, .24, 1); }
  }
  /* refer pill — glass */
  html.zdl-hdr .zc-refer-pill:not(#_) {
    background: rgba(255, 255, 255, .55) !important; box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(226, 182, 92, .35) !important; border: 0 !important;
  }
  html.zdl-hdr .zc-refer-pill i:not(#_) { color: #B8862F !important; -webkit-text-fill-color: #B8862F !important; }
}

/* ── (4) glass mega-menu ──────────────────────────────────────────── */
/* asli liquid glass — header ab backdrop root nahi (kaanch .zdl-hdr-bg par),
   isliye ye blur seedha page ko dhundhla karta hai */
html.zdl-hdr .zc-dropdown:not(#_):not(#_) {
  border-radius: 22px !important; padding: 12px 8px 8px !important;
  border: 1px solid rgba(255, 255, 255, .85) !important;
  background-color: rgba(255, 253, 248, .52) !important;
  background-image:
    radial-gradient(90% 60% at 0% 0%, rgba(255, 255, 255, .8) 0%, rgba(255, 255, 255, 0) 55%),
    radial-gradient(60% 50% at 100% 100%, rgba(255, 214, 150, .3) 0%, rgba(255, 214, 150, 0) 70%),
    linear-gradient(160deg, rgba(255, 255, 255, .4), rgba(255, 255, 255, .1)) !important;
  -webkit-backdrop-filter: blur(32px) saturate(2) !important; backdrop-filter: blur(32px) saturate(2) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 0 0 1px rgba(255, 255, 255, .45), inset 0 -1px 0 rgba(184, 134, 47, .16),
    0 0 0 1px rgba(184, 134, 47, .12), 0 28px 60px -24px rgba(120, 84, 24, .45) !important;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html.zdl-hdr .zc-dropdown:not(#_):not(#_) { background-color: rgba(255, 253, 248, .97) !important; }
}
html.zdl-hdr .zc-dropdown .zc-di-icon:not(#_) { background-color: rgba(255, 255, 255, .7) !important; }
html.zdl-hdr .zc-dropdown-section-label:not(#_) {
  padding: 4px 16px 8px !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .18em !important;
  text-transform: uppercase; color: #B8862F !important; -webkit-text-fill-color: #B8862F !important;
}
html.zdl-hdr .zc-dropdown-item:not(#_) {
  border-radius: 14px !important; padding: 10px 12px !important; background: transparent !important;
  transition: background-color 180ms ease-out, box-shadow 180ms ease-out !important;
}
html.zdl-hdr .zc-dropdown-item:not(#_):hover,
html.zdl-hdr .zc-dropdown-item:not(#_):focus-visible {
  background: rgba(255, 255, 255, .85) !important;
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(226, 182, 92, .3), 0 8px 18px -12px rgba(120, 84, 24, .4) !important;
}
html.zdl-hdr .zc-di-icon:not(#_) {
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 0 0 1px rgba(16, 38, 42, .05), 0 4px 10px -6px rgba(16, 38, 42, .3) !important;
}
html.zdl-hdr .zc-di-title:not(#_) { font-weight: 700 !important; color: #10262A !important; -webkit-text-fill-color: #10262A !important; }
html.zdl-hdr .zc-di-desc:not(#_) { color: rgba(16, 38, 42, .6) !important; -webkit-text-fill-color: rgba(16, 38, 42, .6) !important; }
html.zdl-hdr .zc-dropdown-footer:not(#_) {
  margin-top: 8px !important; padding: 12px 16px 4px !important; border-top: 1px solid rgba(184, 134, 47, .2) !important; background: transparent !important;
}
html.zdl-hdr .zc-dropdown-footer a:not(#_) { color: #8A5F1A !important; -webkit-text-fill-color: #8A5F1A !important; font-weight: 600 !important; }
html.zdl-hdr .zc-dropdown-footer a:not(#_):hover { color: #0A474C !important; -webkit-text-fill-color: #0A474C !important; }

/* ── (6) CTA cluster ──────────────────────────────────────────────── */
html.zdl-hdr .zc-nav-cta .zc-btn-login:not(#_) {
  display: inline-flex; align-items: center; min-height: 42px; padding: 0 20px !important; border-radius: 999px !important;
  font-size: 14px !important; font-weight: 700 !important;
  color: #10262A !important; -webkit-text-fill-color: #10262A !important;
  background: rgba(255, 255, 255, .6) !important; border: 0 !important;
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(16, 38, 42, .12), 0 4px 12px -8px rgba(16, 38, 42, .3) !important;
  transition: box-shadow 180ms ease-out, background-color 180ms ease-out, transform 180ms ease-out !important;
}
html.zdl-hdr .zc-nav-cta .zc-btn-login:not(#_):hover { background: rgba(255, 255, 255, .9) !important; box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(226, 182, 92, .55), 0 8px 18px -10px rgba(184, 134, 47, .5) !important; }
html.zdl-hdr .zc-nav-cta .zc-btn-login:not(#_):active { transform: scale(.98); }
html.zdl-hdr .zc-nav-cta .zc-btn-signup:not(#_) {
  display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 22px !important; border-radius: 999px !important;
  font-size: 14px !important; font-weight: 800 !important;
}
/* har 5s ek chamak — dhyaan khinchne wala, chillane wala nahi */
html.zdl-hdr .zc-nav-cta .zc-btn-signup.zdl-btn-gold::after { animation: zdl-cta-sheen 5s ease-in-out infinite; }
@keyframes zdl-cta-sheen { 0%, 70% { background-position: 130% 0; } 100% { background-position: -30% 0; } }

/* ── mobile ───────────────────────────────────────────────────────── */
@media (max-width: 991px) {
  html.zdl-hdr header.zc-header:not(#_):not(#_) {
    top: 8px !important; margin: 8px 8px 0 !important; border-radius: 18px !important;
    border: 1px solid rgba(255, 255, 255, .85) !important;
    background: transparent !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
    box-shadow: inset 0 1px 0 #fff, 0 8px 24px -14px rgba(120, 84, 24, .35) !important;
  }
  html.zdl-hdr .zdl-hdr-bg { background-color: rgba(255, 253, 248, .86); -webkit-backdrop-filter: blur(14px) saturate(1.6); backdrop-filter: blur(14px) saturate(1.6); }
  html.zdl-hdr header.zc-header .zdl-toran:not(#_) { left: 16px; right: 16px; }
  html.zdl-hdr .zdl-ribbon { gap: 8px; padding: 8px 40px 8px 12px; font-size: 12px; flex-wrap: nowrap; white-space: nowrap; }
  html.zdl-hdr :is(.zdl-rib-trust, .zdl-rib-sep.t, .zdl-rib-long) { display: none; }
  html.zdl-hdr .zdl-rib-ed:not(#_) { font-size: 15px; }
  html.zdl-hdr .zdl-rib-cd b:not(#_) { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html.zdl-hdr .zdl-ribbon::after { animation-duration: 12s; }
}

/* ── (7) LIQUID MENU — iOS jaisa paani ka kaanch (sirf desktop) ──────────
   zdl-hdr.js liquidMenu(): .zdl-lq class, hover "boond" (.zdl-lens), cursor
   ki roshni (--mx/--my), aur Chromium par kinaaron ka refraction (SVG
   displacement, data-lq). Site ka CSS dropdown par `transition:none !important`
   lagata hai — isliye yahan har transition !important + :not(#_) ke saath. */
@media (min-width: 992px) {
  html.zdl-hdr .zc-dropdown.zdl-lq:not(#_):not(#_) {
    border: 0 !important; border-radius: 26px !important;
    background-color: rgba(255, 252, 246, .4) !important;
    background-image:
      radial-gradient(260px 200px at var(--mx, 24%) var(--my, 0%), rgba(255, 255, 255, .6), rgba(255, 255, 255, 0) 70%),
      radial-gradient(70% 50% at 100% 100%, rgba(255, 206, 140, .22), rgba(255, 206, 140, 0) 70%),
      linear-gradient(165deg, rgba(255, 255, 255, .5), rgba(255, 255, 255, .12) 45%, rgba(255, 255, 255, .28)) !important;
    -webkit-backdrop-filter: blur(14px) saturate(2.1) brightness(1.04) !important; backdrop-filter: blur(14px) saturate(2.1) brightness(1.04) !important;
    box-shadow:
      inset 0 1.5px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(255, 255, 255, .5),
      inset 1px 0 0 rgba(255, 255, 255, .6), inset -1px 0 0 rgba(255, 255, 255, .35),
      inset 0 0 24px rgba(255, 255, 255, .35), 0 0 0 .5px rgba(160, 120, 50, .22),
      0 2px 6px -2px rgba(120, 84, 24, .18), 0 30px 70px -28px rgba(120, 84, 24, .5) !important;
    transform-origin: 50% 0 !important;
    transform: translateX(-50%) translateY(-10px) scale(.94, .86) !important;
    transition: opacity .2s ease-out .14s, transform .3s cubic-bezier(.4, 0, .2, 1) .14s, visibility 0s linear .44s !important;
  }
  /* khulna: jelly spring — halka sa aage nikal ke wapas baithta hai */
  html.zdl-hdr .zc-nav-item:hover > .zc-dropdown.zdl-lq:not(#_):not(#_) {
    transform: translateX(-50%) translateY(0) scale(1) !important;
    transition: opacity .2s ease-out .04s, transform .62s cubic-bezier(.32, 1.42, .48, 1) .04s, visibility 0s !important;
  }
  /* kinaaron ka refraction — piche ka page paani ki tarah mudta hai (Chromium) */
  html.zdl-hdr.zdl-lq-refract .zc-dropdown.zdl-lq[data-lq="0"]:not(#_):not(#_) { -webkit-backdrop-filter: url(#zdl-lq-0) blur(12px) saturate(2.1) brightness(1.04) !important; backdrop-filter: url(#zdl-lq-0) blur(12px) saturate(2.1) brightness(1.04) !important; }
  html.zdl-hdr.zdl-lq-refract .zc-dropdown.zdl-lq[data-lq="1"]:not(#_):not(#_) { -webkit-backdrop-filter: url(#zdl-lq-1) blur(12px) saturate(2.1) brightness(1.04) !important; backdrop-filter: url(#zdl-lq-1) blur(12px) saturate(2.1) brightness(1.04) !important; }
  html.zdl-hdr.zdl-lq-refract .zc-dropdown.zdl-lq[data-lq="2"]:not(#_):not(#_) { -webkit-backdrop-filter: url(#zdl-lq-2) blur(12px) saturate(2.1) brightness(1.04) !important; backdrop-filter: url(#zdl-lq-2) blur(12px) saturate(2.1) brightness(1.04) !important; }
  html.zdl-hdr.zdl-lq-refract .zc-dropdown.zdl-lq[data-lq="3"]:not(#_):not(#_) { -webkit-backdrop-filter: url(#zdl-lq-3) blur(12px) saturate(2.1) brightness(1.04) !important; backdrop-filter: url(#zdl-lq-3) blur(12px) saturate(2.1) brightness(1.04) !important; }
  /* specular rim — upar-baayein aur neeche-daayein chamak, beech me sunehri jhalak */
  html.zdl-hdr .zc-dropdown.zdl-lq:not(#_):not(#_)::before {
    content: "" !important; position: absolute; inset: 0; z-index: 2; pointer-events: none;
    border-radius: inherit; padding: 1.2px;
    background: linear-gradient(135deg, #fff, rgba(255, 255, 255, .2) 28%, rgba(226, 182, 92, .3) 55%, rgba(255, 255, 255, .85));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  }

  /* hover "boond" — ek hi lens jo item se item tak behta hai */
  html.zdl-hdr .zdl-lens {
    position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: 0; pointer-events: none; opacity: 0;
    transition: transform .5s cubic-bezier(.3, 1.32, .5, 1), width .5s cubic-bezier(.3, 1.32, .5, 1), height .5s cubic-bezier(.3, 1.32, .5, 1), opacity .2s ease-out;
  }
  html.zdl-hdr .zdl-lens.on { opacity: 1; }
  html.zdl-hdr .zdl-lens b {
    position: absolute; inset: 0; border-radius: 16px;
    background: linear-gradient(170deg, rgba(255, 255, 255, .94), rgba(255, 255, 255, .62) 55%, rgba(255, 246, 228, .82));
    box-shadow:
      inset 0 1.5px 0 #fff, inset 0 -3px 8px rgba(226, 182, 92, .2), inset 0 0 0 1px rgba(255, 255, 255, .7),
      0 0 0 .5px rgba(184, 134, 47, .3), 0 2px 4px -2px rgba(120, 84, 24, .2), 0 12px 26px -14px rgba(120, 84, 24, .5);
  }
  html.zdl-hdr .zdl-lens b::after {
    content: ""; position: absolute; left: 6%; right: 34%; top: 2px; height: 44%;
    border-radius: 14px 14px 50% 50%; background: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, 0));
  }
  html.zdl-hdr .zdl-lens b.wx { animation: zdl-wob-x .64s cubic-bezier(.3, .7, .4, 1); }
  html.zdl-hdr .zdl-lens b.wy { animation: zdl-wob-y .64s cubic-bezier(.3, .7, .4, 1); }
  @keyframes zdl-wob-x { 0% { transform: scale(1); } 30% { transform: scale(1.07, .88); } 62% { transform: scale(.98, 1.04); } 100% { transform: scale(1); } }
  @keyframes zdl-wob-y { 0% { transform: scale(1); } 30% { transform: scale(.94, 1.12); } 62% { transform: scale(1.02, .97); } 100% { transform: scale(1); } }

  html.zdl-hdr .zc-dropdown.zdl-lq .zc-dropdown-item:not(#_):not(#_),
  html.zdl-hdr .zc-dropdown.zdl-lq .zc-dropdown-item:not(#_):not(#_):hover,
  html.zdl-hdr .zc-dropdown.zdl-lq .zc-dropdown-item:not(#_):not(#_):focus-visible { position: relative; z-index: 1; background: transparent !important; box-shadow: none !important; }
  html.zdl-hdr .zc-dropdown.zdl-lq .zc-dropdown-item:not(#_):not(#_):focus-visible { outline: 2px solid rgba(184, 134, 47, .55); outline-offset: -2px; }
  html.zdl-hdr .zc-dropdown.zdl-lq .zc-di-icon:not(#_):not(#_) { transition: transform .45s cubic-bezier(.3, 1.5, .5, 1), box-shadow .2s ease-out !important; }
  html.zdl-hdr .zc-dropdown.zdl-lq .zc-dropdown-item:hover .zc-di-icon:not(#_):not(#_) {
    transform: translateY(-1px) scale(1.07) !important;
    box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(226, 182, 92, .4), 0 8px 16px -8px rgba(184, 134, 47, .55) !important;
  }

  /* andar ki cheezein ek-ek kar ke tairti aati hain (--i = JS index) */
  html.zdl-hdr .zc-dropdown.zdl-lq :is(.zc-dropdown-item, .zc-dropdown-section-label, .zc-dropdown-footer):not(#_):not(#_) {
    opacity: 0; transform: translateY(8px);
    transition: opacity .16s ease-out, transform .16s ease-out !important;
  }
  html.zdl-hdr .zc-nav-item:hover > .zc-dropdown.zdl-lq :is(.zc-dropdown-item, .zc-dropdown-section-label, .zc-dropdown-footer):not(#_):not(#_) {
    opacity: 1; transform: none;
    transition: opacity .34s ease-out calc(var(--i, 0) * 22ms + 70ms), transform .55s cubic-bezier(.3, 1.3, .5, 1) calc(var(--i, 0) * 22ms + 70ms) !important;
  }
}
@media (min-width: 992px) and (prefers-reduced-motion: reduce) {     /* tier 1: roshni + fade, uchhal nahi */
  html.zdl-hdr .zc-nav-item:hover > .zc-dropdown.zdl-lq:not(#_):not(#_) { transition: opacity .2s ease-out .04s, transform .25s ease-out .04s, visibility 0s !important; }
  html.zdl-hdr .zdl-lens { transition: transform .25s ease-out, width .25s ease-out, height .25s ease-out, opacity .2s ease-out; }
  html.zdl-hdr .zdl-lens b:is(.wx, .wy) { animation: none; }
  html.zdl-hdr .zc-nav-item:hover > .zc-dropdown.zdl-lq :is(.zc-dropdown-item, .zc-dropdown-section-label, .zc-dropdown-footer):not(#_):not(#_) { transition: opacity .25s ease-out !important; transform: none; }
}

/* ── fit: island hamesha content se bada — Start Free bahar na nikle ──
   Bada nav text (15px/14px padding) ko ~1280px chahiye; compact 1180px
   tha → CTA 82px bahar. Compact ab 1260px + links tight; 992–1365 par
   text/padding step-down, 992–1199 par logo + CTA bhi chhote. */
@media (min-width: 992px) {
  html.zdl-hdr header.zc-header.zdl-compact:not(#_):not(#_) { max-width: 1260px; }
  html.zdl-hdr header.zc-header.zdl-compact .zc-nav-link:not(#_) { padding: 10px 11px !important; }
  html.zdl-hdr header.zc-header .zc-nav-cta:not(#_), html.zdl-hdr header.zc-header .zc-brand:not(#_) { flex-shrink: 0; }
  html.zdl-hdr header.zc-header .zc-nav-link:not(#_) { white-space: nowrap; }
}
@media (min-width: 992px) and (max-width: 1365px) {
  html.zdl-hdr .zc-nav-link:not(#_):not(#_) { font-size: 14px !important; padding: 10px 10px !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  html.zdl-hdr header.zc-header:not(#_):not(#_) { width: calc(100% - 32px); }
  html.zdl-hdr header.zc-header .container:not(#_):not(#_) { padding: 0 16px !important; }
  html.zdl-hdr .zc-nav-link:not(#_):not(#_):not(#_) { font-size: 13.5px !important; padding: 8px 8px !important; }
  html.zdl-hdr header.zc-header .zc-brand img:not(#_):not(#_) { height: 30px; width: auto; }
  html.zdl-hdr .zc-nav-cta .zc-btn-login:not(#_):not(#_) { padding: 0 14px !important; font-size: 13px !important; }
  html.zdl-hdr .zc-nav-cta .zc-btn-signup:not(#_):not(#_) { padding: 0 16px !important; font-size: 13px !important; }
}
