/** Shopify CDN: Minification failed

Line 113:10 Expected identifier but found whitespace
Line 113:11 Unexpected "''"
Line 124:25 Unexpected "0%"
Line 124:83 Unexpected "50%"

**/
/* ═══════════════════════════════════════════════
   ATHYRE — Design system using Dawn CSS variables
   Same visual design as athyre-22, but theme-editor-responsive.
   All colors use Dawn's --color-* variables so the theme editor works.
   ═══════════════════════════════════════════════ */

/* ── Body: let Dawn's font settings work, just add smoothing ── */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: var(--font-body-family) !important;
}

/* ── All headings: font-black tracking-tighter (no font-family override) ── */
h1,h2,h3,h4,h5,h6,.h0,.h1,.h2,.h3,.h4,.h5 {
  font-family: var(--font-heading-family) !important;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

/* ══════════════════════════════════════
   HERO BANNER — full viewport, dark overlay, centered white text
   Uses Dawn's banner section with visual overrides
   ══════════════════════════════════════ */
.shopify-section-group-header-group ~ * .banner,
.shopify-section .banner,
.banner { background: rgb(var(--color-foreground)); }

/* Full viewport height — hero only */
#MainContent > .shopify-section:first-child .banner { min-height: 100vh !important; min-height: 100svh !important; }

/* Image: overflow hidden for all banners */
.banner__media { overflow: hidden !important; }
/* Image: opacity-60 scale-105 — hero only */
#MainContent > .shopify-section:first-child .banner__media img,
#MainContent > .shopify-section:first-child .banner__media video {
  opacity: 0.6 !important;
  transform: scale(1.05) !important;
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
}
/* Non-hero banners: normal image display */
.banner__media img,
.banner__media video {
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
}

/* Gradient overlay — hero only */
#MainContent > .shopify-section:first-child .banner__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 50%, transparent 100%);
  z-index: 1;
}

/* Content box — transparent */
.banner__content { background: transparent !important; border: none !important; }
.banner__box { background: transparent !important; box-shadow: none !important; border: none !important; padding: 0 !important; }

/* Eyebrow text */
.banner__text, .banner__text p {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3em !important;
  text-transform: uppercase !important;
  color: rgba(var(--color-background), 0.7) !important;
  margin-bottom: 16px !important;
}

/* Hero heading */
.banner__heading {
  font-size: clamp(48px, 10vw, 128px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.05em !important;
  line-height: 0.95 !important;
  color: rgb(var(--color-background)) !important;
  text-transform: uppercase !important;
  margin-bottom: 32px !important;
  font-style: italic !important;
}

/* Hero button — inverted colors from scheme */
.banner .button--primary {
  background: rgb(var(--color-background)) !important;
  color: rgb(var(--color-foreground)) !important;
  border: none !important;
  padding: 16px 48px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1) !important;
  transition: all 0.2s !important;
}
.banner .button--primary:hover { background: #e5e7eb !important; color: rgb(var(--color-foreground)) !important; }

/* Scroll indicator line — hero only */
#MainContent > .shopify-section:first-child .banner::after 
  content: '';
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 48px;
  background: rgb(var(--color-background), 0.5);
  animation: scrollPulse 2s infinite;
  z-index: 10;
}
@keyframes scrollPulse { 0%,100%{opacity:0.5;transform:translateX(-50%) scaleY(1)} 50%{opacity:1;transform:translateX(-50%) scaleY(0.8)} }

/* Mobile hero */
@media (max-width: 767px) {
  #MainContent > .shopify-section:first-child .banner { min-height: 100svh !important; }
  .banner__heading { font-size: clamp(42px, 14vw, 72px) !important; line-height: 0.9 !important; }
  .banner .button--primary { padding: 14px 32px !important; }
}

/* ══════════════════════════════════════
   COLLECTION CARDS — aspect-[3/4], grayscale hover, overlay
   ══════════════════════════════════════ */
.collection-list { background: rgb(var(--color-background)); }

/* Mobile: horizontal scroll snap */
@media (max-width: 767px) {
  .collection-list__grid {
    display: flex !important;
    overflow-x: auto !important;
    gap: 16px !important;
    padding: 0 16px !important;
    margin: 0 -16px !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: none !important;
  }
  .collection-list__grid::-webkit-scrollbar { display: none !important; }
  .collection-list__item {
    flex: 0 0 75vw !important;
    max-width: 320px !important;
    scroll-snap-align: center !important;
  }
}

.collection-list__item .card {
  overflow: hidden !important;
  border-radius: 8px !important;
  position: relative !important;
  cursor: pointer !important;
  background: rgba(var(--color-foreground), 0.05);
}
@media (min-width: 768px) { .collection-list__item .card { border-radius: 0 !important; } }

/* Keep the collection card and the media box on the same height ratio.
   The empty grey block appeared because the outer card used one ratio
   while Dawn's inner media wrapper used another. */
.collection-list__item .card__inner.ratio::before {
  padding-bottom: calc(var(--collection-card-height, 135) * 1%) !important;
}

.collection-list__item .card__media img {
  transition: none !important;
  width: 100% !important; height: 100% !important; object-fit: cover !important;
}
/* Collection card hover image swap */
.collection-list__item .card__media .collection-card__hover {
  position: absolute !important;
  inset: 0 !important;
  opacity: 0 !important;
  transition: none !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: none !important;
}
.collection-list__item .card__media .collection-card__primary {
  transition: none !important;
  opacity: 1 !important;
}
.collection-list__item .media.media--hover-effect > img:only-child,
.collection-list__item .card-wrapper .media.media--hover-effect > img:only-child,
.collection-list__item .card__media .media--hover-effect > img:first-child {
  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
}
.collection-list__item .card:hover .media.media--hover-effect > img:first-child:only-child,
.collection-list__item .card-wrapper:hover .media.media--hover-effect > img:first-child:only-child,
.collection-list__item .card-wrapper:hover .media.media--hover-effect > img:first-child:not(:only-child),
.collection-list__item .card-wrapper:hover .card__media .media--hover-effect > img:first-child {
  transform: none !important;
  opacity: 1 !important;
}
.collection-list__item .card-wrapper:hover .media.media--hover-effect > img + img {
  transform: none !important;
  opacity: 0 !important;
}

/* Overlay */
.collection-list__item .card__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: transparent;
  transition: none;
  z-index: 1;
}

/* Card content: bottom-left */
.collection-list__item .card__content,
.collection-list__item .card__information {
  position: absolute !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important;
  padding: 16px !important;
  background: transparent !important;
  z-index: 2 !important;
  top: auto !important;
}
@media (min-width: 768px) {
  .collection-list__item .card__content,
  .collection-list__item .card__information { padding: 32px !important; }
}

/* Force card__information visible (Dawn hides it) */
.collection-list__item .card__information {
  display: block !important;
}
/* Hide outer card content (duplicate titles below image) */
.collection-list__item .card > .card__content {
  display: none !important;
}
/* Keep inner card content visible */
.collection-list__item .card__inner .card__content {
  display: grid !important;
}
/* Hide description text on overlay */
.collection-list__item .card__information p,
.collection-list__item .card__content p {
  display: none !important;
}
/* Hide arrow icon */
.collection-list__item .card__content .icon-wrap,
.collection-list__item .card__content .icon,
.collection-list__item .card__content svg,
.collection-list__item .card__content .card__heading a img {
  display: none !important;
}

.collection-list__item .card__heading,
.collection-list__item .card__heading a {
  font-size: clamp(18px, 2.5vw, 24px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  color: var(--collection-text-color, #fff) !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
  line-height: 1.1 !important;
  transition: none !important;
}
.collection-list__item .underline-links-hover:hover a,
.collection-list__item .card-wrapper:hover .card__heading a,
.collection-list__item .card:hover .card__heading a,
.collection-list__item .card__heading a:hover {
  color: var(--collection-text-color, #fff) !important;
  text-decoration: none !important;
  text-underline-offset: 0 !important;
}


/* ══════════════════════════════════════
   FEATURED COLLECTION / PRODUCT GRID
   ══════════════════════════════════════ */
.featured-collection { background: rgb(var(--color-background)); }

.featured-collection .collection__title,
.featured-collection__title {
  font-size: clamp(24px, 4vw, 48px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.05em !important;
  text-transform: uppercase !important;
}

/* ══════════════════════════════════════
   PRODUCT CARDS
   ══════════════════════════════════════ */
.card__media {
  background: rgba(var(--color-foreground), 0.05);
  overflow: hidden !important;
  border-radius: 8px !important;
  position: relative !important;
}
@media (min-width: 768px) { .card__media { border-radius: 0 !important; } }

.card__media img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
  transition: transform 0.7s ease !important;
}
.card-wrapper:hover .card__media img { transform: scale(1.05) !important; }
.card { border: none !important; box-shadow: none !important; border-radius: 0 !important; }

.card__content { padding: 0 !important; }
.card-information { padding: 0 !important; }
.card-information__wrapper {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  gap: 8px !important;
}
.card__heading { margin: 0 !important; flex: 1 !important; min-width: 0 !important; }
.card__heading a {
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  color: rgb(var(--color-foreground)) !important;
  text-decoration: none !important;
  text-transform: none !important;
  transition: color 0.2s !important;
  line-height: 1.3 !important;
}
.card-wrapper:hover .card__heading a { color: rgba(var(--color-foreground), 0.6) !important; }

.price__regular .price-item, .price__sale .price-item--sale {
  font-size: 14px !important; font-weight: 600 !important; white-space: nowrap !important;
}
.price__sale .price-item--regular {
  font-size: 11px !important; color: rgba(var(--color-foreground), 0.4) !important; text-decoration: line-through !important;
}

/* Badge: top-left */
.badge--bottom-left, .card__badge .badge {
  top: 8px !important; left: 8px !important; bottom: auto !important;
  border-radius: 0 !important;
  font-size: 9px !important; font-weight: 700 !important;
  letter-spacing: 0.12em !important; text-transform: uppercase !important;
  padding: 4px 10px !important;
  background: rgb(var(--color-background)) !important; color: rgb(var(--color-foreground)) !important;
}
@media (min-width: 768px) {
  .badge--bottom-left, .card__badge .badge { top: 16px !important; left: 16px !important; }
}

/* Quick add */
.quick-add { border-radius: 0 !important; padding: 0 !important; margin-top: 12px !important; }
.quick-add__submit {
  border-radius: 0 !important;
  background: transparent !important;
  color: rgb(var(--color-foreground)) !important;
  border: 1px solid rgba(var(--color-foreground), 0.2) !important;
  font-size: 10px !important; font-weight: 700 !important;
  letter-spacing: 0.15em !important; text-transform: uppercase !important;
  padding: 10px 0 !important;
  width: 100% !important;
  transition: all 0.3s ease !important;
}
.quick-add__submit:hover {
  background: rgb(var(--color-foreground)) !important;
  color: rgb(var(--color-background)) !important;
  border-color: rgb(var(--color-foreground)) !important;
}

/* ══════════════════════════════════════
   JOURNAL / BLOG SECTION
   ══════════════════════════════════════ */
.blog-posts, .articles-wrapper { background: rgb(var(--color-background)); }

.article-card__image-wrapper { aspect-ratio: 100 / var(--collection-card-height, 135); border-radius: 8px !important; overflow: hidden !important; }
@media (min-width: 768px) { .article-card__image-wrapper { border-radius: 0 !important; } }
.article-card__image-wrapper img { transition: none !important; }
.article-card .media.media--hover-effect > img:only-child,
.article-card-wrapper .media.media--hover-effect > img:only-child,
.article-card__image.media--hover-effect > img:first-child {
  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
}
.article-card:hover .media.media--hover-effect > img:first-child:only-child,
.article-card-wrapper:hover .media.media--hover-effect > img:first-child:only-child,
.article-card-wrapper:hover .media.media--hover-effect > img:first-child:not(:only-child),
.article-card-wrapper:hover .article-card__image.media--hover-effect > img:first-child {
  transform: none !important;
  opacity: 1 !important;
}
.article-card-wrapper:hover .media.media--hover-effect > img + img {
  transform: none !important;
  opacity: 0 !important;
}

.article-card__badge {
  position: absolute !important; top: 8px !important; left: 8px !important;
  background: rgb(var(--color-background)) !important; color: rgb(var(--color-foreground)) !important;
  font-size: 9px !important; font-weight: 900 !important;
  letter-spacing: 0.15em !important; text-transform: uppercase !important;
  padding: 6px 12px !important; border-radius: 0 !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15) !important;
}
@media (min-width: 768px) { .article-card__badge { top: 16px !important; left: 16px !important; } }

.article-card__title, .article-card__title a {
  font-size: clamp(14px, 1.5vw, 20px) !important;
  font-weight: 700 !important; color: rgb(var(--color-foreground)) !important;
  text-decoration: none !important; transition: color 0.2s !important;
}

/* ══════════════════════════════════════
   NEWSLETTER — dark scheme, italic heading
   ══════════════════════════════════════ */
.email-signup-banner { background: rgb(var(--color-foreground)); }
@media (min-width: 768px) { .email-signup-banner { padding: 96px 24px; } }

.email-signup-banner .section-header__heading,
.email-signup-banner__heading {
  font-size: clamp(28px, 6vw, 72px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.05em !important;
  text-transform: uppercase !important;
  font-style: italic !important;
  color: rgb(var(--color-background)) !important;
}
.email-signup-banner p, .email-signup-banner .rte p {
  color: rgba(var(--color-background), 0.4) !important;
  font-size: 12px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}
.email-signup-banner .field__input {
  background: rgba(var(--color-background), 0.1) !important;
  border: 1px solid rgba(var(--color-background), 0.2) !important;
  color: rgb(var(--color-background)) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}
.email-signup-banner .field__input::placeholder { color: rgba(var(--color-background), 0.5) !important; }
.email-signup-banner .field__input:focus { background: rgba(var(--color-background), 0.15) !important; border-color: rgba(var(--color-background), 0.5) !important; }
.email-signup-banner .button {
  background: rgb(var(--color-background)) !important; color: rgb(var(--color-foreground)) !important;
  border-radius: 0 !important;
  font-size: 11px !important; font-weight: 900 !important;
  letter-spacing: 0.2em !important; text-transform: uppercase !important;
}
.email-signup-banner .button:hover { opacity: 0.85; }

/* ══════════════════════════════════════
   HEADER
   ══════════════════════════════════════ */
.header { border-bottom: 1px solid rgba(var(--color-foreground), 0.06) !important; }
.header__heading-link .h2 {
  font-size: 20px !important; font-weight: 900 !important;
  letter-spacing: -0.02em !important; text-transform: uppercase !important;
}
.header__menu-item span, .header__menu-item {
  font-size: 13px !important; font-weight: 600 !important;
  letter-spacing: 0.08em !important; text-transform: uppercase !important;
}
.header__icon--cart .cart-count-bubble { border-radius: 50% !important; font-size: 9px !important; font-weight: 700 !important; }

/* ══════════════════════════════════════
   FOOTER
   ══════════════════════════════════════ */
.footer {
  background: rgb(var(--color-background)) !important;
  color: rgb(var(--color-foreground)) !important;
  border-top: 1px solid rgba(var(--color-foreground), 0.05) !important;
  padding: 48px 16px 32px !important;
}
@media (min-width: 768px) { .footer { padding: 80px 24px 40px !important; } }

.footer__heading {
  font-size: 10px !important; font-weight: 900 !important;
  letter-spacing: 0.3em !important; text-transform: uppercase !important;
  color: rgba(var(--color-foreground), 0.4) !important; margin-bottom: 24px !important;
}
.footer-block__details-content a,
.footer-block__details-content li {
  font-size: 13px !important; font-weight: 700 !important;
  letter-spacing: 0.12em !important; text-transform: uppercase !important;
  color: rgb(var(--color-foreground)) !important; text-decoration: none !important;
  transition: color 0.2s !important;
}
.footer-block__details-content a:hover { color: rgba(var(--color-foreground), 0.4) !important; }
.footer__list-social-link {
  width: 40px !important; height: 40px !important;
  border: 1px solid rgba(var(--color-foreground), 0.1) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  transition: all 0.2s !important; border-radius: 0 !important;
  color: rgb(var(--color-foreground)) !important;
}
.footer__list-social-link:hover {
  background: rgb(var(--color-foreground)) !important; color: rgb(var(--color-background)) !important;
  border-color: rgb(var(--color-foreground)) !important;
}
.footer__copyright, .footer__copyright a {
  font-size: 10px !important; font-weight: 900 !important;
  letter-spacing: 0.15em !important; text-transform: uppercase !important;
  color: rgba(var(--color-foreground), 0.4) !important; border-top-color: rgba(var(--color-foreground), 0.05) !important;
}

/* ══════════════════════════════════════
   CART DRAWER
   ══════════════════════════════════════ */
.cart-drawer { background: rgb(var(--color-background)) !important; }
.cart-drawer__heading {
  font-size: 18px !important; font-weight: 900 !important;
  letter-spacing: -0.02em !important; text-transform: uppercase !important;
}
.cart-item__name { font-size: 13px !important; font-weight: 700 !important; }
.cart-item__details {
  font-size: 10px !important; font-weight: 700 !important;
  letter-spacing: 0.12em !important; text-transform: uppercase !important;
  color: rgba(var(--color-foreground), 0.4) !important;
}
.quantity { border-radius: 100px !important; }
.cart__checkout-button {
  background: rgb(var(--color-button)) !important; color: rgb(var(--color-button-text)) !important;
  border-radius: 0 !important;
  font-size: 12px !important; font-weight: 700 !important;
  letter-spacing: 0.15em !important; text-transform: uppercase !important;
}

/* ══════════════════════════════════════
   GLOBAL BUTTONS — theme-aware colors
   ══════════════════════════════════════ */
.button { border-radius: 0 !important; font-weight: 700 !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; font-size: 11px !important; }
.button--primary { background: rgb(var(--color-button)) !important; color: rgb(var(--color-button-text)) !important; }
.button--primary:hover { opacity: 0.85; }
.button--secondary { background: transparent !important; color: rgb(var(--color-foreground)) !important; border: 2px solid rgb(var(--color-foreground)) !important; }
.button--secondary:hover { background: rgb(var(--color-foreground)) !important; color: rgb(var(--color-background)) !important; }

/* ══════════════════════════════════════
   INPUTS
   ══════════════════════════════════════ */
.field__input, .select__select, textarea {
  border-radius: 0 !important;
}
.field__input:focus, textarea:focus, .select__select:focus {
  border-color: rgb(var(--color-foreground)) !important; box-shadow: none !important;
}

/* ══════════════════════════════════════
   PAGE WIDTH
   ══════════════════════════════════════ */
.page-width { max-width: 1280px !important; }

/* ══════════════════════════════════════
   ANNOUNCEMENT BAR
   ══════════════════════════════════════ */
.announcement-bar__message {
  font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: 0.15em !important; text-transform: uppercase !important;
}

/* ══════════════════════════════════════
   KILL DAWN FLICKER — keep animation overrides on hero
   ══════════════════════════════════════ */
#MainContent > .shopify-section:first-child .banner.scroll-trigger,
#MainContent > .shopify-section:first-child .banner .scroll-trigger,
#MainContent > .shopify-section:first-child .banner .animate--fade-in,
#MainContent > .shopify-section:first-child .banner .animate--zoom-in,
#MainContent > .shopify-section:first-child .banner .animate--slide-in,
#MainContent > .shopify-section:first-child .banner__media.scroll-trigger,
#MainContent > .shopify-section:first-child .banner__media.animate--fade-in,
#MainContent > .shopify-section:first-child .banner__content.scroll-trigger,
#MainContent > .shopify-section:first-child .banner__content.animate--slide-in {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  visibility: visible !important;
}

#MainContent > .shopify-section:first-child .banner__media.animate--zoom-in img,
#MainContent > .shopify-section:first-child .banner__media.animate--fixed img {
  transform: scale(1.05) !important;
  animation: none !important;
  transition: none !important;
}

/* ── Hero gap fix (no image uploaded yet) ── */
#MainContent > .shopify-section:first-child .banner--large { min-height: 520px !important; }
#MainContent > .shopify-section:first-child .banner--medium { min-height: 400px !important; }
#MainContent > .shopify-section:first-child .banner { background-color: rgb(var(--color-foreground)); }

/* ── Product card button — theme-aware ── */
.card__footer .btn,
.card-information .btn {
  background: transparent !important;
  color: rgb(var(--color-foreground)) !important;
  border: 1px solid rgba(var(--color-foreground), 0.2) !important;
  border-radius: 0 !important;
  letter-spacing: 0.15em;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 10px 0 !important;
  transition: all 0.3s ease !important;
}
.card__footer .btn:hover,
.card-information .btn:hover {
  background: rgb(var(--color-foreground)) !important;
  color: rgb(var(--color-background)) !important;
  border-color: rgb(var(--color-foreground)) !important;
}

/* ── Section heading font fix ── */
.collection__title,
.featured-collection .title,
.title-wrapper .title {
  font-family: var(--font-heading-family) !important;
  font-weight: 700;
  letter-spacing: 0.05em;
}

/* ── Product image: no head-cut on square ── */
.card__media .media img {
  object-fit: cover;
  object-position: top center;
}

/* ── Product grid: fill Dawn ratio container ── */
.product-grid .card__inner.ratio > .card__media {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
}
.product-grid .card__inner.ratio > .card__media .media {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
}
.product-grid .card__inner.ratio > .card__media .media img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}

/* Keep the menu drawer above the hero/banner stack on mobile. */
.header-wrapper {
  isolation: isolate;
}

.section-header.shopify-section-group-header-group.menu-open {
  z-index: 60;
}

.section-header.menu-open .menu-drawer {
  position: fixed !important;
  top: var(--header-bottom-position, 0px) !important;
  left: 0 !important;
  width: 100% !important;
  height: calc(var(--viewport-height, 100vh) - var(--header-bottom-position, 0px)) !important;
  z-index: 61 !important;
  background: rgb(var(--color-background)) !important;
  background-image: none !important;
}

.section-header.menu-open .menu-drawer__inner-container,
.section-header.menu-open .menu-drawer__navigation-container,
.section-header.menu-open .menu-drawer__navigation,
.section-header.menu-open .menu-drawer__utility-links {
  background: rgb(var(--color-background)) !important;
}

.section-header.menu-open menu-drawer > details > summary::before {
  position: fixed !important;
  top: var(--header-bottom-position, 0px) !important;
  left: 0 !important;
  width: 100% !important;
  height: calc(var(--viewport-height, 100vh) - var(--header-bottom-position, 0px)) !important;
  z-index: 60 !important;
}

@media screen and (min-width: 750px) {
  .section-header.menu-open .menu-drawer {
    width: 40rem !important;
  }
}