@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,400&display=swap');
#sp-bottom {
  background-color: #2D3540 !important;
}
#sp-bottom a {
    color: #C0D905 !important; /* Change the color to your preference */
}
#sp-footer a { color: #C0D905 !important; /* Change the color to your preference */
}

.overlay-image-button-wrap {
  /*margin-right: 10px;
  margin-left: 10px;
  padding: 0;
  box-shadow: none;
  background: transparent !important;
  margin: 0 !important;
font-color: 200ms, background-color 350ms !important;
background-color: transparent !important;
  color: #f4d2d2 !important;
  */
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.34) !important;
box-shadow: 0px 4px 3px 2px rgba(0, 0, 0, 0.25) !important;
}

/* v=1779508362 */
/* Scale the logo image larger than its container */
/*#sp-header .sp-logo img,
#sp-header [id*="logo"] img,
#sp-header .logoType img {
  transform: scale(1.4);        
  transform-origin: center;
  position: relative;
  z-index: 999;
  padding-left: 27px !important;
  padding-top: 10px !important;
}*/

/* ================================================================
   CUSE CLOUDY CANNABIS - Navigation Menu Responsive Fix
   Fixes: glass pill on mobile/tablet, hamburger alignment, desktop centering
   ================================================================ */

/*@media (max-width: 991.98px) {
  #sp-menu {
    height: auto !important;
    min-height: 80px !important;
    background: transparent !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
  }
  #sp-menu .sp-column,
  #sp-menu .sp-megamenu-wrapper {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100% !important;
    min-height: 80px;
  }
  .sp-megamenu-wrapper #offcanvas-toggler,
  .sp-megamenu-wrapper #offcanvas-toggler .js-menu-toggle {
    height: 80px !important;
    line-height: 80px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
  .sp-megamenu-wrapper #offcanvas-toggler .js-menu-toggle span.lines {
    margin-top: 0 !important;
    position: relative;
    top: auto;
  }
}

@media (min-width: 992px) {
  #sp-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    height: 80px !important;
    padding: 0 !important;
  }
  #sp-menu .sp-column {
    display: flex !important;
    align-items: center;
    width: 100%;
    height: 70px !important;
  }
  #sp-menu .sp-megamenu-wrapper {
    display: flex !important;
    align-items: center;
    width: 100%;
    height: 70px !important;
  }
  #sp-menu .sp-megamenu-parent {
    height: 70px !important;
    display: flex !important;
    align-items: center;
    width: 100%;
  }
  .sp-megamenu-wrapper > .sp-megamenu-parent > li > a {
    height: 70px !important;
    line-height: 70px !important;
  }
}

#sp-header .container > .row {
  align-items: center !important;
}
#sp-header .container > .row > .col-5:first-child,
#sp-header .container > .row > .col-md-5:first-child {
  display: flex !important;
  align-items: center;
}
*/
/**************************************************/

@media only screen and (min-width: 992px) {
.sppb-sp-slider-text, .sppb-sp-slider-title {
  padding-left: 7px !important;
  padding-right: 7px !important;
 }
  #sp-header {
/*padding-top: 5px !important;*/
}
#sp-menu {
   display: flex !important;
height: 80px;
background: rgba(255, 255, 255, 0.2);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
border: 1px solid rgba(255, 255, 255, 0.4);
z-index: +99999;
   
}
}


@media only screen and (max-width: 570px) {
#offcanvas-toggler >i {
 color: #f47363 !important;
}
#offcanvas-toggler {
margin: 5px 0px 0px 0px !important;
padding: 0px !important;
height: 60px !important;
width: 100px !important;
background: rgba(255, 255, 255, 0.2);
border-radius: 12px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
border: 1px solid rgba(255, 255, 255, 0.4);
}

  
  .offcanvas-menu {
   background-color: #2D3540 !important;
    /*background-color: #606C38 !important;*/
}
  .offcanvas-menu li a {
  color: #fff !important;
  text-indent: 15px;
}
.offcanvas-menu li:hover a {
  color: #C0D905 !important;
  }
.offcanvas-menu li:active a {
  color: #e07701 !important;
  }
  }
  /*.offcanvas-menu .nav-child li a,
  .sp-megamenu-parent > li > a
  {
  color: #fff !important;
}

 .sp-module ul > li > a, .sppb-addon-module ul > li > a { 
color: #dft678 !important;
} */

/*.offcanvas .offcanvas-menu .nav-child li a,
.offcanvas .offcanvas-menu .nav-child li .nav-child li a,
.offcanvas .offcanvas-menu .nav-child li .nav-child li .nav-child li a,
}*/


/* =================================================================
   Antler Service-Card Style  →  SP Page Builder EasyStore Products
   ================================================================= */

/* ── 1. Grid: 3 columns with comfortable gap ─────────────────── */
.sppb-collection-addon {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 50px !important;
}
@media (max-width: 991px) {
  .sppb-collection-addon {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 575px) {
  .sppb-collection-addon {
    grid-template-columns: 1fr !important;
  }
}

/* ── 2. Card: white, rounded, shadow ─────────────────────────── */
.sppb-collection-addon > .sppb-collection-item {
  background-color: #101920 !important;
  position: relative;
  padding: 40px;
  border-radius: 12px !important;
  box-shadow: 0 5px 15px 0 rgba(110, 110, 110, 0.1);
  transition: box-shadow 0.3s, transform 0.3s;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.sppb-collection-addon > .sppb-collection-item:hover {
  box-shadow: 0 12px 35px 0 rgba(110, 110, 110, 0.18);
  transform: translateY(-6px);
}

/* ── 3. Title: bold, Antler .title style ─────────────────────── */
.sppb-collection-addon > .sppb-collection-item h5.easystore-product-title {
  font-weight: 700;
  font-size: 20px;
  color: #fff !important;
  margin-top: 0 !important;
  margin-bottom: 12px !important;
  line-height: 1.35;
  transition: color 0.3s;
}
.sppb-collection-addon > .sppb-collection-item h5.easystore-product-title a {
  color: #fff !important;
  text-decoration: none;
 transition: color 0.3s;
}
.sppb-collection-addon > .sppb-collection-item h5.easystore-product-title a:hover {
  color: #fdd700 !important;
}

/* ── 4. Badge: top-right pill, Antler .plans.badge.feat style ── */
.sppb-collection-addon > .sppb-collection-item .easystore-badge-wrapper {
  position: absolute;
  right: 9px;
  top: 9px;
  z-index: 2;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 13px;
  border-radius: 50px;
  background-color: #fdd700;
  color: #000;
  letter-spacing: 0.3px;
}

/* ── 5. Product image ────────────────────────────────────────── */
.sppb-collection-addon > .sppb-collection-item .easystore-product-image {
  position: relative;
  overflow: hidden;
  /* border-radius: 18px;
 margin-bottom: 20px;*/
}
.sppb-collection-addon > .sppb-collection-item .easystore-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  /* border-radius: 8px; */
  transition: transform 0.4s ease;
}
.sppb-collection-addon > .sppb-collection-item:hover .easystore-product-image img {
  transform: scale(1.04);
}

/* ── 6. "Details" button: Antler .btn.btn-default-yellow-fill ── */

/* Remove Bootstrap stretched-link full-card overlay */
.sppb-collection-addon > .sppb-collection-item a.stretched-link::after {
  display: none !important;
}

/* Make the <a> itself a visible yellow pill button */
/*.sppb-collection-addon > .sppb-collection-item a.stretched-link {
  position: relative !important;
  display: inline-block !important;
  margin-top: 8px !important;
  padding: 12px 28px;
  background-color: #fdd700;
  color: #000 !important;
  font-weight: 700;
  font-size: 14px;
  border-radius: 50px;
  border: none;
  letter-spacing: 0.2px;
  text-decoration: none;
  box-shadow: 0 2px 8px 0 rgba(62, 62, 79, 0.23);
  transition: all 300ms linear 0ms;
  cursor: pointer;
  text-transform: capitalize;
  align-self: flex-start;
}*/
.sppb-collection-addon > .sppb-collection-item a.stretched-link:hover {
  background-color: #4c4a4a !important;
  color: #fff !important;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.28);
  transform: translateY(-3px);
}

/* Un-hide the "Details" label inside the link */
/*.sppb-collection-addon > .sppb-collection-item a.stretched-link span.visually-hidden {
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: nowrap !important;
  border: 0 !important;
}*/

/* ── 7. Push button to bottom of card ───────────────────────── */
.sppb-collection-addon > .sppb-collection-item .addon-root-easystore-list-thumbnail {
  margin-top: auto;
}

/* ── 8. AOS fade-up animation (optional, matches Antler section) */
.sppb-collection-addon > .sppb-collection-item {
  opacity: 0;
  transform: translateY(40px);
  animation: antlerFadeUp 0.6s ease forwards;
}
@keyframes antlerFadeUp {
  to { opacity: 1; transform: translateY(0); }
}
/* Stagger: first 9 cards */
.sppb-collection-addon > .sppb-collection-item:nth-child(1)  { animation-delay: 0.05s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(2)  { animation-delay: 0.15s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(3)  { animation-delay: 0.25s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(4)  { animation-delay: 0.35s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(5)  { animation-delay: 0.45s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(6)  { animation-delay: 0.55s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(7)  { animation-delay: 0.65s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(8)  { animation-delay: 0.75s; }
.sppb-collection-addon > .sppb-collection-item:nth-child(9)  { animation-delay: 0.85s; }









/* Target the Joomla menu module inside your header */
/*.sp-header,.sp-header, .sp-menu {
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 5px 19.6px -3px rgba(255, 255, 255, 0.25) inset;
  padding-inline: 2rem;
  gap: 2rem;
  display: flex;
  align-items: center;
}


/*#sp-menu.menu-with-social .sp-megamenu-wrapper {
    flex:auto;
    justify-content:space-between;
    display:flex;
    align-items:center;
}

#sp-menu>.sp-column {
    height:100%;
}

#sp-menu .social-wrap {
    position:relative;
}

#sp-menu .social-wrap:after {
    content:"";
    margin-top:10px;
    margin-bottom:10px;
    position:absolute;
    width:2px;
    height:calc(var(--header_height) - 20px);
    left:30px;
    background-color:rgba(80, 80, 80, 0.2);
}

#sp-menu ul.social-icons>li:not(:last-child) {
    margin-right:20px;
}

#sp-menu ul.social-icons a {
    color:#9c9c9c;
}

#sp-menu .social-wrap.no-border ul.social-icons {
    border-left:none;
    padding-left:0px;
}

#sp-menu.menu-center .sp-megamenu-wrapper {
    justify-content:center;
}

.menu-flex .sp-megamenu-wrapper {
    display:flex;
    justify-content:flex-end;
}

.header-has-modules #offcanvas-toggler {
    margin-right:20px;
    margin-left:0;
}

#sp-header {
    height:68px;
    width:100%;
    z-index:99;
    animation:spFadeIn 0.5s;
    position:fixed;
    top:30px;
    transition:all 0.3s ease;
    background-color:#a5215e !important;
    border-radius:80px;
    padding-left:45px;
    padding-right:45px;
     box-shadow:0 2px 3px rgba(0, 0, 0, 0.1);
    margin-right:20px;
    margin-left:0px;
       height:auto;
}






#sp-header.lg-header #offcanvas-toggler.offcanvas-toggler-right.offcanvas {
    display:none !important;
}

#sp-header.lg-header .sp-column {
    height:100%;
}

#sp-header.lg-header #sp-logo #offcanvas-toggler {
    display:none;
}

#sp-header.header-with-modal-menu {
    color:#2F5D37;
}

#sp-header.header-with-modal-menu a {
    color:rgba(47, 93, 55, 0.6);
}

#sp-header.header-with-modal-menu a:hover,#sp-header.header-with-modal-menu a:focus {
    color:#6AB476;
}

#sp-header.header-with-modal-menu .sp-contact-info>li {
    margin-right:15px;
    opacity:0.7;
    transition:0.3s;
}

#sp-header.header-with-modal-menu .sp-contact-info>li:hover,#sp-header.header-with-modal-menu .sp-contact-info>li:focus {
    opacity:1;
}

#sp-header.header-with-modal-menu .sp-contact-info>li>span {
    margin-right:5px;
}

#sp-header.header-with-modal-menu #offcanvas-toggler {
    display:none !important;
}

#sp-header.header-with-modal-menu.center-layout .modules-wrapper {
    height:auto;
    border:none;
    padding:0px;
    max-width:730px;
    margin:0 auto;
}

#sp-header.header-with-modal-menu.center-layout #modal-menu .modal-menu-inner>.container {
    align-items:flex-start;
    padding:170px 0 0;
}

#sp-header.header-with-modal-menu.center-layout #modal-menu .search {
    margin-bottom:80px;
}

#sp-header.header-with-modal-menu.center-layout #modal-menu .search form:after {
    font-size:16px;
}

#sp-header.header-with-modal-menu.center-layout #modal-menu .search form:hover:after {
    display:none;
}

#sp-header.header-with-modal-menu.center-layout #modal-menu .search form input {
    background:transparent;
    border-bottom:2px solid rgba(32, 31, 31, 0.1);
    font-size:26px;
    padding:7px;
    border-radius:0px;
}

#sp-header.header-with-modal-menu.center-layout #modal-menu .search form input::placeholder {
    color:rgba(32, 31, 31, 0.4);
}

#sp-header.header-with-modal-menu.center-layout #modal-menu .search form input:focus,#sp-header.header-with-modal-menu.center-layout #modal-menu .search form input:active,#sp-header.header-with-modal-menu.center-layout #modal-menu .search form input:active:focus {
    box-shadow:none;
    border-bottom:2px solid rgba(32, 31, 31, 0.7);
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper {
    justify-content:center;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper ul.sp-megamenu-parent {
    flex-direction:row;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li>a,#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li>span {
    padding:0;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li>a:after,#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li>span:after {
    top:100%;
    width:2px;
    height:20px;
    left:50%;
    transform:translateX(-50%);
    margin:10px 0 0 0;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li.sp-has-child:hover>a:after,#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li.sp-has-child:hover>span:after {
    height:30px;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li.sp-has-child>.sp-dropdown {
    animation:spFadeIn 0.5s;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li:not(:last-child)>a,#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li:not(:last-child)>span {
    margin-right:70px;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li>.sp-dropdown.sp-dropdown-main {
    top:100%;
    padding-top:50px;
    padding-left:0;
    left:auto !important;
    right:0px;
    transition:0.35s;
}

#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li>.sp-dropdown.sp-dropdown-main li.sp-menu-item>a,#sp-header.header-with-modal-menu.center-layout .sp-megamenu-wrapper .sp-megamenu-parent>li>.sp-dropdown.sp-dropdown-main li.sp-menu-item>span {
    padding:6px 0;
}

#sp-header.header-with-modal-menu.classic-layout .modal-menu-inner>div {
    flex-direction:column;
    align-items:flex-start;
    padding:40px 0;
}

#sp-header.header-with-modal-menu.classic-layout .modal-menu-inner>div .sp-megamenu-wrapper {
    height:100%;
    align-items:center;
}

#sp-header.header-with-modal-menu.classic-layout .modal-menu-inner>div .social-icons {
    margin-top:auto;
    margin-bottom:0px;
    width:100%;
    border-top:2px solid rgba(32, 31, 31, 0.1);
    padding-top:20px;
    font-size:12px;
}

#sp-header .logo {
    height:68px;
    display:inline-flex;
    margin:0;
    align-items:center;
}

#sp-header .logo a {
    font-size:24px;
    line-height:1;
    margin:0;
    padding:0;
}

#sp-header .logo p {
    margin:5px 0 0;
}

#sp-header.header-sticky {
    background-color:#fff;
    top:0px;
    transition:all 0.3s ease;
}

#sp-header nav.sp-megamenu-wrapper #offcanvas-toggler {
    display:none;
}

#sp-header .sp-module .sp-sign-in {
    background-color:#58815f;
    padding:15px 30px;
    border-radius:30px;
    display:flex;
    align-items:center;
    justify-content:center;
}

#sp-header .sp-module .sp-sign-in:hover,#sp-header .sp-module .sp-sign-in:focus {
    background-color:#2F5D37;
}

#sp-header .sp-module .sp-sign-in .arrow-icon {
    color:#fff;
    margin-left:2px;
}

#sp-header .sp-module .sp-sign-in .far.fa-user {
    display:none;
}

#sp-header .sp-module .sp-sign-in .fas.fa-user-circle {
    display:none;
}

#sp-header .sp-module .sp-sign-in .user-text {
    color:#fff;
    font-size:16px;
}

#sp-header .sp-module .sp-sign-in .signin-text {
    font-size:18px;
    font-weight:600;
    line-height:1;
    color:#fff;
    letter-spacing:-0.2px;
}

#sp-header .sp-module .easystore-cart-icon {
    margin-right:15px;
    font-size:24px;
}

#sp-header-topbar {
    position:relative;
    z-index:111;
}

#sp-header-topbar .sp-profile-wrapper .sp-sign-in .user-text {
    display:none !important;
}

#sp-header-topbar #sp-logo #offcanvas-toggler {
    display:none !important;
}

#sp-header-topbar .container-inner {
    border-bottom:1px solid #e5e5e5;
}

#sp-header-topbar .container-inner>.row {
    min-height:68px;
}

#sp-header-topbar a {
    color:#909196;
}

#sp-header-topbar a:hover {
    color:#2F5D37;
}

#sp-header-topbar .sp-contact-info {
    color:#909196;
}




/* ============ FLOATING GLASS NAV (smartslider3-style) ============ */

/* Page body needs relative positioning + a hero behind nav for blur to show 
body {
  position: relative;
}*/


/*#sp-megamenu-wrapper,#sp-menu,
#sp-header {
   /*   position: absolute;
    overflow: hidden;
   
   
  left: 24px;
  right: 24px;
  top: 20px;
  min-height: 88px;
  border-radius: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.24);
  border-left: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.6);
  background-blend-mode: luminosity;
  box-shadow: 0 2px 4px rgba(11, 15, 50, 0.08);
  -webkit-backdrop-filter: blur(25px);
  backdrop-filter: blur(25px);
  z-index: 100;
}


/* The floating nav bar itself */
/*#sp-header
.sp-header,
header.site-header,
#top-nav,
.header-wrapper {
  position: absolute;
  left: 24px;
  right: 24px;
  top: 16px;
 display: flex;
 align-items: center;
  padding: 16px 24px 16px 40px;
   gap: 20px;
  overflow: hidden;
  min-height: 88px;
  border-radius: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.24);
  border-left: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.6);
  background-blend-mode: luminosity;
  box-shadow: 0 2px 4px rgba(11, 15, 50, 0.08);
  -webkit-backdrop-filter: blur(25px);
  backdrop-filter: blur(25px);
  z-index: 100;
}*/

/* Push first content section down so it isn't hidden under the floating nav 
#sp-main-body,
.main-content,
#sp-feature,
.hero-section {
  margin-top: 0;
  padding-top: 120px;
}*/

/* Logo sits left, takes its natural width 
.sp-logo,
.logo {
  flex-shrink: 0;
}

.sp-logo img,
.logo img {
  height: 44px;
  width: auto;
  display: block;
}*/

/* Nav links push to the right 
#sp-menu,
.sp-megamenu-parent,
nav.menu {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  padding: 0;
}

.sp-megamenu-parent > li > a,
nav.menu > li > a {
  display: inline-block;
  padding: 10px 16px;
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 15px;
  font-weight: 500;
  color: #0b0f32;
  text-decoration: none;
  border-radius: 8px;
  transition: all 0.2s ease;
}

.sp-megamenu-parent > li > a:hover,
nav.menu > li > a:hover {
  color: #00adee;
  background: rgba(255, 255, 255, 0.5);
}

.sp-megamenu-parent > li.current > a,
nav.menu > li.active > a {
  color: #00adee;
  font-weight: 600;
}*/

/* CTA button (last item) — solid pill 
.sp-megamenu-parent > li:last-child > a,
nav.menu > li:last-child > a {
  background: #0b0f32;
  color: #fff !important;
  padding: 12px 24px;
  border-radius: 999px;
  font-weight: 600;
  margin-left: 12px;
}

.sp-megamenu-parent > li:last-child > a:hover,
nav.menu > li:last-child > a:hover {
  background: #00adee;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0, 173, 238, 0.35);
}*/

/* Dropdowns — match the glass aesthetic *//*
.sp-megamenu-parent .sp-dropdown,
nav.menu ul.sub-menu {
  background: rgba(255, 255, 255, 0.85);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(11, 15, 50, 0.12);
  padding: 10px;
  margin-top: 12px;
  min-width: 220px;
}

.sp-megamenu-parent .sp-dropdown li a,
nav.menu ul.sub-menu li a {
  display: block;
  padding: 10px 14px;
  font-size: 14px;
  color: #0b0f32;
  border-radius: 6px;
}

.sp-megamenu-parent .sp-dropdown li a:hover,
nav.menu ul.sub-menu li a:hover {
  background: rgba(0, 173, 238, 0.1);
  color: #00adee;
}
*/
/* Mobile *//*
@media (max-width: 991px) {
  #sp-header,
  .sp-header,
  header.site-header {
    left: 12px;
    right: 12px;
    top: 12px;
    padding: 12px 16px 12px 20px;
    min-height: 64px;
    border-radius: 12px;
  }
  
  #sp-main-body,
  .main-content {
    padding-top: 90px;
  }
  
  .sp-logo img,
  .logo img {
    height: 36px;
  }
  
  .sp-megamenu-parent,
  nav.menu {
    display: none;
  }
}*/




/* ==========================================================
   CUSE CLOUDY CANNABIS - Dropdown Menu Circle Bullets
   Dark green stroke circle, vertically aligned with menu text
   Top-level nav items NOT affected
   ========================================================== */

/* Reset list-style — handled via ::before for alignment control */
.sp-megamenu-wrapper .sp-dropdown li.sp-menu-item {
  display: block !important;
  list-style-type: none !important;
}

/* Flex row on <a> so circle and text sit on the same baseline */
.sp-megamenu-wrapper .sp-dropdown li.sp-menu-item > a {
  display: flex !important;
  align-items: center;
  gap: 8px;
}

/* Dark green stroke circle via CSS border (no fill = stroke only) */
.sp-megamenu-wrapper .sp-dropdown li.sp-menu-item > a::before {
  content: '';
  display: inline-block;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: 1.5px solid #1b5e20;
  background-color: #1b5e20;
}

/* PRODUCTS menu -> cannabis leaf icon (SVG mask, Tabler outline style) */
#sp-header #sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li:nth-child(2)::before {
  content: '' !important;
  display: inline-block !important;
  width: 1em !important;
  height: 1em !important;
  background-color: currentColor !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7%2020s0%20-2%201%20-3.5c-1.5%200%20-2%20-.5%20-4%20-1.5c0%200%201.839%20-1.38%205%20-1c-1.789%20-.97%20-3.279%20-2.03%20-5%20-6c0%200%203.98%20-.3%206.5%203.5c-2.284%20-4.9%201.5%20-9.5%201.5%20-9.5c2.734%205.47%202.389%207.5%201.5%209.5c2.531%20-3.77%206.5%20-3.5%206.5%20-3.5c-1.721%203.97%20-3.211%205.03%20-5%206c3.161%20-.38%205%201%205%201c-2%201%20-2.5%201.5%20-4%201.5c1%201.5%201%203.5%201%203.5c-2%200%20-4.438%20-2.22%20-5%20-3c-.563%20.78%20-3%203%20-5%203%22%2F%3E%3Cpath%20d%3D%22M12%2022v-5%22%2F%3E%3C%2Fsvg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7%2020s0%20-2%201%20-3.5c-1.5%200%20-2%20-.5%20-4%20-1.5c0%200%201.839%20-1.38%205%20-1c-1.789%20-.97%20-3.279%20-2.03%20-5%20-6c0%200%203.98%20-.3%206.5%203.5c-2.284%20-4.9%201.5%20-9.5%201.5%20-9.5c2.734%205.47%202.389%207.5%201.5%209.5c2.531%20-3.77%206.5%20-3.5%206.5%20-3.5c-1.721%203.97%20-3.211%205.03%20-5%206c3.161%20-.38%205%201%205%201c-2%201%20-2.5%201.5%20-4%201.5c1%201.5%201%203.5%201%203.5c-2%200%20-4.438%20-2.22%20-5%20-3c-.563%20.78%20-3%203%20-5%203%22%2F%3E%3Cpath%20d%3D%22M12%2022v-5%22%2F%3E%3C%2Fsvg%3E") !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  vertical-align: middle !important;
  font-size: 1.2em !important;
}


/* ===== Main menu icon & text color sync (top-level only, no dropdowns) ===== */

#sp-header #sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.current-item > a,
#sp-header #sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.active > a {
  color: rgb(244, 115, 99) !important;
}

#sp-header #sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.current-item::before,
#sp-header #sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.active::before {
  color: rgb(244, 115, 99) !important;
}

#sp-header #sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li:hover > a {
  color: rgb(244, 115, 99) !important;
}

#sp-header #sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li:hover::before {
  color: rgb(244, 115, 99) !important;
}

/* =====================================================================
   PURE LEAF — UI/UX FIXES (appended by audit 2026-06-03)
   Self-contained block. Safe to remove everything below this banner to
   revert. Scoped + !important so it wins over the existing overrides.
   ===================================================================== */
:root{
  --pl-green:#156937;        /* brand forest green (already used on site) */
  --pl-green-bright:#2ea24f; /* hover / focus */
  --pl-green-light:#7cc47c;  /* legible green on dark backgrounds */
}

/* (1) HERO CTAs — the SP Slider layer animation (after:2400ms) leaves
   "Shop Products" / "View Menu" invisible most of the time. Force the
   buttons to stay visible regardless of the animation timing. */
.sp-slider .sppb-sp-slider-button,
.sppb-sp-slider-button{
  opacity:1 !important;
  visibility:visible !important;
  transform:translate(0,0) !important;
  animation:none !important;
}

/* (2) HERO legibility — the headline sits on a busy photo behind a
   semi-transparent BLUE box. Swap the off-brand blue for a dark green
   scrim and add a text shadow so the text reads everywhere. */
[style*="51, 102, 255"]{
  background-color:rgba(15,34,18,0.55) !important;
}
.sp-slider .sp-slider-title,
.sp-slider .sppb-sp-slider-title,
.sp-slider .sp-slider-text,
.sppb-sp-slider-button{
  text-shadow:0 2px 6px rgba(0,0,0,.6) !important;
}

/* (3) CONTACT FORM — dark text on a dark charcoal panel was nearly
   invisible. Give the fields a light background, real borders and a
   visible focus ring. Scoped to the contact addon only (the header
   search box is a different element and is untouched). */
.sppb-addon-ajax-contact .sppb-form-control{
  background:#ffffff !important;
  color:#1a1a1a !important;
  border:1px solid #b9b9b9 !important;
  border-radius:6px !important;
}
.sppb-addon-ajax-contact .sppb-form-control::placeholder{
  color:#5e5e5e !important; opacity:1 !important;
}
.sppb-addon-ajax-contact .sppb-form-control:focus{
  border-color:var(--pl-green) !important;
  box-shadow:0 0 0 3px rgba(21,105,55,.25) !important;
  outline:0 !important;
}

/* (4) TYPOGRAPHY — collapse the five display fonts (Lobster, Wendy One,
   Cantora One, Lilita One, Arial Black) down to ONE brand display font
   for headings, and a clean sans for navigation. */
h1,h2,h3,h4,h5,h6,
.sppb-addon-title,
.sp-slider .sp-slider-title,
.sp-slider .sppb-sp-slider-title{
  font-family:'Lilita One', system-ui, -apple-system, Arial, sans-serif !important;
  letter-spacing:.2px;
}
#sp-menu .sp-megamenu-wrapper > .sp-megamenu-parent > li > a,
.sp-megamenu-parent .sp-dropdown-items a,
.offcanvas-menu li a{
  font-family:'Helvetica Neue', Arial, sans-serif !important;
  font-weight:600 !important;
  letter-spacing:.3px;
}

/* (5) NAVIGATION — replace the red/yellow link states with one
   consistent green, and grow the desktop links to 44px tap targets. */
#sp-menu .sp-megamenu-wrapper > .sp-megamenu-parent > li > a{
  color:#f2f2f2 !important;
  min-height:44px;
  display:flex;
  align-items:center;
  padding:8px 12px !important;
}
#sp-menu .sp-megamenu-wrapper > .sp-megamenu-parent > li:hover > a,
#sp-menu .sp-megamenu-wrapper > .sp-megamenu-parent > li.active > a,
#sp-menu .sp-megamenu-wrapper > .sp-megamenu-parent > li.current > a,
#sp-menu .sp-megamenu-wrapper > .sp-megamenu-parent > li > a:hover,
#sp-menu .sp-megamenu-wrapper > .sp-megamenu-parent > li > a:focus{
  color:var(--pl-green-light) !important;
}

/* (6) MOBILE menu accents — coral/orange -> brand green */
#offcanvas-toggler > i{ color:var(--pl-green-light) !important; }
.offcanvas-menu li:hover a,
.offcanvas-menu li:active a{ color:var(--pl-green-light) !important; }

/* (7) TAP TARGETS — footer + social links big enough to tap on mobile */
.sp-footer a,
.sp-footer .social-icons a,
.sppb-addon-social-icons a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:6px 8px;
}
.sp-footer .social-icons a,
.sppb-addon-social-icons a{ min-width:44px; }

/* (8) Remove the 9 empty <h1> shells so they stop adding blank space */
h1:empty{ display:none !important; }

/* (9) Tighten the product-category grid — the 50px gutters created big
   black voids. Bring them in (purely spacing, no content change). */
.sppb-collection-addon{ gap:26px !important; }

/* end PURE LEAF UI/UX FIXES */


/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v2 nav color] =====
   Beat the template's coral active/current nav state with higher specificity. */
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item > a{
  color:#f2f2f2 !important;
}
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item:hover > a,
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item.active > a,
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item.current-item > a,
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item > a:hover,
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item > a:focus{
  color:var(--pl-green-light) !important;
}
/* end audit-v2 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v3 active nav] =====
   Active/current menu item kept rendering coral from a high-specificity
   template rule; this 5-class selector outranks it -> brand green. */
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item.current-item > a,
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item.active > a,
#sp-menu .sp-megamenu-wrapper .sp-megamenu-parent > li.sp-menu-item.current-item.active > a{
  color:var(--pl-green-light) !important;
}
/* end audit-v3 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v4 active nav 2id] =====
   preset7.css sets the active item color via a TWO-ID selector
   (#sp-header #sp-menu ...). Match that specificity to win -> brand green. */
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item.current-item.active > a,
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item.active > a,
#sp-header #sp-menu .sp-megamenu-parent > li.current-item.active > a,
#sp-header #sp-menu .sp-megamenu-parent > li.sp-has-child.active > a{
  color:var(--pl-green-light) !important;
}
/* end audit-v4 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v5 nav alignment] =====
   Header is 150px tall (large logo) but the menu bar is 80px. The menu links
   were stretching to 150px with line-height:150px, dropping text to the bottom
   of the bar and separating the inline menu icons. Constrain the desktop menu
   to the 80px bar and vertically center each item (icon + label) as one row,
   keeping a full-height (80px) click target. Also force hover/open state to
   brand green (2-ID selector to outrank preset7.css coral). */
@media (min-width:992px){
  #sp-header #sp-menu .sp-megamenu-parent{ align-items:center !important; }
  #sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item{
    height:80px !important; display:flex !important; align-items:center !important;
  }
  #sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item > a{
    height:80px !important; min-height:0 !important; line-height:1.2 !important;
    display:inline-flex !important; align-items:center !important; justify-content:center !important;
    padding:0 14px !important;
  }
}
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item:hover > a,
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item.active > a,
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item.current-item > a{
  color:var(--pl-green-light) !important;
}
/* end audit-v5 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v6 nav icon color] =====
   The per-item menu icons render as li::before (peIcon7 font) in a hardcoded
   dark gray (#212529 / coral on active) that didn't match the labels. Make
   each icon follow the SAME color as its menu text in every state: light by
   default, brand green on active/current/hover. Caret (a::after) inherits. */
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item::before{
  color:#f2f2f2 !important;
}
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item:hover::before,
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item.active::before,
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item.current-item::before{
  color:var(--pl-green-light) !important;
}
#sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item > a::after{
  color:inherit !important;
}
/* end audit-v6 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v7 nav responsive 992-1199] =====
   Between ~992px and ~1130px the fixed-width menu (~751px) no longer fit the
   shrinking glass pill, so "DELIVERY & SPECIALS" spilled outside the pill and
   wrapped to two lines. In this laptop range, tighten item padding + size and
   prevent wrapping so the whole menu stays on one line inside the pill. */
@media (min-width:992px) and (max-width:1199.98px){
  #sp-header #sp-menu .sp-megamenu-parent > li.sp-menu-item > a{
    padding:0 7px !important;
    font-size:13px !important;
    letter-spacing:0 !important;
    white-space:nowrap !important;
  }
}
/* end audit-v7 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v8 mobile header + offcanvas] =====
   Mobile (<992px): center the logo across the header and pin the hamburger
   toggle to the far right; cap the oversized logo height (50px). Rein in the
   off-canvas dropdown chevrons so they line up with the search box's right
   edge. (The off-canvas panel is injected on <body> at open time, so making
   #sp-menu absolute here does not affect it.) */
@media (max-width:991.98px){
  #sp-header .row{ position:relative !important; align-items:center !important; min-height:84px !important; }
  #sp-header .row > div:first-child{ flex:0 0 100% !important; max-width:100% !important; width:100% !important; display:flex !important; justify-content:center !important; padding:0 !important; }
  #sp-header .logo{ margin:0 !important; }
  #sp-header .logo img{ max-height:50px !important; width:auto !important; }
  #sp-menu{ position:absolute !important; right:12px !important; top:0 !important; bottom:0 !important; left:auto !important; width:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; display:flex !important; align-items:center !important; z-index:5 !important; }
  #sp-header #offcanvas-toggler{ margin:0 !important; }
  .offcanvas-menu ul{ margin-right:18px !important; }
}
/* end audit-v8 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v9 offcanvas dropdown] =====
   The off-canvas dropdown was effectively broken: parent items (PRODUCTS /
   BRANDS / ABOUT / LEARN) link to /test/, so tapping the LABEL reloaded the
   page and closed the menu — only the tiny chevron expanded. Stretch the
   Bootstrap collapse toggler across the full parent ROW (row height only, so
   it never covers the expanded submenu), and disable the placeholder parent
   link, so tapping anywhere on a parent expands/collapses its dropdown. The
   chevron stays right-aligned; sub-links stay tappable. */
@media (max-width:991.98px){
  .offcanvas-menu li.parent{ position:relative !important; }
  .offcanvas-menu li.parent > span.accordion-menu-toggler,
  .offcanvas-menu li.deeper > span.accordion-menu-toggler{
    left:0 !important; right:0 !important; width:100% !important; max-width:none !important;
    top:0 !important; height:48px !important;
    display:flex !important; align-items:center !important; justify-content:flex-end !important;
    padding-right:18px !important; z-index:5 !important; background:transparent !important;
  }
  .offcanvas-menu li.parent > a{ pointer-events:none !important; }
}
/* end audit-v9 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v10 mobile toggle unified] =====
   Supersedes the header rules in [audit-v8]. Fixes the mobile/tablet toggle:
   it was two different things (a bare 80x150 transparent hit-area >=570px vs a
   100x60 glass pill <570px), flush to the edge, and overlapping the logo at
   320px; and at the md breakpoint (768-991) an empty 3rd column became visible
   and wrapped the header to 300px tall (logo high, toggle low). Now: hide that
   empty column, vertically center the logo, and render ONE consistent toggle
   button (48x44, rounded, 12px from the right) centered at every width <992px. */
@media (max-width:991.98px){
  #sp-header .row{ position:relative !important; align-items:center !important; min-height:84px !important; flex-wrap:nowrap !important; }
  #sp-header .row > div:nth-child(3){ display:none !important; }   /* empty col that wrapped the header at md */
  #sp-header .row > div:first-child{ flex:0 0 100% !important; max-width:100% !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; padding:0 !important; }
  #sp-header .logo{ margin:0 !important; }
  #sp-header .logo img{ max-height:46px !important; width:auto !important; }
  #sp-header #sp-menu{ position:absolute !important; right:24px !important; top:0 !important; bottom:0 !important; left:auto !important; width:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; display:flex !important; align-items:center !important; z-index:5 !important; }
  #sp-header #offcanvas-toggler{ width:48px !important; min-width:48px !important; max-width:48px !important; height:44px !important; margin:0 !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; background:rgba(255,255,255,0.08) !important; border:1px solid rgba(255,255,255,0.28) !important; border-radius:10px !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; box-shadow:none !important; }
  #sp-header #offcanvas-toggler .js-menu-toggle{ margin:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; height:auto !important; line-height:0 !important; }
  #sp-header #offcanvas-toggler .js-menu-toggle span.lines{ margin:0 !important; top:auto !important; }
}
/* end audit-v10 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v11 toggle tap fix] =====
   v10 made the logo column full-width to center the logo, but without
   pointer-events:none it sat on top of the toggle and swallowed taps, so the
   hamburger appeared inactive (a tap landed on #sp-logo, not the toggle).
   Make the logo column transparent to pointer events (the logo link itself
   stays clickable) and keep the toggle above everything and clickable. */
@media (max-width:991.98px){
  #sp-header .row > div:first-child{ pointer-events:none !important; }
  #sp-header .row > div:first-child .logo{ pointer-events:auto !important; }
  #sp-header #sp-menu,
  #sp-header #offcanvas-toggler,
  #sp-header #offcanvas-toggler *{ pointer-events:auto !important; }
  #sp-header #sp-menu{ z-index:10 !important; }
}
/* end audit-v11 addendum */

/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v12 mobile logo size] =====
   In off-canvas (mobile/tablet) mode the centered logo was capped at 46px,
   leaving the 150px header mostly empty. Scale the logo up to fill the header
   (up to 115px tall) with a responsive width cap so it always stays clear of
   the toggle (~15px gap) and never overlaps, even at 320px. */
@media (max-width:991.98px){
  #sp-header .logo img{
    max-height:115px !important;
    max-width:calc(100vw - 165px) !important;
    width:auto !important; height:auto !important;
  }
}
/* end audit-v12 addendum */

/* =====================================================================
   BRONOS THEME COLORS  [bronos-theme]
   Palette adapted from kfkit.rometheme.pro/bronos (Elementor globals):
     dark olive #283618 · olive #606C38 · amber #FFB635 · cream #FEFAE0
     pale #ECE8C9 · body-text #7A7A7A · teal #00CEA6
   TO UNDO: delete everything between this banner and "end bronos-theme".
   ===================================================================== */
:root{
  --bronos-dark:#283618; --bronos-olive:#606C38; --bronos-amber:#FFB635;
  --bronos-amber-dark:#e89c1a; --bronos-cream:#FEFAE0; --bronos-pale:#ECE8C9; --bronos-text:#7A7A7A;
  /* Re-point the existing Pure Leaf accent vars to Bronos so every current
     accent usage (nav active/hover, menu icons, offcanvas, focus) flips: */
  --pl-green:#606C38;          /* secondary green  -> Bronos olive */
  --pl-green-bright:#FFB635;   /* hover/CTA         -> Bronos amber */
  --pl-green-light:#FFB635;    /* accent            -> Bronos amber */
}

/* Top bar: brand green -> dark olive, lime text -> cream */
#sp-top-bar{ background-color:var(--bronos-dark) !important; }
#sp-top-bar, #sp-top-bar *{ color:var(--bronos-cream) !important; }

/* Footer: dark gray -> dark olive, cream text, amber link hover */
#sp-footer{ background-color:var(--bronos-dark) !important; }
#sp-footer, #sp-footer *, #sp-footer .sp-copyright{ color:var(--bronos-cream) !important; }
#sp-footer a:hover, #sp-footer a:focus{ color:var(--bronos-amber) !important; }

/* Dark inner sections (Find Us / Contact / Our Team) -> dark olive */
.sppb-section[style*="38, 38, 38"],
.sppb-section[style*="48, 48, 48"]{ background-color:var(--bronos-dark) !important; }

/* Hero CTA buttons (Shop Products / View Menu) -> amber pill (Bronos CTA) */
.sppb-sp-slider-button{
  background-color:var(--bronos-amber) !important;
  border-color:var(--bronos-amber) !important;
  color:var(--bronos-dark) !important;
}

/* Hero headline scrim / leftover blue boxes -> dark olive (keeps text legible) */
[style*="51, 102, 255"]{ background-color:rgba(40,54,24,0.62) !important; }

/* Category pills / product-grid buttons -> amber */
.sppb-collection-addon .sppb-btn,
.sppb-addon-buttons .sppb-btn,
.sppb-btn-primary{
  background-color:var(--bronos-amber) !important;
  border-color:var(--bronos-amber) !important;
  color:var(--bronos-dark) !important;
}

/* Links: hover -> amber */
.sppb-addon a:hover, #sp-component a:hover, .sp-page-builder a:hover{ color:var(--bronos-amber) !important; }

/* Contact form focus ring -> amber */
.sppb-addon-ajax-contact .sppb-form-control:focus{
  border-color:var(--bronos-amber) !important;
  box-shadow:0 0 0 3px rgba(255,182,53,.30) !important;
}

/* "Send Message" submit button -> amber */
.sppb-addon-ajax-contact .sppb-btn{
  background-color:var(--bronos-amber) !important;
  border-color:var(--bronos-amber) !important;
  color:var(--bronos-dark) !important;
}
/* Page background: near-black (#020101) -> Bronos dark olive
   (Bronos uses dark olive for its dark areas, not pure black) */
body{ background-color:var(--bronos-dark) !important; }
/* end bronos-theme */

/* =====================================================================
   BRONOS THEME — HOMEPAGE SP PAGE BUILDER CONTENT  [bronos-sppb-homepage]
   Applies the Bronos palette to the homepage (SP Page Builder page id=1 =
   body.page-1) sections, the SP Slider, and the overlay-image card grid,
   since the SPPB editor can't be opened on Joomla 6. Scoped to .page-1 so
   only the homepage is affected. TO UNDO: delete this whole block.
   (Palette vars --bronos-* are defined in the [bronos-theme] block above.)
   ===================================================================== */

/* (1) All homepage SPPB sections -> Bronos dark olive.
   (Find Us / Contact / Our Team were #262626 / #303030; the transparent
   slider & product-grid sections already show the dark-olive body.) */
.page-1 .sppb-section.sppb-element-lazy,
.page-1 .sppb-section[style*="38, 38, 38"],
.page-1 .sppb-section[style*="48, 48, 48"]{ background-color:var(--bronos-dark) !important; }

/* (2) SP Slider (hero): dark tagline text -> cream + shadow for legibility;
   the headline stays white and the CTA buttons are already amber. */
.page-1 .sp-slider .sp-slider-text,
.page-1 .sp-slider .sp-slider-text *,
.page-1 .sppb-sp-slider .sp-slider-text,
.page-1 .sp-slider [style*="29, 51, 30"]{
  color:var(--bronos-cream) !important;
  text-shadow:0 1px 4px rgba(0,0,0,.55) !important;
}

/* (3) Overlay-image "collection" grid: category pills were blue (#3366FF)
   -> Bronos amber with dark-olive text. */
.page-1 .sppb-addon-overlay-image-content .sppb-btn,
.page-1 .sppb-addon-overlay-image .sppb-btn,
.page-1 .sppb-btn.sppb-btn-custom{
  background-color:var(--bronos-amber) !important;
  border-color:var(--bronos-amber) !important;
  color:var(--bronos-dark) !important;
}
.page-1 .sppb-addon-overlay-image-content .sppb-btn:hover,
.page-1 .sppb-btn.sppb-btn-custom:hover{
  background-color:var(--bronos-amber-dark) !important;
  border-color:var(--bronos-amber-dark) !important;
  color:var(--bronos-dark) !important;
}

/* (4) Section / addon headings: off-brand salmon (#E0978F) -> Bronos amber */
.page-1 .sppb-addon-title{ color:var(--bronos-amber) !important; }
/* subtitles / eyebrow text -> amber accent */
.page-1 .sppb-addon-subtitle{ color:var(--bronos-amber) !important; }

/* (5) Body text inside dark homepage sections -> cream for readability */
.page-1 .sppb-section.sppb-element-lazy .sppb-addon-text-block,
.page-1 .sppb-section.sppb-element-lazy p,
.page-1 .sppb-section.sppb-element-lazy .sppb-addon-content{ color:var(--bronos-cream) !important; }
/* end bronos-sppb-homepage */

/* =====================================================================
   BRONOS FOOTER "Our Products" STYLE -> NAV DROPDOWN ITEMS  [bronos-dropdown-items]
   Desktop megamenu dropdown items styled like the Bronos footer "Our Products"
   list: amber chevron-circle-right bullet, Inter 16px/500, white text.
   v2 refinements: removed the old green/native bullet; bullet moved onto the
   <li> so the hover background sits only behind the name (not the bullet);
   bullet vertically aligned with the name; hover text color = white.
   TO UNDO: delete this whole block.
   ===================================================================== */

/* remove any old / native / template bullet (list markers, list image, icons) */
#sp-menu .sp-dropdown-items,
#sp-menu .sp-dropdown-items li{ list-style:none !important; list-style-image:none !important; }
#sp-menu .sp-dropdown-items li::marker{ content:none !important; }
#sp-menu .sp-dropdown-items li > a > i,
#sp-menu .sp-dropdown-items li > a [class*="icon"],
#sp-menu .sp-dropdown-items li > a .fa,
#sp-menu .sp-dropdown-items li > a::before{ content:none !important; display:none !important; }

/* link text: Inter 16px / 500, white — and WHITE on hover */
#sp-menu .sp-dropdown-items li > a,
#sp-menu .sp-megamenu-parent .sp-dropdown li.sp-menu-item > a{
  font-family:'Inter', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif !important;
  font-size:16px !important;
  font-weight:500 !important;
  color:#FFFFFF !important;
  padding-left:0 !important;   /* the bullet space now lives on the <li> */
}
#sp-menu .sp-dropdown-items li > a:hover,
#sp-menu .sp-dropdown-items li > a:focus,
#sp-menu .sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover{ color:#FFFFFF !important; }

/* amber chevron-circle-right bullet ON THE <li> (outside the <a>, so the hover
   background never covers it), vertically centered & aligned with the name */
#sp-menu .sp-dropdown-items li.sp-menu-item,
#sp-menu .sp-megamenu-parent .sp-dropdown li.sp-menu-item{ position:relative !important; padding-left:30px !important; }
#sp-menu .sp-dropdown-items li.sp-menu-item::before,
#sp-menu .sp-megamenu-parent .sp-dropdown li.sp-menu-item::before{
  content:"\f138" !important;   /* Font Awesome chevron-circle-right */
  font-family:"Font Awesome 7 Free","Font Awesome 6 Free","Font Awesome 5 Free",FontAwesome !important;
  font-weight:900 !important;
  color:#FFB635 !important;
  position:absolute !important;
  left:8px !important; top:50% !important; transform:translateY(-50%) !important;
  font-size:15px !important; line-height:1 !important;
  display:block !important; width:auto !important; height:auto !important; margin:0 !important; padding:0 !important;
}
/* end bronos-dropdown-items */


/* ===== PURE LEAF UI/UX FIXES — addendum [audit-v13 sticky logo] =====
   Sticky-header logo: keep it small & centered so it never covers the
   offcanvas toggle. (Re-applied after 2026-07 hack-restore rollback.)
   TO UNDO: delete between these markers. */
@media (max-width:991.98px){
  #sp-header .logo img.sp-sticky-logo,
  #sp-header .sp-sticky-logo{
    position:static !important; inset:auto !important; transform:none !important; margin:0 auto !important;
    height:50px !important; max-height:50px !important; width:auto !important;
    max-width:calc(100vw - 165px) !important;
  }
}
/* end audit-v13 addendum */

/* ===== PURE LEAF — HACK-RESTORE POLISH [audit-v14] =====
   The 2026-07 hack+host-restore wiped the Flex template style (layout,
   logo, preset7, copyright). Those were rebuilt in Template Options ->
   style "Flex - Default" (id 9). This block adds only small safety rules.
   TO UNDO: delete between these markers. */
/* keep top-level menu items on one line (e.g. DELIVERY & SPECIALS) */
#sp-menu .sp-megamenu-parent > li > a{ white-space:nowrap; }
/* end audit-v14 */


/* ===== PURE LEAF — SECTION TITLE UNDERLINE [audit-v15] =====
   SPPB section-title underline bar shipped as demo periwinkle (#a9aaef).
   Repoint to Bronos amber so OUR TEAM / DISCLAIMER (and all section
   headings) match the brand. TO UNDO: delete between these markers. */
.sppb-addon h3.sppb-addon-title:after,
.sppb-addon .sppb-addon-title:after,
#sp-page-builder .sppb-addon-title:after{
  background:#FFB635 !important;
  background-image:none !important;
}
/* end audit-v15 */


/* ===== PURE LEAF — FOOTER SOCIAL + CONTACT BAND [audit-v16] =====
   Rebuilt footer band (module 218 in Helix 'bottom1'): social icons +
   phone + email on dark olive (was lost when the hacked template was
   rebuilt; original demo band had a periwinkle bg). Placeholder links
   (#) + placeholder phone — update with real values.
   TO UNDO: delete this block, unpublish module 218, remove the Bottom
   row from the style-9 layout. */
#sp-bottom{ background:#ffb635 !important; }
#sp-bottom .sp-module{ margin:0 !important; }
#sp-bottom .pl-footer-band,
.pl-footer-social-row .pl-footer-band{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:14px 24px; max-width:1140px; margin:0 auto; padding:0 15px;
}
.pl-footer-band .pl-social{ display:flex; align-items:center; gap:12px; margin:0; padding:0; list-style:none; }
.pl-footer-band .pl-social li{ margin:0; padding:0; border:0 none !important; }
.pl-footer-band .pl-social li:before{ content:none !important; }
.pl-footer-band .pl-social a{
  color:#283618; font-size:18px; line-height:1; display:inline-flex;
  width:38px; height:38px; align-items:center; justify-content:center;
  text-decoration:none; border:1.5px solid rgba(40,54,24,0.6); border-radius:50%; transition:all .2s ease;
}
.pl-footer-band .pl-social a:hover{ color:#FFB635; background:#283618; border-color:#283618; }
.pl-footer-band .pl-footer-contact{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 26px; }
.pl-footer-band .pl-footer-contact a{
  color:#283618 !important; font-size:15px; display:inline-flex; align-items:center;
  gap:8px; text-decoration:none;
}
.pl-footer-band .pl-footer-contact a i{ color:#283618; font-size:16px; }
.pl-footer-band .pl-footer-contact a:hover{ color:#1a2410 !important; }
@media (max-width:600px){
  #sp-bottom .pl-footer-band,
  .pl-footer-social-row .pl-footer-band{ flex-direction:column; text-align:center; gap:16px; }
  .pl-footer-band .pl-footer-contact{ flex-direction:column; gap:10px; }
}
/* dark foreground on amber band — beat template #sp-bottom a lime link color */
#sp-bottom .pl-footer-band .pl-social a{ color:#283618 !important; }
#sp-bottom .pl-footer-band .pl-social a:hover{ color:#FFB635 !important; }
#sp-bottom .pl-footer-band .pl-footer-contact a,
#sp-bottom .pl-footer-band .pl-footer-contact a i,
#sp-bottom .pl-footer-band .pl-footer-contact a span{ color:#283618 !important; }
#sp-bottom .pl-footer-band .pl-footer-contact a:hover,
#sp-bottom .pl-footer-band .pl-footer-contact a:hover i,
#sp-bottom .pl-footer-band .pl-footer-contact a:hover span{ color:#1a2410 !important; }
/* end audit-v16 */


/* ===== PURE LEAF — FOOTER BAND HEIGHT [audit-v17] =====
   Make #sp-bottom 50% taller (70px -> 105px) and vertically center its
   content, without changing content sizes. TO UNDO: delete this block. */
#sp-bottom{
  min-height:105px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
#sp-bottom > .container{ width:100%; }
/* end audit-v17 */


/* ===== PURE LEAF — BOLD SP-BOTTOM TEXT [audit-v18] =====
   Bold the phone/email text in the amber band. Targets the text spans/links
   only (NOT the <i> icons, whose Font Awesome weight must stay 400/900).
   TO UNDO: delete this block. */
#sp-bottom .pl-footer-contact a,
#sp-bottom .pl-footer-contact a span{ font-weight:700 !important; }
/* end audit-v18 */


/* ===== PURE LEAF — BODY FONT: NUNITO SANS [audit-v19] =====
   Swap the base body font Open Sans -> Nunito Sans (loaded via the
   @import at the top of this file). Display section titles stay on
   their Lilita One stack; the nav keeps its own font. TO UNDO: delete
   this block AND the @import line at the very top. */
body,
h1, h2, h3, h4, h5, h6,
.sppb-addon-content, .sppb-addon-text-block .sppb-addon-content,
p, li, a, td, th, input, textarea, select, button, label, blockquote{
  font-family:'Nunito Sans', sans-serif !important;
}
/* keep the display section titles exactly as they were */
.sppb-addon-title{
  font-family:"Lilita One", system-ui, -apple-system, Arial, sans-serif !important;
}
/* end audit-v19 */


/* ===== PURE LEAF — HOMEPAGE SPPB LINK HOVER -> WHITE [audit-v20] =====
   On the homepage (#sp-page-builder.page-1) all SPPB addon links turn
   white on hover. TO UNDO: delete this block. */
#sp-page-builder.page-1 .sppb-addon a:hover,
#sp-page-builder.page-1 .sppb-addon a.sppb-btn:hover,
#sp-page-builder.page-1 .sppb-addon .sppb-btn.sppb-btn-custom:hover,
#sp-page-builder.page-1 .sppb-addon-overlay-image .sppb-btn:hover,
.page-1 .sppb-addon a:hover{ color:#ffffff !important; }
/* end audit-v20 */


/* ===== PURE LEAF — HOMEPAGE SPPB TEXT BOLD [audit-v21] =====
   Bold all text inside homepage SPPB addons. Font Awesome icon
   weights are re-asserted so glyphs don't break. TO UNDO: delete. */
#sp-page-builder.page-1 .sppb-addon,
#sp-page-builder.page-1 .sppb-addon p,
#sp-page-builder.page-1 .sppb-addon li,
#sp-page-builder.page-1 .sppb-addon a,
#sp-page-builder.page-1 .sppb-addon span,
#sp-page-builder.page-1 .sppb-addon td,
#sp-page-builder.page-1 .sppb-addon .sppb-addon-content,
#sp-page-builder.page-1 .sppb-addon .sppb-addon-title,
#sp-page-builder.page-1 .sppb-addon .sppb-addon-text{ font-weight:700 !important; }
#sp-page-builder.page-1 .sppb-addon i.fas,
#sp-page-builder.page-1 .sppb-addon i.fa-solid{ font-weight:900 !important; }
#sp-page-builder.page-1 .sppb-addon i.fab,
#sp-page-builder.page-1 .sppb-addon i.far,
#sp-page-builder.page-1 .sppb-addon i.fa-brands,
#sp-page-builder.page-1 .sppb-addon i.fa-regular{ font-weight:400 !important; }
/* end audit-v21 */


/* ===== PURE LEAF — FIX: Pe-icon-7-stroke menu icons [audit-v19-fix] =====
   The [audit-v19] `li{font-family:Nunito}` rule cascaded into the Helix
   main-menu icon ::before pseudos (which use the 'peIcon7' icon font),
   turning them into empty boxes. Re-assert the icon font on all pe-7s
   glyphs so the menu icons render. TO UNDO: delete this block. */
[class^="pe-7s-"]::before,
[class*=" pe-7s-"]::before{ font-family:'peIcon7' !important; }
/* end audit-v19-fix */


/* ===== PURE LEAF — MOBILE FOOTER BAND SPACING [audit-v22] =====
   On mobile the #sp-bottom content stacks (icons / phone / email) and
   was clipped against the band edges (audit-v17 zeroed padding for the
   desktop centered single row). Restore symmetric top/bottom breathing
   room + even spacing between the stacked rows. TO UNDO: delete block. */
@media (max-width:600px){
  #sp-bottom{ min-height:0 !important; padding-top:26px !important; padding-bottom:26px !important; }
  #sp-bottom .pl-footer-band{ gap:18px !important; }
  #sp-bottom .pl-footer-contact{ gap:12px !important; }
}
/* end audit-v22 */