/**
 * Shop archive — shop-page v3 (/shop/ + product taxonomies)
 * Scoped hard against WoodMart + Additional CSS button system.
 */

body.mn-sa-screen,
body.mn-sa-screen .website-wrapper,
body.mn-sa-screen .main-page-wrapper,
body.mn-sa-screen .wd-page-content,
body.mn-sa-screen .wd-content-layout,
body.mn-sa-screen .content-layout-wrapper,
body.mn-sa-screen main.wd-content-layout,
body.mn-sa-screen main.container {
  background: #FDFAF4 !important;
  background-color: #FDFAF4 !important;
}

body.mn-sa-screen {
  background: #FDFAF4 !important;
  font-family: var(--mn-font, "Manrope", system-ui, sans-serif) !important;
  color: var(--shell-700);
  -webkit-font-smoothing: antialiased;
}

/* Kill WoodMart page chrome */
body.mn-sa-screen .page-title,
body.mn-sa-screen .wd-page-title,
body.mn-sa-screen .title-container,
body.mn-sa-screen .wd-page-title-header,
body.mn-sa-screen .entry-title.title,
body.mn-sa-screen h5.title,
body.mn-sa-screen .woocommerce-breadcrumb,
body.mn-sa-screen .woocommerce-products-header,
body.mn-sa-screen .shop-loop-head,
body.mn-sa-screen .wd-shop-tools,
body.mn-sa-screen .wd-filtered-nav,
body.mn-sa-screen .sidebar-container,
body.mn-sa-screen .sidebar-shop,
body.mn-sa-screen .wd-sidebar,
body.mn-sa-screen #sidebar-shop,
body.mn-sa-screen aside.sidebar-container,
body.mn-sa-screen .wd-sticky-loader,
body.mn-sa-screen .wd-content-loader {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
}

/* Break out of WoodMart container / CSS grid wrappers */
body.mn-sa-screen .wd-page-content,
body.mn-sa-screen .main-page-wrapper,
body.mn-sa-screen .wd-content-layout,
body.mn-sa-screen .content-layout-wrapper,
body.mn-sa-screen main.wd-content-layout,
body.mn-sa-screen main.container {
  display: block !important;
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  --wd-col-lg: unset !important;
  --wd-gap-lg: unset !important;
  --wd-gap-sm: unset !important;
}

body.mn-sa-screen .mn-sa {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--shell-700);
  font-size: 16px;
  line-height: 1.65;
  letter-spacing: -0.006em;
  box-sizing: border-box;
}

body.mn-sa-screen .mn-sa *,
body.mn-sa-screen .mn-sa *::before,
body.mn-sa-screen .mn-sa *::after {
  box-sizing: border-box;
}

body.mn-sa-screen .mn-sa a {
  color: inherit;
  text-decoration: none !important;
}

body.mn-sa-screen .mn-sa img {
  display: block;
  max-width: 100%;
  height: auto;
}

body.mn-sa-screen .mn-sa svg {
  display: block;
}

body.mn-sa-screen .mn-sa__wrap {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
  width: 100% !important;
}

body.mn-sa-screen .mn-sa__meta {
  font-family: var(--mn-mono, "Martian Mono", ui-monospace, monospace) !important;
  font-size: 10px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--fynbos-700) !important;
  font-weight: 400 !important;
}

/* ---------- HEAD ---------- */
body.mn-sa-screen .mn-sa__head {
  padding: 80px 0 40px !important;
}

body.mn-sa-screen .mn-sa__head .mn-sa__meta {
  margin-bottom: 18px !important;
}

body.mn-sa-screen .mn-sa__head h1 {
  margin: 0 0 16px !important;
  padding: 0 !important;
  font-size: 48px !important;
  font-weight: 200 !important;
  letter-spacing: -0.046em !important;
  line-height: 1.1 !important;
  color: var(--shell-900) !important;
  font-family: var(--mn-title-font, Georgia, "Times New Roman", serif) !important;
}

body.mn-sa-screen .mn-sa__head p {
  margin: 0 !important;
  font-size: 18px !important;
  font-weight: 300 !important;
  color: var(--shell-600) !important;
  max-width: 52ch;
  line-height: 1.6 !important;
}

/* ---------- CHIPS ---------- */
body.mn-sa-screen .mn-sa__chiphead {
  font-family: var(--mn-mono, "Martian Mono", ui-monospace, monospace) !important;
  font-size: 9.5px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--shell-500) !important;
  margin: 0 0 16px !important;
}

body.mn-sa-screen .mn-sa__chips {
  display: flex !important;
  gap: 9px !important;
  flex-wrap: wrap !important;
  margin: 0 0 36px !important;
  padding: 0 !important;
}

body.mn-sa-screen .mn-sa__chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 42px !important;
  min-height: 42px !important;
  min-width: 0 !important;
  padding: 0 18px !important;
  border-radius: var(--r-full, 999px) !important;
  background: var(--shell-0, #fff) !important;
  border: 1px solid var(--shell-200) !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: var(--shell-700) !important;
  letter-spacing: -0.006em !important;
  line-height: 1 !important;
  text-transform: none !important;
  box-shadow: none !important;
  transition: border-color 0.16s, background-color 0.16s, color 0.16s;
}

body.mn-sa-screen .mn-sa__chip:hover {
  border-color: var(--shell-400) !important;
  background: var(--shell-0, #fff) !important;
  color: var(--shell-700) !important;
}

body.mn-sa-screen .mn-sa__chip.is-on {
  background: var(--shell-900) !important;
  border-color: var(--shell-900) !important;
  color: #fff !important;
}

body.mn-sa-screen .mn-sa__chip span {
  font-size: 12.5px !important;
  color: var(--shell-500) !important;
  font-weight: 500 !important;
}

body.mn-sa-screen .mn-sa__chip.is-on span {
  color: rgba(255, 255, 255, 0.62) !important;
}

/* ---------- LAYOUT ---------- */
body.mn-sa-screen .mn-sa__cols {
  display: grid !important;
  grid-template-columns: 224px minmax(0, 1fr) !important;
  gap: 44px !important;
  align-items: start !important;
  padding-bottom: 96px !important;
}

body.mn-sa-screen .mn-sa__side {
  position: sticky !important;
  top: 24px !important;
  display: block !important;
  width: 224px !important;
  max-width: 224px !important;
}

body.mn-sa-screen .mn-sa__main {
  min-width: 0 !important;
  width: 100% !important;
}

body.mn-sa-screen .mn-sa__fbox {
  background: var(--shell-0, #fff) !important;
  border-radius: var(--r-lg, 20px) !important;
  padding: 24px !important;
  margin: 0 0 16px !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.mn-sa-screen .mn-sa__fbox h3 {
  margin: 0 0 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: -0.008em !important;
  color: var(--shell-900) !important;
  line-height: 1.1 !important;
  text-transform: none !important;
}

body.mn-sa-screen .mn-sa__fprice {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin: 0 0 18px !important;
}

body.mn-sa-screen .mn-sa__fprice label {
  display: block !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--shell-600) !important;
  margin: 0 0 6px !important;
}

body.mn-sa-screen .mn-sa__fprice input {
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 14px !important;
  border: 1px solid var(--shell-300) !important;
  border-radius: var(--r-md, 12px) !important;
  background: var(--shell-0, #fff) !important;
  font-family: var(--mn-font, "Manrope", system-ui, sans-serif) !important;
  font-size: 14.5px !important;
  font-weight: 400 !important;
  color: var(--shell-900) !important;
  box-shadow: none !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

body.mn-sa-screen .mn-sa__fprice input::placeholder {
  color: var(--shell-400) !important;
  opacity: 1 !important;
}

body.mn-sa-screen .mn-sa__fprice input:focus {
  outline: none !important;
  border-color: var(--ember-600) !important;
  box-shadow: 0 0 0 3px rgba(178, 69, 45, 0.12) !important;
}

/* Beat global Additional CSS button system */
body.mn-sa-screen .mn-sa__fbtn,
body.mn-sa-screen .mn-sa button.mn-sa__fbtn,
body.mn-sa-screen .mn-sa input.mn-sa__fbtn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  min-width: 0 !important;
  padding: 0 14px !important;
  border-radius: var(--r-md, 12px) !important;
  border: 1px solid var(--shell-900) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--shell-900) !important;
  font-family: var(--mn-font, "Manrope", system-ui, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: -0.006em !important;
  line-height: 1 !important;
  text-transform: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

body.mn-sa-screen .mn-sa__fbtn:hover {
  background: var(--shell-900) !important;
  background-color: var(--shell-900) !important;
  border-color: var(--shell-900) !important;
  color: #fff !important;
}

body.mn-sa-screen .mn-sa__fcheck {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  font-size: 14.5px !important;
  color: var(--shell-700) !important;
  cursor: pointer;
  padding: 7px 0 !important;
  margin: 0 !important;
  font-weight: 400 !important;
}

body.mn-sa-screen .mn-sa__fcheck input {
  width: 17px !important;
  height: 17px !important;
  accent-color: var(--ember-600);
  cursor: pointer;
  flex: none !important;
  margin: 0 !important;
}

body.mn-sa-screen .mn-sa__fcheck em {
  font-style: normal !important;
  color: var(--shell-500) !important;
  font-size: 13px !important;
  margin-left: auto !important;
  font-weight: 400 !important;
}

body.mn-sa-screen .mn-sa__fclear {
  display: inline-block !important;
  font-size: 13.5px !important;
  color: var(--ember-600) !important;
  font-weight: 600 !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
}

/* ---------- TOOLBAR ---------- */
body.mn-sa-screen .mn-sa__tools {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  margin: 0 0 24px !important;
}

body.mn-sa-screen .mn-sa__tools-c {
  font-size: 14.5px !important;
  color: var(--shell-600) !important;
}

body.mn-sa-screen .mn-sa__tools-c b {
  color: var(--shell-900) !important;
  font-weight: 600 !important;
}

body.mn-sa-screen .mn-sa__sel {
  position: relative !important;
  margin: 0 !important;
}

body.mn-sa-screen .mn-sa__sel select {
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 42px 0 16px !important;
  border: 1px solid var(--shell-300) !important;
  border-radius: var(--r-md, 12px) !important;
  background: var(--shell-0, #fff) !important;
  font-family: var(--mn-font, "Manrope", system-ui, sans-serif) !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: var(--shell-900) !important;
  appearance: none !important;
  cursor: pointer;
  box-shadow: none !important;
  min-width: 180px;
}

body.mn-sa-screen .mn-sa__sel select:focus {
  outline: none !important;
  border-color: var(--ember-600) !important;
}

body.mn-sa-screen .mn-sa__sel svg {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--shell-500);
  pointer-events: none;
}

/* ---------- GRID ---------- */
body.mn-sa-screen .mn-sa__grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  float: none !important;
  clear: both !important;
}

body.mn-sa-screen .mn-sa__grid::before,
body.mn-sa-screen .mn-sa__grid::after {
  display: none !important;
  content: none !important;
}

body.mn-sa-screen .mn-sa__grid > li,
body.mn-sa-screen .mn-sa__grid > .mn-sa__item,
body.mn-sa-screen .mn-sa__grid > .product {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  max-width: none !important;
  float: none !important;
  clear: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
}

body.mn-sa-screen .mn-sa__card {
  background: var(--shell-0, #fff) !important;
  border-radius: var(--r-lg, 20px) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  height: 100% !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  transition: transform 0.28s cubic-bezier(0.32, 1.3, 0.6, 1), box-shadow 0.28s;
}

body.mn-sa-screen .mn-sa__card:hover {
  transform: translateY(-5px);
  box-shadow: 0 14px 32px -14px rgba(56, 51, 46, 0.18) !important;
}

body.mn-sa-screen .mn-sa__img {
  aspect-ratio: 1 / 1 !important;
  background: var(--shell-100) !important;
  overflow: hidden !important;
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
}

body.mn-sa-screen .mn-sa__img > a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  position: absolute !important;
  inset: 0 !important;
}

body.mn-sa-screen .mn-sa__img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.6s cubic-bezier(0.3, 1, 0.5, 1);
  border-radius: 0 !important;
}

body.mn-sa-screen .mn-sa__card:hover .mn-sa__img img {
  transform: scale(1.04);
}

body.mn-sa-screen .mn-sa__img.is-out img {
  opacity: 0.55 !important;
}

body.mn-sa-screen .mn-sa__badge {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  z-index: 2 !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 6px 12px !important;
  border-radius: var(--r-full, 999px) !important;
  line-height: 1 !important;
}

body.mn-sa-screen .mn-sa__badge--new {
  background: rgba(255, 255, 255, 0.95) !important;
  color: var(--shell-900) !important;
}

body.mn-sa-screen .mn-sa__badge--sale {
  background: var(--ember-600) !important;
  color: #fff !important;
}

body.mn-sa-screen .mn-sa__badge--last {
  background: var(--amber-100) !important;
  color: var(--amber-700) !important;
}

body.mn-sa-screen .mn-sa__save,
body.mn-sa-screen .mn-sa button.mn-sa__save {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  z-index: 3 !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: var(--r-full, 999px) !important;
  border: 0 !important;
  background: rgba(255, 255, 255, 0.9) !important;
  background-color: rgba(255, 255, 255, 0.9) !important;
  color: var(--shell-600) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0;
  cursor: pointer;
  padding: 0 !important;
  box-shadow: none !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  transition: opacity 0.2s, color 0.16s;
}

body.mn-sa-screen .mn-sa__card:hover .mn-sa__save,
body.mn-sa-screen .mn-sa__save:focus {
  opacity: 1;
}

body.mn-sa-screen .mn-sa__save:hover {
  color: var(--ember-600) !important;
  background: rgba(255, 255, 255, 0.95) !important;
}

body.mn-sa-screen .mn-sa__save svg {
  width: 17px !important;
  height: 17px !important;
}

body.mn-sa-screen .mn-sa__b {
  padding: 18px 20px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  text-align: left !important;
  gap: 0 !important;
}

body.mn-sa-screen .mn-sa__mk {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 9px !important;
  min-width: 0 !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
}

body.mn-sa-screen .mn-sa__mk img {
  width: 22px !important;
  height: 22px !important;
  border-radius: var(--r-full, 999px) !important;
  object-fit: cover !important;
  flex: none !important;
  background: var(--shell-200);
}

body.mn-sa-screen .mn-sa__mk span {
  font-family: var(--mn-mono, "Martian Mono", ui-monospace, monospace) !important;
  font-size: 9px !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  color: var(--fynbos-700) !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 400 !important;
}

body.mn-sa-screen .mn-sa__n {
  display: block !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: -0.016em !important;
  color: var(--shell-900) !important;
  line-height: 1.35 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  box-shadow: none !important;
  text-transform: none !important;
}

body.mn-sa-screen .mn-sa__p {
  font-size: 15.5px !important;
  font-weight: 600 !important;
  color: var(--ember-600) !important;
  letter-spacing: -0.012em !important;
  margin-top: auto !important;
  line-height: 1.3 !important;
}

body.mn-sa-screen .mn-sa__p .amount,
body.mn-sa-screen .mn-sa__p .woocommerce-Price-amount {
  color: var(--ember-600) !important;
  font-weight: 600 !important;
  font-size: inherit !important;
}

body.mn-sa-screen .mn-sa__p del,
body.mn-sa-screen .mn-sa__p del .amount {
  color: var(--shell-400) !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  margin-right: 7px;
}

/* Outline CTA — never global primary solid */
body.mn-sa-screen .mn-sa__cta,
body.mn-sa-screen .mn-sa a.mn-sa__cta,
body.mn-sa-screen .mn-sa a.mn-sa__cta.add_to_cart_button,
body.mn-sa-screen .mn-sa a.mn-sa__cta.ajax_add_to_cart,
body.mn-sa-screen .woocommerce a.mn-sa__cta {
  margin-top: 14px !important;
  height: 44px !important;
  min-height: 44px !important;
  width: 100% !important;
  min-width: 0 !important;
  border-radius: var(--r-md, 12px) !important;
  border: 1px solid var(--shell-300) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--shell-900) !important;
  font-family: var(--mn-font, "Manrope", system-ui, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: -0.006em !important;
  line-height: 1 !important;
  text-transform: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 0 12px !important;
  transition: background-color 0.16s, border-color 0.16s, color 0.16s;
}

body.mn-sa-screen .mn-sa__card:hover .mn-sa__cta:not(.mn-sa__cta--out),
body.mn-sa-screen .mn-sa__card:hover a.mn-sa__cta:not(.mn-sa__cta--out) {
  background: var(--ember-600) !important;
  background-color: var(--ember-600) !important;
  border-color: var(--ember-600) !important;
  color: #fff !important;
}

body.mn-sa-screen .mn-sa__cta--out,
body.mn-sa-screen .mn-sa a.mn-sa__cta--out {
  border-style: dashed !important;
  color: var(--shell-500) !important;
}

body.mn-sa-screen .mn-sa__card:hover .mn-sa__cta--out {
  background: transparent !important;
  border-color: var(--shell-400) !important;
  color: var(--shell-600) !important;
}

body.mn-sa-screen .mn-sa__empty {
  padding: 48px 24px !important;
  text-align: center;
  color: var(--shell-600);
  background: var(--shell-0);
  border-radius: var(--r-lg, 20px);
}

/* ---------- PAGINATION ---------- */
body.mn-sa-screen .mn-sa__pager {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 56px 0 0 !important;
  flex-wrap: wrap !important;
}

body.mn-sa-screen .mn-sa__pager a,
body.mn-sa-screen .mn-sa__pager span,
body.mn-sa-screen .mn-sa__pager .page-numbers {
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 14px !important;
  border-radius: var(--r-md, 12px) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: var(--shell-700) !important;
  background: var(--shell-0, #fff) !important;
  border: 0 !important;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

body.mn-sa-screen .mn-sa__pager a:hover {
  background: var(--shell-200) !important;
  color: var(--shell-900) !important;
}

body.mn-sa-screen .mn-sa__pager .current,
body.mn-sa-screen .mn-sa__pager a.is-on {
  background: var(--shell-900) !important;
  color: #fff !important;
}

/* ---------- STORY ---------- */
body.mn-sa-screen .mn-sa__story {
  background: #FDFAF4 !important;
  padding: 88px 0 !important;
  margin: 0 !important;
  width: 100% !important;
}

body.mn-sa-screen .mn-sa__story-g {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 72px !important;
  align-items: start !important;
}

body.mn-sa-screen .mn-sa__story h2 {
  margin: 0 0 20px !important;
  font-size: 34px !important;
  font-weight: 200 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.1 !important;
  color: var(--shell-900) !important;
  max-width: 18ch;
  font-family: var(--mn-title-font, Georgia, "Times New Roman", serif) !important;
}

body.mn-sa-screen .mn-sa__story p {
  margin: 0 0 16px !important;
  font-size: 16.5px !important;
  font-weight: 300 !important;
  line-height: 1.75 !important;
  color: var(--shell-600) !important;
}

body.mn-sa-screen .mn-sa__story p:last-child {
  margin-bottom: 0 !important;
}

body.mn-sa-screen .mn-sa__story-pts {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

body.mn-sa-screen .mn-sa__story-pt {
  display: flex !important;
  gap: 14px !important;
  align-items: flex-start !important;
}

body.mn-sa-screen .mn-sa__story-pt svg {
  width: 20px !important;
  height: 20px !important;
  flex: none !important;
  margin-top: 3px;
  color: var(--fynbos-700);
}

body.mn-sa-screen .mn-sa__story-pt b {
  display: block !important;
  font-size: 15.5px !important;
  font-weight: 600 !important;
  color: var(--shell-900) !important;
  letter-spacing: -0.014em !important;
  margin-bottom: 3px !important;
}

body.mn-sa-screen .mn-sa__story-pt span {
  font-size: 14.5px !important;
  color: var(--shell-600) !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
}

@media (max-width: 1100px) {
  body.mn-sa-screen .mn-sa__cols {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  body.mn-sa-screen .mn-sa__side {
    position: static !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.mn-sa-screen .mn-sa__fclear {
    grid-column: 1 / -1;
  }

  body.mn-sa-screen .mn-sa__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.mn-sa-screen .mn-sa__story-g {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  body.mn-sa-screen .mn-sa__head {
    padding: 52px 0 28px !important;
  }

  body.mn-sa-screen .mn-sa__head h1 {
    font-size: 32px !important;
  }

  body.mn-sa-screen .mn-sa__story {
    padding: 56px 0 !important;
  }

  body.mn-sa-screen .mn-sa__story h2 {
    font-size: 26px !important;
    max-width: none;
  }

  body.mn-sa-screen .mn-sa__wrap {
    padding: 0 20px !important;
  }
}

@media (max-width: 600px) {
  body.mn-sa-screen .mn-sa__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  body.mn-sa-screen .mn-sa__side {
    grid-template-columns: 1fr !important;
  }

  body.mn-sa-screen .mn-sa__b {
    padding: 14px 14px 16px !important;
  }

  body.mn-sa-screen .mn-sa__n {
    font-size: 14.5px !important;
  }

  body.mn-sa-screen .mn-sa__cta,
  body.mn-sa-screen .mn-sa a.mn-sa__cta {
    height: 40px !important;
    min-height: 40px !important;
    font-size: 13.5px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.mn-sa-screen .mn-sa__card:hover {
    transform: none;
  }
}

/* Print shop CSS last in the cascade when Autoptimize / Additional CSS fight us */
body.mn-sa-screen .mn-sa__grid {
  display: grid !important;
}