/** Shopify CDN: Minification failed

Line 3466:0 Unexpected "}"
Line 3694:0 Unexpected "}"
Line 7686:45 Expected identifier but found whitespace
Line 11799:11 Expected identifier but found whitespace
Line 11799:12 Unexpected "0"

**/
/* ===========================================================
   WLG v3.01 • Designer Edition
   File: wlg-dev-main.css
   Brand: The Wild Luxe Gallery
   ===========================================================
   Color Palette — Established Aug 7, 2025
   -----------------------------------------------------------
   Primary:
     Cedar Green: #3A4942
     Natural Sienna: #834E2C
     Primary Stone: #EDE6DC
   Secondary:
     Ink Charcoal: #484A47
     Rosewood Umber: #5E110B
     Orcher Wood: #B7A998
   Accent:
     Golden Tisane: #C78830
     Accent Moss: #A5AF8F
     Cornflower: #778D89
   Typography:
     Headings:  Athelas Regular & Bold
     Body:      Helvetica LT Pro Regular & Italic
   =========================================================== */

/* ─────────────────────────────────────────────────────────────
   1. ROOT VARIABLES
   ───────────────────────────────────────────────────────────── */

:root {
  /* Brand Colors */
  --cedar-green: #3A4942;
  --natural-sienna: #834E2C;
  --primary-stone: #EDE6DC;
  --ink-charcoal: #484A47;
  --rosewood-umber: #5E110B;
  --orcher-wood: #B7A998;
  --golden-tisane: #C78830;
  --accent-moss: #A5AF8F;
  --cornflower-blue: #778D89;

  /* Typography */
  --font-heading: "Athelas", "Georgia", "Times New Roman", serif;
  --font-body: "Helvetica LT Pro", "Helvetica Neue", "Helvetica", "Arial", sans-serif;

  /* Layout */
  --radius: 4px;
  --max-width: 1400px;
  --gutter: 24px;
  --gutter-m: 16px;
}

/* Dark mode safeguard */
@media (prefers-color-scheme: dark) {
  body {
    background-color: var(--cedar-green);
    color: var(--primary-stone);
  }
}

/*─────────────────────────────────────────────
🪶 WILD LUXE GALLERY • TYPOGRAPHY SYSTEM
Clean unified heading/body structure
─────────────────────────────────────────────*/

/* ========== FONT VARIABLES ========== */
:root {
  --font-heading: "Athelas", serif;
  --font-body: "Helvetica LT Pro", sans-serif;

  /* Brand weights */
  --weight-heading-regular: 400;
  --weight-heading-medium: 500;
  --weight-heading-bold: 600;
  --weight-body-regular: 400;
  --weight-body-bold: 500;
}

/* ========== GLOBAL DEFAULTS ========== */
body,
html {
  font-family: var(--font-body);
  font-weight: var(--weight-body-regular);
  line-height: 1.6;
  color: var(--ink-charcoal, #292723);
}

/* Reset any stray overrides */
[class*="--font-heading-sans"],
[class*="--font-heading-serif"],
[class*="--font-heading-alt"] {
  font-family: var(--font-heading) !important;
}

/* ========== HEADINGS ========== */
h1,
h2,
h3,
h4,
h5,
h6,
.hero-label,
.collection-title,
.product-title,
.section-title,
.modal-title {
  font-family: var(--font-heading);
  color: var(--ink-charcoal, #292723);
  font-weight: var(--weight-heading-medium);
  letter-spacing: 0.02em;
  text-rendering: optimizeLegibility;
}

/* Individual hierarchy */
h1,
.hero-label {
  font-size: clamp(2.6rem, 5vw, 3.2rem);
  font-weight: var(--weight-heading-bold);
  line-height: 1.2;
}

h2,
.collection-title {
  font-size: clamp(2rem, 3vw, 2.6rem);
  line-height: 1.25;
}

h3,
.product-title,
.section-title {
  font-size: clamp(1.6rem, 2.5vw, 2rem);
  line-height: 1.3;
}

h4 {
  font-size: 1.4rem;
}

h5,
h6 {
  font-size: 1.2rem;
  letter-spacing: 0.03em;
}

/* Ensure consistent Athelas heading weights across hero sections */
.hero-label,
.collection-title,
.section-title {
  font-family: var(--font-heading);
  font-weight: 500; /* moderate elegance — not too thin or too heavy */
}

/* Optional: specifically tone down H1 in Gary’s hero if over-bold */
.hero-label strong,
.hero-label h1 {
  font-weight: 500 !important;
}


/* ========== BODY & SUPPORT TEXT ========== */
p,
li,
span,
small,
figcaption,
.modal-body,
.button,
input,
textarea,
select,
label {
  font-family: var(--font-body);
  font-weight: var(--weight-body-regular);
  color: var(--ink-charcoal, #292723);
}

strong,
b {
  font-weight: var(--weight-body-bold);
}

/* ========== BUTTONS & INTERACTIVES ========== */
button,
.btn,
.shopify-payment-button__button {
  font-family: var(--font-body);
  font-weight: var(--weight-body-bold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ========== UTILITIES ========== */
.uppercase-heading {
  font-family: var(--font-heading);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* ========== HERO OVERLAYS / COLLECTION HEADERS ========== */
.hero-label,
.hero-subtitle {
  font-family: var(--font-heading);
  color: var(--stone-ivory, #EDE6DC);
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
}

/* ========== DARK MODE GUARD ========== */
@media (prefers-color-scheme: dark) {
  body {
    background-color: #1C1C1A;
    color: #EDE6DC;
  }

  h1, h2, h3, h4, h5, h6,
  .hero-label, .collection-title, .product-title {
    color: #EDE6DC;
  }
}

/* ─────────────────────────────────────────────────────────────
   3. LAYOUT FOUNDATIONS
   ───────────────────────────────────────────────────────────── */

:where(.page-width, .container, .wrapper, .section__inner) {
  max-width: var(--max-width);
  margin-inline: auto;
  padding-inline: var(--gutter);
  box-sizing: border-box;
}

@media (max-width: 749px) {
  :where(.page-width, .container, .wrapper, .section__inner) {
    padding-inline: var(--gutter-m) !important;
  }
}

.wlg-full-bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}


/* ─────────────────────────────────────────────────────────────
   4. HEADER & ANNOUNCEMENT BAR
   (Header is intentionally non-sticky in this phase)
   ───────────────────────────────────────────────────────────── */

.header {
  position: relative;
  width: 100%;
  background: #ffffff;
  color: var(--ink-charcoal);
  transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 0.75rem;
  padding-inline: var(--gutter);
}

/* Announcement bar sits visually above header, white with Natural Sienna text */
.announcement-bar {
  background: #ffffff;
  color: var(--natural-sienna);
  font-family: var(--font-body);
  text-align: center;
  padding: 0.5rem 1rem;
  border-bottom: 4px solid var(--primary-stone);
}

@media (max-width: 749px) {
  .announcement-bar {
    font-size: 0.9rem;
    line-height: 1.4;
  }
}


/* ─────────────────────────────────────────────────────────────
   5. BUTTONS
   (Golden Tisane is the primary action color)
   ───────────────────────────────────────────────────────────── */

.wlg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.6rem 1.2rem;
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
}

/* Primary / Add to Cart */
.wlg-btn--cart {
  background-color: var(--golden-tisane);
  color: #ffffff;
  border-color: var(--golden-tisane);
}
.wlg-btn--cart:hover {
  background-color: #D6B36C;
  color: var(--cedar-green);
}
/* Clear Selections on dark backgrounds */
.wlg-btn--clear {
  background-color: transparent;
  color: #ffffff;
  border: 1px solid #ffffff;
}
.wlg-btn--clear:hover {
  background-color: rgba(255,255,255,0.1);
}

/* Framing Guide / neutral-to-warm supporting action */
.wlg-btn--guide {
  background-color: var(--orcher-wood);
  color: var(--cedar-green);
}
.wlg-btn--guide:hover {
  background-color: var(--accent-moss);
}

/* See It in Your Room / cool utility action */
.wlg-btn--room {
  background-color: var(--cornflower-blue);
  color: #ffffff;
}
.wlg-btn--room:hover {
  background-color: #5e6f77;
}

/* Prevent logo flash scaling on navigation */
.site-header__logo img {
  max-width: 180px;
  height: auto;
  opacity: 0;
  transition: opacity 0.4s ease;
}

body.loaded .site-header__logo img {
  opacity: 1;
}



/* ─────────────────────────────────────────────────────────────
   6. COLLECTION GRIDS / GARY’S GALLERY
   (Square aspect, hover scale, editorial overlay)
   ───────────────────────────────────────────────────────────── */

.template--collection-framed-fine-art-photography {
  background: var(--cedar-green) !important;
}

/* ───────────────
   Wild Luxe Intro Watermark
   ─────────────── */
.section-intro {
  position: relative;
  text-align: center;
  padding: 60px 0 40px;
  overflow: hidden;
}

/* ========== OPTION A: Cropped / Editorial Mark ========== */
.section-intro::before {
  content: "";
  position: absolute;
  top: 52%;
  left: 50%;
  width: 220px;       /* tightly cropped proportions */
  height: 220px;
  background-image: url('/cdn/shop/files/WildLuxe_Logo_Icon_Stone_Ivory-1.png?v=1759883207');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transform: translate(-50%, -50%);
  opacity: 0.07;
  pointer-events: none;
  z-index: 0;
  animation: fadeInWatermark 2.8s ease-out;
}


@keyframes fadeInWatermark {
  from { opacity: 0; transform: translate(-50%, -48%) scale(0.98); }
  to { opacity: 0.08; transform: translate(-50%, -50%) scale(1); }
}

.section-intro .intro-content {
  position: relative;
  z-index: 1; /* ensure text sits above watermark */
}

.golden-divider {
  width: 0;
  height: 1px;
  margin: 1rem auto 2rem auto;
  background-color: #D6B36C;
  transition: width 1.4s ease-out;
  opacity: 0.8;
}

.golden-divider.animate {
  width: 80px; /* adjust to taste */
}

/* Responsive grid container */
.template--collection-framed-fine-art-photography .product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.25rem;
  justify-content: center;
  padding: 2rem;
}

/* Individual card frame */
.template--collection-framed-fine-art-photography .card-wrapper {
  aspect-ratio: 1 / 1;
  background: var(--cedar-green);
  border: 1px solid var(--primary-stone);
  overflow: hidden;
  position: relative;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.template--collection-framed-fine-art-photography .card-wrapper:hover {
  transform: scale(1.02);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

/* The art itself */
.template--collection-framed-fine-art-photography .card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Title under the card */
.template--collection-framed-fine-art-photography .card__heading {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 600;
  color: var(--primary-stone);
  text-align: center;
  margin-top: 0.75rem;
}

/* Price under title */
.template--collection-framed-fine-art-photography .price {
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--golden-tisane);
  text-align: center;
}

/* Hover overlay used for editorial reveal */
.card__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.card-wrapper:hover .card__overlay {
  opacity: 1;
}

.card__overlay h3 {
  color: #ffffff;
  font-family: var(--font-heading);
  font-size: 1rem;
  text-align: center;
  padding: 0 1rem;
}

.masonry-item .hover-container {
  position: relative;
  overflow: hidden;
}

.masonry-item img {
  transition: transform 0.6s ease, filter 0.6s ease;
}

.masonry-item:hover img {
  transform: scale(1.02);
  filter: brightness(1.05);
}

/* Temp Debug Start */

.masonry-item::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(214, 179, 108, 0.35); /* golden lichen glow */
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
}

.masonry-item:hover::after {
  opacity: 1;
}

/* Museum neutral wash for Gary’s gallery backdrop */
.collection-grid-section.framed-photo-gallery {
  position: relative;
  background: linear-gradient(
    to bottom,
    rgba(237,230,220,0.94) 0%,
    rgba(232,224,215,0.96) 100%
  );
  padding-bottom: 4rem;
}

/* Return button styling — match David’s section */
.collection-grid-section.framed-photo-gallery .back-link {
  display: inline-block;
  background: var(--golden-tisane);
  color:  #ffffff !important;
  font-family: 'Helvetica LT Pro', sans-serif;
  font-weight: 500;
  padding: 0.65rem 1.25rem;
  border-radius: 6px;
  border: 1px solid: #b07a2a;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.03em;
  transition: all .25s ease;
}

.collection-grid-section.framed-photo-gallery .back-link:hover {
  background: #b07a2a;
  border-color: #8d6221;
  transform: translateY(-1px);
}

/* Watermark refined — subtle, soft, present */
.gallery-watermark {
  position: fixed;
  top: 26vh;
  left: 50%;
  transform: translateX(-50%);
  width: 92vh;
  max-width: 560px;
  height: 60vh;
  background: url('/cdn/shop/files/watermark_sienna_2048px_opacity12.png?v=1759466747')
    no-repeat center/contain;

  /* Visibility behavior */
  opacity: 0;                    /* Start invisible */
  filter: brightness(1.04);      /* Gentle warmth */
  pointer-events: none;
  z-index: 0;

  animation: watermarkFade 2.4s ease 0.8s forwards;
}

@media (max-width: 768px) {
  .gallery-watermark {
    width: 72vw;
    top: 22vh;
  }
}

/* Fade to a controlled final opacity */
@keyframes watermarkFade {
  0% {
    opacity: 0;
    transform: translate(-50%, -25%) scale(1.05);
  }
  100% {
    opacity: 0.32;               /* <- Option 3 final value */
    transform: translate(-50%, -25%) scale(1);
  }
}

/* Temp Debug */

/* ─────────────────────────────────────────────────────────────
   7. WILD LUXE COUTURE BADGES
   (Gold plaque + Platinum variant)
   ───────────────────────────────────────────────────────────── */

.wlg-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

/* Gold badge / default */
.wlg-badge {
  font-family: var(--font-heading);
  font-weight: 700;
  color: #262626;
  background: linear-gradient(
    180deg, #EAD8B0 0%, #D6B36C 50%, #C6A155 100%);
  border: 1px solid rgba(198, 161, 85, 0.9);
  border-radius: 999px;
  padding: 0.45rem 1rem;
  font-size: 0.9rem;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.35),
    inset 0 -1px 0 rgba(0,0,0,0.06),
    0 1px 2px rgba(0,0,0,0.08);
  transition: transform 0.15s ease;
}

.wlg-badge:hover {
  transform: translateY(-1px);
}

/* Platinum badge variant */
.wlg-badges--platinum .wlg-badge {
  background: linear-gradient(
    180deg, #F2F3F5 0%, #D7DBE0 50%, #C5CBD3 100%);
  border-color: rgba(150,160,175,0.9);
}


/* ─────────────────────────────────────────────────────────────
   8. UTILITIES & COLOR HELPERS
   ───────────────────────────────────────────────────────────── */

.bg-cedar        { background-color: var(--cedar-green); }
.bg-stone        { background-color: var(--primary-stone); }

.text-stone      { color: var(--primary-stone); }
.text-tisane     { color: var(--golden-tisane); }
.text-cedar      { color: var(--cedar-green); }
.text-sienna     { color: var(--natural-sienna); }

.wlg-divider {
  width: 40px;
  height: 2px;
  background-color: var(--golden-tisane);
  margin: 1.5rem auto;
}


/* ─────────────────────────────────────────────────────────────
   9. DARK MODE POLISH
   (ensure Cedar/Stone still read well)
   ───────────────────────────────────────────────────────────── */

@media (prefers-color-scheme: dark) {
  .template--collection-framed-fine-art-photography .card-wrapper {
    border-color: #d6d2c9;
  }

  .template--collection-framed-fine-art-photography .card__heading {
    color: #f5f3ee;
  }
}

/* WLG Header – Force Cart & Account Icon Visibility */
  .header-actions__action svg,
  .header-actions__action svg path {
    fill: currentColor !important;
    stroke: currentColor !important;
    color: #EDE6DC !important; /* Stone Ivory */
    opacity: 1 !important;
  }

  /* Remove the "donut mask" that can hide the icon */
  .header-actions__cart-icon svg {
    mask: none !important;
    -webkit-mask: none !important;
  }

  .header-actions__action:hover svg {
    color: #C78830 !important;
    fill: #C78830 !important;
  }

  /* ════════════════════════════════════════════════════════════════════
   Wild Luxe Gallery • Header Icon Visibility Patch (Intent-Safe)
   --------------------------------------------------------------------
   Context:
   Shopify’s <cart-icon> and <account-popover-component> elements set
   aria-hidden="true" on their SVG wrappers to silence screen readers
   until hydration. Some base CSS (from Heritage) hides [aria-hidden="true"]
   visually, making the icons disappear even though they’re functional.
   --------------------------------------------------------------------
   Intent:
   Restore Shopify’s intended always-visible UI while preserving the
   accessibility attribute for assistive technologies.
   Do NOT remove aria-hidden; only neutralize its display effects.
   --------------------------------------------------------------------
   Last reviewed: 2025-10-25
   Owner: The Wild Luxe Gallery – Header System
   ════════════════════════════════════════════════════════════════════ */

/* 1. Neutralize unwanted hiding of aria-hidden SVG wrappers */
.header-actions [aria-hidden="true"].svg-wrapper {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* 2. Ensure both icons render in brand tone (Stone Ivory) */
.header-actions .svg-wrapper svg,
.header-actions .svg-wrapper svg path {
  fill: currentColor !important;
  stroke: currentColor !important;
  color: #EDE6DC !important; /* Stone Ivory */
  width: 24px;
  height: 24px;
  opacity: 1 !important;
}

/* 3. Remove Shopify’s “donut mask” that hides the cart icon when empty */
.header-actions .header-actions__cart-icon svg {
  mask: none !important;
  -webkit-mask: none !important;
}

/* 4. Keep alignment and click area consistent */
.header-actions .header-actions__action,
.header-actions .header-actions__cart-icon {
  overflow: visible !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 5. Optional hover accent: Golden Tisane */
.header-actions .header-actions__action:hover svg {
  color: #C78830 !important;
  fill: #C78830 !important;
}

/* ——— WLG Header: Force account icon visible ——— */
.account-button_icon[aria-hidden="true"],
.account-actions_icon[aria-hidden="true"] {
  opacity: 1 !important;
  visibility: visible !important;
}

.account-button_icon svg,
.account-actions_icon svg {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.5;
}

.account-button[aria-haspopup="dialog"] {
  display: inline-flex !important;
}

/* ——— WLG Header Icon Geometry ——— */
.header__icon-account {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-left: 0.75rem;
  margin-right: 0.75rem;
  color: var(--color-header-icons, currentColor);
  text-decoration: none;
}

/* SVG sizing and outline style */
.header__icon-account svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
}

/* Hover outline color — match your golden highlight */
.header__icon-account:hover svg {
  stroke: var(--golden-tisane, #C78830);
}



/* End — Header Icon Visibility Patch */

/* ─────────────────────────────────────────────
   Wild Luxe Gallery • Header Icon Refinement
   Outline Style for Cart & Account Icons
────────────────────────────────────────────── */
.header-actions .svg-wrapper svg,
.header-actions .svg-wrapper svg path {
  fill: none !important;               /* remove solid fill */
  stroke: #EDE6DC !important;          /* Stone Ivory outline */
  stroke-width: 1.25 !important;
  vector-effect: non-scaling-stroke;   /* keeps crisp outline */
}

.header-actions .header-actions__action:hover svg path {
  stroke: #C78830 !important;          /* Golden Tisane hover accent */
  fill: none !important;
}

/* ─────────────────────────────────────────────
   Wild Luxe Gallery • Search Icon Outline Style
────────────────────────────────────────────── */
.header-actions [data-icon="search"] svg,
.header-actions svg.icon--search,
.header-actions .search-modal__button svg {
  fill: none !important;               /* remove the blob fill */
  stroke: #EDE6DC !important;          /* Stone Ivory outline */
  stroke-width: 1.25 !important;
  vector-effect: non-scaling-stroke;
  transition: stroke 0.25s ease;
}

.header-actions [data-icon="search"]:hover svg,
.header-actions svg.icon--search:hover,
.header-actions .search-modal__button:hover svg {
  stroke: #C78830 !important;          /* Golden Tisane on hover */
  fill: none !important;
}

/* Base icon geometry */
.header__icon,
.header__icon-account,
.header__icon-search {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0 0.75rem;
  color: var(--color-header-icons, #EDE6DC); /* Stone Ivory by default */
  text-decoration: none;
}

/* Unified SVG look: outline only */
.header__icon svg,
.header__icon-account svg,
.header__icon-search svg {
  width: 22px;
  height: 22px;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.5;
  transition: stroke 0.2s ease;
}

/* Hover behavior — same as cart */
.header__icon:hover svg,
.header__icon-account:hover svg,
.header__icon-search:hover svg {
  stroke: var(--golden-tisane, #C78830);
}

/* ——— WLG Header: Search Icon Outline ——— */
.search-modal__button svg {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.5;
  width: 22px;
  height: 22px;
  transition: stroke 0.2s ease;
}

/* Match hover behavior to cart + account */
.search-modal__button:hover svg {
  stroke: var(--golden-tisane, #C78830);
}

/* ===============================
   WLG Unified Artist Hero System
   =============================== */

.artist-hero-secondary__content {
  max-width: 900px;
  gap: 0.6rem;
  padding-top: 50vh;
  padding-left: 20px;
  position: relative;
  z-index: 2;
}

/* Supertitle — emotional statement */
.artist-hero-secondary__supertitle {
  font-family: 'Athelas', serif;
  font-size: clamp(2.0rem, 3.2vw, 2.75rem);
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: 0.02em;
  color: #EDE6DC;
  opacity: 0.98;
  margin-bottom: 0.15rem;
  text-shadow: 0 2px 6px rgba(0,0,0,0.35);
}

/* Artist name — supporting role */
.artist-hero-secondary__title {
  font-family: 'Helvetica LT Pro', sans-serif;
  font-size: clamp(1.5rem, 1.9vw, 2.25rem);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.15;
  color: rgba(255,255,255,0.94);
  margin-bottom: 0.25rem;
  text-shadow: 0 4px 8px rgba(0,0,0,0.28);
}

/* Subtext — narrative */
.artist-hero-secondary__subtext {
  font-family: 'Helvetica LT Pro', sans-serif;
  font-size:clamp(1rem,2vw,1.2rem);
  font-weight: 500;
  line-height: 1.45;
  max-width: 60ch;
  color: #EDE6DC;
  text-shadow: 0 1px 4px rgba(0,0,0,0.35);
  margin-bottom: 1.75rem;
}

/* White text varnish pop */
.artist-hero-secondary__supertitle,
.artist-hero-secondary__subtext {
  text-shadow:
    0 2px 6px rgba(0,0,0,0.38),
    0 0 18px rgba(255,255,255,0.06);
}

/* CTA Row */
.artist-hero-secondary__ctas {
  display: flex;
  gap: 1rem;
}

/* Solid CTA */
.artist-hero-secondary__ctas .wlg-btn {
  background: var(--golden-tisane);
  color:  #ffffff;
  padding: 0.75rem 1.6rem;
  font-size: 0.95rem;
  text-transform: uppercase;
  border-radius: 4px;
  border: 1px solid var(--golden-tisane);
  transition: all 0.2s ease;
}
.artist-hero-secondary__ctas .wlg-btn:hover {
  background: #D6B36C;
  color: var(--cedar-green);
}

/* Ghost CTA */
.artist-hero-secondary__ctas .wlg-btn--clear {
  background: #3A4942;
  color: #ffffff;
  border: 0px solid rgba(255,255,255,0.75);
}
.artist-hero-secondary__ctas .wlg-btn--clear:hover {
  background: rgba(255,255,255,0.12);
  color: #ffffff;
  border-color: rgba(255,255,255,0.9);
}

/* Upgraded gold button */
.artist-hero-secondary__ctas .wlg-btn {
  background: rgba(214,178,108,0.95);
  border-color: rgba(214,178,108,1);
}

.artist-hero-secondary__ctas .wlg-btn:hover {
  background: rgba(214,178,108,1);
  color: var(--cedar-green);
}

/* Forest ghost button refinement */
.artist-hero-secondary__ctas .wlg-btn--clear {
  border-color: rgba(214,178,108,0.85);
  color: rgba(255,255,255,0.92);
}


/* === Fine polish for Artist Hero balance === */

/* Slight lift of content block */
.artist-hero-secondary__content {
  padding-top: 9vh;
}

/* Buttons polish */
.artist-hero-secondary__ctas .wlg-btn,
.artist-hero-secondary__ctas .wlg-btn--clear {
  font-size: 1.02rem;
  font-weight: 500;
  padding: 0.78rem 1.85rem;
}

/* ——— WLG Museum Lighting Pass ——— */

.artist-hero-secondary__content {
  position: relative;
  z-index: 4;
  padding-top: 14vh;
  padding-left: clamp(2rem, 6vw, 10rem);
  max-width: 60ch;
}

/* Subtle “museum wash” behind text (barely visible) */
.artist-hero-secondary__content::before {
  content:"";
  position:absolute;
  inset: -8vh -12vw -8vh -8vw;
  background: radial-gradient(
    circle at 18% 40%,
    rgba(255,255,255,0.03) 0%,
    rgba(255,255,255,0.035) 32%,
    rgba(255,255,255,0.0) 70%
  );
  pointer-events: none;
  z-index:-1;
  filter: blur(28px);
}

/* Supertitle — Ivory with archival warmth */
.artist-hero-secondary__supertitle {
  font-family: 'Athelas', serif;
  font-size: clamp(2.6rem, 2.8vw, 3.4rem);
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #EDE6DC; /* Warm ivory */
  margin-bottom: .35rem;
  text-shadow:
    0 1px 3px rgba(0,0,0,.22),
    0 0 14px rgba(255,210,140,.08);
}

/* Title — gallery gold breathing to deep sienna */
.artist-hero-secondary__title {
  font-family: 'Helvetica LT Pro', sans-serif;
  font-size: clamp(1.5rem, 2.2vw, 2.05rem);
  font-weight: 550;
  line-height: 1.18;
  color: #c7a15c; /* Golden Lichen base */
  margin-bottom: .4rem;
  --text-deep-sienna: #5E110B; /* final resting tone */
  --text-warm-gold: #C7A15C;
  animation: wlgDavidFade 2.8s ease-out forwards;
  text-shadow:
    0 2px 10px rgba(0,0,0,.25),
    0 0 2px rgba(255,205,140,.1);
}

/* Subtext — warm ivory, quiet, readable */
.artist-hero-secondary__subtext {
  font-family: var(--font-body);
  font-size: clamp(.95rem, 1.15vw, 1.35rem);
  font-weight: 500;
  color: #EDE6DC;
  max-width: 60ch;
  margin-bottom: 2rem;
  text-shadow: 0 1px 2px rgba(0,0,0,.24);
}

/* CTA Buttons — warm luster, minimal shine */
.artist-hero-secondary__ctas .wlg-btn {
  background: var(--golden-tisane);
  color:  #ffffff;
  border: 1px solid rgba(199,163,80,.55);
  padding: .85rem 1.9rem;
  font-weight: 500;
  transition: all .25s ease;
  box-shadow:
    0 4px 16px rgba(0,0,0,.18),
    inset 0 0 0 rgba(0,0,0,0);
}
.artist-hero-secondary__ctas .wlg-btn:hover {
  box-shadow:
    0 6px 22px rgba(0,0,0,.22),
    inset 0.5px -0.5px 2px rgba(255,255,255,.24);
}

/* Ghost CTA */
.artist-hero-secondary__ctas .wlg-btn--clear {
  background: rgba(255,255,255,.06);
  color: rgba(255,249,240,.92);
  border: 1px solid rgba(255,255,255,.4);
}
.artist-hero-secondary__ctas .wlg-btn--clear:hover {
  background: rgba(255,255,255,.12);
  color:  #ffffff;
}

/* Breathing gold→sienna text effect */
@keyframes wlgDavidFade {
  0% {
    color: rgba(246, 240, 228, 0.65); /* soft ivory */
    text-shadow: 0 0 8px rgba(0, 0, 0, 0.4);
  }
  80% {
    color: #5E110B; /* warmed sienna glow */
    text-shadow: 
      0 0 12px rgba(255, 228, 180, 0.55),
      0 0 28px rgba(94, 17, 11, 0.4);
  }
  100% {
    color: #5E110B; /* stay here */
    text-shadow: 
      0 0 10px rgba(255, 228, 180, 0.4),
      0 0 24px rgba(94, 17, 11, 0.3);
  }
}

/* Supertitle stays white but gains fine ambient lift */
.artist-hero-secondary__supertitle {
  text-shadow:
    0 1px 4px rgba(0,0,0,0.28),
    0 0 12px rgba(255,255,255,0.05);
}

/* Subtext clarity boost */
.artist-hero-secondary__subtext {
  text-shadow:
    0 1px 4px rgba(0,0,0,0.28),
    0 0 10px rgba(0,0,0,0.12);
}

/* Ghost button refinement */
.artist-hero-secondary__ctas .wlg-btn--clear {
  border-color: rgba(199,136,48,0.82);
  color: rgba(255,255,255,0.9);
}

.artist-hero-secondary__ctas .wlg-btn--clear:hover {
  background: rgba(199,136,48,0.08);
  border-color: rgba(199,136,48,0.95);
}

.wlg-btn,
.wlg-btn--clear {
  border: 1.5px solid rgba(199,136,48,0.38); /* Golden Tisane tint */
  box-shadow: 0 0 4px rgba(199,136,48,0.18);
  backdrop-filter: blur(1px);
}

/* hover - brushed bronze deepen */
.wlg-btn:hover,
.wlg-btn--clear:hover {
  border-color: rgba(199,136,48,0.65);
  box-shadow: 0 0 6px rgba(199,136,48,0.28);
}

/* Tone parallax down slightly */
body.hero-scroll-active .artist-hero-secondary__media img {
  transform: translateY(0.9vh);
}
.artist-hero-secondary__media img.hero-float-active {
  transform: translateY(-8px);
}

.artist-hero-secondary__supertitle {
  position: relative;
}

.artist-hero-secondary__supertitle::after {
  content: "";
  display: block;
  width: 72px; /* refined editorial length */
  height: 2px;
  margin-top: 0.5rem;
  background: linear-gradient(
    to right,
    rgba(214,178,108,0.9),
    rgba(214,178,108,0.4)
  );
  border-radius: 2px;
}

/* Subtle dissolve on small screens */
@media(max-width: 749px) {
  .artist-hero-secondary__supertitle::after {
    width: 52px;
    opacity: 0.7;
  }
}

/* ===========================================================
   WLG • Heritage Product Page Light Scheme
   Targets Heritage "product-information" section safely
   =========================================================== */

/* Product page background + base variables */
.product-information {
  background: #F0F0F0;               /* light gray */
}
/* Heritage uses CSS variables for scheme colors.
   We override them ONLY within the product-info section. */
.product-information {
  --color-background: 240 240 240;   /* #F0F0F0 as RGB triplet */
  --color-foreground: 41 39 35;      /* #292723 Ink Charcoal */
  --color-border: 41 39 35;          /* border tone base */
}

/* Apply light surface + readable text */
.product-information {
  background: #F0F0F0;
  color: #292723;
}

/* Description / RTE readability */
.product-information .rte,
.product-information .rte p {
  color: rgba(41,39,35,0.92);
  line-height: 1.65;
}

/* Title */
.product-information h1 {
  color: #292723;
}

/* Variant buttons (your JSON uses "variant_style": "buttons") */
.product-information .variant-picker__button,
.product-information .product-form__input input + label {
  background: rgba(255,255,255,0.85);
  color: #292723;
  border: 1px solid rgba(41,39,35,0.25);
  border-radius: 999px;
}

/* Selected variant */
.product-information product-form__input .input:checked + label {
  background: #C78830;               /* Golden Tisane */
  color:  #ffffff;
  border-color: rgba(199,136,48,0.7);
}

/* Add to Cart (your block says style_class: button-secondary; we override visually) */
.product-information .button[name="add"],
.product-information .product-form__submit {
  background: #C78830;
  color:  #ffffff;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
}

.product-information .button[name="add"]:hover,
.product-information .product-form__submit:hover {
  filter: brightness(0.97);
  box-shadow: 0 8px 18px rgba(0,0,0,0.14);
}

/* ===========================================================
   WLG • Heritage Product Page — Light & Airy Conversion Scheme
   ROOT OVERRIDE (this is the missing piece)
   =========================================================== */

/* 1. Reset color variables at the product-page root */
.product-information {
  --color-background: 240 240 240;   /* #F0F0F0 */
  --color-foreground: 41 39 35;      /* #292723 Ink Charcoal */
  --color-border: 41 39 35;
  background: #F0F0F0;
}

/* 2. Ensure all inherited blocks respect the light scheme */
.product-information  {
  color: rgb(var(--color-foreground));
}

/* 3. Product title */
.product-information h1,
.product-information product-title,
.product-information [class*="product"] h1 {
  color: #292723;
}

/* 4. Description / RTE */
.product-information .rte,
.product-information .rte p,
.product-information .rte li {
  color: rgba(41,39,35,0.92);
  line-height: 1.65;
}

/* 5. Variant buttons (Heritage buttons + swatches) */
.product-information .variant-picker__button,
.product-information .product-form__buttons {
  background: rgba(255,255,255,0.9);
  border: 1px solid rgba(41,39,35,0.25);
  color: #292723;
  border-radius: 999px;
}

/* Selected variant */
.product-information product-form__input input:checked + label {
  background: #C78830; /* Golden Tisane */
  color:  #ffffff;
  border-color: #C78830;
}

/* 6. Quantity input */
.product-information .quantity_button {
  background: rgba(255,255,255,0.9);
  border: 1px solid rgba(41,39,35,0.25);
  color: #292723;
  border-radius: 20px;
}

/* 7. Add to Cart (primary conversion moment) */
.product-information .button[name="add"],
.product-information .product-form__submit {
  background: #C78830;
  color:  #ffffff;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
}

.product-information button[name="add"]:hover,
.product-information product-form__submit:hover {
  filter: brightness(0.96);
  box-shadow: 0 8px 18px rgba(0,0,0,0.14);
}

/* Disabled state */
.production-information__button[disabled]{
  background: rgba(41,39,35,0.25);
  color: rgba(41,39,35,0.6);
  box-shadow: none;
}

/* 9. Dividers */
.production-information__hr {
  background: rgba(41,39,35,0.18);
  height: 1px;
  border: none;
}

/* =========================================================
   WLG PRODUCT PAGES — LIGHT BASE (SAFE OVERRIDES)
   Apply to templates that include body class .template-product
   ========================================================= */

.product-information {
  padding-left: 0px;
  padding-right: 0px;
}

/* Give the whole product page breathing room */
.product-information shopify-section {
  overflow: visible;
}

/* Make the core product section feel editorial */
.product-information {
  max-width: 1240px;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

/* Prevent "cut off at bottom" on recs / lower sections */
.product-information {
  padding-bottom: 200px;
}

/* Buttons: look like buttons, not bars */
.product-information .quantity_selector,
.product-information .button,
.product-information .shopify-payment-button__button {
  border-radius: 20px;
  display: inline-grid;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

/* De-emphasize accelerated checkout slightly */
.product-information .shopify-payment-button__button {
  border-radius: 20px;
  opacity: 0.50;
}

/* Variant buttons spacing (if using button style variants) */
.product-information .variant-picker,
.product-information .product-form__input,
.product-information .fieldset {
  margin-bottom: 10px;
}

/* =========================================================
   WLG PRODUCT PAGE – FOUNDATION OVERRIDES
   ========================================================= */

.product-information {
  max-width: 1240px;
  margin-inline: auto;
  padding-left: 12px;
  padding-right: 12px;
}

/* Soften background tone */
.product-information {
  background-color: #f0f0f0; /* warm stone, not green-heavy */
}

/* Improve column balance */
.product-information__grid {
  grid-template-columns: 1.1fr 0.9fr;
  gap: 80px;
}

/* Button separation */
.product-information .quantity_selector,
.product-information .button,
.product-information .shopify-payment-button__button {
  border-radius: 20px;
  display: inline-grid;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

/* Make buttons feel intentional */
.product-information .quantity_button,
.product-information .button {
  border-radius: 20px;
  font-weight: 500;
}

/* De-emphasize accelerated checkout */
.product-information .shopify-payment-button__button {
  opacity: 0.5;
}


/* ===========================================================
   Product page media alignment fix (desktop)
   Stops "extend to edge" behavior from shifting the gallery
   =========================================================== */

@media (min-width: 500px) {
  /* kill the edge-extend math in the product context */
  .product-information__media .media-gallery-grid {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* center the actual media containers within their grid/slide */
  .product-information.section__media .media-gallery-grid {
    justify-items: right;
  }

  .product-information__product-media-gallery {
    margin-inline: auto;
  }
}
@media (min-width: 750px) {
  /* let the image fill its media tile more decisively */
  .product-information .product-media img,
  .product-information .product-media video,
  .product-information .product-media iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

/* ===========================================================
   Product Information Grid — SAFE override (no sidebar-width)
   Keeps 2-column layout and prevents skew/stacking.
   =========================================================== */
@media (min-width: 750px) {

  /* Ensure grid children can shrink (prevents overflow forcing weird widths) */
  .product-information .product-information__media,
  .product-information .product-details {
    min-width: 0 !important;
  }

  /* MEDIA RIGHT: details left, media right */
  .product-information .product-information__grid.product-information--media-right:not(.product-information__grid--half) {
    grid-template-columns: minmax(0, 1fr) minmax(0, clamp(420px, 43vw, 550px)) !important;
    align-items: start !important;
  }

  /* MEDIA LEFT: media left, details right */
  .product-information .product-information__grid.product-information--media-left:not(.product-information__grid--half) {
    grid-template-columns: minmax(0, clamp(420px, 48vw, 780px)) minmax(0, 1fr) !important;
    align-items: start !important;
  }

  /* Keep the media itself from “drifting” inside its column */
  .product-information .product-information__media media-gallery {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ===========================================================
   WLG • Quantity Selector — Luxe Button Cluster
   Targets: quantity.liquid / quantity-selector-component
   =========================================================== */

/* 1) Wrapper — becomes a proper control group */
quantity-selector-component.quantity-selector {
  display: inline-flex;
  align-items: center;
  width: 100%;
  max-width: 300px;              /* match your CTA stack width if needed */
  height: 40px;                  /* aligns with Add to Cart height */
  border-radius: 999px;          /* pill */
  overflow: hidden;
  border: 2px solid var(--ink-charcoal, #292723);
  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(6px);
}

/* 2) Buttons — neutral, tactile */
quantity-selector-component .quantity-minus,
quantity-selector-component .quantity-plus {
  width: 64px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.18s ease, transform 0.08s ease;
}

/* Hover / active */
quantity-selector-component .quantity-minus:hover,
quantity-selector-component .quantity-plus:hover {
  background: rgba(199, 136, 48, 0.12); /* Golden Tisane wash */
}

quantity-selector-component .quantity-minus:active,
quantity-selector-component .quantity-plus:active {
  transform: translateY(1px);
}

/* Disabled */
quantity-selector-component .quantity-minus[disabled],
quantity-selector-component .quantity-plus[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

/* 3) Input — remove "bar" look, center like a dial */
quantity-selector-component input[type="number"] {
  flex: 1;
  height: 40px;
  margin: 0;
  border: 0;
  background: transparent;
  text-align: center;
  font-family: inherit;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  color: var(--ink-charcoal, #292723);
  outline: none;
}

/* Remove browser spinners */
quantity-selector-component input[type="number"]::-webkit-outer-spin-button,
quantity-selector-component input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
quantity-selector-component input[type="number"] {
  -moz-appearance: textfield;
}

/* 4) Optional: a subtle divider line between controls */
quantity-selector-component .quantity-minus {
  border-right: 2px solid rgba(41, 39, 35, 0.18);
}
quantity-selector-component .quantity-plus {
  border-left: 2px solid rgba(41, 39, 35, 0.18);
}

/* 5) Icons — keep them visually centered and calm */
quantity-selector-component .svg-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
quantity-selector-component .svg-wrapper svg {
  width: 16px;
  height: 16px;
}

/* ===========================================================
   WLG • Quantity Selector — tighten + de-inputify
   =========================================================== */

/* Wrapper: make it feel like a single pill control */
quantity-selector-component.quantity-selector{
  height: 40px;                       /* matches your button rhythm */
  border-radius: 999px;
  border: 2px solid rgba(41,39,35,0.22);
  background: rgba(255,255,255,0.35);
  backdrop-filter: blur(8px);
  overflow: hidden;
}

/* Kill the loud blue outline when clicking into the input */
quantity-selector-component.quantity-selector:focus-within{
  outline: none;
  box-shadow: 0 0 0 2px rgba(199,136,48,0.25); /* subtle Golden Tisane halo */
}

/* Make buttons feel integrated (remove “floating circles”) */
quantity-selector-component .quantity-minus,
quantity-selector-component .quantity-plus{
  width: 64px;
  height: 40px;
  border-radius: 999px;                   /* key: no separate circles */
  background: transparent;
}

/* Gentle hover */
quantity-selector-component .quantity-minus:hover,
quantity-selector-component .quantity-plus:hover{
  background: rgba(199,136,48,0.10);
}

/* Center number + remove any input chrome */
quantity-selector-component input[type="number"]{
  height: 40px;
  background: transparent;
  border: 0;
  outline: none;
  box-shadow: none;
  font-size: 1rem;
  line-height: 1;
}

/* Remove any theme button styling leaking in */
quantity-selector-component .button-unstyled{
  box-shadow: none !important;
}

/* OPTIONAL: add dividers for “premium hardware” feel */
quantity-selector-component .quantity-minus{
  border-right: 2px solid rgba(41,39,35,0.14);
}
quantity-selector-component .quantity-plus{
  border-left: 2px solid rgba(41,39,35,0.14);
}

/* If your theme is still drawing a focus ring on the input itself */
quantity-selector-component input[type="number"]:focus{
  outline: none !important;
}

/* ===========================================================
   WLG • Quantity Selector — tighten + de-inputify
   =========================================================== */

/* Wrapper: make it feel like a single pill control */
quantity-selector-component.quantity-selector{
  height: 40px;                       /* matches your button rhythm */
  border-radius: 999px;
  border: 1px solid rgba(41,39,35,0.22);
  background: rgba(255,255,255,0.35);
  backdrop-filter: blur(8px);
  overflow: hidden;
}

/* Kill the loud blue outline when clicking into the input */
quantity-selector-component.quantity-selector:focus-within{
  outline: none;
  box-shadow: 0 0 0 2px rgba(199,136,48,0.25); /* subtle Golden Tisane halo */
}

/* Make buttons feel integrated (remove “floating circles”) */
quantity-selector-component .quantity-minus,
quantity-selector-component .quantity-plus{
  width: 64px;
  height: 40px;
  border-radius: 0;                   /* key: no separate circles */
  background: transparent;
}

/* Gentle hover */
quantity-selector-component .quantity-minus:hover,
quantity-selector-component .quantity-plus:hover{
  background: rgba(199,136,48,0.10);
}

/* Center number + remove any input chrome */
quantity-selector-component input[type="number"]{
  height: 40px;
  background: transparent;
  border: 0;
  outline: none;
  box-shadow: none;
  font-size: 1rem;
  line-height: 1;
}

/* Remove any theme button styling leaking in */
quantity-selector-component .button-unstyled{
  box-shadow: none !important;
}

/* OPTIONAL: add dividers for “premium hardware” feel */
quantity-selector-component .quantity-minus{
  border-right: 1px solid rgba(41,39,35,0.14);
}
quantity-selector-component .quantity-plus{
  border-left: 1px solid rgba(41,39,35,0.14);
}

/* If your theme is still drawing a focus ring on the input itself */
quantity-selector-component input[type="number"]:focus{
  outline: none !important;
}

/* ===========================================================
   WLG • Quantity Selector (Heritage) — FINAL TARGETED STYLES
   Matches: <quantity-selector-component class="quantity-selector">
   Buttons: .quantity-minus / .quantity-plus
   Icons: .svg-wrapper.icon-plus
   =========================================================== */

/* Wrapper */
quantity-selector-component.quantity-selector {
  display: flex;
  align-items: center;
  width: 300px;
  height: 40px;
  border-radius: 999px !important;
  overflow: hidden;
  border: 2px solid rgba(41,39,35,0.22);
  background: rgba(255,255,255,0.35);
  backdrop-filter: blur(8px);
}

/* Remove theme hover/focus fills on wrapper */
quantity-selector-component.quantity-selector:hover,
quantity-selector-component.quantity-selector:focus,
quantity-selector-component.quantity-selector:focus-within{
  background: #C78830 !important;
}

/* Kill any overlay pseudo-elements (common theme trick) */
quantity-selector-component.quantity-selector::before,
quantity-selector-component.quantity-selector::after{
  content: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Quiet, luxe focus halo (instead of loud blue) */
quantity-selector-component.quantity-selector:focus-within{
  outline: none !important;
  box-shadow: 0 0 0 5px rgba(199,136,48,0.25) !important;
  border-color: rgba(199,136,48,0.45) !important;
}

/* Buttons */
quantity-selector-component button.quantity-minus.button-unstyled,
quantity-selector-component button.quantity-plus.button-unstyled {
  width: 64px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 0;                /* prevents “floating circles” */
  background: transparent;
  box-shadow: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.18s ease, transform 0.08s ease;
}

quantity-selector-component button.quantity-minus:hover,
quantity-selector-component button.quantity-plus:hover{
  background: #EDE6DC;
}

quantity-selector-component button.quantity-minus:active,
quantity-selector-component button.quantity-plus:active{
  transform: translateY(5px);
}

/* Optional dividers for that “hardware” feel */
quantity-selector-component button.quantity-minus.button-unstyled {
  border-right: 3px solid rgba(41,39,35,0.14);
}
quantity-selector-component button.quantity-plus.button-unstyled {
  border-left: 3px solid rgba(41,39,35,0.14);
}

/* Input */
quantity-selector-component input[type="number"]{
  flex: 1;
  height: 40px;
  margin: 0;
  border: 0;
  background: transparent !important;
  text-align: center;
  font-family: inherit;
  font-size: 1rem;
  letter-spacing: 0.02em;
  color: var(--ink-charcoal, #292723);
  outline: none !important;
  box-shadow: none !important;
}

/* Remove browser spinners */
quantity-selector-component input[type="number"]::-webkit-outer-spin-button,
quantity-selector-component input[type="number"]::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}
quantity-selector-component input[type="number"]{
  -moz-appearance: textfield;
}

/* Icons — your markup is ".svg-wrapper icon-plus" (two classes) */
quantity-selector-component .svg-wrapper.icon-plus{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  border-radius: 0 !important;
}
quantity-selector-component .svg-wrapper.icon-plus svg{
  width: 16px;
  height: 16px;
}

/* If theme applies focus styles broadly */
quantity-selector-component *:focus,
quantity-selector-component *:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

/* ===========================================================
   WLG • Add to Cart Component (Heritage)
   Targets: <add-to-cart-component> + button[name="add"]
   Preserves the built-in "Added" animation
   =========================================================== */

/* Button base */
add-to-cart-component button[name="add"].button{
  width: 300px;
  height: 40px;
  border-radius: 999px;
  position: relative;              /* required: supports absolute "added" overlay */
  overflow: hidden;                /* keeps animation tidy */
  border: 3px solid rgba(41,39,35,0.18);

  background: #C78830;             /* Golden Tisane */
  color: #292723;                  /* Ink Charcoal */

  font-family: inherit;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  transition: transform 0.12s ease, filter 0.2s ease, box-shadow 0.2s ease;
}

/* Hover / press */
add-to-cart-component button[name="add"].button:hover{
  filter: brightness(0.98);
  box-shadow: 0 10px 22px rgba(0,0,0,0.10);
}
add-to-cart-component button[name="add"].button:active{
  transform: translateY(1px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.10);
}

/* Focus — match your quiet WLG halo language */
add-to-cart-component button[name="add"].button:focus-visible{
  outline: none;
  box-shadow: 0 0 0 5px rgba(199,136,48,0.25), 0 10px 22px rgba(0,0,0,0.10);
}

/* Disabled */
add-to-cart-component button[name="add"].button[disabled]{
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
}

/* Inner text row */
.add-to-cart-text{
  gap: 10px;                       /* more intentional spacing */
}

/* Icons */
.svg-wrapper.add-to-cart-icon svg,
.svg-wrapper.add-to-cart-icon--added svg{
  width: 16px;
  height: 16px;
}

/* Ensure "added" overlay remains perfectly centered */
add-to-cart-component .add-to-cart-text--added{
  inset: 0;
}

.svg-wrapper.add-to-cart-icon svg {
  opacity: .50;
}

add-to-cart-component button[name="add"].button{ background: #C78830 !important; color: #292723 !important; }

add-to-cart-component button[name="add"].button{
  background: linear-gradient(180deg, rgba(199,136,48,0.95), rgba(199,136,48,1));
}

/* WLG • Media scrolls normally (no sticky) */
@media (min-width: 750px) {
  .product-information__media {
    position: static !important;
    top: auto !important;
  }
}

.product-information .shopify-payment-button__button  {
  width: 50px !important;
}

/* Lock the buy stack to a unified width */
.product-details .buy-buttons,
.product-details .shopify-payment-button,
.product-details .quantity-input {
  max-width: 300px;
  margin-inline: auto;
}

/* ===============================
   WLG • Center Buy Button Stack
   =============================== */

.product-details .buy-buttons {
  display: flex;
  flex-direction: column;
  align-items: center; /* KEY */
}

/* Lock shared width + center */
.product-details .buy-buttons > *,
.product-details .shopify-payment-button {
  width: 100%;
  max-width: 300px; /* adjust if desired */
  margin-inline: auto;
}

/* Ensure the inner Shop Pay button respects centering */
.product-details .shopify-payment-button__button {
  margin-inline: auto;
}
.product-details .buy-buttons {
  gap: 12px;
}

/* =========================================
   WLG • Center the entire purchase stack
   (Quantity + Add to Cart + Shop Pay)
   ========================================= */

/* The block that usually contains qty + ATC + dynamic checkout */
.product-details .buy-buttons,
.product-details .product-form__buttons,
.product-details .product-form {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Force consistent max-width + true centering for ALL children */
.product-details .buy-buttons > *,
.product-details .product-form__buttons > *,
.product-details .product-form > *,
.product-details .shopify-payment-button {
  width: 100%;
  max-width: 300px;   /* adjust to taste */
  margin-inline: auto;
}

/* ATC button sometimes sits inside a form wrapper */
.product-details button[type="submit"][name="add"] {
  width: 100%;
  max-width: 300px;
  margin-inline: auto;
  display: block;
}

/* Shopify payment button inner element */
.product-details .shopify-payment-button__button {
  width: 100%;
  max-width: 300px;
  margin-inline: auto;
}

/* =========================================
   WLG • Quantity selector geometry cleanup
   (Make - and + identical width + centered)
   ========================================= */

quantity-selector-component.quantity-selector,
.product-details .quantity-selector {
  width: 100%;
  max-width: 300px; /* keep aligned with buttons */
  margin-inline: auto;
}

/* Ensure the pill is a real flex row */
quantity-selector-component.quantity-selector {
  display: flex;
  align-items: stretch;
}

/* Make BOTH buttons identical */
quantity-selector-component .quantity-minus,
quantity-selector-component .quantity-plus {
  width: 64px;              /* identical tap target */
  height: 40px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;  /* centers icon */
  box-sizing: border-box;
}

/* Ensure the middle input takes the rest and is centered */
quantity-selector-component input[type="number"] {
  flex: 1 1 auto;
  width: auto;
  text-align: center;
  padding-inline: 0;
  box-sizing: border-box;
}

/* If the icon wrappers have different intrinsic sizes, normalize them */
quantity-selector-component .svg-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Optional: hard-normalize svg sizing */
quantity-selector-component .svg-wrapper svg {
  width: 16px;
  height: 16px;
  display: block;
}

/* ============================
   WLG • Quantity selector: lock +/- geometry
   ============================ */

quantity-selector-component {
  /* keeps the whole pill consistent */
  width: 100%;
  max-width: 520px;          /* adjust if you want wider/narrower */
  margin-inline: auto;
}

quantity-selector-component .button.quantity-minus,
quantity-selector-component .button.quantity-plus {
  /* force identical tap targets */
  flex: 0 0 64px;            /* SAME width for both */
  width: 64px;
  height: 40px;              /* match your pill height */
  padding: 0 !important;
  margin: 0 !important;

  display: grid;             /* perfect centering */
  place-items: center;

  line-height: 1;
  box-sizing: border-box;
}

/* ensure the middle input doesn't shove one side */
quantity-selector-component input[type="number"] {
  flex: 1 1 auto;
  width: auto;
  text-align: center;
  padding-inline: 0;
  box-sizing: border-box;
}

/* normalize the icon box itself (your theme uses svg-wrapper / icon-plus) */
quantity-selector-component .svg-wrapper,
quantity-selector-component .svg-wrapper.icon-plus,
quantity-selector-component .svg-wrapper.icon-minus,
quantity-selector-component .svg-wrapper-icon-plus {
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  padding: 0;
  margin: 0;
  line-height: 1;
}

quantity-selector-component svg {
  width: 16px;
  height: 16px;
  display: block;
}

quantity-selector-component .button.quantity-minus,
quantity-selector-component .button.quantity-plus {
  outline-offset: 2px; /* keeps focus ring from shifting layout */
}

/* =========================================
   WLG • Quantity selector (custom component)
   Fix: equal +/- button widths + perfect centering
========================================= */

.quantity-selector-component {
  /* adjust if you want a slightly wider/taller control */
  --wlg-qty-h: 40px;
  --wlg-qty-btn: 64px;     /* left and right button width */
  --wlg-qty-icon: 16px;    /* icon size */
}

/* Make the whole control a 3-column grid: [-] [value] [+] */
.quantity-selector-component {
  display: grid !important;
  grid-template-columns: var(--wlg-qty-btn) 1fr var(--wlg-qty-btn) !important;
  align-items:inline-grid !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Lock BOTH buttons to identical width/height and center contents */
.quantity-selector-component button.quantity-minus,
.quantity-selector-component button.quantity-plus {
  width: var(--wlg-qty-btn) !important;
  min-width: var(--wlg-qty-btn) !important;
  height: var(--wlg-qty-h) !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  line-height: 0 !important; /* prevents baseline drift */
  box-sizing: border-box !important;
}

/* Center the middle “value” area and match height */
.quantity-selector-component .quantity-value,
.quantity-selector-component .quantity-input,
.quantity-selector-component input[type="number"],
.quantity-selector-component input {
  height: 40px !important;
  text-align: center !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}

/* Normalize icon sizing inside +/- (works for SVG or text glyphs) */
.quantity-selector-component button.quantity-minus svg,
.quantity-selector-component button.quantity-plus svg {
  width: 64px !important;
  height: 40px !important;
  display: block !important;
  flex: 0 0 auto !important;
}

/* If your +/- are characters in a span (not SVG) */
.quantity-selector-component button.quantity-minus span,
.quantity-selector-component button.quantity-plus span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

.quantity-selector-component { justify-self: stretch !important; }

/* =========================================
   WLG • Quantity selector
   Fix: equal +/- widths + perfect centering
========================================= */

quantity-selector-component.quantity-selector {
  --wlg-qty-h: 54px;     /* adjust if needed */
  --wlg-qty-btn: 76px;   /* same width left/right */
  --wlg-qty-icon: 14px;

  display: grid !important;
  grid-template-columns: var(--wlg-qty-btn) 1fr var(--wlg-qty-btn) !important;
  align-items: stretch !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* lock both buttons to identical geometry */
quantity-selector-component.quantity-selector .quantity-minus,
quantity-selector-component.quantity-selector .quantity-plus {
  width: var(--wlg-qty-btn) !important;
  min-width: var(--wlg-qty-btn) !important;
  height: var(--wlg-qty-h) !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  line-height: 0 !important;
  box-sizing: border-box !important;
}

/* center the number input and match height */
quantity-selector-component.quantity-selector input[type="number"] {
  height: var(--wlg-qty-h) !important;
  text-align: center !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* normalize the svg wrapper so both icons sit dead-center */
quantity-selector-component.quantity-selector .svg-wrapper {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: var(--wlg-qty-icon) !important;
  height: var(--wlg-qty-icon) !important;
}

/* normalize SVG sizing */
quantity-selector-component.quantity-selector .svg-wrapper svg {
  width: var(--wlg-qty-icon) !important;
  height: var(--wlg-qty-icon) !important;
  display: block !important;
}

/* =========================================
   WLG • Final quantity centering fix
========================================= */

/* Center the minus / plus icons perfectly */
quantity-selector-component.quantity-selector .quantity-minus,
quantity-selector-component.quantity-selector .quantity-plus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Kill SVG baseline drift */
quantity-selector-component.quantity-selector .svg-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Normalize SVG itself */
quantity-selector-component.quantity-selector .svg-wrapper svg {
  display: block !important;
}

/* Center the number vertically + horizontally */
quantity-selector-component.quantity-selector input[type="number"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: 0 !important;
}

/* =========================================================
   WLG • Quantity selector: hard-center icons + value (PDP)
   ========================================================= */

.product-details quantity-selector-component.quantity-selector {
  display: flex;
  align-items: center;
}

/* Make BOTH side buttons identical “centering boxes” */
.product-details quantity-selector-component.quantity-selector > button.quantity-minus,
.product-details quantity-selector-component.quantity-selector > button.quantity-plus {
  display: grid !important;
  place-items: center !important;

  /* baseline drift killers */
  line-height: 0 !important;
  padding: 0 !important;

  /* ensure both sides are the same visual width */
  flex: 0 0 64px !important; /* adjust if you want tighter */
}

/* Ensure the wrapper itself doesn’t baseline-align */
.product-details quantity-selector-component.quantity-selector > button .svg-wrapper {
  display: grid !important;
  place-items: center !important;
  line-height: 0 !important;
}

/* Ensure the SVG doesn’t sit on a text baseline */
.product-details quantity-selector-component.quantity-selector > button .svg-wrapper svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
}

/* Center the number */
.product-details quantity-selector-component.quantity-selector > input[type="number"] {
  text-align: center !important;
  line-height: 1 !important;
  padding: 0 !important;

  /* make the middle truly flexible */
  flex: 1 1 auto !important;
  min-width: 0 !important;

  /* optional: remove browser quirks */
  -moz-appearance: textfield;
}
.product-details quantity-selector-component.quantity-selector > input[type="number"]::-webkit-outer-spin-button,
.product-details quantity-selector-component.quantity-selector > input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* =========================================================
   WLG • Quantity selector: force true centering (PDP + global)
   Put at END of wlg.css so it wins
   ========================================================= */

/* 1) Make the component a 3-column grid: left button / input / right button */
.quantity-selector {
  display: grid !important;
  grid-template-columns: 64px 1fr 64px !important;
  align-items: stretch !important;
}

/* 2) Force both +/- buttons to be identical boxes and center their contents */
.quantity-selector .button.quantity-minus,
.quantity-selector .button.quantity-plus {
  width: 64px !important;
  height: 40px !important;
  display: flex !important;            /* override any grid/inline */
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  line-height: 0 !important;           /* kills baseline drift */
}

/* 3) Center the SVG wrapper + SVG */
.quantity-selector .button.quantity-minus .svg-wrapper,
.quantity-selector .button.quantity-plus .svg-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 0 !important;
}

.quantity-selector .button.quantity-minus svg,
.quantity-selector .button.quantity-plus svg {
  display: block !important;
}

/* 4) Center the number (and remove any indentation/padding) */
.quantity-selector input[type="number"] {
  width: 100% !important;
  height: 40px !important;
  text-align: center !important;
  padding: 0 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

/* optional: remove browser spinners */
.quantity-selector input[type="number"]::-webkit-outer-spin-button,
.quantity-selector input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.quantity-selector input[type="number"] {
  -moz-appearance: textfield;
}

/* WLG • Quantity number: force true centering */
.quantity-selector input[type="number"]{
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-indent: 0 !important;
  display: flex !important;            /* some themes set inline-block weirdness */
  align-items: center !important;
  justify-content: center !important;
  line-height: normal !important;
}

/* If the theme wraps the input in a flex container and it’s shifting */
.quantity-selector {
  place-items: stretch !important;     /* keeps input column aligned */
}

/* Safety: if there’s an inner input wrapper (common in Heritage) */
.quantity-selector .quantity-input,
.quantity-selector .quantity__input,
.quantity-selector .quantity__input input{
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-indent: 0 !important;
}

/* =========================================================
   WLG • Quantity selector — FINAL vertical centering fix
   Put at END of wlg.css
   ========================================================= */

.product-details quantity-selector-component.quantity-selector {
  --wlg-qty-h: 40px;     /* match your pill */
  --wlg-qty-btn: 64px;   /* left/right button width */

  display: grid !important;
  grid-template-columns: var(--wlg-qty-btn) 1fr var(--wlg-qty-btn) !important;
  align-items: stretch !important;
}

/* Keep +/- perfect */
.product-details quantity-selector-component.quantity-selector > button.quantity-minus,
.product-details quantity-selector-component.quantity-selector > button.quantity-plus {
  height: var(--wlg-qty-h) !important;
  width: var(--wlg-qty-btn) !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  place-items: center !important;
  line-height: 0 !important; /* icon baseline killer */
}

/* The actual fix: inputs need line-height + padding reset (not flex) */
.product-details quantity-selector-component.quantity-selector > input[type="number"] {
  height: var(--wlg-qty-h) !important;
  line-height: var(--wlg-qty-h) !important;   /* vertical centering */
  padding-block: 0 !important;                /* remove top/bottom padding */
  padding-inline: 0 !important;
  margin: 0 !important;

  text-align: center !important;
  box-sizing: border-box !important;

  display: block !important;                  /* IMPORTANT: not flex */
  font: inherit !important;                   /* prevents odd font-metric drift */
}

/* Optional: remove spinner UI (keeps alignment consistent across browsers) */
.product-details quantity-selector-component.quantity-selector > input[type="number"]::-webkit-outer-spin-button,
.product-details quantity-selector-component.quantity-selector > input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.product-details quantity-selector-component.quantity-selector > input[type="number"] {
  -moz-appearance: textfield;
}

/* =========================================================
   WLG • Recommended Products (Shopify-native)
   Editorial + curated styling
   ========================================================= */

/* Wrapper: works for both <product-recommendations> and .product-recommendations containers */
.product-details product-recommendations,
.product-details .product-recommendations,
.product-details .product-recommendations-wrapper,
.product-details .complementary-products,
.product-details [data-testid*="product-recommendations"] {
  max-width: 520px;              /* match your anchored rhythm */
  margin-inline: auto;
  padding-top: 18px;
}

/* Heading row inside recommendations (your JSON has a header text block) */
.product-details product-recommendations h2,
.product-details product-recommendations h3,
.product-details .product-recommendations h2,
.product-details .product-recommendations h3,
.product-details .product-recommendations .h5,
.product-details .product-recommendations .h4 {
  margin: 0 0 10px;
  text-align: center;
}

/* Optional: add a refined divider under the heading */
.product-details product-recommendations h2::after,
.product-details product-recommendations h3::after,
.product-details .product-recommendations h2::after,
.product-details .product-recommendations h3::after {
  content: "";
  display: block;
  width: 64px;
  height: 1px;
  margin: 10px auto 0;
  background: var(--color-golden-tisane, #C78830);
  opacity: 0.9;
}

/* Grid / list container — support common theme class names */
.product-details product-recommendations ul,
.product-details .product-recommendations ul,
.product-details .product-recommendations__list,
.product-details .complementary-products__list,
.product-details [data-recommendations] ul {
  list-style: none;
  padding: 0;
  margin: 0;

  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

/* Card base */
.product-details product-recommendations li,
.product-details .product-recommendations li,
.product-details .product-recommendations__list > * {
  border: 1px solid rgba(41, 39, 35, 0.14); /* Ink Charcoal softened */
  border-radius: 14px;
  overflow: hidden;
  background: rgba(237, 230, 220, 0.55);    /* Stone Ivory wash */
}

/* Image treatment */
.product-details product-recommendations img,
.product-details .product-recommendations img {
  width: 100%;
  height: auto;
  display: block;
}

/* Text spacing inside cards (covers common theme wrappers) */
.product-details product-recommendations a,
.product-details .product-recommendations a {
  text-decoration: none;
}

.product-details product-recommendations .card__information,
.product-details product-recommendations .card__content,
.product-details .product-recommendations .card__information,
.product-details .product-recommendations .card__content {
  padding: 10px 12px 12px;
}

/* Title typography */
.product-details product-recommendations .card__heading,
.product-details .product-recommendations .card__heading,
.product-details product-recommendations .card__heading a,
.product-details .product-recommendations .card__heading a {
  font-family: var(--font-heading-family, inherit);
  font-size: 0.95rem;
  line-height: 1.2;
  color: var(--color-ink-charcoal, #292723);
}

/* Price: quieter, editorial */
.product-details product-recommendations .price,
.product-details .product-recommendations .price {
  margin-top: 6px;
  font-size: 0.9rem;
  opacity: 0.92;
}

/* Hover: subtle lift (no “ecom pop”) */
@media (hover: hover) {
  .product-details product-recommendations li:hover,
  .product-details .product-recommendations li:hover {
    transform: translateY(-1px);
    transition: transform 160ms ease, box-shadow 160ms ease;
    box-shadow: 0 10px 20px rgba(0,0,0,0.08);
  }
}

/* Mobile: 1 column (or make it swipeable if you prefer) */
@media (max-width: 749px) {
  .product-details product-recommendations ul,
  .product-details .product-recommendations ul,
  .product-details .product-recommendations__list,
  .product-details .complementary-products__list {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

/* =========================================================
   WLG • Product recommendations polish (PDP)
   - tighter gap above section
   - square images (no rounded corners)
   - add bottom breathing room before footer
   - hide Shop Pay/payment terms messaging in this context
   ========================================================= */

/* --- Section spacing: pull recommendations closer to Product Info --- */
/* If your recommendations wrapper uses this class, this will work immediately */
.product-recommendations {
  margin-top: 12px !important;     /* reduce the vertical gap */
  padding-top: 0 !important;
  padding-bottom: 56px !important; /* keeps cards off the footer */
}

/* Fallbacks (Heritage can render as a "section" wrapper) */
section.product-recommendations,
.section.product-recommendations,
.shopify-section .product-recommendations {
  margin-top: 12px !important;
  padding-bottom: 56px !important;
}

/* --- Heading feel (optional) --- */
.product-recommendations .section__heading,
.product-recommendations h2,
.product-recommendations h3 {
  margin-bottom: 18px !important;
}

/* --- Square corners everywhere inside the recommendation cards --- */
.product-recommendations .card,
.product-recommendations .card__inner,
.product-recommendations .card__media,
.product-recommendations .media,
.product-recommendations img {
  border-radius: 0 !important;
}

/* If theme sets overflow hidden with rounding somewhere */
.product-recommendations .card__media,
.product-recommendations .media {
  overflow: hidden;
}

/* --- Make sure the cards don’t visually “drop” past the section --- */
.product-recommendations .grid,
.product-recommendations .product-grid,
.product-recommendations .card-grid {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* --- Remove Shop Pay / installment advertising in recommendations only --- */
/* Most themes render this as Shopify payment terms */
.product-recommendations .shopify-payment-terms,
.product-recommendations .shopify-payment-terms__content,
.product-recommendations .payment-terms,
.product-recommendations [data-shopify="payment-terms"] {
  display: none !important;
}

/* Some themes output "Pay in 4…" inside a generic richtext container */
.product-recommendations .rte .shopify-payment-terms,
.product-recommendations .rte .payment-terms {
  display: none !important;
}

/* Extra: reduce bottom spacing coming from the block ABOVE recommendations */
.product-details {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* =========================================================
   WLG • Product Recommendations (PDP) polish
   - tighter spacing
   - square media
   - equal-height cards
   - hide Shop/terms messaging
   - safe bottom padding before footer
   ========================================================= */

/* A) Tighten the vertical gap ABOVE the recommendations */
.product-details .product-recommendations,
.product-details product-recommendations {
  margin-top: 0px !important;   /* reduce if still too tall */
  padding-top: 0px !important;  /* keeps it “noticed” as you scroll */
}

/* If your previous section is leaving a big bottom gap, this helps */
.product-details .wlg-care {
  margin-bottom: 18px !important;
  padding-bottom: 0 !important;
}

/* B) Anchor the section (max width + centered) */
.product-details .product-recommendations .page-width,
.product-details product-recommendations .page-width,
.product-details .product-recommendations__container,
.product-details product-recommendations .product-recommendations__container {
  max-width: 1180px !important; /* adjust: 1120–1240 usually feels right */
  margin-inline: auto !important;
}

/* C) Make sure the section has breathing room before the footer */
.product-details .product-recommendations,
.product-details product-recommendations {
  padding-bottom: 56px !important; /* prevents cards from touching footer */
}

/* D) Square image corners (your theme is rounding media) */
.product-details .product-recommendations .media,
.product-details .product-recommendations img,
.product-details product-recommendations .media,
.product-details product-recommendations img {
  border-radius: 0 !important;
}

/* E) Equal-height grid + cards (fix “different depths”) */
.product-details .product-recommendations .grid,
.product-details product-recommendations .grid {
  align-items: stretch !important;
}

.product-details .product-recommendations .grid__item,
.product-details product-recommendations .grid__item {
  display: flex !important;
}

.product-details .product-recommendations .card,
.product-details product-recommendations .card {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

/* If your card has a content wrapper, let it stretch nicely */
.product-details .product-recommendations .card__content,
.product-details product-recommendations .card__content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}

/* Keep title + price sitting toward the top with a consistent block */
.product-details .product-recommendations .card__information,
.product-details product-recommendations .card__information {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

/* Optional: normalize title line-height a touch (helps visual consistency) */
.product-details .product-recommendations .card__heading,
.product-details product-recommendations .card__heading {
  line-height: 1.15 !important;
}

/* F) Remove “Shop / installment / payment terms” messaging ONLY here */
.product-details .product-recommendations .shopify-payment-terms,
.product-details .product-recommendations shopify-payment-terms,
.product-details product-recommendations .shopify-payment-terms,
.product-details product-recommendations shopify-payment-terms {
  display: none !important;
}

/* Some themes output extra “Pay in X installments” text in a small p/span */
.product-details .product-recommendations [class*="payment-terms"],
.product-details .product-recommendations [class*="installment"],
.product-details product-recommendations [class*="payment-terms"],
.product-details product-recommendations [class*="installment"] {
  display: none !important;
}

/* G) If cards still feel too tall, clamp the image area consistently */
.product-details .product-recommendations .card__media,
.product-details product-recommendations .card__media {
  /* pick ONE approach */
  /* 1) Consistent aspect ratio: */
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
}

.product-details .product-recommendations .card__media img,
.product-details product-recommendations .card__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* If a section gap exists, this prevents "white seam" lines by matching the backdrop */
html, body,
#MainContent,
main#MainContent {
  background: var(--wlg-stone-ivory, #EDE6DC);
}

/* Kill any global inter-section gap that can create seams */
#MainContent {
  gap: 0 !important;
}

/* =========================================
   WLG • Product Recommendations seam fix
   ========================================= */
.product-recommendations {
  position: relative;
  overflow: hidden; /* prevents tiny 1px seams showing */
}

/* Ensure the background layer truly covers the section */
.product-recommendations > .section-background {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  transform: translateZ(0); /* helps with subpixel seams */
}

/* If your theme sets section backgrounds via pseudo elements, this helps too */
.product-recommendations::before,
.product-recommendations::after {
  content: none !important;
}

/* =====================================================
   WLG • Curated Pairings (Product Recommendations)
   Targets: <product-recommendations class="product-recommendations">
   ===================================================== */

/* 1) Make the grid breathe edge-to-edge more */
.product-recommendations .section.section--page-width {
  max-width: 100% !important;
  padding-left: clamp(16px, 2vw, 28px) !important;
  padding-right: clamp(16px, 2vw, 28px) !important;
}

/* If you use full-width setting, keep it clean too */
.product-recommendations .section.section--full-width {
  padding-left: clamp(16px, 2vw, 28px) !important;
  padding-right: clamp(16px, 2vw, 28px) !important;
}

/* 2) Tighten gaps between cards (overrides the variable if needed) */
.product-recommendations .resource-list--grid {
  column-gap: 14px !important; /* “almost touching but separate” */
  row-gap: 18px !important;
}

/* 3) Let each list item/card use full width of its grid column */
.product-recommendations .resource-list__item {
  width: 100%;
}

/* 4) Normalize product card media so images scale consistently
   We don’t know your exact inner card markup, so we target common patterns:
   - .media img
   - picture/img inside a media wrapper
*/
.product-recommendations .resource-list__item .media,
.product-recommendations .resource-list__item .product-card__media,
.product-recommendations .resource-list__item .card__media {
  overflow: hidden;
}

/* Give the image area a predictable shape.
   If you want square cards: 1/1.
   If you want slightly taller editorial: 4/5.
*/
.product-recommendations .resource-list__item .media {
  aspect-ratio: 1 / 1;
}

.product-recommendations .resource-list__item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block;
}

/* 5) Center text + give breathing room below image
   Again we target common “information” containers.
*/
.product-recommendations .resource-list__item .card__content,
.product-recommendations .resource-list__item .product-card__content,
.product-recommendations .resource-list__item .card__information,
.product-recommendations .resource-list__item .product-card__info,
.product-recommendations .resource-list__item .card-information {
  text-align: center !important;
  padding-top: 12px !important;
}

/* Ensure title/price stack cleanly */
.product-recommendations .resource-list__item .card__heading,
.product-recommendations .resource-list__item .product-card__title,
.product-recommendations .resource-list__item .card-information__text {
  margin: 0 0 8px 0 !important;
}

.product-recommendations .resource-list__item .price {
  margin: 0 !important;
  display: block;
}

/* Optional: soften the "poster frame" look if it's a border */
.product-recommendations .resource-list__item .card,
.product-recommendations .resource-list__item .card-wrapper {
  border-radius: 0 !important;
}

/* =====================================================
   WLG • Curated Pairings (Product Recommendations)
   Targets: <product-recommendations class="product-recommendations">
   ===================================================== */

/* 1) Make the grid breathe edge-to-edge more */
.product-recommendations .section.section--page-width {
  max-width: 100% !important;
  padding-left: clamp(16px, 2vw, 28px) !important;
  padding-right: clamp(16px, 2vw, 28px) !important;
}

/* If you use full-width setting, keep it clean too */
.product-recommendations .section.section--full-width {
  padding-left: clamp(16px, 2vw, 28px) !important;
  padding-right: clamp(16px, 2vw, 28px) !important;
}

/* 2) Tighten gaps between cards (overrides the variable if needed) */
.product-recommendations .resource-list--grid {
  column-gap: 14px !important; /* “almost touching but separate” */
  row-gap: 18px !important;
}

/* 3) Let each list item/card use full width of its grid column */
.product-recommendations .resource-list__item {
  width: 100%;
}

/* 4) Normalize product card media so images scale consistently
   We don’t know your exact inner card markup, so we target common patterns:
   - .media img
   - picture/img inside a media wrapper
*/
.product-recommendations .resource-list__item .media,
.product-recommendations .resource-list__item .product-card__media,
.product-recommendations .resource-list__item .card__media {
  overflow: hidden;
}

/* Give the image area a predictable shape.
   If you want square cards: 1/1.
   If you want slightly taller editorial: 4/5.
*/
.product-recommendations .resource-list__item .media {
  aspect-ratio: 1 / 1;
}

.product-recommendations .resource-list__item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block;
}

/* 5) Center text + give breathing room below image
   Again we target common “information” containers.
*/
.product-recommendations .resource-list__item .card__content,
.product-recommendations .resource-list__item .product-card__content,
.product-recommendations .resource-list__item .card__information,
.product-recommendations .resource-list__item .product-card__info,
.product-recommendations .resource-list__item .card-information {
  text-align: center !important;
  padding-top: 12px !important;
}

/* Ensure title/price stack cleanly */
.product-recommendations .resource-list__item .card__heading,
.product-recommendations .resource-list__item .product-card__title,
.product-recommendations .resource-list__item .card-information__text {
  margin: 0 0 8px 0 !important;
}

.product-recommendations .resource-list__item .price {
  margin: 0 !important;
  display: block;
}

/* Optional: soften the "poster frame" look if it's a border */
.product-recommendations .resource-list__item .card,
.product-recommendations .resource-list__item .card-wrapper {
  border-radius: 0 !important;
}

/* =========================================================
   WLG • Product Recommendations — card consistency fix
   Goal: every recommendation card stacks:
   [image]
   [title]
   [price]
   ========================================================= */

/* 1) Grid: keep items equal width + tight gap (optional tweak) */
.product-recommendations .resource-list--grid {
  display: grid !important;
  grid-template-columns: var(--resource-list-columns-mobile) !important;
  column-gap: var(--resource-list-column-gap-desktop) !important;
  row-gap: var(--resource-list-row-gap-desktop) !important;
}

@media (min-width: 750px) {
  .product-recommendations .resource-list--grid {
    grid-template-columns: var(--resource-list-columns) !important;
  }
}

/* 2) Force each grid item to allow full-width children */
.product-recommendations .resource-list__item {
  min-width: 0 !important;
}

/* 3) CRITICAL: make the product-card wrapper a vertical stack */
.product-recommendations .resource-list__item :where(.product-card, .card, .card-wrapper) {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

/* 4) CRITICAL: force media wrapper to be full-width block */
.product-recommendations .resource-list__item :where(.product-card__media, .card__media, .media) {
  display: block !important;
  width: 100% !important;
}

/* 5) Make the image itself fill the media area consistently */
.product-recommendations .resource-list__item :where(.product-card__media img, .card__media img, .media img, img) {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

/* 6) Optional: enforce consistent “frame” shape for all images
   Pick ONE ratio:
   - 1/1 (square, editorial)
   - 4/5 (slightly taller)
*/
.product-recommendations .resource-list__item :where(.product-card__media, .card__media, .media) {
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

/* If you prefer no crop: contain. If you prefer luxe uniformity: cover. */
.product-recommendations .resource-list__item :where(.product-card__media img, .card__media img, .media img) {
  height: 100% !important;
  object-fit: cover !important;   /* change to contain if needed */
  object-position: center !important;
}

/* 7) Center + breathing room for title/price */
.product-recommendations .resource-list__item :where(.product-card__content, .card__content, .card__information, .card-information) {
  text-align: center !important;
  padding-top: 14px !important;
}

.product-recommendations .resource-list__item :where(.product-card__title, .card__heading, .card-information__text) {
  margin: 0 0 8px 0 !important;
}

.product-recommendations .resource-list__item .price {
  margin: 0 !important;
  display: block;
  text-align: center !important;
}

.product-recommendations .resource-list--grid {
  column-gap: 12px !important;
  row-gap: 18px !important;
}

 /* =========================================================
   WLG • Cart Page (main-cart.liquid)
   Targets: cart-items-component + .cart-page + summary column
   ========================================================= */

 /*  0) Make the cart section behave like a clean stacking context */ 
cart-items-component.cart-items-component {
  display: block;
  position: relative;
  overflow: hidden; /* prevents 1px seams from background layer */
}

/* Ensure section background covers perfectly*/
cart-items-component.cart-items-component  .section-background {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: translateZ(0);
  pointer-events: none;
}

/* 1) WLG page width + breathing room */
cart-items-component .section.section--page-width,
cart-items-component .section.section--full-width {
  padding: 18px, 18px, 18px, 18px,
}

/* 2) Cart grid refinement (items + summary)
   Your theme already does grid; we just make it feel intentional.

Desktop: lock the summary column to a calm readable width 

 3) Title spacing (make it feel like a page header, not a block)*/ 
.cart-page__title {
  padding-top: 18px;
  padding-bottom: 6px;
}

/* 4) Items column: add subtle separators + tighten vertical rhythm */
.cart-page__items {
  min-width: 0;
}

/* We don't know the inner markup of _cart-products, so we add safe styling hooks:
   - apply separators between direct children rows if they exist */ 

.cart-page__items > * + * {
  border-top: 1px solid rgba(41, 39, 35, 0.12);
  margin-top: 16px;
  padding-top: 16px;
}

/* 5) Summary column: give it a calm WLG “card” treatment */
.cart-page__summary {
  padding-top: 0 !important;
}


/* Create the card feel on the summary’s first child wrapper */ 
.cart-page__summary > * {
  background: rgba(255, 255, 255, 0.34);
  border: 1px solid rgba(41, 39, 35, 0.14);
  padding: 18px 18px 16px;
}

/* 6) Checkout hierarchy
   Make the primary checkout button the hero,
   and visually calm down the accelerated checkout stack. */

.cart-page__summary :where(button[name="checkout"], button[type="submit"].cart__checkout, .cart__checkout-button) {
  width: 100% !important;
  min-height: 52px !important;
  border-radius: 999px !important;
  font-weight: 600;
}

/* Express buttons stack (Shop Pay / PayPal / GPay)
   - keep visible
   - reduce dominance
   - unify spacing */

.cart-page__summary :where(.dynamic-checkout, .dynamic-checkout__content, .additional-checkout-buttons) {
  margin-top: 18px !important;
  opacity: 0.92;
}

.cart-page__summary :where(.dynamic-checkout__content) > * {
  border-radius: 12px !important;
  overflow: hidden;
}

/* 7) Quantity control normalization (common patterns)
   This won’t break if your theme uses different markup — it just helps if present. */

.cart-page :where(.quantity, .quantity-selector, .quantity__input-wrapper) {
  border-radius: 999px !important;
  overflow: hidden;
}

.cart-page :where(.quantity__button, button.quantity-minus, button.quantity-plus) {
  width: 44px !important;
  height: 44px !important;
  display: grid !important;
  place-items: center !important;
}

.cart-page :where(.quantity__input, input.quantity__input) {
  height: 44px !important;
  width: 52px !important;
  text-align: center !important;
}

 /* =========================================================
   WLG • Cart Summary (cart-summary.liquid + cart-summary snippet)
   Goal: calmer hierarchy, less “button wall”, better typography
   ========================================================= */

/* Summary container: keep it calm and aligned */
.cart__summary-container {
  border: 10px solid rgba(41, 39, 35, 0.14) !important;
  background: transparent !important;
}


/* If header is sticky, keep your existing offset behavior */ 
body:has(> #header-group .header[sticky]) .cart__summary-inner {
  top: var(--header-height, 0);
}

/* Tighten the “Estimated total” row and improve emphasis */
.cart-page__summary .cart__summary-item {
  gap: 12px;
}

.cart-page__summary .cart__total {
  font-weight: 700 !important;
  font-size: 1.08rem;
}

/* Tax note: smaller + subdued */
.cart-page__summary .cart__summary-item.tax-note,
.cart-page__summary .cart__tax-note {
  font-size: 0.95rem !important;
  color: rgba(41, 39, 35, 0.70) !important;
}

/* Discount line: keep it tidy */
.cart-page__summary .cart__discount-label {
  gap: 8px !important;
}

 /*---------------------------------------------------------
   Checkout buttons hierarchy
   --------------------------------------------------------- */

/* Primary checkout button: WLG hero */
.cart-page__summary :where(button[name="checkout"], .cart__checkout-button, button[type="submit"]) {
  width: 100% !important;
  min-height: 52px !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
}

 /* Accelerated buttons: calm them down + reduce “giant wall” */
.cart-page__summary :where(.dynamic-checkout__content, .additional-checkout-buttons) {
  margin-top: 8px !important;
  display: grid !important;
  gap: 10px !important;
  opacity: 0.92;
}

/* Make the accelerated buttons a little less tall and less aggressive */
.cart-page__summary :where(.dynamic-checkout__content) iframe,
.cart-page__summary :where(.dynamic-checkout__content) > * {
  border-radius: 12px !important;
  overflow: hidden;
}

/* Optional: cap the accelerated buttons area so it doesn’t dominate */
@media (min-width: 750px) {
  .cart-page__summary :where(.dynamic-checkout__content, .additional-checkout-buttons) {
    max-height: 260px;
    overflow: auto;
    padding-right: 2px; /* prevents scrollbar clipping */
  }
}

/* WLG — Cart: control summary width safely (no fixed inner sidebar) */
@media (min-width: 750px) {
  .template-cart .cart-page__summary {
    width: 100%;
    max-width: 460px;
    justify-self: end;
  }

  .template-cart .cart-page__summary .cart__summary-container,
  .template-cart .cart-page__summary .cart__summary-inner {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}


 /* =========================================================
   WLG • Cart Summary Final Polish
   Files involved:
   - blocks/cart-summary.liquid (wrapper)
   - snippets/cart-summary.liquid (totals + ctas)
   ========================================================= */ 

/*--- Summary container: soften lines, calm background --- */
.cart-page__summary .cart__summary-container {
  background: transparent !important;
  border: 10px solid rgba(41,39,35,0.14) !important;
}

/* Your block centers everything by default; make it editorial */
.cart-page__summary .cart__summary-inner {
  align-items: stretch !important;
  text-align: left !important;
  gap: 14px !important;
}

/* Remove “receipt harshness” from the internal borders */
.cart-page__summary .cart-actions {
  border-block-color: rgba(41,39,35,0.14) !important;
}

.cart-page__summary .cart-actions__divider {
  border-block-start-color: rgba(41,39,35,0.14) !important;
}

/* This rule in snippet adds a top border when no cart-actions exists */
.cart-page__summary .cart__summary-totals:not(:has(.cart-actions)) {
  border-block-start: 1px solid rgba(41,39,35,0.14) !important;
  padding-block-start: 14px !important;
  margin-block-start: 10px !important;
}

/* --- Total row hierarchy ---*/
.cart-page__summary .cart__total {
  font-weight: 700 !important;
  letter-spacing: 0.01em;
}

.cart-page__summary .cart__total-label {
  font-size: 1.05rem;
}

.cart-page__summary .cart__total-value {
  font-size: 1.1rem;
}

.cart-page__summary .cart__installments {
  font-size: 0.95rem !important;
  color: rgba(41,39,35,0.72) !important;
}

.cart-page__summary .cart__installments a {
  color: rgba(41,39,35,0.72) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Tax note: calm */
.cart-page__summary .tax-note,
.cart-page__summary .cart__tax-note {
  font-size: 0.95rem !important;
  color: rgba(41,39,35,0.70) !important;
}

/* --- CTA stack --- */
.cart-page__summary .cart__ctas {
  display: grid;
  gap: 12px;
  margin-top: 6px;
}

/* Primary Checkout button: match WLG rounded luxe geometry*/ 
.cart-page__summary .cart__checkout-button.button {
  width: 100% !important;
  min-height: 54px !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
}

/* Accelerated checkout buttons:
   keep visible, but reduce dominance & unify spacing*/
.cart-page__summary .additional-checkout-buttons {
  display: grid;
  gap: 10px;
  opacity: 0.92;
}

/* The accelerated buttons often inject iframes/divs — soften corners */
.cart-page__summary .additional-checkout-buttons > * {
  border-radius: 12px !important;
  overflow: hidden;
}

/* Optional: prevent the “button wall” from taking over */
@media (min-width: 750px) {
  .cart-page__summary .additional-checkout-buttons {
    max-height: 240px;
    overflow: auto;
    padding-right: 2px;
  }
}

/* =========================================================
   WLG • Cart Items Row Layout Fix
   Fixes the “giant empty middle” by making quantity auto-sized
   ========================================================= */
/* =========================================================
   WLG • Cart Items Row Layout Fix (correct syntax)
   ========================================================= */

.template-cart .cart-items__table-row {
  padding-bottom: 18px !important;
  margin-bottom: 18px !important;
}

@container cart-items (min-width: 720px) {
  .cart-items__table-row {
    grid-template-columns: 7.5rem minmax(0, 1fr) auto minmax(7.5rem, 9rem) !important;
    grid-template-areas:
      "media details quantity price"
      "media details error error" !important;
    column-gap: clamp(14px, 1.6vw, 22px) !important;
  }

  .cart-items__quantity {
    justify-content: flex-end !important;
    width: auto !important;
    margin-top: 0 !important;
  }

  .template-cart .cart-items__price {
    text-align: right !important;
    min-width: 7.5rem !important;
  }
}

  /* Keep quantity + price aligned and visually “tucked in” */
  .cart-items__quantity {
    justify-content: flex-end !important;
    width: auto !important;
    margin-top: 0 !important;
  }

  .template-cart .cart-items__price {
    text-align: right !important;
    min-width: 7.5rem !important;
  }
}

/* Media: keep tidy + consistent */
.template-cart .cart-items__media-container {
  border-radius: 10px;
}

/* Details: tighten typography and spacing */
.template-cart .cart-items__details * {
  font-size: 0.98rem !important;
}

.template-cart .cart-items__title {
  font-size: 1.05rem !important;
  line-height: 1.2;
}

/* Price inside details (the per-item price) — keep it calm */
.template-cart .cart-items__details .compare-at-price {
  opacity: 0.6;
}

/* Quantity selector + remove button: align as a composed cluster */
.template-cart .cart-items__quantity {
  gap: 10px !important;
}

/* Keep remove button from visually “floating” */
.template-cart .cart-items__remove {
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px;
  border: 1px solid rgba(41,39,35,0.14);
  background: rgba(255,255,255,0.28);
}

/* Quantity selector sizing normalization (safe override) */
.template-cart .cart-items__quantity .quantity-selector {
  height: 44px !important;
}

/* Optional: if your quantity selector uses +/- buttons inside */
.template-cart .cart-items__quantity :where(button.quantity-minus, button.quantity-plus, .quantity__button) {
  width: 44px !important;
  height: 44px !important;
  display: grid !important;
  place-items: center !important;
}

/* WLG • Cart gutters even when section is full-width */
.template-cart .cart-page {
  padding-inline: var(--page-margin);
}

/* Keep the summary panel from touching the right edge */
@media (min-width: 750px) {
  .template-cart .cart-page__summary {
    padding-right: var(--page-margin);
  }
}

/* =========================================================
   WLG • Cart summary: pull in from right edge + tighten stack
   ========================================================= */

.cart-page__summary {
  padding-top: 18; /* remove the extra top push */
}

@media (min-width: 750px) {
  /* Create a clean gutter on the right side */
 .cart__summary-inner {
    padding: 18px !important;          /* was var(--padding-5xl) */
    padding-right: 18px !important;    /* extra “off the edge” feel */
  }

  /* Reduce the vertical gap between totals/checkout buttons and shop buttons */
 .cart__summary-inner {
    gap: 18px !important; /* was var(--gap-2xl) */
  }

  /* Accelerated checkout buttons: keep them visually attached */
  .additional-checkout-buttons {
    margin-top: 6px;
  }
}

  /* WLG • Cart rows: tighten vertical rhythm so summary feels closer */
  .cart-items__table-row {
    padding-bottom: 14px !important;
    margin-bottom: 14px !important;
  }

  .cart-items--dividers .cart-items__table-row {
    margin-bottom: 14px !important;
  }

/* WLG — Cart: pull summary off the viewport edge */
.cart-page__summary {
  padding-inline-end: var(--page-margin) !important;
}

/* Optional: match left column breathing room (if you want symmetry) */
.cart-page__items {
  padding-inline-start: var(--page-margin) !important;
}

.cart-page__summary {
  padding-inline-end: 18px !important;
}

/* WLG — Cart: force left/right gutter even when summary is sticky */
@media (min-width: 750px) {
  .cart-items-component .cart-page {
    padding-inline: var(--page-margin) !important;
  }
}

@media (min-width: 750px) {
  .cart-items-component .cart-page {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
}

/* ===========================================================
   WLG — CART PRODUCTS: spacing + price alignment (cart-only)
   =========================================================== */

/* 1) Give the whole row more breathing room between thumbnail and text */
.cart-items__table-row{
  column-gap: 24px !important; /* more air than var(--gap-md) */
}

/* Optional: give details cell a tiny cushion so it never kisses the thumbnail */
.cart-items__details{
  padding-left: 8px;
}

/* 2) Desktop layout: reserve real columns for qty + price*/
@container cart-items (min-width: 720px){
  .cart-items__table-row{
    /* media | details | qty | price */ 
    grid-template-columns: 7.5rem minmax(0, 1fr) max-content: minmax(9rem, max-content) !important;
    align-items: center;  /* keeps qty/price centered vertically with title block */
  }

  /* Qty stays where it belongs */
  .cart-items__quantity{
    justify-self: start;
    margin-top: 0 !important;
  }

  /* Price becomes a true far-right column */
  .cart-items__price{
    justify-self: end;
    text-align: right;
    padding-left: 18px; /* visual separation from qty pill */
    min-width: 9rem;    /* keeps it from collapsing into the middle */
  }
}   

/* ===========================================================
   WLG • Cart polish — spacing + column breathing room
   Safe: affects cart only (does NOT touch product page qty UI)
   =========================================================== */

/* More air between thumbnail and text */
.cart-items__table-row{
  column-gap: clamp(16px, 2.2vw, 34px) !important;
  }

/* Ensure the media cell doesn't feel glued to the title */
.cart-items__media-container{
  margin-inline-end: clamp(10px, 1.2vw, 18px);
  }

/* ===========================================================
   WLG • Cart row grid: protect the description column
   media | details (1fr) | qty (max) | price (max)
   =========================================================== */

  /* Stop ugly mid-word breaks in the title */
  .cart-items__title{
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: auto;
  }

  /* Add breathing room between qty + price */
  .cart-items__price{
    padding-inline-start: clamp(16px, 2vw, 28px) !important;
  }

/* ===========================================================
   WLG • Cart row grid: protect the description column
   media | details (1fr) | qty (max) | price (max)
   =========================================================== */

  /* Stop ugly mid-word breaks in the title */
  .cart-items__title{
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: auto;
  }

  /* Add breathing room between qty + price */
  .cart-items__price{
    padding-inline-start: clamp(16px, 2vw, 28px) !important;
  }

/* ===========================================================
   WLG • Cart row grid: protect the description column
   media | details (1fr) | qty (max) | price (max)
   =========================================================== */


 /* Stop ugly mid-word breaks in the title */
  .cart-items__title{
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: auto;
  }

  /* Add breathing room between qty + price */
  .cart-items__price{
    padding-inline-start: clamp(16px, 2vw, 28px) !important;
  }
}
/* ===========================================================
   WLG • Cart item row layout fix (desktop)
   Keeps quantity compact, gives details room, pushes price right
   =========================================================== */

@container cart-items (min-width: 720px) {
  .cart-items__table-row {
     /*Slightly smaller image column + bigger detail column*/ 
    column-gap: var(--gap-xl);
    align-items: start;
    }
  
  /* Give the details a touch more breathing room from the image */
  .cart-items__details {
    padding-inline-start: var(--gap-sm);
  }

  /* Make sure quantity + price sit to the right edge of their columns */
  .cart-items__quantity,
  .cart-items__price {
    justify-self: end;
  }
}

/* CART: pull only the image left (does not change other columns) */
@container cart-items (min-width: 720px) {
  .cart-items.spacing-style .cart-items__media {
    /* Use the same padding the wrapper adds, so we offset it cleanly */
    margin-inline-start: calc(-1 * var(--padding-inline-start, 0px));
  }

  /* optional: prevents any weird shrinking if the browser tries to */
  .cart-items__media-container {
    width: 100%;
  }
}
/* CART: pull only the image left (does not change other columns) */
@container cart-items (min-width: 720px) {
  .cart-items.spacing-style .cart-items__media {
    /* Use the same padding the wrapper adds, so we offset it cleanly */
    margin-inline-start: calc(-1 * var(--padding-inline-start, 0px));
  }

  /* optional: prevents any weird shrinking if the browser tries to */
  .cart-items__media-container {
    width: 100%;
  }
}

/* CART: nudge ONLY the media cell left (doesn't change other columns) */
@container cart-items (min-width: 720px) {
  .cart-items.spacing-style .cart-items__media {
    justify-self: start;
    margin-inline-start: calc(-1 * var(--padding-inline-start, 0px));
  }

  /* keep the image aligned to the left within its own box */
  .cart-items__media-container {
    justify-content: flex-start;
  }
}

@container cart-items (min-width: 720px) {
  .cart-items__media { margin-inline-start: -24px; }
}

/* CART: pull ONLY the product image cell back to the left edge of the cart-items padding */
@container cart-items (min-width: 720px) {
  .cart-items.spacing-style .cart-items__media {
    margin-inline-start: calc(-1 * var(--padding-inline-start));
    justify-self: start;
  }

  /* optional: ensure the link/img hugs the left inside its cell */
  .cart-items.spacing-style .cart-items__media-container {
    justify-content: flex-start;
  }
}

/* CART: pull ONLY the product image cell left (no column changes) */
@media (min-width: 750px) {
  .cart-items.spacing-style .cart-items__media {
    /* use the inline spacing var if present; otherwise fallback */
    margin-inline-start: calc(-1 * var(--padding-inline-start, 42px)) !important;
    justify-self: start !important;
  }

  .cart-items.spacing-style .cart-items__media-container {
    justify-content: flex-start !important;
  }
}

/* CART — nudge the product thumbnail left WITHOUT changing grid columns */
@media (min-width: 750px) {
  /* allow the thumbnail to slide into the row’s left padding area */
  .cart-items__table-row > .cart-items__media {
    overflow: visible !important;
  }

  /* move the clickable thumbnail left */
  .cart-items__table-row > .cart-items__media .cart-items__media-container {
    transform: translateX(-24px) !important; /* try -16px to -36px */
  }
}

@media (min-width: 750px) {
  .cart-items__table-row {
    column-gap: calc(var(--gap-md) + 10px) !important; /* increase space between columns */
  }
}

.cart-page__title h1.h2 {
  font-family: "Athelas", serif;
  font-weight: 700;
  letter-spacing: 0.02em;
  font-size: clamp(1.5rem, 2.2vw, 1.85rem);
  text-transform: none;
}

/* ===========================================================
   WLG — CART: typography polish
   =========================================================== */

/* Meaning eyebrow */
.wlg-cart-meaning__eyebrow {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-weight: 500;
  letter-spacing: 0.12em;
  font-size: 0.78rem;
}

/* Meaning title */
.wlg-cart-meaning__title {
  font-family: "Athelas", serif;
  font-weight: 700;
  letter-spacing: 0.01em;
  font-size: clamp(2rem, 2.6vw, 3rem);
  line-height: 1.06;
}

/* Meaning body */
.wlg-cart-meaning__body,
.wlg-cart-meaning__body p {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.65;
}

/* “Your Selections” title */
.cart-page__title :is(h1, h2, .h2) {
  font-family: "Athelas", serif;
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* ===========================================================
   WLG • CART GRID OWNER (wlg-dev-main.css)
   Overrides theme styles.css cart grid (cart-page -> 1fr)
   =========================================================== */

/* Keep columns from collapsing due to overflow */
.cart-page > * {
  min-width: 0 !important;
}

/* Column placement (safe even if some sections don’t exist) */
.cart-page__items {
  grid-column: 1 / span 2 !important;
}
 .cart-page__summary {
  grid-column: 3 !important;
  width: 100% !important;
  justify-self: end !important;
  align-self: start !important;
}

/* Tablet: stack items + summary */
@media (max-width: 990px) {
  .cart-page__items,
  .cart-page__summary {
    grid-column: 1 / -1 !important;
  }
}

/* Mobile: keep it simple (single column) */
@media (max-width: 749px) {
  .cart-page {
    gap: 16px !important;
  }
}

/* ===========================================================
   WLG • CART GRID OWNER — HERITAGE
   =========================================================== */

/* Prevent column collapse */
.cart-page > * {
  min-width: 0 !important;
}
/* Middle column must fully occupy its grid cell */
.cart-page__items {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  justify-self: stretch !important;
}


/* =========================================================
   WLG • CART TABLE LAYOUT — HERITAGE (FINAL)
   ========================================================= */

.cart-items {
  table-layout: fixed !important;
  width: 100% !important;
}
td.cart-items__media {
  width: 126px !important;
}

td#productInformation {
  width: auto !important;
}

td.cart-items__quantity {
  width: 160px !important;
  text-align: left !important;   /* critical */
}

td.cart-items__price {
  width: 140px !important;
  text-align: right !important;
}

/* =========================================================
   WLG • CART PAGE WIDTH NORMALIZATION (Heritage)
   Align cart-page spacing wrapper with section__page-width
   ========================================================= */

.cart-page.spacing-style {
  width:1560px !important;
  max-width: 1560px !important;
  margin: 0 !important;
  padding-inline: 6px !important; /* remove competing gutters */
}

/* Ensure the theme page-width wrapper is the true constraint */
.section__page-width {
  width: 100% !important;
  max-width: 1560px !important; /* matches what you’re seeing; keep or swap to var if you have one */
  margin-inline: auto !important;
  padding-inline: 18px !important;
}

/* ============================================================
   WLG CART • Step 1
   Goal:
   - Make the 3 columns behave like true columns (contained)
   - Tie "Your Selections" to the middle column
   - Make left and right column heights match the middle (grid stretch)
   ============================================================ */

/* Scope to cart template safely */
body.template-cart .cart-page.spacing-style {
  /* 3-column grid */
  column-gap: clamp(20px, 2vw, 36px);
  row-gap: 18px;

  /* THIS is what makes all columns share height */
  align-items: stretch;

  /* Containment */
  width: 100%;
  max-width: var(--page-width);
  margin-inline: auto;
}

/* Assign grid areas (your markup already uses these classes) */
.cart-page__meaning { grid-area: meaning; }
.cart-page__title   { grid-area: title; }
.cart-page__items   { grid-area: items; }
.cart-page__summary { grid-area: summary; }

/* Make each column behave like a “card” that can stretch */
.cart-page__meaning,
.cart-page__items,
.cart-page__summary {
  min-width: 0;           /* critical for preventing overflow */
  height: 100%;           /* allows stretch within grid row */
  align-self: stretch;
}

/* Tie the title visually to the items column */
.cart-page__title {
  margin: 0;
  padding: 0 0 12px 0;
  border-bottom: 1px solid rgba(58, 77, 66, 0.18);
}

/* Ensure the items wrapper actually fills the middle column */
.cart-page__items {
  width: 100%;
}

.cart-items.spacing-style {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* If any internal block is forcing overflow, this clamps it */
.cart-items__table,
.cart-items__table-row {
  max-width: 100%;
}

/* ===========================================================
   WLG • Header cart count badge — fix “gold square”
   Works for Heritage-style cart bubbles / counts
   =========================================================== */

/* Common badge selectors across Shopify themes */
.header__icon--cart .cart-count-bubble,
.header__icon--cart .cart-count,
.header__icon--cart [data-cart-count],
.header__icon--cart .count-bubble,
.header__icon--cart .header__cart-count {
  position: absolute !important;
  top: -6px !important;
  right: -8px !important;

  min-width: 18px !important;
  height: 18px !important;
  padding: 0 6px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  background: var(--golden-tisane, #C78830) !important;
  color: #FFFFFF !important;

  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  box-sizing: border-box !important;
  z-index: 50 !important;
}

/* If the theme draws the badge using pseudo elements */
.header__icon--cart .cart-count-bubble::before,
.header__icon--cart .cart-count-bubble::after,
.header__icon--cart .count-bubble::before,
.header__icon--cart .count-bubble::after {
  content: none !important;
}

/* If the number is inside a child span (common) */
.header__icon--cart .cart-count-bubble span,
.header__icon--cart .count-bubble span,
.header__icon--cart .header__cart-count span {
  color: #FFFFFF !important;
  opacity: 1 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.header__icon--cart {
  position: relative !important;
}

/* ===========================================================
   WLG • Header cart bubble (Heritage) — fix gold square
   Markup:
   .cart-bubble
   .cart-bubble__background
   .cart-bubble__text / .cart-bubble__text-count
   =========================================================== */

/* Ensure the icon container can anchor an absolute badge */
.header__icon--cart,
a[href*="/cart"] .header__icon,
.header__icon-cart {
  position: relative;
}

/* The badge wrapper */
.cart-bubble {
  position: absolute;
  top: -6px;
  right: -8px;

  min-width: 18px;
  height: 18px;
  padding: 0 6px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 999px;
  overflow: hidden;

  /* optional: tiny outline to feel crisp on Stone Ivory */
  box-shadow: 0 0 0 1px rgba(41,39,35,0.10);

  z-index: 50;
}

/* The background span that was showing as a square */
.cart-bubble__background {
  position: absolute;
  inset: 0;

  background: var(--golden-tisane, #C78830);
  border-radius: 999px;

  /* important: prevents background span from behaving like a block “square” */
  display: block;
}

/* The number */
.cart-bubble__text {
  position: relative; /* sits above background */
  z-index: 1;

  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.cart-bubble__text-count {
  color: #FFFFFF;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.cart-bubble,
.cart-bubble__background {
  border-radius: 999px !important;
}
/* ===========================================================
   WLG • Cart bubble — NUCLEAR FIX (kill the gold square)
   We hide the background span and style the wrapper as the badge.
   =========================================================== */

/* Ensure cart icon can anchor an absolute badge */
.header__icon--cart { position: relative !important; }

/* The badge wrapper becomes the only background */
.cart-bubble {
  position: absolute !important;
  top: -6px !important;
  right: -8px !important;

  min-width: 18px !important;
  height: 18px !important;
  padding: 0 6px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  overflow: hidden !important;

  background: var(--golden-tisane, #C78830) !important;
  z-index: 999 !important;
}

/* Kill the element that is showing as a square */
.cart-bubble__background {
  display: none !important;
}

/* Keep the text above */
.cart-bubble__text {
  position: relative !important;
  z-index: 1 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Count styling */
.cart-bubble__text-count {
  color:  #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
/* ===========================================================
   WLG • Header cart bubble — HARD FIX (wins cascade)
   Targeting exactly: div.cart-bubble > span.cart-bubble__background
   =========================================================== */

/* anchor for absolute positioning */
.header__icon--cart,
.header__icons,
.header__icons-wrapper,
.header__icon {
  position: relative;
}

/* the badge wrapper (this is the circle/pill) */
.header__icon--cart .cart-bubble {
  position: absolute !important;
  top: -6px !important;
  right: -8px !important;

  min-width: 18px !important;
  height: 18px !important;
  padding: 0 6px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  overflow: hidden !important;

  background: var(--golden-tisane, #C78830) !important;
  z-index: 9999 !important;
}

/* KILL the square background span (your screenshot shows this is the square) */
.header__icon--cart .cart-bubble > span.cart-bubble__background,
.header__icon--cart .cart-bubble span.cart-bubble__background {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  background: transparent !important;
}

/* make sure count is visible and on top */
.header__icon--cart .cart-bubble .cart-bubble__text,
.header__icon--cart .cart-bubble #cart-bubble-text {
  position: relative !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.header__icon--cart .cart-bubble .cart-bubble__text-count {
  color:  #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* ===========================================================
   WLG • Cart page — Product List / "Our bestsellers" section polish
   Targets: #shopify-section-template--*__product_list_*
   =========================================================== */

/* 1) Kill the blue background coming from the section color-scheme */
[id^="shopify-section-template--"][id*="__product_list_"] .section-background {
  background: transparent !important;
}

/* 2) Give the whole section a WLG “card” presence + consistent width */
[id^="shopify-section-template--"][id*="__product_list_"] .section.section--page-width {
  background: rgba(255, 255, 255, 0.35) !important;
  border: 1px solid rgba(41, 39, 35, 0.12) !important;
  border-radius: 18px !important;
  padding: 28px 22px !important;
}

/* 3) Header alignment: center “Our bestsellers” + “View all” */
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header {
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 18px !important;
  text-align: center !important;
  margin-bottom: 16px !important;
}

/* “View all” as a subtle editorial link */
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header a {
  color: var(--ink-charcoal, #292723) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(41, 39, 35, 0.25) !important;
  padding-bottom: 2px !important;
  transition: border-color 0.2s ease, opacity 0.2s ease !important;
}
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header a:hover {
  border-color: rgba(199, 136, 48, 0.9) !important; /* Golden Tisane */
  opacity: 0.95 !important;
}

/* 4) Make the product list feel intentional: centered row, clean spacing */
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list {
  justify-content: center !important;
}

/* 5) Product cards: soft stone + luxe border (works whether it’s cards or tiles) */
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list .card,
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list .product-card,
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list a {
  border-radius: 14px !important;
}

/* If the theme uses a generic "card" wrapper, give it a WLG frame */
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list .card {
  background: rgba(237, 230, 220, 0.55) !important; /* Stone Ivory wash */
  border: 1px solid rgba(41, 39, 35, 0.12) !important;
  box-shadow: none !important;
  transition: transform 0.18s ease, border-color 0.18s ease !important;
}

[id^="shopify-section-template--"][id*="__product_list_"] .resource-list .card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(199, 136, 48, 0.35) !important;
}

/* 6) Typography cleanup (prevents the “default blue theme” look) */
[id^="shopify-section-template--"][id*="__product_list_"] * {
  color: var(--ink-charcoal, #292723);
}
[id^="shopify-section-template--"][id*="__product_list_"] {
  margin-top: 28px !important;
}
[id^="shopify-section-template--"][id*="__product_list_"] {
  margin-top: 28px !important;
}

/* ===========================================================
   WLG • Cart page — Force "Our bestsellers" to a 4-card GRID
   Targets: #shopify-section-template--*__product_list_*
   =========================================================== */

[id^="shopify-section-template--"][id*="__product_list_"] {
  margin-top: 28px !important;
}

/* Make sure the inner section isn't acting like a carousel frame */
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list__carousel,
[id^="shopify-section-template--"][id*="__product_list_"] [data-testid="resource-list-grid"] {
  overflow: visible !important;
}

/* The actual grid: 4 across desktop */
@media (min-width: 990px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .resource-list,
  [id^="shopify-section-template--"][id*="__product_list_"] [data-testid="resource-list-grid"] {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 22px !important;
    width: 100% !important;
    max-width: none !important;
    justify-items: stretch !important;
    align-items: start !important;
  }
}

/* Tablet: 2 across */
@media (min-width: 750px) and (max-width: 989px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .resource-list,
  [id^="shopify-section-template--"][id*="__product_list_"] [data-testid="resource-list-grid"] {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }
}

/* Mobile: 1 across */
@media (max-width: 749px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .resource-list,
  [id^="shopify-section-template--"][id*="__product_list_"] [data-testid="resource-list-grid"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

/* Kill any "carousel item width" variables causing weird sizing */
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list {
  --mobile-card-size: initial !important;
}

/* Make each item behave like a normal grid cell */
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list > * {
  width: auto !important;
  max-width: none !important;
}

/* Card + image styling to match your standard (square with small break) */
[id^="shopify-section-template--"][id*="__product_list_"] .card,
[id^="shopify-section-template--"][id*="__product_list_"] .product-card,
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list a {
  border-radius: 8px !important; /* "square with tiny break" */
  overflow: hidden !important;
}

/* Ensure images fill their frame and don't turn into tall slivers */
[id^="shopify-section-template--"][id*="__product_list_"] img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: cover !important;
}

/* If theme wraps image in a media container, lock to square */
[id^="shopify-section-template--"][id*="__product_list_"] .media,
[id^="shopify-section-template--"][id*="__product_list_"] .card__media,
[id^="shopify-section-template--"][id*="__product_list_"] .product-card__image {
  aspect-ratio: 1 / 1 !important;
}

/* ===========================================================
   WLG • Cart bestsellers — Image standard (not square)
   Consistent card frames + soft-square corners
   =========================================================== */

/* Card frame */
[id^="shopify-section-template--"][id*="__product_list_"] .card,
[id^="shopify-section-template--"][id*="__product_list_"] .product-card,
[id^="shopify-section-template--"][id*="__product_list_"] .resource-list a {
  border-radius: 10px !important;  /* your “tiny break” */
  overflow: hidden !important;
}

/* Make the image area a consistent editorial window */
[id^="shopify-section-template--"][id*="__product_list_"] .media,
[id^="shopify-section-template--"][id*="__product_list_"] .card__media,
[id^="shopify-section-template--"][id*="__product_list_"] .product-card__image,
[id^="shopify-section-template--"][id*="__product_list_"] .card__media img,
[id^="shopify-section-template--"][id*="__product_list_"] .media img {
  width: 100% !important;
  display: block !important;
}

/* Desktop frame height (prevents “tall skinny sliver” look) */
@media (min-width: 990px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .media,
  [id^="shopify-section-template--"][id*="__product_list_"] .card__media,
  [id^="shopify-section-template--"][id*="__product_list_"] .product-card__image {
    height: 220px !important;     /* tune 200–240 to taste */
    overflow: hidden !important;
    border-radius: 10px !important;
  }

  [id^="shopify-section-template--"][id*="__product_list_"] .media img,
  [id^="shopify-section-template--"][id*="__product_list_"] .card__media img,
  [id^="shopify-section-template--"][id*="__product_list_"] .product-card__image img,
  [id^="shopify-section-template--"][id*="__product_list_"] img {
    height: 100% !important;
    object-fit: cover !important;    /* crops gently, like your standard */
    object-position: center !important;
  }
}

/* Tablet */
@media (min-width: 750px) and (max-width: 989px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .media,
  [id^="shopify-section-template--"][id*="__product_list_"] .card__media,
  [id^="shopify-section-template--"][id*="__product_list_"] .product-card__image {
    height: 200px !important;
  }
}

/* Mobile */
@media (max-width: 749px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .media,
  [id^="shopify-section-template--"][id*="__product_list_"] .card__media,
  [id^="shopify-section-template--"][id*="__product_list_"] .product-card__image {
    height: 190px !important;
  }
}

@media (min-width: 990px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .section.section--page-width {
    max-width: 1400px !important; /* or 100% if you want true full-bleed */
  }
}

@media (min-width: 990px) {
  [id^="shopify-section-template--"][id*="__product_list_"] .section.section--page-width {
    max-width: none !important;
    width: 100% !important;
  }
}

/* ===========================================================
   WLG • Cart Page — "Collections / Bestsellers" Resource List
   Force a true grid + WLG card image standard
   Scope: cart template only
   =========================================================== */

main[data-template="cart"] .section-resource-list {
  width: 100%;
}

/* 1) Center the "Our bestsellers / View all" header nicely */
main[data-template="cart"] .section-resource-list__header {
  display: grid;
  grid-template-columns: 1fr auto 1fr; /* left spacer | title | right spacer */
  align-items: center;
  margin-bottom: 16px;
}

/* Title block centered */
main[data-template="cart"] .section-resource-list__header .section__heading,
main[data-template="cart"] .section-resource-list__header h2,
main[data-template="cart"] .section-resource-list__header .heading {
  grid-column: 2;
  justify-self: center;
  text-align: center;
}

/* "View all" aligned right */
main[data-template="cart"] .section-resource-list__header a,
main[data-template="cart"] .section-resource-list__header .link {
  grid-column: 3;
  justify-self: end;
}

/* 2) Force the resource list to be a real grid (NOT carousel sizing) */
main[data-template="cart"] .resource-list,
main[data-template="cart"] .resource-list--grid,
main[data-template="cart"] [data-testid="resource-list-grid"] {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}

/* Some themes set fit-content or carousel sizing via inline variables.
   We override by forcing the grid template and removing "card-size" behavior. */
main[data-template="cart"] .resource-list--grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  justify-items: stretch;
  align-items: start;
}

/* Ensure items don’t inherit narrow widths */
main[data-template="cart"] .resource-list__item {
  width: 100% !important;
  max-width: 100% !important;
}

/* Breakpoints: 2-up tablet, 1-up mobile */
@media (max-width: 989px) {
  main[data-template="cart"] .resource-list--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 749px) {
  main[data-template="cart"] .resource-list--grid {
    grid-template-columns: 1fr;
  }
}

/* 3) WLG “image standard”: square-ish, small radius, clean crop */
main[data-template="cart"] product-card .product-card__media,
main[data-template="cart"] .product-card .product-card__media,
main[data-template="cart"] .product-card__media,
main[data-template="cart"] .card__media,
main[data-template="cart"] .media {
  border-radius: 8px;           /* small break, not rounded */
  overflow: hidden;
}

/* Force a consistent square image box */
main[data-template="cart"] product-card .product-card__media,
main[data-template="cart"] .product-card .product-card__media,
main[data-template="cart"] .product-card__media {
  aspect-ratio: 1 / 1;
}

/* Ensure images crop instead of squish */
main[data-template="cart"] img {
  object-fit: cover;
}

/* 4) Optional: tighten up text area so cards don’t look super tall */
main[data-template="cart"] .product-card__content,
main[data-template="cart"] .card__content {
  padding-top: 10px;
}

/* ===========================================================
   WLG • Cart Resource List — FORCE FULL-WIDTH GRID + CARD FILL
   (Fixes skinny "poster" columns / unused space)
   =========================================================== */

/* The theme’s grid is on this element (your inspector shows it) */
main[data-template="cart"] [data-testid="resource-list-grid"] {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 100% !important;
  justify-items: stretch !important;
  align-items: start;
}

/* Ensure each grid item is allowed to stretch */
main[data-template="cart"] [data-testid="resource-list-grid"] > .resource-list__item {
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
}

/* THIS is usually the culprit: product-card or its link is fit-content */
main[data-template="cart"] [data-testid="resource-list-grid"] product-card,
main[data-template="cart"] [data-testid="resource-list-grid"] .product-card,
main[data-template="cart"] [data-testid="resource-list-grid"] product-card-link,
main[data-template="cart"] [data-testid="resource-list-grid"] .product-card__link,
main[data-template="cart"] [data-testid="resource-list-grid"] a.product-card__link {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
}

/* If the theme uses “size-style” / “fit-content” width tokens, kill them */
main[data-template="cart"] [data-testid="resource-list-grid"] .size-style,
main[data-template="cart"] [data-testid="resource-list-grid"] .size-style * {
  max-width: none !important;
}

/* Breakpoints */
@media (max-width: 989px) {
  main[data-template="cart"] [data-testid="resource-list-grid"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 749px) {
  main[data-template="cart"] [data-testid="resource-list-grid"] {
    grid-template-columns: 1fr !important;
  }
}

main[data-template="cart"] .i-test-product-list {
  outline: 6px solid #C78830 !important;
}

/* =========================================================
   CART • "Our bestsellers" product list (resource-list)
   Force true 4-up grid + full-width cards
   ========================================================= */

main[data-template="cart"] .section-resource-list {
  /* optional: control the whole block width feel */
  width: 100%;
}

main[data-template="cart"] .section-resource-list .section-resource-list__header {
  display: flex !important;
  justify-content: center !important;
  align-items: baseline !important;
  gap: 18px !important;
  text-align: center !important;
  margin-bottom: 18px !important;
}

/* The render 'resource-list' snippet usually outputs a wrapper with .resource-list
   and a grid variant like .resource-list--grid.
   We support either possibility safely. */
main[data-template="cart"] .section-resource-list .resource-list--grid,
main[data-template="cart"] .section-resource-list [data-testid="resource-list-grid"] {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  column-gap: 18px !important;
  row-gap: 22px !important;
  justify-items: stretch !important;
  align-items: start !important;
  width: 100% !important;
}

/* Tablet / small desktop */
@media (max-width: 989px) {
  main[data-template="cart"] .section-resource-list .resource-list--grid,
  main[data-template="cart"] .section-resource-list [data-testid="resource-list-grid"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 749px) {
  main[data-template="cart"] .section-resource-list .resource-list--grid,
  main[data-template="cart"] .section-resource-list [data-testid="resource-list-grid"] {
    grid-template-columns: 1fr !important;
  }
}

/* Your actual items from the section markup */
main[data-template="cart"] .section-resource-list .resource-list__item {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

/* Kill “skinny card” behavior inside the product card stack */
main[data-template="cart"] .section-resource-list product-card,
main[data-template="cart"] .section-resource-list .product-card,
main[data-template="cart"] .section-resource-list .product-card__link,
main[data-template="cart"] .section-resource-list .card,
main[data-template="cart"] .section-resource-list .card__content {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

/* Image standard: subtle rounding, no weird clipping */
main[data-template="cart"] .section-resource-list .product-card__media,
main[data-template="cart"] .section-resource-list .media,
main[data-template="cart"] .section-resource-list img {
  border-radius: 10px !important;
  overflow: hidden !important;
}
/* =========================================================
   CART • Featured products — neutralize portrait gallery ratios
   ========================================================= */

main[data-template="cart"] .section-resource-list {
  --gallery-aspect-ratio: 1 / 1 !important;
}

/* Kill portrait locking on product cards */
main[data-template="cart"] .section-resource-list product-card {
  --gallery-aspect-ratio: 1 / 1 !important;
}

/* Slideshow containers must stretch */
main[data-template="cart"] .section-resource-list slideshow-component,
main[data-template="cart"] .section-resource-list slideshow-container,
main[data-template="cart"] .section-resource-list slideshow-slides {
  width: 100% !important;
  max-width: 100% !important;
}

/* Media container: force square behavior */
main[data-template="cart"] .section-resource-list .product-media {
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  height: auto !important;
}

/* Images fill card instead of dictating width */
main[data-template="cart"] .section-resource-list img {
  width: 100% !important;
  height: 100% !important;
}

/* Final guard: cards must stretch */
main[data-template="cart"] .section-resource-list .resource-list__item,
main[data-template="cart"] .section-resource-list .product-card {
  width: 100% !important;
  max-width: none !important;
}
/* =========================================================
   CART • Featured / Collections strip — WLG grid polish
   Targets the Resource List section rendered on cart page
   ========================================================= */

main[data-template="cart"] .section-resource-list {
  /* 1) Make every card use the SAME image ratio as your tall print card */
  --gallery-aspect-ratio: 4 / 5 !important;

  /* 2) Tighten spacing + center the whole section */
  --resource-list-column-gap-desktop: 24px !important;
  --resource-list-row-gap-desktop: 28px !important;

  margin-inline: auto !important;
  max-width: 1200px !important;
  width: 100% !important;
}

/* Tighten actual grid if the theme is using the CSS vars above */
main[data-template="cart"] .section-resource-list [data-testid="resource-list-grid"] {
  justify-items: center !important;   /* center cards in each column */
  align-items: start !important;
  gap: 28px 24px !important;          /* row-gap / column-gap */
}

/* Make all cards a consistent width so every image looks like "Wish You Were Here" */
main[data-template="cart"] .section-resource-list .resource-list__item,
main[data-template="cart"] .section-resource-list product-card,
main[data-template="cart"] .section-resource-list .product-card {
  width: 100% !important;
  max-width: 260px !important; /* adjust 240–300 to taste */
}

/* Force the media area to respect the portrait ratio consistently */
main[data-template="cart"] .section-resource-list .product-media {
  aspect-ratio: 4 / 5 !important;
  width: 100% !important;
  height: auto !important;
}

main[data-template="cart"] .section-resource-list img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 6px !important; /* your “small break” corners */
}

/* ---------------------------------------------------------
   Header: center "Our bestsellers/collections" + "View all"
   and make them WLG-style buttons
   --------------------------------------------------------- */

section--page-width.color-scheme.section-resource-list__header {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 14px !important;
  text-align: center !important;
  margin-bottom: 18px !important;
}

/* The title block (usually a heading inside) */
section--page-width.color-scheme.section-resource-list__header h2,
section--page-width.color-scheme.section-resource-list__header h3,
section--page-width.color-scheme.section-resource-list__header {
  margin: 0 !important;
}

/* Make BOTH items look like buttons (title + link).
   If your title is NOT a link, it’ll still look button-like. */
section--page-width.color-scheme.section-resource-list__header a,
section--page-width.color-scheme.section-resource-list__header h2,
section--page-width.color-scheme.section-resource-list__header h3,
section--page-width.color-scheme.section-resource-list__header .heading {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 8px 14px !important;
  border-radius: 999px !important;

  border: 1px solid rgba(41, 39, 35, 0.20) !important; /* Ink Charcoal */
  background: rgba(255, 255, 255, 0.30) !important;

  color: #292723 !important;
  text-decoration: none !important;

  font-family: var(--font-paragraph--family, inherit) !important;
  font-size: 14px !important;
  letter-spacing: 0.02em !important;
}

/* Hover “Golden Tisane” feel */
section--page-width.color-scheme.section-resource-list__header a:hover {
  border-color: rgba(199, 136, 48, 0.55) !important;
  background: rgba(199, 136, 48, 0.12) !important;
}

/* WLG — Cart / Bestsellers header: editorial alignment */
main[data-template="cart"] .section-resource-list__header {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  margin-bottom: 22px !important;
  text-align: center !important;
}

main[data-template="cart"] .section-resource-list__header a {
  padding: 6px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(41,39,35,0.25) !important;
  background: rgba(255,255,255,0.35) !important;
  font-size: 13px !important;
  letter-spacing: 0.02em !important;
  text-decoration: none !important;
}

main[data-template="cart"] .section-resource-list {
  margin-top: 20px !important;
}

/* =========================================================
   WLG • Cart — "Our bestsellers" title alignment + typography
   Matches "Your Selections" (Athelas, 22px)
   ========================================================= */

main[data-template="cart"] .section-resource-list__header {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 10px !important;
}

/* Target the actual heading text */
main[data-template="cart"] 
.section-resource-list__header 
.section__heading,
main[data-template="cart"] 
.section-resource-list__header h2,
main[data-template="cart"] 
.section-resource-list__header h3 {
  font-family: "Athelas", "Athelas Regular", serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  margin: 0 !important;

  display: block !important;
  width: 100% !important;
  text-align: center !important;
}

/* =========================================================
   WLG • Cart — Center "Our bestsellers" EXACTLY over grid
   ========================================================= */

main[data-template="cart"] .section-resource-list__header {
  width: 100% !important;
  max-width: none !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: 22px !important;
}

/* Typography match: "Your Selections" */
main[data-template="cart"]
.section-resource-list__header
.section__heading,
main[data-template="cart"]
.section-resource-list__header h2,
main[data-template="cart"]
.section-resource-list__header h3 {
  font-family: "Athelas", "Athelas Regular", serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  margin: 0 !important;
  text-align: center !important;
}

/* =========================================================
   WLG • Cart — Force injected "Our bestsellers" header to center
   Works even when content_for outputs nested wrappers
   ========================================================= */

main[data-template="cart"] .section-resource-list__header {
  /* override any theme header layout (flex, space-between, etc.) */
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  align-items: center !important;

  width: 100% !important;
  max-width: none !important;
  text-align: center !important;
  margin: 0 auto 22px !important;
}

/* Center whatever content_for spits out (wrappers, blocks, etc.) */
main[data-template="cart"] .section-resource-list__header > * {
  justify-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  width: auto !important;
  max-width: 100% !important;
}

/* Ensure the "View all" block/link centers too */
main[data-template="cart"] .section-resource-list__header a,
main[data-template="cart"] .section-resource-list__header .button,
main[data-template="cart"] .section-resource-list__header .link {
  justify-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Typography match to "Your Selections" (Athelas, 22px) */
main[data-template="cart"] .section-resource-list__header :is(
  h1, h2, h3,
  .section__heading,
  .heading,
  [class*="heading"])
{
  font-family: "Athelas", "Athelas Regular", serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  margin: 0 !important;
  text-align: center !important;
}

/* =========================================================
   CART • Center "Your Selections" (and match Athelas 22px)
   ========================================================= */

main[data-template="cart"] :is(
  .cart-page__items,
  .cart-items,
  .cart-items__wrapper,
  .main-cart,
  .cart-page
) :is(h1, h2, h3, .heading, .section__heading) {
  /* make the heading behave like a full-width block */
  display: block !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;

  /* typography match */
  font-family: "Athelas", "Athelas Regular", serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
}

/* =========================================================
   CART • Center "Our bestsellers" header (content_for safe)
   ========================================================= */

main[data-template="cart"] .section-resource-list__header {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  width: 100% !important;
  text-align: center !important;
  margin: 0 auto 22px !important;
}

/* force any injected wrapper to full width + centered text */
main[data-template="cart"] .section-resource-list__header * {
  text-align: center !important;
}

/* specifically style the heading text to match "Your Selections" */
main[data-template="cart"] .section-resource-list__header :is(
  h1, h2, h3,
  .section__heading,
  .heading,
  [class*="heading"]
) {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;

  font-family: "Athelas", "Athelas Regular", serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
}

/* =========================================================
   CART • "Our bestsellers" — true center + Athelas 22px
   Scoped to the Product List section id pattern
   ========================================================= */

/* 1) Force the header container to center whatever content_for outputs */
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  align-items: center !important;

  width: 100% !important;
  max-width: none !important;
  margin: 0 auto 18px !important;
  text-align: center !important;
}

/* 2) Neutralize any nested wrapper alignment coming from injected blocks */
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header > * {
  justify-self: center !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 3) Title typography: match "Your Selections" */
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header :is(
  h1, h2, h3,
  .section__heading,
  .heading,
  [class*="heading"]
) {
  font-family: "Athelas", "Athelas Regular", serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;

  width: 100% !important;
  margin: 0 !important;
  text-align: center !important;
}

/* 4) Keep "View all" centered under the title */
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header a,
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header .button,
[id^="shopify-section-template--"][id*="__product_list_"] .section-resource-list__header .link {
  justify-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* =========================================================
   WLG • CART — balance pillars safely (no rogue grid overrides)
   Targets your real layout container: .cart-page
   ========================================================= */

@media (min-width: 990px) {
  cart-items-component .cart-page__meaning,
  cart-items-component .cart-page__summary {
    width: 100% !important;
    max-width: 460px !important;
    box-sizing: border-box !important;
  }

  cart-items-component .cart-page__meaning { justify-self: start !important; }
  cart-items-component .cart-page__summary { justify-self: end !important; }
}

/* Divider can stay, but keep it gentle */
cart-items-component .cart-page hr,
cart-items-component .cart-page__divider {
  opacity: 0.65 !important;
}

/* =========================================================
   WLG • Cart Summary — cleaner vertical rhythm
   ========================================================= */

.cart-page__summary .cart__summary-item {
  margin: 0 !important;
  padding: 0 !important;
}

/* Space after "Estimated total" row */
.cart-page__summary .cart__summary-item.cart__total,
.cart-page__summary .cart__total {
  margin-bottom: 10px !important;
}

/* Space after installments line */
.cart-page__summary .cart__installments {
  display: block !important;
  margin-bottom: 10px !important;
}

/* Slight breathing room before tax/shipping note */
.cart-page__summary .cart__tax-note,
.cart-page__summary .cart__summary-item.tax-note {
  display: block !important;
  margin-top: 0 !important;
}

/* =========================================================
   WLG • Cart Meaning — force left inset on TEXT (wins cascade)
   ========================================================= */

/* 1) Keep the card padding as-is (whatever it's already set to) */
/* 2) Add a clean text inset inside the body content */
cart-items-component .wlg-cart-meaning__body {
  padding-left: 14px !important;   /* tune 10–18 */
  padding-right: 2px !important;
  box-sizing: border-box !important;
}

/* If your eyebrow/title also need the same inset: */
cart-items-component .wlg-cart-meaning__eyebrow,
cart-items-component .wlg-cart-meaning__title,
cart-items-component .wlg-cart-meaning__closing {
  padding-left: 14px !important;
  padding-right: 2px !important;
  box-sizing: border-box !important;
}

/* Italicize the closing line again */
.wlg-cart-meaning__closing {
  font-style: italic !important;
  font-weight: 600 !important;     /* keep it intentional but soft */
  margin-top: 14px !important;
}

/* =========================================================
   WLG • Cart Items — stable thumbnail sizing
   ========================================================= */

.cart-items__media-container,
.cart-items__media {
  width: 92px !important;          /* tune 84–104 */
  height: 92px !important;
  flex: 0 0 92px !important;
}

.cart-items__media img,
.cart-items__media-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 10px !important; /* matches your calm corners */
}

/* =========================================================
   WLG • Cart → Bestsellers transition (editorial divider)
   ========================================================= */

/* Target the featured collection section that follows the cart
   (keeps it from looking like a random heading in empty space) */
.shopify-section:has(.section-resource-list),
.shopify-section:has(.section-resource-list__header) {
  margin-top: 34px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(41,39,35,0.16) !important;
}

/* WLG • Cart primary CTA copy rhythm */
.cart-page__summary .cart__checkout-button.button {
  letter-spacing: 0.03em !important;
  text-transform: none !important;
}

/* =========================================================
   WLG — Wood Bowl Story Pages (page.wlg-wood-bowl-collection-*.json)
   Applies ONLY to sections rendered by: sections/wlg-wood-bowl-story.liquid
   ========================================================= */

.wlg-bowl-story {
  /* page rhythm */
  padding: clamp(2.25rem, 4vw, 4rem) 0;
}

.wlg-bowl-story .wlg-story__inner {
  width: min(1080px, calc(100% - 3rem));
  margin: 0 auto;
}

.wlg-bowl-story .wlg-story__header {
  margin-bottom: clamp(1.5rem, 2.5vw, 2.5rem);
}

.wlg-bowl-story .wlg-story__title {
  /* keep your brand font via global rules; just control scale/spacing */
  font-size: clamp(2.2rem, 5vw, 4.25rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  margin: 0 0 0.65rem;
}

.wlg-bowl-story .wlg-story__location {
  margin: 0;
  opacity: 0.82;
  font-size: 0.98rem;
}

/* Film block */
.wlg-bowl-story .wlg-story__film {
  margin: clamp(1.75rem, 3vw, 2.75rem) 0;
  padding-top: clamp(0.75rem, 1.5vw, 1.25rem);
}

.wlg-bowl-story .wlg-story__section-title {
  font-size: clamp(1.65rem, 2.8vw, 2.6rem);
  line-height: 1.08;
  margin: 0 0 0.85rem;
}

/* Make "Film title" feel secondary to the H1 */
.wlg-bowl-story .wlg-story__film .wlg-story__section-title {
  opacity: 0.92;
}

/* Placeholder / embed framing */
.wlg-bowl-story .wlg-video-placeholder,
.wlg-bowl-story .wlg-video-embed {
  border: 1px solid rgba(41, 39, 35, 0.18);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(237, 230, 220, 0.45); /* Stone Ivory tint */
}

.wlg-bowl-story .wlg-video-placeholder {
  padding: clamp(1.1rem, 2vw, 1.6rem);
}

.wlg-bowl-story .wlg-video-placeholder p {
  margin: 0;
  opacity: 0.86;
}

/* Responsive 16:9 iframe */
.wlg-bowl-story .wlg-video-embed {
  position: relative;
  aspect-ratio: 16 / 9;
}

.wlg-bowl-story .wlg-video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Caption */
.wlg-bowl-story .wlg-story__caption {
  margin: 0.75rem 0 0;
  opacity: 0.78;
  font-size: 0.95rem;
}

/* Two-column body: stacks on mobile, splits on desktop */
.wlg-bowl-story .wlg-story__two-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.75rem, 3vw, 2.75rem);
  margin: clamp(1.75rem, 3vw, 2.75rem) 0;
}

/* Add a quiet divider between columns on larger screens */
@media (min-width: 860px) {
  .wlg-bowl-story .wlg-story__two-col {
    grid-template-columns: 1fr 1fr;
    gap: clamp(2.25rem, 3.2vw, 3.25rem);
    position: relative;
    padding-top: 0.25rem;
  }

  .wlg-bowl-story .wlg-story__two-col::before {
    content: "";
    position: absolute;
    top: 0.35rem;
    bottom: 0.35rem;
    left: 50%;
    width: 1px;
    transform: translateX(-0.5px);
    background: rgba(41, 39, 35, 0.14);
  }
}

.wlg-bowl-story .wlg-story__col .wlg-story__section-title {
  margin-bottom: 0.75rem;
}

/* RTE typography (inherits your fonts; this just cleans spacing) */
.wlg-bowl-story .wlg-story__richtext,
.wlg-bowl-story .wlg-story__close {
  font-size: 1.03rem;
  line-height: 1.7;
}

.wlg-bowl-story .rte p {
  margin: 0 0 0.95rem;
}

.wlg-bowl-story .rte p:last-child {
  margin-bottom: 0;
}

/* Close + CTA */
.wlg-bowl-story .wlg-story__close {
  margin-top: clamp(1.25rem, 2vw, 1.75rem);
  opacity: 0.92;
}

.wlg-bowl-story .wlg-story__cta {
  margin-top: 1.15rem;
}

/* Ensure your Wild Luxe button looks intentional here */
.wlg-bowl-story .wlg-story__cta .wild-luxe-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.85rem 1.25rem;
  border-radius: 999px;
  text-decoration: none;
}

.wlg-bowl-story .wlg-story__header::after {
  content: "";
  display: block;
  width: 120px;
  height: 2px;
  margin-top: 1.25rem;
  background: rgba(41, 39, 35, 0.10);
  border-radius: 2px;
}

.wlg-bowl-story .wlg-story__film .wlg-story__section-title {
  font-size: clamp(1.35rem, 2.2vw, 2.05rem);
}

.wlg-bowl-story .wlg-story__film .wlg-story__section-title {
  font-size: clamp(1.25rem, 2vw, 1.9rem);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  opacity: 0.85;
}

.wlg-bowl-story .wlg-story__close {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  font-size: 0.95rem;
  opacity: 0.75;
}

.wlg-bowl-story {
  background-image: radial-gradient(
    rgba(199, 136, 48, 0.06) 1px,
    transparent 1px
  );
  background-size: 32px 32px;
}

/* =========================================================
   WLG — Artisan Story Pages (Maker/Partnership)
   Section: sections/wlg-artisan-story.liquid
   Goal: "maker documentary" — exhibit labels + workshop panels
   ========================================================= */

.wlg-artisan-story {
  padding: clamp(2.25rem, 4vw, 4.25rem) 0;
  position: relative;
}

/* slightly different width than bowls to feel like a "feature" */
.wlg-artisan-story .wlg-story__inner {
  width: min(1120px, calc(100% - 3rem));
  margin: 0 auto;
}

/* Header: stronger, more “title card” */
.wlg-artisan-story .wlg-story__header {
  margin-bottom: clamp(1.25rem, 2.5vw, 2.25rem);
  position: relative;
}

/* subtle “film leader” / label line */
.wlg-artisan-story .wlg-story__header::after {
  content: "";
  display: block;
  width: 160px;
  height: 2px;
  margin-top: 1.15rem;
  background: rgba(199, 136, 48, 0.55); /* Golden Tisane */
  border-radius: 2px;
}

.wlg-artisan-story .wlg-story__title {
  font-size: clamp(2.2rem, 5vw, 4.35rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  margin: 0 0 0.65rem;
}

/* subline reads like a documentary lower-third */
.wlg-artisan-story .wlg-story__location {
  margin: 0;
  opacity: 0.82;
  font-size: 0.98rem;
  letter-spacing: 0.02em;
}

/* Hero image becomes a “still frame” */
.wlg-artisan-story .wlg-story__hero {
  margin: clamp(1.25rem, 2.6vw, 2.25rem) 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(41, 39, 35, 0.14);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.05);
}

.wlg-artisan-story .wlg-story__hero img {
  width: 100%;
  height: auto;
  display: block;
}

/* Film / video: label style (not competing headline) */
.wlg-artisan-story .wlg-story__film {
  margin: clamp(1.5rem, 3vw, 2.5rem) 0;
}

.wlg-artisan-story .wlg-story__film .wlg-story__section-title {
  font-size: clamp(1.15rem, 2vw, 1.75rem);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.85;
  margin: 0 0 0.9rem;
}

/* Video container gets a “screen” feel */
.wlg-artisan-story .wlg-video-placeholder,
.wlg-artisan-story .wlg-video-embed {
  border: 1px solid rgba(41, 39, 35, 0.18);
  border-radius: 16px;
  overflow: hidden;
  background: rgba(237, 230, 220, 0.35); /* Stone Ivory tint */
}

.wlg-artisan-story .wlg-video-placeholder {
  padding: clamp(1.1rem, 2vw, 1.6rem);
}

.wlg-artisan-story .wlg-video-placeholder p {
  margin: 0;
  opacity: 0.86;
}

.wlg-artisan-story .wlg-video-embed {
  position: relative;
  aspect-ratio: 16 / 9;
}

.wlg-artisan-story .wlg-video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.wlg-artisan-story .wlg-story__caption {
  margin: 0.75rem 0 0;
  opacity: 0.78;
  font-size: 0.95rem;
}

/* ===== Documentary “Panels” for the body =====
   Instead of bowls' clean split, we use two cards that feel like exhibit panels.
*/
.wlg-artisan-story .wlg-story__two-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.25rem, 2.5vw, 1.75rem);
  margin: clamp(1.75rem, 3vw, 2.5rem) 0;
}

@media (min-width: 900px) {
  .wlg-artisan-story .wlg-story__two-col {
    grid-template-columns: 1fr 1fr;
  }
}

.wlg-artisan-story .wlg-story__col {
  border: 1px solid rgba(41, 39, 35, 0.14);
  border-radius: 18px;
  padding: clamp(1.15rem, 2vw, 1.6rem);
  background: rgba(237, 230, 220, 0.38);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.04);
}

/* Panel headings: bold, museum-label vibe */
.wlg-artisan-story .wlg-story__col .wlg-story__section-title {
  font-size: clamp(1.6rem, 2.6vw, 2.25rem);
  line-height: 1.06;
  margin: 0 0 0.85rem;
}

/* RTE spacing */
.wlg-artisan-story .wlg-story__richtext,
.wlg-artisan-story .wlg-story__close,
.wlg-artisan-story .wlg-story__details {
  font-size: 1.03rem;
  line-height: 1.7;
}

.wlg-artisan-story .rte p {
  margin: 0 0 0.95rem;
}

.wlg-artisan-story .rte p:last-child {
  margin-bottom: 0;
}

/* Details block becomes a full-width “workshop notes” panel */
.wlg-artisan-story .wlg-story__details {
  margin: clamp(1.75rem, 3vw, 2.5rem) 0;
  border: 1px solid rgba(41, 39, 35, 0.14);
  border-radius: 18px;
  padding: clamp(1.15rem, 2vw, 1.6rem);
  background: rgba(237, 230, 220, 0.32);
}

/* Closing line fades out */
.wlg-artisan-story .wlg-story__close {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  font-size: 0.95rem;
  opacity: 0.75;
}

/* CTA: slightly more “documentary badge” than bowls */
.wlg-artisan-story .wlg-story__cta {
  margin-top: 1.15rem;
}

.wlg-artisan-story .wlg-story__cta .wild-luxe-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  padding: 0.9rem 1.35rem;
  border-radius: 999px;
  text-decoration: none;
}

.wlg-artisan-story::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.035;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(0,0,0,0.65) 0px,
    rgba(0,0,0,0.65) 1px,
    transparent 2px,
    transparent 6px
  );
}

/* --- Artisan Story: scaling refinement --- */

/* Slightly reduce H1 so it feels like a refined title card, not a billboard */
.wlg-artisan-story .wlg-story__title {
  font-size: clamp(2.0rem, 4.4vw, 3.85rem);
}

/* Keep the “film label” crisp (already good) — no change needed */

/* Bring panel headings down a notch for a more premium, documentary pacing */
.wlg-artisan-story .wlg-story__col .wlg-story__section-title,
.wlg-artisan-story .wlg-story__details .wlg-story__section-title {
  font-size: clamp(1.35rem, 2.1vw, 1.95rem);
  letter-spacing: -0.01em;
}

/* Slightly increase body text for readability inside cards (optional but nice) */
.wlg-artisan-story .wlg-story__richtext,
.wlg-artisan-story .wlg-story__details,
.wlg-artisan-story .wlg-story__close {
  font-size: 1.05rem;
}

.wlg-artisan-story .wlg-story__col,
.wlg-artisan-story .wlg-story__details,
.wlg-artisan-story .wlg-video-placeholder,
.wlg-artisan-story .wlg-video-embed {
  border-color: rgba(41, 39, 35, 0.12);
}

/* =========================================================
   WLG — River Narrative (Field Cinema) — Fly Fishing Stories
   Section: wlg-river-narrative-story.liquid
   Tone: cool, slow, implied narration; typewriter italics
   ========================================================= */

.wlg-river-story {
  padding: clamp(2.75rem, 5vw, 5rem) 0;
}

.wlg-river-story .wlg-river__inner {
  width: min(980px, calc(100% - 3rem)); /* narrower = more cinematic */
  margin: 0 auto;
}

/* Title card (film opening) */
.wlg-river__titlecard {
  text-align: center;
  margin-bottom: clamp(1.75rem, 3vw, 2.75rem);
}

.wlg-river__kicker {
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-size: 0.85rem;
  opacity: 0.78;
  margin-bottom: 0.85rem;
}

.wlg-river__title {
  font-size: clamp(2.15rem, 4.5vw, 4.1rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  margin: 0;
}

.wlg-river__subtitle {
  margin-top: 0.75rem;
  font-size: 1.05rem;
  opacity: 0.88;
  letter-spacing: 0.03em;
}

.wlg-river__location {
  margin-top: 0.5rem;
  font-size: 0.95rem;
  opacity: 0.72;
}

/* Film */
.wlg-river__film {
  margin: clamp(1.5rem, 3vw, 2.5rem) 0;
}

.wlg-river__film-label {
  font-size: 0.95rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  opacity: 0.78;
  margin: 0 0 0.85rem;
}

.wlg-river__video {
  border: 1px solid rgba(41, 39, 35, 0.16);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(237, 230, 220, 0.25);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.06);
}

.wlg-river__video.wlg-video-placeholder {
  padding: clamp(1.15rem, 2vw, 1.65rem);
}

.wlg-river__video.wlg-video-placeholder p {
  margin: 0;
  opacity: 0.82;
}

.wlg-river__video.wlg-video-embed {
  position: relative;
  aspect-ratio: 16 / 9;
}

.wlg-river__video.wlg-video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.wlg-river__film-caption {
  margin-top: 0.8rem;
  font-size: 0.95rem;
  opacity: 0.72;
}

/* Notes cluster — between casts */
.wlg-river__notes {
  margin: clamp(2rem, 4vw, 3rem) auto;
  padding: clamp(1.25rem, 2.2vw, 1.75rem);
  border: 1px solid rgba(41, 39, 35, 0.14);
  border-radius: 18px;
  background: rgba(237, 230, 220, 0.32);
  position: relative;
}

.wlg-river__notes-heading {
  font-size: 0.9rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  opacity: 0.68;
  margin-bottom: 0.85rem;
}

/* suggested “typewriter italics” */
.wlg-river__note {
  font-style: italic;
  letter-spacing: 0.01em;
  line-height: 1.7;
  margin: 0 0 0.75rem;
  opacity: 0.9;
}

.wlg-river__note:last-child {
  margin-bottom: 0;
}

/* Ledger */
.wlg-river__ledger {
  margin: clamp(2rem, 4vw, 3.25rem) 0;
}

.wlg-river__ledger-title {
  text-align: left;
  font-size: clamp(1.55rem, 2.6vw, 2.2rem);
  line-height: 1.08;
  margin: 0 0 0.85rem;
}

.wlg-river__ledger-intro {
  margin-bottom: 1.25rem;
  opacity: 0.92;
}

.wlg-river__ledger-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
}

@media (min-width: 860px) {
  .wlg-river__ledger-list {
    grid-template-columns: 1fr 1fr;
    gap: 1rem 1.25rem;
  }
}

.wlg-river__fly {
  border: 1px solid rgba(41, 39, 35, 0.14);
  border-radius: 16px;
  padding: 1rem 1.1rem;
  background: rgba(237, 230, 220, 0.24);
}

.wlg-river__fly-name {
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.92rem;
  opacity: 0.82;
  margin-bottom: 0.45rem;
}

.wlg-river__fly-note {
  font-style: italic;
  line-height: 1.65;
  opacity: 0.9;
}

/* Closing */
.wlg-river__close {
  margin-top: clamp(2rem, 4vw, 3.25rem);
  text-align: center;
}

.wlg-river__dedication {
  font-style: italic;
  opacity: 0.78;
  font-size: 0.95rem;
  line-height: 1.7;
  margin-bottom: 1.15rem;
}

.wlg-river__cta .wild-luxe-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.9rem 1.35rem;
  border-radius: 999px;
  text-decoration: none;
}

.wlg-river__note {
  margin-bottom: 0.9rem;
}

.wlg-river__ledger-intro {
  max-width: 42rem;
}

/* =========================================================
   WLG — Artist Profile (Curated Editorial Biography)
   ========================================================= */

.wlg-artist-profile {
  padding: clamp(2.75rem, 5vw, 5rem) 0;
}

.wlg-artist-profile .wlg-artist__inner {
  width: min(980px, calc(100% - 3rem));
  margin: 0 auto;
}

/* Header */
.wlg-artist__header {
  margin-bottom: clamp(1.75rem, 3vw, 2.75rem);
}

.wlg-artist__name {
  font-size: clamp(2.1rem, 4.8vw, 4.1rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  margin: 0 0 0.65rem;
}

.wlg-artist__discipline {
  font-size: 0.98rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.78;
}

.wlg-artist__portrait {
  margin: clamp(1.25rem, 2.6vw, 2.25rem) 0 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(41, 39, 35, 0.14);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.05);
}

.wlg-artist__portrait img {
  width: 100%;
  height: auto;
  display: block;
}

/* Blocks */
.wlg-artist__block {
  margin: clamp(1.75rem, 3vw, 2.5rem) 0;
}

.wlg-artist__h2 {
  font-size: clamp(1.45rem, 2.4vw, 2.05rem);
  line-height: 1.08;
  margin: 0 0 0.85rem;
}

/* RTE pacing */
.wlg-artist__rte {
  font-size: 1.05rem;
  line-height: 1.75;
}

.wlg-artist-profile .rte p {
  margin: 0 0 1rem;
}

.wlg-artist-profile .rte p:last-child {
  margin-bottom: 0;
}

/* Opening feels like an editorial lead */
.wlg-artist__opening {
  border-left: 2px solid rgba(199, 136, 48, 0.55);
  padding-left: 1.15rem;
}

/* Curatorial “Why” panel */
.wlg-artist__why {
  border: 1px solid rgba(41, 39, 35, 0.14);
  border-radius: 18px;
  padding: clamp(1.15rem, 2vw, 1.6rem);
  background: rgba(237, 230, 220, 0.32);
}

/* Explicit signature */
.wlg-artist__signature {
  margin-top: 1.1rem;
  font-style: italic;
  opacity: 0.78;
  font-size: 0.95rem;
}

/* Closing fades out */
.wlg-artist__closing {
  margin-top: clamp(2.25rem, 4vw, 3.5rem);
  opacity: 0.88;
}

/* =========================================
   WLG — Promise Pages
   ========================================= */

.wlg-promise {
  padding: clamp(3rem, 6vw, 5.5rem) 0;
}

.wlg-promise__inner {
  width: min(900px, calc(100% - 3rem));
  margin: 0 auto;
}

.wlg-promise__crumbs {
  font-size: 0.95rem;
  opacity: 0.8;
  margin-bottom: 1.5rem;
}

.wlg-promise__crumbs a {
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid rgba(199,136,48,0.35);
}

.wlg-promise__crumbs a:hover {
  border-bottom-color: rgba(199,136,48,0.75);
}

.wlg-promise__sep {
  margin: 0 0.35rem;
  opacity: 0.6;
}

.wlg-promise__title {
  font-size: clamp(2.2rem, 4.8vw, 3.6rem);
  line-height: 1.05;
  margin-bottom: 1.75rem;
}

.wlg-promise__body {
  font-size: 1.08rem;
  line-height: 1.8;
}

.wlg-promise__body p {
  margin-bottom: 1.35rem;
}

.wlg-promise__signature {
  margin-top: 1.75rem;
  font-style: italic;
  opacity: 0.75;
}

.wlg-promise__back {
  margin-top: 2.5rem;
}

.wlg-promise__backlink {
  text-decoration: none;
  border-bottom: 1px solid rgba(199,136,48,0.45);
  padding-bottom: 0.15rem;
}

.wlg-promise__backlink:hover {
  border-bottom-color: rgba(199,136,48,0.85);
}

/* =========================================
   WLG — Promise Pages (Polish Pass)
   ========================================= */

.wlg-promise {
  padding: clamp(3.25rem, 6vw, 5.75rem) 0;
}

/* Create a “reading sheet” regardless of page background */
.wlg-promise__inner {
  width: min(980px, calc(100% - 3rem));
  margin: 0 auto;

  background: rgba(237, 230, 220, 0.94); /* Stone Ivory feel */
  border: 1px solid rgba(41, 39, 35, 0.16);
  border-radius: 14px;

  padding: clamp(2rem, 4.5vw, 3.25rem);
  box-shadow: 0 16px 40px rgba(0,0,0,0.10);
}

/* Breadcrumbs */
.wlg-promise__crumbs {
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.95rem;
  opacity: 0.78;
  margin: 0 0 1.25rem;
  color: #292723; /* Ink Charcoal */
}

.wlg-promise__crumbs a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(199,136,48,0.35); /* Golden Tisane */
  padding-bottom: 0.08rem;
}

.wlg-promise__crumbs a:hover {
  border-bottom-color: rgba(199,136,48,0.85);
}

.wlg-promise__sep {
  margin: 0 0.4rem;
  opacity: 0.6;
}

/* Title */
.wlg-promise__title {
  font-family: "Athelas", serif;
  color: #292723;
  font-size: clamp(2.2rem, 4.9vw, 3.7rem);
  line-height: 1.05;
  margin: 0 0 1.25rem;
}

/* Optional subtle divider under title */
.wlg-promise__rule {
  width: 92px;
  height: 2px;
  background: rgba(199,136,48,0.65);
  margin: 0 0 1.75rem;
  border-radius: 2px;
}

/* Body copy rhythm */
.wlg-promise__body {
  font-family: "Helvetica LT Pro", sans-serif;
  color: rgba(41, 39, 35, 0.92);
  font-size: 1.08rem;
  line-height: 1.85;
}

/* Shopify richtext sometimes uses <p>, sometimes <div>, sometimes <br> */
.wlg-promise__body p,
.wlg-promise__body div {
  margin: 0 0 1.35rem;
}

.wlg-promise__body p:last-child,
.wlg-promise__body div:last-child {
  margin-bottom: 0;
}

/* Signature */
.wlg-promise__signature {
  margin-top: 2rem;
  font-family: "Helvetica LT Pro", sans-serif;
  font-style: italic;
  color: rgba(41, 39, 35, 0.72);
}

/* Back link */
.wlg-promise__back {
  margin-top: 2.25rem;
}

.wlg-promise__backlink {
  font-family: "Helvetica LT Pro", sans-serif;
  text-decoration: none;
  color: rgba(41, 39, 35, 0.86);
  border-bottom: 1px solid rgba(199,136,48,0.45);
  padding-bottom: 0.12rem;
}

.wlg-promise__backlink:hover {
  border-bottom-color: rgba(199,136,48,0.9);
}

.wlg-promise__empty {
  opacity: 0.6;
  font-style: italic;
}

/* =========================================
   WLG — Promise Page Back Link
   ========================================= */

.wlg-promise__backlink {
  display: inline-block;
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.95rem;
  color: rgba(41, 39, 35, 0.78); /* Ink Charcoal, softened */
  text-decoration: none;
  position: relative;
  padding-bottom: 0.15rem;
  transition: color 0.25s ease;
}

/* subtle underline */
.wlg-promise__backlink::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: rgba(199, 136, 48, 0.45); /* Golden Tisane */
  transform: scaleX(0.35);
  transform-origin: left;
  transition: transform 0.35s ease, background-color 0.35s ease;
}

/* hover */
.wlg-promise__backlink:hover {
  color: rgba(41, 39, 35, 0.95);
}

.wlg-promise__backlink:hover::after {
  transform: scaleX(1);
  background-color: rgba(199, 136, 48, 0.85);
}

/* Artist Profile — back link */
.wlg-artist-profile__back{
  margin-top: 2rem;
}

.wlg-artist-profile__backlink{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 1rem;
  letter-spacing: .02em;
  color: #292723; /* Ink Charcoal */
  text-decoration: none;
  position: relative;
  opacity: .9;
  transition: transform .2s ease, opacity .2s ease;
}

.wlg-artist-profile__backlink::after{
  content: "";
  position: absolute;
  left: 1.25rem;  /* starts under the text after the arrow */
  right: 0;
  bottom: -6px;
  height: 2px;
  background: #C78830; /* Golden Tisane */
  transform: scaleX(.18);
  transform-origin: left;
  opacity: .65;
  transition: transform .22s ease, opacity .22s ease;
}

.wlg-artist-profile__backlink:hover{
  transform: translateX(-2px);
  opacity: 1;
}

.wlg-artist-profile__backlink:hover::after{
  transform: scaleX(.35);
  opacity: .95;
}

.wlg-scentstory {
  padding: 64px 18px;
}

.wlg-scentstory__wrap {
  max-width: 980px;
  margin: 0 auto;
}

.wlg-scentstory__header {
  text-align: center;
  margin-bottom: 28px;
}

.wlg-scentstory__title {
  margin: 0;
}

.wlg-scentstory__meta {
  margin: 10px 0 0;
  opacity: 0.85;
}

/* Film: quiet margin frame */
.wlg-scentstory__film {
  margin: 34px auto 44px;
  max-width: 920px;
}

.wlg-scentstory__video {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 14px; /* subtle */
  overflow: hidden;
  /* keep it from feeling “player-like” */
  background: #000;
}

.wlg-scentstory__filmcap {
  margin-top: 10px;
  font-size: 0.95rem;
  opacity: 0.8;
  text-align: left;
}

/* Content blocks */
.wlg-scentstory__block {
  margin: 42px 0;
}

.wlg-scentstory__h2 {
  margin: 0 0 14px;
  letter-spacing: 0.02em;
}

.wlg-scentstory__prose p {
  margin: 0 0 14px;
  line-height: 1.7;
}

/* Returns */
.wlg-scentstory__returns {
  margin-top: 54px;
  text-align: center;
  opacity: 0.9;
}

.wlg-scentstory__link {
  text-decoration: none;
}

.wlg-scentstory__link:hover {
  text-decoration: underline;
}

.wlg-scentstory__sep {
  margin: 0 10px;
  opacity: 0.6;
}

/* Mobile tuning */
@media (max-width: 720px) {
  .wlg-scentstory { padding: 46px 16px; }
  .wlg-scentstory__film { margin: 26px auto 34px; }
  .wlg-scentstory__block { margin: 34px 0; }
}

.wlg-scentstory { padding: 64px 18px; }
.wlg-scentstory__wrap { max-width: 980px; margin: 0 auto; }

.wlg-scentstory__header { text-align: center; margin-bottom: 28px; }
.wlg-scentstory__meta { margin: 10px 0 0; opacity: 0.82; }

.wlg-scentstory__film { margin: 34px auto 44px; max-width: 920px; }
.wlg-scentstory__video {
  width: 100%;
  display: block;
  border-radius: 14px;
  background: #000;
}

.wlg-scentstory__filmcap {
  margin-top: 10px;
  font-size: 0.95rem;
  opacity: 0.78;
  text-align: left;
}

.wlg-scentstory__block { margin: 42px 0; }
.wlg-scentstory__h2 { margin: 0 0 14px; letter-spacing: 0.02em; }
.wlg-scentstory__prose p { margin: 0 0 14px; line-height: 1.7; }

.wlg-scentstory__returns { margin-top: 54px; text-align: center; opacity: 0.9; }
.wlg-scentstory__sep { margin: 0 10px; opacity: 0.6; }

@media (max-width: 720px) {
  .wlg-scentstory { padding: 46px 16px; }
  .wlg-scentstory__film { margin: 26px auto 34px; }
  .wlg-scentstory__block { margin: 34px 0; }
}

.wlg-scentstory__cta {
  margin-top: 60px;
  text-align: center;
}

.wlg-scentstory__primary {
  font-size: 1.1rem;
  text-decoration: none;
  letter-spacing: 0.02em;
}

.wlg-scentstory__primary:hover {
  text-decoration: underline;
}

.wlg-scentstory__secondary {
  margin-top: 16px;
  font-size: 0.95rem;
  opacity: 0.8;
}

/* Make the card link fill the container */
.hover-cardlink { display:block; position:relative; }

/* Keep overlay above image, but allow clicking the overlay link */
.hover-overlay { pointer-events: none; }
.wlg-curated__hoverLink { pointer-events: auto; }

/* Style the overlay link like your existing span */
.wlg-curated__hoverLink{
  color: rgba(237, 230, 220, 0.88);
  text-decoration: none;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  font-family: "Helvetica LT Pro", sans-serif;
  font-weight: 600;
  font-size: .85rem;
}
.wlg-curated__hoverLink:hover{
  text-decoration: underline;
}

/* =========================================
   WLG • Continue Exploring Section
========================================= */

.wlg-continue-gallery {
  text-align: center;
  padding: 4rem 1rem 3rem;
}

.wlg-continue-inner {
  max-width: 900px;
  margin: 0 auto;
}

.wlg-golden-divider {
  width: 60px;
  height: 2px;
  background-color: #C78830; /* Golden Tisane */
  margin: 0 auto 2rem;
  opacity: 0.85;
}

.wlg-continue-btn {
  display: inline-block;
  padding: 0.85rem 1.9rem;
  border: 1px solid #C78830;
  color: #C78830;
  background: transparent;
  text-decoration: none;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-weight: 500;
  font-size: 0.85rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: all 0.35s ease;
}

.wlg-continue-btn:hover {
  background-color: #C78830;
  color: #ffffff;
  transform: translateY(-1px);
}

.wlg-continue-btn:focus {
  outline: 2px solid #C78830;
  outline-offset: 3px;
}



/* =========================================
   GRID CARD IMAGE SYSTEM
========================================= */

.wlg-scentgrid-imgwrap {
  position: relative;
  overflow: visible;
}

.wlg-scentgrid-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
  position: relative;
  z-index: 1;
}

.wlg-scentgrid-imgwrap:hover .wlg-scentgrid-img {
  transform: scale(1.04);
}

/* Overlay */
.wlg-scentgrid-overlay {
  position: absolute;
  inset: 0;
  background: rgba(41,39,35,0.38);
  backdrop-filter: blur(2px);
  opacity: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .6rem;
  transition: opacity .35s ease;
  z-index: 3;
}

.wlg-scentgrid-imgwrap:hover .wlg-scentgrid-overlay {
  opacity: 1;
}

/* Overlay Links */
.wlg-scentgrid-cta {
  color: #FFFFFF;
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .07em;
  border-bottom: 1px solid rgba(255,255,255,0.35);
  text-decoration: none;
  padding-bottom: 2px;
}

.wlg-scentgrid-cta.secondary {
  opacity: .78;
}

/* =========================================
   Sporting Life — Override Title Colors
========================================= */

.wlg-archive-frame .wlg-scentcard-titleblock,
.wlg-archive-frame .wlg-scentcard-title,
.wlg-archive-frame .wlg-scentcard-notes {
  color: #3A4D42; /* Cedar Green */
}

/* =========================================
   WLG • Sporting Life — Collector's Study
   ========================================= */

/* -----------------------------------------
   1. Full-Width Study Wall
----------------------------------------- */

.wlg-scentgrid-section {
  background: #3E3A35; /* Warm Charcoal Study Wall */
  padding-top: 3rem;
  padding-bottom: 3rem;
}

/* Ensure no inner panels override it */
.wlg-group-section,
.wlg-river-layout,
.wlg-scentgrid {
  background: transparent !important;
}


/* -----------------------------------------
   2. Typography — Warm Ivory on Dark Wall
----------------------------------------- */

.wlg-scentgrid-title,
.wlg-group-heading {
  color: #EDE6DC;
}

.wlg-group-subheading {
  color: rgba(237, 230, 220, 0.75);
  letter-spacing: 0.08em;
}


/* -----------------------------------------
   3. Lamplight Lift (Image Elevation)
----------------------------------------- */

.wlg-scentgrid-img {
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.35),
    0 2px 6px rgba(199, 136, 48, 0.12);
}

/* -----------------------------------------
   5. Hover Link Readability
----------------------------------------- */

.wlg-scentgrid-cta {
  color: #EDE6DC;
}

.wlg-scentgrid-cta.secondary {
  color: rgba(237, 230, 220, 0.75);
}

.wlg-scentgrid-cta:hover {
  color: #C78830; /* Golden Tisane */
}

.wlg-archive-logo img {
  max-width: 280px;   /* adjust if needed */
  opacity: 0.85;
}
.wlg-scentgrid-header {
  text-align: center;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.wlg-scentgrid-title {
  font-size: clamp(2.4rem, 3vw, 3.2rem);
  letter-spacing: 0.04em;
}

.wlg-filter-btn {
  background: transparent;
  border: 1px solid rgba(237,230,220,0.35);
  color: rgba(237,230,220,0.8);
  padding: 0.5rem 1.2rem;
  letter-spacing: 0.08em;
  font-size: 0.8rem;
  text-transform: uppercase;
}

.wlg-filter-btn.active {
  border-color: #C78830;
  color: #C78830;
}

.wlg-filter-btn:hover {
  border-color: #C78830;
  color: #C78830;
}

.wlg-group-heading {
  font-size: 2rem;
  margin-bottom: 0.5rem;
}

.wlg-group-subheading {
  margin-bottom: 2.5rem;
}

/* -----------------------------------------
   Chapter Navigation (Not Filters)
----------------------------------------- */

.wlg-scentgrid-filters {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.wlg-filter-btn {
  background: transparent;
  border: none;
  padding: 0;
  color: rgba(237,230,220,0.6);
  font-size: 0.85rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  position: relative;
}

.wlg-filter-btn::after {
  content: "";
  display: block;
  width: 0%;
  height: 1px;
  background: #C78830;
  margin-top: 6px;
  transition: width 0.3s ease;
}

.wlg-filter-btn:hover::after,
.wlg-filter-btn.active::after {
  width: 100%;
}

.wlg-filter-btn.active {
  color: #EDE6DC;
}

.wlg-archive-logo {
  opacity: 0.75;
}

/* -----------------------------------------
   Study Interior Containment
----------------------------------------- */

.wlg-scentgrid-section > * {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* -----------------------------------------
   Museum Wall Plaque Navigation
----------------------------------------- */

.wlg-scentgrid-filters {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 1rem;
  margin-bottom: 2rem;
}

.wlg-filter-btn {
  background: transparent;
  border: none;
  padding: 0;
  font-size: 0.8rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(237,230,220,0.55);
  position: relative;
}

.wlg-filter-btn::after {
  content: "";
  display: block;
  width: 0%;
  height: 1px;
  background: #C78830;
  margin: 8px auto 0 auto;
  transition: width 0.3s ease;
}

.wlg-filter-btn:hover::after,
.wlg-filter-btn.active::after {
  width: 100%;
}

.wlg-filter-btn.active {
  color: #EDE6DC;
}

/* -----------------------------------------
   Study Interior Containment Split
----------------------------------------- */

/* Header area stays contained */
.wlg-scentgrid-header,
.wlg-scentgrid-filters {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Grid breathes wider */
.wlg-river-layout,
.wlg-scentgrid {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* -----------------------------------------
   Study Vertical Rhythm Refinement
----------------------------------------- */

/* Reduce header bottom spacing */
.wlg-scentgrid-header {
  margin-bottom: 1.5rem;
}

/* Reduce nav bottom spacing */
.wlg-scentgrid-filters {
  margin-bottom: 2rem;
}

/* Tighten section intro spacing */
.wlg-group-heading {
  margin-bottom: 0.25rem;
}

/* -----------------------------------------
   Chapter Subheading Accent
----------------------------------------- */

.wlg-group-section .wlg-group-subheading {
  color: #C78830 !important; /* Golden Tisane */
  letter-spacing: 0.12em;
  font-size: 0.85rem;
  text-transform: uppercase;
}

/* =========================================
   Sporting Grid — Study Edition
========================================= */

/* Card Container */
.wlg-sporting-card {
  position: relative;
}

/* Image */
.wlg-sporting-card-media {
  position: relative;
  overflow: hidden;
}

.wlg-sporting-card-img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.5s ease;
  box-shadow:
    0 18px 40px rgba(0,0,0,0.35),
    0 2px 6px rgba(199,136,48,0.12);
}

/* Hover Zoom (subtle) */
.wlg-sporting-card:hover .wlg-sporting-card-img {
  transform: scale(1.03);
}

/* Overlay */
.wlg-sporting-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.45);
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.35s ease;
}

.wlg-sporting-card:hover .wlg-sporting-overlay {
  opacity: 1;
}

/* Overlay Inner */
.wlg-sporting-overlay-inner {
  text-align: center;
  color: #EDE6DC;
  max-width: 80%;
}

/* Title */
.wlg-sporting-title {
  font-size: 1.3rem;
  margin-bottom: 0.75rem;
  letter-spacing: 0.04em;
}

/* Divider */
.wlg-sporting-divider {
  display: block;
  width: 40px;
  height: 1px;
  background: #C78830;
  margin: 0 auto 1rem auto;
}

/* Links */
.wlg-sporting-links {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.wlg-sporting-link {
  color: #EDE6DC;
  text-decoration: none;
  transition: color 0.3s ease;
}

.wlg-sporting-link:hover {
  color: #C78830;
}

/* Base link (click anywhere) */
.wlg-sporting-base-link {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Ensure overlay sits above base link */
.wlg-sporting-overlay {
  z-index: 2;
}

/* -----------------------------------------
   Sporting Overlay Link Refinement v4
----------------------------------------- */

.wlg-sporting-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.6rem; /* tighter */
  margin-top: 0.6rem;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* Base link */
.wlg-sporting-link {
  color: #EDE6DC;
  text-decoration: none;
  transition: color 0.3s ease;
}

/* Clean tight bullet */
.wlg-sporting-link + .wlg-sporting-link::before {
  content: "•";
  margin-right: 0.1rem; /* reduced */
  color: rgba(237, 230, 220, 0.6);
}

/* River Narrative warmth */
.wlg-sporting-links .wlg-sporting-link:first-child {
  color: #C78830;
}

.wlg-sporting-link:hover {
  color: #C78830;
}

.wlg-sporting-overlay .wlg-sporting-title {
  font-size: 1.3rem;
  margin-bottom: 0.6rem;
  letter-spacing: 0.04em;
  color: #C78830 !important; /* Golden Tisane */
}

.wlg-sporting-overlay .wlg-sporting-divider {
  display: block;
  width: 40px;
  height: 1px;
  background: #fffff !important;
  margin: 0 auto 1rem auto;
}

/* =========================================
   Editorial Fade-In — Sporting Grid
========================================= */

.wlg-sporting-card {
  opacity: 0;
  transform: translateY(18px);
  transition:
    opacity 0.8s cubic-bezier(0.25, 0.1, 0.25, 1),
    transform 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Visible state */
.wlg-sporting-card.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.wlg-sporting-card:nth-child(odd) {
  transition-delay: 0.05s;
}

.wlg-sporting-card:nth-child(even) {
  transition-delay: 0.1s;
}

/* =========================================
   Sporting Editorial Masonry Grid
========================================= */

.wlg-river-layout,
.wlg-scentgrid {
  column-count: 3;
  column-gap: 1.25rem;
}

/* Cards inside masonry */
.wlg-sporting-card {
  break-inside: avoid;
  display: inline-block;
  width: 100%;
  margin-bottom: 1.5rem;
}

/* Responsive */
@media (max-width: 1100px) {
  .wlg-river-layout,
  .wlg-scentgrid {
    column-count: 2;
  }
}

@media (max-width: 680px) {
  .wlg-river-layout,
  .wlg-scentgrid {
    column-count: 1;
  }
}

/* =========================================
   Sporting Editorial Masonry — Refined
========================================= */

.wlg-river-layout,
.wlg-scentgrid {
  column-count: 3;
  column-gap: 1.25rem; /* reduced from 3rem */
  max-width: 1650px; /* wider wall */
  margin: 0 auto;
  padding: 1rem 1rem 1rem; /* slightly tighter top */
}

/* Cards */
.wlg-sporting-card {
  break-inside: avoid;
  display: inline-block;
  width: 100%;
  margin-bottom: 1rem; /* tighter vertical rhythm */
}

/* Responsive */
@media (max-width: 1200px) {
  .wlg-river-layout,
  .wlg-scentgrid {
    column-count: 2;
  }
}

@media (max-width: 720px) {
  .wlg-river-layout,
  .wlg-scentgrid {
    column-count: 1;
  }
}

/* =========================================
   Sporting Editorial Masonry — Immersive
========================================= */

.wlg-river-layout,
.wlg-scentgrid {
  column-count: 3;
  column-gap: 0.5rem; /* MUCH tighter */
  max-width: 1850px; /* immersive width */
  margin: 0 auto;
  padding: 1rem 1rem 1rem;
}

/* Cards */
.wlg-sporting-card {
  break-inside: avoid;
  display: inline-block;
  width: 100%;
  margin-bottom: 1rem; /* tighter vertical rhythm */
}

/* Responsive */
@media (max-width: 1400px) {
  .wlg-river-layout,
  .wlg-scentgrid {
    column-count: 2;
  }
}

@media (max-width: 720px) {
  .wlg-river-layout,
  .wlg-scentgrid {
    column-count: 1;
  }
}

/* =========================================
   Sporting Section — Break Out of Theme Container
========================================= */

.wlg-scentgrid-section {
  width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}

/* Now Masonry */
.wlg-river-layout,
.wlg-scentgrid {
  column-count: 3;
  column-gap: 0.5rem;
  max-width: 1800px;
  margin: 0 auto;
}

.wlg-sporting-card {
  break-inside: avoid;
  display: inline-block;
  width: 100%;
  margin-bottom: 1rem;
}

/* =========================================
   Sporting Masonry — Immersive Wall
========================================= */

.wlg-river-layout,
.wlg-scentgrid {
  column-count: 3;
  column-gap: 0.9rem; /* tighten */
  max-width: 2000px; /* wider wall */
  margin: 0 auto;
  padding: 1rem 1rem 1rem; /* smaller outside gutters */
}

/* Cards */
.wlg-sporting-card {
  break-inside: avoid;
  display: inline-block;
  width: 100%;
  margin-bottom: 1rem; /* match column gap */
}

/* =========================================
   Sporting Group Chapter Markers — Soft Archive
========================================= */

.wlg-group-heading {
  display: none;
}

.wlg-group-subheading {
  text-transform: uppercase;
  letter-spacing: 0.32em;
  font-size: 0.75rem;
  text-align: center;
  color: #C78830; /* Golden Tisane */
  opacity: 0.75; /* soften */
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-weight: 500;
  margin: 4.25rem 0 2rem;
}

/* =========================================
   Sporting Masonry — Private Collection Wall
========================================= */

.wlg-river-layout {
  column-count: 3;
  column-gap: 1.25rem;
  max-width: 2000px;
  margin: 0 auto;
  padding: 2rem 1.25rem 3rem;
}

.wlg-sporting-card {
  break-inside: avoid;
  display: inline-block;
  width: 100%;
  margin-bottom: 1.25rem;
}

.wlg-artisan-filter-cta {
  background: #B7A998;
  text-align: center;
  padding: 3rem 1.5rem;
  margin-top: 3rem;
}

.wlg-artisan-divider {
  width: 60px;
  height: 2px;
  background: #6C2507;
  border: none;
  margin: 0 auto 1.5rem;
}

.wlg-artisan-filter-text {
  font-size: 1.1rem;
  color: #292723;
  margin-bottom: 1.25rem;
  letter-spacing: 0.3px;
}

.wlg-artisan-filter-cta .wild-luxe-btn:hover {
  background: #6C2507;
  color: #ffffff;
  transition: 0.3s ease;
}

/* =========================================================
   WLG • PRODUCT PAGE REFINEMENT
   Stronger Heritage-safe targeting
========================================================= */

/* -----------------------------------------
   1. MAIN PRODUCT AREA = WHITE PEDESTAL
----------------------------------------- */
[id*="product-information"],
[id*="product-information"] > *,
[id*="product-information"] > * > * {
  background: #ffffff !important;
}

[id*="product-information"] {
  padding-top: 3rem !important;
  padding-bottom: 4rem !important;
}

/* Keep the product area feeling like a gallery canvas */
[id*="product-information"] img,
[id*="product-information"] media-gallery,
[id*="product-information"] [class*="media"],
[id*="product-information"] [class*="gallery"] {
  background: transparent !important;
}

/* Product details should not feel boxed */
[id*="product-information"] [class*="details"],
[id*="product-information"] [class*="product-details"],
[id*="product-information"] [style*="background"] {
  box-shadow: none !important;
}

/* -----------------------------------------
   2. PEDestal RHYTHM / SPACING
----------------------------------------- */
[id*="product-information"] {
  max-width: 100%;
}

[id*="product-information"] > * {
  max-width: 1380px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 990px) {
  [id*="product-information"] {
    padding-top: 4rem !important;
    padding-bottom: 5rem !important;
  }
}

/* -----------------------------------------
   3. IVORY EDITORIAL BLOCK
   Use this on the care/keeping area only
----------------------------------------- */
[id*="product-information"] [data-block-type*="care"],
[id*="product-information"] [data-block-type*="keeping"],
[id*="product-information"] [class*="care"],
[id*="product-information"] [class*="keeping"] {
  background: #EDE6DC !important;
  position: relative;
  overflow: hidden;
  padding: 2rem !important;
}

[id*="product-information"] [data-block-type*="care"]::before,
[id*="product-information"] [data-block-type*="keeping"]::before,
[id*="product-information"] [class*="care"]::before,
[id*="product-information"] [class*="keeping"]::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.10;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,0.45) 0, rgba(255,255,255,0.45) 1px, transparent 1px),
    radial-gradient(circle at 80% 30%, rgba(60,60,59,0.05) 0, rgba(60,60,59,0.05) 1px, transparent 1px);
  background-size: 18px 18px, 28px 28px;
}

/* -----------------------------------------
   4. CURATED PAIRINGS = CEDAR GREEN
   Force ALL visible wrappers inside recommendations
----------------------------------------- */
[id*="product_recommendations"],
[id*="product_recommendations"] > *,
[id*="product_recommendations"] > * > *,
[id*="product_recommendations"] > * > * > * {
  color: #EDE6DC !important;
}

/* Heading / copy color */
[id*="product_recommendations"] h1,
[id*="product_recommendations"] h2,
[id*="product_recommendations"] h3,
[id*="product_recommendations"] h4,
[id*="product_recommendations"] p,
[id*="product_recommendations"] span,
[id*="product_recommendations"] a {
  color: #EDE6DC !important;
}

/* Gold divider under Curated Pairings */
[id*="product_recommendations"] h2 {
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 2rem;
}

[id*="product_recommendations"] h2::after {
  content: "";
  display: block;
  width: 84px;
  height: 2px;
  margin-top: 0.9rem;
  background: #C78830;
}

/* Recommendation cards should sit cleanly on cedar */
[id*="product_recommendations"] [class*="card"],
[id*="product_recommendations"] [class*="product-card"],
[id*="product_recommendations"] li,
[id*="product_recommendations"] .grid__item {
  background: transparent !important;
  box-shadow: none !important;
  border-color: rgba(237, 230, 220, 0.18) !important;
}

/* Images remain natural */
[id*="product_recommendations"] img {
  background: transparent !important;
}

/* Section spacing */
[id*="product_recommendations"] {
  padding-top: 3.5rem !important;
  padding-bottom: 4.5rem !important;
}

@media screen and (max-width: 989px) {
  [id*="product_recommendations"] {
    padding-top: 2.5rem !important;
    padding-bottom: 3rem !important;
  }
}
/* ------------------------------------------------
WLG • Pedestal transition divider
------------------------------------------------ */

[id*="product-information"] {
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

/* ------------------------------------------------
WLG • Curated Pairings heading refinement
------------------------------------------------ */

[id*="product_recommendations"] h2 {
  font-family: "Athelas", serif;
  font-weight: 400;
  letter-spacing: 0.03em;
}

[id*="product_recommendations"] h2::after {
  margin-top: 10px;
  width: 72px;
  height: 2px;
  background: #C78830;
}

/* ------------------------------------------------
WLG • Curated Pairings product spacing
------------------------------------------------ */

[id*="product_recommendations"] .grid {
  max-width: 1400px;
  margin: 0 auto;
}

[id*="product_recommendations"] .grid__item {
  padding: 0 30px;
}

.product__media img {
  box-shadow: 0 20px 50px rgba(0,0,0,0.08);
}

/* ==========================================
WLG • Return to Gallery Link
Editorial Navigation Treatment
========================================== */

.wlg-return-gallery {
  text-align: center;
  margin-top: 60px;
  margin-bottom: 40px;
  font-family: "Athelas", serif;
  font-size: 14px;
  letter-spacing: 0.08em;
}

.wlg-return-gallery a {
  text-decoration: none;
  color: #3A4D42;
  position: relative;
  padding: 12px 24px;
  display: inline-block;
}

.wlg-return-gallery a::before,
.wlg-return-gallery a::after {
  content: "";
  display: block;
  width: 80px;
  height: 1px;
  background: #C78830;
  margin: 10px auto;
}

.wlg-return-gallery a:hover {
  opacity: 0.75;
}

/* ==========================================
WLG PRODUCT PAGE — DETAIL COLUMN REFINEMENT
========================================== */

.product__info-wrapper {
  text-align: left;
}

.product__title {
  margin-bottom: 8px;
}

.price {
  margin-bottom: 24px;
}

.product-form__input {
  margin-bottom: 20px;
}

.product-form__quantity {
  margin-top: 8px;
  margin-bottom: 16px;
}

.product-form__buttons {
  margin-top: 10px;
}

/* tighten variant dropdown appearance */

.product-form__input select {
  padding: 12px 16px;
  font-size: 15px;
  border-radius: 2px;
}

/* align entire column */

.product__info-container {
  align-items: flex-start;
}

/* tighten space below add-to-cart area */

.product__info-wrapper hr {
  margin-top: 18px;
  margin-bottom: 0px;
}

/* tighten description spacing */

.product__description {
  margin-top: 0;
  padding-top: 0;
}

/* ensure description text is left aligned */

.product__description,
.product__description p {
  text-align: left !important;
}

/* tighten paragraph spacing */

.product__description p {
  margin-bottom: 0px;
  line-height: 1.55;
}

/* ==========================================
WLG • Target the INNER product details block
========================================== */

/* the nested Shopify details block */
.product-details > .product-details[data-testid="product-information-details"] {
  margin-top: 0.35rem !important;
  text-align: left !important;
}

/* tighten divider inside the inner details block */
.product-details > .product-details[data-testid="product-information-details"] hr,
.product-details > .product-details[data-testid="product-information-details"] .wlg-editorial-divider {
  margin-top: 0.5rem !important;
  margin-bottom: 0.55rem !important;
}

/* tighten the narrative block */
.product-details > .product-details[data-testid="product-information-details"] p,
.product-details > .product-details[data-testid="product-information-details"] .rte,
.product-details > .product-details[data-testid="product-information-details"] [class*="description"] {
  text-align: left !important;
  margin-top: 0 !important;
  margin-bottom: 0.55rem !important;
  line-height: 1.55 !important;
}

/* if the description container itself has top space */
.product-details > .product-details[data-testid="product-information-details"] > *:last-child {
  margin-top: 0 !important;
}

/* ==========================================
WLG • Shop Pay Button Alignment Fix
========================================== */

.shopify-payment-button {
  display: flex;
  justify-content: flex-start;
}

.shopify-payment-button__button {
  max-width: 600px;
}

.shopify-payment-button__button {
  border-radius: 30px;
}


/* ==========================================
WLG • Ivory Feature Strip Refinement
========================================== */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  gap: 18px !important;
  align-items: stretch !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block {
  background: #EDE6DC;
  padding: 10px 10px !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block .icon {
  opacity: 0.82;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block p,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block h6,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block .text {
  font-size: 0.95rem !important;
  line-height: 1.45 !important;
}

/* ==========================================
WLG • Feature Strip – Remove inner cards
========================================== */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block {
  background: transparent !important;
  border: none !important;
  padding: 12px 18px !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  background: #EDE6DC;
  padding: 16px 20px;
  border-radius: 1px;
}

/* ==========================================
WLG • Feature Strip Divider Softening
========================================== */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .divider,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column hr,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column [class*="divider"] {
  opacity: 0.35 !important;
  border-color: rgba(41, 39, 35, 0.28) !important;
}

/* ==========================================
WLG • Feature Strip Border Alignment
========================================== */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  background: #EDE6DC;
  padding: 16px 20px;
  border: rgba(41, 39, 35, 0.28) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06);
  border-radius: 1px;
  box-sizing: border-box;
  width: 100%;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block {
  background: transparent !important;
  border: none !important;
}

/* ==========================================
WLG • Narrative / Details Block Refinement
========================================== */

.product-details p {
  line-height: 1.62;
}

.product-details h4,
.product-details h5,
.product-details strong {
  font-family: 'Helvetica LT Pro', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #292723;
}

.product-details ul {
  margin-top: 0.35rem;
  margin-bottom: 1rem;
  padding-left: 1.1rem;
}

.product-details li {
  margin-bottom: 0.3rem;
  line-height: 1.5;
}

/* ==========================================
WLG • Product Header Stack Refinement
========================================== */

.wlg-gallery-label {
  margin-bottom: 0.6rem !important;
 
}

.wlg-return-wrapper {
  margin-top: 0.35rem !important;
  margin-bottom: 1.25rem !important;
}

.product-details h1,
.product-details h2 {
  margin-top: 0 !important;
  margin-bottom: 0.45rem !important;
}

.product-details .price,
.product-details [class*="price"] {
  margin-bottom: 1rem !important;
}

/* ==========================================
WLG • Product Title Refinement
========================================== */

.product-details h1,
.product-details .product__title {
  font-size: clamp(2.2rem, 2.8vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
}

/* ==========================================
WLG • Product Gallery Editorial Spacing
========================================== */

.product-information__media {
  padding-right: 1rem;
}

.product-information__media img {
  border-radius: 2px;
}

/* spacing between gallery images */
.product-information__media [class*="media"],
.product-information__media [class*="thumbnail"] {
  gap: 10px;
}

/* hero image breathing room */
.product-information__media > *:first-child {
  margin-bottom: 10px;
}

.product-information__media img {
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
}


./* ==========================================
WLG • Gallery Hover Lift
========================================== */

.product-information__media .product-media {
  transition: transform .28s ease, box-shadow .28s ease;
}

.product-information__media .media-gallery__item:hover .product-media {
  transform: translateY(-3px);
  box-shadow: 0 12px 24px rgba(0,0,0,0.10);
}


/* =========================================
   WLG • Product Media Shadow
   ========================================= */

.product-information__grid .product-information__media,
.product-information__grid .product-information__media media-gallery,
.product-information__grid .product-information__media .slideshow {
  overflow: visible !important;
}

.product-information__grid .product-information__media .product-media,
.product-information__grid .product-information__media .product-media-container {
  position: relative;
  z-index: 2;
  border-radius: 6px;
  overflow: visible !important;
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.10),
    0 2px 6px rgba(0, 0, 0, 0.05);
}

/* hero image */
.product-media:first-child {
  box-shadow:
    0 16px 34px rgba(0,0,0,.16),
    0 4px 12px rgba(0,0,0,.08);
}

/* thumbnails */
.product-media:not(:first-child) {
  box-shadow:
    0 8px 18px rgba(0,0,0,.10),
    0 2px 6px rgba(0,0,0,.05);
}

/* =========================================
WLG • Product Title Spacing
========================================= */

.product-information__title,
.product-title,
h1.product-title {
  margin-bottom: 0.65rem;
  letter-spacing: 0.02em;
}

/* =========================================
WLG • Add To Cart Lift
========================================= */

.product-form__submit,
button[name="add"] {
  box-shadow: 
    0 3px 0 rgba(0,0,0,0.18),
    0 8px 18px rgba(0,0,0,0.10);
  transition: all .25s ease;
}

.product-form__submit:hover,
button[name="add"]:hover {
  transform: translateY(-2px);
  box-shadow:
    0 5px 0 rgba(0,0,0,0.18),
    0 14px 28px rgba(0,0,0,0.14);
}

/* =========================================
   WLG • Product form divider
   force only one gold rule
   ========================================= */

product-form-component {
  border-bottom: 1px solid rgba(199,136,48,0.55);
}

.product-form-buttons,
.buy-buttons-block,
.product-form-buttons--stacked {
  border-bottom: 0 !important;
}

.product-form-buttons {
  padding-bottom: 1rem;
  margin-bottom: 1.25rem;
}

/* =========================================
WLG • Product Description Typography
========================================= */

.product-details .group-block,
.product-details .group-block p,
.product-details .group-block li {

  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 15.5px;
  line-height: 1.65;
  color: #2f2f2f;
}

.product-details .group-block p {
  margin-bottom: 0.9rem;
  max-width: 56ch;
}

.product-details .group-block ul {
  margin-top: .5rem;
  margin-bottom: 1.2rem;
  padding-left: 1.1rem;
}

.product-details .group-block li {
  margin-bottom: .35rem;
}

.product-details .group-block strong,
.product-details .group-block b {

  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-weight: 600;
  letter-spacing: .02em;
}

.product-details .group-block p:first-of-type {

  font-size: 16px;
  line-height: 1.7;
}

/* =========================================
   WLG • Variant Dropdown Refinement
   ========================================= */

.product-details select,
.product-details .select select,
.product-details .product-form__input select {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 15px;
  color: #2f2f2f;
  background-color: #ded7cc;
  border: 1px solid rgba(41, 39, 35, 0.12);
  border-radius: 0;
  box-shadow: none;
  min-height: 52px;
  padding: 0.85rem 2.75rem 0.85rem 1rem;
  transition:
    border-color 0.25s ease,
    background-color 0.25s ease,
    box-shadow 0.25s ease;
}

.product-details select:hover,
.product-details .select select:hover,
.product-details .product-form__input select:hover {
  background-color: #e6dfd5;
  border-color: rgba(199, 136, 48, 0.45);
}

.product-details select:focus,
.product-details .select select:focus,
.product-details .product-form__input select:focus {
  outline: none;
  background-color: #ece5db;
  border-color: #C78830;
  box-shadow: 0 0 0 2px rgba(199, 136, 48, 0.12);
}

.signature-subtitle {
  margin-bottom: 2rem;
}

/* =========================================
   WLG • Signature story body typography
   ========================================= */

.signature-two-column-section p,
.signature-two-column-section li,
.signature-two-column-section .rte,
.signature-two-column-section .signature-story-text {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 15.5px;
  line-height: 1.68;
  color: #292723;
}

.signature-two-column-section p {
  margin: 0 0 0.9rem;
  max-width: 58ch;
}

.signature-two-column-section ul {
  margin: 0.5rem 0 1rem 1.1rem;
  padding: 0;
}

.signature-two-column-section li {
  margin-bottom: 0.32rem;
}

/* =========================================
   WLG • Signature section scroll cues
   ========================================= */

.signature-two-column-section .scroll-cue,
.signature-two-column-section .column-scroll-cue,
.signature-two-column-section .scroll-label,
.signature-two-column-section .signature-column-title {
  font-family: "Athelas", serif;
  font-weight: 400;
  letter-spacing: 0;
  color: #C78830;
}

.signature-two-column-section .scroll-cue,
.signature-two-column-section .column-scroll-cue {
  margin-bottom: 1rem;
}

/* =========================================
   WLG • Signature two-column spacing
   ========================================= */

.signature-two-column-section {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.signature-two-column-section .two-column-inner,
.signature-two-column-section .signature-two-col-inner {
  column-gap: 3rem;
  row-gap: 1.5rem;
}

.signature-two-column-section .left-column,
.signature-two-column-section .right-column,
.signature-two-column-section .signature-story-col,
.signature-two-column-section .signature-buy-col {
  padding-top: 0;
}

.signature-two-column-section .golden-divider-long,
.signature-two-column-section .golden-divider-expanded {
  margin: 0.8rem auto 1.25rem;
  opacity: 0.58;
}

.signature-two-column-section .golden-divider-long,
.signature-two-column-section .golden-divider-expanded {
  opacity: 0.62;
}

/* =========================================
   WLG • Signature buy stack tightening
   ========================================= */

.signature-two-column-section .signature-buy-col,
.signature-two-column-section .buy-column-inner {
  gap: 1rem;
}

.signature-two-column-section .signature-buy-col .price,
.signature-two-column-section .buy-column-inner .price {
  margin: 0.15rem 0 0.35rem;
}

.signature-two-column-section .signature-buy-col .button,
.signature-two-column-section .buy-column-inner .button {
  margin-top: 0;
  margin-bottom: 0;
}

.signature-story-text,
.signature-two-column-section .left-column {
  max-width: 520px;
}

.signature-two-column-section .right-column,
.signature-two-column-section .signature-buy-col {
  align-self: start;
}

/* =========================================
   WLG • Signature Two-Column Section
   Corrected selectors
   ========================================= */

.signature-two-column-section {
  padding: 3rem 0 2.6rem;
}

/* Scroll cues */
.signature-scroll-cues {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 3.25rem;
  row-gap: 1rem;
  margin-bottom: 2rem;
}

.signature-two-column-section .scroll-cue {
  margin-bottom: 0;
}

.signature-two-column-section .cue-text {
  display: block;
  font-family: "Athelas", serif;
  font-size: 1.1rem;
  line-height: 1.25;
  color: #6C2507;
  margin-bottom: 0.8rem;
}

.signature-two-column-section .chevron-icon {
  margin-bottom: 0.8rem;
}

.signature-two-column-section .golden-divider-long {
  opacity: 0.58;
}

/* Main columns */
.signature-columns-wrapper {
  display: grid;
  grid-template-columns: minmax(0, 520px) minmax(280px, 1fr);
  column-gap: 3.25rem;
  row-gap: 1.5rem;
  align-items: start;
}

.signature-left-column {
  max-width: 520px;
}

.signature-description-text,
.signature-description-text p,
.signature-description-text li {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 15.5px;
  line-height: 1.68;
  color: #292723;
}

.signature-description-text p {
  margin: 0 0 0.9rem;
  max-width: 58ch;
}

.signature-description-text ul,
.signature-description-text ol {
  margin: 0.5rem 0 1rem 1.1rem;
  padding: 0;
}

.signature-description-text li {
  margin-bottom: 0.32rem;
}

.signature-description-text strong,
.signature-description-text b {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Buy column */
.signature-pricing-block {
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.signature-cart-wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.signature-price {
  margin: 0.15rem 0 0.35rem;
}

/* Buttons */
.signature-pricing-block .signature-inspiration-btn,
.signature-pricing-block .signature-love-btn,
.signature-pricing-block .wild-luxe-btn {
  margin: 0;
}

/* Bottom divider */
.signature-two-column-section > .golden-divider-expanded {
  margin-top: 2rem;
  opacity: 0.58;
}

/* Responsive */
@media (max-width: 989px) {
  .signature-scroll-cues,
  .signature-columns-wrapper {
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .signature-scroll-cues {
    margin-bottom: 1.5rem;
  }

  .signature-left-column {
    max-width: 100%;
  }
}

/* =========================================
   WLG • Signature Buy Column Alignment
   ========================================= */

.signature-pricing-block {
  align-self: start;
  display: flex;
  flex-direction: column;
  align-items: center;   /* centers buttons and price */
  text-align: center;
  gap: 1rem;
  padding-left: 2rem;    /* pushes content away from divider */
}

.signature-cart-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.signature-price {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
}

.signature-columns-wrapper {
  column-gap: 4rem;
}

/* =========================================
   WLG • Signature Buy Column Luxury Hierarchy
   ========================================= */

.signature-pricing-block {
  align-self: start;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  padding-left: 2rem;
}

/* top informational button */
.signature-inspiration-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24rem;
  min-height: 4.6rem;
  padding: 1rem 1.75rem;

  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.95rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.35;

  color: #292723;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(199,136,48,0.85);
  border-radius: 0.8rem;
  box-shadow: none;
}

/* price as quiet anchor */
.signature-price {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #292723;
  margin: 0.1rem 0 0.1rem;
}

/* cart stack */
.signature-cart-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.7rem;
}

/* primary CTA */
.signature-pricing-block .wild-luxe-btn {
  min-width: 17rem;
  min-height: 4.7rem;
  padding: 0.95rem 2rem;

  font-family: "Athelas", serif;
  font-size: 1rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;

  border-radius: 999px;
}

/* lower supporting button */
.signature-love-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24rem;
  min-height: 4.1rem;
  padding: 0.9rem 1.5rem;

  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.9rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.3;

  color: #292723;
  background: rgba(255,255,255,0.52);
  border-radius: 0.8rem;
  box-shadow: none;
}

/* subtle hover states */
.signature-inspiration-btn:hover,
.signature-love-btn:hover {
  background: rgba(255,255,255,0.86);
  border-color: #C78830;
}

.signature-pricing-block .wild-luxe-btn:hover {
  transform: translateY(-1px);
}

/* =========================================
   WLG • Signature story / buy section reset
   ========================================= */

/* cue row */
.signature-scroll-cues {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 3.5rem;
  align-items: end;
  margin-bottom: 1.5rem;
}

.signature-two-column-section .scroll-cue {
  text-align: center;
}

.signature-two-column-section .cue-text {
  display: block;
  font-family: "Athelas", serif;
  font-size: 1.05rem;
  line-height: 1.25;
  color: #292723;
  margin-bottom: 0.9rem;
}

.signature-two-column-section .chevron-icon {
  display: none;
}

.signature-two-column-section .golden-divider.long {
  width: 70%;
  margin: 0 auto;
  opacity: 0.62;
}

/* two columns */
.signature-columns-wrapper {
  display: grid;
  grid-template-columns: minmax(0, 520px) minmax(320px, 1fr);
  column-gap: 3.5rem;
  align-items: start;
  position: relative;
}

/* left */
.signature-left-column {
  max-width: 520px;
}

.signature-description-text,
.signature-description-text p,
.signature-description-text li {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 15.5px;
  line-height: 1.68;
  color: #292723;
}

.signature-description-text p {
  margin: 0 0 0.9rem;
  max-width: 58ch;
}

.signature-description-text ul,
.signature-description-text ol {
  margin: 0.5rem 0 1rem 1.1rem;
  padding: 0;
}

.signature-description-text li {
  margin-bottom: 0.32rem;
}

/* right */
.signature-pricing-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-left: 2.25rem;
  gap: 1.15rem;
}

.signature-cart-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
}

.signature-price {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: #292723;
  margin: 0;
}

.signature-pricing-block .wild-luxe-btn {
  min-width: 16rem;
  min-height: 4.4rem;
  padding: 0.9rem 1.8rem;
  font-family: "Athelas", serif;
  font-size: 1rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 999px;
}

/* supporting actions */
.signature-supporting-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  width: 100%;
}

.signature-inspiration-btn,
.signature-love-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 24rem);
  min-height: 3.9rem;
  padding: 0.85rem 1.4rem;

  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.9rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.3;

  color: #292723;
  background: rgba(255,255,255,0.72);
  border-radius: 0.8rem;
  box-shadow: none;
}

.signature-inspiration-btn:hover,
.signature-love-btn:hover {
  background: rgba(255,255,255,0.9);
  border-color: #C78830;
}

/* bottom divider */
.signature-two-column-section > .golden-divider.expanded {
  margin-top: 2rem;
  opacity: 0.62;
}

/* =========================================
   WLG • Signature column divider cleanup
   ========================================= */

/* keep only the wrapper divider */
.signature-columns-wrapper {
  position: relative;
}

/* kill any old divider rules on the columns */
.signature-supporting-actions,
.signature-left-column,
.signature-cart-wrapper,
.signature-pricing-block {
  border-left: none !important;
  border-right: none !important;
}

.signature-left-column::before,
.signature-left-column::after,
.signature-cart-wrapper::before,
.signature-cart-wrapper::after,
.signature-pricing-block::before,
.signature-pricing-block::after {
  display: none !important;
  content: none !important;
}

.signature-columns-wrapper {
  position: relative;
}

.signature-columns-wrapper::after {
  content: "";
  position: absolute;
  top: 4.25rem;
  bottom: 4.25rem;
  left: calc(520px + 5rem);
  width: 1px;
  background: rgba(41, 39, 35, 0.14);
  pointer-events: none;
}

/* =========================================
   WLG • Signature quantity + cart
   Match wlg-standard
   ========================================= */

.signature-product-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  width: 100%;
}

.signature-qty-row {
  display: grid;
  grid-template-columns: 4.25rem 1fr 4.25rem;
  align-items: center;
  width: 18rem;
  min-height: 3.7rem;
  border: 2px solid rgba(41, 39, 35, 0.18);
  border-radius: 999px;
  background: transparent;
  overflow: hidden;
}

.signature-qty-btn {
  appearance: none;
  border: 0;
  background: transparent;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.75rem;
  line-height: 1;
  color: #292723;
  cursor: pointer;
  height: 100%;
}

.signature-qty-input {
  appearance: textfield;
  border: 0;
  background: transparent;
  text-align: center;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.2rem;
  color: #292723;
  width: 100%;
  outline: none;
}

.signature-qty-input::-webkit-outer-spin-button,
.signature-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.signature-add-to-cart,
.signature-pricing-block .wild-luxe-btn.signature-add-to-cart {
  min-width: 18rem;
  min-height: 3.95rem;
  padding: 0.9rem 1.8rem;

  font-family: "Athelas", serif;
  font-size: 0.98rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #2a2418;

  background: #D6B36C;
  border: 2px solid rgba(160, 110, 26, 0.55);
  border-radius: 999px;

  margin-bottom: 18px;

  box-shadow:
    0 3px 0 rgba(0,0,0,0.14),
    0 8px 18px rgba(0,0,0,0.10);
  transition: transform .25s ease, box-shadow .25s ease;
}

.signature-add-to-cart:hover,
.signature-pricing-block .wild-luxe-btn.signature-add-to-cart:hover {
  transform: translateY(-1px);
  box-shadow:
    0 4px 0 rgba(0,0,0,0.14),
    0 12px 22px rgba(0,0,0,0.12);
}

.signature-pricing-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-left: 2.25rem;
  gap: 1rem;
}

.signature-cart-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  width: 100%;
}

.signature-price {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: #292723;
  margin: 0 0 0.2rem;
}
.signature-supporting-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  width: 100%;
}

.signature-inspiration-btn,
.signature-love-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 24rem);
  min-height: 3.9rem;
  padding: 0.85rem 1.4rem;

  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.9rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.3;

  color: #292723;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(199,136,48,0.78);
  border-radius: 0.8rem;
  box-shadow: none;
}

/* Kill old Signature Scent center dividers */
.signature-columns-wrapper::before,
.signature-columns-wrapper::after {
  display: none !important;
  content: none !important;
  background: transparent !important;
}

/* =========================================
   WLG • Layered Scent Duos
   ========================================= */

.layered-scent-duos-section {
  padding: 3.75rem 0 3.25rem;
  background: transparent;
}

.duos-heading-block {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 2.25rem;
}

.duos-heading {
  font-family: "Athelas", serif;
  font-size: clamp(2rem, 3vw, 2.6rem);
  font-weight: 400;
  line-height: 1.15;
  color: #292723;
  margin: 0 0 0.9rem;
}

.duos-subtext {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 15.5px;
  line-height: 1.7;
  color: #292723;
  max-width: 680px;
  margin: 0 auto 1.15rem;
}

.layered-scent-duos-section .golden-divider {
  width: 110px;
  height: 2px;
  background: rgba(199, 136, 48, 0.72);
  margin: 0.9rem auto 0;
}

/* grid */
.duos-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.6rem;
  align-items: stretch;
}

/* cards */
.layered-duo-card {
  background: rgba(255,255,255,0.72);
  border-radius: 1.25rem;
  padding: 1.35rem 1.2rem 1.4rem;
  box-shadow: 0 8px 20px rgba(0,0,0,0.06);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-height: 100%;
}

/* duo image row */
.duo-images {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  min-height: 140px;
  margin-bottom: 1.15rem;
}

.duo-img {
  width: 100%;
  max-width: 122px;
  height: 122px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}

.plus-icon {
  font-family: "Athelas", serif;
  font-size: 1.8rem;
  line-height: 1;
  color: #C78830;
  transform: translateY(-2px);
}

/* text */
.duo-title {
  font-family: "Athelas", serif;
  font-size: 1.1rem;
  line-height: 1.35;
  font-weight: 400;
  color: #292723;
  margin: 0 0 0.55rem;
  min-height: 3rem;
}

.duo-price {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.96rem;
  line-height: 1.5;
  color: rgba(41,39,35,0.82);
  margin: 0 0 1rem;
}

/* button — quieter than main product CTA */
.intertwined-btn {
  min-width: 13.75rem;
  min-height: 3.1rem;
  padding: 0.75rem 1.2rem;

  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;

  color: #2a2418;
  background: rgba(214,179,108,0.9);
  border: 1px solid rgba(160,110,26,0.38);
  border-radius: 999px;
  box-shadow: none;
}

.intertwined-btn:hover {
  transform: translateY(-1px);
}

/* bottom divider */
.layered-scent-duos-section .golden-divider.expanded {
  width: 32%;
  min-width: 180px;
  max-width: 420px;
  margin: 3rem auto 0;
  opacity: 0.72;
}

/* modal */
.duo-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(41,39,35,0.38);
  z-index: 999;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}

.duo-modal-content {
  position: relative;
  width: min(560px, 100%);
  background: #F8F5EF;
  border-radius: 1rem;
  padding: 2rem 1.75rem 1.6rem;
  box-shadow: 0 18px 40px rgba(0,0,0,0.14);
  text-align: center;
}

.duo-modal-content h4 {
  font-family: "Athelas", serif;
  font-size: 1.45rem;
  font-weight: 400;
  color: #292723;
  margin: 0 0 0.75rem;
}

.duo-modal-content p {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 15.5px;
  line-height: 1.68;
  color: #292723;
  margin: 0 0 1.2rem;
}

.duo-modal-content .add-to-cart-center {
  margin-top: 0.25rem;
}

.modal-close {
  position: absolute;
  top: 0.85rem;
  right: 1rem;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  color: rgba(41,39,35,0.7);
}

/* responsive */
@media (max-width: 1200px) {
  .duos-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .layered-scent-duos-section {
    padding: 3rem 0 2.75rem;
  }

  .duos-grid {
    grid-template-columns: 1fr;
    gap: 1.2rem;
  }

  .layered-duo-card {
    padding: 1.2rem 1rem 1.25rem;
  }

  .duo-images {
    min-height: 120px;
  }

  .duo-img {
    max-width: 108px;
    height: 108px;
  }
}

/* =========================================================
   WLG • Signature Scent Page
   Section Rhythm Polish
========================================================= */

/* -----------------------------------
   MAIN SECTION SPACING
------------------------------------ */
.signature-title-block,
.signature-product-image-section,
.signature-two-column-section,
.layered-duos-section,
.curated-pairings-section,
.scent-journey-callout {
  position: relative;
}

/* Core editorial sections */
.layered-duos-section,
.curated-pairings-section,
.scent-journey-callout {
  padding-top: 5.5rem;
  padding-bottom: 5rem;
}

/* Give the QR ending slightly more ceremony */
.curated-pairings-section + .scent-journey-callout {
  padding-top: 6rem;
}

/* -----------------------------------
   DUOS SECTION RHYTHM
   signature-duos.liquid
------------------------------------ */
.layered-duos-section .section-heading,
.layered-duos-section .layered-heading,
.layered-duos-section h2 {
  margin-top: 0;
  margin-bottom: 0;
}

.layered-duos-section .section-intro,
.layered-duos-section .layered-intro,
.layered-duos-section p {
  margin-top: 1rem;
}

.layered-duos-section .layered-duo-grid,
.layered-duos-section .duo-grid {
  margin-top: 3rem;
}

.layered-duos-section .golden-divider.expanded {
  margin-top: 3.25rem;
}

/* -----------------------------------
   CURATED PAIRINGS RHYTHM
   signature-paired-with.liquid
------------------------------------ */
.curated-pairings-section .curated-kicker {
  margin-bottom: 0.7rem;
}

.curated-pairings-section .curated-heading {
  margin-top: 0;
  margin-bottom: 0;
}

.curated-pairings-section .curated-intro {
  margin-top: 1rem;
}

.curated-pairings-section .curated-editorial-layout,
.curated-pairings-section .curated-pairing-grid {
  margin-top: 3rem;
}

.curated-pairings-section .golden-divider.expanded {
  margin-top: 3.25rem;
}

/* -----------------------------------
   SCENT CTA RHYTHM
   signature-scent-cta.liquid
------------------------------------ */
.scent-journey-callout .scent-journey-copy > * + * {
  margin-top: 0;
}

.scent-journey-callout .scent-journey-kicker {
  margin: 0 0 0.8rem;
}

.scent-journey-callout .scent-journey-heading {
  margin: 0;
}

.scent-journey-callout .scent-journey-text {
  margin-top: 1.35rem;
}

.scent-journey-callout .scent-journey-btn {
  margin-top: 1.75rem;
}

.scent-journey-callout .scent-journey-qr-wrap {
  margin-top: 0;
}

/* -----------------------------------
   OPTIONAL TOP-OF-PAGE BALANCE
   Use only if needed
------------------------------------ */
.signature-title-block + .signature-product-image-section,
.signature-product-image-section + .signature-two-column-section,
.signature-two-column-section + .layered-duos-section {
  margin-top: 0;
}

/* -----------------------------------
   MOBILE RHYTHM
------------------------------------ */
@media (max-width: 980px) {
  .layered-duos-section,
  .curated-pairings-section,
  .scent-journey-callout {
    padding-top: 4.5rem;
    padding-bottom: 4.25rem;
  }

  .curated-pairings-section + .scent-journey-callout {
    padding-top: 5rem;
  }
}

@media (max-width: 680px) {
  .layered-duos-section,
  .curated-pairings-section,
  .scent-journey-callout {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .layered-duos-section .layered-duo-grid,
  .layered-duos-section .duo-grid,
  .curated-pairings-section .curated-editorial-layout,
  .curated-pairings-section .curated-pairing-grid {
    margin-top: 2.25rem;
  }

  .layered-duos-section .golden-divider.expanded,
  .curated-pairings-section .golden-divider.expanded {
    margin-top: 2.5rem;
  }

  .curated-pairings-section + .scent-journey-callout {
    padding-top: 4.5rem;
  }

  .scent-journey-callout .scent-journey-text {
    margin-top: 1.1rem;
  }

  .scent-journey-callout .scent-journey-btn {
    margin-top: 1.5rem;
  }
}

/* =========================================================
   WLG • Signature Scent Page Rhythm Polish
========================================================= */

/* Major page sections */
.layered-duos-section,
.curated-pairings-section,
.scent-journey-callout {
  position: relative;
  padding-top: 5.5rem;
  padding-bottom: 5rem;
}

/* Section headings / intros */
.layered-duos-section .section-heading,
.curated-pairings-section .curated-heading,
.scent-journey-callout .scent-journey-heading {
  margin-top: 0;
}

.layered-duos-section .section-intro,
.curated-pairings-section .curated-intro {
  margin-top: 1rem;
}

/* Content blocks beneath intros */
.layered-duos-section .layered-duo-grid,
.curated-pairings-section .curated-editorial-layout {
  margin-top: 3rem;
}

/* Bottom dividers */
.layered-duos-section .golden-divider.expanded,
.curated-pairings-section .golden-divider.expanded {
  margin-top: 3.25rem;
}

/* QR section internal rhythm */
.scent-journey-copy > * + * {
  margin-top: 1.25rem;
}

.scent-journey-copy .scent-journey-kicker + .scent-journey-heading {
  margin-top: 0.8rem;
}

.scent-journey-copy .scent-journey-heading + .scent-journey-text {
  margin-top: 1.35rem;
}

.scent-journey-copy .scent-journey-text + .scent-journey-btn {
  margin-top: 1.75rem;
}

/* Slightly more room before the final callout */
.curated-pairings-section + .scent-journey-callout {
  padding-top: 6rem;
}

/* Mobile rhythm */
@media (max-width: 680px) {
  .layered-duos-section,
  .curated-pairings-section,
  .scent-journey-callout {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .layered-duos-section .layered-duo-grid,
  .curated-pairings-section .curated-editorial-layout {
    margin-top: 2.25rem;
  }

  .layered-duos-section .golden-divider.expanded,
  .curated-pairings-section .golden-divider.expanded {
    margin-top: 2.5rem;
  }

  .curated-pairings-section + .scent-journey-callout {
    padding-top: 4.5rem;
  }
}

/* =========================================================
   WLG — SPORTING LIFE PRODUCT PAGE
   Phase 1: Opening Composition Polish
   For products using wlg-standard template
========================================================= */

/* Overall product info rhythm */
.product-information {
  --wlg-sporting-max-text: 32rem;
  --wlg-sporting-gold: #C78830;
  --wlg-sporting-ink: #292723;
  --wlg-sporting-stone: #EDE6DC;
  --wlg-sporting-moss: #A5AF8F;
  --wlg-sporting-border: rgba(80, 71, 39, 0.18);
}

/* Tighten the overall two-column composition slightly */
.product-information .product-details {
  position: relative;
}

/* Top details container */
.product-information .product-details > .group,
.product-information .product-details .group_J87VfC {
  max-width: var(--wlg-sporting-max-text);
}

/* -------------------------
   Collection label / breadcrumb area
-------------------------- */
.product-information a[href*="/collections/"] {
  font-family: var(--font-body--family);
  font-size: 0.98rem;
  line-height: 1.4;
  color: rgba(41, 39, 35, 0.82);
  text-decoration: none;
  transition: opacity 0.25s ease;
}

.product-information a[href*="/collections/"]:hover {
  opacity: 0.7;
}

/* -------------------------
   Title block
-------------------------- */
/* Sporting Life product title refinement */

.product-information h2,
.product-information .product-details h2 {

  font-family: 'Athelas', serif;

  /* smaller, more editorial scale */
  font-size: clamp(2.2rem, 2.8vw, 3.1rem);

  line-height: 1.08;
  letter-spacing: -0.01em;

  color: var(--wlg-sporting-ink);

  margin: 0;
  text-wrap: balance;
}

/* Title + price wrapper */
.product-information .group_nMm3w6 {
  gap: 0.65rem !important;
  margin-bottom: 1.1rem;
}

/* Price styling */
.product-information .price,
.product-information [class*="price_"] {
  font-family: var(--font-body--family);
  font-size: 1.05rem !important;
  line-height: 1.3;
  letter-spacing: 0.04em;
  color: rgba(41, 39, 35, 0.88);
  margin-top: 0.1rem;
}

/* -------------------------
   Variant label / dropdown rhythm
-------------------------- */
.product-information .variant-picker,
.product-information [class*="variant_picker"] {
  margin-top: 0.45rem;
  margin-bottom: 1.5rem;
}

.product-information .variant-picker label,
.product-information [class*="variant_picker"] label {
  display: block;
  margin-bottom: 0.55rem;
  font-family: var(--font-body--family);
  font-size: 0.92rem;
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: rgba(41, 39, 35, 0.92);
}

.product-information .variant-picker select,
.product-information [class*="variant_picker"] select {
  min-height: 3.55rem;
  padding: 0 1rem;
  border: 1px solid rgba(80, 71, 39, 0.16);
  background: #d8d1c6;
  color: var(--wlg-sporting-ink);
  font-family: var(--font-body--family);
  font-size: 1rem;
  line-height: 1.2;
  box-shadow: none;
}

/* -------------------------
   Buy buttons area
-------------------------- */
.product-information .buy-buttons,
.product-information [class*="buy_buttons"] {
  margin-top: 0;
  margin-bottom: 1.2rem;
}

/* Quantity */
.product-information quantity-input,
.product-information .quantity-selector,
.product-information [class*="quantity"] {
  margin-bottom: 0.8rem;
}

.product-information quantity-input,
.product-information .quantity-selector {
  max-width: 21.5rem;
}

/* Add to cart button */
.product-information .shopify-payment-button__button,
.product-information button[name="add"],
.product-information .add-to-cart,
.product-information [class*="add-to-cart"] {
  min-height: 3.15rem;
  border-radius: 999px;
  font-family: var(--font-body--family);
  font-size: 1.02rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow:
    0 1px 0 rgba(0, 0, 0, 0.08),
    0 4px 12px rgba(0, 0, 0, 0.08);
}





/* -------------------------
   Media side polish
-------------------------- */
.product-information .product-media-gallery img,
.product-information [class*="media-gallery"] img {
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.14);
}

/* -------------------------
   Mobile
-------------------------- */
@media (max-width: 749px) {
  .product-information h2,
  .product-information .product-details h2 {
    font-size: clamp(2.2rem, 8vw, 3rem);
    line-height: 1.08;
  }

  .product-information .group_nMm3w6 {
    margin-bottom: 0.9rem;
  }

  .product-information .variant-picker,
  .product-information [class*="variant_picker"] {
    margin-bottom: 1.2rem;
  }

  .product-information .text_wnQCmf,
  .product-information [class*="text_wnQCmf"] {
    padding-bottom: 1.5rem !important;
  }

  .product-information .group_JK8NUb,
  .product-information [class*="group_JK8NUb"] {
    margin-top: 0.2rem;
  }
}

.product-information .variant-picker,
.product-information [class*="variant_picker"] {
  display: none;
}

/* Sporting Life — Add to Cart vertical alignment */

.product-information button[name="add"],
.product-information .add-to-cart,
.product-information [class*="add-to-cart"] {

  display: flex;
  align-items: center;
  justify-content: center;

  line-height: 1;
}

/* Quantity selector width */
.product-information quantity-input,
.product-information .quantity-selector {

  width: 100%;
  max-width: 22rem;
}

/* Add to cart width */
.product-information button[name="add"],
.product-information .add-to-cart,
.product-information [class*="add-to-cart"] {

  width: 100%;
  max-width: 22rem;
}

/* Add to Cart alignment */

.product-information button[name="add"],
.product-information .add-to-cart {

  display: flex;
  align-items: center;
  justify-content: center;

  gap: .55rem;

  min-height: 3.35rem;

  line-height: 1;
}

/* Center the cart icon */

.product-information button[name="add"] svg,
.product-information .add-to-cart svg {

  position: relative;
  top: -1px;
}

/* =================================================
   WLG — Sporting Life Add to Cart Final Alignment
================================================= */

.product-information button[name="add"],
.product-information .add-to-cart,
.product-information [class*="add-to-cart"] {
  width: 100%;
  max-width: 22rem;
  min-height: 3.35rem;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;

  padding: 0 1.25rem;
  line-height: 1;
  text-align: center;
}

/* Reset any internal wrappers Shopify is using */
.product-information button[name="add"] > *,
.product-information .add-to-cart > *,
.product-information [class*="add-to-cart"] > * {
  position: static !important;
  transform: none !important;
}

/* Keep icon and label in one centered row */
.product-information button[name="add"] svg,
.product-information .add-to-cart svg,
.product-information [class*="add-to-cart"] svg {
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  margin: 0;
  position: relative;
  top: -1px;
}

/* Text label alignment */
.product-information button[name="add"] span,
.product-information .add-to-cart span,
.product-information [class*="add-to-cart"] span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  margin: 0;
  padding: 0;
}

/* Remove pseudo-elements or layered splits if theme is injecting them */
.product-information button[name="add"]::before,
.product-information button[name="add"]::after,
.product-information .add-to-cart::before,
.product-information .add-to-cart::after,
.product-information [class*="add-to-cart"]::before,
.product-information [class*="add-to-cart"]::after {
  display: none !important;
}

.product-information .buy-buttons,
.product-information [class*="buy_buttons"],
.product-information quantity-input,
.product-information .quantity-selector {
  width: 100%;
  max-width: 22rem;
}

/* =================================================
   WLG — Sporting Life Add to Cart True Centering
================================================= */

/* Outer button */
.product-information .add-to-cart-button,
.product-information button.add-to-cart-button,
.product-information button[name="add"] {
  width: 100%;
  max-width: 22rem;
  min-height: 3.35rem;
  padding: 0 1.25rem;

  display: flex;
  align-items: center;
  justify-content: center;

  text-align: center;
  line-height: 1;
}

/* Main visible content wrapper */
.product-information .add-to-cart-button .add-to-cart-text,
.product-information button[name="add"] .add-to-cart-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;

  width: auto;
  margin: 0 auto;
  line-height: 1;
}

/* Icon wrapper */
.product-information .add-to-cart-button .add-to-cart-icon,
.product-information button[name="add"] .add-to-cart-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  margin: 0;
  padding: 0;
}

/* Actual SVG */
.product-information .add-to-cart-button .add-to-cart-icon svg,
.product-information button[name="add"] .add-to-cart-icon svg {
  width: 1rem;
  height: 1rem;
  display: block;
  position: relative;
  top: -1px;
}

/* Text label */
.product-information .add-to-cart-button .add-to-cart-text__content,
.product-information button[name="add"] .add-to-cart-text__content {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin: 0;
  padding: 0;

  line-height: 1;
  white-space: nowrap;
}

/* Prevent hidden "added" span from affecting layout */
.product-information .add-to-cart-button .add-to-cart-text--added,
.product-information button[name="add"] .add-to-cart-text--added {
  display: none !important;
}

/* Sporting Life — quantity and CTA same width */

.product-information .buy-buttons,
.product-information [class*="buy_buttons"],
.product-information quantity-input,
.product-information .quantity-selector,
.product-information .add-to-cart-button,
.product-information button[name="add"] {
  width: 100%;
  max-width: 22rem;
}

/* =================================================
   WLG — Sporting Life Buy Area Hard Reset
================================================= */

.product-information {
  --wlg-buy-width: 22rem;
}

/* Shared width for buy area */
.product-information .buy-buttons,
.product-information [class*="buy_buttons"] {
  width: 100%;
  max-width: var(--wlg-buy-width);
}

/* Quantity selector: exact width */
.product-information quantity-input,
.product-information .quantity-selector,
.product-information [class*="quantity-selector"],
.product-information [class*="quantity__wrapper"] {
  width: var(--wlg-buy-width) !important;
  max-width: var(--wlg-buy-width) !important;
  box-sizing: border-box;
}

/* Add to cart button: exact width */
.product-information .add-to-cart-button,
.product-information button.add-to-cart-button,
.product-information button[name="add"] {
  width: var(--wlg-buy-width) !important;
  max-width: var(--wlg-buy-width) !important;
  box-sizing: border-box;

  min-height: 3.35rem;
  padding: 0 1.25rem;

  display: flex;
  align-items: center;
  justify-content: center;

  text-align: center;
  line-height: 1;
}

/* ---------------------------------
   REMOVE inner pill / shadow styling
---------------------------------- */
.product-information .add-to-cart-button .add-to-cart-text,
.product-information .add-to-cart-button .add-to-cart-icon,
.product-information .add-to-cart-button .add-to-cart-text__content,
.product-information button[name="add"] .add-to-cart-text,
.product-information button[name="add"] .add-to-cart-icon,
.product-information button[name="add"] .add-to-cart-text__content {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  filter: none !important;
}

/* Main visible content wrapper */
.product-information .add-to-cart-button .add-to-cart-text,
.product-information button[name="add"] .add-to-cart-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;

  width: auto;
  max-width: 100%;
  margin: 0 auto;
  padding: 0;

  position: static !important;
  transform: none !important;
}

/* Icon wrapper */
.product-information .add-to-cart-button .add-to-cart-icon,
.product-information button[name="add"] .add-to-cart-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;

  width: 1rem;
  height: 1rem;
  margin: 0;
  padding: 0;
}

/* SVG */
.product-information .add-to-cart-button .add-to-cart-icon svg,
.product-information button[name="add"] .add-to-cart-icon svg {
  width: 1rem;
  height: 1rem;
  display: block;
  margin: 0;
  position: relative;
  top: -1px;
}

/* Text label */
.product-information .add-to-cart-button .add-to-cart-text__content,
.product-information button[name="add"] .add-to-cart-text__content {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin: 0;
  padding: 0;

  line-height: 1;
  white-space: nowrap;
}

/* Hide the extra added-state span from layout */
.product-information .add-to-cart-button .add-to-cart-text--added,
.product-information button[name="add"] .add-to-cart-text--added {
  display: none !important;
}

/* Kill any pseudo-elements causing extra pill shapes */
.product-information .add-to-cart-button .add-to-cart-text::before,
.product-information .add-to-cart-button .add-to-cart-text::after,
.product-information .add-to-cart-button .add-to-cart-icon::before,
.product-information .add-to-cart-button .add-to-cart-icon::after,
.product-information .add-to-cart-button .add-to-cart-text__content::before,
.product-information .add-to-cart-button .add-to-cart-text__content::after,
.product-information button[name="add"] .add-to-cart-text::before,
.product-information button[name="add"] .add-to-cart-text::after,
.product-information button[name="add"] .add-to-cart-icon::before,
.product-information button[name="add"] .add-to-cart-icon::after,
.product-information button[name="add"] .add-to-cart-text__content::before,
.product-information button[name="add"] .add-to-cart-text__content::after {
  display: none !important;
  content: none !important;
}

.product-information .group_nMm3w6 p {
  margin: 0.35rem 0 0.55rem 0;
  font-family: var(--font-body--family);
  font-size: 0.98rem;
  line-height: 1.55;
  letter-spacing: 0.01em;
  color: rgba(41, 39, 35, 0.72);
  max-width: 28rem;
}

/* WLG Sporting Life editorial subline */

.product-information .wlg-sporting-subline {

  margin: .4rem 0 .6rem 0;

  font-family: var(--font-body--family);
  font-size: .98rem;
  line-height: 1.55;

  letter-spacing: .01em;

  color: rgba(41,39,35,.72);

  max-width: 28rem;
}

/* =================================================
   WLG — Sporting Life Gold Divider
================================================= */

.product-information hr,
.product-information .divider {

  width: 40px;
  height: 2px;

  margin: .7rem 0 .8rem 0;

  background: rgba(199, 136, 48, 0.9);

  border: none;
  opacity: .65;
}

/* ==========================================
WLG Sporting Life Header Rhythm
========================================== */

/* tighten title block */
.product-information h2 {
  margin-bottom: .25rem;
}

/* tighten subline */
.product-information .wlg-sporting-subline {
  margin: 0 0 .35rem 0;
}

/* gold divider spacing */
.product-information hr,
.product-information .divider {

  width: 36px;
  height: 2px;

  margin: .35rem 0 .45rem 0;

  background: #C78830;

  border: none;
  opacity: .75;
}

/* tighten price spacing */
.product-information .price,
.product-information [class*="price_"] {
  margin-top: .1rem;
}

/* Sporting Life subline tighten paragraph spacing */

.product-information .wlg-sporting-subline,
.product-information .group_nMm3w6 p {

  margin-top: 0;
  margin-bottom: 0;
}

.product-information hr,
.product-information .divider {

  margin: .25rem 0 .35rem 0;
}
.wlg-sporting-subline {
  color: rgba(41,39,35,.65);
}

/* ==========================================
WLG Sporting Life — Field Notes Block
========================================== */

.wlg-field-notes-title {

  font-family: var(--font-body--family);
  font-size: .75rem;

  letter-spacing: .18em;
  text-transform: uppercase;

  color: rgba(41,39,35,.55);

  margin: 1.4rem 0 .45rem 0;
}

/* body copy */

.product-information .text_wnQCmf p {

  font-family: var(--font-body--family);
  font-size: .98rem;

  line-height: 1.65;
  letter-spacing: .01em;

  color: rgba(41,39,35,.82);

  max-width: 28rem;
}

/* tighten paragraph spacing */

.product-information .text_wnQCmf p + p {
  margin-top: .7rem;
}

/* Tighten space before Field Notes block */
.product-information .text_wnQCmf,
.product-information [class*="text_wnQCmf"] {
  padding-top: 1rem !important;
  padding-bottom: 1.5rem !important;
}

.product-information .wlg-field-notes-title {
  margin-top: 0.85rem;
}

.wlg-field-notes-title::before {
  content: "";
  display: block;
  width: 36px;
  height: 1px;
  background: rgba(80, 71, 39, 0.28);
  margin: 0 0 0.6rem 0;
}

.wlg-field-notes-title {
  font-family: var(--font-body--family);
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(41, 39, 35, 0.52);
  margin: 0.9rem 0 0.45rem 0;
}

.product-information .text_wnQCmf p {
  font-size: 0.98rem;
  line-height: 1.72;
  color: rgba(41, 39, 35, 0.8);
  max-width: 28rem;
}


/* ==========================================
   WLG Sporting Life — remove form divider + excess spacing
========================================== */

.product-information product-form-component form,
.product-information .buy-buttons-block product-form-component form {
  border-bottom: none !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* safety: if the form wrapper is also contributing spacing */
.product-information product-form-component,
.product-information .buy-buttons-block,
.product-information [class*="buy-buttons-block"] {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* ==========================================
   WLG Sporting Life — Field Notes divider
========================================== */

.wlg-field-notes-title::before,
.product-information h6::before {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  background: rgba(199, 136, 48, 0.9);
  margin: 0 0 0.65rem 0;
}

product-form-component form {
  margin-bottom: 18px;
}

/* ==========================================
WLG Sporting Life — Image / Story alignment
========================================== */

.sporting-intro-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: 3rem;
}

/* make product column stack vertically */
.sporting-intro-two-col .product-information {
  display: flex;
  flex-direction: column;
}

/* push Field Notes to bottom */
.sporting-intro-two-col .product-information .wlg-field-notes {
  margin-top: auto;
}

/* ==========================================
WLG Sporting Life — Field Notes paper texture
========================================== */

.wlg-field-notes {
  position: relative;
  padding: 1.5rem 1.75rem;
  margin-top: 2rem;

  /* subtle paper tone */
  background: rgba(183, 169, 152, 0.08); /* Orcher Wood tint */

  border-radius: 4px;

  /* extremely soft depth */
  box-shadow:
    0 1px 0 rgba(0,0,0,0.03),
    inset 0 0 0 1px rgba(0,0,0,0.03);
}

.wlg-field-notes::before {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    radial-gradient(rgba(0,0,0,0.02) 1px, transparent 1px);

  background-size: 4px 4px;

  opacity: 0.35;
  pointer-events: none;
}

.wlg-field-notes > * {
  position: relative;
  z-index: 1;
}

.wlg-field-notes {
  border-left: 3px solid rgba(199,136,48,0.35);
}

.wlg-field-notes {
  position: relative;
  padding: 1.5rem 1.75rem;
  margin-top: 2rem;

  background: linear-gradient(
    180deg,
    rgba(237,230,220,0.85) 0%,
    rgba(237,230,220,0.65) 100%
  );

  border-radius: 6px;

  box-shadow:
    0 2px 8px rgba(0,0,0,0.05),
    inset 0 0 0 1px rgba(0,0,0,0.03);
}

.wlg-field-notes::before {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    radial-gradient(rgba(0,0,0,0.02) 1px, transparent 1px);

  background-size: 5px 5px;

  opacity: 0.25;
  pointer-events: none;
}

.sporting-intro-two-col::before {
  content: "";
  position: absolute;
  inset: -80px -120px;

  background: radial-gradient(
    circle at 65% 35%,
    rgba(199,136,48,0.10) 0%,
    rgba(199,136,48,0.04) 35%,
    transparent 70%
  );

  pointer-events: none;
  z-index: 0;
}

.sporting-intro-two-col > * {
  position: relative;
  z-index: 1;
}

/* ==========================================
WLG Sporting Life — Field Notes watermark
========================================== */

.wlg-field-notes {
  position: relative;
  padding: 1.5rem 1.75rem;
  margin-top: 2rem;

  background: linear-gradient(
    180deg,
    rgba(237,230,220,0.85) 0%,
    rgba(237,230,220,0.65) 100%
  );

  border-radius: 6px;

  box-shadow:
    0 2px 8px rgba(0,0,0,0.05),
    inset 0 0 0 1px rgba(0,0,0,0.03);

  overflow: hidden;
}

.wlg-field-notes::after {
  content: "";
  position: absolute;

  width: 260px;
  height: 260px;

  right: -40px;
  bottom: -60px;

  background-image: url("/cdn/shop/files/rainbow-trout-jumping-CONLINE-BW-CUT.png?v=1773418020");
  background-repeat: no-repeat;
  background-size: contain;

  opacity: 0.035;

  pointer-events: none;
  z-index: 1;
}

/* =========================================================
   Sporting Life Icon Panel — Stronger Targeted Polish
   Use this instead of the last refinement block.
   The prior block likely missed Shopify’s actual text wrappers.
========================================================= */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  padding: 2.6rem 2rem !important;
  gap: 2rem !important;
  align-items: center !important;
}

/* Center each icon/text stack more reliably */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > * {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
  min-width: 0 !important;
}

/* Catch icon wrappers + icons */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column .icon,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column .icon-wrapper,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column .group-block-icon,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column svg,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column img {
  width: 34px !important;
  height: 34px !important;
  margin: 0 0 0rem 0 !important;
  display: block !important;
  flex: 0 0 auto !important;
}

/* Catch all likely text elements Shopify may be outputting */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column p,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column h3,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column h4,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column h5,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column span,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column .icon-title,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column .group-block-title,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column .group-block-heading,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column .group-block-text {
  margin: 0 !important;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif !important;
  font-size: 0.95rem !important;
  line-height: 1.35 !important;
  letter-spacing: 0.01em !important;
  font-weight: 400 !important;
  color: #292723 !important;
  text-align: center !important;
}

/* Subtle hover */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > * {
  transition: transform 220ms ease !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:hover {
  transform: translateY(-2px) !important;
}



/* =========================================================
   Yes — the outer Shopify wrapper is likely what is creating
   the visible “border” area when margin is applied.
   
   Use this approach:
   1. Remove background/border from the OUTER wrapper
   2. Put spacing on the wrapper
   3. Keep the actual icon panel visually self-contained
========================================================= */

/* OUTER WRAPPER */
.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0 0 !important;
}

/* =========================================================
   INNER ICON PANEL
========================================================= */

.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  margin: 0 !important;
  padding: 1.25rem 1rem !important;
  border-radius: 0px !important;
  background: #E9E4DE !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* =========================================================
   FIELD NOTES SPACING
   Use Field Notes bottom margin instead of icon block top margin
========================================================= */

.wlg-field-notes {
  margin-bottom: 1.5rem !important;
}

/* =========================================================
   IMPORTANT:
   Remove any margin-top / margin-bottom directly from:
   .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column

   If you currently have those rules elsewhere in wlg.css,
   comment them out or delete them.
========================================================= */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0.9rem !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  align-items: start !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > * {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  min-width: 0 !important;
  padding: 1.25rem 0.9rem 1.15rem !important;

  border: 1px solid rgba(199, 136, 48, 0.12) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05) !important;
  position: relative !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(1),
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(3) {
  transform: translateY(-10px) !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(2),
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(4) {
  transform: translateY(10px) !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column svg,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column img {
  width: 34px !important;
  height: 34px !important;
  margin: 0 0 0.85rem 0 !important;
  display: block !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column p,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column h3,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column h4,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column h5,
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column span {
  margin: 0 !important;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif !important;
  font-size: 0.95rem !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
  color: #292723 !important;
  text-align: center !important;
  text-wrap: balance !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *::before {
  content: "";
  display: block;
  width: 28px;
  height: 1px;
  background: #C78830;
  margin: 0 auto 0.95rem auto;

}

@media (max-width: 990px) {
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(1),
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(3) {
    transform: translateY(-6px) !important;
  }

  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(2),
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(4) {
    transform: translateY(6px) !important;
  }
}

@media (max-width: 640px) {
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
    grid-template-columns: 1fr !important;
  }

  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(1),
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(2),
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(3),
  .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > *:nth-child(4) {
    transform: none !important;
  }
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.group-block {
  background: transparent !important;
}

.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style > .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style::before,
.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style::after,
.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style > .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column::before,
.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style > .group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column::after {
  content: none !important;
  display: none !important;
}

.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style {
  --color-background: transparent !important;
  --background: transparent !important;
  --border-width: 0px !important;
  --border-color: transparent !important;
}

.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style[style*="background"],
.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style[style*="--color-background"],
.group-block.group-block--height-fit.group-block--width-fit-content.border-style.spacing-style.size-style[style*="--border-color"] {
  --background: transparent !important;
  --border-color: transparent !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  gap: 3rem !important;
}

.group-block__media-wrapper {
  display: none !important;
}

.group-block__media-wrapper,
.group-block__media-wrapper .overlay,
.group-block__media-wrapper .overlay-solid {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.group-block__media-wrapper .overlay {
  --overlay-color: transparent !important;
  --overlay-color--end: transparent !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column
> .group-block {

  background: #F4F1EC;
  border-radius: 18px;
  padding: 1.4rem 1.2rem 1.3rem;

  box-shadow:
    0 6px 18px rgba(0,0,0,0.05),
    0 1px 0 rgba(0,0,0,0.04);

  transition: transform .18s ease, box-shadow .18s ease;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column
> .group-block:hover {

  transform: translateY(-2px);

  box-shadow:
    0 10px 28px rgba(0,0,0,0.08),
    0 1px 0 rgba(0,0,0,0.04);
}

/* WLG Editorial Icon Cards */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column 
> .group-block {

  background: #F6F3EE !important;
  border-radius: 18px !important;

  padding: 1.35rem 1.2rem 1.25rem !important;

  box-shadow:
    0 6px 18px rgba(0,0,0,0.05),
    0 1px 0 rgba(0,0,0,0.04) !important;

  transition: transform .18s ease, box-shadow .18s ease;
}

/* Wild Luxe Icon Cards */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column 
> .group-block {

  background: #F6F3EE;
  border-radius: 18px;

  padding: 1.35rem 1.2rem 1.25rem;

  border: 1px solid rgba(0,0,0,0.06);

  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block {
  transition: transform 0.22s ease, box-shadow 0.22s ease !important;
  will-change: transform;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08) !important;
}
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block {
  position: relative !important;
  z-index: 1 !important;
}
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column > .group-block:hover {
  z-index: 3 !important;
}
.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  overflow: visible !important;
}

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
/* Tighten spacing between icon cards and Curated Pairings */

.group-block-content.layout-panel-flex.layout-panel-flex--row.mobile-column {
  margin-bottom: 0.5rem;
}

/* Reduce top spacing of Curated Pairings section */

.curated-pairings-section {
  margin-top: 0.5rem;
}

/* Tighten space above Curated Pairings / Product Recommendations */

[id*="shopify-section-template"][id*="product_recommendations"] {
  margin-top: 0.5 !important;
  padding-top: 0.5 !important;
}

/* Remove the built-in top spacing on the recommendations section wrapper */

.product-information.section.section--spacing-style.color-relative
  + [id*="shopify-section-template"][id*="product_recommendations"] {
  margin-top: 0.5 !important;
}

/* Target the product recommendations container itself */

[id*="shopify-section-template"][id*="product_recommendations"] product-recommendations {
  margin-top: 0 !important;
  padding-top: 0.5rem !important;
}

/* Reduce extra space inside the recommendations block */

[id*="shopify-section-template"][id*="product_recommendations"] .section-background,
[id*="shopify-section-template"][id*="product_recommendations"] .section {
  padding-top: 0.5rem !important;
}

/* Optional: if you want it even tighter */

[id*="shopify-section-template"][id*="product_recommendations"] product-recommendations {
  padding-top: 0.5rem !important;
}

#ProductInformation-template--19843521544244__product-information > .group-block {
  --padding-block-start: 8px !important;
}

#ProductInformation-template--19843521544244__product-information > .group-block.spacing-style {
  --padding-block-start: 8px !important;
  padding-block-start: 8px !important;
}

#ProductInformation-template--19843521544244__product-information > .group-block:first-child {
  --padding-block-start: 8px !important;
  padding-top: 8px !important;
}

#ProductInformation-template--19843521544244__product-information {
  padding-top: 0 !important;
}

#ProductInformation-template--19843521544244__product-information > .group-block {
  margin-top: 0 !important;
}



/* =========================================================
   WLG — Pairings from the Field
   Editorial styling for Shopify product_recommendations
   ========================================================= */

/* ---------- Section shell ---------- */

.product-recommendations,
.product-recommendations-section {
  position: relative;
  padding: 5.5rem 0 6rem;
  background:
    linear-gradient(
      180deg,
      rgba(237,230,220,0) 0%,
      rgba(237,230,220,0.18) 18%,
      rgba(237,230,220,0.26) 52%,
      rgba(237,230,220,0.12) 100%
    );
}

/* ---------- Header container ---------- */

.product-recommendations .section-header,
.product-recommendations .title-wrapper,
.product-recommendations-section .section-header,
.product-recommendations-section .title-wrapper {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 2.5rem;
  padding: 0 1.5rem;
}

/* ---------- Title ---------- */

.product-recommendations h2,
.product-recommendations-section h2 {
  font-family: 'Athelas', Georgia, serif;
  font-size: clamp(2rem, 3vw, 3rem);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: 0.01em;
  color: #292723;
  margin-bottom: 0.9rem;
}

/* ---------- Subtitle / intro line ---------- */

.product-recommendations .section-subheading,
.product-recommendations .subtitle,
.product-recommendations p,
.product-recommendations-section .section-subheading,
.product-recommendations-section .subtitle {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.98rem;
  line-height: 1.7;
  color: rgba(41,39,35,0.78);
  margin: 0 auto;
  max-width: 780px;
}

/* ---------- Gold divider ---------- */

.product-recommendations .section-header::after,
.product-recommendations-section .section-header::after {
  content: "";
  display: block;
  width: 84px;
  height: 1px;
  margin: 1.2rem auto 1.6rem;
  background: linear-gradient(
    90deg,
    rgba(199,136,48,0) 0%,
    rgba(199,136,48,0.9) 50%,
    rgba(199,136,48,0) 100%
  );
}

/* ---------- Grid breathing room ---------- */

.product-recommendations .grid,
.product-recommendations .product-grid,
.product-recommendations-section .grid {
  padding-left: clamp(1.25rem,3vw,2.25rem);
  padding-right: clamp(1.25rem,3vw,2.25rem);
  margin-top: 2.5rem;
}

/* ---------- Card hover polish ---------- */

.product-recommendations .grid__item,
.product-recommendations .card-wrapper,
.product-recommendations-section .grid__item {
  transition: transform .22s ease, opacity .22s ease;
}

.product-recommendations .grid__item:hover,
.product-recommendations .card-wrapper:hover,
.product-recommendations-section .grid__item:hover {
  transform: translateY(-4px);
}

/* ---------- Card typography ---------- */

.product-recommendations .card__heading,
.product-recommendations .card-information__text {
  font-family: Athelas, Georgia, serif;
  letter-spacing: 0.01em;
}

.product-recommendations .price,
.product-recommendations .card-information {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
}

/* ---------- Mobile spacing ---------- */

@media (max-width: 749px) {

  .product-recommendations,
  .product-recommendations-section {
    padding: 4rem 0 4.5rem;
  }

  .product-recommendations .section-header,
  .product-recommendations-section .section-header {
    margin-bottom: 2rem;
  }

  .product-recommendations .grid,
  .product-recommendations-section .grid {
    margin-top: 2rem;
  }

}

/* =========================================================
   WLG — Pairings from the Field
   Editorial card refinement for product recommendations
   ========================================================= */

/* ---------- Card shell ---------- */

.product-recommendations .card-wrapper,
.product-recommendations .product-card-wrapper,
.product-recommendations-section .card-wrapper,
.product-recommendations-section .product-card-wrapper {
  height: 100%;
}

.product-recommendations .card,
.product-recommendations .card--standard,
.product-recommendations-section .card,
.product-recommendations-section .card--standard {
  height: 100%;
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(199, 136, 48, 0.16);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(41, 39, 35, 0.06);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    border-color 220ms ease;
}

.product-recommendations .card:hover,
.product-recommendations .card--standard:hover,
.product-recommendations-section .card:hover,
.product-recommendations-section .card--standard:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 42px rgba(41, 39, 35, 0.10);
  border-color: rgba(199, 136, 48, 0.30);
}

/* ---------- Image treatment ---------- */

.product-recommendations .card__media,
.product-recommendations .media,
.product-recommendations-section .card__media,
.product-recommendations-section .media {
  overflow: hidden;
}

.product-recommendations .card__media img,
.product-recommendations .media img,
.product-recommendations-section .card__media img,
.product-recommendations-section .media img {
  transition: transform 500ms ease;
}

.product-recommendations .card:hover .card__media img,
.product-recommendations .card--standard:hover .card__media img,
.product-recommendations-section .card:hover .card__media img,
.product-recommendations-section .card--standard:hover .card__media img {
  transform: scale(1.03);
}

/* ---------- Content block ---------- */

.product-recommendations .card__content,
.product-recommendations .card-information,
.product-recommendations-section .card__content,
.product-recommendations-section .card-information {
  padding: 1.15rem 1rem 1.25rem;
}

/* ---------- Title ---------- */

.product-recommendations .card__heading,
.product-recommendations .card__heading a,
.product-recommendations .full-unstyled-link,
.product-recommendations-section .card__heading,
.product-recommendations-section .card__heading a,
.product-recommendations-section .full-unstyled-link {
  font-family: Athelas, Georgia, serif;
  font-size: 1.08rem;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: #292723;
  text-decoration: none;
}

/* ---------- Price / supporting text ---------- */

.product-recommendations .price,
.product-recommendations .card-information,
.product-recommendations .card-information__text,
.product-recommendations-section .price,
.product-recommendations-section .card-information,
.product-recommendations-section .card-information__text {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  color: rgba(41, 39, 35, 0.80);
  line-height: 1.55;
}

/* ---------- Card spacing in grid ---------- */

.product-recommendations .grid__item,
.product-recommendations-section .grid__item {
  margin-bottom: 0.5rem;
}

/* ---------- Mobile polish ---------- */

@media (max-width: 749px) {
  .product-recommendations .card,
  .product-recommendations .card--standard,
  .product-recommendations-section .card,
  .product-recommendations-section .card--standard {
    border-radius: 14px;
  }

  .product-recommendations .card__content,
  .product-recommendations .card-information,
  .product-recommendations-section .card__content,
  .product-recommendations-section .card-information {
    padding: 1rem 0.9rem 1.1rem;
  }

  .product-recommendations .card__heading,
  .product-recommendations .card__heading a,
  .product-recommendations-section .card__heading,
  .product-recommendations-section .card__heading a {
    font-size: 1rem;
  }
}

/* =========================================================
   WLG Pairings Card Override (Heritage theme)
   ========================================================= */

.product-recommendations .card,
.product-recommendations .card-wrapper .card,
.product-recommendations .grid__item .card {

  background: rgba(255,255,255,.6);
  border-radius: 18px;
  border: 1px solid rgba(199,136,48,.18);
  overflow: hidden;

  box-shadow: 0 10px 30px rgba(0,0,0,.08);

  transition: transform .25s ease,
              box-shadow .25s ease,
              border-color .25s ease;
}

.product-recommendations .card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(0,0,0,.15);
  border-color: rgba(199,136,48,.35);
}

/* =========================================================
   WLG — Pairings from the Field
   Heritage theme — target actual product media structure
   Paste at very bottom of wlg.css
   ========================================================= */

/* --- section spacing / header --- */
.product-recommendations {
  padding: 5.5rem 0 6rem;
}

.product-recommendations .section-header,
.product-recommendations .title-wrapper {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 2.5rem;
  padding: 0 1.5rem;
}

.product-recommendations .section-header::after,
.product-recommendations .title-wrapper::after {
  content: "";
  display: block;
  width: 84px;
  height: 1px;
  margin: 1.1rem auto 1.5rem;
  background: linear-gradient(
    90deg,
    rgba(199, 136, 48, 0) 0%,
    rgba(199, 136, 48, 0.9) 50%,
    rgba(199, 136, 48, 0) 100%
  );
}

/* --- grid spacing --- */
.product-recommendations .grid,
.product-recommendations .product-grid {
  padding-left: clamp(1.5rem, 3vw, 2.5rem);
  padding-right: clamp(1.5rem, 3vw, 2.5rem);
  column-gap: 2rem;
  row-gap: 2.5rem;
}

/* =========================================================
   CARD TARGETING
   Your inspect shows the actual visible image wrapper is:
   .product-media-container.media-fit.product-media--contain
   and the image is .product-media__image
   ========================================================= */

/* give each product tile breathing room */
.product-recommendations .grid__item {
  margin-bottom: 0.75rem;
}

/* make the link behave like a card block */
.product-recommendations .grid__item > a {
  display: block;
  text-decoration: none;
}

/* visual card shell on the media container */
.product-recommendations .product-media-container {
  background: rgba(255, 255, 255, 0.66);
  border: 1px solid rgba(199, 136, 48, 0.18);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 12px 28px rgba(24, 22, 18, 0.10);
  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    border-color 220ms ease;
}

/* hover lift */
.product-recommendations .grid__item:hover .product-media-container,
.product-recommendations .grid__item > a:hover .product-media-container {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(24, 22, 18, 0.16);
  border-color: rgba(199, 136, 48, 0.34);
}

/* image area */
.product-recommendations .product-media {
  overflow: hidden;
  background: rgba(255, 255, 255, 0.32);
}

/* actual image */
.product-recommendations .product-media__image {
  transition: transform 420ms ease;
  transform-origin: center center;
}

/* subtle image zoom */
.product-recommendations .grid__item:hover .product-media__image,
.product-recommendations .grid__item > a:hover .product-media__image {
  transform: scale(1.03);
}

/* product title */
.product-recommendations .product-item__title,
.product-recommendations .product-item__title a,
.product-recommendations .card__heading,
.product-recommendations .card__heading a {
  font-family: Athelas, Georgia, serif;
  font-size: 1.08rem;
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: #f2ede6;
  text-decoration: none;
  margin-top: 0.95rem;
}

/* price */
.product-recommendations .price,
.product-recommendations .price-item,
.product-recommendations .money {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  color: rgba(242, 237, 230, 0.92);
}

/* tighten product info rhythm */
.product-recommendations .product-item__info,
.product-recommendations .card-information,
.product-recommendations .card__content {
  padding-top: 0.75rem;
}

/* optional: hide quick add if it is crowding the editorial feel */
.product-recommendations quick-add-component {
  display: none !important;
}

/* mobile */
@media (max-width: 749px) {
  .product-recommendations {
    padding: 4rem 0 4.5rem;
  }

  .product-recommendations .grid,
  .product-recommendations .product-grid {
    padding-left: 1rem;
    padding-right: 1rem;
    column-gap: 1rem;
    row-gap: 1.75rem;
  }

  .product-recommendations .product-media-container {
    border-radius: 14px;
  }

  .product-recommendations .product-item__title,
  .product-recommendations .product-item__title a,
  .product-recommendations .card__heading,
  .product-recommendations .card__heading a {
    font-size: 1rem;
  }
}

/* =========================================================
   Pairings from the Field
   Remove thin gray line from Heritage card-gallery wrapper
   ---------------------------------------------------------
   The inspect shows the line is coming from:
   div.card-gallery ... spacing-style border-style
   with inline CSS vars like --border-width: 3px
   ========================================================= */

.product-recommendations .card-gallery,
.product-recommendations [class*="card-gallery"] {
  --border-width: 0px !important;
  --border-style: none !important;
  --border-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* In case the border is applied to the spacing/border utility class */
.product-recommendations .spacing-style.border-style,
.product-recommendations [class*="spacing-style"][class*="border-style"] {
  --border-width: 0px !important;
  --border-style: none !important;
  --border-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Keep the rounded card look only on the inner media shell */
.product-recommendations .product-media-container {
  border: none !important;
  outline: none !important;
}


/* ---------- TEXT COLORS FOR LIGHT BACKGROUND ---------- */
.product-recommendations h2,
.product-recommendations .section-title,
.product-recommendations .title-wrapper h2,
.product-recommendations .section-header h2 {
  color: #292723 !important;
}

.product-recommendations .section-subheading,
.product-recommendations .subtitle,
.product-recommendations .title-wrapper p,
.product-recommendations .section-header p,
.product-recommendations p {
  color: rgba(41, 39, 35, 0.78) !important;
}

/* ---------- CARD SHADOW ----------
   Your inspect shows the visible tile wrapper is .card-gallery
--------------------------------------------------------- */
.product-recommendations .card-gallery,
.product-recommendations [class*="card-gallery"] {
  box-shadow:
    0 10px 22px rgba(28, 43, 45, 0.10),
    0 24px 42px rgba(41, 39, 35, 0.14) !important;
  border-radius: 22px !important;
  transition:
    transform 220ms ease,
    box-shadow 220ms ease !important;
}

.product-recommendations .grid__item:hover .card-gallery,
.product-recommendations .grid__item:hover [class*="card-gallery"],
.product-recommendations a:hover .card-gallery,
.product-recommendations a:hover [class*="card-gallery"] {
  box-shadow:
    0 14px 28px rgba(28, 43, 45, 0.13),
    0 30px 54px rgba(41, 39, 35, 0.18) !important;
}

/* ============================================
WLG CARD CAPTION SYSTEM
Reusable plaque style for recommendation cards
============================================ */

.wlg-card-caption {

  margin-top: 0.65rem;
  line-height: 1.4;

}

.wlg-card-caption::before {

  content: "";
  display: block;

  width: 22px;
  height: 1px;

  background: rgba(199,136,48,0.6);

  margin-bottom: 0.45rem;

}

.wlg-card-kicker {

  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.68rem;

  letter-spacing: 0.16em;
  text-transform: uppercase;

  color: #292723;

}

.wlg-card-price {

  font-family: "Athelas", serif;
  font-size: 0.95rem;
  font-weight: 500;

  margin-top: 0.25rem;

  color: #C78830;

}

/* ============================================
WLG CARD IMAGE STYLE
============================================ */

.recommended-product img {

  border-radius: 22px;

  box-shadow:
    0 10px 22px rgba(28,43,45,0.10),
    0 24px 42px rgba(41,39,35,0.14);

  transition:
    transform 220ms ease,
    box-shadow 220ms ease;

}

.recommended-product:hover img {

  transform: translateY(-4px);

  box-shadow:
    0 14px 28px rgba(28,43,45,0.13),
    0 30px 54px rgba(41,39,35,0.18);

}

/* =========================================
   WLG — Pairings from the Field / Product Recommendations
   Scoped to Heritage <product-recommendations>
========================================= */

.product-recommendations .resource-list__item {
  height: 100%;
}

.product-recommendations .product-card {
  width: 100%;
  height: 100%;
}

.product-recommendations .wlg-product-card__content {
  display: flex;
  flex-direction: column;
  gap: 0 !important;
  height: 100%;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.product-recommendations .wlg-product-card__content > *:first-child {
  margin-bottom: 1rem;
}

.product-recommendations .wlg-product-card__content > *:not(:first-child) {
  width: 100%;
}

.product-recommendations .wlg-product-card__content > *:nth-child(2) {
  margin-bottom: 0.25rem;
}

.product-recommendations .wlg-product-card__content .product-title,
.product-recommendations .wlg-product-card__content .product-card__title,
.product-recommendations .wlg-product-card__content [class*="product-title"] {
  text-align: center;
}

.product-recommendations .wlg-product-card__content .price,
.product-recommendations .wlg-product-card__content [class*="price"] {
  text-align: center;
}

.product-recommendations .wlg-product-card__content a:not(.product-card__link) {
  text-decoration: none;
}

.product-recommendations .wlg-product-card__content img {
  display: block;
}

/* Editorial caption tone */
.product-recommendations .wlg-product-card__content > *:nth-child(2) {
  font-family: Athelas, serif;
  font-size: 1.02rem;
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: #ede6dc;
}

.product-recommendations .wlg-product-card__content > *:nth-child(3) {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.92rem;
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: rgba(237, 230, 220, 0.78);
}

/* Optional quiet divider feel between image and caption */
.product-recommendations .wlg-product-card__content > *:first-child + * {
  position: relative;
  padding-top: 0.9rem;
}

.product-recommendations .wlg-product-card__content > *:first-child + *::before {
  content: "";
  display: block;
  width: 2.75rem;
  height: 1px;
  margin: 0 auto 0.8rem;
  background: rgba(199, 136, 48, 0.55);
}

/* =========================================
   WLG — Pairings from the Field cards
========================================= */

.product-recommendations .resource-list__item {
  height: 100%;
}

.product-recommendations .wlg-rec-card {
  position: relative;
  height: 100%;
}

.product-recommendations .wlg-rec-card__link {
  display: block;
  text-decoration: none;
  color: inherit;
  height: 100%;
}

.product-recommendations .wlg-rec-card__media {
  position: relative;
  overflow: hidden;
  border-radius: 0;
  background: #2f2b27;
}

.product-recommendations .wlg-rec-card__image,
.product-recommendations .wlg-rec-card__image--placeholder {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

.product-recommendations .wlg-rec-card__overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1.2rem 1.25rem 1.15rem;
  background:
    linear-gradient(
      to top,
      rgba(30,26,22,0.96) 0%,
      rgba(30,26,22,0.86) 35%,
      rgba(30,26,22,0.55) 60%,
      rgba(30,26,22,0.00) 100%
    );
  z-index: 3;
}

.product-recommendations .wlg-rec-card__eyebrow {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(237, 230, 220, 0.82);
  margin-bottom: 0.55rem;
}

.product-recommendations .wlg-rec-card__rule {
  width: 4.25rem;
  height: 1px;
  background: rgba(199, 136, 48, 0.72);
  margin-bottom: 0.8rem;
}

.product-recommendations .wlg-rec-card__title {
  margin: 0 0 0.35rem;
  font-family: Athelas, serif;
  font-size: 1.45rem;
  line-height: 1.2;
  font-weight: 400;
  color: #c78830;
  text-wrap: pretty;
}

.product-recommendations .wlg-rec-card__price {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.9rem;
  line-height: 1.35;
  letter-spacing: 0.06em;
  color: rgba(237, 230, 220, 0.72);
}


.product-recommendations .wlg-rec-card__image {
  transition: transform .35s ease;
}

.product-recommendations .wlg-rec-card:hover .wlg-rec-card__image {
  transform: scale(1.03);
}

@media screen and (max-width: 749px) {
  .product-recommendations .wlg-rec-card__overlay {
    padding: 0.95rem 0.95rem 0.9rem;
  }

  .product-recommendations .wlg-rec-card__title {
    font-size: 1.2rem;
  }

  .product-recommendations .wlg-rec-card__eyebrow {
    font-size: 0.72rem;
    letter-spacing: 0.18em;
  }
}

/* =========================================
   WLG — Pairings from the Field cards
   FORCE OVERRIDE
========================================= */

.product-recommendations .wlg-rec-card {
  position: relative;
  height: 100%;
}

.product-recommendations .wlg-rec-card__link {
  display: block;
  height: 100%;
  text-decoration: none !important;
  color: inherit;
}

.product-recommendations .wlg-rec-card__media {
  position: relative;
  overflow: hidden;
  background: #2a241c;
}

.product-recommendations .wlg-rec-card__image,
.product-recommendations .wlg-rec-card__image--placeholder {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  transition: transform 0.35s ease;
}

.product-recommendations .wlg-rec-card:hover .wlg-rec-card__image {
  transform: scale(1.03);
}

.product-recommendations .wlg-rec-card__overlay {
  position: absolute !important;
  inset: auto 0 0 0 !important;
  padding: 1.25rem 1.25rem 1.1rem !important;
  z-index: 5 !important;
  background: linear-gradient(
    to top,
    rgba(30,26,22,0.98) 0%,
    rgba(30,26,22,0.92) 25%,
    rgba(30,26,22,0.72) 50%,
    rgba(30,26,22,0.38) 72%,
    rgba(30,26,22,0.00) 100%
  ) !important;
}

.product-recommendations .wlg-rec-card__eyebrow {
  display: block !important;
  margin: 0 0 0.55rem 0 !important;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif !important;
  font-size: 0.74rem !important;
  line-height: 1.2 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.82) !important;
}

.product-recommendations .wlg-rec-card__rule {
  display: block !important;
  width: 4.25rem !important;
  height: 1px !important;
  margin: 0 0 0.8rem 0 !important;
  background: rgba(199, 136, 48, 0.78) !important;
}

.product-recommendations .wlg-rec-card__title {
  display: block !important;
  margin: 0 0 0.3rem 0 !important;
  font-family: Athelas, serif !important;
  font-size: 1.45rem !important;
  line-height: 1.16 !important;
  font-weight: 400 !important;
  color: #ffffff !important;
  text-wrap: pretty;
}

.product-recommendations .wlg-rec-card__price {
  display: block !important;
  margin: 0 !important;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
  letter-spacing: 0.06em !important;
  color: rgba(255, 255, 255, 0.74) !important;
}

@media screen and (max-width: 749px) {
  .product-recommendations .wlg-rec-card__overlay {
    padding: 1rem 1rem 0.95rem !important;
  }

  .product-recommendations .wlg-rec-card__title {
    font-size: 1.2rem !important;
  }

  .product-recommendations .wlg-rec-card__eyebrow {
    font-size: 0.7rem !important;
    letter-spacing: 0.18em !important;
  }
}

.product-recommendations .wlg-rec-card__eyebrow {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255,255,255,.86);
}

.product-recommendations .wlg-rec-card__rule {
  display: block !important;
  width: 2.25rem !important;
  height: 1px !important;
  margin: 0 0 0.8rem 0 !important;
  background: rgba(199, 136, 48, 0.78) !important;

  opacity: 0.55;
  transform: translateY(0);
  transition:
    width 280ms ease,
    opacity 280ms ease,
    transform 280ms ease;
}

.product-recommendations .wlg-rec-card:hover .wlg-rec-card__rule {
  width: 4.25rem !important;
  opacity: 1;
  transform: translateY(-1px);
}

/* =========================================
   WLG — Pairings from the Field layout polish
========================================= */

.product-recommendations .resource-list__item {
  min-width: 0;
}

@media screen and (min-width: 990px) {
  .product-recommendations .resource-list--grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    column-gap: 1rem !important;
    row-gap: 1.25rem !important;
  }

  .product-recommendations slideshow-slide.resource-list__slide {
    flex: 0 0 calc((100% - 3rem) / 4) !important;
    width: calc((100% - 3rem) / 4) !important;
    min-width: 0 !important;
  }

  .product-recommendations .wlg-rec-card__overlay {
    padding: 1.15rem 1.15rem 1rem !important;
  }

  .product-recommendations .wlg-rec-card__title {
    font-size: 1.05rem !important;
    line-height: 1.18 !important;
  }

  .product-recommendations .wlg-rec-card__price {
    font-size: 0.82rem !important;
  }

  .product-recommendations .wlg-rec-card__eyebrow {
    font-size: 0.68rem !important;
    letter-spacing: 0.2em !important;
  }
}

/* =========================================
   WLG — Pairings from the Field
   Reduce card scale (desktop)
========================================= */

@media screen and (min-width: 990px) {

  /* reduce carousel slide width */
  .product-recommendations slideshow-slide.resource-list__slide {
    flex: 0 0 calc((100% - 6rem) / 4) !important;
    width: calc((100% - 6rem) / 4) !important;
    min-width: 0 !important;
  }

  /* reduce spacing between cards */
  .product-recommendations .resource-list {
    gap: 1rem !important;
  }

  /* reduce card height */
  .product-recommendations .wlg-rec-card__image {
    aspect-ratio: 4 / 4.6 !important;
  }

  /* tighten overlay spacing */
  .product-recommendations .wlg-rec-card__overlay {
    padding: 1rem 1rem 0.9rem !important;
  }

  /* slightly smaller title */
  .product-recommendations .wlg-rec-card__title {
    font-size: 1rem !important;
  }

  /* smaller price */
  .product-recommendations .wlg-rec-card__price {
    font-size: 0.8rem !important;
  }

}

/* =========================================
   WLG — Pairings from the Field
   Desktop overflow fix + true 4-up sizing
========================================= */

.product-recommendations {
  overflow: hidden !important;
}

.product-recommendations .section-resource-list {
  overflow: hidden !important;
}

.product-recommendations .resource-list {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.product-recommendations .resource-list__carousel,
.product-recommendations slideshow-component,
.product-recommendations slideshow-slides {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.product-recommendations slideshow-slides {
  display: flex !important;
  gap: 1rem !important;
  padding-right: 0 !important;
  margin-right: 0 !important;
}

.product-recommendations slideshow-slide.resource-list__slide {
  min-width: 0 !important;
  max-width: 100% !important;
}

@media screen and (min-width: 990px) {
  .product-recommendations slideshow-slide.resource-list__slide {
    flex: 0 0 calc((100% - 3rem) / 4) !important;
    width: calc((100% - 3rem) / 4) !important;
  }

  .product-recommendations .wlg-rec-card__image {
    aspect-ratio: 4 / 4.55 !important;
  }

  .product-recommendations .wlg-rec-card__overlay {
    padding: 1rem 1rem 0.9rem !important;
  }

  .product-recommendations .wlg-rec-card__title {
    font-size: 1rem !important;
    line-height: 1.18 !important;
  }

  .product-recommendations .wlg-rec-card__price {
    font-size: 0.8rem !important;
  }

  .product-recommendations .wlg-rec-card__eyebrow {
    font-size: 0.68rem !important;
    letter-spacing: 0.18em !important;
  }
}

/* =========================================
   WLG — Pairings from the Field
   True grid layout
========================================= */

.product-recommendations .wlg-pairings-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.product-recommendations .wlg-pairings-grid .resource-list__item {
  min-width: 0 !important;
  width: 100% !important;
}

@media screen and (max-width: 989px) {
  .product-recommendations .wlg-pairings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
  }
}

@media screen and (max-width: 749px) {
  .product-recommendations .wlg-pairings-grid {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (min-width: 990px) {
  .product-recommendations .wlg-rec-card__image {
    aspect-ratio: 4 / 4.45 !important;
  }

  .product-recommendations .wlg-rec-card__overlay {
    padding: 0.95rem 0.95rem 0.85rem !important;
  }

  .product-recommendations .wlg-rec-card__title {
    font-size: 0.98rem !important;
    line-height: 1.18 !important;
  }

  .product-recommendations .wlg-rec-card__price {
    font-size: 0.8rem !important;
  }

  .product-recommendations .wlg-rec-card__eyebrow {
    font-size: 0.66rem !important;
    letter-spacing: 0.18em !important;
  }
}

/* =========================================
   WLG — Pairings from the Field
   Fixed-width editorial card row
========================================= */

.product-recommendations .wlg-pairings-grid {
  display: grid !important;
  gap: 0.9rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

.product-recommendations .wlg-pairings-grid__item {
  min-width: 0 !important;
  width: 100% !important;
}

@media screen and (min-width: 990px) {
  .product-recommendations .wlg-pairings-grid {
    grid-template-columns: repeat(4, minmax(0, 280px)) !important;
    justify-content: start !important;
    gap: 0.9rem !important;
    width: fit-content !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }

  .product-recommendations .wlg-rec-card__image {
    aspect-ratio: 4 / 4.7 !important;
  }

  .product-recommendations .wlg-rec-card__overlay {
    padding: 0.9rem 0.9rem 0.82rem !important;
  }

  .product-recommendations .wlg-rec-card__eyebrow {
    font-size: 0.62rem !important;
    letter-spacing: 0.18em !important;
  }

  .product-recommendations .wlg-rec-card__title {
    font-size: 0.94rem !important;
    line-height: 1.15 !important;
  }

  .product-recommendations .wlg-rec-card__price {
    font-size: 0.77rem !important;
  }
}

/* Align Pairings section with product content without collapsing to page edge */
.product-recommendations .page-width,
.product-recommendations .section--page-width {
  max-width: var(--page-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.product-recommendations .page-width {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Pairings spacing rhythm */

.product-recommendations .wlg-pairings-grid {
  margin-top: 1.75rem;
}

/* Pairings card interaction */

.product-recommendations .recommended-product {
  transition: transform .35s ease, box-shadow .35s ease;
}

.product-recommendations .recommended-product:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 32px rgba(0,0,0,.14);
}

.product-recommendations .wlg-rec-card__overlay {
  background: linear-gradient(
    to top,
    rgba(0,0,0,.65) 0%,
    rgba(0,0,0,.35) 40%,
    rgba(0,0,0,0) 100%
  );
}
/* Force header to stay at top during load */
.header,
.site-header {
  position: relative !important;
  top: 0;
}

/* =========================================
   FIX: Prevent Header Flash on Page Load
========================================= */

/* Hide header initially */
.site-header,
.header,
.shopify-section-header {
  opacity: 0;
  transition: opacity 0.2s ease;
}

/* Show header once page is ready */
body.wlg-ready .site-header,
body.wlg-ready .header,
body.wlg-ready .shopify-section-header {
  opacity: 1;
}

/* ================================
   WLG • Card Badge System
================================ */

.wlg-card-badge-wrap {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  z-index: 10;
}

.wlg-card-badge {
  padding: 0.45rem 0.7rem;
  background: rgba(237, 230, 220, 0.94);
  border: 1px solid rgba(41, 39, 35, 0.14);
  color: #292723;
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}

.wlg-card-badge--soldout {
  background: rgba(41, 39, 35, 0.88);
  color: #EDE6DC;
  border-color: rgba(237, 230, 220, 0.18);
}

.wlg-card-badge-tooltip {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 220px;
  padding: 0.6rem 0.75rem;
  background: rgba(41, 39, 35, 0.94);
  color: #EDE6DC;
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.72rem;
  line-height: 1.45;
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.wlg-card-badge-wrap:hover .wlg-card-badge-tooltip,
.wlg-card-badge-wrap:focus-within .wlg-card-badge-tooltip {
  opacity: 1;
  transform: translateY(0);
}

.sporting-card-fallback {
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(237, 230, 220, 0.08);
  border: 1px solid rgba(199, 136, 48, 0.25);
  padding: 1.5rem;
  text-align: center;
}

.sporting-card-fallback span {
  font-family: "Athelas", serif;
  font-size: 1.05rem;
  line-height: 1.4;
  color: #EDE6DC;
}

.wlg-card-badge-tooltip {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;

  width: 220px;
  padding: 0.6rem 0.75rem;

  background: rgba(41, 39, 35, 0.96);
  color: #EDE6DC;

  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.72rem;
  line-height: 1.45;

  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;

  transition: opacity 0.25s ease, transform 0.25s ease;

  z-index: 999; /* 🔥 KEY FIX */
}

.wlg-card-badge-wrap {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  z-index: 50; /* slightly higher than card layers */
}

box-shadow: 0 8px 18px rgba(0,0,0,0.25);

.wlg-card-badge-wrap {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  z-index: 50;
}

.wlg-card-badge {
  padding: 0.45rem 0.7rem;
  background: rgba(237, 230, 220, 0.94);
  border: 1px solid rgba(41, 39, 35, 0.14);
  color: #292723;
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
  backdrop-filter: blur(2px);
}

.wlg-card-badge--soldout {
  background: rgba(41, 39, 35, 0.88);
  color: #EDE6DC;
  border-color: rgba(237, 230, 220, 0.18);
}

.wlg-card-badge-tooltip {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 240px;
  padding: 0.8rem 0.9rem;

  background: rgba(34, 31, 28, 0.96);
  border: 1px solid rgba(199, 136, 48, 0.22);
  color: #EDE6DC;

  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.72rem;
  line-height: 1.55;
  letter-spacing: 0.01em;

  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(6px);

  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  transition:
    opacity 0.32s ease,
    transform 0.42s cubic-bezier(.22,.61,.36,1);

  z-index: 999;
}

/* subtle gold accent line */
.wlg-card-badge-tooltip::before {
  content: "";
  display: block;
  width: 28px;
  height: 1px;
  background: rgba(199, 136, 48, 0.75);
  margin-bottom: 0.55rem;
}

.wlg-card-badge-wrap:hover .wlg-card-badge-tooltip,
.wlg-card-badge-wrap:focus-within .wlg-card-badge-tooltip {
  opacity: 1;
  transform: translateY(0);
}

.hover-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}

.hover-divider {
  width: 1px;
  height: 14px;
  background: rgba(255,255,255,0.5);
  display: inline-block;
}

.hover-divider {
  width: 1px;
  height: 14px;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(199,136,48,0.8),
    transparent
  );
  opacity: 0.9;
}

.wlg-hover-divider {
  display: inline-block !important;
  width: 1px !important;
  height: 18px !important;
  min-height: 18px !important;
  background: #C78830 !important;
  opacity: 0.85 !important;
  margin: 0 14px !important;
  flex: 0 0 1px !important;
  align-self: center !important;
}

.hover-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}

/* ============================================================
   WLG • Standard Product Page Refinement
   Applies refined spacing, button polish, icon softening,
   and curated pairing adjustments for native product layout.
============================================================ */

/* Main product title/detail column breathing room */
product-information .product-details,
.product-information .product-details {
  padding-top: 3.25rem;
}

/* Product title */
product-information h2,
.product-information h2 {
  margin-bottom: 1rem;
  line-height: 1.08;
}

/* Short editorial subheading under product title */
product-information h2 + p,
.product-information h2 + p {
  max-width: 24rem;
  margin-top: 0.85rem;
  margin-bottom: 1.6rem;
  line-height: 1.55;
  font-size: 0.95rem;
}

/* Gold divider breathing room */
product-information h2 + p + hr,
.product-information h2 + p + .divider,
.product-information h2 + p + [class*="divider"] {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

/* Price spacing */
product-information .price,
.product-information [class*="price"] {
  margin-top: 0.35rem;
  margin-bottom: 1.05rem;
}

/* Quantity selector spacing */
product-information quantity-input,
.product-information .quantity,
.product-information [class*="quantity"] {
  margin-bottom: 0.85rem;
}

/* Add to cart button polish */
product-information button[name="add"],
.product-information .add-to-cart,
.product-information .button {
  min-height: 3.1rem;
  border-radius: 0.95rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.78rem;
  font-weight: 500;
  box-shadow: 0 0.45rem 1rem rgba(41, 39, 35, 0.16);
  transition:
    background-color 220ms ease,
    color 220ms ease,
    border-color 220ms ease,
    transform 220ms ease,
    box-shadow 220ms ease;
}

product-information button[name="add"]:hover,
.product-information .add-to-cart:hover,
.product-information .button:hover {
  transform: translateY(-1px);
  box-shadow: 0 0.7rem 1.4rem rgba(41, 39, 35, 0.2);
}

/* Product description refinement */
product-information .rte,
.product-information [class*="description"] {
  max-width: 34rem;
  line-height: 1.65;
  font-size: 0.92rem;
}

/* Icon card row — soften Shopify feel */
product-information [class*="Info icons"],
product-information [class*="info-icons"] {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Individual icon cards */
product-information [class*="Icon group"],
product-information [class*="icon-group"] {
  background: rgba(237, 230, 220, 0.52);
  border: 1px solid rgba(183, 169, 152, 0.26);
  border-radius: 1rem;
  padding: 1rem 0.9rem;
  box-shadow: 0 0.45rem 1.2rem rgba(41, 39, 35, 0.06);
}

/* Icon scale */
product-information [class*="Icon group"] svg,
product-information [class*="icon-group"] svg {
  width: 1.55rem;
  height: 1.55rem;
}

/* Icon text */
product-information [class*="Icon group"] p,
product-information [class*="icon-group"] p {
  font-size: 0.72rem;
  line-height: 1.25;
  letter-spacing: 0.01em;
}

/* Curated Pairings section */
.product-recommendations h2 {
  margin-bottom: 0.85rem;
  line-height: 1.1;
}

.product-recommendations h2 + p {
  max-width: 34rem;
  line-height: 1.55;
  margin-bottom: 2rem;
}

/* Pairing card polish */
.product-recommendations .product-card,
.product-recommendations [class*="product-card"] {
  transition:
    transform 220ms ease,
    box-shadow 220ms ease;
}

.product-recommendations .product-card:hover,
.product-recommendations [class*="product-card"]:hover {
  transform: translateY(-2px);
}

/* ============================================================
   WLG • Editorial “Why We Chose This” Block
============================================================ */

product-information strong,
.product-information strong {
  display: block;
  font-family: var(--font-heading--family);
  font-size: 0.85rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
  color: var(--color-foreground-heading);
}

product-information strong::after,
.product-information strong::after {
  content: "";
  display: block;
  width: 32px;
  height: 1px;
  background: #C78830; /* Gold Tisane */
  margin-top: 6px;
}

/* ============================================================
   WLG • Standard Product Page Refinements
   Applies to product.wlg-standard.json
============================================================ */

product-information strong {
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  font-weight: 500;
  opacity: 0.8;
}

product-information strong {
  margin-top: 1.75rem;
}

product-information strong + p {
  margin-top: 0.65rem;
  line-height: 1.6;
  max-width: 30rem;
}

product-information strong::before {
  content: "";
  display: block;
  width: 40px;
  height: 1px;
  background: #C78830;
  margin-bottom: 10px;
}

product-information strong + p {
  margin-top: 0.5rem; /* was ~0.65 */
}

product-information strong {
  opacity: 0.75; /* was ~0.8 */
}

product-information strong + p {
  max-width: 32rem; /* was ~30 */
}

product-information strong {
  margin-top: 2rem;
}

product-information .rte p {
  margin-bottom: 0.75rem;
}

product-information strong {
  margin-top: 1.5rem; /* was ~2rem */
}

product-information .rte p:last-child {
  opacity: 0.85;
}

/* ============================================================
   WLG • Variant Picker Styling
============================================================ */

.wlg-variant-picker {
  display: flex;
  flex-direction: column;
  gap: 1.15rem;
  margin: 0 0 2rem;
}

.wlg-variant-option {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  max-width: 220px;
}

.wlg-variant-label {
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #6B6257;
}

.wlg-variant-select {
  width: 100%;
  min-height: 48px;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(41, 39, 35, 0.14);
  background: #F5F1EB;
  color: #292723;
  font-family: "Helvetica LT Pro", sans-serif;
  font-size: 0.95rem;
  line-height: 1.2;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0;
  box-shadow: none;
  transition:
    border-color 0.25s ease,
    background 0.25s ease;
}

.wlg-variant-select:hover {
  border-color: rgba(199, 136, 48, 0.45);
}

.wlg-variant-select:focus {
  outline: none;
  border-color: #C78830;
  background: #F8F5EF;
}

.wlg-variant-option {
  max-width: 320px;
}

.wlg-variant-picker {
  gap: 1.5rem;
}

quantity-selector,
.quantity-selector,
.quantity-input {
  max-width: 320px;
}

.wlg-variant-select:hover {
  background: #F8F5EF;
}

.wlg-variant-select.is-selected,
.wlg-variant-select[aria-pressed="true"] {
  border-color: #C78830;
  background: #F8F5EF;
  box-shadow: 0 0 0 1px rgba(199,136,48,0.18);
}

/* ============================================================
   WLG • Curated Pairings Refinement
   Applies to product recommendation sections
============================================================ */

.product-recommendations {
  padding-top: 4rem !important;
  padding-bottom: 4.5rem !important;
}

.product-recommendations h2 {
  font-family: var(--font-heading--family);
  font-size: clamp(2.2rem, 3vw, 3.2rem);
  line-height: 1.05;
  margin-bottom: 0.65rem;
}

.product-recommendations h2::after {
  content: "";
  display: block;
  width: 64px;
  height: 1px;
  background: #C78830;
  margin-top: 0.85rem;
}

.product-recommendations h2 + p {
  max-width: 36rem;
  margin-top: 2rem;
  margin-bottom: 2.6rem;
  font-size: 1rem;
  line-height: 1.65;
  color: rgba(41, 39, 35, 0.78);
}

.product-recommendations [class*="grid"] {
  gap: 1.25rem !important;
}

.product-recommendations [class*="product-card"] {
  box-shadow: none;
  transition:
    transform 220ms ease,
    filter 220ms ease;
}

.product-recommendations [class*="product-card"]:hover {
  transform: translateY(-3px);
}

.product-recommendations [class*="product-card"] img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.product-recommendations [class*="product-card"] [class*="overlay"],
.product-recommendations [class*="product-card"]::after {
  opacity: 0.88;
}

@media screen and (max-width: 749px) {
  .product-recommendations {
    padding-top: 3rem !important;
    padding-bottom: 3.5rem !important;
  }

  .product-recommendations h2 {
    font-size: 2.35rem;
  }
}

.product-recommendations [class*="overlay"],
.product-recommendations [class*="product-card"]::after {
  opacity: 0.72;
}

.wlg-rec-card__eyebrow {
  opacity: 0.92;
  letter-spacing: 0.14em;
  font-size: 0.72rem;
}

.wlg-rec-card__rule {
  width: 42px;
  height: 1px;
  background: rgba(199,136,48,0.82);
}

.wlg-return-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;

  margin-bottom: 2.2rem;

  font-family: "Athelas", serif;
  font-size: 0.95rem;
  letter-spacing: 0.015em;

  color: #D4A44A !important;

  text-decoration: none;

  opacity: 1;

  transition:
    color 0.25s ease,
    opacity 0.25s ease,
    transform 0.25s ease;
}

.wlg-return-link:hover,
.wlg-return-link:focus {
  color: #F0D7A1 !important;
  transform: translateX(-2px);
}

.wlg-gallery-header .wlg-return-link {
  color: #504727 !important;
  opacity: 0.82;
}

.wlg-gallery-header .wlg-return-link:hover,
.wlg-gallery-header .wlg-return-link:focus {
  color: #292723 !important;
  opacity: 1;
}

.wlg-gallery-header .wlg-return-link {
  display: inline-flex;
  justify-content: flex-start;
  align-self: flex-start;
  margin-bottom: 1.75rem;
}

.wlg-gallery-header__inner {
  align-items: flex-start;
}

.wlg-gallery-header .wlg-return-link {
  display: block;
  width: fit-content;
  margin-left: 0;
  margin-right: auto;
  text-align: left;
}

.collection-grid-section.framed-photo-gallery .wlg-return-link {
  color: rgba(237, 230, 220, 0.78) !important;
}

.collection-grid-section.framed-photo-gallery .wlg-return-link:hover,
.collection-grid-section.framed-photo-gallery .wlg-return-link:focus {
  color: #FFFFFF !important;
  opacity: 1;
}

#gallery {
  scroll-margin-top: 140px;
}

/* =========================================
   WLG • Continuation Module
   Reusable editorial routing system
   ========================================= */

.wlg-continuation-module {
  background: #F3EEE7;
  color: var(--wlg-cont-text);
  padding: clamp(3.75rem, 6vw, 6.5rem) 0;
}

.wlg-continuation-inner {
  max-width: 1320px;
}

.wlg-continuation-header {
  max-width: 760px;
  margin: 0 auto clamp(3.2rem, 5vw, 5rem);
  text-align: center;
}

.wlg-continuation-eyebrow,
.wlg-continuation-card-eyebrow {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.72rem;
  line-height: 1.4;
  margin: 0 0 0.85rem;
  opacity: 0.78;
}

.wlg-continuation-heading {
  font-family: Athelas, serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 1.08;
  margin: 0;
  color: var(--wlg-cont-text);
}

.wlg-continuation-divider {
  width: 78px;
  height: 1px;
  background: var(--wlg-cont-accent);
  margin: 1.35rem auto 1.45rem;
}

.wlg-continuation-intro {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: clamp(0.98rem, 1.4vw, 1.08rem);
  line-height: 1.75;
  color: var(--wlg-cont-text);
  opacity: 0.84;
}

.wlg-continuation-intro p {
  margin: 0;
}

.wlg-continuation-grid {
  display: grid;
  gap: clamp(1.2rem, 2vw, 1.75rem);
}

.wlg-continuation-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wlg-continuation-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.wlg-continuation-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.wlg-continuation-card {
  min-width: 0;
}

.wlg-continuation-card-link {
  display: block;
  height: 100%;
  text-decoration: none;
  color: inherit;
  background: rgba(255, 255, 255, 0.28);
  border: 1px solid rgba(41, 39, 35, 0.07);
  overflow: hidden;
  transition:
    transform 240ms ease,
    border-color 240ms ease,
    background 240ms ease;
}

.wlg-continuation-card-link:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--wlg-cont-accent) 55%, transparent);
  background: rgba(255, 255, 255, 0.38);
}

.wlg-continuation-image-wrap {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: rgba(41, 39, 35, 0.08);
}

.wlg-continuation-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms ease;
}

.wlg-continuation-card-link:hover .wlg-continuation-image {
  transform: scale(1.035);
}

.wlg-continuation-placeholder {
  width: 100%;
  height: 100%;
  background:
    linear-gradient(
      135deg,
      rgba(41, 39, 35, 0.08),
      rgba(199, 136, 48, 0.12)
    );
}

.wlg-continuation-card-content {
  padding: clamp(1.25rem, 2.2vw, 1.75rem);
}

.wlg-continuation-card-title {
  font-family: Athelas, serif;
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  font-weight: 400;
  line-height: 1.16;
  margin: 0 0 0.75rem;
  color: var(--wlg-cont-text);
}

.wlg-continuation-card-caption {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.94rem;
  line-height: 1.65;
  margin: 0;
  color: var(--wlg-cont-text);
  opacity: 0.78;
}

.wlg-continuation-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.9rem;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wlg-cont-text);
}

.wlg-continuation-card-cta::after {
  content: "→";
  color: var(--wlg-cont-accent);
  transform: translateX(0);
  transition: transform 200ms ease;
}

.wlg-continuation-card-link:hover .wlg-continuation-card-cta::after {
  transform: translateX(4px);
}

.wlg-continuation-footer {
  text-align: center;
  margin-top: clamp(2rem, 4vw, 3.5rem);
}

.wlg-continuation-footer-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--wlg-cont-text);
  border-bottom: 1px solid var(--wlg-cont-accent);
  padding-bottom: 0.35rem;
}

.wlg-continuation-footer-link:hover {
  color: var(--wlg-cont-accent);
}

/* Mood refinements */

.wlg-continuation-module--field .wlg-continuation-card-link,
.wlg-continuation-module--place .wlg-continuation-card-link {
  background: rgba(255, 255, 255, 0.18);
}

.wlg-continuation-module--craft .wlg-continuation-card-link {
  border-color: rgba(41, 39, 35, 0.16);
}

/* Responsive */

@media screen and (max-width: 990px) {
  .wlg-continuation-grid--4,
  .wlg-continuation-grid--3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wlg-continuation-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 640px) {
  .wlg-continuation-module {
    padding: 3.25rem 0;
  }

  .wlg-continuation-grid--4,
  .wlg-continuation-grid--3,
  .wlg-continuation-grid--2 {
    grid-template-columns: 1fr;
  }

  .wlg-continuation-header {
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }

  .wlg-continuation-divider {
    margin-left: 0;
  }

  .wlg-continuation-card-content {
    padding: 1.35rem;
  }
}

  .wlg-continuation-image-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
      linear-gradient(
        to top,
        rgba(20,20,20,0.18),
        rgba(20,20,20,0.03)
      );
    pointer-events: none;
  }

  .template-article .section-content-wrapper h1,
  .template-article .blog-post-title,
  .template-article .article-template__title {
    font-size: clamp(2.8rem, 4.4vw, 4.8rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.02em;
    max-width: 14ch;
    margin-inline: auto;
  }

  .wlg-continuation-card:nth-child(3) .wlg-continuation-image {
    object-fit: contain;
    padding: 0.3rem;
    background: #F3EEE7;
  }

  /* =========================================
   WLG • Gary Acquisition Inquiry Refinement
   ========================================= */

.gary-acquisition__inquiry-card {
  background: rgba(237, 230, 220, 0.62);
  border: 1px solid rgba(41, 39, 35, 0.12);
  box-shadow: 0 18px 42px rgba(41, 39, 35, 0.08);
  padding: clamp(2rem, 4vw, 4rem);
}

.gary-acquisition__form-intro {
  max-width: 48rem;
  margin-bottom: 2rem;
}

.gary-acquisition__form-intro h3 {
  font-family: Athelas, Georgia, serif;
  font-size: clamp(2rem, 3vw, 3.2rem);
  line-height: 1.08;
  color: #292723;
  margin: 0 0 1.25rem;
}

.gary-acquisition__form-intro p {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.75;
  color: rgba(41, 39, 35, 0.76);
}

.gary-acquisition__form-summary {
  background: rgba(255, 255, 255, 0.48);
  border: 1px solid rgba(41, 39, 35, 0.14);
  border-radius: 4px;
  box-shadow: 0 14px 34px rgba(41, 39, 35, 0.08);
  padding: clamp(1.5rem, 3vw, 2.25rem);
  margin: 2rem 0 2.5rem;
}

.gary-acquisition__summary-label {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #c78830;
  margin: 0 0 1.25rem;
}

.gary-acquisition__summary-row {
  display: grid;
  grid-template-columns: minmax(9rem, 0.8fr) 1.4fr;
  gap: 1.5rem;
  padding: 1rem 0;
  border-top: 1px solid rgba(41, 39, 35, 0.12);
}

.gary-acquisition__summary-row span {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.92rem;
  color: rgba(41, 39, 35, 0.68);
}

.gary-acquisition__summary-row strong {
  font-family: Athelas, Georgia, serif;
  font-size: 1.08rem;
  font-weight: 400;
  color: #292723;
}

.gary-acquisition__form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.35rem 1.5rem;
}

.gary-acquisition__field--full {
  grid-column: 1 / -1;
}

.gary-acquisition__field label {
  display: block;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(41, 39, 35, 0.62);
  margin-bottom: 0.65rem;
}

.gary-acquisition__field input,
.gary-acquisition__field select,
.gary-acquisition__field textarea {
  width: 100%;
  min-height: 3.55rem;
  border: 1px solid rgba(41, 39, 35, 0.18);
  background: rgba(255, 255, 255, 0.56);
  color: #292723;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.98rem;
  padding: 0.95rem 1rem;
  border-radius: 3px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
  transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.gary-acquisition__field textarea {
  min-height: 9rem;
  resize: vertical;
  line-height: 1.6;
}

.gary-acquisition__field input:focus,
.gary-acquisition__field select:focus,
.gary-acquisition__field textarea:focus {
  outline: none;
  border-color: rgba(199, 136, 48, 0.72);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 0 0 3px rgba(199, 136, 48, 0.12);
}

.gary-acquisition__field input::placeholder,
.gary-acquisition__field textarea::placeholder {
  color: rgba(41, 39, 35, 0.42);
}

.gary-acquisition__stewardship-note {
  margin: 2rem 0 1.5rem;
  padding: 1.35rem 1.5rem;
  border: 1px solid rgba(41, 39, 35, 0.12);
  background: rgba(255, 255, 255, 0.4);
  font-family: Athelas, Georgia, serif;
  font-size: 1.05rem;
  line-height: 1.55;
  color: rgba(41, 39, 35, 0.82);
}

.gary-acquisition__submit {
  width: 100%;
  min-height: 4rem;
  border: 1px solid rgba(199, 136, 48, 0.4);
  background: #292723;
  color: #d6b36c;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 0.82rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, transform 180ms ease;
}

.gary-acquisition__submit:hover {
  background: #3a4d42;
  color: #ffffff;
  transform: translateY(-1px);
}

.gary-acquisition__success,
.gary-acquisition__errors {
  background: rgba(255, 255, 255, 0.52);
  border: 1px solid rgba(41, 39, 35, 0.14);
  padding: 2rem;
}

.gary-acquisition__success h3 {
  font-family: Athelas, Georgia, serif;
  font-size: 2rem;
  color: #292723;
  margin: 0 0 1rem;
}

.gary-acquisition__success p {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  line-height: 1.7;
  color: rgba(41, 39, 35, 0.76);
}

@media screen and (max-width: 749px) {
  .gary-acquisition__inquiry-card {
    padding: 1.5rem;
  }

  .gary-acquisition__form-grid,
  .gary-acquisition__summary-row {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }

  .gary-acquisition__summary-row {
    padding: 0.95rem 0;
  }
}

/* WLG • Gary Inquiry polish corrections */

.gary-acquisition__inquiry {
  align-items: flex-start;
}

.gary-acquisition__inquiry > div:first-child {
  position: sticky;
  top: 7rem;
  align-self: flex-start;
}

.gary-acquisition__field label {
  color: rgba(41, 39, 35, 0.72);
}

.gary-acquisition__field input,
.gary-acquisition__field select,
.gary-acquisition__field textarea {
  color: #292723;
  background: rgba(255, 255, 255, 0.72);
}

.gary-acquisition__field select {
  color: #292723;
}

.gary-acquisition__field select:invalid,
.gary-acquisition__field select option[value=""] {
  color: rgba(41, 39, 35, 0.48);
}

.gary-acquisition__field option {
  color: #292723;
  background: #ede6dc;
}

.gary-acquisition__field input::placeholder,
.gary-acquisition__field textarea::placeholder {
  color: rgba(41, 39, 35, 0.48);
}

.gary-acquisition__field input:-webkit-autofill,
.gary-acquisition__field textarea:-webkit-autofill,
.gary-acquisition__field select:-webkit-autofill {
  -webkit-text-fill-color: #292723;
  box-shadow: 0 0 0 1000px #f5f0e8 inset;
}

@media screen and (max-width: 989px) {
  .gary-acquisition__inquiry > div:first-child {
    position: static;
  }
}

/* =========================================
   WLG • Gary Inquiry Editorial Luxury Pass
   ========================================= */

.gary-acquisition__inquiry {
  display: grid;
  grid-template-columns: minmax(18rem, 0.72fr) 1.28fr;
  gap: clamp(2.7rem, 4vw, 4.4rem);
  align-items: flex-start;
  padding-top: 2rem;
}

.gary-acquisition__inquiry > div:first-child {
  position: sticky;
  top: 7rem;
  align-self: start;
}

.gary-acquisition__inquiry > div:first-child h2 {
  font-family: Athelas, Georgia, serif;
  font-size: clamp(2.7rem, 4vw, 4.4rem);
  line-height: 0.94;
  letter-spacing: -0.04em;
  color: #292723;
  margin: 0 0 2rem;
  max-width: 10ch;
}

.gary-acquisition__inquiry > div:first-child p {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.04rem;
  line-height: 1.9;
  color: rgba(41, 39, 35, 0.72);
  max-width: 28rem;
}

.gary-acquisition__inquiry .gary-acquisition__eyebrow {
  display: inline-block;
  margin-bottom: 1.1rem;
  color: #c78830;
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.gary-acquisition__inquiry > div:first-child::after {
  content: "";
  display: block;
  width: 5rem;
  height: 1px;
  background: rgba(199, 136, 48, 0.72);
  margin: 2rem 0 2.4rem;
}

.gary-acquisition__inquiry-card {
  background: rgba(255, 255, 255, 0.36);
  border: 1px solid rgba(41, 39, 35, 0.10);
  box-shadow:
    0 18px 40px rgba(41, 39, 35, 0.06),
    inset 0 1px 0 rgba(255,255,255,0.55);
  padding: clamp(2rem, 4vw, 4rem);
}

.gary-acquisition__form-intro {
  margin-bottom: 2.8rem;
}

.gary-acquisition__form-intro .gary-acquisition__panel-label {
  color: #c78830;
  letter-spacing: 0.22em;
  font-size: 0.78rem;
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.gary-acquisition__form-intro h3 {
  font-family: Athelas, Georgia, serif;
  font-size: clamp(2.6rem, 4vw, 4rem);
  line-height: 1.04;
  letter-spacing: -0.03em;
  color: #292723;
  margin: 0 0 1.5rem;
  max-width: 16ch;
}

.gary-acquisition__form-intro p {
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1.02rem;
  line-height: 1.85;
  color: rgba(41, 39, 35, 0.76);
  max-width: 52rem;
}

.gary-acquisition__form-summary {
  background: rgba(255,255,255,0.48);
  border: 1px solid rgba(41, 39, 35, 0.10);
  border-radius: 3px;
  box-shadow: 0 12px 30px rgba(41,39,35,0.05);
  padding: 2.2rem 2.4rem;
  margin-bottom: 2.8rem;
}

.gary-acquisition__summary-label {
  color: #c78830;
  font-size: 0.84rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin-bottom: 1.4rem;
}

.gary-acquisition__summary-row {
  display: grid;
  grid-template-columns: minmax(10rem, 0.75fr) 1.25fr;
  align-items: center;
  gap: 2rem;
  padding: 1.25rem 0;
  border-top: 1px solid rgba(41,39,35,0.10);
}

.gary-acquisition__summary-row span {
  color: rgba(41,39,35,0.76);
  font-size: 0.98rem;
}

.gary-acquisition__summary-row strong {
  color: #292723;
  font-family: Athelas, Georgia, serif;
  font-size: 1.18rem;
  font-weight: 400;
  line-height: 1.4;
}

.gary-acquisition__summary-row:last-child strong {
  color: #c78830;
  font-size: 1.32rem;
}

.gary-acquisition__form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 1.8rem 1.6rem;
}

.gary-acquisition__field--full {
  grid-column: 1 / -1;
}

.gary-acquisition__field label {
  display: block;
  margin-bottom: 0.75rem;
  color: #c78830;
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
}

.gary-acquisition__field input,
.gary-acquisition__field select,
.gary-acquisition__field textarea {
  width: 100%;
  border: 1px solid rgba(41,39,35,0.14);
  background: rgba(255,255,255,0.72);
  color: #292723;
  min-height: 4rem;
  padding: 1rem 1.2rem;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 2px;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.gary-acquisition__field textarea {
  min-height: 10rem;
  resize: vertical;
}

.gary-acquisition__field input:focus,
.gary-acquisition__field select:focus,
.gary-acquisition__field textarea:focus {
  outline: none;
  border-color: rgba(199,136,48,0.7);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 0 0 3px rgba(199,136,48,0.10);
}

.gary-acquisition__field input::placeholder,
.gary-acquisition__field textarea::placeholder {
  color: rgba(41,39,35,0.50);
}

.gary-acquisition__stewardship-note {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  margin: 2.5rem 0 2rem;
  padding: 1.6rem 1.8rem;
  background: rgba(255,255,255,0.46);
  border: 1px solid rgba(199,136,48,0.18);
  font-family: Athelas, Georgia, serif;
  font-size: 1.08rem;
  line-height: 1.75;
  color: rgba(41,39,35,0.82);
}

.gary-acquisition__stewardship-note::before {
  content: "✦";
  color: #c78830;
  font-size: 1.4rem;
  line-height: 1;
  margin-top: 0.12rem;
}

.gary-acquisition__submit {
  width: 100%;
  min-height: 4.4rem;
  border: 1px solid rgba(199,136,48,0.28);
  background:
    linear-gradient(
      135deg,
      #1f1d1a 0%,
      #292723 52%,
      #35312c 100%
    );
  color: #d6b36c;
  font-size: 0.84rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif;
  transition:
    transform 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.gary-acquisition__submit:hover {
  color: #ffffff;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(41,39,35,0.18);
}

@media screen and (max-width: 989px) {

  .gary-acquisition__inquiry {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .gary-acquisition__inquiry > div:first-child {
    position: static;
  }

  .gary-acquisition__inquiry > div:first-child h2 {
    max-width: none;
    line-height: 1;
  }

  .gary-acquisition__form-grid,
  .gary-acquisition__summary-row {
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }

  .gary-acquisition__summary-row {
    padding: 1rem 0;
  }

  .gary-acquisition__inquiry-card {
    padding: 1.5rem;
  }
}

  /* =========================================
    WLG • Inquiry Form Hard Reset
    ========================================= */

  .gary-acquisition__inquiry-card input,
  .gary-acquisition__inquiry-card select,
  .gary-acquisition__inquiry-card textarea {
    appearance: none;
    -webkit-appearance: none;
    opacity: 1 !important;

    background: rgba(255,255,255,0.92) !important;
    color: #292723 !important;

    border: 1px solid rgba(41,39,35,0.16) !important;

    font-family: "Helvetica LT Pro", Helvetica, Arial, sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;

    box-shadow: none !important;
  }

  .gary-acquisition__inquiry-card label {
    opacity: 1 !important;
    color: #c78830 !important;
  }

  .gary-acquisition__inquiry-card input::placeholder,
  .gary-acquisition__inquiry-card textarea::placeholder {
    color: rgba(41,39,35,0.52) !important;
    opacity: 1 !important;
  }

  .gary-acquisition__inquiry-card select {
    background-image:
      linear-gradient(45deg, transparent 50%, #c78830 50%),
      linear-gradient(135deg, #c78830 50%, transparent 50%);
    background-position:
      calc(100% - 22px) calc(50% - 3px),
      calc(100% - 16px) calc(50% - 3px);
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
  }

  /* =========================================
   WLG • Gary Inquiry Layout Corrections
   ========================================= */

/* Give the left heading more room before wrapping */
.gary-acquisition__inquiry {
  grid-template-columns: minmax(25rem, 0.9fr) minmax(0, 1.35fr);
  gap: clamp(3rem, 5vw, 6rem);
}

.gary-acquisition__inquiry > div:first-child h2 {
  max-width: 13ch;
  font-size: clamp(2.7rem, 4vw, 4.4rem);
  line-height: 0.98;
}

/* Prevent form elements from exceeding their container */
.gary-acquisition__form,
.gary-acquisition__form-grid,
.gary-acquisition__field,
.gary-acquisition__field input,
.gary-acquisition__field select,
.gary-acquisition__field textarea {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}

/* Fix overlap / overflow in the two-column field rows */
.gary-acquisition__form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.6rem;
  row-gap: 1.8rem;
  width: 100%;
}

.gary-acquisition__field input,
.gary-acquisition__field select,
.gary-acquisition__field textarea {
  display: block;
  width: 100% !important;
}

/* Restore consistent field height */
.gary-acquisition__field input,
.gary-acquisition__field select {
  min-height: 4rem;
}

.gary-acquisition__field textarea {
  min-height: 10rem;
}

.gary-acquisition__stewardship-note::before {
  content: "";
  flex: 0 0 2.1rem;
  width: 2.1rem;
  height: 2.1rem;
  margin-top: 0.15rem;
  background-image: url('WildLuxe_Logo_Icon_Natural_Sienna.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

@media screen and (max-width: 989px) {
  .gary-acquisition__inquiry {
    grid-template-columns: 1fr;
  }

  .gary-acquisition__inquiry > div:first-child h2 {
    max-width: none;
  }
}

@media screen and (max-width: 749px) {
  .gary-acquisition__form-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================
   WLG • Restore Gary Top Acquisition Panel Select
   ========================================= */

.gary-acquisition__panel .gary-acquisition__field select {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  background: transparent !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  box-shadow: none !important;
}

.gary-acquisition__panel .gary-acquisition__field select option {
  background: #292723 !important;
  color: #ffffff !important;
}

.gary-acquisition__panel .gary-acquisition__field select:focus {
  border-color: rgba(199, 136, 48, 0.85) !important;
  box-shadow: 0 0 0 3px rgba(199, 136, 48, 0.16) !important;
}

/* =========================================
   WLG • Gary Inquiry Reveal Transitions
   ========================================= */

.gary-acquisition__inquiry > div:first-child,
.gary-acquisition__inquiry-card,
.gary-acquisition__form-summary,
.gary-acquisition__stewardship-note,
.gary-acquisition__submit {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity 900ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.gary-acquisition__inquiry.is-visible > div:first-child {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 80ms;
}

.gary-acquisition__inquiry.is-visible .gary-acquisition__inquiry-card {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 180ms;
}

.gary-acquisition__inquiry.is-visible .gary-acquisition__form-summary {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 260ms;
}

.gary-acquisition__inquiry.is-visible .gary-acquisition__stewardship-note {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 340ms;
}

.gary-acquisition__inquiry.is-visible .gary-acquisition__submit {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 420ms;
}

@media (prefers-reduced-motion: reduce) {
  .gary-acquisition__inquiry > div:first-child,
  .gary-acquisition__inquiry-card,
  .gary-acquisition__form-summary,
  .gary-acquisition__stewardship-note,
  .gary-acquisition__submit {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}