/* ==========================================================================
   WS Liquid Glass v1.0 — websergeon.com
   --------------------------------------------------------------------------
   Subtle Apple-style liquid-glass SURFACE treatment only.
   - Original colors, layout, spacing, typography, content: 100% preserved.
   - No background-color replacements: translucency is derived from the
     theme's own colors via color-mix (with safe fallbacks).
   - Lightweight: a few backdrop-filters (dropdowns/drawer/overlay) + static
     hairlines, inset highlights and soft shadows everywhere else.
   - Deactivate the "WS Liquid Glass" plugin to revert instantly.
   ========================================================================== */

/* ---------- 1. Sticky header: theme already has blur(20px); add only a
   hairline separation so the glass edge reads crisply when stuck. ---------- */
#site-header.sticky-header.scrolled {
  border-bottom: 1px solid rgb(255 255 255 / .09);
}

/* ---------- 2. Nav dropdowns -> frosted glass panels ----------
   Keep the theme's own panel color, just make it translucent. */
#site-header .elementskit-dropdown.elementskit-submenu-panel,
.elementskit-menu-container .elementskit-dropdown.elementskit-submenu-panel {
  background-color: rgb(10 1 24 / .9); /* fallback if color-mix unsupported */
  background-color: color-mix(in srgb, var(--e-global-color-primary) 88%, transparent);
  -webkit-backdrop-filter: blur(18px) saturate(1.25);
  backdrop-filter: blur(18px) saturate(1.25);
  border: 1px solid rgb(255 255 255 / .14);
  border-radius: 14px;
  box-shadow: 0 24px 48px -12px rgb(0 0 0 / .55),
              inset 0 1px 0 rgb(255 255 255 / .08);
}

/* ---------- 3. Gold CTA buttons -> glass gloss ----------
   Backgrounds/gradients untouched; only light + shadow surface. */
a.elementskit-btn.whitespace--normal,
.elementor-button {
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .45),
              inset 0 -3px 8px rgb(0 0 0 / .14),
              0 10px 24px -10px rgb(252 208 59 / .5);
}
a.elementskit-btn.whitespace--normal:hover,
.elementor-button:hover {
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .55),
              inset 0 -3px 8px rgb(0 0 0 / .12),
              0 14px 28px -10px rgb(252 208 59 / .6);
}

/* ---------- 4. Service icon-box cards -> glass tiles ----------
   No background or color changes; hairline + inner light + soft shadow. */
.elementor-widget-icon-box .elementor-icon-box-wrapper {
  border: 1px solid rgb(255 255 255 / .1);
  border-radius: 18px;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .08),
              0 20px 40px -24px rgb(0 0 0 / .6);
}

/* ---------- 5. Testimonial cards -> glass tiles ---------- */
.elementskit-single-testimonial-slider {
  border: 1px solid rgb(255 255 255 / .1);
  border-radius: 18px;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .08),
              0 20px 40px -24px rgb(0 0 0 / .6);
}

/* ---------- 6. Mobile drawer + overlay -> frosted glass ---------- */
@media (max-width: 1024px) {
  #ekit-megamenu-main-menu.elementskit-menu-container {
    background-color: rgb(10 1 24 / .9); /* fallback */
    background-color: color-mix(in srgb, var(--e-global-color-primary) 90%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.25);
    backdrop-filter: blur(20px) saturate(1.25);
    border-right: 1px solid rgb(255 255 255 / .1);
    box-shadow: 24px 0 48px -12px rgb(0 0 0 / .55);
  }
}
.elementskit-menu-overlay.elementskit-menu-offcanvas-elements {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

/* ---------- 7. Footer CTA banner button already covered by .elementor-button
   gloss above; banner backgrounds intentionally untouched. ---------- */

/* ---------- 8. Safety: never let glass break layout or readability ---------- */
#site-header .elementskit-dropdown.elementskit-submenu-panel a,
#ekit-megamenu-main-menu a {
  text-shadow: 0 1px 2px rgb(0 0 0 / .35); /* keeps text crisp over blur */
}

@media (prefers-reduced-motion: reduce) {
  a.elementskit-btn.whitespace--normal,
  .elementor-button {
    transition: none;
  }
}
