:root {
  /* Primary — industrial */
  --navy-900: #0B1220;
  --navy-800: #16233F;
  --navy-700: #1E3055;
  --navy-600: #2C4470;
  --navy-400: #5A73A0;

  /* Secondary — fresh */
  --leaf-700: #2E7D1E;
  --leaf-600: #3D9B28;
  --leaf-500: #4CAF2F;
  --lime-400: #8DC63F;
  --lime-200: #C8E6A0;

  /* Metal — for the 3D/chrome feel */
  --steel-100: #EEF2F7;
  --steel-300: #C7D2E0;
  --steel-500: #8A9AB3;

  /* Neutrals */
  --ink: #0E1621;
  --body: #475467;
  --muted: #7A8699;
  --line: #E4E9F0;
  --paper: #FFFFFF;
  --paper-alt: #F7F9FC;

  /* Signature gradients — use deliberately, not everywhere */
  --grad-steel: linear-gradient(135deg, #16233F 0%, #2C4470 50%, #16233F 100%);
  --grad-fresh: linear-gradient(135deg, #2E7D1E 0%, #4CAF2F 45%, #8DC63F 100%);
  --grad-hero: linear-gradient(160deg, #0B1220 0%, #16233F 55%, #1E3055 100%);
  --grad-chrome: linear-gradient(180deg, #FFFFFF 0%, #DCE4EE 45%, #A9B7CC 55%, #F2F5F9 100%);

  --font-display: "Outfit", "Segoe UI", system-ui, sans-serif;
  --font-body: "Inter", "Segoe UI", system-ui, sans-serif;
  --fs-display: clamp(2.4rem, 5vw, 4.5rem);
  --fs-h1: clamp(2rem, 3.6vw, 3.2rem);
  --fs-h2: clamp(1.6rem, 2.6vw, 2.4rem);
  --fs-h3: clamp(1.25rem, 1.8vw, 1.6rem);
  --fs-body: clamp(1rem, 1.05vw, 1.0625rem);
  --fs-sm: .9rem;
  --fs-xs: .8rem;
  --container: 82rem;
  --gutter: clamp(1rem, 3vw, 2rem);
  --space-section: clamp(4.5rem, 8vw, 8rem);
  --shadow-surface: 0 1px 2px rgba(11, 18, 32, .06), 0 12px 32px -8px rgba(11, 18, 32, .18);
  --shadow-float: 0 18px 48px -18px rgba(11, 18, 32, .34);
  --header-height: 4.75rem;

  /* Radius scale — replaces the clipped/notched corners entirely */
  --r-sm: .625rem;
  --r-md: 1rem;
  --r-lg: 1.5rem;
  --r-xl: 2rem;
  --r-pill: 999px;

  /* Layered depth */
  --shadow-1: 0 1px 2px rgba(11,18,32,.05), 0 2px 8px -2px rgba(11,18,32,.08);
  --shadow-2: 0 2px 4px rgba(11,18,32,.05), 0 8px 20px -6px rgba(11,18,32,.14);
  --shadow-3: 0 4px 8px rgba(11,18,32,.06), 0 18px 40px -12px rgba(11,18,32,.22);
  --shadow-4: 0 8px 16px rgba(11,18,32,.08), 0 32px 64px -20px rgba(11,18,32,.32);
  --glow-green: 0 10px 28px -8px rgba(76,175,47,.5);
  --inner-hi: inset 0 1px 0 rgba(255,255,255,.75);

  --mint-50: #F3F9EF;
  --mint-100: #E6F3DE;
  --glass: rgba(255,255,255,.1);
}

/* Self-hosted variable fonts — one file per family covers every weight.
   NOTE: never use src:local() alone; nobody has these installed and the whole
   site silently falls back to Arial (that bug shipped once already). */
@font-face {
  font-family: "Outfit";
  src: url("/assets/fonts/outfit-var.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}

@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-var.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}

/* ===== Reset ===== */
*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
figure { margin: 0; }

ul,
ol { padding: 0; }

body {
  min-width: 20rem;
  color: var(--body);
  background: var(--paper);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.rf-no-scroll { overflow: hidden; }

img,
picture,
svg { display: block; max-width: 100%; }

img { height: auto; }

button,
input,
select,
textarea { color: inherit; font: inherit; }

button,
summary { cursor: pointer; }

button { border: 0; }

a { color: inherit; text-decoration: none; }

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--lime-400);
  outline-offset: 2px;
}

::selection { color: var(--navy-900); background: var(--lime-200); }

/* ===== Base / Typography ===== */
h1,
h2,
h3,
h4 {
  color: var(--ink);
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.15;
}

h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }
p { max-width: 68ch; }
strong { color: var(--ink); }

.rf-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  color: var(--leaf-700);
  font-family: var(--font-display);
  font-size: var(--fs-xs);
  font-weight: 800;
  letter-spacing: .12em;
  line-height: 1.2;
  text-transform: uppercase;
}

.rf-eyebrow::before {
  width: 1.5rem;
  height: .125rem;
  background: var(--grad-fresh);
  content: "";
}

.rf-lede { color: var(--body); font-size: clamp(1.05rem, 1.4vw, 1.2rem); }
.rf-small { font-size: var(--fs-sm); }
.rf-muted { color: var(--muted); }
.rf-numeric { font-variant-numeric: tabular-nums; }

/* ===== Layout Utilities ===== */
.rf-container { width: min(100% - (2 * var(--gutter)), var(--container)); margin-inline: auto; }
.rf-section { padding-block: var(--space-section); }
.rf-section--alt { background: var(--paper-alt); }
.rf-stack { display: grid; gap: var(--stack-space, 1rem); }
.rf-cluster { display: flex; flex-wrap: wrap; gap: var(--cluster-space, .75rem); align-items: center; }
.rf-grid { display: grid; gap: clamp(1rem, 2vw, 1.5rem); }
.rf-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rf-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rf-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Hidden by clipping, NOT by transform — a reduced-motion rule that neutralises
   transform used to leave this visible on every page. */
.rf-skip-link {
  position: fixed;
  z-index: 1000;
  top: .75rem;
  left: .75rem;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  color: var(--paper);
  background: var(--navy-900);
  border-radius: var(--r-sm);
}

.rf-skip-link:focus {
  width: auto;
  height: auto;
  padding: .65rem 1rem;
  overflow: visible;
  clip-path: none;
}

/* ===== Buttons ===== */
.rf-btn {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  padding: .8rem 1.4rem;
  border: 1px solid transparent;
  border-radius: var(--r-pill);
  overflow: hidden;
  font-family: var(--font-display);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1.1;
  text-align: center;
  transition: transform 200ms cubic-bezier(.16,1,.3,1), box-shadow 200ms ease, border-color 200ms ease;
}

.rf-btn::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(115deg, transparent 25%, rgba(255, 255, 255, .34) 48%, transparent 70%);
  content: "";
  transform: translateX(-140%);
  transition: transform 500ms cubic-bezier(.16, 1, .3, 1);
}

.rf-btn:hover::after { transform: translateX(140%); }
.rf-btn:active { transform: translateY(1px); }
.rf-btn svg { width: 1.1rem; height: 1.1rem; }

.rf-btn:hover { transform: translateY(-2px); }

.rf-btn--primary {
  color: var(--paper);
  background: var(--grad-fresh);
  box-shadow: var(--glow-green), inset 0 1px 0 rgba(255, 255, 255, .3);
}

.rf-btn--primary:hover { box-shadow: 0 16px 34px -10px rgba(61, 155, 40, .72), inset 0 1px 0 rgba(255,255,255,.35); }

.rf-btn--secondary {
  color: var(--navy-800);
  border-color: var(--steel-300);
  background: var(--paper);
  box-shadow: var(--shadow-1), var(--inner-hi);
}

.rf-btn--secondary:hover { border-color: var(--leaf-500); color: var(--leaf-700); box-shadow: var(--shadow-2); }
.rf-btn--ghost { color: var(--paper); border-color: rgba(255, 255, 255, .45); background: transparent; }
.rf-btn--ghost:hover { border-color: var(--paper); background: rgba(255, 255, 255, .08); }
.rf-btn--block { width: 100%; }

.rf-icon-btn {
  display: inline-grid;
  width: 2.75rem;
  height: 2.75rem;
  flex: 0 0 auto;
  place-items: center;
  color: var(--navy-800);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--paper);
  transition: color 180ms ease, border-color 180ms ease, background 180ms ease, transform 180ms ease;
}

.rf-icon-btn:hover { color: var(--leaf-700); border-color: var(--lime-400); background: var(--paper-alt); }
.rf-icon-btn svg { width: 1.25rem; height: 1.25rem; }

/* ===== Forms ===== */
.rf-field { display: grid; gap: .4rem; }
.rf-label { color: var(--ink); font-size: var(--fs-sm); font-weight: 700; }
.rf-input,
.rf-select,
.rf-textarea {
  width: 100%;
  min-height: 3.25rem;
  padding: .75rem .9rem;
  border: 1px solid var(--steel-300);
  border-radius: var(--r-md);
  color: var(--ink);
  background: var(--paper);
  font-size: 1rem;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.rf-textarea { min-height: 7rem; resize: vertical; }
.rf-input::placeholder,
.rf-textarea::placeholder { color: var(--muted); }
.rf-input:focus,
.rf-select:focus,
.rf-textarea:focus { border-color: var(--leaf-600); outline: 0; box-shadow: 0 0 0 3px rgba(141, 198, 63, .3); }
.rf-field__hint { color: var(--muted); font-size: var(--fs-xs); }
.rf-field--error .rf-input { border-color: #B42318; }
.rf-field--error .rf-field__hint { color: #B42318; }

/* ===== Shared Header ===== */
.rf-site-header { position: relative; z-index: 100; background: var(--paper); }
.rf-utility { display: none; color: var(--steel-100); background: var(--navy-900); font-size: .76rem; }
.rf-utility__inner { min-height: 2.25rem; justify-content: space-between; }
.rf-utility__list { display: flex; align-items: center; gap: 1rem; list-style: none; }
.rf-utility__item,
.rf-utility__link { display: inline-flex; align-items: center; gap: .4rem; }
.rf-utility__link:hover { color: var(--lime-200); }
.rf-utility svg { width: .9rem; height: .9rem; color: var(--lime-400); }

.rf-mainbar {
  position: relative;
  background: rgba(255, 255, 255, .98);
  border-bottom: 1px solid var(--line);
  transition: box-shadow 200ms ease, background 200ms ease;
}

.rf-mainbar.is-condensed {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  background: rgba(255, 255, 255, .93);
  box-shadow: 0 10px 28px -18px rgba(11, 18, 32, .6);
  backdrop-filter: blur(12px);
}

.rf-mainbar__inner { display: flex; min-height: var(--header-height); align-items: center; gap: 1rem; }
.rf-brand { display: inline-flex; width: clamp(8.5rem, 17vw, 14.5rem); flex: 0 0 auto; align-items: center; }
.rf-brand img { width: 100%; aspect-ratio: 3 / 1; object-fit: contain; }
.rf-desktop-nav { display: none; margin-inline: auto; }
.rf-nav-list { display: flex; align-items: center; gap: clamp(.1rem, .7vw, .6rem); list-style: none; }
.rf-nav-link,
.rf-nav-summary {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .35rem;
  padding: .5rem .65rem;
  color: var(--navy-800);
  font-family: var(--font-display);
  font-size: .83rem;
  font-weight: 700;
  white-space: nowrap;
}

.rf-nav-link:hover,
.rf-nav-link[aria-current="page"],
.rf-nav-summary:hover { color: var(--leaf-700); }
.rf-nav-summary { list-style: none; }
.rf-nav-summary::-webkit-details-marker { display: none; }
.rf-nav-summary svg { width: .9rem; transition: transform 180ms ease; }
.rf-mega[open] .rf-nav-summary svg { transform: rotate(180deg); }
.rf-mainbar__actions { display: flex; margin-left: auto; align-items: center; gap: .45rem; }
.rf-mainbar__actions > .rf-btn { display: none; }

/* Search is a normal flex item in the header row. It used to be absolutely
   positioned, which is what kept pushing it out of the bar and over the
   utility strip. */
.rf-search {
  position: relative;
  display: none;
  align-items: center;
  min-width: 0;
}

.rf-search.is-open { display: flex; }
.rf-search .rf-input { padding-right: 3rem; }

.rf-cart-button { position: relative; }
.rf-cart-button__count { border-radius: var(--r-pill);
  position: absolute;
  top: -.3rem;
  right: -.35rem;
  display: grid;
  min-width: 1.2rem;
  height: 1.2rem;
  padding-inline: .2rem;
  place-items: center;
  border: 2px solid var(--paper);
  border-radius: 999px;
  color: var(--paper);
  background: var(--leaf-700);
  font-size: .65rem;
  font-weight: 800;
  line-height: 1;
}

.rf-menu-button span {
  display: block;
  width: 1.15rem;
  height: 1px;
  margin-block: .2rem;
  background: currentColor;
}

/* ===== Mega Menu ===== */
.rf-mega__panel {
  position: absolute;
  z-index: 10;
  top: 100%;
  right: 0;
  left: 0;
  padding: 1.25rem 0 1.5rem;
  border-top: 1px solid var(--line);
  background: var(--paper);
  border-radius: 0 0 var(--r-lg) var(--r-lg);
  box-shadow: var(--shadow-4);
}

.rf-mega__inner { display: grid; grid-template-columns: minmax(0, 1fr) 17rem; gap: 1.5rem; }
.rf-mega__heading { margin-bottom: .65rem; color: var(--muted); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.rf-mega__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem .75rem; list-style: none; }
.rf-mega__link { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: .7rem; align-items: center; padding: .6rem; border-radius: var(--r-md); }
.rf-mega__link:hover { background: var(--mint-50); }
.rf-mega__icon { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; color: var(--leaf-700); border: 1px solid var(--mint-100); border-radius: var(--r-md); background: var(--mint-50); transition: transform 200ms cubic-bezier(.16,1,.3,1), background 200ms ease; }
.rf-mega__link:hover .rf-mega__icon { transform: scale(1.08); background: var(--mint-100); }
.rf-mega__icon svg { width: 1.2rem; height: 1.2rem; }
.rf-mega__name { display: block; color: var(--ink); font-family: var(--font-display); font-size: .82rem; font-weight: 700; line-height: 1.25; }
.rf-mega__desc { display: block; margin-top: .12rem; color: var(--muted); font-size: .72rem; line-height: 1.3; }
.rf-mega__feature {
  position: relative;
  display: flex;
  min-height: 100%;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.2rem;
  overflow: hidden;
  color: var(--paper);
  background: var(--grad-hero);
  border-radius: var(--r-lg);
}
.rf-mega__feature::before {
  position: absolute;
  top: -3rem;
  right: -3rem;
  width: 9rem;
  height: 9rem;
  border: 1.4rem dashed rgba(255, 255, 255, .06);
  border-radius: 50%;
  content: "";
}
.rf-mega__badge { align-self: flex-start; margin-bottom: auto; padding: .25rem .45rem; color: var(--navy-900); background: var(--lime-400); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.rf-mega__feature h3 { margin-top: 2rem; color: var(--paper); font-size: 1.2rem; }
.rf-mega__feature p { margin-top: .4rem; color: var(--steel-300); font-size: .82rem; }
.rf-mega__feature-link { display: inline-flex; margin-top: .9rem; align-items: center; gap: .45rem; color: var(--lime-200); font-size: .8rem; font-weight: 800; }

/* ===== Mobile Drawer ===== */
.rf-drawer {
  position: fixed;
  z-index: 300;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  visibility: hidden;
  background: rgba(11, 18, 32, .62);
  opacity: 0;
  transition: visibility 220ms, opacity 220ms ease;
}

.rf-drawer.is-open { visibility: visible; opacity: 1; }
.rf-drawer__panel {
  width: min(100%, 30rem);
  height: 100%;
  margin-left: auto;
  overflow-y: auto;
  color: var(--paper);
  background: var(--navy-900);
  transform: translateX(100%);
  transition: transform 280ms cubic-bezier(.16, 1, .3, 1);
}
.rf-drawer.is-open .rf-drawer__panel { transform: translateX(0); }
.rf-drawer__head { position: sticky; z-index: 2; top: 0; display: flex; min-height: 4.75rem; align-items: center; justify-content: space-between; padding: .75rem var(--gutter); border-bottom: 1px solid rgba(255, 255, 255, .12); background: var(--navy-900); }
.rf-drawer__brand { width: 10.75rem; padding: .25rem; background: var(--paper); }
.rf-drawer__close { color: var(--paper); border-color: rgba(255, 255, 255, .2); background: transparent; }
.rf-drawer__nav { padding: .75rem var(--gutter) 8rem; }
.rf-drawer__list { list-style: none; }
.rf-drawer__link,
.rf-drawer__summary { display: flex; min-height: 3.5rem; align-items: center; justify-content: space-between; width: 100%; border-bottom: 1px solid rgba(255, 255, 255, .1); color: var(--paper); font-family: var(--font-display); font-weight: 700; }
.rf-drawer__summary { list-style: none; }
.rf-drawer__summary::-webkit-details-marker { display: none; }
.rf-drawer__summary svg { width: 1rem; transition: transform 180ms ease; }
.rf-drawer__details[open] .rf-drawer__summary svg { transform: rotate(180deg); }
.rf-drawer__subnav { padding: .6rem 0 .9rem .8rem; list-style: none; }
.rf-drawer__subnav a { display: flex; min-height: 3.25rem; align-items: center; gap: .65rem; color: var(--steel-300); border-bottom: 1px solid rgba(255, 255, 255, .06); font-size: .9rem; }
.rf-drawer__subnav a::before { width: .4rem; height: .4rem; border: 1px solid var(--lime-400); content: ""; transform: rotate(45deg); }
.rf-drawer__contact { display: grid; gap: .75rem; margin-top: 1.25rem; }

/* ===== Shell Preview ===== */
.rf-shell-preview {
  min-height: 31rem;
  display: grid;
  place-items: center;
  padding: var(--space-section) var(--gutter);
  text-align: center;
  background-color: var(--paper-alt);
  background-image: linear-gradient(rgba(44, 68, 112, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(44, 68, 112, .06) 1px, transparent 1px);
  background-size: 28px 28px;
}
.rf-shell-preview__plate { max-width: 44rem; padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--steel-300); background: rgba(255, 255, 255, .94); box-shadow: var(--shadow-3), var(--inner-hi); border-radius: var(--r-lg); }
.rf-shell-preview__plate h1 { margin-top: 1rem; }
.rf-shell-preview__plate p { margin: 1rem auto 0; }
.rf-shell-preview__rule { width: 5rem; height: .2rem; margin: 1.5rem auto 0; background: var(--grad-fresh); }

/* ===== Footer ===== */
.rf-footer { position: relative; padding-bottom: 5rem; color: var(--steel-300); background: var(--navy-900); }
.rf-footer::before { display: block; height: .25rem; background: var(--grad-fresh); content: ""; }
.rf-footer__request { padding-block: 1.5rem; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.rf-footer__request-inner { display: grid; gap: 1rem; align-items: center; }
.rf-footer__request-copy h2 { color: var(--paper); font-size: clamp(1.2rem, 2vw, 1.55rem); }
.rf-footer__request-copy p { margin-top: .25rem; color: var(--steel-300); font-size: var(--fs-sm); }
.rf-footer__form { display: flex; gap: .5rem; }
.rf-footer__form .rf-input { min-width: 0; color: var(--ink); border: 0; }
.rf-footer__form .rf-btn { flex: 0 0 auto; }
.rf-footer__main { display: grid; gap: 2rem; padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.rf-footer__brand { display: inline-block; width: min(100%, 15rem); padding: .4rem; background: var(--paper); }
.rf-footer__blurb { margin-top: 1rem; color: var(--steel-300); font-size: var(--fs-sm); }
.rf-footer__social { display: flex; gap: .5rem; margin-top: 1.25rem; }
.rf-footer__social a { display: grid; width: 2.6rem; height: 2.6rem; place-items: center; border: 1px solid rgba(255, 255, 255, .16); }
.rf-footer__social a:hover { color: var(--lime-200); border-color: var(--lime-400); }
.rf-footer__social svg { width: 1.1rem; height: 1.1rem; }
.rf-footer__heading { margin-bottom: .8rem; color: var(--paper); font-size: .9rem; letter-spacing: .02em; }
.rf-footer__links { display: grid; gap: .45rem; list-style: none; }
.rf-footer__links a { color: var(--steel-300); font-size: .85rem; }
.rf-footer__links a:hover { color: var(--lime-200); }
.rf-footer__contact { display: grid; gap: .65rem; list-style: none; }
.rf-footer__contact li { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: .6rem; font-size: .85rem; }
.rf-footer__contact svg { width: 1.15rem; height: 1.15rem; margin-top: .2rem; color: var(--lime-400); }
.rf-footer__contact a:hover { color: var(--lime-200); }
.rf-footer__legal { padding-block: 1rem; border-top: 1px solid rgba(255, 255, 255, .1); font-size: .75rem; }
.rf-footer__legal-inner { display: flex; flex-wrap: wrap; gap: .5rem 1rem; justify-content: space-between; }
.rf-footer__legal-links { display: flex; flex-wrap: wrap; gap: 1rem; }
.rf-footer__legal a:hover { color: var(--lime-200); }

/* ===== Mobile Action Bar ===== */
.rf-mobile-actions {
  position: fixed;
  z-index: 200;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: .4rem max(.4rem, env(safe-area-inset-right)) calc(.4rem + env(safe-area-inset-bottom)) max(.4rem, env(safe-area-inset-left));
  border-top: 1px solid var(--steel-300);
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 -10px 28px -18px rgba(11, 18, 32, .65);
  backdrop-filter: blur(12px);
}
.rf-mobile-actions__link { display: grid; min-height: 3.2rem; border-radius: var(--r-md); place-items: center; align-content: center; gap: .12rem; color: var(--navy-800); font-family: var(--font-display); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.rf-mobile-actions__link + .rf-mobile-actions__link { border-left: 1px solid var(--line); }
.rf-mobile-actions__link svg { width: 1.15rem; height: 1.15rem; }
.rf-mobile-actions__link--primary { color: var(--leaf-700); }

/* ===== Chatbot Launcher ===== */
.rf-chatbot { position: fixed; z-index: 180; right: 1rem; bottom: 5.4rem; }
.rf-chatbot__button {
  position: relative;
  display: grid;
  width: 3.25rem;
  height: 3.25rem;
  place-items: center;
  border: 3px solid var(--paper);
  border-radius: 50%;
  color: var(--paper);
  background: var(--grad-steel);
  box-shadow: var(--shadow-float);
}
.rf-chatbot__button::before { position: absolute; inset: -.28rem; border: 1px solid rgba(76, 175, 47, .55); border-radius: 50%; content: ""; animation: rf-pulse 2.8s ease-out infinite; }
.rf-chatbot__button svg { width: 1.35rem; height: 1.35rem; }
.rf-chatbot__tip { position: absolute; right: 0; bottom: calc(100% + .7rem); width: max-content; max-width: min(15rem, calc(100vw - 2rem)); padding: .55rem .7rem; border: 1px solid var(--line); color: var(--ink); background: var(--paper); box-shadow: var(--shadow-surface); font-size: .78rem; opacity: 0; pointer-events: none; transform: translateY(.35rem); transition: opacity 180ms ease, transform 180ms ease; }
.rf-chatbot:hover .rf-chatbot__tip,
.rf-chatbot__button:focus-visible + .rf-chatbot__tip { opacity: 1; transform: translateY(0); }
@keyframes rf-pulse { 70%, 100% { opacity: 0; transform: scale(1.35); } }

/* ===== Dialog ===== */
.rf-dialog { width: min(100% - 2rem, 35rem); max-height: calc(100dvh - 2rem); padding: 0; border: 0; border-radius: var(--r-lg); overflow: hidden; color: var(--body); background: var(--paper); box-shadow: var(--shadow-float); }
.rf-dialog::backdrop { background: rgba(11, 18, 32, .72); backdrop-filter: blur(4px); }
.rf-dialog__head { display: flex; align-items: center; justify-content: space-between; padding: 1.1rem 1.2rem; border-bottom: 1px solid var(--line); }
.rf-dialog__head h2 { font-size: 1.35rem; }
.rf-dialog__body { display: grid; gap: 1rem; max-height: calc(100dvh - 6rem); padding: 1.2rem; overflow-y: auto; }
.rf-dialog__alt { padding-top: .9rem; border-top: 1px solid var(--line); text-align: center; font-size: .86rem; }
.rf-dialog__alt a { color: var(--leaf-700); font-weight: 800; }

/* ===== Responsive ===== */
@media (max-width: 47.99rem) {
  .rf-grid--2,
  .rf-grid--3 { grid-template-columns: 1fr; }
  .rf-footer__form { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
}

@media (min-width: 30rem) {
  .rf-brand { width: clamp(10.75rem, 17vw, 14.5rem); }
  .rf-mainbar__actions > .rf-btn { display: inline-flex; }
  .rf-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 48rem) {
  .rf-utility { display: block; }
  .rf-mega__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rf-footer__request-inner { grid-template-columns: minmax(0, 1fr) minmax(22rem, .8fr); }
  .rf-footer__main { grid-template-columns: 1.2fr .8fr .8fr 1.1fr; }
  .rf-footer { padding-bottom: 0; }
  .rf-mobile-actions { display: none; }
  .rf-chatbot { bottom: 1.5rem; right: 1.5rem; }
}

@media (min-width: 64rem) {
  .rf-desktop-nav { display: block; }
  .rf-menu-button { display: none; }
  .rf-mainbar__actions > .rf-btn { display: inline-flex; }
}

@media (min-width: 80rem) {
  .rf-nav-link,
  .rf-nav-summary { padding-inline: .85rem; }
}

@media (hover: hover) and (pointer: fine) and (min-width: 64rem) {
  .rf-mega:not([open]):hover .rf-mega__panel { display: block; }
}

/* Reduced motion: kill the MOTION, not the layout.
   The previous blanket `transform: none !important` also killed transforms used
   for positioning — it left the skip link on screen and flattened every card. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  /* Decorative drifting/floating accents stop completely. */
  .rf-float, .rf-hero__gear, .rf-hero__grid { animation: none !important; }
}

/* ================================================================
   PAGE COMPONENTS — appended to the Batch-1 design system
   ================================================================ */

/* ===== Reveal on scroll (single restrained pattern) ===== */
.rf-reveal { opacity: 0; transform: translateY(12px); transition: opacity 500ms cubic-bezier(.16,1,.3,1), transform 500ms cubic-bezier(.16,1,.3,1); }
.rf-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .rf-reveal { opacity: 1; transform: none; } }

/* ===== Section heads ===== */
.rf-section__head { max-width: 46rem; margin-bottom: clamp(1.75rem, 4vw, 2.75rem); }
.rf-section__head h2 { margin-top: .7rem; }
.rf-section__head p { margin-top: .7rem; }
.rf-section__head--center { margin-inline: auto; text-align: center; }
.rf-section__head--center .rf-eyebrow { justify-content: center; }
.rf-head-row { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; justify-content: space-between; margin-bottom: clamp(1.5rem, 3vw, 2.25rem); }
.rf-head-row h2 { margin-top: .6rem; }

/* ===== HERO — machined plate + spec showcase (no orbit, no rotating ring) ===== */
.rf-hero {
  position: relative;
  overflow: hidden;
  color: var(--steel-300);
  background: var(--grad-hero);
}
.rf-hero::before {
  position: absolute; inset: 0; content: "";
  background-image: linear-gradient(rgba(141,198,63,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(141,198,63,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(circle at 30% 40%, #000 0%, transparent 78%);
}
.rf-hero__gear {
  position: absolute; right: -9rem; bottom: -11rem; width: 34rem; height: 34rem;
  color: #fff; opacity: .04; pointer-events: none;
}
.rf-hero__inner { position: relative; display: grid; gap: clamp(2rem, 5vw, 3.5rem); padding-block: clamp(3rem, 7vw, 5.5rem); }
.rf-hero__chip {
  display: inline-flex; align-items: center; gap: .5rem; padding: .4rem .8rem;
  border: 1px solid rgba(141,198,63,.42); border-radius: 999px;
  color: var(--lime-200); font-family: var(--font-display); font-size: .72rem;
  font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.rf-hero__chip span { width: .45rem; height: .45rem; border-radius: 50%; background: var(--lime-400); box-shadow: 0 0 0 0 rgba(141,198,63,.7); animation: rf-dot 2.4s ease-out infinite; }
@keyframes rf-dot { 70%,100% { box-shadow: 0 0 0 .5rem rgba(141,198,63,0); } }
.rf-hero h1 { margin-top: 1.1rem; color: var(--paper); font-size: var(--fs-display); }
.rf-hero__mark { position: relative; display: inline-block; white-space: nowrap; }
.rf-hero__mark svg { position: absolute; right: 0; bottom: -.42em; left: 0; width: 100%; height: .38em; color: var(--lime-400); overflow: visible; }
.rf-hero__mark path { stroke-dasharray: 320; stroke-dashoffset: 320; animation: rf-draw 1.1s cubic-bezier(.16,1,.3,1) .35s forwards; }
@keyframes rf-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .rf-hero__mark path { stroke-dashoffset: 0; animation: none; } }
.rf-hero__lede { margin-top: 1.15rem; color: var(--steel-300); font-size: clamp(1rem, 1.35vw, 1.15rem); }
.rf-hero__actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.75rem; }
.rf-hero__trust { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1px; margin-top: 2.25rem; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.1); }
.rf-hero__trust div { padding: .85rem .9rem; background: rgba(11,18,32,.42); }
.rf-hero__trust dt { color: var(--paper); font-family: var(--font-display); font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.rf-hero__trust dd { margin: .15rem 0 0; color: var(--steel-500); font-size: .74rem; letter-spacing: .04em; text-transform: uppercase; }

/* Showcase: vertical crossfade between machines — deliberately NOT a carousel/orbit */
.rf-showcase { position: relative; }
.rf-showcase__plate {
  position: relative; padding: 1rem;
  border: 1px solid rgba(255,255,255,.16);
  background: linear-gradient(150deg, rgba(255,255,255,.09), rgba(255,255,255,.02));
  box-shadow: var(--shadow-float), inset 0 1px 0 rgba(255,255,255,.16);
  border-radius: var(--r-xl);
}
.rf-showcase__stage { position: relative; display: grid; }
.rf-showcase__slide { grid-area: 1 / 1; opacity: 0; transform: translateY(14px); transition: opacity 620ms cubic-bezier(.16,1,.3,1), transform 620ms cubic-bezier(.16,1,.3,1); pointer-events: none; }
.rf-showcase__slide.is-active { opacity: 1; transform: none; pointer-events: auto; }
.rf-showcase__media { display: grid; height: clamp(13rem, 26vw, 19rem); place-items: center; padding: .6rem; background: rgba(255,255,255,.94); }
.rf-showcase__media img { max-height: 100%; object-fit: contain; }
.rf-showcase__ph { display: grid; width: 100%; height: 100%; place-items: center; color: var(--navy-400); background: var(--steel-100); font-family: var(--font-display); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.rf-showcase__body { padding: .95rem .4rem .2rem; }
.rf-showcase__cat { color: var(--lime-400); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.rf-showcase__name { display: block; margin-top: .3rem; color: var(--paper); font-family: var(--font-display); font-size: 1.08rem; font-weight: 800; line-height: 1.3; }
.rf-showcase__specs { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .7rem; list-style: none; }
.rf-showcase__specs li { padding: .28rem .55rem; border: 1px solid rgba(255,255,255,.16); color: var(--steel-300); font-size: .7rem; }
.rf-showcase__foot { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; justify-content: space-between; margin-top: .9rem; padding-top: .8rem; border-top: 1px solid rgba(255,255,255,.12); }
.rf-showcase__price { color: var(--paper); font-family: var(--font-display); font-size: 1.15rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.rf-showcase__price small { display: block; color: var(--steel-500); font-size: .68rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.rf-showcase__link { display: inline-flex; align-items: center; gap: .4rem; color: var(--lime-200); font-family: var(--font-display); font-size: .78rem; font-weight: 800; }
.rf-showcase__dots { display: flex; gap: .35rem; justify-content: center; margin-top: 1rem; }
.rf-showcase__dots button { width: 1.6rem; height: .2rem; padding: 0; border: 0; background: rgba(255,255,255,.22); transition: background 200ms ease; }
.rf-showcase__dots button.is-active { background: var(--lime-400); }

@media (min-width: 64rem) {
  .rf-hero__inner { grid-template-columns: 1.05fr .95fr; align-items: center; padding-block: clamp(4rem, 7vw, 6.5rem); }
  .rf-hero__trust { grid-template-columns: repeat(4, minmax(0,1fr)); }
}

/* ===== Page banner (inner pages) ===== */
.rf-banner { position: relative; overflow: hidden; padding-block: clamp(2.25rem, 5vw, 3.5rem); color: var(--steel-300); background: var(--grad-hero); }
.rf-banner::before { position: absolute; inset: 0; content: ""; background-image: linear-gradient(rgba(141,198,63,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(141,198,63,.05) 1px, transparent 1px); background-size: 42px 42px; mask-image: radial-gradient(circle at 20% 30%, #000, transparent 75%); }
.rf-banner__inner { position: relative; }
.rf-banner h1 { margin-top: .55rem; color: var(--paper); }
.rf-banner p { margin-top: .7rem; color: var(--steel-300); }
.rf-crumbs { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; font-size: .78rem; list-style: none; }
.rf-crumbs a { color: var(--steel-300); }
.rf-crumbs a:hover { color: var(--lime-200); }
.rf-crumbs li:not(:last-child)::after { margin-left: .35rem; color: var(--navy-400); content: "/"; }
.rf-crumbs [aria-current] { color: var(--lime-200); }

/* ===== Category mosaic ===== */
.rf-mosaic { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0,1fr)); }
.rf-tile { position: relative; display: flex; min-height: 8.5rem; flex-direction: column; justify-content: flex-end; padding: 1rem; overflow: hidden; border: 1px solid var(--line); background: var(--paper); box-shadow: inset 0 1px 0 rgba(255,255,255,.7); transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease; }
.rf-tile::before { position: absolute; top: 0; left: 0; width: 0; height: 2px; background: var(--grad-fresh); content: ""; transition: width 260ms cubic-bezier(.16,1,.3,1); }
.rf-tile:hover { transform: translateY(-4px); border-color: var(--steel-300); box-shadow: var(--shadow-surface); }
.rf-tile:hover::before { width: 100%; }
.rf-tile__icon { display: grid; width: 2.6rem; height: 2.6rem; margin-bottom: auto; place-items: center; color: var(--navy-600); border: 1px solid var(--line); background: var(--paper-alt); }
.rf-tile__icon svg { width: 1.35rem; height: 1.35rem; }
.rf-tile__name { margin-top: 1rem; color: var(--ink); font-family: var(--font-display); font-size: .92rem; font-weight: 800; line-height: 1.3; }
.rf-tile__meta { display: flex; align-items: center; justify-content: space-between; margin-top: .35rem; color: var(--muted); font-size: .74rem; }
.rf-tile__meta svg { width: 1rem; height: 1rem; color: var(--leaf-600); transition: transform 200ms ease; }
.rf-tile:hover .rf-tile__meta svg { transform: translateX(3px); }
.rf-tile--feature { grid-column: span 2; min-height: 12rem; color: var(--paper); border-color: transparent; background: var(--grad-steel); }
.rf-tile--feature .rf-tile__icon { color: var(--lime-400); border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.06); }
.rf-tile--feature .rf-tile__name { color: var(--paper); font-size: 1.15rem; }
.rf-tile--feature .rf-tile__meta { color: var(--steel-300); }
@media (min-width: 48rem) {
  .rf-mosaic { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .rf-tile--feature { grid-column: span 2; grid-row: span 2; }
}

/* ===== Value props ===== */
.rf-values { display: grid; gap: 1rem; }
.rf-value { position: relative; padding: clamp(1.35rem, 2.6vw, 1.9rem); border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); box-shadow: var(--shadow-1); transition: transform 220ms cubic-bezier(.16,1,.3,1), box-shadow 220ms ease; }
.rf-value:hover { transform: translateY(-4px); box-shadow: var(--shadow-3); }

.rf-value__icon { display: grid; width: 3.25rem; height: 3.25rem; place-items: center; color: var(--leaf-700); border: 1px solid var(--mint-100); border-radius: var(--r-md); background: var(--mint-50); box-shadow: var(--shadow-1); transition: transform 220ms cubic-bezier(.16,1,.3,1); }
.rf-value:hover .rf-value__icon { transform: translateY(-3px) scale(1.06); }
.rf-value__icon svg { width: 1.45rem; height: 1.45rem; }
.rf-value h3 { margin-top: 1rem; font-size: 1.02rem; }
.rf-value p { margin-top: .5rem; font-size: .9rem; }
@media (min-width: 40rem) { .rf-values { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 64rem) { .rf-values { grid-template-columns: repeat(4, minmax(0,1fr)); } }

/* ===== Machine card ===== */
.rf-cards { display: grid; gap: clamp(.85rem, 2vw, 1.35rem); grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr)); }
.rf-card {
  position: relative; display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--line); background: var(--paper);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
  border-radius: var(--r-lg);
}
.rf-card::before { position: absolute; z-index: 2; bottom: 0; left: 0; width: 0; height: 2px; background: var(--grad-fresh); content: ""; transition: width 300ms cubic-bezier(.16,1,.3,1); }
.rf-card:hover { transform: translateY(-6px); border-color: var(--steel-300); box-shadow: var(--shadow-surface); }
.rf-card:hover::before { width: 100%; }
.rf-card__media { position: relative; display: grid; height: 12.5rem; place-items: center; padding: .85rem; background: var(--paper-alt); border-bottom: 1px solid var(--line); box-shadow: inset 0 2px 12px -6px rgba(11,18,32,.25); }
.rf-card__media img { max-height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.rf-card__ph { display: grid; width: 100%; height: 100%; place-items: center; color: var(--steel-500); background: repeating-linear-gradient(135deg, #EEF2F7 0 10px, #E7ECF3 10px 20px); font-family: var(--font-display); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.rf-card__flag { position: absolute; top: .6rem; left: .6rem; padding: .2rem .45rem; color: var(--paper); background: var(--leaf-700); font-family: var(--font-display); font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.rf-card__body { display: flex; flex: 1; flex-direction: column; padding: .95rem; }
.rf-card__cat { color: var(--muted); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.rf-card__title { margin-top: .3rem; color: var(--ink); font-family: var(--font-display); font-size: .95rem; font-weight: 800; line-height: 1.35; }
.rf-card a.rf-card__title:hover { color: var(--leaf-700); }
.rf-card__specs { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .65rem; list-style: none; }
.rf-card__specs li { padding: .22rem .45rem; color: var(--navy-700); background: var(--steel-100); font-size: .68rem; }
.rf-card__price { display: flex; flex-wrap: wrap; gap: .45rem; align-items: baseline; margin-top: auto; padding-top: .9rem; }
.rf-card__now { color: var(--ink); font-family: var(--font-display); font-size: 1.12rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.rf-card__was { color: var(--muted); font-size: .82rem; text-decoration: line-through; }
.rf-card__off { padding: .12rem .4rem; color: var(--leaf-700); background: rgba(141,198,63,.18); font-size: .68rem; font-weight: 800; }
.rf-card__ask { padding: .3rem .55rem; color: var(--navy-700); border: 1px solid var(--steel-300); background: var(--paper-alt); font-size: .74rem; font-weight: 700; }
.rf-card__actions { display: grid; grid-template-columns: 1fr auto; gap: .4rem; margin-top: .8rem; }
.rf-card__wa { display: grid; width: 3rem; place-items: center; color: var(--leaf-700); border: 1px solid var(--steel-300); background: var(--paper); }
.rf-card__wa:hover { border-color: var(--lime-400); background: var(--paper-alt); }
.rf-card__wa svg { width: 1.15rem; height: 1.15rem; }
.rf-card .rf-btn { min-height: 2.7rem; }

/* ===== Process timeline ===== */
.rf-steps { position: relative; display: grid; gap: 1.25rem; counter-reset: rf-step; }
.rf-steps::before { position: absolute; top: 1.4rem; bottom: 1.4rem; left: 1.4rem; width: 1px; background: repeating-linear-gradient(180deg, var(--steel-300) 0 6px, transparent 6px 12px); content: ""; }
.rf-step { position: relative; display: grid; grid-template-columns: 2.85rem minmax(0,1fr); gap: 1rem; }
.rf-step__num { position: relative; display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: var(--r-pill); color: var(--paper); background: var(--grad-steel); font-family: var(--font-display); font-weight: 800; font-variant-numeric: tabular-nums; box-shadow: 0 0 0 6px var(--paper); }
.rf-step h3 { font-size: 1rem; }
.rf-step p { margin-top: .35rem; font-size: .9rem; }
@media (min-width: 64rem) {
  .rf-steps { grid-template-columns: repeat(5, minmax(0,1fr)); gap: 1rem; }
  .rf-steps::before { top: 1.4rem; right: 1.4rem; bottom: auto; left: 1.4rem; width: auto; height: 1px; background: repeating-linear-gradient(90deg, var(--steel-300) 0 6px, transparent 6px 12px); }
  .rf-step { grid-template-columns: minmax(0,1fr); gap: .9rem; }
}

/* ===== Numbers band ===== */
.rf-band { position: relative; overflow: hidden; padding-block: clamp(2.5rem, 5vw, 3.75rem); color: var(--steel-300); background: var(--navy-900); }
.rf-band::before { position: absolute; inset: 0; content: ""; background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px); background-size: 22px 22px; }
.rf-stats { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1px; background: rgba(255,255,255,.1); }
.rf-stat { padding: 1.1rem .9rem; background: var(--navy-900); text-align: center; }
.rf-stat dt { background: var(--grad-chrome); -webkit-background-clip: text; background-clip: text; color: transparent; font-family: var(--font-display); font-size: clamp(1.9rem, 4.5vw, 2.9rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.05; font-variant-numeric: tabular-nums; }
.rf-stat dd { margin: .3rem 0 0; color: var(--steel-500); font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; }
@media (min-width: 48rem) { .rf-stats { grid-template-columns: repeat(4, minmax(0,1fr)); } }

/* ===== Testimonials ===== */
.rf-quotes { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
.rf-quote { position: relative; display: flex; flex-direction: column; padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); box-shadow: var(--shadow-2), var(--inner-hi); transition: transform 220ms cubic-bezier(.16,1,.3,1), box-shadow 220ms ease; }
.rf-quote:hover { transform: translateY(-4px); box-shadow: var(--shadow-3); }
.rf-quote::before { position: absolute; top: 0; left: 1.6rem; width: 2.5rem; height: 3px; border-radius: 0 0 3px 3px; background: var(--grad-fresh); content: ""; }
.rf-quote__stars { display: flex; gap: .12rem; color: var(--lime-400); }
.rf-quote__stars svg { width: 1rem; height: 1rem; }
.rf-quote blockquote { margin: .85rem 0 0; color: var(--body); font-size: .93rem; line-height: 1.7; }
.rf-quote__who { display: flex; gap: .7rem; align-items: center; margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.rf-quote__ini { display: grid; width: 2.75rem; height: 2.75rem; flex: 0 0 auto; place-items: center; border-radius: var(--r-pill); color: var(--paper); background: var(--grad-steel); font-family: var(--font-display); font-weight: 800; }
.rf-quote__name { color: var(--ink); font-family: var(--font-display); font-size: .88rem; font-weight: 800; }
.rf-quote__org { color: var(--muted); font-size: .78rem; }

/* ===== Article / blog cards ===== */
.rf-posts { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); }
.rf-post { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); box-shadow: var(--shadow-1); transition: transform 220ms cubic-bezier(.16,1,.3,1), box-shadow 220ms ease; }
.rf-post:hover { transform: translateY(-6px); box-shadow: var(--shadow-3); }
.rf-post__media { height: 10rem; background: var(--steel-100); }
.rf-post__media img { width: 100%; height: 100%; object-fit: cover; }
.rf-post__body { display: flex; flex: 1; flex-direction: column; padding: 1rem; }
.rf-post__date { color: var(--muted); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.rf-post h3 { margin-top: .4rem; font-size: 1rem; }
.rf-post p { margin-top: .5rem; font-size: .88rem; }
.rf-post__more { margin-top: auto; padding-top: .9rem; color: var(--leaf-700); font-family: var(--font-display); font-size: .78rem; font-weight: 800; }

/* ===== CTA band ===== */
.rf-cta { position: relative; overflow: hidden; padding-block: clamp(2.5rem, 5vw, 4rem); color: var(--paper); background: var(--grad-steel); }
.rf-cta::before { position: absolute; top: 0; right: 0; left: 0; height: 3px; background: var(--grad-fresh); content: ""; }
.rf-cta__inner { position: relative; display: grid; gap: 1.5rem; align-items: center; }
.rf-cta h2 { color: var(--paper); }
.rf-cta p { margin-top: .6rem; color: var(--steel-300); }
.rf-cta__actions { display: flex; flex-wrap: wrap; gap: .7rem; }
@media (min-width: 56rem) { .rf-cta__inner { grid-template-columns: 1.3fr .7fr; } .rf-cta__actions { justify-content: flex-end; } }

/* ===== Prose (blog body, legal, long copy) ===== */
.rf-prose { max-width: 72ch; }
.rf-prose > * + * { margin-top: 1.1rem; }
.rf-prose h2 { margin-top: 2.2rem; font-size: 1.5rem; }
.rf-prose h3 { margin-top: 1.8rem; font-size: 1.15rem; }
.rf-prose p, .rf-prose li { color: var(--body); }
.rf-prose ul, .rf-prose ol { padding-left: 1.2rem; }
.rf-prose li + li { margin-top: .4rem; }
.rf-prose a { color: var(--leaf-700); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }
.rf-prose blockquote { padding: .8rem 0 .8rem 1.1rem; border-left: 3px solid var(--lime-400); color: var(--ink); font-size: 1.05rem; }
.rf-prose img { margin-block: 1.4rem; border: 1px solid var(--line); }
.rf-prose table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.rf-prose th, .rf-prose td { padding: .6rem .7rem; border: 1px solid var(--line); text-align: left; }
.rf-prose th { background: var(--paper-alt); color: var(--ink); }
.rf-prose code { padding: .1rem .3rem; background: var(--steel-100); font-size: .9em; }

/* ===== FAQ ===== */
.rf-faq { max-width: 52rem; border-top: 1px solid var(--line); }
.rf-faq__item { border-bottom: 1px solid var(--line); }
.rf-faq__q { display: flex; gap: 1rem; align-items: center; justify-content: space-between; padding: 1.05rem .2rem; color: var(--ink); font-family: var(--font-display); font-size: .98rem; font-weight: 700; list-style: none; }
.rf-faq__q::-webkit-details-marker { display: none; }
.rf-faq__q svg { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; color: var(--leaf-600); transition: transform 200ms ease; }
.rf-faq__item[open] .rf-faq__q svg { transform: rotate(45deg); }
.rf-faq__a { padding: 0 .2rem 1.15rem; color: var(--body); font-size: .93rem; }

/* ===== Spec table ===== */
.rf-specs-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); }
.rf-specs { width: 100%; min-width: 30rem; border-collapse: collapse; font-size: .9rem; font-variant-numeric: tabular-nums; }
.rf-specs th, .rf-specs td { padding: .7rem .85rem; border-bottom: 1px solid var(--line); text-align: left; }
.rf-specs thead th { color: var(--ink); background: var(--paper-alt); font-family: var(--font-display); font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; }
.rf-specs tbody tr:nth-child(even) { background: var(--paper-alt); }
.rf-specs th[scope="row"] { position: sticky; left: 0; color: var(--ink); background: var(--paper); font-weight: 700; }
.rf-specs tbody tr:nth-child(even) th[scope="row"] { background: var(--paper-alt); }

/* ===== Product page ===== */
.rf-pdp { display: grid; gap: clamp(1.5rem, 4vw, 2.75rem); }
.rf-pdp__gallery { display: grid; gap: .6rem; align-content: start; }
.rf-pdp__main { position: relative; display: grid; height: clamp(16rem, 42vw, 28rem); place-items: center; padding: 1rem; border: 1px solid var(--line); background: var(--paper-alt); box-shadow: inset 0 2px 16px -8px rgba(11,18,32,.28); }
.rf-pdp__main img { max-height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.rf-pdp__thumbs { display: flex; gap: .5rem; overflow-x: auto; padding-bottom: .2rem; }
.rf-pdp__thumb { display: grid; width: 4.6rem; height: 4.6rem; flex: 0 0 auto; place-items: center; padding: .3rem; border: 1px solid var(--line); background: var(--paper); }
.rf-pdp__thumb.is-active { border-color: var(--leaf-500); box-shadow: 0 0 0 2px rgba(76,175,47,.25); }
.rf-pdp__thumb img { max-height: 100%; object-fit: contain; }
.rf-pdp__cat { color: var(--leaf-700); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.rf-pdp h1 { margin-top: .5rem; }
.rf-pdp__benefit { margin-top: .75rem; font-size: 1.02rem; }
.rf-pdp__price { display: flex; flex-wrap: wrap; gap: .6rem; align-items: baseline; margin-top: 1.25rem; padding: 1rem; border: 1px solid var(--line); background: var(--paper-alt); }
.rf-pdp__now { color: var(--ink); font-family: var(--font-display); font-size: 1.9rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.rf-pdp__was { color: var(--muted); font-size: 1rem; text-decoration: line-through; }
.rf-pdp__off { padding: .2rem .5rem; color: var(--paper); background: var(--leaf-600); font-size: .76rem; font-weight: 800; }
.rf-pdp__gst { flex-basis: 100%; color: var(--muted); font-size: .78rem; }
.rf-pdp__chips { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 1px; margin-top: 1.25rem; background: var(--line); border: 1px solid var(--line); }
.rf-pdp__chip { padding: .6rem .7rem; background: var(--paper); }
.rf-pdp__chip span { display: block; color: var(--muted); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.rf-pdp__chip strong { display: block; margin-top: .1rem; color: var(--ink); font-size: .86rem; }
.rf-pdp__cta { display: grid; gap: .55rem; margin-top: 1.35rem; }
.rf-pdp__cta-split { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.rf-pdp__trust { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; margin-top: 1.35rem; padding-top: 1.25rem; border-top: 1px solid var(--line); list-style: none; }
.rf-pdp__trust li { display: grid; grid-template-columns: 1.15rem minmax(0,1fr); gap: .5rem; color: var(--body); font-size: .82rem; }
.rf-pdp__trust svg { width: 1.05rem; height: 1.05rem; color: var(--leaf-600); }
@media (min-width: 64rem) { .rf-pdp { grid-template-columns: 1.05fr .95fr; } }

.rf-tabs { display: flex; gap: .3rem; overflow-x: auto; margin-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.rf-tabs a { padding: .75rem .9rem; border-bottom: 2px solid transparent; color: var(--body); font-family: var(--font-display); font-size: .82rem; font-weight: 700; white-space: nowrap; }
.rf-tabs a:hover { color: var(--leaf-700); border-bottom-color: var(--lime-400); }
.rf-anchor { scroll-margin-top: 6rem; }

.rf-video { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--navy-900); }
.rf-video iframe, .rf-video img { width: 100%; height: 100%; border: 0; object-fit: cover; }
.rf-video__play { position: absolute; inset: 0; display: grid; place-items: center; width: 100%; background: rgba(11,18,32,.35); }
.rf-video__play span { display: grid; width: 4rem; height: 4rem; place-items: center; border: 2px solid var(--paper); border-radius: 50%; color: var(--paper); background: rgba(11,18,32,.5); }
.rf-video__play svg { width: 1.6rem; height: 1.6rem; }

/* Sticky mobile buy bar on product pages */
.rf-buybar { position: fixed; z-index: 190; right: 0; bottom: 3.9rem; left: 0; display: none; grid-template-columns: minmax(0,1fr) auto; gap: .6rem; align-items: center; padding: .55rem var(--gutter); border-top: 1px solid var(--steel-300); background: rgba(255,255,255,.97); box-shadow: 0 -10px 28px -18px rgba(11,18,32,.65); backdrop-filter: blur(12px); }
.rf-buybar.is-on { display: grid; }
.rf-buybar__price { color: var(--ink); font-family: var(--font-display); font-size: 1.05rem; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.rf-buybar__price small { display: block; color: var(--muted); font-size: .68rem; font-weight: 500; }
@media (min-width: 48rem) { .rf-buybar { bottom: 0; } .rf-buybar.is-on { display: none; } }

/* ===== Listing toolbar / filters ===== */
.rf-toolbar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.rf-toolbar__count { color: var(--muted); font-size: .86rem; }
.rf-toolbar__count strong { color: var(--ink); }
.rf-filters { display: grid; gap: .55rem; align-content: start; }
.rf-filters__group { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper); overflow: hidden; }
.rf-filters__group > summary { display: flex; align-items: center; justify-content: space-between; padding: .8rem .9rem; color: var(--ink); font-family: var(--font-display); font-size: .85rem; font-weight: 800; list-style: none; }
.rf-filters__group > summary::-webkit-details-marker { display: none; }
.rf-filters__group > summary svg { width: 1rem; transition: transform 200ms ease; }
.rf-filters__group[open] > summary svg { transform: rotate(180deg); }
.rf-filters__list { display: grid; gap: .1rem; padding: 0 .5rem .6rem; list-style: none; }
.rf-filters__list a { display: flex; align-items: center; justify-content: space-between; padding: .5rem .45rem; color: var(--body); font-size: .85rem; }
.rf-filters__list a:hover { color: var(--leaf-700); background: var(--paper-alt); }
.rf-filters__list a[aria-current] { color: var(--leaf-700); background: rgba(141,198,63,.12); font-weight: 700; }
.rf-filters__list span { color: var(--muted); font-size: .74rem; font-variant-numeric: tabular-nums; }
.rf-layout { display: grid; gap: clamp(1.25rem, 3vw, 2rem); }
@media (min-width: 64rem) { .rf-layout { grid-template-columns: 15.5rem minmax(0,1fr); align-items: start; } .rf-layout__aside { position: sticky; top: 6rem; } }

.rf-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .85rem; border: 1px solid var(--steel-300); border-radius: var(--r-pill); background: var(--paper); color: var(--navy-800); font-size: .8rem; transition: border-color 180ms ease, color 180ms ease; }
.rf-chip:hover { color: var(--leaf-700); border-color: var(--lime-400); }
.rf-chips { display: flex; flex-wrap: wrap; gap: .4rem; }

.rf-pager { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: center; margin-top: 2.25rem; }
.rf-pager a, .rf-pager span { display: grid; min-width: 2.6rem; height: 2.6rem; place-items: center; padding-inline: .6rem; border: 1px solid var(--line); border-radius: var(--r-md); color: var(--navy-800); font-size: .86rem; font-variant-numeric: tabular-nums; }
.rf-pager a:hover { border-color: var(--lime-400); color: var(--leaf-700); }
.rf-pager [aria-current] { color: var(--paper); border-color: transparent; background: var(--grad-fresh); font-weight: 800; }

.rf-empty { padding: clamp(2rem, 6vw, 4rem) 1rem; border: 1px dashed var(--steel-300); border-radius: var(--r-lg); background: var(--paper-alt); text-align: center; }
.rf-empty svg { width: 2.5rem; height: 2.5rem; margin: 0 auto 1rem; color: var(--steel-500); }
.rf-empty p { margin: .5rem auto 0; }

/* ===== Gallery ===== */
.rf-gallery { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); }
.rf-gallery button { position: relative; display: block; padding: 0; overflow: hidden; aspect-ratio: 4 / 3; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--steel-100); box-shadow: var(--shadow-1); }
.rf-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform 400ms cubic-bezier(.16,1,.3,1); }
.rf-gallery button:hover img { transform: scale(1.04); }
.rf-gallery figcaption { position: absolute; right: 0; bottom: 0; left: 0; padding: .5rem .6rem; color: var(--paper); background: linear-gradient(transparent, rgba(11,18,32,.85)); font-size: .78rem; text-align: left; }
.rf-lightbox { width: min(100% - 2rem, 60rem); padding: 0; border: 0; background: transparent; }
.rf-lightbox::backdrop { background: rgba(11,18,32,.88); }
.rf-lightbox img { width: 100%; max-height: 80dvh; object-fit: contain; }
.rf-lightbox__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .6rem; color: var(--paper); font-size: .85rem; }
.rf-lightbox__nav { display: flex; gap: .4rem; }
.rf-lightbox__nav button { display: grid; width: 2.6rem; height: 2.6rem; place-items: center; color: var(--paper); border: 1px solid rgba(255,255,255,.35); background: transparent; }

/* ===== Contact ===== */
.rf-contact { display: grid; gap: clamp(1.5rem, 4vw, 2.5rem); }
.rf-contact__methods { display: grid; gap: .6rem; align-content: start; }
.rf-method { display: grid; grid-template-columns: 3rem minmax(0,1fr); gap: .9rem; padding: 1.1rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper); box-shadow: var(--shadow-1); transition: border-color 200ms ease, transform 200ms cubic-bezier(.16,1,.3,1), box-shadow 200ms ease; }
.rf-method:hover { transform: translateY(-3px); border-color: var(--lime-400); box-shadow: var(--shadow-3); }
.rf-method__icon { display: grid; width: 3rem; height: 3rem; place-items: center; color: var(--leaf-700); border: 1px solid var(--mint-100); border-radius: var(--r-md); background: var(--mint-50); }
.rf-method__icon svg { width: 1.3rem; height: 1.3rem; }
/* Scoped to the label only. This used to be `.rf-method span`, which also hit the
   wrapper span — so uppercase was inherited by the value and every phone number,
   email and the full address rendered in shouty all-caps. */
.rf-method__label { display: block; color: var(--muted); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.rf-method__value { display: block; margin-top: .2rem; color: var(--ink); font-size: .95rem; font-weight: 700; text-transform: none; }
.rf-method__value--sm { font-size: .86rem; font-weight: 600; line-height: 1.55; }
.rf-method a.rf-method__value:hover { color: var(--leaf-700); }
.rf-map { aspect-ratio: 21 / 9; min-height: 16rem; border: 1px solid var(--line); }
.rf-map iframe { width: 100%; height: 100%; border: 0; }
@media (min-width: 56rem) { .rf-contact { grid-template-columns: 1.15fr .85fr; } }

/* ===== Alerts ===== */
.rf-alert { display: grid; grid-template-columns: 1.25rem minmax(0,1fr); gap: .6rem; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper-alt); font-size: .88rem; }
.rf-alert svg { width: 1.15rem; height: 1.15rem; margin-top: .1rem; }
.rf-alert--ok { border-color: var(--lime-400); background: rgba(141,198,63,.12); color: var(--leaf-700); }
.rf-alert--bad { border-color: #F0A6A0; background: #FEF3F2; color: #B42318; }

/* ===== Chat panel ===== */
.rf-chat { position: fixed; z-index: 260; right: 1rem; bottom: 5.4rem; display: flex; width: min(23rem, calc(100vw - 2rem)); max-height: min(32rem, calc(100dvh - 8rem)); flex-direction: column; overflow: hidden; border: 1px solid var(--steel-300); background: var(--paper); box-shadow: var(--shadow-float); }
.rf-chat[hidden] { display: none; }
.rf-chat__head { display: flex; align-items: center; justify-content: space-between; padding: .7rem .8rem; color: var(--paper); background: var(--grad-steel); }
.rf-chat__id { display: flex; gap: .6rem; align-items: center; font-size: .85rem; }
.rf-chat__id strong { display: block; color: var(--paper); font-family: var(--font-display); }
.rf-chat__avatar { display: grid; width: 2.1rem; height: 2.1rem; place-items: center; border-radius: 50%; color: var(--navy-900); background: var(--lime-400); font-family: var(--font-display); font-weight: 800; }
.rf-chat__status { color: var(--lime-200); font-size: .7rem; }
.rf-chat__close { width: 2.1rem; height: 2.1rem; color: var(--paper); border-color: rgba(255,255,255,.28); background: transparent; }
.rf-chat__close svg { width: 1rem; height: 1rem; }
.rf-chat__log { display: grid; gap: .5rem; flex: 1; padding: .8rem; overflow-y: auto; align-content: start; background: var(--paper-alt); }
.rf-chat__msg { max-width: 85%; padding: .6rem .8rem; border-radius: var(--r-md); font-size: .86rem; line-height: 1.55; white-space: pre-wrap; }
.rf-chat__msg--bot { justify-self: start; color: var(--ink); border: 1px solid var(--line); background: var(--paper); }
.rf-chat__msg--me { justify-self: end; color: var(--paper); background: var(--navy-700); }
.rf-chat__msg a { color: var(--leaf-700); text-decoration: underline; }
.rf-chat__msg--me a { color: var(--lime-200); }
.rf-chat__chips { display: flex; gap: .35rem; padding: .5rem .8rem 0; overflow-x: auto; }
.rf-chat__chips .rf-chip { flex: 0 0 auto; font-size: .74rem; }
.rf-chat__form { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .4rem; padding: .7rem .8rem; }
.rf-chat__form .rf-input { min-height: 2.75rem; }
.rf-chat__form .rf-btn { min-height: 2.75rem; padding-inline: .9rem; }
.rf-chat__foot { display: flex; gap: 1rem; justify-content: center; padding: 0 .8rem .7rem; font-size: .78rem; }
.rf-chat__foot a { color: var(--leaf-700); font-weight: 700; }
.rf-chat__typing span { display: inline-block; width: .35rem; height: .35rem; margin-right: .15rem; border-radius: 50%; background: var(--steel-500); animation: rf-typing 1.2s infinite; }
.rf-chat__typing span:nth-child(2) { animation-delay: .18s; }
.rf-chat__typing span:nth-child(3) { animation-delay: .36s; }
@keyframes rf-typing { 0%,60%,100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
@media (min-width: 48rem) { .rf-chat { right: 1.5rem; bottom: 1.5rem; } }

/* ===== Misc ===== */
.rf-plate { padding: clamp(1.35rem, 3vw, 2.1rem); border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); box-shadow: var(--shadow-2), var(--inner-hi); }
.rf-plate--alt { background: var(--paper-alt); }
.rf-rule { width: 4rem; height: .2rem; margin-top: 1.25rem; background: var(--grad-fresh); }
.rf-split { display: grid; gap: clamp(1.5rem, 4vw, 2.75rem); }
@media (min-width: 56rem) { .rf-split { grid-template-columns: repeat(2, minmax(0,1fr)); align-items: center; } }
.rf-media-frame { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--steel-100); aspect-ratio: 4 / 3; box-shadow: var(--shadow-2); }
.rf-media-frame img { width: 100%; height: 100%; object-fit: cover; }

.rf-timeline { display: grid; gap: 1.25rem; padding-left: 1.4rem; border-left: 1px solid var(--steel-300); list-style: none; }
.rf-timeline li { position: relative; }
.rf-timeline li::before { position: absolute; top: .35rem; left: -1.75rem; width: .7rem; height: .7rem; background: var(--grad-fresh); content: ""; }
.rf-timeline h3 { font-size: 1rem; }
.rf-timeline time { color: var(--leaf-700); font-family: var(--font-display); font-size: .8rem; font-weight: 800; }

/* ================================================================
   V2 — depth, float and life. Overrides the flat first pass.
   ================================================================ */

/* ---- Floating decorative accents ---- */
@keyframes rf-float { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-14px) } }
@keyframes rf-float-slow { 0%,100% { transform: translateY(0) rotate(0) } 50% { transform: translateY(-22px) rotate(4deg) } }
@keyframes rf-drift { 0% { background-position: 0 0 } 100% { background-position: 46px 46px } }
@keyframes rf-spin { to { transform: rotate(360deg) } }
.rf-float { animation: rf-float 7s ease-in-out infinite; }
.rf-float--slow { animation: rf-float-slow 11s ease-in-out infinite; }
.rf-float--d1 { animation-delay: -2s; }
.rf-float--d2 { animation-delay: -4s; }
.rf-float--d3 { animation-delay: -6s; }

/* ---- Section tint rhythm ---- */
.rf-section--alt { background: var(--mint-50); }
.rf-section--tint { background: linear-gradient(180deg, var(--paper) 0%, var(--mint-50) 100%); }

/* ---- Eyebrow as a pill ---- */
.rf-eyebrow {
  padding: .4rem .85rem;
  border: 1px solid var(--mint-100);
  border-radius: var(--r-pill);
  background: var(--mint-50);
  letter-spacing: .08em;
}
.rf-eyebrow::before { width: .45rem; height: .45rem; border-radius: 50%; background: var(--leaf-500); }

/* ---- Button arrow badge ---- */
.rf-btn__arrow {
  display: grid;
  width: 1.5rem;
  height: 1.5rem;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  transition: transform 220ms cubic-bezier(.16,1,.3,1);
}
.rf-btn__arrow svg { width: .8rem; height: .8rem; }
.rf-btn:hover .rf-btn__arrow { transform: translateX(3px); }
.rf-btn--secondary .rf-btn__arrow { background: var(--mint-100); color: var(--leaf-700); }

/* ================= HERO ================= */
.rf-hero::before { animation: rf-drift 22s linear infinite; }
.rf-hero__gear { animation: rf-spin 90s linear infinite; }
.rf-hero__glow {
  position: absolute; pointer-events: none; border-radius: 50%;
  filter: blur(70px); opacity: .5;
}
.rf-hero__glow--a { top: -6rem; left: -4rem; width: 26rem; height: 26rem; background: radial-gradient(circle, rgba(76,175,47,.5), transparent 70%); }
.rf-hero__glow--b { right: -6rem; bottom: -8rem; width: 30rem; height: 30rem; background: radial-gradient(circle, rgba(44,68,112,.75), transparent 70%); }

.rf-hero__chip { backdrop-filter: blur(8px); background: rgba(255,255,255,.06); }

/* Showcase plate: rounded, glassy, with floating spec cards over the photo */
.rf-showcase__plate {
  border-radius: var(--r-xl);
  padding: 1.1rem;
  backdrop-filter: blur(10px);
}
.rf-showcase__media {
  position: relative;
  height: auto;
  aspect-ratio: 4 / 3;
  overflow: hidden;              /* image could previously spill over the caption */
  border-radius: var(--r-lg);
  padding: 1rem;
}
.rf-showcase__media img { width: 100%; height: 100%; object-fit: contain; }
.rf-showcase__body { padding: 1.1rem .35rem .2rem; }
.rf-showcase__specs li { border-radius: var(--r-pill); background: rgba(255,255,255,.06); }
.rf-showcase__dots button { border-radius: var(--r-pill); }
.rf-showcase__link {
  padding: .5rem .9rem;
  border: 1px solid rgba(141,198,63,.4);
  border-radius: var(--r-pill);
  transition: background 200ms ease, transform 200ms ease;
}
.rf-showcase__link:hover { background: rgba(141,198,63,.14); transform: translateX(2px); }

/* Floating badge that overlaps the machine photo — the layered look from the refs */
.rf-showcase__badge {
  position: absolute;
  z-index: 2;
  left: -.6rem;
  bottom: 1.1rem;
  display: grid;
  gap: .1rem;
  padding: .65rem .9rem;
  border-radius: var(--r-md);
  color: var(--paper);
  background: linear-gradient(135deg, #2E7D1E, #4CAF2F);
  box-shadow: var(--shadow-3);
}
.rf-showcase__badge b { font-family: var(--font-display); font-size: 1.05rem; line-height: 1; font-variant-numeric: tabular-nums; }
.rf-showcase__badge span { font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }

.rf-showcase__trust {
  position: absolute;
  z-index: 2;
  right: -.5rem;
  top: 1.1rem;
  display: flex;
  gap: .4rem;
  align-items: center;
  padding: .5rem .8rem;
  border-radius: var(--r-pill);
  color: var(--ink);
  background: var(--paper);
  box-shadow: var(--shadow-3);
  font-family: var(--font-display);
  font-size: .72rem;
  font-weight: 700;
}
.rf-showcase__trust svg { width: .95rem; height: .95rem; color: var(--leaf-600); }

.rf-hero__trust {
  gap: .6rem;
  border: 0;
  background: transparent;
}
.rf-hero__trust div {
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--r-md);
  background: rgba(255,255,255,.05);
  backdrop-filter: blur(6px);
  transition: background 220ms ease, transform 220ms cubic-bezier(.16,1,.3,1);
}
.rf-hero__trust div:hover { background: rgba(255,255,255,.1); transform: translateY(-3px); }

/* ================= CATEGORY TILES ================= */
.rf-mosaic { gap: 1rem; }
.rf-tile {
  min-height: 10.5rem;
  padding: 1.1rem;
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-1);
  overflow: hidden;
}
.rf-tile::before { display: none; }
.rf-tile:hover { transform: translateY(-6px); box-shadow: var(--shadow-3); }
.rf-tile__photo {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: .16;
  transition: transform 500ms cubic-bezier(.16,1,.3,1), opacity 300ms ease;
}
.rf-tile:hover .rf-tile__photo { transform: scale(1.07); opacity: .24; }
.rf-tile > * { position: relative; z-index: 1; }
.rf-tile__icon {
  width: 3rem; height: 3rem;
  border-radius: var(--r-md);
  border-color: var(--mint-100);
  background: var(--mint-50);
  color: var(--leaf-700);
  box-shadow: var(--shadow-1);
  transition: transform 260ms cubic-bezier(.16,1,.3,1);
}
.rf-tile:hover .rf-tile__icon { transform: translateY(-3px) scale(1.07); }
.rf-tile__count {
  display: inline-flex;
  padding: .2rem .6rem;
  border-radius: var(--r-pill);
  background: var(--mint-100);
  color: var(--leaf-700);
  font-size: .7rem;
  font-weight: 700;
}
.rf-tile--feature { min-height: 15rem; }
.rf-tile--feature .rf-tile__photo { opacity: .3; }
.rf-tile--feature:hover .rf-tile__photo { opacity: .4; }
.rf-tile--feature .rf-tile__icon { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.1); color: var(--lime-400); }
.rf-tile--feature .rf-tile__count { background: rgba(255,255,255,.16); color: var(--lime-200); }

/* ================= MACHINE CARD ================= */
.rf-card { border-radius: var(--r-lg); box-shadow: var(--shadow-1); }
.rf-card::before { display: none; }
.rf-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-4); border-color: var(--mint-100); }
.rf-card__media {
  height: 13rem;
  border-bottom: 0;
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  background: linear-gradient(160deg, #FFFFFF 0%, var(--mint-50) 100%);
  box-shadow: none;
}
.rf-card__media img { transition: transform 420ms cubic-bezier(.16,1,.3,1); }
.rf-card:hover .rf-card__media img { transform: scale(1.06); }
.rf-card__flag {
  top: .75rem; left: .75rem;
  padding: .28rem .6rem;
  border-radius: var(--r-pill);
  box-shadow: var(--shadow-2);
}
/* price lifted onto the image edge — the overlapping-card look from the refs */
.rf-card__price {
  position: relative;
  z-index: 2;
  margin-top: -1.6rem;
  margin-bottom: .6rem;
  align-self: flex-start;
  padding: .5rem .8rem;
  padding-top: .55rem;
  border-radius: var(--r-md);
  background: var(--paper);
  box-shadow: var(--shadow-2);
}
.rf-card__body { padding: 1.05rem; }
.rf-card__specs li { border-radius: var(--r-pill); background: var(--mint-50); color: var(--leaf-700); }
.rf-card__ask { border-radius: var(--r-pill); }
.rf-card__off { border-radius: var(--r-pill); }
.rf-card__wa {
  width: 2.9rem;
  border-radius: var(--r-pill);
  transition: transform 200ms ease, background 200ms ease, color 200ms ease;
}
.rf-card__wa:hover { transform: translateY(-2px); background: #25D366; border-color: #25D366; color: #fff; }
.rf-card .rf-btn { min-height: 2.85rem; }

/* ================= CHECKERBOARD STATS ================= */
.rf-stats { gap: 1rem; background: transparent; }
.rf-stat {
  padding: 1.5rem 1.1rem;
  border-radius: var(--r-lg);
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  transition: transform 260ms cubic-bezier(.16,1,.3,1);
}
.rf-stat:hover { transform: translateY(-5px); }
.rf-stat:nth-child(2) { background: linear-gradient(140deg, #3D9B28, #8DC63F); border-color: transparent; }
.rf-stat:nth-child(2) dt { background: none; -webkit-text-fill-color: #fff; color: #fff; }
.rf-stat:nth-child(2) dd { color: rgba(255,255,255,.85); }
.rf-stat:nth-child(3) { background: var(--paper); border-color: transparent; }
.rf-stat:nth-child(3) dt { background: none; -webkit-text-fill-color: var(--navy-800); color: var(--navy-800); }
.rf-stat:nth-child(3) dd { color: var(--muted); }

/* ================= STEPS ================= */
.rf-step__num { box-shadow: 0 0 0 6px var(--mint-50), var(--shadow-2); }
.rf-section--alt .rf-step__num { box-shadow: 0 0 0 6px var(--mint-50), var(--shadow-2); }

/* ================= CTA ================= */
.rf-cta { border-radius: var(--r-xl); margin-inline: var(--gutter); overflow: hidden; }
.rf-cta__glow { position: absolute; right: -5rem; top: -5rem; width: 22rem; height: 22rem; border-radius: 50%; background: radial-gradient(circle, rgba(141,198,63,.35), transparent 70%); filter: blur(50px); pointer-events: none; }
@media (min-width: 88rem) { .rf-cta { margin-inline: auto; max-width: var(--container); } }

/* ================= FOOTER ================= */
.rf-footer { border-radius: var(--r-xl) var(--r-xl) 0 0; margin-top: 2rem; overflow: hidden; }
.rf-footer__brand { border-radius: var(--r-md); }
.rf-footer__social a { border-radius: var(--r-pill); transition: transform 200ms ease, border-color 200ms ease, color 200ms ease; }
.rf-footer__social a:hover { transform: translateY(-3px); }
.rf-footer__form .rf-input { border-radius: var(--r-pill); }

/* ================= HEADER ================= */
.rf-mainbar.is-condensed { border-radius: 0 0 var(--r-lg) var(--r-lg); }
.rf-nav-link, .rf-nav-summary { border-radius: var(--r-pill); transition: background 200ms ease, color 200ms ease; }
.rf-nav-link:hover, .rf-nav-summary:hover { background: var(--mint-50); }
.rf-icon-btn:hover { transform: translateY(-2px); }
.rf-drawer__panel { border-radius: var(--r-xl) 0 0 var(--r-xl); }
.rf-drawer__link, .rf-drawer__summary { border-radius: var(--r-md); padding-inline: .6rem; }

/* ================= PDP ================= */
.rf-pdp__main { border-radius: var(--r-lg); background: linear-gradient(160deg, #FFFFFF, var(--mint-50)); }
.rf-pdp__thumb { border-radius: var(--r-md); }
.rf-pdp__price { border-radius: var(--r-lg); background: linear-gradient(135deg, var(--mint-50), var(--paper)); border-color: var(--mint-100); }
.rf-pdp__off { border-radius: var(--r-pill); }
.rf-pdp__chips { gap: .6rem; background: transparent; border: 0; }
.rf-pdp__chip { border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow-1); }
.rf-buybar { border-radius: var(--r-lg) var(--r-lg) 0 0; }
.rf-tabs a { border-radius: var(--r-pill) var(--r-pill) 0 0; }

/* ================= FAQ ================= */
.rf-faq { border-top: 0; }
.rf-faq__item { margin-bottom: .6rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper); box-shadow: var(--shadow-1); }
.rf-faq__q { padding: 1.05rem 1.1rem; }
.rf-faq__a { padding: 0 1.1rem 1.15rem; }
.rf-faq__item[open] { border-color: var(--mint-100); box-shadow: var(--shadow-2); }

/* ================= CHAT ================= */
.rf-chatbot__button { box-shadow: var(--shadow-4); }
.rf-chatbot__tip { border-radius: var(--r-md); }
.rf-chat__foot a { padding: .3rem .7rem; border-radius: var(--r-pill); background: var(--mint-50); }

/* ---- Reduced motion: stop the decorative loops entirely ---- */
@media (prefers-reduced-motion: reduce) {
  .rf-float, .rf-float--slow, .rf-hero__gear, .rf-hero::before,
  .rf-showcase__slide { animation: none !important; }
}

/* ================================================================
   V5 — search bar, smaller logos, filter rail, review slider,
        mobile product grid. Driven by owner feedback on v4.
   ================================================================ */

/* ---- Always-on search in the header ---- */
.rf-search {
  position: relative;
  display: flex;
  align-items: center;
  order: 3;
  flex: 1 1 100%;
  max-width: none;
  margin-top: .55rem;
  padding: 0;
  border: 0;
  box-shadow: none;
  inset: auto;
}
.rf-search__icon {
  position: absolute;
  left: .9rem;
  width: 1.05rem;
  height: 1.05rem;
  color: var(--muted);
  pointer-events: none;
}
.rf-search .rf-input {
  min-height: 2.85rem;
  padding-left: 2.6rem;
  padding-right: 3.1rem;
  border-radius: var(--r-pill);
  background: var(--paper-alt);
}
.rf-search .rf-input:focus { background: var(--paper); }
.rf-search__go {
  position: absolute;
  right: .3rem;
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: var(--paper);
  background: var(--grad-fresh);
  box-shadow: var(--glow-green);
  transition: transform 180ms ease;
}
.rf-search__go:hover { transform: translateX(2px); }
.rf-search__go svg { width: 1rem; height: 1rem; }

/* Smart-search live results */
.rf-search__results {
  position: absolute;
  z-index: 60;
  top: calc(100% + .4rem);
  right: 0;
  left: 0;
  max-height: 22rem;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--paper);
  box-shadow: var(--shadow-4);
}
.rf-search__results[hidden] { display: none; }
.rf-search__hit {
  display: grid;
  grid-template-columns: 2.75rem minmax(0,1fr) auto;
  gap: .7rem;
  align-items: center;
  padding: .55rem .7rem;
  border-bottom: 1px solid var(--line);
}
.rf-search__hit:last-child { border-bottom: 0; }
.rf-search__hit:hover, .rf-search__hit:focus-visible { background: var(--mint-50); }
.rf-search__hit img { width: 2.75rem; height: 2.75rem; object-fit: contain; background: var(--paper-alt); border-radius: var(--r-sm); }
.rf-search__hit b { display: block; color: var(--ink); font-family: var(--font-display); font-size: .84rem; font-weight: 700; line-height: 1.3; }
.rf-search__hit small { color: var(--muted); font-size: .72rem; }
.rf-search__hit span { color: var(--leaf-700); font-family: var(--font-display); font-size: .82rem; font-weight: 700; white-space: nowrap; }
.rf-search__none { padding: .9rem; color: var(--muted); font-size: .85rem; text-align: center; }

@media (min-width: 64rem) {
  .rf-search { order: 0; flex: 1 1 auto; max-width: 26rem; margin: 0 1rem; }
}

/* ---- Logos: they were oversized in the drawer and footer ---- */
.rf-drawer__brand { width: 8rem; padding: .3rem .45rem; border-radius: var(--r-sm); }
.rf-footer__brand { width: min(100%, 11rem); padding: .45rem .6rem; border-radius: var(--r-md); }
.rf-brand { width: clamp(8rem, 13vw, 11.5rem); }

/* ---- Machine filter rail: every machine name, one tap to filter ---- */
.rf-filterbar { margin-bottom: clamp(1.25rem, 3vw, 2rem); }
.rf-filterbar__row {
  display: flex;
  gap: .45rem;
  overflow-x: auto;
  padding-bottom: .5rem;
  scrollbar-width: thin;
  scroll-snap-type: x proximity;
}
.rf-filterbar__row::-webkit-scrollbar { height: 5px; }
.rf-filterbar__row::-webkit-scrollbar-thumb { background: var(--steel-300); border-radius: 99px; }
.rf-filterbar .rf-chip { flex: 0 0 auto; scroll-snap-align: start; font-weight: 600; }
.rf-filterbar .rf-chip[aria-current] {
  color: var(--paper);
  border-color: transparent;
  background: var(--grad-steel);
}
.rf-filterbar .rf-chip b { font-weight: 700; opacity: .6; font-size: .72rem; }
.rf-filterbar__more {
  display: grid;
  gap: .4rem;
  grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
  margin-top: .6rem;
  padding: .8rem;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--paper-alt);
}
.rf-filterbar__more a { padding: .4rem .5rem; border-radius: var(--r-sm); color: var(--body); font-size: .82rem; }
.rf-filterbar__more a:hover { color: var(--leaf-700); background: var(--paper); }

/* ---- Product cards: uniform imagery, 2-up on phones, whole card clickable ---- */
.rf-cards { grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr)); }
@media (max-width: 47.99rem) {
  .rf-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
  .rf-card__media { height: 8.5rem; padding: .5rem; }
  .rf-card__body { padding: .7rem; }
  .rf-card__title { font-size: .82rem; }
  .rf-card__cat { font-size: .6rem; }
  .rf-card__now { font-size: .95rem; }
  .rf-card__was { font-size: .72rem; }
  .rf-card__off { font-size: .6rem; }
  .rf-card__price { margin-top: -1.2rem; padding: .4rem .6rem; }
  .rf-card__specs { display: none; }
  .rf-card__actions { grid-template-columns: 1fr auto; gap: .3rem; }
  .rf-card .rf-btn { min-height: 2.5rem; padding-inline: .6rem; font-size: .72rem; }
  .rf-card__wa { width: 2.5rem; }
  .rf-card__flag { font-size: .55rem; padding: .2rem .45rem; }
}
/* The whole card is a link; inner buttons sit above it */
.rf-card__link { position: absolute; inset: 0; z-index: 1; }
.rf-card__body > *, .rf-card__flag { position: relative; z-index: 2; }
.rf-card__actions { position: relative; z-index: 3; }
.rf-card:focus-within { border-color: var(--leaf-500); box-shadow: var(--shadow-3); }

/* ---- Category mosaic: calmer on phones, photo less dominant ---- */
@media (max-width: 47.99rem) {
  .rf-mosaic { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .65rem; }
  .rf-tile { min-height: 8.25rem; padding: .8rem; }
  .rf-tile--feature { grid-column: span 2; min-height: 9.5rem; }
  .rf-tile__icon { width: 2.4rem; height: 2.4rem; }
  .rf-tile__icon svg { width: 1.15rem; height: 1.15rem; }
  .rf-tile__name { margin-top: .7rem; font-size: .8rem; }
  .rf-tile__photo { opacity: .1; }
  .rf-tile--feature .rf-tile__photo { opacity: .2; }
  .rf-tile__count { font-size: .62rem; }
}

/* ---- Review slider: auto-loop, swipeable, click to expand ---- */
.rf-reviews { position: relative; }
.rf-reviews__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  padding: .35rem .25rem 1rem;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.rf-reviews__track::-webkit-scrollbar { display: none; }
.rf-reviews__track > * {
  flex: 0 0 min(21rem, 82vw);
  scroll-snap-align: center;
}
.rf-reviews .rf-quote { cursor: pointer; height: 100%; }
.rf-reviews blockquote {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rf-reviews__nav { display: flex; gap: .4rem; justify-content: center; margin-top: .25rem; }
.rf-reviews__nav button {
  display: grid;
  width: 2.6rem;
  height: 2.6rem;
  place-items: center;
  border: 1px solid var(--steel-300);
  border-radius: 50%;
  color: var(--navy-800);
  background: var(--paper);
  transition: transform 180ms ease, border-color 180ms ease, color 180ms ease;
}
.rf-reviews__nav button:hover { transform: translateY(-2px); border-color: var(--leaf-500); color: var(--leaf-700); }
.rf-reviews__nav svg { width: 1.1rem; height: 1.1rem; }
.rf-review-modal { width: min(100% - 2rem, 34rem); padding: 0; border: 0; border-radius: var(--r-lg); }
.rf-review-modal::backdrop { background: rgba(11,18,32,.72); backdrop-filter: blur(4px); }
.rf-review-modal__body { padding: 1.5rem; }
.rf-review-modal blockquote { margin: 1rem 0 0; color: var(--body); line-height: 1.75; }

/* ---- Footer polish ---- */
.rf-footer__main { gap: 1.75rem 2rem; }
.rf-footer__heading { position: relative; padding-bottom: .55rem; }
.rf-footer__heading::after {
  position: absolute; bottom: 0; left: 0;
  width: 1.8rem; height: 2px; border-radius: 2px;
  background: var(--grad-fresh); content: "";
}
.rf-footer__links a { display: inline-block; transition: transform 180ms ease, color 180ms ease; }
.rf-footer__links a:hover { transform: translateX(3px); }
.rf-footer__blurb { max-width: 30ch; }

/* ---- Hero: make the showcase feel draggable ---- */
.rf-showcase__stage { cursor: grab; touch-action: pan-y; }
.rf-showcase__stage.is-dragging { cursor: grabbing; }
.rf-showcase__hint {
  display: flex;
  gap: .35rem;
  align-items: center;
  justify-content: center;
  margin-top: .5rem;
  color: var(--steel-500);
  font-size: .7rem;
}
.rf-showcase__hint svg { width: .9rem; height: .9rem; }
@media (min-width: 64rem) { .rf-showcase__hint { display: none; } }

/* ================================================================
   V6 — kill every overlap, stop the sideways scroll, clear category
        photos, seamless review loop. Owner-reported, screenshot-driven.
   ================================================================ */

/* ---------- Global guard: nothing may ever scroll the page sideways ---------- */
html, body { max-width: 100%; overflow-x: clip; }
img, svg, video { max-width: 100%; }
.rf-container { overflow-x: clip; }

/* ================= HEADER ================= */
/* The bar could not wrap, so the search field forced the row wider than the
   viewport — that was the sideways scroll and the squashed "S" search box. */
.rf-mainbar__inner { flex-wrap: wrap; row-gap: 0; }
.rf-mainbar__actions { gap: .35rem; }

.rf-search {
  order: 10;
  flex: 1 1 100%;
  max-width: none;
  margin: 0 0 .7rem;
  display: none;
}
.rf-search.is-open { display: flex; }
.rf-search .rf-input { min-height: 2.75rem; }

@media (max-width: 63.99rem) {
  .rf-brand { width: clamp(6.5rem, 26vw, 9rem); }
  .rf-icon-btn { width: 2.5rem; height: 2.5rem; }
  .rf-icon-btn svg { width: 1.1rem; height: 1.1rem; }
  .rf-mainbar__quote { display: none; }
  .rf-mainbar__inner { gap: .4rem; }
}

@media (min-width: 64rem) {
  /* Desktop: search lives inline, permanently visible, no toggle needed. */
  .rf-search-toggle { display: none; }
  .rf-search { order: 0; flex: 0 1 20rem; display: flex; margin: 0 0 0 auto; }
  .rf-desktop-nav { margin-inline: 0 auto; }
  .rf-mainbar__actions { margin-left: .5rem; }
}

/* ================= MACHINE CARD — zero overlap ================= */
.rf-card__media { position: relative; overflow: hidden; }
/* soft scrim so the price plate always has contrast over any photo */
.rf-card__media::after {
  position: absolute; right: 0; bottom: 0; left: 0; height: 45%;
  background: linear-gradient(to top, rgba(255,255,255,.92), transparent);
  content: ""; pointer-events: none;
}
.rf-card__media img { position: relative; z-index: 0; }

.rf-card__price {
  position: absolute;
  z-index: 2;
  right: .55rem;
  bottom: .55rem;
  left: .55rem;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .45rem;
  align-items: baseline;
  margin: 0;                      /* was margin-top:-1.6rem → overlapped the title */
  padding: .45rem .65rem;
  border-radius: var(--r-md);
  background: rgba(255,255,255,.97);
  box-shadow: var(--shadow-2);
}
.rf-card__body {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  padding: .9rem;
}
.rf-card__cat {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rf-card__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
  min-height: 2.5em;              /* keeps every card's button on the same line */
}
.rf-card__actions { margin-top: auto; padding-top: .55rem; }

@media (max-width: 47.99rem) {
  .rf-card__media { height: 9.5rem; }
  .rf-card__price { padding: .38rem .5rem; gap: .25rem .35rem; }
  .rf-card__now { font-size: .88rem; }
  .rf-card__was { font-size: .68rem; }
  .rf-card__off { font-size: .58rem; padding: .1rem .3rem; }
  .rf-card__body { padding: .65rem; gap: .25rem; }
  .rf-card__title { font-size: .8rem; min-height: 2.6em; }
  .rf-card__cat { font-size: .56rem; letter-spacing: .06em; }
}

/* ================= CATEGORY TILES — real, clear photos ================= */
.rf-mosaic { grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: .8rem; }
.rf-tile {
  min-height: 0;
  padding: 0;
  overflow: hidden;
  background: var(--paper);
}
.rf-tile__photo {
  position: relative;
  inset: auto;
  display: block;
  width: 100%;
  height: 8rem;
  object-fit: contain;
  padding: .7rem;
  opacity: 1;                     /* was .16 — the machines were barely visible */
  background: linear-gradient(160deg, #FFFFFF, var(--mint-50));
}
.rf-tile:hover .rf-tile__photo { transform: scale(1.05); opacity: 1; }
.rf-tile__ph {
  display: grid; width: 100%; height: 8rem; place-items: center;
  color: var(--steel-500); background: var(--steel-100);
  font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
}
.rf-tile__icon {
  position: absolute;
  top: .55rem; left: .55rem;
  z-index: 2;
  width: 2.1rem; height: 2.1rem;
  background: rgba(255,255,255,.94);
  box-shadow: var(--shadow-1);
}
.rf-tile__icon svg { width: 1.05rem; height: 1.05rem; }
.rf-tile__body { padding: .7rem .8rem .85rem; }
.rf-tile__name {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  margin: 0; min-height: 2.4em; font-size: .84rem;
}
.rf-tile__meta { margin-top: .45rem; }
/* the oversized feature tile is gone — every category reads the same */
.rf-tile--feature { grid-column: auto; min-height: 0; color: inherit; background: var(--paper); border-color: var(--line); }
.rf-tile--feature .rf-tile__name { color: var(--ink); font-size: .84rem; }
.rf-tile--feature .rf-tile__meta { color: var(--muted); }
.rf-tile--feature .rf-tile__icon { color: var(--leaf-700); border-color: var(--mint-100); background: rgba(255,255,255,.94); }
.rf-tile--feature .rf-tile__count { background: var(--mint-100); color: var(--leaf-700); }

@media (max-width: 47.99rem) {
  .rf-mosaic { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; }
  .rf-tile__photo, .rf-tile__ph { height: 6.25rem; }
  .rf-tile__body { padding: .55rem .6rem .7rem; }
  .rf-tile__name { font-size: .76rem; }
  .rf-tile__icon { width: 1.85rem; height: 1.85rem; }
  .rf-tile__icon svg { width: .9rem; height: .9rem; }
}

/* ================= REVIEWS — seamless auto loop ================= */
.rf-reviews__track { scroll-snap-type: none; }
.rf-reviews__marquee {
  display: flex;
  gap: 1rem;
  width: max-content;
  animation: rf-marquee var(--marquee-time, 60s) linear infinite;
}
.rf-reviews:hover .rf-reviews__marquee,
.rf-reviews:focus-within .rf-reviews__marquee { animation-play-state: paused; }
@keyframes rf-marquee { to { transform: translateX(-50%); } }
.rf-reviews__marquee > * { flex: 0 0 min(20rem, 78vw); }
.rf-reviews__track--loop { overflow: hidden; }
@media (prefers-reduced-motion: reduce) {
  .rf-reviews__marquee { animation: none; }
  .rf-reviews__track--loop { overflow-x: auto; }
}
.rf-reviews .rf-quote { height: 100%; }
.rf-reviews .rf-quote:hover { transform: translateY(-4px); }
.rf-reviews__edge {
  position: absolute; top: 0; bottom: 0; width: 3rem; z-index: 2; pointer-events: none;
}
.rf-reviews__edge--l { left: 0; background: linear-gradient(to right, var(--mint-50), transparent); }
.rf-reviews__edge--r { right: 0; background: linear-gradient(to left, var(--mint-50), transparent); }
.rf-section:not(.rf-section--alt) .rf-reviews__edge--l { background: linear-gradient(to right, var(--paper), transparent); }
.rf-section:not(.rf-section--alt) .rf-reviews__edge--r { background: linear-gradient(to left, var(--paper), transparent); }

/* ================= /machines — never break on a phone ================= */
.rf-toolbar { gap: .6rem; }
.rf-filterbar__row { padding-inline: 2px; }
@media (max-width: 63.99rem) {
  .rf-layout { grid-template-columns: minmax(0, 1fr); }
  .rf-layout__aside { position: static; }
  /* the sidebar duplicates the filter rail on phones */
  .rf-layout__aside .rf-filters__group:first-child { display: none; }
}
@media (max-width: 47.99rem) {
  .rf-toolbar { flex-direction: column; align-items: stretch; }
  .rf-toolbar__count { font-size: .8rem; }
  .rf-filterbar__sort { align-self: flex-start; }
  .rf-filterbar__more { position: static !important; grid-template-columns: repeat(2, minmax(0,1fr)); }
  .rf-pager a, .rf-pager span { min-width: 2.3rem; height: 2.3rem; font-size: .8rem; }
}

/* ================= PDP + tables: no overlap on small screens ================= */
@media (max-width: 47.99rem) {
  .rf-pdp__chips { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .rf-pdp__cta-split { grid-template-columns: 1fr 1fr; }
  .rf-pdp__trust { grid-template-columns: 1fr; }
  .rf-tabs { gap: .15rem; }
  .rf-tabs a { padding: .6rem .7rem; font-size: .76rem; }
  .rf-hero__trust { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .rf-showcase__badge { left: .5rem; bottom: .5rem; }
  .rf-showcase__trust { right: .5rem; top: .5rem; font-size: .65rem; }
}

/* Long unbroken strings (emails, slugs) must never push a layout wide */
.rf-method__value, .rf-footer__contact a, .rf-prose a, .rf-card__title, .rf-tile__name {
  overflow-wrap: anywhere;
}

/* ================================================================
   V7 — card = image box + details below (no overlay), even mosaic
        rows, vertical review wall, drawer search.
   ================================================================ */

/* ---------- MACHINE CARD: photo in its own box, everything below it ---------- */
.rf-card__media::after { display: none; }          /* scrim no longer needed */
.rf-card__media {
  height: auto;
  aspect-ratio: 4 / 3;
  padding: .85rem;
  background: linear-gradient(160deg, #FFFFFF 0%, var(--mint-50) 100%);
  border-bottom: 1px solid var(--line);
  border-radius: var(--r-lg) var(--r-lg) 0 0;
}
.rf-card__media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.rf-card__price {
  position: static;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .5rem;
  align-items: baseline;
}
.rf-card__body { gap: .35rem; padding: .9rem; }
.rf-card__title { min-height: 0; }

@media (max-width: 47.99rem) {
  .rf-card__media { padding: .55rem; }
  .rf-card__body { padding: .65rem; gap: .3rem; }
  .rf-card__title { font-size: .8rem; }
  .rf-card__now { font-size: .92rem; }
}

/* ---------- CATEGORY MOSAIC: fixed columns so rows always fill ---------- */
.rf-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 40rem) { .rf-mosaic { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .rf-mosaic { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- REVIEW WALL: three columns, alternating vertical scroll ---------- */
.rf-revwall {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}
.rf-revwall__col {
  position: relative;
  height: 26rem;
  overflow: hidden;
  border-radius: var(--r-lg);
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent);
}
.rf-revwall__run {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.rf-revwall__run--down { animation: rf-run-down var(--run-time, 45s) linear infinite; }
.rf-revwall__run--up   { animation: rf-run-up   var(--run-time, 45s) linear infinite; }
@keyframes rf-run-down { from { transform: translateY(0); }      to { transform: translateY(-50%); } }
@keyframes rf-run-up   { from { transform: translateY(-50%); }   to { transform: translateY(0); } }
.rf-revwall:hover .rf-revwall__run,
.rf-revwall:focus-within .rf-revwall__run { animation-play-state: paused; }
.rf-revwall .rf-quote { cursor: pointer; }
.rf-revwall .rf-quote blockquote {
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: .89rem;
}
@media (min-width: 48rem) {
  .rf-revwall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rf-revwall__col { height: 30rem; }
}
@media (min-width: 64rem) {
  .rf-revwall { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* below 48rem only the first column shows, so it must carry every review */
@media (max-width: 47.99rem) {
  .rf-revwall__col--mid, .rf-revwall__col--last { display: none; }
  .rf-revwall__col { height: 24rem; }
}
@media (prefers-reduced-motion: reduce) {
  .rf-revwall__run { animation: none; }
  .rf-revwall__col { height: auto; overflow: visible; -webkit-mask-image: none; mask-image: none; }
}

/* the old horizontal rail is retired */
.rf-reviews__edge, .rf-reviews__marquee, .rf-reviews__nav { display: none; }

/* ---------- DRAWER: search at the top of the mobile menu ---------- */
.rf-drawer__search { margin-bottom: 1rem; }
.rf-drawer__search .rf-search {
  position: relative;
  display: flex;
  order: 0;
  flex: 1 1 auto;
  margin: 0;
}
.rf-drawer__search .rf-input {
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.08);
  color: var(--paper);
}
.rf-drawer__search .rf-input::placeholder { color: var(--steel-500); }
.rf-drawer__search .rf-search__icon { color: var(--steel-500); }
.rf-drawer__search .rf-search__results { color: var(--body); }

/* ================================================================
   V8 — header search properly slotted, phone gets a real search bar,
        mosaic capped to two rows, review wall actually animates.
   ================================================================ */

/* ---------- HEADER: search sits in the row, never floats over anything ---------- */
.rf-mainbar__inner { position: relative; }

/* Phone: a compact search bar beside the logo (an icon wasted the space). */
@media (max-width: 63.99rem) {
  .rf-mainbar__inner { flex-wrap: nowrap; gap: .35rem; }
  .rf-search-toggle { display: none; }
  .rf-brand { width: clamp(5.5rem, 22vw, 7.5rem); flex: 0 0 auto; }
  .rf-search {
    order: 0;
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
  }
  .rf-search .rf-input {
    min-height: 2.4rem;
    padding-left: 2.1rem;
    padding-right: 2.4rem;
    font-size: .82rem;
  }
  .rf-search__icon { left: .7rem; width: .9rem; height: .9rem; }
  .rf-search__go { width: 1.85rem; height: 1.85rem; right: .25rem; }
  .rf-search__go svg { width: .8rem; height: .8rem; }
  .rf-mainbar__actions { flex: 0 0 auto; gap: .2rem; }
  .rf-icon-btn { width: 2.25rem; height: 2.25rem; }
  .rf-icon-btn svg { width: 1rem; height: 1rem; }
}
@media (max-width: 26rem) {
  .rf-cart-button { display: none; }   /* cart also lives in the drawer */
}

/* Desktop: one nowrap row — logo | nav | search | actions. It used to wrap and
   drop the search box on top of the utility bar and the Get a Quote button. */
@media (min-width: 64rem) {
  .rf-mainbar__inner { flex-wrap: nowrap; }
  .rf-desktop-nav { flex: 0 1 auto; min-width: 0; margin: 0; }
  .rf-nav-list { flex-wrap: nowrap; }
  .rf-search {
    position: relative;
    order: 0;
    display: flex;
    flex: 0 1 14rem;
    min-width: 8rem;
    margin: 0 0 0 auto;
    inset: auto;
  }
  .rf-search .rf-input { min-height: 2.5rem; font-size: .85rem; }
  .rf-search__go { width: 2rem; height: 2rem; }
  .rf-mainbar__actions { flex: 0 0 auto; margin-left: .5rem; }
}
@media (min-width: 80rem) {
  .rf-search { flex-basis: 17rem; }
}

/* ---------- MOSAIC: exactly two rows ---------- */
.rf-mosaic { grid-auto-rows: 1fr; }

/* ---------- REVIEW WALL: motion is the point of this section ----------
   A slow, continuous, linear scroll — no flashing, no parallax, no bouncing.
   Under "reduce motion" it is slowed right down rather than switched off, so
   the section still reads as alive without anything jarring. */
.rf-revwall__run--down { animation: rf-run-down var(--run-time, 45s) linear infinite; }
.rf-revwall__run--up   { animation: rf-run-up   var(--run-time, 45s) linear infinite; }

@media (prefers-reduced-motion: reduce) {
  .rf-revwall__run--down,
  .rf-revwall__run--up {
    animation-duration: calc(var(--run-time, 45s) * 3) !important;
    animation-play-state: running !important;
  }
  .rf-revwall__col { height: 26rem; overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent);
    mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent); }
}

/* Phone: show two columns so the wall reads as a wall, not a list */
@media (max-width: 47.99rem) {
  .rf-revwall { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; }
  .rf-revwall__col--mid { display: block; }
  .rf-revwall__col--last { display: none; }
  .rf-revwall__col { height: 25rem; }
  .rf-revwall__run { gap: .6rem; }
  .rf-revwall .rf-quote { padding: .85rem; }
  .rf-revwall .rf-quote blockquote { font-size: .76rem; -webkit-line-clamp: 7; }
  .rf-revwall .rf-quote__who { margin-top: .7rem; padding-top: .7rem; gap: .5rem; }
  .rf-revwall .rf-quote__ini { width: 2rem; height: 2rem; font-size: .8rem; }
  .rf-revwall .rf-quote__name { font-size: .76rem; }
  .rf-revwall .rf-quote__org { font-size: .68rem; }
  .rf-revwall .rf-quote__stars svg { width: .8rem; height: .8rem; }
}

/* ---------- LOGIN: explicit tabs, not one ambiguous form ---------- */
.rf-authtabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .25rem;
  margin-bottom: 1.25rem;
  padding: .25rem;
  border-radius: var(--r-pill);
  background: var(--paper-alt);
}
.rf-authtabs button {
  padding: .6rem .8rem;
  border: 0;
  border-radius: var(--r-pill);
  background: transparent;
  color: var(--body);
  font-family: var(--font-display);
  font-size: .85rem;
  font-weight: 700;
  transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease;
}
.rf-authtabs button[aria-selected="true"] {
  color: var(--ink);
  background: var(--paper);
  box-shadow: var(--shadow-1);
}
.rf-auth-hint { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .82rem; }


/* ================================================================
   V9 — one authoritative header layout. Explicit flex order so the
        row is always: logo, search, nav, actions.
   ================================================================ */
.rf-mainbar__inner { flex-wrap: nowrap; align-items: center; }
.rf-brand            { order: 0; }
.rf-search           { order: 1; }
.rf-desktop-nav      { order: 2; }
.rf-mainbar__actions { order: 3; }

.rf-search {
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
  transform: none;
  inset: auto;
  width: auto;
}
.rf-search.is-open { display: flex; }

/* Phone: compact bar right after the logo. */
@media (max-width: 63.99rem) {
  .rf-search { display: flex; max-width: none; }
  .rf-search .rf-input {
    min-height: 2.35rem;
    padding-left: 2rem;
    padding-right: 2.2rem;
    font-size: .8rem;
  }
  .rf-search__icon { left: .65rem; width: .85rem; height: .85rem; }
  .rf-search__go { right: .2rem; width: 1.75rem; height: 1.75rem; }
  .rf-search__go svg { width: .75rem; height: .75rem; }
}

/* Desktop: sits between the nav and the action cluster, comfortably sized. */
@media (min-width: 64rem) {
  .rf-search { display: flex; flex: 0 1 15rem; margin-inline: 1rem 0; }
  .rf-desktop-nav { margin-inline: 0 auto; }
  .rf-search .rf-input { min-height: 2.5rem; font-size: .85rem; }
  .rf-search__go { width: 2rem; height: 2rem; }
}

/* The drawer copy is always open and full width. */
.rf-drawer__search .rf-search { display: flex; flex: 1 1 auto; order: 0; margin: 0; }

/* ================================================================
   V10 — hidden fields really hidden, review popup affordance,
         footer trust strip.
   ================================================================ */

/* The `hidden` attribute was being beaten by author rules such as
   `.rf-field { display: grid }`, so "Your name" stayed on screen in login mode. */
[hidden] { display: none !important; }

/* ---------- Review cards: make it obvious they open ---------- */
.rf-revwall .rf-quote { position: relative; transition: transform 220ms cubic-bezier(.16,1,.3,1), box-shadow 220ms ease, border-color 200ms ease; }
.rf-revwall .rf-quote:hover,
.rf-revwall .rf-quote:focus-visible { border-color: var(--lime-400); box-shadow: var(--shadow-3); }
.rf-revwall .rf-quote::after {
  content: "Read full review";
  position: absolute;
  right: .9rem;
  bottom: .9rem;
  padding: .2rem .5rem;
  border-radius: var(--r-pill);
  background: var(--mint-100);
  color: var(--leaf-700);
  font-family: var(--font-display);
  font-size: .62rem;
  font-weight: 700;
  opacity: 0;
  transition: opacity 200ms ease;
}
.rf-revwall .rf-quote:hover::after,
.rf-revwall .rf-quote:focus-visible::after { opacity: 1; }
.rf-revwall__hint {
  display: flex;
  gap: .4rem;
  align-items: center;
  justify-content: center;
  margin-top: 1rem;
  color: var(--muted);
  font-size: .8rem;
}
.rf-revwall__hint svg { width: 1rem; height: 1rem; color: var(--leaf-600); }

/* Popup itself */
.rf-review-modal { border: 1px solid var(--line); box-shadow: var(--shadow-4); }
.rf-review-modal__body { padding: 1.6rem; }
.rf-review-modal__stars { display: flex; gap: .12rem; margin-top: .9rem; color: var(--lime-400); }
.rf-review-modal__stars svg { width: 1.05rem; height: 1.05rem; }
.rf-review-modal blockquote {
  margin-top: .8rem;
  padding-left: 1rem;
  border-left: 3px solid var(--lime-400);
  color: var(--body);
  font-size: 1rem;
  line-height: 1.75;
}
.rf-review-modal__foot { margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--line); }

/* ---------- Footer: trust strip + better rhythm ---------- */
.rf-footer__trust {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 1px;
  margin-bottom: 0;
  background: rgba(255,255,255,.1);
  border-block: 1px solid rgba(255,255,255,.1);
}
.rf-footer__trust div {
  display: grid;
  grid-template-columns: 1.6rem minmax(0,1fr);
  gap: .6rem;
  align-items: center;
  padding: .9rem var(--gutter);
  background: var(--navy-900);
}
.rf-footer__trust svg { width: 1.4rem; height: 1.4rem; color: var(--lime-400); }
.rf-footer__trust strong { display: block; color: var(--paper); font-family: var(--font-display); font-size: .82rem; }
.rf-footer__trust span { color: var(--steel-500); font-size: .72rem; }
@media (min-width: 48rem) { .rf-footer__trust { grid-template-columns: repeat(4, minmax(0,1fr)); } }

.rf-footer__badge {
  display: inline-flex;
  gap: .4rem;
  align-items: center;
  margin-top: 1rem;
  padding: .45rem .8rem;
  border: 1px solid rgba(141,198,63,.35);
  border-radius: var(--r-pill);
  color: var(--lime-200);
  font-size: .74rem;
}
.rf-footer__badge svg { width: .95rem; height: .95rem; }
.rf-footer__hours { margin-top: .9rem; color: var(--steel-500); font-size: .78rem; }
.rf-footer__hours strong { display: block; color: var(--steel-300); font-size: .8rem; }

/* ================================================================
   V11 — chat identity gate + catalogue CTA
   ================================================================ */
.rf-chat__gate { display: grid; gap: .6rem; padding: 1rem; }
.rf-chat__gate[hidden] { display: none; }
.rf-chat__gate-note { margin: 0 0 .2rem; color: var(--body); font-size: .88rem; line-height: 1.5; }
.rf-chat__gate .rf-input { min-height: 2.75rem; }
.rf-chat__gate-fine { margin: 0; color: var(--muted); font-size: .72rem; text-align: center; }
.rf-chat__log[hidden], .rf-chat__form[hidden] { display: none; }

/* Catalogue call-out band, reused on several pages */
.rf-catalog-cta {
  display: grid;
  gap: 1rem;
  align-items: center;
  padding: clamp(1.25rem, 3vw, 1.75rem);
  border: 1px solid var(--mint-100);
  border-radius: var(--r-lg);
  background: linear-gradient(135deg, var(--mint-50), var(--paper));
  box-shadow: var(--shadow-1);
}
.rf-catalog-cta__icon {
  display: grid; width: 3rem; height: 3rem; place-items: center;
  border-radius: var(--r-md); background: var(--grad-fresh); color: #fff;
  box-shadow: var(--glow-green);
}
.rf-catalog-cta__icon svg { width: 1.4rem; height: 1.4rem; }
.rf-catalog-cta h3 { font-size: 1.05rem; }
.rf-catalog-cta p { margin-top: .3rem; font-size: .88rem; }
@media (min-width: 40rem) {
  .rf-catalog-cta { grid-template-columns: 3rem minmax(0,1fr) auto; }
}
/* Hero variant sits on the dark banner */
.rf-hero .rf-catalog-cta {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(6px);
}
.rf-hero .rf-catalog-cta h3 { color: var(--paper); }
.rf-hero .rf-catalog-cta p { color: var(--steel-300); }
