/* MyPerfectRide front-end styles v2 — matches "Concept 2A" (warm, beginner-friendly) homepage design */
:root{
  --mpr-bg:oklch(0.98 0.008 85);
  --mpr-bg-soft:oklch(0.985 0.006 85);
  --mpr-card:oklch(0.995 0.004 85);
  --mpr-card-2:oklch(0.99 0.006 85);
  --mpr-ink:oklch(0.26 0.01 60);
  --mpr-muted:oklch(0.46 0.01 60);
  --mpr-muted-2:oklch(0.52 0.01 60);
  --mpr-border:oklch(0.9 0.008 75);
  --mpr-border-soft:oklch(0.93 0.006 75);
  --mpr-primary:oklch(0.62 0.13 45);
  --mpr-primary-dark:oklch(0.55 0.13 45);
  --mpr-primary-ink:oklch(0.99 0.01 80);
  --mpr-primary-tint:oklch(0.94 0.02 60);
  --mpr-hero-grad-1:oklch(0.955 0.014 78);
  --mpr-hero-grad-2:oklch(0.98 0.008 85);
  --mpr-table-bg:oklch(0.955 0.012 78);
  --mpr-dark:oklch(0.26 0.01 60);
  --mpr-dark-card:oklch(0.32 0.01 60);
  --mpr-dark-border:oklch(0.42 0.01 60);
  --mpr-dark-muted:oklch(0.78 0.008 80);
  --mpr-dark-input-text:oklch(0.72 0.008 80);
  --mpr-aero:oklch(0.58 0.18 25);
  --mpr-aero-tint:oklch(0.94 0.03 25);
  --mpr-endurance:oklch(0.55 0.13 250);
  --mpr-endurance-tint:oklch(0.94 0.02 250);
  --mpr-gravel:oklch(0.55 0.11 140);
  --mpr-gravel-tint:oklch(0.94 0.03 140);
  --mpr-star:oklch(0.75 0.14 75);
  --mpr-shadow-sm:0 1px 2px rgba(30,32,20,.05), 0 1px 3px rgba(30,32,20,.06);
  --mpr-shadow-md:0 6px 16px rgba(30,32,20,.07), 0 2px 6px rgba(30,32,20,.05);
  --mpr-shadow-lg:0 24px 60px -30px rgba(65,50,30,0.35);
  --mpr-font-serif:'Newsreader', serif;
  --mpr-font-sans:'Space Grotesk', system-ui, sans-serif;
  --mpr-font-mono:'IBM Plex Mono', monospace;
}

body{ background: var(--mpr-bg); }

/* =========================================================
 * SITE HEADER (site-wide)
 * ========================================================= */
header.xpro-theme-builder-header{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;
  width:100%; box-sizing:border-box;
  padding:18px max(24px, calc((100% - 1180px)/2));
  background:var(--mpr-card-2); border-bottom:1px solid var(--mpr-border);
  position:sticky; top:0; z-index:500;
}
header.xpro-theme-builder-header p.main-title.xpro-hidden{ display:flex !important; margin:0; line-height:1; }
header.xpro-theme-builder-header .main-title a{
  font-family:var(--mpr-font-serif); font-weight:600; font-size:24px; letter-spacing:-0.01em; color:var(--mpr-ink); text-decoration:none;
}
nav.xpro-theme-builder-header-nav{ flex:1; display:flex; justify-content:flex-end; min-width:0; }
nav.xpro-theme-builder-header-nav .e-con-inner{ width:auto; }
.xpro-elementor-horizontal-navbar-nav{ display:flex; align-items:center; gap:26px; list-style:none; margin:0; padding:0; flex-wrap:wrap; }
.xpro-elementor-horizontal-navbar-nav li{ list-style:none; }
.xpro-elementor-horizontal-navbar-nav .menu-link{
  font-family:var(--mpr-font-sans) !important; font-weight:500 !important; font-size:15px !important; color:var(--mpr-muted) !important;
  padding:6px 2px !important; border-radius:0 !important; text-decoration:none !important; display:inline-block; background:transparent !important;
  transition:color .15s ease;
}
.xpro-elementor-horizontal-navbar-nav .menu-link:hover{ color:var(--mpr-ink) !important; }
.xpro-elementor-horizontal-navbar-nav li.current-menu-item .menu-link,
.xpro-elementor-horizontal-navbar-nav li.current_page_item .menu-link{ color:var(--mpr-ink) !important; }
/* Compare nav item styled as a pill badge, matching the design's "Compare 2" chip */
.xpro-elementor-horizontal-navbar-nav li#menu-item-41 .menu-link,
.xpro-elementor-horizontal-navbar-nav li.menu-item-41 .menu-link{
  display:inline-flex !important; align-items:center; gap:7px;
  background:var(--mpr-primary) !important; color:var(--mpr-primary-ink) !important;
  font-weight:600 !important; padding:9px 16px !important; border-radius:999px !important;
}
.xpro-elementor-horizontal-navbar-nav li#menu-item-41 .menu-link:hover,
.xpro-elementor-horizontal-navbar-nav li.menu-item-41 .menu-link:hover{ background:var(--mpr-primary-dark) !important; }
.mpr-nav-compare-badge{ background:rgba(255,255,255,0.28); border-radius:999px; padding:1px 8px; font-size:12px; font-family:var(--mpr-font-mono); }

/* =========================================================
 * APP WRAPPER — used across Home / Compare / Wizard / Product / Account
 * ========================================================= */
.mpr-app{
  font-family:var(--mpr-font-sans);
  color: var(--mpr-ink);
  box-sizing: border-box;
  max-width:1180px; margin:0 auto; padding:0 24px 60px;
}
.mpr-app *{ box-sizing: border-box; }
.mpr-app h1,.mpr-app h2,.mpr-app h3,.mpr-app h4{ font-family:var(--mpr-font-sans); font-weight:600; margin:0 0 8px; }
.mpr-app a{ color:inherit; }
.mpr-app button{ font-family:var(--mpr-font-sans); cursor:pointer; }
.mpr-mono{ font-family:var(--mpr-font-mono); }
.mpr-eyebrow{ font-family:var(--mpr-font-mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--mpr-muted-2); }

/* =========================================================
 * HERO 2A (custom widget, full-bleed section outside .mpr-app)
 * ========================================================= */
.mpr-hero2{
  background:linear-gradient(180deg, var(--mpr-hero-grad-1), var(--mpr-hero-grad-2));
  padding:64px 24px 52px; text-align:center;
}
.mpr-hero2-inner{ max-width:900px; margin:0 auto; }
.mpr-hero2-eyebrow{ font-size:14px; color:var(--mpr-muted); margin-bottom:16px; font-family:var(--mpr-font-sans); }
.mpr-hero2 h1{
  font-family:var(--mpr-font-serif); font-weight:500; letter-spacing:-0.02em; line-height:1.05;
  font-size:clamp(34px,5vw,58px); max-width:800px; margin:0 auto; color:var(--mpr-ink); text-wrap:balance;
}
.mpr-hero2-sub{ font-size:19px; color:var(--mpr-muted); max-width:580px; margin:20px auto 0; line-height:1.55; }

/* command bar */
.mpr-cmdbar{
  margin:34px auto 0; max-width:900px; background:var(--mpr-card); border:1px solid var(--mpr-border);
  border-radius:999px; box-shadow:var(--mpr-shadow-md); display:flex; align-items:center; overflow:hidden;
  text-align:left; padding:8px 8px 8px 26px; gap:10px;
}
.mpr-cmdbar-field{ flex:1; display:flex; flex-direction:column; gap:2px; min-width:0; }
.mpr-cmdbar-label{ font-size:12px; color:var(--mpr-muted-2); }
.mpr-cmdbar input[type=text]{
  border:none; background:transparent; font-size:17px; color:var(--mpr-ink); font-family:var(--mpr-font-sans);
  width:100%; padding:0; outline:none;
}
.mpr-cmdbar input[type=text]::placeholder{ color:oklch(0.55 0.01 65); }
.mpr-cmdbar-btn{
  background:var(--mpr-ink); color:var(--mpr-bg); font-weight:600; font-size:16px; padding:15px 30px;
  border-radius:999px; border:none; white-space:nowrap; flex-shrink:0; font-family:var(--mpr-font-sans); cursor:pointer;
}
.mpr-cmdbar-btn:hover{ background:var(--mpr-primary); color:var(--mpr-primary-ink); }

/* chips */
.mpr-hero2-chips{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:22px; }
.mpr-hero2-chip{
  font-size:14px; color:var(--mpr-ink); border:1px solid var(--mpr-border); background:var(--mpr-card);
  padding:8px 15px; border-radius:999px; cursor:pointer; transition:all .15s ease; font-family:var(--mpr-font-sans);
}
.mpr-hero2-chip:hover{ border-color:var(--mpr-primary); color:var(--mpr-primary); }

/* =========================================================
 * GUIDED PATH BANNER ("New to this?")
 * ========================================================= */
.mpr-guided{ background:var(--mpr-primary-tint); border-top:1px solid var(--mpr-border); border-bottom:1px solid var(--mpr-border); padding:36px 24px; }
.mpr-guided-inner{ max-width:1180px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:36px; flex-wrap:wrap; }
.mpr-guided-copy{ max-width:380px; }
.mpr-guided-kicker{ display:inline-block; font-size:13px; font-weight:600; color:var(--mpr-primary-dark); background:var(--mpr-card); padding:5px 12px; border-radius:999px; margin-bottom:12px; }
.mpr-guided-copy h2{ font-family:var(--mpr-font-serif); font-weight:500; font-size:30px; letter-spacing:-0.01em; line-height:1.15; margin:0; }
.mpr-guided-copy p{ font-size:15px; color:var(--mpr-muted); margin-top:10px; line-height:1.5; }
.mpr-guided-cta{
  margin-top:18px; display:inline-flex; align-items:center; gap:9px; background:var(--mpr-primary); color:var(--mpr-primary-ink);
  font-weight:600; font-size:15px; padding:12px 22px; border-radius:999px; text-decoration:none;
}
.mpr-guided-cta:hover{ background:var(--mpr-primary-dark); }
.mpr-guided-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; flex:1; max-width:640px; min-width:280px; }
.mpr-guided-step{ background:var(--mpr-card); border:1px solid var(--mpr-border); border-radius:16px; padding:20px; display:flex; flex-direction:column; gap:8px; }
.mpr-guided-step-icon{ width:38px; height:38px; border-radius:12px; background:var(--mpr-primary-tint); display:flex; align-items:center; justify-content:center; font-size:20px; }
.mpr-guided-step-n{ font-size:12px; color:var(--mpr-muted-2); font-weight:600; }
.mpr-guided-step h4{ font-size:16px; font-weight:600; margin:0; line-height:1.2; }
.mpr-guided-step p{ font-size:13px; color:var(--mpr-muted); line-height:1.4; margin:0; }

/* =========================================================
 * SECTION TITLES shared by results / comparison teaser
 * ========================================================= */
.mpr-section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:20px; gap:12px; flex-wrap:wrap; }
.mpr-section-head h2{ font-family:var(--mpr-font-serif); font-weight:500; font-size:26px; margin:0; }
.mpr-section-head .mpr-sort{ font-size:14px; color:var(--mpr-muted-2); }

/* =========================================================
 * BROWSE LAYOUT: filter rail + results grid
 * ========================================================= */
.mpr-pref{ display:none; } /* legacy fit card, folded into the filter rail below */
.mpr-browse-layout{ display:grid; grid-template-columns:260px 1fr; gap:0; margin:0 -24px; align-items:start; }
@media(max-width:820px){ .mpr-browse-layout{ grid-template-columns:1fr; margin:0; } }
.mpr-sidebar{
  background:var(--mpr-bg-soft); border-right:1px solid var(--mpr-border); padding:30px 26px;
  position:sticky; top:76px; display:flex; flex-direction:column; gap:24px;
  max-height:calc(100vh - 96px); overflow-y:auto;
}
@media(max-width:820px){ .mpr-sidebar{ position:static; border-right:none; border-bottom:1px solid var(--mpr-border); max-height:none; overflow-y:visible; } }
.mpr-sidebar-head{ display:flex; align-items:center; justify-content:space-between; }
.mpr-sidebar-head .mpr-title{ font-size:16px; font-weight:600; }
.mpr-filter-group{ display:flex; flex-direction:column; gap:11px; }
.mpr-filter-group h4{ font-size:13px; color:var(--mpr-muted); font-weight:600; margin:0; }
.mpr-chip-list{ display:flex; flex-wrap:wrap; gap:6px; }
.mpr-chip{ background:var(--mpr-card); border:1px solid var(--mpr-border); color:var(--mpr-ink); font-size:13px; padding:6px 13px; border-radius:999px; cursor:pointer; transition:all .15s ease; }
.mpr-chip:hover{ border-color:var(--mpr-primary); color:var(--mpr-primary); }
.mpr-chip.active{ background:var(--mpr-ink); color:var(--mpr-bg); border-color:var(--mpr-ink); }
.mpr-check-list{ display:flex; flex-direction:column; gap:9px; }
.mpr-check-list label{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--mpr-ink); cursor:pointer; }
.mpr-check-list input[type=checkbox]{ width:16px; height:16px; accent-color:var(--mpr-primary); border-radius:5px; }
.mpr-filter-group select, .mpr-filter-group input[type=text]{
  width:100%; font-size:13.5px; padding:9px 11px; border:1px solid var(--mpr-border); border-radius:9px;
  background:var(--mpr-card); margin-bottom:6px; font-family:var(--mpr-font-sans);
}
.mpr-filter-group input[type=number]{
  width:100%; font-family:var(--mpr-font-mono); font-size:13px; padding:8px 10px; border:1px solid var(--mpr-border);
  border-radius:8px; background:var(--mpr-card);
}
.mpr-fit-inline{ display:flex; gap:8px; }
.mpr-fit-inline > div{ flex:1; display:flex; flex-direction:column; gap:4px; }
.mpr-fit-inline label{ font-size:11px; color:var(--mpr-muted-2); }
.mpr-reset-link{ background:none; border:none; color:var(--mpr-primary); font-family:var(--mpr-font-sans); font-weight:600; font-size:13px; padding:0; text-align:left; cursor:pointer; }
.mpr-reset-link:hover{ text-decoration:underline; }

/* budget range slider */
.mpr-range{ -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:999px; background:var(--mpr-border); outline:none; margin:6px 0; }
.mpr-range::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:16px; height:16px; border-radius:50%; background:var(--mpr-card); border:2px solid var(--mpr-primary); cursor:pointer; }
.mpr-range::-moz-range-thumb{ width:16px; height:16px; border-radius:50%; background:var(--mpr-card); border:2px solid var(--mpr-primary); cursor:pointer; }
.mpr-range::-webkit-slider-runnable-track{ height:6px; border-radius:999px; background:linear-gradient(to right, var(--mpr-primary) 0%, var(--mpr-primary) var(--mpr-range-fill,50%), var(--mpr-border) var(--mpr-range-fill,50%), var(--mpr-border) 100%); }
.mpr-range-labels{ display:flex; justify-content:space-between; font-size:13px; color:var(--mpr-muted-2); font-family:var(--mpr-font-mono); }

/* search row kept for narrow screens / fallback, hidden by default since hero owns search */
.mpr-search-row{ display:none; }

/* results column */
.mpr-results{ padding:30px 34px; min-width:0; }
@media(max-width:820px){ .mpr-results{ padding:24px; } }

.mpr-brand-section{ margin-bottom:8px; }
.mpr-brand-header{ display:flex; justify-content:space-between; align-items:center; padding:14px 0; cursor:pointer; border-bottom:1px solid var(--mpr-border-soft); margin-bottom:16px; }
.mpr-brand-left{ display:flex; align-items:center; gap:10px; }
.mpr-brand-header h3{ font-size:18px; margin:0; font-weight:600; }
.mpr-brand-header .count{ font-size:13px; color:var(--mpr-muted-2); font-weight:500; }
.mpr-chev{ color:var(--mpr-muted-2); font-size:14px; }
.mpr-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:18px; margin-bottom:32px; }

.mpr-card{ border:1px solid var(--mpr-border); border-radius:16px; overflow:hidden; background:var(--mpr-card); display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .18s ease; }
.mpr-card:hover{ transform:translateY(-3px); box-shadow:var(--mpr-shadow-md); }
.mpr-brand-logo{ height:15px !important; width:auto !important; max-width:70px !important; object-fit:contain; vertical-align:middle; margin-right:8px; display:inline-block; }
.mpr-brand-logo-sm{ height:10px !important; max-width:50px !important; margin-right:6px; }
.manu{ display:flex; align-items:center; }
.mpr-card-image{ position:relative; height:190px; display:flex; align-items:center; justify-content:center; padding:14px; overflow:hidden; box-sizing:border-box; }
.mpr-card-image.Aero{ background:linear-gradient(135deg, var(--mpr-aero-tint), var(--mpr-hero-grad-2)); }
.mpr-card-image.Endurance{ background:linear-gradient(135deg, var(--mpr-endurance-tint), var(--mpr-hero-grad-2)); }
.mpr-card-image.Gravel{ background:linear-gradient(135deg, var(--mpr-gravel-tint), var(--mpr-hero-grad-2)); }
.mpr-card-image svg{ width:74%; height:auto; position:absolute; left:50%; top:44%; transform:translate(-50%,-50%); opacity:0.92; }
.mpr-card-image img.mpr-card-photo{ width:100%; height:100%; object-fit:contain; position:relative; z-index:1; }
.mpr-card-badge{ position:absolute; top:10px; left:10px; font-size:11px; font-weight:600; background:var(--mpr-primary); color:var(--mpr-primary-ink); padding:4px 10px; border-radius:999px; z-index:2; }
.mpr-card-photolabel{ font-size:10px; color:var(--mpr-muted-2); background:rgba(255,255,255,0.85); padding:3px 8px; border-radius:999px; margin-left:auto; z-index:2; }
.mpr-card-body{ padding:16px; display:flex; flex-direction:column; gap:12px; flex:1; }
.mpr-card-top{ display:flex; justify-content:space-between; gap:8px; align-items:flex-start; }
.mpr-card .manu{ font-size:12px; color:var(--mpr-muted-2); }
.mpr-card h4{ font-size:18px; margin:3px 0 0; font-weight:600; }
.mpr-card h4 a{ text-decoration:none; transition:color .15s ease; }
.mpr-card h4 a:hover{ color:var(--mpr-primary); }
.mpr-tag{ font-size:11px; font-weight:600; padding:4px 10px; border-radius:999px; white-space:nowrap; height:fit-content; }
.mpr-tag.Aero{ background:var(--mpr-aero-tint); color:var(--mpr-aero); }
.mpr-tag.Endurance{ background:var(--mpr-endurance-tint); color:var(--mpr-endurance); }
.mpr-tag.Gravel{ background:var(--mpr-gravel-tint); color:var(--mpr-gravel); }
.mpr-heart{ background:none; border:none; font-size:19px; line-height:1; color:var(--mpr-border); padding:2px; transition:transform .15s ease, color .15s ease; }
.mpr-heart:hover{ color:var(--mpr-primary); transform:scale(1.12); }
.mpr-heart.active{ color:var(--mpr-primary); }
.mpr-spec-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px 12px; font-size:12px; }
.mpr-spec{ display:flex; justify-content:space-between; border-bottom:1px dotted var(--mpr-border); padding-bottom:5px; }
.mpr-spec.wide{ grid-column:span 2; }
.mpr-spec .k{ color:var(--mpr-muted-2); }
.mpr-spec span:last-child{ font-weight:600; color:var(--mpr-ink); }
.mpr-fit-note{ background:var(--mpr-primary-tint); color:var(--mpr-primary-dark); font-size:12.5px; padding:9px 11px; border-radius:8px; display:none; font-weight:500; }
.mpr-btn-sizes{ background:none; border:none; font-family:var(--mpr-font-sans); font-weight:600; font-size:12.5px; color:var(--mpr-primary); text-align:left; padding:0; cursor:pointer; }
.mpr-btn-sizes:hover{ text-decoration:underline; }
.mpr-size-table{ width:100%; border-collapse:collapse; font-family:var(--mpr-font-mono); font-size:11.5px; margin-top:2px; }
.mpr-size-table th,.mpr-size-table td{ padding:5px 6px; text-align:right; border-bottom:1px solid var(--mpr-border); }
.mpr-size-table th:first-child,.mpr-size-table td:first-child{ text-align:left; }
.mpr-size-table th{ color:var(--mpr-muted-2); font-weight:500; }
.mpr-card-actions{ display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:8px; border-top:1px solid var(--mpr-border-soft); }
.mpr-card-price{ font-size:20px; font-weight:700; letter-spacing:-0.01em; }
.mpr-card-compare-btn{
  display:flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--mpr-primary);
  border:1px solid oklch(0.62 0.13 45 / 0.5); background:none; padding:7px 13px; border-radius:999px; cursor:pointer; font-family:var(--mpr-font-sans);
}
.mpr-card-compare-btn.secondary{ background:var(--mpr-ink); color:var(--mpr-bg); border-color:var(--mpr-ink); }
.mpr-card-details-link{ font-size:12px; color:var(--mpr-muted-2); text-decoration:underline; margin-top:-4px; }

.mpr-empty{ text-align:center; padding:40px 16px; color:var(--mpr-muted); }
.mpr-empty strong{ font-family:var(--mpr-font-serif); font-size:20px; color:var(--mpr-ink); display:block; margin-bottom:6px; font-weight:500; }

/* =========================================================
 * COMPARISON TEASER (homepage)
 * ========================================================= */
.mpr-compare-teaser{ background:var(--mpr-table-bg); border-top:1px solid var(--mpr-border); padding:48px 24px; }
.mpr-compare-teaser-inner{ max-width:1180px; margin:0 auto; }
.mpr-compare-teaser p.mpr-lead{ font-size:15px; color:var(--mpr-muted); margin:-8px 0 22px; max-width:560px; }
.mpr-compare-table-wrap{ background:var(--mpr-card); border:1px solid var(--mpr-border); border-radius:16px; overflow:hidden; }
.mpr-compare-table2{ width:100%; border-collapse:collapse; }
.mpr-compare-table2 th,.mpr-compare-table2 td{ text-align:left; padding:16px 18px; }
.mpr-compare-table2 thead th{ border-bottom:2px solid var(--mpr-border); vertical-align:bottom; }
.mpr-compare-table2 thead th.spec-col{ font-size:13px; color:var(--mpr-muted-2); font-weight:600; }
.mpr-compare-table2 thead th.bike-col{ border-left:1px solid var(--mpr-border-soft); }
.mpr-compare-table2 thead th.bike-col .manu{ font-size:12px; color:var(--mpr-muted-2); }
.mpr-compare-table2 thead th.bike-col .model{ font-size:16px; font-weight:600; margin-top:2px; }
.mpr-compare-table2 tbody td{ border-bottom:1px solid var(--mpr-border-soft); font-size:14px; font-weight:500; }
.mpr-compare-table2 tbody td.spec-col{ font-size:13px; color:var(--mpr-muted); font-weight:400; }
.mpr-compare-table2 tbody td.bike-col{ border-left:1px solid var(--mpr-border-soft); }
.mpr-compare-table2 tbody tr:last-child td{ border-bottom:none; }

/* =========================================================
 * BRANDS STRIP
 * ========================================================= */
.mpr-brands-strip{ padding:34px 24px; border-top:1px solid var(--mpr-border); display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; max-width:1180px; margin:0 auto; }
.mpr-brands-strip .label{ font-size:14px; color:var(--mpr-muted-2); white-space:nowrap; }
.mpr-brands-list{ display:flex; gap:30px; align-items:center; flex-wrap:wrap; }
.mpr-brands-list span{ font-family:var(--mpr-font-serif); font-size:19px; font-weight:600; color:var(--mpr-muted); }

/* =========================================================
 * NEWSLETTER
 * ========================================================= */
.mpr-newsletter{ background:var(--mpr-dark); color:var(--mpr-bg); padding:48px 24px; }
.mpr-newsletter-inner{ max-width:1180px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.mpr-newsletter h2{ font-family:var(--mpr-font-serif); font-weight:500; font-size:28px; margin:0; color:var(--mpr-bg); }
.mpr-newsletter p{ font-size:16px; color:var(--mpr-dark-muted); margin-top:8px; max-width:420px; }
.mpr-newsletter-cta{ display:flex; gap:10px; align-items:stretch; flex-wrap:wrap; }
.mpr-newsletter-input{ background:var(--mpr-dark-card); border:1px solid var(--mpr-dark-border); border-radius:999px; padding:14px 22px; width:280px; color:var(--mpr-dark-input-text); font-size:15px; font-family:var(--mpr-font-sans); display:flex; align-items:center; }
.mpr-newsletter-btn{ background:var(--mpr-primary); color:var(--mpr-primary-ink); font-weight:600; padding:14px 28px; border-radius:999px; display:flex; align-items:center; text-decoration:none; font-size:15px; }
.mpr-newsletter-btn:hover{ background:var(--mpr-primary-dark); }

/* =========================================================
 * Compare / Wizard / Product / Account (shared panels)
 * ========================================================= */
.mpr-pref{ background:var(--mpr-card); border:1px solid var(--mpr-border); border-radius:14px; padding:16px 18px; margin-bottom:22px; display:flex; gap:14px; align-items:center; flex-wrap:wrap; box-shadow:var(--mpr-shadow-sm); }
.mpr-pref label{ font-size:12px; color:var(--mpr-muted); font-weight:500; margin-right:4px; }
.mpr-pref input[type=number]{ width:76px; background:var(--mpr-bg); border:1px solid var(--mpr-border); font-family:var(--mpr-font-mono); font-size:14px; padding:7px 9px; border-radius:8px; }
.mpr-btn{ font-family:var(--mpr-font-sans); font-weight:600; font-size:13.5px; padding:9px 16px; border-radius:999px; border:1px solid var(--mpr-ink); background:var(--mpr-ink); color:var(--mpr-bg); cursor:pointer; text-decoration:none; display:inline-block; transition:transform .15s ease, background-color .15s ease; }
.mpr-btn:hover{ transform:translateY(-1px); }
.mpr-btn.secondary{ background:transparent; color:var(--mpr-ink); }
.mpr-btn.secondary:hover{ background:var(--mpr-bg-soft); }
.mpr-btn.accent{ background:var(--mpr-primary); border-color:var(--mpr-primary); color:var(--mpr-primary-ink); }
.mpr-btn.accent:hover{ background:var(--mpr-primary-dark); }
.mpr-btn:disabled{ opacity:.35; cursor:not-allowed; transform:none; }
.mpr-hint{ font-size:12px; color:var(--mpr-muted); flex-basis:100%; }

.mpr-compare-table{ width:100%; border-collapse:collapse; background:var(--mpr-card); border:1px solid var(--mpr-border); border-radius:14px; overflow:hidden; }
.mpr-compare-table th,.mpr-compare-table td{ padding:12px 15px; border-bottom:1px solid var(--mpr-border); text-align:left; }
.mpr-compare-table th.label,.mpr-compare-table td.label{ background:var(--mpr-bg-soft); font-size:12.5px; color:var(--mpr-muted); font-weight:600; width:140px; }
.mpr-compare-table th.head{ background:var(--mpr-ink); color:var(--mpr-bg); }
.mpr-chart-card{ background:var(--mpr-card); border:1px solid var(--mpr-border); border-radius:14px; padding:20px; margin-bottom:24px; }

.mpr-wizard{ max-width:680px; }
.mpr-option-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; margin-bottom:20px; }
.mpr-option-card{ background:var(--mpr-card); border:2px solid var(--mpr-border); border-radius:14px; padding:17px; text-align:left; cursor:pointer; transition:all .15s ease; }
.mpr-option-card:hover{ border-color:var(--mpr-primary); }
.mpr-option-card.selected{ border-color:var(--mpr-primary); background:var(--mpr-primary-tint); }
.mpr-progress{ display:flex; gap:6px; margin-bottom:18px; }
.mpr-progress .lap{ flex:1; height:6px; background:var(--mpr-border); border-radius:4px; }
.mpr-progress .lap.done{ background:var(--mpr-primary); }
.mpr-result-card{ background:var(--mpr-card); border:1px solid var(--mpr-border); border-radius:14px; padding:17px; margin-bottom:12px; display:flex; gap:14px; }

.mpr-product-grid{ display:grid; grid-template-columns:1fr 300px; gap:24px; }
@media(max-width:860px){ .mpr-product-grid{ grid-template-columns:1fr; } }
.mpr-product-image{ background:linear-gradient(135deg, var(--mpr-hero-grad-1), var(--mpr-hero-grad-2)); border:1px solid var(--mpr-border); border-radius:14px; padding:24px; height:440px; display:flex; align-items:center; justify-content:center; box-sizing:border-box; margin-bottom:16px; }
.mpr-product-image img{ width:100%; height:100%; object-fit:contain; }
@media(max-width:600px){ .mpr-product-image{ height:280px; } }
.mpr-panel{ background:var(--mpr-card); border:1px solid var(--mpr-border); border-radius:14px; padding:20px; margin-bottom:18px; }
.mpr-build-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.mpr-build-tab{ background:var(--mpr-bg-soft); border:1px solid var(--mpr-border); border-radius:999px; padding:7px 15px; font-size:13px; cursor:pointer; }
.mpr-build-tab:hover{ border-color:var(--mpr-primary); color:var(--mpr-primary); }
.mpr-build-tab.active{ background:var(--mpr-ink); color:var(--mpr-bg); border-color:var(--mpr-ink); }
.mpr-ext-links{ display:flex; flex-direction:column; gap:8px; }
.mpr-ext-link{ background:var(--mpr-bg-soft); border:1px solid var(--mpr-border); border-radius:10px; padding:11px 14px; font-weight:600; font-size:13.5px; text-decoration:none; color:var(--mpr-ink); }
.mpr-ext-link:hover{ border-color:var(--mpr-primary); }
.mpr-stars{ color:var(--mpr-star); letter-spacing:1px; }
.mpr-review-item{ border-top:1px solid var(--mpr-border); padding-top:10px; margin-top:10px; font-size:13.5px; }
.mpr-review-form textarea{ width:100%; font-size:13.5px; padding:11px; border:1px solid var(--mpr-border); border-radius:9px; font-family:var(--mpr-font-sans); }
.mpr-star-picker{ display:flex; gap:4px; margin-bottom:8px; }
.mpr-star-btn{ background:none; border:none; font-size:22px; color:var(--mpr-border); padding:0; cursor:pointer; }
.mpr-star-btn.on{ color:var(--mpr-star); }

.mpr-account-row{ display:flex; justify-content:space-between; align-items:center; background:var(--mpr-bg-soft); border:1px solid var(--mpr-border); border-radius:11px; padding:13px 15px; margin-bottom:10px; gap:10px; flex-wrap:wrap; }