/*
 * Raftaar Commerce — Pure Handcrafted CSS
 * Zero Tailwind. Zero build tools. Upload and works.
 * 
 * Design: Shopify/Hyva feel — Inter font, 4px grid, frosted glass,
 * micro-animations, premium product cards.
 *
 * @package RaftaarCommerce v1.0.0
 */

/* ═══════════════════════════════════════════════════════════════════════════
   1. CSS CUSTOM PROPERTIES (brand tokens)
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  /* ── Brand colours (Slate — default neutral/monochrome) ─────────────────── */
  --rc-primary:      #1d1d1b;
  --rc-primary-dark: #000000;
  --rc-primary-rgb:  29,29,27;
  --rc-accent:       #1d1d1b;
  --rc-accent-dark:  #000000;
  --rc-text:         #1d1d1b;
  --rc-muted:        #76766f;
  --rc-surface:      #f7f7f5;
  --rc-border:       #e4e4e0;
  --rc-border-dark:  #ccccc8;
  --rc-white:        #ffffff;

  /* ── Page card system ────────────────────────────────────────────────────── */
  --rc-page-bg:      #f0f0ed;   /* outer grey wrap — canvas behind white card  */
  --rc-card-radius:  12px;      /* card corners when docked (scroll = 0)       */

  /* ── Typography ──────────────────────────────────────────────────────────── */
  --rc-font:         'Satoshi', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --rc-font-heading: 'Satoshi', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ── Shape & spacing ──────────────────────────────────────────────────────  */
  --rc-radius:       0.75rem;
  /* Derived from --rc-radius (not a separate Customizer field) so the
     "Global border radius" setting governs every RC block consistently —
     these ratios (2/3 and 4/3) reproduce the previous fixed 0.5rem/1rem
     exactly at the 0.75rem default, but now scale with every other preset
     too (e.g. "Sharp" collapses both to 0, "Pill" scales both up). */
  --rc-radius-sm:    calc(var(--rc-radius) * 0.6667);
  --rc-radius-lg:    calc(var(--rc-radius) * 1.3333);

  /* ── Shadows ──────────────────────────────────────────────────────────────  */
  --rc-shadow-sm:    0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.04);
  --rc-shadow:       0 4px 16px rgba(0,0,0,0.07), 0 2px 6px rgba(0,0,0,0.04);
  --rc-shadow-lg:    0 8px 32px rgba(0,0,0,0.09), 0 4px 12px rgba(0,0,0,0.05);

  /* ── Layout & chrome ──────────────────────────────────────────────────────  */
  --rc-header-h:     64px;
  --rc-ease:         cubic-bezier(0.4, 0, 0.2, 1);
  --rc-ease-out:     cubic-bezier(0, 0, 0.2, 1);
  --rc-container:    1080px;
  --rc-footer-bg:    #111110;
  --rc-footer-text:  #d4d4cf;

  /* ── Semantic states ──────────────────────────────────────────────────────  */
  --rc-success:      #22c55e;
  --rc-success-dark: #16a34a;
  --rc-warning:      #f59e0b;
  --rc-error:        #ef4444;

  /* Button text on primary background */
  --rc-btn-text:     #ffffff;

  /* Legacy alias kept for back-compat */
  --rc-secondary:    var(--rc-surface);
}

/* ── Colour variant: Sage (earthy green) ────────────────────────────────── */
[data-rc-variant="sage"] {
  --rc-primary:      #2d5a27;
  --rc-primary-dark: #1e3d1a;
  --rc-primary-rgb:  45,90,39;
  --rc-accent:       #4a7c40;
  --rc-accent-dark:  #336b29;
  --rc-text:         #1a2918;
  --rc-muted:        #5a7053;
  --rc-surface:      #f4f8f3;
  --rc-border:       #d6e4d2;
  --rc-border-dark:  #b8d1b3;
  --rc-page-bg:      #eef2ed;
  --rc-footer-bg:    #1a2918;
  --rc-footer-text:  #b8d1b3;
}

/* ── Colour variant: Dusk (violet/purple) ───────────────────────────────── */
[data-rc-variant="dusk"] {
  --rc-primary:      #5b21b6;
  --rc-primary-dark: #4c1d95;
  --rc-primary-rgb:  91,33,182;
  --rc-accent:       #7c3aed;
  --rc-accent-dark:  #6d28d9;
  --rc-text:         #1e1b2e;
  --rc-muted:        #6b6884;
  --rc-surface:      #f8f6fc;
  --rc-border:       #ddd8ed;
  --rc-border-dark:  #c7c0e0;
  --rc-page-bg:      #f2f0f7;
  --rc-footer-bg:    #1e1b2e;
  --rc-footer-text:  #c7c0e0;
}

/* ── Colour variant: Bloom (warm rose/coral) ────────────────────────────── */
[data-rc-variant="bloom"] {
  --rc-primary:      #9d174d;
  --rc-primary-dark: #831843;
  --rc-primary-rgb:  157,23,77;
  --rc-accent:       #e11d48;
  --rc-accent-dark:  #be123c;
  --rc-text:         #1f1217;
  --rc-muted:        #7d5663;
  --rc-surface:      #fdf5f7;
  --rc-border:       #ecdde3;
  --rc-border-dark:  #ddc5ce;
  --rc-page-bg:      #f7f0f2;
  --rc-footer-bg:    #1f1217;
  --rc-footer-text:  #ddc5ce;
}

/* ── Colour variant: Midnight (dark/deep) ───────────────────────────────── */
[data-rc-variant="midnight"] {
  --rc-primary:      #a78bfa;
  --rc-primary-dark: #c4b5fd;
  --rc-primary-rgb:  167,139,250;
  --rc-accent:       #34d399;
  --rc-accent-dark:  #10b981;
  --rc-text:         #f1f5f9;
  --rc-muted:        #94a3b8;
  --rc-surface:      #13131a;
  --rc-border:       #2a2b38;
  --rc-border-dark:  #363748;
  --rc-page-bg:      #0c0c10;
  --rc-footer-bg:    #06060a;
  --rc-footer-text:  #64748b;
  --rc-white:        #1a1a24;
}

/* ═══════════════════════════════════════════════════════════════════════════
   2. RESET & BASE
   ═══════════════════════════════════════════════════════════════════════════ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  background: var(--rc-page-bg);
  scrollbar-gutter: stable; /* prevent layout shift when body overflow:hidden removes scrollbar */
}

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

html, body {
  background-color: var(--rc-page-bg, #f0f0ed) !important;
  margin: 0 !important;
  padding: 0 !important;
}

body {
  font-family: var(--rc-font);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--rc-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* WP-specific resets */
body.rc-body {
  padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px));
}
@media (min-width: 1024px) {
  body.rc-body { padding-bottom: 0; }
}

/* Responsive container: 1080px on small laptops, 1280px on large screens */
@media (min-width: 1440px) {
  :root { --rc-container: 1280px; }
}

/* Admin bar offset */
.admin-bar .rc-header { top: 32px; }
@media screen and (max-width: 782px) {
  .admin-bar .rc-header { top: 46px; }
}

/* WordPress page/site wrappers full-width */
#page, .site, #content, .site-content, .site-main {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  float: none !important;
}

img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; font: inherit; border: none; background: none; }
ul, ol { list-style: none; }
input, select, textarea { font: inherit; }
[x-cloak] { display: none !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   3. ACCESSIBILITY
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-skip-link {
  position: absolute;
  top: -100%;
  left: 1rem;
  z-index: 9999;
  padding: 0.5rem 1rem;
  background: var(--rc-primary);
  color: var(--rc-btn-text);
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 0 0 var(--rc-radius) var(--rc-radius);
  transition: top 0.2s;
  text-decoration: none;
}
.rc-skip-link:focus { top: 0; }

/* No-JS navigation bar — hidden by default, revealed via <noscript> style injection */
.rc-noscript-bar {
  display: none;
  align-items: center;
  gap: 1rem;
  padding: 0.625rem 1.25rem;
  background: var(--rc-surface);
  border-bottom: 1px solid var(--rc-border);
  flex-wrap: wrap;
}
.rc-noscript-bar__logo {
  font-weight: 800;
  font-size: 1rem;
  color: var(--rc-text);
  text-decoration: none;
  margin-right: auto;
}
.rc-noscript-bar__logo img { height: 32px; width: auto; display: block; }
.rc-noscript-bar__menu {
  display: flex;
  gap: 0.125rem;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
}
.rc-noscript-bar__menu li a {
  display: block;
  padding: 0.375rem 0.75rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--rc-text);
  text-decoration: none;
  border-radius: var(--rc-radius);
}
.rc-noscript-bar__menu li a:hover { background: var(--rc-surface); }
.rc-noscript-bar__cart {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--rc-primary);
  text-decoration: none;
  padding: 0.375rem 0.75rem;
  border: 1.5px solid var(--rc-primary);
  border-radius: var(--rc-radius);
}

:focus-visible {
  outline: 2.5px solid var(--rc-primary);
  outline-offset: 2px;
  border-radius: 3px;
}
:focus:not(:focus-visible) { outline: none; }

/* ═══════════════════════════════════════════════════════════════════════════
   3b. TYPOGRAPHY — Satoshi-optimised heading & body scale
   ═══════════════════════════════════════════════════════════════════════════ */

/* Heading defaults — tighter tracking suits Satoshi's geometric cuts */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--rc-font-heading);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: var(--rc-text);
  margin: 0;
}

h1 { font-size: clamp(2rem,   5vw, 3rem);    letter-spacing: -0.04em; }
h2 { font-size: clamp(1.5rem, 3.5vw, 2.25rem); }
h3 { font-size: clamp(1.125rem, 2.5vw, 1.5rem); }
h4 { font-size: 1.125rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.875rem; }

p { margin: 0 0 1rem; line-height: 1.65; }
p:last-child { margin-bottom: 0; }

/* Running body text (post/page content) */
.entry-content p,
.woocommerce-product-details__short-description p,
.woocommerce-tabs .panel p {
  line-height: 1.7;
  color: var(--rc-text);
}

/* Bold / strong */
strong, b { font-weight: 700; }

/* Utility typography classes */
.rc-text-muted    { color: var(--rc-muted); }
.rc-text-sm       { font-size: 0.875rem; }
.rc-text-xs       { font-size: 0.75rem; }
.rc-text-lg       { font-size: 1.125rem; }
.rc-text-xl       { font-size: 1.25rem; }
.rc-text-tight    { letter-spacing: -0.03em; }
.rc-text-caps     { text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.75rem; font-weight: 600; }

/* ═══════════════════════════════════════════════════════════════════════════
   4. LAYOUT
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-container {
  width: 100%;
  max-width: var(--rc-container, 1280px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* ── Gutenberg block: full layout mode ──────────────────────────────────────── */
/* Breaks out of a constrained page container to fill the full viewport width.  */
/* Scoped to .rc-page-body so homepage blocks (already full-width in rc-main)   */
/* are unaffected — avoids 100vw > content-width overflow on the homepage.      */
.rc-page-body .rc-block--full {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

/* #rc-main carries is-layout-constrained (front-page.php) purely so WP core's
   .is-layout-constrained > .aligncenter rule can centre plain Gutenberg
   blocks (e.g. Image) dropped into the homepage — see the image-centering
   investigation. That same WP rule also injects a 24px top margin between
   every direct child via a zero-specificity :where() selector; the homepage's
   RC block sections are designed to sit flush with no gap, so it's zeroed
   out here at real specificity (this rule wins regardless of source order). */
#rc-main.rc-home-main > * {
  margin-block-start: 0;
}

/* ── Gutenberg block: boxed layout mode ─────────────────────────────────────── */
/* Constrains the block wrapper so border-radius and box-shadow work cleanly.   */
/* Content is clipped at the border-radius; box-shadow renders outside the box. */
.rc-block--boxed {
  max-width: var(--rc-boxed-width, 1280px);
  margin-inline: auto;
  overflow: hidden;
}
@media (min-width: 640px) {
  .rc-container { padding-left: 1.5rem; padding-right: 1.5rem; }
}
@media (min-width: 1024px) {
  .rc-container { padding-left: 2rem; padding-right: 2rem; }
}

.rc-main {
  min-height: 60vh;
  background: var(--rc-white);
  position: relative; /* stacking context for content above grey bg */
}

/* ═══════════════════════════════════════════════════════════════════════════
   4b. PAGE CARD SCROLL-MORPH (Satoshi-inspired)
   ─ Four page-bg coloured masks sit at the viewport corners.
   ─ They give the illusion that the viewport itself has rounded corners,
     making the white content look like a floating card at scroll=0.
   ─ On scroll they slide off-screen, "expanding" the card to fill the screen.
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-corner {
  position: fixed;
  z-index: 9990;
  width: var(--rc-card-radius, 12px);
  height: var(--rc-card-radius, 12px);
  background: var(--rc-page-bg, #f0f0ed);
  pointer-events: none;
  will-change: transform;
  transition:
    transform      0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.10s,
    border-radius  0.30s cubic-bezier(0.4, 0, 0.2, 1) 0.40s;
}

.rc-corner--tl { top: 0;    left:  0; border-bottom-right-radius: var(--rc-card-radius, 12px); }
.rc-corner--tr { top: 0;    right: 0; border-bottom-left-radius:  var(--rc-card-radius, 12px); }
.rc-corner--bl { bottom: 0; left:  0; border-top-right-radius:    var(--rc-card-radius, 12px); }
.rc-corner--br { bottom: 0; right: 0; border-top-left-radius:     var(--rc-card-radius, 12px); }

/* When scrolled: corners slide out to viewport edge + lose inner radius */
.rc-corner--gone {
  border-radius: 0 !important;
}
.rc-corner--tl.rc-corner--gone { transform: translate(-100%, -100%); }
.rc-corner--tr.rc-corner--gone { transform: translate(100%,  -100%); }
.rc-corner--bl.rc-corner--gone { transform: translate(-100%, 100%);  }
.rc-corner--br.rc-corner--gone { transform: translate(100%,  100%);  }

/* Mobile: bottom nav takes 60px, offset bottom corners */
@media (max-width: 1023px) {
  .rc-corner--bl,
  .rc-corner--br { bottom: calc(60px + env(safe-area-inset-bottom, 0px)); }
}

/* ═══════════════════════════════════════════════════════════════════════════
   5. HEADER — Centred logo, pill menu left, icons right
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 500;
  height: var(--rc-header-h);
  background: var(--rc-surface);
  transition:
    transform    280ms var(--rc-ease),
    background   220ms var(--rc-ease),
    border-color 220ms var(--rc-ease),
    box-shadow   220ms var(--rc-ease);
  will-change: transform;
}

.rc-header--scrolled {
  background: color-mix(in srgb, var(--rc-surface) 96%, transparent) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-color: var(--rc-border) !important;
  box-shadow: 0 1px 0 var(--rc-border), 0 4px 24px rgba(0,0,0,0.04) !important;
}

.rc-header--hidden { transform: translateY(-100%); }

/* Non-sticky: scroll with page, never hide via transform */
.rc-header--static {
  position: relative !important;
  transform: none !important;
}

.rc-header--transparent {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Glassmorphism header (Variant B — commerce) */
.rc-header--glass {
  background: rgba(255, 255, 255, 0.14) !important;
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.22) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.12), inset 0 0 0 0.5px rgba(255,255,255,0.18) !important;
}
.rc-header--glass.rc-header--scrolled {
  background: rgba(255, 255, 255, 0.75) !important;
  backdrop-filter: blur(28px) saturate(200%);
  -webkit-backdrop-filter: blur(28px) saturate(200%);
  border-bottom: 1px solid var(--rc-border) !important;
}
/* Pure white icon buttons on glass header */
.rc-header--glass .rc-btn-icon,
.rc-header--glass .rc-menu-pill {
  background: var(--rc-white);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10), 0 0 0 0.5px rgba(0,0,0,0.04);
}
.rc-header--glass .rc-btn-icon:hover,
.rc-header--glass .rc-menu-pill:hover {
  background: #f5f5f5;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.13), 0 0 0 0.5px rgba(0,0,0,0.04);
}
.rc-header--glass.rc-header--scrolled .rc-btn-icon,
.rc-header--glass.rc-header--scrolled .rc-menu-pill {
  background: var(--rc-white);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

/* On pages with a flush-hero layout (no page title, hero sits right under header),
   the glass header would show the image bleeding through its semi-transparent
   background as soon as the user scrolls. Force it solid so image stays below. */
body:has(.rc-page--no-header) #rc-header.rc-header--glass,
body:has(.rc-page--no-header) #rc-header.rc-header--glass.rc-header--scrolled {
  background: rgba(255, 255, 255, 0.96) !important;
  backdrop-filter: blur(28px) saturate(200%);
  -webkit-backdrop-filter: blur(28px) saturate(200%);
  border-bottom: 1px solid var(--rc-border) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,0.06) !important;
}

/* ── 3-zone inner grid ────────────────────────────────────────────────────── */
.rc-header__inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 100%;
  max-width: var(--rc-container, 1280px);
  margin: 0 auto;
  padding: 0 1.25rem;
}

.rc-header__left  { display: flex; align-items: center; justify-content: flex-start; }
.rc-header__center{ display: flex; align-items: center; justify-content: center; }
.rc-header__right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.125rem;
}

/* ── Logo ──────────────────────────────────────────────────────────────────── */
.rc-logo-text {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--rc-text);
  letter-spacing: -0.03em;
  text-decoration: none;
  display: block;
}

.rc-header__logo .custom-logo-link { display: flex; align-items: center; }
.rc-header__logo .custom-logo { max-height: var(--rc-logo-h, 36px); width: auto; }

/* ── Pill menu button ─────────────────────────────────────────────────────── */
.rc-menu-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0 0.75rem;
  height: 48px;
  background: color-mix(in srgb, var(--rc-surface) 92%, var(--rc-text));
  border: none;
  border-radius: var(--rc-radius-sm);
  color: var(--rc-text);
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: -0.01em;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background    200ms cubic-bezier(0.4,0,0.2,1),
    color         200ms cubic-bezier(0.4,0,0.2,1),
    transform      80ms;
}
.rc-menu-pill:hover {
  background: color-mix(in srgb, var(--rc-surface) 82%, var(--rc-text));
}
.rc-menu-pill:active { transform: scale(0.97); }
.rc-menu-pill--open  { background: color-mix(in srgb, var(--rc-surface) 82%, var(--rc-text)); }

/* Animated three-line icon inside pill */
.rc-menu-pill__icon {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 3.5px;
  width: 15px;
  height: 12px;
  flex-shrink: 0;
}
.rc-menu-pill__icon span {
  display: block;
  width: 100%;
  height: 1.5px;
  background: currentColor;
  border-radius: 1px;
  transform-origin: center;
  transition: transform 250ms var(--rc-ease), opacity 180ms;
}
.rc-menu-pill--open .rc-menu-pill__icon span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.rc-menu-pill--open .rc-menu-pill__icon span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.rc-menu-pill--open .rc-menu-pill__icon span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

/* Text label: desktop only */
.rc-menu-pill__label { display: none; }
@media (min-width: 1024px) { .rc-menu-pill__label { display: block; } }

/* Admin bar offset */
.admin-bar .rc-nav-flyout { top: calc(var(--rc-header-h) + 32px); }
@media screen and (max-width: 782px) {
  .admin-bar .rc-nav-flyout { top: calc(var(--rc-header-h) + 46px); }
}

/* ── Icon buttons (search, account, cart) ─────────────────────────────────── */
.rc-btn-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--rc-radius-sm);
  color: var(--rc-text);
  background: color-mix(in srgb, var(--rc-surface) 92%, var(--rc-text));
  border: none;
  cursor: pointer;
  transition: background 200ms cubic-bezier(0.4,0,0.2,1), color 200ms cubic-bezier(0.4,0,0.2,1), transform 80ms;
}
.rc-btn-icon:hover  { background: color-mix(in srgb, var(--rc-surface) 82%, var(--rc-text)); }
.rc-btn-icon:active { transform: scale(0.92); }

/* ── Heart-to-cart punch animation ──────────────────────────────────────── */
@keyframes rc-cart-punch {
    0%   { transform: scale(1);    color: inherit;              filter: none; }
    18%  { transform: scale(0.70); color: var(--rc-punch);      filter: none; }
    48%  { transform: scale(1.40); color: var(--rc-punch);      filter: drop-shadow(0 0 12px var(--rc-punch)); }
    70%  { transform: scale(0.92); color: var(--rc-punch);      filter: drop-shadow(0 0 6px var(--rc-punch)); }
    86%  { transform: scale(1.06); color: var(--rc-punch);      filter: none; }
    100% { transform: scale(1);    color: inherit;              filter: none; }
}
.rc-cart-toggle.rc-cart--punched {
    animation: rc-cart-punch 960ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Cart count badge — anchored to a wrapper that hugs just the SVG icon (not the
   48px/44px button, which has its own responsive breakpoint and would require
   re-tuning hardcoded offsets at every size). top:0;right:0 + translate(50%,-50%)
   centers the badge on the icon's corner regardless of icon/button/badge size. */
.rc-cart-icon-wrap { position: relative; display: inline-flex; }
.rc-cart-count {
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
  min-width: 17px;
  height: 17px;
  padding: 0 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--rc-primary);
  color: var(--rc-btn-text);
  font-size: 0.625rem;
  font-weight: 700;
  border-radius: 8.5px;
  border: 2px solid var(--rc-white);
  pointer-events: none;
}

@keyframes rcBounce {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.5); }
  65%  { transform: scale(0.88); }
  100% { transform: scale(1); }
}
.rc-cart-count--bounce { animation: rcBounce 0.55s var(--rc-ease); }

/* ═══════════════════════════════════════════════════════════════════════════
   6. FULL-WIDTH SEARCH OVERLAY
   ═══════════════════════════════════════════════════════════════════════════ */

/* Overlay container — fills whole screen, sits above header */
.rc-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 600;
  display: flex;
  flex-direction: column;
  background: color-mix(in srgb, var(--rc-white) 96%, transparent);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  animation: rcSearchIn 200ms var(--rc-ease-out) forwards;
}

@keyframes rcSearchIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
[x-cloak] { display: none !important; }

.rc-search-overlay__inner {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  padding: 1rem 1.25rem 2rem;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
@media (min-width: 640px) {
  .rc-search-overlay__inner { padding: 1.5rem 2rem 3rem; }
}

/* ── Input bar ────────────────────────────────────────────────────────────── */
.rc-search-overlay__bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  border-bottom: 1.5px solid var(--rc-border-dark);
  padding-bottom: 0.75rem;
  margin-bottom: 1.25rem;
}

.rc-search-overlay__lens { color: var(--rc-muted); flex-shrink: 0; }

.rc-search-overlay__input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 1.25rem;
  font-weight: 400;
  color: var(--rc-text);
  font-family: var(--rc-font);
  letter-spacing: -0.02em;
  caret-color: var(--rc-primary);
}
@media (min-width: 640px) {
  .rc-search-overlay__input { font-size: 1.5rem; }
}
.rc-search-overlay__input::placeholder { color: var(--rc-muted); }

.rc-search-overlay__clear {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--rc-surface);
  color: var(--rc-muted);
  border: none;
  cursor: pointer;
  transition: background 150ms, color 150ms;
  flex-shrink: 0;
}
.rc-search-overlay__clear:hover { background: var(--rc-border); color: var(--rc-text); }

.rc-search-overlay__cancel {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--rc-muted);
  padding: 0.25rem 0.125rem;
  background: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: color 150ms;
  flex-shrink: 0;
}
.rc-search-overlay__cancel:hover { color: var(--rc-text); }

/* ── Results pane ─────────────────────────────────────────────────────────── */
.rc-search-overlay__results {
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* ── Skeleton loaders ─────────────────────────────────────────────────────── */
.rc-skel {
  display: block;
  background: linear-gradient(90deg, var(--rc-surface) 25%, var(--rc-border) 50%, var(--rc-surface) 75%);
  background-size: 200% 100%;
  animation: rcPulse 1.5s ease-in-out infinite;
  border-radius: 4px;
}
@keyframes rcPulse {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.rc-skel--sq   { width: 56px; height: 56px; border-radius: 10px; flex-shrink: 0; }
.rc-skel--line { height: 13px; border-radius: 4px; }

.rc-search-skeletons        { display: flex; flex-direction: column; gap: 0.5rem; }
.rc-search-skeleton          { display: flex; align-items: center; gap: 0.875rem; padding: 0.5rem 0; }
.rc-search-skeleton__body   { flex: 1; display: flex; flex-direction: column; gap: 6px; }

/* ── Results list ─────────────────────────────────────────────────────────── */
.rc-search-list { display: flex; flex-direction: column; gap: 2px; }

.rc-search-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.625rem 0.5rem;
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: background 150ms;
}
.rc-search-item:hover { background: var(--rc-surface); }

.rc-search-item__img {
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 10px;
  flex-shrink: 0;
  border: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.rc-search-item__body  { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rc-search-item__title { font-size: 0.9375rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rc-search-item__price { font-size: 0.875rem; font-weight: 700; color: var(--rc-primary); }
.rc-search-item__oos   { font-size: 0.8125rem; color: var(--rc-muted); font-style: italic; }

.rc-search-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 1.5rem 1rem 0.5rem;
  color: var(--rc-muted);
  text-align: center;
}
.rc-search-empty p { margin: 0; font-size: 1rem; }

.rc-search-fallback { width: 100%; margin-top: 1rem; text-align: left; }
.rc-search-fallback__label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--rc-muted);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 0.5rem;
  padding: 0 0.25rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   7. BACKDROP — frosted glass dimmer (used by cart, account, menu drawers)
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-backdrop {
  position: fixed;
  inset: 0;
  z-index: 498;
  background: rgba(0, 0, 0, 0);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  pointer-events: none;
  transition:
    background      300ms var(--rc-ease),
    backdrop-filter 300ms var(--rc-ease);
}
.rc-backdrop--active {
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: var(--rc-backdrop-blur, blur(12px));
  -webkit-backdrop-filter: var(--rc-backdrop-blur, blur(12px));
  pointer-events: all;
}

/* ═══════════════════════════════════════════════════════════════════════════
   8a. DESKTOP NAVIGATION — Flyout + Mega variants
   ─ Hidden on mobile; mobile-menu.php handles ≤1023px.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Mobile-only utility — hide desktop nav on mobile */
.rc-mobile-only { display: none !important; }
@media (max-width: 1023px) { .rc-mobile-only { display: flex !important; } }

/* Desktop flyout container — hidden below 1024px */
.rc-nav-flyout {
  display: none; /* mobile: never shown, mobile-menu handles it */
  position: fixed;
  top: var(--rc-header-h);
  left: 0;
  right: 0;
  z-index: 599;
  background: color-mix(in srgb, var(--rc-white) 97%, transparent);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--rc-border);
  box-shadow: 0 16px 48px rgba(0,0,0,0.08);
  /* Bloom from top-left (hamburger position) */
  clip-path: inset(0 100% 100% 0 round 0px);
  pointer-events: none;
  transition: clip-path 400ms cubic-bezier(0.4, 0, 0.2, 1);
}
@media (min-width: 1024px) {
  .rc-nav-flyout { display: block; }
}

.rc-nav-flyout--open {
  clip-path: inset(0 0% 0% 0 round 0px);
  pointer-events: all;
}

/* ── Variant A: 2-column flyout ──────────────────────────────────────────── */
.rc-nav-flyout__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  max-width: var(--rc-container, 1280px);
  margin: 0 auto;
  padding: 2.5rem 2rem 3rem;
  gap: 3rem;
  min-height: 360px;
}

.rc-nav-flyout__nav { display: flex; flex-direction: column; }

.rc-nav-flyout__list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  list-style: none;
}

.rc-nav-flyout__list > li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.5rem;
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  border-radius: var(--rc-radius-sm);
  letter-spacing: -0.02em;
  transition: background 150ms, color 150ms, padding-left 150ms;
}
.rc-nav-flyout__list > li > a:hover {
  background: var(--rc-surface);
  color: var(--rc-primary);
  padding-left: 0.875rem;
}
.rc-nav-flyout__list > .current-menu-item > a,
.rc-nav-flyout__list > .current-menu-ancestor > a {
  color: var(--rc-primary);
}

/* Nav chevron (right-arrow on items with children) */
.rc-nav-chevron {
  flex-shrink: 0;
  opacity: 0.5;
  transition: opacity 150ms, transform 200ms var(--rc-ease);
}
.rc-nav-has-children:hover > a > .rc-nav-chevron,
.rc-nav-has-children > a.rc-nav--active > .rc-nav-chevron {
  opacity: 1;
  transform: translateX(3px);
}

/* Active/hovered nav parent item */
.rc-nav-flyout__list > li > a.rc-nav--active {
  background: var(--rc-surface);
  color: var(--rc-primary);
  padding-left: 0.875rem;
}
.rc-nav-flyout__glass-nav .rc-nav-flyout__list > li > a.rc-nav--active {
  padding-left: 1.625rem;
}

/* ── Right-panel stacking context (default content + sub-panels overlap here) ── */
.rc-nav-flyout__right-panels {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  align-items: start;
}
.rc-nav-flyout__right-panels > * {
  grid-column: 1;
  grid-row: 1;
}

/* ── Sub-menu panels (right column, all variants) ──────────────────────── */
.rc-nav-flyout__sub-panel {
  padding: 0.25rem 0;
  background: var(--rc-white); /* solid background prevents default content bleeding through during x-transition crossfade */
}
.rc-nav-flyout__sub-panel-inner {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.rc-nav-flyout__sub-panel-title {
  margin: 0;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rc-muted);
}
.rc-nav-flyout__sub-panel-title a {
  color: inherit;
  text-decoration: none;
  transition: color 120ms;
}
.rc-nav-flyout__sub-panel-title a:hover { color: var(--rc-primary); }

.rc-nav-flyout__sub-links {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
.rc-nav-flyout__sub-group { display: flex; flex-direction: column; gap: 0.125rem; }

.rc-nav-flyout__sub-link {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  padding: 0.3125rem 0;
  transition: color 120ms;
  line-height: 1.4;
}
.rc-nav-flyout__sub-link:hover { color: var(--rc-primary); }
.rc-nav-flyout__sub-link--parent { font-weight: 600; }
.rc-nav-flyout__sub-children {
  display: flex;
  flex-direction: column;
  padding-left: 0.875rem;
  border-left: 2px solid var(--rc-border);
  margin: 0.125rem 0 0.375rem;
  gap: 0.125rem;
}
.rc-nav-flyout__sub-link--grandchild {
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--rc-muted);
}
.rc-nav-flyout__sub-link--grandchild:hover { color: var(--rc-primary); }

/* Glass variant sub-panel: uses --rc-white so it adapts to any theme exactly like the left nav card.
   In dark mode --rc-white = #1a1a24 (dark), in light mode = #ffffff. --rc-text / --rc-muted
   are always designed to contrast against --rc-white, so no explicit color overrides are needed. */
.rc-nav-flyout__sub-panel--glass {
  background: color-mix(in srgb, var(--rc-white) 92%, transparent);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: var(--rc-radius);
  padding: 1.75rem;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.28);
  max-width: 420px;
}

/* Sub-menu within flyout (safety net — no longer rendered inline but kept for compat) */
.rc-nav-flyout__list .sub-menu { display: none; }

.rc-nav-flyout__feature-link {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  border-radius: var(--rc-radius);
  overflow: hidden;
  position: relative;
  transition: transform 200ms var(--rc-ease);
}
.rc-nav-flyout__feature-link:hover { transform: scale(1.01); }

.rc-nav-flyout__feature-img-wrap {
  flex: 1;
  overflow: hidden;
  border-radius: var(--rc-radius);
  background: var(--rc-surface);
  max-height: 260px;
}
.rc-nav-flyout__feature-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 400ms var(--rc-ease);
}
.rc-nav-flyout__feature-link:hover .rc-nav-flyout__feature-img-wrap img { transform: scale(1.04); }

.rc-nav-flyout__feature-body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.875rem 0.25rem 0;
}
.rc-nav-flyout__feature-label { font-size: 1rem; font-weight: 600; color: var(--rc-text); }
.rc-nav-flyout__feature-sub   { font-size: 0.875rem; color: var(--rc-muted); }

/* Plain variant (no image — shows mini category cards) */
.rc-nav-flyout__feature-link--plain {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  align-content: start;
}
.rc-nav-flyout__mini-cat {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  border-radius: var(--rc-radius-sm);
  overflow: hidden;
  transition: transform 200ms var(--rc-ease);
  cursor: pointer;
}
.rc-nav-flyout__mini-cat img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.rc-nav-flyout__mini-cat span { font-size: 0.875rem; font-weight: 500; color: var(--rc-text); }

/* ══ GLASS FLYOUT — Variant B (commerce / glass header) ═════════════════════
   Left column: solid white card.  Right column: transparent — blurred page
   backdrop (z-index 498, backdrop-filter blur(12px)) shows through.
   ═══════════════════════════════════════════════════════════════════════════ */

.rc-nav-flyout--glass {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border-bottom: none !important;
}

.rc-nav-flyout__glass-wrap {
  display: grid;
  grid-template-columns: 288px 1fr;
  max-width: var(--rc-container, 1280px);
  margin: 0 auto;
  min-height: 320px;
}

/* Solid white nav column */
.rc-nav-flyout__glass-nav {
  background: var(--rc-white);
  border-radius: 0 0 16px 16px;
  box-shadow: 4px 0 40px rgba(0, 0, 0, 0.14), 0 12px 40px rgba(0, 0, 0, 0.1);
  padding: 1rem 0 1.5rem;
  overflow: hidden;
}
.rc-nav-flyout__glass-nav .rc-nav-flyout__list > li > a {
  border-radius: 0;
  padding: 0.75rem 1.375rem;
  font-size: 1rem;
}
.rc-nav-flyout__glass-nav .rc-nav-flyout__list > li > a:hover {
  padding-left: 1.625rem;
}

/* Transparent right panel — mega content floats over blurred page */
.rc-nav-flyout__glass-right {
  background: transparent;
  padding: 2rem 2.5rem 2rem 2rem;
  align-content: center;
}

/* Mega heading + grid in glass mode */
.rc-nav-mega__heading--glass {
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
  border-bottom-color: rgba(255, 255, 255, 0.55);
}
.rc-nav-mega__grid--glass {
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
}
/* The right panel here is intentionally transparent (blur comes from the
   shared .rc-backdrop layer behind it, see section 7) — which means these
   labels sit over whatever page content happens to be behind the header,
   not a guaranteed-dark surface. White text with just a shadow isn't
   reliably WCAG-contrast-compliant against arbitrary/light content, so each
   label/count gets its own solid dark chip — contrast holds regardless of
   what's rendered behind the panel. */
.rc-nav-mega__item--glass .rc-nav-mega__label,
.rc-nav-mega__item--glass .rc-nav-mega__count {
  display: inline-block;
  align-self: flex-start;
  background: rgba(15, 23, 42, 0.82);
  border-radius: 4px;
  padding: 0.125rem 0.5rem;
}
.rc-nav-mega__item--glass .rc-nav-mega__label {
  color: #fff;
}
.rc-nav-mega__item--glass .rc-nav-mega__count {
  color: rgba(255, 255, 255, 0.85);
}
.rc-nav-mega__item--glass .rc-nav-mega__img-wrap {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  border-radius: 12px;
}

/* Feature image in glass mode */
.rc-nav-flyout__feature-link--glass {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  border-radius: var(--rc-radius);
  overflow: hidden;
  transition: transform 200ms var(--rc-ease);
  max-width: 420px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.25);
}
.rc-nav-flyout__feature-link--glass:hover { transform: scale(1.02); }
.rc-nav-flyout__feature-link--glass .rc-nav-flyout__feature-img-wrap { max-height: 240px; }
.rc-nav-flyout__feature-body--glass {
  padding: 0.875rem 1rem;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Glass mini-cats (fallback when no feature image) */
.rc-nav-flyout__glass-minicats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  max-width: 360px;
}
.rc-nav-flyout__mini-cat--glass {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  border-radius: var(--rc-radius);
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  transition: transform 200ms var(--rc-ease);
}
.rc-nav-flyout__mini-cat--glass:hover { transform: translateY(-3px); }
.rc-nav-flyout__mini-cat--glass img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.rc-nav-flyout__mini-cat--glass span {
  padding: 0.375rem 0.625rem 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-btn-text);
  background: rgba(0, 0, 0, 0.55);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* ── Variant B: Mega-menu (2-column: nav left, category grid right) ──────── */
.rc-nav-flyout__inner--mega {
  display: grid;
  grid-template-columns: minmax(200px, 1fr) 2fr;
  max-width: var(--rc-container, 1280px);
  margin: 0 auto;
  padding: 2.5rem 2rem 3rem;
  gap: 3rem;
  min-height: 360px;
}

.rc-nav-mega__heading {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--rc-text);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 1rem;
  padding-bottom: 0.625rem;
  border-bottom: 2px solid var(--rc-primary);
  display: inline-block;
}

.rc-nav-mega__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 1rem;
}

.rc-nav-mega__item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  text-decoration: none;
  color: var(--rc-text);
  border-radius: var(--rc-radius-sm);
  overflow: hidden;
  transition: transform 200ms var(--rc-ease);
}
.rc-nav-mega__item:hover { transform: translateY(-3px); }

.rc-nav-mega__img-wrap {
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--rc-radius-sm);
  background: var(--rc-surface);
}
.rc-nav-mega__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 350ms var(--rc-ease);
}
.rc-nav-mega__item:hover .rc-nav-mega__img-wrap img { transform: scale(1.06); }

.rc-nav-mega__label { font-size: 0.875rem; font-weight: 600; }
.rc-nav-mega__count { font-size: 0.75rem; color: var(--rc-muted); }

/* Mega bottom links */
.rc-nav-mega__menu { border-top: 1px solid var(--rc-border); padding-top: 1.25rem; }
.rc-nav-mega__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.125rem;
  list-style: none;
}
.rc-nav-mega__list a {
  display: inline-block;
  padding: 0.375rem 0.75rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--rc-muted);
  border-radius: var(--rc-radius-sm);
  text-decoration: none;
  transition: background 150ms, color 150ms;
}
.rc-nav-mega__list a:hover { background: var(--rc-surface); color: var(--rc-text); }

/* ─── Mobile nav — sliding two-panel drawer ─────────────────────────────── */
.rc-drawer__body--flush { padding: 0; }

/* Sliding panels container */
.rc-mobile-panels-wrap {
  /* flex: 1 from .rc-drawer__body grows to fill drawer */
  overflow: hidden; /* clips neighbouring panels horizontally */
  display: flex;
}
.rc-mobile-panels {
  display: flex;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  transition: transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: transform;
}
.rc-mobile-panel {
  min-width: 100%;
  height: 100%;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Sub-panel header: back button + title + "View all" */
.rc-mobile-panel__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1rem 0.625rem 0.625rem;
  background: var(--rc-surface);
  border-bottom: 1px solid var(--rc-border);
}
.rc-mobile-nav__back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--rc-text);
  border-radius: var(--rc-radius-sm);
  flex-shrink: 0;
  transition: background 150ms;
}
.rc-mobile-nav__back:hover { background: var(--rc-border); }
.rc-mobile-panel__title {
  flex: 1;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--rc-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rc-mobile-panel__view-all {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--rc-primary);
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}
.rc-mobile-panel__view-all:hover { text-decoration: underline; }

/* Nav list rows (link + expand button) */
.rc-mobile-nav {
  list-style: none;
  display: flex;
  flex-direction: column;
}
.rc-mobile-nav__row {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid var(--rc-border);
}
.rc-mobile-nav__link {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 0.875rem 1rem 0.875rem 1.375rem;
  font-size: 1rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  transition: background 150ms, color 150ms;
}
.rc-mobile-nav__link:hover { background: var(--rc-surface); color: var(--rc-primary); }
.current-menu-item .rc-mobile-nav__link,
.current-menu-ancestor .rc-mobile-nav__link { color: var(--rc-primary); }

.rc-mobile-nav__expand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  border: none;
  border-left: 1px solid var(--rc-border);
  background: none;
  cursor: pointer;
  color: var(--rc-muted);
  flex-shrink: 0;
  transition: background 150ms, color 150ms;
}
.rc-mobile-nav__expand:hover { background: var(--rc-surface); color: var(--rc-primary); }

/* ═══════════════════════════════════════════════════════════════════════════
   8. DRAWERS (cart, account, mobile menu)
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-drawer {
  position: fixed;
  top: 0;
  height: 100%;
  height: 100dvh;
  width: min(420px, 100vw);
  background: var(--rc-white);
  z-index: 999;
  display: flex;
  flex-direction: column;
  box-shadow: var(--rc-shadow-lg);
  transition: transform 320ms var(--rc-ease-out);
  will-change: transform;
  overflow: hidden;
}
.rc-drawer--right { right: 0; transform: translateX(102%); }
.rc-drawer--left  { left: 0;  transform: translateX(-102%); }
.rc-drawer--right.rc-drawer--open { transform: translateX(0); }
.rc-drawer--left.rc-drawer--open  { transform: translateX(0); }

/* Push drawers below WP admin bar when logged in */
.admin-bar .rc-drawer { top: 32px; height: calc(100% - 32px); height: calc(100dvh - 32px); }
@media screen and (max-width: 782px) {
  .admin-bar .rc-drawer { top: 46px; height: calc(100% - 46px); height: calc(100dvh - 46px); }
}

.rc-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.125rem 1.375rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
}
.rc-drawer__title {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--rc-text);
}
.rc-drawer__count {
  font-weight: 400;
  color: var(--rc-muted);
  font-size: 0.9375rem;
  margin-left: 0.25rem;
}
.rc-drawer__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: var(--rc-muted);
  transition: background 150ms, color 150ms;
  background: transparent;
  border: none;
  cursor: pointer;
}
.rc-drawer__close:hover { background: var(--rc-surface); color: var(--rc-text); }

.rc-drawer__body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 1.25rem 1.375rem;
}
.rc-drawer__footer {
  flex-shrink: 0;
  padding: 1rem 1.375rem;
  border-top: 1px solid var(--rc-border);
  background: var(--rc-white);
}

/* ─── Cart-specific drawer body ─────────────────────────────────────────── */
.rc-cart-item {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--rc-border);
}
.rc-cart-item:last-child { border-bottom: none; }

.rc-cart-item__img {
  width: 72px;
  height: 96px;
  object-fit: cover;
  border-radius: 8px;
  flex-shrink: 0;
  border: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.rc-cart-item__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}
.rc-cart-item__name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  line-height: 1.35;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-cart-item__name:hover { color: var(--rc-primary); }
.rc-cart-item__meta  { font-size: 0.75rem; color: var(--rc-muted); }
.rc-cart-item__price { font-size: 0.9375rem; font-weight: 700; color: var(--rc-text); }

.rc-cart-item__qty {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.rc-qty-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1.5px solid var(--rc-border);
  background: transparent;
  color: var(--rc-text);
  cursor: pointer;
  transition: border-color 150ms, background 150ms;
}
.rc-qty-btn:hover { border-color: var(--rc-primary); background: rgba(var(--rc-primary-rgb), 0.06); }
.rc-qty-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.rc-qty-val {
  min-width: 24px;
  text-align: center;
  font-size: 0.875rem;
  font-weight: 600;
}

.rc-cart-item__remove {
  align-self: flex-start;
  margin-top: 0.125rem;
  padding: 4px;
  color: var(--rc-muted);
  transition: color 150ms;
  background: transparent;
  border: none;
  cursor: pointer;
  border-radius: 4px;
}
.rc-cart-item__remove:hover { color: #ef4444; background: #fef2f2; }

/* ── Free-shipping progress bar ─────────────────────────────────────────── */
.rc-shipping-bar { padding: 0.875rem 1.125rem; }

.rc-shipping-bar__head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.625rem;
}
.rc-shipping-bar__icon {
  font-size: 1.0625rem;
  flex-shrink: 0;
  line-height: 1;
}
.rc-shipping-bar__msg {
  flex: 1;
  min-width: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-text);
  line-height: 1.35;
}
.rc-shipping-bar__msg strong { color: var(--rc-primary); }
.rc-shipping-bar--qualified .rc-shipping-bar__msg { color: var(--rc-success, #10b981); }
.rc-shipping-bar__pct {
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--rc-primary);
  border: 1.5px solid var(--rc-primary);
  padding: 0.125rem 0.5rem;
  border-radius: 100px;
  flex-shrink: 0;
  opacity: 0.9;
}
.rc-shipping-bar__track {
  height: 10px;
  background: var(--rc-border);
  border-radius: 100px;
  overflow: hidden;
}
.rc-shipping-bar__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--rc-primary), var(--rc-primary-dark, var(--rc-primary)));
  border-radius: 100px;
  transition: width 700ms cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}
.rc-shipping-bar__fill::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: -100%;
  width: 60%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  animation: rc-bar-shine 2.4s ease-in-out infinite;
}
@keyframes rc-bar-shine {
  0%   { left: -100%; }
  55%  { left: 160%; }
  100% { left: 160%; }
}
.rc-shipping-bar--qualified .rc-shipping-bar__fill {
  background: linear-gradient(90deg, var(--rc-success, #10b981), #059669);
}
.rc-shipping-bar--qualified .rc-shipping-bar__fill::after { display: none; }

/* Product page: card-style container */
.rc-product-ship-bar {
  margin-top: 1.25rem;
  padding: 1rem 1.125rem;
  border-radius: var(--rc-radius);
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
}
.rc-product-ship-bar .rc-shipping-bar { padding: 0; }

/* Cart page summary: breathing room above totals */
.rc-cart-page__summary-card .rc-shipping-bar { margin-bottom: 0.875rem; }

/* Cart page "Add more products" CTA */
.rc-ship-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.75rem 1rem;
  margin-top: 1rem;
  margin-bottom: 0.875rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-primary);
  background: var(--rc-surface);
  border: 1.5px dashed var(--rc-primary);
  border-radius: var(--rc-radius);
  text-decoration: none;
  cursor: pointer;
  transition: background 150ms, border-style 150ms, opacity 150ms;
  opacity: 0.85;
}
.rc-ship-cta:hover { background: var(--rc-border); opacity: 1; border-style: solid; }

/* ── Free-shipping progress toast ───────────────────────────────────────── */
.rc-ship-toast {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9500;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  background: var(--rc-white);
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  box-shadow: 0 8px 40px rgba(0,0,0,0.13), 0 2px 8px rgba(0,0,0,0.06);
  padding: 1rem 2.25rem 1rem 1rem;
  max-width: 320px;
  width: calc(100vw - 2rem);
  transform: translateY(calc(100% + 2rem));
  opacity: 0;
  transition: transform 380ms var(--rc-ease-out), opacity 380ms;
  pointer-events: none;
}
.rc-ship-toast--visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.rc-ship-toast--success { border-color: var(--rc-success, #10b981); }
.rc-ship-toast__icon {
  font-size: 1.5rem;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 0.1rem;
}
.rc-ship-toast__body { flex: 1; min-width: 0; }
.rc-ship-toast__title {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--rc-text);
  margin-bottom: 0.2rem;
}
.rc-ship-toast__sub {
  font-size: 0.8125rem;
  color: var(--rc-muted);
  margin: 0 0 0.5rem;
  line-height: 1.4;
}
.rc-ship-toast__sub strong { color: var(--rc-text); }
.rc-ship-toast__track {
  height: 4px;
  background: var(--rc-border);
  border-radius: 2px;
  overflow: hidden;
}
.rc-ship-toast__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--rc-success, #10b981), var(--rc-primary));
  border-radius: 2px;
  transition: width 600ms var(--rc-ease-out);
}
.rc-ship-toast__close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--rc-muted);
  font-size: 1.125rem;
  border-radius: 50%;
  padding: 0;
  line-height: 1;
  transition: color 150ms, background 150ms;
}
.rc-ship-toast__close:hover { color: var(--rc-text); background: var(--rc-surface); }
@media (max-width: 767px) {
  .rc-ship-toast {
    left: 1rem;
    right: 1rem;
    max-width: none;
    bottom: calc(60px + env(safe-area-inset-bottom, 0px) + 0.75rem);
  }
}

/* Coupon */
.rc-cart-coupon {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rc-border);
}
.rc-cart-coupon__row { display: flex; gap: 0.5rem; }

/* Subtotal */
.rc-cart-subtotal {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
  padding: 0.75rem 0;
  border-top: 2px solid var(--rc-border);
}
.rc-cart-subtotal span:first-child { font-size: 0.9375rem; font-weight: 600; }
.rc-cart-subtotal span:last-child  { font-size: 1.125rem; font-weight: 800; color: var(--rc-text); }

.rc-cart-tax-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 0.75rem;
  color: var(--rc-muted);
  margin-top: 0.5rem;
}

/* Empty cart */
.rc-cart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3rem 1rem;
  gap: 1rem;
  color: var(--rc-muted);
}
.rc-cart-empty svg { opacity: 0.25; }
.rc-cart-empty p   { font-size: 0.9375rem; margin: 0; }

/* ═══════════════════════════════════════════════════════════════════════════
   9. SLIDE-UP SHEETS (quick view, checkout)
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-sheet {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  height: 90dvh;
  background: var(--rc-white);
  border-radius: 1.25rem 1.25rem 0 0;
  box-shadow: 0 -8px 48px rgba(0,0,0,0.14);
  display: flex;
  flex-direction: column;
  transform: translateY(102%);
  transition: transform 380ms cubic-bezier(0.32, 0.72, 0, 1);
  will-change: transform;
}
.rc-sheet--open { transform: translateY(0); }

@media (min-width: 768px) {
  .rc-sheet {
    width: min(880px, 94vw);
    left: 50%;
    right: auto;
    transform: translate(-50%, 102%);
    border-radius: 1.25rem 1.25rem 0 0;
  }
  .rc-sheet--open { transform: translate(-50%, 0); }
}

.rc-sheet__handle {
  width: 44px;
  height: 4px;
  background: var(--rc-border);
  border-radius: 2px;
  margin: 0.875rem auto 0;
  flex-shrink: 0;
}
.rc-sheet__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
}
.rc-sheet__title { font-size: 1.0625rem; font-weight: 700; }
.rc-sheet__body  { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 1.5rem; }
.rc-sheet__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--rc-surface);
  color: var(--rc-muted);
  border: none;
  cursor: pointer;
  transition: background 150ms;
}
.rc-sheet__close:hover { background: var(--rc-border); color: var(--rc-text); }

/* Checkout iframe */
.rc-checkout-iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
  background: var(--rc-white);
}

/* ═══════════════════════════════════════════════════════════════════════════
   10. QUICK VIEW CONTENT
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-qv { }
.rc-qv__inner {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
  align-items: flex-start;
}
@media (min-width: 600px) {
  .rc-qv__inner { flex-wrap: nowrap; }
}
.rc-qv__img-wrap {
  flex-shrink: 0;
  width: 100%;
  max-width: 300px;
}
@media (max-width: 599px) { .rc-qv__img-wrap { max-width: 100%; } }
.rc-qv__img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.rc-qv__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}
.rc-qv__title {
  font-size: 1.4375rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.25;
  color: var(--rc-text);
}
.rc-qv__price {
  font-size: 1.4375rem;
  font-weight: 800;
  color: var(--rc-primary);
}
.rc-qv__price ins { text-decoration: none; color: #dc2626; }
.rc-qv__price del { font-size: 1rem; font-weight: 400; color: var(--rc-muted); margin-right: 0.5rem; }
.rc-qv__price .woocommerce-Price-amount { font-weight: inherit; }

.rc-qv__desc {
  font-size: 0.9375rem;
  color: var(--rc-muted);
  line-height: 1.65;
}
.rc-qv__desc p { margin: 0 0 0.5rem; }
.rc-qv__desc p:last-child { margin-bottom: 0; }

.rc-qv__actions {
  display: flex;
  gap: 0.625rem;
  flex-wrap: wrap;
}

.rc-qv__full-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--rc-primary);
  text-decoration: none;
  padding-top: 0.25rem;
  transition: gap 150ms;
}
.rc-qv__full-link:hover { gap: 0.625rem; }

/* Quick view skeleton */
.rc-qv-skel { display: flex; gap: 1.5rem; flex-wrap: wrap; }
@media (min-width: 600px) { .rc-qv-skel { flex-wrap: nowrap; } }

/* ═══════════════════════════════════════════════════════════════════════════
   11. MOBILE BOTTOM NAV
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 400;
  display: flex;
  align-items: stretch;
  background: color-mix(in srgb, var(--rc-white) 97%, transparent);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid var(--rc-border);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  height: calc(60px + env(safe-area-inset-bottom, 0px));
}
@media (min-width: 1024px) { .rc-bottom-nav { display: none; } }

.rc-bottom-nav__item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 0.5rem 0;
  color: var(--rc-muted);
  font-size: 0.625rem;
  font-weight: 500;
  text-decoration: none;
  transition: color 150ms, transform 80ms;
  background: transparent;
  border: none;
  cursor: pointer;
}
.rc-bottom-nav__item:active { transform: scale(0.88); }
.rc-bottom-nav__item:hover,
.rc-bottom-nav__item.active { color: var(--rc-primary); }

.rc-bottom-nav__item--cart { overflow: visible; }

/* Badge anchors to a wrapper that hugs just the icon (same technique as the
   header cart badge) instead of hand-tuned top/calc() offsets against the
   flex:1 tab button, whose width changes with viewport/item count. */
.rc-bottom-nav__icon-wrap { position: relative; display: inline-flex; }
.rc-bottom-nav__badge {
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
  min-width: 14px;
  height: 14px;
  background: var(--rc-primary);
  color: var(--rc-btn-text);
  font-size: 0.5625rem;
  font-weight: 700;
  border-radius: 7px;
  padding: 0 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--rc-white);
  pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   12. AJAX PROGRESS BAR
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  height: 3px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 200ms;
}
.rc-progress__bar {
  height: 100%;
  background: var(--rc-primary);
  border-radius: 0 2px 2px 0;
  transition: width 200ms var(--rc-ease);
  box-shadow: 0 0 10px rgba(var(--rc-primary-rgb), 0.6);
}

/* ═══════════════════════════════════════════════════════════════════════════
   13. BUTTONS
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  font-family: var(--rc-font);
  border: none;
  border-radius: calc(var(--rc-radius) - 2px);
  cursor: pointer;
  transition: background 150ms, transform 80ms, box-shadow 150ms, opacity 150ms, border-color 150ms;
  white-space: nowrap;
  text-decoration: none;
  line-height: 1;
  -webkit-appearance: none;
}
.rc-btn:active { transform: scale(0.97); }
.rc-btn:disabled, .rc-btn[disabled] { opacity: 0.55; pointer-events: none; cursor: not-allowed; }

.rc-btn--primary {
  background: var(--rc-primary);
  color: var(--rc-btn-text);
}
.rc-btn--primary:hover {
  background: var(--rc-primary-dark);
  box-shadow: 0 4px 14px rgba(var(--rc-primary-rgb), 0.3);
}

.rc-btn--secondary {
  background: var(--rc-surface);
  color: var(--rc-text);
  border: 1.5px solid var(--rc-border);
}
.rc-btn--secondary:hover {
  background: var(--rc-border);
  border-color: var(--rc-border-dark);
}

.rc-btn--ghost {
  background: transparent;
  color: var(--rc-text);
  border: 1.5px solid var(--rc-border);
}
.rc-btn--ghost:hover { border-color: var(--rc-primary); color: var(--rc-primary); }

.rc-btn--full  { width: 100%; }
.rc-btn--sm    { padding: 0.5rem 1rem; font-size: 0.875rem; }

/* ═══════════════════════════════════════════════════════════════════════════
   14. PRODUCT GRID
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-product-grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(2, 1fr);
  list-style: none;
  margin: 0;
  padding: 0;
}
/* cols-1 must apply at every breakpoint (list view) */
.rc-product-grid.cols-1 { grid-template-columns: 1fr !important; }

@media (min-width: 768px)  {
  .rc-product-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1024px) {
  .rc-product-grid       { grid-template-columns: repeat(3, 1fr); }
  .rc-product-grid.cols-1 { grid-template-columns: 1fr; }
  .rc-product-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
  .rc-product-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
  .rc-product-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
  .rc-product-grid.cols-5 { grid-template-columns: repeat(5, 1fr); }
}

.rc-product-grid__item {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   15. PRODUCT CARD
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-card {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: var(--rc-radius);
  overflow: hidden;
  background: var(--rc-white);
  transition:
    box-shadow 250ms var(--rc-ease),
    transform 250ms var(--rc-ease);
  height: 100%;
}
.rc-card:hover {
  box-shadow: var(--rc-shadow-lg);
  transform: translateY(-3px);
}

/* Subtle bottom accent on hover */
.rc-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--rc-primary);
  transform: scaleX(0);
  transition: transform 280ms var(--rc-ease);
  transform-origin: left;
}
.rc-card:hover::after { transform: scaleX(1); }

/* Style variants */
.rc-card--bordered { border: 1px solid var(--rc-border); }
.rc-card--shadow   { box-shadow: var(--rc-shadow-sm); }
.rc-card--minimal  { }

/* ── Image wrapper ────────────────────────────────────────────────────────── */
.rc-card__img-wrap {
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--rc-surface);
}

/* Aspect ratios */
.rc-card__img-wrap.ratio-2-3  { aspect-ratio: 2 / 3; }
.rc-card__img-wrap.ratio-3-4  { aspect-ratio: 3 / 4; }
.rc-card__img-wrap.ratio-1-1  { aspect-ratio: 1 / 1; }
.rc-card__img-wrap.ratio-4-3  { aspect-ratio: 4 / 3; }
.rc-card__img-wrap.ratio-16-9 { aspect-ratio: 16 / 9; }

.rc-card__img,
.rc-card__img--primary {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 500ms var(--rc-ease), opacity 300ms;
}
.rc-card:hover .rc-card__img,
.rc-card:hover .rc-card__img--primary {
  transform: scale(1.05);
}

.rc-card__img--hover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 380ms var(--rc-ease);
}
.rc-card:hover .rc-card__img--hover { opacity: 1; }

/* ── Coverflow gallery (.rc-card--has-gallery) ──────────────────────────── */
.rc-card__coverflow {
  position: absolute;
  inset: 0;
  perspective: 600px;
  perspective-origin: 50% 35%;
}
.rc-card__cf-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 340ms cubic-bezier(0.4, 0, 0.2, 1),
              opacity 280ms ease;
  transform-origin: center center;
  backface-visibility: hidden;
  will-change: transform, opacity;
}
/* Single-image cards: subtle scale on hover — works fine with contain */
.rc-card:not(.rc-card--has-gallery):hover .rc-card__cf-img--primary {
  transform: scale(1.03);
}

/* ── Image fit: contain mode ────────────────────────────────────────────────── */
/* Shows the full image with no cropping. Card background fills the letterbox   */
/* areas — works best when product photos have a white or neutral background.   */
body.rc-img-contain .rc-card__img-wrap {
  background: #fff;
}
body.rc-img-contain .rc-card__cf-img {
  object-fit: contain;
}
/* Disable the scale-on-hover in contain mode — scaling a contained image shows */
/* the background peeking around the edges, which looks wrong.                  */
body.rc-img-contain .rc-card:not(.rc-card--has-gallery):hover .rc-card__cf-img--primary {
  transform: none;
}
/* Touch devices: flat 2D slide — no perspective rotateY */
@media (hover: none) {
  .rc-card__coverflow { perspective: none; }
}
/* Per-preset transition easing — each type gets distinct physics */
[data-cf-type="0"] .rc-card__cf-img {
  transition: transform 340ms cubic-bezier(0.4, 0, 0.2, 1),
              opacity 280ms ease;
}
[data-cf-type="1"] .rc-card__cf-img {
  transition: transform 400ms cubic-bezier(0.34, 1.56, 0.64, 1),
              opacity 300ms ease;
}
[data-cf-type="2"] .rc-card__cf-img {
  transition: transform 380ms cubic-bezier(0.16, 1, 0.3, 1),
              opacity 300ms ease;
}
[data-cf-type="3"] .rc-card__cf-img {
  transition: transform 600ms ease,
              opacity 550ms ease;
}
[data-cf-type="4"] .rc-card__cf-img {
  transition: transform 220ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
              opacity 180ms ease;
}

/* ── Badges ───────────────────────────────────────────────────────────────── */
.rc-card__badge {
  position: absolute;
  top: 0.625rem;
  left: 0.625rem;
  z-index: 2;
  padding: 0.2rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  border-radius: 4px;
  pointer-events: none;
  line-height: 1.5;
}
.rc-card__badge--sale     { background: #ef4444; color: var(--rc-btn-text); }
.rc-card__badge--oos      { background: rgba(0,0,0,0.55); color: var(--rc-btn-text); }
.rc-card__badge--featured { background: var(--rc-accent); color: var(--rc-btn-text); }
.rc-card__badge--new      { background: var(--rc-primary); color: var(--rc-btn-text); }

/* ── Hover actions ────────────────────────────────────────────────────────── */
.rc-card__actions {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.875rem 0.75rem;
  background: linear-gradient(0deg, rgba(0,0,0,0.48) 0%, transparent 100%);
  transform: translateY(100%);
  opacity: 0;
  transition: transform 260ms var(--rc-ease), opacity 260ms var(--rc-ease);
  pointer-events: none;
  /* Must be above coverflow images (z-index 3 max from coverflowStyle) so the
     action bar isn't buried under the image layer on gallery cards. */
  z-index: 4;
}
/* flex-wrap above lets icons drop to a 2nd row on their own whenever a narrower
   card (higher column count) can't fit them on one line — no fixed breakpoint
   needed, it only wraps when it actually doesn't fit. */
@media (max-width: 767px) {
  .rc-card__action-btn--mobile-hide { display: none; }
}
.rc-card:hover .rc-card__actions {
  transform: translateY(0);
  opacity: 1;
  pointer-events: all;
}

.rc-card__action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex-shrink: 0;
  background: color-mix(in srgb, var(--rc-white) 92%, transparent);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--rc-text);
  border: none;
  cursor: pointer;
  transition: background 150ms, transform 100ms, color 150ms, box-shadow 150ms;
  position: relative;
}
.rc-card__action-btn:hover {
  background: var(--rc-white);
  color: var(--rc-primary);
  transform: translateY(-2px);
  box-shadow: var(--rc-shadow);
}
.rc-card__action-btn:active { transform: scale(0.92); }

/* Tooltip */
.rc-card__action-btn::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 7px);
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 8px;
  background: rgba(0,0,0,0.82);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 500;
  border-radius: 5px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 150ms;
}
.rc-card__action-btn:hover::after { opacity: 1; }

/* Buy Now card button — warm amber signals "instant purchase" */
.rc-card__action-btn--buy-now:hover {
  background: #fff7ed;
  color: #ea580c;
  border-color: #fb923c;
  box-shadow: 0 2px 10px rgba(234, 88, 12, 0.22);
}
.rc-card__action-btn--buy-now:hover::after {
  background: #ea580c;
}

/* Buy Now hint line — below button on single product + quick view */
.rc-buy-now-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: 0.6875rem;
  color: var(--rc-muted);
  margin-top: 6px;
  letter-spacing: 0.01em;
  line-height: 1.3;
  opacity: 0.9;
}
.rc-buy-now-note svg { flex-shrink: 0; opacity: 0.7; }
.rc-buy-now-note strong { color: var(--rc-text); font-weight: 600; }

/* ATC button — wider pill */
.rc-card__action-btn--atc {
  width: auto;
  border-radius: 20px;
  padding: 0 1rem;
  font-size: 0.8125rem;
  font-weight: 700;
  gap: 0.375rem;
  height: 36px;
  background: var(--rc-primary);
  color: #fff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.rc-card__action-btn--atc:hover {
  background: var(--rc-primary-dark);
  color: #fff;
  transform: translateY(-2px);
}
.rc-card__action-btn--added,
.rc-card__action-btn--atc.rc-card__action-btn--added {
  background: var(--rc-success) !important;
  color: #fff !important;
}
.rc-card__atc-label { font-size: 0.8125rem; }

/* ── Card body ────────────────────────────────────────────────────────────── */
.rc-card__body {
  padding: 0.875rem;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.3rem;
}

.rc-card__rating {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  color: var(--rc-muted);
}
.rc-card__stars { color: #f59e0b; font-size: 0.75rem; letter-spacing: -1px; }
.rc-card__rating-count { font-size: 0.75rem; color: var(--rc-muted); }

.rc-card__title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--rc-text);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}
.rc-card__title-link { text-decoration: none; color: inherit; }
.rc-card__title-link:hover { color: var(--rc-primary); }

.rc-card__stock {
  font-size: 0.75rem;
  font-weight: 600;
  color: #d97706;
  margin: 0;
}

.rc-card__price-wrap {
  margin-top: auto;
  padding-top: 0.375rem;
  font-size: 1rem;
  font-weight: 800;
  color: var(--rc-text);
}
/* WooCommerce price elements */
.rc-card__price-wrap .woocommerce-Price-amount { font-weight: inherit; }
.rc-card__price-wrap ins  { text-decoration: none; color: #dc2626; }
.rc-card__price-wrap del  {
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--rc-muted);
  text-decoration: line-through;
  margin-right: 0.375rem;
}
.rc-card__price-wrap del .woocommerce-Price-amount { color: inherit; font-weight: inherit; }

/* ═══════════════════════════════════════════════════════════════════════════
   16. CAROUSEL
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-carousel-wrap { position: relative; }
.rc-product-carousel { overflow: hidden; padding-bottom: 3rem; }
.rc-product-carousel .swiper-slide {
  height: auto;
  display: flex;
  flex-direction: column;
}
.rc-product-carousel .swiper-slide .rc-card { width: 100%; }

/* ── Swiper navigation — themed to brand colours ────────────────────────── */
.rc-product-carousel .swiper-button-next,
.rc-product-carousel .swiper-button-prev {
  width: 40px;
  height: 40px;
  margin-top: -44px;
  background: var(--rc-white);
  border: 1.5px solid var(--rc-border);
  border-radius: 50%;
  color: var(--rc-text);
  box-shadow: var(--rc-shadow);
  transition: background 160ms var(--rc-ease), border-color 160ms var(--rc-ease), color 160ms var(--rc-ease), transform 160ms var(--rc-ease);
}
.rc-product-carousel .swiper-button-next::after,
.rc-product-carousel .swiper-button-prev::after {
  font-size: 13px;
  font-weight: 700;
}
.rc-product-carousel .swiper-button-next:hover,
.rc-product-carousel .swiper-button-prev:hover {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: #fff;
  transform: scale(1.08);
}
.rc-product-carousel .swiper-button-disabled {
  opacity: 0.35;
  pointer-events: none;
}
/* ── Swiper pagination dots ─────────────────────────────────────────────── */
.rc-product-carousel .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
  background: var(--rc-border-dark);
  opacity: 1;
  transition: width 200ms var(--rc-ease), background 200ms;
  border-radius: 3px;
}
.rc-product-carousel .swiper-pagination-bullet-active {
  width: 18px;
  background: var(--rc-primary);
}

/* ═══════════════════════════════════════════════════════════════════════════
   17. SHOP LAYOUT
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-shop-main { background: var(--rc-white); }

.rc-shop-wrap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 1024px) {
  .rc-shop-wrap--sidebar {
    grid-template-columns: 300px 1fr;
    align-items: start;
  }
}

.rc-shop-sidebar {
  background: var(--rc-white);
}
.rc-shop-sidebar .widget {
  margin-bottom: 1.75rem;
}
.rc-shop-sidebar .widget-title,
.rc-shop-sidebar h3 {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--rc-text);
  padding-bottom: 0.75rem;
  margin-bottom: 1rem;
  border-bottom: 2px solid var(--rc-primary);
}

/* Widget search button */
.rc-shop-sidebar .widget_search input[type="submit"],
.rc-shop-sidebar .search-submit {
  background: var(--rc-primary);
  color: #fff;
  border: none;
  border-radius: var(--rc-radius);
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 150ms;
}
.rc-shop-sidebar .widget_search input[type="submit"]:hover,
.rc-shop-sidebar .search-submit:hover { opacity: 0.88; }

.rc-shop-products { min-width: 0; }

.rc-shop-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.75rem;
  flex-wrap: wrap;
}
.rc-shop-title {
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--rc-text);
  margin: 0 0 0.125rem;
}

.rc-no-products {
  color: var(--rc-muted);
  text-align: center;
  padding: 3rem 1rem;
  font-size: 0.9375rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   18. HOMEPAGE SECTIONS
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Shared section wrapper ─────────────────────────────────────────────── */
.rc-home-section {
  padding: clamp(4rem, 8vw, 7rem) 0;
}
.rc-home-section--carousel { background: var(--rc-white); }
.rc-home-section--categories { background: var(--rc-surface); }
.rc-home-section--testimonials { background: var(--rc-white); }

/* ── Section headings (shared across homepage + shortcodes) ─────────────── */
.rc-section-header {
  margin-bottom: clamp(2rem, 4vw, 3rem);
  text-align: center;
}
.rc-section-title {
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  color: var(--rc-text);
  line-height: 1.1;
  margin: 0;
}
.rc-section-sub {
  font-size: 1rem;
  /* var(--rc-muted) alone passes fine on the usual light surfaces (~5:1) but
     drops to ~2.4:1 when a block sits on one of WordPress's own saturated
     palette colors (e.g. the demo content's pale-pink category-grid section).
     Mixed toward var(--rc-text) — NOT a hardcoded black — so this pushes in
     the correct direction on every palette, including "Midnight", where
     --rc-text is near-white and --rc-muted is already a *light* colour on a
     *dark* surface; mixing toward black there would have made it lighter-on-
     dark text darker, i.e. actively worse. Verified against all 5 built-in
     presets' own surface colours plus the pink demo-content case. */
  color: color-mix(in srgb, var(--rc-muted) 40%, var(--rc-text));
  margin: 0.625rem auto 0;
  max-width: 480px;
  line-height: 1.6;
}

/* ── Homepage hero sizing ────────────────────────────────────────────────── */
.rc-home-hero {
  min-height: 75vh;
  display: flex;
  align-items: center;
}
.rc-home-hero .rc-hero__inner { width: 100%; }
@media (max-width: 767px) {
  .rc-home-hero { min-height: 60vh; }
}

/* ── Category showcase grid ─────────────────────────────────────────────── */
.rc-cat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
}
.rc-cat-grid--2 { grid-template-columns: repeat(2, 1fr); }
.rc-cat-grid--3 { grid-template-columns: repeat(3, 1fr); }
.rc-cat-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 767px) {
  .rc-cat-grid--3,
  .rc-cat-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 479px) {
  .rc-cat-grid--2,
  .rc-cat-grid--3,
  .rc-cat-grid--4 { grid-template-columns: 1fr 1fr; }
}

.rc-cat-card {
  position: relative;
  aspect-ratio: var(--rc-cat-ar, 3/4);
  overflow: hidden;
  border-radius: var(--rc-radius-lg);
  display: block;
  text-decoration: none;
  background: var(--rc-surface);
  transition: box-shadow 250ms var(--rc-ease);
}
.rc-cat-card:hover { box-shadow: var(--rc-shadow-lg); }
.rc-cat-card:focus-visible { outline: 2px solid var(--rc-primary); outline-offset: 3px; }

.rc-cat-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 550ms var(--rc-ease);
  display: block;
}
.rc-cat-card:hover .rc-cat-card__img { transform: scale(1.06); }

.rc-cat-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0) 55%);
  pointer-events: none;
}

.rc-cat-card__body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem 1.25rem 1.25rem;
  color: #fff;
}
.rc-cat-card__name {
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  display: block;
  margin-bottom: 0.25rem;
}
.rc-cat-card__count { font-size: 0.8125rem; opacity: 0.75; }

/* Placeholder cards (no category image) */
.rc-cat-card--placeholder {
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
}
.rc-cat-card--placeholder .rc-cat-card__overlay { display: none; }
.rc-cat-card--placeholder .rc-cat-card__body {
  position: static;
  padding: 2rem 1.25rem;
  color: var(--rc-text);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.rc-cat-card--placeholder .rc-cat-card__name { color: var(--rc-text); }
.rc-cat-card--placeholder .rc-cat-card__count { color: var(--rc-muted); }

/* ── Card style: image above, caption below ─────────────────────────────── */
.rc-cat-card--card {
  aspect-ratio: unset;
  display: flex;
  flex-direction: column;
}
.rc-cat-card--card .rc-cat-card__img {
  width: 100%;
  height: auto;
  aspect-ratio: var(--rc-cat-ar, 3/4);
  flex-shrink: 0;
}
.rc-cat-card--card .rc-cat-card__body {
  position: static;
  flex: 1;
  padding: 0.875rem 1rem;
  color: var(--rc-text);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.rc-cat-card--card .rc-cat-card__name {
  color: var(--rc-text);
  font-size: 0.9375rem;
  font-weight: 600;
  margin-bottom: 0.125rem;
}
.rc-cat-card--card .rc-cat-card__count { color: var(--rc-muted); opacity: 1; }

/* ── Minimal style: lighter overlay, name only, no product reveal ────────── */
.rc-cat-card--minimal .rc-cat-card__overlay {
  background: linear-gradient(to top, rgba(0,0,0,0.52) 0%, rgba(0,0,0,0) 42%);
}
.rc-cat-card--minimal .rc-cat-card__name { font-size: 0.9375rem; font-weight: 600; }

/* ── Category product hover reveal — "melting fall" ─────────────────────── */
@keyframes rc-prod-fall {
  0%   { transform: translateY(-36px) scaleY(0.55) scaleX(1.2); opacity: 0; filter: blur(4px); }
  52%  { transform: translateY(5px) scaleY(1.08) scaleX(0.95); opacity: 1; filter: blur(0); }
  70%  { transform: translateY(-2px) scaleY(0.97) scaleX(1.02); }
  84%  { transform: translateY(1px) scaleY(1.01) scaleX(0.99); }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}

.rc-cat-card__products {
  position: absolute;
  bottom: 3.75rem; /* sit above the category name strip */
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 0 1rem;
  pointer-events: none;
  z-index: 3;
}

.rc-cat-prod-thumb {
  width: 52px;
  height: 68px;
  border-radius: 7px;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,0.88);
  box-shadow: 0 6px 18px rgba(0,0,0,0.28);
  /* default: above and invisible — fades back on mouse-out via transition */
  opacity: 0;
  transform: translateY(-28px) scaleY(0.65) scaleX(1.15);
  transition: opacity 220ms ease, transform 220ms ease;
}
.rc-cat-prod-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* On hover: run the liquid fall animation */
.rc-cat-card:hover .rc-cat-prod-thumb {
  transition: none;
  animation: rc-prod-fall 580ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
.rc-cat-card:hover .rc-cat-prod-thumb:nth-child(2) { animation-delay: 110ms; }
.rc-cat-card:hover .rc-cat-prod-thumb:nth-child(3) { animation-delay: 220ms; }

/* Mobile (no hover): show as a static mini-collage — always visible, floated to top */
@media (hover: none) {
  .rc-cat-prod-thumb {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .rc-cat-card__products {
    bottom: auto;
    top: 12px;
  }
}

/* Admin opted out of touch preview via block toggle */
@media (hover: none) {
  .rc-hide-touch-preview .rc-cat-card__products { display: none; }
}

/* ── Promo banner ────────────────────────────────────────────────────────── */
.rc-promo-banner {
  padding: clamp(3rem, 6vw, 5rem) 0;
  background: var(--rc-primary);
  color: #fff;
  text-align: center;
}
.rc-promo-banner__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.875rem;
}
.rc-promo-banner__heading {
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0;
  color: inherit;
}
.rc-promo-banner__sub {
  font-size: 1rem;
  opacity: 0.8;
  margin: 0;
  max-width: 520px;
}
.rc-promo-banner__cta { margin-top: 0.625rem; }

/* White-outline button for use on dark/coloured banner backgrounds */
.rc-btn--white {
  background: var(--rc-white);
  color: var(--rc-primary);
  border: 2px solid var(--rc-white);
}
.rc-btn--white:hover {
  background: transparent;
  color: var(--rc-btn-text);
}

/* ── Testimonials ────────────────────────────────────────────────────────── */
.rc-testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
@media (max-width: 1023px) {
  .rc-testimonials-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 639px) {
  .rc-testimonials-grid { grid-template-columns: 1fr; }
}

.rc-testimonial {
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.rc-testimonial__stars {
  display: flex;
  gap: 3px;
  color: #f59e0b;
}
.rc-testimonial__text {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--rc-text);
  font-style: italic;
  flex: 1;
  margin: 0;
}
.rc-testimonial__author {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-muted);
}

/* ═══════════════════════════════════════════════════════════════════════════
   19. FORMS & INPUTS
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-form-group { margin-bottom: 1rem; }
.rc-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  margin-bottom: 0.375rem;
}
.rc-input {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: 8px;
  font: inherit;
  font-size: 0.9375rem;
  color: var(--rc-text);
  background: var(--rc-white);
  transition: border-color 200ms, box-shadow 200ms;
  outline: none;
  -webkit-appearance: none;
}
.rc-input:focus {
  border-color: var(--rc-primary);
  box-shadow: 0 0 0 3px rgba(var(--rc-primary-rgb), 0.12);
}
.rc-input--sm { padding: 0.4375rem 0.75rem; font-size: 0.875rem; }

.rc-msg--success { color: var(--rc-success); font-size: 0.8125rem; margin-top: 0.375rem; }
.rc-msg--error   { color: var(--rc-error);   font-size: 0.8125rem; margin-top: 0.375rem; }

/* ═══════════════════════════════════════════════════════════════════════════
   20. ACCOUNT PANEL
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-account-links { list-style: none; margin: 0; padding: 0; }
.rc-account-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9375rem 0;
  border-bottom: 1px solid var(--rc-border);
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  transition: color 150ms, padding-left 150ms;
}
.rc-account-link:hover { color: var(--rc-primary); padding-left: 0.375rem; }
.rc-account-links li:last-child .rc-account-link { border-bottom: none; }

.rc-auth-tabs {
  display: flex;
  border-bottom: 2px solid var(--rc-border);
  margin-bottom: 1.5rem;
}
.rc-auth-tab {
  flex: 1;
  padding: 0.75rem;
  border: none;
  background: transparent;
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--rc-muted);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color 150ms, border-color 150ms;
}
.rc-auth-tab.active { color: var(--rc-primary); border-bottom-color: var(--rc-primary); }

/* WP login form */
.rc-drawer__body #loginform .login-username,
.rc-drawer__body #loginform .login-password,
.rc-drawer__body #loginform .login-remember { margin-bottom: 1rem; }
.rc-drawer__body #loginform label { font-size: 0.875rem; font-weight: 600; display: block; margin-bottom: 0.375rem; }
.rc-drawer__body #loginform input[type="text"],
.rc-drawer__body #loginform input[type="password"],
.rc-drawer__body #loginform input[type="email"] {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: 8px;
  font: inherit;
  font-size: 0.9375rem;
  background: var(--rc-white);
  color: var(--rc-text);
  transition: border-color 200ms;
  outline: none;
}
.rc-drawer__body #loginform input[type="text"]:focus,
.rc-drawer__body #loginform input[type="password"]:focus { border-color: var(--rc-primary); }
.rc-drawer__body #loginform input[type="submit"],
.rc-drawer__body #loginform #wp-submit {
  width: 100%;
  padding: 0.75rem 1.5rem;
  background: var(--rc-primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 150ms;
  margin-top: 0.25rem;
}
.rc-drawer__body #loginform input[type="submit"]:hover,
.rc-drawer__body #loginform #wp-submit:hover { background: var(--rc-primary-dark); }

/* ═══════════════════════════════════════════════════════════════════════════
   21. MOBILE MENU
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-mobile-nav { list-style: none; margin: 0; padding: 0; }
.rc-mobile-nav li { border-bottom: 1px solid var(--rc-border); }
.rc-mobile-nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.375rem;
  font-size: 1rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  transition: color 150ms, background 150ms;
}
.rc-mobile-nav a:hover { color: var(--rc-primary); background: var(--rc-surface); }
.rc-mobile-nav .current-menu-item > a { color: var(--rc-primary); }

/* ═══════════════════════════════════════════════════════════════════════════
   22. SOCIAL PROOF TOAST
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-sp-toast {
  position: fixed;
  bottom: 80px;
  left: 1rem;
  z-index: 9998;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: var(--sp-bg, var(--rc-white));
  color: var(--sp-text, var(--rc-text));
  border: 1px solid var(--sp-border, var(--rc-border));
  border-radius: var(--sp-radius, 12px);
  padding: 0.875rem 1rem;
  max-width: 300px;
  box-shadow: var(--rc-shadow-lg);
  /* default slide-from-left (bottom-left) */
  transform: translateX(calc(-100% - 2rem));
  transition: transform 400ms cubic-bezier(0.32, 0.72, 0, 1), opacity 400ms ease;
  opacity: 0;
}
/* Position variants */
.rc-sp-toast--bottom-left  { left: 1rem; right: auto; }
.rc-sp-toast--bottom-right { right: 1rem; left: auto; }
/* Slide direction */
.rc-sp-toast--slide-left  { transform: translateX(calc(-100% - 2rem)); }
.rc-sp-toast--slide-right { transform: translateX(calc(100% + 2rem)); }
/* When the toast is on the right and slides from right, adjust for right-anchored position */
.rc-sp-toast--bottom-right.rc-sp-toast--slide-right { transform: translateX(calc(100% + 2rem)); }
.rc-sp-toast--bottom-right.rc-sp-toast--slide-left  { transform: translateX(calc(-100% - 2rem)); }
/* Visible state — all variants */
.rc-sp-toast--visible { transform: translateX(0) !important; opacity: 1; }
@media (min-width: 1024px) { .rc-sp-toast { bottom: 1.5rem; } }

/* ═══════════════════════════════════════════════════════════════════════════
   23. FOOTER
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-footer {
  background: var(--rc-footer-bg, #111110);
  color: var(--rc-footer-text, #d4d4cf);
}
/* opacity was 0.75 — fine on 4 of 5 built-in presets (huge margins, 9–13:1
   even dimmed) but on "Midnight" it compounds with an already-tight footer
   text/background pairing and drops under 4.5:1. 0.92 keeps a faint at-rest
   vs. hover distinction without failing the preset with the least room. */
.rc-footer a { color: var(--rc-footer-text, #d4d4cf); opacity: 0.92; text-decoration: none; transition: opacity 150ms; }
.rc-footer a:hover { opacity: 1; }
.rc-footer .widget-title,
.rc-footer h3 {
  color: #fff !important;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 1rem;
}
.rc-footer ul { list-style: none; padding: 0; margin: 0; }
.rc-footer ul li { margin-bottom: 0.5rem; }
.rc-footer ul a { font-size: 0.9375rem; }

/* ── Newsletter band ────────────────────────────────────────────────────── */
.rc-footer__newsletter {
  padding: 2rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.rc-footer__newsletter-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2.5rem;
  flex-wrap: wrap;
}
.rc-footer__newsletter-copy { flex: 1; min-width: 260px; }
.rc-footer__newsletter-hdg {
  font-size: clamp(1.25rem, 2.5vw, 1.625rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #fff;
  margin: 0 0 0.375rem;
}
.rc-footer__newsletter-sub {
  font-size: 0.9375rem;
  opacity: 0.7;
  margin: 0;
  line-height: 1.55;
}
.rc-footer__newsletter-form { flex: 0 0 auto; width: 100%; max-width: 420px; }
.rc-footer__newsletter-row {
  display: flex;
  gap: 0.5rem;
}
.rc-footer__newsletter-input {
  flex: 1;
  height: 44px;
  padding: 0 1rem;
  background: rgba(255,255,255,0.08);
  border: 1.5px solid rgba(255,255,255,0.15);
  border-radius: var(--rc-radius);
  color: #fff;
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  outline: none;
  transition: border-color 180ms;
}
.rc-footer__newsletter-input::placeholder { color: rgba(255,255,255,0.4); }
.rc-footer__newsletter-input:focus { border-color: rgba(255,255,255,0.45); }
.rc-footer__newsletter-btn {
  height: 44px;
  white-space: nowrap;
  flex-shrink: 0;
}
.rc-footer__newsletter-error { font-size: 0.8125rem; color: var(--rc-error, #ef4444); margin: 0.375rem 0 0; }
.rc-footer__newsletter-success { font-size: 0.9375rem; color: var(--rc-success, #22c55e); margin: 0.75rem 0 0; font-weight: 500; }
@media (max-width: 767px) {
  .rc-footer__newsletter-inner { flex-direction: column; gap: 1.5rem; }
  .rc-footer__newsletter-form { width: 100%; max-width: 100%; }
}

/* ── Widget columns ─────────────────────────────────────────────────────── */
.rc-footer__widgets { padding: 1.75rem 0 1.25rem; }

.rc-footer__grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px)  { .rc-footer__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {
  .rc-footer__grid--2 { grid-template-columns: repeat(2, 1fr); }
  .rc-footer__grid--3 { grid-template-columns: repeat(3, 1fr); }
  .rc-footer__grid--4 { grid-template-columns: 1.5fr repeat(3, 1fr); }
}
.rc-footer__col { }

/* ── Brand column ───────────────────────────────────────────────────────── */
.rc-footer__brand-col { display: flex; flex-direction: column; gap: 1rem; }
.rc-footer__logo .custom-logo-link { display: inline-flex; align-items: center; }
.rc-footer__logo .custom-logo,
.rc-footer__logo svg { max-height: 28px; height: auto; width: auto; max-width: 160px; filter: brightness(10); }
.rc-footer__site-name { font-size: 1.125rem; font-weight: 800; color: var(--rc-btn-text); letter-spacing: -0.02em; }
/* opacity: 0.6 measured at 4.32:1 against the footer background — just under
   the 4.5:1 AA minimum. 0.72 keeps the same "muted" intent with a real margin
   (~7:1) instead of one that only worked for whichever exact colors this
   palette happened to use. */
/* No opacity here — plain (non-link) text has no hover state to justify
   dimming, and on "Midnight" even a small opacity reduction was enough to
   drop this under 4.5:1 (that preset's footer text/background pairing has
   very little contrast margin to begin with). */
.rc-footer__tagline { font-size: 0.9375rem; line-height: 1.5; margin: 0; max-width: 260px; }
.rc-footer__social {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-top: 0.25rem;
}
.rc-footer__social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,0.2);
  color: var(--rc-footer-text, #d4d4cf);
  opacity: 1 !important;
  transition: background 160ms, border-color 160ms, color 160ms;
}
.rc-footer__social-link:hover {
  background: rgba(255,255,255,0.1);
  border-color: rgba(255,255,255,0.4);
  color: #fff;
}

/* ── Bottom bar ─────────────────────────────────────────────────────────── */
.rc-footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding: 0.875rem 0;
}
.rc-footer__bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}
/* No opacity here on purpose: it contains a plain-text run AND a link that
   already dims itself via `.rc-footer a { opacity: 0.75 }` below — an
   opacity here would COMPOUND with that (0.65 × 0.75 ≈ 0.49 effective),
   which is what pushed the link to 3.34:1, well under the 4.5:1 minimum.
   Opacity multiplies with every ancestor's opacity; color does not, so it's
   the only one of the two that's safe to stack. */
.rc-footer__copy { font-size: 0.875rem; margin: 0; }
.rc-footer__copy a { font-weight: 500; }

/* ── Payment icons ──────────────────────────────────────────────────────── */
.rc-footer__payment {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  flex-wrap: wrap;
}
.rc-payment-icon {
  display: inline-flex;
  opacity: 0.7;
  transition: opacity 150ms;
}
.rc-payment-icon:hover { opacity: 1; }

/* ═══════════════════════════════════════════════════════════════════════════
   24. ADMIN — SHORTCODE BUILDER COPY BUTTON
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-copy-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background: var(--rc-primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 150ms, transform 80ms;
  margin-top: 0.75rem;
}
.rc-copy-btn:hover  { background: var(--rc-primary-dark); }
.rc-copy-btn:active { transform: scale(0.97); }
.rc-copy-btn--copied { background: var(--rc-success) !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   25. WOOCOMMERCE OVERRIDES
   ═══════════════════════════════════════════════════════════════════════════ */

/* Force our grid on WC archive loop */
.woocommerce ul.products,
.woocommerce-page ul.products {
  display: grid !important;
  gap: 1.25rem !important;
  grid-template-columns: repeat(2, 1fr) !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: both !important;
}
@media (min-width: 768px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (min-width: 1024px) {
  .woocommerce ul.products.columns-4,
  .woocommerce-page ul.products.columns-4 { grid-template-columns: repeat(4, 1fr) !important; }
  .woocommerce ul.products.columns-3,
  .woocommerce-page ul.products.columns-3 { grid-template-columns: repeat(3, 1fr) !important; }
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide WC default output our card replaces */
.woocommerce-loop-product__title     { display: none !important; }
.woocommerce .star-rating             { display: none; }
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link:not(.rc-card) { display: none !important; }

/* WC price */
.woocommerce-Price-amount { font-weight: 700; }
.price ins  { text-decoration: none; }
.price del  { opacity: 0.6; }

/* WC sorting */
.woocommerce-ordering select {
  padding: 0.5rem 2.25rem 0.5rem 0.875rem !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: 8px !important;
  font: inherit !important;
  font-size: 0.875rem !important;
  background-color: var(--rc-white) !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 0.625rem center !important;
  outline: none !important;
  transition: border-color 200ms !important;
}
.woocommerce-ordering select:focus { border-color: var(--rc-primary) !important; }

/* WC result count */
.woocommerce-result-count {
  font-size: 0.875rem;
  color: var(--rc-muted);
  margin: 0;
}

/* WC notices — padding/!important restores WC's own icon-reserved spacing,
   which .entry-content ul (higher selector specificity) otherwise collapses
   on any page where notices render inside post/page content (login, account). */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  padding: 1em 1.5em 1em 3.5em !important;
  border-radius: var(--rc-radius) !important;
  border: none !important;
  margin-bottom: 1.5rem !important;
  box-shadow: none !important;
}
.woocommerce-message a,
.woocommerce-info a,
.woocommerce-error a { font-weight: 600; text-decoration: underline; }

.woocommerce-message {
  background: color-mix(in srgb, var(--rc-success) 10%, var(--rc-white)) !important;
  color: var(--rc-text) !important;
}
.woocommerce-message::before { color: var(--rc-success) !important; }
.woocommerce-message a { color: var(--rc-success-dark, var(--rc-success)); }

.woocommerce-info {
  background: color-mix(in srgb, var(--rc-warning) 12%, var(--rc-white)) !important;
  color: var(--rc-text) !important;
}
.woocommerce-info::before { color: var(--rc-warning) !important; }
.woocommerce-info a { color: var(--rc-warning); }

.woocommerce-error {
  background: color-mix(in srgb, var(--rc-error) 10%, var(--rc-white)) !important;
  color: var(--rc-text) !important;
}
.woocommerce-error::before { color: var(--rc-error) !important; }
.woocommerce-error a { color: var(--rc-error); }

/* WC gives notices tabindex="-1" and focuses them for a11y on load — match the
   focus ring to the notice's own color instead of the site-wide primary color. */
.woocommerce-message:focus,
.woocommerce-message:focus-visible { outline-color: var(--rc-success) !important; }
.woocommerce-info:focus,
.woocommerce-info:focus-visible { outline-color: var(--rc-warning) !important; }
.woocommerce-error:focus,
.woocommerce-error:focus-visible { outline-color: var(--rc-error) !important; }

/* WC Blocks (Cart/Checkout) notices — same red/amber/green tokens as the classic
   .woocommerce-error/-info/-message above, so both rendering paths match. */
.wc-block-components-notice-banner {
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font);
}
.wc-block-components-notice-banner.is-error {
  background-color: color-mix(in srgb, var(--rc-error) 10%, var(--rc-white)) !important;
  border-color: var(--rc-error) !important;
  color: var(--rc-text) !important;
}
.wc-block-components-notice-banner.is-error > svg { background-color: var(--rc-error) !important; }
.wc-block-components-notice-banner.is-warning {
  background-color: color-mix(in srgb, var(--rc-warning) 12%, var(--rc-white)) !important;
  border-color: var(--rc-warning) !important;
  color: var(--rc-text) !important;
}
.wc-block-components-notice-banner.is-warning > svg { background-color: var(--rc-warning) !important; }
.wc-block-components-notice-banner.is-success {
  background-color: color-mix(in srgb, var(--rc-success) 10%, var(--rc-white)) !important;
  border-color: var(--rc-success) !important;
  color: var(--rc-text) !important;
}
.wc-block-components-notice-banner.is-success > svg { background-color: var(--rc-success) !important; }
.wc-block-components-notice-banner.is-info {
  background-color: color-mix(in srgb, var(--rc-primary) 8%, var(--rc-white)) !important;
  border-color: var(--rc-primary) !important;
  color: var(--rc-text) !important;
}
.wc-block-components-notice-banner.is-info > svg { background-color: var(--rc-primary) !important; }

/* WC Blocks inline field-validation error (e.g. checkout coupon field) — WC's own
   red (#dc2626) doesn't match the theme's --rc-error, and at 13px/400-weight it
   reads as an afterthought next to the rest of the order-summary card. */
.wc-block-components-validation-error {
  background: color-mix(in srgb, var(--rc-error) 8%, var(--rc-white));
  border-radius: var(--rc-radius-sm);
  padding: 0.5rem 0.625rem !important;
  margin-top: 0.5rem !important;
}
.wc-block-components-validation-error p {
  color: var(--rc-error) !important;
  font-weight: 600;
  font-size: 0.8125rem;
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.wc-block-components-validation-error svg { fill: var(--rc-error) !important; }

/* WC pagination */
.woocommerce nav.woocommerce-pagination {
  margin-top: 2.5rem !important;
}
.woocommerce nav.woocommerce-pagination ul {
  display: flex !important;
  justify-content: center !important;
  gap: 0.375rem !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.woocommerce nav.woocommerce-pagination ul li { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 8px !important;
  border: 1.5px solid var(--rc-border) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: var(--rc-text) !important;
  text-decoration: none !important;
  transition: all 150ms !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--rc-primary) !important;
  border-color: var(--rc-primary) !important;
  color: #fff !important;
}

/* ── WC Single Product ───────────────────────────────────────────────────── */
.woocommerce div.product {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: start;
}
@media (max-width: 767px) {
  .woocommerce div.product { grid-template-columns: 1fr; }
}
.woocommerce div.product div.images { }
.woocommerce div.product div.summary { }

/* Gallery */
.woocommerce div.product .woocommerce-product-gallery__image img {
  border-radius: 10px;
  border: 1px solid var(--rc-border);
}
.woocommerce div.product .flex-control-thumbs {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.625rem;
  padding: 0;
  list-style: none;
}
.woocommerce div.product .flex-control-thumbs li img {
  border-radius: 6px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color 150ms;
}
.woocommerce div.product .flex-control-thumbs li img.flex-active {
  border-color: var(--rc-primary);
}

/* Product title */
.woocommerce div.product h1.product_title {
  font-size: 1.75rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.2 !important;
  margin: 0 0 0.5rem !important;
  color: var(--rc-text) !important;
}

/* Price */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-size: 1.625rem !important;
  font-weight: 800 !important;
  color: var(--rc-primary) !important;
  margin-bottom: 1.25rem !important;
}
.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins { text-decoration: none !important; color: #dc2626 !important; }
.woocommerce div.product p.price del,
.woocommerce div.product span.price del { font-size: 1rem !important; color: var(--rc-muted) !important; margin-right: 0.375rem !important; }

/* ATC button */
.woocommerce div.product .single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button {
  background: var(--rc-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 0.875rem 2rem !important;
  font: inherit !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background 150ms, transform 80ms, box-shadow 150ms !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
}
.woocommerce div.product .single_add_to_cart_button:hover {
  background: var(--rc-primary-dark) !important;
  box-shadow: 0 4px 14px rgba(var(--rc-primary-rgb), 0.3) !important;
  transform: translateY(-1px) !important;
}

/* Short desc */
.woocommerce div.product .woocommerce-product-details__short-description {
  font-size: 0.9375rem;
  color: var(--rc-muted);
  line-height: 1.65;
  margin-bottom: 1.25rem;
}
.woocommerce div.product .woocommerce-product-details__short-description p { margin: 0 0 0.5rem; }

/* Tabs */
.woocommerce div.product .woocommerce-tabs { clear: both; margin-top: 3rem; grid-column: 1 / -1; }
.woocommerce div.product .woocommerce-tabs ul.tabs {
  display: flex !important;
  border-bottom: 2px solid var(--rc-border) !important;
  padding: 0 !important;
  margin: 0 0 0 !important;
  list-style: none !important;
  gap: 0 !important;
  background: none !important;
  overflow: visible !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: block !important;
  padding: 0.75rem 1.25rem !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  color: var(--rc-muted) !important;
  text-decoration: none !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -2px !important;
  transition: color 150ms, border-color 150ms !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--rc-text) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--rc-primary) !important;
  border-bottom-color: var(--rc-primary) !important;
}
.woocommerce div.product .woocommerce-tabs .panel {
  padding: 1.5rem 0 !important;
  border: none !important;
  background: none !important;
  margin: 0 !important;
  box-shadow: none !important;
}
.woocommerce div.product .woocommerce-tabs .panel::before,
.woocommerce div.product .woocommerce-tabs .panel::after { display: none !important; }

/* Related products */
.woocommerce .related h2,
.woocommerce .upsells h2 {
  font-size: 1.375rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  margin-bottom: 1.5rem !important;
  color: var(--rc-text) !important;
}
.woocommerce .related ul.products,
.woocommerce .upsells ul.products {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (max-width: 767px) {
  .woocommerce .related ul.products,
  .woocommerce .upsells ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   26. BREADCRUMBS
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-breadcrumbs { margin: 0 0 1rem; }
.rc-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.8125rem;
}
.rc-breadcrumbs a { color: var(--rc-muted); transition: color 150ms; }
.rc-breadcrumbs a:hover { color: var(--rc-primary); }
.rc-breadcrumb-sep { color: var(--rc-muted); font-size: 0.75rem; }

/* WC breadcrumb */
.woocommerce .woocommerce-breadcrumb {
  font-size: 0.8125rem !important;
  color: var(--rc-muted) !important;
  margin-bottom: 1rem !important;
}
.woocommerce .woocommerce-breadcrumb a {
  color: var(--rc-muted) !important;
  text-decoration: none !important;
  transition: color 150ms !important;
}
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--rc-primary) !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   27. UTILITY / MISC
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-product-data { display: none !important; }
.rc-sb-field, .rc-sb-check { /* shortcode builder fields */ }

/* ═══════════════════════════════════════════════════════════════════════════
   PHASE 1 ADDITIONS — Single Product + Partial Nav
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Single product layout ───────────────────────────────────────────────── */
.rc-single {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
  margin-bottom: 3rem;
}
@media (max-width: 767px) {
  .rc-single { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* Gallery — scrolls naturally; summary column is the sticky one */
.rc-single__gallery { min-width: 0; }

/* Sticky summary sidebar (desktop) */
.rc-single--sticky-summary .rc-single__summary {
  position: sticky;
  top: calc(var(--rc-header-h, 72px) + 1rem);
  align-self: start;
}
@media (max-width: 767px) {
  .rc-single--sticky-summary .rc-single__summary { position: relative; top: 0; }
}
/* Reset in drawer / full-page-drawer contexts */
.rc-product-drawer__inner .rc-single__summary,
.rc-pd__content .rc-single__summary { position: relative !important; top: 0 !important; }

.rc-single__img-main {
  position: relative;
  border-radius: var(--rc-radius);
  overflow: hidden;
  background: var(--rc-surface);
  aspect-ratio: 3 / 4;
}
.rc-single__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 400ms var(--rc-ease);
}
/* Beat WooCommerce's .woocommerce img { height: auto } (specificity 0,1,1) */
.rc-single__img-main .rc-single__img { height: 100%; }
/* Keep subtle scale on mobile/tablet; on desktop the loupe provides zoom feedback */
@media (max-width: 1023px) {
  .rc-single__img-main:hover .rc-single__img { transform: scale(1.03); }
}

/* .rc-single__zoom-hint removed — replaced by hover loupe (.rc-single__loupe) */

.rc-single__thumbs {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.75rem;
  flex-wrap: wrap;
}
.rc-single__thumb {
  width: 64px;
  height: 85px;
  border-radius: 6px;
  overflow: hidden;
  border: 2px solid var(--rc-border);
  padding: 0;
  cursor: pointer;
  transition: border-color 150ms;
  background: var(--rc-surface);
  flex-shrink: 0;
}
.rc-single__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rc-single__thumb:hover { border-color: var(--rc-primary); }
.rc-single__thumb--active { border-color: var(--rc-primary) !important; }

/* Summary */
.rc-single__summary { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }

.rc-single__title {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: var(--rc-text);
  margin: 0;
}

.rc-single__rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
}
.rc-single__stars { color: #f59e0b; font-size: 1rem; letter-spacing: -1px; }
.rc-single__rating-count { color: var(--rc-muted); text-decoration: none; }
.rc-single__rating-count:hover { color: var(--rc-primary); text-decoration: underline; }

.rc-single__price {
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--rc-primary);
  line-height: 1;
}
.rc-single__price .woocommerce-Price-amount { font-weight: inherit; }
.rc-single__price ins  { text-decoration: none; color: #dc2626; }
.rc-single__price del  { font-size: 1.125rem; color: var(--rc-muted); font-weight: 400; margin-right: 0.5rem; }

.rc-single__short-desc {
  font-size: 0.9375rem;
  color: var(--rc-muted);
  line-height: 1.65;
}
.rc-single__short-desc p { margin: 0 0 0.5rem; }
.rc-single__short-desc p:last-child { margin-bottom: 0; }

/* ATC area */
.rc-single__atc-wrap { display: flex; flex-direction: column; gap: 0.625rem; }

.rc-single__urgency { min-height: 1.25rem; }
.rc-urgency {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 0.375rem 0.75rem;
  border-radius: 6px;
}
.rc-urgency--stock { background: #fef3c7; color: #92400e; }
.rc-urgency--timer { background: #fef2f2; color: #991b1b; }

.rc-single__qty-atc {
  display: flex;
  gap: 0.75rem;
  align-items: center;
}
.rc-single__qty {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: 8px;
  padding: 0.125rem;
  flex-shrink: 0;
}
.rc-single__qty .rc-qty-btn {
  width: 36px;
  height: 36px;
  border: none;
  background: transparent;
  border-radius: 6px;
}
.rc-single__qty .rc-qty-val {
  min-width: 32px;
  text-align: center;
  font-size: 1rem;
  font-weight: 700;
}
.rc-single__atc-btn {
  flex: 1;
  padding: 0.875rem 1.5rem;
  font-size: 1rem;
}
.rc-single__buy-now { margin-top: 0.25rem; }

/* Trust badges */
.rc-single__trust {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem;
  padding: 1rem;
  background: var(--rc-surface);
  border-radius: var(--rc-radius-sm);
  border: 1px solid var(--rc-border);
}
.rc-trust-badge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--rc-muted);
  font-weight: 500;
}
.rc-trust-badge svg { flex-shrink: 0; color: var(--rc-primary); }
.rc-single__trust--qv {
  grid-template-columns: 1fr;
  padding: 0.75rem;
  margin-top: 0.75rem;
}

/* Delivery info bar */
.rc-single__delivery {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--rc-muted);
  font-weight: 500;
  padding: 0.625rem 0;
}
.rc-single__delivery svg { flex-shrink: 0; color: var(--rc-primary); }

/* Meta (SKU, categories) */
.rc-single__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  font-size: 0.8125rem;
  color: var(--rc-muted);
  padding-top: 0.5rem;
  border-top: 1px solid var(--rc-border);
}
.rc-single__meta-item span { font-weight: 500; color: var(--rc-text); }
.rc-single__meta-item a { color: var(--rc-primary); }

/* Share */
.rc-single__share {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.rc-single__share-label { font-size: 0.8125rem; color: var(--rc-muted); font-weight: 500; }
.rc-share-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1.5px solid var(--rc-border);
  color: var(--rc-muted);
  background: transparent;
  text-decoration: none;
  transition: border-color 150ms, color 150ms, background 150ms;
  cursor: pointer;
}
.rc-share-btn:hover { border-color: var(--rc-primary); color: var(--rc-primary); background: rgba(var(--rc-primary-rgb), 0.06); }

/* ── Sticky ATC bar ──────────────────────────────────────────────────────── */
.rc-sticky-atc {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 450;
  background: color-mix(in srgb, var(--rc-white) 97%, transparent);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid var(--rc-border);
  box-shadow: 0 -4px 24px rgba(0,0,0,0.08);
  transform: translateY(100%);
  transition: transform 300ms var(--rc-ease-out);
  padding: 0.75rem 0;
}
.rc-sticky-atc--visible { transform: translateY(0); }
@media (max-width: 1023px) {
  /* On mobile, sit above bottom nav */
  .rc-sticky-atc { bottom: calc(60px + env(safe-area-inset-bottom, 0px)); }
}

.rc-sticky-atc__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.rc-sticky-atc__product {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 1;
  min-width: 0;
}
.rc-sticky-atc__img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 6px;
  flex-shrink: 0;
  border: 1px solid var(--rc-border);
}
.rc-sticky-atc__name {
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rc-sticky-atc__price {
  font-size: 0.875rem;
  font-weight: 800;
  color: var(--rc-primary);
  white-space: nowrap;
  flex-shrink: 0;
}
.rc-sticky-atc__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}
.rc-single__qty--sm .rc-qty-val { min-width: 24px; font-size: 0.875rem; }
.rc-single__qty--sm .rc-qty-btn { width: 28px; height: 28px; font-size: 1rem; }
@media (hover: none) and (pointer: coarse) {
  .rc-single__qty--sm .rc-qty-btn { width: 44px; height: 44px; }
}
/* Mobile sticky ATC: drop the qty stepper, button takes full available width */
@media (max-width: 767px) {
  .rc-sticky-atc .rc-single__qty--sm { display: none; }
  .rc-sticky-atc__btn { flex: 1; }
  .rc-sticky-atc__product { min-width: 0; flex: 1; }
}

/* ── Product tabs ────────────────────────────────────────────────────────── */
.rc-single__tabs { margin-bottom: 3rem; }

.rc-tabs__nav {
  display: flex;
  border-bottom: 2px solid var(--rc-border);
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.rc-tabs__nav::-webkit-scrollbar { display: none; }

.rc-tab-btn {
  padding: 0.875rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--rc-muted);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  white-space: nowrap;
  transition: color 150ms, border-color 150ms;
}
.rc-tab-btn:hover { color: var(--rc-text); }
.rc-tab-btn--active { color: var(--rc-primary); border-bottom-color: var(--rc-primary); }

.rc-tab-panel {
  padding: 1.75rem 0;
  line-height: 1.7;
  color: var(--rc-text);
}
.rc-product-description h2 { font-size: 1.25rem; font-weight: 700; margin: 1.5rem 0 0.75rem; }
.rc-product-description p  { margin: 0 0 1rem; color: var(--rc-muted); }
.rc-product-description ul { list-style: disc; padding-left: 1.5rem; margin: 0 0 1rem; color: var(--rc-muted); }
.rc-product-description img { border-radius: 8px; margin: 1rem 0; }

/* WC additional info table */
.shop_attributes { width: 100%; border-collapse: collapse; }
.shop_attributes th, .shop_attributes td {
  padding: 0.625rem 0.875rem;
  text-align: left;
  font-size: 0.9375rem;
  border-bottom: 1px solid var(--rc-border);
}
.shop_attributes th { font-weight: 600; color: var(--rc-text); width: 35%; background: var(--rc-surface); }
.shop_attributes td { color: var(--rc-muted); }

/* ── Related products / recently viewed ──────────────────────────────────── */
.rc-single__related,
/* Single product recently-viewed — uses same rc-shop-rv carousel as shop/account pages */
.rc-single__recently-viewed {
  margin-top: 3rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--rc-border);
}

/* ── Complete the Look — bundle section ─────────────────────────────────── */
.rc-bundle {
  margin-top: 3rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--rc-border);
}
.rc-bundle__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}
.rc-bundle__header .rc-section-title { margin: 0; }
.rc-bundle__pricing {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.rc-bundle__badge {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--rc-white);
  background: var(--rc-success, #10b981);
  padding: 0.2rem 0.625rem;
  border-radius: 100px;
}
.rc-bundle__total-label { font-size: 0.875rem; color: var(--rc-muted); }
.rc-bundle__total-price { font-size: 1.0625rem; font-weight: 700; color: var(--rc-text); }
.rc-bundle__products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 1rem;
}
.rc-bundle-card {
  background: var(--rc-white);
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 200ms, border-color 200ms;
}
.rc-bundle-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.09); border-color: var(--rc-border-dark); }
.rc-bundle-card__img-wrap { aspect-ratio: 1; overflow: hidden; display: block; }
.rc-bundle-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms ease; }
.rc-bundle-card:hover .rc-bundle-card__img { transform: scale(1.05); }
.rc-bundle-card__body { padding: 0.625rem 0.75rem; flex: 1; }
.rc-bundle-card__title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-text);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-bundle-card__price { font-size: 0.8125rem; font-weight: 700; color: var(--rc-primary); display: block; margin-top: 0.25rem; }
.rc-bundle-card__atc { margin: 0 0.625rem 0.625rem; width: calc(100% - 1.25rem); justify-content: center; }
.rc-bundle__atc-wrap {
  grid-column: 1 / -1;
  margin-top: 0.5rem;
}
.rc-bundle__atc-btn { gap: 0.5rem; }

/* ── Frequently bought together — compact inline (summary column) ────────── */
.rc-fbt {
  margin-top: 1rem;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
}
.rc-fbt__head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 0.875rem;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--rc-muted);
  border-bottom: 1px solid var(--rc-border);
}
.rc-fbt__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.875rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-fbt__item:last-child { border-bottom: none; }
.rc-fbt__img-link { flex-shrink: 0; display: block; border-radius: 6px; overflow: hidden; width: 44px; height: 44px; }
.rc-fbt__img { width: 44px; height: 44px; object-fit: cover; display: block; transition: transform 300ms ease; }
.rc-fbt__img-link:hover .rc-fbt__img { transform: scale(1.06); }
.rc-fbt__info { flex: 1; min-width: 0; }
.rc-fbt__name {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.35;
}
.rc-fbt__name:hover { color: var(--rc-primary); }
.rc-fbt__price { font-size: 0.75rem; font-weight: 700; color: var(--rc-primary); margin-top: 0.125rem; display: block; }
.rc-fbt__add {
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  border: 1.5px solid var(--rc-primary);
  background: transparent;
  color: var(--rc-primary);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background 150ms, color 150ms;
  padding: 0;
}
.rc-fbt__add:hover { background: var(--rc-primary); color: var(--rc-white); }
.rc-fbt__add:disabled { opacity: 0.55; pointer-events: none; }
.rc-fbt__footer {
  padding: 0.625rem 0.875rem 0.75rem;
  background: var(--rc-surface);
  border-top: 1px solid var(--rc-border);
}
.rc-fbt__atc-all { width: 100%; justify-content: center; gap: 0.4rem; font-size: 0.8125rem; }

/* ── Quantity-based pricing tiers ────────────────────────────────────────── */
.rc-qty-pricing {
  margin: 1rem 0;
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
  background: var(--rc-white);
}
.rc-qty-pricing__head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 0.875rem;
  background: var(--rc-surface);
  border-bottom: 1px solid var(--rc-border);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--rc-muted);
}
.rc-qty-pricing__head svg { color: var(--rc-primary); flex-shrink: 0; }
.rc-qty-pricing__tiers { display: flex; flex-direction: column; }
.rc-qty-pricing__tier {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--rc-border);
  transition: background 150ms;
}
.rc-qty-pricing__tier:last-child { border-bottom: none; }
.rc-qty-pricing__tier--active {
  background: color-mix(in srgb, var(--rc-primary) 8%, var(--rc-white));
  border-color: color-mix(in srgb, var(--rc-primary) 20%, var(--rc-border));
}
.rc-qty-pricing__qty {
  font-size: 0.8125rem;
  color: var(--rc-text);
  font-weight: 500;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
}
.rc-qty-pricing__tier--active .rc-qty-pricing__qty { font-weight: 700; }
.rc-qty-pricing__per {
  font-size: 0.6875rem;
  color: var(--rc-muted);
  font-weight: 400;
}
.rc-qty-pricing__price {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--rc-text);
  text-align: right;
  white-space: nowrap;
}
.rc-qty-pricing__tier--active .rc-qty-pricing__price { color: var(--rc-primary); }
.rc-qty-pricing__save {
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.125rem 0.4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--rc-success, #22c55e) 15%, var(--rc-white));
  color: color-mix(in srgb, var(--rc-success, #22c55e) 70%, #000);
  white-space: nowrap;
}
.rc-qty-pricing__save--muted {
  background: var(--rc-surface);
  color: var(--rc-muted);
}
.rc-qty-pricing__badge {
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.125rem 0.4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--rc-primary) 12%, var(--rc-white));
  color: var(--rc-primary);
  white-space: nowrap;
}
.rc-qty-pricing__msg {
  margin: 0;
  padding: 0.625rem 0.875rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 700;
  border-top: 1px solid var(--rc-border);
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.rc-qty-pricing__msg-icon { flex-shrink: 0; }
.rc-qty-pricing__msg--savings {
  color: color-mix(in srgb, var(--rc-success, #22c55e) 60%, #000);
  background: color-mix(in srgb, var(--rc-success, #22c55e) 12%, var(--rc-white));
  font-size: 0.875rem;
  letter-spacing: -0.01em;
}
.rc-qty-pricing__msg--nudge {
  color: var(--rc-muted);
  background: var(--rc-surface);
  font-weight: 600;
}

/* ── BOGO banner ─────────────────────────────────────────────────────────── */
.rc-qty-bogo {
  margin: 1rem 0;
  border: 1px solid color-mix(in srgb, var(--rc-primary) 30%, var(--rc-border));
  border-radius: var(--rc-radius);
  background: color-mix(in srgb, var(--rc-primary) 6%, var(--rc-white));
  overflow: hidden;
}
.rc-qty-bogo__inner {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
}
.rc-qty-bogo__icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  background: var(--rc-primary);
  color: var(--rc-white);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.rc-qty-bogo__text { display: flex; flex-direction: column; gap: 0.125rem; }
.rc-qty-bogo__label {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--rc-text);
  line-height: 1.2;
}
.rc-qty-bogo__sub {
  font-size: 0.75rem;
  color: var(--rc-muted);
  line-height: 1.4;
}

/* ── Cart page cross-sells ───────────────────────────────────────────────── */
.rc-cross-sells {
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--rc-border);
}
.rc-cross-sells__header { margin-bottom: 1.25rem; }
.rc-cross-sells__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--rc-text);
  margin: 0;
}
.rc-cross-sells__title svg { color: var(--rc-primary); flex-shrink: 0; }
.rc-cross-sells__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 1rem;
}
.rc-cross-sells__grid--skeleton .rc-skel { height: 150px; }
.rc-cross-sell-card {
  background: var(--rc-white);
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 200ms, border-color 200ms;
}
.rc-cross-sell-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.09); border-color: var(--rc-border-dark); }
.rc-cross-sell-card__img-wrap { aspect-ratio: 1; overflow: hidden; position: relative; display: block; }
.rc-cross-sell-card__wishlist {
  position: absolute;
  top: 6px; right: 6px;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--rc-white);
  border: none;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: var(--rc-text);
  box-shadow: 0 1px 4px rgba(0,0,0,0.12);
  transition: background 150ms, box-shadow 150ms;
}
.rc-cross-sell-card__wishlist:hover { background: var(--rc-white); box-shadow: 0 2px 8px rgba(0,0,0,0.18); }
.rc-cross-sell-card__wishlist--active svg { fill: #ef4444; stroke: #ef4444; }
.rc-cross-sell-card__wishlist:hover svg { fill: #ef4444; stroke: #ef4444; }
.rc-cross-sell-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms ease; }
.rc-cross-sell-card:hover .rc-cross-sell-card__img { transform: scale(1.05); }
.rc-cross-sell-card__body { padding: 0.625rem 0.75rem; flex: 1; }
.rc-cross-sell-card__title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-text);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  display: block;
}
.rc-cross-sell-card__price { font-size: 0.8125rem; font-weight: 700; color: var(--rc-primary); display: block; margin-top: 0.25rem; }
.rc-cross-sell-card__atc { margin: 0 0.625rem 0.625rem; width: calc(100% - 1.25rem); justify-content: center; }

/* ═══════════════════════════════════════════════════════════════════════════
   P1.3 — CART PAGE
   ═══════════════════════════════════════════════════════════════════════════ */
.woocommerce-cart .rc-main,
.woocommerce-checkout .rc-main { background: var(--rc-surface); }

.woocommerce-cart-form { background: var(--rc-white); border-radius: var(--rc-radius); border: 1px solid var(--rc-border); overflow: hidden; }
.woocommerce-cart-form table.shop_table { width: 100%; border-collapse: collapse; }
.woocommerce-cart-form table.shop_table th {
  padding: 1rem 1.25rem;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--rc-muted);
  border-bottom: 1px solid var(--rc-border);
  background: var(--rc-surface);
  text-align: left;
}
.woocommerce-cart-form table.shop_table td {
  padding: 1.25rem;
  border-bottom: 1px solid var(--rc-border);
  vertical-align: middle;
}
.woocommerce-cart-form .product-thumbnail img {
  width: 72px;
  height: 96px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--rc-border);
}
.woocommerce-cart-form .product-name a { font-weight: 600; color: var(--rc-text); text-decoration: none; }
.woocommerce-cart-form .product-name a:hover { color: var(--rc-primary); }
.woocommerce-cart-form .product-price,
.woocommerce-cart-form .product-subtotal { font-weight: 700; }
.woocommerce-cart-form .quantity input[type="number"] {
  width: 60px;
  padding: 0.5rem;
  border: 1.5px solid var(--rc-border);
  border-radius: 6px;
  text-align: center;
  font: inherit;
  font-size: 0.9375rem;
}
.woocommerce-cart-form .product-remove a {
  color: var(--rc-muted);
  font-size: 1.25rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  transition: color 150ms, background 150ms;
}
.woocommerce-cart-form .product-remove a:hover { color: #ef4444; background: #fef2f2; }
.woocommerce-cart-form .actions { padding: 1.25rem; display: flex; gap: 0.75rem; flex-wrap: wrap; align-items: center; }
.woocommerce-cart-form .coupon { display: flex; gap: 0.5rem; flex: 1; }
.woocommerce-cart-form .coupon input { flex: 1; }

/* Cart totals */
.cart-collaterals { display: grid; grid-template-columns: 1fr; gap: 1.5rem; margin-top: 1.5rem; }
@media (min-width: 768px) { .cart-collaterals { grid-template-columns: 1fr 1fr; } }
.cart_totals { background: var(--rc-white); border-radius: var(--rc-radius); border: 1px solid var(--rc-border); padding: 1.5rem; }
.cart_totals h2 { font-size: 1.125rem; font-weight: 700; margin-bottom: 1rem; }
.cart_totals table { width: 100%; border-collapse: collapse; }
.cart_totals table th, .cart_totals table td { padding: 0.625rem 0; border-bottom: 1px solid var(--rc-border); }
.cart_totals table th { font-weight: 600; text-align: left; width: 40%; }
.cart_totals table .order-total th,
.cart_totals table .order-total td { font-size: 1.125rem; font-weight: 800; border-bottom: none; padding-top: 1rem; }
.cart_totals .wc-proceed-to-checkout { margin-top: 1.25rem; }
.cart_totals .wc-proceed-to-checkout .checkout-button {
  display: flex !important;
  width: 100% !important;
  justify-content: center !important;
  background: var(--rc-primary) !important;
  color: #fff !important;
  padding: 0.875rem 2rem !important;
  border-radius: 8px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: background 150ms !important;
}
.cart_totals .wc-proceed-to-checkout .checkout-button:hover {
  background: var(--rc-primary-dark) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   P1.4 — CHECKOUT PAGE
   ═══════════════════════════════════════════════════════════════════════════ */
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review { }

.woocommerce-checkout .col2-set {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: start;
}
@media (max-width: 767px) { .woocommerce-checkout .col2-set { grid-template-columns: 1fr; } }

.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout #order_review_heading {
  font-size: 1.125rem;
  font-weight: 700;
  margin-bottom: 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--rc-border);
}

.woocommerce-checkout .form-row { margin-bottom: 1rem; }
.woocommerce-checkout .form-row label {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 0.375rem;
  color: var(--rc-text);
}
.woocommerce-checkout .form-row .required { color: #ef4444; }
.woocommerce-checkout .form-row input[type="text"],
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
  width: 100% !important;
  padding: 0.625rem 0.875rem !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: 8px !important;
  font: inherit !important;
  font-size: 0.9375rem !important;
  transition: border-color 200ms !important;
  outline: none !important;
  background: var(--rc-white) !important;
  color: var(--rc-text) !important;
}
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
  border-color: var(--rc-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--rc-primary-rgb), 0.12) !important;
}

/* Order review */
.woocommerce-checkout-review-order-table { width: 100%; border-collapse: collapse; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td { padding: 0.75rem 0; border-bottom: 1px solid var(--rc-border); font-size: 0.9375rem; }
.woocommerce-checkout-review-order-table .order-total td,
.woocommerce-checkout-review-order-table .order-total th { font-size: 1.125rem; font-weight: 800; border-bottom: none; }

#place_order {
  width: 100% !important;
  padding: 1rem 2rem !important;
  background: var(--rc-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font: inherit !important;
  font-size: 1.0625rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background 150ms, transform 80ms !important;
  margin-top: 1.25rem !important;
}
#place_order:hover { background: var(--rc-primary-dark) !important; }
#place_order:active { transform: scale(0.99) !important; }

/* Payment methods */
.woocommerce-checkout #payment { background: var(--rc-surface); border-radius: var(--rc-radius); padding: 1.25rem; border: 1px solid var(--rc-border); margin-top: 1.5rem; }
.woocommerce-checkout #payment ul.payment_methods { list-style: none; margin: 0 0 1.25rem; padding: 0; }
.woocommerce-checkout #payment ul.payment_methods li { padding: 0.75rem 0; border-bottom: 1px solid var(--rc-border); }
.woocommerce-checkout #payment ul.payment_methods li:last-child { border-bottom: none; }
.woocommerce-checkout #payment ul.payment_methods label { font-weight: 600; cursor: pointer; }

/* ── Checkout: account creation + ship-to-different ─────────────────────── */
/* "Create an account?" checkbox row */
.woocommerce-checkout .woocommerce-account-fields,
.woocommerce-checkout .create-account {
  margin-top: 1.25rem;
  padding: 1rem 1.125rem;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: 8px;
}
/* WC wraps input inside the label (no for= attr), so target by class */
.woocommerce-checkout .create-account .woocommerce-form__label-for-checkbox {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
}
.woocommerce-checkout .create-account .woocommerce-form__input-checkbox {
  flex-shrink: 0;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  top: auto !important;
  accent-color: var(--rc-primary);
  cursor: pointer;
}
/* Auto-generated password hint shown after ticking */
.woocommerce-checkout #account_password_field { margin-top: 0.75rem; }
/* "Ship to a different address?" toggle */
.woocommerce-checkout .woocommerce-shipping-fields h3 {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.woocommerce-checkout .woocommerce-shipping-fields h3 label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
}
.woocommerce-checkout .woocommerce-shipping-fields h3 input[type="checkbox"] {
  flex-shrink: 0;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  top: auto !important;
  accent-color: var(--rc-primary);
  cursor: pointer;
}

/* ── "X people viewing this" social proof counter ── */
.rc-viewer-count {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8125rem;
  color: var(--rc-muted);
  margin-bottom: 0.625rem;
}
.rc-viewer-count svg { flex-shrink: 0; }
.rc-viewer-count strong { color: var(--rc-text); font-weight: 600; display: inline-block; }
@keyframes rcVcPop { 0%,100%{ transform:scale(1); color:var(--rc-text); } 45%{ transform:scale(1.22); color:var(--rc-primary); } }
.rc-viewer-count__num--flash { animation: rcVcPop 380ms ease; }

/* ═══════════════════════════════════════════════════════════════════════════
   P1.5 — MY ACCOUNT PAGE
   ═══════════════════════════════════════════════════════════════════════════ */
/* rc-account-layout handles the 2-col grid — reset the WC wrapper to block */
.woocommerce-account .woocommerce { display: block; }

.woocommerce-account .woocommerce-MyAccount-navigation {
  float: none;
  width: 100%;
  background: var(--rc-white);
  border-radius: var(--rc-radius);
  border: 1px solid var(--rc-border);
  overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li { border-bottom: 1px solid var(--rc-border); }
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child { border-bottom: none; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 0.875rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  transition: color 150ms, background 150ms;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover { color: var(--rc-primary); background: var(--rc-surface); }
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  color: var(--rc-primary);
  background: rgba(var(--rc-primary-rgb), 0.06);
  font-weight: 700;
  border-left: 3px solid var(--rc-primary);
  padding-left: calc(1.25rem - 3px);
}

.woocommerce-account .woocommerce-MyAccount-content { float: none; width: 100%; min-width: 0; }
.woocommerce-account .woocommerce-MyAccount-content h2 { font-size: 1.25rem; font-weight: 700; margin-bottom: 1.25rem; }

/* Orders table */
.woocommerce-orders-table { width: 100%; border-collapse: collapse; background: var(--rc-white); border-radius: var(--rc-radius); border: 1px solid var(--rc-border); overflow: hidden; }
.woocommerce-orders-table th {
  padding: 0.875rem 1rem;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--rc-muted);
  background: var(--rc-surface);
  border-bottom: 1px solid var(--rc-border);
  text-align: left;
}
.woocommerce-orders-table td { padding: 0.875rem 1rem; border-bottom: 1px solid var(--rc-border); font-size: 0.9375rem; }
.woocommerce-orders-table mark.order-status {
  padding: 0.2rem 0.625rem;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 700;
  background: var(--rc-surface);
  color: var(--rc-muted);
}
.woocommerce-orders-table mark.order-status.status-completed { background: #dcfce7; color: #166534; }
.woocommerce-orders-table mark.order-status.status-processing { background: #dbeafe; color: #1e40af; }
.woocommerce-orders-table mark.order-status.status-pending { background: #fef3c7; color: #92400e; }
.woocommerce-orders-table mark.order-status.status-cancelled { background: #fee2e2; color: #991b1b; }

/* ═══════════════════════════════════════════════════════════════════════════
   P1.6 — SOCIAL PROOF TOAST
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-sp-toast__icon { flex-shrink: 0; color: var(--rc-primary); display: flex; align-items: flex-start; padding-top: 1px; }
.rc-sp-toast__body { flex: 1; font-size: 0.8125rem; line-height: 1.4; color: var(--sp-text, var(--rc-text)); display: flex; flex-direction: column; gap: 1px; }
.rc-sp-toast__body strong { font-weight: 700; }
.rc-sp-toast__msg { color: var(--sp-text, var(--rc-text)); opacity: 0.85; }
.rc-sp-toast__body small { color: var(--sp-text, var(--rc-muted)); opacity: 0.65; font-size: 0.6875rem; margin-top: 1px; }

/* ═══════════════════════════════════════════════════════════════════════════
   P1.7 — RECENTLY VIEWED (already added above in rc-rv-*)
   AJAX NAVIGATION — body during transition
   ═══════════════════════════════════════════════════════════════════════════ */
/* Prevent flash during content swap */
#rc-main { min-height: 60vh; }

/* ═══════════════════════════════════════════════════════════════════════════
   PHASE 2 — CONVERSION FEATURES CSS
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── P2.1: Urgency row + sold count ─────────────────────────────────────── */
.rc-single__urgency-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.rc-urgency--sold {
  background: #ecfdf5;
  color: #065f46;
}

/* ── P2.2: Back in stock form ────────────────────────────────────────────── */
.rc-bis {
  border: 1.5px dashed var(--rc-border);
  border-radius: var(--rc-radius);
  padding: 1.25rem;
  background: var(--rc-surface);
}
.rc-bis__heading {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--rc-text);
  margin-bottom: 0.875rem;
}
.rc-bis__heading svg { color: var(--rc-primary); flex-shrink: 0; }
.rc-bis__form {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.rc-bis__form .rc-input { flex: 1; min-width: 180px; }
.rc-bis__success {
  font-size: 0.9375rem;
  color: var(--rc-success);
  font-weight: 600;
}
.rc-bis__error { margin-top: 0.375rem; }

/* ── P2.3: Product info pills (Size guide · Returns · Care) ──────────────── */
.rc-product-info-pills {
  display: flex;
  gap: 8px;
  margin-top: 0.25rem;
}
.rc-product-info-pill {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 10px;
  border: 1.5px solid var(--rc-border);
  border-radius: 10px;
  background: transparent;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease;
  white-space: nowrap;
}
.rc-product-info-pill svg { flex-shrink: 0; }

/* Per-pill accent colors */
.rc-product-info-pill--size {
  color: #2563eb;
  border-color: #dbeafe;
  background: #eff6ff;
}
.rc-product-info-pill--size svg { color: #2563eb; }
.rc-product-info-pill--returns {
  color: #7c3aed;
  border-color: #ede9fe;
  background: #f5f3ff;
}
.rc-product-info-pill--returns svg { color: #7c3aed; }
.rc-product-info-pill--care {
  color: #059669;
  border-color: #d1fae5;
  background: #ecfdf5;
}
.rc-product-info-pill--care svg { color: #059669; }

/* Hover: deepen the tint slightly */
.rc-product-info-pill--size:hover   { background: #dbeafe; border-color: #93c5fd; }
.rc-product-info-pill--returns:hover{ background: #ede9fe; border-color: #c4b5fd; }
.rc-product-info-pill--care:hover   { background: #d1fae5; border-color: #6ee7b7; }

/* Active (drawer open): solid fill with white text */
.rc-product-info-pill--size.rc-product-info-pill--active    { background: #2563eb; border-color: #2563eb; color: #fff; }
.rc-product-info-pill--returns.rc-product-info-pill--active  { background: #7c3aed; border-color: #7c3aed; color: #fff; }
.rc-product-info-pill--care.rc-product-info-pill--active     { background: #059669; border-color: #059669; color: #fff; }
.rc-product-info-pill--size.rc-product-info-pill--active svg,
.rc-product-info-pill--returns.rc-product-info-pill--active svg,
.rc-product-info-pill--care.rc-product-info-pill--active svg { color: #fff; }

/* ── P2.3: Info drawer (right-side sheet) ────────────────────────────────── */
.rc-info-drawer {
  position: fixed;
  inset: 0;
  z-index: 1000;
}
.rc-info-drawer__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.rc-info-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(520px, 94vw);
  background: var(--rc-white);
  box-shadow: -4px 0 32px rgba(0, 0, 0, 0.14);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.rc-info-drawer__header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 20px;
  border-bottom: 1px solid var(--rc-border);
  min-height: 56px;
  flex-shrink: 0;
}
.rc-info-drawer__title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--rc-text);
  margin: 0;
  flex: 1;
}
.rc-info-drawer__tabs {
  display: flex;
  gap: 0;
  flex: 1;
  align-self: stretch;
  overflow-x: auto;
  scrollbar-width: none;
}
.rc-info-drawer__tabs::-webkit-scrollbar { display: none; }
.rc-info-drawer__tab {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 0 16px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-muted);
  cursor: pointer;
  white-space: nowrap;
  transition: color 150ms, border-color 150ms;
  margin-bottom: -1px;
}
.rc-info-drawer__tab:hover { color: var(--rc-text); }
.rc-info-drawer__tab--active {
  color: var(--rc-primary);
  border-bottom-color: var(--rc-primary);
}
.rc-info-drawer__close {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  background: none;
  border: 1px solid var(--rc-border);
  border-radius: 50%;
  color: var(--rc-muted);
  cursor: pointer;
  transition: color 150ms, background 150ms, border-color 150ms;
}
.rc-info-drawer__close:hover {
  background: color-mix(in srgb, var(--rc-text) 6%, transparent);
  color: var(--rc-text);
  border-color: var(--rc-text);
}
.rc-info-drawer__body {
  flex: 1;
  overflow-y: auto;
  padding: 24px 20px;
}
.rc-info-drawer__content {
  font-size: 0.875rem;
  line-height: 1.75;
  color: var(--rc-muted);
}
.rc-info-drawer__content p  { margin: 0 0 0.625rem; }
.rc-info-drawer__content ul,
.rc-info-drawer__content ol { padding-left: 1.25rem; margin: 0 0 0.625rem; }
.rc-info-drawer__content li { margin-bottom: 0.3rem; }
.rc-info-drawer__content h2,
.rc-info-drawer__content h3 {
  font-size: 0.9375rem; font-weight: 700; color: var(--rc-text);
  margin: 1.25rem 0 0.375rem;
}
.rc-info-drawer__content h2:first-child,
.rc-info-drawer__content h3:first-child { margin-top: 0; }
.rc-info-drawer__content strong { color: var(--rc-text); font-weight: 600; }
.rc-info-drawer__content table {
  width: 100%; border-collapse: collapse; font-size: 0.8125rem;
  margin-bottom: 1rem;
}
.rc-info-drawer__content th,
.rc-info-drawer__content td {
  padding: 8px 10px; border: 1px solid var(--rc-border); text-align: left;
}
.rc-info-drawer__content th {
  background: color-mix(in srgb, var(--rc-primary) 6%, transparent);
  font-weight: 700; color: var(--rc-text);
}

/* Slide-in from right */
.rc-info-drawer-enter  { transition: transform 300ms cubic-bezier(0.22, 0.61, 0.36, 1); }
.rc-info-drawer-from   { transform: translateX(100%); }
.rc-info-drawer-to     { transform: translateX(0); }
.rc-info-drawer-leave  { transition: transform 250ms cubic-bezier(0.55, 0, 1, 0.45); }
.rc-info-drawer-leave-from { transform: translateX(0); }
.rc-info-drawer-leave-to   { transform: translateX(100%); }

/* Generic modal */
.rc-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.rc-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.rc-modal__box {
  position: relative;
  z-index: 1;
  background: var(--rc-white);
  border-radius: var(--rc-radius-lg);
  box-shadow: var(--rc-shadow-lg);
  width: 100%;
  max-width: 680px;
  max-height: 90dvh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.rc-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
}
.rc-modal__title { font-size: 1.125rem; font-weight: 700; margin: 0; }
.rc-modal__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--rc-surface);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rc-muted);
  transition: background 150ms;
  z-index: 1;
}
.rc-modal__close:hover { background: var(--rc-border); }
.rc-modal__body { padding: 1.5rem; overflow-y: auto; flex: 1; }

/* Modal transitions — wrapper controls backdrop fade; box has its own spring via rc-modal-box-* */
.rc-modal-enter        { transition: opacity 380ms ease; }
.rc-modal-enter-from   { opacity: 0; }
.rc-modal-enter-to     { opacity: 1; }
.rc-modal-leave        { transition: opacity 260ms ease; }
.rc-modal-leave-from   { opacity: 1; }
.rc-modal-leave-to     { opacity: 0; }

/* Box spring animation — blooms from slight below-center */
.rc-modal-box-enter    { transition: opacity 300ms ease, transform 440ms cubic-bezier(0.34, 1.56, 0.64, 1); }
.rc-modal-box-from     { opacity: 0; transform: scale(0.86) translateY(32px); }
.rc-modal-box-to       { opacity: 1; transform: scale(1) translateY(0); }
.rc-modal-box-leave    { transition: opacity 220ms ease, transform 220ms ease; }
.rc-modal-box-leave-from { opacity: 1; transform: scale(1) translateY(0); }
.rc-modal-box-leave-to   { opacity: 0; transform: scale(0.93) translateY(14px); }

/* Size guide table */
.rc-size-guide__tip {
  font-size: 0.875rem;
  color: var(--rc-muted);
  margin-bottom: 1rem;
}
.rc-size-guide__table-wrap { overflow-x: auto; }
.rc-size-guide__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
  white-space: nowrap;
}
.rc-size-guide__table th {
  padding: 0.625rem 0.875rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--rc-muted);
  background: var(--rc-surface);
  border-bottom: 2px solid var(--rc-border);
  text-align: left;
}
.rc-size-guide__table td {
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--rc-border);
  color: var(--rc-text);
}
.rc-size-guide__table tr:last-child td { border-bottom: none; }
.rc-size-guide__table tr:hover td { background: var(--rc-surface); }
.rc-size-guide__table td:first-child { font-weight: 700; color: var(--rc-primary); }

/* CPT-authored size guide content — applies theme styling to any HTML the admin writes */
.rc-size-guide__content { font-size: 0.9375rem; line-height: 1.7; }
.rc-size-guide__content p { color: var(--rc-muted); margin: 0 0 1rem; }
.rc-size-guide__content h2,
.rc-size-guide__content h3 {
  font-size: 0.9375rem; font-weight: 700; margin: 1.25rem 0 0.5rem;
  color: var(--rc-text); letter-spacing: -0.01em;
}
.rc-size-guide__content h2:first-child,
.rc-size-guide__content h3:first-child { margin-top: 0; }
.rc-size-guide__content ul,
.rc-size-guide__content ol { padding-left: 1.25rem; margin: 0 0 1rem; color: var(--rc-muted); }
.rc-size-guide__content li { margin-bottom: 0.25rem; }
/* figure.wp-block-table is the horizontal-scroll container; table stays as display:table */
.rc-size-guide__content figure {
  display: block; width: 100%; overflow-x: auto; margin: 0 0 1rem;
}
.rc-size-guide__content table {
  width: 100%; min-width: 100%; border-collapse: collapse;
  font-size: 0.875rem; table-layout: auto;
}
.rc-size-guide__content table th {
  padding: 0.625rem 0.875rem;
  font-size: 0.75rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--rc-muted); background: var(--rc-surface);
  border-bottom: 2px solid var(--rc-border); text-align: left;
}
.rc-size-guide__content table td {
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--rc-border);
  color: var(--rc-text);
}
.rc-size-guide__content table tr:last-child td { border-bottom: none; }
.rc-size-guide__content table tr:hover td { background: var(--rc-surface); }
.rc-size-guide__content table td:first-child { font-weight: 700; color: var(--rc-primary); }

/* ── P2.4: Cookie bar ────────────────────────────────────────────────────── */
.rc-cookie-bar {
  position: fixed;
  bottom: calc(60px + env(safe-area-inset-bottom, 0px) + 0.75rem);
  left: 0.75rem;
  right: 0.75rem;
  z-index: 9000;
  background: var(--rc-white);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  box-shadow: var(--rc-shadow-lg);
  animation: rcSlideUp 400ms cubic-bezier(0.32, 0.72, 0, 1) both;
}
@media (min-width: 768px) {
  .rc-cookie-bar {
    bottom: 1.25rem;
    left: 1.25rem;
    right: auto;
    max-width: 520px;
  }
}
@media (min-width: 1024px) {
  .rc-cookie-bar {
    bottom: 1.5rem;
    left: 1.5rem;
  }
}
@keyframes rcSlideUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.rc-cookie-bar__inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  flex-wrap: wrap;
}
.rc-cookie-bar__text {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  flex: 1;
  min-width: 200px;
}
.rc-cookie-bar__text svg { flex-shrink: 0; color: var(--rc-primary); margin-top: 2px; }
.rc-cookie-bar__text p {
  font-size: 0.8125rem;
  color: var(--rc-muted);
  line-height: 1.5;
  margin: 0;
}
.rc-cookie-bar__text a { color: var(--rc-primary); text-decoration: underline; }
.rc-cookie-bar__actions {
  display: flex;
  gap: 0.5rem;
  flex-shrink: 0;
}

/* ── P2.5: Exit intent popup ─────────────────────────────────────────────── */
.rc-exit-modal__box {
  max-width: 520px;
  overflow: visible;
}
.rc-exit-modal__content {
  display: flex;
  gap: 0;
  min-height: 320px;
}
.rc-exit-modal__discount {
  width: 120px;
  flex-shrink: 0;
  background: var(--rc-primary);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  padding: 1.5rem 1rem;
  border-radius: var(--rc-radius-lg) 0 0 var(--rc-radius-lg);
}
.rc-exit-modal__discount span {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  opacity: 0.85;
}
.rc-exit-modal__body {
  flex: 1;
  padding: 2rem 1.75rem 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}
.rc-exit-modal__title {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: var(--rc-text);
  margin: 0;
}
.rc-exit-modal__desc { font-size: 0.9375rem; color: var(--rc-muted); margin: 0; }
.rc-exit-modal__form { display: flex; flex-direction: column; gap: 0.5rem; }
.rc-exit-modal__form .rc-btn { width: 100%; }
.rc-exit-modal__skip {
  background: none;
  border: none;
  font: inherit;
  font-size: 0.75rem;
  color: var(--rc-muted);
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
  text-align: center;
}
.rc-exit-modal__success {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 0;
  text-align: center;
  color: var(--rc-success);
}
.rc-exit-modal__success p { color: var(--rc-muted); font-size: 0.9375rem; }
.rc-exit-modal__coupon {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--rc-surface);
  border: 2px dashed var(--rc-border);
  border-radius: 8px;
  padding: 0.625rem 0.875rem;
}
.rc-exit-modal__coupon span { font-size: 1rem; font-weight: 800; letter-spacing: 0.1em; flex: 1; }
.rc-exit-modal__coupon button {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--rc-primary);
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: underline;
}

/* Gallery nav arrows */
.rc-single__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  /* Above .rc-single__loupe (z-index 10) so the arrow stays visible/clickable
     even while the magnifier is active near the edge of the image. */
  z-index: 11;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--rc-white) 92%, transparent);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid var(--rc-border);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--rc-text);
  transition: background 150ms, transform 150ms;
  box-shadow: var(--rc-shadow-sm);
}
.rc-single__nav--prev { left: 0.625rem; }
.rc-single__nav--next { right: 0.625rem; }
.rc-single__nav:hover { background: var(--rc-white); transform: translateY(-50%) scale(1.08); }

/* ═══════════════════════════════════════════════════════════════════════════
   PHASE 3 — SHOP EXPERIENCE CSS
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── P3.1: Filter panel ──────────────────────────────────────────────────── */
.rc-filter-panel {
  background: var(--rc-white);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
  margin-bottom: 1.25rem;
}
.rc-filter-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.125rem;
  border-bottom: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.rc-filter-panel__title {
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin: 0;
  color: var(--rc-text);
}
.rc-filter-clear {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--rc-primary);
  background: transparent;
  border: none;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
}

.rc-filter-group {
  padding: 1rem 1.125rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-filter-group:last-child { border-bottom: none; }
.rc-filter-group--mobile-only { display: none; }
@media (max-width: 1023px) { .rc-filter-group--mobile-only { display: block; } }

.rc-filter-group__title {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--rc-text);
  margin: 0 0 0.75rem;
}

.rc-filter-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.375rem; }
.rc-filter-list__item { }

.rc-filter-check {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-size: 0.875rem;
  color: var(--rc-text);
  user-select: none;
}
.rc-filter-check input { display: none; }
.rc-filter-check__box {
  width: 17px;
  height: 17px;
  border-radius: 4px;
  border: 1.5px solid var(--rc-border);
  background: var(--rc-white);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 150ms, background 150ms;
}
.rc-filter-check input:checked + .rc-filter-check__box {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
}
.rc-filter-check input:checked + .rc-filter-check__box::after {
  content: '';
  display: block;
  width: 9px;
  height: 6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px);
}
.rc-filter-check__label { flex: 1; transition: color 150ms; }
.rc-filter-check:hover .rc-filter-check__label { color: var(--rc-primary); }
.rc-filter-check__count { font-size: 0.75rem; color: var(--rc-muted); }

.rc-filter-select {
  width: 100%;
  padding: 0.5rem 2rem 0.5rem 0.75rem;
  border: 1.5px solid var(--rc-border);
  border-radius: 8px;
  font: inherit;
  font-size: 0.875rem;
  background: var(--rc-white);
  color: var(--rc-text);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.625rem center;
  transition: border-color 200ms;
  outline: none;
}
.rc-filter-select:focus { border-color: var(--rc-primary); }
.rc-filter-select--desktop { display: none; }
@media (min-width: 1024px) { .rc-filter-select--desktop { display: block; } }

.rc-price-range__inputs {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.rc-price-range__field {
  flex: 1;
  position: relative;
}
.rc-price-range__symbol {
  position: absolute;
  left: 0.625rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.875rem;
  color: var(--rc-muted);
  pointer-events: none;
}
.rc-price-range__field .rc-input { padding-left: 1.5rem; }
.rc-price-range__sep { color: var(--rc-muted); font-size: 0.875rem; flex-shrink: 0; }

/* Sidebar widgets (plugin-based) */
.rc-sidebar-widgets { margin-top: 1rem; }
.rc-sidebar-widgets .widget {
  background: var(--rc-white);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  padding: 1rem 1.125rem;
  margin-bottom: 1rem;
}
.rc-sidebar-widgets .widget-title {
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  margin-bottom: 0.75rem !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  color: var(--rc-text) !important;
}

/* Toolbar updates */
.rc-shop-toolbar__left  { display: flex; flex-direction: column; gap: 0.125rem; }
.rc-shop-toolbar__right { display: flex; align-items: center; gap: 0.75rem; }

/* View toggle */
/* flex-shrink:0 here matters, not just cosmetic: without it, a crowded
   toolbar (title + result count + filter FAB + sort select all competing
   for space) silently compresses these below their own 34px CSS width —
   measured at ~23px in practice, under the WCAG 2.5.8 24px minimum tap
   target even though the declared size looks fine on paper. */
.rc-view-toggle { display: flex; flex-shrink: 0; border: 1.5px solid var(--rc-border); border-radius: 8px; overflow: hidden; }
.rc-view-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  color: var(--rc-muted);
  cursor: pointer;
  transition: background 150ms, color 150ms;
}
.rc-view-btn:hover  { background: var(--rc-surface); color: var(--rc-text); }
.rc-view-btn--active { background: var(--rc-primary); color: #fff; }

/* Products wrap */
.rc-products-wrap { position: relative; min-height: 200px; transition: opacity 200ms; }
.rc-products-wrap--loading { opacity: 0.45; pointer-events: none; }
.rc-products-skeleton {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 1024px) { .rc-products-skeleton { grid-template-columns: repeat(4, 1fr); } }
.rc-card-skeleton { }

/* List view — card-list.php template is fetched via AJAX when view='list'.
   The .rc-card-list CSS block (below) handles the full layout. */

/* Shop pagination */
.rc-shop-pagination { margin-top: 2.5rem; display: flex; justify-content: center; gap: 0.375rem; flex-wrap: wrap; }
.rc-shop-pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 0.75rem;
  border-radius: 8px;
  border: 1.5px solid var(--rc-border);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  transition: all 150ms;
}
.rc-shop-pagination .page-numbers.current,
.rc-shop-pagination .page-numbers:hover {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: #fff;
}
.rc-shop-pagination .page-numbers.dots {
  border: none;
  background: transparent;
  pointer-events: none;
}

/* ── P3.3: List card ─────────────────────────────────────────────────────── */
.rc-card-list {
  display: flex;
  height: 200px;
  gap: 0;
  background: var(--rc-white);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
  transition: box-shadow 250ms var(--rc-ease), transform 250ms var(--rc-ease);
  width: 100%;
}
.rc-card-list:hover {
  box-shadow: var(--rc-shadow);
  transform: translateY(-2px);
}
/* Image column — holds the <a> link and the glass action bar */
.rc-card-list__img-col {
  flex-shrink: 0;
  width: 200px;
  position: relative;
  overflow: hidden;
  background: var(--rc-surface);
}
.rc-card-list__img-wrap {
  display: block;
  width: 100%;
  height: 100%;
}
.rc-card-list__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 400ms var(--rc-ease);
}
.rc-card-list:hover .rc-card-list__img { transform: scale(1.04); }
/* Frosted-glass action bar pinned to the bottom of the image */
.rc-card-list__actions {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 0.625rem;
  background: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid rgba(255, 255, 255, 0.32);
}
/* Compact buttons inside the glass bar */
.rc-card-list__actions .rc-btn--sm {
  padding: 0.35rem 0.7rem !important;
  font-size: 0.8rem !important;
}
/* Buy now: glass pill */
.rc-card-list__actions .rc-btn--outline {
  background: rgba(255, 255, 255, 0.22) !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
  color: #fff !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}
.rc-card-list__actions .rc-btn--outline:hover {
  background: rgba(255, 255, 255, 0.35) !important;
}
/* Quick-view: floating glass circle in the top-right corner of the image */
/* Same solid, token-driven badge as grid view's .rc-card__action-btn — a low-opacity
   "glass" badge here used to go near-invisible on light product photos. */
.rc-card-list__qv-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--rc-white) 92%, transparent);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--rc-text);
  border: none;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease;
}
.rc-card-list__qv-btn:hover { background: var(--rc-white); color: var(--rc-primary); }
.rc-card-list__wishlist-btn {
  position: absolute;
  top: 8px;
  right: 44px;
  z-index: 2;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--rc-white) 92%, transparent);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--rc-text);
  border: none;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease;
}
.rc-card-list__wishlist-btn:hover { background: var(--rc-white); }
.rc-card-list__wishlist-btn svg { transition: fill 200ms, stroke 200ms; }
.rc-card-list__wishlist-btn--active svg,
.rc-card-list__wishlist-btn:hover svg {
  fill: var(--rc-error, #ef4444);
  stroke: var(--rc-error, #ef4444);
}
/* OOS label in glass bar */
.rc-card-list__oos { font-size: 0.75rem; color: rgba(255, 255, 255, 0.92); font-style: italic; text-shadow: 0 1px 2px rgba(0,0,0,0.35); }
.rc-card-list__body {
  flex: 1;
  padding: 1rem 1.125rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
  overflow: hidden;
}
.rc-card-list__cats  { font-size: 0.75rem; color: var(--rc-primary); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin: 0; }
.rc-card-list__title { font-size: 1rem; font-weight: 700; margin: 0; }
.rc-card-list__title a { text-decoration: none; color: var(--rc-text); }
.rc-card-list__title a:hover { color: var(--rc-primary); }
.rc-card-list__rating { display: flex; align-items: center; gap: 0.25rem; font-size: 0.75rem; }
.rc-card-list__desc { font-size: 0.875rem; color: var(--rc-muted); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rc-card-list__footer { margin-top: auto; padding-top: 0.25rem; }
.rc-card-list__price { font-size: 1.125rem; font-weight: 800; color: var(--rc-primary); }
.rc-card-list__price ins  { text-decoration: none; color: #dc2626; }
.rc-card-list__price del  { font-size: 0.875rem; color: var(--rc-muted); font-weight: 400; margin-right: 0.25rem; }
/* Responsive */
@media (max-width: 640px) {
  .rc-card-list { height: auto; min-height: 160px; }
  .rc-card-list__img-col { width: 140px; }
}
@media (max-width: 480px) {
  .rc-card-list__img-col { width: 120px; }
  .rc-card-list__body { padding: 0.75rem; }
  .rc-card-list__title { font-size: 0.9rem !important; }
}
@media (max-width: 360px) {
  .rc-card-list__img-col { width: 100px; }
  /* glass bar too narrow for two buttons — hide Buy now */
  .rc-card-list__actions .rc-btn--outline { display: none !important; }
  .rc-card-list__actions .rc-btn--sm { padding: 0.3rem 0.5rem !important; font-size: 0.75rem !important; }
}

/* ── P3.2: Hero shortcode ────────────────────────────────────────────────── */
.rc-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  color: var(--rc-text);
}
.rc-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 0;
  transition: transform 8s ease;
}
.rc-hero:hover .rc-hero__bg { transform: scale(1.03); }

/* Natural image mode — <img> in flow, section auto-heights, no cropping on any screen */
.rc-hero--natural-img {
  min-height: 0 !important;   /* beats .rc-home-hero min-height: 75vh/50vh/60vh */
  display: block !important;  /* beats .rc-home-hero display: flex (which centres and creates empty space) */
  padding: 0 !important;      /* beats @media mobile .rc-hero { padding: 3rem 0 } */
}
.rc-hero--natural-img .rc-hero__bg-img {
  width: 100%;
  height: auto;
  display: block;
  position: relative;
  z-index: 0;
  border-radius: 0; /* reset .entry-content img 12px; controlled via block attribute */
}
.rc-hero--natural-img .rc-hero__inner {
  position: absolute;
  inset: 0;
}
.rc-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.15) 100%);
  z-index: 1;
}
.rc-hero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding-top: 3rem;
  padding-bottom: 3rem;
  width: 100%;
}
.rc-hero--overlay .rc-hero__inner,
.rc-hero--fullwidth .rc-hero__inner { color: #fff; }

.rc-hero__content { flex: 1 1 0; min-width: 0; max-width: 540px; display: flex; flex-direction: column; gap: 1rem; overflow-wrap: break-word; word-break: break-word; }
.rc-hero__badge {
  display: inline-flex;
  padding: 0.3rem 0.875rem;
  background: var(--rc-primary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 4px;
  align-self: flex-start;
}
.rc-hero__title {
  font-size: clamp(1.75rem, 4vw, 3rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin: 0;
}
.rc-hero__desc { font-size: 1rem; opacity: 0.8; line-height: 1.6; margin: 0; }
.rc-hero__price { font-size: 1.5rem; font-weight: 800; }
.rc-hero__price ins  { text-decoration: none; }
.rc-hero__price del  { font-size: 1rem; opacity: 0.72; margin-right: 0.375rem; } /* was 0.6 — measured 4.06:1, under the 4.5:1 min */
.rc-hero__swatches { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.rc-hero__actions { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.rc-hero__cta { }

.rc-hero__image {
  flex: 0 0 42%;
  max-width: 460px;
  overflow: hidden;
}
.rc-hero__img {
  width: 100%;
  height: auto;
  max-height: 70vh;
  object-fit: cover;
  object-position: top center;
  border-radius: var(--rc-radius-lg);
  box-shadow: var(--rc-shadow-lg);
  display: block;
}
@media (max-width: 767px) {
  .rc-hero__inner { flex-direction: column; text-align: center; }
  .rc-hero__content { align-items: center; }
  .rc-hero__image { width: 100%; max-width: 320px; order: -1; }
}

/* =============================================================================
   PRODUCT SHOWCASE BLOCK  (rc/product-showcase) — single-product feature
   ============================================================================= */
.rc-showcase {
  position: relative;
  background: var(--rc-surface);
  border-radius: var(--rc-radius-lg);
  overflow: hidden;
  color: var(--rc-showcase-text, var(--rc-text));
}

/* ── Split: image beside content ─────────────────────────────────────────── */
.rc-showcase--split .rc-showcase__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(2rem, 5vw, 4rem);
  padding: clamp(2rem, 5vw, 3.5rem);
  /* In "full" (unboxed) container mode there's nothing else capping this
     row's width, so on a wide screen the flex children just pack toward
     whichever edge is the flex "start" — normally the left, but the right
     with img-right's row-reverse below. Capping + centering here keeps the
     row centered either way, matching how boxed mode already looks (boxed
     gets its max-width from the block wrapper itself). */
  max-width: var(--rc-container, 1280px);
  margin: 0 auto;
}
.rc-showcase--img-right .rc-showcase__inner { flex-direction: row-reverse; }

/* New coverflow band sits above the split's image+content row, spanning the
   same width as the block itself (boxed or full, whichever the block is
   already set to — no extra constraint added here). */
.rc-showcase__coverflow-band {
  padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.5rem, 4vw, 2.5rem) 0.25rem;
}

/* ── Stacked — "Split Ribbon": tinted image band, soft wave seam, base-colour
   content band. Two physically separate bands (not one padded column) is
   what gives it the poster-like rhythm instead of a plain stacked list. ── */
.rc-showcase--stacked { background: none; border-radius: 0; }
.rc-showcase__stack-top {
  position: relative;
  background: color-mix(in srgb, var(--rc-primary) 8%, var(--rc-surface));
  padding: clamp(2.5rem, 6vw, 4rem) clamp(1.5rem, 5vw, 3rem) clamp(4rem, 9vw, 6rem);
  display: flex;
  justify-content: center;
}
.rc-showcase__wave {
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  width: 100%;
  height: 64px;
  color: var(--rc-page-bg, var(--rc-surface));
  display: block;
}
.rc-showcase__stack-bottom {
  background: var(--rc-page-bg, var(--rc-surface));
  padding: 0 1.5rem clamp(2.5rem, 6vw, 4rem);
  display: flex;
  justify-content: center;
}
.rc-showcase--stacked .rc-showcase__content {
  text-align: center;
  align-items: center;
  padding-top: clamp(1rem, 3vw, 1.5rem);
  max-width: 480px;
}
.rc-showcase--stacked .rc-showcase__rating,
.rc-showcase--stacked .rc-showcase__actions,
.rc-showcase--stacked .rc-showcase__swatches { justify-content: center; }
/* The static fallback image stays a narrow centred column, but the coverflow
   (when present) gets the full band width so its side cascade has room —
   both driven off the same shared --rc-showcase-img-scale multiplier (see
   the "Image size" editor control) so they always scale together at the
   original 380:720 (1:1.895) ratio instead of being two separately
   hardcoded numbers. */
.rc-showcase--stacked .rc-showcase__media { max-width: calc(380px * var(--rc-showcase-img-scale, 1)); width: 100%; flex: none; }
.rc-showcase--stacked .rc-showcase__img { max-height: 50vh; }
.rc-showcase--stacked .rc-showcase-coverflow { max-width: calc(720px * var(--rc-showcase-img-scale, 1)); width: 100%; }

/* ── Fullwidth: background photo + floating content card, or (with a gallery)
   a two-column layout — content left, coverflow gallery right. ── */
.rc-showcase--fullwidth .rc-showcase__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  min-height: inherit;
  max-width: var(--rc-container, 1280px);
  margin: 0 auto;
  padding: clamp(2rem, 6vw, 4rem) clamp(1.25rem, 4vw, 2rem);
}
.rc-showcase__inner--split { justify-content: space-between; gap: clamp(2rem, 5vw, 4rem); flex-wrap: wrap; }
/* The row itself also needs more room to grow into, or scaling the card
   and image column's flex-basis together just makes them wrap onto
   separate lines sooner (their combined basis now exceeds the fixed
   1280px row before either one visually looks bigger side-by-side).
   Scoped to --split specifically — the no-gallery floating-card case
   reuses the same .rc-showcase__inner and doesn't need the extra width. */
.rc-showcase--fullwidth .rc-showcase__inner--split { max-width: calc(var(--rc-container, 1280px) * var(--rc-showcase-img-scale, 1)); }
/* content--card's flex-basis now scales alongside the image column too —
   both sides grow together at the same rate, keeping their ~380:420
   proportion at any "Image size" setting instead of the card sitting
   fixed while the image column balloons next to it. min-width stays as a
   floor for low scale values; flex-wrap above is the fallback once both
   hit their floor/ceiling and genuinely can't coexist side-by-side at very
   high scales — they drop to stacked rows instead of crushing each other. */
.rc-showcase__inner--split .rc-showcase__content--card {
  flex: 1 1 calc(380px * var(--rc-showcase-img-scale, 1));
  min-width: 300px;
  /* The shared base .rc-showcase__content rule (used by every layout's
     content column) hardcodes max-width: 560px — that silently capped the
     card at 560px regardless of the scaled flex-basis above, since a
     max-width ceiling wins over flex-grow/basis by definition. Needs its
     own scaled ceiling here too, or the flex-basis change alone does
     nothing once the card reaches 560px. */
  max-width: calc(560px * var(--rc-showcase-img-scale, 1));
}
/* flex-basis (not just max-width) now scales too — the max-width alone was
   close to meaningless in practice, since the flex row's basis-driven
   distribution (not the ceiling) was the actual bottleneck: at 2x this
   used to render at ~596px actual width despite an 1120px ceiling. */
.rc-showcase__coverflow-col { flex: 1 1 calc(420px * var(--rc-showcase-img-scale, 1)); min-width: 0; max-width: calc(560px * var(--rc-showcase-img-scale, 1)); }
.rc-showcase__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
}
.rc-showcase__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,0.62) 0%, rgba(0,0,0,0.28) 60%, rgba(0,0,0,0.1) 100%);
}
.rc-showcase__float-wrap { max-width: 460px; width: 100%; }
.rc-showcase__float-media {
  position: relative;
  width: 100%;
  max-width: calc(220px * var(--rc-showcase-img-scale, 1));
  margin-bottom: 1.25rem;
  border-radius: var(--rc-radius);
  overflow: hidden;
  box-shadow: var(--rc-shadow-lg);
}
.rc-showcase__float-media img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.rc-showcase__content--card {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--rc-radius-lg);
  padding: clamp(1.5rem, 4vw, 2.5rem);
}

/* ── Shared single-image media (gallery disabled or only 1 photo) ───────── */
.rc-showcase__media {
  position: relative;
  flex: 0 0 44%;
  max-width: calc(480px * var(--rc-showcase-img-scale, 1));
}
.rc-showcase__img {
  width: 100%;
  height: auto;
  max-height: 72vh;
  object-fit: cover;
  border-radius: var(--rc-radius-lg);
  box-shadow: var(--rc-shadow-lg);
  display: block;
}

/* ── Coverflow — big auto-rotating hero gallery, neighbours cascading to both
   sides. Item size is viewport-scaled (not container-relative) so it stays
   prominent everywhere; item *position* is a % of the stage so the spread
   scales with however much width is actually available — done via `cqw`
   (container-query width units) inside `transform`, NOT `left`. `left` is a
   layout property: animating it forces a synchronous reflow on every frame
   of every transition, on every auto-rotate, for as long as the gallery is
   on screen — a real, measured Cumulative Layout Shift cost. `cqw` resolves
   the same "% of stage width" value but stays inside `transform`, which is
   compositor-only and CLS-free. The stage becomes the query container so
   `cqw` has something to resolve against; the item's own base `top/left:50%`
   never changes after initial layout, so it never itself shifts anything. ── */
.rc-showcase-coverflow { position: relative; width: 100%; }
.rc-showcase-coverflow__stage {
  position: relative;
  width: 100%;
  height: calc(clamp(190px, 32vw, calc(380px * var(--rc-showcase-img-scale, 1))) * 4 / 3);
  overflow: hidden;
  perspective: 1400px;
  container-type: inline-size;
}
.rc-showcase-coverflow__item {
  position: absolute;
  top: 50%;
  left: 50%;
  /* The actual visible image box — shared across all three layouts (split,
     stacked, fullwidth) wherever the coverflow gallery is used. Scales with
     --rc-showcase-img-scale like everything else; a container's own
     max-width (e.g. .rc-showcase-coverflow, .rc-showcase__coverflow-col)
     only governs how much room the cascading side neighbours have — it
     doesn't by itself change this box's own size, which is why this line
     needs the same variable too, not just the container. */
  width: clamp(190px, 32vw, calc(380px * var(--rc-showcase-img-scale, 1)));
  aspect-ratio: 3 / 4;
  border-radius: var(--rc-radius-lg);
  overflow: hidden;
  box-shadow: var(--rc-shadow-lg);
  transition: transform 820ms var(--rc-ease), opacity 820ms var(--rc-ease);
  will-change: transform, opacity;
}
.rc-showcase-coverflow__item img,
.entry-content .rc-showcase-coverflow__item img { width: 100% !important; height: 100% !important; max-width: 100% !important; object-fit: cover; display: block; border-radius: 0; }
.rc-showcase-coverflow__item--active img { animation: rc-showcase-breathe 6.5s ease-in-out infinite; }
@keyframes rc-showcase-breathe {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.018); }
}
.rc-showcase-coverflow__item .rc-showcase__badge { top: 0.625rem; left: 0.625rem; }
/* Fullwidth's 2-column case has an inherently narrow stage shared in a flex
   row with the content card (~560px by default, not the ~900px+ a stage
   gets in stacked/split). Sizing the item off the viewport (32vw, like the
   other layouts) let it outgrow its own stage at higher "Image size"
   scales — measured 107% of stage width at 2x, i.e. wider than its own
   container, which is exactly what hid the cascading side neighbours
   entirely. Sizing it as a % of the stage's own rendered width instead
   (container query units — the stage already has container-type: inline-
   size, set above) keeps the same ~68% proportion the default already
   has (380px item / 560px stage) at any scale, so neighbours always keep
   their peek-through room, however big the column itself grows. */
.rc-showcase__coverflow-col .rc-showcase-coverflow__item {
  width: clamp(190px, 68cqw, calc(380px * var(--rc-showcase-img-scale, 1)));
}
.rc-showcase__coverflow-col .rc-showcase-coverflow__stage {
  height: calc(clamp(190px, 68cqw, calc(380px * var(--rc-showcase-img-scale, 1))) * 4 / 3);
}
.rc-showcase-coverflow__dots {
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}
/* The visible mark stays a small 7px dot (::before) — but the clickable
   button box itself is a full 24px, the WCAG 2.5.8 touch-target minimum.
   Measured before this fix: a 7×7px hit area, well under the minimum. */
.rc-showcase-coverflow__dot {
  position: relative;
  width: 24px; height: 24px;
  border-radius: 50%;
  border: none;
  padding: 0;
  background: transparent;
  cursor: pointer;
}
.rc-showcase-coverflow__dot::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  width: 7px; height: 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--rc-showcase-text, var(--rc-text)) 30%, transparent);
  transform: translate(-50%, -50%);
  transition: width 420ms cubic-bezier(0.34, 1.56, 0.64, 1),
              background 250ms ease;
}
/* A true pill — straight parallel long edges, fully curved short ends
   (border-radius: 999px on a wide/short box always resolves to that,
   regardless of exact width) — not an organic/uneven blob. No separate
   ring/flash element: the "water" read comes from the dot itself
   squashing and stretching as it lands on activation (below), the way
   a droplet wobbles when it hits a surface instead of just popping. */
.rc-showcase-coverflow__dot--active::before {
  width: 20px;
  background: var(--rc-showcase-text, var(--rc-primary));
  animation: rc-dot-jump 480ms cubic-bezier(0.22, 0.9, 0.32, 1);
}
.rc-showcase-coverflow__dot:not(.rc-showcase-coverflow__dot--active):hover::before {
  transform: translate(-50%, -50%) scale(1.3);
  background: color-mix(in srgb, var(--rc-showcase-text, var(--rc-text)) 55%, transparent);
}
@keyframes rc-dot-jump {
  0%   { transform: translate(-50%, -50%) scaleX(0.4)  scaleY(1.6); }
  40%  { transform: translate(-50%, -50%) scaleX(1.15) scaleY(0.7); }
  65%  { transform: translate(-50%, -50%) scaleX(0.92) scaleY(1.12); }
  100% { transform: translate(-50%, -50%) scaleX(1)    scaleY(1); }
}

.rc-showcase__badge {
  position: absolute;
  top: 0.875rem; left: 0.875rem;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #fff;
  background: var(--rc-text);
  z-index: 5;
}
.rc-showcase__badge--sale { background: #dc2626; }
.rc-showcase__badge--oos  { background: #6b7280; }
.rc-showcase__badge--low  { background: #ea580c; }
.rc-showcase__badge--inline {
  position: static;
  display: inline-block;
  align-self: flex-start;
  margin-bottom: 0.75rem;
}

.rc-showcase__content {
  flex: 1 1 0;
  min-width: 0;
  max-width: 560px;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}
.rc-showcase__eyebrow {
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rc-primary);
}
.rc-showcase__title {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  line-height: 1.15;
  margin: 0;
  /* Theme-wide heading rules (h1-h6 { color }) always win over inheritance —
     a rule directly targeting an element beats an inherited value regardless
     of specificity, so this has to be pinned explicitly, not inherited. */
  color: var(--rc-showcase-text, var(--rc-text)) !important;
}
.rc-showcase__rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
}
.rc-showcase__stars { color: #f59e0b; letter-spacing: 1px; }
.rc-showcase__rating-count { color: color-mix(in srgb, var(--rc-showcase-text, var(--rc-muted)) 70%, transparent); font-size: 0.8125rem; }
.rc-showcase__desc {
  font-size: 1.0625rem;
  line-height: 1.65;
  opacity: 0.85;
  margin: 0;
  /* .entry-content p also sets color directly — same override problem as
     the title, same fix. */
  color: var(--rc-showcase-text, var(--rc-text)) !important;
  overflow-wrap: break-word;
  word-break: break-word;
}
.rc-showcase__price {
  font-size: 1.75rem;
  font-weight: 800;
}
.rc-showcase__price del { font-size: 1.125rem; opacity: 0.68; margin-right: 0.5rem; font-weight: 400; } /* was 0.55 — measured 4.2:1, under the 4.5:1 min */
.rc-showcase__swatches { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.rc-showcase__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.375rem;
}
.rc-showcase__qty {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid color-mix(in srgb, var(--rc-showcase-text, var(--rc-border)) 25%, transparent);
  border-radius: var(--rc-radius);
  padding: 0.25rem 0.5rem;
}
/* .rc-qty-btn/.rc-qty-val are shared site-wide components with their own
   fixed dark colour — fine on a light background, unreadable on the dark
   fullwidth glass card, so pin them to the showcase text colour here too. */
.rc-showcase__qty .rc-qty-btn {
  color: var(--rc-showcase-text, var(--rc-text));
  border-color: color-mix(in srgb, var(--rc-showcase-text, var(--rc-border)) 35%, transparent);
}
.rc-showcase__qty .rc-qty-val { color: var(--rc-showcase-text, var(--rc-text)); }
.rc-showcase__cta, .rc-showcase__buy-now { padding: 0.9rem 1.75rem; font-size: 1rem; }

.rc-showcase__wishlist {
  width: 46px; height: 46px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--rc-showcase-text, var(--rc-border)) 25%, transparent);
  background: transparent;
  color: inherit;
  cursor: pointer;
  transition: background 150ms, color 150ms, transform 100ms;
  flex-shrink: 0;
}
.rc-showcase__wishlist:hover { transform: scale(1.05); }
.rc-showcase__wishlist--active { background: #ef4444; border-color: #ef4444; color: #fff; }

.rc-showcase__view-link {
  font-size: 0.875rem;
  font-weight: 600;
  /* .entry-content a also sets color directly, same override problem. */
  color: var(--rc-showcase-text, var(--rc-primary)) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  width: fit-content;
}
.rc-showcase--stacked .rc-showcase__view-link { width: auto; }
.rc-showcase__view-link:hover { opacity: 0.75; }

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
  .rc-showcase-coverflow__stage { perspective: 1000px; }
  .rc-showcase__coverflow-col { max-width: 100%; }
}
@media (max-width: 767px) {
  .rc-showcase--split .rc-showcase__inner,
  .rc-showcase--img-right .rc-showcase__inner { flex-direction: column; }
  .rc-showcase__media { max-width: 100%; flex: none; }
  .rc-showcase__content { max-width: 100%; }
  .rc-showcase__float-wrap { max-width: 100%; }
  .rc-showcase__float-media { max-width: 160px; margin-left: auto; margin-right: auto; }
  .rc-showcase--fullwidth .rc-showcase__inner { flex-direction: column; text-align: center; }
  .rc-showcase--fullwidth .rc-showcase__rating,
  .rc-showcase--fullwidth .rc-showcase__actions { justify-content: center; }
  .rc-showcase__inner--split { align-items: center; }
  .rc-showcase__stack-top { padding-bottom: 3.5rem; }
  .rc-showcase__wave { height: 40px; }
  .rc-showcase__coverflow-band { padding-left: 1rem; padding-right: 1rem; }
  /* Less horizontal room on narrow screens — shrink the active image a bit
     so the cascading neighbours have breathing room instead of crowding
     right up against its edge. */
  .rc-showcase-coverflow__stage { height: calc(clamp(150px, 34vw, 220px) * 4 / 3); }
  .rc-showcase-coverflow__item { width: clamp(150px, 34vw, 220px); }
}

/* ── P3.4: Variation swatches on cards ───────────────────────────────────── */
.rc-card__swatches {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  padding: 0.375rem 0.875rem 0;
}
/* Legacy card swatch rules scoped away — full swatch system is section 29 below */
.rc-card__swatches-legacy .rc-swatch {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid transparent;
  text-decoration: none;
  transition: border-color 150ms, transform 100ms;
  font-size: 0.5625rem;
  font-weight: 700;
}

/* ── P3.5: Image zoom — hover loupe magnifier ─────────────────────────────── */
.rc-single__img-main,
.rc-single__stacked-img { cursor: crosshair; }
@media (max-width: 1023px) {
  .rc-single__img-main,
  .rc-single__stacked-img { cursor: default; }
}

.rc-single__loupe {
  position: absolute;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  border: 2px solid var(--rc-white);
  box-shadow: 0 4px 24px rgba(0,0,0,.3), 0 0 0 1px rgba(0,0,0,.08);
  pointer-events: none;
  background-repeat: no-repeat;
  transform: translate(-50%, -50%);
  z-index: 10;
  will-change: left, top, background-position;
}
@media (max-width: 1023px) {
  .rc-single__loupe { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .rc-single__loupe { display: none !important; }
}

/* ── P3.6: Native compare button ─────────────────────────────────────────── */
/* Sizing/background/color all come from the shared .rc-card__action-btn base
   (same class is on the element) — this used to duplicate them with a hardcoded
   rgba(255,255,255,0.9) background, which doesn't adapt to color skins. In
   Midnight mode --rc-text (the icon color) is near-white, so a near-white icon
   sat on a hardcoded near-white badge and was almost invisible, while the
   wishlist button — which never duplicated these properties — stayed correctly
   dark-badge/light-icon via .rc-card__action-btn's token-based background. */
.rc-card__compare-btn[aria-pressed="true"] { color: var(--rc-primary); background: var(--rc-white); }

/* ═══════════════════════════════════════════════════════════════════════════
   PHASE 4 — WCAG 2.1 AA + THEMEFOREST POLISH
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Focus styles (WCAG 2.4.7) ───────────────────────────────────────────── */
:focus-visible {
  outline: 2.5px solid var(--rc-primary) !important;
  outline-offset: 3px !important;
  border-radius: 3px !important;
}
:focus:not(:focus-visible) { outline: none !important; }

/* Ensure sufficient contrast on interactive elements */
.rc-btn--primary:focus-visible,
.rc-btn--secondary:focus-visible { outline-color: var(--rc-primary); }

/* ── Reduced motion (WCAG 2.3.3) ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .rc-header { transition: none; }
  .rc-drawer { transition: none; }
  .rc-sheet  { transition: none; }
  .rc-sticky-atc { transition: none; }
}

/* ── High contrast mode support ──────────────────────────────────────────── */
@media (forced-colors: active) {
  .rc-btn--primary  { forced-color-adjust: none; }
  .rc-card__badge   { forced-color-adjust: none; }
  .rc-cart-count    { forced-color-adjust: none; }
}

/* ── RTL Support ──────────────────────────────────────────────────────────── */
[dir="rtl"] .rc-drawer--right { right: auto; left: 0; transform: translateX(-102%); }
[dir="rtl"] .rc-drawer--right.rc-drawer--open { transform: translateX(0); }
[dir="rtl"] .rc-drawer--left  { left: auto; right: 0; transform: translateX(102%); }
[dir="rtl"] .rc-drawer--left.rc-drawer--open  { transform: translateX(0); }
[dir="rtl"] .rc-header__actions { margin-left: 0; margin-right: auto; }
[dir="rtl"] .rc-nav--desktop { flex-direction: row-reverse; }
[dir="rtl"] .rc-cookie-bar { left: auto; right: 0.75rem; }
@media (min-width: 768px) {
  [dir="rtl"] .rc-cookie-bar { left: auto; right: 1.25rem; }
}
[dir="rtl"] .rc-exit-modal__discount {
  border-radius: 0 var(--rc-radius-lg) var(--rc-radius-lg) 0;
}

/* ── Print styles ─────────────────────────────────────────────────────────── */
@media print {
  .rc-header, .rc-bottom-nav, .rc-drawer, .rc-sheet,
  .rc-cookie-bar, .rc-modal, .rc-sticky-atc,
  .rc-sp-toast, .rc-progress { display: none !important; }
  body { padding-bottom: 0 !important; }
  .rc-main { min-height: 0; }
  a[href]::after { content: " (" attr(href) ")"; }
}

/* ── WordPress admin bar compatibility ───────────────────────────────────── */
.admin-bar .rc-header      { top: 32px; }
.admin-bar .rc-sticky-atc  { bottom: 0; }
@media screen and (max-width: 782px) {
  .admin-bar .rc-header    { top: 46px; }
}

/* ── Screen reader utilities ──────────────────────────────────────────────── */
.screen-reader-text,
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ── Smooth page transition overlay ──────────────────────────────────────── */
#rc-main {
  transition: opacity 160ms var(--rc-ease);
}

/* ── WC compatibility: ensure our grid overrides float cleanly ───────────── */
.woocommerce-page .woocommerce::after,
.woocommerce-page .woocommerce::before { display: none !important; }
.woocommerce ul.products::after,
.woocommerce ul.products::before { display: none !important; }

/* ── Enhancements: scrollbar styling (Webkit) ────────────────────────────── */
.rc-drawer__body::-webkit-scrollbar,
.rc-sheet__body::-webkit-scrollbar,
.rc-modal__body::-webkit-scrollbar { width: 4px; }
.rc-drawer__body::-webkit-scrollbar-track,
.rc-sheet__body::-webkit-scrollbar-track,
.rc-modal__body::-webkit-scrollbar-track  { background: transparent; }
.rc-drawer__body::-webkit-scrollbar-thumb,
.rc-sheet__body::-webkit-scrollbar-thumb,
.rc-modal__body::-webkit-scrollbar-thumb  { background: var(--rc-border); border-radius: 2px; }

/* ═══════════════════════════════════════════════════════════════════════════
   PHASE R1 — UNIFIED RESPONSIVE CART DRAWER
   Desktop: right-side panel. Mobile: bottom sheet. Single component.
   ═══════════════════════════════════════════════════════════════════════════ */

.rc-cart-drawer {
  position: fixed;
  z-index: 999;
  background: var(--rc-white);
  display: flex;
  flex-direction: column;
  box-shadow: var(--rc-shadow-lg);
  will-change: transform;
  overscroll-behavior: contain;
}

/* ── Desktop: right-side panel ───────────────────────────────────────────── */
@media (min-width: 768px) {
  .rc-cart-drawer {
    top: 0;
    right: 0;
    height: 100%;
    height: 100dvh;
    width: min(420px, 100vw);
    transform: translateX(102%);
    transition: transform 340ms var(--rc-ease-out);
    border-radius: 0;
  }
  .rc-cart-drawer--open { transform: translateX(0); }
}

/* ── Mobile: bottom sheet (Shopify-style) ────────────────────────────────── */
@media (max-width: 767px) {
  .rc-cart-drawer {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 88dvh;
    max-height: 88dvh;
    transform: translateY(102%);
    transition: transform 380ms cubic-bezier(0.32, 0.72, 0, 1);
    border-radius: 1.25rem 1.25rem 0 0;
  }
  .rc-cart-drawer--open { transform: translateY(0); }
  /* Grab handle */
  .rc-cart-drawer::before {
    content: '';
    position: absolute;
    top: 0.625rem;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 4px;
    border-radius: 2px;
    background: var(--rc-border);
    z-index: 2;
  }
}

.rc-cart-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.125rem 1.375rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .rc-cart-drawer__header { padding-top: 1.5rem; }
}
.rc-cart-drawer__title {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--rc-text);
  margin: 0;
}
.rc-cart-drawer__count {
  font-weight: 400;
  color: var(--rc-muted);
  font-size: 0.9375rem;
  margin-left: 0.25rem;
}
.rc-cart-drawer__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: var(--rc-muted);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background 150ms, color 150ms;
}
.rc-cart-drawer__close:hover { background: var(--rc-surface); color: var(--rc-text); }

.rc-cart-drawer__body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 1rem 1.375rem;
  position: relative;
  transition: opacity 160ms ease;
}
.rc-cart-drawer__body--loading { opacity: 0.55; pointer-events: none; }

.rc-cart-drawer__footer {
  flex-shrink: 0;
  border-top: 1px solid var(--rc-border);
  background: var(--rc-white);
}
.rc-cart-drawer__footer:empty { display: none; }
.rc-cart-drawer__footer > * { padding: 1rem 1.375rem; }
.rc-cart-drawer__footer .rc-cart-subtotal { padding-bottom: 0.5rem; }

/* Full-drawer veil */
.rc-cart-drawer__veil {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}

/* ── Cart item ───────────────────────────────────────────────────────────── */
.rc-cart-item {
  position: relative;
  display: flex;
  gap: 0.875rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--rc-border);
}
.rc-cart-item:first-child { padding-top: 0.25rem; }
.rc-cart-item__imglink { flex-shrink: 0; display: block; }
.rc-cart-item__img {
  width: 72px;
  height: 96px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--rc-border);
  background: var(--rc-surface);
  display: block;
}
.rc-cart-item__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}
.rc-cart-item__name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  line-height: 1.35;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-cart-item__name:hover { color: var(--rc-primary); }
.rc-cart-item__meta { font-size: 0.75rem; color: var(--rc-muted); }
.rc-cart-item__meta-dl { margin: 0.1875rem 0 0; }
.rc-cart-item__meta-dl dl { margin: 0; }
.rc-cart-item__meta-dl dt,
.rc-cart-item__meta-dl dd {
  display: inline;
  font-size: 0.7rem;
  color: var(--rc-muted);
  margin: 0;
  padding: 0;
}
.rc-cart-item__meta-dl dt::after { content: ': '; }
.rc-cart-item__meta-dl dd::after { content: ' · '; }
.rc-cart-item__meta-dl dd:last-of-type::after { content: ''; }
.rc-cart-item__price { font-size: 0.9375rem; font-weight: 700; color: var(--rc-text); }
.rc-cart-item__qty {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.375rem;
}
.rc-cart-item__qty .rc-qty-btn {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1.5px solid var(--rc-border);
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--rc-text);
  transition: border-color 150ms, background 150ms;
}
.rc-cart-item__qty .rc-qty-btn:hover:not(:disabled) {
  border-color: var(--rc-primary);
  background: rgba(var(--rc-primary-rgb), 0.06);
}
.rc-cart-item__qty .rc-qty-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.rc-cart-item__qty .rc-qty-val {
  min-width: 22px;
  text-align: center;
  font-size: 0.875rem;
  font-weight: 600;
}
.rc-cart-item__remove {
  align-self: flex-start;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--rc-muted);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: color 150ms, background 150ms;
  flex-shrink: 0;
}
.rc-cart-item__remove:hover:not(:disabled) { color: #ef4444; background: #fef2f2; }
.rc-cart-item__remove:disabled { opacity: 0.4; cursor: not-allowed; }

@keyframes rc-cart-remove {
  0%   { opacity: 1; border-color: var(--rc-border); background: transparent; }
  20%  { opacity: 1; border-color: rgba(239,68,68,0.55); background: rgba(239,68,68,0.07); }
  40%  { opacity: 1; border-color: rgba(239,68,68,0.2);  background: rgba(239,68,68,0.02); }
  60%  { opacity: 1; border-color: rgba(239,68,68,0.55); background: rgba(239,68,68,0.07); }
  80%  { opacity: 0.5; border-color: rgba(239,68,68,0.3); background: rgba(239,68,68,0.04); }
  100% { opacity: 0; border-color: rgba(239,68,68,0.1); background: rgba(239,68,68,0.02); }
}
.rc-cart-item.rc-removing {
  animation: rc-cart-remove 420ms ease forwards;
  pointer-events: none;
}

/* Per-item loading veil */
.rc-cart-item__veil {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.65);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}

/* ── Applied coupons ─────────────────────────────────────────────────────── */
.rc-cart-applied-coupon {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding: 0.375rem 0.625rem;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  border-radius: 6px;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #065f46;
}
.rc-cart-applied-coupon button {
  background: none;
  border: none;
  color: #065f46;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 0.25rem;
}

/* ── Spinner ─────────────────────────────────────────────────────────────── */
.rc-spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2.5px solid var(--rc-border);
  border-top-color: var(--rc-primary);
  border-radius: 50%;
  animation: rcSpin 0.7s linear infinite;
}
.rc-spinner--lg { width: 32px; height: 32px; border-width: 3px; }
@keyframes rcSpin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  .rc-cart-drawer { transition: none !important; }
  .rc-spinner { animation-duration: 1.4s; }
}

/* ── Card image button (replaces <a> so click opens quick view) ───────────── */
.rc-card__img-btn {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
  padding: 0;
  background: none;
  cursor: pointer;
  position: relative;
}
.rc-card__img-btn:focus-visible {
  outline: 2.5px solid var(--rc-primary);
  outline-offset: 2px;
}
/* When rc-card__img-btn is an <a> (suggestion cards) remove link decoration */
a.rc-card__img-btn { text-decoration: none; color: inherit; }

/* ── Suggestion card ATC button (visible always, not hover-only) ─────────── */
.rc-card__suggestion-atc {
  display: block;
  width: 100%;
  text-align: center;
  text-decoration: none;
  margin-top: auto;
  padding-top: 0.5rem;
}
.rc-card__suggestion-atc:hover { text-decoration: none; }

/* ── Override WC Blocks link-colour cascade inside the suggestion carousel.
   WC Blocks scopes `a { color }` to .wp-block-woocommerce-cart with higher
   specificity than our base rules, making title links and the primary button
   inherit WC's link colour instead of our theme tokens. Adding the cart-block
   ancestor here matches WC's own specificity and wins cleanly. ─────────────── */
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-card__title-link {
  color: var(--rc-text);
  text-decoration: none;
}
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-card__title-link:hover {
  color: var(--rc-primary);
}
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-card__price-wrap,
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-card__price-wrap a {
  color: var(--rc-text);
  text-decoration: none;
}
/* Primary button in WC Blocks context: force white text regardless of WC link colour */
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-btn--primary {
  color: #fff;
  text-decoration: none;
}
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-btn--primary:hover {
  color: #fff;
  background: var(--rc-primary-dark);
  text-decoration: none;
}
/* Secondary button (variable products "Select options") */
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-btn--secondary {
  color: var(--rc-text);
  text-decoration: none;
}
.wp-block-woocommerce-cart .rc-empty-cart-suggestions .rc-btn--secondary:hover {
  color: var(--rc-text);
  text-decoration: none;
}

/* ── Quick view: thumbs + categories ─────────────────────────────────────── */
.rc-qv__thumbs {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.625rem;
  flex-wrap: wrap;
}
.rc-qv__thumb {
  width: 56px;
  height: 75px;
  object-fit: cover;
  border-radius: 6px;
  border: 2px solid var(--rc-border);
  cursor: pointer;
  transition: border-color 150ms;
}
.rc-qv__thumb:hover { border-color: var(--rc-primary); }
.rc-qv__cats {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--rc-primary);
  margin: 0;
}
.rc-qv__rating {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.875rem;
}

/* Sheet wider on desktop for quick view */
@media (min-width: 768px) {
  .rc-sheet { width: min(960px, 94vw); }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT DRAWER + QUICK VIEW — BOTH DRAWERS REDESIGNED
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── CSS variables (overridden by JS from theme settings) ────────────────── */
:root {
    --rc-product-drawer-width: 85%;
    --rc-product-drawer-blur:  12px;
    --rc-sheet-width:          85%;
}

/* ── Shared blur backdrop ────────────────────────────────────────────────── */
.rc-backdrop--blur {
    backdrop-filter:         blur(var(--rc-product-drawer-blur));
    -webkit-backdrop-filter: blur(var(--rc-product-drawer-blur));
}

/* Update the main backdrop to use blur variable when drawers open */
.rc-backdrop--active {
    backdrop-filter:         blur(var(--rc-product-drawer-blur));
    -webkit-backdrop-filter: blur(var(--rc-product-drawer-blur));
    background: rgba(0, 0, 0, 0.45);
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT DRAWER  (full single product page — triggered by card click)
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-product-drawer {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 102%);
    width:  var(--rc-product-drawer-width);
    height: 90dvh;
    z-index: 999;
    background: var(--rc-white);
    border-radius: 1.25rem 1.25rem 0 0;
    box-shadow:
        0 -2px 0 rgba(0,0,0,0.06),
        0 -8px 40px rgba(0,0,0,0.16),
        0 -24px 80px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* Spring-feel transition */
    transition: transform 480ms cubic-bezier(0.32, 0.72, 0, 1);
    will-change: transform;
}
.rc-product-drawer--open {
    transform: translate(-50%, 0);
}
@media (max-width: 767px) {
    .rc-product-drawer {
        width:  100%;
        height: 92dvh;
        left:   0;
        transform: translateY(102%);
        border-radius: 1.5rem 1.5rem 0 0;
    }
    .rc-product-drawer--open {
        transform: translateY(0);
    }
}

/* Handle */
.rc-product-drawer__handle {
    width: 44px;
    height: 4px;
    border-radius: 2px;
    background: var(--rc-border);
    margin: 0.875rem auto 0;
    flex-shrink: 0;
    cursor: grab;
}

/* Header */
.rc-product-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.5rem 0.75rem;
    border-bottom: 1px solid var(--rc-border);
    flex-shrink: 0;
    gap: 1rem;
}
.rc-product-drawer__breadcrumb {
    min-width: 0;
    flex: 1;
}
.rc-product-drawer__breadcrumb-title {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--rc-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}
.rc-product-drawer__header-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}
.rc-product-drawer__fullpage {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    border: 1.5px solid var(--rc-border);
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--rc-muted);
    text-decoration: none;
    transition: border-color 150ms, color 150ms;
    white-space: nowrap;
}
.rc-product-drawer__fullpage:hover {
    border-color: var(--rc-primary);
    color: var(--rc-primary);
}
.rc-product-drawer__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--rc-surface);
    color: var(--rc-muted);
    border: none;
    cursor: pointer;
    transition: background 150ms, color 150ms;
    flex-shrink: 0;
}
.rc-product-drawer__close:hover {
    background: var(--rc-border);
    color: var(--rc-text);
}

/* Body */
.rc-product-drawer__body {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}
.rc-product-drawer__body::-webkit-scrollbar { width: 4px; }
.rc-product-drawer__body::-webkit-scrollbar-thumb { background: var(--rc-border); border-radius: 2px; }

/* Content area — single product styles inside drawer context */
.rc-product-drawer__content {
    padding: 1.5rem 2rem 3rem;
}
/* Override single product layout for drawer (it's already narrow) */
.rc-product-drawer__content .rc-single {
    gap: 2rem;
}
.rc-product-drawer__content .rc-single__tabs {
    margin-bottom: 1.5rem;
}
.rc-product-drawer__content .rc-single__related,
.rc-product-drawer__content .rc-single__recently-viewed {
    display: none; /* hide related/rv inside drawer — save space */
}
/* Adjust single product gallery in drawer */
.rc-product-drawer__content .rc-single__gallery {
    position: relative; /* override sticky positioning */
    top: 0;
}
@media (max-width: 767px) {
    .rc-product-drawer__content {
        padding: 1rem 1rem 2rem;
    }
}

/* Skeleton */
.rc-product-drawer__skel { padding: 1.5rem 2rem; }
.rc-product-drawer__skel-inner {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
}
@media (max-width: 767px) {
    .rc-product-drawer__skel-inner {
        flex-direction: column;
    }
    .rc-product-drawer__skel-inner > .rc-skel:first-child {
        width: 100% !important;
        aspect-ratio: 3/4;
        max-height: 40dvh;
    }
}

/* Error */
.rc-product-drawer__error {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 3rem 2rem;
    text-align: center;
    color: var(--rc-muted);
}
.rc-product-drawer__error p {
    font-size: 0.9375rem;
    margin: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   QUICK VIEW SHEET  (minimal — triggered by eye icon)
   ═══════════════════════════════════════════════════════════════════════════ */
/* Overrides the generic .rc-sheet to match the new width var */
.rc-sheet {
    width:  var(--rc-sheet-width, 85%);
    left:   50%;
    right:  auto;
    transform: translate(-50%, 102%);
    border-radius: 1.25rem 1.25rem 0 0;
    box-shadow:
        0 -2px 0 rgba(0,0,0,0.06),
        0 -8px 40px rgba(0,0,0,0.16);
    transition: transform 360ms cubic-bezier(0.32, 0.72, 0, 1);
}
.rc-sheet--open {
    transform: translate(-50%, 0);
}
@media (max-width: 767px) {
    .rc-sheet {
        width:  100%;
        left:   0;
        transform: translateY(102%);
    }
    .rc-sheet--open {
        transform: translateY(0);
    }
}

/* ── Reduced motion overrides ─────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .rc-product-drawer { transition: none; }
    .rc-sheet          { transition: none; }
}

/* ── Product drawer: skeleton, inner content aliases ─────────────────────── */

/* .rc-product-drawer__inner = same as __content */
.rc-product-drawer__inner {
    padding: 1.5rem 2rem 3rem;
}
.rc-product-drawer__inner .rc-single {
    gap: 2rem;
}
.rc-product-drawer__inner .rc-single__gallery {
    position: relative;
    top: 0;
}
.rc-product-drawer__inner .rc-single__related,
.rc-product-drawer__inner .rc-single__recently-viewed {
    display: none;
}
@media (max-width: 767px) {
    .rc-product-drawer__inner { padding: 1rem 1rem 2rem; }
    .rc-product-drawer__inner .rc-single { grid-template-columns: 1fr; gap: 1.25rem; }
}

/* Skeleton layout */
.rc-product-drawer__skeleton { padding: 2rem; }
.rc-product-drawer__skeleton-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    align-items: start;
}
@media (max-width: 767px) {
    .rc-product-drawer__skeleton-inner { grid-template-columns: 1fr; }
}
.rc-product-drawer__skeleton-main {
    aspect-ratio: 3 / 4;
    border-radius: 12px;
    margin-bottom: 0.75rem;
    width: 100%;
}
.rc-product-drawer__skeleton-thumbs {
    display: flex;
    gap: 0.5rem;
}
.rc-product-drawer__skeleton-thumb {
    width: 60px;
    height: 80px;
    border-radius: 6px;
    flex-shrink: 0;
}
.rc-product-drawer__skeleton-summary {
    display: flex;
    flex-direction: column;
    padding-top: 0.5rem;
}

/* ── Backdrop blur active on both sheet types ─────────────────────────────── */
/* When ANY drawer/sheet is open, the backdrop uses the configured blur */
.rc-backdrop--active {
    backdrop-filter:         var(--rc-backdrop-blur, blur(10px)) !important;
    -webkit-backdrop-filter: var(--rc-backdrop-blur, blur(10px)) !important;
}

/* ── Product drawer: skeleton + inner content aliases ────────────────────── */
.rc-product-drawer__inner {
    padding: 1.5rem 2rem 3rem;
}
.rc-product-drawer__inner .rc-single { gap: 2rem; }
.rc-product-drawer__inner .rc-single__gallery { position: relative; top: 0; }
.rc-product-drawer__inner .rc-single__related,
.rc-product-drawer__inner .rc-single__recently-viewed { display: none; }
@media (max-width: 767px) {
    .rc-product-drawer__inner { padding: 1rem 1rem 2rem; }
    .rc-product-drawer__inner .rc-single { grid-template-columns: 1fr; gap: 1.25rem; }
}
.rc-product-drawer__skeleton { padding: 2rem; }
.rc-product-drawer__skeleton-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: start; }
@media (max-width: 767px) { .rc-product-drawer__skeleton-inner { grid-template-columns: 1fr; } }
.rc-product-drawer__skeleton-main { aspect-ratio: 3/4; border-radius: 12px; margin-bottom: .75rem; width: 100%; }
.rc-product-drawer__skeleton-thumbs { display: flex; gap: .5rem; }
.rc-product-drawer__skeleton-thumb  { width: 60px; height: 80px; border-radius: 6px; flex-shrink: 0; }
.rc-product-drawer__skeleton-summary { display: flex; flex-direction: column; padding-top: .5rem; }

/* Backdrop uses configured blur when any overlay is open */
.rc-backdrop--active {
    backdrop-filter:         var(--rc-backdrop-blur, blur(10px)) !important;
    -webkit-backdrop-filter: var(--rc-backdrop-blur, blur(10px)) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   QUICK VIEW + PRODUCT DRAWER — CLEAN HYVA-QUALITY REDESIGN
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Shared sheet primitives ─────────────────────────────────────────────── */

/* Pill handle — same on every sheet */
.rc-sheet-handle {
  width: 40px;
  height: 4px;
  border-radius: 2px;
  background: var(--rc-border);
  margin: 0.75rem auto 0;
  flex-shrink: 0;
}

/* Universal close button */
.rc-sheet-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--rc-surface);
  border: none;
  cursor: pointer;
  color: var(--rc-muted);
  transition: background 150ms, color 150ms;
  flex-shrink: 0;
}
.rc-sheet-close:hover { background: var(--rc-border); color: var(--rc-text); }

/* ═══════════════════════════════════════════════════════════════════════════
   QUICK VIEW SHEET  (.rc-qv-sheet)
   Compact, minimal. Max 640px centred on desktop, full on mobile.
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-qv-sheet {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
  width: min(680px, 100vw);
  max-height: 92dvh;
  z-index: 1010;
  background: var(--rc-white);
  border-radius: 1.5rem 1.5rem 0 0;
  box-shadow: 0 -4px 6px rgba(0,0,0,.04), 0 -12px 40px rgba(0,0,0,.14);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform 400ms cubic-bezier(0.32, 0.72, 0, 1);
  will-change: transform;
}
.rc-qv-sheet--open { transform: translate(-50%, 0); }

@media (max-width: 767px) {
  .rc-qv-sheet {
    left: 0;
    width: 100%;
    transform: translateY(100%);
  }
  .rc-qv-sheet--open { transform: translateY(0); }
}

.rc-qv-sheet__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.375rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
  gap: 1rem;
}
.rc-qv-sheet__title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--rc-text);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rc-qv-sheet__body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* ── Quick view content layout ───────────────────────────────────────────── */
.rc-qv-content {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 0;
  min-height: 340px;
}
@media (max-width: 540px) {
  .rc-qv-content {
    grid-template-columns: 1fr;
  }
}

.rc-qv-content__img-col {
  background: var(--rc-surface);
  overflow: hidden;
}
.rc-qv-content__img-link { display: block; height: 100%; }
.rc-qv-content__img {
  width: 100%;
  height: 100%;
  min-height: 280px;
  object-fit: cover;
  display: block;
  transition: transform 400ms var(--rc-ease);
}
.rc-qv-content__img-link:hover .rc-qv-content__img { transform: scale(1.04); }

.rc-qv-content__info {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.rc-qv-content__cats {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--rc-primary);
  margin: 0;
}
.rc-qv-content__title {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.25;
  color: var(--rc-text);
  margin: 0;
}
.rc-qv-content__rating {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.rc-stars { color: #f59e0b; font-size: 0.8125rem; letter-spacing: -0.5px; }
.rc-qv-content__rating-count { font-size: 0.75rem; color: var(--rc-muted); }

.rc-qv-content__price {
  font-size: 1.375rem;
  font-weight: 800;
  color: var(--rc-primary);
  line-height: 1;
}
.rc-qv-content__price ins  { text-decoration: none; color: #dc2626; }
.rc-qv-content__price del  { font-size: 1rem; color: var(--rc-muted); font-weight: 400; margin-right: 0.375rem; }

.rc-qv-content__desc {
  font-size: 0.875rem;
  color: var(--rc-muted);
  line-height: 1.6;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.rc-qv-content__atc {
  display: flex;
  gap: 0.625rem;
  align-items: center;
  margin-top: 0.25rem;
}
.rc-qv-content__qty {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  border: 1.5px solid var(--rc-border);
  border-radius: 8px;
  padding: 0.125rem;
  flex-shrink: 0;
}
.rc-qv-content__qty .rc-qty-btn {
  width: 34px;
  height: 34px;
  border: none;
  background: transparent;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--rc-text);
  transition: background 150ms;
}
.rc-qv-content__qty .rc-qty-btn:hover:not(:disabled) { background: var(--rc-surface); }
.rc-qv-content__qty .rc-qty-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.rc-qv-content__qty .rc-qty-val {
  min-width: 28px;
  text-align: center;
  font-size: 0.9375rem;
  font-weight: 700;
}
.rc-qv-content__atc-btn { flex: 1; min-width: 0; }

.rc-qv-content__oos {
  font-size: 0.875rem;
  color: var(--rc-muted);
  font-style: italic;
  padding: 0.75rem 0;
}

.rc-qv-content__full-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-primary);
  text-decoration: none;
  margin-top: auto;
  padding-top: 0.5rem;
  border-top: 1px solid var(--rc-border);
  transition: gap 150ms;
}
.rc-qv-content__full-link:hover { gap: 0.625rem; }

/* Quick view skeleton */
.rc-qv-skel {
  display: grid;
  grid-template-columns: 200px 1fr;
  min-height: 300px;
}
.rc-qv-skel__img {
  height: 100%;
  min-height: 300px;
  border-radius: 0;
}
.rc-qv-skel__info {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.rc-qv-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 3rem 1.5rem;
  text-align: center;
  color: var(--rc-muted);
}
.rc-qv-error p { margin: 0; font-size: 0.9375rem; }

/* ═══════════════════════════════════════════════════════════════════════════
   INLINE QUICK VIEW EXPANDER  (.rc-qv-inline)
   Expands in-place below the clicked card's row — no modal overlay.
   Pointer arrow points back to the active card via --qv-ptr-x.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Grid row expander + pointer container */
.rc-qv-inline {
  grid-column: 1 / -1;
  list-style: none;
  padding: 0;
  position: relative;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 460ms cubic-bezier(0.34, 1.2, 0.64, 1);
  --qv-ptr-x: 50%;
}
.rc-qv-inline--open { grid-template-rows: 1fr; }

/* Inner wrapper — min-height: 0 is required for the 0fr trick */
.rc-qv-inline__inner {
  min-height: 0;
  overflow: hidden;
  position: relative;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-top: 3px solid var(--rc-primary);
  border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.10), 0 2px 8px rgba(0,0,0,0.05);
}

/* Pointer arrow — absolutely positioned sibling of __inner, NOT clipped by overflow */
.rc-qv-inline__ptr {
  position: absolute;
  top: 0;
  left: var(--qv-ptr-x);
  transform: translate(-50%, -100%);
  pointer-events: none;
  opacity: 0;
  transition: opacity 200ms 160ms;
  z-index: 2;
}
.rc-qv-inline__ptr::before,
.rc-qv-inline__ptr::after {
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.rc-qv-inline__ptr::before {
  bottom: 0;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: 10px solid var(--rc-primary);
}
.rc-qv-inline__ptr::after {
  bottom: -3px;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-bottom: 9px solid var(--rc-surface);
}
/* Give ptr a non-zero size so pseudo-elements render */
.rc-qv-inline__ptr { width: 22px; height: 10px; }
.rc-qv-inline--open .rc-qv-inline__ptr { opacity: 1; }

/* Content: wider image column than the modal variant */
.rc-qv-inline .rc-qv-content {
  grid-template-columns: clamp(160px, 28%, 340px) 1fr;
  min-height: 260px;
}
/* On narrow screens the expander still spans the full grid width but content stacks */
@media (max-width: 600px) {
  .rc-qv-inline .rc-qv-content { grid-template-columns: 1fr; min-height: 0; }
  .rc-qv-inline .rc-qv-content__img { min-height: 200px; max-height: 280px; object-fit: cover; }
}
/* On 2-col grid the expander column is small — keep image readable */
@media (max-width: 767px) {
  .rc-qv-inline .rc-qv-content { grid-template-columns: 120px 1fr; }
  .rc-qv-inline .rc-qv-content__img { min-height: 0; }
}
@media (max-width: 600px) {
  .rc-qv-inline .rc-qv-content { grid-template-columns: 1fr; }
}

/* Close button */
.rc-qv-inline__close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 999px;
  background: rgba(0,0,0,0.06);
  color: var(--rc-text);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 180ms, color 180ms;
  z-index: 2;
  flex-shrink: 0;
}
.rc-qv-inline__close:hover { background: rgba(0,0,0,0.13); }

/* Skeleton layout */
.rc-qv-inline__skeleton {
  display: flex;
  gap: 1.5rem;
  padding: 1.75rem 2rem;
  align-items: flex-start;
}
@media (max-width: 767px) {
  .rc-qv-inline__skeleton { gap: 1rem; padding: 1.25rem; }
}
@media (max-width: 600px) {
  .rc-qv-inline__skeleton { flex-direction: column; }
}
.rc-qv-inline__skel-img {
  flex: 0 0 clamp(100px, 28%, 280px);
  aspect-ratio: 3 / 4;
  border-radius: 10px;
}
@media (max-width: 600px) {
  .rc-qv-inline__skel-img { flex: 0 0 auto; width: 100%; max-height: 200px; aspect-ratio: 4/3; }
}
.rc-qv-inline__skel-body {
  flex: 1;
  min-width: 0;
  padding-top: 0.375rem;
}

/* Error state */
.rc-qv-inline__err {
  padding: 2rem;
  color: var(--rc-muted);
  font-size: 0.875rem;
  margin: 0;
}

/* Active card — primary outline + subtle lift */
.rc-card--qv-active {
  outline: 2.5px solid var(--rc-primary);
  outline-offset: 3px;
  border-radius: var(--rc-radius, 12px);
  position: relative;
  z-index: 1;
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT DRAWER  (.rc-pd)
   Full single product page. 85vw centred on desktop, fullscreen on mobile.
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-pd {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
  width: var(--rc-drawer-width, 85vw);
  height: 92dvh;
  z-index: 1010;
  background: var(--rc-white);
  border-radius: 1.5rem 1.5rem 0 0;
  box-shadow: 0 -4px 6px rgba(0,0,0,.04), 0 -16px 60px rgba(0,0,0,.18);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}
.rc-pd--open { transform: translate(-50%, 0); }

@media (max-width: 767px) {
  .rc-pd {
    left: 0;
    width: 100%;
    height: 94dvh;
    transform: translateY(100%);
    border-radius: 1.25rem 1.25rem 0 0;
  }
  .rc-pd--open { transform: translateY(0); }
}

/* Header */
.rc-pd__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.5rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
  gap: 1rem;
}
.rc-pd__title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--rc-text);
  margin: 0;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.rc-pd__header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.rc-pd__fullpage-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.4375rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: 6px;
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-muted);
  background: transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color 150ms, color 150ms;
}
.rc-pd__fullpage-btn:hover { border-color: var(--rc-primary); color: var(--rc-primary); }
.rc-pd__wishlist-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1.5px solid var(--rc-border);
  border-radius: 6px;
  background: transparent;
  color: var(--rc-muted);
  cursor: pointer;
  transition: border-color 200ms, color 200ms;
  flex-shrink: 0;
}
.rc-pd__wishlist-btn svg { transition: fill 200ms, stroke 200ms; }
.rc-pd__wishlist-btn:hover,
.rc-pd__wishlist-btn--active {
  border-color: var(--rc-error, #ef4444);
  color: var(--rc-error, #ef4444);
}
.rc-pd__wishlist-btn--active svg,
.rc-pd__wishlist-btn:hover svg {
  fill: var(--rc-error, #ef4444);
  stroke: var(--rc-error, #ef4444);
}

/* Body */
.rc-pd__body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.rc-pd__body::-webkit-scrollbar { width: 4px; }
.rc-pd__body::-webkit-scrollbar-thumb { background: var(--rc-border); border-radius: 2px; }

/* Injected product page — override layout for drawer context */
.rc-pd__content {
  padding: 1.5rem 2rem 3rem;
}
.rc-pd__content .rc-single {
  /* Already grid — good */
  gap: 2rem;
}
.rc-pd__content .rc-single__gallery {
  position: relative; /* override sticky */
  top: 0;
}
.rc-pd__content .rc-single__related,
.rc-pd__content .rc-single__recently-viewed,
.rc-pd__content .rc-sticky-atc {
  display: none !important; /* hide extras inside drawer */
}
@media (max-width: 767px) {
  .rc-pd__content { padding: 1rem 1rem 2rem; }
  .rc-pd__content .rc-single { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* Skeleton */
.rc-pd__skeleton { padding: 2rem; }
.rc-pd__skeleton-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: start;
}
@media (max-width: 767px) { .rc-pd__skeleton-grid { grid-template-columns: 1fr; } }
.rc-pd__skeleton-img   { aspect-ratio: 3/4; border-radius: 12px; width: 100%; margin-bottom: .75rem; }
.rc-pd__skeleton-thumbs{ display: flex; gap: .5rem; }
.rc-pd__skeleton-thumb { width: 60px; height: 80px; border-radius: 6px; flex-shrink: 0; }
.rc-pd__skeleton-info  { display: flex; flex-direction: column; }

/* Error */
.rc-pd__error {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 3rem 1.5rem;
  text-align: center;
  color: var(--rc-muted);
}

/* ── Backdrop blur connects to CSS var ───────────────────────────────────── */
.rc-backdrop--active {
  background: rgba(0, 0, 0, 0.5) !important;
  backdrop-filter:         var(--rc-backdrop-blur, blur(10px)) !important;
  -webkit-backdrop-filter: var(--rc-backdrop-blur, blur(10px)) !important;
}

/* ── Reduced motion ───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .rc-qv-sheet, .rc-pd { transition-duration: 0.01ms !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   BLOG DRAWER  (.rc-bd)
   Slide-up post preview. Desktop: 85vw centered; mobile: fullscreen.
   Scroll/wheel expands to 100dvh then navigates to the post via AjaxNav.
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-bd {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
  width: var(--rc-bd-w, 85vw);
  height: var(--rc-bd-h, 60dvh);
  z-index: 1010;
  background: var(--rc-surface);
  border-radius: var(--rc-bd-br, 1.5rem 1.5rem 0 0);
  box-shadow: 0 -4px 6px rgba(0,0,0,.04), 0 -20px 60px rgba(0,0,0,.22);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}
.rc-bd--open { transform: translate(-50%, 0); }

@media (max-width: 767px) {
  .rc-bd {
    left: 0;
    width: 100%;
    height: var(--rc-bd-h, 65dvh);
    transform: translateY(100%);
    border-radius: var(--rc-bd-br, 1.25rem 1.25rem 0 0);
  }
  .rc-bd--open { transform: translateY(0); }
}

/* ── Backdrop ────────────────────────────────────────────────────────────── */
#rc-bd-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.42);
  z-index: 1009; /* one below drawer (1010) */
  cursor: pointer;
  opacity: 0;
  transition: opacity 350ms;
}
#rc-bd-backdrop.rc-bd-backdrop--on { opacity: 1; }

/* ── Hero gradient area — fills drawer in preview mode, centered layout ───── */
.rc-bd__hero {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2.75rem 2rem 2rem;
  overflow: hidden;
}
/* Drag handle: absolute inside hero, centered at very top */
.rc-bd__drag-handle {
  position: absolute;
  top: 0.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  background: rgba(255,255,255,.45);
  margin: 0;
}
/* Blurred thumbnail colour-bleed */
.rc-bd__hero-bg {
  position: absolute;
  inset: -10%;
  background-size: cover;
  background-position: center;
  filter: blur(22px);
  transform: scale(1.12);
  z-index: 0;
  pointer-events: none;
}
/* Gradient scrim for text readability */
.rc-bd__hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.08) 0%, rgba(0,0,0,.58) 100%);
  z-index: 1;
  pointer-events: none;
}
/* Top-right action buttons — sit above overlay, always clickable */
.rc-bd__hero-actions {
  position: absolute;
  top: 0.875rem;
  right: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  z-index: 4;
  pointer-events: auto;
}
.rc-bd__read-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.75rem;
  border-radius: 6px;
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #fff;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
  white-space: nowrap;
  transition: background 150ms, border-color 150ms;
}
.rc-bd__read-btn:hover {
  background: rgba(255,255,255,.26);
  border-color: rgba(255,255,255,.5);
}
.rc-bd__close-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  cursor: pointer;
  transition: background 150ms;
}
.rc-bd__close-btn:hover { background: rgba(255,255,255,.28); }
/* Hero content: category → title → meta → excerpt → scroll CTA — all centred */
.rc-bd__hero-content {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  max-width: 560px;
}
.rc-bd__hero-skel {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 560px;
  gap: 0;
}
/* Author / date / read-time row inside hero, below title */
.rc-bd__hero-meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  font-size: 0.78125rem;
  color: rgba(255,255,255,.78);
  flex-wrap: wrap;
}
.rc-bd__hero-avatar {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid rgba(255,255,255,.5);
  flex-shrink: 0;
}
.rc-bd__cat-pill {
  display: inline-block;
  align-self: center;
  padding: 0.2rem 0.625rem;
  border-radius: 20px;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #fff;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.35);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  text-decoration: none;
  transition: background 150ms;
}
.rc-bd__cat-pill:hover { background: rgba(255,255,255,.3); color: #fff; }
.rc-bd__title {
  font-size: clamp(1.125rem, 2.8vw, 1.625rem);
  font-weight: 800;
  color: #fff;
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
  margin: 0;
  line-height: 1.2;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── Full-height header bar ───────────────────────────────────────────────── */
.rc-bd__full-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
  background: var(--rc-surface);
}
.rc-bd__back-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.375rem 0.75rem 0.375rem 0.5rem;
  border-radius: 6px;
  font: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-muted);
  background: transparent;
  border: 1.5px solid var(--rc-border);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: border-color 150ms, color 150ms;
}
.rc-bd__back-btn:hover { border-color: var(--rc-primary); color: var(--rc-primary); }
.rc-bd__full-title {
  flex: 1;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--rc-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

/* ── Body: excerpt, meta, scroll hint ────────────────────────────────────── */
.rc-bd__body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  background: var(--rc-surface);
}
.rc-bd__body::-webkit-scrollbar { width: 3px; }
.rc-bd__body::-webkit-scrollbar-thumb { background: var(--rc-border); border-radius: 2px; }

/* Body-skel kept for any residual usage */
.rc-bd__body-skel { padding: 1.125rem 1.5rem; }

/* Loading skeleton — constrained to initial drawer width, centered */
.rc-bd__full-loading {
  overflow: hidden;
  max-width: 85vw;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

/* Featured image — full-width, fixed height, covers top of full view */
.rc-bd__full-image {
  display: block;
  width: 100%;
  max-height: 240px;
  object-fit: cover;
}

/* Article header: category, title, meta — constrained to initial drawer width */
.rc-bd__article-header {
  padding: 1.25rem 1.5rem 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  border-bottom: 1px solid var(--rc-border);
  max-width: 85vw;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}
.rc-bd__cat-pill--article {
  display: inline-block;
  align-self: flex-start;
  padding: 0.15rem 0.55rem;
  border-radius: 20px;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--rc-primary);
  background: color-mix(in srgb, var(--rc-primary) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--rc-primary) 25%, transparent);
  text-decoration: none;
}
.rc-bd__article-title {
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
  font-weight: 800;
  color: var(--rc-text);
  line-height: 1.25;
  margin: 0;
}
.rc-bd__article-meta {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.8125rem;
  color: var(--rc-muted);
  flex-wrap: wrap;
}
.rc-bd__article-meta .rc-bd__avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid var(--rc-border);
  flex-shrink: 0;
}

/* Article body — constrained to initial drawer width, centered */
.rc-bd__article-content {
  padding: 1.25rem 1.5rem 2rem;
  font-size: 1rem;
  line-height: 1.75;
  color: var(--rc-text);
  max-width: 85vw;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}
.rc-bd__article-content h1,
.rc-bd__article-content h2,
.rc-bd__article-content h3,
.rc-bd__article-content h4,
.rc-bd__article-content h5,
.rc-bd__article-content h6 {
  font-size: clamp(1rem, 2.2vw, 1.3rem);
  font-weight: 700;
  margin: 1.5em 0 0.6em;
  line-height: 1.3;
  color: var(--rc-text);
}
.rc-bd__article-content p { margin: 0 0 1em; }
.rc-bd__article-content a { color: var(--rc-primary); }
.rc-bd__article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
  margin: 1em auto;
}
.rc-bd__article-content ul,
.rc-bd__article-content ol {
  padding-left: 1.5em;
  margin: 0 0 1em;
}
.rc-bd__article-content li { margin-bottom: 0.35em; }
.rc-bd__article-content blockquote {
  margin: 1.25em 0;
  padding: 0.75em 1.25em;
  border-left: 3px solid var(--rc-primary);
  background: var(--rc-surface);
  border-radius: 0 6px 6px 0;
  font-style: italic;
  color: var(--rc-muted);
}
.rc-bd__article-content pre,
.rc-bd__article-content code {
  font-family: monospace;
  font-size: 0.875em;
  background: var(--rc-surface);
  border-radius: 4px;
}
.rc-bd__article-content pre { padding: 1em; overflow-x: auto; }
.rc-bd__article-content code { padding: 0.1em 0.35em; }

/* ── Social share bar — constrained to initial drawer width, centered ─────── */
.rc-bd__share-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 1.5rem 1.75rem;
  border-top: 1px solid var(--rc-border);
  max-width: 85vw;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}
.rc-bd__share-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-muted);
  margin-right: 0.25rem;
  flex-shrink: 0;
}
.rc-bd__share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  color: var(--rc-muted);
  text-decoration: none;
  cursor: pointer;
  font: inherit;
  flex-shrink: 0;
  transition: background 150ms, color 150ms, border-color 150ms;
}
.rc-bd__share-btn:hover {
  border-color: var(--rc-primary);
  color: var(--rc-primary);
  background: color-mix(in srgb, var(--rc-primary) 8%, var(--rc-white));
}
.rc-bd__share-copy-btn.rc-bd__share-copied {
  border-color: #16a34a;
  color: #16a34a;
  background: color-mix(in srgb, #16a34a 10%, var(--rc-white));
}
/* Excerpt — now inside the gradient hero, white text, centred */
.rc-bd__excerpt {
  font-size: 0.9rem;
  line-height: 1.65;
  color: rgba(255,255,255,.72);
  text-shadow: 0 1px 3px rgba(0,0,0,.3);
  margin: 0.125rem 0 0;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* .rc-bd__avatar used in full-content article meta (loadFull JS) */
.rc-bd__avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1.5px solid var(--rc-border);
}
.rc-bd__author { font-size: 0.875rem; font-weight: 600; color: var(--rc-text); }
.rc-bd__dot { opacity: 0.4; }
/* Frosted glass pill CTA */
.rc-bd__scroll-hint {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 1.125rem 0.45rem 0.875rem;
  border-radius: 9999px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  color: rgba(255,255,255,.9);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  margin-top: 0.875rem;
  animation: rc-bd-hint 2.5s ease-in-out infinite;
}
@keyframes rc-bd-hint {
  0%, 100% { transform: translateY(0);    opacity: .85; }
  50%       { transform: translateY(4px); opacity: 1;   }
}

@media (prefers-reduced-motion: reduce) {
  .rc-bd { transition-duration: 0.01ms !important; }
  .rc-bd__scroll-hint { animation: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   HYVA-STYLE REDESIGN: INLINE SEARCH + MINICART DROPDOWN
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Inline header search ────────────────────────────────────────────────── */

/* Search wrap — expands to fill center of header */
.rc-header__search-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.rc-header__search-wrap--active {
  flex: 1;
  max-width: 600px;
  margin: 0 1rem;
}

/* The expanded input container */
.rc-header__search-input-wrap {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: 10px;
  padding: 0 0.875rem;
  transition: border-color 200ms, box-shadow 200ms;
}
.rc-header__search-input-wrap:focus-within {
  border-color: var(--rc-primary);
  box-shadow: 0 0 0 3px rgba(var(--rc-primary-rgb), 0.1);
}
.rc-header__search-lens {
  color: var(--rc-muted);
  flex-shrink: 0;
}
.rc-header__search-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font: inherit;
  font-size: 0.9375rem;
  color: var(--rc-text);
  padding: 0.75rem 0;
  min-width: 0;
}
.rc-header__search-input::placeholder { color: var(--rc-muted); }
.rc-header__search-clear {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--rc-border);
  border: none;
  cursor: pointer;
  color: var(--rc-muted);
  transition: background 150ms;
  flex-shrink: 0;
}
.rc-header__search-clear:hover { background: var(--rc-border-dark); }
.rc-header__search-close {
  font: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-muted);
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0 0 0 0.25rem;
  white-space: nowrap;
  flex-shrink: 0;
  transition: color 150ms;
}
.rc-header__search-close:hover { color: var(--rc-text); }

/* Search results dropdown */
.rc-header__search-results {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  background: var(--rc-white);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
  max-height: 400px;
  overflow-y: auto;
  z-index: 600;
  padding: 0.5rem;
}

/* When search is open, hide logo and nav on mobile */
.rc-header__logo--hidden { display: none; }
.rc-header__actions--hidden { display: none; }
@media (min-width: 640px) {
  .rc-header__logo--hidden  { display: block; }
  .rc-header__actions--hidden { display: flex; }
}
/* On desktop always show logo/actions even when search is open */
@media (min-width: 1024px) {
  .rc-header__logo--hidden  { display: block !important; }
  .rc-header__actions--hidden { display: flex !important; }
  .rc-nav--hidden { display: none; }
}

/* ── Minicart — Hyva style ───────────────────────────────────────────────── */

/* Desktop: dropdown from cart icon */
.rc-minicart {
  position: fixed;
  z-index: 1020;
  background: var(--rc-white);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* ── DESKTOP dropdown (fixed, right-aligned near cart icon) ── */
@media (min-width: 768px) {
  .rc-minicart {
    position: fixed;
    top: calc(var(--rc-header-h) + 8px);
    right: 1.25rem;
    width: 380px;
    max-height: 80dvh;
    border-radius: 16px;
    border: 1px solid var(--rc-border);
    box-shadow: 0 4px 6px rgba(0,0,0,0.04), 0 16px 48px rgba(0,0,0,0.12);
    background: var(--rc-white);
    transform: translateY(-10px) scale(0.98);
    transform-origin: top right;
    opacity: 0;
    pointer-events: none;
    transition:
      opacity   220ms var(--rc-ease),
      transform 220ms var(--rc-ease);
    overflow: hidden;
  }
  .rc-minicart--open {
    transform: translateY(0) scale(1);
    opacity: 1;
    pointer-events: all;
  }
  .rc-minicart__handle--mobile { display: none; }
  /* Admin bar offset */
  .admin-bar .rc-minicart { top: calc(var(--rc-header-h) + 32px + 8px); }
}

/* ── MOBILE bottom sheet ── */
@media (max-width: 767px) {
  .rc-minicart {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-height: 90dvh;
    border-radius: 1.375rem 1.375rem 0 0;
    background: var(--rc-white);
    box-shadow: 0 -4px 6px rgba(0,0,0,0.04), 0 -12px 40px rgba(0,0,0,0.14);
    transform: translateY(100%);
    opacity: 1;
    pointer-events: none;
    transition: transform 380ms cubic-bezier(0.32, 0.72, 0, 1);
  }
  .rc-minicart--open {
    transform: translateY(0);
    pointer-events: all;
  }
}

/* Header */
.rc-minicart__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.125rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
}
.rc-minicart__header-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.rc-minicart__title {
  font-size: 0.9375rem;
  font-weight: 700;
  margin: 0;
  color: var(--rc-text);
}
.rc-minicart__header-right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.rc-minicart__view-cart {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-primary);
  text-decoration: none;
  white-space: nowrap;
}
.rc-minicart__view-cart:hover { text-decoration: underline; }

/* Body (scrollable items) */
.rc-minicart__body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0.75rem 1.125rem;
  min-height: 80px;
  transition: opacity 160ms;
}
.rc-minicart__body--loading { opacity: 0.5; pointer-events: none; }
.rc-minicart__body::-webkit-scrollbar { width: 4px; }
.rc-minicart__body::-webkit-scrollbar-thumb { background: var(--rc-border); border-radius: 2px; }

/* Footer */
.rc-minicart__footer {
  flex-shrink: 0;
  border-top: 1px solid var(--rc-border);
  padding: 1rem 1.125rem;
  background: var(--rc-white);
}
.rc-minicart__footer:empty { display: none; }

/* Hyva-style grand total row */
.rc-cart-subtotal {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.875rem;
  font-size: 0.9375rem;
}
.rc-cart-subtotal span:first-child { font-weight: 600; color: var(--rc-text); }
.rc-cart-subtotal span:last-child  { font-size: 1.0625rem; font-weight: 800; color: var(--rc-text); }

/* Hyva-style checkout button: black, full width */
.rc-minicart__checkout-btn,
.rc-minicart .rc-btn--primary {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  padding: 0.875rem !important;
  background: #111827 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font: inherit !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: background 150ms !important;
}
.rc-minicart__checkout-btn:hover,
.rc-minicart .rc-btn--primary:hover {
  background: #1f2937 !important;
}

/* Cart item — Hyva style: clean, compact */
.rc-cart-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--rc-border);
}
.rc-cart-item:last-child { border-bottom: none; }
.rc-cart-item__imglink { flex-shrink: 0; display: block; }
.rc-cart-item__img {
  width: 68px;
  height: 90px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--rc-border);
  background: var(--rc-surface);
  display: block;
}
.rc-cart-item__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.1875rem;
  min-width: 0;
}
.rc-cart-item__name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  line-height: 1.35;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-cart-item__name:hover { color: var(--rc-primary); }
.rc-cart-item__meta { font-size: 0.75rem; color: var(--rc-muted); }
.rc-cart-item__meta-dl { margin: 0.1875rem 0 0; }
.rc-cart-item__meta-dl dl { margin: 0; }
.rc-cart-item__meta-dl dt,
.rc-cart-item__meta-dl dd {
  display: inline;
  font-size: 0.7rem;
  color: var(--rc-muted);
  margin: 0;
  padding: 0;
}
.rc-cart-item__meta-dl dt::after { content: ': '; }
.rc-cart-item__meta-dl dd::after { content: ' · '; }
.rc-cart-item__meta-dl dd:last-of-type::after { content: ''; }
.rc-cart-item__price { font-size: 0.9375rem; font-weight: 700; }

/* ── Cart qty row ──────────────────────────────────────────────────────── */
.rc-cart-item__qty-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 0.5rem;
}
/* iOS frosted-glass pill stepper — no borders, tinted fill */
.rc-cart-item__qty {
  display: inline-flex;
  align-items: stretch;
  height: 28px;
  border-radius: 999px;
  background: rgba(118, 118, 128, 0.12);
  overflow: hidden;
}
.rc-qty-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  flex-shrink: 0;
  border: none;
  background: transparent;
  color: var(--rc-text);
  font-size: 1.0625rem;
  font-weight: 300;
  line-height: 1;
  padding: 0 0 1px 0;
  cursor: pointer;
  transition: background 180ms;
}
.rc-qty-btn:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.08);
}
.rc-qty-btn:active:not(:disabled) {
  background: rgba(0, 0, 0, 0.15);
}
.rc-qty-btn:disabled {
  opacity: 0.28;
  cursor: not-allowed;
}
/* Number between buttons — hairline iOS separators */
.rc-qty-val {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  padding: 0 2px;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  border-left: 1px solid rgba(60, 60, 67, 0.18);
  border-right: 1px solid rgba(60, 60, 67, 0.18);
  user-select: none;
}
/* Gentle iOS spring on click — whole pill bounces */
@keyframes rc-qty-pop {
  0%   { transform: scale(1); }
  30%  { transform: scale(0.92); }
  65%  { transform: scale(1.05); }
  85%  { transform: scale(0.99); }
  100% { transform: scale(1); }
}
.rc-qty-pop {
  animation: rc-qty-pop 300ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
/* Trash — same frosted-glass circle, matches pill material */
.rc-cart-item__remove {
  display: flex;
  align-items: center;
  align-self: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  border: none;
  border-radius: 999px;
  background: rgba(118, 118, 128, 0.12);
  color: var(--rc-muted);
  cursor: pointer;
  transition: background 180ms, color 180ms;
  margin-top: 4px;
}
.rc-cart-item__remove:hover:not(:disabled) {
  background: rgba(255, 59, 48, 0.14);
  color: #ff3b30;
}
.rc-cart-item__remove:active:not(:disabled) {
  background: rgba(255, 59, 48, 0.24);
  color: #ff3b30;
}

/* Empty cart */
.rc-cart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.75rem;
  padding: 2rem 1rem;
  color: var(--rc-muted);
}
.rc-cart-empty p { font-size: 0.9375rem; margin: 0; }

/* Hide WC Blocks default "New in store" grid inside the empty-cart block —
   replaced by the theme's native carousel via render_block filter */
.wp-block-woocommerce-empty-cart-block .wc-block-grid,
.wp-block-woocommerce-empty-cart-block [class*="wc-block-product-new"],
.wp-block-woocommerce-empty-cart-block .wp-block-separator,
.wp-block-woocommerce-empty-cart-block h2:not(.wc-block-cart__empty-cart__title) { display: none !important; }

/* Hide "You might also like" carousel when WC Blocks shows the filled cart.
   React adds .wp-block-woocommerce-filled-cart-block to the DOM when the
   cart has items; removing it when empty. CSS :has() replaces the old JS
   MutationObserver — zero JS, works across all cart-state transitions. */
.wp-block-woocommerce-cart:has(.wp-block-woocommerce-filled-cart-block) .rc-empty-cart-suggestions {
  display: none;
}

/* Theme carousel injected below the empty-cart block */
.rc-empty-cart-suggestions {
  max-width: var(--rc-container);
  margin: 0 auto;
  padding: 2rem 1.25rem 3rem;
}

/* ── Empty-cart carousel: enhanced pagination dots ─────────────────────── */
@keyframes rc-dot-bounce-in {
  0%   { opacity: 0; transform: scale(0.2) translateY(8px); }
  65%  { opacity: 1; transform: scale(1.25) translateY(-3px); }
  100% { opacity: 1; transform: scale(1)   translateY(0); }
}
@keyframes rc-dot-glow {
  0%   { box-shadow: 0 0 0 0   color-mix(in srgb, var(--rc-primary) 55%, transparent); }
  70%  { box-shadow: 0 0 0 7px color-mix(in srgb, var(--rc-primary) 0%,  transparent); }
  100% { box-shadow: 0 0 0 0   color-mix(in srgb, var(--rc-primary) 0%,  transparent); }
}

/* Extra room below slides */
.rc-empty-cart-suggestions .rc-product-carousel { padding-bottom: 4.5rem; }

/* Pull pagination into the extra space */
.rc-empty-cart-suggestions .swiper-pagination { bottom: 14px !important; }

/* All bullets: spring transition + staggered bounce-in */
.rc-empty-cart-suggestions .swiper-pagination-bullet {
  animation: rc-dot-bounce-in 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both;
  transition: width 380ms cubic-bezier(0.34, 1.56, 0.64, 1), background 250ms ease, transform 180ms ease;
  cursor: pointer;
}
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(1) { animation-delay: 0.04s; }
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(2) { animation-delay: 0.09s; }
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(3) { animation-delay: 0.14s; }
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(4) { animation-delay: 0.19s; }
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(5) { animation-delay: 0.24s; }
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(6) { animation-delay: 0.29s; }
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(7) { animation-delay: 0.34s; }
.rc-empty-cart-suggestions .swiper-pagination-bullet:nth-child(8) { animation-delay: 0.39s; }

/* Active dot: sonar glow pulse (starts after entrance finishes) */
.rc-empty-cart-suggestions .swiper-pagination-bullet-active {
  animation: rc-dot-glow 2.4s 0.65s ease-out infinite;
}

/* Inactive dots: grow + tint on hover */
.rc-empty-cart-suggestions .swiper-pagination-bullet:not(.swiper-pagination-bullet-active):hover {
  transform: scale(1.7);
  background: var(--rc-primary) !important;
  opacity: 0.55;
}

/* Loading veil */
.rc-minicart__veil {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}

/* ── Fix: backdrop must be fixed even with minicart absolute ──────────────── */
/* On mobile, minicart is fixed-position and needs the backdrop */
@media (max-width: 767px) {
  .rc-minicart { position: fixed !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   BLOG & CONTENT
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Blog archive ────────────────────────────────────────────────────────── */
.rc-blog-hero {
  padding: clamp(3rem, 6vw, 5rem) 0 clamp(2rem, 4vw, 3rem);
  border-bottom: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.rc-blog-hero__title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.05;
  margin: 0 0 0.75rem;
  color: var(--rc-text);
}
.rc-blog-hero__desc {
  font-size: 1.0625rem;
  color: var(--rc-muted);
  max-width: 600px;
  margin: 0;
  line-height: 1.6;
}
.rc-blog-wrap { padding: clamp(3rem, 6vw, 5rem) 0; }

/* ── Post card grid ──────────────────────────────────────────────────────── */
.rc-post-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem;
}
.rc-post-grid--related { margin-top: 2rem; }
.rc-post-grid--search  { margin-top: 1.5rem; }
@media (max-width: 1023px) {
  .rc-post-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 639px) {
  .rc-post-grid { grid-template-columns: 1fr; }
}

/* First post spans full width on larger grids */
.rc-post-grid__item--featured { grid-column: 1 / -1; }
.rc-post-grid__item--featured .rc-post-card {
  display: grid;
  grid-template-columns: 55% 1fr;
  gap: 0;
}
.rc-post-grid__item--featured .rc-post-card__img-wrap { aspect-ratio: 16 / 9; }
.rc-post-grid__item--featured .rc-post-card__body { padding: 2rem 2.5rem; }
.rc-post-grid__item--featured .rc-post-card__title { font-size: clamp(1.25rem, 2.5vw, 2rem); }
@media (max-width: 767px) {
  .rc-post-grid__item--featured .rc-post-card { grid-template-columns: 1fr; }
  .rc-post-grid__item--featured .rc-post-card__body { padding: 1.25rem; }
}

/* ── Post card ───────────────────────────────────────────────────────────── */
.rc-post-card {
  background: var(--rc-white);
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 220ms var(--rc-ease), transform 220ms var(--rc-ease);
  height: 100%;
}
.rc-post-card:hover {
  box-shadow: var(--rc-shadow-lg);
  transform: translateY(-3px);
}

.rc-post-card__img-wrap {
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
}
.rc-post-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms var(--rc-ease);
  display: block;
}
.rc-post-card:hover .rc-post-card__img { transform: scale(1.05); }

.rc-post-card__body {
  padding: 1.375rem;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.5rem;
}
.rc-post-card__cat {
  display: inline-flex;
  align-items: center;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rc-primary);
  text-decoration: none;
  transition: opacity 150ms;
}
.rc-post-card__cat:hover { opacity: 0.7; }

.rc-post-card__title {
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.3;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-post-card__title a { color: var(--rc-text); text-decoration: none; }
.rc-post-card__title a:hover { color: var(--rc-primary); }

.rc-post-card__meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--rc-muted);
}
.rc-post-card__dot { opacity: 0.5; }

.rc-post-card__excerpt {
  font-size: 0.9rem;
  color: var(--rc-muted);
  line-height: 1.6;
  flex: 1;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-post-card__link {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-primary);
  text-decoration: none;
  margin-top: auto;
  padding-top: 0.5rem;
}
.rc-post-card__link:hover { text-decoration: underline; }

/* ── Single post layout ──────────────────────────────────────────────────── */

/* Reading progress bar — fixed strip at top of viewport */
.rc-read-progress {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: transparent;
  z-index: 9999;
  pointer-events: none;
}
.rc-read-progress--visible { display: block; }
.rc-read-progress__bar {
  height: 100%;
  width: 0%;
  background: var(--rc-primary);
  transition: width 80ms linear;
}

/* ── Post main wrapper ───────────────────────────────────────────────────── */
.rc-post-main {
  position: relative;
  overflow: hidden; /* clips absolute bg, prevents horizontal scroll */
  min-height: 100vh;
}

/* Dark overlay over background — same for all gradient/image variants */
.rc-post-main::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.58) 0%,
    rgba(0,0,0,0.42) 45%,
    rgba(0,0,0,0.28) 100%
  );
  pointer-events: none;
}

/* Colour-bleed image layer — position: absolute, never fixed */
.rc-post-bg {
  position: absolute;
  inset: -8%;
  z-index: 0;
  background-image: var(--rc-post-bg-url);
  background-size: cover;
  background-position: center;
  filter: blur(72px);
  transform: scale(1.12);
  opacity: 0.85;
}

/* ── 6 gradient mesh presets (deterministic: post_id % 6 + 1) ───────────── */
/* Preset 1 — Midnight purple */
.rc-post-grad-1 {
  background:
    radial-gradient(ellipse at 18% 28%, #5b2d8e 0%, transparent 55%),
    radial-gradient(ellipse at 78% 68%, #1e3a6e 0%, transparent 55%),
    radial-gradient(ellipse at 55% 85%, #0d4060 0%, transparent 50%),
    #0c0a1a;
}
/* Preset 2 — Deep ocean */
.rc-post-grad-2 {
  background:
    radial-gradient(ellipse at 72% 22%, #0d4f8a 0%, transparent 55%),
    radial-gradient(ellipse at 28% 75%, #0e6655 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, #0b1e3d 0%, transparent 60%),
    #050d17;
}
/* Preset 3 — Ember */
.rc-post-grad-3 {
  background:
    radial-gradient(ellipse at 25% 35%, #7c1036 0%, transparent 50%),
    radial-gradient(ellipse at 72% 60%, #a04500 0%, transparent 55%),
    radial-gradient(ellipse at 50% 90%, #2d0a00 0%, transparent 50%),
    #120407;
}
/* Preset 4 — Forest night */
.rc-post-grad-4 {
  background:
    radial-gradient(ellipse at 30% 40%, #0d5c2e 0%, transparent 55%),
    radial-gradient(ellipse at 70% 65%, #1a4a10 0%, transparent 50%),
    radial-gradient(ellipse at 55% 20%, #0a3020 0%, transparent 45%),
    #040d06;
}
/* Preset 5 — Cobalt dusk */
.rc-post-grad-5 {
  background:
    radial-gradient(ellipse at 60% 25%, #6b3a8a 0%, transparent 50%),
    radial-gradient(ellipse at 35% 70%, #1a3a6e 0%, transparent 55%),
    radial-gradient(ellipse at 80% 80%, #0d2040 0%, transparent 50%),
    #09060f;
}
/* Preset 6 — Carbon */
.rc-post-grad-6 {
  background:
    radial-gradient(ellipse at 40% 30%, #2a3a4a 0%, transparent 55%),
    radial-gradient(ellipse at 65% 70%, #1a2a3a 0%, transparent 50%),
    #090c12;
}

/* ── Hero section ────────────────────────────────────────────────────────── */
.rc-post-hero-section {
  position: relative;
  z-index: 2;
  padding: clamp(5rem, 12vw, 8rem) 0 clamp(3rem, 5vw, 4.5rem);
  color: #fff;
}
/* Hero + glass share same inner width → aligns with drawer full-content (85vw) */
.rc-post-hero-inner,
.rc-post-glass-inner {
  max-width: 85vw;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 3vw, 2.5rem);
}

/* Back to blog link */
.rc-post-back {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  color: rgba(255,255,255,0.65);
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-decoration: none;
  margin-bottom: 1.5rem;
  transition: color 150ms;
}
.rc-post-back:hover { color: #fff; }

/* Post title in hero */
.rc-post-hero__title {
  font-size: clamp(1.875rem, 5vw, 3.25rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.1;
  color: #fff;
  text-shadow: 0 2px 24px rgba(0,0,0,0.22);
  margin: 0.875rem 0 0;
  max-width: 780px;
}

/* ── Meta pills ──────────────────────────────────────────────────────────── */
.rc-post-meta-pills {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1.5rem;
}
.rc-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  font-size: 0.8125rem;
  font-weight: 500;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: rgba(255,255,255,0.9);
  white-space: nowrap;
  line-height: 1;
}
.rc-meta-pill--cat {
  text-decoration: none;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  background: rgba(255,255,255,0.18);
  color: #fff;
  transition: background 150ms;
}
.rc-meta-pill--cat:hover { background: rgba(255,255,255,0.28); }
.rc-meta-pill--author { padding-left: 0.3rem; }
.rc-meta-pill__avatar {
  width: 22px !important;
  height: 22px !important;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  flex-shrink: 0;
}

/* ── Glass card ──────────────────────────────────────────────────────────── */
.rc-post-glass {
  position: relative;
  z-index: 2;
  background: color-mix(in srgb, var(--rc-white) 92%, transparent);
  backdrop-filter: blur(32px) saturate(150%);
  -webkit-backdrop-filter: blur(32px) saturate(150%);
  border-radius: 1.75rem 1.75rem 0 0;
  box-shadow: 0 -4px 48px rgba(0,0,0,0.18), 0 0 0 1px rgba(255,255,255,0.5) inset;
  min-height: 70vh;
}
.rc-post-glass-inner {
  padding-top: clamp(2.5rem, 5vw, 4rem);
  padding-bottom: clamp(3rem, 6vw, 5rem);
}

/* ── Featured image — sits flush at top of glass card, above content ──────── */
.rc-post-featured-img {
  margin: 0;
  line-height: 0;
  overflow: hidden;
  border-radius: 1.75rem 1.75rem 0 0;
}
.rc-post-featured-img__img {
  display: block;
  width: 100%;
  height: clamp(220px, 42vw, 520px);
  object-fit: cover;
  object-position: center;
}
@media (max-width: 767px) {
  .rc-post-featured-img { border-radius: 1.25rem 1.25rem 0 0; }
  .rc-post-featured-img__img { height: clamp(180px, 52vw, 320px); }
}

/* Related posts and comments anchor to white ground below glass */
.rc-related-posts,
.rc-comments-wrap { position: relative; z-index: 2; background: var(--rc-surface); }
.rc-post-main .rc-related-posts { margin-top: 0; }

.rc-post-container { max-width: 85vw; }

/* Breadcrumb (no-image fallback only) */
.rc-post-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
  font-size: 0.8125rem;
  color: var(--rc-muted);
  padding: 1.5rem 0 0;
}
.rc-post-breadcrumb a { color: var(--rc-muted); text-decoration: none; }
.rc-post-breadcrumb a:hover { color: var(--rc-primary); }
.rc-post-breadcrumb [aria-current] { color: var(--rc-text); font-weight: 500; }

/* ── Mobile ──────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
  .rc-post-hero-section { padding: 5rem 0 2.5rem; }
  .rc-post-glass { border-radius: 1.25rem 1.25rem 0 0; }
  .rc-post-glass-inner { padding-top: 2rem; padding-bottom: 3rem; }
  .rc-post-hero__title { font-size: clamp(1.625rem, 7vw, 2.25rem); }
  .rc-post-meta-pills { gap: 0.375rem; }
}

/* ── Entry content (rich text) ───────────────────────────────────────────── */
.entry-content {
  font-size: 1.0625rem;
  line-height: 1.8;
  color: var(--rc-text);
}
.entry-content > * { margin-bottom: 1.5em; }
.entry-content > *:last-child { margin-bottom: 0; }
.entry-content h2,
.entry-content h3,
.entry-content h4 {
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  margin-top: 2.25em;
  margin-bottom: 0.75em;
  color: var(--rc-text);
}
.entry-content h2 { font-size: 1.625rem; letter-spacing: -0.03em; }
.entry-content h3 { font-size: 1.3125rem; }
.entry-content h4 { font-size: 1.125rem; }
.entry-content a {
  color: var(--rc-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.entry-content a:hover { text-decoration: none; }
/* Prevent entry-content link colour from bleeding into rc-btn anchor elements */
.entry-content .rc-btn { text-decoration: none; }
/* My Account sidebar renders inside .entry-content (via page.php) — the prose
   underline-by-default convention above isn't right for a nav menu. */
.entry-content .rc-account-nav__link { text-decoration: none; }
.entry-content .rc-btn--primary { color: var(--rc-btn-text); }
.entry-content .rc-btn--secondary { color: var(--rc-text); }
.entry-content .rc-btn--ghost { color: var(--rc-text); }
.entry-content strong { font-weight: 700; color: var(--rc-text); }
.entry-content em { font-style: italic; }
.entry-content ul,
.entry-content ol {
  padding-left: 1.5rem;
}
.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li { margin-bottom: 0.375em; }
.entry-content blockquote {
  border-left: 4px solid var(--rc-primary);
  margin: 2em 0;
  padding: 1rem 1.5rem;
  background: var(--rc-surface);
  border-radius: 0 var(--rc-radius-sm) var(--rc-radius-sm) 0;
  font-style: italic;
  font-size: 1.125rem;
  color: var(--rc-text);
}
.entry-content blockquote p { margin: 0; }
.entry-content img {
  max-width: 100%;
  height: auto;
  border-radius: var(--rc-radius);
  display: block;
}
.entry-content figure { margin: 0; }
.entry-content figcaption {
  font-size: 0.875rem;
  color: var(--rc-muted);
  text-align: center;
  margin-top: 0.5rem;
}
.entry-content code {
  font-family: 'SF Mono', 'Fira Code', monospace;
  font-size: 0.875em;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: 4px;
  padding: 0.1em 0.4em;
}
.entry-content pre {
  background: #111110;
  color: #d4d4cf;
  border-radius: var(--rc-radius);
  padding: 1.25rem 1.5rem;
  overflow-x: auto;
  font-size: 0.875rem;
  line-height: 1.6;
}
.entry-content pre code { background: none; border: none; padding: 0; color: inherit; }
.entry-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
}
.entry-content th,
.entry-content td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--rc-border);
  text-align: left;
}
.entry-content th { font-weight: 700; }
.entry-content tr:last-child td { border-bottom: none; }
.entry-content hr {
  border: none;
  border-top: 1px solid var(--rc-border);
  margin: 2.5em 0;
}

/* ── Post tags ───────────────────────────────────────────────────────────── */
.rc-post-tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 2rem 0;
  border-top: 1px solid var(--rc-border);
  margin-top: 2rem;
}
.rc-post-tags__label { font-size: 0.875rem; font-weight: 600; color: var(--rc-muted); }
.rc-post-tag {
  display: inline-flex;
  font-size: 0.8125rem;
  padding: 0.3rem 0.875rem;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: 9999px;
  color: var(--rc-text);
  text-decoration: none;
  transition: background 150ms, border-color 150ms;
}
.rc-post-tag:hover {
  background: var(--rc-border);
  border-color: var(--rc-border-dark);
}

/* ── Social share ────────────────────────────────────────────────────────── */
.rc-post-share {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.625rem;
  padding: 1.75rem 0;
}
.rc-post-share__label { font-size: 0.875rem; font-weight: 600; color: var(--rc-muted); margin-right: 0.25rem; }
.rc-post-share__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  font-weight: 600;
  font-family: var(--rc-font);
  padding: 0.5rem 1rem;
  border-radius: var(--rc-radius-sm);
  border: 1.5px solid var(--rc-border);
  background: transparent;
  color: var(--rc-text);
  text-decoration: none;
  cursor: pointer;
  transition: background 150ms, border-color 150ms, color 150ms;
}
.rc-post-share__btn:hover { background: var(--rc-surface); border-color: var(--rc-border-dark); }

/* ── Author bio ──────────────────────────────────────────────────────────── */
.rc-post-author {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  padding: 1.5rem;
  margin: 2rem 0;
}
.rc-post-author__img {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
}
.rc-post-author__name { font-weight: 700; font-size: 0.9375rem; display: block; margin-bottom: 0.375rem; }
.rc-post-author__bio { font-size: 0.9rem; color: var(--rc-muted); margin: 0; line-height: 1.6; }

/* ── Post navigation (prev / next) ──────────────────────────────────────── */
.rc-post-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  padding: 2rem 0;
  border-top: 1px solid var(--rc-border);
  margin-top: 1rem;
}
.rc-post-nav__item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-decoration: none;
  padding: 1rem 1.25rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  transition: background 150ms, border-color 150ms;
}
.rc-post-nav__item:hover { background: var(--rc-surface); border-color: var(--rc-border-dark); }
.rc-post-nav__item--next { text-align: right; }
.rc-post-nav__label { font-size: 0.8125rem; font-weight: 600; color: var(--rc-muted); }
.rc-post-nav__title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--rc-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 479px) {
  .rc-post-nav { grid-template-columns: 1fr; }
}

/* ── Related posts section ───────────────────────────────────────────────── */
.rc-related-posts {
  background: var(--rc-surface);
  padding: clamp(3rem, 6vw, 5rem) 0;
  margin-top: 4rem;
}
.rc-related-posts .rc-section-title { margin-bottom: 2rem; }

/* ── Comments ────────────────────────────────────────────────────────────── */
.rc-comments-wrap {
  padding: clamp(2.5rem, 5vw, 4rem) 0;
  border-top: 1px solid var(--rc-border);
}
.rc-comments-wrap .comment-form-comment label,
.rc-comments-wrap .comment-form-author label,
.rc-comments-wrap .comment-form-email label { font-size: 0.875rem; font-weight: 600; display: block; margin-bottom: 0.4rem; }
.rc-comments-wrap .comment-form input,
.rc-comments-wrap .comment-form textarea {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius-sm);
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  background: var(--rc-white);
  color: var(--rc-text);
  outline: none;
  transition: border-color 180ms;
}
.rc-comments-wrap .comment-form input:focus,
.rc-comments-wrap .comment-form textarea:focus { border-color: var(--rc-primary); }
.rc-comments-wrap .form-submit .submit {
  padding: 0.625rem 1.5rem;
  background: var(--rc-primary);
  color: #fff;
  border: none;
  border-radius: var(--rc-radius-sm);
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 150ms;
}
.rc-comments-wrap .form-submit .submit:hover { background: var(--rc-primary-dark); }

/* ── CMS page templates ──────────────────────────────────────────────────── */
.rc-page-hero {
  position: relative;
  aspect-ratio: 21 / 7;
  overflow: hidden;
}
.rc-page-hero__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rc-page-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%);
}
.rc-page-hero__inner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding-bottom: 2.5rem;
}
.rc-page-hero__title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  color: #fff;
  margin: 0;
}
.rc-page-header {
  padding: clamp(3rem, 6vw, 5rem) 0 2rem;
  border-bottom: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.rc-page-header__title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin: 0;
}
.rc-page-body { padding: clamp(3rem, 6vw, 4rem) 0; }
.rc-page-body--wc { padding: 0; }
.rc-page--no-header > .rc-page-body { padding-top: 0; }
.rc-prose-container { max-width: 800px; }

/* ── Search results page ─────────────────────────────────────────────────── */
.rc-search-results-main { padding: 0 0 4rem; }
.rc-search-results-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  padding: clamp(2rem, 4vw, 3.5rem) 0 2rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-search-results-title {
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  margin: 0;
  color: var(--rc-text);
}
.rc-search-results-title em { font-style: normal; color: var(--rc-primary); }
.rc-search-results-form {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.rc-search-results-input {
  height: 42px;
  padding: 0 1rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  outline: none;
  min-width: 240px;
  transition: border-color 180ms;
}
.rc-search-results-input:focus { border-color: var(--rc-primary); }

/* Tabs */
.rc-search-tabs { margin-top: 2rem; }
.rc-search-tabs__nav {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--rc-border);
  margin-bottom: 2rem;
}
.rc-search-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 600;
  font-family: var(--rc-font);
  color: var(--rc-muted);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: color 150ms, border-color 150ms;
}
.rc-search-tab--active { color: var(--rc-text); border-bottom-color: var(--rc-primary); }
.rc-search-tab__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  background: var(--rc-surface);
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 700;
}
.rc-search-empty-msg,
.rc-blog-empty p {
  font-size: 1rem;
  color: var(--rc-muted);
  padding: 3rem 0;
  text-align: center;
}

/* ── Blog / archive pagination ───────────────────────────────────────────── */
.rc-pagination { margin-top: 3rem; display: flex; justify-content: center; }
.rc-pagination .nav-links {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  flex-wrap: wrap;
  justify-content: center;
}
.rc-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 0.875rem;
  border-radius: var(--rc-radius);
  border: 1.5px solid var(--rc-border);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  transition: background 150ms, border-color 150ms, color 150ms;
  white-space: nowrap;
}
.rc-pagination .page-numbers:hover {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: #fff;
}
.rc-pagination .page-numbers.current {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: #fff;
  font-weight: 700;
  pointer-events: none;
}
.rc-pagination .page-numbers.dots {
  border: none;
  background: transparent;
  pointer-events: none;
  color: var(--rc-muted);
}
.rc-pagination .prev.page-numbers,
.rc-pagination .next.page-numbers {
  padding: 0 1.125rem;
  gap: 0.375rem;
}
@media (max-width: 479px) {
  .rc-pagination .prev.page-numbers,
  .rc-pagination .next.page-numbers { font-size: 0.8125rem; padding: 0 0.75rem; }
}
.rc-search-no-results {
  text-align: center;
  padding: 4rem 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}
.rc-search-no-results p { font-size: 1.0625rem; color: var(--rc-muted); margin: 0; }

/* =============================================================================
   20. MY ACCOUNT
   ============================================================================= */

/* Layout */
.rc-account-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 2.5rem;
  padding: 3rem 0 5rem;
  align-items: start;
}
@media (max-width: 767px) {
  .rc-account-layout { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* Sidebar */
.rc-account-sidebar { position: sticky; top: 100px; }

/* Nav card */
.rc-account-nav {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  overflow: hidden;
}

/* Nav section header */
.rc-account-nav__header {
  padding: 0.75rem 1.25rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rc-muted);
  border-bottom: 1px solid var(--rc-border);
}

/* Nav list */
.rc-account-nav__list { list-style: none; padding: 0.5rem 0.625rem; margin: 0; }
.rc-account-nav__item { margin: 0; list-style: none; }
.rc-account-nav__item::marker,
.rc-account-nav__item::before { display: none; content: none; }
.rc-account-nav__link {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.6rem 0.875rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--rc-text);
  text-decoration: none;
  border-radius: var(--rc-radius);
  transition: background 160ms, color 160ms;
  position: relative;
}
.rc-account-nav__label { flex: 1; }
.rc-account-nav__icon {
  color: var(--rc-muted);
  flex-shrink: 0;
  transition: color 160ms, transform 160ms;
}
.rc-account-nav__chevron {
  color: var(--rc-border);
  flex-shrink: 0;
  transition: color 160ms, transform 160ms;
  opacity: 0;
}
.rc-account-nav__link:hover .rc-account-nav__chevron { opacity: 1; }

/* Hover state */
.rc-account-nav__link:hover {
  background: var(--rc-surface);
  color: var(--rc-text);
}
.rc-account-nav__link:hover .rc-account-nav__icon { color: var(--rc-primary); }
.rc-account-nav__link:hover .rc-account-nav__chevron { color: var(--rc-muted); }

/* Active state — filled pill */
.rc-account-nav__link--active,
.rc-account-nav__item.is-active .rc-account-nav__link {
  background: var(--rc-primary);
  color: #fff;
  font-weight: 600;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--rc-primary) 40%, transparent);
}
.rc-account-nav__link--active .rc-account-nav__icon,
.rc-account-nav__item.is-active .rc-account-nav__icon { color: #fff; }
.rc-account-nav__link--active .rc-account-nav__chevron,
.rc-account-nav__item.is-active .rc-account-nav__chevron { color: rgba(255,255,255,0.6); opacity: 1; }
.rc-account-nav__link--active:hover,
.rc-account-nav__item.is-active .rc-account-nav__link:hover { background: var(--rc-primary); opacity: 0.92; }

/* Logout */
.rc-account-nav__item--logout {
  border-top: 1px solid var(--rc-border);
  margin-top: 0.5rem;
  padding-top: 0.375rem;
}
.rc-account-nav__item--logout .rc-account-nav__link { color: var(--rc-muted); }
.rc-account-nav__item--logout .rc-account-nav__link:hover {
  background: #fef2f2;
  color: #ef4444;
}
.rc-account-nav__item--logout .rc-account-nav__link:hover .rc-account-nav__icon { color: #ef4444; }

/* Content area */
.rc-account-content { min-width: 0; }
.rc-account-content h2 {
  font-size: 1.1875rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-account-content h3 { font-size: 0.9375rem; font-weight: 700; margin: 1.5rem 0 0.75rem; }

/* WC account tables */
.woocommerce-account table.shop_table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  overflow: hidden;
}
.woocommerce-account table.shop_table th {
  text-align: left;
  padding: 0.625rem 1rem;
  background: var(--rc-surface);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rc-muted);
  border-bottom: 1px solid var(--rc-border);
}
.woocommerce-account table.shop_table td {
  padding: 0.875rem 1rem;
  border-bottom: 1px solid var(--rc-border);
  vertical-align: middle;
}
.woocommerce-account table.shop_table tbody tr:last-child td { border-bottom: none; }
.woocommerce-account table.shop_table .woocommerce-orders-table__cell-order-actions a,
.woocommerce-account table.shop_table tfoot .button {
  display: inline-block;
  padding: 0.375rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--rc-text);
  font-family: var(--rc-font);
  transition: background 150ms, border-color 150ms, color 150ms;
}
.woocommerce-account table.shop_table .woocommerce-orders-table__cell-order-actions a:hover,
.woocommerce-account table.shop_table tfoot .button:hover {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: var(--rc-btn-text);
}

/* Account forms — WC's own CSS only cards form.login/form.register/form.checkout_coupon
   by coincidence (hardcoded lavender border that ignores color-skin swaps), and never
   covers .woocommerce-ResetPassword at all. Replace with theme-token-driven styling so
   every account form (login, register, lost password, edit account) matches and follows
   the active color skin. */
.woocommerce-account form.login,
.woocommerce-account form.register,
.woocommerce-account form.checkout_coupon,
.woocommerce-account .woocommerce-ResetPassword,
.woocommerce-account .woocommerce-EditAccountForm {
  border: 1px solid var(--rc-border) !important;
  border-radius: var(--rc-radius-lg) !important;
  padding: 1.5rem !important;
  margin: 0 !important;
  background: var(--rc-surface, var(--rc-white)) !important;
}
.woocommerce-account .woocommerce-ResetPassword > p:first-child {
  margin-top: 0;
  color: var(--rc-muted);
  font-size: 0.9375rem;
}

.woocommerce-account fieldset { border: 1px solid var(--rc-border); border-radius: var(--rc-radius); padding: 1.25rem; margin: 1.5rem 0; }
.woocommerce-account fieldset legend { font-weight: 700; font-size: 0.9375rem; padding: 0 0.5rem; }
.woocommerce-account .woocommerce-form-row,
.woocommerce-account p.form-row { margin-bottom: 1rem; }
.woocommerce-account .woocommerce-form-row label,
.woocommerce-account p.form-row label {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 0.375rem;
  color: var(--rc-muted);
}
.woocommerce-account .woocommerce-form-row input[type="text"],
.woocommerce-account .woocommerce-form-row input[type="email"],
.woocommerce-account .woocommerce-form-row input[type="password"],
.woocommerce-account .woocommerce-form-row input[type="tel"],
.woocommerce-account p.form-row input[type="text"],
.woocommerce-account p.form-row input[type="email"],
.woocommerce-account p.form-row input[type="password"],
.woocommerce-account p.form-row input[type="tel"] {
  display: block;
  width: 100%;
  height: 44px;
  padding: 0 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  background: var(--rc-surface);
  color: var(--rc-text);
  outline: none;
  transition: border-color 150ms;
  box-sizing: border-box;
}
.woocommerce-account .woocommerce-form-row input:focus,
.woocommerce-account p.form-row input:focus { border-color: var(--rc-primary); }
.woocommerce-account .woocommerce-Button,
.woocommerce-account .button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  height: 44px !important;
  padding: 0 1.5rem !important;
  background: var(--rc-primary) !important;
  color: var(--rc-btn-text) !important;
  border: none !important;
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  width: auto !important;
  line-height: 1 !important;
  transition: opacity 150ms !important;
  box-sizing: border-box !important;
}
.woocommerce-account .woocommerce-Button:hover,
.woocommerce-account .button:hover { opacity: 0.85 !important; color: var(--rc-btn-text) !important; }

/* Address grid */
/* Suppress clearfix pseudo-elements — they become ghost grid items and break column placement */
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after { display: none; }
.woocommerce-account .woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
@media (max-width: 599px) { .woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr; } }
.woocommerce-account .woocommerce-Address {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  padding: 1.5rem;
  width: 100% !important; /* override WC's width: 48% which breaks grid column sizing */
  float: none !important;
}
.woocommerce-account .woocommerce-Address-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.875rem;
}
.woocommerce-account .woocommerce-Address-title h3 { margin: 0; font-size: 0.9375rem; font-weight: 700; }
.woocommerce-account .woocommerce-Address-title a {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-primary);
  text-decoration: none;
}
.woocommerce-account address { font-style: normal; font-size: 0.9375rem; line-height: 1.7; color: var(--rc-text); }

/* =============================================================================
   21. ORDER THANK YOU
   ============================================================================= */

.rc-thankyou { max-width: 680px; margin: 3rem auto 5rem; padding: 0 1rem; }

/* Header */
.rc-thankyou__header { text-align: center; margin-bottom: 2.5rem; }
.rc-thankyou__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  background: var(--rc-success);
  border-radius: 9999px;
  color: #fff;
  margin-bottom: 1.25rem;
}
.rc-thankyou__title { font-size: 1.75rem; font-weight: 800; letter-spacing: -0.03em; margin: 0 0 0.625rem; }
.rc-thankyou__subtitle { color: var(--rc-muted); font-size: 0.9375rem; margin: 0; }

/* Meta strip */
.rc-thankyou__meta-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  overflow: hidden;
  margin-bottom: 2rem;
}
@media (max-width: 599px) { .rc-thankyou__meta-strip { grid-template-columns: 1fr 1fr; } }
@media (max-width: 599px) {
  /* Top-row items need a bottom divider; right-column items have no right border to show */
  .rc-thankyou__meta-item:nth-child(1),
  .rc-thankyou__meta-item:nth-child(2) { border-bottom: 1px solid var(--rc-border); }
  .rc-thankyou__meta-item:nth-child(2n) { border-right: none; }
}
.rc-thankyou__meta-item {
  padding: 1.125rem 1rem;
  border-right: 1px solid var(--rc-border);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.rc-thankyou__meta-item:last-child { border-right: none; }
.rc-thankyou__meta-label { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--rc-muted); }
.rc-thankyou__meta-value { font-size: 0.9375rem; font-weight: 700; }
.rc-thankyou__meta-value--total { color: var(--rc-primary); }

/* Items */
.rc-thankyou__items {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.rc-thankyou__section-title {
  font-size: 0.8125rem !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--rc-muted);
  padding: 0.875rem 1.25rem;
  margin: 0;
  border-bottom: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.rc-thankyou__item-list { list-style: none; padding: 0; margin: 0; }
.rc-thankyou__item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-thankyou__item:last-child { border-bottom: none; }
.rc-thankyou__item-img {
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: var(--rc-radius);
  flex-shrink: 0;
  border: 1px solid var(--rc-border);
}
.rc-thankyou__item-img--placeholder {
  background: var(--rc-border);
}
.rc-thankyou__item-info { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.rc-thankyou__item-name { font-size: 0.9375rem; font-weight: 600; }
.rc-thankyou__item-qty { font-size: 0.8125rem; color: var(--rc-muted); }
.rc-thankyou__item-price { font-size: 0.9375rem; font-weight: 700; white-space: nowrap; }

/* Totals table */
.rc-thankyou__totals { width: 100%; border-collapse: collapse; }
.rc-thankyou__totals th,
.rc-thankyou__totals td {
  padding: 0.625rem 1.25rem;
  text-align: right;
  font-size: 0.875rem;
}
.rc-thankyou__totals th { text-align: left; color: var(--rc-muted); font-weight: 500; }
.rc-thankyou__totals-grand th,
.rc-thankyou__totals-grand td {
  font-size: 1rem;
  font-weight: 700;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  border-top: 1px solid var(--rc-border);
}

/* Addresses */
.rc-thankyou__addresses {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 499px) { .rc-thankyou__addresses { grid-template-columns: 1fr; } }
.rc-thankyou__address {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  overflow: hidden;
}
.rc-thankyou__address address {
  font-style: normal;
  font-size: 0.875rem;
  line-height: 1.7;
  padding: 1rem 1.25rem;
}

/* CTAs */
.rc-thankyou__actions {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 2rem;
}

/* Fallback */
.rc-thankyou--fallback { text-align: center; padding: 4rem 0; }
.rc-thankyou__fallback-msg { font-size: 1.125rem; margin-bottom: 1.5rem; }

/* BACS (Direct Bank Transfer) payment details */
.woocommerce-bacs-bank-details {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.wc-bacs-bank-details-heading {
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--rc-muted) !important;
  padding: 0.875rem 1.25rem;
  margin: 0 !important;
  border-bottom: 1px solid var(--rc-border);
  background: var(--rc-surface);
}
.wc-bacs-bank-details-account-name {
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  padding: 1rem 1.25rem 0.25rem !important;
  margin: 0 !important;
}
ul.wc-bacs-bank-details.order_details.bacs_details {
  list-style: none;
  margin: 0;
  padding: 0.5rem 1.25rem 1.25rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem 1rem;
}
ul.wc-bacs-bank-details.order_details.bacs_details::before,
ul.wc-bacs-bank-details.order_details.bacs_details::after { display: none; }
ul.wc-bacs-bank-details li {
  font-size: 0.8125rem;
  color: var(--rc-muted);
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
ul.wc-bacs-bank-details li {
  border-right: none !important;
  border-bottom: none !important;
  padding: 0 !important;
}
ul.wc-bacs-bank-details li strong {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--rc-text);
  overflow-wrap: break-word;
  word-break: break-word;
}

/* =============================================================================
   22. 404 PAGE
   ============================================================================= */

.rc-404-main {
  min-height: 70vh;
  display: flex;
  align-items: center;
}
.rc-404 {
  text-align: center;
  padding: 5rem 1rem;
  max-width: 560px;
  margin: 0 auto;
}
.rc-404__code {
  font-size: clamp(5rem, 20vw, 10rem);
  font-weight: 800;
  line-height: 1;
  color: var(--rc-border);
  letter-spacing: -0.04em;
  margin-bottom: 0.25rem;
}
.rc-404__title {
  font-size: clamp(1.375rem, 3vw, 1.875rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 0.875rem;
}
.rc-404__desc {
  color: var(--rc-muted);
  font-size: 1rem;
  margin: 0 0 2rem;
}
.rc-404__actions {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 2.5rem;
}
.rc-404__search {
  display: flex;
  gap: 0.5rem;
  max-width: 440px;
  margin: 0 auto;
}
.rc-404__search-input {
  flex: 1;
  height: 44px;
  padding: 0 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  background: var(--rc-surface);
  color: var(--rc-text);
  outline: none;
  transition: border-color 150ms;
}
.rc-404__search-input:focus { border-color: var(--rc-primary); }

/* =============================================================================
   28. COMMENTS
   ============================================================================= */

/* Outer wrapper */
.rc-comments {
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid var(--rc-border);
}

/* Titles */
.rc-comments__title {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 1.75rem;
}
.rc-comment-form__title {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 2.5rem 0 1.25rem;
  padding-top: 2rem;
  border-top: 1px solid var(--rc-border);
}

/* Comment list */
.rc-comment-list {
  list-style: none;
  padding: 0;
  margin: 0 0 2.5rem;
}
.rc-comment-list .children {
  list-style: none;
  padding: 0;
  margin: 1rem 0 0 3.5rem;
  border-left: 3px solid var(--rc-border);
  padding-left: 1.5rem;
}
@media (max-width: 599px) {
  .rc-comment-list .children { margin-left: 1rem; padding-left: 1rem; }
}

/* Single comment item */
.rc-comment {
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--rc-border);
}
.rc-comment:last-child { border-bottom: none; }
.rc-comment--pingback { padding: 0.75rem 0; }

/* Comment body — avatar + content side by side */
.rc-comment__body {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

/* Avatar */
.rc-comment__avatar { flex-shrink: 0; }
.rc-comment__avatar-img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  border: 2px solid var(--rc-border);
}

/* Content column */
.rc-comment__content { flex: 1; min-width: 0; }

/* Meta: author + date + pending badge */
.rc-comment__meta {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.625rem;
}
.rc-comment__author { font-size: 0.9375rem; font-weight: 700; }
.rc-comment__time { font-size: 0.8125rem; color: var(--rc-muted); }
.rc-comment__pending {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  background: var(--rc-warning, #f59e0b);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 4px;
}

/* Comment text */
.rc-comment__text { font-size: 0.9375rem; line-height: 1.7; }
.rc-comment__text > p:first-child { margin-top: 0; }
.rc-comment__text > p:last-child  { margin-bottom: 0; }

/* Reply / edit actions */
.rc-comment__actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 0.75rem;
}
.rc-comment__actions a,
.rc-comment__edit a {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-primary);
  text-decoration: none;
  transition: opacity 150ms;
}
.rc-comment__actions a:hover,
.rc-comment__edit a:hover { opacity: 0.7; }

/* Pingback line */
.rc-comment__pingback {
  font-size: 0.875rem;
  color: var(--rc-muted);
  margin: 0;
}

/* Paginated comments nav */
.rc-comment-pagination {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 1.5rem 0;
  flex-wrap: wrap;
}
.rc-comment-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 0.5rem;
  border-radius: var(--rc-radius);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--rc-text);
  border: 1.5px solid var(--rc-border);
  transition: background 150ms, border-color 150ms, color 150ms;
}
.rc-comment-pagination .page-numbers:hover {
  background: var(--rc-surface);
  border-color: var(--rc-primary);
  color: var(--rc-primary);
}
.rc-comment-pagination .page-numbers.current {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: #fff;
}

/* System notices */
.rc-comments-password,
.rc-comments-closed {
  padding: 1rem 1.25rem;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-size: 0.9375rem;
  color: var(--rc-muted);
  margin: 1.5rem 0;
}

/* Comment form wrapper + fields grid */
.rc-comment-form { margin-top: 0.5rem; }
.rc-comment-form__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 599px) {
  .rc-comment-form__fields { grid-template-columns: 1fr; }
}
.rc-comment-form__submit { margin-top: 1.25rem; display: flex; align-items: center; gap: 1rem; }

/* =============================================================================
   29. CHECKOUT LAYOUT  (overrides woocommerce/checkout/form-checkout.php)
   ============================================================================= */

/* Outer form — adds breathing room around the WC checkout form */
.rc-checkout-form {
  padding: 2.5rem 0 5rem;
}

/* Two-column grid: billing/shipping left, order summary right */
.rc-checkout-layout {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 2.5rem;
  align-items: start;
}
@media (max-width: 1023px) {
  .rc-checkout-layout { grid-template-columns: 1fr 340px; gap: 1.75rem; }
}
@media (max-width: 767px) {
  .rc-checkout-layout { grid-template-columns: 1fr; }
  /* Summary card floats above the form on mobile */
  .rc-checkout-layout__summary { order: -1; position: static; }
  /* Allow WC order review table to scroll horizontally if content is too wide */
  .rc-checkout-layout__summary { overflow-x: auto; }
  .rc-checkout-layout .shop_table,
  .rc-checkout-layout table { min-width: 0; width: 100%; word-break: break-word; }
}

/* Left column */
.rc-checkout-layout__fields { min-width: 0; }

/* Right column — sticky so it scrolls with the page but stays visible */
.rc-checkout-layout__summary {
  min-width: 0;
  position: sticky;
  top: calc(var(--rc-header-h, 64px) + 1.5rem);
}

/* Wrap the WC order review in a card.
   #order_review and .rc-checkout-layout__summary are the SAME element in form-checkout.php,
   so the selector must target the summary itself, not a descendant. */
.rc-checkout-layout__summary {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  padding: 1.5rem;
}

/* Additional notes field area */
.rc-checkout-notes {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--rc-border);
}

/* WC checkout validation states */
.woocommerce-checkout .form-row.woocommerce-invalid input[type="text"],
.woocommerce-checkout .form-row.woocommerce-invalid input[type="email"],
.woocommerce-checkout .form-row.woocommerce-invalid input[type="tel"],
.woocommerce-checkout .form-row.woocommerce-invalid select,
.woocommerce-checkout .form-row.woocommerce-invalid textarea {
  border-color: var(--rc-error, #ef4444) !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12) !important;
}
.woocommerce-checkout .form-row.woocommerce-validated input[type="text"],
.woocommerce-checkout .form-row.woocommerce-validated input[type="email"],
.woocommerce-checkout .form-row.woocommerce-validated input[type="tel"],
.woocommerce-checkout .form-row.woocommerce-validated select {
  border-color: var(--rc-success, #22c55e) !important;
}
.woocommerce-checkout .form-row .woocommerce-error,
.woocommerce-checkout .form-row .woocommerce-invalid-required-field { font-size: 0.8125rem; color: var(--rc-error, #ef4444); margin-top: 0.25rem; }

/* =============================================================================
   29b. CHECKOUT — WooCommerce Blocks checkout (the live Checkout page uses the
   woocommerce/checkout block, not form-checkout.php above). Edit-cart link +
   per-item remove button injected by RCCheckoutCartSync in app.js.
   ============================================================================= */

.rc-checkout-edit-link {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.75rem;
}
.rc-checkout-edit-link a {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-muted);
  text-decoration: none;
  padding: 0.375rem 0.25rem;
  transition: color 150ms;
}
.rc-checkout-edit-link a:hover { color: var(--rc-primary); text-decoration: underline; }
.rc-checkout-edit-link svg { flex-shrink: 0; }

.wc-block-components-order-summary-item { position: relative; }
.rc-order-item-remove {
  position: absolute;
  top: 0;
  right: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--rc-muted);
  cursor: pointer;
  transition: background 150ms, color 150ms, opacity 150ms;
}
.rc-order-item-remove:hover { background: var(--rc-surface); color: var(--rc-error, #ef4444); }
.rc-order-item-remove:disabled { opacity: 0.4; cursor: default; }
.rc-order-item-remove svg { pointer-events: none; }

/* Checkout "cart is now empty" state — stock WooCommerce Blocks markup
   (.wc-block-checkout-empty), never restyled before; used the browser's raw
   button-block styling (dark rectangle, underlined text). */
.wc-block-checkout-empty {
  text-align: center;
  padding: 4rem 1.5rem;
  max-width: 460px;
  margin: 0 auto;
}
.wc-block-checkout-empty__image {
  color: var(--rc-muted);
  opacity: 0.5;
  margin-bottom: 1.25rem;
}
.wc-block-checkout-empty__title {
  display: block;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--rc-text);
  margin-bottom: 0.625rem;
}
.wc-block-checkout-empty__description {
  color: var(--rc-muted);
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0 0 1.75rem;
}
.wc-block-checkout-empty .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 1.75rem;
  border-radius: var(--rc-radius);
  background: var(--rc-primary);
  color: #fff;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: opacity 150ms;
}
.wc-block-checkout-empty .wp-block-button__link:hover { opacity: 0.88; text-decoration: none; }

/* =============================================================================
   29c. BLOCK RESPONSIVE VISIBILITY  (inc/block-visibility.php)
   ============================================================================= */
@media (min-width: 1024px) {
  .rc-hide-desktop { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .rc-hide-tablet { display: none !important; }
}
@media (max-width: 767px) {
  .rc-hide-mobile { display: none !important; }
}

/* =============================================================================
   30. UTILITIES & HERO VARIANT FIXES
   ============================================================================= */

/* rc-textarea — textarea counterpart to rc-input, used in comment form + any freetext field */
.rc-textarea {
  display: block;
  width: 100%;
  padding: 0.75rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: 8px;
  font: inherit;
  font-size: 0.9375rem;
  color: var(--rc-text);
  background: var(--rc-white);
  transition: border-color 200ms, box-shadow 200ms;
  outline: none;
  -webkit-appearance: none;
  resize: vertical;
  min-height: 120px;
  line-height: 1.6;
  box-sizing: border-box;
}
.rc-textarea:focus {
  border-color: var(--rc-primary);
  box-shadow: 0 0 0 3px rgba(var(--rc-primary-rgb), 0.12);
}

/* Hero fullwidth — centre the text over the bg image */
.rc-hero--fullwidth .rc-hero__inner {
  justify-content: center;
  text-align: center;
}
.rc-hero--fullwidth .rc-hero__content {
  align-items: center;
  max-width: 700px;
}
.rc-hero--fullwidth .rc-hero__actions { justify-content: center; }

/* Hero split — ensure bg image is anchored to the right on desktop */
.rc-hero--split .rc-hero__bg { background-position: center right; }

/* rc-hero on homepage — taller min-height than shortcode hero */
.rc-home-hero.rc-hero--fullwidth { min-height: 85vh; }
.rc-home-hero.rc-hero--split     { min-height: 75vh; }

/* Ensure hero badge is always visible on dark overlays */
.rc-hero--overlay .rc-hero__badge,
.rc-hero--fullwidth .rc-hero__badge {
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.3);
  color: #fff;
}

/* =============================================================================
   31. SELECT2 OVERRIDES  (WooCommerce uses Select2 for country/state dropdowns)
   ============================================================================= */

/* Container */
.select2-container { width: 100% !important; }
.select2-container--default .select2-selection--single {
  height: 44px !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: 8px !important;
  background: var(--rc-white) !important;
  color: var(--rc-text) !important;
  outline: none !important;
  transition: border-color 200ms, box-shadow 200ms !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--rc-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--rc-primary-rgb), 0.12) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  height: 44px !important;
  line-height: 44px !important;
  padding: 0 2.25rem 0 0.875rem !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  color: var(--rc-text) !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--rc-muted) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 42px !important;
  right: 0.625rem !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--rc-muted) transparent transparent transparent !important;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--rc-muted) transparent !important;
}

/* Dropdown */
.select2-dropdown {
  border: 1.5px solid var(--rc-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important;
  background: var(--rc-white) !important;
  overflow: hidden !important;
  margin-top: 2px !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1.5px solid var(--rc-border) !important;
  border-radius: 6px !important;
  padding: 0.5rem 0.75rem !important;
  font-family: var(--rc-font) !important;
  font-size: 0.875rem !important;
  outline: none !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
  border-color: var(--rc-primary) !important;
}

/* Options */
.select2-results__option {
  padding: 0.6rem 0.875rem !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  cursor: pointer !important;
  transition: background 100ms !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
  background: var(--rc-surface) !important;
  color: var(--rc-primary) !important;
}
.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option[data-selected="true"] {
  background: var(--rc-primary) !important;
  color: #fff !important;
}

/* Woocommerce invalid state */
.woocommerce-checkout .form-row.woocommerce-invalid .select2-container--default .select2-selection--single {
  border-color: var(--rc-error, #ef4444) !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12) !important;
}

/* =============================================================================
   32. WOOCOMMERCE SHIPPING METHODS  (cart & checkout)
   ============================================================================= */

/* Shipping table in cart totals */
.woocommerce-shipping-calculator { margin-top: 1rem; }
.woocommerce-shipping-calculator h2 a,
.woocommerce-shipping-calculator .shipping-calculator-button {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-primary);
  text-decoration: none;
  cursor: pointer;
}
.woocommerce-shipping-calculator h2 a:hover,
.woocommerce-shipping-calculator .shipping-calculator-button:hover { opacity: 0.75; }

/* Shipping method radio list */
.woocommerce-shipping-methods {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.woocommerce-shipping-methods li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
}
.woocommerce-shipping-methods input[type="radio"] { accent-color: var(--rc-primary); width: 16px; height: 16px; flex-shrink: 0; cursor: pointer; }
.woocommerce-shipping-methods label { cursor: pointer; font-weight: 500; flex: 1; }
.woocommerce-shipping-methods .woocommerce-Price-amount { font-weight: 700; }

/* "No shipping options" notice */
.woocommerce-no-shipping-available { font-size: 0.9375rem; color: var(--rc-muted); padding: 0.5rem 0; }

/* Checkout shipping section layout */
.woocommerce-checkout .woocommerce-shipping-fields {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--rc-border);
}

/* "Ship to different address?" checkbox */
.woocommerce-checkout .woocommerce-shipping-fields #ship-to-different-address {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 1.25rem;
  cursor: pointer;
  font-weight: 600;
  font-size: 0.9375rem;
}
.woocommerce-checkout .woocommerce-shipping-fields #ship-to-different-address input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--rc-primary);
  flex-shrink: 0;
  cursor: pointer;
}

/* Checkout coupon toggle notice */
.woocommerce-checkout .woocommerce-form-coupon-toggle { margin-bottom: 1rem; }
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info { cursor: default; }
.woocommerce-checkout .woocommerce-form-coupon {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  padding: 1.25rem;
  margin-bottom: 1.5rem;
}
.woocommerce-checkout .woocommerce-form-coupon .form-row {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: flex-end;
  margin: 0;
}
.woocommerce-checkout .woocommerce-form-coupon .form-row p { margin: 0 0 0.75rem; font-size: 0.9375rem; color: var(--rc-muted); }
.woocommerce-checkout .woocommerce-form-coupon .form-row input[type="text"] { flex: 1; min-width: 180px; }
.woocommerce-checkout .woocommerce-form-coupon .button {
  height: 44px;
  padding: 0 1.25rem;
  background: var(--rc-primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 150ms;
}

/* ── 33. QA FIXES ──────────────────────────────────────────────────────────── */

/* WC Blocks checkout — Place Order button uses primary color */
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-checkout .wc-block-components-button.contained {
  background-color: var(--rc-primary) !important;
  border-color: var(--rc-primary) !important;
}
.wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-checkout .wc-block-components-button.contained:hover {
  background-color: var(--rc-primary-dk, var(--rc-primary)) !important;
  border-color: var(--rc-primary-dk, var(--rc-primary)) !important;
  opacity: 0.92;
}

/* WC Blocks checkout Order Summary — hide product short description */
.wc-block-components-product-metadata__description { display: none; }

/* Product thumbnail strip — horizontal scroll instead of wrapping */
.rc-single__thumbs {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  /* min-width:0 is required: without it a flex/grid child won't constrain its
     own flex children, letting the nowrap strip overflow the document body. */
  min-width: 0;
  width: 100%;
  scrollbar-width: none;
  -ms-overflow-style: none;
  scroll-snap-type: x mandatory;
  padding-bottom: 2px;
}
.rc-single__thumbs::-webkit-scrollbar { display: none; }
.rc-single__thumb { scroll-snap-align: start; flex-shrink: 0; }

/* Search result price — del styling */
.rc-search-item__price del {
  text-decoration: line-through;
  opacity: 0.55;
  font-size: 0.8em;
  margin-right: 0.25em;
}

/* ═══════════════════════════════════════════════════════════════════════════
   23. INTERACTIONS, ANIMATIONS & APP-LIKE FEEL
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Product drawer: scroll-driven continuous expansion ────────────────────── */
/* Height, width, and border-radius driven pixel-by-pixel via JS (CSS custom props).
   Open/close animation: transform scale bloom (Section 5153 base). */
.rc-pd {
    height: var(--rc-pd-h, 55dvh);
    max-height: none;
    border-radius: var(--rc-pd-br, 1.5rem 1.5rem 0 0);
    /* 80ms ease-out smooths discrete wheel steps without visible lag */
    transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1),
                height        80ms ease-out,
                width         80ms ease-out,
                border-radius 80ms ease-out;
}
/* Desktop: also expand width 85vw → 100vw as drawer expands */
@media (min-width: 768px) {
    .rc-pd { width: var(--rc-pd-w, 85vw); }
}
.rc-pd--full { border-radius: 0 !important; }
@media (max-width: 767px) {
    .rc-pd { height: var(--rc-pd-h, 60dvh); }
}

/* Drag handle — more prominent on the product drawer */
.rc-pd__drag-handle {
    width: 48px;
    height: 5px;
    background: var(--rc-border);
    border-radius: 3px;
    margin: 10px auto 6px;
    cursor: grab;
    flex-shrink: 0;
}

/* ── Fly-to-cart clone ─────────────────────────────────────────────────────── */
.rc-fly-clone {
    position: fixed;
    z-index: 99999;
    pointer-events: none;
    border-radius: 10px;
    overflow: hidden;
    will-change: transform, opacity;
}

/* ── Contextual focus: card grid hover dimming ─────────────────────────────── */
.rc-product-grid { --rc-card-opacity: 1; }
.rc-product-grid .rc-card {
    transition: opacity 220ms ease, filter 220ms ease, transform 220ms ease;
    will-change: opacity, filter;
}
@media (hover: hover) {
    .rc-product-grid:has(.rc-card:hover) .rc-card:not(:hover) {
        opacity: 0.55;
        filter: blur(0.6px);
        transform: scale(0.99);
    }
}

/* ── Contextual focus: dim main when any overlay is open ──────────────────── */
#rc-main {
    transition: opacity 280ms ease, transform 280ms ease;
    will-change: opacity, transform;
}
.rc-body--any-open #rc-main {
    opacity: 0.82;
    transform: scale(0.992);
    pointer-events: none;
}

/* Cart specifically: subtle content push */
.rc-body--cart-open #rc-main {
    transform: scale(0.988) translateX(-6px);
}

/* When any drawer/panel is open, keep the header solid and above the backdrop
   so the FlyHeart ATC animation target (cart icon) is never blurred or obscured.
   The glass header variant has a transparent background that picks up the
   backdrop-filter blur behind it; forcing it opaque + stripping its own
   backdrop-filter ensures the cart icon always lands cleanly.
   z-index 600 > backdrop (498) guarantees visibility across all browsers. */
.rc-body--any-open #rc-header {
    background: var(--rc-surface) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    z-index: 600;
}

/* ── Page exit transition ──────────────────────────────────────────────────── */
.rc-page-exit #rc-main {
    opacity: 0 !important;
    transform: scale(0.96) !important;
    transition: opacity 260ms ease, transform 260ms ease !important;
    pointer-events: none !important;
}

/* View Transitions API — smooth cross-page animation (Chrome 111+) */
@keyframes rc-vt-fade-in  { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: scale(1); } }
@keyframes rc-vt-fade-out { from { opacity: 1; transform: scale(1);    } to { opacity: 0; transform: scale(0.97); } }

@supports (view-transition-name: none) {
    ::view-transition-old(root) { animation: 260ms ease both rc-vt-fade-out; }
    ::view-transition-new(root) { animation: 260ms ease both rc-vt-fade-in; }
}

/* ── Header morphs: fade logo/nav when search expands (hamburger stays visible) */
.rc-header--searching .rc-header__center,
.rc-header--searching .rc-header__logo--left {
    opacity: 0;
    pointer-events: none;
    transition: opacity 200ms ease;
}
.rc-header__center, .rc-header__logo--left {
    transition: opacity 200ms ease;
}

/* ── Inline toast notification (add-to-cart errors, buy-now errors) ─────────── */
.rc-toast {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%) translateY(16px);
    background: var(--rc-surface);
    border: 1px solid var(--rc-border);
    border-left: 4px solid var(--rc-primary);
    border-radius: 10px;
    padding: 0.6875rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--rc-text);
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
    z-index: 99998;
    opacity: 0;
    transition: opacity 220ms ease, transform 220ms ease;
    white-space: nowrap;
    max-width: min(420px, 90vw);
}
.rc-toast--visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
.rc-toast--error {
    border-left-color: #ef4444;
}

/* ── Star rating: amber, independent of brand color ─────────────────────────── */
.rc-card__stars { color: #f59e0b; }

/* ── Swiper controls: themed to brand ──────────────────────────────────────── */
.rc-product-carousel {
    --swiper-navigation-color: var(--rc-primary);
    --swiper-pagination-color: var(--rc-primary);
    --swiper-navigation-size:  20px;
}
.rc-product-carousel .swiper-pagination-bullet {
    background: var(--rc-border);
    opacity: 1;
}
.rc-product-carousel .swiper-pagination-bullet-active {
    background: var(--rc-primary);
    transform: scale(1.25);
    transition: transform 200ms ease, background 200ms ease;
}

/* ── Category card fallback placeholder ─────────────────────────────────────── */
.rc-cat-card:not(:has(img)) .rc-cat-card__img-wrap,
.rc-cat-card--no-image .rc-cat-card__img-wrap {
    background: linear-gradient(135deg, var(--rc-primary) 0%, color-mix(in srgb, var(--rc-primary) 60%, white) 100%);
}

/* ── Back to Top button ──────────────────────────────────────────────────────── */
.rc-back-to-top {
    position: fixed;
    bottom: 5rem;
    right: 1.5rem;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--rc-surface);
    border: 1px solid var(--rc-border);
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--rc-text);
    z-index: 900;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 250ms ease, transform 250ms ease, background 150ms, box-shadow 150ms;
    pointer-events: none;
}
.rc-back-to-top--visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.rc-back-to-top:hover {
    background: var(--rc-primary);
    color: #fff;
    border-color: var(--rc-primary);
    box-shadow: 0 8px 24px rgba(0,0,0,0.16);
}
@media (max-width: 1023px) {
    .rc-back-to-top {
        left: 50%;
        right: auto;
        bottom: calc(60px + env(safe-area-inset-bottom, 0px) + 76px);
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: var(--rc-surface);
        border: 1px solid var(--rc-border);
        box-shadow: 0 4px 20px rgba(0,0,0,0.15);
        z-index: 390;
        opacity: 0;
        transform: translateX(-50%) scale(0.82);
        pointer-events: none;
    }
    .rc-back-to-top--visible {
        opacity: 1;
        transform: translateX(-50%) scale(1);
        pointer-events: auto;
    }
    .rc-back-to-top:hover {
        background: var(--rc-primary);
        color: var(--rc-btn-text);
        border-color: var(--rc-primary);
        box-shadow: 0 8px 24px rgba(0,0,0,0.20);
    }
    .rc-back-to-top svg { width: 22px; height: 22px; }
}

/* ── Reduce motion: disable all custom animations ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .rc-fly-clone,
    .rc-pd,
    .rc-toast,
    #rc-main,
    .rc-back-to-top,
    .rc-product-grid .rc-card { transition: none !important; animation: none !important; }
    .rc-body--any-open #rc-main { opacity: 1; transform: none; }
}
.woocommerce-checkout .woocommerce-form-coupon .button:hover { opacity: 0.85; }

/* ═══════════════════════════════════════════════════════════════════════════
   24. HEADER VARIANT B — COMMERCE (inline nav + mega panel)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Commerce inner layout ────────────────────────────────────────────────── */
.rc-header__inner--commerce {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 1.25rem;
    /* position: static — mega panels anchor to parent <header> which is position:sticky */
}
.rc-header__logo--left {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.rc-header__logo--left img,
.rc-header__logo--left .custom-logo {
    max-height: 36px;
    width: auto;
}

/* ── Mobile hamburger (shown only on mobile within commerce variant) ────────── */
.rc-header__mob-burger { display: none; }
@media (max-width: 767px) {
    .rc-header__mob-burger { display: inline-flex; }
}

/* ── Inline nav container ─────────────────────────────────────────────────── */
.rc-header__inline-nav {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    justify-content: center;
    position: static; /* panels positioned from rc-header */
}
@media (max-width: 767px) {
    .rc-header__inline-nav { display: none; }
}

/* ── Nav item wrapper ─────────────────────────────────────────────────────── */
.rc-inline-nav-item {
    position: relative;
}

/* ── Shared link/button styles ────────────────────────────────────────────── */
.rc-inline-nav-btn,
.rc-inline-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.45rem 0.8rem;
    border-radius: calc(var(--rc-radius, 0.5rem) * 1.5);
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--rc-text, #111);
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease;
    line-height: 1;
}
.rc-inline-nav-btn:hover,
.rc-inline-nav-link:hover,
.rc-inline-nav-btn[aria-expanded="true"] {
    background: var(--rc-surface, #f5f5f3);
    color: var(--rc-primary, #111);
}
.rc-inline-nav-link--current,
.rc-inline-nav-btn--current {
    color: var(--rc-primary, #111);
    font-weight: 600;
}

/* ── Chevron rotation on open ─────────────────────────────────────────────── */
.rc-inline-nav-chevron {
    transition: transform 0.2s ease;
    flex-shrink: 0;
    opacity: 0.6;
}
.rc-inline-nav-btn[aria-expanded="true"] .rc-inline-nav-chevron {
    transform: rotate(180deg);
    opacity: 1;
}

/* ── Mega panel — full-width, anchored to bottom of <header> ────────────── */
/* <header> is position:sticky → containing block for these absolute panels  */
.rc-header__mega-panel {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--rc-white);
    border-top: 1px solid var(--rc-border, #e4e4e0);
    border-bottom: 1px solid var(--rc-border, #e4e4e0);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
    z-index: 800;
}
.rc-header { overflow: visible; }

.rc-header__mega-inner {
    padding: 2rem var(--rc-container-px, 1.5rem);
}

/* Transition classes for Alpine x-transition */
.rc-mega-enter {
    transition: opacity 0.18s ease, transform 0.18s ease;
}
.rc-mega-enter-start {
    opacity: 0;
    transform: translateY(-6px);
}
.rc-mega-enter-end {
    opacity: 1;
    transform: translateY(0);
}

/* ── Mega panel: category image grid (menu_variant = mega) ───────────────── */
.rc-header__mega-cats {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 1rem;
}
.rc-header__mega-cat {
    text-decoration: none;
    text-align: center;
    display: block;
}
.rc-header__mega-cat-img-wrap {
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: var(--rc-radius, 0.5rem);
    margin-bottom: 0.5rem;
    background: var(--rc-surface, #f5f5f3);
}
.rc-header__mega-cat-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease, opacity 0.2s ease;
}
.rc-header__mega-cat:hover .rc-header__mega-cat-img {
    transform: scale(1.05);
    opacity: 0.88;
}
.rc-header__mega-cat-name {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rc-text, #111);
    letter-spacing: -0.01em;
}
.rc-header__mega-cat-count {
    display: block;
    font-size: 0.72rem;
    color: var(--rc-text-muted, #888);
    margin-top: 0.125rem;
}

/* ── Mega panel: link columns (menu_variant = flyout / submenu) ──────────── */
.rc-header__mega-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem 1.5rem;
}
.rc-header__mega-links--grouped {
    gap: 1.5rem 2rem;
    flex-wrap: nowrap;
    overflow-x: auto;
}
.rc-header__mega-col {
    min-width: 140px;
}
.rc-header__mega-col-heading {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--rc-text-muted, #888);
    margin-bottom: 0.625rem;
}
.rc-header__mega-col-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.rc-header__mega-col-list a,
.rc-header__mega-item {
    display: block;
    font-size: 0.875rem;
    font-weight: 450;
    color: var(--rc-text, #111);
    text-decoration: none;
    padding: 0.3rem 0.5rem;
    border-radius: calc(var(--rc-radius, 0.5rem) * 0.75);
    transition: background 0.12s ease, color 0.12s ease;
}
.rc-header__mega-col-list a:hover,
.rc-header__mega-item:hover {
    background: var(--rc-surface, #f5f5f3);
    color: var(--rc-primary, #111);
}

/* ── When mega panel is open: dim the backdrop ───────────────────────────── */
body:has(.rc-header__mega-panel[style*="display"]:not([style*="display: none"])) .rc-backdrop {
    opacity: 0.3;
    pointer-events: auto;
}

/* ── Transparent header: nav text should be white ───────────────────────── */
.rc-header--transparent .rc-inline-nav-btn,
.rc-header--transparent .rc-inline-nav-link {
    color: rgba(255, 255, 255, 0.9);
}
.rc-header--transparent .rc-inline-nav-btn:hover,
.rc-header--transparent .rc-inline-nav-link:hover,
.rc-header--transparent .rc-inline-nav-btn[aria-expanded="true"] {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* ── Scrolled or nav open: revert transparent styles ────────────────────── */
.rc-header--scrolled .rc-inline-nav-btn,
.rc-header--scrolled .rc-inline-nav-link,
.rc-header--nav-open .rc-inline-nav-btn,
.rc-header--nav-open .rc-inline-nav-link {
    color: var(--rc-text, #111);
}
/* When nav panel is open, force header solid background */
.rc-header--nav-open.rc-header--transparent {
    background: var(--rc-surface);
    box-shadow: none;
}

/* ── Mobile: commerce inner collapses to logo left + icons right ─────────── */
@media (max-width: 767px) {
    .rc-header__inner--commerce {
        grid-template-columns: auto auto;
        justify-content: space-between;
    }
    .rc-header__mega-panel { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   25. QUALITY PASS — transitions, account dropdown, sticky cart, my account
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Curtain-style transitions for all drawers (upgrading 320ms ease-out) ── */
.rc-drawer {
    transition: transform 500ms cubic-bezier(0.32, 0.72, 0, 1) !important;
}

/* ── 2. Fix: product / quick-view drawer open → don't blur/scale main ──────── */
/* The drawer is nearly full-screen; blurring main underneath just causes flash */
.rc-body--drawer-open #rc-main {
    filter: none !important;
    transform: none !important;
}
.rc-body--drawer-open .rc-backdrop--active {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(0, 0, 0, 0.55) !important;
}

/* ── 3. Account panel: identical bloom to cart (scale 0→1 from top-right) ─────── */
@media (min-width: 768px) {
    #rc-account-panel.rc-drawer.rc-drawer--right {
        top: var(--rc-header-h, 64px) !important;
        right: max(var(--rc-container-px, 1.25rem), calc((100vw - var(--rc-container, 1280px)) / 2 + var(--rc-container-px, 1.25rem))) !important;
        height: auto !important;
        max-height: min(580px, calc(100dvh - var(--rc-header-h, 64px) - 1.5rem)) !important;
        width: 320px !important;
        overflow-y: auto;
        border-radius: 16px !important;
        border: 1px solid var(--rc-border) !important;
        box-shadow: 0 4px 6px rgba(0,0,0,0.04), 0 16px 48px rgba(0,0,0,0.12) !important;
        /* Bloom from single pixel at top-right — identical to cart */
        transform: scale(0) !important;
        transform-origin: top right !important;
        opacity: 0 !important;
        transition:
            opacity   220ms ease,
            transform 560ms cubic-bezier(0.34, 1.56, 0.64, 1) !important;
        pointer-events: none !important;
    }
    #rc-account-panel.rc-drawer.rc-drawer--right.rc-drawer--open {
        transform: scale(1) !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
    .admin-bar #rc-account-panel.rc-drawer.rc-drawer--right {
        top: calc(var(--rc-header-h, 64px) + 32px) !important;
    }
    #rc-account-panel .rc-drawer__body { padding: 0.75rem 1rem 1.25rem; }
    #rc-account-panel .rc-auth-tabs    { margin-bottom: 0.75rem; }
}

/* ── 4. My Account nav: full rules live in section 24 ───────────────────── */
.rc-account-content { padding: 0; }

/* ── 5. Sticky Cart Bar ──────────────────────────────────────────────────────── */
.rc-sticky-cart {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 850;
    background: var(--rc-white);
    border-top: 1px solid var(--rc-border);
    box-shadow: 0 -2px 20px rgba(0,0,0,0.07), 0 -1px 4px rgba(0,0,0,0.04);
    transform: translateY(100%);
    transition: transform 420ms cubic-bezier(0.32, 0.72, 0, 1);
    will-change: transform;
    padding: 0.75rem 0;
    safe-area-inset-bottom: env(safe-area-inset-bottom);
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
}
.rc-sticky-cart--visible { transform: translateY(0); }
/* Hide on pages / states where cart is already prominent */
.rc-body--any-open .rc-sticky-cart,
.woocommerce-cart .rc-sticky-cart,
.woocommerce-checkout .rc-sticky-cart { display: none !important; }
/* On mobile the bottom nav handles cart access — no need for a second bar */
@media (max-width: 1023px) { .rc-sticky-cart { display: none !important; } }

.rc-sticky-cart__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.rc-sticky-cart__info {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}
.rc-sticky-cart__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    background: var(--rc-primary);
    color: #fff;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    flex-shrink: 0;
}
.rc-sticky-cart__label {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--rc-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.rc-sticky-cart__label--fallback { color: var(--rc-muted); font-weight: 500; }
.rc-sticky-cart__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}
.rc-sticky-cart__view-btn {
    font-size: 0.875rem !important;
    padding: 0.5rem 0.875rem !important;
    border: 1.5px solid var(--rc-border-dark) !important;
    background: transparent !important;
    color: var(--rc-text) !important;
    border-radius: var(--rc-radius) !important;
    cursor: pointer !important;
    white-space: nowrap;
}
.rc-sticky-cart__view-btn:hover { border-color: var(--rc-primary) !important; color: var(--rc-primary) !important; }
.rc-sticky-cart__checkout-btn {
    font-size: 0.875rem !important;
    padding: 0.5rem 1.125rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.375rem !important;
    text-decoration: none !important;
    white-space: nowrap;
}
/* Push back-to-top above the sticky bar when visible */
.rc-sticky-cart--visible ~ .rc-back-to-top { bottom: 5.5rem; }
@media (max-width: 479px) {
    .rc-sticky-cart__view-btn { display: none; }
    .rc-sticky-cart__checkout-btn { flex: 1; justify-content: center !important; }
}

/* ── 6. Cat grid: columns 5 & 6 ─────────────────────────────────────────────── */
.rc-cat-grid--5 { grid-template-columns: repeat(5, 1fr); }
.rc-cat-grid--6 { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 1023px) {
    .rc-cat-grid--5, .rc-cat-grid--6 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 767px) {
    .rc-cat-grid--5, .rc-cat-grid--6 { grid-template-columns: repeat(2, 1fr); }
}

/* ── 7. Inline search: Hyva-style — input grows leftward from icon position ──── */

/* Containing block for the absolute search bar */
.rc-search-wrap { position: relative; }

/* Header: solid background flashes in when search opens so bar blends seamlessly */
.rc-header { transition: background 180ms cubic-bezier(0.4, 0, 0.2, 1); }
.rc-header--searching { background: #f9f9f9 !important; }

/* Logo + center section fade out so the expanding bar reveals cleanly */
.rc-header__logo,
.rc-header__center { transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1); }
.rc-header--searching .rc-header__logo,
.rc-header--searching .rc-header__center { opacity: 0; pointer-events: none; }

/* Search icon: clean fade-only exit — no rotation */
.rc-search-btn { transition: opacity 220ms cubic-bezier(0.4, 0, 0.2, 1); }
.rc-header--searching .rc-search-btn { opacity: 0 !important; pointer-events: none !important; }

/* Expanding bar: width-only animation; desktop shows as white card */
.rc-search-inline {
    position: absolute;
    top: 0;
    right: 0;
    height: var(--rc-header-h, 64px);
    width: 0;
    overflow: hidden;
    pointer-events: none;
    background: transparent;
    display: flex;
    flex-direction: column;
    z-index: 10;
    transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
.rc-search-inline--open {
    width: min(1000px, 65vw);
    pointer-events: auto;
}

/* Desktop: centred card, same size+position as results panel, reveals right→left */
@media (min-width: 768px) {
    .rc-search-inline {
        position: fixed;
        top: calc((var(--rc-header-h, 64px) - 48px) / 2);
        left: calc(50% - min(390px, 29vw));
        right: auto;
        width: min(780px, 58vw);
        height: 48px;
        background: var(--rc-white);
        border-radius: 12px;
        border: 1px solid var(--rc-border);
        box-shadow: 0 4px 16px rgba(0,0,0,0.10);
        overflow: visible;
        clip-path: inset(0 0 0 100% round 12px);
        transition: clip-path 320ms cubic-bezier(0.4, 0, 0.2, 1);
    }
    .rc-search-inline--open {
        clip-path: inset(0 0 0 0% round 12px);
        pointer-events: auto;
        width: min(780px, 58vw);
    }
}

/* Mobile: fixed full-width takeover */
@media (max-width: 767px) {
    .rc-search-inline {
        position: fixed;
        top: 0;
        right: 0;
        height: var(--rc-header-h, 64px);
        overflow: hidden; /* re-assert: ensures bar content is clipped when width=0 */
        background: var(--rc-surface);
        z-index: calc(var(--rc-z-header, 100) + 5);
        box-shadow: 0 1px 0 var(--rc-border);
    }
    .rc-search-inline--open { width: 100vw; }
}

/* Inner bar: full header height flex row, bottom border is the only decoration */
.rc-search-inline__bar {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    height: 100%;
    padding: 0 1rem;
    white-space: nowrap;
    flex-shrink: 0;
}
.rc-search-inline__lens { color: var(--rc-muted); flex-shrink: 0; }

/* Input: 16px, no border, no focus ring — matches Satoshi exactly */
.rc-search-inline__input {
    flex: 1;
    min-width: 0;
    border: none;
    background: none;
    outline: none;
    box-shadow: none;
    font-size: 1rem;
    font-weight: 500;
    font-family: inherit;
    color: var(--rc-text);
    letter-spacing: 0;
}
.rc-search-inline__input:focus,
.rc-search-inline__input:focus-visible { outline: none !important; box-shadow: none !important; }
.rc-search-inline__input::placeholder { color: var(--rc-muted); font-weight: 400; }
/* Suppress native browser search-clear × (Chrome/Safari) */
.rc-search-inline__input::-webkit-search-cancel-button,
.rc-search-inline__input::-webkit-search-decoration { -webkit-appearance: none; display: none; }
.rc-search-inline__input::-ms-clear { display: none; }

/* Clear (×) button */
.rc-search-inline__clear {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--rc-border);
    color: var(--rc-text);
    border: none;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 150ms cubic-bezier(0.4, 0, 0.2, 1);
}
.rc-search-inline__clear:hover { background: var(--rc-muted); color: var(--rc-surface); }

/* Cancel (✕) button — appears at the end of the bar */
.rc-search-inline__cancel {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: transparent;
    color: var(--rc-muted);
    border: none;
    cursor: pointer;
    flex-shrink: 0;
    padding: 0;
    transition: background 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms;
}
.rc-search-inline__cancel:hover { background: var(--rc-border); color: var(--rc-text); }

/* Results panel: fixed below header, centered, wide */
.rc-search-inline__results {
    position: fixed;
    top: var(--rc-header-h, 64px);
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: min(780px, 58vw);
    background: var(--rc-surface);
    border: 1px solid var(--rc-border);
    border-radius: 16px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.12);
    max-height: 65vh;
    overflow-y: auto;
    z-index: 1300;
    padding: 0.75rem var(--rc-container-px, 1.5rem) 1.5rem;
    overscroll-behavior: contain;
    margin-top: 38px; /* 8px base + 30px requested offset */
}
/* Admin bar pushes header down — compensate so results stay below header */
.admin-bar .rc-search-inline__results { top: calc(var(--rc-header-h, 64px) + 32px); margin-top: 8px; }
@media screen and (max-width: 782px) {
    .admin-bar .rc-search-inline__results { top: calc(var(--rc-header-h, 64px) + 46px); }
}
@media (max-width: 767px) {
    .rc-search-inline__results {
        left: 0; right: 0;
        transform: none;
        max-width: none;
        width: 100%;
        margin-top: 0;
        border-radius: 0 0 16px 16px;
        border-left: none; border-right: none;
        border-top: 1px solid var(--rc-border);
    }
}

/* Nav items + logo fade together when search opens */
.rc-header__inline-nav { transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1); }
.rc-header--searching .rc-header__inline-nav { opacity: 0; pointer-events: none; }

/* ── 8. Cart minicart: grows from single pixel at cart icon (top-right) ─────── */
@media (min-width: 768px) {
    .rc-minicart {
        right: max(var(--rc-container-px, 1.25rem), calc((100vw - var(--rc-container, 1280px)) / 2 + var(--rc-container-px, 1.25rem))) !important;
        transform: scale(0) !important;
        transform-origin: top right !important;
        opacity: 0 !important;
        transition:
            opacity   220ms ease,
            transform 560ms cubic-bezier(0.34, 1.56, 0.64, 1) !important;
    }
    .rc-minicart--open {
        transform: scale(1) !important;
        opacity: 1 !important;
        pointer-events: all !important;
    }
}
/* Mobile cart: single pixel at bottom → expands upward */
@media (max-width: 767px) {
    .rc-minicart {
        transform: scaleY(0.005) !important;
        transform-origin: bottom center !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition: transform 420ms cubic-bezier(0.34, 1.56, 0.64, 1),
                    opacity   260ms ease !important;
    }
    .rc-minicart--open {
        transform: scaleY(1) !important;
        opacity: 1 !important;
        pointer-events: all !important;
    }
}

/* ── 9. Mobile menu: grows from single pixel at hamburger center (top-left) ──── */
#rc-mobile-menu.rc-drawer.rc-drawer--left {
    /* origin = hamburger button center: container-px from left, half header height from top */
    transform-origin: var(--rc-container-px, 1.25rem) calc(var(--rc-header-h, 64px) / 2) !important;
    transform: scale(0) !important;
    opacity: 0 !important;
    border-radius: 16px !important;
    transition:
        transform 560ms cubic-bezier(0.34, 1.56, 0.64, 1),
        opacity   260ms ease !important;
}
#rc-mobile-menu.rc-drawer.rc-drawer--left.rc-drawer--open {
    transform: scale(1) !important;
    opacity: 1 !important;
}

/* ── 10. Product drawer: slides up from bottom via translateY (base CSS) ── */

/* ── 8. Breadcrumbs: clearly clickable with chevron ─────────────────────────── */
.rc-breadcrumbs a {
    color: var(--rc-muted) !important;
    text-decoration: none !important;
    font-weight: 500;
    transition: color 150ms;
}
.rc-breadcrumbs a:hover { color: var(--rc-primary) !important; text-decoration: underline !important; }
.rc-breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0; }
.rc-breadcrumb-sep { margin: 0 0.375rem; }
.rc-breadcrumbs .breadcrumb_last { font-weight: 600; color: var(--rc-text); }

/* ══════════════════════════════════════════════════════════════════════════════
   12. NAV DRAWER — Variant B (glass header), all screen sizes
   Multi-level left panel: blooms from hamburger (top-left), slides levels in/out.
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Container ───────────────────────────────────────────────────────────────── */
#rc-nav-drawer {
    position: fixed;
    top: 0;
    left: 0;
    width: 320px;
    max-width: 85vw;
    height: 100dvh;
    background: var(--rc-white);
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 8px 0 40px rgba(0, 0, 0, 0.12);
    border-radius: 16px;
    /* Bloom from hamburger (top-left corner of the panel) */
    clip-path: inset(0 100% 100% 0 round 16px);
    pointer-events: none;
    transition: clip-path 340ms cubic-bezier(0.25, 1, 0.5, 1);
}
#rc-nav-drawer.rc-nav-drawer--open {
    clip-path: inset(0 0% 0% 0 round 16px);
    pointer-events: all;
}
.admin-bar #rc-nav-drawer { top: 32px; height: calc(100dvh - 32px); }
@media screen and (max-width: 782px) {
    .admin-bar #rc-nav-drawer { top: 46px; height: calc(100dvh - 46px); }
}

/* ── Header bar ──────────────────────────────────────────────────────────────── */
.rc-nav-drawer__head {
    display: flex;
    align-items: center;
    height: var(--rc-header-h, 64px);
    padding: 0 0.875rem 0 1rem;
    border-bottom: 1px solid var(--rc-border);
    flex-shrink: 0;
    gap: 0.5rem;
}
.rc-nav-drawer__back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    border-radius: 8px;
    cursor: pointer;
    color: var(--rc-text);
    flex-shrink: 0;
    transition: background 150ms, transform 200ms;
}
.rc-nav-drawer__back:hover { background: var(--rc-surface); }
.rc-nav-drawer__back:active { transform: translateX(-2px); }

.rc-nav-drawer__title {
    flex: 1;
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: -0.025em;
    color: var(--rc-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.rc-nav-drawer__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    border-radius: 8px;
    cursor: pointer;
    color: var(--rc-muted);
    flex-shrink: 0;
    transition: background 150ms, color 150ms;
}
.rc-nav-drawer__close:hover { background: var(--rc-surface); color: var(--rc-text); }

/* ── Body: overflow-hidden host for the sliding track ───────────────────────── */
.rc-nav-drawer__body {
    flex: 1;
    overflow: hidden;
    position: relative;
}

/* Track holds 3 side-by-side panels; CSS var --rc-nd-level slides it */
.rc-nav-drawer__track {
    display: flex;
    width: 300%;
    height: 100%;
    /* Level is set via --rc-nd-level on #rc-nav-drawer (Alpine inline style) */
    transform: translateX(calc(var(--rc-nd-level, 0) * (-100% / 3)));
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}
.rc-nav-drawer__panel {
    width: calc(100% / 3);
    flex-shrink: 0;
    height: 100%;
    overflow-y: auto;
    padding: 0.375rem 0 1rem;
    overscroll-behavior: contain;
}

/* ── Nav items ───────────────────────────────────────────────────────────────── */
.rc-nav-drawer__row {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--rc-border);
}
.rc-nav-drawer__link {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 0.875rem 0.5rem 0.875rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--rc-text);
    text-decoration: none;
    letter-spacing: -0.01em;
    transition: color 120ms, background 120ms;
    min-height: 52px;
}
.rc-nav-drawer__link:hover { color: var(--rc-primary); background: rgba(0,0,0,0.025); }
.rc-nav-drawer__link.current { color: var(--rc-primary); font-weight: 600; }

.rc-nav-drawer__expand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 52px;
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--rc-muted);
    border-left: 1px solid var(--rc-border);
    flex-shrink: 0;
    transition: background 120ms, color 120ms, transform 200ms;
}
.rc-nav-drawer__expand:hover { background: var(--rc-surface); color: var(--rc-primary); }
.rc-nav-drawer__expand:hover svg { transform: translateX(3px); }
.rc-nav-drawer__expand svg { transition: transform 200ms; }

/* View-all link at top of sub-level panel */
.rc-nav-drawer__view-all {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1.25rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--rc-primary);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 2px solid var(--rc-border);
    margin-bottom: 0.25rem;
    transition: gap 150ms;
}
.rc-nav-drawer__view-all:hover { gap: 0.625rem; }

/* ── Footer ─────────────────────────────────────────────────────────────────── */
.rc-nav-drawer__foot {
    padding: 1rem 1.25rem 1.25rem;
    border-top: 1px solid var(--rc-border);
    flex-shrink: 0;
}

/* ── 11. Reduce motion override ──────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .rc-sticky-cart { transition: none !important; }
    .rc-drawer { transition: none !important; }
    #rc-account-panel.rc-drawer.rc-drawer--right { transition: none !important; }
    #rc-mobile-menu.rc-drawer.rc-drawer--left { transition: none !important; }
    .rc-minicart { transition: none !important; }
    .rc-search-inline { transition: none !important; }
    .rc-search-btn { transition: none !important; }
    .rc-pd { transition: none !important; }
    #rc-nav-drawer { transition: none !important; }
    .rc-nav-drawer__track { transition: none !important; }
    .rc-nav-flyout { transition: none !important; }
}

/* ── Infinite scroll / load-more ────────────────────────────────────────── */
#rc-infinite-sentinel { display: flex; justify-content: center; padding: 2.5rem 0; }
.rc-load-more {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.75rem 2.5rem;
  border: 2px solid var(--rc-primary);
  border-radius: 9999px;
  font: inherit; font-size: 0.9375rem; font-weight: 700;
  background: transparent; color: var(--rc-primary);
  cursor: pointer; transition: background 200ms, color 200ms;
}
.rc-load-more:hover { background: var(--rc-primary); color: var(--rc-btn-text); }
.rc-infinite-spinner {
  width: 32px; height: 32px;
  border: 3px solid var(--rc-border);
  border-top-color: var(--rc-primary);
  border-radius: 50%;
  animation: rc-spin 0.7s linear infinite;
}
@keyframes rc-spin { to { transform: rotate(360deg); } }
.rc-result-count { font-size: 0.875rem; color: var(--rc-muted); margin: 0; }

/* ══════════════════════════════════════════════════════════════════════════
   POST-CART UPSELL DRAWER
   ══════════════════════════════════════════════════════════════════════════ */
.rc-upsell-drawer {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 1100;
  pointer-events: none;
}
.rc-upsell-drawer--open { pointer-events: auto; }
.rc-upsell-drawer__backdrop {
  position: fixed; inset: 0; z-index: 0;
  top: var(--rc-header-h, 64px); /* don't cover the header — heart animation must land cleanly */
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(4px);
  opacity: 0; transition: opacity 320ms;
}
.rc-upsell-drawer--open .rc-upsell-drawer__backdrop { opacity: 1; }
.rc-upsell-drawer__panel {
  position: relative; z-index: 1;
  background: var(--rc-white);
  border-radius: 20px 20px 0 0;
  padding: 1.25rem 1.5rem 2rem;
  max-width: 640px;
  margin: 0 auto;
  transform: translateY(100%);
  transition: transform 380ms cubic-bezier(0.32, 0, 0.15, 1);
  box-shadow: 0 -8px 48px rgba(0,0,0,0.14);
  max-height: calc(100dvh - var(--rc-header-h, 64px)); /* can't grow past header bottom edge */
  overflow-y: auto;
  overflow-x: hidden;
}
.rc-upsell-drawer--open .rc-upsell-drawer__panel { transform: translateY(0); }

/* Countdown bar — restarts on each open via x-show toggling display:none */
.rc-upsell-drawer__timer {
  height: 3px;
  background: var(--rc-primary);
  transform-origin: left center;
  border-radius: 20px 20px 0 0;
  margin: -1.25rem -1.5rem 1.125rem;
  /* duration set via Alpine :style binding from RC.settings.upsellDrawerDuration */
  animation-name: rc-upsell-countdown;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}
.rc-upsell-drawer__timer--paused { animation-play-state: paused; }
@keyframes rc-upsell-countdown {
  from { transform: scaleX(1); }
  to   { transform: scaleX(0); }
}

.rc-upsell-drawer__header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 1rem;
}
.rc-upsell-drawer__title-wrap {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.9375rem; font-weight: 700; color: var(--rc-text);
  min-width: 0; flex: 1; overflow: hidden;
}
.rc-upsell-drawer__title-wrap > span {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rc-upsell-drawer__title-wrap svg { flex-shrink: 0; color: #16a34a; }
.rc-upsell-drawer__close {
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: var(--rc-surface); border: none; border-radius: 50%;
  cursor: pointer; color: var(--rc-muted);
}
.rc-upsell-drawer__cta {
  display: flex; gap: 0.75rem;
  margin-bottom: 1.5rem;
}
.rc-upsell-drawer__cta .rc-btn { flex: 1; justify-content: center; }
.rc-upsell-drawer__sub {
  font-size: 0.8125rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--rc-muted);
  margin: 0 0 0.875rem;
}

/* Upsell skeleton */
.rc-upsell-skeleton { display: flex; gap: 0.875rem; }
.rc-upsell-skel-card { flex: 1; min-width: 0; }

/* Upsell products */
.rc-upsell-products { display: flex; gap: 0.875rem; overflow-x: auto; padding-bottom: 4px; }
.rc-upsell-card {
  flex: 0 0 auto; width: 140px;
  display: flex; flex-direction: column;
  border: 1px solid var(--rc-border);
  border-radius: 12px; overflow: hidden;
  background: var(--rc-white);
  transition: box-shadow 200ms;
}
.rc-upsell-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.1); }
.rc-upsell-card__img-wrap { aspect-ratio: 1; overflow: hidden; position: relative; }
.rc-upsell-card__wishlist {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 2;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.42);
  border: none;
  color: var(--rc-white);
  cursor: pointer;
  transition: background 180ms ease;
}
.rc-upsell-card__wishlist:hover { background: rgba(0, 0, 0, 0.62); }
.rc-upsell-card__wishlist svg { transition: fill 200ms, stroke 200ms; }
.rc-upsell-card__wishlist--active svg { fill: var(--rc-error, #ef4444); stroke: var(--rc-error, #ef4444); }
.rc-upsell-card__wishlist:hover svg { fill: var(--rc-error, #ef4444); stroke: var(--rc-error, #ef4444); }
.rc-upsell-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms ease; }
.rc-upsell-card:hover .rc-upsell-card__img { transform: scale(1.05); }
.rc-upsell-card__body { padding: 0.5rem 0.625rem; flex: 1; }
.rc-upsell-card__title { font-size: 0.8125rem; font-weight: 600; color: var(--rc-text); text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; display: block; }
.rc-upsell-card__price { font-size: 0.8125rem; font-weight: 700; color: var(--rc-primary); display: block; margin-top: 0.25rem; }
.rc-upsell-card__atc { margin: 0 0.625rem 0.625rem; width: calc(100% - 1.25rem); }
.rc-upsell-empty { font-size: 0.875rem; color: var(--rc-muted); text-align: center; padding: 1rem 0; }

.rc-account-rv { padding: 1.5rem 0 0; }

/* ══════════════════════════════════════════════════════════════════════════
   MY ACCOUNT — premium redesign
   ══════════════════════════════════════════════════════════════════════════ */

.rc-account-wrap { padding: 1.75rem 0 5rem; margin-top: 50px; }

/* ── Hero card ─────────────────────────────────────────────────────────── */
.rc-account-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding: 1.75rem 2rem;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  border-top: 3px solid var(--rc-primary);
  margin-bottom: 2rem;
  position: relative;
  overflow: hidden;
}
.rc-account-hero::before {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 240px; height: 100%;
  background: radial-gradient(ellipse at top right, color-mix(in srgb, var(--rc-primary) 8%, transparent), transparent 70%);
  pointer-events: none;
}

/* Identity (avatar + name + email + since) */
.rc-account-hero__identity { display: flex; align-items: center; gap: 1.125rem; position: relative; }
.rc-account-hero__avatar-ring {
  position: relative; flex-shrink: 0;
  width: 76px; height: 76px;
  border-radius: 50%;
  padding: 3px;
  background: linear-gradient(135deg, var(--rc-primary), color-mix(in srgb, var(--rc-primary) 55%, #fff));
}
.rc-account-hero__avatar {
  width: 100% !important; height: 100% !important;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--rc-surface);
  display: block;
}
.rc-account-hero__name {
  font-size: 1.3125rem; font-weight: 800; margin: 0 0 0.2rem;
  letter-spacing: -0.025em; line-height: 1.2;
}
.rc-account-hero__email {
  display: block;
  font-size: 0.875rem; color: var(--rc-muted); margin-bottom: 0.35rem;
}
.rc-account-hero__since {
  display: inline-flex; align-items: center; gap: 0.3rem;
  font-size: 0.75rem; color: var(--rc-muted); font-weight: 500;
}
.rc-account-hero__since svg { color: var(--rc-primary); flex-shrink: 0; }

/* Stats strip */
.rc-account-stats {
  display: flex; align-items: center; gap: 0;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  padding: 0 0.25rem;
  overflow: hidden;
}
.rc-account-stat {
  text-align: center;
  padding: 1rem 1.75rem;
  min-width: 100px;
}
.rc-account-stat__value {
  display: block;
  font-size: 1.5rem; font-weight: 800;
  color: var(--rc-primary);
  line-height: 1;
  margin-bottom: 0.3rem;
  letter-spacing: -0.03em;
}
.rc-account-stat__label {
  display: block;
  font-size: 0.6875rem; color: var(--rc-muted); font-weight: 600;
  letter-spacing: 0.05em; text-transform: uppercase;
}
.rc-account-stat__sep {
  width: 1px; align-self: stretch;
  background: var(--rc-border); margin: 0.625rem 0; flex-shrink: 0;
}

@media (max-width: 680px) {
  .rc-account-hero { padding: 1.25rem; flex-direction: column; align-items: flex-start; }
  .rc-account-stats { width: 100%; }
  .rc-account-stat { flex: 1; padding: 0.875rem 0.75rem; }
}

/* ══════════════════════════════════════════════════════════════════════════
   CARD ANIMATIONS — magnetic tilt · holographic sheen · glitch · strip
   ══════════════════════════════════════════════════════════════════════════ */

/* Magnetic 3D tilt — smooth, not snappy */
.rc-card {
  will-change: transform;
  transition: transform 0.22s ease-out, box-shadow 0.28s ease;
}
.rc-card:hover {
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) scale(1.018);
  box-shadow: 0 24px 64px rgba(0,0,0,0.12), 0 8px 24px rgba(0,0,0,0.07);
}

/* Depth parallax — gentle float, not snappy */
.rc-card:hover .rc-card__cf-img--primary {
  transform: translateX(var(--px, 0px)) translateY(var(--py, 0px));
  transition: transform 0.18s ease-out;
}

/* Holographic sheen overlay — slow fade in, continuous hue-rotation */
.rc-card__holo {
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  opacity: 0;
  background: conic-gradient(
    from 0deg at var(--mx, 50%) var(--my, 50%),
    hsl(0   85% 68% / 0.50),
    hsl(60  85% 68% / 0.50),
    hsl(120 85% 68% / 0.50),
    hsl(180 85% 68% / 0.50),
    hsl(240 85% 68% / 0.50),
    hsl(300 85% 68% / 0.50),
    hsl(0   85% 68% / 0.50)
  );
  mix-blend-mode: overlay;
  transition: opacity 0.55s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 5;
}
.rc-card:hover .rc-card__holo {
  opacity: 1;
  animation: rc-holo-spin 7s linear infinite;
}
@keyframes rc-holo-spin {
  from { filter: hue-rotate(0deg); }
  to   { filter: hue-rotate(360deg); }
}

/* ── Holo style variants ────────────────────────────────────────────────────── */

/* Gold shimmer */
body.rc-holo-gold .rc-card__holo {
  background: conic-gradient(
    from 0deg at var(--mx, 50%) var(--my, 50%),
    hsl(30  90% 62% / 0.55),
    hsl(45  95% 58% / 0.55),
    hsl(55  90% 60% / 0.55),
    hsl(45  95% 58% / 0.55),
    hsl(30  90% 62% / 0.55),
    hsl(20  85% 58% / 0.55),
    hsl(30  90% 62% / 0.55)
  );
}
body.rc-holo-gold .rc-card:hover .rc-card__holo {
  animation: rc-holo-gold-spin 4s ease-in-out infinite alternate;
}
@keyframes rc-holo-gold-spin {
  from { filter: hue-rotate(-12deg) brightness(1.05); }
  to   { filter: hue-rotate(12deg)  brightness(1.15); }
}

/* Silver shimmer */
body.rc-holo-silver .rc-card__holo {
  background: conic-gradient(
    from 0deg at var(--mx, 50%) var(--my, 50%),
    hsl(210 25% 88% / 0.55),
    hsl(200 15% 95% / 0.55),
    hsl(220 20% 90% / 0.55),
    hsl(205 10% 95% / 0.55),
    hsl(215 25% 88% / 0.55),
    hsl(200 15% 95% / 0.55),
    hsl(210 25% 88% / 0.55)
  );
}
body.rc-holo-silver .rc-card:hover .rc-card__holo {
  animation: rc-holo-silver-spin 5s ease-in-out infinite alternate;
}
@keyframes rc-holo-silver-spin {
  from { filter: hue-rotate(-15deg) brightness(1.08); }
  to   { filter: hue-rotate(15deg)  brightness(1.18); }
}

/* Subtle — same rainbow, half opacity */
body.rc-holo-subtle .rc-card:hover .rc-card__holo {
  opacity: 0.4;
  animation-duration: 10s;
}

/* Glitch flash — slow enough to read, fast enough to feel electric */
@keyframes rc-glitch-red {
  0%    { clip-path: inset(4% 0 90% 0); transform: translate(-5px, 0); opacity: 0; }
  8%    { opacity: 0.7; }
  18%   { clip-path: inset(22% 0 68% 0); transform: translate(5px, 0); }
  32%   { clip-path: inset(48% 0 42% 0); transform: translate(-4px, 0); }
  50%   { clip-path: inset(62% 0 28% 0); transform: translate(4px, 0); }
  68%   { clip-path: inset(76% 0 14% 0); transform: translate(-3px, 0); }
  84%   { clip-path: inset(88% 0 4%  0); transform: translate(2px, 0); opacity: 0.5; }
  100%  { clip-path: inset(0 0 96% 0); transform: translate(0, 0); opacity: 0; }
}
@keyframes rc-glitch-cyan {
  0%    { clip-path: inset(8% 0 84% 0); transform: translate(5px, 0); opacity: 0; }
  12%   { opacity: 0.6; }
  24%   { clip-path: inset(30% 0 60% 0); transform: translate(-5px, 0); }
  40%   { clip-path: inset(54% 0 36% 0); transform: translate(3px, 0); }
  58%   { clip-path: inset(70% 0 20% 0); transform: translate(-3px, 0); }
  76%   { clip-path: inset(82% 0 8%  0); transform: translate(2px, 0); opacity: 0.4; }
  100%  { clip-path: inset(0 0 98% 0); transform: translate(0, 0); opacity: 0; }
}
.rc-card--glitch::before,
.rc-card--glitch::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 10;
}
.rc-card--glitch::before {
  background: #ff003c44;
  animation: rc-glitch-red 0.55s ease-out forwards;
}
.rc-card--glitch::after {
  background: #00eeff44;
  animation: rc-glitch-cyan 0.55s ease-out 0.06s forwards;
}

/* Kinetic venetian-blind strip reveal on gallery change */
@keyframes rc-strip-in {
  from {
    mask-position: 0 -100%;
    -webkit-mask-position: 0 -100%;
  }
  to {
    mask-position: 0 0;
    -webkit-mask-position: 0 0;
  }
}
.rc-card__coverflow.rc-cf-strip {
  mask-image: repeating-linear-gradient(
    to bottom,
    black 0%, black 5%,
    transparent 5%, transparent 10%
  );
  -webkit-mask-image: repeating-linear-gradient(
    to bottom,
    black 0%, black 5%,
    transparent 5%, transparent 10%
  );
  mask-size: 100% 200%;
  -webkit-mask-size: 100% 200%;
  animation: rc-strip-in 0.75s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* ══════════════════════════════════════════════════════════════════════════
   FILTER PILLS · SWATCHES · STAR RATING — shop sidebar
   ══════════════════════════════════════════════════════════════════════════ */

/* Hide search widget in shop sidebar */
.rc-shop-sidebar .widget_search,
.rc-shop-sidebar .widget-search,
.rc-shop-sidebar .woocommerce-widget-layered-nav-list .search-form { display: none !important; }

/* Pill row */
.rc-filter-pills {
  display: flex;
  gap: 0.375rem;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: none;
}
.rc-filter-pills::-webkit-scrollbar { display: none; }
.rc-filter-pills--wrap { flex-wrap: wrap; overflow-x: visible; }

/* Individual pill */
.rc-filter-pill {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.3rem 0.75rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--rc-muted);
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: 999px;
  cursor: pointer;
  transition: color 160ms, background 160ms, border-color 160ms, transform 120ms;
  white-space: nowrap;
  line-height: 1;
}
.rc-filter-pill:hover {
  color: var(--rc-text);
  border-color: var(--rc-primary);
  transform: translateY(-1px);
}
.rc-filter-pill--active {
  background: var(--rc-primary);
  color: #fff !important;
  border-color: var(--rc-primary) !important;
}
.rc-filter-pill--active:hover { transform: translateY(-1px); }
@media (hover: none) and (pointer: coarse) {
  .rc-filter-pill { min-height: 44px; padding: 0.625rem 0.875rem; }
}

/* Star pills */
.rc-filter-pill--star .rc-filter-pill__stars {
  color: #f59e0b;
  letter-spacing: -0.05em;
}
.rc-filter-pill--star.rc-filter-pill--active .rc-filter-pill__stars { color: #fff; }

/* Discount pills */
.rc-filter-pill--discount { font-variant-numeric: tabular-nums; }

/* Color swatches */
.rc-filter-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.rc-filter-swatch {
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 2.5px solid var(--rc-border);
  cursor: pointer;
  position: relative;
  transition: transform 150ms, border-color 150ms;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--rc-surface);
  overflow: hidden;
}
.rc-filter-swatch:hover { transform: scale(1.12); border-color: var(--rc-primary); }
.rc-filter-swatch--active {
  border-color: var(--rc-primary);
  box-shadow: 0 0 0 2px var(--rc-white), 0 0 0 4px var(--rc-primary);
}
.rc-filter-swatch__dot {
  position: absolute;
  inset: 2px;
  border-radius: 50%;
  display: block;
}
.rc-filter-swatch__label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--rc-text);
  line-height: 1;
  padding: 0 2px;
  text-align: center;
}

/* Tag pills (brand / product_tag) */
.rc-filter-pill--tag { text-transform: capitalize; }

/* Tags collapsible wrapper — clips to ~2 rows, expands on toggle */
.rc-filter-pills-outer {
  max-height: 56px;  /* desktop: 2 rows (~22px pill + 6px gap) */
  overflow: hidden;
  transition: max-height 320ms cubic-bezier(0.4, 0, 0.2, 1);
}
@media (hover: none) and (pointer: coarse) {
  .rc-filter-pills-outer { max-height: 100px; }  /* touch: 2 rows (44px pill + 6px gap) */
}
.rc-filter-pills-outer.is-expanded { max-height: 2000px; }

/* Show more / less toggle button */
.rc-filter-show-more {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 0.5rem;
  background: none;
  border: none;
  padding: 0;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--rc-primary);
  cursor: pointer;
  line-height: 1;
}
.rc-filter-show-more:hover { opacity: 0.8; }

/* ══════════════════════════════════════════════════════════════════════════
   VARIATION SWATCHES ON PRODUCT CARDS
   ══════════════════════════════════════════════════════════════════════════ */

.rc-card__swatches {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 0.625rem;
  min-height: 26px; /* prevent layout shift on cards without swatches */
}

/* ── Colour circle ─────────────────────────────────────────────────────── */
.rc-card__swatch--color {
  width: 22px; height: 22px;
  border-radius: 50%;
  border: 2px solid var(--rc-border);
  padding: 0;
  background: transparent;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  transition: transform 150ms cubic-bezier(0.34,1.56,0.64,1),
              border-color 150ms ease,
              box-shadow 200ms ease;
}
.rc-card__swatch--color:hover {
  transform: scale(1.2);
  border-color: var(--rc-primary);
}
.rc-card__swatch--color.rc-card__swatch--active {
  border-color: var(--rc-primary);
  box-shadow: 0 0 0 2px var(--rc-white), 0 0 0 3.5px var(--rc-primary);
  transform: scale(1.15);
}
.rc-card__swatch-dot {
  display: block;
  width: 100%; height: 100%;
  border-radius: 50%;
  pointer-events: none;
}

/* ── Label / size pill ─────────────────────────────────────────────────── */
.rc-card__swatch--label {
  padding: 0.175rem 0.5rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--rc-muted);
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: 5px;
  cursor: pointer;
  line-height: 1.4;
  transition: color 130ms, border-color 130ms, background 130ms,
              transform 130ms cubic-bezier(0.34,1.56,0.64,1);
}
.rc-card__swatch--label:hover {
  color: var(--rc-text);
  border-color: var(--rc-primary);
  transform: translateY(-1px);
}
.rc-card__swatch--label.rc-card__swatch--active {
  background: var(--rc-primary);
  color: #fff;
  border-color: var(--rc-primary);
  transform: translateY(-1px);
}
.rc-card__swatch-label { pointer-events: none; }

/* ── "+N more" overflow chip ───────────────────────────────────────────── */
.rc-card__swatch--more {
  padding: 0.175rem 0.5rem;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--rc-muted);
  background: transparent;
  border: 1.5px dashed var(--rc-border);
  border-radius: 5px;
  cursor: pointer;
  line-height: 1.4;
  transition: color 130ms, border-color 130ms;
}
.rc-card__swatch--more:hover {
  color: var(--rc-primary);
  border-color: var(--rc-primary);
}

/* ══════════════════════════════════════════════════════════════════════════
   RECENTLY VIEWED — SHOP PAGE SECTION
   ══════════════════════════════════════════════════════════════════════════ */

.rc-shop-rv {
  padding: 2.5rem 0 0;
  border-top: 1px solid var(--rc-border);
  margin-top: 2.5rem;
}

.rc-shop-rv__head {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  margin-bottom: 1.25rem;
}
.rc-shop-rv__title {
  font-size: 0.9375rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--rc-text);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}
.rc-shop-rv__title svg { color: var(--rc-primary); flex-shrink: 0; }
.rc-shop-rv__count {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--rc-muted);
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: 999px;
  padding: 0.15rem 0.6rem;
}

/* ── Strip ─────────────────────────────────────────────────────────────── */
.rc-shop-rv__strip {
  display: flex;
  gap: 0.875rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 0.5rem;
}
.rc-shop-rv__strip::-webkit-scrollbar { display: none; }

/* ── Card ──────────────────────────────────────────────────────────────── */
.rc-shop-rv__card {
  flex: 0 0 156px;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: calc(var(--rc-radius) + 2px);
  overflow: hidden;
  transition: transform 260ms ease, box-shadow 260ms ease;
}
.rc-shop-rv__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.10);
}

/* ── Image button ──────────────────────────────────────────────────────── */
.rc-shop-rv__img-btn {
  display: block;
  width: 100%;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.rc-shop-rv__img-wrap {
  aspect-ratio: 1/1;
  background: var(--rc-border);
  overflow: hidden;
  position: relative;
}
.rc-shop-rv__img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: top center;
  transition: transform 360ms ease;
  display: block;
}
.rc-shop-rv__img-btn:hover .rc-shop-rv__img { transform: scale(1.07); }

/* Hover overlay: "View" pill */
.rc-shop-rv__img-btn::after {
  content: 'View';
  position: absolute;
  bottom: 0.5rem;
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(4px);
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
  opacity: 0;
  transition: opacity 220ms ease, transform 220ms ease;
  pointer-events: none;
  white-space: nowrap;
}
.rc-shop-rv__img-btn:hover::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ── Info ──────────────────────────────────────────────────────────────── */
.rc-shop-rv__info {
  padding: 0.5rem 0.6rem 0.6rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  flex: 1;
}
.rc-shop-rv__name {
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.35;
  color: var(--rc-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-shop-rv__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem;
  margin-top: auto;
}
.rc-shop-rv__price {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--rc-primary);
  line-height: 1;
}

/* ── Add-to-cart button ────────────────────────────────────────────────── */
.rc-shop-rv__atc {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border-radius: 50%;
  border: 1.5px solid var(--rc-border);
  background: var(--rc-white);
  color: var(--rc-muted);
  cursor: pointer;
  transition: background 180ms, border-color 180ms, color 180ms, transform 180ms;
}
.rc-shop-rv__atc:hover {
  border-color: var(--rc-primary);
  color: var(--rc-primary);
  transform: scale(1.12);
}
.rc-shop-rv__atc--added,
.rc-shop-rv__atc--added:hover {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: #fff;
  transform: scale(1.0);
}
.rc-shop-rv__atc:disabled { opacity: 0.55; cursor: default; transform: none; }

/* ── Nav arrows ────────────────────────────────────────────────────────── */
.rc-shop-rv__nav {
  display: flex;
  gap: 0.375rem;
  margin-left: auto;
}
.rc-shop-rv__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px; height: 30px;
  border-radius: 50%;
  border: 1.5px solid var(--rc-border);
  background: var(--rc-white);
  color: var(--rc-text);
  cursor: pointer;
  transition: background 180ms, border-color 180ms, color 180ms;
}
.rc-shop-rv__arrow:hover {
  background: var(--rc-primary);
  border-color: var(--rc-primary);
  color: #fff;
}

/* ── Responsive ────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .rc-shop-rv__card { flex: 0 0 130px; }
}

/* ─── 21. PRICE SLIDER ───────────────────────────────────────────────────── */

.rc-price-slider {
  padding: 0.5rem 0 0.25rem;
}

.rc-price-slider__track {
  position: relative;
  height: 4px;
  background: var(--rc-border);
  border-radius: 2px;
  margin: 1.25rem 0.5rem 1.5rem;
}

.rc-price-slider__fill {
  position: absolute;
  top: 0; height: 100%;
  background: var(--rc-primary);
  border-radius: 2px;
  pointer-events: none;
}

.rc-price-slider__thumb {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--rc-white);
  border: 2px solid var(--rc-primary);
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
  cursor: grab;
  touch-action: none;
  z-index: 2;
  padding: 0;
  transition: transform 120ms ease, box-shadow 120ms ease;
}
.rc-price-slider__thumb:active { cursor: grabbing; transform: translate(-50%, -50%) scale(1.2); box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.rc-price-slider__thumb:focus-visible { outline: 2px solid var(--rc-primary); outline-offset: 2px; }
/* Expand touch target on touch devices without changing visual size */
@media (hover: none) and (pointer: coarse) {
  .rc-price-slider__thumb::after {
    content: '';
    position: absolute;
    inset: -13px;
    border-radius: 50%;
  }
}

.rc-price-slider__labels {
  display: flex;
  justify-content: space-between;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-text);
  padding: 0 0.25rem;
}

/* ─── 22. SEARCH BACKDROP ───────────────────────────────────────────────── */
/* z-index 9: below rc-search-inline (10) so the bar stays readable above the dim */

.rc-search-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9;
  background: rgba(0,0,0,0);
  pointer-events: none;
  transition: background 300ms ease;
}
.rc-search-backdrop--active {
  background: rgba(0,0,0,0.38);
  pointer-events: auto;
}

/* ─── 23. PRODUCT CARD IMAGE HEIGHT ─────────────────────────────────────── */
/* Aspect-ratio classes on .rc-card__img-wrap control height — no max-height needed. */

/* ══════════════════════════════════════════════════════════════════════════
   24. MY ACCOUNT — deep polish
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Account RV section spacing ─────────────────────────────────────────── */
.rc-account-rv {
  margin-top: 2.5rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--rc-border);
}

/* ── Override any stale nav__greeting selectors still in earlier CSS ─────── */
.rc-account-nav__greeting { display: none !important; }

/* ── Order status badges ─────────────────────────────────────────────────── */
.woocommerce-account mark.order-status,
.woocommerce-orders-table__cell mark.order-status {
  background: var(--rc-surface);
  color: var(--rc-muted);
  border-radius: 999px;
  padding: 0.25rem 0.75rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  display: inline-block;
  white-space: nowrap;
}
.woocommerce-account mark.order-status.status-completed  { background: #dcfce7; color: #15803d; }
.woocommerce-account mark.order-status.status-processing { background: #dbeafe; color: #1d4ed8; }
.woocommerce-account mark.order-status.status-on-hold    { background: #fef9c3; color: #a16207; }
.woocommerce-account mark.order-status.status-pending    { background: #fef3c7; color: #92400e; }
.woocommerce-account mark.order-status.status-cancelled  { background: #fee2e2; color: #b91c1c; }
.woocommerce-account mark.order-status.status-refunded   { background: #f3f4f6; color: #6b7280; }
.woocommerce-account mark.order-status.status-failed     { background: #fee2e2; color: #b91c1c; }

/* ── Orders table row hover ──────────────────────────────────────────────── */
.woocommerce-account table.shop_table tbody tr {
  transition: background 120ms;
}
.woocommerce-account table.shop_table tbody tr:hover td {
  background: color-mix(in srgb, var(--rc-primary) 4%, transparent);
}

/* ── Order action links → pill buttons ──────────────────────────────────── */
.woocommerce-account .woocommerce-orders-table__cell-order-actions { white-space: nowrap; }
.woocommerce-account .woocommerce-orders-table__cell-order-actions a {
  margin-right: 0.375rem;
  border-radius: 999px !important;
  font-size: 0.75rem !important;
  padding: 0.25rem 0.75rem !important;
}

/* ── Order details page ──────────────────────────────────────────────────── */
.woocommerce-account .woocommerce-order-details,
.woocommerce-account .woocommerce-customer-details {
  margin-top: 1.5rem;
}
.woocommerce-account .woocommerce-order-details__title,
.woocommerce-account .woocommerce-column__title {
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rc-muted) !important;
  margin-bottom: 0.75rem !important;
}

/* ── Dashboard welcome paragraph ─────────────────────────────────────────── */
.woocommerce-account .woocommerce-MyAccount-content > p:first-child {
  background: color-mix(in srgb, var(--rc-primary) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--rc-primary) 18%, transparent);
  border-radius: var(--rc-radius);
  padding: 1rem 1.25rem;
  font-size: 0.9375rem;
  color: var(--rc-text);
  line-height: 1.6;
  margin-bottom: 1.75rem;
}

/* ── Dashboard quick-nav links (orders, address etc.) ───────────────────── */
.woocommerce-account .woocommerce-MyAccount-content > p:first-child a {
  color: var(--rc-primary);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, var(--rc-primary) 35%, transparent);
  transition: border-color 150ms;
}
.woocommerce-account .woocommerce-MyAccount-content > p:first-child a:hover {
  border-bottom-color: var(--rc-primary);
}

/* ── Account page — content inner card ──────────────────────────────────── */
.rc-account-content .woocommerce {
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
  padding: 1.75rem 2rem;
}
@media (max-width: 599px) {
  .rc-account-content .woocommerce { padding: 1.25rem; }
}

/* ── Address cards — more polish ─────────────────────────────────────────── */
.woocommerce-account .woocommerce-Address {
  transition: box-shadow 200ms, border-color 200ms;
}
.woocommerce-account .woocommerce-Address:hover {
  border-color: var(--rc-primary);
  box-shadow: 0 4px 16px rgba(0,0,0,0.07);
}
.woocommerce-account .woocommerce-Address p { color: var(--rc-muted); }
.woocommerce-account .woocommerce-Address .button {
  margin-top: 0.5rem;
  font-size: 0.8125rem !important;
  height: 36px !important;
  padding: 0 1rem !important;
}

/* ── Edit account / password fieldsets ──────────────────────────────────── */
.woocommerce-account fieldset {
  border-radius: var(--rc-radius-lg) !important;
}
.woocommerce-account fieldset legend {
  color: var(--rc-primary);
}

/* ── Pagination on orders list ───────────────────────────────────────────── */
.woocommerce-account .woocommerce-pagination { margin-top: 1.5rem; }
.woocommerce-account .woocommerce-pagination ul {
  display: flex; gap: 0.375rem; list-style: none; padding: 0; margin: 0;
  flex-wrap: wrap;
}
.woocommerce-account .woocommerce-pagination li a,
.woocommerce-account .woocommerce-pagination li span {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px;
  border-radius: var(--rc-radius);
  border: 1.5px solid var(--rc-border);
  background: var(--rc-surface);
  font-size: 0.875rem; font-weight: 600; color: var(--rc-text);
  text-decoration: none;
  transition: background 150ms, border-color 150ms, color 150ms;
}
.woocommerce-account .woocommerce-pagination li a:hover {
  border-color: var(--rc-primary); color: var(--rc-primary);
}
.woocommerce-account .woocommerce-pagination li span.current {
  background: var(--rc-primary); border-color: var(--rc-primary);
  color: #fff;
}

/* ── Mobile: hide nav header label, collapse sidebar ────────────────────── */
@media (max-width: 767px) {
  .rc-account-layout { padding: 1.5rem 0 3rem; }
  .rc-account-nav__header { display: none; }
  .rc-account-content .woocommerce { padding: 1rem; }
  .rc-account-sidebar { position: static; }
}

/* ══════════════════════════════════════════════════════════════════════════
   25. MY ACCOUNT — zero-state, empty orders, nudge, buy-again
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Zero-order stat CTA ─────────────────────────────────────────────────── */
.rc-account-stat__cta {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--rc-primary);
  text-decoration: none;
  margin-top: 0.3rem;
  opacity: 0.8;
  transition: opacity 150ms;
}
.rc-account-stat__cta:hover { opacity: 1; }

/* ── Orders empty state ──────────────────────────────────────────────────── */
.rc-orders-empty {
  text-align: center;
  padding: 4rem 2rem;
  background: var(--rc-surface);
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius-lg);
}
.rc-orders-empty__icon {
  width: 76px; height: 76px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--rc-primary) 8%, transparent);
  color: var(--rc-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.375rem;
}
.rc-orders-empty__title {
  font-size: 1.1875rem; font-weight: 800; margin: 0 0 0.5rem;
  letter-spacing: -0.025em;
}
.rc-orders-empty__desc {
  font-size: 0.9375rem; color: var(--rc-muted); margin: 0 auto 2rem;
  max-width: 380px; line-height: 1.6;
}
.rc-orders-empty__cta {
  display: inline-flex; align-items: center; gap: 0.5rem;
  height: 44px; padding: 0 1.625rem;
  background: var(--rc-primary) !important; color: var(--rc-btn-text) !important;
  border-radius: var(--rc-radius);
  font-size: 0.9375rem; font-weight: 700;
  text-decoration: none;
  transition: opacity 150ms;
}
.rc-orders-empty__cta:hover { opacity: 0.85; color: var(--rc-btn-text) !important; }

/* ── Address completion nudge ────────────────────────────────────────────── */
.rc-account-nudge {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.375rem;
  background: color-mix(in srgb, var(--rc-primary) 5%, transparent);
  border: 1px solid color-mix(in srgb, var(--rc-primary) 22%, transparent);
  border-radius: var(--rc-radius-lg);
  margin-bottom: 2rem;
}
.rc-account-nudge__icon {
  flex-shrink: 0;
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--rc-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.rc-account-nudge__body { flex: 1; min-width: 0; }
.rc-account-nudge__body strong {
  display: block; font-size: 0.9375rem; font-weight: 700; margin-bottom: 0.2rem;
}
.rc-account-nudge__body p { font-size: 0.875rem; color: var(--rc-muted); margin: 0; }
.rc-account-nudge__btn {
  flex-shrink: 0;
  display: inline-flex; align-items: center;
  height: 38px; padding: 0 1.125rem;
  background: var(--rc-primary) !important; color: var(--rc-btn-text) !important;
  border-radius: var(--rc-radius);
  font-size: 0.8125rem; font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 150ms;
}
.rc-account-nudge__btn:hover { opacity: 0.85; color: var(--rc-btn-text) !important; }
@media (max-width: 540px) {
  .rc-account-nudge { flex-wrap: wrap; }
  .rc-account-nudge__btn { width: 100%; justify-content: center; }
}

/* ── "Buy again" (order-again) action button ─────────────────────────────── */
.woocommerce-account .rc-btn-reorder {
  background: var(--rc-primary) !important;
  border-color: var(--rc-primary) !important;
  color: var(--rc-btn-text) !important;
}
.woocommerce-account .rc-btn-reorder:hover {
  opacity: 0.85 !important;
  background: var(--rc-primary) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   26. PRODUCT INFO BLOCKS — FAQ tab, Returns & Care collapsibles
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Shared collapsible toggle (Returns + Care) ──────────────────────────── */
.rc-single__info-block {
  border-top: 1px solid var(--rc-border);
  margin-top: 0.75rem;
}
.rc-single__info-toggle {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  background: none;
  border: none;
  padding: 0.875rem 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  cursor: pointer;
  text-align: left;
  transition: color 150ms;
}
.rc-single__info-toggle:hover { color: var(--rc-primary); }
.rc-single__info-toggle-icon {
  flex-shrink: 0;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--rc-primary) 8%, transparent);
  color: var(--rc-primary);
  display: flex; align-items: center; justify-content: center;
}
.rc-single__info-chevron {
  margin-left: auto;
  flex-shrink: 0;
  color: var(--rc-muted);
  transition: transform 220ms ease;
}
.rc-single__info-body {
  padding-bottom: 1rem;
}
.rc-single__info-content {
  font-size: 0.875rem;
  line-height: 1.7;
  color: var(--rc-muted);
}
.rc-single__info-content p  { margin: 0 0 0.5rem; }
.rc-single__info-content ul,
.rc-single__info-content ol { padding-left: 1.25rem; margin: 0 0 0.5rem; }
.rc-single__info-content li { margin-bottom: 0.25rem; }
.rc-single__info-content h3 {
  font-size: 0.875rem; font-weight: 700; color: var(--rc-text);
  margin: 0.75rem 0 0.25rem;
}
.rc-single__info-content h3:first-child { margin-top: 0; }
.rc-single__info-content strong { color: var(--rc-text); font-weight: 600; }

/* Care content: emoji lines get a bit more breathing room */
.rc-single__care-content p { margin-bottom: 0.625rem; }

/* ── FAQ tab panel ───────────────────────────────────────────────────────── */
.rc-faq__content { max-width: 720px; }
.rc-faq__content h3 {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--rc-text);
  margin: 0;
  padding: 1.1rem 0 0.75rem;
  border-top: 1px solid var(--rc-border);
  letter-spacing: -0.01em;
}
.rc-faq__content h3:first-child { border-top: none; padding-top: 0; }
.rc-faq__content p {
  font-size: 0.9375rem;
  color: var(--rc-muted);
  line-height: 1.7;
  margin: 0 0 0.75rem;
  padding-left: 0.125rem;
}
.rc-faq__content ul,
.rc-faq__content ol { padding-left: 1.375rem; margin: 0 0 0.75rem; color: var(--rc-muted); font-size: 0.9375rem; }
.rc-faq__content li { margin-bottom: 0.25rem; line-height: 1.65; }
.rc-faq__content strong { color: var(--rc-text); }

/* ── Shared content block prose (returns + care) also inherits figure styles */
.rc-single__info-content figure { display: block; width: 100%; overflow-x: auto; margin: 0 0 0.5rem; }
.rc-single__info-content table {
  width: 100%; min-width: 100%; border-collapse: collapse; font-size: 0.8125rem;
}
.rc-single__info-content table th {
  padding: 0.5rem 0.75rem; font-weight: 700; font-size: 0.75rem;
  text-transform: uppercase; letter-spacing: 0.04em;
  background: var(--rc-surface); border-bottom: 2px solid var(--rc-border); text-align: left;
}
.rc-single__info-content table td {
  padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rc-border);
}
.rc-single__info-content table tr:last-child td { border-bottom: none; }

/* ══════════════════════════════════════════════════════════════════════════
   27. CUSTOM TAG BADGES (product_tag term meta)
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Card: right-side tag badges ─────────────────────────────────────────── */
.rc-card__tag-badges {
  position: absolute;
  top: 0.625rem;
  right: 0.625rem;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.3rem;
  z-index: 3;
  pointer-events: none;
}
.rc-card__tag-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.5rem;
  border-radius: 2rem;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #fff;
  line-height: 1.2;
  white-space: nowrap;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0,0,0,0.25);
  box-shadow: 0 1px 4px rgba(0,0,0,0.18);
}
.rc-card__tag-badge > span { font-size: 0.8rem; line-height: 1; }

/* ── Single product: tag badge pills below title ─────────────────────────── */
.rc-single__tag-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.875rem;
}
.rc-single__tag-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.9rem;
  border-radius: 2rem;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #fff;
  line-height: 1;
  text-shadow: 0 1px 3px rgba(0,0,0,0.2);
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  animation: rc-badge-pop 300ms cubic-bezier(0.34,1.56,0.64,1) both;
}
.rc-single__tag-badge > span { font-size: 1rem; line-height: 1; }

@keyframes rc-badge-pop {
  from { opacity: 0; transform: scale(0.8); }
  to   { opacity: 1; transform: scale(1); }
}

/* ══════════════════════════════════════════════════════════════════════════
   28. MOBILE RESPONSIVE FIXES
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 28.1: Header — prevent cart icon clipping on narrow screens ─────────────
   1fr auto 1fr splits space equally around the logo auto column. When the
   text logo ("RaftaarCommerce") expands the auto column beyond ~180px the
   right 1fr collapses below 144px (3×48px buttons) and the cart clips.
   Switch to auto 1fr auto so buttons get their natural size; logo shrinks. */
@media (max-width: 767px) {
  .rc-header__inner {
    grid-template-columns: auto 1fr auto;
    padding: 0 0.875rem;
    gap: 0;
  }
  .rc-header__center {
    min-width: 0;
    overflow: hidden;
    padding: 0 0.5rem;
  }
  .rc-logo-text {
    font-size: 1.0625rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .rc-header__logo .custom-logo { max-height: 28px; }
  /* Tighter icon buttons on mobile so 3 fit comfortably */
  .rc-btn-icon { width: 44px; height: 44px; border-radius: 10px; }
  .rc-menu-pill { height: 44px; padding: 0 0.625rem; }
}

/* ── 28.2: Sticky cart bar — sit above mobile bottom nav ─────────────────────
   Both .rc-sticky-cart and .rc-bottom-nav are position:fixed; bottom:0.
   sticky-cart z-index:850 beats bottom-nav z-index:400, making the nav
   invisible. Move sticky cart above the 60px nav bar on mobile. */
@media (max-width: 1023px) {
  .rc-sticky-cart {
    bottom: calc(60px + env(safe-area-inset-bottom, 0px));
  }
}

/* ── 28.3: Upsell drawer — backdrop must cover sticky cart bar ───────────────
   The backdrop is position:fixed;z-index:0 which evaluates at the ROOT
   stacking level — below sticky cart at z-index:850. Raise it above. */
.rc-upsell-drawer__backdrop {
  z-index: 900;
}
.rc-upsell-drawer__panel {
  z-index: 901;
}

/* ── 28.4: Upsell drawer — extra bottom clearance on mobile ──────────────────
   Panel overflows behind mobile bottom nav when content is tall. */
@media (max-width: 1023px) {
  .rc-upsell-drawer__panel {
    padding-bottom: calc(1.5rem + 60px + env(safe-area-inset-bottom, 0px));
  }
}

/* ── 28.5: Page body — bottom padding so footer isn't hidden behind bottom nav */
@media (max-width: 1023px) {
  .rc-footer {
    padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px));
  }
}

/* ── 28.6: Single product tabs — tighter padding on very narrow phones ────── */
@media (max-width: 400px) {
  .rc-tab-btn {
    padding: 0.875rem 0.75rem;
    font-size: 0.8125rem;
  }
}

/* ── 28.7: Single product — ATC row stacks cleanly on narrow phones ─────────*/
@media (max-width: 400px) {
  .rc-single__qty-atc { flex-direction: column; align-items: stretch; }
  .rc-single__qty-atc .rc-single__qty { width: 100%; justify-content: center; }
  .rc-single__qty-atc .rc-single__wishlist-icon-btn { align-self: flex-start; }
}

/* ── 28.8: Shop toolbar — wrap on mobile so sort+count don't overlap ─────── */
@media (max-width: 639px) {
  .rc-shop-toolbar {
    flex-wrap: wrap;
    gap: 0.75rem;
  }
  .rc-shop-toolbar__right { flex-wrap: wrap; gap: 0.5rem; }
}

/* ── 28.9: Cart drawer — full viewport height on mobile ─────────────────────*/
@media (max-width: 767px) {
  .rc-cart-drawer { width: 100vw !important; max-width: 100vw !important; }
}

/* ── 28.10: Hero section — reduce empty space on mobile with no image ───────*/
@media (max-width: 767px) {
  .rc-home-hero { min-height: 50vh; }
  .rc-hero { padding: 3rem 0; }
}

/* ── 28.11: Recently viewed strip — prevent overflow on very narrow ──────────*/
@media (max-width: 400px) {
  .rc-shop-rv__card { min-width: 110px; }
  .rc-shop-rv__img-wrap { height: 110px; }
}

/* ── 28.12: Promo banner — stack layout on mobile ───────────────────────────*/
@media (max-width: 639px) {
  .rc-promo-banner__inner {
    flex-direction: column !important;
    text-align: center;
    gap: 1.5rem;
  }
  .rc-promo-banner__cta { margin: 0 auto; }
}

/* ── 28.13: Product card actions — show on mobile (hover doesn't exist) ─────*/
@media (hover: none) {
  /* Disable 3D perspective tilt + holographic sheen on touch — perspective()
     in a transform creates a 3D rendering context that overflows overflow:hidden */
  .rc-card:hover {
    transform: none;
    box-shadow: none;
  }
  .rc-card:hover .rc-card__holo { opacity: 0; animation: none; }
  .rc-card:hover .rc-card__cf-img--primary { transform: none; transition: none; }

  .rc-card__actions { opacity: 1 !important; transform: none !important; pointer-events: auto; }
  .rc-card__action-btn { opacity: 1 !important; pointer-events: auto; }

  /* Quick view and compare are desktop-only interactions */
  .rc-card__action-btn--quick-view,
  .rc-card__compare-btn { display: none !important; }

  /* ATC: drop the text label — icon carries the meaning; keep pill shape
     so it stays visually distinct as the primary action in the trio */
  .rc-card__action-btn--atc .rc-card__atc-label { display: none !important; }
  .rc-card__action-btn--atc span { display: none !important; }
  .rc-card__action-btn--atc {
    width: auto;
    min-width: 36px;
    padding: 0 1.375rem;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   BETA BLOCKS — Icon Bar · Newsletter · Countdown Banner · Product Tabs
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Icon Bar ────────────────────────────────────────────────────────────── */
.rc-icon-bar {
  display: grid;
  grid-template-columns: repeat(var(--rc-ib-cols, 4), 1fr);
  gap: 1rem;
  padding: 1.5rem 0;
}
.rc-icon-bar__item {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 1.125rem 1rem;
  border-radius: var(--rc-radius);
}
.rc-icon-bar--bordered .rc-icon-bar__item {
  border: 1px solid var(--rc-border);
}
.rc-icon-bar--boxed .rc-icon-bar__item {
  background: var(--rc-surface);
}
.rc-icon-bar__icon { color: var(--rc-primary); flex-shrink: 0; line-height: 0; }
.rc-icon-bar__copy { display: flex; flex-direction: column; gap: 0.125rem; }
.rc-icon-bar__text    { font-weight: 600; font-size: 0.9375rem; color: var(--rc-text); }
.rc-icon-bar__subtext { font-size: 0.8125rem; color: var(--rc-muted); }
@media (max-width: 767px) { .rc-icon-bar { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 479px) { .rc-icon-bar { grid-template-columns: 1fr; } }

/* ── Newsletter Block ────────────────────────────────────────────────────── */
.rc-newsletter-blk {
  padding: 3rem 2rem;
  background: var(--rc-surface);
  text-align: center;
}
.rc-newsletter-blk--dark {
  background: var(--rc-primary);
  color: #fff;
}
.rc-newsletter-blk__title {
  font-size: clamp(1.375rem, 3vw, 2rem);
  font-weight: 700;
  margin: 0 0 0.5rem;
}
.rc-newsletter-blk__sub {
  font-size: 1rem;
  color: var(--rc-muted);
  margin: 0 0 1.5rem;
}
.rc-newsletter-blk--dark .rc-newsletter-blk__sub { color: rgba(255,255,255,0.75); }
.rc-newsletter-blk__form {
  display: flex;
  gap: 0.5rem;
  max-width: 480px;
  margin: 0 auto;
}
.rc-newsletter-blk__input {
  flex: 1;
  padding: 0.75rem 1rem;
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-size: 0.9375rem;
  background: var(--rc-surface);
  color: var(--rc-text);
  outline: none;
  transition: border-color 150ms;
}
.rc-newsletter-blk__input:focus { border-color: var(--rc-primary); }
.rc-newsletter-blk--dark .rc-newsletter-blk__input {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.3);
  color: #fff;
}
.rc-newsletter-blk--dark .rc-newsletter-blk__input::placeholder { color: rgba(255,255,255,0.5); }
.rc-newsletter-blk__btn {
  padding: 0.75rem 1.5rem;
  background: var(--rc-primary);
  color: #fff;
  border: none;
  border-radius: var(--rc-radius);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 150ms;
}
.rc-newsletter-blk--dark .rc-newsletter-blk__btn {
  background: var(--rc-white);
  color: var(--rc-primary);
}
.rc-newsletter-blk__btn:disabled { opacity: 0.6; cursor: not-allowed; }
.rc-newsletter-blk__msg { margin-top: 0.75rem; font-size: 0.875rem; font-weight: 500; }
.rc-newsletter-blk__msg--success { color: var(--rc-success, #22c55e); }
.rc-newsletter-blk__msg--error   { color: var(--rc-error,   #ef4444); }
@media (max-width: 479px) { .rc-newsletter-blk__form { flex-direction: column; } }

/* ── Countdown Banner ────────────────────────────────────────────────────── */
.rc-countdown-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.5rem 2.5rem;
  padding: 1.5rem 2rem;
  background: var(--rc-primary);
  color: #fff;
}
.rc-countdown-banner__copy { flex: 1 1 auto; min-width: 180px; }
.rc-countdown-banner__heading {
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
  font-weight: 700;
  margin: 0;
  color: inherit;
}
.rc-countdown-banner__sub {
  font-size: 0.9375rem;
  opacity: 0.85;
  margin: 0.25rem 0 0;
  color: inherit;
}
.rc-countdown-banner__timer {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  flex-shrink: 0;
}
.rc-countdown-banner__unit {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 3.25rem;
}
.rc-countdown-banner__num {
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.rc-countdown-banner__label {
  font-size: 0.6875rem;
  opacity: 0.75;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-top: 0.2rem;
}
.rc-countdown-banner__sep {
  font-size: 1.75rem;
  font-weight: 700;
  opacity: 0.5;
  padding-bottom: 0.75rem;
}
.rc-countdown-banner__cta { flex-shrink: 0; }
.rc-countdown-banner__cta-btn {
  display: inline-block;
  padding: 0.75rem 1.75rem;
  background: var(--rc-white);
  color: var(--rc-primary);
  font-weight: 700;
  border-radius: var(--rc-radius);
  text-decoration: none;
  transition: opacity 150ms;
}
.rc-countdown-banner__cta-btn:hover { opacity: 0.9; color: var(--rc-primary); }
.rc-countdown-banner__expired { font-size: 1.125rem; font-weight: 600; opacity: 0.85; margin: 0; }
@media (max-width: 640px) {
  .rc-countdown-banner { padding: 1.25rem 1rem; gap: 1rem; }
  .rc-countdown-banner__num { font-size: 1.5rem; }
  .rc-countdown-banner__unit { min-width: 2.5rem; }
}

/* ── Product Tabs (homepage block) ───────────────────────────────────────── */
.rc-product-tabs__title {
  font-size: clamp(1.375rem, 3vw, 2rem);
  font-weight: 700;
  margin: 0 0 1.5rem;
}
.rc-product-tabs__nav { margin-bottom: 0; }

/* ═══════════════════════════════════════════════════════════════════════════
   SINGLE PRODUCT — GALLERY LAYOUT VARIANTS
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Thumbs-left layout ─────────────────────────────────────────────────── */
.rc-single__gallery--thumbs-left {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 0.625rem;
  align-items: start;
}
.rc-single__thumbs--left {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-height: 560px;
  overflow-y: auto;
  scrollbar-width: none;
}
.rc-single__thumbs--left::-webkit-scrollbar { display: none; }
.rc-single__thumbs--left .rc-single__thumb {
  width: 64px;
  height: 85px;
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .rc-single__gallery--thumbs-left {
    grid-template-columns: 1fr;
  }
  .rc-single__thumbs--left {
    flex-direction: row;
    max-height: none;
    overflow-x: auto;
    max-width: 100%;
  }
}

/* ── Stacked layout ─────────────────────────────────────────────────────── */
.rc-single__gallery--stacked {
  position: sticky;
  top: calc(var(--rc-header-h) + 1rem);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-height: 85vh;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--rc-border) transparent;
  border-radius: var(--rc-radius);
}
.rc-single__stacked-img {
  border-radius: var(--rc-radius);
  overflow: hidden;
  background: var(--rc-surface);
  flex-shrink: 0;
}
.rc-single__stacked-img .rc-single__img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}
.rc-single__stacked-img--first .rc-single__img { aspect-ratio: 3 / 4; }
@media (max-width: 767px) {
  .rc-single__gallery--stacked {
    position: relative;
    top: 0;
    max-height: none;
    overflow-y: visible;
  }
}

/* ── Sticky ATC info column ─────────────────────────────────────────────── */
.rc-sticky-atc__info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 0;
}
.rc-sticky-atc__btn { min-width: 130px; justify-content: center; }

/* ══════════════════════════════════════════════════════════════════════════
   SHOP: Mobile filter drawer + active filter chips
   ══════════════════════════════════════════════════════════════════════════ */

/* Overlay behind drawer */
.rc-filter-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 199;
  cursor: pointer;
}
@media (min-width: 1024px) {
  .rc-filter-overlay { display: none !important; }
}

/* Mobile: sidebar becomes a fixed off-canvas drawer */
@media (max-width: 1023px) {
  .rc-shop-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    /* Explicit height instead of bottom:0 — body overflow:hidden breaks the
       top+bottom constraint, making the sidebar expand to document height
       (1900px+) with no scrollable overflow and causing the scroll freeze. */
    height: 100vh;
    height: 100dvh;
    width: min(320px, 90vw);
    z-index: 200;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    padding: 1rem 1.25rem;
    /* Extra bottom clearance so the last filter section (and the "Show more"
       toggle) scrolls fully above the fixed bottom nav (60px + safe-area).
       The empty .rc-sidebar-widgets div contributes 16px margin-top after
       the filter panel, so the effective clearance needed is ~110px total. */
    padding-bottom: calc(110px + env(safe-area-inset-bottom, 0px));
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.13);
    transform: translateX(-100%);
    transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
  }
  .rc-shop-sidebar--open {
    transform: translateX(0);
  }
}

/* Close button inside drawer header (mobile only) */
.rc-filter-panel__close {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--rc-muted);
  padding: 0.25rem;
  border-radius: var(--rc-radius);
  transition: color 150ms;
  margin-left: auto;
}
.rc-filter-panel__close:hover { color: var(--rc-text); }
@media (max-width: 1023px) {
  .rc-filter-panel__close { display: flex; align-items: center; }
}

/* Filter FAB — visible on mobile only */
.rc-filter-fab {
  display: none;
}
@media (max-width: 1023px) {
  .rc-filter-fab {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4375rem 0.875rem;
    background: var(--rc-surface);
    border: 1.5px solid var(--rc-border);
    border-radius: var(--rc-radius);
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    color: var(--rc-text);
    transition: border-color 150ms;
    white-space: nowrap;
  }
  .rc-filter-fab:hover { border-color: var(--rc-primary); }
}
.rc-filter-fab__badge {
  background: var(--rc-primary);
  color: #fff;
  border-radius: 999px;
  font-size: 0.625rem;
  font-weight: 700;
  min-width: 1.125rem;
  height: 1.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.25rem;
  line-height: 1;
}

/* Active filter chips strip */
.rc-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.rc-active-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  padding: 0.25rem 0.625rem 0.25rem 0.75rem;
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-primary);
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--rc-primary);
  cursor: pointer;
  transition: background 150ms, color 150ms;
  white-space: nowrap;
}
.rc-active-chip:hover {
  background: var(--rc-primary);
  color: #fff;
}
.rc-active-chip__x { opacity: 0.7; flex-shrink: 0; }
/* "Clear all" variant — filled primary */
.rc-active-chip--clear {
  background: var(--rc-primary);
  color: #fff;
  border-color: var(--rc-primary);
  font-weight: 600;
  margin-left: auto;
}
.rc-active-chip--clear:hover { opacity: 0.85; background: var(--rc-primary); color: #fff; }

/* Prevent body scroll when mobile drawer is open */
.rc-no-scroll { overflow: hidden; }

/* ═══════════════════════════════════════════════════════════════════════════
   CART PAGE
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-cart-page {
  padding: 2rem 0 4rem;
}

/* Two-column layout */
.rc-cart-page__layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 2.5rem;
  align-items: start;
}
@media (max-width: 1023px) {
  .rc-cart-page__layout { grid-template-columns: 1fr; gap: 2rem; }
}

/* Items column header */
.rc-cart-page__items-header {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1.5px solid var(--rc-border);
}
.rc-cart-page__heading {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  margin: 0;
}
.rc-cart-page__item-count {
  font-size: 0.875rem;
  color: var(--rc-text-muted);
  font-weight: 500;
}

/* Cart items — inherit drawer card style */
#rc-cart-page-body .rc-cart-item {
  border-radius: var(--rc-radius);
  border: 1.5px solid var(--rc-border);
  margin-bottom: 0.875rem;
  transition: border-color 150ms, box-shadow 150ms;
}
#rc-cart-page-body .rc-cart-item:hover {
  border-color: var(--rc-primary);
  box-shadow: 0 2px 16px rgba(0,0,0,.06);
}
#rc-cart-page-body .rc-cart-item__img { width: 80px; height: 108px; }

/* Coupon row — match drawer */
#rc-cart-page-body .rc-cart-coupon { margin-top: 1.5rem; }

/* Continue shopping */
.rc-cart-page__continue {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 1.25rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--rc-text-muted);
  text-decoration: none;
  transition: color 150ms;
}
.rc-cart-page__continue:hover { color: var(--rc-primary); }

/* Summary card (sticky on desktop) */
.rc-cart-page__col--summary { position: sticky; top: calc(var(--rc-header-h, 64px) + 1.5rem); }
@media (max-width: 1023px) { .rc-cart-page__col--summary { position: static; } }

.rc-cart-page__summary-card {
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: calc(var(--rc-radius) + 2px);
  padding: 1.5rem;
}
.rc-cart-page__summary-heading {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0 0 1.25rem;
  padding-bottom: 0.875rem;
  border-bottom: 1.5px solid var(--rc-border);
}

/* (shipping bar inside summary is styled in the bar section above) */

/* Totals table */
.rc-cart-totals { margin-bottom: 1.25rem; }
.rc-cart-totals__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.5rem 0;
  font-size: 0.9375rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-cart-totals__row:last-child { border-bottom: none; }
.rc-cart-totals__label { color: var(--rc-muted); }
.rc-cart-totals__value { font-weight: 500; }
.rc-cart-totals__value--savings { color: var(--rc-success); font-weight: 600; }
.rc-cart-totals__value--muted   { color: var(--rc-muted); font-size: 0.8125rem; }
.rc-cart-totals__free { color: var(--rc-success); font-weight: 600; }

.rc-cart-totals__row--total {
  padding-top: 0.875rem;
  margin-top: 0.25rem;
  border-bottom: none;
}
.rc-cart-totals__row--total .rc-cart-totals__label {
  font-size: 1rem;
  font-weight: 700;
  color: var(--rc-text);
}
.rc-cart-totals__value--total {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--rc-text);
  letter-spacing: -0.02em;
}

/* Checkout button */
.rc-cart-page__checkout-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  padding: 0.875rem 1.5rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ORDER CARDS (my account orders list)
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-orders-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.rc-order-card {
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: calc(var(--rc-radius) + 2px);
  overflow: hidden;
  transition: border-color 150ms, box-shadow 150ms;
}
.rc-order-card:hover {
  border-color: var(--rc-primary);
  box-shadow: 0 4px 20px rgba(0,0,0,.07);
}

/* Header row: order # + status | total + date */
.rc-order-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-order-card__id-wrap {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
}
.rc-order-card__number {
  font-weight: 700;
  font-size: 0.9375rem;
  color: var(--rc-text);
  text-decoration: none;
  letter-spacing: -0.015em;
}
.rc-order-card__number:hover { color: var(--rc-primary); }

.rc-order-card__summary {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.125rem;
}
.rc-order-card__total {
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: -0.015em;
}
.rc-order-card__date {
  font-size: 0.8125rem;
  color: var(--rc-text-muted);
}

/* Status badge */
.rc-order-status {
  display: inline-flex;
  align-items: center;
  padding: 0.1875rem 0.625rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.rc-order-status--processing  { background: #dbeafe; color: #1d4ed8; }
.rc-order-status--completed   { background: #dcfce7; color: #166534; }
.rc-order-status--on-hold     { background: #fef3c7; color: #92400e; }
.rc-order-status--pending     { background: #f3f4f6; color: #6b7280; }
.rc-order-status--cancelled   { background: #fee2e2; color: #991b1b; }
.rc-order-status--refunded    { background: #ede9fe; color: #5b21b6; }
.rc-order-status--failed      { background: #fee2e2; color: #991b1b; }

/* Product thumbnail strip */
.rc-order-card__thumbs {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 1.25rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-order-card__thumb {
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: calc(var(--rc-radius) - 2px);
  border: 1px solid var(--rc-border);
  flex-shrink: 0;
}
.rc-order-card__thumb-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: calc(var(--rc-radius) - 2px);
  background: var(--rc-surface);
  border: 1.5px dashed var(--rc-border);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-text-muted);
  flex-shrink: 0;
}

/* Actions row */
.rc-order-card__actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding: 0.875rem 1.25rem;
}

/* Pagination */
.rc-orders-pagination {
  display: flex;
  gap: 0.5rem;
  margin-top: 1.5rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   POST CARD ENHANCEMENTS
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-post-card__img-outer {
  position: relative;
  display: block;
}
.rc-post-card__cat-badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  background: var(--rc-primary);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-radius: 999px;
  text-decoration: none;
  transition: background 150ms;
  z-index: 1;
  pointer-events: auto;
}
.rc-post-card__cat-badge:hover { background: color-mix(in srgb, var(--rc-primary) 80%, #000); }

.rc-post-card__avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1.5px solid var(--rc-border);
}
.rc-post-card__author {
  font-weight: 600;
  color: var(--rc-text);
  font-size: 0.8125rem;
}
.rc-post-card__link {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
}

/* Featured card: push category badge to larger position */
.rc-post-grid__item--featured .rc-post-card__cat-badge {
  top: 1rem;
  left: 1rem;
  font-size: 0.75rem;
  padding: 0.3125rem 0.75rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   404 REDESIGN
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-404-main {
  min-height: 80vh;
  display: flex;
  align-items: center;
}
.rc-404-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
  padding: 5rem 0;
  max-width: 1100px;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .rc-404-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding: 3rem 0;
    text-align: center;
  }
  .rc-404-quicklinks { justify-content: center; }
  .rc-404-search { max-width: 400px; margin: 0 auto; }
}

/* Visual column — giant glitch number */
.rc-404-visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  user-select: none;
}
.rc-404-glitch {
  font-size: clamp(6rem, 16vw, 11rem);
  font-weight: 900;
  letter-spacing: -0.05em;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 2px var(--rc-border);
  position: relative;
}
.rc-404-glitch::before,
.rc-404-glitch::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  -webkit-text-stroke: 2px var(--rc-primary);
  color: transparent;
  clip-path: inset(0 0 60% 0);
  animation: rc-glitch-top 3.5s infinite steps(1);
}
.rc-404-glitch::after {
  -webkit-text-stroke: 2px var(--rc-accent, var(--rc-primary));
  clip-path: inset(60% 0 0 0);
  animation: rc-glitch-bottom 3.5s infinite steps(1);
}
@keyframes rc-glitch-top {
  0%,90%,100% { transform: none; opacity: 0; }
  92%          { transform: translateX(-3px) skewX(-3deg); opacity: 1; }
  94%          { transform: translateX(3px) skewX(3deg); opacity: 1; }
  96%          { transform: none; opacity: 0; }
}
@keyframes rc-glitch-bottom {
  0%,90%,100% { transform: none; opacity: 0; }
  91%          { transform: translateX(3px) skewX(3deg); opacity: 1; }
  93%          { transform: translateX(-3px) skewX(-3deg); opacity: 1; }
  95%          { transform: none; opacity: 0; }
}

/* Content column */
.rc-404-eyebrow {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rc-primary);
  margin-bottom: 0.75rem;
}
.rc-404__title {
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0 0 0.875rem;
}
.rc-404__desc {
  color: var(--rc-text-muted);
  font-size: 1rem;
  line-height: 1.65;
  margin: 0 0 1.75rem;
  max-width: 400px;
}
@media (max-width: 767px) { .rc-404__desc { margin-left: auto; margin-right: auto; } }

/* Quick links */
.rc-404-quicklinks {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
  margin-bottom: 1.75rem;
}
.rc-404-quicklink {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.5rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  text-decoration: none;
  transition: border-color 150ms, color 150ms, background 150ms;
}
.rc-404-quicklink:hover {
  border-color: var(--rc-primary);
  color: var(--rc-primary);
  background: color-mix(in srgb, var(--rc-primary) 6%, transparent);
}
.rc-404-quicklink__icon {
  display: flex;
  align-items: center;
  opacity: 0.7;
}

/* Search bar */
.rc-404-search {
  display: flex;
  gap: 0.5rem;
  max-width: 440px;
}
.rc-404-search .rc-input {
  flex: 1;
  height: 44px;
}
.rc-404-search .rc-btn {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CHECKOUT FORM POLISH
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-checkout-wrap {
  padding: 2rem 0 5rem;
}
.rc-checkout-layout {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 3rem;
  align-items: start;
}
@media (max-width: 1023px) {
  .rc-checkout-layout { grid-template-columns: 1fr; gap: 2rem; }
  .rc-checkout-layout > *:last-child { order: -1; }
}
.rc-checkout-heading {
  font-size: 1.375rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  margin: 0 0 1.5rem;
  padding-bottom: 0.875rem;
  border-bottom: 1.5px solid var(--rc-border);
}
.rc-checkout-section {
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: calc(var(--rc-radius) + 2px);
  padding: 1.5rem;
  margin-bottom: 1.25rem;
}
.rc-checkout-section h3 {
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0 0 1.25rem;
  color: var(--rc-text);
}

/* Floating labels for checkout fields */
.rc-field-wrap {
  position: relative;
  margin-bottom: 1.125rem;
}
.rc-field-wrap label {
  position: absolute;
  top: 50%;
  left: 0.875rem;
  transform: translateY(-50%);
  font-size: 0.9375rem;
  color: var(--rc-text-muted);
  pointer-events: none;
  transition: top 140ms ease, transform 140ms ease, font-size 140ms ease, color 140ms ease;
  z-index: 1;
  background: transparent;
  padding: 0 0.125rem;
}
.rc-field-wrap input:focus + label,
.rc-field-wrap input:not(:placeholder-shown) + label,
.rc-field-wrap select:focus + label,
.rc-field-wrap select:not([value=""]) + label {
  top: 0;
  transform: translateY(-50%);
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--rc-primary);
  background: var(--rc-surface);
}
.rc-field-wrap input,
.rc-field-wrap select {
  width: 100%;
  height: 52px;
  padding: 1rem 0.875rem 0.25rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-size: 0.9375rem;
  font-family: var(--rc-font);
  background: var(--rc-surface);
  color: var(--rc-text);
  outline: none;
  transition: border-color 150ms;
}
.rc-field-wrap input:focus,
.rc-field-wrap select:focus { border-color: var(--rc-primary); }

/* Order review sidebar */
.rc-checkout-order-review {
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: calc(var(--rc-radius) + 2px);
  padding: 1.5rem;
  position: sticky;
  top: calc(var(--rc-header-h, 64px) + 1.5rem);
}
@media (max-width: 1023px) { .rc-checkout-order-review { position: static; } }
.rc-checkout-order-review h3 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1.5px solid var(--rc-border);
}

/* WC form fields override */
.woocommerce-checkout .woocommerce-input-wrapper { display: block; }
.woocommerce-checkout .woocommerce-address-fields__field-wrapper,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
@media (max-width: 639px) {
  .woocommerce-checkout .woocommerce-address-fields__field-wrapper,
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper { grid-template-columns: 1fr; }
}
.woocommerce-checkout .form-row { margin: 0 0 1rem; }
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select {
  width: 100%;
  height: 48px;
  padding: 0 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-size: 0.9375rem;
  font-family: var(--rc-font);
  background: var(--rc-surface);
  color: var(--rc-text);
  outline: none;
  transition: border-color 150ms;
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus { border-color: var(--rc-primary); }
.woocommerce-checkout label { font-size: 0.8125rem; font-weight: 600; color: var(--rc-text); margin-bottom: 0.3125rem; display: block; }
.woocommerce-checkout .form-row.form-row-wide { grid-column: 1 / -1; }
.woocommerce-checkout #place_order {
  width: 100%;
  height: 52px;
  font-size: 1rem;
  font-weight: 700;
}

/* ═══════════════════════════════════════════════════════════════════════════
   MY ACCOUNT POLISH
   ═══════════════════════════════════════════════════════════════════════════ */
.rc-account-content .woocommerce-MyAccount-content > h2:first-child {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  margin-bottom: 1.5rem;
  padding-bottom: 0.875rem;
  border-bottom: 1.5px solid var(--rc-border);
}
/* WC address cards */
.woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
@media (max-width: 639px) { .woocommerce-Addresses { grid-template-columns: 1fr; } }
.woocommerce-Address {
  background: var(--rc-surface);
  border: 1.5px solid var(--rc-border);
  border-radius: calc(var(--rc-radius) + 2px);
  padding: 1.25rem;
}
.woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.875rem; }
.woocommerce-Address-title h3 { font-size: 0.9375rem; font-weight: 700; margin: 0; }
.woocommerce-Address address { font-style: normal; font-size: 0.9rem; color: var(--rc-muted); line-height: 1.65; }

/* ═══════════════════════════════════════════════════════════════════════════
   WC BLOCKS — CART & CHECKOUT FULL REDESIGN
   Targets Gutenberg Cart/Checkout block classes to match RC design DNA.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Override WC Blocks color tokens ──────────────────────────────────────── */
:root {
  --wc-block-color-primary:            var(--rc-primary);
  --wc-block-color-primary-dark:       var(--rc-primary);
  --wc-block-color-background:         var(--rc-white);
  --wc-block-border-radius:            var(--rc-radius);
  --wc-block-border-color:             var(--rc-border);
  --wc-block-global-box-shadow:        none;
  --wc-block-checkout-step-number-bg:  var(--rc-primary);
  --wc-block-checkout-field-font-size: 0.9375rem;
}

/* ── WC Blocks page‑level wrapper ─────────────────────────────────────────── */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
  font-family: var(--rc-font) !important;
  color: var(--rc-text) !important;
  padding: 2.5rem 0 5rem !important;
}

/* ── Two‑column sidebar layout (WC uses flexbox, not grid) ───────────────── */
.wc-block-components-sidebar-layout {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 2rem !important;
  align-items: start !important;
}
.wc-block-components-main {
  flex: 1 1 0 !important;
  min-width: 280px !important;
}
/* Sticky sidebar on desktop */
.wc-block-components-sidebar {
  flex: 0 0 380px !important;
  width: 380px !important;
  position: sticky !important;
  top: calc(var(--rc-header-h, 64px) + 1.5rem) !important;
}
@media (max-width: 1023px) {
  .wc-block-components-sidebar {
    flex: 1 1 100% !important;
    width: 100% !important;
    position: static !important;
  }
}

/* ═══════════════════════════════════════════
   CART BLOCK
   ═══════════════════════════════════════════ */

/* Cart items — table → card rows */
.wc-block-cart-items {
  border-collapse: separate !important;
  border-spacing: 0 0.625rem !important;
  width: 100%;
}
.wc-block-cart-items__header { display: none !important; }
/* Row: transparent — borders live on td cells so border-radius works correctly */
.wc-block-cart-items__row {
  background: transparent !important;
}
/* All td: top + bottom border, no left/right */
.wc-block-cart-items__row td {
  border-top: 1.5px solid var(--rc-border) !important;
  border-bottom: 1.5px solid var(--rc-border) !important;
  border-left: none !important;
  border-right: none !important;
  background: var(--rc-white) !important;
  transition: border-color 160ms !important;
}
/* First td: left border + left rounded corners */
.wc-block-cart-items__row td:first-child {
  border-left: 1.5px solid var(--rc-border) !important;
  border-radius: var(--rc-radius) 0 0 var(--rc-radius) !important;
}
/* Last td: right border + right rounded corners */
.wc-block-cart-items__row td:last-child {
  border-right: 1.5px solid var(--rc-border) !important;
  border-radius: 0 var(--rc-radius) var(--rc-radius) 0 !important;
}
/* Hover: shift border colour on all tds */
.wc-block-cart-items__row:hover td {
  border-color: var(--rc-primary) !important;
}

/* Product image */
.wc-block-cart-item__image {
  padding: 1rem 0.5rem 1rem 1rem !important;
  width: 84px !important;
}
.wc-block-cart-item__image a { display: block; }
.wc-block-cart-item__image img {
  width: 72px !important;
  height: 96px !important;
  object-fit: cover !important;
  border-radius: calc(var(--rc-radius) - 2px) !important;
  display: block !important;
}

/* Product name + meta */
.wc-block-cart-item__product { padding: 1rem 0.75rem !important; vertical-align: middle !important; }
.wc-block-components-product-name {
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  color: var(--rc-text) !important;
  text-decoration: none !important;
  letter-spacing: -0.01em !important;
  display: block !important;
  margin-bottom: 0.25rem !important;
  line-height: 1.3 !important;
}
.wc-block-components-product-name:hover { color: var(--rc-primary) !important; }
.wc-block-cart-item__prices { margin: 0.25rem 0 !important; }
.wc-block-components-product-price { font-family: var(--rc-font) !important; }
.wc-block-components-product-price__regular {
  font-size: 0.8125rem !important;
  /* var(--rc-muted) alone measured 3.4:1 against the light cart/checkout
     summary background — under the 4.5:1 minimum. Mixed toward var(--rc-text)
     rather than a hardcoded black (or a hardcoded hex, which would only be
     right for one palette): this pushes darker on light-on-dark palettes and
     LIGHTER on light-on-dark ones like "Midnight" (light --rc-muted on a dark
     surface), instead of always darkening regardless of which direction
     actually improves contrast for the active palette. Verified against all
     5 built-in presets' own surfaces, accounting for the opacity below too. */
  color: color-mix(in srgb, var(--rc-muted) 45%, var(--rc-text)) !important;
  opacity: 0.8 !important;
}
.wc-block-components-product-price__value.is-discounted,
.wc-block-components-product-price__value { color: var(--rc-text) !important; font-weight: 600 !important; }
.wc-block-components-product-metadata__description {
  font-size: 0.8125rem !important;
  color: var(--rc-muted) !important;
  margin-top: 0.25rem !important;
}

/* Sale badge */
.wc-block-components-sale-badge {
  background: var(--rc-primary) !important;
  color: #fff !important;
  font-family: var(--rc-font) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  padding: 0.125rem 0.5rem !important;
  border-radius: 999px !important;
  border: none !important;
  margin-left: 0.25rem !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.2em !important;
}
/* Adds space between "Save" text node and the price span */
.wc-block-components-sale-badge .woocommerce-Price-amount { margin-left: 0.15em !important; }

/* Qty selector — pill style */
.wc-block-cart-item__quantity { padding: 0 0.75rem !important; vertical-align: middle !important; }
.wc-block-components-quantity-selector {
  display: inline-flex !important;
  align-items: center !important;
  background: var(--rc-surface) !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  height: 38px !important;
  box-shadow: none !important;
}
.wc-block-components-quantity-selector__button {
  width: 38px !important;
  height: 36px !important;
  background: none !important;
  border: none !important;
  font-size: 1.0625rem !important;
  font-weight: 400 !important;
  color: var(--rc-text) !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 120ms !important;
  padding: 0 !important;
  border-radius: 0 !important;
  line-height: 1 !important;
}
.wc-block-components-quantity-selector__button:hover:not(:disabled) {
  background: var(--rc-border) !important;
}
.wc-block-components-quantity-selector__button:disabled { opacity: 0.3 !important; cursor: not-allowed !important; }
/* WC renders − and + as text nodes directly; no overrides needed for content */
.wc-block-components-quantity-selector__input {
  width: 36px !important;
  text-align: center !important;
  border: none !important;
  border-left: 1.5px solid var(--rc-border) !important;
  border-right: 1.5px solid var(--rc-border) !important;
  background: transparent !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  color: var(--rc-text) !important;
  padding: 0 !important;
  height: 100% !important;
  box-shadow: none !important;
  outline: none !important;
  -moz-appearance: textfield !important;
}
.wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
.wc-block-components-quantity-selector__input::-webkit-inner-spin-button { -webkit-appearance: none !important; }

/* Remove button */
.wc-block-cart-item__remove-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.3rem !important;
  font-family: var(--rc-font) !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  color: var(--rc-muted) !important;
  text-decoration: none !important;
  margin-top: 0.625rem !important;
  padding: 0.25rem 0 !important;
  border: none !important;
  background: none !important;
  cursor: pointer !important;
  transition: color 140ms !important;
}
.wc-block-cart-item__remove-link:hover { color: var(--rc-error) !important; }

/* Item row total (right cell) */
.wc-block-cart-item__total { display: table-cell !important; padding: 1rem 1rem 1rem 0.5rem !important; text-align: right !important; vertical-align: middle !important; }
.wc-block-cart-item__total .wc-block-components-product-price__value {
  font-family: var(--rc-font) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--rc-text) !important;
}

/* ── Cart sidebar ─────────────────────────────────────────────────────────── */
.wc-block-cart__sidebar {
  background: var(--rc-surface) !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: calc(var(--rc-radius) + 2px) !important;
  padding: 1.5rem !important;
  overflow: visible !important;
}
.wc-block-cart__totals-title {
  font-family: var(--rc-font) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
  color: var(--rc-text) !important;
  margin: 0 0 1.125rem !important;
  padding-bottom: 0.875rem !important;
  border-bottom: 1.5px solid var(--rc-border) !important;
}

/* Coupon panel */
.wc-block-components-totals-coupon.wc-block-components-panel {
  border: none !important;
  padding: 0 !important;
  background: none !important;
}
.wc-block-components-panel__button {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  background: none !important;
  border: none !important;
  border-bottom: 1px solid var(--rc-border) !important;
  padding: 0.625rem 0 0.75rem !important;
  font-family: var(--rc-font) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: var(--rc-muted) !important;
  cursor: pointer !important;
  transition: color 140ms !important;
  margin-bottom: 0.5rem !important;
}
.wc-block-components-panel__button:hover { color: var(--rc-primary) !important; }
.wc-block-components-panel__button-icon { width: 16px !important; height: 16px !important; color: inherit !important; }
/* Coupon input + button row — compact */
.wc-block-components-totals-coupon__form {
  display: flex !important;
  gap: 0.375rem !important;
  margin-bottom: 0.75rem !important;
  align-items: center !important;
}
.wc-block-components-totals-coupon__input { flex: 1 !important; }
/* Override any text-input wrapper height that bleeds in */
.wc-block-components-totals-coupon__input.wc-block-components-text-input,
.wc-block-components-totals-coupon .wc-block-components-text-input {
  margin-bottom: 0 !important;
}
.wc-block-components-totals-coupon__input input,
.wc-block-components-totals-coupon .wc-block-components-text-input input {
  width: 100% !important;
  height: 36px !important;
  padding: 0 0.75rem !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: var(--rc-radius-sm) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.8125rem !important;
  background: var(--rc-white) !important;
  color: var(--rc-text) !important;
  outline: none !important;
  transition: border-color 150ms !important;
  box-shadow: none !important;
}
.wc-block-components-totals-coupon__input input:focus,
.wc-block-components-totals-coupon .wc-block-components-text-input input:focus { border-color: var(--rc-primary) !important; }
/* Hide floating label inside coupon input */
.wc-block-components-totals-coupon .wc-block-components-text-input label { display: none !important; }
.wc-block-components-totals-coupon__button {
  height: 36px !important;
  padding: 0 0.875rem !important;
  background: var(--rc-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--rc-radius-sm) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: opacity 150ms !important;
  flex-shrink: 0 !important;
}
.wc-block-components-totals-coupon__button:hover { opacity: 0.82 !important; }

/* Totals rows — clean, borderless except footer */
.wc-block-components-totals-wrapper { padding: 0 !important; }
.wc-block-components-totals-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0.375rem 0 !important;
  border-bottom: none !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
}
.wc-block-components-totals-item__label {
  font-weight: 400 !important;
  color: var(--rc-muted) !important;
}
.wc-block-formatted-money-amount.wc-block-components-totals-item__value {
  font-weight: 600 !important;
  color: var(--rc-text) !important;
}
/* Grand total row */
.wc-block-components-totals-footer-item {
  border-top: 1.5px solid var(--rc-border) !important;
  border-bottom: none !important;
  padding: 0.875rem 0 0.5rem !important;
  margin-top: 0.25rem !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--rc-text) !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item-tax-value {
  font-size: 1.375rem !important;
  font-weight: 800 !important;
  color: var(--rc-text) !important;
  letter-spacing: -0.025em !important;
}

/* "Proceed to Checkout" button */
.wc-block-cart__submit-button,
a.wc-block-cart__submit-button,
.wc-block-cart__submit-container .wc-block-components-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 52px !important;
  background: var(--rc-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: opacity 160ms, box-shadow 160ms !important;
  box-shadow: 0 4px 18px rgba(var(--rc-primary-rgb), 0.28) !important;
  margin-top: 1.25rem !important;
}
.wc-block-cart__submit-button:hover,
a.wc-block-cart__submit-button:hover { opacity: 0.88 !important; box-shadow: 0 6px 24px rgba(var(--rc-primary-rgb), 0.4) !important; }
.wc-block-cart__submit-button .wc-block-components-button__text { font-weight: 700 !important; color: #fff !important; font-size: 1rem !important; }

/* Payment icons row below checkout button */
.wc-block-cart__payment-options {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 0.375rem !important;
  margin-top: 0.875rem !important;
  opacity: 0.5 !important;
}

/* Secure badge text */
.wc-block-components-totals-item__description {
  font-size: 0.8125rem !important;
  color: var(--rc-muted) !important;
}

/* ═══════════════════════════════════════════
   CHECKOUT BLOCK
   ═══════════════════════════════════════════ */

/* Counter-based step numbering — reset on the form container */
.wc-block-checkout__form {
  counter-reset: rc-checkout-step !important;
}

/* Step cards */
.wc-block-components-checkout-step {
  background: var(--rc-white) !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: calc(var(--rc-radius) + 2px) !important;
  padding: 1.5rem !important;
  margin-bottom: 0.75rem !important;
  position: relative !important;
  counter-increment: rc-checkout-step !important;
}
/* Connector line — spans gap between step cards */
.wc-block-components-checkout-step:not(:last-child)::after {
  content: '' !important;
  position: absolute !important;
  left: calc(1.5rem + 13px) !important;
  bottom: -0.875rem !important;
  width: 2px !important;
  height: 0.875rem !important;
  background: var(--rc-border) !important;
  z-index: 2 !important;
  border-radius: 1px !important;
}
.wc-block-components-checkout-step__heading-container {
  margin-bottom: 1.25rem !important;
  padding-bottom: 0.875rem !important;
  border-bottom: 1.5px solid var(--rc-border) !important;
}
/* Heading: flex row so ::before circle sits left of the title */
.wc-block-components-checkout-step__heading {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  flex-direction: row !important;
}
/* Step number circle via CSS counter — appears before the title */
.wc-block-components-checkout-step__heading::before {
  content: counter(rc-checkout-step) !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  background: var(--rc-primary) !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-family: var(--rc-font) !important;
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  text-align: center !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--rc-primary) 18%, transparent) !important;
  order: -1 !important;
}
/* Hide WC Blocks' own step indicator (empty span, managed by WC JS for checkmarks) */
.wc-block-components-checkout-step__heading-content {
  display: none !important;
}
.wc-block-components-checkout-step__title,
.wc-block-components-title {
  font-family: var(--rc-font) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  color: var(--rc-text) !important;
}

/* Text inputs (floating label style) */
.wc-block-components-text-input {
  position: relative !important;
  margin-bottom: 0.875rem !important;
}
.wc-block-components-text-input input {
  width: 100% !important;
  height: 52px !important;
  padding: 1.25rem 0.875rem 0.25rem !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  background: var(--rc-white) !important;
  color: var(--rc-text) !important;
  outline: none !important;
  transition: border-color 150ms, box-shadow 150ms !important;
  box-shadow: none !important;
}
.wc-block-components-text-input input:focus {
  border-color: var(--rc-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--rc-primary) 15%, transparent) !important;
}
.wc-block-components-text-input label {
  font-family: var(--rc-font) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  color: var(--rc-muted) !important;
  pointer-events: none !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-text-input input:focus ~ label { color: var(--rc-primary) !important; }

/* Country / state select */
.wc-blocks-components-select { margin-bottom: 0.875rem !important; }
.wc-blocks-components-select__select {
  width: 100% !important;
  height: 52px !important;
  padding: 1.125rem 2.5rem 0.25rem 0.875rem !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  background: var(--rc-white) !important;
  color: var(--rc-text) !important;
  outline: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  transition: border-color 150ms !important;
}
.wc-blocks-components-select__select:focus {
  border-color: var(--rc-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--rc-primary) 15%, transparent) !important;
}
.wc-blocks-components-select__label {
  font-family: var(--rc-font) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  color: var(--rc-muted) !important;
  position: absolute !important;
  top: 0.4375rem !important;
  left: 0.9375rem !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
.wc-blocks-components-select__container { position: relative !important; background: var(--rc-white) !important; border-radius: var(--rc-radius) !important; }
.wc-blocks-components-select__expand {
  position: absolute !important;
  right: 0.875rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
  color: var(--rc-muted) !important;
}

/* Address form — 2-column grid */
.wc-block-components-address-form {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 0.875rem !important;
}
.wc-block-components-address-form__email,
.wc-block-components-address-form__phone,
.wc-block-components-address-form__address_1,
.wc-block-components-address-form__address_2-toggle,
.wc-block-components-address-form__address_2-hidden-input,
.wc-block-components-address-form__country { grid-column: 1 / -1 !important; }
@media (max-width: 599px) {
  .wc-block-components-address-form { grid-template-columns: 1fr !important; }
  .wc-block-components-address-form > * { grid-column: 1 !important; }
}

/* Checkbox */
.wc-block-components-checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  cursor: pointer !important;
}
/* The LABEL is the real flex container; the SVG mark is position:absolute inside it.
   position:relative is mandatory so the SVG overlays the checkbox, not escapes it. */
.wc-block-components-checkbox label {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  cursor: pointer !important;
}
.wc-block-components-checkbox__input[type="checkbox"] {
  flex-shrink: 0 !important;
  position: static !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: 4px !important;
  cursor: pointer !important;
}
.wc-block-components-checkbox__input[type="checkbox"]:checked {
  border-color: var(--rc-primary) !important;
}
.wc-block-components-checkbox__mark {
  fill: var(--rc-primary) !important;
}
.wc-block-components-checkbox__label {
  font-family: var(--rc-font) !important;
  font-size: 0.875rem !important;
  color: var(--rc-text) !important;
  line-height: 1.5 !important;
}

/* "Add a note" toggle */
.wc-block-checkout__add-note {
  padding-top: 0.25rem !important;
}
.wc-block-checkout__add-note .wc-block-components-checkbox {
  margin-bottom: 0.75rem !important;
}
/* The real structure is: div > label > input + svg + span.
   Make the label the flex row so input and text sit side-by-side. */
.wc-block-checkout__add-note .wc-block-components-checkbox label {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 0.75rem !important;
  cursor: pointer !important;
}
.wc-block-checkout__add-note .wc-block-components-checkbox__input {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  top: auto !important;
  float: none !important;
}
.wc-block-checkout__add-note .wc-block-components-checkbox__label {
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--rc-text) !important;
}

/* Payment section — no payment notice */
.wc-block-checkout__no-payment-methods-notice.wc-block-components-notice-banner {
  background: #fef9c3 !important;
  border: 1.5px solid #f59e0b !important;
  border-radius: var(--rc-radius) !important;
  color: #854d0e !important;
  font-family: var(--rc-font) !important;
  font-size: 0.875rem !important;
  padding: 0.875rem 1rem !important;
}

/* Terms line */
.wc-block-checkout__terms {
  font-family: var(--rc-font) !important;
  font-size: 0.8125rem !important;
  color: var(--rc-muted) !important;
  line-height: 1.55 !important;
}
.wc-block-checkout__terms a { color: var(--rc-primary) !important; }
.wc-block-checkout__terms--with-separator {
  padding-top: 0.875rem !important;
  margin-top: 0.5rem !important;
  border-top: 1px solid var(--rc-border) !important;
}

/* Actions row: return link + place order */
.wc-block-checkout__actions_row {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.875rem !important;
  padding-top: 0.5rem !important;
}

/* "← Return to cart" — outline secondary button using accent color */
.wc-block-components-checkout-return-to-cart-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.375rem !important;
  height: 44px !important;
  padding: 0 1.25rem !important;
  background: transparent !important;
  border: 1.5px solid var(--rc-accent, var(--rc-border)) !important;
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: var(--rc-accent, var(--rc-muted)) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: background 140ms, color 140ms, border-color 140ms !important;
  width: 100% !important;
}
.wc-block-components-checkout-return-to-cart-button:hover {
  background: color-mix(in srgb, var(--rc-accent) 8%, transparent) !important;
  border-color: var(--rc-accent) !important;
  color: var(--rc-accent) !important;
}

/* "Place Order" button */
.wc-block-components-checkout-place-order-button,
button.wc-block-components-checkout-place-order-button {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 56px !important;
  background: var(--rc-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font) !important;
  font-size: 1.0625rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: opacity 160ms, box-shadow 160ms !important;
  box-shadow: 0 4px 20px rgba(var(--rc-primary-rgb), 0.32) !important;
}
.wc-block-components-checkout-place-order-button:hover {
  opacity: 0.88 !important;
  box-shadow: 0 8px 28px rgba(var(--rc-primary-rgb), 0.44) !important;
}
.wc-block-components-checkout-place-order-button .wc-block-components-button__text,
.wc-block-components-checkout-place-order-button__text {
  font-size: 1.0625rem !important;
  font-weight: 700 !important;
  color: #fff !important;
}

/* ── Checkout order summary sidebar ──────────────────────────────────────── */
/* WC Blocks uses --wc-block-checkout--sidebar-width internally; override it here */
.wc-block-checkout { --wc-block-checkout--sidebar-width: 420px !important; }
.wc-block-checkout__sidebar {
  width: 420px !important;
  min-width: 420px !important;
  background: var(--rc-surface) !important;
  border: 1.5px solid var(--rc-border) !important;
  border-radius: calc(var(--rc-radius) + 2px) !important;
  padding: 1.5rem !important;
  overflow: hidden !important;
}
/* On mobile the sidebar stacks below the form — let it fill the container width */
@media (max-width: 1023px) {
  .wc-block-checkout { --wc-block-checkout--sidebar-width: 100% !important; }
  .wc-block-checkout__sidebar {
    width: 100% !important;
    min-width: 0 !important;
  }
  /* On mobile, WC Blocks renders the order summary inline in the step flow (not in our
     padded sidebar card). The coupon link, coupon form, each totals row and the
     grand-total wrapper all sit at full checkout width with zero horizontal padding.
     Add a consistent inset that matches what the order-items list already uses (16px). */
  .wp-block-woocommerce-checkout-order-summary-coupon-form-block,
  .wp-block-woocommerce-checkout-order-summary-subtotal-block,
  .wp-block-woocommerce-checkout-order-summary-discount-block,
  .wp-block-woocommerce-checkout-order-summary-fee-block,
  .wp-block-woocommerce-checkout-order-summary-shipping-block,
  .wc-block-checkout .wc-block-components-totals-wrapper,
  .wc-block-checkout .wc-block-components-totals-coupon {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}
/* Strip inner WC panel borders — only the outer card border + title divider remain */
.wc-block-checkout__sidebar .wc-block-components-panel,
.wc-block-checkout__sidebar .wc-block-components-panel__content,
.wc-block-checkout__sidebar .wc-block-components-totals-coupon,
.wc-block-checkout__sidebar .wc-block-components-totals-wrapper,
.wc-block-checkout__sidebar .wc-block-order-summary-coupon,
.wc-block-checkout__sidebar .wc-block-components-checkout-order-summary,
.wc-block-checkout__sidebar .wc-block-components-checkout-order-summary > * {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}
/* Remove the panel toggle button's bottom border inside sidebar — no divider spam */
.wc-block-checkout__sidebar .wc-block-components-panel__button {
  border-bottom: none !important;
  padding-bottom: 0.375rem !important;
  margin-bottom: 0.25rem !important;
  color: var(--rc-muted) !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
}
/* Remove inter-item borders from order summary items */
.wc-block-checkout__sidebar .wc-block-components-order-summary-item,
.wc-block-checkout__sidebar .wc-block-components-totals-item {
  border-bottom: none !important;
  border-top: none !important;
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}
/* Single divider above grand total only */
.wc-block-checkout__sidebar .wc-block-components-totals-footer-item {
  border-top: 1.5px solid var(--rc-border) !important;
  border-bottom: none !important;
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}
/* Coupon row horizontal breathing room */
.wc-block-checkout__sidebar .wc-block-components-totals-coupon,
.wc-block-checkout__sidebar .wc-block-order-summary-coupon {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

/* "Order summary · Rs 249" title bar */
.wc-block-components-checkout-order-summary__title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  cursor: pointer !important;
  padding-bottom: 0.875rem !important;
  border-bottom: 1.5px solid var(--rc-border) !important;
  margin-bottom: 0.875rem !important;
}
.wc-block-components-checkout-order-summary__title-text {
  font-family: var(--rc-font) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  color: var(--rc-text) !important;
}
.wc-block-components-checkout-order-summary__title-price {
  font-family: var(--rc-font) !important;
  font-size: 1.125rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: var(--rc-text) !important;
}
.wc-block-components-checkout-order-summary__title-icon { display: none !important; }

/* Order summary items — no inter-item borders, just spacing */
.wc-block-components-order-summary-item {
  display: grid !important;
  grid-template-columns: 56px 1fr auto !important;
  gap: 0.625rem !important;
  align-items: center !important;
  padding: 0.5rem 0 !important;
  border-bottom: none !important;
}
.wc-block-components-order-summary-item__image { position: relative !important; }
.wc-block-components-order-summary-item__image img {
  width: 56px !important;
  height: 56px !important;
  object-fit: cover !important;
  border-radius: calc(var(--rc-radius) - 2px) !important;
  border: 1.5px solid var(--rc-border) !important;
  display: block !important;
}
/* Quantity badge on image — WC Blocks' own rule already positions this correctly
   with top:0;right:0;transform:translate(50%,-50%) (self-centers on the image
   corner regardless of size). This override used to also set top/right to a
   hardcoded -6px, which doesn't replace WC's transform — it stacks with it,
   pushing the badge further off-corner than either rule alone would. Only
   override branding (color/size/font) here, not position. */
.wc-block-components-order-summary-item__quantity {
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 0.25rem !important;
  background: var(--rc-primary) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-family: var(--rc-font) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}
.wc-block-components-order-summary-item__description .wc-block-components-product-name {
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: var(--rc-text) !important;
  text-decoration: none !important;
}
.wc-block-components-order-summary-item__total-price .wc-block-components-product-price__value {
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  color: var(--rc-text) !important;
}
.wc-block-components-order-summary-item__regular-individual-price {
  font-size: 0.75rem !important;
  color: var(--rc-muted) !important;
  text-decoration: line-through !important;
  opacity: 0.8 !important;
}
.wc-block-components-order-summary-item__individual-price {
  font-size: 0.8125rem !important;
  color: var(--rc-primary) !important;
  font-weight: 600 !important;
}
.wc-block-components-product-metadata__description {
  font-size: 0.75rem !important;
  color: var(--rc-muted) !important;
}

/* Coupon + totals in checkout sidebar */
.wc-block-checkout__sidebar .wc-block-components-totals-item { font-family: var(--rc-font) !important; }

/* ── Notices (errors, success) ───────────────────────────────────────────── */
.wc-block-components-notices .wc-block-components-notice-banner {
  border-radius: var(--rc-radius) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.875rem !important;
  border-width: 1.5px !important;
  margin-bottom: 1rem !important;
}
.wc-block-components-notice-banner.is-error {
  background: #fef2f2 !important;
  border-color: #fca5a5 !important;
  color: #991b1b !important;
}
.wc-block-components-notice-banner.is-success {
  background: #f0fdf4 !important;
  border-color: #86efac !important;
  color: #166534 !important;
}

/* ── Validation error styles ─────────────────────────────────────────────── */
.wc-block-components-validation-error {
  color: #dc2626 !important;
  font-family: var(--rc-font) !important;
  font-size: 0.8125rem !important;
  margin-top: 0.25rem !important;
}
.wc-block-components-text-input.has-error input {
  border-color: #dc2626 !important;
}

/* ── Express payment (PayPal, Google Pay, etc.) ───────────────────────────── */
.wc-block-components-express-payment {
  margin-bottom: 1.25rem !important;
}
.wc-block-components-express-payment__title-container {
  display: flex !important;
  align-items: center !important;
  gap: 0.625rem !important;
  margin-bottom: 0.75rem !important;
}
.wc-block-components-express-payment__title-container::before,
.wc-block-components-express-payment__title-container::after {
  content: '' !important;
  flex: 1 !important;
  height: 1px !important;
  background: var(--rc-border) !important;
}
.wc-block-components-express-payment__title {
  font-family: var(--rc-font) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: var(--rc-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  white-space: nowrap !important;
}
.wc-block-components-express-payment-continue-rule {
  display: flex !important;
  align-items: center !important;
  gap: 0.625rem !important;
  margin: 0.875rem 0 !important;
  font-family: var(--rc-font) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--rc-muted) !important;
}
.wc-block-components-express-payment-continue-rule::before,
.wc-block-components-express-payment-continue-rule::after {
  content: '' !important;
  flex: 1 !important;
  height: 1px !important;
  background: var(--rc-border) !important;
}
.wc-block-components-express-payment__event-buttons {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
}

/* ── Payment method radio options ────────────────────────────────────────── */
.wc-block-components-payment-options {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
}
.wc-block-components-payment-option {
  border: 1.5px solid var(--rc-border) !important;
  border-radius: var(--rc-radius) !important;
  overflow: hidden !important;
  transition: border-color 150ms, box-shadow 150ms !important;
  background: var(--rc-white) !important;
}
.wc-block-components-payment-option.is-active,
.wc-block-components-payment-option:has(input:checked) {
  border-color: var(--rc-primary) !important;
  box-shadow: 0 0 0 1px var(--rc-primary) !important;
}
.wc-block-components-payment-option__label-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  padding: 0.875rem 1rem !important;
  cursor: pointer !important;
}
.wc-block-components-payment-option input[type="radio"] {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  flex-shrink: 0 !important;
  accent-color: var(--rc-primary) !important;
  margin: 0 !important;
  cursor: pointer !important;
}
.wc-block-components-payment-method-label {
  font-family: var(--rc-font) !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  color: var(--rc-text) !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  flex: 1 !important;
  cursor: pointer !important;
}
.wc-block-components-payment-method-label__category {
  font-size: 0.8125rem !important;
  color: var(--rc-muted) !important;
  font-weight: 400 !important;
}
.wc-block-components-radio-control-accordion-content {
  padding: 0 1rem 0.875rem !important;
  border-top: 1px solid var(--rc-border) !important;
  font-family: var(--rc-font) !important;
  font-size: 0.875rem !important;
  color: var(--rc-muted) !important;
  line-height: 1.55 !important;
}

/* ── Place Order: loading state ───────────────────────────────────────────── */
.wc-block-components-checkout-place-order-button[disabled],
.wc-block-components-checkout-place-order-button.wc-block-components-button--loading {
  opacity: 0.72 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}
.wc-block-components-checkout-place-order-button .wc-block-components-spinner {
  /* WC core makes this element fill the button (top:0;left:0;width:100%;height:100%)
     and centers its own ::after ring inside that box. We replace the ring with a
     real bordered circle at a fixed size instead, so top:0;left:0 must be
     overridden here too — otherwise the small circle stays pinned to the
     button's top-left corner instead of sitting in the middle. */
  width: 18px !important;
  height: 18px !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) !important;
  border: 2.5px solid rgba(255, 255, 255, 0.3) !important;
  border-top-color: rgba(255, 255, 255, 0.9) !important;
  border-radius: 50% !important;
  animation: rc-spin 0.7s linear infinite !important;
  flex-shrink: 0 !important;
}

/* ── Trust strip below Place Order ───────────────────────────────────────── */
.wc-block-checkout__actions_row::after {
  content: 'Secure & Encrypted Checkout' !important;
  display: block !important;
  text-align: center !important;
  font-family: var(--rc-font) !important;
  font-size: 0.75rem !important;
  color: var(--rc-muted) !important;
  margin-top: 0.375rem !important;
  opacity: 0.8 !important;
  letter-spacing: 0.02em !important;
}

/* ── Product reviews ──────────────────────────────────────────────────────── */

/* Un-hide star ratings inside reviews (overrides the global loop hide rule) */
#rc-reviews .star-rating,
.woocommerce-product-rating .star-rating { display: inline-block !important; }

/* Star rating track */
.star-rating {
  overflow: hidden;
  position: relative;
  height: 1em;
  line-height: 1;
  font-size: 1em;
  width: 5.4em;
  font-family: "star";
  color: var(--rc-primary);
}
.star-rating::before {
  content: "\73\73\73\73\73";
  opacity: 0.25;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
}
.star-rating span { overflow: hidden; float: left; top: 0; left: 0; position: absolute; padding-top: 1.5em; }
.star-rating span::before {
  content: "\53\53\53\53\53";
  top: 0;
  position: absolute;
  left: 0;
}

/* Product rating row (above add-to-cart) */
.woocommerce-product-rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.woocommerce-review-link {
  font-size: 0.875rem;
  color: var(--rc-muted);
  text-decoration: none;
}
.woocommerce-review-link:hover { color: var(--rc-text); text-decoration: underline; }

/* Reviews list */
#rc-reviews .commentlist.reviews {
  list-style: none;
  margin: 0 0 2rem;
  padding: 0;
}
#rc-reviews .commentlist.reviews .review {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--rc-border);
}
#rc-reviews .commentlist.reviews .review:last-child { border-bottom: none; }

/* Gravatar */
#rc-reviews .comment_container .avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--rc-border);
  flex-shrink: 0;
}

/* Comment text column */
#rc-reviews .comment-text { min-width: 0; }

/* Rating inside each review */
#rc-reviews .comment-text .star-rating { margin-bottom: 0.375rem; }

/* Reviewer meta */
#rc-reviews .comment-text .meta {
  margin: 0 0 0.5rem;
  font-size: 0.875rem;
  color: var(--rc-muted);
}
#rc-reviews .woocommerce-review__author {
  font-weight: 700;
  color: var(--rc-text);
  font-size: 0.9375rem;
}
#rc-reviews .woocommerce-review__verified {
  font-size: 0.8125rem;
  color: var(--rc-success-dark);
  font-style: normal;
}
#rc-reviews .woocommerce-review__dash { margin: 0 0.25rem; }
#rc-reviews .woocommerce-review__published-date { font-size: 0.8125rem; }

/* Review body text */
#rc-reviews .comment-text .description {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--rc-text);
  margin: 0;
}
#rc-reviews .comment-text .description p:last-child { margin-bottom: 0; }

/* "No reviews yet" message */
#rc-reviews .woocommerce-noreviews {
  color: var(--rc-muted);
  font-size: 0.9375rem;
  padding: 1.5rem 0;
}

/* Review count heading */
#rc-reviews #reviews > h2,
#rc-reviews .woocommerce-Reviews-title {
  font-size: 1.1rem;
  font-weight: 700;
  margin: 0 0 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--rc-border);
}

/* Review form */
#rc-reviews #review_form_wrapper { margin-top: 2rem; }
#rc-reviews #review_form_wrapper h3,
#rc-reviews .comment-reply-title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 1rem;
}
#rc-reviews .comment-form label {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 0.375rem;
  color: var(--rc-muted);
}
#rc-reviews .comment-form input[type="text"],
#rc-reviews .comment-form input[type="email"],
#rc-reviews .comment-form textarea {
  display: block;
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  background: var(--rc-white);
  color: var(--rc-text);
  outline: none;
  transition: border-color 150ms;
  box-sizing: border-box;
}
#rc-reviews .comment-form input:focus,
#rc-reviews .comment-form textarea:focus { border-color: var(--rc-primary); }
#rc-reviews .comment-form textarea { min-height: 120px; resize: vertical; }
#rc-reviews .comment-form .form-submit { margin-top: 1rem; }
#rc-reviews .comment-form .submit {
  display: inline-flex;
  align-items: center;
  height: 44px;
  padding: 0 1.5rem;
  background: var(--rc-primary);
  color: var(--rc-btn-text);
  border: none;
  border-radius: var(--rc-radius);
  font-family: var(--rc-font);
  font-size: 0.9375rem;
  font-weight: 700;
  cursor: pointer;
  transition: opacity 150ms;
}
#rc-reviews .comment-form .submit:hover { opacity: 0.85; }

/* Star picker in review form */
#rc-reviews .comment-form-rating { margin-bottom: 1rem; }
#rc-reviews .comment-form-rating .stars { display: flex; gap: 0.25rem; margin-top: 0.375rem; }
#rc-reviews .comment-form-rating .stars a {
  font-size: 1.25rem;
  text-decoration: none;
  color: var(--rc-muted);
  transition: color 120ms;
}
#rc-reviews .comment-form-rating .stars a:hover,
#rc-reviews .comment-form-rating .stars a.active,
#rc-reviews .comment-form-rating .stars.selected a { color: var(--rc-primary); }

/* Rating <select> fallback — shown when JS star init fails */
#rc-reviews .comment-form-rating select#rating {
  display: block;
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1.5px solid var(--rc-border);
  border-radius: var(--rc-radius);
  background: var(--rc-white);
  color: var(--rc-text);
  font: inherit;
  font-size: 0.9375rem;
  outline: none;
  cursor: pointer;
}

/* Cookies consent checkbox row */
#rc-reviews .comment-form-cookies-consent {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 1rem;
  font-size: 0.875rem;
  color: var(--rc-muted);
}
#rc-reviews .comment-form-cookies-consent input[type="checkbox"] {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  margin-top: 0.175rem;
  accent-color: var(--rc-primary);
  cursor: pointer;
}
#rc-reviews .comment-form-cookies-consent label {
  display: inline;
  font-weight: 400;
  font-size: 0.875rem;
  color: var(--rc-muted);
  margin: 0;
  cursor: pointer;
}

/* Comment form two-col layout */
@media (min-width: 600px) {
  #rc-reviews .comment-form .comment-form-author,
  #rc-reviews .comment-form .comment-form-email {
    display: inline-block;
    width: calc(50% - 0.5rem);
    vertical-align: top;
    margin-right: 0.5rem;
  }
  #rc-reviews .comment-form .comment-form-email { margin-right: 0; }
}

/* ── Wishlist page layout ─────────────────────────────────────────────────── */
.rc-wishlist-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 2.5rem;
  padding: 3rem 0 5rem;
  align-items: start;
}
@media (max-width: 767px) {
  .rc-wishlist-layout { grid-template-columns: 1fr; gap: 1.5rem; padding: 1.5rem 0 3rem; }
}
.rc-wishlist-sidebar { position: sticky; top: 100px; }
@media (max-width: 767px) { .rc-wishlist-sidebar { position: static; } }
.rc-wishlist-content { min-width: 0; }

/* ── Native Wishlist Button (card hover action) ───────────────────────────── */
.rc-card__wishlist-btn svg { transition: fill 200ms, stroke 200ms; }
.rc-card__wishlist-btn--active svg,
.rc-card__wishlist-btn:hover svg {
  fill: var(--rc-error, #ef4444);
  stroke: var(--rc-error, #ef4444);
}

/* ── PDP / QV Wishlist Icon Button ──────────────────────────────────────── */
.rc-single__wishlist-icon-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: none;
  border: 1.5px solid var(--rc-border);
  border-radius: 50%;
  color: var(--rc-muted);
  cursor: pointer;
  transition: border-color 200ms, color 200ms, background 200ms;
  position: relative;
}
.rc-single__wishlist-icon-btn svg { transition: fill 200ms, stroke 200ms; }
.rc-single__wishlist-icon-btn:hover,
.rc-single__wishlist-icon-btn--active {
  border-color: var(--rc-error, #ef4444);
  color: var(--rc-error, #ef4444);
  background: #fef2f2;
}
.rc-single__wishlist-icon-btn--active svg,
.rc-single__wishlist-icon-btn:hover svg {
  fill: var(--rc-error, #ef4444);
  stroke: var(--rc-error, #ef4444);
}
/* Tooltip */
.rc-single__wishlist-icon-btn::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 7px);
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 8px;
  background: rgba(0,0,0,0.82);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 500;
  border-radius: 5px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 150ms;
}
.rc-single__wishlist-icon-btn:hover::after { opacity: 1; }

/* ── ATC attention animation ─────────────────────────────────────────────── */
@keyframes rc-atc-attention {
  0%, 88%, 100% { transform: translateX(0) rotate(0deg); }
  90%  { transform: translateX(-3px) rotate(-1deg); }
  92%  { transform: translateX(3px)  rotate(1deg);  }
  94%  { transform: translateX(-3px) rotate(-1deg); }
  96%  { transform: translateX(3px)  rotate(1deg);  }
  98%  { transform: translateX(-1px) rotate(0deg);  }
}
@media (prefers-reduced-motion: no-preference) {
  .rc-btn--attention {
    animation: rc-atc-attention 4s ease-in-out 1.5s infinite;
  }
}

/* ── Wishlist Page ────────────────────────────────────────────────────────── */
.rc-wishlist-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 0 0 1.75rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--rc-border);
}
.rc-wishlist-header__info { display: flex; flex-direction: column; gap: 0.25rem; }
.rc-wishlist-header__actions { display: flex; align-items: center; gap: 0.625rem; flex-shrink: 0; }
.rc-wishlist-count { margin: 0; font-size: 1.0625rem; color: var(--rc-text); font-weight: 700; }
.rc-wishlist-count strong { color: var(--rc-brand); }
.rc-wishlist-subtitle { margin: 0; font-size: 0.875rem; color: var(--rc-muted); }
.rc-wishlist-shop-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.875rem;
  border: 1px solid var(--rc-border);
  border-radius: var(--rc-radius);
  font-size: 0.8125rem;
  font-family: var(--rc-font);
  color: var(--rc-text);
  text-decoration: none;
  line-height: 1;
  transition: border-color 150ms, color 150ms, background 150ms;
}
.rc-wishlist-shop-link:hover { border-color: var(--rc-brand); color: var(--rc-brand); background: rgba(0,0,0,0.03); text-decoration: none; }
.rc-wishlist-clear-all {
  background: none;
  border: 1px solid var(--rc-border);
  color: var(--rc-muted);
  padding: 0.375rem 0.875rem;
  border-radius: var(--rc-radius);
  font-size: 0.8125rem;
  font-family: var(--rc-font);
  cursor: pointer;
  transition: border-color 150ms, color 150ms;
  line-height: 1;
}
.rc-wishlist-clear-all:hover { border-color: var(--rc-error, #ef4444); color: var(--rc-error, #ef4444); }
.rc-wishlist-discover {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--rc-border);
  text-align: center;
}
.rc-wishlist-discover__text { margin: 0 0 1rem; font-size: 1rem; color: var(--rc-muted); }
@media (max-width: 767px) {
  .rc-wishlist-header { align-items: flex-start; }
  .rc-wishlist-header__actions { flex-wrap: wrap; }
}

/* Empty & guest states */
.rc-wishlist-empty,
.rc-wishlist-guest {
  text-align: center;
  padding: 4rem 1rem 5rem;
  color: var(--rc-muted);
}
.rc-wishlist-empty__icon,
.rc-wishlist-guest__icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 1.25rem;
  background: var(--rc-surface);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rc-muted);
}
.rc-wishlist-empty__title,
.rc-wishlist-guest__title {
  font-size: 1.375rem;
  font-weight: 800;
  color: var(--rc-text);
  margin: 0 0 0.5rem;
}
.rc-wishlist-empty__text,
.rc-wishlist-guest__text {
  margin: 0 0 1.5rem;
  font-size: 0.9375rem;
  max-width: 28rem;
  margin-left: auto;
  margin-right: auto;
}

/* ─── MIDNIGHT PALETTE OVERRIDES ──────────────────────────────────────────── */

/* Glass header: btn-icon and menu-pill use white on light themes intentionally,
   but on midnight the dark page bg makes white pills invisible. Override to
   surface-tinted dark. */
[data-rc-variant="midnight"] .rc-header--glass .rc-btn-icon,
[data-rc-variant="midnight"] .rc-header--glass .rc-menu-pill,
[data-rc-variant="midnight"] .rc-header--glass.rc-header--scrolled .rc-btn-icon,
[data-rc-variant="midnight"] .rc-header--glass.rc-header--scrolled .rc-menu-pill {
  background: color-mix(in srgb, var(--rc-surface) 92%, var(--rc-text));
  color: var(--rc-text);
}
[data-rc-variant="midnight"] .rc-header--glass .rc-btn-icon:hover,
[data-rc-variant="midnight"] .rc-header--glass .rc-menu-pill:hover,
[data-rc-variant="midnight"] .rc-header--glass.rc-header--scrolled .rc-btn-icon:hover,
[data-rc-variant="midnight"] .rc-header--glass.rc-header--scrolled .rc-menu-pill:hover {
  background: color-mix(in srgb, var(--rc-surface) 82%, var(--rc-text));
}

/* Blog post glass panel: inset white glow looks wrong on dark surface */
[data-rc-variant="midnight"] .rc-post-glass {
  box-shadow: 0 -4px 48px rgba(0,0,0,0.48), 0 0 0 1px rgba(255,255,255,0.04) inset;
}

/* Nav flyout glass-nav text must be readable on dark surface */
[data-rc-variant="midnight"] .rc-nav-flyout__glass-nav .rc-nav-flyout__list > li > a {
  color: var(--rc-text);
}

/* Midnight: hero inline color:#111827 override + auth form checkbox */
[data-rc-variant="midnight"] .rc-hero { color: var(--rc-text) !important; }

/* Auth drawer checkbox — native element needs accent-color in midnight */
[data-rc-variant="midnight"] .rc-drawer__body #loginform input[type="checkbox"] {
  accent-color: var(--rc-primary);
}

/* ═══════════════════════════════════════════════════════════════════════════
   29. VARIATION SWATCHES
   BEM: .rc-swatches (group) › .rc-swatches__list › .rc-swatch (item)
   All sizing and color tokens come from --rc-swatch-* CSS vars
   (output in performance.php › rc_output_css_vars).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Group wrapper ──────────────────────────────────────────────────────── */
.rc-swatches {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-block: 10px;
}

.rc-swatches--archive {
  margin-block: 6px 0;
}

/* ── Header row (label + current value) ────────────────────────────────── */
.rc-swatches__header {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-size: 0.8125rem;
  line-height: 1.4;
}

.rc-swatches__label {
  font-weight: 600;
  color: var(--rc-text);
  text-transform: capitalize;
}

.rc-swatches__value {
  color: var(--rc-muted, var(--rc-text));
  opacity: 0.72;
  font-weight: 400;
  min-height: 1em;
}

/* ── Swatch list ────────────────────────────────────────────────────────── */
.rc-swatches__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rc-swatch-gap);
  align-items: center;
}

/* ── Base swatch ────────────────────────────────────────────────────────── */
.rc-swatch {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: var(--rc-swatch-unsel-width) solid var(--rc-swatch-unsel-border);
  border-radius: 4px;
  padding: 0;
  background: transparent;
  transition: border-color 0.15s ease, outline-color 0.15s ease, opacity 0.15s ease, transform 0.1s ease;
  outline: 0 solid transparent;
  outline-offset: var(--rc-swatch-border-offset);
  flex-shrink: 0;
  vertical-align: middle;
}

.rc-swatch:focus-visible {
  outline: 2px solid var(--rc-primary);
  outline-offset: 2px;
}

/* ── Size tiers (color & image) ─────────────────────────────────────────── */
/* Image swatches — per-type vars override the tier; fallback = tier size */
.rc-swatch--image,
.rc-swatches--size-md .rc-swatch--image {
  width:  var(--rc-swatch-img-w, var(--rc-swatch-size-md));
  height: var(--rc-swatch-img-h, var(--rc-swatch-size-md));
}
.rc-swatches--size-xs .rc-swatch--image {
  width:  var(--rc-swatch-img-w, var(--rc-swatch-size-xs));
  height: var(--rc-swatch-img-h, var(--rc-swatch-size-xs));
}
.rc-swatches--size-sm .rc-swatch--image {
  width:  var(--rc-swatch-img-w, var(--rc-swatch-size-sm));
  height: var(--rc-swatch-img-h, var(--rc-swatch-size-sm));
}
.rc-swatches--size-lg .rc-swatch--image {
  width:  var(--rc-swatch-img-w, var(--rc-swatch-size-lg));
  height: var(--rc-swatch-img-h, var(--rc-swatch-size-lg));
}
.rc-swatches--size-xl .rc-swatch--image {
  width:  var(--rc-swatch-img-w, var(--rc-swatch-size-xl));
  height: var(--rc-swatch-img-h, var(--rc-swatch-size-xl));
}

/* Color swatches — per-type vars override the tier; fallback = tier size */
.rc-swatch--color,
.rc-swatches--size-md .rc-swatch--color {
  width:  var(--rc-swatch-color-w, var(--rc-swatch-size-md));
  height: var(--rc-swatch-color-h, var(--rc-swatch-size-md));
}
.rc-swatches--size-xs .rc-swatch--color {
  width:  var(--rc-swatch-color-w, var(--rc-swatch-size-xs));
  height: var(--rc-swatch-color-h, var(--rc-swatch-size-xs));
}
.rc-swatches--size-sm .rc-swatch--color {
  width:  var(--rc-swatch-color-w, var(--rc-swatch-size-sm));
  height: var(--rc-swatch-color-h, var(--rc-swatch-size-sm));
}
.rc-swatches--size-lg .rc-swatch--color {
  width:  var(--rc-swatch-color-w, var(--rc-swatch-size-lg));
  height: var(--rc-swatch-color-h, var(--rc-swatch-size-lg));
}
.rc-swatches--size-xl .rc-swatch--color {
  width:  var(--rc-swatch-color-w, var(--rc-swatch-size-xl));
  height: var(--rc-swatch-color-h, var(--rc-swatch-size-xl));
}

/* Text swatches — optional font-size override from Customizer */
.rc-swatch--label,
.rc-swatch--button,
.rc-swatch--radio {
  font-size: var(--rc-swatch-text-size, 0.8125rem);
}

/* ── Shape modifiers ────────────────────────────────────────────────────── */
.rc-swatch--color.rc-swatch--circle,
.rc-swatch--image.rc-swatch--circle {
  border-radius: 50%;
}
.rc-swatch--color.rc-swatch--rounded,
.rc-swatch--image.rc-swatch--rounded {
  border-radius: 4px;
}
.rc-swatch--color.rc-swatch--square,
.rc-swatch--image.rc-swatch--square {
  border-radius: 0;
}

/* Text swatch shapes: circle = pill, rounded = 6px soft, square = sharp */
.rc-swatch--label.rc-swatch--circle,
.rc-swatch--button.rc-swatch--circle,
.rc-swatch--radio.rc-swatch--circle,
.rc-swatch--checkbox.rc-swatch--circle { border-radius: 999px; }

.rc-swatch--label.rc-swatch--rounded,
.rc-swatch--button.rc-swatch--rounded,
.rc-swatch--radio.rc-swatch--rounded,
.rc-swatch--checkbox.rc-swatch--rounded { border-radius: 6px; }

.rc-swatch--label.rc-swatch--square,
.rc-swatch--button.rc-swatch--square,
.rc-swatch--radio.rc-swatch--square,
.rc-swatch--checkbox.rc-swatch--square { border-radius: 2px; }

/* ── Color swatch ───────────────────────────────────────────────────────── */
.rc-swatch--color {
  overflow: hidden;
}

.rc-swatch__inner {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

/* Diagonal split divider for dual-tone swatches */
.rc-swatch__split {
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}
.rc-swatch__split::after {
  content: '';
  position: absolute;
  top: -50%;
  left: 50%;
  width: 200%;
  height: 200%;
  background: transparent;
  border-left: 1px solid rgba(0,0,0,0.12);
  transform: rotate(-45deg) translateX(-50%);
  transform-origin: 0 50%;
}

/* ── Image swatch ───────────────────────────────────────────────────────── */
.rc-swatch--image {
  overflow: hidden;
}

.rc-swatch__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

/* ── Text-based swatches (label, button, radio, checkbox) ───────────────── */
.rc-swatch--label,
.rc-swatch--button,
.rc-swatch--radio,
.rc-swatch--checkbox {
  width: auto; /* reset any cascaded fixed width so content can size the chip */
  height: var(--rc-swatch-size);
  min-width: var(--rc-swatch-size);
  padding-inline: 12px;
  font-size: var(--rc-swatch-label-size);
  font-weight: var(--rc-swatch-label-weight);
  letter-spacing: var(--rc-swatch-label-tracking);
  text-transform: var(--rc-swatch-label-transform);
  color: var(--rc-text);
  white-space: nowrap;
}

.rc-swatches--size-xs .rc-swatch--label,
.rc-swatches--size-xs .rc-swatch--button,
.rc-swatches--size-xs .rc-swatch--radio,
.rc-swatches--size-xs .rc-swatch--checkbox {
  height: var(--rc-swatch-size-xs);
  min-width: var(--rc-swatch-size-xs);
  padding-inline: 8px;
}

.rc-swatches--size-sm .rc-swatch--label,
.rc-swatches--size-sm .rc-swatch--button,
.rc-swatches--size-sm .rc-swatch--radio,
.rc-swatches--size-sm .rc-swatch--checkbox {
  height: var(--rc-swatch-size-sm);
  min-width: var(--rc-swatch-size-sm);
  padding-inline: 10px;
}

.rc-swatches--size-lg .rc-swatch--label,
.rc-swatches--size-lg .rc-swatch--button,
.rc-swatches--size-lg .rc-swatch--radio,
.rc-swatches--size-lg .rc-swatch--checkbox {
  height: var(--rc-swatch-size-lg);
  min-width: var(--rc-swatch-size-lg);
  padding-inline: 14px;
}

.rc-swatches--size-xl .rc-swatch--label,
.rc-swatches--size-xl .rc-swatch--button,
.rc-swatches--size-xl .rc-swatch--radio,
.rc-swatches--size-xl .rc-swatch--checkbox {
  height: var(--rc-swatch-size-xl);
  min-width: var(--rc-swatch-size-xl);
  padding-inline: 16px;
}

.rc-swatch__text {
  pointer-events: none;
  line-height: 1;
}

/* ── Per-type visual differentiation ────────────────────────────────────── */

/* Label — frosted chip: barely-visible tint at rest, primary border + tint on hover/selected */
.rc-swatch--label {
  background: color-mix(in srgb, var(--rc-primary) 5%, transparent);
  border-color: transparent;
  color: var(--rc-muted);
  font-weight: 400;
}
.rc-swatch--label:hover {
  background: color-mix(in srgb, var(--rc-primary) 11%, transparent);
  border-color: color-mix(in srgb, var(--rc-primary) 45%, transparent);
  color: var(--rc-text);
  text-decoration: none;
}
.rc-swatch--label.rc-swatch--selected {
  background: color-mix(in srgb, var(--rc-primary) 14%, transparent);
  border-color: var(--rc-primary);
  color: var(--rc-primary);
  font-weight: 600;
  text-decoration: none;
  outline: none;
}

/* Button — bordered chip (default for most text swatches) */
/* Uses global .rc-swatch border + .rc-swatch--selected solid fill already set */
.rc-swatch--button {
  font-weight: 500;
}

/* Radio: circle indicator */
.rc-swatch--radio::before {
  content: '';
  display: inline-block;
  width: 0.875em;
  height: 0.875em;
  border-radius: 50%;
  border: 1.5px solid var(--rc-swatch-unsel-border);
  margin-inline-end: 5px;
  flex-shrink: 0;
  transition: background 0.15s ease, border-color 0.15s ease;
  vertical-align: -0.125em;
}
.rc-swatch--radio.rc-swatch--selected::before {
  background: var(--rc-swatch-border-color);
  border-color: var(--rc-swatch-border-color);
}

/* Checkbox: square indicator */
.rc-swatch--checkbox::before {
  content: '';
  display: inline-block;
  width: 0.875em;
  height: 0.875em;
  border-radius: 2px;
  border: 1.5px solid var(--rc-swatch-unsel-border);
  margin-inline-end: 5px;
  flex-shrink: 0;
  transition: background 0.15s ease, border-color 0.15s ease;
  vertical-align: -0.125em;
  background-image: none;
}
.rc-swatch--checkbox.rc-swatch--selected::before {
  background: var(--rc-swatch-border-color);
  border-color: var(--rc-swatch-border-color);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpolyline points='1,5 4.5,8.5 11,1' stroke='%23fff' stroke-width='1.75' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 70%;
  background-repeat: no-repeat;
  background-position: center;
}

/* ── Hover ──────────────────────────────────────────────────────────────── */
.rc-swatch:hover {
  border-color: var(--rc-swatch-hover-border);
  transform: scale(1.06);
  z-index: 1;
}

.rc-swatch--label:hover,
.rc-swatch--button:hover,
.rc-swatch--radio:hover,
.rc-swatch--checkbox:hover {
  transform: none;
}

/* ── Selected state ─────────────────────────────────────────────────────── */
.rc-swatch--selected {
  border-color: var(--rc-swatch-border-color) !important;
  border-width: var(--rc-swatch-border-width) !important;
  outline: var(--rc-swatch-border-width) solid var(--rc-swatch-border-color);
  outline-offset: var(--rc-swatch-border-offset);
}

.rc-swatch--selected:hover {
  transform: none;
}

.rc-swatch--label.rc-swatch--selected,
.rc-swatch--button.rc-swatch--selected,
.rc-swatch--radio.rc-swatch--selected,
.rc-swatch--checkbox.rc-swatch--selected {
  border-color: var(--rc-swatch-border-color) !important;
  background: color-mix(in srgb, var(--rc-swatch-border-color) 8%, transparent);
  outline: none;
}

/* ── Out-of-stock states ────────────────────────────────────────────────── */
.rc-swatch--unavailable {
  opacity: var(--rc-swatch-oos-opacity);
  cursor: not-allowed;
}

.rc-swatch--unavailable:hover {
  border-color: var(--rc-swatch-unsel-border);
  transform: none;
}

/* Cross overlay */
.rc-swatch__cross {
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  overflow: hidden;
}

.rc-swatch__cross::before,
.rc-swatch__cross::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 141.4%;
  height: var(--rc-swatch-cross-width);
  background: var(--rc-swatch-cross-color);
  transform-origin: center;
}

.rc-swatch__cross::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.rc-swatch__cross::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* Single diagonal (oos_cross_style = 'single') */
.rc-swatch__cross--single::after {
  display: none;
}

/* Strikethrough (text types) */
.rc-swatch--unavailable.rc-swatch--label .rc-swatch__text,
.rc-swatch--unavailable.rc-swatch--button .rc-swatch__text,
.rc-swatch--unavailable.rc-swatch--radio .rc-swatch__text,
.rc-swatch--unavailable.rc-swatch--checkbox .rc-swatch__text {
  text-decoration: line-through;
  text-decoration-color: var(--rc-swatch-cross-color);
}

/* ── Tooltip ────────────────────────────────────────────────────────────── */
.rc-swatch__tooltip {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background: var(--rc-swatch-tooltip-bg);
  color: var(--rc-swatch-tooltip-color);
  font-size: var(--rc-swatch-tooltip-size);
  font-weight: 500;
  line-height: 1.2;
  padding: 3px 8px;
  border-radius: var(--rc-swatch-tooltip-radius);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease, transform 0.15s ease;
  z-index: 10;
}

.rc-swatch__tooltip--top {
  bottom: calc(100% + 6px);
}

.rc-swatch__tooltip--bottom {
  top: calc(100% + 6px);
}

/* Tooltip arrow */
.rc-swatch__tooltip--top::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: var(--rc-swatch-tooltip-bg);
}

.rc-swatch__tooltip--bottom::after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-bottom-color: var(--rc-swatch-tooltip-bg);
}

.rc-swatch:hover .rc-swatch__tooltip {
  opacity: 1;
  transform: translateX(-50%) translateY(-2px);
}

.rc-swatch__tooltip--bottom {
  transform: translateX(-50%);
}

.rc-swatch:hover .rc-swatch__tooltip--bottom {
  transform: translateX(-50%) translateY(2px);
}

/* ── Dropdown swatch type ───────────────────────────────────────────────── */
.rc-swatch-dropdown {
  position: relative;
  display: inline-block;
  min-width: 160px;
}

.rc-swatch-dropdown__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  height: var(--rc-swatch-size);
  padding-inline: 12px;
  background: var(--rc-surface, var(--rc-white));
  border: 1px solid var(--rc-border);
  border-radius: 6px;
  font-size: var(--rc-swatch-label-size);
  color: var(--rc-text);
  cursor: pointer;
  transition: border-color 0.15s ease;
}

.rc-swatch-dropdown__trigger:hover,
.rc-swatch-dropdown__trigger[aria-expanded="true"] {
  border-color: var(--rc-primary);
}

.rc-swatch-dropdown__selected {
  flex: 1;
  text-align: start;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rc-swatch-dropdown__arrow {
  flex-shrink: 0;
  font-size: 1.1em;
  transition: transform 0.15s ease;
  line-height: 1;
}

.rc-swatch-dropdown__trigger[aria-expanded="true"] .rc-swatch-dropdown__arrow {
  transform: rotate(90deg);
}

.rc-swatch-dropdown__panel {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: var(--rc-white);
  border: 1px solid var(--rc-border);
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  z-index: 100;
  overflow: hidden;
  max-height: 260px;
  overflow-y: auto;
}

.rc-swatch-dropdown__option {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 9px 14px;
  font-size: var(--rc-swatch-label-size);
  color: var(--rc-text);
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: start;
  transition: background 0.1s ease;
}

.rc-swatch-dropdown__option:hover {
  background: color-mix(in srgb, var(--rc-primary) 8%, transparent);
}

.rc-swatch-dropdown__option--unavailable {
  opacity: var(--rc-swatch-oos-opacity);
  text-decoration: line-through;
  cursor: not-allowed;
}

.rc-swatch-dropdown__opt-label {
  pointer-events: none;
}

/* ── Archive context ────────────────────────────────────────────────────── */
.rc-swatches--archive .rc-swatches__list {
  gap: 5px;
}

.rc-swatches--archive .rc-swatch--color,
.rc-swatches--archive .rc-swatch--image {
  width: var(--rc-swatch-size-sm);
  height: var(--rc-swatch-size-sm);
}

.rc-swatches--archive .rc-swatch--label,
.rc-swatches--archive .rc-swatch--button,
.rc-swatches--archive .rc-swatch--radio,
.rc-swatches--archive .rc-swatch--checkbox {
  height: var(--rc-swatch-size-xs);
  min-width: var(--rc-swatch-size-xs);
  padding-inline: 7px;
  font-size: 0.6875rem;
}

/* Overflow badge (+N) */
.rc-swatches__overflow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--rc-swatch-size-sm);
  min-width: var(--rc-swatch-size-sm);
  padding-inline: 5px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--rc-text) 8%, transparent);
  color: var(--rc-text);
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1;
}

.rc-swatches__overflow--dots {
  letter-spacing: 0.05em;
  font-size: 1em;
  line-height: 1;
  background: transparent;
}

/* ── Style presets ──────────────────────────────────────────────────────── */

/* Shopify-style: color/image = circles, text chips = clean rectangles, ring on select */
[data-swatch-preset="shopify"] .rc-swatch--color,
[data-swatch-preset="shopify"] .rc-swatch--image {
  border-radius: 50%;
  border-width: 1px;
}
[data-swatch-preset="shopify"] .rc-swatch--label,
[data-swatch-preset="shopify"] .rc-swatch--button,
[data-swatch-preset="shopify"] .rc-swatch--radio,
[data-swatch-preset="shopify"] .rc-swatch--checkbox {
  border-radius: 4px;
  border-width: 1px;
}
[data-swatch-preset="shopify"] .rc-swatch--selected {
  outline: 2px solid var(--rc-primary);
  outline-offset: 2px;
}
[data-swatch-preset="shopify"] .rc-swatch--label.rc-swatch--selected,
[data-swatch-preset="shopify"] .rc-swatch--button.rc-swatch--selected,
[data-swatch-preset="shopify"] .rc-swatch--radio.rc-swatch--selected,
[data-swatch-preset="shopify"] .rc-swatch--checkbox.rc-swatch--selected {
  background: var(--rc-primary);
  color: var(--rc-white);
  border-color: var(--rc-primary) !important;
  outline: none;
}

/* Minimal: square, no border, faint bg on text types */
[data-swatch-preset="minimal"] .rc-swatch--color,
[data-swatch-preset="minimal"] .rc-swatch--image {
  border-radius: 0;
  border-width: 1px;
  border-color: transparent;
}
[data-swatch-preset="minimal"] .rc-swatch--label,
[data-swatch-preset="minimal"] .rc-swatch--button {
  border: none;
  background: color-mix(in srgb, var(--rc-text) 6%, transparent);
  border-radius: 2px;
}
[data-swatch-preset="minimal"] .rc-swatch--selected {
  outline: none;
  border: none !important;
  background: var(--rc-primary) !important;
  color: var(--rc-white) !important;
}

/* Bold: large rounded, heavy selected ring */
[data-swatch-preset="bold"] .rc-swatch--color,
[data-swatch-preset="bold"] .rc-swatch--image {
  border-radius: 6px;
  width: var(--rc-swatch-size-lg);
  height: var(--rc-swatch-size-lg);
}
[data-swatch-preset="bold"] .rc-swatch--selected {
  outline-width: 3px;
  outline-offset: 3px;
}

/* Hyva-style: pill/rounded text, no border, strong selected bg */
[data-swatch-preset="hyva"] .rc-swatch--label,
[data-swatch-preset="hyva"] .rc-swatch--button {
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--rc-text) 18%, transparent);
}
[data-swatch-preset="hyva"] .rc-swatch--label.rc-swatch--selected,
[data-swatch-preset="hyva"] .rc-swatch--button.rc-swatch--selected {
  background: var(--rc-primary) !important;
  border-color: var(--rc-primary) !important;
  color: var(--rc-white) !important;
  outline: none;
}

/* ── Midnight palette overrides ─────────────────────────────────────────── */
[data-rc-variant="midnight"] .rc-swatch-dropdown__panel {
  background: var(--rc-white);
  border-color: color-mix(in srgb, var(--rc-white) 14%, transparent);
}

[data-rc-variant="midnight"] .rc-swatch-dropdown__trigger {
  background: var(--rc-white);
  border-color: color-mix(in srgb, var(--rc-white) 20%, transparent);
}

[data-rc-variant="midnight"] .rc-swatch--label,
[data-rc-variant="midnight"] .rc-swatch--button,
[data-rc-variant="midnight"] .rc-swatch--radio,
[data-rc-variant="midnight"] .rc-swatch--checkbox {
  border-color: color-mix(in srgb, var(--rc-white) 18%, transparent);
}

[data-rc-variant="midnight"] .rc-swatches__overflow {
  background: color-mix(in srgb, var(--rc-white) 10%, transparent);
}

/* ═══════════════════════════════════════════════════════════════════════════
   VARIABLE PRODUCT FORM — replaces WC <table class="variations">
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Flat attribute rows ─────────────────────────────────────────────────── */
.rc-var-attrs {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.rc-var-attr {
  display: flex;
  flex-direction: column;
}

/* Clear link — WC's woocommerce.css hides .reset_variations; we override and manage via Alpine */
.rc-var-clear {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: var(--rc-muted);
  text-decoration: underline;
  cursor: pointer;
  align-self: flex-start;
  visibility: visible !important;
}
.rc-var-clear:hover { color: var(--rc-text); }

/* WC variation message div — suppress the default styled box */
.woocommerce-variation.single_variation {
  font-size: 0.8125rem;
  min-height: 0;
  padding: 0;
  margin: 0;
  background: none;
  border: none;
}
.woocommerce-variation.single_variation:empty { display: none; }

/* ── Single-product swatch layout ───────────────────────────────────────── */
.rc-single__variations .rc-swatches {
  margin-block: 0;
  gap: 10px;   /* label → its own chips (tight = same group) */
}
.rc-single__variations .rc-swatches + .rc-swatches {
  margin-top: 22px;  /* group → next group (wide = clear separation) */
}

.rc-single__variations .rc-swatches__header {
  font-size: 0.8125rem;
  gap: 10px;
}

.rc-single__variations .rc-swatches__label {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rc-muted);
}

.rc-single__variations .rc-swatches__value {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rc-text);
  opacity: 1;
  letter-spacing: 0;
  text-transform: none;
}

.rc-single__variations .rc-swatches__list {
  gap: var(--rc-swatch-gap, 8px);
}

/* ── Premium chip (label / button) on single product ────────────────────── */
/* border-radius is controlled by shape modifier class (rc-swatch--circle/rounded/square) */
.rc-single__variations .rc-swatch--label,
.rc-single__variations .rc-swatch--button,
.rc-single__variations .rc-swatch--radio,
.rc-single__variations .rc-swatch--checkbox {
  width: auto;
  height: 38px;
  min-width: 44px;
  padding-inline: 18px;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  border: 1.5px solid var(--rc-border);
  background: transparent;
  color: var(--rc-text);
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

/* Radio keeps ::before dot (it differentiates Radio from Button). Checkbox indicator hidden. */
.rc-single__variations .rc-swatch--checkbox::before {
  display: none;
}

/* Label on single product — frosted chip (mirrors global label style at full chip height) */
.rc-single__variations .rc-swatch--label {
  height: 38px;
  padding-inline: 18px;
  min-width: 44px;
  background: color-mix(in srgb, var(--rc-primary) 5%, transparent);
  border-color: transparent;
  color: var(--rc-muted);
  font-size: 0.8125rem;
  font-weight: 400;
}
.rc-single__variations .rc-swatch--label:hover {
  background: color-mix(in srgb, var(--rc-primary) 11%, transparent);
  border-color: color-mix(in srgb, var(--rc-primary) 45%, transparent);
  color: var(--rc-text);
  text-decoration: none;
}
.rc-single__variations .rc-swatch--label.rc-swatch--selected {
  background: color-mix(in srgb, var(--rc-primary) 14%, transparent);
  border-color: var(--rc-primary);
  color: var(--rc-primary);
  font-weight: 600;
  text-decoration: none;
  outline: none;
}

.rc-single__variations .rc-swatch--label:hover,
.rc-single__variations .rc-swatch--button:hover,
.rc-single__variations .rc-swatch--radio:hover,
.rc-single__variations .rc-swatch--checkbox:hover {
  border-color: var(--rc-text);
  transform: none;
}

/* Selected chip: solid fill */
.rc-single__variations .rc-swatch--label.rc-swatch--selected,
.rc-single__variations .rc-swatch--button.rc-swatch--selected,
.rc-single__variations .rc-swatch--radio.rc-swatch--selected,
.rc-single__variations .rc-swatch--checkbox.rc-swatch--selected {
  background: var(--rc-primary);
  color: var(--rc-white);
  border-color: var(--rc-primary) !important;
  outline: none;
  font-weight: 600;
}

/* ── Color swatches on single product ───────────────────────────────────── */
/* border-radius is controlled by shape modifier class (rc-swatch--circle/rounded/square) */
.rc-single__variations .rc-swatch--color {
  width: 36px;
  height: 36px;
  border: 2px solid transparent;
  outline: 1.5px solid var(--rc-border);
  outline-offset: 0px;
  transition: outline-color 0.15s ease, outline-offset 0.15s ease, outline-width 0.15s ease, transform 0.1s ease;
}

.rc-single__variations .rc-swatch--color:hover {
  outline-color: var(--rc-text);
  transform: scale(1.08);
}

.rc-single__variations .rc-swatch--color.rc-swatch--selected {
  outline: 2.5px solid var(--rc-primary) !important;
  outline-offset: 3px;
  border-color: transparent !important;
}

/* shape overrides for single product — ensure enough rounding on non-circle shapes */
.rc-single__variations .rc-swatch--color.rc-swatch--rounded { border-radius: 8px; }
.rc-single__variations .rc-swatch--color.rc-swatch--circle  { border-radius: 50%; }
.rc-single__variations .rc-swatch--color.rc-swatch--square  { border-radius: 2px; }

/* mobile */
@media (max-width: 480px) {
  .rc-single__variations .rc-swatch--color {
    width: 32px;
    height: 32px;
  }
}

/* ── Image swatches on single product — 70×60px, larger than color/chips ── */
.rc-single__variations .rc-swatch--image {
  width: 70px;
  height: 60px;
  border-radius: 6px;
  border: 1.5px solid var(--rc-border);
  overflow: hidden;
  transition: border-color 0.15s ease, transform 0.1s ease;
  flex-shrink: 0;
}

.rc-single__variations .rc-swatch--image .rc-swatch__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.rc-single__variations .rc-swatch--image:hover {
  border-color: var(--rc-text);
  transform: scale(1.04);
}

.rc-single__variations .rc-swatch--image.rc-swatch--selected {
  border: 2px solid var(--rc-primary) !important;
  outline: none;
}

/* hover thumbnail preview — larger image floats above on hover */
.rc-single__variations .rc-swatch--image {
  position: relative;
}
.rc-single__variations .rc-swatch--image::after {
  content: '';
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) scale(0.92);
  width: 140px;
  height: 120px;
  background: var(--sp, transparent) center top / cover;
  border-radius: 6px;
  border: 1px solid var(--rc-border);
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 20;
}
.rc-single__variations .rc-swatch--image:hover::after {
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

/* mobile: slightly smaller image swatches */
@media (max-width: 640px) {
  .rc-single__variations .rc-swatch--image {
    width: 58px;
    height: 50px;
  }
  .rc-single__variations .rc-swatch--image::after {
    display: none; /* no hover preview on touch */
  }
}

/* ── Variable product ATC button — full-width, bold ─────────────────────── */
.rc-single__variations .rc-single__qty-atc {
  margin-top: 1.5rem;
}

.rc-single__variations .rc-single__atc-btn {
  padding: 0.9375rem 1.5rem;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* Buy-now note text */
.rc-buy-now-note {
  text-align: center;
  font-size: 0.6875rem;
  color: var(--rc-muted);
  margin-top: 0.375rem;
  opacity: 0.75;
  letter-spacing: 0.01em;
}

/* Buy Now wrapper — tooltip variant */
.rc-buy-now-wrap { display: contents; }
.rc-buy-now-wrap--tooltip { display: block; position: relative; }
.rc-buy-now-wrap--tooltip .rc-single__buy-now[data-rc-tooltip]::after {
  content: attr(data-rc-tooltip);
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  max-width: 280px;
  white-space: normal;
  text-align: center;
  background: var(--rc-text);
  color: var(--rc-white);
  font-size: 0.6875rem;
  line-height: 1.35;
  padding: 6px 10px;
  border-radius: 6px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 160ms ease;
  z-index: 10;
}
.rc-buy-now-wrap--tooltip .rc-single__buy-now[data-rc-tooltip]:hover::after {
  opacity: 1;
}
/* Caret */
.rc-buy-now-wrap--tooltip .rc-single__buy-now[data-rc-tooltip]::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: var(--rc-text);
  pointer-events: none;
  opacity: 0;
  transition: opacity 160ms ease;
  z-index: 10;
}
.rc-buy-now-wrap--tooltip .rc-single__buy-now[data-rc-tooltip]:hover::before {
  opacity: 1;
}

/* ── Quick view: variable product inline swatches ────────────────────────── */
.rc-qv-content__vars .rc-single__qty-atc {
  margin-top: 0.75rem;
}

.rc-qv-content__vars .rc-swatches {
  margin-bottom: 0.75rem;
}

/* Strip the buy-now note in quick view (too compact for the extra copy) */
.rc-qv-content__vars .rc-buy-now-note {
  display: none;
}

.rc-qv-content__vars .rc-single__buy-now {
  margin-top: 0.5rem;
}

.rc-qv-content__vars .variations_form {
  margin: 0;
}

/* ── Image swatch: color-circle fallback when no image is set ───────────── */
/* Fills the image swatch box with a solid color (used when attribute is image-type
   but only some options have actual images — others fall back to their hex color) */
.rc-swatch--image .rc-swatch__inner--color {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

/* ── Size guide link in swatch header ───────────────────────────────────── */
.rc-swatches__size-guide-link {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--rc-muted);
  text-decoration: underline;
  text-underline-offset: 2px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  margin-left: auto;
  transition: color 0.15s ease;
}

.rc-swatches__size-guide-link:hover {
  color: var(--rc-text);
}

/* ── Color+Label hybrid swatch ───────────────────────────────────────────── */
.rc-swatch--color-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: var(--rc-swatch-size);
  padding-inline: 12px;
  border: 1.5px solid var(--rc-border);
  background: transparent;
  color: var(--rc-text);
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
  width: auto;
}

.rc-swatch--color-label .rc-swatch__dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex-shrink: 0;
  border: 1px solid rgba(0,0,0,0.12);
}

.rc-swatch--color-label:hover {
  border-color: var(--rc-text);
}

.rc-swatch--color-label.rc-swatch--selected {
  background: var(--rc-primary);
  color: var(--rc-white);
  border-color: var(--rc-primary) !important;
  font-weight: 600;
}

.rc-swatch--color-label.rc-swatch--selected .rc-swatch__dot {
  border-color: rgba(255,255,255,0.35);
}

/* Shape modifiers for color-label */
.rc-swatch--color-label.rc-swatch--rounded { border-radius: 6px; }
.rc-swatch--color-label.rc-swatch--circle  { border-radius: 999px; }
.rc-swatch--color-label.rc-swatch--square  { border-radius: 2px; }

/* Single product overrides */
.rc-single__variations .rc-swatch--color-label {
  height: 38px;
  padding-inline: 14px;
  gap: 8px;
}

.rc-single__variations .rc-swatch--color-label .rc-swatch__dot {
  width: 14px;
  height: 14px;
}

/* ── Swatch overflow "+N more" expand / collapse ─────────────────────────── */
.rc-swatches__overflow-items {
  display: contents; /* renders children inline in the swatch flex list */
}

.rc-swatches__more,
.rc-swatches__less {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding-inline: 14px;
  border-radius: 6px;
  border: 1.5px dashed var(--rc-border);
  background: transparent;
  color: var(--rc-muted);
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease;
  flex-shrink: 0;
}

.rc-swatches__more:hover,
.rc-swatches__less:hover {
  border-color: var(--rc-text);
  color: var(--rc-text);
}

[x-cloak] { display: none !important; }

/* ── WC legacy styles that may leak in — neutralise ─────────────────────── */
.rc-single__variations table.variations,
.rc-single__variations .variations td,
.rc-single__variations .variations th {
  display: block;
  border: none;
  padding: 0;
  width: auto;
}

/* ═══════════════════════════════════════════════════════════════════════════
   NATIVE COMPARE — tray + drawer
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Compare tray ─────────────────────────────────────────────────────────── */
.rc-compare-tray {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1050;
  background: var(--rc-white);
  border-top: 1px solid var(--rc-border);
  box-shadow: 0 -4px 24px rgba(0,0,0,.10);
  transition: transform 280ms cubic-bezier(.4,0,.2,1);
}
.rc-compare-tray--enter { transition: transform 280ms cubic-bezier(.4,0,.2,1); }
.rc-compare-tray--hidden { transform: translateY(100%); }
.rc-compare-tray--visible { transform: translateY(0); }

.rc-compare-tray__inner {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.rc-compare-tray__products {
  display: flex;
  gap: 0.625rem;
  flex: 1;
}
.rc-compare-tray__product {
  position: relative;
  width: 52px;
  height: 52px;
  border-radius: var(--rc-radius-sm);
  border: 2px solid var(--rc-border);
  overflow: hidden;
  background: var(--rc-surface);
  flex-shrink: 0;
}
.rc-compare-tray__product--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rc-muted);
  opacity: .45;
  border-style: dashed;
}
.rc-compare-tray__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rc-compare-tray__remove {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  color: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.rc-compare-tray__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}
.rc-compare-tray__count {
  font-size: 0.8125rem;
  color: var(--rc-muted);
  white-space: nowrap;
}
@media (max-width: 479px) {
  .rc-compare-tray__count { display: none; }
}
@media (max-width: 639px) {
  .rc-compare-tray__inner {
    overflow-x: auto;
    scrollbar-width: none;
    flex-wrap: nowrap;
  }
  .rc-compare-tray__inner::-webkit-scrollbar { display: none; }
}

/* ── Compare drawer ───────────────────────────────────────────────────────── */
.rc-compare-drawer {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  pointer-events: none;
}
.rc-compare-drawer[x-show] { pointer-events: auto; }

.rc-compare-drawer__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
  transition: opacity 250ms ease;
  pointer-events: auto;
}

.rc-compare-drawer__panel {
  position: relative;
  background: var(--rc-white);
  border-radius: 16px 16px 0 0;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  pointer-events: auto;
  transition: transform 320ms cubic-bezier(.4,0,.2,1);
}
.rc-compare-drawer__panel--enter { transition: transform 320ms cubic-bezier(.4,0,.2,1); }
.rc-compare-drawer__panel--hidden { transform: translateY(100%); }
.rc-compare-drawer__panel--visible { transform: translateY(0); }

.rc-compare-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.125rem 1.5rem;
  border-bottom: 1px solid var(--rc-border);
  flex-shrink: 0;
}
.rc-compare-drawer__title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.rc-compare-drawer__product-count {
  font-weight: 400;
  color: var(--rc-muted);
  font-size: 0.875rem;
}
.rc-compare-drawer__header-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.rc-compare-drawer__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--rc-border);
  background: none;
  cursor: pointer;
  color: var(--rc-text);
  transition: background 150ms;
}
.rc-compare-drawer__close:hover { background: var(--rc-surface); }

.rc-compare-drawer__body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.rc-compare-drawer__loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.875rem;
  padding: 3rem 1.5rem;
  color: var(--rc-muted);
  font-size: 0.9375rem;
}

.rc-compare-drawer__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ── Comparison table ─────────────────────────────────────────────────────── */
.rc-compare-table {
  width: 100%;
  min-width: 480px;
  border-collapse: collapse;
  table-layout: fixed;
}
.rc-compare-table__label-cell {
  width: 130px;
  min-width: 100px;
  padding: 0.875rem 1rem 0.875rem 1.5rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--rc-muted);
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--rc-border);
  white-space: nowrap;
}
.rc-compare-table__product-cell,
.rc-compare-table__value-cell {
  padding: 0.875rem 1rem;
  font-size: 0.875rem;
  color: var(--rc-text);
  border-bottom: 1px solid var(--rc-border);
  vertical-align: top;
}
.rc-compare-table__product-cell { text-align: center; border-bottom: 2px solid var(--rc-primary); }

.rc-compare-table__header-row { background: var(--rc-surface); }
.rc-compare-table__row:nth-child(even) { background: rgba(0,0,0,.02); }

.rc-compare-table__product-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.625rem;
  text-decoration: none;
  color: inherit;
}
.rc-compare-table__product-img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: var(--rc-radius-sm);
  border: 1px solid var(--rc-border);
}
.rc-compare-table__product-name {
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
}
.rc-compare-table__remove {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 1px solid var(--rc-border);
  background: none;
  cursor: pointer;
  color: var(--rc-muted);
  margin: 0.5rem auto 0;
  transition: background 150ms, color 150ms;
}
.rc-compare-table__remove:hover { background: #fee2e2; color: #dc2626; border-color: #fca5a5; }

.rc-compare-table__instock  { color: #16a34a; font-weight: 600; }
.rc-compare-table__outofstock { color: #dc2626; font-weight: 600; }

.rc-compare-table__stars { color: var(--rc-primary); letter-spacing: 1px; }
.rc-compare-table__rating-text { font-size: 0.75rem; color: var(--rc-muted); margin-left: 4px; }

.rc-compare-table__value-cell--desc { font-size: 0.8125rem; color: var(--rc-muted); line-height: 1.55; }

.rc-compare-table__row--actions .rc-compare-table__value-cell { text-align: center; border-bottom: none; }

/* Active compare button on card */
.rc-card__compare-btn--active { color: var(--rc-primary) !important; background: color-mix(in srgb, var(--rc-primary) 12%, var(--rc-white)) !important; }

/* ══════════════════════════════════════════════════════════════════════════════
   29. WHATSAPP FLOATING BUTTON
   Position (bottom / side) is injected via performance.php → wp_add_inline_style
   so it respects the theme option values at runtime.
   ══════════════════════════════════════════════════════════════════════════════ */

/* Wrapper — fixed, sits above all drawers */
.rc-wa {
    position: fixed;
    z-index: 9500;
    bottom: 24px;  /* fallback — overridden by performance.php inline style */
    right: 24px;
    left: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    pointer-events: none; /* children handle their own events */
}
.rc-wa--left { align-items: flex-start; }

/* ── Main floating button ──────────────────────────────────────────────────── */
.rc-wa__btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #25D366;
    box-shadow: 0 4px 20px rgba(37, 211, 102, 0.45);
    cursor: pointer;
    pointer-events: auto;
    text-decoration: none;
    flex-shrink: 0;
    /* Entry spring animation — fires once 0.6 s after page load */
    animation: rc-wa-entry 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) 0.6s both;
    transition: transform 220ms cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 220ms;
}
.rc-wa__btn svg { width: 30px; height: 30px; display: block; }
.rc-wa__btn:hover  { transform: scale(1.12); box-shadow: 0 8px 28px rgba(37, 211, 102, 0.6); }
.rc-wa__btn:active { transform: scale(0.92); }

/* Pulse ring — radiates 4 s after load, repeats every 30 s, CSS only */
.rc-wa__btn::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
    animation: rc-wa-pulse 30s 4s infinite;
    pointer-events: none;
}
.rc-wa--no-pulse .rc-wa__btn::before { animation: none; }

@keyframes rc-wa-entry {
    from { transform: scale(0) rotate(-30deg); opacity: 0; }
    to   { transform: scale(1) rotate(0deg);   opacity: 1; }
}

@keyframes rc-wa-pulse {
    /* Ring visible only in the first ~5 % of the 30 s cycle (≈1.5 s).
       0 % and 100 % both have opacity 0 so there is no flash on loop reset. */
    0%, 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
    1.5%      { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.65); }
    5%        { box-shadow: 0 0 0 18px rgba(37, 211, 102, 0); }
}

/* ── Desktop hover-expand panel ───────────────────────────────────────────── */
.rc-wa__panel {
    pointer-events: auto;
    width: 288px;
    background: var(--rc-white);
    border-radius: 16px;
    padding: 1rem;
    margin-bottom: 10px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.06);
    transform-origin: bottom right;
}
.rc-wa--left .rc-wa__panel { transform-origin: bottom left; }

.rc-wa__panel-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 0.875rem;
}
.rc-wa__panel-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #25D366;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.rc-wa__panel-avatar svg { width: 22px; height: 22px; }
.rc-wa__panel-info { flex: 1; min-width: 0; }
.rc-wa__panel-name   { font-size: 0.875rem; font-weight: 600; color: var(--rc-text);   line-height: 1.25; }
.rc-wa__panel-status { font-size: 0.75rem;  color: var(--rc-muted); line-height: 1.25; }

.rc-wa__panel-close {
    margin-left: auto;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    background: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rc-muted);
    transition: background 140ms, color 140ms;
}
.rc-wa__panel-close:hover { background: var(--rc-surface-2, #f4f4f4); color: var(--rc-text); }

.rc-wa__panel-input {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--rc-border);
    border-radius: 10px;
    padding: 0.6rem 0.75rem;
    font-size: 0.875rem;
    font-family: inherit;
    color: var(--rc-text);
    background: var(--rc-surface);
    resize: none;
    line-height: 1.5;
    transition: border-color 150ms;
    margin-bottom: 0.75rem;
}
.rc-wa__panel-input:focus { outline: none; border-color: #25D366; }

.rc-wa__panel-send {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 0.625rem 1rem;
    border: none;
    border-radius: 10px;
    background: #25D366;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background 140ms, transform 100ms;
}
.rc-wa__panel-send:hover  { background: #1db954; }
.rc-wa__panel-send:active { transform: scale(0.97); }

/* Panel enter / leave transitions (Alpine x-transition class hooks) */
.rc-wa-pe {
    transition: opacity 200ms ease-out, transform 200ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
.rc-wa-pe--from { opacity: 0; transform: scale(0.86) translateY(8px); }
.rc-wa-pe--to   { opacity: 1; transform: scale(1)    translateY(0);   }
.rc-wa-pl {
    transition: opacity 160ms ease-in, transform 160ms ease-in;
}
.rc-wa-pl--from { opacity: 1; transform: scale(1)    translateY(0);   }
.rc-wa-pl--to   { opacity: 0; transform: scale(0.92) translateY(4px); }

/* Never show the expand panel on touch devices */
@media (hover: none) {
    .rc-wa__panel { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   60. CONTACT FORM BLOCK
   ═══════════════════════════════════════════════════════════════════════════ */

/* Standalone block wrapper — centers form, gives it room to breathe */
.rc-contact-form__standalone {
    max-width: 960px;
    margin: 0 auto;
    padding: 3rem 2.5rem;
    background: var(--rc-surface);
    border: 1.5px solid var(--rc-border);
    border-radius: var(--rc-radius-lg);
    box-shadow: var(--rc-shadow-sm);
}

.rc-contact-form { width: 100%; }

.rc-contact-form__fields {
    display: flex;
    flex-direction: column;
    gap: 1.375rem;
}

.rc-contact-form__row { display: flex; gap: 1.375rem; }
.rc-contact-form__row--two > .rc-contact-form__field { flex: 1; min-width: 0; }

.rc-contact-form__field { display: flex; flex-direction: column; gap: 0.4rem; flex: 1; }

.rc-contact-form__label {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--rc-text);
    line-height: 1.4;
}

.rc-contact-form__req {
    color: var(--rc-primary);
    margin-left: 2px;
}

.rc-contact-form__input,
.rc-contact-form__textarea,
.rc-contact-form__select {
    width: 100%;
    padding: 0.8125rem 1rem;
    border: 1.5px solid var(--rc-border);
    border-radius: var(--rc-radius);
    background: var(--rc-white);
    color: var(--rc-text);
    font-size: 1rem;
    font-family: inherit;
    line-height: 1.5;
    transition: border-color 150ms, box-shadow 150ms;
    outline: none;
    box-sizing: border-box;
}

.rc-contact-form__input:focus,
.rc-contact-form__textarea:focus,
.rc-contact-form__select:focus {
    border-color: var(--rc-primary);
    box-shadow: 0 0 0 3px rgba(var(--rc-primary-rgb), 0.12);
}

.rc-contact-form__field--error .rc-contact-form__input,
.rc-contact-form__field--error .rc-contact-form__textarea,
.rc-contact-form__field--error .rc-contact-form__select {
    border-color: var(--rc-error);
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.10);
}

.rc-contact-form__textarea { resize: vertical; min-height: 150px; }

.rc-contact-form__select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.5' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.75rem;
    cursor: pointer;
}

.rc-contact-form__checkbox-wrap {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    cursor: pointer;
    font-size: 0.9375rem;
    color: var(--rc-text);
    line-height: 1.55;
    padding-top: 2px;
}

.rc-contact-form__checkbox {
    width: 1.0625rem;
    height: 1.0625rem;
    accent-color: var(--rc-primary);
    flex-shrink: 0;
    margin-top: 3px;
    cursor: pointer;
}

.rc-contact-form__error {
    font-size: 0.8125rem;
    color: var(--rc-error);
    line-height: 1.4;
}

.rc-contact-form__global-error {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.125rem;
    background: rgba(239, 68, 68, 0.06);
    border: 1px solid rgba(239, 68, 68, 0.25);
    border-radius: var(--rc-radius);
    color: #b91c1c;
    font-size: 0.9375rem;
    margin-bottom: 1.5rem;
}

.rc-contact-form__footer { margin-top: 2rem; }

.rc-contact-form__submit {
    min-width: 180px;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
}

.rc-contact-form__submit[disabled] { opacity: 0.65; cursor: not-allowed; }

/* Success state */
.rc-contact-form__success {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--rc-text);
}

.rc-contact-form__success-icon { color: var(--rc-primary); }

.rc-contact-form__success p {
    font-size: 1.125rem;
    line-height: 1.65;
    max-width: 400px;
    color: var(--rc-muted);
}

@media (max-width: 640px) {
    .rc-contact-form__standalone {
        padding: 2rem 1.25rem;
        border-radius: var(--rc-radius);
    }
    .rc-contact-form__row--two { flex-direction: column; }
    .rc-contact-form__submit { width: 100%; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   61. CONTACT PAGE BLOCK
   ═══════════════════════════════════════════════════════════════════════════ */

.rc-contact-page { padding: 4rem 0; }

.rc-contact-page__grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 4rem;
    align-items: start;
}

/* Info panel */
.rc-contact-page__info { padding-top: 0; }

.rc-contact-page .rc-contact-page__heading {
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    font-weight: 700;
    color: var(--rc-text);
    margin: 0 0 0.75rem;
    line-height: 1.2;
}

.rc-contact-page__subtext {
    color: var(--rc-muted, #6b7280);
    line-height: 1.75;
    margin-bottom: 2rem;
    font-size: 1rem;
}

.rc-contact-page .rc-contact-page__details {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.rc-contact-page .rc-contact-page__detail {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    margin-bottom: 0;
}

.rc-contact-page__detail-icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(var(--rc-primary-rgb), 0.10);
    color: var(--rc-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.rc-contact-page__detail-text,
.rc-contact-page__detail-link {
    font-size: 0.9375rem;
    color: var(--rc-text);
    line-height: 1.6;
    padding-top: 6px;
}

.rc-contact-page__detail-link {
    text-decoration: none;
    transition: color 150ms;
}
.rc-contact-page__detail-link:hover { color: var(--rc-primary); }

/* Social links */
.rc-contact-page__social {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin-bottom: 2rem;
}

.rc-contact-page__social-link {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    border: 1.5px solid var(--rc-border);
    color: var(--rc-text);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 150ms, border-color 150ms, background 150ms;
    text-decoration: none;
}
.rc-contact-page__social-link:hover {
    color: var(--rc-primary);
    border-color: var(--rc-primary);
    background: color-mix(in srgb, var(--rc-primary) 6%, transparent);
}

/* Full-width map — sits below the info+form grid */
.rc-contact-page__map {
    margin-top: 3rem;
    border-radius: var(--rc-radius-lg);
    overflow: hidden;
    border: 1.5px solid var(--rc-border);
    box-shadow: var(--rc-shadow-sm);
}

.rc-contact-page__map iframe {
    display: block;
    width: 100%;
    height: 420px;
    border: none;
}

/* Form panel */
.rc-contact-page__form-panel {
    background: var(--rc-surface);
    border: 1.5px solid var(--rc-border);
    border-radius: var(--rc-radius-lg);
    padding: 2.5rem;
}

@media (max-width: 900px) {
    .rc-contact-page__grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
    .rc-contact-page__form-panel {
        padding: 1.75rem;
    }
}

@media (max-width: 480px) {
    .rc-contact-page { padding: 2.5rem 0; }
    .rc-contact-page__form-panel { padding: 1.25rem; border-radius: 12px; }
}

/* ── RC Accordion / FAQ Block ────────────────────────────────────────────────── */

.rc-accordion {
    width: 100%;
    padding: 3rem 0;
}

.rc-accordion__title {
    text-align: center;
    font-size: clamp(1.25rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--rc-primary);
    margin: 0 0 2rem;
}

/* Grid — handles 1 or 2 columns */
.rc-accordion__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0 3rem;
}

.rc-accordion--cols-2 .rc-accordion__grid {
    grid-template-columns: repeat(2, 1fr);
}

/* Trigger base */
.rc-accordion__trigger {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    font-family: var(--rc-font);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    transition: background 0.2s ease, color 0.2s ease;
}

.rc-accordion__trigger:focus-visible {
    outline: 2px solid var(--rc-primary);
    outline-offset: 2px;
}

.rc-accordion__q {
    flex: 1;
    min-width: 0;
}
.rc-accordion--bold-q .rc-accordion__trigger { font-weight: 700; }

/* Answer body */
.rc-accordion__answer {
    line-height: 1.6;
    color: var(--rc-text);
}

.rc-accordion__answer > * + * {
    margin-top: 0.5em;
}

.rc-accordion__answer a {
    color: var(--rc-primary);
    text-decoration: underline;
}

/* ── Colored variant ─────────────────────────────────────────────────────────── */

.rc-accordion--colored .rc-accordion__item {
    margin-bottom: 0.375rem;
}

.rc-accordion--colored .rc-accordion__trigger {
    background: var(--rc-primary);
    color: #fff;
    font-weight: 700;
    padding: 0.875rem 1.25rem;
}

.rc-accordion--colored .rc-accordion__trigger:hover {
    background: var(--rc-primary-dark, var(--rc-primary));
}

/* +/− icon sits on the left for colored variant */
.rc-accordion--colored .rc-accordion__icon {
    flex-shrink: 0;
    order: -1;
    font-style: normal;
    font-size: 1.25rem;
    line-height: 1;
    font-weight: 300;
    width: 1.125rem;
    text-align: center;
}

.rc-accordion--colored .rc-accordion__icon::before {
    content: '+';
}

.rc-accordion--colored .rc-accordion__trigger[aria-expanded="true"] .rc-accordion__icon::before {
    content: '\2212'; /* − */
}

.rc-accordion--colored .rc-accordion__body {
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-top: none;
    background: var(--rc-white, #fff);
    margin-bottom: 0.375rem;
}

.rc-accordion--colored .rc-accordion__answer {
    padding: 1rem 1.25rem;
    font-weight: 500;
}

/* ── Minimal variant ─────────────────────────────────────────────────────────── */

.rc-accordion--minimal .rc-accordion__item {
    border-bottom: 1px solid var(--rc-border);
}

.rc-accordion--minimal .rc-accordion__col > .rc-accordion__item:first-child {
    border-top: 1px solid var(--rc-border);
}

/* Open item gets card treatment */
.rc-accordion--minimal .rc-accordion__item--open {
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-sm);
    background: var(--rc-surface);
    margin: 0.375rem 0;
}

.rc-accordion--minimal .rc-accordion__item--open + .rc-accordion__item {
    border-top: none;
}

.rc-accordion--minimal .rc-accordion__trigger {
    color: var(--rc-text);
    font-weight: 500;
    padding: 1rem 0;
    gap: 1rem;
}

/* Active trigger shifts to brand color and gains padding */
.rc-accordion--minimal .rc-accordion__item--open .rc-accordion__trigger {
    color: var(--rc-primary);
    padding: 1rem 1.25rem;
}

/* Chevron icon sits on the right */
.rc-accordion--minimal .rc-accordion__icon {
    flex-shrink: 0;
    order: 2;
    display: block;
    width: 16px;
    height: 16px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);   /* ↓ */
    transition: transform 0.25s var(--rc-ease);
    margin-top: -3px;
}

.rc-accordion--minimal .rc-accordion__trigger[aria-expanded="true"] .rc-accordion__icon {
    transform: rotate(-135deg);  /* ↑ */
    margin-top: 3px;
}

.rc-accordion--minimal .rc-accordion__answer {
    padding: 0 0 1rem;
}

.rc-accordion--minimal .rc-accordion__item--open .rc-accordion__answer {
    padding: 0 1.25rem 1.25rem;
}

/* ── Responsive ──────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .rc-accordion--cols-2 .rc-accordion__grid {
        grid-template-columns: 1fr;
    }

    .rc-accordion--cols-2 .rc-accordion__col + .rc-accordion__col .rc-accordion__item:first-child {
        border-top: none;
    }
}