/* ============================================================
   REFINE.CSS — minimal / premium pass (loads after premium.css)
   Pass 1: tokens, header, hero, brand line, new arrivals, footer.

   Rules of this layer
   · One ink, one off-white, one muted grey, one hairline.
   · Type does the work: weights 400 / 500 only, tight tracking on headings.
   · No shadows on chrome. 1px hairlines instead.
   · Motion 200–400ms on --ease-out; gentle 16px reveals.
   · Touch targets are at least 44px.
   ============================================================ */

/* ── Tokens ──────────────────────────────────────────────────── */
:root {
  --clr-ink: #151514;
  --clr-bg: #FBFAF8;
  --clr-paper: #FBFAF8;
  --clr-surface: #F3F2EF;
  --clr-surface-light: #F3F2EF;
  --clr-surface-2: #ECEBE7;
  --clr-text: #171716;
  --clr-text-dark: #171716;
  --clr-text-muted: #6B6A66;
  --clr-accent: #171716;
  --clr-accent-dim: #3A3A38;
  --clr-line: rgba(23, 23, 22, 0.1);
  --clr-border: rgba(23, 23, 22, 0.1);
  --clr-border-light: rgba(23, 23, 22, 0.06);

  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --nav-height: 64px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);

  /* Shape scale: 2px controls (buttons, inputs) · 4px media (product images).
     Circles are reserved for icon-only hit areas and count badges. */
  --r-1: 2px;
  --r-2: 4px;

  /* Type: Inter for UI + body, Instrument Serif for headlines only */
  --font-serif: 'Instrument Serif', 'Times New Roman', Georgia, serif;
}
@media (min-width: 769px) {
  :root { --nav-height: 72px; }
}

body { background-color: var(--clr-bg); color: var(--clr-text); }
::selection { background: var(--clr-ink); color: var(--clr-bg); }
.container { padding-inline: var(--gutter); }

/* Homepage wrappers were hard-coded to pure white */
.products-section,
#new-arrivals,
.grvmd-homepage .site-content,
.grvmd-homepage #main-content,
.grvmd-homepage #page {
  background-color: var(--clr-bg) !important;
  background: var(--clr-bg) !important;
  color: var(--clr-text) !important;
}

/* Reveal: a quiet 16px rise instead of 40px */
.reveal {
  transform: translateY(16px);
  transition: opacity 0.9s var(--ease-out), transform 0.9s var(--ease-out);
}
.reveal.is-visible { transform: translateY(0); }

/* ── Header ──────────────────────────────────────────────────── */
.grvmd-nav,
.grvmd-nav.scrolled {
  background: rgba(251, 250, 248, 0.88) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: none !important;
  border-bottom: 1px solid var(--clr-line) !important;
  transition: background 0.4s var(--ease-out), border-color 0.4s var(--ease-out), top 0.4s var(--ease-out),
    transform 0.5s var(--ease-out), opacity 0.4s var(--ease-out);
}

.grvmd-nav .grvmd-nav-inner { padding-inline: calc(var(--gutter) - 12px) !important; }

.grvmd-nav-logo:hover { opacity: 0.7; transform: translate(-50%, -50%); }

/* Actions: no divider, no boxed hover, 44px targets, lighter strokes */
.grvmd-nav-actions { padding-left: 0; gap: 0; }
.grvmd-nav-actions::before { display: none; }

.grvmd-nav-icon-btn,
.grvmd-hamburger {
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: var(--clr-text);
  align-items: center;
  justify-content: center;
  transition: background 0.3s var(--ease-out), color 0.3s var(--ease-out);
}
.grvmd-nav-icon-btn:hover,
.grvmd-hamburger:hover {
  background: rgba(23, 23, 22, 0.05);
  transform: none;
}
.grvmd-nav-icon-btn svg {
  width: 20px !important;
  height: 20px !important;
  stroke-width: 1.5;
}
.grvmd-nav-icon-btn:hover svg { stroke: currentColor; }

.grvmd-hamburger { gap: 5px; }
.grvmd-hamburger span {
  transition: background-color 0.4s var(--ease-out), transform 0.3s var(--ease-out), opacity 0.2s;
  width: 18px !important;
  height: 1.5px !important;
  border-radius: 1px;
  background: var(--clr-text);
}
.grvmd-hamburger:hover span { background: var(--clr-text); }
.grvmd-hamburger.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.grvmd-hamburger.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* Count badges: one style, ink on off-white ring */
.grvmd-cart-count,
.grvmd-wishlist-count {
  top: 7px !important;
  right: 5px !important;
  width: 16px !important;
  height: 16px !important;
  font-size: 0.625rem !important;
  font-weight: 500 !important;
  background: var(--clr-ink) !important;
  color: var(--clr-bg) !important;
  box-shadow: 0 0 0 2px var(--clr-bg) !important;
}
/* Wishlist count is red, matching the saved heart */
.grvmd-wishlist-count {
  background: #ef4444 !important;
  color: #fff !important;
}

/* ── Hero ────────────────────────────────────────────────────── */
.hero {
  align-items: flex-end;
  height: 100svh;
  min-height: 560px;
  padding-block: 0 clamp(2.5rem, 8vh, 5rem);
}
.hero-overlay {
  background: linear-gradient(180deg,
    rgba(21, 21, 20, 0.34) 0%,
    rgba(21, 21, 20, 0) 24%,
    rgba(21, 21, 20, 0) 52%,
    rgba(21, 21, 20, 0.5) 100%) !important;
}
.hero-content { max-width: none; }

/* CTA: one quiet text link with a hairline underline */
.hero .hero-cta-group,
.hero-cta-group { flex-direction: row; align-items: center; }
.hero .hero-cta-group .btn-primary#hero-shop-btn {
  width: auto;
  min-height: 44px;
  justify-content: flex-start;
  gap: 0.75rem;
  padding: 0.75rem 0 !important;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  color: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.55) !important;
  border-radius: 0;
  transition: border-color 0.3s var(--ease-out), opacity 0.3s var(--ease-out);
}
.hero .hero-cta-group .btn-primary#hero-shop-btn:hover {
  border-bottom-color: #fff !important;
  opacity: 1;
}
.hero .hero-cta-group .btn-primary#hero-shop-btn svg {
  flex: none;
  transition: transform 0.3s var(--ease-out);
}
.hero .hero-cta-group .btn-primary#hero-shop-btn:hover svg { transform: translateX(4px); }

/* ── Brand line ──────────────────────────────────────────────── */
.brand-strip {
  height: auto;
  background: var(--clr-bg);
  color: var(--clr-text);
  padding-block: clamp(2.5rem, 6vw, 4rem) 0;
}
.brand-strip__title { height: auto; gap: clamp(1.25rem, 3vw, 2.5rem); }
.brand-strip__lead {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  color: var(--clr-text-muted);
}
.brand-strip__word {
  font-size: clamp(0.9375rem, 2.4vw, 1.125rem);
  font-weight: 500;
  letter-spacing: 0.22em;
  margin-right: -0.22em;
  color: var(--clr-text);
}
.brand-strip__rule { width: clamp(2rem, 6vw, 4.5rem); background: rgba(23, 23, 22, 0.2); }
.brand-strip__icon { border: 0; width: auto; height: auto; color: var(--clr-text-muted); }
.brand-strip__icon svg { display: block; }
@media (max-width: 720px) {
  .brand-strip { padding-block: 2.25rem 0; }
  .brand-strip__title { gap: 0.6rem; }
  .brand-strip__icon { color: var(--clr-text-muted); }
}

/* ── New arrivals ────────────────────────────────────────────── */
#new-arrivals.products-section {
  padding-top: clamp(1.5rem, 3.5vw, 2.5rem) !important;
  padding-bottom: clamp(4rem, 9vw, 7rem) !important;
}
#new-arrivals .section-header {
  flex-direction: row;
  align-items: baseline !important;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem) !important;
}
#new-arrivals .section-title,
#arrivals-heading {
  font-family: var(--font-serif) !important;
  font-size: clamp(2.25rem, 5vw, 3.5rem);
  font-weight: 400 !important;
  line-height: 1.02;
  letter-spacing: -0.015em !important;
}
.section-link {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 0.9375rem;
  font-weight: 400;
  color: var(--clr-text);
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 100% 1px;
  background-position: 0 calc(50% + 0.75em);
  background-repeat: no-repeat;
  transition: color 0.3s var(--ease-out), background-size 0.4s var(--ease-out);
}
.section-link:hover { color: var(--clr-text-muted); }

/* Grid rhythm */
.products-grid {
  column-gap: 1.5rem;
  row-gap: clamp(2.5rem, 4vw, 3.5rem);
}
@media (max-width: 768px) {
  .products-grid {
    column-gap: 0.75rem !important;
    row-gap: 2rem !important;
  }
}

/* Cards: warm surface, quiet type, price recedes */
.product-card__media { background: var(--clr-surface); border-radius: var(--r-2); }
.product-card .product-card__name,
.product-card .product-card__name a {
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--clr-text);
}
.product-card .product-card__price { color: var(--clr-text-muted); }
@media (max-width: 768px) {
  .product-card .product-card__name,
  .product-card .product-card__name a { font-size: 0.875rem; }
  .product-card .product-card__price { font-size: 0.8125rem; }
}

/* Touch screens: no hover, so nothing may depend on it.
   · Wishlist heart is always visible, no backing (40px target).
   · Quick-add and image arrows are dropped — the card links to the product
     page, and the image strip still swipes. */
@media (hover: none), (pointer: coarse) {
  .product-card .product-card__wishlist {
    top: 0.5rem !important;
    right: 0.5rem !important;
    width: 40px !important;
    height: 40px !important;
  }
  .product-card .product-card__wishlist:not(.is-active) {
    opacity: 1;
    color: var(--clr-ink) !important;
  }
  .product-card .product-card__quick-add,
  .product-card .product-card__arrow { display: none !important; }
}

/* ── Footer ──────────────────────────────────────────────────── */
.gf {
  background: var(--clr-ink);
  border-radius: 24px 24px 0 0;
  padding: clamp(4rem, 9vw, 6rem) var(--gutter) 2rem;
  margin-top: 0;
}
.gf :where(a, button, input):focus-visible { outline-color: #fff; }

.gf .gf__logo-img { width: clamp(120px, 16vw, 160px); }
.gf__logo::after { display: none; }

.gf__news { margin: clamp(2.5rem, 6vw, 3.5rem) auto clamp(3rem, 7vw, 4.5rem); }
.gf .gf__news-title {
  font-size: clamp(1.25rem, 3.5vw, 1.5rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  margin-bottom: 1.25rem;
}
.gf .gf__field input.gf__input[type="email"] {
  border-color: rgba(255, 255, 255, 0.2) !important;
  transition: border-color 0.3s var(--ease-out), background 0.3s var(--ease-out);
}
.gf .gf__field input.gf__input[type="email"]:hover { border-color: rgba(255, 255, 255, 0.4) !important; }
.gf .gf__field input.gf__input[type="email"]:focus { border-color: rgba(255, 255, 255, 0.7) !important; background: transparent !important; }
.gf .gf__field input.gf__input[type="email"]:-webkit-autofill { box-shadow: 0 0 0 1000px var(--clr-ink) inset !important; }
/* Input and button are the same height (56px, 52px on mobile): pin both to the top of the
   row so any extra height in the field wrapper can't push the button off-line. */
.gf__form { align-items: flex-start; }
.gf .gf__field { display: flex; }
.gf .gf__submit { transition: transform 0.3s var(--ease-out), background 0.3s var(--ease-out); }
.gf .gf__submit:hover:not(:disabled) { background: rgba(255, 255, 255, 0.85); }

.gf__cols { border-top-color: rgba(255, 255, 255, 0.1); padding-top: clamp(2.25rem, 5vw, 3rem); }
.gf__col { gap: 0.15rem; }
.gf .gf__col-title {
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 0.75rem;
}
.gf__col a {
  font-size: 0.9375rem;
  font-weight: 400;
  padding-block: 0.4rem;
  color: rgba(255, 255, 255, 0.78);
  background-position: 0 calc(100% - 0.3rem);
  transition: color 0.3s var(--ease-out), background-size 0.4s var(--ease-out);
}
.gf__copy {
  margin-top: clamp(3rem, 7vw, 4.5rem);
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  color: rgba(255, 255, 255, 0.5);
}

@media (max-width: 700px) {
  .gf { border-radius: 20px 20px 0 0; }
  .gf .gf__logo-img { width: 120px; }
}

/* ── Header layout: [menu] · logo · [wishlist · cart · profile] ──
   Three-column grid with equal outer columns, so the logo is truly centred
   and can never collide with the icons (it used to be absolutely positioned). */
.grvmd-nav .grvmd-nav-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  column-gap: 0.5rem;
}
.grvmd-nav .grvmd-hamburger { justify-self: start; }
.grvmd-nav .grvmd-nav-logo {
  position: static !important;
  transform: none !important;
  justify-self: center;
  margin: 0 !important;
}
.grvmd-nav .grvmd-nav-actions {
  justify-self: end;
  margin-left: 0 !important;
  align-items: center;
}
/* Every icon button is the same box with the glyph dead-centre */
.grvmd-nav-actions > .grvmd-nav-icon-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: none;
}

/* ── Mobile header (beats the older 32px-button overrides) ───── */
@media screen and (max-width: 768px) {
  .grvmd-nav .grvmd-nav-inner { padding-inline: calc(var(--gutter) - 12px) !important; }
  .grvmd-hamburger,
  .grvmd-nav-icon-btn {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
  }
  .grvmd-hamburger span { width: 18px !important; height: 1.5px !important; }
  .grvmd-nav-icon-btn svg { width: 20px !important; height: 20px !important; }
  .grvmd-nav-actions { gap: 0 !important; }
  .grvmd-cart-count,
  .grvmd-wishlist-count {
    top: 7px !important;
    right: 5px !important;
    width: 16px !important;
    height: 16px !important;
    font-size: 0.625rem !important;
  }

  /* Hero: content sits at the bottom-left, same gutter as everything else */
  .hero {
    height: 100svh;
    min-height: 560px;
    padding-block: 0 clamp(2.5rem, 8vh, 4rem);
  }
  .hero-cta-group { flex-direction: row; align-items: center; }
  .hero-cta-group .btn { width: auto; justify-content: flex-start; }

  /* Section header stays on one baseline: title left, link right */
  #new-arrivals .section-header {
    flex-direction: row;
    align-items: baseline !important;
    gap: 1rem;
  }
}

/* Very narrow phones: 40px targets keep all three icons clear of the logo */
@media screen and (max-width: 380px) {
  .grvmd-nav .grvmd-nav-inner { padding-inline: calc(var(--gutter) - 10px) !important; column-gap: 0.25rem; }
  .grvmd-hamburger,
  .grvmd-nav-icon-btn { width: 40px !important; height: 40px !important; }
  .grvmd-nav-logo .grvmd-nav-logo__img { height: 22px; }
  .grvmd-cart-count,
  .grvmd-wishlist-count { top: 5px !important; right: 3px !important; }
}

/* ── Hero video ──────────────────────────────────────────────── */
.hero-bg .hero-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
}

/* ── Homepage overscroll ─────────────────────────────────────────
   Pulling past the top (macOS / iOS rubber-band) drags the page down and
   exposes the canvas between the fixed header and the hero. Stop the bounce,
   and back the canvas with the same dark as the hero and footer so that if a
   browser still bounces, nothing light shows through. */
html:has(body.grvmd-homepage) {
  overscroll-behavior-y: none;
  background-color: var(--clr-ink);
}

/* ── Homepage header ─────────────────────────────────────────────
   At the very top: no bar, no logo, no menu — only the wishlist, cart and
   profile icons float over the hero, transparent, in white.
   After a small scroll (~20px, toggled by main.js) the full solid header
   slides in. Same trigger as bluorng.com. */
.grvmd-homepage .grvmd-nav:not(.scrolled) {
  background: transparent !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-bottom-color: transparent !important;
}

/* Logo stays out of sight (still focusable for keyboard users) */
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-nav-logo {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: none;
}
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-nav-logo:focus-visible {
  opacity: 1 !important;
  pointer-events: auto !important;
}
.grvmd-nav-logo { transition: opacity 0.4s var(--ease-out); }

/* Menu button stays visible (layout.css hid it until scrolled) — white lines, no backing */
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-hamburger {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none;
}
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-hamburger span {
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-hamburger:hover { background: rgba(255, 255, 255, 0.14); }
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-hamburger:hover span { background: #fff; }

/* Icons stay visible (layout.css hid them until scrolled) — white, no backing */
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-nav-actions {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none;
}
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-nav-icon-btn { color: #fff; }
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-nav-icon-btn:hover { background: rgba(255, 255, 255, 0.14); }
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-nav-icon-btn svg { filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4)); }
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-cart-count {
  background: #fff !important;
  color: var(--clr-ink) !important;
  box-shadow: none !important;
}
.grvmd-homepage .grvmd-nav:not(.scrolled) .grvmd-wishlist-count {
  background: #ef4444 !important;
  color: #fff !important;
  box-shadow: none !important;
}
.grvmd-nav-icon-btn { transition: background 0.3s var(--ease-out), color 0.4s var(--ease-out); }

/* Homepage: the hero starts at the very top of the page.
   layout.css gave these wrappers var(--space-xl) of top padding, which the old
   always-visible header used to cover. With the header hidden it showed as a
   blank band above the video. */
.grvmd-homepage #main-content,
.grvmd-homepage .site-content,
.grvmd-homepage #page,
body.grvmd-homepage.ast-page-builder-template .site-content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Hero CTA: centred horizontally at the bottom of the video */
.hero .hero-content { display: flex; justify-content: center; }
.hero .hero-cta-group { justify-content: center; }
.hero .hero-cta-group .btn-primary#hero-shop-btn { justify-content: center; }

/* ── Smooth scroll (Lenis) ───────────────────────────────────────
   Lenis adds .lenis to <html>. Native smooth scrolling must be off while it
   runs, or the two fight and scrolling feels rubbery. */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-scrolling iframe { pointer-events: none; }

/* ── One button system, one icon style ───────────────────────────
   Two buttons only:
   · Primary   — solid ink, 2px corners, no lift, no glow.
   · Text link — hairline underline (hero CTA, "View all").
   Icons are inline SVG, 1.5 stroke, currentColor. */
.btn {
  border-radius: var(--r-1);
}
.btn:hover,
.btn:active { transform: none; }
.btn-primary:hover { box-shadow: none; }

.ui-icon { flex: none; }

/* Card image arrows (desktop hover) — SVG chevrons */
.product-card__arrow svg {
  display: block;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.55));
  transition: transform 0.2s ease;
}
.product-card__arrow--prev:hover svg { transform: translateX(-2px); }
.product-card__arrow--next:hover svg { transform: translateX(2px); }

/* ── Quick add: "+" button in the title row, in front of the product name ── */
.product-card__title-row { gap: 0.5rem; justify-content: space-between; }
.product-card .product-card__title-row .product-card__quick-add {
  position: static !important;
  flex: none;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  margin: 0;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--clr-ink, #0a0a0a) !important;
  opacity: 1 !important;
  transform: none;
  cursor: pointer;
  transition: color 0.2s ease;
}
.product-card .product-card__title-row .product-card__quick-add:hover {
  background: transparent !important;
  color: #666 !important;
  transform: none;
}
.product-card .product-card__title-row .product-card__quick-add .product-card__quick-add-icon {
  width: 1.25rem;
  height: 1.25rem;
  filter: none;
}
/* Always available on touch too (the image-overlay version was hidden there) */
@media (hover: none), (pointer: coarse) {
  .product-card .product-card__title-row .product-card__quick-add { display: inline-flex !important; }
}

.product-card__title-row .product-card__quick-add.is-loading { opacity: 0.45 !important; cursor: progress; }

/* Saved state of the card bookmark: solid ink instead of the old heart's red */
.product-card__wishlist.is-active,
.product-card__wishlist.is-active .product-card__wishlist-icon,
.product-card__wishlist.is-active:hover { color: var(--clr-ink, #0a0a0a) !important; }
.product-card__wishlist.is-active .product-card__wishlist-icon { fill: currentColor; }

/* Cart drawer header: wordmark a touch smaller than the site-header logo
   (24px desktop / 21px mobile, light-weight artwork), with a small bag icon and count centred on it. */
.grvmd-cart-drawer .grvmd-cart-drawer__brand { gap: 0.7rem; align-items: center; }
.grvmd-cart-drawer .grvmd-cart-drawer__bag { width: 16px; height: 16px; display: block; flex: none; }
.grvmd-cart-drawer .grvmd-cart-drawer__wordmark { display: block; height: 24px; width: auto; max-width: none; flex: none; }
.grvmd-cart-drawer .grvmd-cart-drawer__count { min-width: 20px; height: 20px; padding: 0 0.35rem; font-size: 0.68rem; line-height: 1; }
.grvmd-cart-drawer .grvmd-cart-drawer__head { padding-block: 1rem; }
@media (max-width: 768px) {
  .grvmd-cart-drawer .grvmd-cart-drawer__wordmark { height: 21px; }
}

/* Cart drawer: lighter price weight */
.grvmd-cart-drawer .grvmd-mc__price,
.grvmd-cart-drawer .grvmd-mc__price .woocommerce-Price-amount,
.grvmd-cart-drawer .grvmd-mc__price bdi { font-weight: 500; }
.grvmd-cart-drawer .grvmd-mc__total-value,
.grvmd-cart-drawer .grvmd-mc__total-value .woocommerce-Price-amount,
.grvmd-cart-drawer .grvmd-mc__total-value bdi { font-weight: 500; }

/* Cart drawer line item: name + price block centred against the thumbnail */
.grvmd-cart-drawer .grvmd-mc__item { align-items: center; }
.grvmd-cart-drawer .grvmd-mc__info { justify-content: center; align-self: stretch; gap: 0.35rem; }
.grvmd-cart-drawer .grvmd-mc__row { margin-top: 0; padding-top: 0.4rem; align-items: center; }
.grvmd-cart-drawer .grvmd-mc__qty { align-self: center; }

/* Cart drawer quantity: no pill / button backgrounds — just − 1 + */
.grvmd-cart-drawer .grvmd-mc__qty { background: transparent; padding: 0; gap: 0.15rem; }
.grvmd-cart-drawer .grvmd-mc__step,
.grvmd-cart-drawer .grvmd-mc__step:focus,
.grvmd-cart-drawer .grvmd-mc__step:hover,
.grvmd-cart-drawer .grvmd-mc__step:active { background: transparent; box-shadow: none; }
.grvmd-cart-drawer .grvmd-mc__step svg,
.grvmd-cart-drawer .grvmd-mc__step:hover svg { stroke: var(--clr-ink); transition: opacity 0.2s ease; }
@media (hover: hover) {
  .grvmd-cart-drawer .grvmd-mc__step:hover svg { stroke: var(--clr-ink); opacity: 0.55; }
}

/* Cart drawer: estimated total at regular weight */
.grvmd-cart-drawer .grvmd-mc__total-value,
.grvmd-cart-drawer .grvmd-mc__total-value .woocommerce-Price-amount,
.grvmd-cart-drawer .grvmd-mc__total-value .woocommerce-Price-amount bdi,
.grvmd-cart-drawer .grvmd-mc__total-value bdi,
.grvmd-cart-drawer .grvmd-mc__total-value strong { font-weight: 400; }