/* Roll 32 global shell module — CSS-6 test build */
:root {
  --r32-global-module-loaded: 1;
  --r32-global-module-version: "0.8.0";
}

/* ============================================================
   ROLL 32 — MASTER THEME + SHOP + PRODUCT UX (CLEAN MASTER)
   Single source of truth • Sharp edges • Deduped key sections
   ============================================================ */

/* ============================================================
   0) ROOT TOKENS
   ============================================================ */
:root{
  --r32-gold: #D4AF37;
  --r32-copper: #8E7618;

  --r32-obs: #0B0B0C;
  --r32-panel: #141415;
  --r32-alt: #1A1A1B;
  --r32-border: #2D2D2E;

  --r32-text: #B0B0B0;
  --r32-white: #FFFFFF;

  --r32-gold-08: rgba(212,175,55,0.08);
  --r32-gold-10: rgba(212,175,55,0.10);
  --r32-gold-12: rgba(212,175,55,0.12);
  --r32-gold-14: rgba(212,175,55,0.14);
  --r32-gold-18: rgba(212,175,55,0.18);
  --r32-gold-22: rgba(212,175,55,0.22);
  --r32-gold-35: rgba(212,175,55,0.35);
  --r32-gold-55: rgba(212,175,55,0.55);
  --r32-gold-75: rgba(212,175,55,0.75);
}

/* ============================================================
   1) GLOBAL HARD RESETS
   ============================================================ */
body,
.site,
.site-content{
  background: var(--r32-obs);
  color: var(--r32-text);
}

:where(
  button,
  input,
  select,
  textarea,
  .button,
  .ast-button,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button,
  .woocommerce #respond input#submit
){
  border-radius: 0 !important;
}

/* ============================================================
   2) NAV HOVER GLOW
   ============================================================ */
.main-header-menu .menu-item:hover > a,
.main-header-menu .sub-menu .menu-item:hover > a{
  color: var(--r32-gold) !important;
  text-shadow:
    0 0 4px rgba(212,175,55,1),
    0 0 10px rgba(212,175,55,0.8),
    0 0 18px rgba(212,175,55,0.4);
  letter-spacing: 0.5px;
  transition: all 0.35s ease-in-out;
}

.main-header-menu:hover .menu-item:not(:hover) > a{
  opacity: 0.6;
  transition: opacity 0.35s ease;
}

.main-header-menu a::after{
  display: none !important;
}
/* ============================================================
   R32 RESPONSIVE HEADER / TRUST MENU
   Clean consolidated version
   ============================================================ */

/* Default: grouped trust dropdown hidden */
.main-header-menu > .r32-trust-menu-group {
	display: none !important;
}

/* ============================================================
   MOBILE / HAMBURGER RANGE
   920px and below
   Let Astra handle the mobile header normally.
   ============================================================ */
@media (max-width: 920px) {
	#ast-hf-mobile-menu > .r32-trust-menu-group,
	#ast-hf-menu-1 > .r32-trust-menu-group,
	#ast-hf-menu-1-sticky > .r32-trust-menu-group {
		display: none !important;
	}

	#ast-hf-mobile-menu > .menu-item-6826,
	#ast-hf-mobile-menu > .menu-item-1171,
	#ast-hf-mobile-menu > .menu-item-1170 {
		display: list-item !important;
		visibility: visible !important;
		width: auto !important;
		max-width: none !important;
		overflow: visible !important;
		pointer-events: auto !important;
	}
}

/* ============================================================
   PHONE MOBILE DRAWER + GROUPED TRUST MENU RANGE
   Phone: keep simple links stacked and hide tablet-only About Roll 32 group.
   Tablet/Desktop 921px–1370px: swap The Artists / Contact Us / About
   for the About Roll 32 dropdown.
   ============================================================ */

/* Phone hamburger drawer only */
@media (max-width: 767px) {
	#ast-mobile-popup-wrapper .main-header-menu.ast-flex.stack-on-mobile {
		display: flex !important;
		flex-direction: column !important;
		width: 100% !important;
	}

	#ast-mobile-popup-wrapper .main-header-menu.ast-flex.stack-on-mobile > li:not(.r32-trust-menu-group):not(#menu-item-14073) {
		display: block !important;
		width: 100% !important;
		float: none !important;
	}

	#ast-mobile-popup-wrapper .main-header-menu.ast-flex.stack-on-mobile > li:not(.r32-trust-menu-group):not(#menu-item-14073) > a.menu-link {
		display: block !important;
		width: 100% !important;
		text-align: left !important;
		white-space: normal !important;
	}

	/* Hide tablet/header-only About Roll 32 dropdown clone on phone */
	#ast-mobile-popup-wrapper .r32-trust-menu-group,
	#ast-mobile-popup-wrapper #menu-item-14073 {
		display: none !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}
}

/* Grouped trust dropdown range */
@media (min-width: 921px) and (max-width: 1370px) {

	/* Prevent Astra's broken mobile/tablet clone from appearing in this range */
	#masthead .ast-mobile-header-wrap,
	#masthead .ast-mobile-header-content,
	#masthead [id*="mobile-header"],
	#masthead nav[id*="mobile"],
	#masthead .menu-toggle {
		display: none !important;
		visibility: hidden !important;
		height: 0 !important;
		min-height: 0 !important;
		overflow: hidden !important;
		pointer-events: none !important;
	}

	/* Hide sticky duplicate header clone if Astra renders it */
	#masthead .ast-primary-header-bar:has(#ast-hf-menu-1-sticky) {
		display: none !important;
	}

	/* Keep menu on one row, but do not change text size */
	#masthead #ast-hf-menu-1,
	#masthead #ast-hf-menu-1-sticky {
		display: flex !important;
		flex-flow: row nowrap !important;
		align-items: center !important;
		white-space: nowrap !important;
	}

	#masthead #ast-hf-menu-1 > li,
	#masthead #ast-hf-menu-1-sticky > li {
		flex: 0 0 auto !important;
		width: auto !important;
		max-width: none !important;
	}

	/* Hide individual trust links */
	#masthead #ast-hf-menu-1 > .menu-item-6826,
	#masthead #ast-hf-menu-1 > .menu-item-1171,
	#masthead #ast-hf-menu-1 > .menu-item-1170,
	#masthead #ast-hf-menu-1-sticky > .menu-item-6826,
	#masthead #ast-hf-menu-1-sticky > .menu-item-1171,
	#masthead #ast-hf-menu-1-sticky > .menu-item-1170 {
		display: none !important;
		visibility: hidden !important;
		width: 0 !important;
		max-width: 0 !important;
		overflow: hidden !important;
		pointer-events: none !important;
	}

	/* Show grouped trust dropdown */
	#masthead #ast-hf-menu-1 > .r32-trust-menu-group,
	#masthead #ast-hf-menu-1-sticky > .r32-trust-menu-group {
		display: list-item !important;
		visibility: visible !important;
		width: auto !important;
		max-width: none !important;
		overflow: visible !important;
		pointer-events: auto !important;
	}
}

/* ============================================================
   TIGHT DESKTOP RANGE
   1051px–1123px
   Keep normal menu text size.
   Only make Forge CTA one-line to save space.
   ============================================================ */
@media (min-width: 1051px) and (max-width: 1123px) {
	#masthead .r32-enter-forge {
		white-space: nowrap !important;
	}

	#masthead .r32-enter-forge-sub {
		display: none !important;
	}
}

/* ============================================================
   NARROW DESKTOP / TABLET EDGE
   921px–1050px
   Slightly reduce header text and use one-line Forge CTA.
   ============================================================ */
@media (min-width: 921px) and (max-width: 1050px) {
	#masthead #ast-hf-menu-1 > li > a,
	#masthead #ast-hf-menu-1-sticky > li > a {
		font-size: 16px !important;
		letter-spacing: 0.35px !important;
		line-height: 1 !important;
		padding-left: 3px !important;
		padding-right: 3px !important;
		white-space: nowrap !important;
	}

	#masthead #ast-hf-menu-1,
	#masthead #ast-hf-menu-1-sticky {
		gap: 12px !important;
	}

	#masthead .r32-enter-forge {
		white-space: nowrap !important;
		padding: 6px 10px !important;
	}

	#masthead .r32-enter-forge-main {
		font-size: 10.5px !important;
		letter-spacing: 0.35px !important;
		line-height: 1 !important;
	}

	#masthead .r32-enter-forge-sub {
		display: none !important;
	}
}



/* ============================================================
   NORMAL GROUPED DESKTOP RANGE
   1124px–1370px
   Restore normal Forge CTA subline.
   No header text-size changes here.
   ============================================================ */
@media (min-width: 1124px) and (max-width: 1370px) {
	#masthead .r32-enter-forge-sub {
		display: block !important;
	}
}

/* ============================================================
   WIDE DESKTOP
   1371px and above
   Full trust links visible, grouped dropdown hidden.
   ============================================================ */
@media (min-width: 1371px) {
	#ast-hf-menu-1 > .r32-trust-menu-group,
	#ast-hf-menu-1-sticky > .r32-trust-menu-group {
		display: none !important;
	}

	#ast-hf-menu-1 > .menu-item-6826,
	#ast-hf-menu-1 > .menu-item-1171,
	#ast-hf-menu-1 > .menu-item-1170,
	#ast-hf-menu-1-sticky > .menu-item-6826,
	#ast-hf-menu-1-sticky > .menu-item-1171,
	#ast-hf-menu-1-sticky > .menu-item-1170 {
		display: list-item !important;
		visibility: visible !important;
		width: auto !important;
		max-width: none !important;
		overflow: visible !important;
		pointer-events: auto !important;
	}
}

/* ============================================================
   35) ASTRA MOBILE MENU DARK THEME + SINGLE SCROLLBAR
   ============================================================ */
@media (max-width: 921px){
  #ast-mobile-popup,
  .ast-mobile-popup-drawer,
  .ast-mobile-popup-inner,
  .ast-mobile-popup-content,
  .ast-mobile-popup-overlay + .ast-mobile-popup-inner{
    background: #0B0B0C !important;
  }

  #ast-mobile-popup{
    overflow: hidden !important;
    background: #0B0B0C !important;
  }

  #ast-mobile-popup .ast-mobile-popup-inner{
    height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: #0B0B0C !important;
  }

  #ast-mobile-popup .ast-builder-menu-mobile,
  #ast-mobile-popup .main-navigation,
  #ast-mobile-popup .main-header-menu{
    overflow: visible !important;
    max-height: none !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #ast-mobile-popup .ast-builder-menu-mobile,
  #ast-mobile-popup .ast-builder-layout-element,
  #ast-mobile-popup .main-header-menu,
  #ast-mobile-popup .main-navigation,
  #ast-mobile-popup .menu-item,
  #ast-mobile-popup .sub-menu{
    background: transparent !important;
  }

  #ast-mobile-popup .ast-mobile-popup-header,
  #ast-mobile-popup .menu-toggle-close,
  #ast-mobile-popup .ast-mobile-popup-inner > *{
    background-color: transparent !important;
  }

  #ast-mobile-popup .ast-builder-layout-element[data-section],
  #ast-mobile-popup .widget,
  #ast-mobile-popup .menu-item-object-custom,
  #ast-mobile-popup .ast-header-account-wrap,
  #ast-mobile-popup .ast-builder-menu-mobile + *{
    background: transparent !important;
  }

  #ast-mobile-popup form,
  #ast-mobile-popup .search-form,
  #ast-mobile-popup .ast-search-menu-icon,
  #ast-mobile-popup .ast-search-icon,
  #ast-mobile-popup input,
  #ast-mobile-popup .search-field{
    background-color: #141415 !important;
    color: #FFFFFF !important;
    border-color: #2D2D2E !important;
  }

  #ast-mobile-popup .menu-toggle-close,
  #ast-mobile-popup .close-toggle{
    color: #FFFFFF !important;
  }

  #ast-mobile-popup .menu-link,
  #ast-mobile-popup a{
    color: #D4AF37 !important;
    background: transparent !important;
  }

  #ast-mobile-popup .main-header-menu .menu-item,
  #ast-mobile-popup .main-header-menu .page_item,
  #ast-mobile-popup .main-navigation .menu-item,
  #ast-mobile-popup .main-navigation .page_item,
  #ast-mobile-popup .ast-builder-menu-mobile .menu-item,
  #ast-mobile-popup .ast-builder-menu-mobile .page_item{
    border: 0 !important;
    box-shadow: none !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #ast-mobile-popup .main-header-menu .menu-item::before,
  #ast-mobile-popup .main-header-menu .menu-item::after,
  #ast-mobile-popup .main-navigation .menu-item::before,
  #ast-mobile-popup .main-navigation .menu-item::after,
  #ast-mobile-popup .ast-builder-menu-mobile .menu-item::before,
  #ast-mobile-popup .ast-builder-menu-mobile .menu-item::after{
    display: none !important;
    content: none !important;
  }

  #ast-mobile-popup .main-header-menu .menu-item > a,
  #ast-mobile-popup .main-navigation .menu-item > a,
  #ast-mobile-popup .ast-builder-menu-mobile .menu-item > a{
    border-bottom: 1px solid rgba(212,175,55,0.45) !important;
    padding: 16px 18px !important;
    min-height: 0 !important;
    line-height: 1.2 !important;
    font-size: 17px !important;
    display: flex !important;
    align-items: center !important;
  }

  #ast-mobile-popup .main-header-menu > .menu-item:first-child > a,
  #ast-mobile-popup .main-navigation > .menu-item:first-child > a,
  #ast-mobile-popup .ast-builder-menu-mobile > .menu-item:first-child > a{
    border-top: 1px solid rgba(212,175,55,0.45) !important;
  }

  #ast-mobile-popup .menu-item-has-children > a{
    padding-right: 12px !important;
  }

  #ast-mobile-popup .ast-menu-toggle{
    padding: 0 14px !important;
    min-width: auto !important;
  }

  #ast-mobile-popup .ast-menu-toggle,
  #ast-mobile-popup .ast-menu-toggle svg{
    color: #D4AF37 !important;
    fill: #D4AF37 !important;
  }
}

/* Obsolete Jetpack-era Contact styling removed. Current Contact form styling is owned by Roll 32 Contact v1.2.0. */

/* Homepage CTA / New Arrivals typography migrated to Roll 32 Site Styles. */

/* ============================================================
   ROLL32 — GLOBAL MOBILE FOOTER — COMPACT, NO OVERLAP
   Homepage-only Pass 2 rules moved to Roll 32 Site Styles.
   ============================================================ */
@media (max-width: 920px){

/* ------------------------------------------------------------
     GLOBAL MOBILE FOOTER — COMPACT, NO OVERLAP
     ------------------------------------------------------------ */
  footer.site-footer,
  .site-footer,
  .site-primary-footer-wrap,
  .site-below-footer-wrap{
    margin-top: 0 !important;
  }

  /* Primary footer: links / studio credit / social icons */
  .site-primary-footer-wrap{
    padding-top: 28px !important;
    padding-bottom: 14px !important;
  }

  .site-primary-footer-wrap .ast-builder-grid-row,
  .site-primary-footer-wrap .ast-builder-footer-grid-columns{
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 18px !important;
    row-gap: 18px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .site-primary-footer-wrap .site-footer-section,
  .site-primary-footer-wrap .site-footer-primary-section-1,
  .site-primary-footer-wrap .site-footer-primary-section-2,
  .site-primary-footer-wrap .site-footer-primary-section-3{
    width: 100% !important;
    max-width: 360px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    float: none !important;
    clear: both !important;
    position: relative !important;
    overflow: visible !important;
  }

  .site-primary-footer-wrap .footer-widget-area,
  .site-primary-footer-wrap .widget,
  .site-primary-footer-wrap .ast-builder-layout-element,
  .site-primary-footer-wrap .ast-builder-html-element{
    width: 100% !important;
    max-width: 360px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
  }

  /* Legal links: compact 2x2 grid */
  .site-footer-primary-section-1 .menu-footer-menu-2-container ul,
  .site-footer-primary-section-1 ul.menu{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px 18px !important;
    width: 100% !important;
    max-width: 340px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
    text-align: center !important;
  }

  .site-footer-primary-section-1 li{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
  }

  .site-footer-primary-section-1 a{
    display: inline-block !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: center !important;
  }

  /* Studio attribution: keep readable, prevent collision */
  .site-footer-primary-section-2{
    display: block !important;
    line-height: 1.3 !important;
  }

  .site-footer-primary-section-2 p,
  .site-footer-primary-section-2 div,
  .site-footer-primary-section-2 span,
  .site-footer-primary-section-2 a,
  .site-footer-primary-section-2 .uagb-heading-text{
    display: block !important;
    position: relative !important;
    float: none !important;
    clear: both !important;
    max-width: 340px !important;
    margin: 0 auto 6px !important;
    padding: 0 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    white-space: normal !important;
    overflow: visible !important;
  }

  .site-footer-primary-section-2 .uagb-heading-text{
    font-size: 11px !important;
    letter-spacing: 0.25px !important;
    margin-bottom: 8px !important;
  }

  .site-footer-primary-section-2 p,
  .site-footer-primary-section-2 a,
  .site-footer-primary-section-2 span{
    font-size: 11px !important;
  }

  /* Social icons — premium dark/gold, no white tiles */
  .site-footer-primary-section-3{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  .site-footer .social-inner-wrap,
  .site-footer .ast-footer-social-wrap{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  .site-footer .social-show-label-false a,
  .site-footer .ast-footer-social-wrap a,
  .site-footer .ast-builder-social-element a{
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    background: rgba(11,11,12,0.82) !important;
    background-color: rgba(11,11,12,0.82) !important;
    border: 1px solid rgba(212,175,55,0.62) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,0.03),
      0 8px 18px rgba(0,0,0,0.34) !important;
    color: #D4AF37 !important;
    line-height: 1 !important;
  }

  .site-footer .social-show-label-false a:hover,
  .site-footer .ast-footer-social-wrap a:hover,
  .site-footer .ast-builder-social-element a:hover{
    background: rgba(212,175,55,0.10) !important;
    background-color: rgba(212,175,55,0.10) !important;
    border-color: rgba(212,175,55,0.88) !important;
    color: #D4AF37 !important;
    box-shadow:
      0 0 0 2px rgba(212,175,55,0.12),
      0 10px 22px rgba(0,0,0,0.40) !important;
  }

  .site-footer .social-show-label-false a svg,
  .site-footer .ast-footer-social-wrap a svg,
  .site-footer .ast-builder-social-element a svg{
    width: 19px !important;
    height: 19px !important;
    fill: currentColor !important;
    color: currentColor !important;
  }

  .site-footer .social-show-label-false a i,
  .site-footer .ast-footer-social-wrap a i,
  .site-footer .ast-builder-social-element a i{
    font-size: 19px !important;
    color: currentColor !important;
    line-height: 1 !important;
  }

  .site-footer .ast-builder-social-element,
  .site-footer .ast-footer-social-wrap .ast-builder-social-element{
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Bottom footer: copyright / location / powered by */
  .site-below-footer-wrap{
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .site-below-footer-wrap .ast-builder-grid-row,
  .site-below-footer-wrap .ast-builder-footer-grid-columns,
  .site-below-footer-wrap .site-below-footer-inner-wrap{
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    row-gap: 4px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  .site-below-footer-wrap .site-footer-section,
  .site-below-footer-wrap .site-footer-below-section-1,
  .site-below-footer-wrap .site-footer-below-section-2,
  .site-below-footer-wrap .site-footer-below-section-3,
  .site-below-footer-wrap .footer-widget-area,
  .site-below-footer-wrap .widget,
  .site-below-footer-wrap .ast-builder-layout-element,
  .site-below-footer-wrap .ast-builder-html-element,
  .site-below-footer-wrap .ast-footer-copyright{
    display: block !important;
    width: 100% !important;
    max-width: 360px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1.15 !important;
  }

  .site-below-footer-wrap p,
  .site-below-footer-wrap div,
  .site-below-footer-wrap span{
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    text-align: center !important;
  }
}
/* Homepage trust strip / card peek / hero / New Arrivals rules migrated to Roll 32 Site Styles. */
/* ============================================================
ROLL32 — MOBILE MENU BUTTON SIZE FIX
============================================================ */

@media (max-width: 920px){

  /* hamburger button container */
  .ast-mobile-header-wrap .menu-toggle,
  .ast-mobile-header-wrap .ast-button-wrap{
    padding: 10px !important;
    width: 34px !important;
    height: 34px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* gold background box */
  .ast-mobile-header-wrap .ast-button-wrap .ast-mobile-menu-trigger-minimal{
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* the actual 3-line icon */
  .ast-mobile-header-wrap .ast-mobile-menu-icon{
    font-size: 18px !important;
    line-height: 1 !important;
  }

}

.site-footer-below-section-2{
  display: flex !important;
  justify-content: center !important;
}

.site-footer-below-section-2 .footer-widget-area{
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

.site-footer-below-section-2 p{
  text-align: center !important;
}

/* ============================================================
   ROLL 32 — MOBILE DRAWER / ARTIFACT PANEL
   Safe scope: Astra mobile popup only
============================================================ */
@media (max-width: 921px){

    /* ========================================================
       1) DRAWER SHELL
    ======================================================== */
    #ast-mobile-popup,
    .ast-mobile-popup-drawer{
        background: rgba(0,0,0,0.48) !important;
    }

    #ast-mobile-popup .ast-mobile-popup-inner,
    .ast-mobile-popup-drawer .ast-mobile-popup-inner{
        background:
            linear-gradient(180deg,
                rgba(20,20,21,0.985) 0%,
                rgba(11,11,12,0.992) 58%,
                rgba(7,7,8,0.995) 100%) !important;
        border-left: 1px solid rgba(212,175,55,0.24) !important;
        box-shadow:
            -22px 0 46px rgba(0,0,0,0.58),
            -1px 0 0 rgba(212,175,55,0.08),
            inset 1px 0 0 rgba(255,255,255,0.02) !important;
        position: relative !important;
        overflow-x: hidden !important;
    }

    /* subtle gold edge glow */
    #ast-mobile-popup .ast-mobile-popup-inner::before,
    .ast-mobile-popup-drawer .ast-mobile-popup-inner::before{
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 1px !important;
        height: 100% !important;
        background: linear-gradient(
            to bottom,
            rgba(212,175,55,0),
            rgba(212,175,55,0.34),
            rgba(212,175,55,0)
        ) !important;
        box-shadow:
            0 0 8px rgba(212,175,55,0.18),
            0 0 18px rgba(212,175,55,0.08) !important;
        pointer-events: none !important;
        z-index: 2 !important;
    }

    /* ========================================================
       2) DRAWER HEADER
    ======================================================== */
    #ast-mobile-popup .ast-mobile-popup-header,
    .ast-mobile-popup-drawer .ast-mobile-popup-header{
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        min-height: 64px !important;
        padding: 12px 16px !important;
        background:
            linear-gradient(180deg,
                rgba(18,18,19,0.92) 0%,
                rgba(11,11,12,0.55) 100%) !important;
        border-bottom: 1px solid rgba(212,175,55,0.14) !important;
        box-shadow:
            inset 0 -1px 0 rgba(255,255,255,0.015),
            0 10px 26px rgba(0,0,0,0.18) !important;
    }

    /* branded micro-heading */
    #ast-mobile-popup .ast-mobile-popup-header::before,
    .ast-mobile-popup-drawer .ast-mobile-popup-header::before{
        content: "ROLL 32" !important;
        position: absolute !important;
        left: 18px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        color: rgba(212,175,55,0.92) !important;
        font-family: "Cinzel Decorative", serif !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        letter-spacing: 0.16em !important;
        text-transform: uppercase !important;
        text-shadow:
            0 0 8px rgba(212,175,55,0.08) !important;
        pointer-events: none !important;
    }

    /* close button */
    #ast-mobile-popup .menu-toggle-close,
    #ast-mobile-popup .ast-mobile-popup-close,
    .ast-mobile-popup-drawer .menu-toggle-close,
    .ast-mobile-popup-drawer .ast-mobile-popup-close{
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        color: #D4AF37 !important;
        text-decoration: none !important;
    }

    #ast-mobile-popup .menu-toggle-close:hover,
    #ast-mobile-popup .ast-mobile-popup-close:hover,
    .ast-mobile-popup-drawer .menu-toggle-close:hover,
    .ast-mobile-popup-drawer .ast-mobile-popup-close:hover{
        color: #f3e5a8 !important;
        filter:
            brightness(1.08)
            drop-shadow(0 0 4px rgba(255,255,255,0.10))
            drop-shadow(0 0 8px rgba(212,175,55,0.16)) !important;
    }

    #ast-mobile-popup .menu-toggle-close .ast-mobile-svg,
    #ast-mobile-popup .menu-toggle-close svg,
    .ast-mobile-popup-drawer .menu-toggle-close .ast-mobile-svg,
    .ast-mobile-popup-drawer .menu-toggle-close svg{
        fill: currentColor !important;
    }

    /* ========================================================
       3) MENU BODY / SPACING
    ======================================================== */
    #ast-mobile-popup .ast-mobile-popup-content,
    .ast-mobile-popup-drawer .ast-mobile-popup-content{
        padding: 10px 18px 22px !important;
        background: transparent !important;
    }

    #ast-mobile-popup .main-header-menu,
    #ast-mobile-popup .ast-builder-menu-mobile .main-header-menu,
    .ast-mobile-popup-drawer .main-header-menu{
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
    }

    #ast-mobile-popup .main-header-menu > .menu-item,
    #ast-mobile-popup .ast-builder-menu-mobile .main-header-menu > .menu-item,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item{
        position: relative !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    /* refined divider lines */
    #ast-mobile-popup .main-header-menu > .menu-item:not(:last-child),
    #ast-mobile-popup .ast-builder-menu-mobile .main-header-menu > .menu-item:not(:last-child),
    .ast-mobile-popup-drawer .main-header-menu > .menu-item:not(:last-child){
        border-bottom: 1px solid rgba(212,175,55,0.11) !important;
    }

    /* ========================================================
       4) MENU LINKS
    ======================================================== */
    #ast-mobile-popup .main-header-menu > .menu-item > .menu-link,
    #ast-mobile-popup .ast-builder-menu-mobile .main-header-menu > .menu-item > .menu-link,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item > .menu-link{
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        min-height: 58px !important;
        padding: 17px 4px 17px 0 !important;
        margin: 0 !important;
        background: transparent !important;
        color: #B0B0B0 !important;
        font-family: "Cinzel", serif !important;
        font-size: 17px !important;
        font-weight: 500 !important;
        letter-spacing: 0.045em !important;
        line-height: 1.2 !important;
        text-transform: none !important;
        text-decoration: none !important;
        transition:
            color 0.22s ease,
            text-shadow 0.22s ease,
            padding-left 0.22s ease,
            background 0.22s ease !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    /* remove generic Astra arrow treatment if it feels noisy */
    #ast-mobile-popup .main-header-menu > .menu-item > .menu-link .ast-icon.icon-arrow,
    #ast-mobile-popup .main-header-menu > .menu-item > .menu-link .ast-arrow-svg,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item > .menu-link .ast-icon.icon-arrow,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item > .menu-link .ast-arrow-svg{
        opacity: 0.72 !important;
        color: #8E7618 !important;
        fill: #8E7618 !important;
        margin-right: 10px !important;
        transition:
            opacity 0.22s ease,
            color 0.22s ease,
            fill 0.22s ease !important;
    }

    /* hover / current state */
    #ast-mobile-popup .main-header-menu > .menu-item:hover > .menu-link,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-item > .menu-link,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-ancestor > .menu-link,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item:hover > .menu-link,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-item > .menu-link,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-ancestor > .menu-link{
        color: #D4AF37 !important;
        background: linear-gradient(
            90deg,
            rgba(212,175,55,0.06) 0%,
            rgba(212,175,55,0.02) 36%,
            rgba(212,175,55,0) 100%
        ) !important;
        text-shadow:
            0 0 8px rgba(212,175,55,0.14) !important;
        padding-left: 6px !important;
    }

    #ast-mobile-popup .main-header-menu > .menu-item:hover > .menu-link .ast-icon.icon-arrow,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-item > .menu-link .ast-icon.icon-arrow,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-ancestor > .menu-link .ast-icon.icon-arrow,
    #ast-mobile-popup .main-header-menu > .menu-item:hover > .menu-link .ast-arrow-svg,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-item > .menu-link .ast-arrow-svg,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-ancestor > .menu-link .ast-arrow-svg,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item:hover > .menu-link .ast-icon.icon-arrow,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-item > .menu-link .ast-icon.icon-arrow,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-ancestor > .menu-link .ast-icon.icon-arrow,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item:hover > .menu-link .ast-arrow-svg,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-item > .menu-link .ast-arrow-svg,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-ancestor > .menu-link .ast-arrow-svg{
        opacity: 1 !important;
        color: #D4AF37 !important;
        fill: #D4AF37 !important;
    }

    /* subtle left accent on hover/current */
    #ast-mobile-popup .main-header-menu > .menu-item > .menu-link::before,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item > .menu-link::before{
        content: "" !important;
        position: absolute !important;
        left: -10px !important;
        top: 50% !important;
        transform: translateY(-50%) scaleY(0.6) !important;
        width: 2px !important;
        height: 22px !important;
        background: linear-gradient(
            to bottom,
            rgba(212,175,55,0),
            rgba(212,175,55,0.85),
            rgba(212,175,55,0)
        ) !important;
        opacity: 0 !important;
        transition:
            opacity 0.22s ease,
            transform 0.22s ease !important;
        pointer-events: none !important;
    }

    #ast-mobile-popup .main-header-menu > .menu-item:hover > .menu-link::before,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-item > .menu-link::before,
    #ast-mobile-popup .main-header-menu > .menu-item.current-menu-ancestor > .menu-link::before,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item:hover > .menu-link::before,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-item > .menu-link::before,
    .ast-mobile-popup-drawer .main-header-menu > .menu-item.current-menu-ancestor > .menu-link::before{
        opacity: 1 !important;
        transform: translateY(-50%) scaleY(1) !important;
    }

    /* ========================================================
       5) SUBMENUS (safe polish if they ever appear)
    ======================================================== */
    #ast-mobile-popup .sub-menu,
    .ast-mobile-popup-drawer .sub-menu{
        background: rgba(255,255,255,0.015) !important;
        border-left: 1px solid rgba(212,175,55,0.12) !important;
        margin: 0 0 10px 8px !important;
        padding: 4px 0 6px 12px !important;
        box-shadow: none !important;
    }

    #ast-mobile-popup .sub-menu .menu-link,
    .ast-mobile-popup-drawer .sub-menu .menu-link{
        min-height: 42px !important;
        padding: 10px 0 !important;
        color: #9d9d9f !important;
        font-family: "Cinzel", serif !important;
        font-size: 14px !important;
        letter-spacing: 0.035em !important;
        background: transparent !important;
    }

    #ast-mobile-popup .sub-menu .menu-link:hover,
    #ast-mobile-popup .sub-menu .current-menu-item > .menu-link,
    .ast-mobile-popup-drawer .sub-menu .menu-link:hover,
    .ast-mobile-popup-drawer .sub-menu .current-menu-item > .menu-link{
        color: #D4AF37 !important;
        text-shadow: 0 0 6px rgba(212,175,55,0.12) !important;
    }

    /* ========================================================
       6) SIGNATURE FLOURISH
    ======================================================== */
    #ast-mobile-popup .ast-mobile-popup-content::after,
    .ast-mobile-popup-drawer .ast-mobile-popup-content::after{
        content: "" !important;
        display: block !important;
        height: 26px !important;
        margin: 16px 0 0 !important;
        border-top: 1px solid rgba(212,175,55,0.10) !important;
        background: linear-gradient(
            180deg,
            rgba(212,175,55,0.035) 0%,
            rgba(212,175,55,0) 100%
        ) !important;
        pointer-events: none !important;
    }
}

/* ============================================================
   ROLL 32 — MOBILE HEADER BURGER + ICON SPACING POLISH
============================================================ */
@media (max-width: 921px){

  /* --------------------------------------------
     Right-side cluster spacing
  --------------------------------------------- */
   .site-header-primary-section-right .ast-builder-menu-2{
    margin-right: 0 !important;
  }

  .site-header-primary-section-right [data-section="section-header-mobile-trigger"]{
    margin-left: 0 !important;
    flex: 0 0 auto !important;
  }

  /* --------------------------------------------
     Burger shell = closer to account icon scale
  --------------------------------------------- */
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle,
  .ast-mobile-header-wrap .main-header-menu-toggle,
  .ast-mobile-header-wrap .menu-toggle{
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background:
      linear-gradient(180deg,
        rgba(20,20,21,0.98) 0%,
        rgba(11,11,12,0.99) 100%) !important;
    border: 2px solid rgba(212,175,55,0.72) !important;
    border-radius: 0 !important;
    box-shadow:
      0 6px 14px rgba(0,0,0,0.24),
      inset 0 1px 0 rgba(255,255,255,0.025),
      inset 0 0 0 1px rgba(212,175,55,0.04) !important;
    transition:
      background 0.22s ease,
      border-color 0.22s ease,
      box-shadow 0.22s ease,
      filter 0.22s ease !important;
  }

  /* --------------------------------------------
     Burger icon color + smaller internal scale
  --------------------------------------------- */
  .ast-mobile-header-wrap .menu-toggle .mobile-menu-toggle-icon,
  .ast-mobile-header-wrap .main-header-menu-toggle .mobile-menu-toggle-icon{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
  }

  .ast-mobile-header-wrap .menu-toggle .ahfb-svg-iconset,
  .ast-mobile-header-wrap .main-header-menu-toggle .ahfb-svg-iconset{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: scale(0.78) !important;
    transform-origin: center !important;
  }

  .ast-mobile-header-wrap .menu-toggle .ast-mobile-svg,
  .ast-mobile-header-wrap .menu-toggle svg,
  .ast-mobile-header-wrap .menu-toggle svg *{
    fill: #D4AF37 !important;
    color: #D4AF37 !important;
    stroke: #D4AF37 !important;
    stroke-width: 1.4 !important;
    opacity: 1 !important;
    transition:
      fill 0.22s ease,
      color 0.22s ease,
      stroke 0.22s ease,
      filter 0.22s ease !important;
  }

  /* keep only relevant icon visible */
  .ast-mobile-header-wrap .menu-toggle[aria-expanded="false"] .ast-close-svg{
    display: none !important;
  }

  .ast-mobile-header-wrap .menu-toggle[aria-expanded="true"] .ast-menu-svg{
    display: none !important;
  }

  /* --------------------------------------------
     Hover / focus = same family as account icon
  --------------------------------------------- */
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:hover,
  .ast-mobile-header-wrap .main-header-menu-toggle:hover,
  .ast-mobile-header-wrap .menu-toggle:hover,
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:focus,
  .ast-mobile-header-wrap .main-header-menu-toggle:focus,
  .ast-mobile-header-wrap .menu-toggle:focus{
    border-color: #f3e5a8 !important;
    box-shadow:
      0 6px 14px rgba(0,0,0,0.28),
      0 0 5px rgba(255,255,255,0.06),
      0 0 8px rgba(212,175,55,0.12),
      inset 0 1px 0 rgba(255,255,255,0.03),
      inset 0 0 0 1px rgba(212,175,55,0.06) !important;
    filter: brightness(1.03) !important;
  }

  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:hover .ast-mobile-svg,
  .ast-mobile-header-wrap .main-header-menu-toggle:hover .ast-mobile-svg,
  .ast-mobile-header-wrap .menu-toggle:hover .ast-mobile-svg,
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:focus .ast-mobile-svg,
  .ast-mobile-header-wrap .main-header-menu-toggle:focus .ast-mobile-svg,
  .ast-mobile-header-wrap .menu-toggle:focus .ast-mobile-svg,
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:hover svg,
  .ast-mobile-header-wrap .main-header-menu-toggle:hover svg,
  .ast-mobile-header-wrap .menu-toggle:hover svg,
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:focus svg,
  .ast-mobile-header-wrap .main-header-menu-toggle:focus svg,
  .ast-mobile-header-wrap .menu-toggle:focus svg,
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:hover svg *,
  .ast-mobile-header-wrap .main-header-menu-toggle:hover svg *,
  .ast-mobile-header-wrap .menu-toggle:hover svg *,
  .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle:focus svg *,
  .ast-mobile-header-wrap .main-header-menu-toggle:focus svg *,
  .ast-mobile-header-wrap .menu-toggle:focus svg *{
    fill: #f3e5a8 !important;
    color: #f3e5a8 !important;
    stroke: #f3e5a8 !important;
    filter:
      drop-shadow(0 0 2px rgba(255,255,255,0.06))
      drop-shadow(0 0 4px rgba(212,175,55,0.08)) !important;
  }

  /* --------------------------------------------
     Tiny visual balance with account icon
  --------------------------------------------- */
  .site-header-primary-section-right .ast-builder-menu-2 li.menu-account-icon > a.menu-link{
    margin-right: 0 !important;
  }
}
@media (max-width: 921px){

  .site-header-primary-section-right .ast-builder-menu-2,
  .site-header-primary-section-right .ast-builder-menu-2 .ast-main-header-bar-alignment,
  .site-header-primary-section-right .ast-builder-menu-2 .main-header-bar-navigation,
  .site-header-primary-section-right .ast-builder-menu-2 .site-navigation,
  .site-header-primary-section-right .ast-builder-menu-2 .main-navigation,
  .site-header-primary-section-right .ast-builder-menu-2 .main-header-menu,
  .site-header-primary-section-right [data-section="section-header-mobile-trigger"]{
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .site-header-primary-section-right .ast-builder-menu-2{
    margin-right: -2px !important;
  }

  .site-header-primary-section-right [data-section="section-header-mobile-trigger"]{
    margin-left: 0px !important;
  }
}

