/*
 * Luxurycandles theme — stylesheet.
 *
 * This is the only stylesheet this THEME owns, and it is served verbatim by the
 * `theme.asset` route and fingerprinted by app/Theming/Fingerprinter.php. There
 * is no build step: edit this file and the change is live.
 *
 * Core-layer styles (core blocks, layout primitives) are NOT part of this file.
 * They ship from resources/core-blocks/ and arrive as a separate <link> emitted
 * by layout/theme.twig. To restyle a core block for this theme, declare a preset
 * in theme.json or ship themes/luxurycandles/core-blocks/<name>/ — do not copy
 * core CSS in here.
 *
 * Do not add an `@import` with a `../` path: the browser resolves it against
 * /themes/luxurycandles/assets/, which escapes the route's containment check and
 * 404s. tests/Feature/Theming/Luxurycandles/ThemeStylesheetTest.php enforces this.
 */

/* ── Self-hosted brand fonts ──────────────────────────────────────────────── */
/*
 * Cormorant Garamond + DM Sans (Latin + Latin Extended subsets — Latin-only
 * files drop č ď ě ľ ĺ ň ŕ ř š ť ů ž, so CZ/SK text falls back mid-word) —
 * served via theme asset middleware. Regenerate with pyftsubset over Google's
 * latin + latin-ext unicode ranges; resources/js/themeFontGlyphCoverage.test.ts
 * fails on any bundled woff2 that is missing a CZ/SK glyph.
 * Paths are relative to this CSS file's location in assets/.
 * font-display: swap prevents invisible-text (FOIT) periods.
 */

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/cormorant-garamond-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('./fonts/cormorant-garamond-500.woff2') format('woff2');
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('./fonts/cormorant-garamond-600.woff2') format('woff2');
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('./fonts/cormorant-garamond-700.woff2') format('woff2');
}

@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/dm-sans-400.woff2') format('woff2');
}

@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('./fonts/dm-sans-500.woff2') format('woff2');
}

@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('./fonts/dm-sans-700.woff2') format('woff2');
}

/* Inter is a variable font: one file per subset serves weights 400-700. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* The responsive_image macro (resources/themes/default/partials/responsive-image.twig,
   inherited by this theme) always emits width/height attributes on <img> (defaulting
   to 480x480 when no explicit size is passed). Force the intrinsic ratio back so
   those attributes act only as a layout-shift hint, never a forced box size. */
img {
  max-width: 100%;
  height: auto;
}

/* <picture> defaults to display: inline, which sits it on a text baseline inside
   a line box — inside an aspect-ratio container this overflows by the line-box
   descender and shifts the crop. */
picture {
  display: block;
}

/* Accessibility utility — hides element visually but keeps it for screen readers */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* Skip-to-content link — visible on focus for keyboard navigation */
.skip-to-content {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.skip-to-content:focus {
  position: fixed;
  top: 1rem;
  left: 1rem;
  z-index: 9999;
  width: auto;
  height: auto;
  padding: 0.5rem 1rem;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
  background-color: var(--color-cream, #f7f1e6);
  color: var(--color-black, #0a0a0a);
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  outline: 2px solid var(--color-black, #0a0a0a);
  outline-offset: 2px;
  text-decoration: none;
}

:root {
  /* Brand palette — primary */
  --color-cream: #f8f4ed;
  --color-black: #0a0a0a;
  --color-gold: #c4a572;
  /* AA text variant of --color-gold on the light schemes (>= 4.5:1 on
     --color-cream and white). `.scheme-espresso` re-points this token at
     --color-gold (6.55:1 on espresso) via the theme's color_scheme_group in
     config/settings_schema.json; rules, borders and backgrounds keep the
     decorative gold. */
  --color-gold-text: #836830;

  /* Radius — this theme is deliberately square; pills/circles are the only exceptions */
  --radius: 0;
  --radius-pill: 9999px;

  /* Brand palette — semantic editorial tokens */
  --espresso: #2a241e;
  --cream: #f8f4ed;
  --cream-dark: #ebe2d3;
  --rose-gold: #b89478;
  --mocha: #8b7355;
  --warm-white: #fefcf8;

  /* Semantic aliases */
  --color-primary: var(--espresso);
  --color-accent: var(--color-gold);
  --color-accent-gold: var(--color-gold);
  --color-secondary: var(--mocha);
  --color-text: var(--espresso);

  /* Typography */
  --font-serif: 'Cormorant Garamond', ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
  --font-sans: 'DM Sans', ui-sans-serif, system-ui, sans-serif;
  --font-heading: var(--font-serif);
  --font-body: var(--font-sans);

  /* Spacing tokens */
  --space-section: 5rem;
  --space-section-sm: 3rem;
  --space-section-lg: 7rem;
  --space-container: 1.5rem;
  --page-max-width: 80rem;

  /* Animation */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

body {
  background-color: var(--color-cream);
  color: var(--color-black);
  font-family: var(--font-body);
  margin: 0;
}

/* Form controls — opt these into border-box only. The theme intentionally has
 * no global `*` reset (it shifts padding-sized desktop layout site-wide), but
 * without border-box a control with `width: 100%` + padding/border computes
 * content-box and overflows its column (e.g. .lc-auth__input on phones). */
input,
select,
textarea,
button {
  box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

h1 {
  letter-spacing: -0.03em;
}

/* ── Section layout ───────────────────────────────────────────────────────── */

.section {
  padding-block: var(--space-section);
}

@media (max-width: 768px) {
  .section {
    padding-block: var(--space-section-sm);
  }
}

/* ── Hero h1 ──────────────────────────────────────────────────────────────── */

.hero__title,
.hero__heading {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: clamp(3rem, 8vw, 5.5rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
}

/* ── Brand helpers (gold dividers, card grid, section heading underline) ──── */

.lc-divider--gold {
  display: block;
  width: 3rem;
  height: 1px;
  background-color: var(--color-gold, #c4a572);
  margin: 1rem auto;
  border: 0;
}

.lc-divider--gold-thick {
  display: block;
  width: 3rem;
  height: 2px;
  background-color: var(--color-gold, #c4a572);
  margin: 1rem auto;
  border: 0;
}

.lc-section__heading-after::after {
  content: '';
  display: block;
  width: 3rem;
  height: 1px;
  background-color: var(--color-gold, #c4a572);
  margin: 0.75rem auto 0;
}

.lc-grid--cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2rem;
}
@media (max-width: 767px) {
  .lc-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Used by .lc-product-card image (was inline width/height/object-fit on <img>). */
.lc-product-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

/* ── Section headings (label-style, uppercase + gold rule) ───────────────── */

.section__heading {
  font-family: var(--font-sans, var(--font-heading));
  font-weight: 500;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--color-secondary, #6b5c45);
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 2rem;
}

.section__heading::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 3rem;
  height: 1px;
  background: var(--color-accent-gold, #c4a572);
}

/* ── Button variants ──────────────────────────────────────────────────────── */

.btn--primary {
  background: var(--color-accent-gold, #c4a572);
  color: var(--color-cream, #f7f1e6);
  padding: 0.875rem 2rem;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background 0.2s ease;
}

.btn--primary:hover {
  background: color-mix(in srgb, var(--color-accent-gold, #c4a572) 85%, black);
}

.btn--outline {
  background: transparent;
  color: var(--color-text, #0a0a0a);
  padding: 0.875rem 2rem;
  border: 1px solid var(--color-text, #0a0a0a);
  font-family: var(--font-sans, system-ui, sans-serif);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}

.btn--outline:hover {
  background: var(--color-text, #0a0a0a);
  color: var(--color-cream, #f7f1e6);
}

/* ── Web Component visibility guards ──────────────────────────────────────── */
/*
 * These rules hide overlay WCs (cart-drawer, cart-upsell-modal) until JS
 * initialises and sets data-open="true".  Without them the raw HTML is visible
 * below the page fold before connectedCallback() runs.
 */

/* ── cart-drawer slide-over panel ──────────────────────────────────────────── */

cart-drawer {
  position: fixed;
  inset: 0;
  z-index: 200;
  opacity: 0;
  visibility: hidden;
  background: rgba(42, 36, 30, 0.45);
  transition: opacity 300ms var(--ease, ease), visibility 300ms var(--ease, ease);
  pointer-events: none;
}

cart-drawer[data-open="true"] {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

cart-drawer focus-trap {
  position: fixed;
  top: 0;
  right: 0;
  width: 460px;
  max-width: 100vw;
  height: 100vh;
  background: var(--warm-white, #fefcf8);
  transform: translateX(100%);
  transition: transform 400ms var(--ease, ease);
  z-index: 201;
  display: flex;
  flex-direction: column;
}

cart-drawer[data-open="true"] focus-trap {
  transform: translateX(0);
}

body[data-cart-drawer-open] {
  overflow: hidden;
}

[data-cart-drawer-body] {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

.drawer-head {
  padding: 28px 32px;
  border-bottom: 1px solid rgba(42, 36, 30, 0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
}

.drawer-head h3 {
  font-family: var(--font-serif, 'Cormorant Garamond', serif);
  font-size: 24px;
  letter-spacing: 0.02em;
  margin: 0;
  color: var(--espresso, #2a241e);
}

.drawer-head__count {
  font-size: 16px;
  color: var(--mocha, #8b7355);
  font-weight: 400;
}

.drawer-head__close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  color: var(--espresso, #2a241e);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color 150ms var(--ease, ease);
}

.drawer-head__close:hover {
  color: var(--mocha, #8b7355);
}

.drawer-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0 32px;
}

.drawer-empty {
  padding: 64px 0;
  text-align: center;
  color: var(--mocha, #8b7355);
}

.drawer-empty__msg {
  font-family: var(--font-serif, 'Cormorant Garamond', serif);
  font-size: 22px;
  margin: 16px 0 24px;
}

.drawer-foot {
  padding: 24px 32px 32px;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
  background: var(--cream, #f8f4ed);
  flex-shrink: 0;
}

.drawer-foot__totals {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 16px;
}

.drawer-foot__label {
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mocha, #8b7355);
}

.drawer-foot__value {
  font-family: var(--font-serif, 'Cormorant Garamond', serif);
  font-size: 22px;
  color: var(--espresso, #2a241e);
}

.drawer-foot__cta {
  display: block;
  width: 100%;
  text-align: center;
  padding: 14px 24px;
  background: var(--espresso, #2a241e);
  color: var(--warm-white, #fefcf8);
  font-family: var(--font-sans, 'DM Sans', sans-serif);
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 200ms var(--ease, ease);
  box-sizing: border-box;
}

.drawer-foot__cta:hover {
  background: #1a1410;
  color: var(--warm-white, #fefcf8);
}

.drawer-foot__cta--ghost {
  margin-top: 8px;
  background: transparent;
  color: var(--espresso, #2a241e);
  border: 1px solid rgba(42, 36, 30, 0.18);
}

.drawer-foot__cta--ghost:hover {
  background: rgba(42, 36, 30, 0.06);
  color: var(--espresso, #2a241e);
}

.drawer-foot__note {
  margin-top: 12px;
  text-align: center;
  font-size: 11px;
  color: var(--mocha, #8b7355);
}

.drawer-foot .lc-cart-totals__shipping-progress {
  margin-bottom: 0.75rem;
}

.cart-row {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  gap: 16px;
  padding: 24px 0;
  border-bottom: 1px solid rgba(42, 36, 30, 0.1);
  align-items: start;
}

.cart-row:last-child {
  border-bottom: none;
}

.cart-row__media {
  aspect-ratio: 1 / 1.2;
  background: var(--cream-dark, #ebe2d3);
  overflow: hidden;
}

.cart-row__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cart-row__name {
  font-family: var(--font-serif, 'Cormorant Garamond', serif);
  font-size: 18px;
  line-height: 1.2;
  margin: 0 0 4px;
  color: var(--espresso, #2a241e);
}

.cart-row__link {
  color: inherit;
  text-decoration: none;
}
.cart-row__link:hover {
  color: var(--color-gold-text, #836830);
}
.cart-row__media > .cart-row__link {
  display: block;
  width: 100%;
  height: 100%;
}

.cart-row__meta {
  font-size: 12px;
  color: var(--mocha, #8b7355);
  margin: 0 0 4px;
}

.cart-row__availability {
  font-size: 12px;
  margin: 0 0 12px;
  color: #1a6632;
}

.cart-row__availability--out_of_stock { color: #842029; }

.cart-row__availability--backorder,
.cart-row__availability--preorder { color: #92400e; }

.cart-row__qty {
  display: flex;
  align-items: center;
  gap: 16px;
}

.cart-row__remove {
  background: none;
  border: none;
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--mocha, #8b7355);
  cursor: pointer;
  padding: 4px 0;
  transition: color 150ms var(--ease, ease);
}

.cart-row__remove:hover {
  color: var(--espresso, #2a241e);
}

.cart-row__price {
  font-family: var(--font-sans, 'DM Sans', sans-serif);
  font-size: 14px;
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(42, 36, 30, 0.1);
  background: var(--warm-white, #fefcf8);
}

.qty button {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--mocha, #8b7355);
  cursor: pointer;
  transition: color 150ms var(--ease, ease);
}

.qty button:hover:not(:disabled) {
  color: var(--espresso, #2a241e);
}

.qty button:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.qty span {
  min-width: 36px;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

@media (max-width: 480px) {
  .drawer-head,
  .drawer-body,
  .drawer-foot {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* ── add-to-cart-upsell-modal ─────────────────────────────────────────────── */

add-to-cart-upsell-modal {
  display: none;
  position: fixed;
  inset: 0;
  /* Above the sticky add-to-bag bar (inline z-index 100), the cookie banner
     (90) and the cookie reopen button, so the modal's action buttons stay
     reachable on a product page. */
  z-index: 210;
  background: rgba(0, 0, 0, 0.45);
  align-items: center;
  justify-content: center;
}

add-to-cart-upsell-modal[data-open="true"] {
  display: flex;
}

/* Modal panel — warm-white bg, 12px radius, 672px max-width (matches V1 sm:max-w-2xl) */
add-to-cart-upsell-modal focus-trap {
  background: #faf8f5;
  border-radius: var(--radius);
  width: min(90vw, 42rem);
  max-height: 90vh;
  max-height: 90dvh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
}

/* Header and footer stay put; only the scroll area shrinks and scrolls. */
add-to-cart-upsell-modal [data-cart-upsell-body],
add-to-cart-upsell-modal .cart-upsell-modal__panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
}

/* ── Header ── */
.cart-upsell-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem 1rem;
  border-bottom: 1px solid rgba(42, 36, 30, 0.1);
}

.cart-upsell-modal__header-content {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

/* Rose-gold tinted circle wrapping the checkmark (V1: size-10 rounded-full bg-theme-secondary/10) */
.cart-upsell-modal__check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(184, 148, 120, 0.12);
  color: var(--rose-gold, #b89478);
  flex-shrink: 0;
}

.cart-upsell-modal__title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.25rem;
  font-weight: 500;
  margin: 0;
  color: var(--espresso, #2a241e);
  letter-spacing: 0.01em;
}

.cart-upsell-modal__subtitle {
  margin: 0.125rem 0 0;
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
}

.cart-upsell-modal__close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  color: var(--mocha, #8b7355);
  transition: color 0.15s;
}

.cart-upsell-modal__close:hover {
  color: var(--espresso, #2a241e);
}

/* ── Scrollable body ── */
.cart-upsell-modal__scroll {
  padding: 1.25rem 1.5rem;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}

/* ── Added product card (V1: my-4 rounded-lg border border-gray-200 bg-gray-50 p-4) ── */
.cart-upsell-modal__added {
  display: flex;
  gap: 1rem;
  background: var(--cream, #f8f4ed);
  border: 1px solid rgba(42, 36, 30, 0.1);
  border-radius: var(--radius);
  padding: 1rem;
  margin-bottom: 1.25rem;
}

.cart-upsell-modal__added-image {
  width: 80px;
  height: 80px;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid rgba(42, 36, 30, 0.1);
  background: #fff;
}

.cart-upsell-modal__added-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.cart-upsell-modal__added-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
}

.cart-upsell-modal__added-name {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1rem;
  font-weight: 500;
  margin: 0 0 0.25rem;
  color: var(--espresso, #2a241e);
  letter-spacing: 0.01em;
}

.cart-upsell-modal__added-variant {
  margin: 0 0 0.25rem;
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
}

.cart-upsell-modal__added-addons {
  list-style: none;
  margin: 0.25rem 0;
  padding: 0;
  font-size: 0.75rem;
  color: var(--mocha, #8b7355);
}

/* Qty + price row — flex space-between (V1: flex items-center justify-between) */
.cart-upsell-modal__added-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.5rem;
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
}

.cart-upsell-modal__added-total {
  font-weight: 600;
  color: var(--espresso, #2a241e);
  font-size: 0.9375rem;
}

/* ── Upsell products grid (V1: grid-cols-2 sm:grid-cols-4) ── */
.cart-upsell-modal__products {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}

@media (min-width: 640px) {
  .cart-upsell-modal__products {
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
  }
}

/* Each upsell card (V1: bg-white border border-gray-200 rounded-lg overflow-hidden hover:shadow-md) */
.cart-upsell-product {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid rgba(42, 36, 30, 0.1);
  background: #fff;
  transition: box-shadow 0.2s;
}

.cart-upsell-product:hover {
  box-shadow: 0 4px 16px rgba(42, 36, 30, 0.1);
}

/* Image link — aspect-square, object-cover with zoom-on-hover */
.cart-upsell-product__image-link {
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--cream, #f8f4ed);
}

.cart-upsell-product__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.3s ease;
}

.cart-upsell-product:hover .cart-upsell-product__image {
  transform: scale(1.05);
}

/* Product info block */
.cart-upsell-product__info {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 0.5rem;
}

@media (min-width: 640px) {
  .cart-upsell-product__info {
    padding: 0.75rem;
  }
}

/* Product name — espresso color, no underline, hover→mocha */
.cart-upsell-product__name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
  text-decoration: none;
  margin: 0 0 0.25rem;
  transition: color 0.15s;
  line-height: 1.4;
}

.cart-upsell-product__name:hover {
  color: var(--mocha, #8b7355);
  text-decoration: none;
}

.cart-upsell-product__category {
  font-size: 0.75rem;
  color: var(--mocha, #8b7355);
  margin: 0 0 0.5rem;
}

/* Price + CTA row — flex space-between */
.cart-upsell-product__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: auto;
}

.cart-upsell-product__price {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--espresso, #2a241e);
  margin: 0;
}

/* 32×32 espresso-bordered icon button for add-to-cart / view-product */
.cart-upsell-product__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.cart-upsell-product__cta--icon {
  width: 32px;
  height: 32px;
  border-radius: var(--radius);
  border: 1px solid var(--espresso, #2a241e);
  color: var(--espresso, #2a241e);
  background: transparent;
  cursor: pointer;
  padding: 0;
  transition: background 0.15s, color 0.15s;
  flex-shrink: 0;
}

.cart-upsell-product__cta--icon:hover {
  background: var(--espresso, #2a241e);
  color: #fff;
}

/* ── Footer ── */
.cart-upsell-modal__footer {
  display: flex;
  gap: 0.75rem;
  padding: 1rem 1.5rem 1.5rem;
  padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
  flex-shrink: 0;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
}

@media (max-width: 640px) {
  add-to-cart-upsell-modal focus-trap {
    width: calc(100vw - 1.5rem);
    max-height: calc(100dvh - 1.5rem - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  }
  .cart-upsell-modal__scroll { padding: 1rem; }
  .cart-upsell-modal__footer {
    padding: 0.75rem 1rem;
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
  }
}

/* ── channel-redirect-modal ──────────────────────────────────────────────── */

channel-redirect-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 70;
  background: rgba(0, 0, 0, 0.45);
  align-items: center;
  justify-content: center;
}

channel-redirect-modal[data-open="true"] {
  display: flex;
}

.channel-redirect-modal__panel {
  background: var(--color-cream, #f7f1e6);
  border-radius: var(--radius);
  padding: 2rem;
  width: min(90vw, 30rem);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.channel-redirect-modal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.channel-redirect-modal__title {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.125rem;
  font-weight: 500;
  margin: 0;
}

.channel-redirect-modal__close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  flex-shrink: 0;
}

.channel-redirect-modal__message {
  font-size: 0.875rem;
  margin: 0 0 1.5rem;
  color: #444;
}

.channel-redirect-modal__actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.channel-redirect-modal__backdrop {
  position: absolute;
  inset: 0;
}

/* ── popup-modal ─────────────────────────────────────────────────────────── */

popup-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 70;
  background: rgba(0, 0, 0, 0.45);
  align-items: center;
  justify-content: center;
}

popup-modal[data-open="true"] {
  display: flex;
}

popup-modal focus-trap {
  background: var(--color-cream, #f7f1e6);
  border-radius: var(--radius);
  width: min(92vw, 36rem);
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  position: relative;
}

.popup-modal__backdrop {
  position: absolute;
  inset: 0;
}

.popup-modal__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  z-index: 1;
}

.popup-modal__image {
  width: 100%;
  height: 14rem;
  object-fit: cover;
}

.popup-modal__content {
  padding: 1.5rem;
}

.popup-modal__title {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.5rem;
  font-weight: 500;
  margin: 0 0 0.75rem;
}

.popup-modal__body {
  font-size: 0.9375rem;
  margin-bottom: 1.25rem;
}

/* ── Brand WC visibility guards ──────────────────────────────────────────── */
/* Paired with data-* attributes set by their TS classes.                     */

announcement-bar {
  display: block;
}

mega-menu {
  display: block;
}

mega-menu[data-open="false"] .mega-menu__panel,
mega-menu[data-open="false"] .header-mega-menu__panel {
  /* Panel hidden until JS sets data-open="true". The class itself stays in the
     flow so its trigger remains hover/click-targetable.
     Both panel selectors are listed because the standalone
     `header-mega-menu.twig` section uses .header-mega-menu__panel while the
     in-header-bar wrapper uses .mega-menu__panel. */
  display: none;
}

/* Standalone header-mega-menu section: hide nested panels by default before
   the <mega-menu> web component upgrades and toggles data-open. Without this
   guard the absolute-positioned panel renders inline on first paint and
   overlaps page content. The panel becomes visible via :hover, :focus-within,
   or once JS sets data-open="true". */
.header-mega-menu .header-mega-menu__panel {
  display: none;
}

/* Pre-upgrade guard ONLY: :hover/:focus-within must stop applying once the
   <mega-menu> custom element has upgraded, or they re-show a panel the JS just
   closed (Escape / blur set `hidden` + aria-expanded="false", but :focus-within
   on the trigger — true on every Tab into it — kept forcing the panel back on).
   :not(:defined) is true only before mega-menu.ts registers, so after upgrade
   `hidden` / `data-open` on each item, toggled by openItem/closeItem, become
   the single source of truth. */
.header-mega-menu:not(:defined) .header-mega-menu__item:hover .header-mega-menu__panel,
.header-mega-menu:not(:defined) .header-mega-menu__item:focus-within .header-mega-menu__panel {
  display: block;
}

/* The `[data-open="true"]` reveal is NOT scoped to :not(:defined) — it must
   keep working after upgrade, which is the whole point of data-open. Kept in
   its own rule block, deliberately out of the :not(:defined) list above:
   :not() invalidates its ENTIRE comma-separated selector list if any one
   selector fails to parse, so a user agent without :defined support would
   otherwise drop this reveal too and leave every panel permanently hidden. */
.header-mega-menu__item[data-open="true"] .header-mega-menu__panel {
  display: block;
}

/* Standalone header-mega-menu, pre-upgrade only: every panel still carries the
   static `hidden` attribute Twig renders, so the :hover/:focus-within fallback
   above needs `!important` to win over the `[hidden] { display: none }` UA
   rule while <mega-menu> has not upgraded yet. Scoped to :not(:defined) for
   the same reason as above — once mega-menu.ts upgrades, `hidden` is the
   single source of truth for which item is open (openItem/closeItem toggle it
   directly on that item's own panel), so this fallback must never fire again
   and force a panel JS has explicitly hidden back into view. */
.header-mega-menu:not(:defined) .header-mega-menu__item:hover .header-mega-menu__panel[hidden],
.header-mega-menu:not(:defined) .header-mega-menu__item:focus-within .header-mega-menu__panel[hidden] {
  display: block !important;
}

/* The standalone .header-mega-menu__nav adds 0.75rem (12px) vertical padding
   that pushes the link 12px above the nav row's bottom border. Inside
   .lc-header-nav we want the link's bottom edge to align with the row's
   bottom border so the animated ::after underline lands ON the border. */
.lc-header-nav .header-mega-menu__nav { padding: 0; }

/* Mega-menu panel — fullwidth (100vw) strip opening 1px below the nav's
   bottom border. Ported verbatim from the V1 Inertia reference (.lc-mega
   scoped CSS at shopomain.test); LC bakes the `--full` variant in (100vw
   + left: calc(50% - 50vw)) because the LC brief asks for fullwidth.
   The mega `<li>` is `position: static` so the panel anchors to .lc-header-nav. */
.lc-header-nav .header-mega-menu__item { position: static; }
.lc-header-nav .header-mega-menu__panel {
  position: absolute;
  top: calc(100% + 1px);
  left: calc(50% - 50vw);
  right: auto;
  width: 100vw;
  min-width: 0;
  transform: none;
  background-color: var(--warm-white, #fdfbf7);
  border: 0;
  border-bottom: 1px solid var(--cream-dark, #ebe2d3);
  padding: 3rem 0;
  box-shadow: rgba(42, 35, 30, 0.15) 0 20px 40px -20px;
  z-index: 90;
}
.lc-header-nav .header-mega-menu__columns {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 2rem;
}
/* Mega trigger uses .lc-header-nav__link for typography/padding/underline.
   Reset only the button-specific UA chrome (background + border). Do NOT
   override font, padding, color, or display — the link class governs those,
   and overriding them desyncs the button from the surrounding anchors. */
.lc-header-nav .header-mega-menu__trigger {
  background: none;
  border: 0;
  cursor: pointer;
}
.lc-header-nav .header-mega-menu__chevron { width: 12px; height: 12px; flex-shrink: 0; opacity: 0.7; transition: transform 0.2s ease; }

/* Task 27 (M19): mega-panel layout moved verbatim from inline style="" in
   snippets/header-nav-mega-panel.twig. Column count arrives as a
   `--count-N` modifier (the schema caps columns_per_panel at 6); the base
   rule carries the default-4 fallback. Accent colours mirror the
   accent_colors palette in the snippet — base rules carry the rose-gold
   default so an unknown accent falls back exactly like the old
   `|default('#b5896a')` did. */
.header-mega-menu__columns { display: grid; gap: 2rem; grid-template-columns: repeat(4, 1fr); }
.header-mega-menu__columns--count-1 { grid-template-columns: repeat(1, 1fr); }
.header-mega-menu__columns--count-2 { grid-template-columns: repeat(2, 1fr); }
.header-mega-menu__columns--count-3 { grid-template-columns: repeat(3, 1fr); }
.header-mega-menu__columns--count-4 { grid-template-columns: repeat(4, 1fr); }
.header-mega-menu__columns--count-5 { grid-template-columns: repeat(5, 1fr); }
.header-mega-menu__columns--count-6 { grid-template-columns: repeat(6, 1fr); }
.header-mega-menu__column-heading { font-family: var(--font-sans); font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-gold); margin: 0 0 0.75rem; }
.header-mega-menu__link-list { list-style: none; margin: 0; padding: 0; }
.header-mega-menu__panel-item { margin-bottom: 0.375rem; }
.header-mega-menu__panel-link { display: flex; align-items: center; gap: 0.375rem; font-family: var(--font-sans); font-size: 0.8125rem; color: var(--color-black); text-decoration: none; padding: 0.25rem 0; border-bottom: 1px solid transparent; transition: border-color 0.2s, color 0.2s; letter-spacing: 0.02em; }
.header-mega-menu__column--featured { position: relative; overflow: hidden; border-radius: var(--radius); min-height: 14rem; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.5rem; }
.header-mega-menu__featured-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.header-mega-menu__featured-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,10,10,0.7) 0%, rgba(10,10,10,0.2) 60%, transparent 100%); z-index: 1; }
.header-mega-menu__featured-body { position: relative; z-index: 2; color: #fff; }
.header-mega-menu__featured-eyebrow { font-family: var(--font-sans); font-size: 0.625rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: #b5896a; margin: 0 0 0.375rem; }
.header-mega-menu__featured-eyebrow--accent-rose-gold { color: #b5896a; }
.header-mega-menu__featured-eyebrow--accent-coral { color: #e8735a; }
.header-mega-menu__featured-eyebrow--accent-champagne { color: #c9a96e; }
.header-mega-menu__featured-eyebrow--accent-sage { color: #7a9e87; }
.header-mega-menu__featured-eyebrow--accent-midnight { color: #2c3e6b; }
.header-mega-menu__featured-eyebrow--accent-blush { color: #e8b4b8; }
.header-mega-menu__featured-title { font-family: var(--font-serif); font-size: 1.25rem; font-weight: 500; color: #fff; margin: 0 0 0.375rem; letter-spacing: 0.02em; line-height: 1.25; }
.header-mega-menu__featured-subtitle { font-family: var(--font-sans); font-size: 0.75rem; color: rgba(255,255,255,0.8); margin: 0 0 1rem; }
.header-mega-menu__featured-cta { display: inline-block; font-family: var(--font-sans); font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #fff; border: 1px solid #b5896a; padding: 0.5rem 1.25rem; text-decoration: none; transition: background-color 0.2s, color 0.2s; background-color: transparent; }
.header-mega-menu__featured-cta--accent-rose-gold { border-color: #b5896a; }
.header-mega-menu__featured-cta--accent-coral { border-color: #e8735a; }
.header-mega-menu__featured-cta--accent-champagne { border-color: #c9a96e; }
.header-mega-menu__featured-cta--accent-sage { border-color: #7a9e87; }
.header-mega-menu__featured-cta--accent-midnight { border-color: #2c3e6b; }
.header-mega-menu__featured-cta--accent-blush { border-color: #e8b4b8; }
/* Image-less featured card: soft warm panel, dark text, CTA pinned to the bottom. */
.header-mega-menu__column--featured-plain { align-self: start; justify-content: space-between; padding: 1.75rem; background: linear-gradient(145deg, var(--cream) 0%, var(--cream-dark) 100%); }
.header-mega-menu__column--featured-plain .header-mega-menu__featured-body { display: flex; flex-direction: column; flex: 1; color: var(--espresso); }
.header-mega-menu__column--featured-plain .header-mega-menu__featured-title { font-size: 1.6rem; color: var(--espresso); }
.header-mega-menu__column--featured-plain .header-mega-menu__featured-title em { font-style: italic; color: var(--rose-gold); }
.header-mega-menu__column--featured-plain .header-mega-menu__featured-subtitle { color: var(--mocha); }
.header-mega-menu__column--featured-plain .header-mega-menu__featured-cta { align-self: flex-start; margin-top: auto; padding: 0 0 0.25rem; border: 0; border-bottom: 1px solid var(--espresso); color: var(--espresso); }
.header-mega-menu__column--featured-plain .header-mega-menu__featured-cta:hover { color: var(--rose-gold); border-bottom-color: var(--rose-gold); }

/* ── Mobile menu slideover ───────────────────────────────────────────────────
   The panel layout used to be an INLINE style on <mobile-menu>, including
   `transform: translateX(-100%)`. An inline transform cannot be overridden by
   a stylesheet rule, so the `data-open="true"` state set by mobile-menu.ts
   never moved the panel on-screen. Layout + closed/open transforms now live
   here; the section markup carries no transform. */
mobile-menu {
  position: fixed;
  inset: 0;
  background-color: var(--color-cream);
  z-index: 100;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  transform: translateX(-100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

mobile-menu[data-open="true"] {
  transform: translateX(0);
}

/* Task 9 round 2 — the inner <sticky-add-to-bag> element IS the bar. It stays
   display: none until the component sets data-visible="true" (when the main
   add-to-cart block scrolls out of view); the reveal slides up via keyframes
   because display cannot transition, so a transform transition alone could
   never animate the appearance. */
sticky-add-to-bag {
  display: none;
}

sticky-add-to-bag[data-visible="true"] {
  display: block;
  animation: lc-sticky-add-to-bag-slide-in 0.3s ease;
}

@keyframes lc-sticky-add-to-bag-slide-in {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  sticky-add-to-bag[data-visible="true"] { animation: none; }
}

/* ── storefront-toast ────────────────────────────────────────────────────── */

storefront-toast {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 80;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  pointer-events: none;
  max-width: min(90vw, 22rem);
}

.storefront-toast__item {
  padding: 0.75rem 1.25rem;
  border-radius: var(--radius);
  font-size: 0.875rem;
  font-weight: 500;
  pointer-events: all;
  opacity: 0;
  transform: translateY(0.5rem);
  transition: opacity 0.2s ease, transform 0.2s ease;
  background: var(--color-black, #0a0a0a);
  color: var(--color-cream, #f7f1e6);
}

.storefront-toast__item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.storefront-toast__item.is-fading {
  opacity: 0;
  transform: translateY(-0.25rem);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.storefront-toast__item--success {
  background: #2d6a4f;
  color: #fff;
}

.storefront-toast__item--error {
  background: #9b2226;
  color: #fff;
}

.storefront-toast__item--warning {
  background: #ca6702;
  color: #fff;
}

/* ── cookie-consent ──────────────────────────────────────────────────────── */

cookie-consent {
  display: contents;
}

/* Wrapper — fixed bottom inset, no bg, centered max-w-4xl card inside */
.cookie-consent__banner {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 90;
  padding: 1rem;
  background: transparent;
  color: inherit;
}
.cookie-consent__banner[hidden] { display: none !important; }
.cookie-consent__banner--top { top: 0; bottom: auto; }

/* Card — square corners, light bg, subtle border + shadow */
.cookie-consent__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 56rem;
  margin: 0 auto;
  padding: 1.5rem;
  background: var(--color-cream, #f8f4ed);
  border: 1px solid var(--color-cream-dark, #e8e2d3);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08), 0 4px 10px rgba(0, 0, 0, 0.04);
}

.cookie-consent__text {
  flex: none;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-mocha, #6b5d4f);
  margin: 0;
}

/* Inline categories panel — shown when "manage preferences" clicked */
.cookie-consent__categories[hidden] { display: none !important; }
.cookie-consent__categories {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  border-top: 1px solid var(--color-cream-dark, #e8e2d3);
  padding-top: 1rem;
}
.cookie-consent__categories-title {
  font-family: var(--font-heading, var(--font-serif), Georgia, serif);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-espresso, #1c1611);
  margin: 0 0 0.25rem;
}
.cookie-consent__category {
  display: flex;
  align-items: baseline;
  gap: 0.625rem;
  font-size: 0.875rem;
  color: var(--color-espresso, #1c1611);
  cursor: pointer;
}
.cookie-consent__category--disabled { cursor: default; }
.cookie-consent__category input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--color-espresso, #1c1611);
  cursor: pointer;
  flex-shrink: 0;
  align-self: center;
}
.cookie-consent__category input[type="checkbox"]:disabled { cursor: default; opacity: 0.6; }
.cookie-consent__category-name { font-weight: 500; }
.cookie-consent__category-desc {
  color: var(--color-mocha, #6b5d4f);
  font-weight: 400;
}

.cookie-consent__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

/* Accept-all — primary filled dark button (square corners) */
.cookie-consent__accept {
  display: inline-flex;
  align-items: center;
  padding: 0.625rem 1.25rem;
  background: var(--color-espresso, #1c1611);
  color: var(--color-cream, #f8f4ed);
  border: 1px solid var(--color-espresso, #1c1611);
  border-radius: var(--radius);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: opacity 200ms ease;
}
.cookie-consent__accept:hover { opacity: 0.9; }

/* Reject (necessary only) — outlined button (square corners) */
.cookie-consent__reject {
  display: inline-flex;
  align-items: center;
  padding: 0.625rem 1.25rem;
  background: transparent;
  color: var(--color-espresso, #1c1611);
  border: 1px solid var(--color-cream-dark, #e8e2d3);
  border-radius: var(--radius);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: background 200ms ease;
}
.cookie-consent__reject:hover { background: var(--color-cream-dark, #e8e2d3); }

/* Customize / manage — text link, underlined (collapsed state) */
.cookie-consent__manage {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 0;
  background: none;
  color: var(--color-mocha, #6b5d4f);
  border: 0;
  font-size: 0.875rem;
  font-weight: 400;
  text-decoration: underline;
  cursor: pointer;
  transition: color 200ms ease;
}
.cookie-consent__manage:hover { color: var(--color-espresso, #1c1611); }
.cookie-consent__manage[hidden] { display: none !important; }

/* Save preferences — outlined button (visible only when expanded) */
.cookie-consent__save-inline {
  display: inline-flex;
  align-items: center;
  padding: 0.625rem 1.25rem;
  background: transparent;
  color: var(--color-espresso, #1c1611);
  border: 1px solid var(--color-cream-dark, #e8e2d3);
  border-radius: var(--radius);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: background 200ms ease;
}
.cookie-consent__save-inline:hover { background: var(--color-cream-dark, #e8e2d3); }
.cookie-consent__save-inline[hidden] { display: none !important; }
.cookie-consent__reopen { position: fixed; bottom: 0.75rem; left: 0.75rem; z-index: 40; padding: 0.375rem 0.75rem; font-size: 0.75rem; line-height: 1.25; color: var(--muted-foreground, hsl(24 10% 35%)); background: var(--background, #fff); border: 1px solid var(--border, hsl(30 15% 88%)); border-radius: var(--radius); cursor: pointer; opacity: 0.85; }
/* Lift above the fixed add-to-bag bar while it is showing. */
body:has(sticky-add-to-bag[data-visible="true"]) .cookie-consent__reopen { bottom: 5.5rem; }
.cookie-consent__reopen:hover { opacity: 1; color: var(--foreground, hsl(24 10% 15%)); }
.cookie-consent__reopen[hidden] { display: none !important; }

/* ── Live chat ────────────────────────────────────────────────────────────── */

live-chat {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 75;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.75rem;
  font-family: var(--font-body);
  color: var(--espresso);
}

.live-chat__launcher {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 3.5rem;
  height: 3.5rem;
  padding: 0;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--espresso);
  color: var(--cream);
  cursor: pointer;
  box-shadow: 0 12px 32px -10px rgba(42, 36, 30, 0.45), 0 2px 6px rgba(42, 36, 30, 0.18);
  transition: background 0.18s var(--ease), box-shadow 0.18s var(--ease), transform 0.18s var(--ease);
}

.live-chat__launcher:hover {
  background: var(--mocha);
  box-shadow: 0 18px 38px -12px rgba(42, 36, 30, 0.55), 0 4px 10px rgba(42, 36, 30, 0.22);
  transform: translateY(-1px);
}

.live-chat__launcher:focus-visible {
  outline: 2px solid var(--rose-gold);
  outline-offset: 3px;
}

.live-chat__launcher--with-text {
  width: auto;
  height: auto;
  padding: 0.75rem 1.25rem;
}

.live-chat__launcher-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.live-chat__launcher-text {
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.live-chat__dot {
  position: absolute;
  top: 0.125rem;
  right: 0.125rem;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: var(--radius-pill);
  background: #5dd58c;
  box-shadow: 0 0 0 2px var(--espresso);
}

.live-chat__dot::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: var(--radius-pill);
  background: #5dd58c;
  opacity: 0.6;
  animation: live-chat-ping 1.6s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@keyframes live-chat-ping {
  75%, 100% { transform: scale(2); opacity: 0; }
}

.live-chat__window {
  display: flex;
  flex-direction: column;
  width: 24rem;
  max-width: calc(100vw - 2rem);
  height: 32rem;
  max-height: calc(100vh - 6rem);
  background: var(--warm-white);
  border: 1px solid var(--cream-dark);
  border-radius: var(--radius);
  box-shadow: 0 30px 60px -20px rgba(42, 36, 30, 0.35), 0 8px 24px -8px rgba(42, 36, 30, 0.18);
  overflow: hidden;
  transform-origin: bottom right;
  animation: live-chat-pop 200ms var(--ease) both;
}

.live-chat__window[hidden],
.live-chat__form[hidden],
.live-chat__closed[hidden],
.live-chat__counter[hidden],
.live-chat__icon-btn[hidden] {
  display: none;
}

@keyframes live-chat-pop {
  from { opacity: 0; transform: translateY(0.75rem) scale(0.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 640px) {
  live-chat {
    bottom: 0;
    right: 0;
    left: 0;
    align-items: stretch;
  }
  .live-chat__window {
    width: 100%;
    max-width: 100%;
    height: 100vh;
    max-height: 100vh;
    border: 0;
  }
  .live-chat__launcher {
    align-self: flex-end;
    margin: 0 1rem 1rem 0;
  }
}

.live-chat__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  background: var(--espresso);
  color: var(--cream);
  border-bottom: 1px solid var(--cream-dark);
}

.live-chat__ident {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
}

.live-chat__avatar {
  width: 2rem;
  height: 2rem;
  border-radius: var(--radius-pill);
  object-fit: cover;
  background: rgba(248, 244, 237, 0.15);
}

.live-chat__avatar--placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--cream);
}

.live-chat__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 1.0625rem;
  font-weight: 500;
  letter-spacing: 0.005em;
  color: var(--cream);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.live-chat__header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.125rem;
}

.live-chat__icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 0;
  border-radius: var(--radius);
  background: transparent;
  color: rgba(248, 244, 237, 0.78);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.live-chat__icon-btn:hover {
  background: rgba(248, 244, 237, 0.12);
  color: var(--cream);
}

.live-chat__icon-btn:focus-visible {
  outline: 2px solid var(--rose-gold);
  outline-offset: 1px;
}

.live-chat__messages {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 1rem;
  background: var(--warm-white);
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  scroll-behavior: smooth;
}

.live-chat__messages::-webkit-scrollbar {
  width: 6px;
}

.live-chat__messages::-webkit-scrollbar-thumb {
  background: var(--cream-dark);
  border-radius: var(--radius);
}

.live-chat__timestamp {
  align-self: center;
  padding: 0.125rem 0;
  font-size: 0.6875rem;
  letter-spacing: 0.04em;
  color: var(--mocha);
  opacity: 0.7;
}

.live-chat__message {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  max-width: 100%;
}

.live-chat__message--assistant {
  margin-right: auto;
  max-width: 88%;
}

.live-chat__message--user {
  margin-left: auto;
  max-width: 85%;
  justify-content: flex-end;
}

.live-chat__msg-avatar {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: var(--radius-pill);
  object-fit: cover;
  flex-shrink: 0;
  margin-top: 0.125rem;
  background: var(--cream-dark);
}

.live-chat__msg-avatar--placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--mocha);
}

.live-chat__bubble {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.625rem 0.875rem;
  border-radius: var(--radius);
  font-size: 0.875rem;
  line-height: 1.45;
  word-break: break-word;
}

.live-chat__bubble--assistant {
  background: var(--cream);
  color: var(--espresso);
  border-bottom-left-radius: var(--radius);
  border: 1px solid var(--cream-dark);
}

.live-chat__bubble--user {
  background: var(--espresso);
  color: var(--cream);
  border-bottom-right-radius: var(--radius);
}

.live-chat__bubble--typing {
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-pill);
}

.live-chat__text {
  white-space: pre-wrap;
}

.live-chat__text--spaced {
  margin-top: 0.5rem;
}

.live-chat__bubble--assistant a {
  color: var(--rose-gold);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.live-chat__bubble--assistant a:hover {
  color: var(--mocha);
}

.live-chat__bubble--user a {
  color: var(--cream);
  text-decoration: underline;
}

.live-chat__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
  margin: 0.25rem 0;
}

.live-chat__table th,
.live-chat__table td {
  border: 1px solid var(--cream-dark);
  padding: 0.25rem 0.5rem;
  text-align: left;
}

.live-chat__table th {
  font-weight: 600;
  background: var(--warm-white);
}

.live-chat__rich {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin-top: 0.25rem;
}

.live-chat__rich-card {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  background: var(--warm-white);
  border: 1px solid var(--cream-dark);
  border-radius: var(--radius);
  text-decoration: none;
  color: var(--espresso);
  transition: border-color 0.15s, background 0.15s, transform 0.15s var(--ease);
}

.live-chat__rich-card:hover {
  border-color: var(--rose-gold);
  background: var(--cream);
  transform: translateY(-1px);
}

.live-chat__rich-image {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--radius);
  object-fit: cover;
  flex-shrink: 0;
  background: var(--cream-dark);
}

.live-chat__rich-body {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 0;
}

.live-chat__rich-name {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--espresso);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.live-chat__rich-meta {
  font-size: 0.75rem;
  color: var(--mocha);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.live-chat__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-top: 0.25rem;
}

.live-chat__chip {
  padding: 0.375rem 0.75rem;
  font-size: 0.75rem;
  font-family: var(--font-body);
  letter-spacing: 0.02em;
  background: var(--warm-white);
  color: var(--espresso);
  border: 1px solid var(--cream-dark);
  border-radius: var(--radius-pill);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.live-chat__chip:hover {
  background: var(--cream);
  border-color: var(--rose-gold);
  color: var(--mocha);
}

.live-chat__typing {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.125rem 0;
}

.live-chat__typing-dot {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: var(--radius-pill);
  background: currentColor;
  opacity: 0.5;
  animation: live-chat-bounce 1s infinite;
}

@keyframes live-chat-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: 0.4; }
  40% { transform: translateY(-3px); opacity: 1; }
}

.live-chat__delivery {
  align-self: flex-end;
  margin-top: -0.25rem;
  font-size: 0.6875rem;
  color: var(--mocha);
  opacity: 0.65;
}

.live-chat__delivery--pulse {
  animation: live-chat-pulse 1.4s ease-in-out infinite;
}

@keyframes live-chat-pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 0.85; }
}

.live-chat__error {
  align-self: flex-start;
  max-width: 85%;
  padding: 0.5rem 0.75rem;
  font-size: 0.8125rem;
  color: #842c2c;
  background: #fbe9e9;
  border: 1px solid #f0c8c8;
  border-radius: var(--radius);
}

.live-chat__input-wrap {
  border-top: 1px solid var(--cream-dark);
  padding: 0.75rem;
  background: var(--warm-white);
}

.live-chat__form {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.live-chat__input-box {
  position: relative;
  flex: 1;
}

.live-chat__input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.625rem 3.25rem 0.625rem 0.875rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--espresso);
  background: var(--cream);
  border: 1px solid var(--cream-dark);
  border-radius: var(--radius);
  outline: none;
  transition: border-color 0.15s, background 0.15s;
}

.live-chat__input:focus {
  border-color: var(--rose-gold);
  background: var(--warm-white);
}

.live-chat__input:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.live-chat__counter {
  position: absolute;
  top: 50%;
  right: 0.625rem;
  transform: translateY(-50%);
  font-size: 0.6875rem;
  color: var(--mocha);
  opacity: 0.6;
  pointer-events: none;
}

.live-chat__send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 0;
  border-radius: var(--radius);
  background: var(--espresso);
  color: var(--cream);
  cursor: pointer;
  transition: background 0.15s var(--ease), transform 0.12s var(--ease);
}

.live-chat__send:hover:not(:disabled) {
  background: var(--mocha);
}

.live-chat__send:active:not(:disabled) {
  transform: scale(0.96);
}

.live-chat__send:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.live-chat__send:focus-visible {
  outline: 2px solid var(--rose-gold);
  outline-offset: 2px;
}

.live-chat__closed {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.5rem 0.25rem;
}

.live-chat__closed-text {
  font-size: 0.8125rem;
  color: var(--mocha);
}

.live-chat__restart {
  padding: 0.4rem 0.75rem;
  font-size: 0.75rem;
  font-family: var(--font-body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--espresso);
  color: var(--cream);
  border: 0;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background 0.15s;
}

.live-chat__restart:hover {
  background: var(--mocha);
}

/* ── error-boundary ──────────────────────────────────────────────────────── */

.error-boundary__fallback {
  padding: 4rem 2rem;
  text-align: center;
}

.error-boundary__heading {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 2rem;
  margin-bottom: 0.75rem;
}

.error-boundary__message {
  font-size: 1rem;
  color: #666;
  margin-bottom: 2rem;
}

.error-boundary__home-link {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background: var(--color-black, #0a0a0a);
  color: var(--color-cream, #f7f1e6);
  text-decoration: none;
  font-weight: 500;
}

/* ── lc-btn helpers ──────────────────────────────────────────────────────── */

.lc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border: 1.5px solid var(--color-black, #0a0a0a);
  border-radius: var(--radius);
  background: transparent;
  color: var(--color-black, #0a0a0a);
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.625rem 1.25rem;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.lc-btn--primary {
  background: var(--color-black, #0a0a0a);
  color: var(--color-cream, #f7f1e6);
}

.lc-btn--primary:hover {
  background: var(--color-gold, #c4a572);
  border-color: var(--color-gold, #c4a572);
  color: var(--color-black, #0a0a0a);
}

.lc-btn--ghost {
  background: transparent;
  border-color: var(--color-gold, #c4a572);
  color: var(--color-black, #0a0a0a);
}

.lc-btn--ghost:hover {
  background: var(--color-gold, #c4a572);
}

.lc-btn--sm {
  font-size: 0.75rem;
  padding: 0.4rem 0.875rem;
}

.lc-btn--full {
  width: 100%;
}

/* ── Cart page ────────────────────────────────────────────────────────────── */

.lc-cart {
  max-width: 72rem;
  margin: 0 auto;
  padding: 3rem 1.5rem;
}

.lc-cart__inner {
  max-width: 72rem;
  margin: 0 auto;
}

.lc-cart__heading {
  font-family: var(--font-heading, Georgia, serif);
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 500;
  margin-bottom: 2.5rem;
  letter-spacing: -0.02em;
}

/* Cart flash banners (coupon errors, etc.) — mirror .lc-account__flash. */
.lc-cart__flash {
  margin: 0 0 1.5rem;
  padding: 0.875rem 1.125rem;
  border-radius: var(--radius);
  font-size: 0.9375rem;
  line-height: 1.4;
}

.lc-cart__flash--success {
  background: rgba(184, 148, 120, 0.12);
  border: 1px solid var(--rose-gold, #b89478);
  color: var(--espresso, #2a241e);
}

.lc-cart__flash--error {
  background: rgba(180, 55, 55, 0.08);
  border: 1px solid #b43737;
  color: #7a2222;
}

.lc-cart__layout {
  display: grid;
  grid-template-columns: 1fr 22rem;
  gap: 3rem;
  align-items: start;
}

@media (max-width: 900px) {
  .lc-cart__layout {
    grid-template-columns: 1fr;
  }
}

.lc-cart__lines { min-width: 0; }

.lc-cart__main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.lc-cart__sidebar {
  position: static;
}

@media (min-width: 901px) {
  .lc-cart__sidebar {
    position: sticky;
    top: calc(var(--site-header-height, 11rem) + 1rem);
  }
}

.lc-cart__summary {
  background: var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.lc-cart__summary-heading {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
  margin: 0;
  letter-spacing: 0.01em;
}

.lc-cart__cta {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  padding: 14px 24px;
  background: var(--espresso, #2a241e);
  color: var(--warm-white, #fefcf8);
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 200ms var(--ease, ease);
  box-sizing: border-box;
}

.lc-cart__cta:hover {
  background: #1a1410;
  color: var(--warm-white, #fefcf8);
}

.lc-cart__continue-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  align-self: flex-start;
  font-size: 0.9375rem;
  color: var(--mocha, #8b7355);
  text-decoration: none;
  transition: color 150ms var(--ease, ease);
}

.lc-cart__continue-link:hover {
  color: var(--espresso, #2a241e);
}

/* Cart empty state */

.lc-cart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem;
  text-align: center;
}

.lc-cart-empty__icon {
  color: var(--color-gold, #c4a572);
  margin-bottom: 1.5rem;
  opacity: 0.7;
}

.lc-cart-empty__heading {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.75rem;
  font-weight: 500;
  margin-bottom: 0.75rem;
  letter-spacing: -0.02em;
}

.lc-cart-empty__body {
  color: var(--color-secondary, #6b5c45);
  font-size: 1rem;
  margin-bottom: 2rem;
  max-width: 28rem;
}

.lc-cart-empty__cta { min-width: 12rem; }

/* ── Cart unified discount code (coupon or gift card) ─────────────────────── */

.lc-cart-discount {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lc-cart-discount__label {
  display: block;
  font-size: 0.875rem;
  color: var(--mocha, #8b7355);
}

.lc-cart-discount__input-row {
  display: flex;
  gap: 0.75rem;
  align-items: stretch;
}

.lc-cart-discount__input {
  flex: 1;
  padding: 0.875rem 1rem;
  border: 1px solid rgba(42, 36, 30, 0.18);
  background: var(--warm-white, #fefcf8);
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  border-radius: var(--radius);
}

.lc-cart-discount__input::placeholder {
  color: var(--mocha, #8b7355);
}

.lc-cart-discount__apply {
  padding: 0 1.5rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.18);
  border-radius: var(--radius);
  color: var(--espresso, #2a241e);
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-size: 0.875rem;
  cursor: pointer;
  transition: background 150ms var(--ease, ease);
}

.lc-cart-discount__apply:hover {
  background: rgba(42, 36, 30, 0.04);
}

.lc-cart-discount__applied {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: rgba(42, 36, 30, 0.04);
  border-radius: var(--radius);
  font-size: 0.875rem;
}

.lc-cart-discount__code {
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-cart-discount__remove {
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--mocha, #8b7355);
  display: flex;
  align-items: center;
  padding: 0.25rem;
  transition: color 150ms var(--ease, ease);
}

.lc-cart-discount__remove:hover {
  color: var(--espresso, #2a241e);
}

/* ── Cart upsell strip (LC) ───────────────────────────────────────────────── */

.lc-cart-upsell {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(10,10,10,.12);
}

.lc-cart-upsell__heading {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.375rem;
  font-weight: 500;
  letter-spacing: -0.02em;
  margin-bottom: 1.5rem;
}

.lc-cart-upsell__track {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  gap: 1.5rem;
}

.lc-cart-upsell__card {
  display: flex;
  flex-direction: column;
}

.lc-cart-upsell__image-link { display: block; }

.lc-cart-upsell__image {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
}

.lc-cart-upsell__card-body {
  padding: 0.75rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lc-cart-upsell__name {
  font-family: var(--font-heading, serif);
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-black, #0a0a0a);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  letter-spacing: -0.01em;
}

.lc-cart-upsell__price {
  font-size: 0.875rem;
  color: var(--color-secondary, #6b5c45);
  margin: 0;
}

.lc-cart-upsell__cta {
  margin-top: 0.25rem;
  align-self: flex-start;
}

/* Cart line items */

.lc-cart-lines {
  list-style: none;
  padding: 0;
  gap: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.lc-cart-line {
  display: grid;
  grid-template-columns: 5rem 1fr auto auto;
  gap: 1.25rem;
  align-items: start;
  padding: 1.25rem 0;
  border-bottom: 1px solid rgba(10,10,10,.12);
}

.lc-cart-line__image-link { display: block; flex-shrink: 0; }

.lc-cart-line__image {
  width: 5rem;
  height: 5rem;
  object-fit: cover;
  display: block;
}

.lc-cart-line__image-placeholder {
  width: 5rem;
  height: 5rem;
  background: rgba(10,10,10,.06);
}

.lc-cart-line__details { min-width: 0; }

.lc-cart-line__title {
  font-family: var(--font-heading, var(--font-serif));
  font-weight: 500;
  font-size: 1rem;
  letter-spacing: -0.01em;
  display: block;
  margin-bottom: 0.25rem;
  color: var(--color-black, #0a0a0a);
  text-decoration: none;
}

.lc-cart-line__title:hover {
  color: var(--color-gold-text, #836830);
}

.lc-cart-line__variant {
  font-size: 0.8125rem;
  color: var(--color-secondary, #6b5c45);
  margin-bottom: 0.25rem;
}

.lc-cart-line__price {
  font-size: 0.875rem;
  color: var(--color-secondary, #6b5c45);
}

.lc-cart-line__availability {
  font-size: 0.8125rem;
  margin-top: 0.25rem;
  color: #1a6632;
}

.lc-cart-line__availability--out_of_stock { color: #842029; }

.lc-cart-line__availability--backorder,
.lc-cart-line__availability--preorder { color: #92400e; }

.lc-cart-line__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.lc-cart-line__qty-form {
  display: flex;
  align-items: center;
}

.lc-cart-line__remove {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--color-secondary, #6b5c45);
  font-size: 0.75rem;
  padding: 0;
  transition: color 0.15s;
}

.lc-cart-line__remove:hover { color: var(--color-black, #0a0a0a); }

.lc-cart-line__total {
  font-weight: 600;
  font-size: 0.9375rem;
  text-align: right;
}

/* Qty stepper */

qty-stepper {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(10,10,10,.25);
}

qty-stepper button {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0.25rem 0.625rem;
  font-size: 1rem;
  color: var(--color-black, #0a0a0a);
  line-height: 1;
}

qty-stepper input[type="number"] {
  width: 2.5rem;
  text-align: center;
  border: none;
  border-left: 1px solid rgba(10,10,10,.25);
  border-right: 1px solid rgba(10,10,10,.25);
  padding: 0.25rem 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  background: transparent;
  -moz-appearance: textfield;
}

qty-stepper input[type="number"]::-webkit-outer-spin-button,
qty-stepper input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Cart totals */

.lc-cart-totals {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.lc-cart-totals__shipping-progress {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lc-cart-totals__list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
}

.lc-cart-totals__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.9375rem;
  margin: 0;
}

.lc-cart-totals__label {
  color: var(--mocha, #8b7355);
}

.lc-cart-totals__value {
  color: var(--espresso, #2a241e);
  margin: 0;
}

.lc-cart-totals__row--discount .lc-cart-totals__label--discount,
.lc-cart-totals__row--discount .lc-cart-totals__value--discount {
  color: #2f7d4f;
  font-weight: 500;
}

.lc-cart-totals__row--tax-heading {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-cart-totals__tax-heading {
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-cart-totals__row--tax {
  font-size: 0.9375rem;
}

.lc-cart-totals__row--total {
  padding-top: 0.75rem;
  margin-top: 0.5rem;
  border-top: 1px solid rgba(42, 36, 30, 0.18);
}

.lc-cart-totals__label--total,
.lc-cart-totals__value--total {
  font-weight: 600;
  font-size: 1.0625rem;
  color: var(--espresso, #2a241e);
}

.lc-cart-totals__progress-bar-wrap {
  height: 4px;
  background: rgba(42, 36, 30, 0.1);
  width: 100%;
  border-radius: var(--radius);
  overflow: hidden;
}

.lc-cart-totals__progress-bar {
  height: 100%;
  width: var(--progress, 0%);
  background: var(--rose-gold, #b89478);
  border-radius: var(--radius);
  transition: width 0.3s ease;
}

.lc-cart-totals__progress-bar--full {
  background: #2f7d4f;
}

.lc-cart-totals__free-shipping-remaining {
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-cart-totals__free-shipping-achieved {
  font-size: 0.8125rem;
  color: #2f7d4f;
  font-weight: 500;
  margin: 0;
}

/* ── Checkout page ────────────────────────────────────────────────────────── */

.lc-checkout {
  max-width: 72rem;
  margin: 0 auto;
  padding: 3rem 1.5rem;
}

.lc-checkout__empty {
  text-align: center;
  padding: 4rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.lc-checkout__layout {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 3rem;
  align-items: start;
}

@media (max-width: 900px) {
  .lc-checkout__layout {
    grid-template-columns: 1fr;
  }

  .lc-checkout__sidebar {
    order: -1;
  }
}

.lc-checkout__main { min-width: 0; }

.lc-checkout__heading {
  font-family: var(--font-heading, Georgia, serif);
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 500;
  margin-bottom: 2rem;
  letter-spacing: -0.02em;
}

.lc-checkout__sidebar {
  position: static;
}

@media (min-width: 901px) {
  .lc-checkout__sidebar {
    position: sticky;
    top: calc(var(--site-header-height, 11rem) + 1rem);
  }
}

.lc-checkout__section {
  background: transparent;
  border: 0;
  padding: 0 0 1.75rem;
  margin: 0 0 1.75rem;
  border-bottom: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-checkout__section:last-of-type {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}

.lc-checkout__section-title {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 1.25rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--espresso, #2a241e);
  display: block;
  width: 100%;
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}

.lc-checkout__form {
  display: flex;
  gap: 0;
  flex-direction: column;
}

.lc-checkout__field {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin-bottom: 1rem;
}

.lc-checkout__section > .lc-checkout__field:last-child,
.lc-checkout__section > .lc-checkout__fields-row:last-child { margin-bottom: 0; }

.lc-checkout__fields-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 560px) {
  .lc-checkout__fields-row { grid-template-columns: 1fr; }
}

.lc-checkout__label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-secondary, #6b5c45);
}

.lc-checkout__input {
  padding: 0.75rem 0.875rem;
  border: 1px solid rgba(42, 36, 30, 0.18);
  background: var(--warm-white, #fefcf8);
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  width: 100%;
  box-sizing: border-box;
  border-radius: var(--radius);
  transition: border-color 0.15s;
}

.lc-checkout__input:focus {
  outline: none;
  border-color: var(--espresso, #2a241e);
}

.lc-checkout__input--error { border-color: #b91c1c; }

.lc-checkout__select {
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b5c45' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m19.5 8.25-7.5 7.5-7.5-7.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  padding-right: 2.5rem;
}

.lc-checkout__textarea {
  resize: vertical;
  min-height: 5rem;
}

.lc-checkout__error {
  font-size: 0.8125rem;
  color: #b91c1c;
}

/* Pickup-point widget load failure — templates/checkout/index.twig. Revealed
   by pickup-point JS clearing the inline `display:none` it starts with
   (`element.style.display = ''`), so this rule must NOT set `display` —
   doing so would win the cascade back and keep the message hidden forever.
   Values mirror .lc-checkout__error, which the element also carries. */
.lc-checkout__pickup-load-error {
  font-size: 0.8125rem;
  color: #b91c1c;
}

.lc-checkout__checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  cursor: pointer;
  font-size: 0.9rem;
}

.lc-checkout__radio-group {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.lc-checkout__radio-card {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.875rem 1rem;
  border: 1px solid rgba(42, 36, 30, 0.18);
  background: var(--warm-white, #fefcf8);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}

.lc-checkout__radio-card:has(input:checked) {
  border-color: var(--espresso, #2a241e);
  background: rgba(42, 36, 30, 0.04);
}

.lc-checkout__radio-card input[type="radio"] {
  accent-color: var(--color-black, #0a0a0a);
  flex-shrink: 0;
}

.lc-checkout__radio-card-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.25rem;
}

.lc-checkout__radio-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.lc-checkout__radio-card-name-group {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
}

.lc-checkout__radio-card-name {
  font-size: 0.9375rem;
  font-weight: 500;
}

.lc-checkout__radio-card-price {
  font-size: 0.875rem;
  color: var(--color-secondary, #6b5c45);
  margin-left: auto;
  white-space: nowrap;
}

.lc-checkout__radio-card-description {
  font-size: 0.8125rem;
  color: var(--color-secondary, #6b5c45);
  line-height: 1.4;
}

.lc-checkout__radio-card-eta {
  font-size: 0.75rem;
  color: var(--color-secondary, #6b5c45);
}

.lc-checkout__payment-logo {
  height: 1.5rem;
  width: auto;
  object-fit: contain;
}

.lc-checkout__pickup {
  margin-top: 0.625rem;
  padding: 0.875rem 1rem;
  border: 1px dashed rgba(42, 36, 30, 0.3);
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}

/* Order addons */
.lc-checkout__addons {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  margin-top: 0.75rem;
}

.lc-checkout__addon {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.875rem 1rem;
  border: 1px solid rgba(42, 36, 30, 0.18);
  background: var(--warm-white, #fefcf8);
  border-radius: var(--radius);
  transition: border-color 0.15s, background 0.15s;
}

.lc-checkout__addon:has(.lc-checkout__addon-toggle:checked) {
  border-color: var(--espresso, #2a241e);
  background: rgba(42, 36, 30, 0.04);
}

.lc-checkout__addon-row {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  cursor: pointer;
}

.lc-checkout__addon-toggle {
  accent-color: var(--color-black, #0a0a0a);
  flex-shrink: 0;
}

.lc-checkout__addon-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.lc-checkout__addon-name {
  font-size: 0.9375rem;
  font-weight: 500;
}

.lc-checkout__addon-price {
  font-size: 0.875rem;
  color: var(--color-secondary, #6b5c45);
  white-space: nowrap;
}

.lc-checkout__addon-value {
  margin-left: 1.875rem;
}

/* ── Simplified checkout header & footer ─────────────────────────────────── */

.site-header.site-header--simplified,
.site-footer.site-footer--simplified {
  background: var(--cream, #f8f4ed);
}

.site-header.site-header--simplified {
  border-bottom: 1px solid var(--cream-dark, #ebe2d3);
}

.site-footer.site-footer--simplified {
  border-top: 1px solid var(--cream-dark, #ebe2d3);
  margin-top: 4rem;
}

.lc-checkout-header__inner {
  max-width: var(--page-max-width, 80rem);
  margin: 0 auto;
  padding: 1.25rem 1.5rem;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1rem;
}

.lc-checkout-header__back {
  color: var(--espresso, #2a241e);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: var(--radius);
  text-decoration: none;
  transition: background 150ms var(--ease, ease);
}

.lc-checkout-header__back:hover {
  background: rgba(42, 36, 30, 0.06);
}

.lc-checkout-header__logo {
  justify-self: center;
}

.lc-checkout-header__trust {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--mocha, #8b7355);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  white-space: nowrap;
  justify-self: end;
}

@media (max-width: 560px) {
  .lc-checkout-header__inner {
    padding: 1rem;
  }
  .lc-checkout-header__trust span {
    display: none;
  }
}

.lc-checkout-footer__inner {
  max-width: var(--page-max-width, 80rem);
  margin: 0 auto;
  padding: 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
}

.lc-checkout-footer__copy {
  margin: 0;
}

.lc-checkout-footer__links {
  display: inline-flex;
  gap: 1.25rem;
}

.lc-checkout-footer__links a {
  color: var(--mocha, #8b7355);
  text-decoration: none;
  transition: color 150ms var(--ease, ease);
}

.lc-checkout-footer__links a:hover {
  color: var(--espresso, #2a241e);
}

.lc-checkout__hint {
  font-size: 0.875rem;
  color: var(--color-secondary, #6b5c45);
  font-style: italic;
}

.lc-checkout__saved-addresses {
  margin-bottom: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lc-checkout__saved-address-card {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(10,10,10,.15);
  cursor: pointer;
  font-size: 0.875rem;
}

.lc-checkout__company-fields {
  margin-top: 1rem;
  gap: 0;
  display: flex;
  flex-direction: column;
}

.lc-checkout__banner {
  padding: 1rem 1.25rem;
  margin-bottom: 1.25rem;
  border-radius: var(--radius);
}

.lc-checkout__banner--warning {
  background: #fef3c7;
  border: 1px solid #d97706;
}

.lc-checkout__banner--danger {
  background: #fee2e2;
  border: 1px solid #dc2626;
  color: #7f1d1d;
}

.lc-checkout__banner-title {
  font-weight: 600;
  margin-bottom: 0.375rem;
}

.lc-checkout__banner-list {
  list-style: disc;
  padding-left: 1.25rem;
  font-size: 0.875rem;
}

.lc-checkout__submit { margin-top: 0.5rem; }

/* Checkout VAT validation feedback and total-update status. Both elements are
   created dynamically by checkout-write-queue.ts; colours live here so each
   theme owns its own palette instead of the shared module hardcoding hexes. */
[data-checkout-vat-feedback] {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: hsl(38 92% 35%);
}

[data-checkout-vat-feedback][data-vat-feedback-kind='invalid'] {
  color: #b91c1c;
}

/* :not([hidden]) keeps the author display declaration from defeating the UA
   [hidden] { display: none } rule — an unscoped `display: flex` here left an
   empty spinner box running forever after every setBusyVisible(false) that
   was not followed by a navigation. */
[data-checkout-busy]:not([hidden]) {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.75rem;
  font-size: 0.875rem;
  color: var(--color-secondary, #6b5c45);
}

[data-checkout-busy]::before {
  content: '';
  flex: none;
  width: 0.875rem;
  height: 0.875rem;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: var(--radius-pill);
  animation: checkout-busy-spin 0.8s linear infinite;
}

@keyframes checkout-busy-spin {
  to {
    transform: rotate(360deg);
  }
}

.lc-checkout__trust {
  text-align: center;
  font-size: 0.8125rem;
  color: var(--color-secondary, #6b5c45);
  margin-top: 0.75rem;
}

/* ── Auth pages ───────────────────────────────────────────────────────────── */

/* b2b-pending, b2b-register and email-verification have no luxurycandles
 * template of their own and fall back to the default theme's auth.twig
 * markup (`.auth-page` > `.auth-card`, with the card's max-width set inline
 * per page). Style them here so they centre and look native rather than
 * inheriting nothing from this theme's stylesheet. */
.auth-page {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4rem 1rem;
}

.auth-card {
  width: 100%;
  max-width: 26rem;
}

/* Phone default: start near the top instead of vertically centring a short
 * form inside 60vh + 80px of padding (the heading landed ~238px down at 375px). */
.lc-auth {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 2.5rem 1.5rem 3rem;
  min-height: 0;
}

/* 768px+: restore the original centred desktop treatment. */
@media (min-width: 768px) {
  .lc-auth {
    align-items: center;
    padding: 5rem 1.5rem;
    min-height: 60vh;
  }
}

.lc-auth__card {
  width: 100%;
  max-width: 26rem;
}

.lc-auth__heading {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: -0.02em;
  margin-bottom: 1.75rem;
}

.lc-auth__form {
  display: flex;
  gap: 0;
  flex-direction: column;
}

.lc-auth__field {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin-bottom: 1rem;
}

.lc-auth__field--inline {
  flex-direction: row;
  align-items: center;
}

.lc-auth__fields-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.lc-auth__label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-secondary, #6b5c45);
}

.lc-auth__input {
  padding: 0.625rem 0.75rem;
  border: 1px solid rgba(10,10,10,.25);
  background: #fff;
  font-family: var(--font-body, sans-serif);
  font-size: 1rem;
  color: var(--color-black, #0a0a0a);
  width: 100%;
  /* Also used on read-only <dd> values (review-invitation.twig). Unlike
   * input/select/textarea, a dd is not covered by the form-control border-box
   * opt-in above and also carries the UA 40px inline-start margin. */
  box-sizing: border-box;
  margin: 0;
  transition: border-color 0.15s;
}

.lc-auth__input:focus {
  outline: none;
  border-color: var(--color-black, #0a0a0a);
}

.lc-auth__submit {
  width: 100%;
  margin-top: 0.5rem;
  margin-bottom: 1.25rem;
  padding: 0.875rem 1.25rem;
}

.lc-auth__footer {
  text-align: center;
  margin-top: 0.875rem;
  font-size: 0.875rem;
}

.lc-auth__muted {
  color: var(--color-secondary, #6b5c45);
  margin-right: 0.25rem;
}

.lc-auth__link {
  color: var(--color-secondary, #6b5c45);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.lc-auth__link--bold {
  font-weight: 600;
  color: var(--color-black, #0a0a0a);
  text-decoration: none;
}

.lc-auth__checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-size: 0.9rem;
}

.lc-auth__description {
  color: var(--color-secondary, #6b5c45);
  font-size: 0.9375rem;
  margin-bottom: 1.5rem;
}

.lc-auth__alert {
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  font-size: 0.875rem;
  border-radius: var(--radius);
}

.lc-auth__alert--error {
  background: #fee2e2;
  border: 1px solid #fca5a5;
  color: #991b1b;
}

.lc-auth__alert--success {
  background: #d1fae5;
  border: 1px solid #6ee7b7;
  color: #065f46;
}

/* ── Checkout summary (brand polish — Wave 5.4) ──────────────────────────── */

.lc-checkout-summary {
  background: var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  font-family: var(--font-body);
}

.lc-checkout-summary__heading {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
  margin: 0;
  letter-spacing: 0.01em;
}

.lc-checkout-summary__panel {
  margin: 0;
}

.lc-checkout-summary__toggle {
  display: none;
  list-style: none;
  cursor: pointer;
}

.lc-checkout-summary__toggle::-webkit-details-marker { display: none; }

.lc-checkout-summary__toggle-label {
  font-family: var(--font-heading);
  font-size: 1.0625rem;
  font-weight: 500;
}

.lc-checkout-summary__toggle-total {
  font-family: var(--font-heading);
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-checkout-summary__body {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.lc-checkout-summary__lines {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.lc-checkout-summary__line {
  display: grid;
  grid-template-columns: 3.5rem 1fr auto;
  gap: 0.75rem;
  align-items: center;
}

.lc-checkout-summary__line-image-wrap,
.lc-checkout-summary__line-image-placeholder {
  position: relative;
  width: 3.5rem;
  height: 3.5rem;
}

.lc-checkout-summary__line-image-placeholder {
  background: rgba(42, 36, 30, 0.06);
  border-radius: var(--radius);
}

.lc-checkout-summary__line-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: var(--radius);
}

.lc-checkout-summary__line-qty {
  position: absolute;
  top: -0.4rem;
  right: -0.4rem;
  background: var(--espresso, #2a241e);
  color: var(--warm-white, #fefcf8);
  font-size: 0.6875rem;
  font-weight: 600;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 0.4rem;
  border-radius: var(--radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.lc-checkout-summary__line-title {
  font-family: var(--font-heading);
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--espresso, #2a241e);
  margin: 0;
}

.lc-checkout-summary__line-variant {
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
  margin: 0.125rem 0 0;
}

.lc-checkout-summary__line-total {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-checkout-summary__discount {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-checkout-summary__discount-label {
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
}

.lc-checkout-summary__discount-row {
  display: flex;
  gap: 0.5rem;
}

.lc-checkout-summary__discount-input {
  flex: 1;
  padding: 0.625rem 0.875rem;
  border: 1px solid rgba(42, 36, 30, 0.18);
  background: var(--warm-white, #fefcf8);
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  color: var(--espresso, #2a241e);
  border-radius: var(--radius);
}

.lc-checkout-summary__discount-input::placeholder {
  color: var(--mocha, #8b7355);
}

.lc-checkout-summary__discount-apply {
  padding: 0 1rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.18);
  border-radius: var(--radius);
  color: var(--espresso, #2a241e);
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-size: 0.8125rem;
  cursor: pointer;
  transition: background 150ms var(--ease, ease);
}

.lc-checkout-summary__discount-apply:hover {
  background: rgba(42, 36, 30, 0.04);
}

.lc-checkout-summary__totals {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
  margin: 0;
}

.lc-checkout-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.9375rem;
  margin: 0;
}

.lc-checkout-summary__row-label {
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-checkout-summary__row-value {
  color: var(--espresso, #2a241e);
  margin: 0;
}

.lc-checkout-summary__row--discount .lc-checkout-summary__row-label,
.lc-checkout-summary__row--discount .lc-checkout-summary__row-value {
  color: #2f7d4f;
  font-weight: 500;
}

.lc-checkout-summary__row-value--free {
  color: #2f7d4f;
  font-weight: 500;
}

.lc-checkout-summary__row--tax-heading {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-checkout-summary__tax-heading {
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-checkout-summary__row--total {
  padding-top: 0.75rem;
  margin-top: 0.5rem;
  border-top: 1px solid rgba(42, 36, 30, 0.18);
}

.lc-checkout-summary__row-label--total,
.lc-checkout-summary__row-value--total {
  font-weight: 600;
  font-size: 1.0625rem;
  color: var(--espresso, #2a241e);
}

@media (max-width: 900px) {
  .lc-checkout-summary__toggle {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
  }
  .lc-checkout-summary__panel:not([open]) .lc-checkout-summary__body {
    display: none;
  }
  .lc-checkout-summary__panel[open] .lc-checkout-summary__body {
    margin-top: 1rem;
  }
}

/* Header chrome — sections stack vertically as full-width rows.
   header-bar.twig now bundles logo+icons+nav inline, so the legacy
   inline-flex stacking is replaced with simple block flow. */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--background, #fff);
  display: block;
}

.site-header > [class*="header-"] {
  display: block;
  width: 100%;
}

.site-header .header-bar {
  display: block;
  padding: 0;
}

/* Hide hamburger on desktop — shown only below 768px */
@media (min-width: 768px) {
  .header-bar__mobile-toggle { display: none !important; }
}

/* ── Phase E section coverage — LC mirror stubs ─────────────────────────────
 * LC overrides for sections that the default theme now covers.  Rules use LC
 * brand tokens; layout is inherited from the default CSS stack which LC loads
 * after its own sheet via the Twig layout.
 * ────────────────────────────────────────────────────────────────────────── */

/* ── Content-section shared overrides ────────────────────────────────────── */

/* category sections */
.category-banner { padding: var(--section-padding-y, 3rem) 0; }
.category-grid { padding: 2rem 0; }
.category-toolbar { padding: 0.75rem 0; border-bottom: 1px solid rgba(10,10,10,.12); }

/* ── Category listing: filter sidebar / mobile drawer, toolbar, chips ─────────
   ONE server-rendered GET form (partials/category-filters.twig) is the desktop
   sidebar and, below 1024px, an off-canvas drawer driven by <category-filters>.
   Layout: sidebar 240px + results, 56px gap, from 1024px up. */
.lc-listing { display: block; }
.lc-listing__results { min-width: 0; }
.lc-listing__filters { min-width: 0; }
category-filters { display: block; }
.lc-filters__trap { display: block; }

.lc-filters__head,
.lc-filters__backdrop,
.lc-category-toolbar__filter-btn { display: none; }
.lc-filters__fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }

.lc-filters__panel { font-family: var(--font-sans); color: var(--espresso); }
.lc-filters__form { display: flex; flex-direction: column; }
.lc-filters__group { border-bottom: 1px solid color-mix(in srgb, var(--mocha) 25%, transparent); padding: 1.25rem 0; }
.lc-filters__group:first-child { padding-top: 0; }
.lc-filters__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  list-style: none;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mocha);
  margin-bottom: 0.875rem;
}
.lc-filters__title::-webkit-details-marker,
.lc-filters__more-toggle::-webkit-details-marker { display: none; }
.lc-filters__title::after { content: "+"; font-size: 1rem; letter-spacing: 0; }
.lc-filters__group[open] > .lc-filters__title::after { content: "\2013"; }
.lc-filters__group:not([open]) > .lc-filters__title { margin-bottom: 0; }

.lc-filters__links,
.lc-filters__options { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.lc-filters__link { font-size: 0.875rem; color: var(--espresso); text-decoration: none; }
.lc-filters__link:hover { color: var(--rose-gold); }
.lc-filters__link--current { font-weight: 600; }

.lc-filters__option { display: flex; align-items: center; gap: 0.625rem; font-size: 0.875rem; cursor: pointer; }
.lc-filters__option input { accent-color: var(--espresso); width: 1rem; height: 1rem; margin: 0; flex-shrink: 0; }
.lc-filters__option-label { flex: 1; }
.lc-filters__count { font-size: 0.75rem; color: var(--mocha); }
.lc-filters__more { margin-top: 0.5rem; }
.lc-filters__more > .lc-filters__options { margin-top: 0.5rem; }
.lc-filters__more-toggle {
  list-style: none;
  cursor: pointer;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mocha);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.lc-filters__more-toggle:hover { color: var(--rose-gold); }
.lc-filters__more-hide,
.lc-filters__more[open] .lc-filters__more-show { display: none; }
.lc-filters__more[open] .lc-filters__more-hide { display: inline; }

.lc-filters__range { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.lc-filters__field { display: flex; flex-direction: column; gap: 0.375rem; }
.lc-filters__field-label { font-size: 0.75rem; color: var(--mocha); }
.lc-filters__input-wrap {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  border: 1px solid color-mix(in srgb, var(--mocha) 45%, transparent);
  background: #fff;
  padding: 0 0.625rem;
}
.lc-filters__input-wrap:focus-within { border-color: var(--espresso); }
.lc-filters__input {
  width: 100%;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0.5rem 0;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--espresso);
  outline: none;
  -moz-appearance: textfield;
}
.lc-filters__input::-webkit-outer-spin-button,
.lc-filters__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.lc-filters__unit { font-size: 0.8125rem; color: var(--mocha); }

.lc-filters__footer { display: flex; align-items: center; gap: 1rem; padding-top: 1.25rem; }
.lc-filters__apply { cursor: pointer; }
.lc-filters__apply-mobile { display: none; }
.lc-filters__clear {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--espresso);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.lc-filters__clear:hover { color: var(--rose-gold); }

/* Toolbar row: count left, sort right (filter button joins on mobile). */
.lc-category-toolbar__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.lc-category-toolbar__count { font-family: var(--font-sans); font-size: 0.8125rem; letter-spacing: 0.06em; color: var(--mocha); margin: 0; }
.lc-category-toolbar__sort-form { display: flex; align-items: center; gap: 0.5rem; margin-left: auto; }
.lc-category-toolbar__sort-label { font-family: var(--font-sans); font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--mocha); white-space: nowrap; }
.lc-category-toolbar__sort-select {
  border: 1px solid color-mix(in srgb, var(--mocha) 45%, transparent);
  padding: 0.4375rem 2rem 0.4375rem 0.75rem;
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  color: var(--espresso);
  cursor: pointer;
  appearance: none;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%232a241e' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") no-repeat right 0.625rem center;
}
.lc-category-toolbar__filter-btn {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--espresso);
  background: transparent;
  border: 1px solid var(--espresso);
  padding: 0.5rem 1rem;
  cursor: pointer;
}

/* Active filter chips */
.lc-category-toolbar__chips { list-style: none; margin: 0.875rem 0 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.lc-category-toolbar__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3125rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--mocha) 45%, transparent);
  background: #fff;
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  color: var(--espresso);
  text-decoration: none;
}
.lc-category-toolbar__chip:hover { border-color: var(--espresso); }
.lc-category-toolbar__clear {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mocha);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.lc-category-toolbar__clear:hover { color: var(--rose-gold); }

/* Desktop: sidebar + results; the toolbar aligns to the results column. */
@media (min-width: 64rem) {
  .lc-listing--with-sidebar { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 56px; align-items: start; }
  .lc-category-toolbar--with-sidebar { border-bottom: 0; }
  .lc-category-toolbar--with-sidebar .lc-category-toolbar__row,
  .lc-category-toolbar--with-sidebar .lc-category-toolbar__chips { margin-left: calc(240px + 56px); }
  /* JavaScript submits on change, so the Apply button is redundant. */
  category-filters[data-enhanced] .lc-filters__apply { display: none; }
}

/* Mobile / tablet: the same panel becomes a left drawer — only once
   <category-filters> has enhanced it; without JavaScript the form stays inline. */
@media (max-width: 63.99rem) {
  html:has(category-filters[data-enhanced]) .lc-category-toolbar__filter-btn { display: inline-block; }
  category-filters[data-enhanced] .lc-filters__backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 110;
    background: color-mix(in srgb, var(--espresso) 45%, transparent);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
  }
  category-filters[data-enhanced][data-open="true"] .lc-filters__backdrop { opacity: 1; visibility: visible; }
  category-filters[data-enhanced] .lc-filters__panel {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 120;
    width: min(88vw, 24rem);
    background-color: var(--color-cream);
    transform: translateX(-100%);
    visibility: hidden;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.35s;
  }
  category-filters[data-enhanced][data-open="true"] .lc-filters__panel { transform: translateX(0); visibility: visible; }
  category-filters[data-enhanced] .lc-filters__form { height: 100%; }
  category-filters[data-enhanced] .lc-filters__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--color-gold);
  }
  category-filters[data-enhanced] .lc-filters__heading { margin: 0; font-family: var(--font-serif); font-size: 1.25rem; font-weight: 500; }
  category-filters[data-enhanced] .lc-filters__close { background: none; border: 0; cursor: pointer; color: var(--espresso); padding: 0.25rem; display: flex; }
  category-filters[data-enhanced] .lc-filters__body { flex: 1; overflow-y: auto; padding: 1.5rem; }
  category-filters[data-enhanced] .lc-filters__footer {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--color-gold);
    background-color: var(--color-cream);
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }
  category-filters[data-enhanced] .lc-filters__apply { width: 100%; }
  category-filters[data-enhanced] .lc-filters__apply-desktop { display: none; }
  category-filters[data-enhanced] .lc-filters__apply-mobile { display: inline; }
  html.lc-filters-locked { overflow: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  .lc-filters__panel, .lc-filters__backdrop { transition: none; }
}

/* featured products */
.featured-products { padding: var(--section-padding-y, 3rem) 0; }
.featured-products__empty { color: var(--foreground, #999); font-family: var(--font-sans); text-align: center; grid-column: 1 / -1; }

/* columns */
.columns { padding: var(--section-padding-y, 3rem) 0; }

/* divider */
.divider { padding: 0.5rem 0; }

/* footer sections */
.footer-bottom { padding: 1.25rem 0; border-top: 1px solid rgba(196, 165, 114, 0.3); }
.footer-columns { padding: 3rem 0; }
.footer-col { }
.footer-copyright { font-size: 0.8125rem; color: rgba(10,10,10,.5); }
.footer-newsletter { padding: 1.5rem 0; }
.footer-newsletter-form { display: flex; flex-direction: column; gap: 0.75rem; }
.footer-payment-icons { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.footer-social-media { display: flex; gap: 0.75rem; }
.footer-social-media a { color: inherit; text-decoration: none; transition: color 0.15s; }
.footer-social-media a:hover { color: var(--color-accent-gold, #c4a572); }

/* gallery */
.gallery { padding: var(--section-padding-y, 3rem) 0; }
.gallery__item { overflow: hidden; }
.gallery__item img { transition: transform 0.35s ease; }
.gallery__item:hover img { transform: scale(1.03); }
.gallery__item-img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; }

/* group */
.group__block-img { max-width: 100%; height: auto; display: block; }

/* carousel (block-based slides) */
.carousel__slide-img { width: 100%; height: 600px; object-fit: cover; display: block; }

/* trust-badges (block-based icon) */
.trust-badges__icon { display: block; width: 48px; height: 48px; margin: 0 auto 0.75rem; }

/* categories (lc) */
.lc-category-card__image { width: 100%; height: 100%; object-fit: cover; display: block; }

/* icon-text */
.icon-text { padding: var(--section-padding-y, 3rem) 0; }

/* image-with-text */
.image-with-text { padding: var(--section-padding-y, 3rem) 0; }
.image-with-text__img { width: 100%; height: auto; display: block; }

/* recently-viewed */
.recently-viewed { padding: var(--section-padding-y, 3rem) 0; }

/* spacer */
.spacer { display: block; }

/* sticky-add-to-bag */
.sticky-add-to-bag {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 40;
  background: var(--color-cream, #f7f1e6);
  border-top: 1px solid rgba(196, 165, 114, 0.4);
  padding: 0.75rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  transform: translateY(100%);
  transition: transform 0.25s ease;
}
.sticky-add-to-bag.is-visible {
  transform: translateY(0);
}

/* Task 9 round 2 — the section wrapper div is INERT (see the comment above the
   sticky-add-to-bag element rules): the inner <sticky-add-to-bag> is the bar
   and carries the fixed positioning plus z-index 100 inline. Without this the
   wrapper paints a permanent cream strip (its own background/border/padding)
   and its transform + z-index 40 trap the bar in a stacking context below the
   cookie banner (z-index 90). Specificity (0,2,1) beats both .sticky-add-to-bag
   (0,1,0) and .sticky-add-to-bag.is-visible (0,2,0), so the wrapper can never
   slide or trap the bar even if that class were ever added. */
div.sticky-add-to-bag.lc-sticky-add-to-bag {
  position: static;
  z-index: auto;
  background: none;
  border-top: none;
  padding: 0;
  display: block;
  transform: none;
  transition: none;
}

.lc-sticky-add-to-bag__cta:disabled {
  opacity: 0.5;
  cursor: not-allowed !important;
}

/* subcategory-nav */
.subcategory-nav { padding: 0.5rem 0; }

/* testimonials */
.testimonials { padding: var(--section-padding-y, 3rem) 0; }

/* trust-badges */
.trust-badges { padding: 1.5rem 0; }

/* product-actions */
.product-actions { padding: 1rem 0; }

.lc-product-actions__cta:disabled {
  opacity: 0.5;
  cursor: not-allowed !important;
}

/* H16: htmx adds .htmx-request to the form (hx-indicator="this") for the
   duration of the add-to-cart POST and hx-disabled-elt disables the submit
   button. Dimming the whole form makes the running request visible so an
   impatient second tap is not attempted. */
.lc-product-actions__form.htmx-request {
  opacity: 0.7;
}

/* 44px tap targets (WCAG 2.5.8) — floors compose with the inline padding
   (buttons are border-box), so the visual spacing is unchanged. */
.lc-product-actions__qty-decrement, .lc-product-actions__qty-increment { min-width: 2.75rem; min-height: 2.75rem; }

/* product-short-description */
.product-short-description { padding: 0.25rem 0; }
.lc-product-short-description__body { display: flow-root; font-family: var(--font-sans); font-size: 0.9375rem; line-height: 1.75; color: var(--foreground, var(--color-black)); }
.lc-product-short-description__body--small { font-size: 0.8125rem; }
.lc-product-short-description__body--large { font-size: 1.0625rem; }

/* product-description */
.product-description { padding: 1rem 0; font-size: 0.9375rem; line-height: 1.7; color: var(--color-text, #0a0a0a); }
.lc-product-description__body { display: flow-root; font-family: var(--font-sans); font-size: 0.9375rem; line-height: 1.75; color: var(--foreground, var(--color-black)); }

/* product-gallery */
.product-gallery { padding: 1rem 0; }

/* lightbox (product gallery) — the inspection surface on touch devices, where
   the hover magnifier is disabled. A native dialog lives in the top layer, so
   it already sits above the sticky header. */
.lc-lightbox {
  padding: 0;
  border: 0;
  background: transparent;
  max-width: none;
  max-height: none;
}
.lc-lightbox::backdrop {
  background: rgba(10, 10, 10, 0.88);
}
.lc-lightbox__image {
  display: block;
  width: auto;
  height: auto;
  max-width: 92vw;
  max-height: 85vh;
  margin: auto;
  object-fit: contain;
}
.lc-lightbox__close {
  position: fixed;
  top: 1rem;
  right: 1rem;
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--color-gold, #c4a572);
  border-radius: var(--radius-pill);
  background: var(--color-cream);
  color: var(--color-black, #0a0a0a);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
}
.lc-lightbox__close:hover,
.lc-lightbox__close:focus-visible {
  background: var(--color-gold, #c4a572);
}

/* ── Sections missing from both themes — LC stubs ─────────────────────────── */

/* button section */
.button-section { padding: var(--section-padding-y, 2rem) 0; text-align: center; }

/* cookie-table */
.cookie-table { padding: var(--section-padding-y, 2rem) 0; }
.cookie-table__content { border-top: 2px solid var(--color-gold); padding-top: 1.5rem; font-family: var(--font-sans); font-size: 0.9375rem; color: var(--foreground, var(--color-black)); }

/* footer-image */
.footer-image { padding: 1rem 0; text-align: center; }
.footer-image__img { width: 100%; height: auto; display: block; object-fit: cover; }

/* form-embed */
.form-embed { padding: var(--section-padding-y, 2rem) 0; }

/* gift-card-purchase */
.gift-card-purchase { padding: var(--section-padding-y, 2rem) 0; max-width: 40rem; margin-inline: auto; }
.gift-card-purchase__unavailable { font-family: var(--font-sans); font-size: 0.9375rem; color: var(--foreground, var(--color-black)); }
.gift-card-purchase__denominations { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.gift-card-purchase__denomination-btn {
  padding: 0.5rem 1.25rem;
  border: 1px solid var(--color-accent-gold, #c4a572);
  background: none;
  cursor: pointer;
  font-size: 0.9375rem;
  font-family: var(--font-body, sans-serif);
  transition: background 0.15s, color 0.15s;
}
.gift-card-purchase__denomination-btn:hover,
.gift-card-purchase__denomination-btn.is-active {
  background: var(--color-accent-gold, #c4a572);
  color: var(--color-cream, #f7f1e6);
  border-color: var(--color-accent-gold, #c4a572);
}

/* html-embed */
.html-embed { padding: var(--section-padding-y, 2rem) 0; }

/* image section */
.image-section { padding: var(--section-padding-y, 2rem) 0; }
.image-section__img { width: 100%; height: auto; display: block; border: 1px solid transparent; }

/* product-addons */
.product-addons { padding: 1rem 0; }
.product-addons__legend { font-family: var(--font-heading, Georgia, serif); font-weight: 600; font-size: 0.875rem; letter-spacing: 0.06em; margin-bottom: 0.75rem; color: var(--foreground, var(--color-black)); }

/* product-availability */
.product-availability { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.875rem; }
.product-availability--in-stock { color: #15803d; }
.product-availability--out-of-stock { color: #9b1c1c; }
.product-availability--preorder { color: #92400e; }

/* product-availability — data-attribute-driven pill states */
.lc-product-availability { display: inline-block; }
.lc-product-availability__pill { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.25rem 0.75rem; border-radius: var(--radius); font-family: var(--font-serif); font-size: 0.875rem; letter-spacing: 0.04em; }
/*
 * Availability pill compositing (2026-08-03 remediation pass) — these four
 * rules used to paint a *translucent* rgba() background under a hardcoded
 * dark text color. That reads fine over the scheme-default cream band, but
 * `.lc-product-availability` is on the scheme band list (see the "Scheme
 * surface contract" block above), so under scheme-espresso the same
 * translucent rgba composites over the dark `--background` band instead of
 * cream — the result stays dark, and the hardcoded dark text loses contrast
 * against it (dark-on-dark).
 *
 * Fixed by baking each background into an OPAQUE literal — the exact pixel
 * the old rgba() produced when composited over the scheme-default band
 * (#f7f1e6) — so the pill now paints its own solid chip and no longer
 * depends on (or varies with) whatever scheme band sits behind it. The four
 * semantic hues (green/amber/red/gold) and their dark text partners are
 * unchanged, preserving "in-stock is green" etc.; only the alpha-compositing
 * is replaced with a fixed result. Verified >= 4.5:1 contrast for all four
 * pairs; see the deferred-items report for the computed ratios.
 */
[data-product-availability-block][data-availability-state="in_stock"] .lc-product-availability__pill { background: #e2ead6; color: #1a6632; }
[data-product-availability-block][data-availability-state="backorder"] .lc-product-availability__pill { background: #f3e2cb; color: #92400e; }
[data-product-availability-block][data-availability-state="out_of_stock"] .lc-product-availability__pill { background: #f4ded6; color: #842029; }
[data-product-availability-block][data-availability-state="preorder"] .lc-product-availability__pill { background: #f0e7d6; color: #7a6030; }

/* product-bundle */
.product-bundle { padding: 1rem 0; }
.product-bundle__image { width: 3.5rem; height: 3.5rem; object-fit: cover; }

/* product-delivery */
.product-delivery { padding: 1rem 0; font-size: 0.9375rem; }

/* product-faq */
.product-faq { padding: 1rem 0; }
.product-faq__question { padding: 0.875rem 0; font-family: var(--font-heading, Georgia, serif); font-size: 1rem; cursor: pointer; list-style: none; display: flex; justify-content: space-between; }
.product-faq__question::-webkit-details-marker { display: none; }
.product-faq__answer { padding: 0 0 1rem; font-size: 0.9375rem; color: rgba(10,10,10,.7); line-height: 1.65; }

/* product-highlights */
.product-highlights { padding: 0.75rem 0; }
.product-highlights__item { display: flex; align-items: center; gap: 0.5rem; padding: 0.375rem 0; font-size: 0.9375rem; }

/* product-images */
.product-images { position: relative; }
.product-images__main-image { width: 100%; height: auto; object-fit: cover; display: block; }
.product-images--1-1 .product-images__main-image { aspect-ratio: 1 / 1; }
.product-images--4-3 .product-images__main-image { aspect-ratio: 4 / 3; }
.product-images--4-5 .product-images__main-image { aspect-ratio: 4 / 5; }

/* product-notes */
.product-notes { padding: 0.75rem 0; font-size: 0.9375rem; line-height: 1.65; }

/* product-price */
.product-price { padding: 0.5rem 0; }
.product-price__row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.5rem; }
/* "from" prefix shown for variant products — sections/product-price.twig:26.
   product-state.ts toggles it via [data-from-prefix]; it had no rule at all. */
.product-price__from-prefix,
.lc-product-price__from-prefix { font-family: var(--font-sans, system-ui, sans-serif); font-size: 1rem; color: rgba(10,10,10,.5); }
.product-price__current { font-family: var(--font-heading, Georgia, serif); font-size: 1.75rem; font-weight: 500; color: var(--foreground, #0a0a0a); }
.product-price__compare { font-size: 1rem; color: rgba(10,10,10,.4); text-decoration: line-through; }
.product-price__savings { font-size: 0.8125rem; font-weight: 600; color: var(--color-gold-text, #836830); letter-spacing: 0.04em; }
/* EU Omnibus price-history disclosure — sections/product-price.twig:69. */
.product-price__history,
.lc-product-price__history { font-family: var(--font-sans, system-ui, sans-serif); font-size: 0.75rem; color: var(--foreground, rgba(0, 0, 0, 0.5)); margin-top: 0.375rem; }

/* product-reviews */
.product-reviews { padding: 1.5rem 0; }
.product-reviews__average { font-family: var(--font-heading, Georgia, serif); font-size: 1.25rem; margin-bottom: 0.25rem; }

/* product-specifications */
.product-specifications { padding: 1rem 0; }
.product-specifications__table { width: 100%; border-collapse: collapse; }
.product-specifications__table th { font-weight: 600; font-size: 0.8125rem; letter-spacing: 0.05em; text-transform: uppercase; padding: 0.625rem 0; border-bottom: 1px solid rgba(196,165,114,.3); }
.product-specifications__table td { font-size: 0.9375rem; padding: 0.625rem 0; border-bottom: 1px solid rgba(196,165,114,.3); }

/* product-tabs */
.product-tabs { display: block; border-top: 1px solid rgba(196,165,114,.3); margin-top: 1rem; }
.product-tabs__strip { display: flex; border-bottom: 1px solid rgba(196,165,114,.3); }
.product-tabs__trigger {
  padding: 0.75rem 1.25rem;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(10,10,10,.5);
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
}
.product-tabs__trigger:hover { color: var(--color-text, #0a0a0a); }
.product-tabs__trigger.is-active { border-bottom-color: var(--color-accent-gold, #c4a572); color: var(--color-text, #0a0a0a); }
.product-tabs__panel { padding: 1.5rem 0; }

/* product-title */
.product-title { padding: 0.5rem 0; }
.product-title__brand { font-family: var(--font-body, sans-serif); font-size: 0.75rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--color-accent-gold, #c4a572); margin: 0 0 0.5rem; }
.product-title__heading { font-family: var(--font-heading, 'Cormorant Garamond', Georgia, serif); font-size: 2rem; font-weight: 500; line-height: 1.15; margin: 0; color: var(--foreground, #0a0a0a); }
@media (min-width: 768px) {
  .product-title__heading { font-size: 2.5rem; }
}

/* product-trust-badges */
.product-trust-badges { padding: 0.75rem 0; }
.product-trust-badges__badge { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.8125rem; color: var(--foreground, rgba(10,10,10,.7)); }

/* product-variant-picker */
.product-variant-picker { display: block; padding: 0.5rem 0; }
.product-variant-picker__label { font-family: var(--font-body, sans-serif); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 500; margin: 0 0 0.5rem; }
.product-variant-picker__options { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.product-variant-picker__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  padding: 0.25rem 0.75rem;
  font-size: 0.8125rem;
  border: 1px solid rgba(196,165,114,.5);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  font-family: var(--font-body, sans-serif);
}
.product-variant-picker__pill:hover { border-color: var(--color-accent-gold, #c4a572); }
.product-variant-picker__pill.is-selected,
.product-variant-picker__pill[aria-pressed="true"] {
  border-color: var(--color-accent-gold, #c4a572);
  background: var(--color-accent-gold, #c4a572);
  color: var(--color-cream, #f7f1e6);
}
.product-variant-picker__pill.is-unavailable { opacity: 0.35; cursor: not-allowed; }
.lc-product-variant-picker__pill[data-disabled="true"],
.lc-product-variant-picker__option-label[data-disabled="true"] .lc-product-variant-picker__pill {
  opacity: 0.4;
  pointer-events: none;
}
/* Plain text-label option (swatch/pill presentation switched off in the section). */
.lc-product-variant-picker__text {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  cursor: pointer;
  padding: 0.125rem 0;
  border-bottom: 1px solid transparent;
}
.lc-product-variant-picker__text[data-selected="true"] { font-weight: 600; border-bottom-color: currentColor; }
.lc-product-variant-picker__text[data-disabled="true"] { opacity: 0.4; pointer-events: none; }

/* Color swatch (color-type attribute with a hex value). Selection ring is driven by
   variant-picker.ts via data-selected. */
.lc-product-variant-picker__swatch {
  display: inline-block;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgba(0, 0, 0, 0.2);
  cursor: pointer;
  box-sizing: border-box;
  transition: outline-color 0.15s;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.lc-product-variant-picker__swatch:hover { outline-color: rgba(0, 0, 0, 0.3); }
/* Selected: dark ring separated from the swatch by a light gap, visible on any swatch color. */
.lc-product-variant-picker__swatch[data-selected="true"] {
  outline-color: var(--color-black, #1a1a1a);
  outline-offset: 3px;
  box-shadow: 0 0 0 3px var(--background, #fff);
}
.lc-product-variant-picker__radio:focus-visible + .lc-product-variant-picker__swatch {
  outline-color: var(--color-black, #1a1a1a);
  outline-style: dashed;
  outline-offset: 3px;
}
.lc-product-variant-picker__swatch[data-disabled="true"] { opacity: 0.4; cursor: not-allowed; }

/* related-products */
.related-products { padding: var(--section-padding-y, 3rem) 0; border-top: 1px solid rgba(196,165,114,.3); }

/* LC related-products grid — auto-fill tracks reflow 4 columns down to 1 on
   a 375px phone. Replaces the hardcoded repeat(4, 1fr) inline on the div. */
.lc-related-products__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: 1.5rem;
}

/* rich-text */
.rich-text { padding: var(--section-padding-y, 3rem) 0; }
.rich-text__inner { max-width: 800px; margin-inline: auto; }
.rich-text__heading { font-family: var(--font-heading, 'Cormorant Garamond', Georgia, serif); font-size: 2.25rem; font-weight: 500; margin: 0 0 1rem; }
.rich-text__body { font-size: 0.9375rem; line-height: 1.75; color: var(--foreground, rgba(10,10,10,.8)); }

/* Merchant rich text. `.prose` is applied alongside .rich-text__body at
   sections/rich-text.twig:39, and its children are bare tags produced by the
   customizer's richtext editor rather than theme-authored markup. The editor's
   purifier profiles (config/purifier.php, `html_field` and
   `storefront_rich_text`) allow p, br, strong, em, u, a, ul, ol, li, h2, h3
   plus the media-picker img and its data-size/data-align attributes.

   The image rules below are deliberately NOT `.prose`-scoped. Only the editor
   emits data-size/data-align, and the same editor HTML renders into several
   body containers that carry no `.prose` class (static page, blog post,
   product description/tabs, image-with-text), so scoping them to `.prose`
   left merchant sizing/alignment with no effect in those places. They mirror
   the default theme.

   The anchor rule is the one that matters. Every other anchor in this theme is
   class-scoped, and there is no global `a` reset, so a bare merchant link was
   the single element rendering UA-default blue-and-underlined. */
.prose a { color: var(--color-gold-text, #836830); text-decoration: underline; text-underline-offset: 0.15em; }
.prose a:hover { opacity: 0.75; }
.prose p { margin: 0 0 1em; }
.prose h2, .prose h3 { font-family: var(--font-heading, 'Cormorant Garamond', Georgia, serif); font-weight: 500; margin: 1.5em 0 0.5em; }
.prose h2 { font-size: 1.5rem; }
.prose h3 { font-size: 1.25rem; }
.prose ul, .prose ol { margin: 0 0 1em; padding-left: 1.25rem; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li { margin-bottom: 0.25em; }
img[data-size="small"]  { width: 25%; }
img[data-size="medium"] { width: 50%; }
img[data-size="large"]  { width: 75%; }
img[data-size="full"]   { width: 100%; }
img[data-align="left"]   { float: left; margin-right: 1rem; margin-bottom: 0.5rem; }
img[data-align="center"] { display: block; margin-left: auto; margin-right: auto; float: none; }
img[data-align="right"]  { float: right; margin-left: 1rem; margin-bottom: 0.5rem; }

/* The gallery wrapper comes from the rich-text editor, so — like the
   `img[data-size]` / `img[data-align]` rules above — these are deliberately
   NOT `.prose`-scoped. The column count lives only in the wrapper class, and
   the attribute variants out-specify the sizing/alignment rules so a gallery
   image always fills its grid cell. Three and four columns fall back to two
   on narrow screens, where anything below that is unreadable. */
.rte-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.5em 0; align-items: start; }
.rte-gallery--cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rte-gallery--cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rte-gallery > img,
.rte-gallery > img[data-size],
.rte-gallery > img[data-align] { width: 100%; height: auto; margin: 0; float: none; display: block; }

@media (max-width: 640px) {
  .rte-gallery--cols-3,
  .rte-gallery--cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Float containment for the merchant-rich-text bodies: `flow-root` makes a
   floated editor image expand its container instead of escaping into the
   next section. (.lc-product-description__body is contained where it is
   defined, next to its typography.) */
.lc-static-page__body,
.lc-blog-post__body { display: flow-root; }

/* tabs-section */
.tabs-section { padding: var(--section-padding-y, 3rem) 0; max-width: var(--section-container-width, 64rem); margin-inline: auto; }
.tabs-section__nav { display: flex; border-bottom: 1px solid rgba(196,165,114,.3); margin-bottom: 1.5rem; gap: 0.5rem; }
.tabs-section__tab {
  padding: 0.625rem 1rem;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 500;
  cursor: pointer;
  color: rgba(10,10,10,.5);
  transition: color 0.15s, border-color 0.15s;
}
.tabs-section__tab:hover { color: var(--color-text, #0a0a0a); }
.tabs-section__tab--active { border-bottom-color: var(--color-accent-gold, #c4a572); color: var(--color-text, #0a0a0a); }
.tabs-section__panel { font-size: 0.9375rem; line-height: 1.7; }
.tabs-section__panel--hidden { display: none; }

/* video-section */
.video-section { padding: var(--section-padding-y, 3rem) 0; }
.video-section__wrapper { position: relative; width: 100%; overflow: hidden; }
.video-section__wrapper iframe,
.video-section__wrapper video { position: absolute; inset: 0; width: 100%; height: 100%; border: none; }

/* wishlist-button */
.wishlist-button { padding: 0.25rem 0; }
.wishlist-button__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  background: none;
  border: 1px solid rgba(196,165,114,.5);
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  font-family: var(--font-body, sans-serif);
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
  color: var(--color-text, #0a0a0a);
}
.wishlist-button__btn:hover { border-color: var(--color-accent-gold, #c4a572); }
.wishlist-button__btn.is-active,
.wishlist-button__btn[aria-pressed="true"] {
  border-color: var(--color-accent-gold, #c4a572);
  background: var(--color-accent-gold, #c4a572);
  color: var(--color-cream, #f7f1e6);
}

/* Header mega-menu menubar — horizontal nav row below the chrome bar */
.header-mega-menu {
  background: var(--background, #fff);
  border-top: 1px solid var(--border, hsl(30 15% 88%));
}

.header-mega-menu__nav {
  max-width: var(--page-max-width, 80rem);
  margin: 0 auto;
  padding: 0.75rem 1.5rem;
}

.header-mega-menu__list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin: 0;
  padding: 0;
}

.header-mega-menu__item {
  position: relative;
}

.header-mega-menu__link,
.header-mega-menu__trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem 0;
  color: inherit;
  font: inherit;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

.header-mega-menu__link:hover,
.header-mega-menu__trigger:hover {
  color: var(--color-primary, #0a0a0a);
}

/* Editorial heading accent — used by italic_accent Twig filter */
.lc-italic,
em.lc-italic {
  font-family: var(--font-serif, 'Cormorant Garamond', ui-serif, Georgia, serif);
  font-style: italic;
  font-weight: 500;
}

/* Tile placeholder — radial soft-light gradient used as image fallback
   on editorial sections (hero, categories, products, journal, etc.).
   Each variant has a different gradient center color. */
.tile-placeholder {
  background: var(--cream, #f8f4ed);
  position: relative;
  overflow: hidden;
}

.tile-placeholder::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(
    circle at 50% 40%,
    rgba(255, 255, 255, 0.65) 0%,
    rgba(255, 255, 255, 0) 60%
  );
  pointer-events: none;
}

/* A real image inside the wrapper: no placeholder glow over the photo. */
.tile-placeholder:has(picture, img)::before {
  content: none;
}

.tile-placeholder--cream {
  background: var(--cream, #f8f4ed);
}

.tile-placeholder--cream-dark {
  background: var(--cream-dark, #ebe2d3);
}

.tile-placeholder--soft {
  background: linear-gradient(135deg, #f1ebde 0%, #e3d7c1 100%);
}

.tile-placeholder--dark {
  background: var(--espresso, #2a241e);
}

.tile-placeholder--dark::before {
  background: radial-gradient(
    circle at 50% 40%,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 255, 255, 0) 60%
  );
}

.tile-placeholder__caption {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.6875rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mocha, #8a7e6e);
  text-align: center;
  padding: 1rem;
  pointer-events: none;
}

.tile-placeholder--dark .tile-placeholder__caption {
  color: rgba(255, 255, 255, 0.4);
}

/* Section header — eyebrow + serif heading + optional right-side CTA */
.section-header {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: stretch;
}

@media (min-width: 768px) {
  .section-header {
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
  }
}

.section-header__text { flex: 1 1 auto; }

.section-header__eyebrow {
  font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
  font-size: 0.6875rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--rose-gold, #b89478);
  margin: 0 0 0.75rem;
}

.section-header__title {
  font-family: var(--font-serif, 'Cormorant Garamond', ui-serif, Georgia, serif);
  font-weight: 500;
  letter-spacing: -0.005em;
  line-height: 1.05;
  margin: 0;
  font-size: clamp(1.75rem, 4vw, 3.5rem);
  /* 2026-08-03: was `var(--espresso, #2a241e)` — this snippet is included by
     categories/featured-products/featured-journal/instagram-grid/testimonials,
     all five banded and live in templates/index.json, so a hardcoded dark
     heading went invisible under scheme-espresso. See "Detector pass" in
     .superpowers/sdd/final-review-fixes.md. */
  color: var(--foreground, #2a241e);
}

.section-header__cta {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--foreground, #2a241e);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 0.25rem;
  align-self: flex-start;
  white-space: nowrap;
  transition: color 200ms ease;
}

@media (min-width: 768px) {
  .section-header__cta { align-self: flex-end; }
}

.section-header__cta:hover { color: var(--rose-gold, #b89478); }

/* Section header — centered variant (for Instagram, Testimonials) */
.section-header--centered { justify-content: center; text-align: center; }
.section-header--centered .section-header__text { flex: 0 1 auto; }

/* LC Header — primary nav row (separate row, top+bottom 1px border equal heights).
   Vertical padding lives on the items (.lc-header-nav__link) not the nav, so the
   item's animated ::after underline aligns with the nav's own bottom edge.

   Scheme scope note (2026-08-03): `.lc-header-nav` and `.lc-mega-menu` (below)
   paint their own hardcoded `background: var(--cream, #f8f4ed)` — they are NOT
   the `.lc-header-bar` section's own band surface, they are a fixed cream
   strip/dropdown layered underneath it (rendered via the `snippets/header-nav`
   include). Routing their text through `--foreground` without also routing
   this background through `--background` would risk cream-on-cream text the
   moment a merchant sets header-bar to a dark scheme, so both stay hardcoded
   together — same "element with its own background keeps its own treatment"
   rule applied to the category banner backdrops below. */
.lc-header-nav { position: relative; display: none; justify-content: center; gap: 2.5rem; padding: 0 2rem; border-top: 1px solid rgba(42, 36, 30, 0.12); border-bottom: 1px solid rgba(42, 36, 30, 0.12); background: var(--cream, #f8f4ed); flex-wrap: wrap; }
@media (min-width: 768px) { .lc-header-nav { display: flex; } }
.lc-header-nav__link { position: relative; display: inline-flex; align-items: center; gap: 0.375rem; font-family: var(--font-sans); font-size: 0.8125rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: var(--espresso, #2a241e); text-decoration: none; white-space: nowrap; padding: 1.125rem 0; transition: color 200ms var(--ease, ease); }
/* Animated underline — ported verbatim from V1's `.lc-nav-item::after` scoped CSS
   (shopomain.test reference). 1px line scaled from 0 to 1 on hover, origin
   flipping right→left for a wipe-in effect. */
.lc-header-nav__link::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right center; transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1); }
.lc-header-nav__item:hover .lc-header-nav__link::after,
.lc-header-nav__link:hover::after,
.lc-header-nav__link:focus-visible::after,
.header-mega-menu__item:hover .lc-header-nav__link::after,
.header-mega-menu__item[data-open="true"] .lc-header-nav__link::after { transform: scaleX(1); transform-origin: left center; }
/* Rotate the trigger chevron when the mega panel is open — matches V1's
   PRODUKTY chevron flipping from down (v) to up (^). */
.header-mega-menu__item[data-open="true"] .header-mega-menu__chevron { transform: rotate(180deg); }
.header-mega-menu__chevron { transition: transform 0.2s ease; }

/* Menu-tree mega panel: a top item with its own URL stays a link; a sibling
   chevron button (data-mega-menu-trigger) opens the panel. Columns are the
   item's children, links their children. */
.header-mega-menu__item--split { display: flex; align-items: center; gap: 0.125rem; }
.header-mega-menu__toggle { background: none; border: 0; cursor: pointer; display: inline-flex; align-items: center; padding: 0.5rem 0.25rem; color: var(--espresso, #2a241e); }
.header-mega-menu__toggle:focus-visible { outline: 1px solid currentColor; outline-offset: 2px; }
.header-mega-menu__item[data-open="true"] .header-mega-menu__toggle .header-mega-menu__chevron { transform: rotate(180deg); }
.header-mega-menu__column--tree { min-width: 0; }
.menu-tree--accordion .menu-tree__item--has-columns { padding-bottom: 0.25rem; }
.menu-tree--accordion .menu-tree__column { min-width: 0; }
.header-mega-menu__column-heading-link { color: inherit; text-decoration: none; }
.header-mega-menu__column-heading-link:hover,
.header-mega-menu__column-heading-link:focus-visible { text-decoration: underline; }
.header-mega-menu__panel-link:hover,
.header-mega-menu__panel-link:focus-visible { color: var(--color-gold); border-bottom-color: currentColor; }

/* Mobile menu accordion (render_menu(..., { accordion: true })): top item ->
   column heading (eyebrow) -> links. The panel is shown by toggling `hidden`
   from <mobile-menu>; no inline styles in the markup. */
.menu-tree--accordion { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.menu-tree--accordion .menu-tree__item { border-bottom: 1px solid color-mix(in srgb, var(--color-gold) 25%, transparent); }
.menu-tree--accordion .menu-tree__row { display: flex; align-items: center; justify-content: space-between; }
.menu-tree--accordion .menu-tree__link { display: block; font-family: var(--font-sans); font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-black); text-decoration: none; padding: 0.875rem 0; }
.menu-tree--accordion .menu-tree__row .menu-tree__link { flex: 1; }
.menu-tree--accordion .menu-tree__toggle { background: none; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; min-width: 2.75rem; min-height: 2.75rem; padding: 0; color: var(--color-black); }
.menu-tree--accordion .menu-tree__toggle--label { width: 100%; justify-content: space-between; padding: 0 calc((2.75rem - 14px) / 2) 0 0; }
.menu-tree--accordion .menu-tree__toggle:focus-visible,
.menu-tree--accordion .menu-tree__link:focus-visible { outline: 1px solid currentColor; outline-offset: 2px; }
.menu-tree--accordion .menu-tree__chevron { transition: transform 0.2s ease; }
.menu-tree--accordion .menu-tree__toggle[aria-expanded="true"] .menu-tree__chevron { transform: rotate(180deg); }
.menu-tree--accordion .menu-tree__panel { padding: 0 0 1rem 0.75rem; display: flex; flex-direction: column; gap: 1rem; }
.menu-tree--accordion .menu-tree__panel[hidden] { display: none; }
.menu-tree--accordion .menu-tree__eyebrow { font-family: var(--font-sans); font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-gold); margin: 0 0 0.375rem; }
.menu-tree--accordion .menu-tree__eyebrow-link { color: inherit; text-decoration: none; }
.menu-tree--accordion .menu-tree__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.menu-tree--accordion .menu-tree__links .menu-tree__item { border-bottom: 0; }
.menu-tree--accordion .menu-tree__sublink { display: block; font-family: var(--font-sans); font-size: 0.8125rem; letter-spacing: 0.04em; color: var(--color-black); text-decoration: none; padding: 0.4375rem 0; }

/* LC Announcement Bar override */
.header-announcement-bar {
  position: relative;
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  padding: 0.625rem 1rem;
  padding-right: 3.5rem;
  text-transform: none;
}

.header-announcement-bar__pair {
  align-items: center;
  gap: 1.5rem;
  flex: 1 1 auto;
  justify-content: center;
}

.header-announcement-bar__separator {
  opacity: 0.4;
  font-size: 0.875rem;
}

.header-announcement-bar__msg {
  font-size: inherit;
  letter-spacing: inherit;
}

.header-announcement-bar__marquee {
  display: flex;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  flex: 1 1 auto;
}

.header-announcement-bar__marquee-content {
  display: inline-flex;
  gap: 2rem;
  animation: lc-header-announcement-marquee 40s linear infinite;
  flex-shrink: 0;
  padding-right: 2rem;
}

@keyframes lc-header-announcement-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

/* Reduced motion: the seamless loop needs two side-by-side strips parked at
   translateX(0) inside an overflow:hidden container, which strands every
   message past the first off-screen with no way to reach it. Drop the
   (already aria-hidden) duplicate and let the single remaining strip wrap,
   so every announcement reads as static text — no animation, no scrolling. */
@media (prefers-reduced-motion: reduce) {
  .header-announcement-bar__marquee { overflow: visible; white-space: normal; }
  .header-announcement-bar__marquee-content { animation: none; flex-wrap: wrap; white-space: normal; }
  .header-announcement-bar__marquee-content[aria-hidden="true"] { display: none; }
}

/* Dismiss control — absolute right, vertically centred against the bar.
   44px floor (WCAG 2.5.8); the bar's padding-right below holds this end open
   (button width + right offset) so no message slides underneath. */
.header-announcement-bar__dismiss {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  min-width: 2.75rem;
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: 0;
  color: inherit;
  font-size: 1rem;
  line-height: 1;
  padding: 0;
  cursor: pointer;
}
.header-announcement-bar__dismiss:hover { opacity: 0.75; }
.header-announcement-bar__dismiss:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Announcement bar gutters: x glyph ~18px from the edge (mirrors the 16px left
   gutter), padding-right just clears the 44px button, marquee edges fade
   instead of hard-clipping. Desktop: x aligns with the header container's
   right edge (cart icon centre) and padding-left mirrors padding-right. */
.header-announcement-bar { padding-right: 3rem; }
.header-announcement-bar__dismiss { right: 0.25rem; }
.header-announcement-bar__marquee {
  -webkit-mask-image: linear-gradient(to right, transparent, #000 16px, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(to right, transparent, #000 16px, #000 calc(100% - 24px), transparent);
}
@media (min-width: 768px) {
  .header-announcement-bar { padding-left: 3rem; }
  .header-announcement-bar__dismiss { right: max(0.25rem, calc((100% - var(--page-max-width, 80rem)) / 2 + 1.5rem)); }
}

/* LC Header Bar — centered 3-zone layout */
/* No border-bottom — the .lc-header-nav row directly underneath has its own
   top+bottom borders (rgba(42, 36, 30, 0.12)). A separate border-bottom here
   would stack with the nav's border-top, producing a visually thicker 2px
   line below the announcement bar. */
.lc-header-bar__inner { max-width: var(--page-max-width, 80rem); margin: 0 auto; padding: 1rem 1.5rem; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.5rem; }
.lc-header-bar__cluster { display: inline-flex; align-items: center; gap: 0.5rem; }
.lc-header-bar__cluster--left { justify-self: start; }
.lc-header-bar__cluster--right { justify-self: end; }
.lc-header-bar__center { justify-self: center; }
.lc-header-bar__icon-btn { background: none; border: 0; width: 2.75rem; height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; color: var(--foreground, #2a241e); cursor: pointer; text-decoration: none; transition: color 200ms var(--ease, ease); }
.lc-header-bar__icon-btn:hover { color: var(--rose-gold, #b89478); }
.lc-header-bar__cart-count { position: absolute; top: 0.25rem; right: 0.25rem; background: var(--rose-gold, #b89478); color: white; border-radius: var(--radius-pill); font-size: 0.625rem; font-weight: 600; min-width: 1.125rem; height: 1.125rem; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.lc-header-bar__cart-button { position: relative; }
.lc-header-logo { display: inline-flex; align-items: baseline; gap: 0.5rem; font-family: var(--font-serif); font-size: 1.625rem; font-weight: 500; letter-spacing: -0.01em; text-decoration: none; color: var(--foreground, #2a241e); line-height: 1; }
.lc-header-logo__bullet { width: 0.4375rem; height: 0.4375rem; border-radius: var(--radius-pill); background: var(--rose-gold, #b89478); align-self: center; }
.lc-header-logo__italic { font-style: italic; font-weight: 500; }
.lc-header-logo__img,
.lc-header-bar__logo-img { height: var(--logo-h, 28px); width: auto; max-width: 100%; display: block; object-fit: contain; }
@media (max-width: 768px) { .lc-header-logo__img, .lc-header-bar__logo-img { height: var(--logo-h-mobile, 22px); } }
.lc-header-bar__search-bar { background: var(--cream, #f8f4ed); border-top: 1px solid var(--cream-dark, #ebe2d3); padding: 0.75rem 1.5rem; }
.lc-header-bar__search-bar[hidden] { display: none; }
.lc-header-bar__search-input { width: 100%; max-width: 50rem; margin: 0 auto; display: block; background: transparent; border: 0; border-bottom: 1px solid var(--cream-dark, #ebe2d3); padding: 0.5rem 0; font-size: 1rem; color: var(--espresso, #2a241e); outline: none; }

/* C1 — the 1fr auto 1fr grid + 173px logo + five 40px icons is 493px wide;
   under 768px collapse gaps, hide the wishlist icon, and let the logo shrink. */
.lc-header-bar { overflow-x: clip; }
@media (max-width: 767px) {
  .lc-header-bar__inner { padding: 0.75rem 1rem; gap: 0.5rem; grid-template-columns: auto minmax(0, 1fr) auto; }
  .lc-header-bar__cluster { gap: 0.25rem; }
  .lc-header-bar__center { min-width: 0; }
  .lc-header-logo { font-size: 1.25rem; gap: 0.375rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .header-wishlist { display: none; }
}

/* LC mega menu (secondary nav row, LC-only) */
/* Border colors match the V1 reference (rgba(42, 36, 30, 0.12)) — subtle
   espresso instead of cream-dark, which previously stacked with the
   .lc-header-bar wrapper to look 2px thick. */
.lc-mega-menu { background: var(--cream, #f8f4ed); border-bottom: 1px solid rgba(42, 36, 30, 0.12); position: relative; }
/* Task 27 (M5): the .lc-mega-menu__* rules below were dead — no .twig in this
   theme or its default parent renders those classes (the live panel uses
   .header-mega-menu__*). Deleted after verification; see the task report. */

/* LC Hero override — left-aligned text on left third, cream-and-mocha tones */
.lc-hero { position: relative; min-height: clamp(420px, 60vh, 580px); overflow: hidden; }
.lc-hero__media { position: absolute; inset: 0; }
.hero__image { width: 100%; height: 100%; object-fit: cover; }
.lc-hero__overlay {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  min-height: inherit;
  background: linear-gradient(to right, rgba(248,244,237,0.92) 0%, rgba(248,244,237,0.65) 38%, rgba(248,244,237,0) 60%);
}
.lc-hero__inner { max-width: var(--page-max-width, 80rem); width: 100%; margin: 0 auto; padding: 5rem 2rem; }
.lc-hero__content { max-width: 44rem; text-align: left; }
.lc-hero__eyebrow {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rose-gold, #b89478);
  margin: 0 0 1.5rem;
}
.lc-hero__title {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(2.5rem, 7vw, 5.5rem);
  letter-spacing: -0.01em;
  line-height: 1;
  color: var(--foreground, #2a241e);
  margin: 0 0 1.5rem;
}
.lc-hero__body {
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--mocha, #8b7355);
  margin: 0 0 2rem;
  max-width: 28rem;
}
.lc-hero__ctas { display: inline-flex; gap: 0.75rem; flex-wrap: wrap; }
.lc-hero__cta {
  display: inline-flex;
  align-items: center;
  padding: 1rem 2rem;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  letter-spacing: 0.04em;
  font-weight: 500;
  text-decoration: none;
  text-transform: none;
  border-radius: var(--radius);
  transition: background 200ms var(--ease, ease), color 200ms var(--ease, ease), border-color 200ms var(--ease, ease);
}
.lc-hero__cta--primary {
  background: var(--espresso, #2a241e);
  color: var(--cream, #f8f4ed);
  border: 1px solid var(--espresso, #2a241e);
}
/*
 * 2026-08-03: both rules below used a hardcoded `var(--espresso, #2a241e)`
 * for `color`/`border-color` while sitting on `background: transparent` —
 * i.e. directly on the `.lc-hero` band. That's fine under scheme-default
 * (band is light) but invisible under scheme-espresso (band is dark). Found
 * by inspection alongside `.lc-hero__cta--secondary` (theme.css:4219 in the
 * original audit) while fixing this file — see "Detector pass" in
 * .superpowers/sdd/final-review-fixes.md. `.lc-hero__cta--secondary:hover`
 * is untouched: it paints its own opaque `background`, so its `color` isn't
 * on the band.
 */
.lc-hero__cta--primary:hover { background: transparent; color: var(--foreground, #2a241e); }
.lc-hero__cta--secondary {
  background: transparent;
  color: var(--foreground, #2a241e);
  border: 1px solid var(--foreground, #2a241e);
}
.lc-hero__cta--secondary:hover { background: var(--espresso, #2a241e); color: var(--cream, #f8f4ed); }

/* When hero has a photographic background, invert CTAs (warm white on dim overlay) */
.lc-hero--has-media .lc-hero__cta--primary {
  background: #fefcf8;
  color: var(--espresso, #2a241e);
  border-color: #fefcf8;
}
.lc-hero--has-media .lc-hero__cta--primary:hover {
  background: transparent;
  color: #fefcf8;
}
.lc-hero--has-media .lc-hero__cta--secondary {
  color: #fefcf8;
  border-color: #fefcf8;
}
.lc-hero--has-media .lc-hero__cta--secondary:hover {
  background: #fefcf8;
  color: var(--espresso, #2a241e);
}
.lc-hero__caption {
  position: absolute;
  bottom: 1.5rem;
  right: 1.5rem;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.625rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mocha, #8b7355);
  z-index: 2;
}

/* LC Categories override */
.lc-categories-section { padding: 5rem 0; }
.lc-categories__inner { max-width: var(--page-max-width, 80rem); margin: 0 auto; padding: 0 1.5rem; }

/* ── Universal content-width setting ──────────────────────────────────────────
   Applied as horizontal padding on the section ROOT (no inner wrapper), so a
   root-level grid/flex layout keeps its direct children and the scheme
   background still spans the full width. [data-section-id] raises specificity
   above single-class root rules that set their own padding shorthand. */
[data-section-id].section--contained-container {
  padding-inline: max(1.5rem, calc((100% - var(--page-max-width, 80rem)) / 2 + 1.5rem));
}
[data-section-id].section--contained-narrow {
  padding-inline: max(1.5rem, calc((100% - 800px) / 2 + 1.5rem));
}
.lc-categories__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2.5rem; }
@media (max-width: 767px) { .lc-categories__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.lc-category-card { display: block; text-decoration: none; color: inherit; }
.lc-category-card__media { aspect-ratio: 1 / 1; }
.lc-category-card__media picture { width: 100%; height: 100%; }
.lc-category-card__caption-row { display: flex; justify-content: space-between; align-items: baseline; margin-top: 0.75rem; }
.lc-category-card__name { font-family: var(--font-serif); font-size: 1.125rem; font-weight: 400; color: var(--foreground, #2a241e); }
.lc-category-card__meta { font-family: var(--font-mono, ui-monospace, monospace); font-size: 0.6875rem; text-transform: uppercase; color: var(--mocha, #8b7355); letter-spacing: 0.16em; }
/* Card styles (settings.card_style). `standard` is the base look above. */
.categories--compact .lc-categories__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.categories--compact .lc-category-card__meta { display: none; }
.categories--compact .lc-category-card__name { font-size: 0.9375rem; }
@media (min-width: 768px) { .categories--compact .lc-categories__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .categories--compact .lc-categories__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

.categories--detailed .lc-categories__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.5rem; }
.categories--detailed .lc-category-card__media { aspect-ratio: 4 / 5; }
.categories--detailed .lc-category-card__caption-row { flex-direction: column; align-items: flex-start; gap: 0.25rem; margin-top: 1rem; }
.categories--detailed .lc-category-card__name { font-size: 1.625rem; line-height: 1.2; }
.categories--detailed .lc-category-card__name::after { content: ' \2192'; display: inline-block; opacity: 0; transform: translateX(-0.375rem); transition: opacity 0.2s ease, transform 0.2s ease; }
.categories--detailed .lc-category-card:hover .lc-category-card__name,
.categories--detailed .lc-category-card:focus-visible .lc-category-card__name { text-decoration: underline; text-underline-offset: 0.25rem; }
.categories--detailed .lc-category-card:hover .lc-category-card__name::after,
.categories--detailed .lc-category-card:focus-visible .lc-category-card__name::after { opacity: 1; transform: none; }
@media (max-width: 479px) { .categories--detailed .lc-categories__grid { grid-template-columns: minmax(0, 1fr); } }
@media (min-width: 1024px) { .categories--detailed .lc-categories__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.lc-categories-section .category-tile__media { background: var(--cream-dark, #ebe2d3); }

/* LC ProductCard override */
.lc-product-card .product-card__image-wrap { background: var(--cream-dark, #ebe2d3); }
.lc-product-card .product-card__title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 500;
  letter-spacing: -0.005em;
}
.lc-product-card .product-card__eyebrow,
.lc-product-card__eyebrow {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rose-gold, #b89478);
  margin: 0 0 0.25rem;
}

/* LC image-with-text — ensure grid columns size correctly */
.lc-image-with-text .image-with-text__media,
.lc-image-with-text .lc-tile-placeholder { min-width: 0; }
.lc-image-with-text .image-with-text__media img { width: 100%; height: auto; display: block; }

/* LC image-with-text stat row */
.image-with-text__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
  border-top: 1px solid var(--cream-dark, #ebe2d3);
  padding-top: 2rem;
}
.image-with-text__stat-value {
  font-family: var(--font-serif);
  font-size: 2rem;
  font-weight: 500;
  line-height: 1;
  color: var(--foreground, #2a241e);
}
.image-with-text__stat-label {
  margin-top: 0.5rem;
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mocha, #8b7355);
}

/* LC product card — badge + placeholder */
.lc-product-card .product-card__badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  background: white;
  padding: 0.25rem 0.5rem;
  font-size: 0.625rem;
  font-family: var(--font-mono, ui-monospace, monospace);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  z-index: 2;
}

/* Out-of-stock badge — bottom-left so it never overlaps the top-left
   editorial/sale badge when a product carries both. Same specificity as the
   base rule above, so source order lets this win. */
.lc-product-card .product-card__badge--stock {
  top: auto;
  bottom: 0.75rem;
  left: 0.75rem;
}
.lc-product-card__placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* LC Testimonials override */
.testimonials.lc-testimonials { padding: 5rem 0; }
.testimonials__grid { display: grid; grid-template-columns: repeat(var(--testimonials-cols, 3), minmax(0, 1fr)); gap: 3rem; }
.testimonials__grid--layout-stack { grid-template-columns: minmax(0, 1fr); max-width: 720px; margin-left: auto; margin-right: auto; }
@media (max-width: 767px) { .testimonials__grid { grid-template-columns: minmax(0, 1fr); } }
.lc-testimonials .testimonial-card { text-align: center; align-items: center; }
.lc-testimonials .testimonial-card__stars { justify-content: center; }
.lc-testimonials .testimonial-card__quote {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.4;
  color: var(--foreground, #2a241e);
  margin: 0 0 1.5rem;
}
.lc-testimonials .testimonial-card__attribution {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  color: var(--mocha, #8b7355);
}

/* LC footer override — pixel-perfect parity with prototype */
.lc-footer { padding: 80px 0 32px; }
.lc-footer__columns {
  display: grid;
  gap: 48px;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 32px;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .lc-footer__columns { grid-template-columns: 2fr 1fr 1fr 1fr 1fr; }
}
.footer-col { display: flex; flex-direction: column; }
.footer-col__heading {
  font-family: var(--font-sans, 'DM Sans', sans-serif);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--mocha, #8b7355);
  margin-bottom: 20px;
  padding: 0;
  border: none;
}
.lc-footer__columns .footer-col nav ul { list-style: none; margin: 0; padding: 0; }
.lc-footer__columns .footer-col li { margin-bottom: 12px; font-size: 14px; }
.lc-footer__columns .footer-col nav a,
.lc-footer__columns .footer-col__link {
  font-family: var(--font-sans, sans-serif);
  font-size: 14px;
  color: var(--foreground, #ebe2d3);
  text-decoration: none;
  transition: color 0.2s var(--ease, ease);
}
.lc-footer__columns .footer-col nav a:hover,
.lc-footer__columns .footer-col__link:hover { color: var(--rose-gold, #b89478); }
.lc-brand-logo-img { height: var(--logo-h, 28px); width: auto; max-width: 100%; display: block; object-fit: contain; }
.footer-brand-wordmark {
  font-family: var(--font-serif, 'Cormorant Garamond', serif);
  font-size: clamp(22px, 2.4vw, 32px);
  white-space: nowrap;
  color: var(--foreground, #fefcf8);
  margin-bottom: 16px;
  letter-spacing: 0.04em;
}
.footer-brand-blurb {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 1.7;
  color: var(--foreground, #ebe2d3);
  opacity: 0.8;
  max-width: 280px;
  margin: 0;
}

/*
 * Scheme surface contract — every non-opted-out luxurycandles section's root
 * class is listed here so its "Color scheme" universal setting (scheme-{id}
 * wrapper class) actually repaints the section. Enforced by
 * tests/Feature/Theming/Sections/Luxurycandles/SchemeSweepCompletenessTest.php.
 * Do not re-add a per-section background/color declaration elsewhere for any
 * class listed below — this is their single source of truth for that pair.
 *
 * Note on tranche-A convergence (`.lc-hero`, `.lc-categories-section`,
 * `.lc-header-bar`, `.lc-testimonials`): before joining the band these each
 * had their own hardcoded `background: var(--cream, #f8f4ed)`. The band's
 * resolved `--background` for scheme-default renders as `#f7f1e6` (the
 * theme's actual page background), a ~3/255 shift from the old `#f8f4ed`
 * literal. These sections were previously very slightly off from the rest of
 * the page and now match it exactly — accepted, not a regression.
 *
 * Further convergences (2026-08-03 remediation pass — banded sections had
 * hardcoded dark text sitting on the scheme-driven band, invisible under
 * scheme-espresso):
 *   - `.lc-footer` text: nav links + brand blurb moved off the literal
 *     `--cream-dark` (#ebe2d3) token onto `--foreground` (same #ebe2d3
 *     fallback, so scheme-default's rendering is unchanged); the brand
 *     wordmark moved off `--warm-white` (#fefcf8) the same way.
 *   - `.lc-newsletter .newsletter__trust` had already converged from
 *     `--cream-dark` to `--foreground` (#ebe2d3 fallback) in an earlier
 *     tranche but was never added to this note.
 *   - Descendant text now routed through `--foreground` instead of a
 *     hardcoded token/hex: `.lc-hero__title`, `.lc-category-card__name`,
 *     `.lc-testimonials .testimonial-card__quote`,
 *     `.image-with-text__stat-value`, `.atelier-feature__cta`,
 *     `.journal-card__continue`, `.featured-products__empty`,
 *     `.rich-text__body`, `.product-trust-badges__badge`,
 *     `.product-price__current`, `.product-title__heading`,
 *     `.lc-header-bar__icon-btn`, `.lc-header-logo` (the last two only where
 *     the element sits directly on the section's own band — `.lc-header-nav`
 *     and `.lc-mega-menu` intentionally keep their own hardcoded cream
 *     surface + espresso text, see the comment above `.lc-header-nav` below).
 *   - `--color-gold` / `--rose-gold` / `--mocha` accents were left exactly as
 *     they were everywhere — they are deliberately brand-global, not part of
 *     the per-section scheme.
 */
.lc-announcement,
.lc-breadcrumbs,
.lc-header-bar,
.lc-hero,
.lc-categories-section,
.lc-image-with-text,
.lc-featured-products,
.atelier-feature,
.featured-journal,
.lc-testimonials,
.lc-trust-badges,
.lc-icon-text,
.instagram-grid,
.lc-newsletter,
.lc-footer,
.lc-footer-copyright,
.lc-footer-newsletter,
.lc-footer-social-media,
.lc-header-logo-wrapper,
.lc-header-search,
.lc-rich-text,
.lc-gallery,
.lc-video,
.lc-image,
.lc-carousel,
.lc-accordion,
.lc-tabs,
.lc-recently-viewed,
.lc-related-products,
.lc-gift-card-purchase,
.lc-cookie-table,
.lc-subcategory-nav,
.lc-category-banner,
.lc-category-grid,
.lc-category-toolbar,
.lc-product-title,
.lc-product-price,
.lc-product-short-description,
.lc-product-description,
.lc-product-gallery,
.lc-product-images,
.lc-product-actions,
.lc-product-variant-picker,
.lc-product-availability,
.lc-product-addons,
.lc-product-bundle,
.lc-product-delivery,
.lc-product-faq,
.lc-product-highlights,
.lc-product-notes,
.lc-product-reviews,
.lc-product-specifications,
.lc-product-tabs,
.lc-product-trust-badges {
  background-color: var(--background, #f8f4ed);
  color: var(--foreground, #2a241e);
}

/* Empty-review explanation (invitation-only flow) + rating wrapper that
   carries the sr-only text equivalent for the star glyph. */
.lc-product-tabs__reviews-note {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 0.9375rem;
  color: var(--foreground, rgba(0, 0, 0, 0.45));
  margin: 0.5rem 0 0;
}
.lc-product-tabs__rating {
  display: inline-flex;
  align-items: baseline;
  gap: 0.25rem;
}

/* Free-shipping nudge in the lazy PDP delivery fragment. */
.lc-product-delivery__free-shipping {
  display: flex;
  align-items: baseline;
  gap: 0.625rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(185, 155, 100, 0.2);
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.65);
}

/*
 * Banner band exception (2026-08-03) — `category-banner` (ex
 * `collection-banner`) is registered in SCHEME_BAND_EXCEPTIONS
 * (SchemeSweepCompletenessTest.php) with this class as its real band,
 * instead of relying on `.lc-category-banner` above. The banner previously
 * set an inline
 * `style="…background-color: var(--color-black);…"` on its immediate
 * child — a `width: 100%` div that fully occludes the section root's band
 * paint, so the "Color scheme" dropdown had zero visible effect. That inline
 * background-color is now removed from the twig and replaced by these rules,
 * so picking a scheme actually repaints the banner's backdrop.
 *
 * The `overlay_opacity`-driven `rgba(0,0,0,…)` scrim and the breadcrumb/
 * heading/description text (inline-colored white/cream) are deliberately
 * left untouched — they exist to keep text legible over merchant photography
 * regardless of scheme, the same reasoning documented in
 * SurfaceColorSchemeTest.php's `surface_sections_without_any_inline_color`
 * exclusion note for this section.
 */
.category-banner__backdrop {
  background-color: var(--background, #2a241e);
}
.lc-category-banner__backdrop {
  background-color: var(--background, #2a241e);
}

/* LC footer copyright / bottom bar */
.site-footer { background: var(--background, #2a241e); color: var(--foreground, #ebe2d3); }
.footer-bottom {
  margin-top: 48px;
}
.footer-bottom__inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 24px 32px 0;
  border-top: 1px solid rgba(248, 244, 237, 0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--mocha, #8b7355);
  font-family: var(--font-sans, 'DM Sans', sans-serif);
}
.footer-bottom__copyright,
.footer-bottom__domains {
  margin: 0;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--mocha, #8b7355);
}
.lc-footer-bottom .footer-bottom__legal {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: 12px;
  letter-spacing: 0.08em;
}
.lc-footer-bottom .footer-bottom__legal-link {
  color: var(--cream, #f8f4ed);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.15s;
}
.lc-footer-bottom .footer-bottom__legal-link:hover {
  color: var(--color-gold, #c4a572);
}

/* LC Newsletter override — refined espresso panel */
.newsletter.lc-newsletter { padding: 5rem 0; }
.lc-newsletter .newsletter__eyebrow {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  color: var(--rose-gold, #b89478);
}
.lc-newsletter .newsletter__title {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 500;
}
.lc-newsletter .newsletter__input {
  border-color: color-mix(in srgb, currentColor 40%, transparent);
  color: var(--foreground, #f8f4ed);
}
.lc-newsletter .newsletter__input::placeholder { color: currentColor; opacity: 0.5; }
.lc-newsletter .newsletter__submit {
  background: var(--foreground, #f8f4ed);
  color: var(--background, #2a241e);
  border-color: var(--foreground);
}
.lc-newsletter .newsletter__submit { white-space: nowrap; flex-shrink: 0; }
.lc-newsletter .newsletter__form { display: flex; gap: 0; max-width: 480px; margin: 0 auto; }
.lc-newsletter .newsletter__form .newsletter__input { flex: 1; min-width: 0; border-right: none; }
.lc-newsletter .newsletter__trust { color: var(--foreground, #ebe2d3); opacity: 0.7; }
.lc-newsletter .newsletter__input,
.lc-newsletter input[type="email"] {
  background: transparent;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, currentColor 30%, transparent);
  border-radius: var(--radius);
  padding: 0.75rem 0;
  color: var(--foreground, #fefcf8);
  font-family: var(--font-sans);
  font-size: 0.9375rem;
}
.lc-newsletter .newsletter__input:focus,
.lc-newsletter input[type="email"]:focus {
  outline: none;
  border-bottom-color: rgba(254, 252, 248, 0.6);
}

/* Promo card section */
.promo-card { display: grid; grid-template-columns: 1fr; gap: 0; padding: 0; }
@media (min-width: 768px) {
  .promo-card { grid-template-columns: 1fr 1fr; }
  .promo-card--image-right .promo-card__image-wrap { order: 2; }
}
.promo-card__image-wrap { aspect-ratio: 1 / 1; position: relative; overflow: hidden; }
.promo-card__image-wrap picture { width: 100%; height: 100%; }
.promo-card__image,
.promo-card__placeholder { width: 100%; height: 100%; object-fit: cover; }
.promo-card__content { padding: 4rem 5rem; display: flex; flex-direction: column; justify-content: flex-end; background: var(--background, #2a241e); color: var(--foreground, #fdfaf3); }
.promo-card__eyebrow { font-family: var(--font-sans); font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--rose-gold, #b89478); margin: 0 0 1rem; align-self: flex-start; }
.promo-card__title { font-family: var(--font-serif); font-size: clamp(2rem, 5vw, 4rem); font-weight: 500; margin: 0 0 1rem; line-height: 1.05; letter-spacing: -0.005em; }
.promo-card__body { font-size: 1rem; line-height: 1.6; margin: 0 0 1.5rem; max-width: 32rem; }
.promo-card__cta { display: inline-flex; align-items: center; align-self: flex-start; font-family: var(--font-sans); font-size: 0.8125rem; font-weight: 500; background: var(--foreground, #fdfaf3); color: var(--background, #2a241e); padding: 0.875rem 1.5rem; text-decoration: none; }

/* Atelier feature section */
.atelier-feature { display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) { .atelier-feature { grid-template-columns: 1fr 1fr; } }
.atelier-feature__media { aspect-ratio: 1 / 1; width: 100%; min-width: 0; overflow: hidden; }
@media (min-width: 768px) { .atelier-feature__media { min-height: 400px; } }
.atelier-feature__media picture { width: 100%; height: 100%; }
.atelier-feature__image,
.atelier-feature__placeholder { width: 100%; height: 100%; object-fit: cover; }
/* Image shape / crop focus modifiers (atelier-feature) */
.atelier-feature__media--ratio-original { aspect-ratio: auto; }
.atelier-feature__media--ratio-original picture,
.atelier-feature__media--ratio-original .atelier-feature__image { height: auto; display: block; }
.atelier-feature__media--ratio-original .atelier-feature__placeholder { aspect-ratio: 1 / 1; height: auto; }
.atelier-feature__media--ratio-4x5 { aspect-ratio: 4 / 5; }
.atelier-feature__media--ratio-3x4 { aspect-ratio: 3 / 4; }
.atelier-feature__media--ratio-4x3 { aspect-ratio: 4 / 3; }
.atelier-feature__media--ratio-16x9 { aspect-ratio: 16 / 9; }
.atelier-feature__media--focus-top .atelier-feature__image { object-position: top; }
.atelier-feature__media--focus-bottom .atelier-feature__image { object-position: bottom; }
.atelier-feature__media--focus-left .atelier-feature__image { object-position: left; }
.atelier-feature__media--focus-right .atelier-feature__image { object-position: right; }
.atelier-feature__media--focus-top-left .atelier-feature__image { object-position: top left; }
.atelier-feature__media--focus-top-right .atelier-feature__image { object-position: top right; }
.atelier-feature__media--focus-bottom-left .atelier-feature__image { object-position: bottom left; }
.atelier-feature__media--focus-bottom-right .atelier-feature__image { object-position: bottom right; }
/* Converged onto the scheme background/foreground tokens: text color moved
   from the hardcoded var(--espresso) #2a241e to var(--foreground) #0a0a0a
   (scheme-default resolves --foreground to the theme's actual black, not the
   softer espresso literal the old rule used) — intentional; the espresso
   *scheme* cannot repaint this section otherwise. */
.atelier-feature__content { padding: 3rem 1.5rem; display: flex; flex-direction: column; justify-content: center; background: var(--background, #f8f4ed); color: var(--foreground, #2a241e); }
.atelier-feature__eyebrow { font-family: var(--font-sans); font-size: 0.6875rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--rose-gold, #b89478); margin: 0 0 1rem; }
.atelier-feature__title { font-family: var(--font-serif); font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 500; margin: 0 0 1.25rem; line-height: 1.05; }
.atelier-feature__body { font-family: var(--font-sans); font-size: 1rem; line-height: 1.6; margin: 0 0 1.5rem; color: var(--mocha, #8b7355); max-width: 36rem; }
.atelier-feature__cta { font-family: var(--font-sans); font-size: 0.8125rem; font-weight: 500; color: var(--foreground, #2a241e); border-bottom: 1px solid currentColor; padding-bottom: 0.25rem; text-decoration: none; align-self: flex-start; }
.atelier-feature__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--cream-dark, #ebe2d3); }
.atelier-feature__stat-value { font-family: var(--font-serif); font-size: 2rem; font-weight: 500; line-height: 1; }
.atelier-feature__stat-label { margin-top: 0.5rem; font-family: var(--font-sans); font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--mocha, #8b7355); }

/* Featured journal section */
.featured-journal { padding: 4rem 0; }
.featured-journal__container { max-width: var(--page-max-width, 80rem); margin: 0 auto; padding: 0 1.5rem; }
.featured-journal__grid { display: grid; grid-template-columns: 1fr; gap: 2rem; margin-top: 2.5rem; }
@media (min-width: 768px) { .featured-journal__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.journal-card { display: flex; flex-direction: column; gap: 1.25rem; }
.journal-card__media-link { display: block; aspect-ratio: 1 / 1; overflow: hidden; }
.journal-card__media-link picture { width: 100%; height: 100%; }
.journal-card__image,
.journal-card__placeholder { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms ease; }
.journal-card:hover .journal-card__image { transform: scale(1.04); }
.journal-card__category { font-family: var(--font-sans); font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--rose-gold, #b89478); margin: 0; }
.journal-card__title { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 500; line-height: 1.2; margin: 0; }
.journal-card__title a { color: inherit; text-decoration: none; }
.journal-card__title a:hover { color: var(--rose-gold, #b89478); }
.journal-card__excerpt { font-family: var(--font-sans); font-size: 0.9375rem; line-height: 1.5; color: var(--mocha, #8b7355); margin: 0; }
.journal-card__continue { font-family: var(--font-sans); font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--foreground, #2a241e); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 0.25rem; align-self: flex-start; }

/* Instagram grid section */
.instagram-grid { padding: 4rem 0; }
.instagram-grid__container { max-width: var(--page-max-width, 80rem); margin: 0 auto; padding: 0 1.5rem; }
.instagram-grid__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; margin-top: 2.5rem; }
@media (min-width: 768px) {
  .instagram-grid__list--cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .instagram-grid__list--cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .instagram-grid__list--cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
.instagram-tile { aspect-ratio: 1 / 1; overflow: hidden; display: block; }
.instagram-tile picture { width: 100%; height: 100%; }
.instagram-tile__image,
.instagram-tile__placeholder { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms ease; }
.instagram-tile:hover .instagram-tile__image { transform: scale(1.05); }

/* Minimal responsive utilities — LC assets/theme.css is a placeholder
   without Tailwind compilation, so we ship explicit visibility breakpoints. */
.hidden { display: none !important; }
@media (min-width: 768px) {
  .md\:hidden { display: none !important; }
  .md\:flex { display: flex !important; }
  .md\:block { display: block !important; }
}

/* ── Product page (2-col gallery + meta layout) ───────────────────────────── */

.lc-product-layout {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem var(--space-container);
}

.lc-product-layout__columns {
  display: grid;
  grid-template-columns: minmax(0, 55fr) minmax(0, 45fr);
  gap: 3rem;
  align-items: start;
  margin-bottom: 4rem;
}

.lc-product-layout__col-left {
  position: sticky;
  top: 1.5rem;
}

.lc-product-layout__col-right {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

/* The gap owns the spacing between right-column blocks; the per-section 0.5rem
   padding would double it (an inline padding_top/bottom from the customizer
   still wins over this). */
.lc-product-layout__col-right [data-section-id] {
  padding-top: 0;
  padding-bottom: 0;
}

.lc-product-title__heading {
  margin: 0 0 0.75rem;
}

.lc-product-title__rule {
  margin: 0;
}

@media (max-width: 768px) {
  .lc-product-layout__columns {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .lc-product-layout__col-right {
    gap: 0.75rem;
  }

  .lc-product-title__heading {
    margin-bottom: 0.5rem;
  }

  /* Sticky is meaningless once the columns stack, and can overlap the
     announcement bar above the header — turn it off in the narrow layout. */
  .lc-product-layout__col-left {
    position: static;
    top: auto;
  }
}

/* ── Iter2 patch fixes ──────────────────────────────────────────────────────── */

/* LC1 — product card: no chrome (transparent bg, no border) */
.lc-product-card { background: transparent; border: none; box-shadow: none; }

/*
 * `partials/product-card.twig` is included, un-shielded, by four live banded
 * sections (`related-products`, `category-grid`, `featured-products`,
 * `recently-viewed`).
 * The card has no background of its own (LC1 above), so its title/price text
 * sits directly on whichever section's scheme band it's rendered inside; the
 * previous hardcoded `color: var(--color-black, #1a1a1a)`/`#999` went
 * dark-on-dark under scheme-espresso in those sections (2026-08-03
 * remediation — see `.superpowers/sdd/final-review-fixes.md` § "Detector pass").
 * `.product-card__price-compare`'s dimmer `opacity` (rather than a lighter
 * literal colour) preserves its "muted/secondary" relationship to the
 * current-price text across both schemes.
 */
.product-card__title,
.lc-product-card__title,
.product-card__price-current {
  color: var(--foreground, #1a1a1a);
}
.product-card__price-compare {
  color: var(--foreground, #999);
  opacity: 0.65;
}

/* LC3 — featured-products: controlled spacing via classes */
.lc-featured-products { padding: 5rem 0; }
.lc-featured-products .section-header,
.lc-featured-products__grid,
.lc-featured-products .lc-grid--cards { max-width: var(--page-max-width, 80rem); margin: 0 auto; padding: 0 1.5rem; }

/* LC4 — atelier content column: generous interior padding */
.atelier-feature__content { padding: 4rem 5rem 4rem 4rem !important; }

/* LC8 — testimonials grid: breathing room below section header */
.testimonials__grid { margin-top: 3rem; }

/* LC10 — announcement bar: tighter letter-spacing (bg now scheme-driven, see .header-announcement-bar above) */
.header-announcement-bar {
  letter-spacing: 0.04em !important;
}

/* LC12 — footer link columns: nav links (overridden by .lc-footer__columns rules above; kept for specificity safety) */
.lc-footer-columns .footer-col nav ul { list-style: none; margin: 0; padding: 0; }
.lc-footer-columns .footer-col nav a { color: var(--foreground, #ebe2d3); text-decoration: none; transition: color 0.2s var(--ease, ease); }
.lc-footer-columns .footer-col nav a:hover { color: var(--rose-gold, #b89478); }
.lc-footer-columns .footer-col__heading { font-family: var(--font-sans, sans-serif); font-size: 11px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--mocha, #8b7355); margin: 0 0 20px; padding: 0; border: none; }

/* LC9 — footer brand wordmark colour */
.footer-col--brand-recap .footer-brand-wordmark { color: var(--foreground, #fefcf8); }

/* Footer contact block — email/phone from Settings → Store details */
.footer-col--contact { display: flex; flex-direction: column; }
.footer-col__contact-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-col__contact-link { font-family: var(--font-sans, sans-serif); font-size: 13px; letter-spacing: 0.02em; color: var(--foreground, #fefcf8); text-decoration: none; opacity: 0.75; transition: opacity 160ms ease; }
.footer-col__contact-link:hover,
.footer-col__contact-link:focus-visible { opacity: 1; text-decoration: underline; }

/* ── Iter5 pixel-perfect fixes ─────────────────────────────────────────────── */

/* LC-iter5-1: Hero height — prototype shows ~65-70vh tall hero, was capped at 580px */
.lc-hero { min-height: clamp(520px, 68vh, 760px) !important; }

/* LC-iter5-2: Featured-products — more breathing room between heading and product grid */
.lc-featured-products .lc-grid--cards,
.lc-featured-products__grid { margin-top: 3.5rem; }

/* Featured-products — schema-driven layout/columns/card-style modifiers.
   The schema declares Columns (1-6), Layout (grid|carousel|spotlight),
   Card style (compact|standard|detailed). These rules wire those settings
   to visible CSS so picking them in the customizer changes the rendering. */
.lc-featured-products .lc-grid--cards {
  grid-template-columns: repeat(var(--featured-cols, 4), minmax(0, 1fr));
}
@media (max-width: 767px) {
  .lc-featured-products .lc-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.lc-featured-products.featured-products--carousel .lc-grid--cards {
  display: flex;
  grid-template-columns: none;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  padding-bottom: 1rem;
}
.lc-featured-products.featured-products--carousel .lc-grid--cards > * {
  flex: 0 0 calc((100% - (var(--featured-cols, 3) - 1) * 2rem) / var(--featured-cols, 3));
  min-width: 240px;
  scroll-snap-align: start;
}

.lc-featured-products.featured-products--spotlight .lc-grid--cards > :first-child {
  grid-column: span 2;
}
.lc-featured-products.featured-products--spotlight .lc-grid--cards > :first-child .lc-product-card__image-link {
  aspect-ratio: 16 / 10;
}

.lc-featured-products.featured-products--compact .lc-grid--cards { gap: 1.25rem; }
.lc-featured-products.featured-products--compact .lc-product-card__body { padding-top: 0.5rem; gap: 0.25rem; }
.lc-featured-products.featured-products--compact .lc-product-card__title { font-size: 0.875rem; }
.lc-featured-products.featured-products--compact .lc-product-card__image-link { aspect-ratio: 3 / 4; }

.lc-featured-products.featured-products--detailed .lc-grid--cards { gap: 2.5rem; }
.lc-featured-products.featured-products--detailed .lc-product-card__body { padding-top: 1rem; gap: 0.625rem; }
.lc-featured-products.featured-products--detailed .lc-product-card__title { font-size: 1.125rem; line-height: 1.4; }
.lc-featured-products.featured-products--detailed .lc-product-card__image-link { aspect-ratio: 4 / 5; }

/* LC-iter5-3: Product card image placeholder — cream-dark bg instead of transparent white */
.lc-product-card .product-card__image-placeholder,
.lc-product-card .tile-placeholder,
.lc-product-card__placeholder { background: var(--cream-dark, #ebe2d3); }

/* LC-iter5-4: Testimonials — larger editorial italic quotes to match prototype ~2.25rem */
.lc-testimonials .testimonial-card__quote { font-size: 2rem; line-height: 1.3; }

/* LC-iter5-5: Newsletter section — more generous padding to match prototype 7rem rhythm */
.newsletter.lc-newsletter { padding: 7rem 0; }
@media (max-width: 640px) {
  .newsletter.lc-newsletter { padding: 4rem var(--space-container, 1.5rem); }
  .lc-newsletter .newsletter__form { flex-direction: column; gap: 0.75rem; max-width: none; }
  .lc-newsletter .newsletter__form .newsletter__input {
    flex: none;
    width: 100%;
    border-right: 1px solid var(--color-gold, #c9a96e);
  }
  .lc-newsletter .newsletter__form .newsletter__input,
  .lc-newsletter .newsletter__form .newsletter__submit { box-sizing: border-box; min-height: 3rem; }
  .lc-newsletter .newsletter__form .newsletter__submit { flex: none; width: 100%; }
}

/* Task 27 (M19): product-card layout moved verbatim from inline style="" in
   partials/product-card.twig. The selectors stay scoped to .lc-product-card
   and this block stays after the card-style variant rules above, so these
   declarations win exactly where the inline styles won: the compact /
   detailed / spotlight variant aspect-ratio, padding, gap and title-size
   rules above remain dormant, as they were under the inline styles.
   Reviving them is a separate visual decision — see the task report.
   The spotlight first-child rule below re-asserts the 1/1 the inline style
   enforced, for the same reason. */
.lc-product-card { display: flex; flex-direction: column; }
.lc-product-card .lc-product-card__image-link { display: block; position: relative; overflow: hidden; aspect-ratio: 1 / 1; background-color: var(--background, #f9f7f4); }
/* The responsive-image macro wraps the <img> in a <picture>; without a definite
   height the img's `height: 100%` resolves to auto, it renders at the photo's own
   ratio and the frame's overflow clips it from the bottom (top-anchored crop)
   instead of `object-fit: cover` cropping around the centre. */
.lc-product-card .lc-product-card__image-link picture { width: 100%; height: 100%; }
.lc-product-card .product-card__wishlist, .lc-product-card .lc-product-card__wishlist { position: absolute; top: 0.75rem; right: 0.75rem; background: transparent; border: none; cursor: pointer; padding: 0.25rem; line-height: 1; min-width: 2.75rem; min-height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; }
.lc-product-card .lc-product-card__body { padding: 0.75rem 0 0; flex: 1; display: flex; flex-direction: column; gap: 0.5rem; }
.lc-product-card .lc-product-card__title { font-family: var(--font-serif, serif); font-size: 1rem; font-weight: 400; letter-spacing: 0.02em; text-decoration: none; line-height: 1.3; }
.lc-product-card__price { display: flex; align-items: baseline; gap: 0.5rem; }
.lc-product-card .product-card__price-current { font-family: var(--font-sans, sans-serif); font-size: 0.9375rem; font-weight: 500; }
.lc-product-card .product-card__price-compare { font-family: var(--font-sans, sans-serif); font-size: 0.8125rem; text-decoration: line-through; }
.lc-featured-products.featured-products--spotlight .lc-grid--cards > :first-child .lc-product-card__image-link { aspect-ratio: 1 / 1; }

/* Footer-columns — column_count drives the inner grid width.
   The wrapper carries --footer-cols set inline; this rule consumes it. */
.lc-footer-columns [style*="--footer-cols"] .lc-footer__columns,
.lc-footer-columns [style*="--footer-cols"] .footer-columns__inner {
  grid-template-columns: repeat(var(--footer-cols, 4), minmax(0, 1fr));
}
/* Brand recap column gets a wider track (--footer-link-cols = remaining columns). */
@media (min-width: 1100px) {
  .lc-footer-columns .footer-columns--with-brand .footer-columns__inner {
    grid-template-columns: minmax(0, 1.6fr) repeat(var(--footer-link-cols, 3), minmax(0, 1fr));
  }
}
@media (max-width: 1099px) {
  .lc-footer-columns [style*="--footer-cols"] .footer-columns__inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lc-footer-columns .footer-col--brand-recap { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .lc-footer-columns [style*="--footer-cols"] .footer-columns__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Category-grid — apply per-breakpoint columns_md / columns_lg using the
   --cols-md / --cols-lg custom properties already emitted by the template. */
@media (min-width: 768px) {
  .lc-category-grid__products[style*="--cols-md"] {
    grid-template-columns: repeat(var(--cols-md, 4), minmax(0, 1fr));
  }
}
@media (min-width: 1280px) {
  .lc-category-grid__products[style*="--cols-lg"] {
    grid-template-columns: repeat(var(--cols-lg, 5), minmax(0, 1fr));
  }
}

/* ── Error pages (404 / 500 / generic) ────────────────────────────────────── */

.lc-error {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(480px, 60vh, 720px);
  padding: 6rem 1.5rem;
  background: var(--warm-white, #fefcf8);
}

.lc-error__content {
  max-width: 560px;
  width: 100%;
  text-align: center;
}

.lc-error__status {
  font-family: var(--font-serif, 'Cormorant Garamond', serif);
  font-size: clamp(5rem, 12vw, 9rem);
  line-height: 1;
  font-weight: 300;
  letter-spacing: -0.02em;
  color: var(--rose-gold, #b89478);
  margin: 0 0 1rem;
}

.lc-error__heading {
  font-family: var(--font-serif, 'Cormorant Garamond', serif);
  font-size: clamp(2rem, 4vw, 2.75rem);
  line-height: 1.2;
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--espresso, #2a241e);
  margin: 0 0 1rem;
}

.lc-error__message {
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--mocha, #8b7355);
  margin: 0 0 2.5rem;
}

.lc-error__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.lc-error__home-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border: 1.5px solid var(--espresso, #2a241e);
  background: var(--espresso, #2a241e);
  color: var(--cream, #f8f4ed);
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.875rem 1.75rem;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.lc-error__home-link:hover {
  background: var(--rose-gold, #b89478);
  border-color: var(--rose-gold, #b89478);
  color: var(--warm-white, #fefcf8);
}

/* Wishlist heart toggle — filled vs outline state. */
.product-card__wishlist svg,
.lc-product-card__wishlist svg {
  fill: none;
  stroke: var(--color-black, #1a1a1a);
  transition: fill 180ms ease-out, stroke 180ms ease-out, transform 180ms ease-out;
}

.product-card__wishlist[data-wishlisted="true"] svg,
.lc-product-card__wishlist[data-wishlisted="true"] svg {
  fill: var(--rose-gold, #b89478);
  stroke: var(--rose-gold, #b89478);
}

.product-card__wishlist:hover svg,
.lc-product-card__wishlist:hover svg {
  transform: scale(1.08);
}

.product-card__wishlist.is-toggling svg,
.lc-product-card__wishlist.is-toggling svg {
  opacity: 0.5;
}

/* ── Account pages (shared layout: sidebar + main) ─────────────────────────── */

.lc-account {
  max-width: 72rem;
  margin: 0 auto;
  padding: 3rem 1.5rem 5rem;
}

.lc-account__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}

@media (min-width: 768px) {
  .lc-account__layout {
    grid-template-columns: 16rem minmax(0, 1fr);
    gap: 3rem;
  }
}

.lc-account__layout--guest {
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {
  .lc-account__layout--guest {
    grid-template-columns: minmax(0, 1fr);
    max-width: 56rem;
    margin-inline: auto;
  }
}

.lc-account__sidebar {
  position: relative;
}

@media (min-width: 768px) {
  .lc-account__sidebar {
    position: sticky;
    top: 6rem;
    align-self: start;
  }
}

.lc-account__main {
  min-width: 0;
}

.lc-account__heading {
  margin: 0 0 1.75rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: clamp(1.875rem, 3vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--espresso, #2a241e);
  line-height: 1.1;
}

.lc-account__flash {
  margin: 0 0 1.5rem;
  padding: 0.875rem 1.125rem;
  border-radius: var(--radius);
  font-size: 0.9375rem;
  line-height: 1.4;
}

.lc-account__flash--success {
  background: rgba(184, 148, 120, 0.12);
  border: 1px solid var(--rose-gold, #b89478);
  color: var(--espresso, #2a241e);
}

.lc-account__flash--error {
  background: rgba(180, 55, 55, 0.08);
  border: 1px solid #b43737;
  color: #7a2222;
}

.lc-account__empty {
  padding: 3rem 1.5rem;
  text-align: center;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

.lc-account__empty p {
  margin: 0;
  color: var(--espresso, #2a241e);
  opacity: 0.75;
  font-size: 1rem;
}

/* ── Account sidebar nav ──────────────────────────────────────────────────── */

.lc-account-sidebar {
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  padding: 0.75rem;
}

.lc-account-sidebar__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.lc-account-sidebar__item {
  margin: 0;
}

.lc-account-sidebar__link {
  display: block;
  padding: 0.625rem 0.875rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  text-decoration: none;
  border-left: 3px solid transparent;
  border-radius: var(--radius);
  transition: background 150ms var(--ease, ease), color 150ms var(--ease, ease), border-color 150ms var(--ease, ease);
}

.lc-account-sidebar__link:hover {
  background: rgba(184, 148, 120, 0.08);
  color: var(--espresso, #2a241e);
}

.lc-account-sidebar__link--active {
  background: rgba(184, 148, 120, 0.12);
  border-left-color: var(--rose-gold, #b89478);
  color: var(--espresso, #2a241e);
  font-weight: 500;
}

.lc-account-sidebar__item--logout {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(42, 36, 30, 0.08);
}

.lc-account-sidebar__item--logout form {
  margin: 0;
}

.lc-account-sidebar__logout-btn {
  width: 100%;
  text-align: left;
  display: block;
  padding: 0.625rem 0.875rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  background: transparent;
  border: none;
  border-left: 3px solid transparent;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background 150ms var(--ease, ease), color 150ms var(--ease, ease);
}

.lc-account-sidebar__logout-btn:hover {
  background: rgba(184, 148, 120, 0.08);
  color: var(--espresso, #2a241e);
}

/* ── Wishlist grid + cards ────────────────────────────────────────────────── */

.lc-wishlist-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .lc-wishlist-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .lc-wishlist-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
  }
}

.lc-wishlist-card {
  display: flex;
  flex-direction: column;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  overflow: hidden;
  transition: border-color 200ms var(--ease, ease), transform 200ms var(--ease, ease);
}

.lc-wishlist-card:hover {
  border-color: rgba(184, 148, 120, 0.4);
}

.lc-wishlist-card__image-link {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--color-cream, #f7f1e6);
}

.lc-wishlist-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 400ms var(--ease, ease);
}

.lc-wishlist-card__image-link:hover .lc-wishlist-card__image {
  transform: scale(1.04);
}

.lc-wishlist-card__body {
  padding: 1rem 1.125rem 0.75rem;
  flex: 1;
}

.lc-wishlist-card__name {
  display: block;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.25;
  color: var(--espresso, #2a241e);
  text-decoration: none;
  letter-spacing: -0.005em;
}

.lc-wishlist-card__name:hover {
  color: var(--rose-gold, #b89478);
}

.lc-wishlist-card__price {
  margin: 0.5rem 0 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-wishlist-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0 1.125rem 1.125rem;
}

.lc-wishlist-card__add-form,
.lc-wishlist-card__remove-form {
  margin: 0;
}

.lc-wishlist-card__add-form {
  flex: 1 1 auto;
}

.lc-wishlist-card__add-form .lc-btn {
  width: 100%;
}

/* ── Blog (index, category, post, sidebar, cards) ─────────────────────────── */

.lc-blog {
  max-width: var(--page-max-width, 80rem);
  margin: 0 auto;
  padding: 3rem 1.5rem 5rem;
}

.lc-blog__header {
  margin-bottom: 2.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-blog__breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mocha, #6b574a);
}

.lc-blog__breadcrumb-link {
  color: var(--mocha, #6b574a);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog__breadcrumb-link:hover {
  color: var(--rose-gold, #b89478);
}

.lc-blog__breadcrumb-sep {
  color: rgba(42, 36, 30, 0.35);
}

.lc-blog__breadcrumb-current {
  color: var(--espresso, #2a241e);
}

.lc-blog__heading {
  margin: 0;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--espresso, #2a241e);
  line-height: 1.1;
}

.lc-blog__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}

@media (min-width: 901px) {
  .lc-blog__layout {
    grid-template-columns: 16rem minmax(0, 1fr);
    gap: 3rem;
  }
}

.lc-blog__main {
  min-width: 0;
}

.lc-blog__empty {
  margin: 0;
  padding: 3rem 1.5rem;
  text-align: center;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--mocha, #6b574a);
  background: var(--cream, #f8f4ed);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

.lc-blog__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 640px) {
  .lc-blog__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .lc-blog__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Sidebar */

.lc-blog__sidebar {
  position: relative;
}

@media (min-width: 901px) {
  .lc-blog__sidebar {
    position: sticky;
    top: calc(var(--site-header-height, 11rem) + 1rem);
    align-self: start;
  }
}

.lc-blog__sidebar-block {
  margin: 0 0 2rem;
  padding: 0 0 1.5rem;
  border-bottom: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-blog__sidebar-block:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.lc-blog__sidebar-heading {
  margin: 0 0 1rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--espresso, #2a241e);
}

.lc-blog__categories {
  margin: 0;
}

.lc-blog__category-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lc-blog__category-item {
  margin: 0;
}

.lc-blog__category-link {
  display: inline-flex;
  align-items: baseline;
  gap: 0.4rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog__category-link:hover {
  color: var(--rose-gold, #b89478);
}

.lc-blog__category-link--active {
  color: var(--rose-gold, #b89478);
  font-weight: 500;
}

.lc-blog__category-count {
  font-size: 0.8125rem;
  color: var(--mocha, #6b574a);
}

.lc-blog__recent-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.lc-blog__recent-item {
  margin: 0;
}

.lc-blog__recent-link {
  display: grid;
  grid-template-columns: 4rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  text-decoration: none;
  color: var(--espresso, #2a241e);
  transition: color 0.2s ease;
}

.lc-blog__recent-link:hover {
  color: var(--rose-gold, #b89478);
}

.lc-blog__recent-img {
  width: 4rem;
  height: 4rem;
  object-fit: cover;
  border-radius: var(--radius);
  background: var(--cream-dark, #ebe2d3);
}

.lc-blog__recent-title {
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Pagination */

.lc-blog__pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 3rem 0 0;
  padding: 1.5rem 0 0;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-blog__pagination-link {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--espresso, #2a241e);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog__pagination-link:hover {
  color: var(--rose-gold, #b89478);
}

.lc-blog__pagination-link--prev {
  margin-right: auto;
}

.lc-blog__pagination-link--next {
  margin-left: auto;
}

.lc-blog__pagination-info {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  color: var(--mocha, #6b574a);
}

/* Blog post card */

.lc-blog-card {
  display: flex;
  flex-direction: column;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  overflow: hidden;
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.lc-blog-card:hover {
  border-color: rgba(184, 148, 120, 0.5);
}

.lc-blog-card__image-link {
  display: block;
  overflow: hidden;
  background: var(--cream-dark, #ebe2d3);
}

.lc-blog-card__image-wrap {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.lc-blog-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.lc-blog-card:hover .lc-blog-card__img {
  transform: scale(1.04);
}

.lc-blog-card__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 1.25rem 1.25rem 1.5rem;
}

.lc-blog-card__category {
  display: inline-block;
  align-self: flex-start;
  margin: 0 0 0.625rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rose-gold, #b89478);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog-card__category:hover {
  color: var(--espresso, #2a241e);
}

.lc-blog-card__title {
  margin: 0 0 0.625rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.375rem;
  font-weight: 500;
  letter-spacing: -0.005em;
  line-height: 1.2;
}

.lc-blog-card__title-link {
  color: var(--espresso, #2a241e);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog-card__title-link:hover {
  color: var(--rose-gold, #b89478);
}

.lc-blog-card__excerpt {
  margin: 0 0 1rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--mocha, #6b574a);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.lc-blog-card__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: auto;
  padding-top: 0.875rem;
  border-top: 1px solid rgba(42, 36, 30, 0.08);
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-blog-card__date {
  text-transform: uppercase;
}

.lc-blog-card__author {
  color: var(--mocha, #6b574a);
}

.lc-blog-card__read-more {
  margin-left: auto;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--espresso, #2a241e);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog-card__read-more:hover {
  color: var(--rose-gold, #b89478);
}

/* Static pages: same column and rich-text typography as the blog post
   (body selectors are shared with .lc-blog-post__article above). */
.lc-static-page {
  background: var(--cream, transparent);
}

.lc-static-page__content {
  max-width: 48rem;
  margin: 0 auto;
  padding: 3rem var(--space-container, 1.5rem) 5rem;
}

.lc-static-page__hero {
  max-width: 48rem;
  margin: 0 auto;
  padding: 3rem var(--space-container, 1.5rem) 0;
}

.lc-static-page__hero + .lc-static-page__content {
  padding-top: 2rem;
}

.lc-static-page__hero-img {
  display: block;
  width: 100%;
  max-height: 24rem;
  object-fit: cover;
  border-radius: var(--radius);
}

.lc-static-page__title {
  margin: 0 0 1.25rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: clamp(2rem, 4.5vw, 3.25rem);
  font-weight: 500;
  letter-spacing: -0.015em;
  color: var(--espresso, #2a241e);
  line-height: 1.1;
}

.lc-static-page__meta {
  margin: 0 0 2rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mocha, #6b574a);
}

.lc-static-page__body table {
  width: 100%;
  margin: 0 0 1.25rem;
  border-collapse: collapse;
  font-size: 0.9375rem;
}

.lc-static-page__body :where(th, td) {
  padding: 0.5rem 0.75rem;
  border: 1px solid rgba(42, 36, 30, 0.12);
  text-align: left;
}

/* Single blog post */

.lc-blog-post {
  max-width: 48rem;
  margin: 0 auto;
  padding: 3rem 1.5rem 5rem;
}

.lc-blog-post__header {
  margin-bottom: 2rem;
}

.lc-blog-post__breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 1.25rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mocha, #6b574a);
}

.lc-blog-post__breadcrumb-link {
  color: var(--mocha, #6b574a);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog-post__breadcrumb-link:hover {
  color: var(--rose-gold, #b89478);
}

.lc-blog-post__breadcrumb-sep {
  color: rgba(42, 36, 30, 0.35);
}

.lc-blog-post__breadcrumb-current {
  color: var(--espresso, #2a241e);
}

.lc-blog-post__title {
  margin: 0 0 1.25rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: clamp(2rem, 4.5vw, 3.25rem);
  font-weight: 500;
  letter-spacing: -0.015em;
  color: var(--espresso, #2a241e);
  line-height: 1.1;
}

.lc-blog-post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin: 0 0 0.5rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-blog-post__date {
  text-transform: uppercase;
}

.lc-blog-byline {
  display: inline-flex;
  align-items: baseline;
  gap: 0.35rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  color: var(--mocha, #6b574a);
}

.lc-blog-byline__label {
  letter-spacing: 0.04em;
}

.lc-blog-byline__name {
  color: var(--espresso, #2a241e);
  font-weight: 500;
}

.lc-blog-post__featured-image {
  margin: 0 0 2rem;
  background: var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  overflow: hidden;
}

.lc-blog-post__img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.lc-blog-post__excerpt {
  margin: 0 0 2rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-style: italic;
  font-size: 1.25rem;
  line-height: 1.5;
  color: var(--mocha, #6b574a);
}

.lc-static-page__body > :where(p, ul, ol, blockquote, h2, h3, h4, figure, img),
.lc-blog-post__article > :where(p, ul, ol, blockquote, h2, h3, h4, figure, img) {
  font-family: var(--font-body, sans-serif);
  color: var(--espresso, #2a241e);
}

.lc-static-page__body p,
.lc-blog-post__article p {
  margin: 0 0 1.25rem;
  font-size: 1rem;
  line-height: 1.7;
}

.lc-static-page__body h2,
.lc-blog-post__article h2 {
  margin: 2.5rem 0 1rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.875rem;
  font-weight: 500;
  letter-spacing: -0.005em;
  line-height: 1.2;
}

.lc-static-page__body h3,
.lc-blog-post__article h3 {
  margin: 2rem 0 0.875rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.25;
}

.lc-static-page__body ul,
.lc-blog-post__article ul,
.lc-static-page__body ol,
.lc-blog-post__article ol {
  margin: 0 0 1.25rem 1.5rem;
  padding: 0;
}

.lc-static-page__body li,
.lc-blog-post__article li {
  margin: 0 0 0.5rem;
  line-height: 1.6;
}

.lc-static-page__body blockquote,
.lc-blog-post__article blockquote {
  margin: 1.75rem 0;
  padding: 0.5rem 0 0.5rem 1.25rem;
  border-left: 3px solid var(--rose-gold, #b89478);
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-style: italic;
  font-size: 1.25rem;
  line-height: 1.5;
  color: var(--mocha, #6b574a);
}

.lc-static-page__body img,
.lc-blog-post__article img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius);
}

.lc-static-page__body a,
.lc-blog-post__article a {
  color: var(--rose-gold, #b89478);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  transition: color 0.2s ease;
}

.lc-static-page__body a:hover,
.lc-blog-post__article a:hover {
  color: var(--espresso, #2a241e);
}

.lc-blog-post__footer {
  margin: 3rem 0 0;
  padding: 1.5rem 0 0;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-blog-post__back-link {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--espresso, #2a241e);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-blog-post__back-link:hover {
  color: var(--rose-gold, #b89478);
}

.lc-blog-post__related {
  margin: 4rem 0 0;
  padding: 2.5rem 0 0;
  border-top: 1px solid rgba(42, 36, 30, 0.1);
}

.lc-blog-post__related-heading {
  margin: 0 0 1.5rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: -0.005em;
  color: var(--espresso, #2a241e);
}

.lc-blog-post__related .lc-blog__grid {
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .lc-blog-post__related .lc-blog__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ── Account: shared button variants ──────────────────────────────────────── */

.lc-btn--secondary {
  background: var(--cream-dark, #ebe2d3);
  color: var(--espresso, #2a241e);
  border: 1px solid rgba(42, 36, 30, 0.12);
}

.lc-btn--secondary:hover {
  background: var(--cream, #f8f4ed);
  border-color: rgba(42, 36, 30, 0.2);
}

.lc-btn--outline {
  background: var(--warm-white, #fefcf8);
  color: var(--espresso, #2a241e);
  border: 1px solid rgba(42, 36, 30, 0.18);
}

.lc-btn--outline:hover {
  background: var(--cream, #f8f4ed);
  border-color: var(--espresso, #2a241e);
}

.lc-btn--danger {
  background: #b43737;
  color: #fff;
  border: 1px solid #b43737;
}

.lc-btn--danger:hover {
  background: #9a2c2c;
  border-color: #9a2c2c;
}

.lc-btn--danger-outline {
  background: transparent;
  color: #b43737;
  border: 1px solid rgba(180, 55, 55, 0.45);
}

.lc-btn--danger-outline:hover {
  background: rgba(180, 55, 55, 0.08);
  border-color: #b43737;
}

/* ── Account: section + heading helpers ───────────────────────────────────── */

.lc-account__heading-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.75rem;
}

.lc-account__heading-row .lc-account__heading {
  margin: 0;
}

.lc-account__description {
  margin: -0.75rem 0 1.75rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--mocha, #6b574a);
}

.lc-account__back-link {
  margin: 0 0 1.25rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.lc-account__back-link a {
  color: var(--mocha, #6b574a);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lc-account__back-link a:hover {
  color: var(--rose-gold, #b89478);
}

.lc-account__section {
  margin: 2.5rem 0 0;
  padding: 0;
}

.lc-account__section--bordered {
  margin-top: 2.5rem;
  padding: 1.75rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

.lc-account__section--danger {
  margin-top: 3rem;
  padding: 1.75rem;
  background: rgba(180, 55, 55, 0.04);
  border: 1px solid rgba(180, 55, 55, 0.25);
  border-radius: var(--radius);
}

.lc-account__subheading {
  margin: 0 0 1rem;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: -0.005em;
  color: var(--espresso, #2a241e);
  line-height: 1.2;
}

.lc-account__subheading--sm {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-family: var(--font-body, sans-serif);
  color: var(--espresso, #2a241e);
  margin: 0 0 0.625rem;
}

.lc-account__subheading--danger {
  color: #b43737;
}

.lc-account__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1.5rem 0 0;
}

/* Flash variants we don't already have */

.lc-account__flash--info {
  background: rgba(42, 90, 130, 0.08);
  border: 1px solid rgba(42, 90, 130, 0.35);
  color: #1f3a55;
}

.lc-account__flash--warning {
  background: rgba(180, 130, 30, 0.1);
  border: 1px solid rgba(180, 130, 30, 0.4);
  color: #6e4c0a;
}

/* ── Account: forms ───────────────────────────────────────────────────────── */

.lc-account__form {
  margin: 0;
}

.lc-account__form--password {
  margin-top: 0;
}

.lc-account__form-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem 1.25rem;
}

@media (min-width: 640px) {
  .lc-account__form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.lc-account__field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin: 0 0 1.125rem;
}

.lc-account__form-grid .lc-account__field {
  margin: 0;
}

.lc-account__field--full {
  grid-column: 1 / -1;
}

.lc-account__field--checkbox {
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
}

.lc-account__field--checkbox label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  cursor: pointer;
}

.lc-account__field--checkbox input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  accent-color: var(--rose-gold, #b89478);
}

.lc-account__label {
  display: block;
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mocha, #6b574a);
}

.lc-account__input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.6875rem 0.875rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.18);
  border-radius: var(--radius);
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.lc-account__input:focus {
  outline: none;
  border-color: var(--rose-gold, #b89478);
  box-shadow: 0 0 0 3px rgba(184, 148, 120, 0.15);
}

.lc-account__input--error {
  border-color: #b43737;
}

.lc-account__input--error:focus {
  border-color: #b43737;
  box-shadow: 0 0 0 3px rgba(180, 55, 55, 0.15);
}

.lc-account__error {
  display: block;
  margin-top: 0.25rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  color: #b43737;
}

.lc-account__form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1.5rem 0 0;
  padding-top: 0;
}

/* Generic .lc-form__* primitives (used by some auth/sub pages) */

.lc-form__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.125rem 1.25rem;
  margin: 0 0 1.125rem;
}

@media (min-width: 640px) {
  .lc-form__row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.lc-form__group {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin: 0 0 1.125rem;
}

.lc-form__row .lc-form__group {
  margin: 0;
}

.lc-form__label {
  display: block;
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mocha, #6b574a);
}

.lc-form__input {
  width: 100%;
  padding: 0.6875rem 0.875rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.18);
  border-radius: var(--radius);
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.lc-form__input:focus {
  outline: none;
  border-color: var(--rose-gold, #b89478);
  box-shadow: 0 0 0 3px rgba(184, 148, 120, 0.15);
}

.lc-form__input--error {
  border-color: #b43737;
}

.lc-form__input--textarea {
  min-height: 7rem;
  resize: vertical;
  line-height: 1.5;
}

.lc-form__input--file {
  padding: 0.5rem;
  background: var(--cream, #f8f4ed);
  font-size: 0.875rem;
}

.lc-form__error {
  display: block;
  margin-top: 0.25rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  color: #b43737;
}

/* ── Account: data cards ──────────────────────────────────────────────────── */

.lc-account__card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.25rem 1.5rem;
  background: var(--warm-white, #fefcf8);
  border-radius: var(--radius);
  margin: 0 0 1rem;
}

.lc-account__card--bordered {
  border: 1px solid rgba(42, 36, 30, 0.08);
}

.lc-account__card-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.25rem;
}

.lc-account__card-label {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

/* ── Address cards ────────────────────────────────────────────────────────── */

.lc-account__addresses {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 768px) {
  .lc-account__addresses {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.lc-address-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  transition: border-color 0.2s ease;
}

.lc-address-card:hover {
  border-color: rgba(184, 148, 120, 0.4);
}

.lc-address-card--default {
  border-color: var(--rose-gold, #b89478);
  box-shadow: 0 0 0 1px rgba(184, 148, 120, 0.25);
}

.lc-address-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lc-address-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.25rem;
}

.lc-address-card__badge {
  display: inline-block;
  align-self: flex-start;
  padding: 0.2rem 0.55rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--warm-white, #fefcf8);
  background: var(--rose-gold, #b89478);
  border-radius: var(--radius-pill);
}

.lc-address-card__badge--type {
  color: var(--mocha, #6b574a);
  background: transparent;
  border: 1px solid rgba(107, 87, 74, 0.35);
}

.lc-address-card__name {
  margin: 0;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-address-card__address {
  font-style: normal;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--mocha, #6b574a);
}

.lc-address-card__phone {
  margin: 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  color: var(--mocha, #6b574a);
}

.lc-address-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: auto;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(42, 36, 30, 0.06);
}

.lc-address-card__actions form {
  margin: 0;
}

.lc-address-card__edit-form {
  width: 100%;
  margin-top: 0.75rem;
  padding: 1.25rem;
  background: var(--cream, #f8f4ed);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  box-sizing: border-box;
}

.lc-address-card__edit-form[hidden] {
  display: none;
}

.lc-account__add-address {
  margin: 0;
}

.lc-account__add-address > summary {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  list-style: none;
}

.lc-account__add-address > summary::-webkit-details-marker {
  display: none;
}

.lc-account__add-form {
  margin-top: 1.25rem;
  padding: 1.5rem;
  background: var(--cream, #f8f4ed);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

.lc-account__add-form > form {
  display: grid;
  gap: 1.5rem 1.25rem;
}

/* ── Order list + detail ──────────────────────────────────────────────────── */

.lc-account__orders {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.lc-order-card {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  padding: 1.25rem 1.5rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  transition: border-color 0.2s ease;
}

.lc-order-card:hover {
  border-color: rgba(184, 148, 120, 0.4);
}

.lc-order-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.lc-order-card__meta {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.lc-order-card__number {
  font-family: var(--font-body, sans-serif);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--espresso, #2a241e);
}

.lc-order-card__date {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-order-card__status {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.65rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #fff;
  background: var(--mocha, #6b574a);
  border-radius: var(--radius-pill);
  white-space: nowrap;
}

.lc-order-card__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding-top: 0.875rem;
  border-top: 1px solid rgba(42, 36, 30, 0.06);
}

.lc-order-card__total {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
}

.lc-order-card__total-label {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-order-card__total-value {
  font-family: var(--font-body, sans-serif);
  font-size: 1rem;
  font-weight: 600;
  color: var(--espresso, #2a241e);
}

/* Order detail */

.lc-order-detail__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
}

.lc-order-detail__header .lc-account__heading {
  margin: 0;
}

.lc-order-detail__date {
  margin: 0.5rem 0 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-order-detail__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0 0 2rem;
}

.lc-order-detail__actions form {
  margin: 0;
}

.lc-order-detail__section {
  margin: 0 0 2rem;
}

.lc-order-detail__lines {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  overflow: hidden;
}

.lc-order-detail__lines thead th {
  padding: 0.75rem 0.875rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: left;
  color: var(--mocha, #6b574a);
  background: var(--cream, #f8f4ed);
  border-bottom: 1px solid rgba(42, 36, 30, 0.08);
}

.lc-order-detail__lines tbody td {
  padding: 0.875rem;
  border-bottom: 1px solid rgba(42, 36, 30, 0.06);
  vertical-align: middle;
  color: var(--espresso, #2a241e);
}

.lc-order-detail__lines tbody tr:last-child td {
  border-bottom: 0;
}

.lc-order-detail__line-name {
  display: flex;
  align-items: center;
  gap: 0.875rem;
}

.lc-order-detail__line-img {
  width: 3rem;
  height: 3rem;
  object-fit: cover;
  border-radius: var(--radius);
  background: var(--cream-dark, #ebe2d3);
}

.lc-order-detail__sku {
  display: inline-block;
  margin-left: 0.5rem;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-order-detail__variant-options {
  display: block;
  font-size: 0.8125rem;
  color: var(--mocha, #6b574a);
}

.lc-order-detail__totals {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 2rem;
}

.lc-order-detail__totals-list {
  width: 100%;
  max-width: 22rem;
  margin: 0;
  padding: 1rem 1.25rem;
  background: var(--cream, #f8f4ed);
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.lc-order-detail__total-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
}

.lc-order-detail__total-row dt,
.lc-order-detail__total-row dd {
  margin: 0;
}

.lc-order-detail__total-row--grand {
  margin-top: 0.4rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(42, 36, 30, 0.12);
  font-size: 1.0625rem;
}

.lc-order-detail__addresses {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 640px) {
  .lc-order-detail__addresses {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.lc-order-detail__address {
  padding: 1.25rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

.lc-order-detail__address address {
  font-style: normal;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--mocha, #6b574a);
}

/* ── Pagination (account context) ─────────────────────────────────────────── */

.lc-account__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin: 1.75rem 0 0;
  padding: 1rem 0 0;
  border-top: 1px solid rgba(42, 36, 30, 0.08);
}

.lc-account__page-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.625rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.18);
  border-radius: var(--radius);
  text-decoration: none;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.lc-account__page-btn:hover {
  border-color: var(--espresso, #2a241e);
  background: var(--cream, #f8f4ed);
}

.lc-account__page-info {
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

/* ── Account: tables (points, etc.) ───────────────────────────────────────── */

.lc-account__table-wrapper {
  overflow-x: auto;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

.lc-account__table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
}

.lc-account__table thead th {
  padding: 0.75rem 0.875rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: left;
  color: var(--mocha, #6b574a);
  background: var(--cream, #f8f4ed);
  border-bottom: 1px solid rgba(42, 36, 30, 0.08);
}

.lc-account__table tbody td {
  padding: 0.75rem 0.875rem;
  border-bottom: 1px solid rgba(42, 36, 30, 0.06);
  vertical-align: middle;
  color: var(--espresso, #2a241e);
}

.lc-account__table tbody tr:last-child td {
  border-bottom: 0;
}

.lc-account__table-cell--right {
  text-align: right;
}

/* ── Reward points page ───────────────────────────────────────────────────── */

.lc-points-balance {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
  padding: 1.5rem 1.75rem;
  background: linear-gradient(135deg, var(--cream, #f8f4ed) 0%, rgba(184, 148, 120, 0.18) 100%);
  border: 1px solid rgba(184, 148, 120, 0.3);
  border-radius: var(--radius);
  margin: 0 0 1.5rem;
}

.lc-points-balance__label {
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mocha, #6b574a);
}

.lc-points-balance__amount {
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 500;
  color: var(--espresso, #2a241e);
  line-height: 1;
}

.lc-points-tier {
  gap: 0.65rem;
}

.lc-points-tier__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.25rem;
}

.lc-points-tier__label {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-points-tier__value {
  font-family: var(--font-body, sans-serif);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--espresso, #2a241e);
}

.lc-points-tier__note {
  margin: 0.25rem 0 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  color: var(--mocha, #6b574a);
}

.lc-points-tx__badge {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--espresso, #2a241e);
  background: var(--cream-dark, #ebe2d3);
  border-radius: var(--radius-pill);
}

.lc-points-tx__badge--earn,
.lc-points-tx__badge--earned,
.lc-points-tx__badge--credit {
  background: rgba(184, 148, 120, 0.22);
  color: var(--espresso, #2a241e);
}

.lc-points-tx__badge--redeem,
.lc-points-tx__badge--spent,
.lc-points-tx__badge--debit {
  background: rgba(180, 55, 55, 0.12);
  color: #7a2222;
}

.lc-points-tx__badge--expire,
.lc-points-tx__badge--expired {
  background: rgba(42, 36, 30, 0.1);
  color: var(--mocha, #6b574a);
}

.lc-points-tx__points {
  font-family: var(--font-body, sans-serif);
  font-weight: 600;
  color: var(--espresso, #2a241e);
}

.lc-points-tx__points--earn,
.lc-points-tx__points--earned,
.lc-points-tx__points--credit {
  color: #2f6d3a;
}

.lc-points-tx__points--redeem,
.lc-points-tx__points--spent,
.lc-points-tx__points--debit {
  color: #b43737;
}

.lc-points-tx__points--expire,
.lc-points-tx__points--expired {
  color: var(--mocha, #6b574a);
}

/* ── Subscriptions ────────────────────────────────────────────────────────── */

.lc-account__subscriptions {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.lc-subscription-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  transition: border-color 0.2s ease;
}

@media (min-width: 640px) {
  .lc-subscription-card {
    grid-template-columns: 4.5rem minmax(0, 1fr) auto;
    align-items: center;
  }
}

.lc-subscription-card:hover {
  border-color: rgba(184, 148, 120, 0.4);
}

.lc-subscription-card__image {
  width: 4.5rem;
  height: 4.5rem;
  object-fit: cover;
  border-radius: var(--radius);
  background: var(--cream-dark, #ebe2d3);
}

.lc-subscription-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
}

.lc-subscription-card__name {
  margin: 0;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-subscription-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  color: var(--mocha, #6b574a);
}

.lc-subscription-card__frequency {
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-subscription-card__next {
  letter-spacing: 0.02em;
}

.lc-subscription-card__price {
  font-weight: 600;
  color: var(--espresso, #2a241e);
}

.lc-subscription-card__info {
  display: contents;
}

.lc-subscription-card__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
  justify-content: flex-end;
}

.lc-subscription-card__status {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.65rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
}

.lc-subscription-card__status--active {
  background: rgba(47, 109, 58, 0.14);
  color: #1f5026;
}

.lc-subscription-card__status--paused {
  background: rgba(180, 130, 30, 0.16);
  color: #6e4c0a;
}

.lc-subscription-card__status--cancelled,
.lc-subscription-card__status--canceled {
  background: rgba(180, 55, 55, 0.14);
  color: #7a2222;
}

.lc-subscription-card__status--pending {
  background: var(--cream-dark, #ebe2d3);
  color: var(--mocha, #6b574a);
}

.lc-subscription-cancel {
  margin: 1.5rem 0 0;
  padding: 1.25rem;
  background: rgba(180, 55, 55, 0.05);
  border: 1px solid rgba(180, 55, 55, 0.25);
  border-radius: var(--radius);
}

.lc-subscription-cancel__warning {
  margin: 0 0 0.75rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: #7a2222;
}

.lc-subscription-cancel__confirm {
  margin: 0 0 1rem;
}

.lc-subscription-cancel__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
}

.lc-subscription-events {
  margin: 1rem 0 0;
}

.lc-subscription-events__row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1rem;
  align-items: baseline;
  padding: 0.625rem 0;
  border-bottom: 1px solid rgba(42, 36, 30, 0.06);
}

.lc-subscription-events__row:last-child {
  border-bottom: 0;
}

.lc-subscription-events__time {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: var(--mocha, #6b574a);
}

.lc-subscription-events__type {
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--espresso, #2a241e);
}

.lc-subscription-events__notes {
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  color: var(--mocha, #6b574a);
  flex: 1 1 100%;
}

/* ── Privacy / data ───────────────────────────────────────────────────────── */

.lc-privacy-delete {
  margin: 0;
}

.lc-privacy-delete__warning {
  margin: 0 0 1rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: #7a2222;
}

.lc-privacy-delete__form {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.lc-privacy-delete__confirm {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
}

.lc-privacy-delete__confirm input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  accent-color: #b43737;
}

/* ── Stores (B2B) ─────────────────────────────────────────────────────────── */

.lc-stores-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 768px) {
  .lc-stores-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.lc-store-card {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  padding: 1.25rem 1.5rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

.lc-store-card--pending {
  border-color: rgba(180, 130, 30, 0.4);
  background: rgba(180, 130, 30, 0.04);
}

.lc-store-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.lc-store-card__name {
  margin: 0;
  font-family: var(--font-heading, "Cormorant Garamond", serif);
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-store-card__location,
.lc-store-card__info {
  margin: 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--mocha, #6b574a);
  line-height: 1.5;
}

.lc-store-card__rejection {
  margin: 0;
  padding: 0.625rem 0.875rem;
  background: rgba(180, 55, 55, 0.06);
  border: 1px solid rgba(180, 55, 55, 0.25);
  border-radius: var(--radius);
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
  color: #7a2222;
}

.lc-store-card__status {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  padding: 0.22rem 0.65rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
}

.lc-store-card__status--approved,
.lc-store-card__status--active {
  background: rgba(47, 109, 58, 0.14);
  color: #1f5026;
}

.lc-store-card__status--pending,
.lc-store-card__status--submitted {
  background: rgba(180, 130, 30, 0.16);
  color: #6e4c0a;
}

.lc-store-card__status--rejected,
.lc-store-card__status--cancelled {
  background: rgba(180, 55, 55, 0.14);
  color: #7a2222;
}

.lc-store-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 0;
}
/* ============================================================
   Checkout success — order confirmation page
   ============================================================ */

.lc-checkout-success {
  background: var(--cream, #f8f4ed);
  min-height: 60vh;
  padding: 4rem 1.25rem 6rem;
}

.lc-checkout-success__inner {
  max-width: 56rem;
  margin: 0 auto;
  background: var(--warm-white, #fefcf8);
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 3rem 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

@media (max-width: 640px) {
  .lc-checkout-success {
    padding: 2rem 1rem 4rem;
  }
  .lc-checkout-success__inner {
    padding: 2rem 1.25rem;
    gap: 1.5rem;
  }
}

.lc-checkout-success__icon {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(184, 148, 120, 0.16);
  color: var(--rose-gold, #b89478);
  margin: 0 auto;
}

.lc-checkout-success__icon svg {
  width: 2rem;
  height: 2rem;
}

.lc-checkout-success__heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--espresso, #2a241e);
  text-align: center;
  margin: 0;
}

.lc-checkout-success__thank-you {
  text-align: center;
  color: var(--mocha, #6b574a);
  font-size: 1rem;
  margin: -0.75rem 0 0;
}

.lc-checkout-success__card {
  background: var(--cream, #f8f4ed);
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.lc-checkout-success__dl {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
}

.lc-checkout-success__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  font-size: 0.9375rem;
}

.lc-checkout-success__row dt {
  color: var(--mocha, #6b574a);
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  margin: 0;
}

.lc-checkout-success__row dd {
  margin: 0;
  color: var(--espresso, #2a241e);
}

.lc-checkout-success__row dd strong {
  font-weight: 600;
  letter-spacing: 0.04em;
}

.lc-checkout-success__totals {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  border-top: 1px solid var(--cream-dark, #ebe2d3);
  padding-top: 1rem;
}

.lc-checkout-success__total-row {
  display: flex;
  justify-content: space-between;
  font-size: 0.9375rem;
  color: var(--mocha, #6b574a);
}

.lc-checkout-success__total-row--grand {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--cream-dark, #ebe2d3);
  color: var(--espresso, #2a241e);
  font-size: 1.125rem;
}

.lc-checkout-success__total-row--grand strong {
  font-weight: 600;
}

.lc-checkout-success__section-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
  margin: 0 0 1rem;
}

.lc-checkout-success__payment-instructions {
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem;
  background: var(--warm-white, #fefcf8);
}

.lc-checkout-success__instructions-body {
  color: var(--espresso, #2a241e);
  font-size: 0.9375rem;
  line-height: 1.6;
}

.lc-checkout-success__instructions-body strong {
  color: var(--espresso, #2a241e);
  font-weight: 600;
}

.lc-checkout-success__addresses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 1.25rem;
}

.lc-checkout-success__address-card {
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.25rem 1.5rem;
  background: var(--warm-white, #fefcf8);
}

.lc-checkout-success__address-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--espresso, #2a241e);
  margin: 0 0 0.75rem;
}

.lc-checkout-success__address {
  font-style: normal;
  color: var(--mocha, #6b574a);
  font-size: 0.9375rem;
  line-height: 1.6;
}

.lc-checkout-success__items {
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem;
  background: var(--warm-white, #fefcf8);
}

.lc-checkout-success__item-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.lc-checkout-success__item {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: baseline;
  gap: 0.5rem 1rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--cream-dark, #ebe2d3);
}

.lc-checkout-success__item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.lc-checkout-success__item-name {
  font-weight: 500;
  color: var(--espresso, #2a241e);
}

.lc-checkout-success__item-sku {
  grid-column: 1 / 2;
  grid-row: 2;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--mocha, #6b574a);
}

.lc-checkout-success__item-qty {
  color: var(--mocha, #6b574a);
  font-size: 0.9375rem;
}

.lc-checkout-success__item-price {
  color: var(--espresso, #2a241e);
  font-weight: 500;
  text-align: right;
}

.lc-checkout-success__email-sent {
  text-align: center;
  color: var(--mocha, #6b574a);
  font-size: 0.9375rem;
  margin: -0.5rem 0 0;
}

.lc-checkout-success__actions {
  display: flex;
  justify-content: center;
  gap: 1rem;
  padding-top: 0.5rem;
}

/* M11: registered buyers get a tracking link to their account order detail;
   guests get an account nudge in the same slot (no guest tracking route). */
.lc-success__track {
  white-space: nowrap;
}

.lc-success__create-account {
  text-align: center;
}

.lc-success__create-account p {
  margin: 0;
  color: var(--mocha, #6b574a);
  font-size: 0.9375rem;
}

/* ----- success: per-line addons + order-level addons ----- */

.lc-checkout-success__item-addons {
  grid-column: 1 / -1;
  list-style: none;
  margin: 0.25rem 0 0;
  padding: 0.5rem 0 0 0.75rem;
  border-left: 2px solid var(--cream-dark, #ebe2d3);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.lc-checkout-success__item-addon {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.8125rem;
  color: var(--mocha, #6b574a);
}

.lc-checkout-success__item-addon-name em {
  font-style: italic;
  color: var(--rose-gold, #b89478);
}

.lc-checkout-success__item-addon-price {
  color: var(--espresso, #2a241e);
  font-variant-numeric: tabular-nums;
}

.lc-checkout-success__order-addons {
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem;
  background: var(--warm-white, #fefcf8);
}

.lc-checkout-success__addon-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.lc-checkout-success__addon-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--cream-dark, #ebe2d3);
  font-size: 0.9375rem;
  color: var(--espresso, #2a241e);
}

.lc-checkout-success__addon-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.lc-checkout-success__addon-name em {
  font-style: italic;
  color: var(--rose-gold, #b89478);
}

.lc-checkout-success__addon-amount {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

/* ============================================================
   Checkout pending — payment in progress / retry
   ============================================================ */

.lc-checkout-pending {
  background: var(--cream, #f8f4ed);
  min-height: 60vh;
  padding: 4rem 1.25rem 6rem;
}

.lc-checkout-pending__inner {
  max-width: 40rem;
  margin: 0 auto;
  background: var(--warm-white, #fefcf8);
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 3rem 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  text-align: center;
}

.lc-checkout-pending__inner > .lc-btn {
  align-self: center;
}

@media (max-width: 640px) {
  .lc-checkout-pending {
    padding: 2rem 1rem 4rem;
  }
  .lc-checkout-pending__inner {
    padding: 2rem 1.25rem;
    gap: 1.5rem;
  }
}

.lc-checkout-pending__icon {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(184, 148, 120, 0.16);
  color: var(--rose-gold, #b89478);
  margin: 0 auto;
}

.lc-checkout-pending__icon svg {
  width: 2rem;
  height: 2rem;
}

.lc-checkout-pending__heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--espresso, #2a241e);
  text-align: center;
  margin: 0;
}

.lc-checkout-pending__description {
  text-align: center;
  color: var(--mocha, #8b7355);
  font-size: 1rem;
  margin: -0.75rem 0 0;
}

.lc-checkout-pending__summary {
  background: var(--cream, #f8f4ed);
  border: 1px solid var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem;
  text-align: left;
}

.lc-checkout-pending__dl {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
}

.lc-checkout-pending__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  font-size: 0.9375rem;
}

.lc-checkout-pending__row dt {
  color: var(--mocha, #8b7355);
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  margin: 0;
}

.lc-checkout-pending__row dd {
  margin: 0;
  color: var(--espresso, #2a241e);
}

.lc-checkout-pending__row dd strong {
  font-weight: 600;
  letter-spacing: 0.04em;
}

.lc-checkout-pending__wallet {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.lc-checkout-pending__wallet-container {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* No `display` here: the element carries the `hidden` attribute and is
   revealed by JS, so an author display would defeat the UA
   `[hidden] { display: none }` rule (same precedent as [data-checkout-busy]). */
.lc-checkout-pending__wallet-message {
  color: #b91c1c;
  font-size: 0.875rem;
  margin: 0;
}

/* No `display` here either — same `hidden` attribute contract. */
.lc-checkout-pending__pay-form {
  margin: 0;
}

.lc-checkout-pending__pay-btn {
  width: 100%;
  max-width: 20rem;
}

.lc-checkout-pending__countdown {
  color: var(--mocha, #8b7355);
  font-size: 0.875rem;
  margin: 0;
}

.lc-checkout-pending__actions {
  display: flex;
  justify-content: center;
  gap: 1rem;
  padding-top: 0.5rem;
}

/* Header nav — hover dropdown variant (items with children, no mega_menu) */
.lc-header-nav__list {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.lc-header-nav__item--dropdown {
  position: relative;
}

.lc-header-nav__dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 12rem;
  background-color: var(--color-cream);
  border: 1px solid var(--color-gold);
  border-top: 3px solid var(--color-gold);
  padding: 0.75rem 0;
  list-style: none;
  margin: 0;
  box-shadow: 0 8px 24px rgba(10, 10, 10, 0.12);
  z-index: 50;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}

.lc-header-nav__item--dropdown:focus-within > .lc-header-nav__dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

@media (hover: hover) {
  .lc-header-nav__item--dropdown:hover > .lc-header-nav__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
}

.lc-header-nav__dropdown-link {
  display: block;
  padding: 0.5rem 1.25rem;
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  letter-spacing: 0.05em;
  color: var(--color-black);
  text-decoration: none;
  transition: background-color 0.15s, color 0.15s;
}

.lc-header-nav__dropdown-link:hover,
.lc-header-nav__dropdown-link:focus {
  background-color: color-mix(in srgb, var(--color-gold) 12%, transparent);
  color: var(--color-black);
}

.lc-header-nav__chevron {
  margin-left: 0.25rem;
  vertical-align: middle;
  opacity: 0.7;
}

/* ── Returns / EU withdrawal flow (CRD Art. 11a) ──────────────────────────── */

/* Returns pages reuse the account chrome (.lc-account) but have no sidebar:
   narrow the column and present each step as a single warm panel. */
.lc-returns {
  max-width: 46rem;
}

.lc-returns__panel {
  padding: 2.5rem 2.25rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
}

@media (max-width: 640px) {
  .lc-returns__panel {
    padding: 1.75rem 1.25rem;
  }
}

.lc-returns__intro {
  margin: -0.75rem 0 1.75rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--mocha, #8b7355);
}

.lc-returns__hint {
  display: block;
  margin: 0.375rem 0 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  font-weight: 400;
  letter-spacing: 0.01em;
  text-transform: none;
  line-height: 1.45;
  color: var(--mocha, #8b7355);
}

.lc-returns__optional {
  font-weight: 400;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--mocha, #8b7355);
}

.lc-returns__sku {
  margin-left: 0.375rem;
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
  color: var(--mocha, #8b7355);
}

/* Withdrawal statement summary (review + status pages) */

.lc-returns__statement {
  margin: 0 0 2rem;
  padding: 0;
  background: var(--cream, #f8f4ed);
  border: 1px solid rgba(42, 36, 30, 0.08);
  border-radius: var(--radius);
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
}

.lc-returns__statement-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.5rem;
  padding: 0.75rem 1rem;
}

.lc-returns__statement-row + .lc-returns__statement-row {
  border-top: 1px solid rgba(42, 36, 30, 0.06);
}

.lc-returns__statement-row dt {
  flex: 0 0 10.5rem;
  align-self: center;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mocha, #8b7355);
}

.lc-returns__statement-row dd {
  flex: 1 1 12rem;
  min-width: 0;
  margin: 0;
  color: var(--espresso, #2a241e);
  overflow-wrap: anywhere;
}

/* Order line picker (start page) */

.lc-returns__lines {
  margin: 0 0 1.5rem;
  padding: 1rem 1.25rem 0.625rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.1);
  border-radius: var(--radius);
}

.lc-returns__lines legend {
  padding: 0 0.375rem;
}

.lc-returns__line {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.75rem 0;
  border-top: 1px solid rgba(42, 36, 30, 0.06);
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
}

.lc-returns__line--disabled {
  opacity: 0.55;
}

.lc-returns__line input[type="checkbox"] {
  flex-shrink: 0;
  width: 1.05rem;
  height: 1.05rem;
  accent-color: var(--espresso, #2a241e);
}

.lc-returns__line > .lc-returns__hint {
  flex-shrink: 0;
  margin: 0;
}

.lc-returns__line-name {
  flex: 1;
  min-width: 0;
  color: var(--espresso, #2a241e);
}

.lc-returns__excluded {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.8125rem;
  color: #7a2222;
}

.lc-returns__qty {
  flex-shrink: 0;
  width: 4.5rem;
  text-align: center;
}

/* Statutory actions — CRD Art. 11a requires the withdrawal button (start) and
   the confirm button (review) to be unmissable primary actions. */

.lc-returns__submit {
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.875rem 1.5rem;
  font-size: 0.9375rem;
}

.lc-returns__confirm {
  margin: 2rem 0 0;
}

.lc-returns__back,
.lc-returns__model-form-link {
  margin: 1.5rem 0 0;
  font-family: var(--font-body, sans-serif);
  font-size: 0.875rem;
}

.lc-returns__back a,
.lc-returns__model-form-link a {
  color: var(--mocha, #8b7355);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.15s;
}

.lc-returns__back a:hover,
.lc-returns__model-form-link a:hover {
  color: var(--espresso, #2a241e);
}

/* Status page */

.lc-returns__meta {
  margin: 0 0 0.625rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  color: var(--mocha, #8b7355);
}

.lc-returns__meta strong {
  color: var(--espresso, #2a241e);
}

.lc-returns__next-steps {
  margin: 0 0 1.5rem;
  padding-left: 1.25rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--espresso, #2a241e);
}

.lc-returns__next-steps li {
  margin-bottom: 0.625rem;
}

/* Model withdrawal form (Directive 2011/83/EU Annex I(B)) — a print-friendly
   document block with dotted write-in blanks. */

.lc-returns__model-form {
  margin: 0 0 2rem;
  padding: 1.75rem;
  background: var(--warm-white, #fefcf8);
  border: 1px solid rgba(42, 36, 30, 0.15);
  border-radius: var(--radius);
  font-family: var(--font-body, sans-serif);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--espresso, #2a241e);
}

.lc-returns__blank {
  display: inline-block;
  min-width: 12rem;
  border-bottom: 1px dotted currentColor;
}

.lc-returns__blank--tall {
  display: block;
  min-height: 3.5rem;
}

.lc-returns__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* ── Search page ─────────────────────────────────────────────────────────── */

.lc-search {
  max-width: 72rem;
  margin: 0 auto;
  padding: 3rem 1.5rem;
}

.lc-search__header {
  max-width: 44rem;
  margin: 0 0 2.5rem;
}

.lc-search__heading {
  font-family: var(--font-heading, Georgia, serif);
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  margin: 0 0 1.5rem;
}

.lc-search__form {
  margin: 0;
}

/* Input + icon button joined into one control: full width on phones, capped
   on wider screens. Form controls are border-box globally (ThemeStylesheetTest),
   so the flex child cannot overflow the group. */
.lc-search__input-group {
  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: 32rem;
  border: 1px solid rgba(10, 10, 10, 0.25);
  background: #fff;
}

.lc-search__input {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.75rem 1rem;
  border: 0;
  background: transparent;
  font-family: var(--font-body, sans-serif);
  font-size: 1rem;
  color: var(--color-black, #0a0a0a);
  outline: none;
}

.lc-search__input-group:focus-within {
  border-color: var(--color-black, #0a0a0a);
}

.lc-search__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 3rem;
  border: 0;
  border-left: 1px solid rgba(10, 10, 10, 0.15);
  background: transparent;
  color: var(--color-black, #0a0a0a);
  cursor: pointer;
  transition: background-color 0.15s, color 0.15s;
}

.lc-search__submit:hover {
  background: var(--color-gold, #c4a572);
  color: var(--color-black, #0a0a0a);
}

.lc-search__count {
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-secondary, #6b5c45);
  margin: 0 0 1.5rem;
}

/* Same column behaviour as the category grid: 2 phones, 4 tablets, 5 wide. */
.lc-search__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 768px) {
  .lc-search__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .lc-search__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.lc-search__empty {
  padding: 4rem 0;
  margin: 0;
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.25rem;
  text-align: center;
  color: var(--foreground, #2a241e);
}

.lc-price-tax-note { font-family: var(--font-sans); font-size: 0.75rem; color: var(--foreground, rgba(0,0,0,0.55)); letter-spacing: 0.02em; }
.lc-price-tax-note--card { font-size: 0.6875rem; }

/* Checkout terms consent: the checkbox copy carries inline links, which need
   the theme's link treatment rather than the browser default. The notes
   fieldset above is `:last-of-type`, which zeroes its bottom spacing, so the
   consent block carries its own top margin. */
.lc-checkout__consent { margin-top: 1.5rem; }
.lc-checkout__consent a {
  color: var(--color-accent-gold, #c4a572);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.lc-discount-toggle { margin: 1rem 0; }
.lc-discount-toggle__summary { cursor: pointer; font-family: var(--font-sans); font-size: 0.8125rem; color: var(--foreground, rgba(0,0,0,0.6)); text-decoration: underline; text-underline-offset: 0.15em; list-style: none; }
.lc-discount-toggle__summary::-webkit-details-marker { display: none; }
.lc-discount-toggle[open] .lc-discount-toggle__summary { margin-bottom: 0.5rem; }
/* Breadcrumbs section (product template, `top` region). Small sans type;
   the separator is an explicit element so the section's separator setting
   can change it, and `lc-breadcrumbs--center` is its alignment setting. */
.lc-breadcrumbs {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
}

.lc-breadcrumbs__nav {
  display: block;
}

.lc-breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.lc-breadcrumbs--center .lc-breadcrumbs__list {
  justify-content: center;
}

.lc-breadcrumbs--left .lc-breadcrumbs__list {
  justify-content: flex-start;
}

.lc-breadcrumbs__item {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.lc-breadcrumbs__separator {
  opacity: 0.5;
}

.lc-breadcrumbs__item a {
  text-decoration: none;
  color: inherit;
  opacity: 0.7;
}

.lc-breadcrumbs__item a:hover {
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

/* ── Rewards catalogue page + cart points + reward badges ─────────────────── */

.lc-rewards {
  max-width: var(--page-max-width, 80rem);
  margin: 0 auto;
  padding: var(--space-section-sm, 3rem) var(--space-container, 1.5rem);
  font-family: var(--font-body, 'DM Sans', sans-serif);
  color: var(--espresso, #2a241e);
}

.lc-rewards__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.lc-rewards__title {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 2.25rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  margin: 0 0 0.75rem;
}

.lc-rewards__lede {
  max-width: 42rem;
  margin: 0 auto;
  color: var(--mocha, #8b7355);
  font-size: 1rem;
  line-height: 1.6;
}

.lc-rewards__balance {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: center;
  background: var(--cream-dark, #ebe2d3);
  border-radius: var(--radius);
  padding: 1.75rem 2rem;
  text-align: center;
  margin-bottom: 2.5rem;
}

.lc-rewards__balance-label {
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-rewards__balance-amount {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 3rem;
  font-weight: 600;
  line-height: 1.1;
  margin: 0;
}

.lc-rewards__balance-spendable,
.lc-rewards__balance-tier {
  font-size: 0.875rem;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-rewards__catalog {
  margin-bottom: 3rem;
}

.lc-rewards__tiers {
  margin-top: 1rem;
}

.lc-rewards__catalog-heading,
.lc-rewards__tiers-heading {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 1.5rem;
  font-weight: 500;
  margin: 0 0 1.25rem;
}

.lc-rewards__catalog-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.lc-rewards__catalog-item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem;
  border: 1px solid rgba(42, 36, 30, 0.12);
  border-radius: var(--radius);
  background: var(--warm-white, #fefcf8);
}

.lc-rewards__catalog-image-link {
  display: block;
  overflow: hidden;
  background: var(--cream-dark, #ebe2d3);
}

.lc-rewards__catalog-image {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.lc-rewards__catalog-name {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 1.0625rem;
  font-weight: 500;
  margin: 0;
}

.lc-rewards__catalog-link {
  color: inherit;
  text-decoration: none;
}

.lc-rewards__catalog-link:hover {
  color: var(--color-gold-text, #836830);
}

.lc-rewards__catalog-variant {
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-rewards__catalog-points {
  font-size: 0.9375rem;
  font-weight: 600;
  margin: 0;
}

.lc-rewards__catalog-notice {
  font-size: 0.8125rem;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-rewards__catalog-form {
  margin: auto 0 0;
}

.lc-rewards__catalog-cta {
  width: 100%;
}

.lc-rewards__catalog-empty {
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-rewards__tiers-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: 1rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.lc-rewards__tier {
  padding: 1.25rem 1.5rem;
  border: 1px solid rgba(42, 36, 30, 0.12);
  border-radius: var(--radius);
}

.lc-rewards__tier-name {
  font-family: var(--font-heading, 'Cormorant Garamond', serif);
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0 0 0.25rem;
}

.lc-rewards__tier-threshold,
.lc-rewards__tier-perks {
  font-size: 0.875rem;
  color: var(--mocha, #8b7355);
  margin: 0;
}

.lc-rewards__tier-perks {
  margin-top: 0.5rem;
}

/* Shared text-input treatment (cart points, PDP redeem select). The product
   page is the only other consumer; keep theme inputs on one rule. */
.lc-input {
  width: 100%;
  padding: 0.875rem 1rem;
  border: 1px solid rgba(42, 36, 30, 0.18);
  border-radius: var(--radius);
  background: var(--warm-white, #fefcf8);
  color: var(--espresso, #2a241e);
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-size: 0.9375rem;
}

.lc-input::placeholder {
  color: var(--mocha, #8b7355);
}

/* Cart loyalty points block (B22.5) — mirrors .lc-cart-discount. */
.lc-cart-points {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.lc-cart-points__label {
  display: block;
  font-size: 0.875rem;
  color: var(--mocha, #8b7355);
}

.lc-cart-points__form,
.lc-cart-points__remove-form {
  margin: 0;
}

.lc-cart-points__input-row {
  display: flex;
  gap: 0.75rem;
  align-items: stretch;
}

.lc-cart-points__input {
  flex: 1;
}

.lc-cart-points__apply {
  flex-shrink: 0;
}

.lc-cart-points__applied {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: rgba(42, 36, 30, 0.04);
  border-radius: var(--radius);
  font-size: 0.875rem;
}

.lc-cart-points__value {
  font-weight: 600;
  color: var(--espresso, #2a241e);
}

.lc-cart-points__remove {
  flex-shrink: 0;
}

/* Reward-line badges and unavailable notices (cart, drawer, checkout). */
.lc-cart-line__reward-badge,
.lc-checkout-summary__line-reward-badge,
.lc-checkout-success__item-reward-badge,
.cart-row__reward-badge {
  display: inline-block;
  margin-top: 0.25rem;
  padding: 0.125rem 0.5rem;
  border: 1px solid var(--color-gold, #c4a572);
  border-radius: var(--radius-pill, 9999px);
  background: rgba(196, 165, 114, 0.12);
  color: var(--color-gold-text, #836830);
  font-family: var(--font-sans, sans-serif);
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lc-cart-line__unavailable,
.lc-checkout-summary__line-unavailable,
.cart-row__unavailable {
  margin: 0.25rem 0 0;
  font-size: 0.75rem;
  color: #842029;
}

.lc-cart-totals__row--points .lc-cart-totals__label,
.lc-cart-totals__row--points .lc-cart-totals__value {
  color: var(--color-gold-text, #836830);
  font-weight: 500;
}

/* PDP "redeem for points" form. */
.lc-product-redeem {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1rem;
}

.lc-product-redeem__label {
  font-family: var(--font-sans, sans-serif);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-black, #0a0a0a);
}

.lc-product-redeem__select {
  width: 100%;
}

.lc-product-redeem__cta {
  width: 100%;
}

/* ── Mobile header (≤767px), mobile-menu actions, country selector ───────────
   Mobile bar = hamburger, search, logo, cart. Account (opt-in), wishlist,
   language and currency live in the mobile menu footer. The 1fr·auto·1fr grid
   keeps the logo centered however many icons each side carries. */
@media (max-width: 767px) {
  .header-bar__mobile-hidden { display: none !important; }
  .lc-header-bar__inner { grid-template-columns: minmax(max-content, 1fr) minmax(0, auto) minmax(max-content, 1fr); }
  .lc-header-bar__center { min-width: 0; }
  .lc-header-bar__center .lc-header-logo { max-width: 100%; min-width: 0; }
  .lc-header-bar__center .lc-header-logo__img,
  .lc-header-bar__center .lc-header-bar__logo-img { height: auto; max-height: var(--logo-h-mobile, 22px); max-width: 100%; }
}

.mobile-menu__footer {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 1rem 1.5rem 1.5rem;
  border-top: 1px solid var(--border, rgba(42, 36, 30, 0.12));
}
.mobile-menu__footer-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 2.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--foreground, #2a241e);
  text-decoration: none;
}
.mobile-menu__footer-count {
  margin-left: auto;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 0.25rem;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-pill);
  background: var(--rose-gold, #b89478);
  color: #fff;
  font-size: 0.6875rem;
  line-height: 1;
}
/* Dropdowns open inline in the menu: tappable, never clipped by the panel. */
.mobile-menu__footer-switch { display: block; }
.mobile-menu__footer-switch language-switcher,
.mobile-menu__footer-switch currency-switcher { width: 100%; }
.mobile-menu__footer-switch .language-switcher__trigger,
.mobile-menu__footer-switch .currency-switcher__trigger { min-height: 2.75rem; width: 100%; }
.mobile-menu__footer-switch .language-switcher__dropdown,
.mobile-menu__footer-switch .currency-switcher__dropdown {
  position: static !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0 0.25rem !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.mobile-menu__footer-switch .language-switcher__option,
.mobile-menu__footer-switch .currency-switcher__option { min-height: 2.75rem; }
.mobile-menu__footer .country-selector { padding-top: 0.5rem; }

.country-selector__nav { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.25rem; }
.country-selector--list .country-selector__nav { flex-direction: column; align-items: stretch; gap: 0.25rem; }
.country-selector__heading {
  margin: 0;
  font-size: 0.6875rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.7;
}
.country-selector__list { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; margin: 0; padding: 0; list-style: none; }
.country-selector--list .country-selector__list { flex-direction: column; gap: 0; }
.country-selector__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.25rem;
  font-size: 0.8125rem;
  color: inherit;
  text-decoration: none;
}
.country-selector--list .country-selector__link { min-height: 2.75rem; width: 100%; }
.country-selector__link:hover { opacity: 0.75; }
.country-selector__item--current .country-selector__link {
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.3em;
}
.country-selector__item { margin: 0; }
.country-selector__flag { line-height: 1; }
.country-selector__name { white-space: nowrap; }
.country-selector__currency { font-size: 0.75rem; letter-spacing: 0.06em; opacity: 0.6; }

/* ── Homepage mobile gutter pass (≤767px): one 1.5rem side gutter everywhere ──
   Desktop paddings above stay untouched; the pieces that kept them on phones
   are reduced here. `.section--contained` roots already carry the gutter as
   root padding-inline, so inner containers/columns must not add a second one. */
@media (max-width: 767px) {
  /* image-with-text: stack (media first in DOM => image first for both
     image_position values); text gets the gutter even when content_width=full. */
  .lc-image-with-text .image-with-text__grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 2rem !important;
    direction: ltr !important;
  }
  .lc-image-with-text:not(.section--contained) .image-with-text__content { padding-inline: 1.5rem; }

  /* featured-products carousel: snap to the gutter, trailing space, bleed right */
  .lc-featured-products.featured-products--carousel .lc-grid--cards {
    padding-inline: 1.5rem;
    scroll-padding-inline: 1.5rem;
  }

  /* promo-card: dark text panel */
  .promo-card__content { padding: 2.5rem 1.5rem; background: var(--background, #2a241e); }

  /* atelier-feature: text column uses the normal gutter */
  .atelier-feature__content { padding: 3rem 1.5rem !important; }
  .atelier-feature.section--contained .atelier-feature__content { padding-inline: 0 !important; }

  /* testimonials: drop figure UA margin (40px), smaller quote */
  .lc-testimonials .testimonial-card { margin: 0; }
  .lc-testimonials .testimonial-card__quote { font-size: 1.5rem; line-height: 1.35; }

  /* contained roots already hold the gutter: no second one from inner containers */
  .lc-testimonials.section--contained .testimonials__container,
  .featured-journal.section--contained .featured-journal__container,
  .instagram-grid.section--contained .instagram-grid__container,
  .lc-categories-section.section--contained .lc-categories__inner { padding-inline: 0; }

  /* hero: 2rem -> 1.5rem inner gutter */
  .lc-hero__inner { padding-inline: 1.5rem; }
}
/* ── end homepage mobile gutter pass ── */

/* ── Cart page on phones ──────────────────────────────────────────────────────
   Two columns (thumbnail | content); the stepper, remove link and line total
   drop to their own row under the name/variant/price instead of squeezing the
   name column to one word per line. */
@media (max-width: 640px) {
  .lc-cart { padding: 1.5rem 1rem 2rem; }
  .lc-cart__heading { margin-bottom: 1.5rem; }
  .lc-cart__layout { gap: 2rem; }
  .lc-cart__summary { padding: 1.25rem; }
  .lc-cart-line {
    grid-template-columns: 4.5rem minmax(0, 1fr) auto;
    column-gap: 0.875rem;
    row-gap: 0.625rem;
  }
  .lc-cart-line__image-link,
  .lc-cart-line__image-placeholder { grid-column: 1; grid-row: 1 / span 2; }
  .lc-cart-line__image,
  .lc-cart-line__image-placeholder { width: 4.5rem; height: 4.5rem; }
  .lc-cart-line__details { grid-column: 2 / -1; grid-row: 1; }
  .lc-cart-line__actions {
    grid-column: 2; grid-row: 2;
    flex-direction: row; align-items: center; justify-content: flex-start;
    gap: 0.875rem; flex-wrap: wrap;
  }
  .lc-cart-line__total { grid-column: 3; grid-row: 2; align-self: center; white-space: nowrap; margin: 0; }
}