/** Shopify CDN: Minification failed

Line 14:72 Unexpected "*"
Line 18:37 Expected identifier but found "%"
Line 19:50 Expected identifier but found whitespace
Line 21:77 Unterminated string token

**/
/* ==========================================================================
   god-smi-fix

   Section Store's base utility stylesheet is NOT installed in this theme.
   Classes like .smi-d-flex, .smi-w-100, .smi-p-absolute, .smi-round,
   .smi-object-fit-cover, .smi-media-height-* and the .smi-mb-*/.smi-pr-*
   spacing scale are defined in no stylesheet on the page, so every SMI
   section that relies on them renders unstyled.

   Each section still ships its OWN {% style %} block, so we only need to
   restore the shared utility layer underneath it.

   Specificity is deliberately kept LOW (single class) so that each section's
   own rules continue to win - e.g. the map zeroes its side padding on mobile
   with a 2-class selector, and that must still override these.
   The only exceptions are commented inline.

   NOT defined here on purpose: .smi-d-none, .smi-mb-lg, .smi-gradient.
   The live ✧Footer 1-4 uses those three, and defining them globally would
   change the footer. Where a fixed section needs them they are scoped to
   that section instead (see the map block below).
   ========================================================================== */

/* ---------- display / flex ---------- */
.smi-d-flex { display: flex; }
.smi-flex-row { flex-direction: row; }
.smi-flex-row-reverse { flex-direction: row-reverse; }
.smi-align-self-stretch { align-self: stretch; }
.smi-align-content-center { align-content: center; }
.smi-justify-content-start { justify-content: flex-start; }
.smi-justify-content-center { justify-content: center; }
.smi-justify-content-end { justify-content: flex-end; }

/* ---------- sizing ---------- */
.smi-w-100 { width: 100%; }
.smi-h-100 { height: 100%; }
.smi-h-auto { height: auto; }
.smi-mw-100 { max-width: 100%; }
.smi-lh-0 { line-height: 0; }
.smi-object-fit-cover { object-fit: cover; }
.smi-position-relative { position: relative; }
.smi-p-relative { position: relative; }
.smi-p-absolute { position: absolute; }
.smi-overflow-hidden { overflow: hidden; }
.smi-overflow-x-clip { overflow-x: clip; }
.smi-cursor-pointer { cursor: pointer; }

/* ---------- spacing scale ----------
   xxs 4 / xs 8 / sm 12 / md 16 / lg 24 / xl 32 / xxl 48 / xxxl 64 / xxxxl 80
   Scaled by --spacing-elements so the theme's Layout setting still applies. */
.smi-mb-xxs { margin-bottom: calc(var(--spacing-elements, 1) * 4px); }
.smi-mb-xs  { margin-bottom: calc(var(--spacing-elements, 1) * 8px); }
.smi-mb-sm  { margin-bottom: calc(var(--spacing-elements, 1) * 12px); }
.smi-mb-md  { margin-bottom: calc(var(--spacing-elements, 1) * 16px); }
.smi-mb-xl  { margin-bottom: calc(var(--spacing-elements, 1) * 32px); }
.smi-mb-xxl { margin-bottom: calc(var(--spacing-elements, 1) * 48px); }
.smi-mt-xxs { margin-top: calc(var(--spacing-elements, 1) * 4px); }
.smi-mt-md  { margin-top: calc(var(--spacing-elements, 1) * 16px); }
.smi-mt-lg  { margin-top: calc(var(--spacing-elements, 1) * 24px); }
.smi-mt-xl  { margin-top: calc(var(--spacing-elements, 1) * 32px); }
.smi-mr-sm  { margin-right: calc(var(--spacing-elements, 1) * 12px); }
.smi-pt-xl  { padding-top: calc(var(--spacing-elements, 1) * 32px); }
.smi-px-lg  { padding-left: calc(var(--spacing-elements, 1) * 24px); padding-right: calc(var(--spacing-elements, 1) * 24px); }
.smi-py-lg  { padding-top: calc(var(--spacing-elements, 1) * 24px); padding-bottom: calc(var(--spacing-elements, 1) * 24px); }
.smi-pl-xxxxl { padding-left: 80px; }
.smi-pr-xxxxl { padding-right: 80px; }

/* ---------- responsive ---------- */
@media screen and (min-width: 768px) {
  .smi-d-md-flex { display: flex; }
  .smi-w-md-50 { width: 50%; }
  .smi-pl-md-xxl { padding-left: 48px; }
  .smi-pr-md-xxl { padding-right: 48px; }
}

@media screen and (min-width: 992px) {
  .smi-w-lg-40 { width: 40%; }
  .smi-w-lg-50 { width: 50%; }
  .smi-w-lg-60 { width: 60%; }
  .smi-pl-lg-xxxl { padding-left: 64px; }
  .smi-pr-lg-xxxl { padding-right: 64px; }
}

/* ==========================================================================
   ✧Collection list 15-x  (verified fix)
   ========================================================================== */
.smi-section-collection-list-15 .smi-collection-item-5__media > a {
  position: relative;
  display: flex;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  background: #fff;
  aspect-ratio: var(--media-ratio, 1/1);
}

.smi-section-collection-list-15 .smi-collection-item-5__media > a.smi-round {
  border-radius: 50%;
}

.smi-section-collection-list-15 .smi-collection-item-5__media > a > img,
.smi-section-collection-list-15 .smi-collection-item-5__media > a > svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.smi-section-collection-list-15 .smi-collection-item-5 { row-gap: 10px; }

/* The section's own Custom CSS paints a white square on the media wrapper,
   which hides the circular mask. White now sits behind the circle instead. */
.smi-section-collection-list-15 .smi-collection-item-5 .smi-collection-item-5__media {
  background: transparent !important;
}

/* ==========================================================================
   ✧Map 2-x  (verified fix)

   The map rendered as a thin strip because .smi-media-height-* was undefined:
   the iframe is height:100% of a container that had no height.

   Mobile / no-flex: an explicit height, so the iframe's percentage height has
   a definite box to resolve against.
   From 768px up the row is a flex container, so height goes back to auto and
   the value becomes a floor - the map then stretches to match the text column
   instead of leaving dead space beside it.

   3-class selectors are needed to out-specify the section's own
   `.smi-section-map-2 .smi-media-settings { height: auto }`.
   ========================================================================== */
.smi-section-map-2 .smi-map-iframe.smi-media-height-xxs-small { height: 240px; }
.smi-section-map-2 .smi-map-iframe.smi-media-height-x-small   { height: 320px; }
.smi-section-map-2 .smi-map-iframe.smi-media-height-small     { height: 400px; }
.smi-section-map-2 .smi-map-iframe.smi-media-height-medium    { height: 480px; }
.smi-section-map-2 .smi-map-iframe.smi-media-height-large     { height: 600px; }

@media screen and (min-width: 768px) {
  .smi-section-map-2 .smi-map-iframe.smi-media-height-xxs-small { height: auto; min-height: 240px; }
  .smi-section-map-2 .smi-map-iframe.smi-media-height-x-small   { height: auto; min-height: 320px; }
  .smi-section-map-2 .smi-map-iframe.smi-media-height-small     { height: auto; min-height: 400px; }
  .smi-section-map-2 .smi-map-iframe.smi-media-height-medium    { height: auto; min-height: 480px; }
  .smi-section-map-2 .smi-map-iframe.smi-media-height-large     { height: auto; min-height: 600px; }
}

/* scoped here rather than globally - the footer also uses .smi-mb-lg */
.smi-section-map-2 .smi-mb-lg { margin-bottom: calc(var(--spacing-elements, 1) * 24px); }

.smi-section-map-2 .smi-map-content { min-width: 0; }
