/** Shopify CDN: Minification failed

Line 781:51 Unexpected "/"

**/
/* =========================
   Maine Loves Maine — Clean Base Styles
   ========================= */

/* ---------- Brand tokens ---------- */
:root{
  --mlm-pine:#2F4F3E;
  --mlm-navy:#1F2B3A;
  --mlm-beige:#F3EBDD;
  --mlm-fog:#D9D9D6;
  --mlm-rust:#B14A2F;
  --mlm-white:#FFFFFF;

  --mlm-head:"Playfair Display", serif;
  --mlm-body:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* some themes read these */
  --color-foreground:var(--mlm-navy);
  --menu-top-level-font-color-rgb:31,43,58;
}

/* ---------- Base type & links ---------- */
body, .rte, p, li, input, textarea, select{
  font-family:var(--mlm-body);
  color:var(--mlm-navy);
}
a{ color:var(--mlm-pine) }
a:hover:not(.button):not(.button--primary):not(.button--secondary):not(.button--tertiary){
  color: var(--mlm-rust);
}

/* Background helpers */
.section--beige{ background:var(--mlm-beige) }
.section--fog{ background:var(--mlm-fog) }

/* ---------- Header ---------- */
.shopify-section-header{ box-shadow:0 2px 4px rgba(0,0,0,.06) }

#header-group .header__inline-menu .list-menu__item > a,
#header-group .header__menu .list-menu__item > a,
#header-group .header__menu-item{
  color:var(--mlm-navy) !important;
  font-weight:600;
}
#header-group .header__inline-menu .list-menu__item > a:hover,
#header-group .header__menu .list-menu__item > a:hover,
#header-group .header__menu-item:hover{ color:var(--mlm-rust) !important }

/* keep links white when header is transparent (home only) */
.template-index .shopify-section-header.header--transparent .header__inline-menu .list-menu__item > a,
.template-index .shopify-section-header.header--transparent .header__menu .list-menu__item > a,
.template-index .shopify-section-header.header--transparent .header__menu-item{
  color:#fff !important;
}

/* header icons */
#header-group .header__icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; padding:0; border-radius:50%;
  color:var(--mlm-navy) !important; background:transparent !important;
  border:none !important; box-shadow:none !important; transition:background .2s ease;
}
#header-group .header__icon svg, #header-group .header__icon svg *{
  display:block; fill:none !important; stroke:var(--mlm-navy) !important; stroke-width:2px;
}
#header-group .header__icon:hover{ background:rgba(31,43,58,.08) !important }

@media (min-width:990px){
  .header, .site-header, .header-wrapper, .shopify-section-header{
    padding-top:6px !important; padding-bottom:6px !important; min-height:auto !important;
  }
  .header__heading-logo img, .header__heading-link img,
  .site-header__logo-image, .site-header__logo-image img,
  .header__heading-logo svg, .header__heading-link svg{
    max-height:42px !important; height:42px !important;
  }
  .header__inline-menu, .header__heading, .header__icons{
    padding-top:4px !important; padding-bottom:4px !important;
  }
}




/* =========================================================
   HERO (header area + carousel)
   ========================================================= */
.mlm-hero{
  background:var(--mlm-beige);               /* your Liquid adds the Fog image/gradient */
  padding-block:clamp(12px,3.5vw,32px);
}

/* Layout container */
.mlm-hero__wrap{
  max-width:1200px; margin:0 auto; padding-inline:20px;
  display:grid; gap:clamp(8px,1.5vw,16px); align-items:center;
  grid-template-columns:1.1fr .9fr;         /* text | media on desktop */
}
@media (max-width:900px){
  .mlm-hero__wrap{ grid-template-columns:1fr }
}

/* Title defaults (your inline Custom Liquid can override the font-family/weight) */
.mlm-hero__title{
  font-family:var(--mlm-head);
  color:var(--mlm-navy);
  font-weight:700;
  font-size:clamp(36px,5vw,64px);
  line-height:1.05;
  margin:0 0 .4rem;
}

/* ---------- Carousel base (library-agnostic) ---------- */
.mlm-hero__media{
  display:block;            /* avoid flex “squeeze” */
  margin:0 auto;
  overflow:hidden;
}
.mlm-hero__media .slides,
.mlm-hero__media .slideshow,
.mlm-hero__media .slideshow-track,
.mlm-hero__media .swiper,
.mlm-hero__media .swiper-wrapper,
.mlm-hero__media .flickity-viewport,
.mlm-hero__media .flickity-slider{
  margin:0 auto !important;
  padding:0 !important;
  justify-content:center !important;
  align-items:center !important;
  text-align:center !important;
}
.mlm-hero__media .slide,
.mlm-hero__media .slideshow-slide,
.mlm-hero__media .swiper-slide,
.mlm-hero__media [data-slide]{
  display:inline-flex !important;
  justify-content:center !important;
  align-items:center !important;
  width:auto !important;
  max-width:100% !important;
}
.mlm-hero__media img{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  margin:0 auto !important;
  object-fit:contain !important;
}

/* ---------- Desktop hero anchoring ---------- */
@media (min-width:990px){
  .mlm-hero__wrap{
    grid-template-columns:minmax(260px,420px) minmax(0,1fr);
  }
  .mlm-hero__wrap > *:first-child{
    justify-self:start; text-align:left;
    margin-left:clamp(8px,3.5vw,48px); max-width:48ch;
  }
  .mlm-hero__media{ justify-self:stretch; max-width:none }
  .mlm-hero-frame{ width:100% !important; max-width:none !important; margin:0 !important }
}

/* ---------- Mobile: span full grid + one clear, big frame ---------- */
@media (max-width:989px){
  /* 1) Fix the “narrow column” issue from parent grid */
  #mlm-hero .mlm-hero__wrap{
    grid-column:1 / -1 !important;
    width:100% !important;
    max-width:none !important;
  }

  /* 2) Center the media lane and kill stray paddings */
  #mlm-hero .mlm-hero__media{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    width:100% !important;
    margin:0 auto !important;
    padding:0 !important;
    text-align:center !important;
  }

  /* 3) The frame itself: big and centered */
  #mlm-hero .mlm-hero__media > .mlm-hero-frame{
    width:min(92vw, 560px) !important;   /* tweak 92 → 94 if you want larger */
    max-width:none !important;
    flex:0 0 auto !important;
    margin:0 auto !important;
  }

  /* 4) Image fills the frame */
  #mlm-hero #mlm-hero-img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }

  /* 5) Center copy/CTA under the carousel */
  #mlm-hero .mlm-hero__copy{ text-align:center !important }
  #mlm-hero .mlm-hero__cta{ display:inline-block !important; margin:0 auto !important }
}

/* Tighten the gap into the next section */
.shopify-section:has(.mlm-hero){ margin-bottom:clamp(8px,2vw,20px) !important }
/* fallback if :has() isn’t supported */
.mlm-hero--first + .shopify-section{ margin-top:0 !important; padding-top:0 !important }

/* Align the first product section heading with hero content */
.section-header, .shopify-section h2, .index-sections h2{
  padding-left:0 !important; margin-left:clamp(8px,3.5vw,48px);
}

/* =========================================================
   Product grid / cards
   ========================================================= */
.card, .product-card, .grid__item .card-wrapper{
  background:#fff; border:0; box-shadow:none;
}
.card__heading, .product-card__title, .card-information__text, .full-unstyled-link{
  font-family:var(--mlm-head); font-weight:600; color:var(--mlm-pine);
  line-height:1.2; letter-spacing:0;
}
.price, .price__regular, .price-item, .card-information__meta{
  font-family:var(--mlm-body); color:var(--mlm-navy); opacity:.9; font-weight:500;
}
.card-information, .card__content{ padding-top:.6rem }

/* normalize product media to 4:5 */
.product-card :where(.card-gallery, .product-card__media, .product-card-gallery, .media){
  position:relative; aspect-ratio:4 / 5 !important; overflow:hidden; border-radius:12px;
}
.product-card :where(.card-gallery, .product-card__media, .product-card-gallery, .media) img,
.product-card :where(.card-gallery, .product-card__media, .product-card-gallery, .media) picture img,
.product-card :where(.card-gallery, .product-card__media, .product-card-gallery, .media) video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center; display:block;
}

/* =========================================================
   Product pages — keep media white, no tints
   ========================================================= */
.template-product .product__media-wrapper,
.template-product .product__media,
.template-product .media,
.template-product .product__media-item,
.template-product .product__modal-opener,
.template-product .media > *{ background:#fff !important; background-image:none !important }
.template-product .media img,
.template-product .product__media img,
.template-product .thumbnail img{ mix-blend-mode:normal !important; opacity:1 !important; filter:none !important; display:block !important }
.blur-up, .lazyload, .lazyloading{ filter:none !important; opacity:1 !important }
.template-product .media::before, .template-product .product__media::before{ background:transparent !important }
.product-media-modal, .product-media-modal .media-modal__content, .media-modal__dialog, .media-modal__dialog .media{ background:#fff !important }
.template-product .placeholder-svg{ display:none !important }
:root{ --color-image-background:#ffffff }

/* =========================================================
   Footer
   ========================================================= */
.footer, .site-footer{ background:var(--mlm-beige); color:var(--mlm-navy) }
.footer a{ color:var(--mlm-pine) }
.footer a:hover{ opacity:.85 }

/* =========================================================
   Announcement bar
   ========================================================= */
.mlm-annc{
  background:var(--mlm-rust); color:#fff; text-align:center;
  font-family:var(--mlm-body); font-weight:600; letter-spacing:.02em; padding:.55rem .75rem;
}
.mlm-annc a{ color:#fff; text-decoration:underline }

/* =========================================================
   Predictive Search (single clean set)
   ========================================================= */
#header-group :is([data-predictive-search], predictive-search, .predictive-search, .predictive-search__results, .shopify-predictive-search){
  background:var(--mlm-beige) !important;
  box-shadow:0 8px 24px rgba(0,0,0,.08) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
#header-group :is(.predictive-search__results, .shopify-predictive-search) .predictive-search__item{
  border-bottom:1px solid rgba(26,44,66,0.10) !important;
  padding:.6em .75em !important; transition:background .2s ease, color .2s ease;
}
#header-group :is(.predictive-search__results, .shopify-predictive-search) .predictive-search__item:last-child{ border-bottom:none !important }
#header-group :is(.predictive-search__results, .shopify-predictive-search) .predictive-search__item:hover,
#header-group :is(.predictive-search__results, .shopify-predictive-search) .predictive-search__item:focus-within{
  background:rgba(178,76,54,0.08) !important;
}
#header-group :is(.predictive-search__results, .shopify-predictive-search) .predictive-search__item-heading,
#header-group :is(.predictive-search__results, .shopify-predictive-search) a.predictive-search__item-heading{
  color:var(--mlm-navy) !important; display:block; line-height:1.25; font-size:.95rem; min-height:2.8em;
}
#header-group :is(.predictive-search__results, .shopify-predictive-search) .price,
#header-group :is(.predictive-search__results, .shopify-predictive-search) .price-item{
  display:block; margin-top:.25em; color:var(--mlm-navy) !important;
}

/* =========================================================
   Utilities
   ========================================================= */
hr, .divider, .mlm-divider{ border:0; border-top:1px solid var(--mlm-fog) }
.sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0 }

/* restore account icon visibility across variants */
#header-group .header__icon--account,
.header .header__icon--account,
#header-group .header-actions [href*="/account"],
.header .header-actions [href*="/account"],
#header-group .account-link, .header .account-link,
account-button, #header-group account-button{
  display:inline-flex !important; visibility:visible !important; opacity:1 !important; align-items:center; justify-content:center;
}
#header-group .header-actions [href*="/account"] svg,
.header .header-actions [href*="/account"] svg{ display:block !important }
#header-group .header-actions .button, .header .header-actions .button{
  background:transparent !important; box-shadow:none !important;
}
/* === MOBILE HERO: container-aware width (no right overhang) === */
@media (max-width: 989px){
  /* use the wrap's padding as a gutter token */
  #mlm-hero .mlm-hero__wrap{
    --hero-gutter: 20px;                 /* match your wrap padding (20px) */
    padding-inline: var(--hero-gutter);
  }

  /* make the media lane full-bleed but with equal gutters */
  #mlm-hero .mlm-hero__media{
    display: block !important;
    margin-left:  calc(-1 * var(--hero-gutter)) !important;
    margin-right: calc(-1 * var(--hero-gutter)) !important;
    padding-left: var(--hero-gutter) !important;
    padding-right: var(--hero-gutter) !important;
    width: auto !important;
    text-align: center !important;
    overflow: visible !important;
  }

  /* frame fills that lane; no viewport math, no overhang */
  #mlm-hero .mlm-hero__media > .mlm-hero-frame{
    box-sizing: border-box !important;
    width: 100% !important;              /* fill lane */
    max-width: 560px !important;         /* gentle cap; adjust if you want */
    margin: 0 auto !important;
  }

  /* image still covers the frame */
  #mlm-hero #mlm-hero-img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
}
/* MOBILE: title → carousel → CTA */
@media (max-width: 989px){
  #mlm-hero .mlm-hero__wrap{
    display: grid !important;
    grid-template-areas:
      "title"
      "media"
      "cta";
  }
  /* Flatten the copy wrapper so its children can be placed in the grid */
  #mlm-hero .mlm-hero__copy{ display: contents !important; }

  /* Place each element */
  #mlm-hero .mlm-hero__title{ grid-area: title; text-align: center; }
  #mlm-hero .mlm-hero__media{ grid-area: media; }
  #mlm-hero .mlm-hero__cta{
    grid-area: cta;
    justify-self: center;
    margin-top: .6rem !important;
  }
}
/* HEADER ICONS: navy on transparent, subtle grey hover */
#header-group .header__icon,
#header-group header-actions .button.button-unstyled,
.header .header__icon {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--mlm-navy) !important;
}

#header-group .header__icon:hover,
#header-group header-actions .button.button-unstyled:hover,
.header .header__icon:hover {
  background: rgba(31,43,58,.08) !important; /* soft grey */
}

/* Make the SVGs navy */
#header-group .header__icon svg,
#header-group .header__icon svg *,
#header-group header-actions .button.button-unstyled svg,
#header-group header-actions .button.button-unstyled svg * {
  stroke: var(--mlm-navy) !important;
  fill: none !important;         /* most Dawn/Horizon icons are stroked */
  stroke-width: 2px !important;
}

/* If your theme uses filled icons anywhere, force the fill to navy too */
#header-group .header__icon svg [fill]:not([fill="none"]) {
  fill: var(--mlm-navy) !important;
}
/* === FORCE HEADER SEARCH ICON: navy on transparent, grey hover === */
#header-group .header__icon--search,
.header .header__icon--search,
#header-group search-button .button,
#header-group search-button .button.button--icon {
  background: transparent !important;
  color: var(--mlm-navy) !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Hover/focus state */
#header-group .header__icon--search:hover,
.header .header__icon--search:hover,
#header-group search-button .button:hover,
#header-group search-button .button.button--icon:hover {
  background: rgba(31,43,58,.08) !important; /* soft grey */
}

/* Make the magnifier glyph navy, whether it’s stroked or filled */
#header-group .header__icon--search svg,
#header-group .header__icon--search svg *,
#header-group search-button .button svg,
#header-group search-button .button svg * {
  stroke: var(--mlm-navy) !important;
  fill: var(--mlm-navy) !important;     /* some themes use a filled magnifier */
  stroke-width: 2px !important;
}
/* Search icon: stroke-only (no fill) */
#header-group .header__icon--search svg,
#header-group .header__icon--search svg *,
#header-group search-button .button svg,
#header-group search-button .button svg * {
  fill: none !important;                 /* <-- unfill the lens */
  stroke: var(--mlm-navy) !important;    /* navy outline */
  stroke-width: 2px !important;
  vector-effect: non-scaling-stroke;     /* keeps it crisp */
}
/* === HERO (mobile): tighten space between H1 and carousel === */
@media (max-width: 749px){
  #mlm-hero .mlm-hero__title{ margin-bottom: .35rem !important; }
  #mlm-hero .mlm-hero__wrap{ gap: .5rem !important; row-gap: .5rem !important; }
  #mlm-hero .mlm-hero__media{ margin-top: 0 !important; }
}
/* === PRODUCT CARD TITLES: visible + even height + aligned prices === */

/* Color + typography (works across Dawn variants) */
.card__heading,
.card__heading a,
.product-card__title,
.card-information__text,
.full-unstyled-link {
  color: var(--mlm-navy) !important;
  font-family: var(--mlm-head, "Playfair Display", serif);
  font-weight: 600;
  line-height: 1.25;
}

/* Clamp titles to 2 lines for consistent card height */
.card__heading a,
.product-card__title,
.card-information__text,
.full-unstyled-link {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important; /* ← change to 1 or 3 if you prefer */
  overflow: hidden !important;
}

/* Make the heading wrapper reserve the space for 2 lines */
.card__heading {
  min-height: calc(1.25em * 2); /* line-height * lines */
  margin: 0.35rem 0 0;
}

/* Tighten spacing so prices line up nicely under titles */
.card-information { gap: 0.25rem; }
/* === MOBILE MENU DRAWER: cover full viewport & scroll inside === */
@media (max-width: 989px){
  /* Dawn/Horizon patterns – cover the whole screen when open */
  details[open] .menu-drawer,
  header-drawer details[open] .menu-drawer,
  header-drawer[open] .menu-drawer {
    position: fixed !important;
    inset: 0 !important;             /* top/right/bottom/left: 0 */
    height: 100vh !important;
    max-height: 100vh !important;
    z-index: 9999 !important;         /* sit above page content */
  }

  /* Make the content inside the drawer scrollable */
  details[open] .menu-drawer__inner-container,
  details[open] .menu-drawer__navigation {
    height: 100% !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Prevent background from receiving taps while the drawer is open */
  details[open] ~ * {
    pointer-events: none;
  }
}
/* Titles visible and consistent height across product cards */
.card__heading,
.card__heading a,
.product-card__title,
.card-information__text,
.full-unstyled-link {
  color: var(--mlm-navy) !important;
  font-family: var(--mlm-head, "Playfair Display", serif);
  font-weight: 600;
  line-height: 1.25;
}

.card__heading a,
.product-card__title,
.card-information__text,
.full-unstyled-link {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;   /* set to 3 if you want taller */
  overflow: hidden !important;
}

.card__heading { min-height: calc(1.25em * 2); }  /* line-height * lines */
.card-information { gap: 0.25rem; }
/* === MOBILE MENU DRAWER: full-screen only while open (safe) === */
@media (max-width: 989px){
  /* Fires only when the drawer is open (theme adds .scroll-lock to <html>) */
  html.scroll-lock header-component .header__drawer > * {
    position: fixed !important;
    inset: 0 !important;                  /* top/right/bottom/left: 0 */
    width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    background: #fff !important;
    z-index: 10000 !important;
  }

  /* Make the inner content scroll */
  html.scroll-lock header-component .header__drawer > * :is(
    .menu-drawer__inner,
    .drawer__inner,
    .menu-drawer__navigation,
    .menu
  ){
    height: 100% !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}
/* === MOBILE MENU: make the drawer full-screen and hide the page behind it === */
@media (max-width: 989px){

  /* The <details> that holds the drawer when it is open */
  header-component details.menu-drawer-container[open]{
    position: fixed !important;
    inset: 0 !important;                 /* top/right/bottom/left: 0 */
    width: 100vw !important;
    height: 100dvh !important;
    z-index: 10000 !important;
    margin: 0 !important;
    background: transparent !important;  /* just in case */
  }

  /* The actual panel */
  header-component details.menu-drawer-container[open] .menu-drawer{
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: #fff !important;
    display: grid !important;
    grid-template-rows: auto 1fr;        /* close button / content */
    overflow: hidden !important;
  }

  /* Make the menu list scroll, not the page behind */
  header-component details.menu-drawer-container[open] .menu-drawer__navigation{
    height: 100% !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Ensure menu link text is visible and on-brand */
  header-component details.menu-drawer-container[open] .menu-drawer__navigation a{
    color: var(--mlm-navy) !important;
  }
}
/* === MOBILE MENU: featured products — readable titles + aligned prices === */
@media (max-width: 989px){
  /* Make sure the menu links themselves are navy */
  details.menu-drawer-container[open] .menu-drawer__menu-item,
  details.menu-drawer-container[open] .menu-drawer__menu-item-text{
    color: var(--mlm-navy) !important;
  }

  /* Card content area becomes a flex column so price can sit at the bottom */
  details.menu-drawer-container[open] .resource-card__content{
    display: flex !important;
    flex-direction: column !important;
    gap: 6px;
    /* room for two lines of title + price */
    min-height: calc(1.25em * 2 + 22px);
  }

  /* Title: navy, heavier, clamp to 2 lines for equal card heights */
  details.menu-drawer-container[open] .resource-card__title{
    color: var(--mlm-navy) !important;
    font-family: var(--mlm-head, "Playfair Display", serif);
    font-weight: 600;
    line-height: 1.25;
    display: -webkit-box;              /* line clamp for iOS/Safari */
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.25em * 2);      /* reserve space for two lines */
  }

  /* Price: navy and pinned to the bottom of the card content */
  details.menu-drawer-container[open] .resource-card__content .price{
    margin-top: auto;
    color: var(--mlm-navy) !important;
    font-family: var(--mlm-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
    font-weight: 600;
  }
}

/* Thumbnail */
.cart-drawer__items > * img{
  width: 72px !important;
  height: 72px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  display: block !important;
}

/* Middle column text can wrap without pushing controls down */
.cart-drawer__items > * :where(.cart-item__details,.cart-item__info,.resource-card__content){
  min-width: 0 !important;
  margin: 0 !important;
}

/* shove any “actions/quantity” wrappers to column 3 and keep them inline */
.cart-drawer__items > * :where(
  .cart-item__quantity-wrapper,
  .cart-item__actions,
  .cart-drawer__actions,
  .item-actions,
  [class*="quantity-wrapper"],
  [class*="actions"]
){
  grid-column: 3 !important;
  display: inline-flex !important;
  gap: 8px !important;
  align-items: center !important;
  justify-self: end !important;
  width: auto !important;
  margin: 0 !important;
}

/* quantity control itself */
.cart-drawer__items > * :where(.quantity,[data-quantity],.cart-quantity){
  width: auto !important;
  margin: 0 !important;
}

/* clear any theme rules that force kids to full width */
.cart-drawer__items > * > *{ max-width: 100% !important; }
/* === CART DRAWER — hard fix for vertical titles & misaligned qty === */

/* Make each direct child (li/div) of the items list a single horizontal row */
.cart-drawer__items > li,
.cart-drawer__items > div {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid rgba(31,43,58,.10) !important;
}

/* Thumbnail */
.cart-drawer__items img {
  width: 64px !important;
  height: 64px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  display: block !important;
}

/* Middle (title/price) column grows; prevent squish that causes single-letter wraps */
.cart-drawer__items > li > *:nth-child(2),
.cart-drawer__items > div > *:nth-child(2) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Titles render normally, never vertical */
.cart-drawer__items h3,
.cart-drawer__items .cart-item__name,
.cart-drawer__items .line-item__title,
.cart-drawer__items .cart-item__title {
  white-space: normal !important;
  word-break: normal !important;
  writing-mode: horizontal-tb !important;
  margin: 0 0 2px !important;
  line-height: 1.25 !important;
}

/* Qty/remove stay on the right, same row */
.cart-drawer__items :is(.cart-item__quantity, .quantity, [data-quantity], .cart-quantity, .cart-item__actions) {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
}

/* /***** CART — final patch (scoped to your cart drawer) *****/

/* 1) DESKTOP/WEB: force true left alignment on product titles */
.mlm-cart .cart-items__details,
.mlm-cart .cart-items__details * {
  text-align: left !important;     /* nukes any .text-center utilities */
}
.mlm-cart :is(.cart-items_table__row, .cart-items__table-row){
  /* media | details | qty/remove */
  grid-template-columns: 72px minmax(0,1fr) max-content !important;
  justify-items: start !important;  /* stop centered grid cells */
  column-gap: 12px !important;
}
.mlm-cart .cart-items__details{
  justify-self: start !important;
  align-items: flex-start !important;
  min-width: 0 !important;          /* prevents weird letter-per-line wraps */
}

/* 2) MOBILE: make the items region fill the drawer and actually scroll */
@media (max-width: 749px){
  .mlm-cart .cart-drawer__inner{
    height: 100dvh; max-height: 100dvh;
    display: flex; flex-direction: column;
  }
  .mlm-cart .cart-drawer__header{ flex: 0 0 auto; }

  .mlm-cart .cart-drawer__content{
    flex: 1 1 auto; min-height: 0;
    display: flex; flex-direction: column;
    padding-top: 8px !important;    /* ensures first item isn’t hidden under fades */
  }

  /* The custom <scroll-hint> needs to be the scroller */
  .mlm-cart scroll-hint.cart-drawer__items{
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    -webkit-mask-image: none !important; /* kill top/bottom fade overlay */
            mask-image: none !important;
  }
  .mlm-cart scroll-hint.cart-drawer__items::before,
  .mlm-cart scroll-hint.cart-drawer__items::after{ content: none !important; }

  /* No phantom top margin on first line item */
  .mlm-cart .cart-drawer__items > *:first-child{ margin-top: 0 !important; }
}
 never overlays—just a normal block below items */
.mlm-upsell { position: static !important; z-index: 0 !important; margin: 10px 16px 14px !important; }
/* === CART DRAWER: restore clicks (kill transparent overlays) === */

/* 1) Scroll-hint gradients should never catch clicks */
scroll-hint,
.cart-drawer__items {
  position: relative;                 /* anchor pseudo elements */
}
scroll-hint::before,
scroll-hint::after,
.cart-drawer__items::before,
.cart-drawer__items::after {
  pointer-events: none !important;    /* allow clicks through the fades */
}

/* 2) Our free-ship banner must not sit above the drawer */
#mlm-free-ship {
  position: static !important;
  z-index: 0 !important;
  pointer-events: none !important;    /* make the whole thing non-interactive */
}
#mlm-free-ship * { pointer-events: none !important; }

/* 3) Belt-and-suspenders: ensure the drawer itself accepts clicks */
.cart-drawer__dialog,
.cart-drawer__inner,
.cart-drawer__content {
  pointer-events: auto !important;
}
/* Upsell title a touch smaller on mobile */
.mlm-upsell__title{
  font-size: 14px;
  line-height: 1.25;
}
@media (min-width: 750px){
  .mlm-upsell__title{ font-size: 15px; }
}
/* === CART DRAWER — tiny alignment/contrast polish === */

/* 1) Make sure product titles are LEFT-aligned in the line item */
.cart-drawer__items :is(.cart-item__details, .cart-item__info, [headers="productInfo"]) {
  text-align: left !important;
  justify-self: start !important;
  min-width: 0 !important;
  margin: 0 !important;
}
.cart-drawer__items :is(.cart-item__details h3, .cart-item__name, .line-item__title) {
  margin: 0 0 4px 0 !important;
  line-height: 1.25 !important;
  text-align: left !important;
}

/* 2) Upsell card: give the image breathing room on the left, slightly smaller title */
.mlm-upsell { padding: 16px 16px 14px 16px !important; }     /* was 12px */
.mlm-upsell__inner { gap: 14px !important; }
.mlm-upsell__media { flex: 0 0 80px !important; }            /* keeps a comfy inset */
.mlm-upsell__img { width: 80px !important; height: 80px !important; }
.mlm-upsell__title { font-size: clamp(14px, 2.6vw, 17px) !important; }

/* 3) Summary area: force readable text (don’t touch button labels) */
.cart-drawer__summary :is(p, span, small, .totals, .totals__subtotal, .totals__subtotal-value,
  .price, .tax-note, .shopify-payment-terms__text, .shopify-installments__text, a) {
  color: var(--mlm-navy) !important;
}

/* keep checkout / dynamic buttons on-brand */
.cart-drawer__summary :is(.button, .shopify-payment-button__button--unbranded) {
  color: #fff !important;
}

/* Scope to cart drawer only (covers common IDs) */
#CartDrawer, #cart-drawer {}

/* 1) Product title: force true left alignment (grid + flex + utility classes) */
#CartDrawer .cart-item__title,
#CartDrawer .cart-item__name,
#CartDrawer .line-item__title,
#CartDrawer .cart-item [class*="title"],
#cart-drawer .cart-item__title,
#cart-drawer .cart-item__name,
#cart-drawer .line-item__title,
#cart-drawer .cart-item [class*="title"] {
  text-align: left !important;
  justify-self: start !important;   /* if the details column is grid */
  margin-left: 0 !important;
}

#CartDrawer .cart-item__details,
#cart-drawer .cart-item__details {
  text-align: left !important;
  align-items: flex-start !important; /* if the details column is flex */
}
#CartDrawer .cart-item__details .text-center,
#cart-drawer .cart-item__details .text-center { text-align: left !important; }

/* 2) Upsell card: image/text alignment (no layout mode change) */
#CartDrawer .cart-upsell,
#CartDrawer [class*="upsell"],
#cart-drawer .cart-upsell,
#cart-drawer [class*="upsell"] {
  gap: 14px;                    /* works for both flex & grid */
  padding: 12px 14px;
  border-radius: 12px;
  background: #F5F0E6;          /* your vintage white */
}
#CartDrawer .upsell__media,
#cart-drawer .upsell__media { padding-left: 10px; }
#CartDrawer .upsell__media img,
#cart-drawer .upsell__media img { display:block; border-radius:10px; }

/* 3) Mobile “squished items” — make the items area tall & scrollable */
#CartDrawer .drawer__inner,
#cart-drawer .drawer__inner {
  height: 100dvh;
  max-height: 100dvh;
  display: flex;
  flex-direction: column;
}
#CartDrawer .drawer__header,
#cart-drawer .drawer__header { flex: 0 0 auto; }
#CartDrawer .drawer__content,
#CartDrawer .cart-drawer__body,
#CartDrawer .cart-items,
#CartDrawer .ajax-cart__items,
#cart-drawer .drawer__content,
#cart-drawer .cart-drawer__body,
#cart-drawer .cart-items,
#cart-drawer .ajax-cart__items {
  flex: 1 1 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
#CartDrawer .drawer__footer,
#cart-drawer .drawer__footer { flex: 0 0 auto; }

@media (max-width: 749px) {
  #CartDrawer .drawer__header,
  #cart-drawer .drawer__header { padding: 10px 16px !important; }
  #CartDrawer .drawer__content,
  #cart-drawer .drawer__content { padding-bottom: 12px; }
}
/*************** MLM Cart Drawer — minimal, scoped patch ***************/

/* 0) Scope helpers */
.mlm-cart { /* scope root; no styles needed */ }

/* 1) Product titles: truly left-aligned on web & mobile */
.mlm-cart .cart-items__details {
  text-align: left !important;
  justify-self: start !important;      /* if the row is a CSS grid */
  align-items: flex-start !important;  /* if the cell uses flex */
  min-width: 0 !important;
}
.mlm-cart .cart-items__details :is(h3, .cart-item__name, .cart-item__title, .line-item__title, .cart-items__title) {
  text-align: left !important;
  margin: 0 0 4px !important;
  line-height: 1.25 !important;
}
/* If Horizon centers grid cells, uncenter them */
.mlm-cart :is(.cart-items_table__row, .cart-items__table-row) {
  justify-items: start !important;
}

/* 2) Upsell card: image not jammed to the left, tidy gap */
.mlm-cart .mlm-upsell {
  margin: 10px var(--cart-drawer-padding,16px) 14px !important;
  padding: 16px 16px 14px 18px !important;   /* ← extra left padding */
  border: 1px solid rgba(31,43,58,.10);
  border-radius: 10px;
  background: var(--mlm-beige,#F3EBDD);
}
.mlm-cart .mlm-upsell__inner { display: grid; grid-template-columns: 84px 1fr; gap: 14px; align-items: center; }
.mlm-cart .mlm-upsell__media { grid-column: 1; }
.mlm-cart .mlm-upsell__img   { width: 84px; height: 84px; border-radius: 8px; object-fit: cover; display: block; }
.mlm-cart .mlm-upsell__body  { grid-column: 2; }

/* 3) Mobile: give items real space & make them scroll between sticky header/footer */
.mlm-cart .cart-drawer__inner {
  height: 100dvh;                 /* full viewport height on mobile Safari */
  max-height: 100dvh;
  display: flex;
  flex-direction: column;
}
.mlm-cart .cart-drawer__header { flex: 0 0 auto; }
.mlm-cart .cart-drawer__content { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.mlm-cart .cart-drawer__items  { flex: 1 1 auto; min-height: 0; overflow: auto; -webkit-overflow-scrolling: touch; }
.mlm-cart .cart-drawer__summary{
  position: sticky; bottom: 0; z-index: 1;
  background: var(--color-background,#fff);
  padding: var(--cart-drawer-padding,16px);
  border-top: 1px solid rgba(31,43,58,.12);
}

/* 3b) OPTIONAL space saver on small screens:
      keep “Check out” but hide the extra wallet buttons (Shop/Apple/PayPal/GPay).
      Uncomment if you want this. */
/*
@media (max-width: 749px){
  .mlm-cart .cart-drawer__summary :is(.shopify-payment-button, [data-shopify-buttoncontainer], .additional-checkout-buttons){
    display: none !important;
  }
}
*/
/* ===== Cart (desktop/web): let details column actually grow & left-align ===== */
.mlm-cart :is(.cart-items_table__row, .cart-items__table-row){
  /* media | details | qty/remove */
  grid-template-columns: 72px minmax(0,1fr) max-content !important;
  column-gap: 12px !important;
  justify-items: start !important; /* stop centered grid cells */
}

.mlm-cart .cart-items__details{
  text-align: left !important;
  justify-self: start !important;
  align-items: flex-start !important;
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
}

.mlm-cart .cart-items__details :is(h3,.cart-item__name,.cart-item__title,.line-item__title,.cart-items__title,.h5,.h4){
  text-align: left !important;
  margin: 0 0 4px !important;
  line-height: 1.25 !important;
}
/* ===== Cart (mobile): make the items region the scroller ===== */
.mlm-cart .cart-drawer__inner{
  height: 100dvh; max-height: 100dvh;
  display: flex; flex-direction: column;
}
.mlm-cart .cart-drawer__header{ flex: 0 0 auto; }

.mlm-cart .cart-drawer__content{
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
}

/* The items container is a custom element; make it block + flexible + scrollable */
.mlm-cart scroll-hint.cart-drawer__items{
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}

/* Sticky summary at the bottom; items scroll above it */
.mlm-cart .cart-drawer__summary{
  position: sticky; bottom: 0; z-index: 1;
  background: var(--color-background,#fff);
  padding: var(--cart-drawer-padding,16px);
  border-top: 1px solid rgba(31,43,58,.12);
}

/* Optional space saver: hide extra wallet buttons on very small screens
@media (max-width: 749px){
  .mlm-cart .cart-drawer__summary :is(.shopify-payment-button,[data-shopify-buttoncontainer],.additional-checkout-buttons){
    display: none !important;
  }
}
*/
/***** CART — final patch (scoped to your cart drawer) *****/

/* 1) DESKTOP/WEB: force true left alignment on product titles */
.mlm-cart .cart-items__details,
.mlm-cart .cart-items__details * {
  text-align: left !important;     /* nukes any .text-center utilities */
}
.mlm-cart :is(.cart-items_table__row, .cart-items__table-row){
  /* media | details | qty/remove */
  grid-template-columns: 72px minmax(0,1fr) max-content !important;
  justify-items: start !important;  /* stop centered grid cells */
  column-gap: 12px !important;
}
.mlm-cart .cart-items__details{
  justify-self: start !important;
  align-items: flex-start !important;
  min-width: 0 !important;          /* prevents weird letter-per-line wraps */
}

/* 2) MOBILE: make the items region fill the drawer and actually scroll */
@media (max-width: 749px){
  .mlm-cart .cart-drawer__inner{
    height: 100dvh; max-height: 100dvh;
    display: flex; flex-direction: column;
  }
  .mlm-cart .cart-drawer__header{ flex: 0 0 auto; }

  .mlm-cart .cart-drawer__content{
    flex: 1 1 auto; min-height: 0;
    display: flex; flex-direction: column;
    padding-top: 8px !important;    /* ensures first item isn’t hidden under fades */
  }

  /* The custom <scroll-hint> needs to be the scroller */
  .mlm-cart scroll-hint.cart-drawer__items{
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    -webkit-mask-image: none !important; /* kill top/bottom fade overlay */
            mask-image: none !important;
  }
  .mlm-cart scroll-hint.cart-drawer__items::before,
  .mlm-cart scroll-hint.cart-drawer__items::after{ content: none !important; }

  /* No phantom top margin on first line item */
  .mlm-cart .cart-drawer__items > *:first-child{ margin-top: 0 !important; }
}
/***** CART — precise row + mobile scroll fixes (scoped) *****/

/* A) DESKTOP/WEB: widen the details column, cap the qty column */
.mlm-cart table.cart-items__table > tbody > tr.cart-items__table-row{
  /* media | details grows | qty capped */
  grid-template-columns: 72px minmax(0,1fr) 156px !important;
  column-gap: 12px !important;
  justify-items: start !important;
}
@media (max-width: 949px){
  .mlm-cart table.cart-items__table > tbody > tr.cart-items__table-row{
    grid-template-columns: 64px minmax(0,1fr) 140px !important;
  }
}

/* land cells in the columns we expect */
.mlm-cart table.cart-items__table > tbody > tr.cart-items__table-row > td.cart-items__media{
  grid-column: 1 !important;
}
.mlm-cart table.cart-items__table > tbody > tr.cart-items__table-row > td.cart-items__details{
  grid-column: 2 !important;
  min-width: 0 !important;            /* stops skinny one-letter wrapping */
  width: auto !important;
  max-width: none !important;
  text-align: left !important;
}
.mlm-cart table.cart-items__table > tbody > tr.cart-items__table-row > td.cart-items__quantity{
  grid-column: 3 !important;
  justify-self: end !important;
  width: auto !important;
  max-width: 156px !important;        /* matches the cap above */
}

/* belt-and-suspenders: titles always left */
.mlm-cart .cart-items__details a.cart-items__title,
.mlm-cart .cart-items__details,
.mlm-cart .cart-items__details *{
  text-align: left !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

/* B) MOBILE: make the items area fill and actually scroll */
@media (max-width: 749px){
  .mlm-cart .cart-drawer__inner{
    height: 100dvh !important;
    max-height: 100dvh !important;
    display: flex; flex-direction: column;
  }
  .mlm-cart .cart-drawer__content{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: flex; flex-direction: column;
  }
  /* the custom element must be the scroller */
  .mlm-cart scroll-hint.cart-drawer__items{
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    /* remove fade masks that hide the first item */
    -webkit-mask-image: none !important;
            mask-image: none !important;
  }
  .mlm-cart scroll-hint.cart-drawer__items::before,
  .mlm-cart scroll-hint.cart-drawer__items::after{
    content: none !important;
  }
}
/***** CART — mobile: give products the space, summary sticks at bottom *****/
@media (max-width: 749px){
  /* Dialog fills the viewport on iOS/Safari */
  .mlm-cart .cart-drawer__dialog.dialog-drawer{
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
  }
  @supports not (height: 100dvh){
    .mlm-cart .cart-drawer__dialog.dialog-drawer{
      height: 100vh !important; max-height: 100vh !important;
    }
  }

  /* Drawer body is a column: header | (SCROLLER) | sticky summary */
  .mlm-cart .cart-drawer__inner{
    height: 100% !important;
    display: flex; flex-direction: column;
  }
  .mlm-cart .cart-drawer__content{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: flex; flex-direction: column;
    padding-top: 8px !important;   /* keeps first item visible under any fades */
  }

  /* Make <scroll-hint> the only scroller and remove fade masks that block taps */
  .mlm-cart scroll-hint.cart-drawer__items{
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    -webkit-mask-image: none !important;
            mask-image: none !important;
  }
  .mlm-cart scroll-hint.cart-drawer__items::before,
  .mlm-cart scroll-hint.cart-drawer__items::after{
    content: none !important;
  }

  /* Sticky summary at bottom, with safe-area padding */
  .mlm-cart .cart-drawer__summary{
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    background: var(--color-background,#fff) !important;
    padding: calc(var(--cart-drawer-padding,16px)) 
             calc(var(--cart-drawer-padding,16px))
             calc(var(--cart-drawer-padding,16px) + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid rgba(31,43,58,.12) !important;
  }
}
.mlm-cart .cart-drawer__summary
:is(.shopify-payment-button, [data-shopify-buttoncontainer], .additional-checkout-buttons){
  display: none !important;
}
/* === Cart (mobile) — comfy gutters & rounded checkout === */
@media (max-width: 749px){
  /* one token to tweak later if you want tighter/looser */
  .mlm-cart { --drawer-gutter: 18px; }

  /* header/content/summary share the same left/right gutter */
  .mlm-cart .cart-drawer__header,
  .mlm-cart .cart-drawer__summary { 
    padding-left: var(--drawer-gutter) !important;
    padding-right: var(--drawer-gutter) !important;
  }

  /* the scroller gets horizontal padding too */
  .mlm-cart scroll-hint.cart-drawer__items{
    padding-left: var(--drawer-gutter) !important;
    padding-right: var(--drawer-gutter) !important;
  }

  /* extra breathing room for the bottom, including the iOS home-indicator area */
  .mlm-cart .cart-drawer__summary{
    padding-bottom: calc(var(--drawer-gutter) + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid rgba(31,43,58,.12) !important;
    background: var(--color-background, #fff) !important;
  }

  /* keep the primary button inside the gutter and soften the corners */
  .mlm-cart .cart-drawer__summary .button{
    width: 100% !important;
    border-radius: 12px !important;
  }
}
/* === Cart (mobile) — thin navy stripe above header === */
@media (max-width: 749px){
  .mlm-cart .cart-drawer__header{
    position: relative;
  }
  .mlm-cart .cart-drawer__header::before{
    content: "";
    position: absolute;
    left: 0; right: 0; top: 0;
    height: 8px;                               /* make 12px if you want thicker */
    background: var(--mlm-navy, #1F2B3A);
  }
}
/***** HOMEPAGE HERO — recenter the carousel (desktop + mobile) *****/

/* 0) Never offset hero headings/sections */
#mlm-hero,
#mlm-hero .section-header { margin-left: 0 !important; padding-left: 0 !important; }

/* 1) Make the media lane/track truly centered and remove stray paddings */
#mlm-hero .mlm-hero__media,
#mlm-hero .mlm-hero__carousel,
#mlm-hero .mlm-hero__carousel .slides,
#mlm-hero .mlm-hero__carousel .slideshow-track,
#mlm-hero .mlm-hero__carousel .swiper,
#mlm-hero .mlm-hero__carousel .flickity-viewport {
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: center !important;
}

#mlm-hero .mlm-hero__carousel img {
  display: block !important;
  margin: 0 auto !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}

/* 2) Desktop: keep a sensible two-column layout and center the right column */
@media (min-width: 990px){
  #mlm-hero .mlm-hero__wrap{
    grid-template-columns: minmax(300px, 480px) 1fr !important;  /* text | media */
    align-items: center !important;
  }
  #mlm-hero .mlm-hero__wrap > *:first-child{
    margin-left: 0 !important;         /* undo any earlier nudge */
    text-align: left !important;
    max-width: 48ch !important;
  }
  #mlm-hero .mlm-hero__media{
    justify-self: center !important;    /* centers the slider side */
  }
}

/* 3) Mobile: no negative gutters; keep the slider centered in the beige band */
@media (max-width: 989px){
  #mlm-hero .mlm-hero__media{
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
/***** HOMEPAGE HERO (desktop only) — push carousel right *****/
@media (min-width: 990px){
  /* restore the comfy left nudge for the copy column */
  #mlm-hero .mlm-hero__wrap > *:first-child{
    margin-left: clamp(16px, 4vw, 64px) !important;
    text-align: left !important;
    max-width: 48ch !important;
  }

  /* sit the media column at the RIGHT edge of its grid cell */
  #mlm-hero .mlm-hero__media{
    justify-self: end !important;   /* <-- right-align the whole column */
    text-align: right !important;
  }

  /* and make everything inside hug the right side */
  #mlm-hero .mlm-hero__media > *,
  #mlm-hero .mlm-hero__carousel,
  #mlm-hero .mlm-hero__carousel .slides,
  #mlm-hero .mlm-hero__carousel .slideshow-track,
  #mlm-hero .mlm-hero__carousel .swiper,
  #mlm-hero .mlm-hero__carousel .flickity-viewport,
  #mlm-hero .mlm-hero__carousel img{
    margin-left: auto !important;
    margin-right: 0 !important;
  }
}
/***** HOMEPAGE HERO — desktop: widen media + hug right edge *****/
@media (min-width: 990px){
  /* give the media column more room than the copy */
  #mlm-hero .mlm-hero__wrap{
    grid-template-columns: minmax(320px, 480px) minmax(0, 1fr) !important; /* copy | media */
    align-items: center !important;
  }

  /* keep copy comfy on the left */
  #mlm-hero .mlm-hero__wrap > *:first-child{
    margin-left: clamp(16px, 4vw, 64px) !important;
    text-align: left !important;
    max-width: 48ch !important;
  }

  /* make the media cell stretch and push its contents to the RIGHT */
  #mlm-hero .mlm-hero__media{
    justify-self: stretch !important;
    display: flex !important;
    justify-content: flex-end !important;   /* <-- key: hug right edge */
  }

  /* belt-and-suspenders: everything inside also prefers the right */
  #mlm-hero .mlm-hero__media > *,
  #mlm-hero .mlm-hero__carousel,
  #mlm-hero .mlm-hero__carousel .slides,
  #mlm-hero .mlm-hero__carousel .slideshow-track,
  #mlm-hero .mlm-hero__carousel .swiper,
  #mlm-hero .mlm-hero__carousel .flickity-viewport,
  #mlm-hero .mlm-hero__carousel img{
    margin-left: auto !important;
    margin-right: 0 !important;
  }

  /* optional: tiny extra breathing room from the extreme edge */
  /* #mlm-hero .mlm-hero__media{ padding-right: 10px !important; } */
}
/***** HOMEPAGE HERO — desktop tune *****/
@media (min-width: 990px){

  /* 1) Give the text column more room + keep the carousel on the right */
  #mlm-hero .mlm-hero__wrap{
    /* wider copy column so the headline can sit on ~2 lines */
    grid-template-columns: minmax(560px, 720px) minmax(0, 1fr) !important; /* copy | media */
    align-items: center !important;
  }

  /* comfy left nudge for the copy; constrain headline width to ~2 lines */
  #mlm-hero .mlm-hero__wrap > *:first-child{
    margin-left: clamp(16px, 4vw, 64px) !important;
    max-width: none !important;
  }
  #mlm-hero .mlm-hero__title{
    max-width: 16ch !important;   /* tweak 15–18ch to taste for exactly 2 lines */
  }

  /* keep media column hugging the right edge */
  #mlm-hero .mlm-hero__media{
    justify-self: stretch !important;
    display: flex !important;
    justify-content: flex-end !important;
  }
}

/* HOMEPAGE HERO — desktop: center dots below the image (no layout shift) */
@media (min-width: 990px){
  /* let the dots sit just outside the media box if needed */
  #mlm-hero .mlm-hero__media{ overflow: visible !important; }

  /* Dawn/Horizon variants commonly use these wrappers for the dots */
  #mlm-hero :is(.slideshow__controls, .slider-counter, .slider-buttons){
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: -18px !important;            /* push just below the image */
    transform: translateX(-50%) !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    width: auto !important;
  }
}
/* HOMEPAGE HERO — center your theme's dots under the carousel (desktop) */
@media (min-width: 990px){
  /* give the dots a place to sit */
  #mlm-hero .mlm-hero__media{
    position: relative !important;
    overflow: visible !important;
    padding-bottom: 28px !important;   /* room for the dots */
  }

  /* the dots container */
  #mlm-hero .mlm-hero-dots{
    position: absolute !important;
    inset: auto !important;            /* undo top/right styles from theme */
    left: 50% !important;
    bottom: -6px !important;           /* tweak -6→12px to taste */
    transform: translateX(-50%) !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    width: auto !important;
  }

  /* optional: tidy dot visuals (keeps your current look) */
  #mlm-hero .mlm-hero-dot{
    width: 10px; height: 10px;
    padding: 0 !important; border: 0; border-radius: 50%;
    background: rgba(31,43,58,.35);
  }
  #mlm-hero .mlm-hero-dot.is-active{
    background: var(--mlm-navy);
  }
}
/* HOMEPAGE HERO — desktop: avoid right-edge crop */
@media (min-width: 990px){
  #mlm-hero .mlm-hero__media{
    padding-right: 16px !important;   /* 10–16px looks good */
    box-sizing: border-box !important;
    overflow: visible !important;      /* belt & suspenders */
  }

  /* if your theme’s viewport clips, let it breathe too */
  #mlm-hero .mlm-hero__carousel :is(.flickity-viewport, .slideshow, .slideshow__slide, .swiper){
    overflow: visible !important;
    max-width: 100% !important;
  }
}
/* HOMEPAGE HERO — desktop: symmetric gutters (copy left, media right) */
@media (min-width: 990px){
  #mlm-hero{
    --hero-gutter: clamp(16px, 4vw, 64px);   /* tweak once and both sides update */
  }

  /* headline’s left nudge (you already have this, but now powered by the token) */
  #mlm-hero .mlm-hero__wrap > *:first-child{
    margin-left: var(--hero-gutter) !important;
  }

  /* new: equal breathing room on the right of the carousel */
  #mlm-hero .mlm-hero__media{
    padding-right: var(--hero-gutter) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  /* if your theme’s slider viewport clips at the edge, let it breathe */
  #mlm-hero .mlm-hero__carousel :is(.flickity-viewport, .slideshow, .swiper){
    overflow: visible !important;
  }
}
/* Overlay lock */
.mlm-popup-open { overflow:hidden; }

/* Popup shell */
.mlm-popup{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.mlm-popup[hidden]{display:none}
.mlm-popup__overlay{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.mlm-popup__content{position:relative;z-index:1;max-width:700px;width:92%;border-radius:12px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.3)}

/* === Popup close: visible, accessible === */
.mlm-popup__close{
  position:absolute; top:12px; right:14px;
  width:40px; height:40px;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff !important;                 /* solid white button */
  color:var(--mlm-navy, #1F2B3A) !important;  /* navy X */
  border:1px solid rgba(31,43,58,.15) !important;
  border-radius:999px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.12);
  cursor:pointer;
  outline: none;
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease;
}

.mlm-popup__close:hover{
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,.18);
  background: var(--mlm-beige, #F3EBDD) !important;   /* subtle brand hover */
}

.mlm-popup__close:focus-visible{
  box-shadow: 0 0 0 3px rgba(31,43,58,.18), 0 4px 16px rgba(0,0,0,.18);
}

/* Ensure the X renders as an outline (not a filled red glyph) */
.mlm-popup__close svg{ width:22px; height:22px; display:block; }
.mlm-popup__close svg [fill]{ fill: none !important; }
.mlm-popup__close svg path{
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.25px !important;
  stroke-linecap: round; stroke-linejoin: round;
}


/* Hero area */
.mlm-popup__hero{background-size:cover;background-position:center;padding:32px 20px;text-align:center;color:#3a2a1e}
.mlm-popup__logo{max-width:120px;margin:0 auto 16px;display:block}
.mlm-popup__headline{font-family:'Playfair Display',serif;font-size:1.4rem;margin-bottom:12px}
.mlm-popup__subtext{font-size:1rem;margin-bottom:18px}

/* Buttons + newsletter */
.mlm-popup__btns{display:flex;flex-direction:column;gap:12px;align-items:center}
.mlm-btn{appearance:none;border:0;border-radius:8px;padding:12px 18px;font-weight:700;text-decoration:none;cursor:pointer;display:inline-block}
.mlm-btn--primary{background:#A33227;color:#fff}
.mlm-btn--primary:hover{background:#7a241c}
.mlm-btn--secondary{background:#fff;color:#A33227;border:2px solid #A33227}
.mlm-btn--secondary:hover{background:#A33227;color:#fff}

/* Newsletter */
.mlm-newsletter{display:flex;gap:8px;width:100%;max-width:320px}
.mlm-newsletter input[type=email]{flex:1;min-width:0;padding:10px;border:1.5px solid #ccc;border-radius:8px}
/* mlm.css */
.mlm-popup.is-hidden { display: none !important; }
.mlm-shipbar{
  background: var(--mlm-beige);
  color: var(--mlm-navy);
  padding: .5rem .75rem;
  font: 500 14px var(--mlm-body);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.mlm-shipbar__wrap{
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; gap: .75rem;
}
.mlm-shipbar__meter{
  flex: 1; height: 6px; background: var(--mlm-fog);
  border-radius: 999px; overflow: hidden;
}
.mlm-shipbar__fill{
  height: 100%; width: 0;
  background: var(--mlm-navy);
  transition: width .35s ease;
}
.mlm-shipbar--done{ background: #EAF7EA; } /* subtle “win” state */
.mlm-shipbar--done .mlm-shipbar__fill{ background: var(--mlm-pine); }
.mlm-made{
  display: inline-flex; align-items: center; gap: .5rem;
  font: 600 14px var(--mlm-body);
  color: var(--mlm-navy); letter-spacing: .02em; opacity: .95;
  background: rgba(243,235,221,.6); /* plays nicely with your hero veil */
  padding: .4rem .6rem; border-radius: .5rem;
}
.mlm-made__icon{ fill: var(--mlm-navy); opacity: .9; }
@media (max-width: 740px){
  .mlm-made{ font-size: 13px; }
}
/* --- HERO LAYOUT --- */
.mlm-hero{
  /* your existing background rules already in theme; this just manages spacing */
  padding: clamp(18px, 4vw, 44px) 0;
}
.mlm-hero__wrap{
  max-width: 1200px; margin: 0 auto;
  display: grid; align-items: center;
  grid-template-columns: 1fr auto; /* text left, media right */
  gap: clamp(16px, 2vw, 28px);
}

/* Copy column sizing */
.mlm-hero__copy{ 
  max-width: 560px; 
  padding-inline: clamp(8px, 1.5vw, 16px);
}
.mlm-hero__h1{
  font-family: var(--mlm-head);
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.08; color: var(--mlm-navy); margin: 0 0 .35em;
}
.mlm-hero__sub{
  font-family: var(--mlm-body);
  font-size: clamp(14px, 1.8vw, 18px);
  color: var(--mlm-navy); opacity: .92;
  margin: 0 0 .8rem;
}

/* --- SQUARE CAROUSEL --- */
/* The outer width of the media column */
.mlm-hero__media{ 
  /* cap width to keep balance with copy */
  width: min(44vw, 700px); 
}

/* The square itself */
.mlm-hero__box{
  width: 100%;
  /* HEIGHT LOCK: choose one—svh keeps it under the fold */
  max-height: min(80svh, 720px);
  aspect-ratio: 1 / 1;       /* <-- makes it square */
  position: relative;
  border-radius: 16px;       /* optional, looks polished */
  overflow: hidden;          /* ensures no right-edge bleed */
  background: var(--mlm-fog);/* subtle backdrop while images load */
}

/* Make common slider containers fill the square */
.mlm-hero__box .slider,
.mlm-hero__box .carousel,
.mlm-hero__box .splide__track,
.mlm-hero__box .swiper,
.mlm-hero__box .flickity-viewport{
  height: 100% !important; 
}

/* Ensure slides/cards stretch to the square */
.mlm-hero__box .product-card,
.mlm-hero__box .product-item,
.mlm-hero__box .splide__slide,
.mlm-hero__box .swiper-slide,
.mlm-hero__box .flickity-slider > *{
  height: 100%;
}

/* IMAGES: pick one of these two depending on your preference */
/* 1) Cover = fills square, may crop edges (great for big lifestyle images) */
.mlm-hero__box img{ 
  height: 100%; width: 100%; 
  object-fit: cover; 
}

/* 2) Contain = shows full product image, may letterbox (uncomment to use) */
/*
.mlm-hero__box img{ 
  height: 100%; width: 100%; 
  object-fit: contain; 
  background: var(--mlm-beige);
}
*/

/* MOBILE: stack + center */
@media (max-width: 980px){
  .mlm-hero__wrap{ grid-template-columns: 1fr; }
  .mlm-hero__media{ width: 100%; }
  .mlm-hero__box{ 
    max-width: 560px;  /* keeps it from going comically large */
    margin-inline: auto;
  }
  .mlm-hero__copy{
    max-width: 640px; text-align: center;
    margin-inline: auto;
  }
}
/* HEADER UNDERLINE PROGRESS */
.mlm-shipline {
  position: sticky; top: var(--header-top, 0); z-index: 50;
  height: 2px; background: rgba(0,0,0,.06);
}
.mlm-shipline > span {
  display: block; height: 100%; width: 0%;
  background: #1F2A44; /* Navy, subtle */
  transition: width .35s ease;
}
.mlm-shipline__tooltip {
  position: fixed; top: 8px; left: 50%; transform: translateX(-50%);
  background: rgba(17,24,39,.92); color: #fff; font-size: 12px; padding: 6px 10px;
  border-radius: 999px; pointer-events: none; opacity: 0; transition: .2s;
}
.mlm-shipline:hover + .mlm-shipline__tooltip { opacity: 1; }


/* A11y helper in case theme lacks .visually-hidden */
.visually-hidden {
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden; clip: rect(1px,1px,1px,1px);
  white-space: nowrap; border: 0; padding: 0; margin: -1px;
}
/* Clean popup hero */
.mlm-popup__hero {
  background: var(--mlm-beige, #F3EBDD);   /* subtle neutral backdrop */
  padding: 32px 20px;
  text-align: center;
  color: var(--mlm-navy, #1F2B3A);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.mlm-popup__hero img.mlm-popup__logo {
  max-width: 140px;
  margin: 0 auto 16px;
  display: block;
}

.mlm-popup__headline {
  font-family: "Playfair Display", serif;
  font-size: 1.4rem;
  margin-bottom: 12px;
  color: var(--mlm-navy);
}

.mlm-popup__subtext {
  font-size: 1rem;
  margin-bottom: 18px;
  color: var(--mlm-navy);
}
/* === Popup actions: balanced, responsive grid === */
.mlm-popup__actions{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 8px;
}
@media (min-width: 700px){
  .mlm-popup__actions{
    grid-template-columns: 1fr 1fr;   /* IG | Newsletter side by side */
    align-items: center;
  }
}

/* Instagram row: pill with label + icon */
.mlm-ig{
  display: flex; align-items: center; justify-content: center;
  gap: 10px;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid rgba(31,43,58,.15);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
  color: var(--mlm-navy, #1F2B3A);
}
.mlm-ig__label{
  font: 600 15px var(--mlm-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  opacity: .95;
}

/* Icon button */
.mlm-ig__link{
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  border-radius: 999px;
  background: #fff;
  color: var(--mlm-navy, #1F2B3A);
  border: 1px solid rgba(31,43,58,.15);
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease;
}
.mlm-ig__link:hover{
  transform: translateY(-1px);
  background: var(--mlm-beige, #F3EBDD);
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
}

/* Newsletter: match height + balance spacing */
.mlm-newsletter--popup{
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid rgba(31,43,58,.15);
  border-radius: 12px;
  padding: 8px;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}
.mlm-newsletter--popup input[type="email"]{
  flex: 1 1 auto; min-width: 0;
  height: 40px;                         /* match icon button */
  padding: 0 12px;
  border: 1.5px solid rgba(31,43,58,.20);
  border-radius: 10px;
  font: 500 14px var(--mlm-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
}
.mlm-newsletter--popup .button{
  height: 40px;                         /* matches IG icon button */
  border-radius: 10px;
  white-space: nowrap;
}

/* Mobile stack: give each block full width */
@media (max-width: 699px){
  .mlm-ig, .mlm-newsletter--popup{ width: 100%; }
}
/* === COMING-SOON POPUP: force button look + hover (scoped) === */
#mlm-coming-popup .button.button--primary,
#mlm-coming-popup a.button.button--primary{
  background: var(--mlm-navy) !important;
  color: #fff !important;
  border: 1px solid transparent !important;
}

#mlm-coming-popup .button.button--primary:hover,
#mlm-coming-popup a.button.button--primary:hover{
  background: var(--mlm-vintage-white, #F5F0E6) !important;
  color: var(--mlm-navy) !important;
  border-color: var(--mlm-navy) !important;
}

/* If you use secondary inside the popup, keep it light/slick too */
#mlm-coming-popup .button.button--secondary,
#mlm-coming-popup a.button.button--secondary{
  background: #fff !important;
  color: var(--mlm-navy) !important;
  border: 1.5px solid rgba(31,43,58,.22) !important;
}
#mlm-coming-popup .button.button--secondary:hover,
#mlm-coming-popup a.button.button--secondary:hover{
  background: var(--mlm-beige, #F3EBDD) !important;
  border-color: rgba(31,43,58,.38) !important;
}

/* Kill global red link hover inside the popup */
#mlm-coming-popup a:hover:not(.button):not([class*="button--"]){
  color: var(--mlm-navy) !important;
}

/* Instagram logo link: navy circle + vintage-white hover */
#mlm-coming-popup .mlm-ig{ display:inline-flex; align-items:center; gap:8px; }
#mlm-coming-popup .mlm-ig__link{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:999px;
  background: var(--mlm-navy) !important; color:#fff !important;
  text-decoration:none !important; border:1px solid rgba(31,43,58,.15);
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease, opacity .2s ease;
}
#mlm-coming-popup .mlm-ig__link:hover{
  transform: translateY(-1px);
  background: var(--mlm-vintage-white, #F5F0E6) !important;
  color: var(--mlm-navy) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.14);
}

/* Newsletter form container: keep it neutral so it doesn't impose a dark scheme */
#mlm-coming-popup .mlm-newsletter--popup{
  display: grid; grid-template-columns: 1fr auto; gap: 8px;
  background: transparent !important; border: 0 !important; padding: 0 !important;
}
#mlm-coming-popup .mlm-newsletter--popup input[type="email"]{
  min-width: 0; padding: 10px 12px;
  border: 1px solid rgba(31,43,58,.18); border-radius: 10px;
  color: var(--mlm-navy);
}
/* === POPUP: make IG + Email tiles the same size === */

/* 1) Two equal columns on desktop; stack on mobile */
#mlm-coming-popup .mlm-popup__actions{
  display: grid;
  gap: 12px;
  align-items: stretch;                 /* children fill the row height */
}
@media (min-width: 720px){
  #mlm-coming-popup .mlm-popup__actions{
    grid-template-columns: 1fr 1fr;     /* equal widths */
  }
}

/* 2) Give BOTH tiles the same card frame */
#mlm-coming-popup :is(.mlm-ig, .mlm-newsletter--popup){
  background: #fff;
  border: 1px solid rgba(31,43,58,.12);
  border-radius: 12px;
  padding: 10px 12px;
  min-height: 60px;                     /* ← equal tile height */
  box-sizing: border-box;
  height: 100%;
}

/* 3) IG tile layout */
#mlm-coming-popup .mlm-ig{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
#mlm-coming-popup .mlm-ig__label{
  font: 600 15px/1.2 var(--mlm-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  color: var(--mlm-navy, #1F2B3A);
}
/* IG round logo button */
#mlm-coming-popup .mlm-ig__link{
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px;           /* matches email input/button height */
  border-radius: 999px;
  background: var(--mlm-navy) !important; color: #fff !important;
  text-decoration: none !important;
  border: 1px solid rgba(31,43,58,.15);
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease, opacity .2s ease;
}
#mlm-coming-popup .mlm-ig__link:hover{
  transform: translateY(-1px);
  background: var(--mlm-vintage-white, #F5F0E6) !important;
  color: var(--mlm-navy) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.14);
}

/* 4) Email tile layout (make input+button match IG badge height) */
#mlm-coming-popup form.mlm-newsletter--popup{ 
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  margin: 0;                            /* reset default form margins */
}
#mlm-coming-popup .mlm-newsletter--popup input[type="email"]{
  min-width: 0;
  height: 36px;                         /* match IG badge */
  padding: 0 12px;
  border: 1px solid rgba(31,43,58,.18);
  border-radius: 10px;
  font: 500 14px var(--mlm-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  color: var(--mlm-navy, #1F2B3A);
}
#mlm-coming-popup .mlm-newsletter--popup .button{
  height: 36px;                         /* match IG badge */
  padding: 0 16px;
  border-radius: 10px;
}

/* 5) Make sure each tile actually stretches to the same row height */
#mlm-coming-popup .mlm-popup__actions > *{
  align-self: stretch;                   /* belt & suspenders */
}
/* === POPUP: make IG + Email tiles exactly the same size === */

/* Equal columns on desktop; stack on mobile */
#mlm-coming-popup .mlm-popup__actions{
  display: grid;
  gap: 12px;
  align-items: stretch; /* children fill row height */
}
@media (min-width: 720px){
  #mlm-coming-popup .mlm-popup__actions{ grid-template-columns: 1fr 1fr; }
}

/* Equal card frame for BOTH tiles (force overrides) */
#mlm-coming-popup :is(.mlm-ig, .mlm-newsletter--popup){
  background: #fff !important;
  border: 1px solid rgba(31,43,58,.12) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  min-height: 64px !important;         /* ← set the common tile height */
  height: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;                 /* cancel stray margins */
}

/* IG tile layout */
#mlm-coming-popup .mlm-ig{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  line-height: 1 !important;            /* avoids extra height from line metrics */
}
#mlm-coming-popup .mlm-ig__label{
  font: 600 15px/1.2 var(--mlm-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  color: var(--mlm-navy, #1F2B3A);
  margin: 0 !important;
}
/* IG round logo badge → match control height */
#mlm-coming-popup .mlm-ig__link{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;              /* = email input/button height */
  border-radius: 999px !important;
  background: var(--mlm-navy) !important;
  color: #fff !important;
  text-decoration: none !important;
  border: 1px solid rgba(31,43,58,.15) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.08) !important;
}

/* Email tile layout */
#mlm-coming-popup form.mlm-newsletter--popup{
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
}
#mlm-coming-popup .mlm-newsletter--popup input[type="email"]{
  min-width: 0 !important;
  height: 40px !important;              /* match IG badge */
  padding: 0 12px !important;
  border: 1px solid rgba(31,43,58,.18) !important;
  border-radius: 10px !important;
  font: 500 14px var(--mlm-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
  color: var(--mlm-navy, #1F2B3A) !important;
}
#mlm-coming-popup .mlm-newsletter--popup .button{
  height: 40px !important;              /* match IG badge */
  padding: 0 16px !important;
  border-radius: 10px !important;
}

/* Ensure both tiles actually stretch to the same row height */
#mlm-coming-popup .mlm-popup__actions > *{ align-self: stretch !important; }
/* Desktop/tablet: normal flow */
.mlm-about__title .h1-line1,
.mlm-about__title .h1-line2 { display:inline; }

/* Mobile: force two lines, no mid-phrase wraps */
@media (max-width: 749px){
  .mlm-about__title{
    max-width: 30ch;        /* keeps each line ~balanced */
    margin: 0 auto;
  }
  .mlm-about__title .h1-line1,
  .mlm-about__title .h1-line2{
    display:block;
    white-space: nowrap;     /* prevents “here” dropping */
  }
}
/* Cart drawer primary button fix */
cart-drawer-component .button,
#CartDrawer .button {
  background-color: rgb(var(--color-button, 15 31 50));   /* fallback navy */
  color: rgb(var(--color-button-text, 255 255 255));      /* fallback white */
}

cart-drawer-component .button:hover,
#CartDrawer .button:hover {
  background-color: rgba(var(--color-button, 15 31 50), .90);
  color: rgb(var(--color-button-text, 255 255 255));
}
/* Sticky Mobile ATC */
.mlm-sticky-atc {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 50;
  background: #ffffff;
  box-shadow: 0 -6px 20px rgba(0,0,0,.08);
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(0,0,0,.06);
}

.mlm-sticky-atc__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  max-width: 1100px;
  margin: 0 auto;
}

.mlm-sticky-atc__name {
  font-weight: 600;
  line-height: 1.2;
}

.mlm-sticky-atc__variant {
  font-size: 12px;
  opacity: .75;
  margin-top: 2px;
}

.mlm-sticky-atc__price {
  font-weight: 600;
  margin-right: 10px;
}

.mlm-sticky-atc__btn {
  appearance: none;
  border: none;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 600;
  cursor: pointer;
  background: #111;   /* your navy or brand color if preferred */
  color: #fff;
}
.mlm-sticky-atc[data-soldout="true"] .mlm-sticky-atc__btn {
  background: #bbb; cursor: not-allowed;
}

/* Only show on small screens */
@media (min-width: 750px) {
  .mlm-sticky-atc { display: none !important; }
}
/* Brand navy for sticky ATC button */
.mlm-sticky-atc__btn {
  background: #1F2A44;   /* your navy */
  color: #fff;
}
.mlm-sticky-atc__btn:hover { filter: brightness(0.95); }
.mlm-sticky-atc__btn:active { filter: brightness(0.9); }
/* Clean cart drawer header bar on mobile */
.cart-drawer .drawer__header,
.cart-drawer .drawer__top,
.cart-drawer .drawer__header::before,
#CartDrawer .drawer__header,
#CartDrawer .drawer__top,
#CartDrawer .drawer__header::before {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
/* ===== Remove navy bar/header strip at top of cart drawer ===== */

/* Kill background color, border, and shadow on drawer header */
#CartDrawer .drawer__header,
#CartDrawer .drawer__top,
#CartDrawer .drawer__header::before,
.cart-drawer .drawer__header,
.cart-drawer .drawer__top,
.cart-drawer .drawer__header::before {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Remove any pseudo elements used for the strip */
#CartDrawer::before,
.cart-drawer::before {
  content: none !important;
  background: transparent !important;
}

/* If your theme is injecting a solid bar via ::after, cover that too */
#CartDrawer::after,
.cart-drawer::after {
  content: none !important;
}
/* ===== MLM Size Table (scoped) ===== */
.mlm-acc .mlm-size-wrap { margin:.75rem 0 1.25rem; overflow-x:auto; }
.mlm-acc .mlm-size-wrap .mlm-size-guide{
  width:100%; border-collapse:separate; border-spacing:0;
  font-size:.95rem; line-height:1.45;
  color:var(--mlm-navy,#1F2B3A); background:var(--mlm-bg,#fff);
  min-width:640px;
}
/* Caption */
.mlm-acc .mlm-size-wrap .mlm-size-guide caption{
  caption-side:top; text-align:left; font-weight:700; margin:0 0 .5rem 0;
  color:var(--mlm-navy,#1F2B3A);
}
/* Cells */
.mlm-acc .mlm-size-wrap .mlm-size-guide th,
.mlm-acc .mlm-size-wrap .mlm-size-guide td{
  padding:.6rem .65rem; border-bottom:1px solid var(--mlm-fog,#e5e5e5);
  vertical-align:middle; white-space:nowrap;
}
/* Header */
.mlm-acc .mlm-size-wrap .mlm-size-guide thead th{
  position:sticky; top:0; z-index:1; background:var(--mlm-bg,#fff);
  text-transform:uppercase; font-size:.82rem; letter-spacing:.02em; font-weight:700;
  border-bottom:2px solid var(--mlm-fog,#e5e5e5);
}
.mlm-acc .mlm-size-wrap .mlm-size-guide thead th:first-child{border-top-left-radius:8px;}
.mlm-acc .mlm-size-wrap .mlm-size-guide thead th:last-child{border-top-right-radius:8px;}
/* First column */
.mlm-acc .mlm-size-wrap .mlm-size-guide tbody th[scope="row"]{
  text-align:left; font-weight:600; color:var(--mlm-navy,#1F2B3A);
}
/* Numbers centered */
.mlm-acc .mlm-size-wrap .mlm-size-guide td{ text-align:center; }
/* Zebra */
.mlm-acc .mlm-size-wrap .mlm-size-guide tbody tr:nth-child(even){
  background:rgba(31,43,58,.03);
}
/* Small screens */
@media (max-width:480px){
  .mlm-acc .mlm-size-wrap .mlm-size-guide{font-size:.9rem;}
  .mlm-acc .mlm-size-wrap .mlm-size-guide th,
  .mlm-acc .mlm-size-wrap .mlm-size-guide td{padding:.5rem .55rem;}
}