.elementor-2210 .elementor-element.elementor-element-f46942b{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:107px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2210 .elementor-element.elementor-element-b4e1bf2{text-align:center;}.elementor-2210 .elementor-element.elementor-element-b4e1bf2 .elementor-heading-title{font-family:"Cormorant Garamond", Sans-serif;font-size:3.815rem;font-weight:600;line-height:1.01572739187em;letter-spacing:-2px;color:var( --e-global-color-primary );}.elementor-2210 .elementor-element.elementor-element-d5a5e52{text-align:center;font-family:"Source Sans Pro", Sans-serif;font-size:0.875rem;line-height:1em;color:var( --e-global-color-9ee04e1 );}.elementor-2210 .elementor-element.elementor-element-39aa7a8{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:64px 0px;--row-gap:64px;--column-gap:0px;--padding-top:64px;--padding-bottom:150px;--padding-left:0px;--padding-right:0px;}.elementor-2210 .elementor-element.elementor-element-e14122b{padding:0px 0px 0px 0px;}.elementor-2210 .elementor-element.elementor-element-e14122b .elementor-nav-menu .elementor-item{font-family:"Source Sans Pro", Sans-serif;font-size:1rem;font-weight:600;}.elementor-2210 .elementor-element.elementor-element-e14122b .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed .elementor-item:before{border-width:1.5px;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-draw .elementor-item:before{border-width:0 0 1.5px 1.5px;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-draw .elementor-item:after{border-width:1.5px 1.5px 0 0;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-corners .elementor-item:before{border-width:1.5px 0 0 1.5px;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-corners .elementor-item:after{border-width:0 1.5px 1.5px 0;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-underline .elementor-item:after,
					 .elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-overline .elementor-item:before,
					 .elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-double-line .elementor-item:before,
					 .elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-double-line .elementor-item:after{height:1.5px;}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product{text-align:center;}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products  ul.products{grid-column-gap:4px;grid-row-gap:100px;}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-primary );}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-primary );}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:"Source Sans Pro", Sans-serif;font-size:0.875rem;font-weight:600;}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-primary );font-family:"Source Sans Pro", Sans-serif;font-size:0.875rem;font-weight:400;}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-primary );}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-primary );}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1200px){.elementor-2210 .elementor-element.elementor-element-b4e1bf2 .elementor-heading-title{font-size:3.051875rem;}.elementor-2210 .elementor-element.elementor-element-d5a5e52{width:var( --container-widget-width, 50ch );max-width:50ch;--container-widget-width:50ch;--container-widget-flex-grow:0;}}@media(max-width:1024px){.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-2210 .elementor-element.elementor-element-f46942b{--padding-top:107px;--padding-bottom:0px;--padding-left:32px;--padding-right:32px;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed .elementor-item:before{border-width:1.5px;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-draw .elementor-item:before{border-width:0 0 1.5px 1.5px;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-draw .elementor-item:after{border-width:1.5px 1.5px 0 0;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-corners .elementor-item:before{border-width:1.5px 0 0 1.5px;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-framed.e--animation-corners .elementor-item:after{border-width:0 1.5px 1.5px 0;}.elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-underline .elementor-item:after,
					 .elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-overline .elementor-item:before,
					 .elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-double-line .elementor-item:before,
					 .elementor-2210 .elementor-element.elementor-element-e14122b .e--pointer-double-line .elementor-item:after{height:1.5px;}.elementor-2210 .elementor-element.elementor-element-1b5665c.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for nav-menu, class: .elementor-element-e14122b *//* =========================================================
   QOB Tabs (Elementor Nav Menu) – CLEAN + WORKING
   - Desktop: shrink to items + baseline under items
   - Mobile: wraps to multiple lines (no overflow)
   - No dropdown clone visible
   ========================================================= */

/* Hide Elementor dropdown clone + toggle */
.qob-tabs .elementor-menu-toggle,
.qob-tabs nav.elementor-nav-menu--dropdown{
  display:none !important;
}

/* Kill Elementor clearfix pseudo-element (can add “ghost space”) */
.qob-tabs ul.elementor-nav-menu:after{
  content:none !important;
  display:none !important;
}

/* Center container */
.qob-tabs .elementor-nav-menu__container{
  display:flex !important;
  justify-content:center !important;
}

/* ---------- DESKTOP (default) ---------- */

/* Shrink-wrap main nav */
.qob-tabs nav.elementor-nav-menu--main.elementor-nav-menu__container{
  display:inline-flex !important;
  width:max-content !important;
  max-width:max-content !important;
  flex:0 0 auto !important;
}

/* UL shrink-wrap + baseline */
.qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu{
  display:inline-flex !important;
  width:max-content !important;
  max-width:max-content !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;

  gap:48px;
  padding:0 !important;
  margin:0 !important;

  border-bottom:1px solid #bfbfbf !important;
}

/* Ensure LI never stretches */
.qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu > li{
  flex:0 0 auto !important;
  width:auto !important;
}

/* Word-width links + underline */
.qob-tabs nav.elementor-nav-menu--main a.elementor-item{
  padding-left:0 !important;
  padding-right:0 !important;
  display:inline-block !important;
  width:max-content !important;
}
.qob-tabs nav.elementor-nav-menu--main.e--pointer-underline a.elementor-item:after{
  left:0 !important;
  right:0 !important;
  width:100% !important;
  transform:none !important;
}

/* Remove any competing baseline from nav pseudo */
.qob-tabs nav.elementor-nav-menu--main::after{
  content:none !important;
}

/* ---------- MOBILE (single-line scroll) ---------- */
@media (max-width: 880px){

  /* Prevent the PAGE from horizontal-scrolling */
  body{
    overflow-x: hidden;
  }

  /* override centering on mobile */
  .qob-tabs .elementor-nav-menu__container{
    justify-content:flex-start !important;
  }

  /* Wrapper full width + allow shrinking */
  .qob-tabs,
  .qob-tabs .elementor-nav-menu__container,
  .qob-tabs nav.elementor-nav-menu--main.elementor-nav-menu__container{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important; /* contain the scroller so page doesn't scroll */
    justify-content:flex-start !important;
  }

  /* UL = the horizontal scroller */
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu{
    width:100% !important;
    max-width:100% !important;

    display:flex !important;
    flex-wrap:nowrap !important;
    white-space:nowrap !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    touch-action:pan-x;

    gap:20px !important;
    padding:0 !important;
    margin:0 !important;

    align-items:flex-end !important;
    border-bottom:1px solid #bfbfbf !important;

    scroll-padding-left:16px;
    scroll-padding-right:16px;
  }

  /* Real spacing without pseudo elements */
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu > li{
    flex:0 0 auto !important;
  }
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu > li:first-child{
    margin-left:16px !important;
  }
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu > li:last-child{
    margin-right:16px !important;
  }

  /* Underline alignment */
  .qob-tabs nav.elementor-nav-menu--main a.elementor-item{
    padding-bottom:10px !important;
  }
  .qob-tabs nav.elementor-nav-menu--main.e--pointer-underline a.elementor-item:after{
    bottom:-1px !important;
  }

  /* Optional: hide scrollbar (still scrolls) */
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu::-webkit-scrollbar{
    display:none;
  }
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu{
    scrollbar-width:none;
  }
}

@media (max-width: 880px){

  /* Keep the page from horizontal scrolling */
  body{ overflow-x: hidden; }

  /* IMPORTANT: don't clip the nav/tab scroller */
  .qob-tabs,
  .qob-tabs .elementor-nav-menu__container,
  .qob-tabs nav.elementor-nav-menu--main.elementor-nav-menu__container{
    overflow: visible !important;   /* <-- this is the key change */
    min-width: 0 !important;
  }

  /* Make sure items start at the left */
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu{
    justify-content: flex-start !important;

    /* real breathing room so first/last tab never gets cut off */
    padding-left: 18px !important;
    padding-right: 18px !important;

    /* if snap is causing weird initial positions */
    scroll-snap-type: none !important;
  }

  /* Undo the first/last margins if you still have them */
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu > li:first-child{
    margin-left: 0 !important;
  }
  .qob-tabs nav.elementor-nav-menu--main > ul.elementor-nav-menu > li:last-child{
    margin-right: 0 !important;
  }
}/* End custom CSS */
/* Start custom CSS for wc-archive-products, class: .elementor-element-1b5665c *//* === Quest of Beard: add-to-cart icon overlay on product image === */
.qob-products .woocommerce ul.products li.product{
  position: relative;
  display: grid;                /* lets us "overlay" items in the same grid cell */
}

/* Make sure the product image/link is the “media layer” */
.qob-products .woocommerce ul.products li.product > a.woocommerce-loop-product__link,
.qob-products .woocommerce ul.products li.product > a.woocommerce-LoopProduct-link{
  grid-row: 1;
  grid-column: 1;
  display: block;
}

/* Put the add-to-cart button in the same grid cell as the image */
.qob-products .woocommerce ul.products li.product > a.button,
.qob-products .woocommerce ul.products li.product > a.add_to_cart_button{
  grid-row: 1;
  grid-column: 1;
  justify-self: end;
  align-self: end;
  z-index: 3;

  /* look & feel */
  display: inline-flex;
  align-items: center;
  gap: 10px;
 font-family: 'Source Sans pro';
 font-size: 0.75rem;
 font-weight: 400;
  height: 44px;
  max-width: 44px;              /* icon-only by default */
  overflow: hidden;
  white-space: nowrap;

  padding: 0 12px;
  margin: 14px;
  border-radius: 4px;

  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  /*box-shadow: 0 8px 24px rgba(0,0,0,.10);*/

  /* hide clipped text in collapsed state */
  color: transparent;

  transition: max-width .22s ease, transform .22s ease, box-shadow .22s ease, color .12s ease;
}

/* Bag icon (SVG) */
.qob-products .woocommerce ul.products li.product > a.button::before,
.qob-products .woocommerce ul.products li.product > a.add_to_cart_button::before{
  content:"";
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  background: center / contain no-repeat url("/wp-content/uploads/2025/12/dp-qob-shopping-card.svg");
  opacity: .9;
}

/* Expand & reveal text on hover (and keyboard focus) */
.qob-products .woocommerce ul.products li.product:hover > a.button,
.qob-products .woocommerce ul.products li.product:focus-within > a.button,
.qob-products .woocommerce ul.products li.product:hover > a.add_to_cart_button,
.qob-products .woocommerce ul.products li.product:focus-within > a.add_to_cart_button{
  max-width: 160px;
  transform: translateY(-2px);
  /*box-shadow: 0 12px 30px rgba(0,0,0,.14);*/
  color: #111;                
}

/* Lift the overlay button into the image area */
.qob-products{
  --qob-footer-h: 105px; /* 👈 adjust: increase = button goes higher */
}

.qob-products .woocommerce ul.products li.product{
  position: relative;
}

/* target the real loop add-to-cart link */
.qob-products .woocommerce ul.products li.product a.add_to_cart_button,
.qob-products .woocommerce ul.products li.product a.product_type_simple,
.qob-products .woocommerce ul.products li.product a.button{
  position: absolute !important;
  right: 16px;
  bottom: calc(var(--qob-footer-h) + 14px);
  z-index: 20;
}


/* Optional: hide the “View cart” link Woo outputs after adding */
.qob-products .woocommerce ul.products li.product a.added_to_cart{
  display: none !important;
}

/* On touch devices (no hover), keep it icon-only */
@media (hover: none){
  .qob-products .woocommerce ul.products li.product > a.button,
  .qob-products .woocommerce ul.products li.product > a.add_to_cart_button{
    max-width: 44px;
    color: transparent;
  }
}


/* Hide everywhere by default */
.woocommerce ul.products .qob-loop-desc{ display:none; }

/* Show only inside your Elementor widget wrapper */
.qob-products .woocommerce ul.products .qob-loop-desc{
  display:block;
  margin-top: 4px;
  color: #a2a2a2;
  line-height: 1;
  font-size: 16px;
}

/* Optional spacing for price */
.qob-products .woocommerce ul.products li.product .price{
  margin-top: 16px;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Cormorant Garamond';
	font-display: auto;
	src: url('https://questofbeard.com/wp-content/uploads/2025/12/CormorantGaramond-VariableFont_wght.ttf') format('truetype');
}
/* End Custom Fonts CSS */