/*
Theme Name:   CMF Child
Theme URI:    https://centralmachineandfab.com
Description:  Child theme for Central Machine & Fabrication — built on Kadence
Author:       WCS / Michael Wilson
Author URI:   https://wcs.com
Template:     kadence
Version:      2.8.0
License:      GNU General Public License v2 or later
Text Domain:  cmf-child
*/

/* ============================================================
   CMF DESIGN SYSTEM — CSS CUSTOM PROPERTIES
   Brand: deep navy (primary) · gunmetal/alloy (accent) · steel neutrals
   Type: Oswald (display) · IBM Plex Sans (body) · IBM Plex Mono (specs)
   ============================================================ */
:root {
  /* Navy scale */
  --navy-950: #010C22;
  --navy-900: #021634;
  --navy-800: #021E45;
  --navy-700: #032153;
  --navy-600: #0A2F6C;
  --navy-500: #143F84;
  --navy-400: #2C589E;
  --navy-300: #5C7EB6;
  --navy-200: #9BB1D2;
  --navy-100: #D2DDEC;
  --navy-50:  #EBF1F8;

  /* Steel neutrals */
  --steel-800: #222932;
  --steel-700: #323B46;
  --steel-600: #495462;
  --steel-500: #677180;
  --steel-400: #8A93A1;
  --steel-300: #B0B8C2;
  --steel-200: #D3D8DF;
  --steel-100: #E7EAEF;
  --steel-50:  #F4F6F8;
  --paper:     #F7F5F0;
  --white:     #FFFFFF;

  /* Alloy accent — gunmetal (primary CTA, hazard rule accent) */
  --alloy-700: #2B333B;
  --alloy-600: #3C4651;
  --alloy-500: #4E5A66;
  --alloy-400: #6B7785;
  --alloy-300: #97A2AE;
  --alloy-200: #C2C9D1;
  --alloy-100: #E6E9ED;

  /* Semantic */
  --green-600: #246A45;
  --green-500: #2E7D52;
  --green-100: #DBEDE2;
  --amber-600: #B5811C;
  --amber-500: #E0A52B;
  --red-600:   #A52F26;
  --red-500:   #C23B30;

  /* Text roles */
  --text-strong:  var(--navy-900);
  --text-body:    var(--steel-800);
  --text-muted:   var(--steel-500);
  --text-faint:   var(--steel-400);
  --text-inverse: var(--steel-50);

  /* Surface roles */
  --surface-page:   var(--paper);
  --surface-card:   var(--white);
  --surface-sunken: var(--steel-50);
  --border-subtle:  var(--steel-100);
  --border-default: var(--steel-200);
  --border-strong:  var(--steel-300);
  --border-ink:     var(--navy-700);

  /* Typography */
  --font-display: 'Oswald', 'Arial Narrow', sans-serif;
  --font-sans:    'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'SF Mono', monospace;

  /* Radii */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 16px;

  /* Shadows */
  --shadow-sm:    0 1px 2px rgba(2,22,52,0.10), 0 1px 0 rgba(2,22,52,0.04);
  --shadow-md:    0 2px 4px rgba(2,22,52,0.10), 0 4px 12px rgba(2,22,52,0.08);
  --shadow-lg:    0 8px 24px rgba(2,22,52,0.14), 0 2px 6px rgba(2,22,52,0.08);
  --shadow-plate: 4px 4px 0 var(--navy-700);
  --shadow-plate-alloy: 4px 4px 0 var(--alloy-500);

  /* Layout */
  --container-xl: 1320px;
  --header-h:     72px;

  /* Motion */
  --dur-fast: 120ms;
  --dur-base: 180ms;
}

/* ============================================================
   GLOBAL BASE
   ============================================================ */

/* WordPress uses <mark class="has-inline-color"> for inline text color.
   Browsers apply yellow background to <mark> by default — strip it. */
mark.has-inline-color {
  background-color: transparent !important;
  background: none !important;
}
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--font-sans);
  color: var(--text-body);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--alloy-200); color: var(--navy-900); }

/* ============================================================
   TYPOGRAPHY — Oswald for headings, IBM Plex Sans for body
   ============================================================ */
h1, h2, h3 {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.04;
  letter-spacing: -0.015em;
  color: var(--text-strong);
}

h1 { font-size: clamp(36px, 5.4vw, 72px); letter-spacing: -0.02em; }
h2 { font-size: clamp(28px, 3.6vw, 50px); }
h3 { font-size: clamp(20px, 2.2vw, 28px); font-weight: 600; line-height: 1.15; }

h4, h5, h6 {
  font-family: var(--font-sans);
  font-weight: 600;
  color: var(--text-strong);
}

p { line-height: 1.7; }

a  { color: var(--navy-700); }
a:hover { color: var(--alloy-500); }

code, kbd, samp { font-family: var(--font-mono); font-size: 0.92em; }

/* Headings inside dark sections */
.cmf-dark h1, .cmf-dark h2, .cmf-dark h3,
.cmf-dark .wp-block-heading { color: var(--white) !important; }

/* ============================================================
   HEADER & NAV
   ============================================================ */
.site-header,
#masthead,
.site-header-wrap,
header.kadence-sticky-header {
  background-color: var(--navy-800) !important;
  border-bottom: 3px solid var(--alloy-500) !important;
}

/* ── Logo ──────────────────────────────────────────────────── */
.custom-logo {
  max-height: 52px !important;
  width: auto !important;
}

/* ── Site title — matches design: "Central Machine" + "& FABRICATION" sub */
.site-title {
  font-family: var(--font-display) !important;
  text-transform: uppercase !important;
  color: var(--white) !important;
  font-weight: 700 !important;
  font-size: 17px !important;
  line-height: 1.02 !important;
  letter-spacing: 0.01em !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Append "& FABRICATION" as a second line via CSS */
.site-title::after {
  content: '& FABRICATION';
  display: block;
  font-family: var(--font-display) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: var(--navy-200) !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

.site-branding a,
.site-branding a:hover {
  text-decoration: none !important;
  color: var(--white) !important;
}

/* ── Primary navigation ─────────────────────────────────────── */
.main-navigation,
#site-navigation {
  background: transparent !important;
}

/* All nav links */
.main-navigation ul li a,
#site-navigation ul li a {
  font-family: var(--font-display) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--navy-100) !important;
  text-decoration: none !important;
  border-bottom: 2px solid transparent !important;
  padding: 0 14px !important;
  line-height: var(--header-h) !important;
  display: inline-block !important;
}

.main-navigation ul li a:hover,
#site-navigation ul li a:hover {
  color: var(--white) !important;
  text-decoration: none !important;
}

/* Active page indicator */
.main-navigation ul li.current-menu-item > a,
.main-navigation ul li.current-page-ancestor > a {
  color: var(--white) !important;
  border-bottom-color: var(--alloy-500) !important;
}

/* ── "Request a Quote" — last nav item styled as a button ──── */
.main-navigation ul li:last-child a,
#site-navigation ul li:last-child a {
  background-color: var(--alloy-500) !important;
  color: var(--white) !important;
  padding: 8px 18px !important;
  border-radius: var(--radius-sm) !important;
  border-bottom: none !important;
  line-height: 1.4 !important;
  margin-left: 8px !important;
}

.main-navigation ul li:last-child a:hover,
#site-navigation ul li:last-child a:hover {
  background-color: var(--navy-900) !important;
  color: var(--white) !important;
}

/* ============================================================
   BUTTONS — alloy primary (not red)
   ============================================================ */
.wp-block-button__link,
.kb-button,
.wp-element-button {
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  background-color: var(--alloy-500) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  transition: background var(--dur-base), transform var(--dur-fast) !important;
  padding: 0.75rem 1.75rem !important;
}

.wp-block-button__link:hover,
.kb-button:hover,
.wp-element-button:hover {
  background-color: var(--navy-900) !important;
  color: var(--white) !important;
  transform: translateY(-1px) !important;
}

/* Outline on dark bg */
.cmf-btn-outline-light .wp-block-button__link {
  background-color: transparent !important;
  border: 2px solid rgba(255,255,255,0.5) !important;
  color: var(--white) !important;
}

.cmf-btn-outline-light .wp-block-button__link:hover {
  background-color: rgba(255,255,255,0.1) !important;
  border-color: var(--white) !important;
}

/* White CTA on dark alloy band */
.cmf-btn-white .wp-block-button__link {
  background-color: var(--white) !important;
  color: var(--navy-900) !important;
}

.cmf-btn-white .wp-block-button__link:hover {
  background-color: var(--alloy-100) !important;
  color: var(--navy-900) !important;
}

/* ============================================================
   HAZARD RULE — 45° alloy/navy diagonal stripe divider
   ============================================================ */
.cmf-hazard-rule {
  height: 6px !important;
  background: repeating-linear-gradient(
    -45deg,
    var(--navy-700) 0 12px,
    var(--alloy-500) 12px 24px
  ) !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ============================================================
   BLUEPRINT GRID — faint dot grid for dark sections
   ============================================================ */
.cmf-blueprint-grid {
  position: relative;
}

.cmf-blueprint-grid::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(155,177,210,0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155,177,210,0.09) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
  z-index: 0;
}

.cmf-blueprint-grid > * { position: relative; z-index: 1; }

/* ============================================================
   HOMEPAGE HERO
   ============================================================ */
.cmf-hero {
  position: relative;
  min-height: 660px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background-color: var(--navy-950);
  background-image:
    linear-gradient(rgba(155,177,210,0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155,177,210,0.09) 1px, transparent 1px);
  background-size: 40px 40px;
}

/* Right photo panel with diagonal clip */
.cmf-hero-photo {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 54%;
  clip-path: polygon(18% 0, 100% 0, 100% 100%, 0% 100%);
  background-image: url('/wp-content/themes/cmf-child/images/raymond-roller-mill-factory.webp');
  background-size: cover;
  background-position: center;
}

.cmf-hero-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(2,22,52,0.65) 0%, rgba(2,22,52,0.18) 100%);
}

/* Left-to-right gradient overlay */
.cmf-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    rgba(1,12,34,0.97) 30%,
    rgba(1,12,34,0.55) 56%,
    rgba(1,12,34,0.1)  80%
  );
  pointer-events: none;
  z-index: 1;
}

/* 50th anniversary badge — top-right */
.cmf-hero-badge,
figure.cmf-hero-badge,
.cmf-hero figure.cmf-hero-badge,
.wp-block-group.cmf-hero figure.cmf-hero-badge {
  position: absolute !important;
  top: 40px !important;
  right: 56px !important;
  z-index: 3 !important;
  width: 220px !important;
  margin: 0 !important;
  filter: drop-shadow(0 6px 20px rgba(0,0,0,0.4));
}

.cmf-hero-badge img,
.cmf-hero figure.cmf-hero-badge img {
  width: 220px !important;
  height: auto !important;
  max-width: none !important;
}

/* Content wrapper (above all overlays) */
.cmf-hero-inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 3.5rem 3rem 4rem;
}

/* H1 */
.cmf-hero-h1,
.cmf-hero-inner h1 {
  font-size: clamp(72px, 9.5vw, 140px) !important;
  line-height: 0.88 !important;
  letter-spacing: -0.025em !important;
  color: var(--white) !important;
  margin-bottom: 2rem !important;
}

/* Description */
.cmf-hero-subtext { font-size: 1.1875rem !important; line-height: 1.55 !important; color: var(--navy-100) !important; max-width: 470px; }

/* Columns gaps moved out of inline blockGap so the blocks stay canonical
   (inline blockGap can mismatch what the editor regenerates on validation). */
.cmf-hero-cols { gap: 2.75rem !important; }
.cmf-resources-cols { gap: 3.5rem !important; }

/* ============================================================
   EYEBROW TEXT
   ============================================================ */
.cmf-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  font-family: var(--font-display);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.8125rem;
  color: var(--alloy-600);
  white-space: nowrap;
}

.cmf-eyebrow::before {
  content: '';
  display: inline-block;
  width: 34px;
  height: 2px;
  background-color: var(--alloy-500);
  flex: none;
}

.cmf-eyebrow-dark { color: var(--alloy-300) !important; }
.cmf-eyebrow-dark::before { background: var(--alloy-400) !important; }

/* ============================================================
   TRUST BAR
   ============================================================ */
.cmf-trust-bar {
  background: var(--navy-950) !important;
  border-bottom: 1px solid var(--navy-800);
}

.cmf-trust-bar-inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 0 3rem;
}

.cmf-trust-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 4px;
}

.cmf-trust-item + .cmf-trust-item {
  border-left: 1px solid var(--navy-800);
  padding-left: 28px;
}

.cmf-trust-label {
  display: block;
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 1.125rem;
  color: var(--white);
  line-height: 1.1;
}

.cmf-trust-sub {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.04em;
  color: var(--navy-300);
}

/* ============================================================
   INTERIOR PAGE HERO
   ============================================================ */
.cmf-page-hero {
  position: relative;
  background-color: var(--navy-900);
  overflow: hidden;
}

.cmf-page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(155,177,210,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155,177,210,0.08) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
}

.cmf-page-hero-photo {
  position: absolute;
  right: -60px;
  top: -40px;
  bottom: -40px;
  width: 420px;
  opacity: 0.5;
  background-image: url('/wp-content/themes/cmf-child/images/raymond-roller-mill-factory.webp');
  background-size: cover;
  background-position: center;
  clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%);
}

.cmf-page-hero-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--navy-900), rgba(2,22,52,0.4));
}

.cmf-page-hero-content {
  position: relative;
  z-index: 1;
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 3.25rem 3rem 3.5rem;
}

.cmf-page-hero-content .wp-block-heading,
.cmf-page-hero-content h1 {
  color: var(--white) !important;
  font-size: clamp(40px, 5.4vw, 72px) !important;
  line-height: 0.95 !important;
  letter-spacing: -0.02em !important;
  max-width: 900px;
}

/* ============================================================
   MANUFACTURER STAMP (rotating trust device)
   ============================================================ */
.cmf-mfr-stamp {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  border: 2px solid var(--alloy-500) !important;
  border-radius: var(--radius-sm) !important;
  padding: 9px 16px 9px 12px !important;
  background: rgba(78,90,102,0.08) !important;
  transform: rotate(-1.2deg) !important;
  width: auto !important;
}

.cmf-mfr-stamp strong { color: var(--navy-900); }

/* ============================================================
   IN-STOCK BADGES
   ============================================================ */
.cmf-badge-instock {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--green-500);
  color: var(--white);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  padding: 4px 10px;
  border-radius: var(--radius-xs);
}

.cmf-badge-mto {
  background: var(--steel-200);
  color: var(--steel-600);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  padding: 4px 10px;
  border-radius: var(--radius-xs);
}

/* ============================================================
   BREADCRUMB
   ============================================================ */
.cmf-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 22px;
  color: var(--navy-200);
}

.cmf-breadcrumb span:last-child { color: var(--alloy-300); }

/* ============================================================
   SECTIONS
   ============================================================ */
.cmf-section      { padding: 5.75rem 0; }
.cmf-section-sm   { padding: 4rem 0; }
.cmf-paper-bg     { background-color: var(--paper) !important; }
.cmf-navy-bg      { background-color: var(--navy-900) !important; }
.cmf-navy-dark-bg { background-color: var(--navy-800) !important; }
.cmf-deep-bg      { background-color: var(--navy-950) !important; }

/* ============================================================
   PARTS GRID (8-card, homepage)
   ============================================================ */
.cmf-parts-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.cmf-part-card-v2 {
  position: relative;
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: 24px 22px 22px;
  cursor: pointer;
  transition: border-color var(--dur-base), box-shadow var(--dur-base), transform var(--dur-base);
  text-decoration: none;
  display: block;
}

.cmf-part-card-v2:hover {
  border-color: var(--alloy-500);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

/* ============================================================
   BY MODEL GRID
   ============================================================ */
.cmf-model-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.cmf-model-card {
  position: relative;
  background: var(--navy-800);
  border: 1px solid var(--navy-700);
  border-radius: var(--radius-lg);
  padding: 30px 28px;
  cursor: pointer;
  overflow: hidden;
  transition: border-color var(--dur-base), transform var(--dur-base);
  text-decoration: none;
  display: block;
}

.cmf-model-card:hover {
  border-color: var(--alloy-400);
  transform: translateY(-3px);
}

/* ============================================================
   CTA BAND — gunmetal, not red
   ============================================================ */
.cmf-cta-band {
  position: relative;
  background: var(--alloy-600);
  overflow: hidden;
}

.cmf-cta-band::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
  background-size: 44px 44px;
  pointer-events: none;
}

.cmf-cta-band-inner {
  position: relative;
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 3.375rem 3rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}

.cmf-cta-eyebrow {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  margin-bottom: 10px;
}

.cmf-cta-phone {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--white);
  text-decoration: none;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2.375rem;
  letter-spacing: 0.01em;
  line-height: 1;
}

/* ============================================================
   PART TYPE PAGE — 2-column layout + sidebar
   ============================================================ */
.cmf-part-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 56px;
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 4rem 3rem 5.5rem;
  align-items: start;
}

.cmf-section-label {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
}

.cmf-section-label-num {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--alloy-600);
  font-weight: 600;
}

.cmf-section-label-rule {
  width: 26px;
  height: 2px;
  background-color: var(--alloy-500);
  flex: none;
}

.cmf-section-label-text {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.75rem;
  letter-spacing: -0.01em;
  color: var(--navy-900);
  margin: 0;
  font-weight: 600;
  line-height: 1;
}

/* Specs / sizes table */
.cmf-specs-table {
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  overflow: hidden;
  width: 100%;
  border-collapse: collapse;
}

.cmf-specs-table thead tr { background: var(--navy-800); }
.cmf-specs-table thead th {
  padding: 13px 16px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--navy-200);
  font-weight: 500;
  text-align: left;
}

.cmf-specs-table tbody tr { border-top: 1px solid var(--border-subtle); }
.cmf-specs-table tbody tr:nth-child(even) { background: var(--steel-50); }
.cmf-specs-table td { padding: 14px 16px; font-size: 0.875rem; color: var(--text-body); }
.cmf-specs-table td:nth-child(2) { font-family: var(--font-mono); font-size: 0.8125rem; }

/* RFQ sidebar box */
.cmf-rfq-sidebar { position: sticky; top: 24px; }

.cmf-rfq-box {
  background: var(--navy-900);
  border: 2px solid var(--navy-700);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-plate);
}

.cmf-rfq-box-inner { padding: 26px 24px 28px; }

.cmf-rfq-label {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--alloy-300);
  margin-bottom: 8px;
}

.cmf-rfq-box h3 {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.625rem;
  line-height: 1;
  color: var(--white) !important;
  margin: 0 0 14px;
}

.cmf-rfq-box p {
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--navy-100);
  margin: 0 0 20px;
}

.cmf-rfq-contact {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--navy-700);
  display: grid;
  gap: 12px;
}

.cmf-rfq-contact a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--white) !important;
  text-decoration: none;
  font-family: var(--font-mono);
  font-size: 0.9375rem;
}

/* Quick spec table in sidebar */
.cmf-quick-specs {
  margin-top: 16px;
  background: var(--white);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.cmf-quick-specs-title {
  padding: 12px 16px;
  background: var(--navy-900);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--navy-200);
}

.cmf-quick-spec-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 16px;
  border-top: 1px solid var(--border-subtle);
}

.cmf-quick-spec-row:nth-child(even) { background: var(--steel-50); }
.cmf-quick-spec-label { font-size: 0.8125rem; color: var(--text-muted); }
.cmf-quick-spec-value { font-family: var(--font-mono); font-size: 0.8125rem; color: var(--navy-900); font-weight: 500; }

/* Signs of wear */
.cmf-wear-list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 32px; }

/* Inline RFQ CTA (bottom of main content) */
.cmf-inline-cta {
  background: var(--navy-900);
  border-radius: var(--radius-lg);
  padding: 36px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
  box-shadow: var(--shadow-plate);
}

.cmf-inline-cta h3  { color: var(--white) !important; margin: 0 0 6px; font-size: 1.75rem; }
.cmf-inline-cta p   { font-size: 0.9375rem; color: var(--navy-100); margin: 0; }

/* ============================================================
   SERVICE PAGE — process steps, Why CMF
   ============================================================ */
.cmf-process-step {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 32px;
  align-items: start;
  padding: 28px 0;
  border-top: 1px solid var(--navy-700);
}

.cmf-process-num {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 4rem;
  line-height: 0.8;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--alloy-400);
}

.cmf-process-step h3 { color: var(--white) !important; font-size: 1.625rem; margin: 0 0 8px; }
.cmf-process-step p  { font-size: 1rem; line-height: 1.65; color: var(--navy-100); margin: 0; }

/* Why CMF */
.cmf-why-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }

.cmf-why-card {
  display: flex;
  gap: 18px;
  background: var(--white);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: 26px;
}

.cmf-why-card h4 { font-family: var(--font-display); text-transform: uppercase; font-size: 1.1875rem; color: var(--navy-900); margin: 2px 0 6px; }
.cmf-why-card p  { font-size: 0.90625rem; line-height: 1.6; color: var(--text-muted); margin: 0; }

/* ============================================================
   TECH ARTICLE — 3-col layout with TOC
   ============================================================ */
.cmf-article-layout {
  display: grid;
  grid-template-columns: 230px 1fr 300px;
  gap: 48px;
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 3.75rem 3rem 5.5rem;
  align-items: start;
}

.cmf-toc {
  position: sticky;
  top: 24px;
}

.cmf-toc-title {
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border-default);
}

.cmf-toc a {
  display: flex;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  border-left: 2px solid transparent;
  text-decoration: none;
  font-size: 0.875rem;
  color: var(--text-body);
}

.cmf-toc a:hover, .cmf-toc a.active {
  border-left-color: var(--alloy-500);
  background-color: var(--navy-50);
}

/* Article body */
.cmf-article-body { min-width: 0; max-width: 720px; }
.cmf-article-body > p { font-size: 1.0625rem; line-height: 1.8; margin-bottom: 18px; }

.cmf-article-body blockquote {
  margin: 24px 0;
  padding: 18px 24px;
  border-left: 3px solid var(--alloy-500);
  background: var(--steel-50);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

.cmf-article-body blockquote p {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.375rem;
  line-height: 1.25;
  color: var(--navy-900);
  margin: 0;
}

/* Article right sidebar */
.cmf-article-sidebar { position: sticky; top: 24px; display: grid; gap: 18px; }

/* ============================================================
   CUSTOMERS STRIP
   ============================================================ */
.cmf-customers-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 14px 40px;
}

.cmf-customer-name {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 1.375rem;
  color: var(--steel-400);
  font-weight: 600;
}

/* ============================================================
   FOOTER — CMF design footer (replaces Kadence footer builder)
   Markup: template-parts/footer-cmf.php
   Structure: hazard rule / 4-col main (brand + 3 nav) / legal bar
   ============================================================ */
/* Fallback recolor if Kadence's own footer ever renders */
.site-footer { background: var(--navy-950) !important; color: var(--navy-100) !important; }
.site-footer a { color: var(--navy-200) !important; }
.site-footer a:hover { color: var(--white) !important; }

.cmf-footer {
  background: var(--navy-950);
  color: var(--navy-100);
}

.cmf-footer-main {
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 56px 48px 32px;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 40px;
}

/* — Brand column — */
/* !important guards against WooCommerce core's
   `.woocommerce-page img { height:auto; max-width:100% }` which otherwise
   inflates the logo to column width on catalog pages */
.cmf-footer-logo {
  height: 84px !important;
  width: auto !important;
  max-width: none !important;
  display: block;
  margin-bottom: 18px;
}

.cmf-footer-blurb {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--navy-200);
  max-width: 300px;
  margin: 0 0 18px;
}

.cmf-footer-contact {
  display: grid;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 0.8125rem;
}

.cmf-footer-contact span,
.cmf-footer-contact a {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  color: var(--navy-100);
  text-decoration: none;
}

.cmf-footer-contact a:hover { color: var(--white); text-decoration: none; }

.cmf-footer-contact svg {
  width: 15px;
  height: 15px;
  flex: none;
  margin-top: 2px;
  color: var(--alloy-300);
}

.cmf-footer-tollfree { color: var(--navy-300); }

/* — Nav columns — */
.cmf-footer-col-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 16px;
}

.cmf-footer-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.cmf-footer-col a {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--navy-200);
  text-decoration: none;
}

.cmf-footer-col a:hover { color: var(--white); text-decoration: none; }

/* — Legal bar — */
.cmf-footer-legal-wrap { border-top: 1px solid var(--navy-800); }

.cmf-footer-legal {
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 18px 48px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  font-family: var(--font-mono);
  font-size: 0.71875rem; /* 11.5px */
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--navy-400);
}

.cmf-footer-legal-badge { color: var(--alloy-300); }

/* — Responsive — */
@media (max-width: 1024px) {
  .cmf-footer-main { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .cmf-footer-main { grid-template-columns: 1fr; padding: 40px 24px 24px; gap: 32px; }
  .cmf-footer-legal { padding: 16px 24px; }
}

/* ============================================================
   BLOCK-VALIDATION-SAFE LAYOUT CLASSES
   For complex backgrounds that can't use named palette slugs
   ============================================================ */
.cmf-hero-card          { background-color: rgba(255,255,255,0.07); }
.cmf-part-card          { background-color: #ffffff; border: 1px solid var(--steel-200); border-radius: var(--radius-lg); transition: box-shadow var(--dur-base), transform var(--dur-base); }
.cmf-part-card:hover    { box-shadow: 0 6px 24px rgba(0,0,0,0.12); transform: translateY(-2px); }
.cmf-part-cta-card      { background-color: var(--alloy-600); border-radius: var(--radius-lg); }
.cmf-facility-card      { background-color: var(--navy-900); border-radius: var(--radius-md); }
.cmf-trust-col          { border-right: 1px solid rgba(255,255,255,0.1); }
.cmf-plate-card         { background-color: var(--navy-900); border: 2px solid var(--navy-700); border-radius: var(--radius-lg); box-shadow: var(--shadow-plate); }

/* ============================================================
   HOMEPAGE — strip Kadence content wrapper constraints
   ============================================================ */

/* ── Hide the page title (Kadence renders it in .entry-hero) ── */
.home .entry-hero,
.home .page-hero-section,
.home .entry-header,
.home .entry-title,
.home .wp-block-post-title,
.home header.entry-header {
  display: none !important;
}

/* ── Logo: constrain to a sensible nav height ─────────────── */
.custom-logo {
  max-height: 56px !important;
  width: auto !important;
}

/* ── Header: ensure logo and nav have breathing room ─────────
      Must be set BEFORE the homepage stripping rules below so
      the content rules don't clobber the header.               */
#masthead .site-container,
#masthead .site-header-row-container-inner {
  padding-left: 48px !important;
  padding-right: 48px !important;
  max-width: var(--container-xl) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ── Remove content wrapper max-width so wp:html sections    ──
      span full viewport width. Our sections have their own
      1320px inner containers. Scoped to content area only —
      does NOT touch the header's .site-container.              */
.home .entry-content,
.home .entry-content-wrap,
.home .single-content,
.home #main,
.home .content-wrap,
.home .content-container,
.home .wrap.kt-clear {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Keep the outer #primary content-area full width */
.home #primary.content-area,
.home .content-area {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  float: none !important;
}

/* Remove WordPress block gap between sections on the homepage.
   WP adds margin-block-start to every block after the first —
   this makes sections stack flush with no whitespace between them. */
.home .entry-content > *,
.home .single-content > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ============================================================
   UTILITY
   ============================================================ */
.cmf-text-alloy   { color: var(--alloy-500) !important; }
.cmf-text-alloy-light { color: var(--alloy-300) !important; }
.cmf-text-navy    { color: var(--navy-900) !important; }
.cmf-text-white   { color: var(--white) !important; }
.cmf-text-muted   { color: var(--text-muted) !important; }
.cmf-text-mono    { font-family: var(--font-mono) !important; }
.cmf-text-display { font-family: var(--font-display) !important; text-transform: uppercase !important; }
.cmf-bg-alloy     { background-color: var(--alloy-500) !important; }
.cmf-divider      { border: none; border-top: 2px solid var(--alloy-500); width: 60px; margin: 0 0 1.5rem 0; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 960px) {
  .cmf-part-layout { grid-template-columns: 1fr; }
  .cmf-article-layout { grid-template-columns: 1fr; }
  .cmf-rfq-sidebar { position: static; }
  .cmf-toc { display: none; }
  .cmf-article-sidebar { position: static; }
}

@media (max-width: 768px) {
  .cmf-parts-grid { grid-template-columns: repeat(2, 1fr); }
  /* model grid columns handled in the MODEL CARDS section cascade */
  .cmf-why-grid   { grid-template-columns: 1fr; }
  .cmf-wear-list  { grid-template-columns: 1fr; }
  .cmf-hero-badge { display: none !important; }
  .cmf-hero-h1    { font-size: clamp(48px, 14vw, 80px) !important; }
  .cmf-cta-band-inner { flex-direction: column; }
  /* Trust bar wraps to 2 per row on mobile */
  .cmf-trust-bar-inner.wp-block-group { flex-wrap: wrap !important; }
  .cmf-trust-bar .cmf-trust-item.wp-block-group { flex: 1 1 45% !important; }
}

/* ============================================================
   BLOCK-EDITOR-COMPATIBLE OVERRIDES
   These rules support the homepage when built from real wp:blocks
   (paragraphs, headings, columns) instead of raw wp:html. They
   override WP's default flex/layout CSS where needed.
   ============================================================ */

/* ── TRUST BAR — Icon inside wp:group .cmf-trust-item ────── */
.cmf-trust-icon {
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: var(--radius-sm);
  background-color: rgba(78, 90, 102, 0.22);
  border: 1px solid var(--navy-700);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--alloy-300);
}
.cmf-trust-icon i,
.cmf-trust-icon svg { width: 21px; height: 21px; }

/* Trust bar row — flexbox so every item is identical height & alignment.
   align-items:stretch makes all items the same height; each item then
   centers its own icon+text. margin resets kill any WP flow-layout
   margin-block that would push a single item down. */
.cmf-trust-bar-inner.wp-block-group {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  max-width: var(--container-xl);
  margin: 0 auto !important;
  padding: 0 3rem;
}

.cmf-trust-bar .cmf-trust-item.wp-block-group {
  flex: 1 1 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  padding: 22px 4px !important;
  margin: 0 !important;            /* kill flow-layout margin-block */
}
.cmf-trust-bar .cmf-trust-item.wp-block-group + .cmf-trust-item.wp-block-group {
  border-left: 1px solid var(--navy-800);
  padding-left: 28px !important;
}

/* Icon + text group are flex children — neither should carry margin */
.cmf-trust-item > * { margin: 0 !important; align-self: center !important; }

/* Inner group holding the label + sub paragraphs */
.cmf-trust-item > .wp-block-group {
  display: block !important;
}
.cmf-trust-item > .wp-block-group > p { margin: 0 !important; }

/* ── SERVICES 3-UP — wp:columns now drives the layout ────── */
.cmf-services-section {
  border-bottom: 1px solid var(--border-default);
}

/* Force columns to NOT wrap on the services row, override WP block-gap */
.cmf-services-grid.wp-block-columns {
  gap: 0 !important;
  --wp--style--block-gap: 0 !important;
  margin: 0 !important;
}

/* Each service card is now a wp:column */
.wp-block-column.cmf-service-card {
  padding: 46px 40px !important;
  background: var(--surface-card);
  border-right: 1px solid var(--border-default);
  flex-basis: 0 !important;
  flex-grow: 1 !important;
}
.wp-block-column.cmf-service-card:last-child {
  border-right: none;
}

/* Accent (middle) card */
.wp-block-column.cmf-service-card.cmf-accent-card {
  background-color: var(--alloy-500);
}
.wp-block-column.cmf-service-card.cmf-accent-card h3,
.wp-block-column.cmf-service-card.cmf-accent-card .wp-block-heading {
  color: var(--white) !important;
}
.wp-block-column.cmf-service-card.cmf-accent-card p {
  color: rgba(255, 255, 255, 0.85);
}
/* Base icon circle — 56px round badge above each service heading */
.cmf-icon-circle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  background-color: var(--navy-50);
  color: var(--navy-700);
}
.cmf-icon-circle i,
.cmf-icon-circle svg { width: 26px; height: 26px; }

.wp-block-column.cmf-service-card.cmf-accent-card .cmf-icon-circle {
  background: rgba(255, 255, 255, 0.16);
  color: var(--white);
}
.wp-block-column.cmf-service-card.cmf-accent-card .cmf-read-more a {
  color: var(--white) !important;
}

/* "Learn More" link */
.cmf-read-more a {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--navy-700) !important;
  text-decoration: none !important;
}
.cmf-read-more a:hover { color: var(--alloy-500) !important; }
/* Arrow rendered via CSS so the link text stays plain editable */
.cmf-read-more a::after { content: ' →'; white-space: pre; }

/* ── PARTS GRID — wp:group with .cmf-parts-grid class ────── */
.cmf-parts-grid-intro {
  max-width: 380px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-muted);
}

/* The .cmf-parts-grid wp:group needs grid display.
   grid-auto-rows:1fr + align-items:stretch force every card to an
   identical height across all rows (fixes the "last card taller" issue). */
.cmf-parts-grid.wp-block-group {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  grid-auto-rows: 1fr !important;
  align-items: stretch !important;
  gap: 16px !important;
}

/* Each part card is now a wp:group with link inside h3 */
.cmf-part-card-v2.wp-block-group {
  position: relative;
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: 24px 22px 22px !important;
  margin: 0 !important;
  height: auto !important;
  transition: border-color var(--dur-base), box-shadow var(--dur-base), transform var(--dur-base);
}
.cmf-part-card-v2.wp-block-group:hover {
  border-color: var(--alloy-500);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.cmf-part-card-v2 .wp-block-heading a {
  color: var(--navy-900) !important;
  text-decoration: none !important;
}
.cmf-part-card-v2 .wp-block-heading a::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}

.cmf-part-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-sm);
  background-color: var(--navy-50);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--navy-700);
  margin-bottom: 40px;
}
.cmf-part-icon i { width: 24px; height: 24px; }

/* In-stock badge — top-right of the card */
.cmf-part-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
}
/* Card title (Oswald) */
.cmf-part-card-v2 .cmf-part-title.wp-block-heading {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.1875rem;
  letter-spacing: -0.01em;
  color: var(--navy-900);
}
/* "View Part ↗" link label */
.cmf-part-link {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--alloy-600) !important;
}

/* ── MODEL CARDS — wp:group with .cmf-model-card ─────────── */
/* 5 mill sizes across on desktop; 3 / 2 / 1 as space tightens */
.cmf-model-grid.wp-block-group {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  grid-auto-rows: 1fr !important;
  align-items: stretch !important;
  gap: 18px !important;
}

@media (max-width: 1180px) {
  .cmf-model-grid.wp-block-group { grid-template-columns: repeat(3, 1fr) !important; }
}

@media (max-width: 780px) {
  .cmf-model-grid.wp-block-group { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 520px) {
  .cmf-model-grid.wp-block-group { grid-template-columns: 1fr !important; }
}

.cmf-model-card.wp-block-group {
  position: relative;
  background: var(--navy-800);
  border: 1px solid var(--navy-700);
  border-radius: var(--radius-lg);
  padding: 30px 28px !important;
  margin: 0 !important;
  height: auto !important;
  overflow: hidden;
  transition: border-color var(--dur-base), transform var(--dur-base);
}
.cmf-model-card.wp-block-group:hover {
  border-color: var(--alloy-400);
  transform: translateY(-3px);
}

/* Big size heading inside model card */
.cmf-model-card .cmf-model-size,
.cmf-model-card .cmf-model-size.wp-block-heading {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: 76px !important;
  line-height: 0.9 !important;
  color: var(--white) !important;
  letter-spacing: -0.03em !important;
  margin: 0 !important;
}
/* The size is the card link — make its anchor cover the whole card */
.cmf-model-card .cmf-model-size a {
  color: var(--white) !important;
  text-decoration: none !important;
}
.cmf-model-card .cmf-model-size a::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}
/* Badge above the link overlay */
.cmf-model-card .cmf-part-badge { z-index: 2; }

.cmf-model-label {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 18px;
  color: var(--alloy-300) !important;
}

/* Model card as a column so the footer pins to the bottom */
.cmf-model-card.wp-block-group {
  display: flex !important;
  flex-direction: column !important;
}
.cmf-model-footer.wp-block-group {
  padding-top: 16px;
  border-top: 1px solid var(--navy-700);
  margin-top: auto !important;
}

.cmf-model-codes {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--navy-200) !important;
}

.cmf-model-footer a {
  color: var(--alloy-300) !important;
  text-decoration: none !important;
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 13px;
}
.cmf-model-footer a:hover { color: var(--white) !important; }

/* ── ABOUT — wp:image needs the gradient overlay back ───── */
.cmf-about-photo-wrap.wp-block-column {
  position: relative;
}

.cmf-about-photo {
  position: relative;
  overflow: hidden;
  margin: 0 !important;
  border-radius: var(--radius-lg) !important;
  border: 2px solid var(--navy-700);
  box-shadow: var(--shadow-plate);
}
.cmf-about-photo img {
  width: 100% !important;
  display: block;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 0 !important;
}
.cmf-about-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(2, 22, 52, 0.30), rgba(2, 22, 52, 0.18));
  mix-blend-mode: multiply;
  pointer-events: none;
}

/* "50." stat badge floating over the bottom-left of the image */
.cmf-about-stat-badge.wp-block-group {
  position: absolute;
  bottom: 22px;
  left: -22px;
  background: var(--white);
  border: 2px solid var(--navy-700);
  border-radius: var(--radius-md);
  padding: 14px 20px !important;
  box-shadow: var(--shadow-md);
  z-index: 2;
}
.cmf-about-stat-badge .cmf-about-stat-num,
.cmf-about-stat-badge .cmf-about-stat-num.wp-block-heading {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: 40px !important;
  line-height: 1 !important;
  color: var(--navy-900) !important;
  text-transform: none !important;
  margin: 0 !important;
}

/* Manufacturer stamp — paragraph spans inside */
.cmf-mfr-stamp-name {
  display: block;
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 15px;
  color: var(--navy-900);
  line-height: 1.05;
}
.cmf-mfr-stamp-sub {
  display: block;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--alloy-600);
}

/* ── CAPABILITY MATRIX — wp:table inside dark section ───── */

/* Section background fallback (navy-800) — same defensive approach as
   the Statement, in case the named-palette preset CSS isn't generated. */
.cmf-matrix-section {
  background-color: var(--navy-800) !important;
}
.cmf-matrix-section .cmf-matrix-h2.wp-block-heading {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(28px, 3.6vw, 50px);
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--white) !important;
}

figure.cmf-matrix-table.wp-block-table {
  margin: 0;
  border: 1px solid var(--navy-600);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.cmf-matrix-table table {
  border-collapse: collapse;
  width: 100%;
  background: transparent;
}
/* Kill WordPress core's default 3px thead border-bottom + any cell borders */
.cmf-matrix-table table,
.cmf-matrix-table thead,
.cmf-matrix-table td,
.cmf-matrix-table th { border: none !important; }

.cmf-matrix-table thead tr { background: var(--navy-950); }
.cmf-matrix-table thead th {
  padding: 16px 20px;
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--navy-300);
  font-weight: 500;
  text-align: left;
}
.cmf-matrix-table tbody tr {
  border-top: 1px solid var(--navy-700) !important;
}
.cmf-matrix-table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.02);
}
.cmf-matrix-table td {
  padding: 22px 20px !important;
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--navy-100);
  vertical-align: middle;
}
/* First column — "Process" — prominent Oswald, no left accent */
.cmf-matrix-table td:first-child {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 14px;
  font-weight: 600;
  color: var(--white);
}

/* ── CUSTOMER STRIP ──────────────────────────────────────── */
.cmf-customers-eyebrow {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.cmf-customers-strip.wp-block-group {
  gap: 14px 40px;
}

/* Customer name now a <p> instead of <span> */
.cmf-customer-name {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 22px;
  color: var(--steel-400) !important;
  font-weight: 600;
}

/* ── RESOURCES ───────────────────────────────────────────── */

/* Section: background fallback (offwhite) + top divider */
.cmf-resources-section {
  background-color: var(--paper) !important;
  border-top: 1px solid var(--border-default);
}

/* Big "Technical Resources" heading (override h2 base size) */
.cmf-resources-section .cmf-resources-h2.wp-block-heading {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(36px, 4.6vw, 62px);
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--navy-900);
}

/* Outline "All Articles" button */
.cmf-btn-outline-navy .wp-block-button__link {
  background-color: transparent !important;
  border: 1px solid var(--border-strong) !important;
  color: var(--navy-900) !important;
  padding: 12px 18px !important;
  font-size: 13px !important;
  letter-spacing: 0.06em !important;
}
.cmf-btn-outline-navy .wp-block-button__link:hover {
  border-color: var(--alloy-500) !important;
  color: var(--alloy-500) !important;
  background-color: transparent !important;
  transform: none !important;
}

/* Article rows */
.cmf-resource-item.wp-block-group {
  align-items: center;
  border-bottom: 1px solid var(--border-default);
}
.cmf-resource-item.cmf-resource-item-last {
  border-bottom: none;
}

.cmf-resource-cat {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--alloy-600) !important;
  font-weight: 600;
}

.cmf-resource-item .cmf-resource-title.wp-block-heading,
.cmf-resource-item .wp-block-heading {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 22px;
  letter-spacing: -0.01em;
  line-height: 1.1;
}
.cmf-resource-item .wp-block-heading a {
  color: var(--navy-900) !important;
  text-decoration: none !important;
}
.cmf-resource-item:hover .wp-block-heading a {
  color: var(--alloy-500) !important;
}

/* Arrow icon at the end of each row */
.cmf-resource-arrow {
  width: 22px;
  height: 22px;
  color: var(--navy-600);
  flex: none;
}

/* ── CTA BAND (block-editor-converted) ───────────────────── */

/* Eyebrow */
.cmf-cta-band .cmf-cta-eyebrow {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
}

/* Heading (override h2 base color/size) */
.cmf-cta-band .cmf-cta-heading.wp-block-heading {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(32px, 4vw, 52px);
  line-height: 0.95;
  letter-spacing: -0.015em;
  color: var(--white) !important;
}

/* Right column stack — keep tight */
.cmf-cta-band .cmf-cta-right.wp-block-group {
  gap: 0;
  align-items: flex-start;
}

/* Big phone number (now an editable paragraph with a link) */
.cmf-cta-phone-block {
  margin: 0;
}
.cmf-cta-phone-block a {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--white) !important;
  text-decoration: none !important;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 38px;
  letter-spacing: 0.01em;
  line-height: 1;
}
.cmf-cta-phone-block a:hover {
  color: rgba(255, 255, 255, 0.85) !important;
}
/* Phone icon rendered via CSS (white lucide phone) so the number stays plain editable text */
.cmf-cta-phone-block a::before {
  content: '';
  width: 26px;
  height: 26px;
  flex: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}

/* Toll-free line */
.cmf-cta-tollfree {
  padding-left: 38px;
}
.cmf-cta-tollfree a {
  font-family: var(--font-mono) !important;
  font-size: 13px !important;
  color: rgba(255, 255, 255, 0.65) !important;
  text-decoration: none !important;
}
.cmf-cta-tollfree a:hover { color: rgba(255, 255, 255, 0.9) !important; }

/* Button arrow rendered via CSS so button text stays editable */
.cmf-cta-band .cmf-btn-white .wp-block-button__link::after {
  content: ' →';
  white-space: pre;
}

/* ── EYEBROW: centered variant — flex-center the rule + text ── */
.cmf-eyebrow.has-text-align-center {
  display: flex !important;
  justify-content: center !important;
  text-align: center;
}

/* ── EYEBROW: direct child of a full-bleed constrained section ──
   Constrained layout centers children via margin-left/right:auto,
   which inline-level boxes ignore — an inline-flex eyebrow pins to
   the viewport edge instead of the content column. Block-level flex
   picks up the max-width + auto margins; content stays left. */
.wp-block-group.alignfull > p.cmf-eyebrow {
  display: flex;
}

/* ============================================================
   ABOUT SECTION (block-editor-converted)
   All rules scoped to .cmf-about-section to prevent any global
   side effects. Photo + badge stay in wp:html; right column is
   fully editable wp:blocks.
   ============================================================ */

/* Section wrapper — backgroundColor handled by has-cmf-offwhite-background-color */

/* Center the columns horizontally within the section, with a tighter max-width.
   Gap + side padding live here (moved out of inline block styles so the block
   markup stays canonical and passes editor validation). */
.cmf-about-section > .wp-block-columns.cmf-about-cols {
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  align-items: center !important;
  gap: 4rem !important;
  padding-left: 3rem !important;
  padding-right: 3rem !important;
}

.cmf-about-section > .wp-block-columns > .wp-block-column {
  align-self: center !important;
}

/* Left column: photo wrapper needs relative for badge */
.cmf-about-section .cmf-about-photo-wrap {
  position: relative;
}

/* Photo — border + plate shadow + overlay */
.cmf-about-section .cmf-about-photo {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg);
  border: 2px solid var(--navy-700);
  box-shadow: var(--shadow-plate);
}
.cmf-about-section .cmf-about-photo img {
  width: 100%;
  display: block;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  margin: 0;
}
.cmf-about-section .cmf-about-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(2,22,52,0.30), rgba(2,22,52,0.18));
  mix-blend-mode: multiply;
  pointer-events: none;
}

/* Floating "50." stat badge */
.cmf-about-section .cmf-about-stat-badge {
  position: absolute;
  bottom: 22px;
  left: -22px;
  background: var(--white);
  border: 2px solid var(--navy-700);
  border-radius: var(--radius-md);
  padding: 14px 20px;
  box-shadow: var(--shadow-md);
  z-index: 2;
}
.cmf-about-section .cmf-about-stat-num {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 40px;
  line-height: 1;
  color: var(--navy-900);
}
.cmf-about-section .cmf-about-stat-label {
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}

/* Right column: headline (override h2 base) */
.cmf-about-section .cmf-about-h2.wp-block-heading {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(36px, 4.2vw, 58px);
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--navy-900);
}

/* Body paragraph */
.cmf-about-section .cmf-about-text {
  font-size: 16.5px;
  line-height: 1.7;
  color: var(--text-body);
  max-width: 540px;
}

/* Manufacturer stamp (still HTML, scoped classes) */
.cmf-about-section .cmf-about-stamp-wrap {
  margin: 0;
}
.cmf-about-section .cmf-about-stamp {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: 2px solid var(--alloy-500);
  border-radius: var(--radius-sm);
  padding: 9px 16px 9px 12px;
  background: rgba(78, 90, 102, 0.08);
  transform: rotate(-1.2deg);
}
.cmf-about-section .cmf-about-stamp-icon {
  display: flex;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background-color: var(--alloy-500);
  color: #fff;
  align-items: center;
  justify-content: center;
  flex: none;
}
.cmf-about-section .cmf-about-stamp-icon i,
.cmf-about-section .cmf-about-stamp-icon svg {
  width: 19px;
  height: 19px;
}
.cmf-about-section .cmf-about-stamp-name {
  display: block;
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 15px;
  color: var(--navy-900);
  line-height: 1.05;
}
.cmf-about-section .cmf-about-stamp-sub {
  display: block;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--alloy-600);
}

/* Stats row — gap + margin moved here from inline block styles */
.cmf-about-section .cmf-about-stats-row {
  gap: 2.25rem !important;
  margin-top: 1.75rem !important;
  margin-bottom: 1.875rem !important;
}
/* Stats row — 3 columns that shrink to content */
.cmf-about-section .cmf-about-stats-row .wp-block-column {
  flex-grow: 0;
  flex-basis: auto !important;
}

/* Stat numbers (h3 with .cmf-stat-num class) */
.cmf-about-section .cmf-stat-num,
.cmf-about-section h3.cmf-stat-num,
.cmf-about-section .cmf-stat-num.wp-block-heading {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 38px;
  color: var(--navy-900);
  line-height: 1;
  text-transform: none;
  letter-spacing: 0;
}

/* Stat labels */
.cmf-about-section .cmf-stat-label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}

/* Buttons should not be affected by global block-margin reset */
.cmf-about-section .wp-block-buttons {
  margin: 0;
}

/* ============================================================
   STATEMENT SECTION (editable group wrapper; iconned line in HTML)
   ============================================================ */

/* Background fallback — guarantees the dark fill regardless of whether
   the named-palette preset CSS (.has-cmf-navy-dark-background-color)
   gets generated by the active theme's global stylesheet. */
.cmf-statement-section {
  background-color: var(--navy-950) !important;
}

.cmf-statement-section .cmf-statement-heading.wp-block-heading,
.cmf-statement-heading {
  max-width: 1060px;
  margin: 0 auto;
  text-align: center;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: var(--white) !important;
  line-height: 1.22 !important;
  letter-spacing: -0.01em !important;
  font-size: clamp(28px, 4.4vw, 54px) !important;
}

/* Inline icon chips within the statement */
.cmf-statement-heading .cmf-chip {
  display: inline-flex;
  vertical-align: middle;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  margin: 0 16px;
  align-items: center;
  justify-content: center;
  background: var(--navy-700);
  color: var(--white);
  border: 1px solid var(--navy-600);
}
.cmf-statement-heading .cmf-chip.cmf-chip-accent {
  background-color: var(--alloy-500);
  border-color: var(--alloy-500);
}
.cmf-statement-heading .cmf-chip i,
.cmf-statement-heading .cmf-chip svg {
  width: 30px;
  height: 30px;
}

/* ============================================================
   CUSTOMERS SECTION (block-editor-converted) — extra scoping
   ============================================================ */
.cmf-customers-section .cmf-customers-strip.wp-block-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 14px 40px;
}

/* ============================================================
   PARTS-BY-TYPE SECTION (block-editor-converted)
   ============================================================ */
.cmf-parts-section { background-color: var(--paper) !important; }

/* Heading row: title block left, intro paragraph right */
.cmf-parts-head.wp-block-group {
  align-items: flex-end;
}
.cmf-parts-h2.wp-block-heading {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(28px, 3.6vw, 50px);
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--navy-900);
}

/* ============================================================
   SHOP-BY-MILL-SIZE SECTION (block-editor-converted)
   ============================================================ */
.cmf-models-section { background-color: var(--navy-900) !important; }
.cmf-models-h2.wp-block-heading {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(28px, 3.6vw, 50px);
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--white) !important;
}
/* Arrow icon in the model card footer */
.cmf-model-arrow {
  width: 18px;
  height: 18px;
  color: var(--alloy-300);
  flex: none;
}



/* Converted in-stock / stocked badges (now real paragraph blocks) */
.cmf-stock-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  margin: 0 !important;
  background: var(--green-500);
  color: #fff !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  padding: 4px 10px;
  border-radius: var(--radius-xs);
  line-height: 1.3;
  z-index: 3;
}


/* ============================================================
   ICON GLYPHS — CSS ::before/::after on parent blocks
   (no empty blocks → no editor layout-picker; renders everywhere)
   ============================================================ */

/* Trust-bar icon box */
.cmf-trust-item::before {
  content:""; flex:none; width:42px; height:42px; border-radius:var(--radius-sm);
  background-color:rgba(78,90,102,0.22); border:1px solid var(--navy-700);
  background-repeat:no-repeat; background-position:center; background-size:21px 21px;
}

/* Service icon circle */
.cmf-service-card::before {
  content:""; display:block; flex:none; width:56px; height:56px; border-radius:50%;
  background-color:var(--navy-50); margin-bottom:22px;
  background-repeat:no-repeat; background-position:center; background-size:26px 26px;
}
.cmf-service-card.cmf-accent-card::before { background-color:rgba(255,255,255,0.16); }

/* Part-card icon box */
.cmf-part-card-v2::before {
  content:""; display:block; width:48px; height:48px; border-radius:var(--radius-sm);
  background-color:var(--navy-50); margin-bottom:40px;
  background-repeat:no-repeat; background-position:center; background-size:24px 24px;
}

/* Model-card footer arrow */
.cmf-model-footer::after {
  content:""; flex:none; width:18px; height:18px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M5 12h14%22 /%3E%3Cpath d=%22m12 5 7 7-7 7%22 /%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:18px 18px;
}

/* Resource-row arrow */
.cmf-resource-item::after {
  content:""; flex:none; width:22px; height:22px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230A2F6C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M7 7h10v10%22 /%3E%3Cpath d=%22M7 17 17 7%22 /%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:22px 22px;
}

/* Manufacturer-stamp icon circle */
.cmf-about-stamp::before {
  content:""; flex:none; width:34px; height:34px; border-radius:50%;
  background-color:var(--alloy-500);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z%22 /%3E%3Cpath d=%22m9 12 2 2 4-4%22 /%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:19px 19px;
}

/* Per-icon glyphs */
.cmf-tico-factory::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 16h.01%22 /%3E%3Cpath d=%22M16 16h.01%22 /%3E%3Cpath d=%22M3 19a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.5a.5.5 0 0 0-.769-.422l-4.462 2.844A.5.5 0 0 1 15 10.5v-2a.5.5 0 0 0-.769-.422L9.77 10.922A.5.5 0 0 1 9 10.5V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2z%22 /%3E%3Cpath d=%22M8 16h.01%22 /%3E%3C/svg%3E");}
.cmf-tico-award::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22m15.477 12.89 1.515 8.526a.5.5 0 0 1-.81.47l-3.58-2.687a1 1 0 0 0-1.197 0l-3.586 2.686a.5.5 0 0 1-.81-.469l1.514-8.526%22 /%3E%3Ccircle cx=%2212%22 cy=%228%22 r=%226%22 /%3E%3C/svg%3E");}
.cmf-tico-package-check::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 22V12%22 /%3E%3Cpath d=%22m16 17 2 2 4-4%22 /%3E%3Cpath d=%22M21 11.127V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.729l7 4a2 2 0 0 0 2 .001l1.32-.753%22 /%3E%3Cpath d=%22M3.29 7 12 12l8.71-5%22 /%3E%3Cpath d=%22m7.5 4.27 8.997 5.148%22 /%3E%3C/svg%3E");}
.cmf-tico-ruler::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z%22 /%3E%3Cpath d=%22m14.5 12.5 2-2%22 /%3E%3Cpath d=%22m11.5 9.5 2-2%22 /%3E%3Cpath d=%22m8.5 6.5 2-2%22 /%3E%3Cpath d=%22m17.5 15.5 2-2%22 /%3E%3C/svg%3E");}
.cmf-sico-settings::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915%22 /%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%223%22 /%3E%3C/svg%3E");}
.cmf-sico-flame::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3q1 4 4 6.5t3 5.5a1 1 0 0 1-14 0 5 5 0 0 1 1-3 1 1 0 0 0 5 0c0-2-1.5-3-1.5-5q0-2 2.5-4%22 /%3E%3C/svg%3E");}
.cmf-sico-scan-line::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M3 7V5a2 2 0 0 1 2-2h2%22 /%3E%3Cpath d=%22M17 3h2a2 2 0 0 1 2 2v2%22 /%3E%3Cpath d=%22M21 17v2a2 2 0 0 1-2 2h-2%22 /%3E%3Cpath d=%22M7 21H5a2 2 0 0 1-2-2v-2%22 /%3E%3Cpath d=%22M7 12h10%22 /%3E%3C/svg%3E");}
.cmf-pico-cog::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M11 10.27 7 3.34%22 /%3E%3Cpath d=%22m11 13.73-4 6.93%22 /%3E%3Cpath d=%22M12 22v-2%22 /%3E%3Cpath d=%22M12 2v2%22 /%3E%3Cpath d=%22M14 12h8%22 /%3E%3Cpath d=%22m17 20.66-1-1.73%22 /%3E%3Cpath d=%22m17 3.34-1 1.73%22 /%3E%3Cpath d=%22M2 12h2%22 /%3E%3Cpath d=%22m20.66 17-1.73-1%22 /%3E%3Cpath d=%22m20.66 7-1.73 1%22 /%3E%3Cpath d=%22m3.34 17 1.73-1%22 /%3E%3Cpath d=%22m3.34 7 1.73 1%22 /%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%222%22 /%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%228%22 /%3E%3C/svg%3E");}
.cmf-pico-circle-dot::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22 /%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%221%22 /%3E%3C/svg%3E");}
.cmf-pico-disc::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22 /%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%222%22 /%3E%3C/svg%3E");}
.cmf-pico-box::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z%22 /%3E%3Cpath d=%22m3.3 7 8.7 5 8.7-5%22 /%3E%3Cpath d=%22M12 22V12%22 /%3E%3C/svg%3E");}
.cmf-pico-shovel::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M21.56 4.56a1.5 1.5 0 0 1 0 2.122l-.47.47a3 3 0 0 1-4.212-.03 3 3 0 0 1 0-4.243l.44-.44a1.5 1.5 0 0 1 2.121 0z%22 /%3E%3Cpath d=%22M3 22a1 1 0 0 1-1-1v-3.586a1 1 0 0 1 .293-.707l3.355-3.355a1.205 1.205 0 0 1 1.704 0l3.296 3.296a1.205 1.205 0 0 1 0 1.704l-3.355 3.355a1 1 0 0 1-.707.293z%22 /%3E%3Cpath d=%22m9 15 7.879-7.878%22 /%3E%3C/svg%3E");}
.cmf-pico-disc-3::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22 /%3E%3Cpath d=%22M6 12c0-1.7.7-3.2 1.8-4.2%22 /%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%222%22 /%3E%3Cpath d=%22M18 12c0 1.7-.7 3.2-1.8 4.2%22 /%3E%3C/svg%3E");}
.cmf-pico-fan::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M10.827 16.379a6.082 6.082 0 0 1-8.618-7.002l5.412 1.45a6.082 6.082 0 0 1 7.002-8.618l-1.45 5.412a6.082 6.082 0 0 1 8.618 7.002l-5.412-1.45a6.082 6.082 0 0 1-7.002 8.618l1.45-5.412Z%22 /%3E%3Cpath d=%22M12 12v.01%22 /%3E%3C/svg%3E");}
.cmf-pico-circle::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22 /%3E%3C/svg%3E");}

/* ============================================================
   WOOCOMMERCE — RFQ CATALOG
   Templates: /woocommerce/ dir + template-parts/shop-filters.php
   Design: offline design file v2 (Shop/Category/Tag/Search/Product)
   ============================================================ */

/* ---- Shared container for catalog chrome ------------------ */
.cmf-shop-container {
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 0 48px;
}

/* Kill commerce leftovers everywhere, defensively */
.cmf-site .price,
.cmf-site .onsale,
.cmf-site .added_to_cart,
.cmf-site .add_to_cart_button { display: none !important; }

/* Breadcrumb links + light variant (paper background pages) */
.cmf-breadcrumb a { color: inherit; text-decoration: none; }
.cmf-breadcrumb a:hover { color: var(--white); }
.cmf-breadcrumb-light { color: var(--text-muted); }
.cmf-breadcrumb-light span:last-child { color: var(--alloy-600); }
.cmf-breadcrumb-light a:hover { color: var(--navy-900); }

/* Hero subtitle shared by shop/category heroes */
.cmf-hero-sub {
  margin-top: 18px;
  max-width: 560px;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--navy-100);
}

/* Badge base + navy tone (stock badges already defined above) */
.cmf-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  padding: 4px 10px;
  border-radius: var(--radius-pill, 999px);
  text-decoration: none;
}
.cmf-badge svg { width: 12px; height: 12px; }
.cmf-badge-instock { border-radius: 999px; }
.cmf-badge-mto     { border-radius: 999px; }
.cmf-badge-navy {
  background: var(--navy-50);
  color: var(--navy-700);
  border: 1px solid rgba(3,33,83,0.22);
}
a.cmf-badge-navy:hover { background: var(--navy-100); }

/* ---- RFQ + phone buttons ----------------------------------- */
.cmf-btn-rfq {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--alloy-500);
  color: var(--white) !important;
  border-radius: var(--radius-sm);
  padding: 0 26px;
  height: 52px;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.9375rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-decoration: none !important;
  transition: background var(--dur-base);
}
.cmf-btn-rfq:hover { background: var(--navy-900); }
.cmf-btn-rfq svg { width: 18px; height: 18px; }

.cmf-btn-phone {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 52px;
  padding: 0 22px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-strong);
  color: var(--navy-900) !important;
  text-decoration: none !important;
  font-family: var(--font-mono);
  font-size: 0.9375rem;
  background: transparent;
  transition: border-color var(--dur-base), background var(--dur-base);
}
.cmf-btn-phone:hover { border-color: var(--navy-900); background: var(--white); }
.cmf-btn-phone svg { width: 17px; height: 17px; color: var(--alloy-600); }

/* ---- Category hero (rich header) --------------------------- */
.cmf-cat-hero-grid {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 48px;
  align-items: center;
}
.cmf-cat-hero-img img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: var(--radius-lg);
  border: 1px solid var(--navy-700);
  display: block;
}
.cmf-cat-chips { display: flex; gap: 10px; margin-top: 22px; flex-wrap: wrap; }
.cmf-cat-chip {
  padding: 8px 15px;
  border-radius: 999px;
  border: 1px solid var(--navy-600);
  color: var(--white);
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 0.8125rem;
  text-decoration: none;
  transition: background var(--dur-base);
}
.cmf-cat-chip:hover { background: var(--navy-700); color: var(--white); }
.cmf-cat-chip.is-active { background: var(--alloy-500); border-color: var(--alloy-500); }

/* ---- Tag hero (light token header) ------------------------- */
.cmf-tag-hero {
  background: var(--surface-sunken);
  border-bottom: 1px solid var(--border-default);
  padding: 34px 0 36px;
}
.cmf-tag-hero .cmf-breadcrumb { margin-bottom: 22px; }
.cmf-tag-hero-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}
.cmf-tag-token-wrap { display: flex; align-items: center; gap: 20px; }
.cmf-tag-token {
  flex: none;
  width: 66px;
  height: 66px;
  border-radius: var(--radius-md);
  background: var(--navy-900);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--alloy-300);
  box-shadow: var(--shadow-plate);
}
.cmf-tag-token svg { width: 30px; height: 30px; }
.cmf-tag-hero-label {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--alloy-600);
  margin-bottom: 6px;
}
.cmf-tag-hero-row h1 {
  font-size: clamp(32px, 3.8vw, 50px);
  line-height: 0.94;
  letter-spacing: -0.015em;
  margin: 0;
}
.cmf-tag-count {
  align-self: flex-start;
  margin-top: 4px;
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--white);
  background: var(--alloy-500);
  border-radius: 999px;
  padding: 3px 11px;
}
.cmf-tag-hero-side { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.cmf-tag-clear {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 0.78125rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  text-decoration: none;
}
.cmf-tag-clear:hover { color: var(--navy-900); }
.cmf-tag-clear svg { width: 14px; height: 14px; }
.cmf-tag-related { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.cmf-tag-related-label {
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  margin-right: 2px;
}

/* ---- Search hero -------------------------------------------- */
.cmf-search-hero { background: var(--navy-900); padding: 40px 0 44px; }
.cmf-search-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--white);
  border-radius: var(--radius-md);
  padding: 6px 6px 6px 18px;
  max-width: 620px;
  box-shadow: var(--shadow-plate);
}
.cmf-search-bar svg { width: 20px; height: 20px; color: var(--navy-500); flex: none; }
.cmf-search-bar input[type="search"] {
  flex: 1;
  border: 0;
  outline: none;
  font-family: var(--font-sans);
  font-size: 1rem;
  color: var(--navy-900);
  background: transparent;
  min-width: 0;
}
.cmf-search-bar button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--alloy-500);
  color: var(--white);
  padding: 11px 20px;
  border: 0;
  border-radius: var(--radius-sm);
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition: background var(--dur-base);
}
.cmf-search-bar button:hover { background: var(--navy-900); }
.cmf-search-meta { margin: 18px 0 0; font-size: 0.9375rem; color: var(--navy-100); }
.cmf-search-meta strong { color: var(--white); }
.cmf-search-meta .cmf-search-q { color: var(--alloy-300); }

/* ---- Shop shell: sidebar + main ----------------------------- */
.cmf-shop-shell {
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 52px 48px 80px;
  display: grid;
  grid-template-columns: 288px 1fr;
  gap: 48px;
  align-items: start;
}

/* ---- Filter sidebar ----------------------------------------- */
.cmf-shop-filters { position: sticky; top: 24px; }
.cmf-filters-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 20px;
}
.cmf-filters-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.25rem;
  color: var(--navy-900);
  font-weight: 600;
}
.cmf-filters-clear {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--alloy-600);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-decoration: none;
}
.cmf-filters-clear:hover { color: var(--navy-900); }

.cmf-facet {
  padding-bottom: 22px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--border-default);
}
.cmf-facet-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.9375rem;
  color: var(--navy-900);
  font-weight: 600;
  margin-bottom: 14px;
}
.cmf-facet-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; }
.cmf-facet-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 0;
  text-decoration: none;
  color: var(--text-body);
  font-size: 0.875rem;
}
.cmf-facet-check {
  flex: none;
  width: 17px;
  height: 17px;
  border-radius: var(--radius-xs);
  border: 1.5px solid var(--border-strong);
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  color: transparent;
}
.cmf-facet-check svg { width: 12px; height: 12px; }
.cmf-facet-row:hover .cmf-facet-check { border-color: var(--alloy-500); }
.cmf-facet-row.is-active .cmf-facet-check {
  border: 0;
  background: var(--alloy-500);
  color: var(--white);
}
.cmf-facet-row.is-active .cmf-facet-label { color: var(--navy-900); font-weight: 600; }
.cmf-facet-label { flex: 1; }
.cmf-facet-count { font-family: var(--font-mono); font-size: 0.75rem; color: var(--text-faint); }

.cmf-facet-swatches { display: flex; flex-wrap: wrap; gap: 8px; }
.cmf-facet-swatch {
  padding: 7px 13px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-strong);
  background: transparent;
  color: var(--text-body);
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 0.875rem;
  text-decoration: none;
  transition: border-color var(--dur-base);
}
.cmf-facet-swatch:hover { border-color: var(--navy-900); color: var(--navy-900); }
.cmf-facet-swatch.is-active { border: 0; background: var(--navy-900); color: var(--white); }

.cmf-facet-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.cmf-facet-pill {
  padding: 5px 11px;
  border-radius: 999px;
  border: 1px solid var(--border-strong);
  background: var(--white);
  font-family: var(--font-mono);
  font-size: 0.71875rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text-muted);
  text-decoration: none;
}
.cmf-facet-pill:hover { color: var(--navy-900); border-color: var(--navy-900); }
.cmf-facet-pill.is-active { background: var(--navy-900); border-color: var(--navy-900); color: var(--white); }

.cmf-filters-stamp { margin-top: 4px; }

/* ---- Toolbar: result count + ordering ----------------------- */
.cmf-shop-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border-default);
  margin-bottom: 28px;
}
.cmf-shop-toolbar .woocommerce-result-count {
  float: none !important;
  margin: 0 !important;
  font-size: 0.875rem;
  color: var(--text-muted);
}
.cmf-shop-toolbar .woocommerce-ordering {
  float: none !important;
  margin: 0 !important;
}
.cmf-shop-toolbar .woocommerce-ordering select {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 9px 38px 9px 14px;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--navy-900);
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%23143F84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;
  cursor: pointer;
}

/* ---- Product grid (ul.products) ------------------------------ */
.cmf-shop-main { min-width: 0; }
.cmf-shop-main ul.products,
.cmf-related-wrap ul.products {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.cmf-related-wrap ul.products { grid-template-columns: repeat(4, 1fr); }
.cmf-shop-main ul.products::before,
.cmf-shop-main ul.products::after,
.cmf-related-wrap ul.products::before,
.cmf-related-wrap ul.products::after { display: none; }
ul.products li.product.cmf-prod-card {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---- Product card ------------------------------------------- */
.cmf-prod-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color var(--dur-base), box-shadow var(--dur-base), transform var(--dur-base);
}
.cmf-prod-card:hover {
  border-color: var(--alloy-500);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.cmf-prod-link { display: flex; flex-direction: column; flex: 1; text-decoration: none !important; color: inherit; }

.cmf-prod-thumb {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--navy-800);
  background-image:
    linear-gradient(rgba(155,177,210,0.11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155,177,210,0.11) 1px, transparent 1px);
  background-size: 22px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.cmf-prod-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cmf-prod-thumb-badge { position: absolute; top: 12px; left: 12px; z-index: 2; }
.cmf-prod-thumb-size {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  font-family: var(--font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--white);
  background: rgba(2,22,52,0.55);
  padding: 3px 7px;
  border-radius: var(--radius-xs);
}

.cmf-prod-body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.cmf-prod-cat {
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--alloy-600);
  margin-bottom: 7px;
}
.cmf-prod-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.3125rem;
  line-height: 1.02;
  letter-spacing: -0.01em;
  color: var(--navy-900);
  margin: 0 0 12px;
}
.cmf-prod-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-bottom: 16px;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--text-muted);
}
.cmf-prod-meta em { font-style: normal; color: var(--text-faint); }
.cmf-prod-foot {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 14px;
  border-top: 1px solid var(--border-subtle);
}
.cmf-prod-foot-cta {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--navy-900);
}
.cmf-prod-foot-cta svg { width: 15px; height: 15px; color: var(--alloy-500); transition: transform var(--dur-base); }
.cmf-prod-card:hover .cmf-prod-foot-cta svg { transform: translateX(3px); }

/* ---- Pagination ---------------------------------------------- */
.cmf-shop-main .woocommerce-pagination {
  margin-top: 44px;
  text-align: center;
}
.cmf-shop-main .woocommerce-pagination ul.page-numbers {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0 !important;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cmf-shop-main .woocommerce-pagination ul.page-numbers li { border: 0 !important; margin: 0; }
.cmf-shop-main .woocommerce-pagination .page-numbers li .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-default);
  background: transparent;
  color: var(--navy-700);
  font-family: var(--font-display);
  font-size: 1rem;
  text-decoration: none;
  transition: border-color var(--dur-base);
}
.cmf-shop-main .woocommerce-pagination .page-numbers li .page-numbers:hover { border-color: var(--navy-900); color: var(--navy-900); }
.cmf-shop-main .woocommerce-pagination .page-numbers li .page-numbers.current {
  background: var(--navy-900);
  border-color: var(--navy-900);
  color: var(--white);
}

/* ---- Empty state ---------------------------------------------- */
.cmf-shop-empty { padding: 40px 0 20px; max-width: 560px; }
.cmf-shop-empty h2 { font-size: clamp(28px, 3vw, 40px); margin-bottom: 12px; }
.cmf-shop-empty p { color: var(--text-muted); font-size: 1.0625rem; margin-bottom: 24px; }
.cmf-shop-empty-actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ---- Single product: top ---------------------------------------- */
.cmf-product-top {
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 44px 48px 64px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}
.cmf-product-gallery { position: sticky; top: 24px; }
.cmf-product-gallery-badge { position: absolute; top: 16px; left: 16px; z-index: 10; }

/* Woo gallery → design layout: thumbs rail left, main image right */
/* Neutralize Woo core float/width on gallery + summary inside our grid */
.cmf-product-top div.images,
.cmf-product-top div.summary {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.cmf-product-gallery .woocommerce-product-gallery { position: relative; width: 100% !important; }
.cmf-product-gallery .woocommerce-product-gallery__wrapper { margin: 0; }
.cmf-product-gallery .woocommerce-product-gallery__image,
.cmf-product-gallery .woocommerce-product-gallery__image img {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.cmf-product-gallery .woocommerce-product-gallery__image img {
  border: 1px solid var(--border-default);
  background: var(--navy-800);
  width: 100%;
  height: auto;
}
/* Thumb rail LEFT of the main image (design layout) when thumbs exist */
.cmf-product-gallery .woocommerce-product-gallery:has(.flex-control-thumbs) {
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 16px;
  align-items: start;
}
.cmf-product-gallery .woocommerce-product-gallery:has(.flex-control-thumbs) .woocommerce-product-gallery__wrapper {
  grid-column: 2;
  grid-row: 1;
}
.cmf-product-gallery .flex-control-thumbs {
  grid-column: 1;
  grid-row: 1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-content: start;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cmf-product-gallery .flex-control-thumbs li { float: none !important; width: auto !important; }
.cmf-product-gallery .flex-control-thumbs img {
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-default);
  opacity: 1;
  cursor: pointer;
}
.cmf-product-gallery .flex-control-thumbs img.flex-active { border: 2px solid var(--alloy-500); }
.cmf-product-gallery .woocommerce-product-gallery__trigger {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 9;
  width: 34px;
  height: 34px;
  border-radius: var(--radius-sm);
  background: rgba(2,22,52,0.55);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ---- Single product: summary ------------------------------------ */
.cmf-product-summary .cmf-breadcrumb { margin-bottom: 14px; }
.cmf-product-badges { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.cmf-product-title {
  font-size: clamp(36px, 4vw, 54px) !important;
  line-height: 0.94 !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
}
.cmf-product-rating { display: flex; align-items: center; gap: 12px; margin: 14px 0 4px; }
.cmf-product-rating-count {
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  color: var(--text-muted);
  text-decoration: none;
}
.cmf-product-rating-count:hover { color: var(--navy-900); }
.cmf-site .star-rating span::before { color: var(--alloy-500); }
.cmf-site .star-rating::before { color: var(--border-strong); }
.cmf-product-shortdesc { margin-top: 14px; }
.cmf-product-shortdesc p {
  font-size: 1.03125rem;
  line-height: 1.65;
  color: var(--text-body);
  max-width: 520px;
  margin: 0 0 22px;
}

/* Key spec strip (visible attributes) — auto-fit so 1–6 cells fill the row */
.cmf-product-specs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1px;
  background: var(--border-default);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 26px;
}
.cmf-product-spec { background: var(--white); padding: 13px 15px; }
.cmf-product-spec-label {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: 4px;
}
.cmf-product-spec-value {
  font-family: var(--font-mono);
  font-size: 0.875rem;
  color: var(--navy-900);
  font-weight: 500;
}

.cmf-product-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-bottom: 22px; }
.cmf-product-stamp { margin-bottom: 24px; }
.cmf-mfr-stamp-icon {
  display: flex;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--alloy-500);
  color: var(--white);
  align-items: center;
  justify-content: center;
  flex: none;
}
.cmf-mfr-stamp-icon svg { width: 19px; height: 19px; }

.cmf-product-meta { border-top: 1px solid var(--border-default); padding-top: 18px; display: grid; gap: 10px; }
.cmf-product-meta-row { display: flex; gap: 14px; font-size: 0.875rem; }
.cmf-product-meta-label {
  width: 150px;
  flex: none;
  font-family: var(--font-mono);
  font-size: 0.71875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  padding-top: 1px;
}
.cmf-product-meta-value { color: var(--text-body); }
.cmf-product-meta-value a { color: var(--alloy-600); text-decoration: none; }
.cmf-product-meta-value a:hover { color: var(--navy-900); }
.cmf-mono { font-family: var(--font-mono); }

/* ---- Single product: tabs ---------------------------------------- */
.cmf-product-tabs-wrap {
  border-top: 1px solid var(--border-default);
  padding: 56px 0 40px;
}
.cmf-product-tabs-wrap .woocommerce-tabs {
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 0 48px;
}
.cmf-product-tabs-wrap .woocommerce-tabs ul.wc-tabs {
  display: flex;
  gap: 4px;
  border: 0 !important;
  border-bottom: 2px solid var(--border-default) !important;
  margin: 0 0 32px !important;
  padding: 0 !important;
  flex-wrap: wrap;
  background: none !important;
  list-style: none;
}
.cmf-product-tabs-wrap .woocommerce-tabs ul.wc-tabs::before,
.cmf-product-tabs-wrap .woocommerce-tabs ul.wc-tabs::after { display: none !important; }
.cmf-product-tabs-wrap .woocommerce-tabs ul.wc-tabs li {
  border: 0 !important;
  background: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.cmf-product-tabs-wrap .woocommerce-tabs ul.wc-tabs li a {
  display: block;
  padding: 14px 22px !important;
  margin-bottom: -2px;
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 1.0625rem !important;
  font-weight: 600 !important;
  color: var(--text-muted) !important;
  border-bottom: 2px solid transparent !important;
  text-decoration: none;
}
.cmf-product-tabs-wrap .woocommerce-tabs ul.wc-tabs li.active a {
  color: var(--navy-900) !important;
  border-bottom-color: var(--alloy-500) !important;
}
.cmf-product-tabs-wrap .woocommerce-Tabs-panel {
  max-width: 760px;
  font-size: 1.03125rem;
  line-height: 1.8;
  color: var(--text-body);
}
.cmf-product-tabs-wrap .woocommerce-Tabs-panel > h2:first-of-type { display: none; }

/* Additional information table → spec table */
.cmf-product-tabs-wrap table.woocommerce-product-attributes {
  width: 100%;
  border: 1px solid var(--border-default) !important;
  border-radius: var(--radius-md);
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--surface-card);
}
.cmf-product-tabs-wrap .woocommerce-product-attributes tr:nth-child(even) { background: var(--steel-50); }
.cmf-product-tabs-wrap .woocommerce-product-attributes th {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 500;
  text-align: left;
  padding: 9px 14px !important;
  border: 0 !important;
  background: none !important;
  width: 40%;
}
.cmf-product-tabs-wrap .woocommerce-product-attributes td {
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--navy-900);
  padding: 9px 14px !important;
  border: 0 !important;
  background: none !important;
}
.cmf-product-tabs-wrap .woocommerce-product-attributes td p { margin: 0; font-style: normal; }

/* ---- Reviews ------------------------------------------------------ */
.cmf-product-tabs-wrap #reviews .commentlist {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cmf-product-tabs-wrap #reviews .commentlist li {
  padding: 22px 0;
  border-top: 1px solid var(--border-default);
  margin: 0;
}
.cmf-product-tabs-wrap #reviews .commentlist li:first-child { border-top: 0; }
.cmf-product-tabs-wrap #reviews .commentlist li img.avatar {
  border-radius: 50%;
  width: 44px;
  height: 44px;
  float: left;
  margin-right: 14px;
  background: var(--navy-50);
  border: 0;
  padding: 0;
  position: static;
}
.cmf-product-tabs-wrap #reviews .comment-text {
  margin-left: 58px !important;
  border: 0 !important;
  padding: 0 !important;
}
.cmf-product-tabs-wrap #reviews .meta {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1rem;
  color: var(--navy-900);
  margin-bottom: 6px;
}
.cmf-product-tabs-wrap #reviews .meta .woocommerce-review__dash { display: none; }
.cmf-product-tabs-wrap #reviews .meta time {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--text-faint);
  text-transform: none;
  display: block;
}
.cmf-product-tabs-wrap #review_form .comment-reply-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.125rem;
  color: var(--navy-900);
  font-weight: 600;
}
.cmf-product-tabs-wrap #review_form input[type="text"],
.cmf-product-tabs-wrap #review_form input[type="email"],
.cmf-product-tabs-wrap #review_form textarea {
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-family: var(--font-sans);
  width: 100%;
}
.cmf-product-tabs-wrap #review_form .form-submit input {
  background: var(--alloy-500);
  color: var(--white);
  border: 0;
  border-radius: var(--radius-sm);
  padding: 13px 26px;
  font-family: var(--font-display);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.875rem;
  cursor: pointer;
}
.cmf-product-tabs-wrap #review_form .form-submit input:hover { background: var(--navy-900); }

/* ---- Related parts ------------------------------------------------ */
.cmf-related-wrap {
  background: var(--surface-sunken);
  padding: 72px 0;
  border-top: 1px solid var(--border-default);
}
.cmf-related-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 30px;
  flex-wrap: wrap;
  gap: 14px;
}
.cmf-related-head h2 {
  font-size: clamp(30px, 3.4vw, 44px);
  margin: 0;
}
.cmf-related-all {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 12px 18px;
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.8125rem;
  color: var(--navy-900);
  text-decoration: none;
  transition: border-color var(--dur-base);
}
.cmf-related-all:hover { border-color: var(--navy-900); }
.cmf-related-all svg { width: 15px; height: 15px; }
.cmf-related-wrap section.related > h2 { display: none; }

/* ---- Responsive ---------------------------------------------------- */
@media (max-width: 1100px) {
  .cmf-shop-shell { grid-template-columns: 1fr; gap: 32px; padding: 40px 32px 64px; }
  .cmf-shop-filters { position: static; }
  .cmf-shop-main ul.products { grid-template-columns: repeat(2, 1fr); }
  .cmf-related-wrap ul.products { grid-template-columns: repeat(2, 1fr); }
  .cmf-product-top { grid-template-columns: 1fr; gap: 36px; padding: 36px 32px 48px; }
  .cmf-product-gallery { position: static; }
  .cmf-cat-hero-grid { grid-template-columns: 1fr; }
  .cmf-cat-hero-img { display: none; }
  .cmf-shop-container,
  .cmf-product-tabs-wrap .woocommerce-tabs { padding-left: 32px; padding-right: 32px; }
}

@media (max-width: 640px) {
  .cmf-shop-shell { padding: 32px 20px 48px; }
  .cmf-shop-main ul.products,
  .cmf-related-wrap ul.products { grid-template-columns: 1fr; }
  .cmf-shop-toolbar { flex-direction: column; align-items: flex-start; gap: 12px; }
  .cmf-product-top { padding: 28px 20px 40px; }
  .cmf-product-specs { grid-template-columns: repeat(2, 1fr); }
  .cmf-shop-container,
  .cmf-product-tabs-wrap .woocommerce-tabs { padding-left: 20px; padding-right: 20px; }
  .cmf-product-meta-label { width: 110px; }
  .cmf-tag-hero-side { align-items: flex-start; }
}

/* ---- Strip Kadence content wrapper spacing on WooCommerce pages ----
   Same treatment as the homepage: our templates are full-bleed sections
   with their own 1320px inner containers, so the theme's content-area
   padding/max-width just adds stray gaps (e.g. between CTA band + footer). */
.woocommerce-page .content-area,
.single-product .content-area,
.woocommerce-page #primary.content-area,
.single-product #primary.content-area {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}
.woocommerce-page #main,
.single-product #main,
.woocommerce-page .content-wrap,
.single-product .content-wrap,
.woocommerce-page .content-container,
.single-product .content-container,
.woocommerce-page .site-main,
.single-product .site-main {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ============================================================
   SERVICE PAGE (Mill Rebuild & Overhaul + future service pages)
   Design: offline design file v3, PageService
   ============================================================ */

/* Intro photo — plate-framed shop photo */
.cmf-photo-plate img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  border: 2px solid var(--navy-700);
  box-shadow: var(--shadow-plate);
}

/* Process steps — numbered rows on navy */
.cmf-process-list .wp-block-columns {
  border-top: 1px solid var(--navy-700);
  margin: 0 !important;
  padding: 28px 0;
}

.cmf-process-num,
p.cmf-process-num {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: 64px !important;
  line-height: 0.8 !important;
  color: transparent !important;
  -webkit-text-stroke: 1.5px var(--alloy-400);
  margin: 0 !important;
}

.cmf-process-list h3 {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.625rem;
  color: var(--white) !important;
  margin: 0 0 8px;
  letter-spacing: -0.01em;
}

.cmf-process-list .cmf-process-desc {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--navy-100) !important;
  margin: 0;
  max-width: 760px;
}

/* Why CMF — icon squares on the existing .cmf-why-card.
   Icons are inline <svg> (editor-sandbox-safe); flex centers them.
   The ::before data-URI variants below remain for legacy markup. */
.cmf-why-icon {
  flex: none;
  width: 50px;
  height: 50px;
  border-radius: var(--radius-sm);
  background: var(--navy-50);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cmf-why-icon::before {
  content: '';
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px 24px;
}
.cmf-wico-factory::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 16h.01%22 /%3E%3Cpath d=%22M16 16h.01%22 /%3E%3Cpath d=%22M3 19a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.5a.5.5 0 0 0-.769-.422l-4.462 2.844A.5.5 0 0 1 15 10.5v-2a.5.5 0 0 0-.769-.422L9.77 10.922A.5.5 0 0 1 9 10.5V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2z%22 /%3E%3Cpath d=%22M8 16h.01%22 /%3E%3C/svg%3E");}
.cmf-wico-award::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22m15.477 12.89 1.515 8.526a.5.5 0 0 1-.81.47l-3.58-2.687a1 1 0 0 0-1.197 0l-3.586 2.686a.5.5 0 0 1-.81-.469l1.514-8.526%22 /%3E%3Ccircle cx=%2212%22 cy=%228%22 r=%226%22 /%3E%3C/svg%3E");}
.cmf-wico-ruler::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z%22 /%3E%3Cpath d=%22m14.5 12.5 2-2%22 /%3E%3Cpath d=%22m11.5 9.5 2-2%22 /%3E%3Cpath d=%22m8.5 6.5 2-2%22 /%3E%3Cpath d=%22m17.5 15.5 2-2%22 /%3E%3C/svg%3E");}
.cmf-wico-truck::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2%22 /%3E%3Cpath d=%22M15 18H9%22 /%3E%3Cpath d=%22M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14%22 /%3E%3Ccircle cx=%2217%22 cy=%2218%22 r=%222%22 /%3E%3Ccircle cx=%227%22 cy=%2218%22 r=%222%22 /%3E%3C/svg%3E");}

/* ============================================================
   QUOTE / CONTACT PAGE + FLUENT FORMS THEMING
   Design: offline design file v3, PageContact
   ============================================================ */

/* Form card (left column) */
.cmf-quote-card {
  background: var(--white);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.cmf-quote-card-inner { padding: 34px 36px 38px; }
.cmf-quote-card h2 {
  font-size: 1.625rem !important;
  margin: 0 0 6px !important;
}
.cmf-quote-card .cmf-quote-intro {
  font-size: 0.90625rem;
  color: var(--text-muted);
  margin: 0 0 26px;
}

/* Sidebar (right column) */
.cmf-quote-side { position: sticky; top: 24px; display: grid; gap: 18px; }

.cmf-quote-info {
  background: var(--navy-900);
  border: 2px solid var(--navy-700);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-plate);
  overflow: hidden;
}
.cmf-quote-info-inner { padding: 26px 24px; }
.cmf-quote-info-title {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.75rem !important;
  color: var(--alloy-300) !important;
  margin: 0 0 14px !important;
  font-weight: 600;
}
.cmf-quote-info-row {
  position: relative;
  padding-left: 32px;
  margin: 0 0 18px !important;
}
.cmf-quote-info-row:last-child { margin-bottom: 0 !important; }
.cmf-quote-info-row::before {
  content: '';
  position: absolute;
  left: 0;
  top: 3px;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-size: 18px 18px;
}
.cmf-quote-info-row .cmf-quote-info-label {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.65625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-300);
  margin-bottom: 3px;
}
.cmf-quote-info-row,
.cmf-quote-info-row a {
  font-size: 0.90625rem;
  color: var(--white) !important;
  line-height: 1.5;
  text-decoration: none;
}
.cmf-qico-phone::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384%22 /%3E%3C/svg%3E");}
.cmf-qico-mail::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width=%2220%22 height=%2216%22 x=%222%22 y=%224%22 rx=%222%22 /%3E%3Cpath d=%22m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7%22 /%3E%3C/svg%3E");}
.cmf-qico-map::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z%22 /%3E%3Ccircle cx=%2212%22 cy=%2210%22 r=%223%22 /%3E%3C/svg%3E");}
.cmf-qico-clock::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22 /%3E%3Cpolyline points=%2212 6 12 12 16 14%22 /%3E%3C/svg%3E");}

/* Directions band under the info card */
.cmf-quote-map {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 64px;
  background-color: var(--navy-800);
  background-image:
    linear-gradient(rgba(155,177,210,0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155,177,210,0.12) 1px, transparent 1px);
  background-size: 24px 24px;
  border-top: 1px solid var(--navy-700);
  font-family: var(--font-mono);
  font-size: 0.71875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-200) !important;
  text-decoration: none !important;
}
.cmf-quote-map:hover { color: var(--white) !important; }

.cmf-quote-stamp-card {
  background: var(--white);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: 22px;
}

.cmf-quote-note {
  position: relative;
  padding-left: 32px;
  font-size: 0.875rem;
  color: var(--text-body);
  line-height: 1.4;
}
.cmf-quote-note::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 2px;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233C4651' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z'/%3E%3C/svg%3E") no-repeat center / 18px 18px;
}

/* ---- Fluent Forms → design system ------------------------- */
.cmf-quote-card .frm-fluent-form,
.cmf-quote-card .fluentform { font-family: var(--font-sans); }

.cmf-quote-card .fluentform .ff-el-group { margin-bottom: 18px; }

.cmf-quote-card .fluentform .ff-el-input--label label {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-strong);
}
.cmf-quote-card .fluentform .ff-el-is-required.asterisk-right label:after { color: var(--red-500); }

.cmf-quote-card .fluentform .ff-el-form-control {
  width: 100%;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--text-body);
  background: var(--white);
  box-shadow: none;
  height: auto;
}
.cmf-quote-card .fluentform .ff-el-form-control:focus {
  border-color: var(--border-focus);
  outline: 2px solid var(--border-focus);
  outline-offset: 0;
}
.cmf-quote-card .fluentform textarea.ff-el-form-control { resize: vertical; }

.cmf-quote-card .fluentform select.ff-el-form-control {
  appearance: none;
  -webkit-appearance: none;
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%23143F84' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;
  padding-right: 36px;
}

/* Section labels: "01 — Your Information" */
.cmf-quote-card .fluentform .ff-el-section-break {
  border: 0;
  margin: 28px 0 16px;
  padding: 0;
}
.cmf-quote-card .fluentform .ff-el-section-break:first-child { margin-top: 0; }
.cmf-quote-card .fluentform .ff-el-section-break .ff-el-section-title {
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--alloy-600);
  margin: 0;
  font-weight: 600;
}
.cmf-quote-card .fluentform .ff-el-section-break hr { display: none; }

/* 2-col field rows (Fluent Forms containers) */
.cmf-quote-card .fluentform .ff-t-container { display: flex; gap: 18px; }
.cmf-quote-card .fluentform .ff-t-cell { flex: 1; min-width: 0; }

/* Help text */
.cmf-quote-card .fluentform .ff-el-help-message {
  font-size: 0.75rem;
  color: var(--text-faint);
  margin-top: 5px;
}

/* Checkbox */
.cmf-quote-card .fluentform .ff-el-form-check-label {
  font-size: 0.875rem;
  color: var(--text-body);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}

/* Submit */
.cmf-quote-card .fluentform .ff-btn-submit {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--alloy-500) !important;
  color: var(--white) !important;
  border: 0;
  border-radius: var(--radius-sm);
  padding: 0 26px;
  height: 52px;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.9375rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: background var(--dur-base);
}
.cmf-quote-card .fluentform .ff-btn-submit:hover { background: var(--navy-900) !important; }

/* Validation + confirmation */
.cmf-quote-card .fluentform .error.text-danger,
.cmf-quote-card .fluentform .ff-el-is-error .text-danger {
  font-size: 0.75rem;
  color: var(--red-500);
}
.cmf-quote-card .ff-message-success {
  border: 1px solid var(--green-500);
  background: var(--green-100);
  color: var(--green-600);
  border-radius: var(--radius-md);
  padding: 16px 18px;
  font-size: 0.9375rem;
}

/* Phone note next to submit */
.cmf-quote-call-note {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--text-muted);
}

/* ---- Responsive ---- */
@media (max-width: 960px) {
  .cmf-quote-side { position: static; }
  .cmf-quote-card-inner { padding: 24px 20px 28px; }
  .cmf-quote-card .fluentform .ff-t-container { flex-direction: column; gap: 0; }
  .cmf-process-num, p.cmf-process-num { font-size: 44px !important; }
}

/* Quote info rows are groups (label p + value p) */
.cmf-quote-info-row p {
  margin: 0 !important;
  font-size: 0.90625rem;
  color: var(--white);
  line-height: 1.5;
}
.cmf-quote-info-row p.cmf-quote-info-label {
  font-family: var(--font-mono);
  font-size: 0.65625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-300);
  margin-bottom: 3px !important;
}
.cmf-mfr-stamp .wp-block-group { gap: 0; }
.cmf-mfr-stamp p { margin: 0 !important; }

@media (max-width: 960px) {
  .cmf-quote-cols { flex-direction: column; }
}

/* ============================================================
   PALETTE PRESET FALLBACKS
   WP isn't emitting .has-{slug}-color/-background-color preset
   rules from theme.json on this install (known issue — earlier
   sections patched this per-class). Define them globally so any
   named-palette block color works on every page.
   ============================================================ */
.has-cmf-navy-background-color       { background-color: var(--navy-900) !important; }
.has-cmf-navy-dark-background-color  { background-color: var(--navy-950) !important; }
.has-cmf-navy-light-background-color { background-color: var(--navy-700) !important; }
.has-cmf-navy-mid-background-color   { background-color: var(--navy-800) !important; }
.has-cmf-navy-100-background-color   { background-color: var(--navy-100) !important; }
.has-cmf-navy-50-background-color    { background-color: var(--navy-50) !important; }
.has-cmf-alloy-background-color      { background-color: var(--alloy-500) !important; }
.has-cmf-alloy-dark-background-color { background-color: var(--alloy-600) !important; }
.has-cmf-white-background-color      { background-color: var(--white) !important; }
.has-cmf-offwhite-background-color   { background-color: var(--paper) !important; }
.has-cmf-steel-50-background-color   { background-color: var(--steel-50) !important; }
.has-cmf-gray-light-background-color { background-color: var(--steel-200) !important; }
.has-cmf-green-background-color      { background-color: var(--green-500) !important; }

.has-cmf-navy-color       { color: var(--navy-900) !important; }
.has-cmf-navy-dark-color  { color: var(--navy-950) !important; }
.has-cmf-navy-light-color { color: var(--navy-700) !important; }
.has-cmf-navy-100-color   { color: var(--navy-100) !important; }
.has-cmf-navy-50-color    { color: var(--navy-50) !important; }
.has-cmf-alloy-color      { color: var(--alloy-500) !important; }
.has-cmf-alloy-light-color{ color: var(--alloy-300) !important; }
.has-cmf-white-color      { color: var(--white) !important; }
.has-cmf-gray-color       { color: var(--steel-500) !important; }
.has-cmf-text-color       { color: var(--steel-800) !important; }
.has-cmf-green-color      { color: var(--green-500) !important; }

/* Hero sub paragraph safety on dark hero */
.cmf-page-hero-content p { color: var(--navy-100); }
.cmf-page-hero-content p.cmf-eyebrow { color: var(--alloy-300); }

/* ============================================================
   PAGE WRAPPER STRIP — all standard pages
   Same treatment as the homepage: kill Kadence's title hero and
   boxed white content wrapper so full-bleed sections span edge
   to edge. (Woo pages handled separately above.)
   ============================================================ */
.page .entry-hero,
.page .page-hero-section,
.page .entry-header,
.page header.entry-header,
.page .entry-title,
.page .wp-block-post-title {
  display: none !important;
}

.page .entry-content,
.page .entry-content-wrap,
.page .single-content,
.page #main,
.page .content-wrap,
.page .content-container,
.page .wrap.kt-clear {
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

.page #primary.content-area,
.page .content-area {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
  background: transparent !important;
}

.page .content-bg {
  background: transparent !important;
}

.page .entry-content > *,
.page .single-content > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ---- Validation-safe replacements (July 2026) -------------- */

/* Hero sub: className carries size/spacing (no inline styles in markup) */
.cmf-page-hero-sub {
  font-size: 1.0625rem;
  margin-top: 1.25rem;
  max-width: 620px;
}

/* CTA band buttons: centering/padding via CSS, not block attrs */
.cmf-cta-band .wp-block-buttons {
  display: flex;
  justify-content: center;
  padding-bottom: 2rem;
  margin: 0;
}

/* FAQ as core details blocks (accordion look, native disclosure) */
.wp-block-details.cmf-faq-item {
  background: var(--white);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  margin: 0 0 10px;
  padding: 0;
}
.wp-block-details.cmf-faq-item summary {
  list-style: none;
  cursor: pointer;
  position: relative;
  padding: 16px 52px 16px 20px;
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 1rem;
  color: var(--navy-900);
}
.wp-block-details.cmf-faq-item summary::-webkit-details-marker { display: none; }
.wp-block-details.cmf-faq-item summary::after {
  content: '+';
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.375rem;
  line-height: 1;
  color: var(--alloy-500);
}
.wp-block-details.cmf-faq-item[open] summary::after { content: '\2013'; }
.wp-block-details.cmf-faq-item > :not(summary) { padding: 0 20px; }
.wp-block-details.cmf-faq-item p {
  margin: 0 0 16px;
  color: var(--text-body);
  font-size: 0.9375rem;
  line-height: 1.65;
}

/* Breadcrumb as a real paragraph block (editor-visible; the nav.cmf-breadcrumb
   flex variant remains for the PHP-rendered Woo templates) */
p.cmf-breadcrumb {
  display: block;
  color: var(--alloy-300);
}
p.cmf-breadcrumb a {
  color: var(--navy-200);
  text-decoration: none;
}
p.cmf-breadcrumb a:hover { color: var(--white); }

/* ============================================================
   SERVICE INDEX PAGE (design v2 — "Central Machine and Fabrication - var1")
   All-real-block page: icons + photos are CSS-painted onto empty
   groups so everything renders in the editor canvas. Photo classes
   point at images/w-ph-*.jpg (web-sized derivatives of the shop
   originals; regenerate with sips -Z 1400 from project root).
   ============================================================ */

/* ── capability strip ── */
.cmf-cap-strip {
  background: var(--navy-950) !important;
  border-bottom: 1px solid var(--navy-800);
}
.cmf-cap-strip-inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 3rem;
}
.cmf-cap-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 4px;
}
.cmf-cap-item + .cmf-cap-item { border-left: 1px solid var(--navy-800); padding-left: 28px; }
.cmf-cap-ico {
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: var(--radius-sm);
  background: rgba(78, 90, 102, 0.22);
  border: 1px solid var(--navy-700);
  position: relative;
}
.cmf-cap-ico::before {
  content: '';
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 21px 21px;
}
.cmf-capico-factory::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 16h.01%22 /%3E%3Cpath d=%22M16 16h.01%22 /%3E%3Cpath d=%22M3 19a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.5a.5.5 0 0 0-.769-.422l-4.462 2.844A.5.5 0 0 1 15 10.5v-2a.5.5 0 0 0-.769-.422L9.77 10.922A.5.5 0 0 1 9 10.5V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2z%22 /%3E%3Cpath d=%22M8 16h.01%22 /%3E%3C/svg%3E");}
.cmf-capico-ruler::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z%22 /%3E%3Cpath d=%22m14.5 12.5 2-2%22 /%3E%3Cpath d=%22m11.5 9.5 2-2%22 /%3E%3Cpath d=%22m8.5 6.5 2-2%22 /%3E%3Cpath d=%22m17.5 15.5 2-2%22 /%3E%3C/svg%3E");}
.cmf-capico-scale::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3v18%22 /%3E%3Cpath d=%22m19 8 3 8a5 5 0 0 1-6 0zV7%22 /%3E%3Cpath d=%22M3 7h1a17 17 0 0 0 8-2 17 17 0 0 0 8 2h1%22 /%3E%3Cpath d=%22m5 8 3 8a5 5 0 0 1-6 0zV7%22 /%3E%3Cpath d=%22M7 21h10%22 /%3E%3C/svg%3E");}
.cmf-capico-truck::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2397A2AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2%22 /%3E%3Cpath d=%22M15 18H9%22 /%3E%3Cpath d=%22M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14%22 /%3E%3Ccircle cx=%2217%22 cy=%2218%22 r=%222%22 /%3E%3Ccircle cx=%227%22 cy=%2218%22 r=%222%22 /%3E%3C/svg%3E");}
.cmf-cap-a {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 1.125rem !important;
  color: var(--white) !important;
  line-height: 1.15;
  margin: 0 !important;
}
.cmf-cap-b {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  color: var(--navy-300) !important;
  line-height: 1.15;
  margin: 2px 0 0 !important;
}

/* ── section shells ── */
.cmf-svc-intro   { padding: 64px 0 8px; }
.cmf-svc-sec     { padding: 48px 0 72px; }
.cmf-svc-sec-alt { padding: 64px 0 72px; border-top: 1px solid var(--border-default); }
.cmf-steps-sec   { background-color: var(--navy-900) !important; padding: 80px 0 84px; }
.cmf-svc-faq     { padding: 72px 0 80px; }
.cmf-svc-intro .cmf-mfr-stamp { justify-self: end; }

/* section header row (eyebrow+H2 left, note right) */
.cmf-svc-sechead { margin-bottom: 30px !important; }
.cmf-svc-secnote {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--text-muted);
  margin: 0;
}

/* ── service card grid ── */
.cmf-svc-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 1fr;
  align-items: stretch !important;
  gap: 18px;
}
.cmf-svc-card {
  position: relative;
  display: flex !important;
  flex-direction: column;
  margin: 0 !important;
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}
.cmf-svc-card:hover {
  border-color: var(--alloy-500);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.cmf-svc-card-photo {
  height: 150px;
  flex: none;
  background-color: var(--navy-800);
  background-image:
    linear-gradient(color-mix(in srgb, var(--navy-200) 10%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--navy-200) 10%, transparent) 1px, transparent 1px);
  background-size: 24px 24px;
}
.cmf-svcph-mill     .cmf-svc-card-photo { background-image: linear-gradient(180deg, rgba(2,22,52,0.24), rgba(2,22,52,0.66)), url('images/w-ph-mill.jpg'); background-size: cover; background-position: 50% 42%; }
.cmf-svcph-journals .cmf-svc-card-photo { background-image: linear-gradient(180deg, rgba(2,22,52,0.24), rgba(2,22,52,0.66)), url('images/w-ph-journals.jpg'); background-size: cover; background-position: center; }
.cmf-svcph-welding  .cmf-svc-card-photo { background-image: linear-gradient(180deg, rgba(2,22,52,0.24), rgba(2,22,52,0.66)), url('images/w-ph-welding.jpg'); background-size: cover; background-position: center; }
.cmf-svcph-cnc      .cmf-svc-card-photo { background-image: linear-gradient(180deg, rgba(2,22,52,0.24), rgba(2,22,52,0.66)), url('images/w-ph-cnc.jpg'); background-size: cover; background-position: center; }
.cmf-svcph-grinding .cmf-svc-card-photo { background-image: linear-gradient(180deg, rgba(2,22,52,0.24), rgba(2,22,52,0.66)), url('images/w-ph-grinding.jpg'); background-size: cover; background-position: center; }
.cmf-svcph-roller   .cmf-svc-card-photo { background-image: linear-gradient(180deg, rgba(2,22,52,0.24), rgba(2,22,52,0.66)), url('images/w-ph-roller.jpg'); background-size: cover; background-position: center; }
.cmf-svc-body {
  padding: 0 26px 26px;
  display: flex !important;
  flex-direction: column;
  flex: 1;
}
.cmf-svc-ico {
  flex: none;
  width: 54px;
  height: 54px;
  margin: -27px 0 16px !important;
  border-radius: 50%;
  background: var(--surface-card);
  box-shadow: var(--shadow-md);
  position: relative;
  z-index: 1;
}
.cmf-svc-ico::before {
  content: '';
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 25px 25px;
}
.cmf-svcico-hammer::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22m15 12-9.373 9.373a1 1 0 0 1-3.001-3L12 9%22 /%3E%3Cpath d=%22m18 15 4-4%22 /%3E%3Cpath d=%22m21.5 11.5-1.914-1.914A2 2 0 0 1 19 8.172v-.344a2 2 0 0 0-.586-1.414l-1.657-1.657A6 6 0 0 0 12.516 3H9l1.243 1.243A6 6 0 0 1 12 8.485V10l2 2h1.172a2 2 0 0 1 1.414.586L18.5 14.5%22 /%3E%3C/svg%3E");}
.cmf-svcico-flame::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3q1 4 4 6.5t3 5.5a1 1 0 0 1-14 0 5 5 0 0 1 1-3 1 1 0 0 0 5 0c0-2-1.5-3-1.5-5q0-2 2.5-4%22 /%3E%3C/svg%3E");}
.cmf-svcico-scale::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3v18%22 /%3E%3Cpath d=%22m19 8 3 8a5 5 0 0 1-6 0zV7%22 /%3E%3Cpath d=%22M3 7h1a17 17 0 0 0 8-2 17 17 0 0 0 8 2h1%22 /%3E%3Cpath d=%22m5 8 3 8a5 5 0 0 1-6 0zV7%22 /%3E%3Cpath d=%22M7 21h10%22 /%3E%3C/svg%3E");}
.cmf-svcico-layers::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z%22 /%3E%3Cpath d=%22M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12%22 /%3E%3Cpath d=%22M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17%22 /%3E%3C/svg%3E");}
.cmf-svcico-movex::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23032153' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22m18 8 4 4-4 4%22 /%3E%3Cpath d=%22M2 12h20%22 /%3E%3Cpath d=%22m6 8-4 4 4 4%22 /%3E%3C/svg%3E");}
.cmf-svc-card .cmf-svc-title {
  font-size: 1.375rem !important;
  line-height: 1.04;
  letter-spacing: -0.01em;
  color: var(--navy-900);
  margin: 0 0 9px !important;
}
.cmf-svc-card .cmf-svc-title a {
  color: inherit;
  text-decoration: none;
}
.cmf-svc-card .cmf-svc-title a::after {
  content: '';
  position: absolute;
  inset: 0;
}
.cmf-svc-lead {
  font-size: 0.90625rem !important;
  line-height: 1.55;
  color: var(--text-muted);
  margin: 0 0 16px !important;
}
ul.cmf-svc-bullets {
  list-style: none;
  margin: 0 0 18px !important;
  padding: 0 !important;
  display: grid;
  gap: 7px;
}
ul.cmf-svc-bullets li {
  position: relative;
  padding-left: 24px;
  font-size: 0.84375rem;
  line-height: 1.45;
  color: var(--text-body);
  margin: 0;
}
ul.cmf-svc-bullets li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 3px;
  width: 15px;
  height: 15px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234E5A66' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M20 6 9 17l-5-5%22 /%3E%3C/svg%3E") center / contain no-repeat;
}
.cmf-svc-foot {
  margin-top: auto !important;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--border-subtle);
}
.cmf-svc-lead-time {
  font-family: var(--font-mono) !important;
  font-size: 0.71875rem !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-faint) !important;
  margin: 0 !important;
}
.cmf-svc-lead-time strong { color: var(--navy-900); font-weight: 500; }
.cmf-svc-view {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.78125rem !important;
  font-weight: 600;
  color: var(--navy-900) !important;
  white-space: nowrap;
  margin: 0 !important;
}
.cmf-svc-view::after { content: ' \2192'; color: var(--alloy-500); white-space: pre; }

/* ── three steps band ── */
.cmf-steps-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 44px;
}
.cmf-step {
  border-top: 2px solid var(--alloy-500);
  padding-top: 22px;
  margin: 0 !important;
}
.cmf-step-num {
  font-family: var(--font-display) !important;
  font-weight: 700;
  font-size: 2.875rem !important;
  line-height: 0.9;
  color: transparent !important;
  -webkit-text-stroke: 1.4px var(--alloy-400);
  margin: 0 0 12px !important;
}
.cmf-step h3 {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 1.375rem;
  letter-spacing: -0.01em;
  color: var(--white);
  margin: 0 0 8px;
}
.cmf-step p {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--navy-100);
  margin: 0;
}

/* ── responsive ── */
@media (max-width: 1023px) {
  .cmf-cap-strip-inner { grid-template-columns: repeat(2, 1fr); padding: 0 1.5rem; }
  .cmf-cap-item + .cmf-cap-item { border-left: none; padding-left: 4px; }
  .cmf-svc-grid { grid-template-columns: repeat(2, 1fr); }
  .cmf-steps-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .cmf-cap-strip-inner { grid-template-columns: 1fr; }
  .cmf-svc-grid { grid-template-columns: 1fr; }
  .cmf-svc-intro { padding-top: 40px; }
}