/** Shopify CDN: Minification failed

Line 271:22 Unexpected "--empty"

**/
/* ═══════════════════════════════════════════════════════════════════════════
   MULGOKI — Premium K-pop Trading Card Design System
   Creative Direction: Japanese boutique × Collector card culture
   Theme: Shopify Horizon v4.1.1 Override
   ═══════════════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════
   1. FONT LOADING
   ═══════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

@font-face {
  font-family: 'Okta Neue';
  src: url('OktaNeue-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Okta Neue';
  src: url('OktaNeue-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ═══════════════════════════════════════════
   2. CSS CUSTOM PROPERTIES — Design Tokens
   ═══════════════════════════════════════════ */

:root {
  /* ── Colors — Monochrome Gallery ── */
  --mg-white:          #FAFAFA;
  --mg-off-white:      #F0F0F0;
  --mg-light-gray:     #E5E5E5;
  --mg-silver:         #C0C0C0;
  --mg-mid-gray:       #888888;
  --mg-dark-gray:      #333333;
  --mg-near-black:     #111111;
  --mg-black:          #000000;
  --mg-glass:          rgba(255, 255, 255, 0.6);
  --mg-glass-border:   rgba(17, 17, 17, 0.08);
  --mg-shimmer:        linear-gradient(110deg, #FFFFFF 0%, #FFFFFF 35%, #E5E5E5 45%, #FFFFFF 55%, #FFFFFF 100%);

  /* ── Typography ── */
  --font-display:      'Space Grotesk', sans-serif;
  --font-body:         'Space Grotesk', sans-serif;
  --font-mono:         'Space Mono', monospace;

  /* ── Shopify Font Variable Overrides ── */
  --font-heading-family:    'Space Grotesk', sans-serif;
  --font-heading-weight:    700;
  --font-body-family:       'Space Grotesk', sans-serif;
  --font-body-weight:       400;
  --font-body--family:      'Space Grotesk', sans-serif;
  --font-body--weight:      400;
  --font-heading--family:   'Space Grotesk', sans-serif;
  --font-heading--weight:   700;
  --font-subheading--family:'Space Grotesk', sans-serif;
  --font-subheading--weight:500;
  --font-accent--family:    'Space Mono', monospace;
  --font-accent--weight:    400;

  /* ── Type Scale ── */
  --type-hero:    clamp(2.5rem, 6vw, 5rem);
  --type-h1:      clamp(2rem, 5vw, 3.5rem);
  --type-h2:      clamp(1.5rem, 3vw, 2.5rem);
  --type-h3:      clamp(1.1rem, 2vw, 1.5rem);
  --type-body:    clamp(0.875rem, 1.2vw, 1rem);
  --type-small:   0.75rem;
  --type-micro:   0.65rem;

  /* ── Motion ── */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-smooth:   cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-in-out:   cubic-bezier(0.76, 0, 0.24, 1);
}


/* ═══════════════════════════════════════════
   FLUID LAYOUT OVERRIDES
   Forces the theme containers to span 100% width
   ═══════════════════════════════════════════ */
:root {
  --narrow-page-width: 100% !important;
  --normal-page-width: 100% !important;
  --wide-page-width: 100% !important;
  --normal-content-width: 100% !important;
}

/* ═══════════════════════════════════════════
   3. GLOBAL BASE
   ═══════════════════════════════════════════ */

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--mg-white) !important;
  color: var(--mg-near-black) !important;
  font-family: var(--font-body) !important;
  font-size: var(--type-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Zero border-radius everywhere */
*,
*::before,
*::after {
  border-radius: 0 !important;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--mg-silver);
  border-radius: 0 !important;
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--mg-silver) transparent;
}

/* Selection */
::selection {
  background: var(--mg-black);
  color: var(--mg-white);
}

::-moz-selection {
  background: var(--mg-black);
  color: var(--mg-white);
}


/* ═══════════════════════════════════════════
   4. TYPOGRAPHY OVERRIDES
   ═══════════════════════════════════════════ */

/* Force Space Grotesk on all headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
[class*="type_preset--h"],
[class*="heading"],
.section-header__heading,
.title {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: -0.03em !important;
}

h1, .h1, [class*="type_preset--h1"] {
  font-size: var(--type-h1) !important;
  font-weight: 700 !important;
  line-height: 0.95 !important;
}

h2, .h2, [class*="type_preset--h2"] {
  font-size: var(--type-h2) !important;
  font-weight: 700 !important;
  line-height: 1.0 !important;
}

h3, .h3, [class*="type_preset--h3"] {
  font-size: var(--type-h3) !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
}

h4, .h4, h5, .h5, h6, .h6 {
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

/* Body text — Space Grotesk everywhere */
body, p, span, li, td, th, a, label, legend {
  font-family: var(--font-body) !important;
}

/* Product prices — Space Mono */
[class*="price"],
.price,
.product-card__price,
.product__price,
.cart-item__price,
.money {
  font-family: var(--font-mono) !important;
  font-weight: 400;
  letter-spacing: 0.02em;
}


/* ═══════════════════════════════════════════
   5. HERO SECTION — Dramatic Entrance
   ═══════════════════════════════════════════ */

.hero,
[class*="slideshow"],
[class*="banner"],
.shopify-section--hero {
  position: relative;
  overflow: hidden;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  background-color: var(--mg-white) !important;
}

/* Hero section container — force full bleed */
.shopify-section:has(.hero),
.shopify-section:has([class*="slideshow"]),
.shopify-section:has([class*="banner"]) {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.hero__container {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Hide Shopify default placeholder images in hero */
.hero .placeholder-svg,
.hero svg.placeholder-svg,
.hero img[src*="placeholder"],
.hero img[src*="lifestyle"],
.hero img[src*="apparel"],
.hero .hero__media-grid .placeholder-svg,
[class*="banner"] .placeholder-svg,
[class*="banner"] svg.placeholder-svg,
[class*="banner"] img[src*="placeholder"],
[class*="banner"] img[src*="lifestyle"] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Hero background when no image — clean canvas */
.hero [class*="media"]--empty {
  background-color: var(--mg-white) !important;
}

/* ── Full-Width Section Overrides ── */
.hero {
  position: relative;
  overflow: hidden;
  width: 100% !important;
  background-color: #FAFAFA !important;  /* Clean white page behind the boxed hero */
}

/* On mobile, full-bleed square image layout */
@media screen and (max-width: 749px) {
  .hero:not(.hero--split),
  .hero:not(.hero--split) .hero__container {
    height: 104vw !important;
    min-height: 0 !important;
  }
  .hero__media {
    object-fit: cover !important;
    object-position: center center !important;
  }
  .hero:not(.hero--split),
  .hero:not(.hero--split) .hero__container,
  .hero:not(.hero--split) .hero__media-grid {
    background-color: #36404A !important;
  }
}

/* Desktop: Full-bleed hero layout */
@media screen and (min-width: 750px) {
  .hero {
    padding: 0 !important;
  }

  /* The hero container with no borders */
  .hero__container {
    border: none !important;
    overflow: hidden !important;
    background-color: #36404A !important;
  }

  /* Image fills the box completely — no inner padding */
  .hero__media-grid {
    padding: 0 !important;
  }

  .hero__media {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* Full-bleed sections — marquee component */
marquee-component {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Center hero content wrapper contents for a balanced layout on mobile */
.hero__content-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 800px !important;
  margin: 0 auto !important;
  padding-top: 80px !important;
}

/* On desktop, align the copy and CTA to the bottom-left corner (Rhode style editorial placement) */
@media screen and (min-width: 750px) {
  .hero__content-wrapper {
    position: absolute !important;
    bottom: 60px !important;
    left: 60px !important;
    top: auto !important;
    right: auto !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    text-align: left !important;
    max-width: 450px !important;
    margin: 0 !important;
    padding-top: 0 !important;
    z-index: 10 !important;
  }

  .hero__content-wrapper > * {
    text-align: left !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
  }

  .hero__content-wrapper > *:last-child {
    margin-bottom: 0 !important;
  }

  .hero__content-wrapper h1,
  .hero__content-wrapper [class*="type_preset--h1"] {
    font-size: 2.5rem !important; /* Elegant editorial heading size */
    line-height: 1.0 !important;
    text-align: left !important;
    margin-bottom: 6px !important;
  }

  .hero__content-wrapper p {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 12px !important;
    line-height: 1.4 !important;
  }

  .hero__content-wrapper .button,
  .hero__content-wrapper a.button {
    margin-left: 0 !important;
    margin-right: auto !important;
    width: fit-content !important;
  }
}

/* ── Ultra-wide screen support (1440px+) ── */
@media (min-width: 1440px) {
  :root {
    --page-margin: 80px;
  }

  .hero h1,
  .hero [class*="type_preset--h1"] {
    font-size: clamp(3rem, 5vw, 5.5rem) !important;
  }
}

@media (min-width: 1920px) {
  :root {
    --page-margin: 120px;
  }
}

/* Hero heading — massive editorial with metallic shimmer */
@keyframes mg-textShimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.hero h1,
.hero [class*="type_preset--h1"],
[class*="banner"] h1,
[class*="slideshow"] h1 {
  font-size: var(--type-hero) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 0.92 !important;
  text-transform: uppercase;
  background: var(--mg-shimmer);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: mg-textShimmer 4s ease-in-out infinite;
}

/* Hero body text */
.hero p,
[class*="banner"] p {
  font-weight: 400 !important;
  letter-spacing: 0.05em;
  max-width: 480px;
  color: rgba(255, 255, 255, 0.7);
  font-size: clamp(0.7rem, 1vw, 0.85rem) !important;
}

/* Staggered hero entrance */
@keyframes mg-fadeUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero [class*="content-wrapper"] > *,
.hero [class*="content_wrapper"] > *,
[class*="banner__content"] > *,
[class*="slideshow__content"] > * {
  animation: mg-fadeUp 0.9s var(--ease-out-expo) both;
}

/* Title first */
.hero [class*="content-wrapper"] > *:nth-child(1),
.hero [class*="content_wrapper"] > *:nth-child(1),
[class*="banner__content"] > *:nth-child(1),
[class*="slideshow__content"] > *:nth-child(1) {
  animation-delay: 0.15s;
}

/* Subtitle second */
.hero [class*="content-wrapper"] > *:nth-child(2),
.hero [class*="content_wrapper"] > *:nth-child(2),
[class*="banner__content"] > *:nth-child(2),
[class*="slideshow__content"] > *:nth-child(2) {
  animation-delay: 0.35s;
}

/* CTA third */
.hero [class*="content-wrapper"] > *:nth-child(3),
.hero [class*="content_wrapper"] > *:nth-child(3),
[class*="banner__content"] > *:nth-child(3),
[class*="slideshow__content"] > *:nth-child(3) {
  animation-delay: 0.55s;
}

/* Fourth element stagger */
.hero [class*="content-wrapper"] > *:nth-child(4),
.hero [class*="content_wrapper"] > *:nth-child(4),
[class*="banner__content"] > *:nth-child(4),
[class*="slideshow__content"] > *:nth-child(4) {
  animation-delay: 0.75s;
}

/* Hero CTA button */
.hero .button,
.hero button[type="submit"],
[class*="banner"] .button {
  letter-spacing: 0.10em;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 0.75rem;
  padding: 1rem 2rem;
}


/* ═══════════════════════════════════════════
   6. MARQUEE — Continuous Scroll Strip
   ═══════════════════════════════════════════ */

/* Scoped to the theme's marquee section only — wildcard [class*="marquee"]
   previously ambushed any custom section with "marquee" in a class name */
marquee-component {
  border-top: 1px solid var(--mg-light-gray) !important;
  border-bottom: 1px solid var(--mg-light-gray) !important;
  overflow: hidden;
  white-space: nowrap;
}

marquee-component span,
marquee-component p {
  font-family: var(--font-display) !important;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  text-transform: uppercase;
  letter-spacing: 0.2em !important;
  color: var(--mg-near-black);
}


/* ═══════════════════════════════════════════
   7. PRODUCT CARDS — Collector Energy
   ═══════════════════════════════════════════ */

.product-card,
.card--product {
  background: var(--mg-white) !important;
  border: 1px solid var(--mg-light-gray) !important;
  border-radius: 0 !important;
  position: relative;
  overflow: hidden;
  transition: transform 0.4s var(--ease-out-expo),
              border-color 0.4s var(--ease-out-expo),
              box-shadow 0.4s var(--ease-out-expo) !important;
}

/* Prevent double borders from inner container */
.product-card .border-style,
.card--product .border-style {
  border: none !important;
}

/* Sleek, premium styling for the quick add button on cards */
.quick-add__button {
  background: var(--mg-white) !important;
  color: var(--mg-near-black) !important;
  border: 1px solid var(--mg-near-black) !important;
  width: var(--button-size-md) !important;
  height: var(--button-size-md) !important;
  padding: 0 !important;
  padding-block: 0 !important;
  padding-inline: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background-color 0.3s var(--ease-smooth),
              color 0.3s var(--ease-smooth),
              transform 0.3s var(--ease-smooth) !important;
}

.quick-add__button svg {
  width: var(--icon-size-sm) !important;
  height: var(--icon-size-sm) !important;
}

.quick-add__button svg path {
  stroke: var(--mg-near-black) !important;
}

.quick-add__button .add-to-cart-text__content {
  display: none !important;
}

.quick-add__button:hover {
  background: var(--mg-near-black) !important;
  color: var(--mg-white) !important;
  transform: scale(1.03) !important;
}

.quick-add__button:hover svg path {
  stroke: var(--mg-white) !important;
}

.quick-add__button .add-to-cart-text {
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}

/* Card hover — lift + border darken + shadow */
.product-card:hover,
.card--product:hover {
  transform: translateY(-4px);
  border-color: var(--mg-near-black) !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}

/* Card image container */
.product-card [class*="media"],
.product-card [class*="image"],
.product-card__media,
.card--product [class*="media"] {
  overflow: hidden;
  position: relative;
}

/* Image hover zoom */
.product-card img,
.card--product img {
  transition: transform 0.6s var(--ease-out-expo) !important;
  will-change: transform;
}

.product-card:hover img,
.card--product:hover img {
  transform: scale(1.04);
}

/* ── Holographic Shimmer — Signature Interaction ── */
.product-card [class*="media"]::after,
.product-card [class*="image"]::after,
.product-card__media::after,
.card--product [class*="media"]::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    105deg,
    transparent 0%,
    transparent 35%,
    rgba(255, 255, 255, 0.08) 40%,
    rgba(255, 255, 255, 0.20) 45%,
    rgba(255, 255, 255, 0.08) 50%,
    transparent 55%,
    transparent 100%
  );
  z-index: 2;
  pointer-events: none;
  transition: none;
}

@keyframes mg-holoSweep {
  0%   { left: -100%; }
  100% { left: 200%; }
}

.product-card:hover [class*="media"]::after,
.product-card:hover [class*="image"]::after,
.product-card:hover .product-card__media::after,
.product-card:hover [class*="media"]::after,
.card--product:hover [class*="media"]::after {
  animation: mg-holoSweep 0.8s var(--ease-out-expo) forwards;
}

/* Product title */
.product-card__title,
.product-card [class*="title"],
.card--product [class*="title"] {
  font-family: var(--font-display) !important;
  font-weight: 500 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase;
  letter-spacing: 0.05em !important;
  color: var(--mg-near-black);
}

/* Product price */
.product-card__price,
.product-card [class*="price"],
.card--product [class*="price"] {
  font-family: var(--font-mono) !important;
  font-weight: 400 !important;
  font-size: 0.85rem !important;
  color: var(--mg-near-black);
}


/* ═══════════════════════════════════════════
   8. CARD TILT EFFECT — 3D Perspective
   ═══════════════════════════════════════════ */

.card-tilt {
  perspective: 800px;
  transform-style: preserve-3d;
}

.card-tilt > * {
  transition: transform 0.4s var(--ease-out-expo);
  transform-style: preserve-3d;
  will-change: transform;
}

/* Hover glare overlay for tilt cards */
.card-tilt::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
    rgba(255, 255, 255, 0.15) 0%,
    transparent 60%
  );
  opacity: 0;
  transition: opacity 0.4s var(--ease-smooth);
  pointer-events: none;
  z-index: 3;
}

.card-tilt:hover::before {
  opacity: 1;
}


/* ═══════════════════════════════════════════
   9. BUTTONS — Sharp Editorial
   ═══════════════════════════════════════════ */

/* ── Primary Buttons ── */
.btn-primary,
.button:not(.button-unstyled):not(.quick-add__button):not(.cart-items__remove),
button[type="submit"],
[class*="button-solid"],
[class*="button--primary"],
.shopify-payment-button button,
.btn {
  background-color: var(--mg-near-black) !important;
  color: var(--mg-white) !important;
  border: 1px solid var(--mg-near-black) !important;
  border-radius: 0 !important;
  font-family: var(--font-display) !important;
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  padding: 1rem 2rem;
  cursor: pointer;
  transition: background-color 0.4s var(--ease-out-expo),
              transform 0.4s var(--ease-out-expo),
              box-shadow 0.4s var(--ease-out-expo) !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-primary:hover,
.button:not(.button-unstyled):not(.quick-add__button):not(.cart-items__remove):hover,
button[type="submit"]:hover,
[class*="button-solid"]:hover,
[class*="button--primary"]:hover,
.shopify-payment-button button:hover,
.btn:hover {
  background-color: var(--mg-dark-gray) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

.btn-primary:active,
.button:not(.button-unstyled):not(.quick-add__button):not(.cart-items__remove):active,
button[type="submit"]:active,
.btn:active {
  transform: translateY(0);
  box-shadow: none;
}

/* ── Ghost Buttons ── */
.btn-ghost,
[class*="button-outline"],
[class*="button--secondary"],
.button--secondary {
  background-color: transparent !important;
  color: var(--mg-near-black) !important;
  border: 1px solid var(--mg-near-black) !important;
  border-radius: 0 !important;
  font-family: var(--font-display) !important;
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  padding: 1rem 2rem;
  cursor: pointer;
  transition: background-color 0.4s var(--ease-out-expo),
              color 0.4s var(--ease-out-expo),
              transform 0.4s var(--ease-out-expo),
              box-shadow 0.4s var(--ease-out-expo) !important;
  text-decoration: none !important;
}

.btn-ghost:hover,
[class*="button-outline"]:hover,
[class*="button--secondary"]:hover,
.button--secondary:hover {
  background-color: var(--mg-near-black) !important;
  color: var(--mg-white) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

.btn-ghost:active,
[class*="button-outline"]:active,
[class*="button--secondary"]:active {
  transform: translateY(0);
  box-shadow: none;
}


/* ═══════════════════════════════════════════
   10. INPUTS — Minimal Bottom Border
   ═══════════════════════════════════════════ */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
input[type="url"],
textarea,
select,
.field__input {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--mg-light-gray) !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
  font-weight: 400;
  font-size: var(--type-body);
  color: var(--mg-near-black) !important;
  padding: 0.75rem 0 !important;
  transition: border-color 0.3s var(--ease-smooth) !important;
  outline: none !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus,
.field__input:focus {
  border-bottom-color: var(--mg-near-black) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Placeholder styling */
input::placeholder,
textarea::placeholder {
  color: var(--mg-mid-gray);
  font-family: var(--font-body) !important;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}


/* ═══════════════════════════════════════════
   11. BADGE SYSTEM — Rarity Energy
   ═══════════════════════════════════════════ */

/* Base badge styles */
[class*="badge"],
.badge {
  font-family: var(--font-display) !important;
  font-size: 0.6rem !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.15em !important;
  padding: 0.25rem 0.75rem !important;
  border-radius: 0 !important;
  line-height: 1.4;
  display: inline-block;
}

/* Pre-order badge */
.badge-preorder,
.badge--preorder {
  background-color: var(--mg-near-black) !important;
  color: var(--mg-white) !important;
  border: none !important;
}

/* Limited edition badge — pulse animation */
@keyframes mg-limitedPulse {
  0%, 100% { border-color: var(--mg-silver); }
  50%      { border-color: var(--mg-mid-gray); }
}

.badge-limited,
.badge--limited {
  background: transparent !important;
  color: var(--mg-near-black) !important;
  border: 1px solid var(--mg-silver) !important;
  animation: mg-limitedPulse 2s ease-in-out infinite;
}

/* Sold out badge */
.badge-sold-out,
.badge--sold-out,
[class*="badge"][class*="sold"] {
  background: transparent !important;
  color: var(--mg-mid-gray) !important;
  border: none !important;
  text-decoration: line-through;
}

/* New badge */
.badge-new,
.badge--new {
  background: transparent !important;
  color: var(--mg-near-black) !important;
  border: 1px solid var(--mg-near-black) !important;
}

/* Rare badge — gold shimmer sweep */
@keyframes mg-rareShimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.badge-rare,
.badge--rare {
  background: transparent !important;
  color: var(--mg-near-black) !important;
  border: 1px solid #B8860B !important;
  position: relative;
  overflow: hidden;
}

.badge-rare::after,
.badge--rare::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(184, 134, 11, 0.15) 40%,
    rgba(184, 134, 11, 0.3) 50%,
    rgba(184, 134, 11, 0.15) 60%,
    transparent 100%
  );
  animation: mg-holoSweep 3s ease-in-out infinite;
  pointer-events: none;
}


/* ═══════════════════════════════════════════
   12. DATA PLATE — Museum Placard Styling
   ═══════════════════════════════════════════ */

.data-plate,
.product-specs {
  border: 1px solid var(--mg-light-gray);
  padding: 1.5rem;
}

.data-plate__grid,
.product-specs__grid {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.75rem;
  align-items: baseline;
}

.data-plate__label,
.product-specs__label {
  font-family: var(--font-mono) !important;
  font-size: var(--type-micro);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--mg-mid-gray);
}

.data-plate__value,
.product-specs__value {
  font-family: var(--font-mono) !important;
  font-size: 0.8rem;
  font-weight: 400;
  color: var(--mg-near-black);
}

.data-plate__row,
.product-specs__row {
  display: contents;
}

.data-plate__row + .data-plate__row .data-plate__label,
.data-plate__row + .data-plate__row .data-plate__value,
.product-specs__row + .product-specs__row .product-specs__label,
.product-specs__row + .product-specs__row .product-specs__value {
  border-top: 1px dotted var(--mg-light-gray);
  padding-top: 0.75rem;
}


/* ═══════════════════════════════════════════
   13. VALUE PROPS — Three Column Grid
   ═══════════════════════════════════════════ */

.value-props,
[class*="multicolumn"] {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  position: relative;
}

.value-props__item,
[class*="multicolumn"] [class*="column"],
[class*="multicolumn"] li {
  text-align: center;
  padding: 2rem 1.5rem;
  position: relative;
}

/* Vertical dividers between columns */
.value-props__item + .value-props__item::before,
[class*="multicolumn"] [class*="column"] + [class*="column"]::before,
[class*="multicolumn"] li + li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 15%;
  height: 70%;
  width: 1px;
  background-color: var(--mg-light-gray);
}

.value-props__heading,
[class*="multicolumn"] h3 {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: var(--type-h3) !important;
  text-transform: uppercase;
  letter-spacing: -0.03em !important;
  margin-bottom: 0.5rem;
}

.value-props__description,
[class*="multicolumn"] p {
  color: var(--mg-mid-gray);
  font-size: var(--type-small);
  line-height: 1.5;
}


/* ═══════════════════════════════════════════
   14. COUNTDOWN TIMER
   ═══════════════════════════════════════════ */

.countdown {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.countdown__group {
  text-align: center;
  position: relative;
}

.countdown__number {
  font-family: var(--font-mono) !important;
  font-size: clamp(1.5rem, 4vw, 3rem);
  font-weight: 700;
  color: var(--mg-near-black);
  line-height: 1;
  letter-spacing: 0.05em;
  display: block;
  min-width: 2.5ch;
}

.countdown__separator {
  font-family: var(--font-mono) !important;
  font-size: clamp(1.5rem, 4vw, 3rem);
  color: var(--mg-silver);
  line-height: 1;
  padding: 0 0.25rem;
}

.countdown__label {
  font-family: var(--font-mono) !important;
  font-size: var(--type-micro);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--mg-mid-gray);
  margin-top: 0.5rem;
  display: block;
}

/* Seconds tick animation */
@keyframes mg-tick {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.5; }
}

.countdown__group--seconds .countdown__number {
  animation: mg-tick 1s steps(1) infinite;
}


/* ═══════════════════════════════════════════
   15. HEADER — Transparent → Solid on Scroll
   ═══════════════════════════════════════════ */

header,
.header,
.shopify-section-header,
#header-group,
[class*="header-section"],
.section-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: transparent !important;
  border-bottom: 1px solid transparent !important;
  transition: background-color 0.3s var(--ease-smooth),
              border-color 0.3s var(--ease-smooth),
              box-shadow 0.3s var(--ease-smooth) !important;
}

/* Scrolled state */
.header--scrolled,
header.scrolled,
.header.scrolled,
[class*="header"].is-sticky {
  background-color: var(--mg-white) !important;
  border-bottom: 1px solid var(--mg-light-gray) !important;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.03) !important;
}

/* Nav links */
header nav a,
.header nav a,
.header__nav a,
#header-group nav a,
[class*="header"] [class*="nav"] a {
  font-family: var(--font-display) !important;
  font-weight: 500;
  font-size: 0.7rem !important;
  text-transform: uppercase;
  letter-spacing: 0.10em !important;
  transition: opacity 0.3s var(--ease-smooth);
  text-decoration: none !important;
}

header nav a:hover,
.header nav a:hover,
.header__nav a:hover,
#header-group nav a:hover,
[class*="header"] [class*="nav"] a:hover {
  opacity: 0.5;
}

/* Wordmark / Logo text */
header [class*="logo"],
.header [class*="logo"],
.header__logo,
#header-group [class*="logo"] {
  font-family: var(--font-display) !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  letter-spacing: -0.03em !important;
  font-size: 1.1rem !important;
}


/* ═══════════════════════════════════════════
   16. FOOTER
   The footer is fully self-styled in sections/footer.liquid
   (.mg-footer). The legacy wildcard overrides for the old
   block-based footer were removed with the footer redesign.
   ═══════════════════════════════════════════ */


/* ═══════════════════════════════════════════
   17. SCROLL REVEAL ANIMATIONS
   ═══════════════════════════════════════════ */

.reveal,
.mg-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s var(--ease-out-expo),
              transform 0.8s var(--ease-out-expo);
}

.reveal--visible,
.mg-reveal.mg-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Support data-delay via custom property */
.reveal[data-delay="100"]  { transition-delay: 0.1s; }
.reveal[data-delay="200"]  { transition-delay: 0.2s; }
.reveal[data-delay="300"]  { transition-delay: 0.3s; }
.reveal[data-delay="400"]  { transition-delay: 0.4s; }
.reveal[data-delay="500"]  { transition-delay: 0.5s; }
.reveal[data-delay="600"]  { transition-delay: 0.6s; }
.reveal[data-delay="700"]  { transition-delay: 0.7s; }
.reveal[data-delay="800"]  { transition-delay: 0.8s; }

/* Staggered children reveals (product grids, etc.) */
.mg-reveal-children > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s var(--ease-out-expo),
              transform 0.6s var(--ease-out-expo);
}

.mg-reveal-children.mg-visible > *:nth-child(1) { transition-delay: 0s; }
.mg-reveal-children.mg-visible > *:nth-child(2) { transition-delay: 0.08s; }
.mg-reveal-children.mg-visible > *:nth-child(3) { transition-delay: 0.16s; }
.mg-reveal-children.mg-visible > *:nth-child(4) { transition-delay: 0.24s; }
.mg-reveal-children.mg-visible > *:nth-child(5) { transition-delay: 0.32s; }
.mg-reveal-children.mg-visible > *:nth-child(6) { transition-delay: 0.40s; }
.mg-reveal-children.mg-visible > *:nth-child(7) { transition-delay: 0.48s; }
.mg-reveal-children.mg-visible > *:nth-child(8) { transition-delay: 0.56s; }

.mg-reveal-children.mg-visible > * {
  opacity: 1;
  transform: translateY(0);
}


/* ═══════════════════════════════════════════
   18. PAGE ENTRY ANIMATION
   ═══════════════════════════════════════════ */

@keyframes pageEntry {
  from { opacity: 0.5; }
  to   { opacity: 1; }
}

main,
#MainContent,
[role="main"] {
  animation: pageEntry 0.6s var(--ease-smooth) both;
}


/* ═══════════════════════════════════════════
   19. COLLECTION GRID — Consistent Spacing
   ═══════════════════════════════════════════ */

[class*="product-grid"],
[class*="collection-product-list"],
.collection .grid,
[class*="product-list"] .grid {
  column-gap: 16px !important;
  row-gap: 24px !important;
}

/* All collection cards inherit product card styling */
[class*="collection-card"],
[class*="collection-list"] [class*="card"] {
  border-radius: 0 !important;
  overflow: hidden;
  border: 1px solid var(--mg-light-gray);
  transition: transform 0.4s var(--ease-out-expo),
              border-color 0.4s var(--ease-out-expo),
              box-shadow 0.4s var(--ease-out-expo);
}

/* Prevent double borders from inner container */
[class*="collection-card"] .border-style,
[class*="collection-list"] [class*="card"] .border-style {
  border: none !important;
}

[class*="collection-card"]:hover,
[class*="collection-list"] [class*="card"]:hover {
  transform: translateY(-4px);
  border-color: var(--mg-near-black);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}

[class*="collection-card"] img {
  transition: transform 0.8s var(--ease-out-expo) !important;
}

[class*="collection-card"]:hover img {
  transform: scale(1.04);
}


/* ═══════════════════════════════════════════
   20. MEDIA SECTIONS — Image Hover Zoom
   ═══════════════════════════════════════════ */

[class*="media-with-content"] img,
[class*="media-with-content"] video,
[class*="image-with-text"] img,
[class*="image-with-text"] video {
  transition: transform 1s var(--ease-out-expo) !important;
}

[class*="media-with-content"]:hover img,
[class*="media-with-content"]:hover video,
[class*="image-with-text"]:hover img,
[class*="image-with-text"]:hover video {
  transform: scale(1.03);
}

/* Section heading sizes */
[class*="product-list"] h2,
[class*="collection-list"] h2,
.section-header h2 {
  font-size: var(--type-h2) !important;
  margin-bottom: 2rem;
}


/* ═══════════════════════════════════════════
   21. CART DRAWER / QUICK ADD — Dark Overlay
   ═══════════════════════════════════════════ */

/* Overlay backdrop */
[class*="cart-drawer"]::before,
[class*="drawer"]::before,
.cart-drawer-overlay {
  background: rgba(0, 0, 0, 0.4) !important;
}

/* Drawer panel */
[class*="cart-drawer"],
[class*="theme-drawer"],
[class*="drawer__inner"],
.cart-drawer {
  background: var(--mg-white) !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
}

/* Drawer headings */
[class*="cart-drawer"] h2,
[class*="cart-drawer"] h3,
.cart-drawer h2,
.cart-drawer h3 {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: -0.03em !important;
}

/* Drawer item prices */
[class*="cart-drawer"] [class*="price"],
.cart-drawer [class*="price"] {
  font-family: var(--font-mono) !important;
}

/* Drawer buttons */
[class*="cart-drawer"] .button:not(.cart-items__remove),
[class*="cart-drawer"] button[type="submit"],
.cart-drawer .button:not(.cart-items__remove) {
  background: var(--mg-near-black) !important;
  color: var(--mg-white) !important;
  border-radius: 0 !important;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  font-weight: 600;
}

/* Quick add modal */
[class*="quick-add-modal"],
[class*="search-modal"] {
  border-radius: 0 !important;
  background: var(--mg-white) !important;
}


/* ═══════════════════════════════════════════
   22. LINKS — Animated Underline Effect
   ═══════════════════════════════════════════ */

.link-animated,
a.link {
  position: relative;
  text-decoration: none !important;
  display: inline-block;
}

.link-animated::after,
a.link::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s var(--ease-out-expo);
}

.link-animated:hover::after,
a.link:hover::after {
  transform: scaleX(1);
}


/* ═══════════════════════════════════════════
   23. MOBILE RESPONSIVE — Full Breakpoint System
   ═══════════════════════════════════════════ */

/* ── 1440px+ — Large screens, constrain widths ── */
@media (min-width: 1440px) {
  .page-width,
  .container,
  [class*="page-width"] {
    max-width: 100% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ── Up to 1024px — Intermediate ── */
@media (max-width: 1024px) {
  .value-props,
  [class*="multicolumn"] {
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
  }

  .hero h1,
  .hero [class*="type_preset--h1"],
  [class*="banner"] h1 {
    font-size: clamp(2.5rem, 8vw, 5rem) !important;
  }
}

/* ── Up to 768px — Tablet ── */
@media (max-width: 768px) {
  .value-props,
  [class*="multicolumn"] {
    grid-template-columns: 1fr;
  }

  /* Remove vertical dividers on mobile */
  .value-props__item + .value-props__item::before,
  [class*="multicolumn"] [class*="column"] + [class*="column"]::before,
  [class*="multicolumn"] li + li::before {
    display: none;
  }

  .value-props__item,
  [class*="multicolumn"] [class*="column"],
  [class*="multicolumn"] li {
    padding: 1.5rem 1rem;
    border-bottom: 1px solid var(--mg-light-gray);
  }

  .hero h1,
  .hero [class*="type_preset--h1"],
  [class*="banner"] h1 {
    font-size: clamp(2rem, 10vw, 3.5rem) !important;
    letter-spacing: -0.03em !important;
  }

  [class*="product-list"] h2,
  [class*="collection-list"] h2,
  .section-header h2 {
    font-size: clamp(1.2rem, 5vw, 1.8rem) !important;
  }

  /* Reduce card hover effect on tablets */
  .product-card:hover,
  .card--product:hover {
    transform: translateY(-2px);
  }

  /* Countdown responsive */
  .countdown__number {
    font-size: clamp(1.2rem, 6vw, 2rem);
  }
}

/* ── Up to 640px — Mobile ── */
@media (max-width: 640px) {
  [class*="slideshow"],
  [class*="banner"] {
    min-height: 80vh;
    min-height: 80dvh;
  }

  .hero h1,
  .hero [class*="type_preset--h1"],
  [class*="banner"] h1 {
    font-size: clamp(1.8rem, 12vw, 3rem) !important;
  }

  .hero p,
  [class*="banner"] p {
    font-size: 0.85rem !important;
    max-width: 100%;
  }

  /* Stack collection grid */
  [class*="product-grid"],
  [class*="collection-product-list"],
  .collection .grid {
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: 10px !important;
    row-gap: 16px !important;
  }

  /* Simplify button sizing */
  .btn-primary,
  .btn-ghost,
  .button:not(.button-unstyled):not(.quick-add__button):not(.cart-items__remove),
  button[type="submit"] {
    padding: 0.8rem 1.5rem;
    font-size: 0.7rem;
  }

  /* Simplify animations on mobile */
  .hero [class*="content-wrapper"] > *,
  .hero [class*="content_wrapper"] > *,
  [class*="banner__content"] > *,
  [class*="slideshow__content"] > * {
    animation-duration: 0.6s;
  }

  /* Data plate stack on mobile */
  .data-plate__grid,
  .product-specs__grid {
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }
}

/* ── Touch devices — Remove tilt and hover lifts ── */
@media (hover: none) {
  .card-tilt {
    perspective: none;
    transform-style: flat;
  }

  .card-tilt > * {
    transform: none !important;
    transition: none !important;
  }

  .card-tilt::before {
    display: none;
  }

  .product-card:hover,
  .card--product:hover {
    transform: none;
    box-shadow: none;
  }

  /* Disable holo shimmer on touch */
  .product-card:hover [class*="media"]::after,
  .product-card:hover [class*="image"]::after,
  .product-card:hover .product-card__media::after,
  .product-card:hover [class*="media"]::after,
  .card--product:hover [class*="media"]::after {
    animation: none;
  }
}





/* ═══════════════════════════════════════════
   24. REDUCED MOTION — Accessibility
   ═══════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal,
  .mg-reveal {
    opacity: 1;
    transform: none;
  }

  .mg-reveal-children > * {
    opacity: 1;
    transform: none;
  }

  .hero h1,
  .hero [class*="type_preset--h1"],
  [class*="banner"] h1 {
    animation: none !important;
    background: none !important;
    -webkit-text-fill-color: var(--mg-near-black) !important;
    color: var(--mg-near-black) !important;
  }

  .badge-limited,
  .badge--limited {
    animation: none !important;
  }

  .badge-rare::after,
  .badge--rare::after {
    animation: none !important;
  }

  .countdown__group--seconds .countdown__number {
    animation: none !important;
  }
}


/* ═══════════════════════════════════════════
   25. EDITORIAL POLISH — Final Details
   ═══════════════════════════════════════════ */

/* All images — sharp edges */
img {
  border-radius: 0 !important;
}

/* All cards — sharp edges */
[class*="card"] {
  border-radius: 0 !important;
}

/* All modals, drawers, popovers — sharp */
[class*="modal"],
[class*="drawer"],
[class*="popover"],
[class*="dropdown"] {
  border-radius: 0 !important;
}

/* Dividers */
hr, [class*="divider"] {
  border-color: var(--mg-glass-border);
}

/* Shopify section spacing consistency */
.shopify-section {
  position: relative;
}

/* Hide Shopify branding / powered-by if visible */
.shopify-policy__title {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: -0.03em;
}

/* Quantity selectors */
[class*="quantity"] input {
  font-family: var(--font-mono) !important;
  font-size: 0.85rem;
}

/* Product page — variant selectors */
[class*="variant"] label,
[class*="option"] label {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  font-size: var(--type-micro);
  letter-spacing: 0.10em;
  font-weight: 600;
}

/* Breadcrumbs */
[class*="breadcrumb"] {
  font-size: var(--type-micro) !important;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  font-family: var(--font-display) !important;
}

/* Pagination */
[class*="pagination"] a,
[class*="pagination"] span {
  font-family: var(--font-mono) !important;
  font-size: var(--type-small);
}

/* Announcement bar */
[class*="announcement"],
.announcement-bar {
  font-family: var(--font-display) !important;
  font-size: 0.65rem !important;
  text-transform: uppercase;
  letter-spacing: 0.10em !important;
  font-weight: 500;
}

/* Force product page & card images to fill their containers on desktop */
.product-media__image,
.product-media-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}


/* ═══════════════════════════════════════════
   26. CART PAGE — Editorial checkout flow
   ═══════════════════════════════════════════ */

/* ── Title row — big display heading + square count chip ── */
.cart-page .cart-title h1 {
  font-family: var(--font-display) !important;
  font-size: clamp(2rem, 4vw, 3.5rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  text-transform: uppercase;
  line-height: 1.0;
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
}

.cart-page .cart-title .cart-bubble {
  width: auto;
  min-width: 24px;
  height: 24px;
  aspect-ratio: auto;
  border-radius: 0;
  align-self: center;
}

.cart-page .cart-title .cart-bubble__background {
  background-color: var(--mg-near-black);
  border-radius: 0;
}

.cart-page .cart-title .cart-bubble__text {
  font-family: var(--font-mono) !important;
  font-size: 0.7rem;
  color: var(--mg-white);
}

/* ── Line items — bordered editorial rows ── */
.cart-page .cart-items__table-row {
  border-bottom: 1px solid var(--mg-light-gray);
}

.cart-page .cart-items__media-container {
  background-color: var(--mg-off-white);
  border: 1px solid var(--mg-light-gray);
}

.cart-page .cart-items__title {
  font-family: var(--font-display) !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase;
  line-height: 1.4;
}

.cart-page .cart-items__title a {
  text-decoration: none !important;
  color: var(--mg-near-black);
  transition: opacity 0.3s ease;
}

.cart-page .cart-items__title a:hover {
  opacity: 0.6;
}

.cart-page .cart-items__variants,
.cart-page .cart-items__properties {
  font-family: var(--font-mono) !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mg-mid-gray);
}

.cart-page .cart-items__price,
.cart-page .cart-items__price-unit,
.cart-page .price-per-item,
.cart-page .compare-at-price {
  font-family: var(--font-mono) !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.02em;
  color: var(--mg-near-black);
}

/* ── Quantity stepper — sharp 1px frame, mono digits ── */
.cart-page .quantity-selector {
  border: 1px solid var(--mg-light-gray) !important;
  border-radius: 0 !important;
  background: var(--mg-white) !important;
  transition: border-color 0.3s ease;
}

.cart-page .quantity-selector:hover,
.cart-page .quantity-selector:focus-within {
  border-color: var(--mg-near-black) !important;
}

.cart-page .quantity-selector input {
  font-family: var(--font-mono) !important;
  font-size: 0.85rem !important;
}

.cart-page .quantity-selector .button {
  color: var(--mg-near-black);
}

/* Remove (trash) button — quiet until hover */
.cart-page .cart-items__remove {
  color: var(--mg-mid-gray) !important;
  transition: color 0.3s ease;
}

.cart-page .cart-items__remove:hover {
  color: var(--mg-near-black) !important;
}

/* ── Summary column — bordered panel, editorial totals ── */
.cart-page .cart-summary {
  border-left: 1px solid var(--mg-light-gray) !important;
  border-radius: 0 !important;
  background: var(--mg-white);
}

.cart-page .cart-note__label,
.cart-page .cart-discount__label,
.cart-page .cart-totals__original-label {
  font-family: var(--font-display) !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase;
  color: var(--mg-near-black);
}

.cart-page .cart-totals__total-label {
  font-family: var(--font-display) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase;
}

.cart-page .cart-totals__total-value {
  font-family: var(--font-mono) !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em;
}

.cart-page .cart-totals__tax-note,
.cart-page .cart-totals__tax-note small {
  font-family: var(--font-mono) !important;
  font-size: 0.6rem !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mg-mid-gray);
}

/* Discount input — bottom-border-only, matches theme inputs */
.cart-page .cart-discount__input {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--mg-light-gray) !important;
  border-radius: 0 !important;
  font-family: var(--font-body, 'Space Grotesk', sans-serif) !important;
  transition: border-color 0.3s ease !important;
}

.cart-page .cart-discount__input:focus {
  border-bottom-color: var(--mg-near-black) !important;
  outline: none !important;
  box-shadow: none !important;
}

.cart-page .cart-discount__pill {
  border-radius: 0;
  font-family: var(--font-mono) !important;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
}

/* ── Checkout CTA — solid black, tracked uppercase ── */
.cart-page .cart__checkout-button {
  font-family: var(--font-display) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase;
  background-color: var(--mg-near-black) !important;
  color: var(--mg-white) !important;
  border: 1px solid var(--mg-near-black) !important;
  border-radius: 0 !important;
  transition: background-color 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cart-page .cart__checkout-button:hover {
  background-color: var(--mg-dark-gray) !important;
}

/* ── "You may also like" — match section heading system ── */
.section-resource-list__header h2,
.section-resource-list__header h3 {
  font-family: var(--font-display) !important;
  font-size: clamp(1.2rem, 2.5vw, 2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  text-transform: uppercase !important;
  margin: 0;
}

.section-resource-list__header a {
  font-family: var(--font-display) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase;
}

/* ── Recommendation product cards — uniform editorial cards ── */
.resource-list .product-card {
  border: 1px solid var(--mg-light-gray) !important;
  background: var(--mg-white);
}

.resource-list .product-card:hover {
  border-color: var(--mg-near-black) !important;
}

/* Media zone — consistent off-white stage for box art */
.resource-list .product-card .product-media-container,
.resource-list .product-card [class*="gallery"] {
  background-color: var(--mg-off-white);
}

.resource-list .product-card .product-media-container img {
  object-fit: contain !important;
}

/* Text zone — aligned rows under uniform media */
.resource-list .product-card .product-card__content,
.resource-list .product-card > :not([class*="gallery"]):not([class*="media"]) {
  padding-inline: 14px;
}

.resource-list .product-card p,
.resource-list .product-card a {
  text-decoration: none !important;
}

.resource-list .product-card [class*="title"],
.resource-list .product-card [class*="title"] a,
.resource-list .product-card p a {
  font-family: var(--font-display) !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase;
  line-height: 1.5 !important;
  color: var(--mg-near-black);
}

.resource-list .product-card [class*="price"] {
  font-family: var(--font-mono) !important;
  font-size: 0.8rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em;
  color: var(--mg-near-black);
  padding-bottom: 14px;
}

/* ── Mobile ── */
@media (max-width: 749px) {
  .cart-page .cart-summary {
    border-left: none !important;
    border-top: 1px solid var(--mg-light-gray) !important;
  }
}