.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS */<!--
============================================================
VIBECANO — MOBILE TAP / CLICK FIX (site-wide)
Paste once in Elementor → Site Settings → Custom Code
(or Theme Builder Footer / a global Custom HTML widget).

DOES NOT change layout, colors, or desktop hover design.
Fixes single-tap navigation on touch devices only.

ROOT CAUSE (audited on vibecano.com):
1. Unscoped :hover rules on cards/tiles (image swap, lift, shade)
   → iOS/WebKit treats 1st tap as :hover, 2nd tap as navigation.
2. Hover-gated controls (.vc-ff__icon / .vc-ff__panel use
   pointer-events:none until :hover) — partial mobile overrides
   existed, but unscoped hover image-swap still remained.
3. Closed .vc-hd-drawer kept pointer-events:auto while off-canvas.
4. Entrance state .vc-ff__card { opacity:0 } until .is-visible —
   delayed / missed IntersectionObserver → “dead” first taps.

============================================================
-->
<style id="vc-mobile-tap-fix">
  /* Instant taps — remove 300ms heuristics where still present */
  a,
  button,
  [role="button"],
  .vc-ff__card,
  .vc-col-card,
  .vc-hx__tile,
  .vc-hx__grid-card,
  .vc-lux-hero__btn,
  .vc-hd-nav-link,
  .vc-hd-pill,
  .vc-ft__links a,
  .vc-ff__media-link,
  .vc-ff__name,
  .vc-ff__mobile-cta,
  .vc-ff__filter,
  .vc-col__pill {
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
  }

  /* Closed mobile drawer must never intercept page taps */
  .vc-hd-drawer {
    pointer-events: none !important;
  }
  .vc-hd.is-drawer-open .vc-hd-drawer,
  body.vc-hd-drawer-open .vc-hd-drawer {
    pointer-events: auto !important;
  }

  /*
    Touch / coarse pointer: neutralize sticky-hover behavior.
    Desktop mouse hover is unchanged (rules below do not apply).
  */
  @media (hover: none), (pointer: coarse) {
    /* Featured product cards — no hover image swap / panel gate */
    .vc-ff__card:hover .vc-ff__img--primary,
    .vc-ff__card.has-second:hover .vc-ff__img--primary,
    .vc-ff__card:focus-within .vc-ff__img--primary,
    .vc-ff__card.has-second:focus-within .vc-ff__img--primary {
      opacity: 1 !important;
      transform: none !important;
    }
    .vc-ff__card:hover .vc-ff__img--secondary,
    .vc-ff__card:focus-within .vc-ff__img--secondary {
      opacity: 0 !important;
      transform: none !important;
    }
    .vc-ff__card:hover .vc-ff__media,
    .vc-ff__card:focus-within .vc-ff__media,
    .vc-ff__card.is-open .vc-ff__media {
      transform: none !important;
      box-shadow: none !important;
    }
    .vc-ff__panel {
      display: none !important;
      pointer-events: none !important;
    }
    .vc-ff__icon,
    .vc-ff__size,
    .vc-ff__add,
    .vc-ff__qv-btn,
    .vc-ff__mobile-cta {
      opacity: 1 !important;
      transform: none !important;
      pointer-events: auto !important;
    }
    .vc-ff__mobile-cta {
      display: block !important;
    }

    /* Category / collection / hero tiles — no hover-lift / image zoom */
    .vc-col-card:hover,
    .vc-col-card:focus-visible,
    .vc-hx__tile:hover,
    .vc-hx__tile:focus-visible,
    .vc-hx__grid-card:hover,
    .vc-hx__tile--new:hover,
    .vc-col__pill:hover,
    .vc-col__pill:focus-visible {
      transform: none !important;
      box-shadow: none !important;
    }
    .vc-col-card:hover .vc-col-card__media img,
    .vc-col-card:focus-visible .vc-col-card__media img,
    .vc-hx__tile:hover .vc-hx__tile-media img,
    .vc-hx__tile:focus-visible .vc-hx__tile-media img,
    .vc-hx__grid-card:hover img,
    .vc-hd-mega-card:hover img {
      transform: none !important;
    }
    .vc-col-card:hover .vc-col-card__shade,
    .vc-col-card:focus-visible .vc-col-card__shade,
    .vc-hx__tile:hover .vc-hx__tile-shade,
    .vc-hx__tile:focus-visible .vc-hx__tile-shade {
      /* keep readable gradient; do not require a second tap */
      background: linear-gradient(
        180deg,
        transparent 35%,
        rgba(17, 17, 19, 0.55) 100%
      ) !important;
    }

    /* Never leave entrance cards untappable */
    .vc-ff__card {
      opacity: 1 !important;
      transform: none !important;
      pointer-events: auto !important;
    }
  }
</style>

<script>
(function () {
  "use strict";
  if (window.__vcTapFix) return;
  window.__vcTapFix = 1;

  /* Ensure featured cards become interactive even if IO is late */
  function revealCards(root) {
    if (!root) return;
    var cards = root.querySelectorAll(".vc-ff__card:not(.is-visible)");
    for (var i = 0; i < cards.length; i++) {
      cards[i].classList.add("is-visible");
    }
  }

  function boot() {
    revealCards(document.querySelector(".vc-ff"));
    /* Re-run after late Elementor / Store API renders */
    setTimeout(function () {
      revealCards(document.querySelector(".vc-ff"));
    }, 1200);
  }

  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", boot);
  } else {
    boot();
  }
})();
</script>/* End custom CSS */