/* ============================================================================
   MLSimport 2026 — "Sunny Bento" design system
   Ported from the Claude Design prototype (themes.jsx + styles.css + component
   inline styles). Scoped tokens live on :root; component styles use .mlsimport-* so
   they don't collide with Elementor/Hello defaults.
   ========================================================================== */

:root {
  --c-bg: #faf8f3;
  --c-surface: #ffffff;
  --c-surface-2: #f3efe7;
  --c-text: #1c1917;
  --c-text-muted: #6b6358;
  --c-text-soft: #9a9285;
  --c-border: rgba(28, 25, 23, 0.08);
  --c-primary: #1c1917;
  --c-primary-text: #ffffff;
  --c-accent: #e85d3c;
  --c-accent-soft: #fde4d8;
  /* destructive actions only — deliberately NOT --c-accent, which is the brand
     link colour, so "Cancel subscription" can't read as an ordinary link */
  --c-danger: #c02617;
  --c-danger-soft: #fbe6e3;
  --c-peach: #ffd0b3;
  --c-mint: #b8e6cc;
  --c-lavender: #d8caf2;
  --c-sky: #b3d4f0;
  --c-butter: #fae39a;
  --c-pink: #f5c0d0;
  --c-sage: #cde0bc;
  --c-coral: #fcb7a4;
  --font-heading: "DM Sans", system-ui, sans-serif;
  --font-body: "DM Sans", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --font-display-weight: 600;
  --heading-tracking: -0.025em;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --bw-radius: 18px;
}

/* ─── base ─────────────────────────────────────────────────────────────── */
body.mlsi-site {
  /* Override the Elementor kit's default global typography (Roboto) so every
     native widget that inherits the "Text"/"Primary" font renders in DM Sans —
     matching the prototype. The kit sets these on .elementor-kit-N; body.mlsi-site
     wins on specificity. Mono elements set --font-mono explicitly and are unaffected. */
  --e-global-typography-primary-font-family: "DM Sans", system-ui, sans-serif;
  --e-global-typography-secondary-font-family: "DM Sans", system-ui, sans-serif;
  --e-global-typography-text-font-family: "DM Sans", system-ui, sans-serif;
  --e-global-typography-accent-font-family: "DM Sans", system-ui, sans-serif;
  font-family: var(--font-body);
  color: var(--c-text);
  background: var(--c-bg);
  font-size: 17px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.mlsimport a { color: inherit; text-decoration: none; }
.mlsimport *, .mlsimport *::before, .mlsimport *::after { box-sizing: border-box; }
.mlsimport img { display: block; max-width: 100%; }

.mlsimport-container {
  max-width: 1240px;
  /* !important: Elementor's .e-con base sets margin-inline to 0 at equal
     specificity (loaded later), so plain `margin: 0 auto` loses and the box
     pins left. Force horizontal centering to match the prototype container. */
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 32px;
}

/* ─── buttons ──────────────────────────────────────────────────────────── */
.btn-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 22px;
  border-radius: 999px;
  border: none;
  font-weight: 500;
  font-size: 15px;
  font-family: var(--font-body);
  line-height: 1.5;
  transition: transform .16s cubic-bezier(.34,1.56,.64,1), box-shadow .18s ease, opacity .12s, background .15s;
}
.btn-pill:hover { transform: translateY(-2px); }
.btn-pill:active { transform: translateY(0) scale(.97); transition-duration: .06s; }
.btn-pill svg { transition: transform .2s cubic-bezier(.34,1.56,.64,1); }
.btn-pill:hover svg { transform: translateX(3px); }
.btn-pill:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; }
.btn-primary { background: var(--c-primary); color: var(--c-primary-text); }
.btn-primary:hover { box-shadow: 0 10px 24px -10px rgba(0,0,0,.45); }
.btn-ghost { background: transparent; color: var(--c-text); }
.btn-ghost:hover { background: var(--c-surface-2, rgba(0,0,0,.04)); box-shadow: none; }

/* ─── chip / eyebrow ───────────────────────────────────────────────────── */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  background: var(--c-surface);
  color: var(--c-text-muted);
  border: 1px solid var(--c-border);
}
.eyebrow {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-text-muted);
}

/* ─── headings helper ──────────────────────────────────────────────────── */
/* :where() keeps this reset at zero extra specificity so per-section heading
   margins (e.g. testimonials' 48px, CTA's auto-centering) still win. */
.mlsimport :where(h1, h2, h3) {
  font-family: var(--font-heading);
  letter-spacing: var(--heading-tracking);
  margin: 0;
}

/* ─── browser mockup ───────────────────────────────────────────────────── */
.bw-frame {
  border-radius: var(--bw-radius, 18px);
  overflow: hidden;
  min-width: 0;
  box-shadow: 0 24px 60px -20px rgba(0,0,0,.18), 0 4px 16px rgba(0,0,0,.06);
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
}
.bw-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 14px;
  background: #f4f1ec;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.bw-dot { width: 11px; height: 11px; border-radius: 50%; }
.bw-dot.r { background: #ed6a5e; }
.bw-dot.y { background: #f5bf4f; }
.bw-dot.g { background: #62c554; }
.bw-url {
  margin-left: 12px;
  padding: 5px 12px;
  background: #fff;
  border-radius: 6px;
  font-size: 12px;
  color: #8a8275;
  font-family: var(--font-mono);
  flex: 1;
  min-width: 0;
  max-width: 320px;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ─── placeholder image stripes ────────────────────────────────────────── */
.placeholder-img {
  position: relative;
  background:
    repeating-linear-gradient(135deg, rgba(0,0,0,.04) 0 8px, rgba(0,0,0,.07) 8px 16px),
    var(--ph-bg, #ddd);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(0,0,0,.4);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* ============================================================================
   NAV (header template)
   ========================================================================== */
.mlsimport-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  background: rgba(255, 255, 255, 0.6);
  border-bottom: 1px solid var(--c-border);
}
.mlsimport-nav .mlsimport-container { display: flex; align-items: center; gap: 32px; height: 68px; }
.mlsimport-nav__brand { display: flex; align-items: center; gap: 10px; }
.mlsimport-nav__brand-name { font-weight: 600; font-size: 18px; letter-spacing: -0.02em; }
.mlsimport-nav__links { display: flex; gap: 24px; margin-left: 18px; }
.mlsimport-nav__link {
  font-size: 14.5px;
  color: var(--c-text-muted);
  font-weight: 500;
  position: relative;
  padding: 2px 0;
  white-space: nowrap;
  transition: color .15s ease;
}
.mlsimport-nav__link:hover { color: var(--c-text); }
.mlsimport-nav__link.is-active { color: var(--c-text); font-weight: 600; }
.mlsimport-nav__link.is-active::after {
  content: ""; position: absolute; bottom: -4px; left: 0; right: 0;
  height: 2px; background: var(--c-accent); border-radius: 1px;
}
.mlsimport-nav__spacer { flex: 1; }
.nav-signin { position: relative; transition: color .15s ease; font-size: 14.5px; color: var(--c-text-muted); font-weight: 500; }
.nav-signin::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 1.5px;
  background: var(--c-accent); border-radius: 1px; transform: scaleX(0);
  transform-origin: left center; transition: transform .24s cubic-bezier(.4,0,.2,1);
}
.nav-signin:hover { color: var(--c-text); }
.nav-signin:hover::after { transform: scaleX(1); }
.nav-signin:active { opacity: .7; }

.mlsimport-logomark {
  width: 30px; height: 30px; border-radius: 8px;
  background: var(--c-text); color: var(--c-bg);
  display: flex; align-items: center; justify-content: center;
}

@media (max-width: 1080px) {
  .mlsimport-nav .mlsimport-container { gap: 18px; }
  .mlsimport-nav__links { gap: 16px; margin-left: 8px; }
  .mlsimport-nav .nav-signin { display: none; }
}

/* ============================================================================
   HERO (Sunny)
   ========================================================================== */
.mlsimport-hero { padding: 64px 0 32px; position: relative; overflow: hidden; }
.mlsimport-hero__dots {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(28,25,23,0.09) 1.2px, transparent 1.2px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(ellipse 70% 65% at 50% 34%, #000 0%, rgba(0,0,0,0.5) 45%, transparent 78%);
  mask-image: radial-gradient(ellipse 70% 65% at 50% 34%, #000 0%, rgba(0,0,0,0.5) 45%, transparent 78%);
}
.mlsimport-hero__blob {
  position: absolute; top: 40px; right: -120px; width: 420px; height: 420px;
  background: radial-gradient(circle, var(--c-butter), transparent 70%);
  opacity: .55; z-index: 0;
}
.mlsimport-hero__inner { position: relative; z-index: 2; text-align: center; max-width: 980px; margin: 0 auto; }
.mlsimport-hero__chip { margin-bottom: 22px; background: var(--c-accent-soft); color: var(--c-accent); border-color: transparent; }
.mlsimport-hero__chip-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--c-accent); }
/* 72px, not 88: the IDX headline is two long lines and 88 forced a third. */
.mlsimport-hero__title { font-size: 72px; line-height: 1.08; font-weight: var(--font-display-weight); text-wrap: balance; }
.mlsimport-hero__hl { background: var(--c-peach); padding: 0 14px 6px; border-radius: 18px; display: inline-block; }
.mlsimport-hero__sub { font-size: 19px; color: var(--c-text-muted); line-height: 1.5; margin: 24px auto 0; max-width: 720px; }
.mlsimport-hero__sub + .mlsimport-hero__sub { margin-top: 12px; font-size: 17px; }
.mlsimport-hero__sub a { color: var(--c-accent); border-bottom: 1px solid currentColor; }
.mlsimport-hero__cta { display: flex; gap: 12px; justify-content: center; margin-top: 32px; flex-wrap: wrap; }
.mlsimport-hero__ctanote { margin-top: 14px; font-size: 13.5px; color: var(--c-text-muted); }
.mlsimport-hero__trust { margin-top: 22px; font-size: 13px; color: var(--c-text-muted); }
.mlsimport-hero__visual { margin-top: 56px; position: relative; z-index: 1; }

/* MLS search */
.mlsimport-search { position: relative; max-width: 560px; margin: 0 auto; width: 100%; }
.mlsimport-search__bar {
  display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 18px;
  background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 999px;
  box-shadow: 0 1px 3px rgba(0,0,0,.04); transition: box-shadow .15s, border-color .15s;
}
.mlsimport-search.is-open .mlsimport-search__bar { box-shadow: 0 8px 30px -10px rgba(0,0,0,.15); }
.mlsimport-search.is-focused .mlsimport-search__bar { border-color: var(--c-accent); }
.mlsimport-search__input {
  flex: 1; border: none; outline: none; background: transparent; font-size: 15px;
  color: var(--c-text); font-family: inherit; padding: 8px 0; min-width: 0;
}
.mlsimport-search__check { padding: 10px 18px; font-size: 13.5px; }
.mlsimport-search__hint { font-size: 12px; color: var(--c-text-muted); text-align: center; margin-top: 10px; }
.mlsimport-search__hint a { color: var(--c-accent); border-bottom: 1px solid currentColor; }
.mlsimport-search__menu {
  position: absolute; top: calc(100% + 8px); left: 8px; right: 8px;
  background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md);
  box-shadow: 0 20px 50px -16px rgba(0,0,0,.18); padding: 6px; z-index: 5;
  max-height: 320px; overflow-y: auto; text-align: left;
}
.mlsimport-search__menu-label {
  font-size: 10.5px; color: var(--c-text-soft); letter-spacing: .08em; text-transform: uppercase;
  padding: 8px 12px 6px; font-family: var(--font-mono); font-weight: 600;
}
.mlsimport-search__opt {
  display: flex; align-items: center; gap: 12px; width: 100%; appearance: none; border: none;
  background: transparent; padding: 10px 12px; cursor: pointer; font-family: inherit;
  text-align: left; border-radius: 8px; transition: background .12s;
}
.mlsimport-search__opt:hover { background: var(--c-surface-2); }
.mlsimport-search__opt-check {
  flex: 0 0 auto; width: 24px; height: 24px; border-radius: 6px;
  background: var(--c-accent-soft); color: var(--c-accent);
  display: flex; align-items: center; justify-content: center;
}
.mlsimport-search__opt-name { font-size: 13.5px; color: var(--c-text); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mlsimport-search__opt-proto { font-size: 10.5px; font-family: var(--font-mono); color: var(--c-text-muted); padding: 2px 8px; background: var(--c-surface-2); border-radius: 4px; }

/* Hero visual */
.mlsimport-herovis { position: relative; max-width: 1080px; margin: 0 auto; }
.mlsimport-herovis__float {
  position: absolute; padding: 14px 18px; border-radius: 16px;
  box-shadow: 0 12px 32px rgba(0,0,0,.12); display: flex; align-items: center; gap: 12px;
}
.mlsimport-herovis__float-l { left: -28px; top: 110px; background: var(--c-mint); transform: rotate(-4deg); }
.mlsimport-herovis__float-r { right: -36px; bottom: 60px; background: var(--c-pink); transform: rotate(3deg); }
.mlsimport-herovis__float-ico { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.mlsimport-herovis__float-t { font-size: 12px; font-weight: 600; color: #1c1917; }
.mlsimport-herovis__float-s { font-size: 11px; color: #1c1917; opacity: .7; }

/* listing card mockup */
.mlsimport-listing { background: var(--c-surface); border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--c-border); display: flex; flex-direction: column; }
.mlsimport-listing__img { position: relative; }
.mlsimport-listing__badge { position: absolute; top: 10px; left: 10px; padding: 4px 10px; border-radius: 999px; color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.mlsimport-listing__body { padding: 12px 14px; }
.mlsimport-listing__row1 { display: flex; align-items: baseline; justify-content: space-between; }
.mlsimport-listing__price { font-weight: 600; font-size: 17px; color: var(--c-text); }
.mlsimport-listing__id { font-size: 11px; color: var(--c-text-soft); font-family: var(--font-mono); }
.mlsimport-listing__addr { font-size: 13px; color: var(--c-text-muted); margin-top: 4px; }
.mlsimport-listing__city { font-size: 12px; color: var(--c-text-soft); }
.mlsimport-listing__meta { display: flex; gap: 10px; margin-top: 8px; font-size: 11.5px; color: var(--c-text-muted); align-items: center; }
.mlsimport-listing__meta span { display: inline-flex; align-items: center; gap: 4px; }

/* ============================================================================
   SECTION HEADER (shared eyebrow + h2 + lead)
   ========================================================================== */
.mlsimport-sec-head { max-width: 720px; }
.mlsimport-sec-head .eyebrow { margin-bottom: 14px; }
.mlsimport-sec-head__lead { color: var(--c-text-muted); margin-top: 16px; }
.mlsimport-sec-head--split { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 24px; }
.mlsimport-sec-link { font-size: 14px; font-weight: 500; color: var(--c-text-muted); border-bottom: 1px solid var(--c-border); padding-bottom: 4px; }

/* ============================================================================
   BENTO (features)
   ========================================================================== */
.mlsimport-bento { padding: 80px 0 60px; }
.mlsimport-bento__title { font-size: 56px; line-height: 1.05; font-weight: var(--font-display-weight); }
.mlsimport-bento__lead { font-size: 18px; max-width: 560px; }
.mlsimport-bento__grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: minmax(260px, auto); gap: 16px; }
.mlsimport-bcard {
  border-radius: var(--radius-xl); padding: 28px; display: flex; flex-direction: column;
  gap: 18px; min-height: 380px; position: relative; overflow: hidden; color: #1c1917;
}
.mlsimport-bcard h3 { font-size: 23px; font-weight: 600; line-height: 1.2; }
.mlsimport-bcard p { margin: 8px 0 0; font-size: 14.5px; line-height: 1.55; opacity: .8; max-width: 360px; }
.mlsimport-bcard__vis { flex: 1; position: relative; display: flex; align-items: flex-end; justify-content: center; }

/* ============================================================================
   HOW IT WORKS
   ========================================================================== */
.mlsimport-how { padding: 120px 0 80px; }
.mlsimport-how__head { max-width: 720px; margin-bottom: 56px; }
.mlsimport-how__title { font-size: 52px; line-height: 1.05; font-weight: var(--font-display-weight); }
.mlsimport-how__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.mlsimport-how__card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 28px 24px; position: relative; min-height: 220px; }
.mlsimport-how__step { font-family: var(--font-mono); font-size: 12px; color: var(--c-text-soft); font-weight: 500; letter-spacing: .04em; margin-bottom: 28px; }
.mlsimport-how__ctitle { font-size: 21px; font-weight: 600; margin-bottom: 10px; line-height: 1.2; }
.mlsimport-how__cbody { color: var(--c-text-muted); font-size: 14.5px; line-height: 1.55; }

/* ============================================================================
   THEMES SHOWCASE
   ========================================================================== */
.mlsimport-themes { padding: 80px 0; }
.mlsimport-themes__title { font-size: 48px; line-height: 1.05; font-weight: var(--font-display-weight); }
.mlsimport-themes__lead { font-size: 17px; max-width: 560px; }
.mlsimport-themes__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.mlsimport-tcard { border-radius: var(--radius-lg); overflow: hidden; display: flex; flex-direction: column; color: #1c1917; transition: transform .15s, box-shadow .15s; }
.mlsimport-tcard:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -16px rgba(0,0,0,.2); }
.mlsimport-tcard__shot { height: 180px; background: rgba(255,255,255,0.55); position: relative; overflow: hidden; padding: 14px; }
.mlsimport-tcard__dots { display: flex; align-items: center; gap: 4px; margin-bottom: 10px; }
.mlsimport-tcard__dots span { width: 7px; height: 7px; border-radius: 50%; }
.mlsimport-tcard__mockcard { background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 6px 16px rgba(0,0,0,.06); }
.mlsimport-tcard__mockimg { height: 70px; position: relative; }
.mlsimport-tcard__mockbadge { position: absolute; top: 6px; left: 6px; padding: 2px 6px; background: rgba(0,0,0,.7); color: #fff; font-size: 8px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; border-radius: 2px; }
.mlsimport-tcard__mockbody { padding: 6px 8px; }
.mlsimport-tcard__mockprice { font-size: 10px; font-weight: 700; color: #1c1917; }
.mlsimport-tcard__mockmeta { font-size: 8px; color: #6b6358; margin-top: 1px; }
.mlsimport-tcard__mockbars { display: flex; gap: 4px; margin-top: 6px; }
.mlsimport-tcard__mockbars div { flex: 1; height: 28px; background: #fff; border-radius: 4px; opacity: .7; }
.mlsimport-tcard__body { padding: 20px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.mlsimport-tcard__name { font-family: var(--font-heading); font-size: 20px; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); }
.mlsimport-tcard__tag { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(28,25,23,.6); }
.mlsimport-tcard__desc { margin: 0; font-size: 13.5px; line-height: 1.5; color: rgba(28,25,23,.75); flex: 1; }
.mlsimport-tcard__foot { margin-top: 6px; padding-top: 12px; border-top: 1px solid rgba(28,25,23,.12); display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 600; }

/* ============================================================================
   INTEGRATIONS
   ========================================================================== */
.mlsimport-int { padding: 80px 0; }
.mlsimport-int__title { font-size: 44px; line-height: 1.1; font-weight: var(--font-display-weight); }
.mlsimport-int__lead { color: var(--c-text-muted); font-size: 17px; margin-top: 16px; max-width: 540px; }
.mlsimport-int__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.mlsimport-int__cell {
  background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md);
  padding: 22px 14px; text-align: center; font-size: 13px; font-weight: 500;
  color: var(--c-text-muted); transition: border-color .15s, color .15s;
}
.mlsimport-int__cell:hover { color: var(--c-text); border-color: var(--c-accent); }

/* ============================================================================
   RESOURCES
   ========================================================================== */
.mlsimport-res { padding: 80px 0; }
.mlsimport-res__title { font-size: 48px; line-height: 1.05; font-weight: var(--font-display-weight); }
.mlsimport-res__lead { font-size: 17px; max-width: 560px; }
.mlsimport-res__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.mlsimport-rcard { border-radius: var(--radius-lg); padding: 26px; display: flex; flex-direction: column; gap: 14px; color: #1c1917; min-height: 240px; transition: transform .15s; }
.mlsimport-rcard:hover { transform: translateY(-2px); }
.mlsimport-rcard__cat { display: inline-flex; align-self: flex-start; font-size: 10.5px; font-weight: 700; padding: 4px 10px; border-radius: 4px; background: rgba(28,25,23,.85); color: #fbf7ee; letter-spacing: .06em; text-transform: uppercase; }
.mlsimport-rcard__title { margin: 0; font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 20px; line-height: 1.2; letter-spacing: var(--heading-tracking); }
.mlsimport-rcard__desc { margin: 0; font-size: 13.5px; line-height: 1.5; color: rgba(28,25,23,.75); flex: 1; }
.mlsimport-rcard__more { font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; margin-top: auto; }

/* ============================================================================
   TESTIMONIALS
   ========================================================================== */
.mlsimport-test { padding: 80px 0; }
.mlsimport-test__title { font-size: 44px; line-height: 1.1; font-weight: var(--font-display-weight); margin: 0 0 48px; max-width: 720px; }
.mlsimport-test__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.mlsimport-tq { margin: 0; border-radius: var(--radius-lg); padding: 28px 26px; display: flex; flex-direction: column; gap: 24px; min-height: 240px; }
.mlsimport-tq__q { font-size: 17px; line-height: 1.45; font-weight: 500; color: #1c1917; }
.mlsimport-tq__cap { margin-top: auto; display: flex; align-items: center; gap: 12px; }
.mlsimport-tq__av { width: 38px; height: 38px; border-radius: 50%; background: rgba(0,0,0,.1); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; color: #1c1917; }
.mlsimport-tq__who { font-size: 14px; font-weight: 600; color: #1c1917; }
.mlsimport-tq__role { font-size: 12.5px; color: rgba(28,25,23,.6); }

/* ============================================================================
   FAQ
   ========================================================================== */
.mlsimport-faq { padding: 80px 0; }
.mlsimport-faq__grid { display: grid; grid-template-columns: 0.5fr 2fr; gap: 64px; align-items: flex-start; }
.mlsimport-faq__side { position: sticky; top: 96px; }
.mlsimport-faq__title { font-size: 44px; line-height: 1.1; font-weight: var(--font-display-weight); }
.mlsimport-faq__sidelead { color: var(--c-text-muted); font-size: 16px; margin-top: 16px; }
.mlsimport-faq__sidelead a { color: var(--c-accent); border-bottom: 1px solid currentColor; }
details.faq-item { border-bottom: 1px solid var(--c-border); padding: 22px 0; }
details.faq-item summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between;
  font-size: 19px; font-weight: 500; color: var(--c-text);
}
details.faq-item summary::-webkit-details-marker { display: none; }
details.faq-item summary::after {
  content: ""; width: 14px; height: 14px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'><path fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' d='M3 5l4 4 4-4'/></svg>");
  background-repeat: no-repeat; transition: transform .2s; flex: 0 0 auto; margin-left: 16px;
}
details.faq-item[open] summary::after { transform: rotate(180deg); }
details.faq-item .faq-answer { margin-top: 12px; color: var(--c-text-muted); font-size: 16px; line-height: 1.6; max-width: 720px; }

/* ============================================================================
   FOOTER CTA
   ========================================================================== */
.mlsimport-cta { padding: 64px 0 32px; }
.mlsimport-cta__panel { background: var(--c-text); color: var(--c-bg); border-radius: var(--radius-xl); padding: 80px 56px; text-align: center; position: relative; overflow: hidden; }
.mlsimport-cta__blob1 { position: absolute; top: -60px; left: -60px; width: 220px; height: 220px; border-radius: 50%; background: var(--c-accent); opacity: .6; filter: blur(4px); }
.mlsimport-cta__blob2 { position: absolute; bottom: -80px; right: -40px; width: 280px; height: 280px; border-radius: 50%; background: var(--c-peach); opacity: .4; filter: blur(4px); }
.mlsimport-cta__inner { position: relative; }
.mlsimport-cta__title { font-size: 56px; font-weight: var(--font-display-weight); line-height: 1.05; max-width: 720px; margin: 0 auto; }
.mlsimport-cta__sub { margin-top: 18px; font-size: 18px; opacity: .7; max-width: 540px; margin-left: auto; margin-right: auto; }
.mlsimport-cta__btns { margin-top: 32px; display: inline-flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.mlsimport-cta__note { margin-top: 18px; font-size: 13px; opacity: .55; }

/* ============================================================================
   FOOTER
   ========================================================================== */
.mlsimport-footer { padding: 64px 0 48px; border-top: 1px solid var(--c-border); }
.mlsimport-footer__grid { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 48px; }
.mlsimport-footer__brand { display: flex; align-items: center; gap: 10px; }
.mlsimport-footer__brand-name { font-weight: 600; font-size: 18px; letter-spacing: -0.02em; }
.mlsimport-footer__desc { color: var(--c-text-muted); font-size: 14px; margin-top: 16px; max-width: 280px; line-height: 1.55; }
.mlsimport-footer__col .eyebrow { margin-bottom: 16px; }
.mlsimport-footer__col a { display: block; color: var(--c-text-muted); font-size: 14px; padding: 5px 0; }
.mlsimport-footer__bottom {
  margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--c-border);
  display: flex; justify-content: space-between; color: var(--c-text-soft); font-size: 12.5px; flex-wrap: wrap; gap: 12px;
}
.mlsimport-footer__bottom .links { display: flex; gap: 24px; }

/* ============================================================================
   NATIVE-WIDGET SKINS
   Sections rebuilt with default Elementor widgets (Heading, Text Editor,
   Icon List, Image, Button, Icon) are skinned here to match the design exactly.
   Layout props use !important only to beat Elementor's .e-con container defaults.
   ========================================================================== */

/* zero Elementor's default container chrome on our skinned containers */
.mlsimport-foot, .mlsimport-foot * .e-con-inner { min-height: 0; }

/* ── Footer (native) — spacing is native (container settings); CSS = layout + type ── */
.mlsimport-foot { border-top: 1px solid var(--c-border); }
.mlsimport-foot__grid { display: grid !important; grid-template-columns: 1.4fr repeat(4, 1fr); align-items: start !important; }
.mlsimport-foot__brandrow { display: flex !important; flex-direction: row !important; align-items: center !important; }
.mlsimport-foot__brandrow img { width: 30px !important; height: 30px !important; display: block; }
.mlsimport-foot__brandrow .elementor-heading-title { font-size: 18px !important; font-weight: 600; letter-spacing: -0.02em; color: var(--c-text) !important; }
.mlsimport-foot__desc { margin-top: 16px; }
.mlsimport-foot__desc .elementor-widget-container, .mlsimport-foot__desc p { color: var(--c-text-muted) !important; font-size: 14px; line-height: 1.55; max-width: 280px; margin: 0; }
.mlsimport-foot__col .elementor-heading-title { font-size: 12px !important; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-text-muted) !important; margin-bottom: 16px; }
.mlsimport-foot__col .elementor-icon-list-items { margin: 0; padding: 0; }
.mlsimport-foot__col .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; border: none !important; }
.mlsimport-foot__col .elementor-icon-list-item a { padding: 5px 0 !important; display: block; transition: color .15s; }
.mlsimport-foot__col .elementor-icon-list-text { font-size: 14px !important; color: var(--c-text-muted) !important; line-height: 1.5; }
.mlsimport-foot__col .elementor-icon-list-item a:hover .elementor-icon-list-text { color: var(--c-text) !important; }
.mlsimport-foot__bottom { border-top: 1px solid var(--c-border); display: flex !important; flex-direction: row !important; justify-content: space-between; align-items: center !important; flex-wrap: wrap; }
.mlsimport-foot__bottom .elementor-widget-text-editor { flex-shrink: 0; }
.mlsimport-foot__bottom .elementor-widget-text-editor, .mlsimport-foot__bottom .elementor-widget-text-editor .elementor-widget-container, .mlsimport-foot__bottom p { color: var(--c-text-soft) !important; font-size: 12.5px !important; line-height: 1.5; margin: 0 !important; white-space: nowrap; }
.mlsimport-foot__legal .elementor-icon-list-items { display: flex !important; flex-direction: row !important; gap: 24px !important; margin: 0; padding: 0; }
.mlsimport-foot__legal .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.mlsimport-foot__legal .elementor-icon-list-text { color: var(--c-text-soft) !important; font-size: 12.5px !important; }

/* shared section helpers */
/* Section eyebrow inside a custom widget — matches the .nl-eyebrow metrics the
   native Elementor heading produced (line-height 1.5 + 14px gap to the title). */
.eyebrow--sec { line-height: 1.5; margin-bottom: 14px; }
.nl-eyebrow .elementor-heading-title { font-size: 12px !important; font-weight: 600; line-height: 1.5; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-text-muted) !important; margin-bottom: 14px; }
.nl-seclink .elementor-widget-container, .nl-seclink, .nl-seclink a { font-size: 14px !important; font-weight: 500; color: var(--c-text-muted) !important; margin: 0 !important; }
.nl-seclink a { border-bottom: 1px solid var(--c-border); padding-bottom: 4px; display: inline-block; }

/* ── Footer CTA (native) ── */
.cta2__panel { background: var(--c-text); color: var(--c-bg); border-radius: var(--radius-xl); text-align: center; position: relative; overflow: hidden; }
/* .elementor-element. prefix: Elementor applies overflow/border-radius from --vars
   on every container root later in the cascade (landmine 3), unclipping the blob
   circles and squaring the panel corners. */
.elementor-element.cta2__panel { overflow: hidden; border-radius: var(--radius-xl); }
.cta2__panel::before { content: ""; position: absolute; top: -60px; left: -60px; width: 220px; height: 220px; border-radius: 50%; background: var(--c-accent); opacity: .6; filter: blur(4px); }
.cta2__panel::after { content: ""; position: absolute; bottom: -80px; right: -40px; width: 280px; height: 280px; border-radius: 50%; background: var(--c-peach); opacity: .4; filter: blur(4px); }
.cta2__panel > .e-con-inner, .cta2__panel > * { position: relative; z-index: 1; }
.cta2__title .elementor-heading-title { font-size: 56px !important; font-weight: var(--font-display-weight); line-height: 1.05; letter-spacing: var(--heading-tracking); color: var(--c-bg) !important; max-width: 720px; margin: 0 auto; text-align: center; }
.cta2__sub .elementor-widget-container, .cta2__sub { font-size: 18px !important; opacity: .7; max-width: 540px; margin: 18px auto 0 !important; color: var(--c-bg) !important; text-align: center; }
.cta2__btns { display: flex !important; flex-direction: row !important; justify-content: center !important; flex-wrap: wrap !important; }
.cta2 .elementor-button { border-radius: 999px !important; font-weight: 500; font-size: 15px; padding: 16px 26px; display: inline-flex; align-items: center; gap: 8px; line-height: 1.5; transition: transform .16s cubic-bezier(.34,1.56,.64,1); }
.cta2 .elementor-button:hover { transform: translateY(-2px); }
.cta2__btn-p .elementor-button { background: var(--c-bg) !important; color: var(--c-text) !important; }
.cta2__btn-p .elementor-button i, .cta2__btn-p .elementor-button svg { color: var(--c-text) !important; fill: var(--c-text) !important; }
.cta2__btn-g .elementor-button { background: transparent !important; color: var(--c-bg) !important; border: 1px solid rgba(255,255,255,.25); }
.cta2__note .elementor-widget-container, .cta2__note { font-size: 13px !important; opacity: .55; color: var(--c-bg) !important; margin: 18px 0 0 !important; text-align: center; }

/* ── How it works ── */
.how2 { padding: 120px 0 80px; }
.how2__head { max-width: 720px; margin-bottom: 56px; }
.how2__title { font-size: 52px; line-height: 1.05; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.how2__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.how2__card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); min-height: 220px; padding: 28px 24px; }
.how2__step { font-family: var(--font-mono); font-size: 12px; color: var(--c-text-soft); font-weight: 500; letter-spacing: 0.04em; margin: 0 0 28px; }
.how2__ctitle { font-size: 21px; font-weight: 600; line-height: 1.2; color: var(--c-text); margin: 0 0 10px; }
.how2__body { color: var(--c-text-muted); font-size: 14.5px; line-height: 1.55; margin: 0; }

/* ── Integrations (native) ── */
.int2 { padding: 80px 0; }
.int2__head { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 24px; margin-bottom: 40px; }
.int2__headtext { max-width: 640px; }
.int2__title { font-size: 44px; line-height: 1.1; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.int2__lead { color: var(--c-text-muted); font-size: 17px; max-width: 540px; margin: 16px 0 17px; }
.int2__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.int2__cell { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); padding: 22px 14px; text-align: center; font-size: 13px; font-weight: 500; color: var(--c-text-muted); margin: 0; transition: border-color .15s, color .15s; }
.int2__cell:hover { color: var(--c-text); border-color: var(--c-accent); }

/* ── Resources (native) ── */
.res2 { padding: 80px 0; }
.res2__head { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 24px; margin-bottom: 40px; }
.res2__headtext { max-width: 680px; }
.res2__title { font-size: 48px; line-height: 1.05; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.res2__lead { color: var(--c-text-muted); font-size: 17px; max-width: 560px; margin: 16px 0 17px; }
.res2__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.res2__card { border-radius: var(--radius-lg); overflow: hidden; min-height: 240px; color: #1c1917; transition: transform .15s; display: flex; flex-direction: column; padding: 26px; gap: 14px; }
.res2__card:hover { transform: translateY(-2px); }
.res2__card--peach { background: var(--c-peach); } .res2__card--mint { background: var(--c-mint); }
.res2__card--lavender { background: var(--c-lavender); } .res2__card--butter { background: var(--c-butter); }
.res2__cat { align-self: flex-start; width: auto; display: inline-block; font-size: 10.5px; font-weight: 700; padding: 4px 10px; border-radius: 4px; background: rgba(28,25,23,.85); color: #fbf7ee; letter-spacing: 0.06em; text-transform: uppercase; margin: 0; }
.res2__title2 { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 20px; line-height: 1.2; letter-spacing: var(--heading-tracking); color: #1c1917; }
.res2__desc { font-size: 13.5px; line-height: 1.5; color: rgba(28,25,23,.75); margin: 0; flex: 1; }
.res2__more { font-size: 13px; font-weight: 600; color: #1c1917; margin: 0; }

/* ── Testimonials (native) ── */
.test2 { padding: 80px 0; }
.test2__head { margin-bottom: 48px; }
.test2__title { font-size: 44px; line-height: 1.1; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); max-width: 720px; }
.test2__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.test2__card { border-radius: var(--radius-lg); overflow: hidden; min-height: 240px; display: flex; flex-direction: column; padding: 28px 26px; gap: 24px; }
.test2__card--peach { background: var(--c-peach); } .test2__card--mint { background: var(--c-mint); } .test2__card--lavender { background: var(--c-lavender); }
.test2__q { font-size: 17px; line-height: 1.45; font-weight: 500; color: #1c1917; margin: 0; }
.test2__cap { display: flex; flex-direction: row; align-items: center; margin-top: auto; gap: 12px; }
.test2__av { width: 38px; height: 38px; flex: 0 0 auto; border-radius: 50%; background: rgba(0,0,0,.1); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; color: #1c1917; margin: 0; text-align: center; line-height: 38px; }
.test2__capmeta { display: flex; flex-direction: column; }
.test2__who { font-size: 14px; font-weight: 600; color: #1c1917; margin: 0; }
.test2__role { font-size: 12.5px; color: rgba(28,25,23,.6); margin: 0; }

/* ── Themes showcase (native) ── */
.themes2 { padding: 80px 0; }
.themes2__head { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 24px; margin-bottom: 40px; }
.themes2__headtext { max-width: 680px; }
.themes2__title { font-size: 48px; line-height: 1.05; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.themes2__lead { color: var(--c-text-muted); font-size: 17px; max-width: 560px; margin: 16px 0 17px; }
.themes2__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.themes2__card { border-radius: var(--radius-lg); overflow: hidden; color: #1c1917; transition: transform .15s, box-shadow .15s; display: flex; flex-direction: column; }
.themes2__card:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -16px rgba(0,0,0,.2); }
.themes2__card--peach { background: var(--c-peach); } .themes2__card--mint { background: var(--c-mint); }
.themes2__card--sky { background: var(--c-sky); } .themes2__card--lavender { background: var(--c-lavender); }
/* !important: Elementor's `.elementor img { height: auto }` has equal specificity and loads later. */
/* Logo plate, not a screenshot: a white panel with the vendor mark centred.
   Heights are capped rather than set so each logo keeps its own aspect ratio;
   !important beats the Elementor kit's global image height. */
.themes2__img { background: rgba(255, 255, 255, .55); height: 96px; display: flex; align-items: center; justify-content: center; padding: 0 20px; border-bottom: 1px solid rgba(255, 255, 255, .5); }
/* 48px caps the logo at half the plate, so the mark fills the band instead of
   floating in it. None of the four is upscaled past its natural size at 48px. */
.themes2__img img { display: block; width: auto !important; height: auto !important; max-width: 144px; max-height: 38.4px; object-fit: contain; }
.themes2__bodywrap { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px 22px; gap: 8px; }
.themes2__name { font-family: var(--font-heading); font-size: 20px; line-height: 1; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: #1c1917; margin: 0; }
.themes2__tag { font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(28,25,23,.6); margin: 0; }
.themes2__desc { font-size: 13.5px; line-height: 1.5; color: rgba(28,25,23,.75); margin: 0; flex: 1; }
.themes2__foot { border-top: 1px solid rgba(28,25,23,.12); display: flex; flex-direction: row; align-items: center; justify-content: space-between; margin-top: 6px; padding-top: 12px; }
.themes2__foot-txt { font-size: 13px; font-weight: 600; color: #1c1917; margin: 0; }

/* ── Successful sites / customer showcase (native) ── */
.show2 { background: var(--c-surface-2); padding: 80px 0; }
.show2__head { max-width: 720px; margin-bottom: 44px; }
.show2__title { font-size: 48px; line-height: 1.05; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.show2__lead { color: var(--c-text-muted); font-size: 17px; max-width: 600px; margin: 16px 0 0; }
.show2__grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.show2__card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; display: flex; flex-direction: column; min-width: 0; }
.show2__bar { display: flex; align-items: center; gap: 6px; padding: 9px 12px; background: var(--c-surface); border-bottom: 1px solid var(--c-border); }
.show2__dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.show2__dot--r { background: #ed6a5e; } .show2__dot--y { background: #f5bf4f; } .show2__dot--g { background: #62c554; }
.show2__url { margin-left: 8px; font-size: 11.5px; color: var(--c-text-soft); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* !important: Elementor's `.elementor img { height: auto }` has equal specificity and loads later. */
.show2__img img { display: block; width: 100%; height: 184px !important; object-fit: cover; }
.show2__meta { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px 22px; gap: 10px; }
.show2__namewrap { display: flex; flex-direction: column; gap: 2px; }
.show2__name { font-size: 17px; line-height: 1; font-weight: 600; letter-spacing: var(--heading-tracking); color: var(--c-text); margin: 0; }
.show2__link { margin: 0; }
.show2__link a { font-size: 13px; color: var(--c-accent); font-family: var(--font-mono); }
.show2__desc { font-size: 13.5px; line-height: 1.55; color: var(--c-text-muted); margin: 0; flex: 1 1 auto; }
.show2__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.show2__chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 500; background: var(--c-surface-2); color: var(--c-text-muted); border: 1px solid var(--c-border); white-space: nowrap; }
.show2__chip svg { flex: 0 0 auto; }

/* ── Standalone plugin / "What's new" (native) ── */
.stand2 { padding: 80px 0; }
.stand2__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,0.95fr); align-items: center; gap: 56px; }
.stand2__copy { display: flex; flex-direction: column; min-width: 0; }
.stand2__title { font-size: 44px; line-height: 1.08; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.stand2__p { color: var(--c-text-muted); font-size: 17px; line-height: 1.6; margin: 0; }
.stand2__p--a { margin-top: 18px; }
.stand2__p--b { margin-top: 14px; }
.stand2__strong { color: var(--c-text); font-weight: 700; }
.stand2__feats { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; }
.stand2__feat { display: flex; align-items: flex-start; gap: 12px; }
.stand2__check { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; }
.stand2__feattx { color: var(--c-text); font-size: 15.5px; line-height: 1.45; }
/* visual panel */
.stand2__visual { background: var(--c-surface-2); border: 1px solid var(--c-border); border-radius: var(--radius-xl); display: flex; flex-direction: column; align-items: center; padding: 36px 34px; gap: 22px; }
.stand2__badge { display: inline-flex; align-items: center; gap: 12px; background: var(--c-primary); color: var(--c-primary-text); padding: 14px 22px; border-radius: 999px; align-self: center; }
.stand2__badge-ic { display: inline-flex; }
.stand2__badge-tx { font-weight: 600; font-size: 17px; }
.stand2__badge-tag { font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; font-family: var(--font-mono); padding: 3px 8px; border-radius: 4px; background: rgba(255,255,255,.16); }
.stand2__installs { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 12.5px; color: var(--c-text-soft); font-family: var(--font-mono); }
.stand2__hr { width: 24px; height: 1px; background: var(--c-border); display: inline-block; }
/* Capped so the four theme chips wrap 2+2 instead of orphaning the last one. */
.stand2__chips { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; max-width: 340px; }
.stand2__chip { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: 999px; background: var(--c-surface); border: 1px solid var(--c-border); font-size: 13.5px; font-weight: 500; color: var(--c-text); white-space: nowrap; }
.stand2__chip svg { flex: 0 0 auto; color: var(--c-accent); }
.stand2__chip--accent { background: var(--c-accent-soft); color: var(--c-accent); border-color: transparent; font-weight: 600; }

/* ── Nav / header (native) ── */
.nav2 { position: sticky; top: 0; z-index: 50; backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%); background: rgba(255,255,255,0.6); border-bottom: 1px solid var(--c-border); }
.nav2__bar { display: flex !important; flex-direction: row !important; align-items: center !important; min-height: 68px; gap: 24px !important; }
/* Logo. The image widget is the only shrinkable item in the bar, so a default
   flex:0 1 auto lets the row squeeze its width while the widget's own
   height:34px stays put — i.e. a stretched logo. Pin the width to the image's
   own aspect ratio and take the space out of the nav gutters instead. */
.nav2__bar > .elementor-widget-image { flex: 0 0 auto !important; }
.nav2__bar > .elementor-widget-image img { width: auto !important; max-width: none !important; }
.nav2__brand { display: flex !important; flex-direction: row !important; align-items: center !important; flex: 0 0 auto !important; width: auto !important; }
.nav2__links { flex: 0 0 auto !important; width: auto !important; }
.nav2__brand img { width: 30px !important; height: 30px !important; }
.nav2__brand .elementor-heading-title { font-size: 18px !important; font-weight: 600; letter-spacing: -0.02em; color: var(--c-text) !important; }
/* The links are an Elementor Pro nav-menu widget bound to the "MLSimport Main"
   WP menu — same structure as live mlsimport.com, so three items carry real
   dropdowns. Elementor's own widget-nav-menu stylesheet is generic, so the
   look (14.5px muted links, floating white panel) is set here. */
.nav2__links .elementor-nav-menu--main > .elementor-nav-menu { display: flex !important; flex-direction: row !important; align-items: center; gap: 28px !important; margin: 0; padding: 0; }
.nav2__links .elementor-nav-menu > li { margin: 0 !important; padding: 0 !important; }
.nav2__links .elementor-nav-menu--main a.elementor-item { display: flex; align-items: center; padding: 0 !important; font-size: 14.5px !important; font-weight: 500; color: var(--c-text-muted) !important; white-space: nowrap; background: transparent !important; transition: color .3s ease; }
.nav2__links .elementor-nav-menu--main a.elementor-item:hover,
.nav2__links .elementor-nav-menu--main a.elementor-item:focus,
.nav2__links .elementor-nav-menu--main a.elementor-item.highlighted,
.nav2__links .elementor-nav-menu--main a.elementor-item.elementor-item-active { color: var(--c-text) !important; background: transparent !important; }
.nav2__links .sub-arrow { margin-left: 5px; padding: 0 !important; display: inline-flex; align-items: center; }
.nav2__links .sub-arrow svg, .nav2__links .sub-arrow i { width: 9px; height: 9px; font-size: 9px; opacity: .65; }

/* Dropdown panel. SmartMenus writes min-width/max-width inline, hence the
   !important; and .nav2's backdrop-filter makes it a stacking context whose
   z-index Elementor's .e-con resets to auto — without the bump the panel paints
   under the hero (z-index 2). */
.nav2.nav2 { z-index: 100; }
.nav2__links .elementor-nav-menu--main .elementor-nav-menu--dropdown { margin-top: 23px !important; min-width: 268px !important; padding: 8px !important; background: #fff; border: 1px solid var(--c-border); border-radius: 14px; box-shadow: 0 18px 40px -18px rgba(0,0,0,.35); }
.nav2__links .elementor-nav-menu--main .elementor-nav-menu--dropdown a.elementor-sub-item { padding: 9px 12px !important; border-radius: 9px; font-size: 14px; font-weight: 500; line-height: 1.35; color: var(--c-text-muted) !important; background: transparent !important; white-space: normal; transition: color .2s ease, background-color .2s ease; }
.nav2__links .elementor-nav-menu--main .elementor-nav-menu--dropdown a.elementor-sub-item:hover,
.nav2__links .elementor-nav-menu--main .elementor-nav-menu--dropdown a.elementor-sub-item.highlighted { color: var(--c-text) !important; background: var(--c-surface) !important; }

/* Mobile (Elementor's tablet breakpoint, where the widget swaps to a burger):
   the panel is pinned to the header bar rather than to the widget, so it spans
   the bar's width instead of the ~30px burger. Neutralising the widget's own
   positioning is what makes .nav2__bar the containing block. */
@media (max-width: 1024px) {
	.nav2__links { position: static !important; }
	.nav2__links .elementor-menu-toggle { background: transparent !important; color: var(--c-text) !important; padding: 4px; }
	.nav2__links .elementor-nav-menu--dropdown.elementor-nav-menu__container { position: absolute; top: calc(100% + 12px); left: 0; right: 0; width: auto; background: #fff; border: 1px solid var(--c-border); border-radius: 14px; box-shadow: 0 18px 40px -18px rgba(0,0,0,.35); padding: 8px; }
	.nav2__links .elementor-nav-menu--dropdown a { font-size: 14.5px; font-weight: 500; color: var(--c-text-muted) !important; background: transparent !important; border-radius: 9px; }
	.nav2__links .elementor-nav-menu--dropdown a:hover { color: var(--c-text) !important; background: var(--c-surface) !important; }
}
.nav2__spacer { flex: 1 1 auto !important; width: auto !important; }
.nav2__signin { flex: 0 0 auto !important; width: auto !important; }
/* Ghost pill — secondary to the solid "Get started" beside it. mls-account.js
   relabels this same link to "My Account" for logged-in visitors and hides the
   register CTA, so it also has to read as a button standing on its own. */
.nav2__signin .elementor-widget-container, .nav2__signin { font-size: 14.5px !important; font-weight: 500; color: var(--c-text-muted) !important; margin: 0 !important; white-space: nowrap; }
.nav2__signin a { display: inline-flex; align-items: center; padding: 9px 18px; border: 1px solid var(--c-border); border-radius: 999px; background: transparent; line-height: 1.5; }
.nav2 .elementor-widget-button { flex: 0 0 auto !important; }
.nav2 .elementor-button { background: var(--c-primary) !important; color: var(--c-primary-text) !important; border-radius: 999px !important; padding: 10px 18px; font-size: 14px; display: inline-flex; align-items: center; gap: 8px; line-height: 1.5; font-weight: 500; white-space: nowrap; }

/* Header CTA micro-interactions — the same lift / press / arrow-slide the rest
   of the site gets from .btn-pill. The sign-in rules also cover "My Account":
   assets/js/mls-account.js relabels this very link when the visitor is logged
   in, it is not a separate element. */
.nav2__signin a { transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease; }
.nav2__signin a:hover { color: var(--c-text) !important; background: var(--c-surface); border-color: rgba(28,25,23,.22); transform: translateY(-2px); box-shadow: 0 10px 24px -12px rgba(0,0,0,.4); }
.nav2__signin a:active { transform: translateY(0) scale(.97); box-shadow: none; transition-duration: .06s; }
.nav2__signin a:focus-visible { outline: 2px solid var(--c-text); outline-offset: 2px; }
.nav2 .elementor-button { transition: transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease !important; }
.nav2 .elementor-button:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(0,0,0,.45); }
.nav2 .elementor-button:active { transform: translateY(0) scale(.97); transition-duration: .06s !important; }
.nav2 .elementor-button .elementor-button-icon svg { transition: transform .2s cubic-bezier(.34,1.56,.64,1); }
.nav2 .elementor-button:hover .elementor-button-icon svg { transform: translateX(3px); }

/* ── Video rows ── */
.vid2 { padding: 80px 0; }
.vid2__head { max-width: 720px; margin-bottom: 48px; }
.vid2__stitle { font-size: 44px; line-height: 1.08; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.vid2__lead { color: var(--c-text-muted); font-size: 17px; max-width: 600px; margin: 16px 0 0; }
.vid2__rows { display: flex; flex-direction: column; gap: 28px; }
.vid2__row { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 56px; align-items: center; padding: 44px; border-radius: var(--radius-lg); }
.vid2__row:nth-child(odd) { background: var(--c-surface); }
.vid2__row:nth-child(even) { background: var(--c-surface-2); }
.vid2__row--flip .vid2__media { order: 2; }

.vid2__media {
  position: relative; aspect-ratio: 16 / 9; min-width: 0;
  background: var(--c-surface-2); border: 1px solid var(--c-border);
  border-radius: var(--radius-lg); overflow: hidden;
}
/* !important: Elementor's `.elementor img { height: auto }` has equal specificity and loads later. */
.vid2__poster { width: 100%; height: 100% !important; object-fit: cover; display: block; }
.vid2__play { position: absolute; inset: 0; width: 100%; display: flex; align-items: center; justify-content: center; background: rgba(28,25,23,.18); border: 0; padding: 0; cursor: pointer; transition: background .18s ease; }
.vid2__play:hover { background: rgba(28,25,23,.3); }
.vid2__play:focus-visible { outline: 2px solid var(--c-accent); outline-offset: -4px; }
.vid2__playdot {
  width: 76px; height: 76px; border-radius: 50%;
  background: var(--c-primary); color: var(--c-primary-text);
  display: flex; align-items: center; justify-content: center; padding-left: 4px;
  box-shadow: 0 14px 30px -12px rgba(0,0,0,.6);
  transition: transform .2s cubic-bezier(.34,1.56,.64,1);
}
.vid2__play:hover .vid2__playdot { transform: scale(1.07); }
.vid2__media.is-playing .vid2__play, .vid2__media.is-playing .vid2__poster { display: none; }
.vid2__media iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.vid2__copy { min-width: 0; }
.vid2__title { font-size: 38px; line-height: 1.1; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.vid2__body { color: var(--c-text-muted); font-size: 17px; line-height: 1.6; margin: 18px 0 0; }
.vid2__btns { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 28px; }
.vid2__watch { border: 1px solid var(--c-border); color: var(--c-text); }
.vid2__watch svg { transition: none; }
.vid2__watch:hover svg { transform: none; }

/* ─── responsive collapses ─────────────────────────────────────────────── */
/* Hero / bento / FAQ / footer — the widgets still using the .mlsimport-* classes.
   The home page's other sections use the *2 classes and collapse below. */
@media (max-width: 900px) {
  .mlsimport-hero__title { font-size: 52px; }
  .mlsimport-hero__sub { font-size: 17px; }
  .mlsimport-hero__sub + .mlsimport-hero__sub { font-size: 16px; }
  .mlsimport-bento__title, .mlsimport-cta__title { font-size: 40px; }
  .mlsimport-faq__title { font-size: 36px; }
  .mlsimport-bento__grid > * { grid-column: 1 / -1 !important; }
  .mlsimport-faq__grid { grid-template-columns: 1fr; gap: 32px; }
  .mlsimport-faq__side { position: static; }
  .mlsimport-footer__grid { grid-template-columns: 1fr 1fr; }
}

/* ─── home page sections (how2 / stand2 / themes2 / show2 / int2 / res2 /
       test2) — tablet, then phone. ─────────────────────────────────────── */
@media (max-width: 1024px) {
  .how2 { padding: 88px 0 64px; }
  .stand2, .themes2, .show2, .int2, .res2, .test2 { padding: 64px 0; }
  .how2__title { font-size: 40px; }
  .themes2__title, .show2__title, .res2__title { font-size: 38px; }
  .stand2__title, .int2__title, .test2__title { font-size: 36px; }
  .how2__head { margin-bottom: 40px; }
  .test2__head { margin-bottom: 36px; }
  .how2__grid, .themes2__grid, .show2__grid, .res2__grid, .test2__grid { grid-template-columns: repeat(2, 1fr); }
  .int2__grid { grid-template-columns: repeat(4, 1fr); }
  .stand2__grid { grid-template-columns: 1fr; gap: 40px; }
  .vid2 { padding: 64px 0; }
  .vid2__stitle { font-size: 36px; }
  .vid2__title { font-size: 30px; }
  .vid2__rows { gap: 24px; }
  .vid2__row { gap: 36px; padding: 32px; }
}

@media (max-width: 640px) {
  .how2 { padding: 64px 0 48px; }
  .stand2, .themes2, .show2, .int2, .res2, .test2 { padding: 48px 0; }
  .how2__title, .themes2__title, .show2__title,
  .res2__title, .stand2__title, .int2__title, .test2__title { font-size: 30px; }
  .how2__head, .show2__head, .test2__head { margin-bottom: 28px; }
  .themes2__head, .int2__head, .res2__head { align-items: flex-start; margin-bottom: 28px; }
  .how2__grid, .themes2__grid, .show2__grid, .res2__grid, .test2__grid { grid-template-columns: 1fr; }
  .int2__grid { grid-template-columns: repeat(2, 1fr); }
  .how2__card, .res2__card, .test2__card { min-height: 0; }
  .how2__step { margin-bottom: 20px; }
  .stand2__visual { padding: 28px 20px; }
  .stand2__grid { gap: 32px; }
  .vid2 { padding: 48px 0; }
  .vid2__head { margin-bottom: 28px; }
  .vid2__stitle, .vid2__title { font-size: 30px; }
  .vid2__rows { gap: 20px; }
  /* Stack, and keep the video above its copy on every row. */
  .vid2__row { grid-template-columns: 1fr; gap: 24px; padding: 22px; }
  .vid2__row--flip .vid2__media { order: 0; }
  .vid2__playdot { width: 60px; height: 60px; }
  .vid2__btns { margin-top: 22px; }
}

/* ============================================================================
   BLOG LIST — hero / featured / grid / newsletter
   Ported from page-blog.jsx (Sunny direction).
   ========================================================================== */

/* ── Blog hero ── */
.mlsimport-bloghero { padding: 64px 0 24px; }
.mlsimport-bloghero__eyebrow { margin-bottom: 18px; }
.mlsimport-bloghero__title { font-size: 80px; line-height: 0.96; font-weight: var(--font-display-weight); max-width: 1000px; text-wrap: balance; }
.mlsimport-bloghero__sub { font-size: 19px; color: var(--c-text-muted); line-height: 1.5; margin-top: 22px; max-width: 620px; }
.mlsimport-bloghero__filter { margin-top: 44px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-bottom: 20px; border-bottom: 1px solid var(--c-border); }
.mlsimport-bloghero__chip {
  padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 500; line-height: 1.5;
  background: var(--c-surface); color: var(--c-text-muted); border: 1px solid var(--c-border);
  cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.mlsimport-bloghero__chip.is-active { background: var(--c-primary); color: var(--c-primary-text); border-color: transparent; }
.mlsimport-bloghero__spacer { flex: 1; }
.mlsimport-bloghero__search { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border: 1px solid var(--c-border); border-radius: 999px; color: var(--c-text-muted); font-size: 13px; }
.mlsimport-bloghero__search input { border: none; background: transparent; color: var(--c-text); outline: none; font-family: inherit; font-size: 13px; width: 160px; }

/* ── Featured post ── */
.mlsimport-feat { padding: 24px 0; }
.mlsimport-feat__card { display: grid; grid-template-columns: 1.1fr 1fr; border-radius: var(--radius-lg); background: var(--c-peach); overflow: hidden; border: 1px solid var(--c-border); min-height: 420px; }
.mlsimport-feat__img { min-height: 420px; font-size: 14px; }
.mlsimport-feat__body { padding: 48px 44px; display: flex; flex-direction: column; gap: 16px; color: #1c1917; }
.mlsimport-feat__top { display: flex; align-items: center; gap: 10px; }
.mlsimport-feat__badge { padding: 4px 10px; background: rgba(28,25,23,.85); color: #fbf7ee; border-radius: 4px; letter-spacing: .08em; font-size: 12px; font-weight: 600; text-transform: uppercase; }
.mlsimport-feat__cat { font-size: 13px; color: rgba(28,25,23,.7); }
.mlsimport-feat__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 40px; line-height: 1.05; letter-spacing: var(--heading-tracking); color: #1c1917; }
.mlsimport-feat__excerpt { font-size: 17px; line-height: 1.55; color: rgba(28,25,23,.75); margin: 0; }
.mlsimport-feat__meta { margin-top: auto; display: flex; align-items: center; gap: 12px; font-size: 13px; color: rgba(28,25,23,.7); }
.mlsimport-feat__av { width: 36px; height: 36px; border-radius: 50%; background: rgba(28,25,23,.15); color: #1c1917; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14px; flex: 0 0 auto; }
.mlsimport-feat__who { font-weight: 600; color: #1c1917; }
.mlsimport-feat__date { font-size: 12px; }
.mlsimport-feat__spacer { flex: 1; }
.mlsimport-feat__read { font-size: 14px; font-weight: 600; }

/* ── Post grid + card (also "Keep reading" related) ── */
.mlsimport-bgrid { padding: 40px 0 80px; }
.mlsimport-bgrid--related { padding: 40px 0 60px; }
.mlsimport-bgrid__head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 32px; }
.mlsimport-bgrid__headtitle { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 36px; line-height: 1.1; letter-spacing: var(--heading-tracking); }
.mlsimport .mlsimport-bgrid__headlink { font-size: 14px; font-weight: 500; color: var(--c-accent); border-bottom: 1px solid var(--c-accent); padding-bottom: 3px; }
.mlsimport-bgrid__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.mlsimport-bgrid--related .mlsimport-bgrid__grid { gap: 18px; }
.mlsimport-bcardp { display: flex; flex-direction: column; gap: 14px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; transition: transform .15s, box-shadow .15s; }
.mlsimport-bcardp:hover { transform: translateY(-2px); box-shadow: 0 16px 40px -16px rgba(0,0,0,.18); }
.mlsimport-bcardp__img { height: 200px; font-size: 11px; }
.mlsimport-bgrid--related .mlsimport-bcardp__img { height: 150px; }
.mlsimport-bcardp__body { padding: 4px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.mlsimport-bgrid--related .mlsimport-bcardp__body { padding: 22px; }
.mlsimport-bcardp__top { display: flex; align-items: center; gap: 8px; }
.mlsimport-bcardp__cat { font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 4px; background: var(--c-accent-soft); color: var(--c-accent); letter-spacing: .04em; text-transform: uppercase; }
.mlsimport-bcardp__read { font-size: 12px; color: var(--c-text-soft); font-family: var(--font-mono); }
.mlsimport-bcardp__title { margin: 0; font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 21px; line-height: 1.2; letter-spacing: var(--heading-tracking); color: var(--c-text); }
.mlsimport-bgrid--related .mlsimport-bcardp__title { font-size: 18px; line-height: 1.25; }
.mlsimport-bcardp__excerpt { margin: 0; font-size: 14.5px; color: var(--c-text-muted); line-height: 1.5; flex: 1; }
.mlsimport-bcardp__meta { margin-top: 4px; display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--c-text-muted); }
.mlsimport-bcardp__av { width: 26px; height: 26px; border-radius: 50%; background: var(--c-surface-2); color: var(--c-text); display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 11.5px; flex: 0 0 auto; }
.mlsimport-bcardp__who { font-weight: 500; color: var(--c-text); }
.mlsimport-bcardp__dot { color: var(--c-text-soft); }

/* ── Dynamic-post extras (real WP posts) ── */
.mlsimport-card-photo { background-size: cover; background-position: center; background-repeat: no-repeat; }
.mlsimport-bgrid__empty { padding: 60px; text-align: center; color: var(--c-text-muted); }
.mlsimport-bgrid__pager { display: flex; justify-content: center; gap: 8px; margin-top: 48px; flex-wrap: wrap; }
.mlsimport-bgrid__page { min-width: 38px; height: 38px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; font-size: 14px; font-weight: 500; background: var(--c-surface); color: var(--c-text-muted); border: 1px solid var(--c-border); transition: background .15s, color .15s, border-color .15s; }
.mlsimport-bgrid__page:hover { color: var(--c-text); border-color: var(--c-accent); }
.mlsimport-bgrid__page.is-active { background: var(--c-primary); color: var(--c-primary-text); border-color: transparent; }
.mlsimport-bgrid__gap { display: inline-flex; align-items: flex-end; padding: 0 4px; color: var(--c-text-soft); }
.mlsimport-bpost-body__grid--notoc { grid-template-columns: 1fr; }
.mlsimport-bpost-body__grid--notoc .mlsimport-prose { margin: 0 auto; }

/* ── Newsletter ── */
.mlsimport-news { padding: 60px 0 30px; }
.mlsimport-news__panel { background: var(--c-mint); border-radius: var(--radius-xl); padding: 56px 48px; display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.mlsimport-news__eyebrow { margin-bottom: 14px; color: rgba(28,25,23,.6); }
.mlsimport-news__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 38px; line-height: 1.05; letter-spacing: var(--heading-tracking); color: #1c1917; }
.mlsimport-news__lead { font-size: 16px; line-height: 1.55; color: rgba(28,25,23,.7); margin-top: 12px; max-width: 480px; }
.mlsimport-news__form { display: flex; gap: 8px; padding: 6px; background: #fff; border-radius: 999px; }
.mlsimport-news__input { flex: 1; border: none; background: transparent; padding: 12px 18px; font-size: 15px; outline: none; color: #1c1917; font-family: inherit; }
.mlsimport-news__btn { padding: 12px 20px; font-size: 14px; }
.mlsimport-news__note { margin-top: 12px; font-size: 12px; color: rgba(28,25,23,.55); text-align: center; }

/* ============================================================================
   SINGLE POST — header / body (TOC + prose) / author bio
   Ported from page-blog-post.jsx (Sunny direction).
   ========================================================================== */

/* Every single-post section uses the standard 1240px container, so the back
   link, title, cover, TOC, author card and "Keep reading" cards line up with
   the footer CTA panel on the same 1176px column. */

/* ── Post header ── */
.mlsimport-bpost-head { padding: 40px 0 32px; }
.mlsimport-bpost-head__back { margin-bottom: 22px; }
.mlsimport-bpost-head__back a { font-size: 13.5px; color: var(--c-text-muted); display: inline-flex; align-items: center; gap: 6px; }
.mlsimport-bpost-head__back svg { transform: rotate(180deg); }
.mlsimport-bpost-head__meta { display: flex; gap: 14px; align-items: center; margin-bottom: 22px; flex-wrap: wrap; }
.mlsimport-bpost-head__cat { font-size: 11px; font-weight: 600; padding: 4px 10px; border-radius: 4px; background: var(--c-accent-soft); color: var(--c-accent); letter-spacing: .08em; text-transform: uppercase; }
.mlsimport-bpost-head__date { font-size: 13px; color: var(--c-text-soft); font-family: var(--font-mono); }
.mlsimport-bpost-head__sep, .mlsimport-bpost-head__read { font-size: 13px; color: var(--c-text-soft); }
.mlsimport-bpost-head__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 60px; line-height: 1.05; letter-spacing: var(--heading-tracking); text-wrap: balance; }
.mlsimport-bpost-head__excerpt { font-size: 21px; color: var(--c-text-muted); line-height: 1.45; margin-top: 24px; }
.mlsimport-bpost-head__strip { margin-top: 32px; border-top: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border); padding: 20px 0; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.mlsimport-bpost-head__av { width: 42px; height: 42px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px; flex: 0 0 auto; }
.mlsimport-bpost-head__who { font-size: 14.5px; font-weight: 600; color: var(--c-text); }
.mlsimport-bpost-head__role { font-size: 12.5px; color: var(--c-text-muted); }
.mlsimport-bpost-head__spacer { flex: 1; }
.mlsimport-bpost-head__share { display: flex; gap: 6px; }
.mlsimport-bpost-head__share .chip { font-size: 12.5px; cursor: pointer; }
.mlsimport-bpost-head__hero { margin-top: 36px; height: 460px; border-radius: var(--radius-lg); font-size: 13px; }

/* ── Post body: TOC + prose ── */
.mlsimport-bpost-body { padding: 32px 0 40px; }
/* TOC pinned to the left edge, prose to the right: 270 + 802 = 1072 inside the
   1176px column, so the prose's right edge lines up with every other section.
   `1fr` would swallow the slack and leave it 104px short. */
.mlsimport-bpost-body__grid { display: grid; grid-template-columns: 270px minmax(0, 802px); justify-content: space-between; gap: 64px; align-items: flex-start; }
.mlsimport-bpost-toc { position: sticky; top: 96px; }
.mlsimport-bpost-toc__label { margin-bottom: 14px; }
.mlsimport-bpost-toc__links { display: flex; flex-direction: column; gap: 10px; }
.mlsimport-bpost-toc__links a { font-size: 13.5px; color: var(--c-text-muted); border-left: 2px solid var(--c-border); padding: 2px 0 2px 12px; line-height: 1.4; }
.mlsimport-bpost-toc__links a.is-active { color: var(--c-text); border-left-color: var(--c-accent); font-weight: 600; }
.mlsimport-bpost-toc__rt { margin-top: 32px; padding: 14px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); font-size: 12.5px; color: var(--c-text-muted); line-height: 1.5; }
.mlsimport-bpost-toc__rt b { font-weight: 600; color: var(--c-text); display: block; margin-bottom: 6px; }

.mlsimport-prose { max-width: 802px; font-size: 19px; line-height: 1.65; color: var(--c-text); font-family: var(--font-body); }
.mlsimport-prose > :first-child { margin-top: 0; }
.mlsimport-prose__lead { font-size: 22px; line-height: 1.55; color: var(--c-text); font-weight: 500; }
.mlsimport-prose p { margin: 18px 0 0; color: var(--c-text); }
.mlsimport-prose h2 { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 32px; line-height: 1.15; letter-spacing: var(--heading-tracking); margin: 56px 0 16px; color: var(--c-text); }
.mlsimport-prose h3 { font-family: var(--font-body); font-weight: 600; font-size: 22px; line-height: 1.25; letter-spacing: var(--heading-tracking); margin: 36px 0 12px; }
.mlsimport-prose ul, .mlsimport-prose ol { padding-left: 24px; margin-top: 14px; }
.mlsimport-prose ul { list-style: disc; }
.mlsimport-prose ol { list-style: decimal; }
.mlsimport-prose li { margin-top: 8px; padding-left: 4px; }
.mlsimport-prose li::marker { color: var(--c-accent); font-weight: 600; }
.mlsimport-prose li > p { margin: 0; }
.mlsimport-prose li > p + p { margin-top: 10px; }
/* nested lists: tighter rhythm + secondary markers */
.mlsimport-prose li > ul, .mlsimport-prose li > ol { margin-top: 8px; }
.mlsimport-prose ul ul { list-style: circle; }
.mlsimport-prose ol ol { list-style: lower-alpha; }

/* Tables — rounded, soft-bordered, surface header (matches the Sunny tokens).
   Real post content uses thead th[scope=col] + tbody th[scope=row] + td. */
.mlsimport-prose table {
  width: 100%;
  margin: 32px 0;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 16px;
  line-height: 1.55;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-md);
  overflow: hidden; /* clip cell backgrounds to the rounded corners */
}
.mlsimport-prose th, .mlsimport-prose td {
  padding: 13px 18px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--c-border);
}
.mlsimport-prose th + th, .mlsimport-prose td + td, .mlsimport-prose th + td { border-left: 1px solid var(--c-border); }
.mlsimport-prose thead th {
  background: var(--c-surface-2);
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 12.5px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--c-text-muted);
}
.mlsimport-prose tbody th { /* row headers (scope="row") — emphasised label column */
  font-weight: 600;
  color: var(--c-text);
  background: rgba(28, 25, 23, 0.015);
}
.mlsimport-prose tbody td { color: var(--c-text); }
.mlsimport-prose tbody tr:nth-child(even) td { background: rgba(28, 25, 23, 0.022); }
.mlsimport-prose tbody tr:last-child th, .mlsimport-prose tbody tr:last-child td { border-bottom: none; }
.mlsimport-prose table caption { caption-side: bottom; margin-top: 12px; font-size: 13.5px; color: var(--c-text-soft); text-align: left; }
/* keep wide tables usable on narrow screens */
@media (max-width: 700px) {
  .mlsimport-prose table { font-size: 14.5px; }
  .mlsimport-prose th, .mlsimport-prose td { padding: 10px 12px; }
}
.mlsimport-prose blockquote { margin: 40px 0 32px; padding: 24px 28px; background: var(--c-butter); border-radius: var(--radius-md); font-family: var(--font-heading); font-style: italic; font-size: 24px; line-height: 1.3; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text); }
.mlsimport-prose .mlsimport-callout { margin: 24px 0; padding: 18px 22px; background: var(--c-mint); border-radius: var(--radius-md); border-left: 3px solid var(--c-accent); font-size: 16px; line-height: 1.55; color: #1c1917; }
.mlsimport-prose pre { margin: 20px 0; padding: 20px 22px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); font-family: var(--font-mono); font-size: 13px; line-height: 1.65; color: var(--c-text); overflow-x: auto; white-space: pre; }
.mlsimport-prose .mlsimport-endnote { margin-top: 32px; color: var(--c-text-muted); font-size: 16px; }
.mlsimport-prose .mlsimport-endnote a { color: var(--c-accent); border-bottom: 1px solid currentColor; }

/* ── Author bio ── */
.mlsimport-author { padding: 40px 0 24px; }
.mlsimport-author__card { padding: 32px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); display: grid; grid-template-columns: 64px 1fr auto; gap: 22px; align-items: center; }
.mlsimport-author__av { width: 64px; height: 64px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 24px; }
.mlsimport-author__eyebrow { margin-bottom: 6px; }
.mlsimport-author__name { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 22px; line-height: 1.2; letter-spacing: var(--heading-tracking); }
.mlsimport-author__desc { font-size: 14px; color: var(--c-text-muted); margin-top: 4px; line-height: 1.5; }
.mlsimport-author__btn { background: transparent; color: var(--c-text); border: 1px solid var(--c-border); padding: 10px 18px; font-size: 13px; }

/* ── Blog responsive collapses ── */
@media (max-width: 900px) {
  .mlsimport-bloghero__title { font-size: 52px; }
  .mlsimport-feat__card { grid-template-columns: 1fr; }
  .mlsimport-feat__img { min-height: 240px; }
  .mlsimport-bgrid__grid { grid-template-columns: repeat(2, 1fr); }
  .mlsimport-news__panel { grid-template-columns: 1fr; gap: 28px; }
  .mlsimport-bpost-head__title { font-size: 40px; }
  .mlsimport-bpost-body__grid { grid-template-columns: 1fr; gap: 32px; }
  .mlsimport-bpost-toc { position: static; }
  .mlsimport-author__card { grid-template-columns: 48px 1fr; }
  .mlsimport-author__btn { grid-column: 2; justify-self: start; }
}
@media (max-width: 640px) {
  .mlsimport-bgrid__grid { grid-template-columns: 1fr; }
}

/* ============================================================================
   PRICING PAGE — hero + billing toggle / single plan / trust strip
   Ported from page-pricing.jsx (Sunny direction).
   ========================================================================== */
.mlsimport-pricing-hero { padding: 64px 0 24px; text-align: center; position: relative; overflow: hidden; }
.mlsimport-pricing-hero__blob { position: absolute; top: 60px; left: 50%; transform: translateX(-50%); width: 540px; height: 540px; background: radial-gradient(circle, var(--c-butter), transparent 70%); opacity: .5; z-index: 0; pointer-events: none; }
.mlsimport-pricing-hero .mlsimport-container { position: relative; z-index: 1; }
.mlsimport-pricing__eyebrow { margin-bottom: 22px; }
.mlsimport-pricing__title { font-size: 76px; line-height: 1; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); margin: 0 auto; max-width: 900px; text-wrap: balance; }
.mlsimport-pricing__sub { font-size: 19px; color: var(--c-text-muted); line-height: 1.5; margin: 22px auto 0; max-width: 620px; }

.mlsimport-billtoggle { margin-top: 36px; display: inline-flex; align-items: center; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 999px; padding: 5px; }
.mlsimport-billtoggle__btn { appearance: none; border: none; background: transparent; color: var(--c-text-muted); padding: 10px 22px; border-radius: 999px; font-size: 14px; font-weight: 600; cursor: pointer; transition: background .15s, color .15s; display: inline-flex; align-items: center; gap: 8px; font-family: inherit; }
.mlsimport-billtoggle__btn.is-active { background: var(--c-primary); color: var(--c-primary-text); }
.mlsimport-billtoggle__save { font-size: 10.5px; font-weight: 700; padding: 2px 6px; border-radius: 4px; background: var(--c-accent-soft); color: var(--c-accent); }
.mlsimport-billtoggle__btn.is-active .mlsimport-billtoggle__save { background: rgba(255,255,255,.18); color: inherit; }

.mlsimport-plan { padding: 20px 0 40px; }
.mlsimport-plan__card { max-width: 1080px; margin: 0 auto; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); overflow: hidden; display: grid; grid-template-columns: 1fr 1.1fr; box-shadow: 0 24px 60px -28px rgba(0,0,0,.15); position: relative; }
.mlsimport-plan__left { padding: 48px 44px; background: var(--c-mint); color: #1c1917; display: flex; flex-direction: column; gap: 22px; position: relative; overflow: hidden; }
.mlsimport-plan__left::before { content: ""; position: absolute; top: -80px; right: -80px; width: 220px; height: 220px; border-radius: 50%; background: var(--c-butter); opacity: .5; }
.mlsimport-plan__left > * { position: relative; }
.mlsimport-plan__badge { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px; background: rgba(28,25,23,.85); color: #fbf7ee; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; align-self: flex-start; }
.mlsimport-plan__badge-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.mlsimport-plan__name { font-family: var(--font-heading); font-size: 30px; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); line-height: 1.1; }
.mlsimport-plan__tagline { font-size: 14.5px; color: rgba(28,25,23,.7); margin-top: 4px; }
.mlsimport-plan__pricerow { display: flex; align-items: baseline; gap: 8px; margin-top: 4px; }
.mlsimport-plan__price { font-family: var(--font-heading); font-size: 96px; font-weight: var(--font-display-weight); line-height: 1; letter-spacing: var(--heading-tracking); }
.mlsimport-plan__per { font-size: 18px; color: rgba(28,25,23,.6); }
.mlsimport-plan__billed { font-size: 13px; color: rgba(28,25,23,.55); margin-top: -8px; }
.mlsimport-plan__cta { margin-top: 6px; padding: 16px 26px; font-size: 15px; justify-content: center; width: 100%; }
.mlsimport-plan__note { font-size: 12px; color: rgba(28,25,23,.6); line-height: 1.55; margin-top: -6px; }
.mlsimport-plan__pay { margin-top: auto; padding-top: 22px; border-top: 1px solid rgba(28,25,23,.12); display: flex; align-items: center; gap: 12px; font-size: 12.5px; color: rgba(28,25,23,.65); flex-wrap: wrap; }
.mlsimport-plan__pay-item { display: inline-flex; align-items: center; gap: 6px; }
.mlsimport-plan__pay-sep { color: rgba(28,25,23,.4); }
.mlsimport-plan__pay-cards { font-family: var(--font-mono); font-size: 11.5px; }
.mlsimport-plan__right { padding: 48px 44px; display: flex; flex-direction: column; gap: 18px; }
.mlsimport-plan__inc-eyebrow { margin-bottom: 0; }
.mlsimport-plan__inc-title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 28px; line-height: 1.15; letter-spacing: var(--heading-tracking); margin: 0; }
.mlsimport-plan__feats { display: flex; flex-direction: column; gap: 12px; margin-top: 6px; }
.mlsimport-plan__feat { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; line-height: 1.45; color: var(--c-text); }
.mlsimport-plan__feat-ic { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; margin-top: 1px; }

.mlsimport-trust { padding: 32px 0 60px; }
.mlsimport-trust__grid { display: grid !important; grid-template-columns: repeat(4, 1fr); }
.mlsimport-trust__card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md) !important; display: flex !important; flex-direction: row !important; align-items: center !important; }
.mlsimport-trust__ic .elementor-widget-container, .mlsimport-trust__ic { flex: 0 0 auto !important; width: 30px !important; height: 30px !important; border-radius: 8px; background: var(--c-accent-soft); color: var(--c-accent) !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; line-height: 1 !important; }
.mlsimport-trust__ic svg { stroke: var(--c-accent); }
.mlsimport-trust__title .elementor-heading-title { font-size: 14px !important; font-weight: 600; color: var(--c-text) !important; }
.mlsimport-trust__sub .elementor-widget-container, .mlsimport-trust__sub { font-size: 12.5px !important; color: var(--c-text-muted) !important; margin: 2px 0 0 !important; }
.mlsimport-trust__sub p, .mlsimport-trust__title p { margin: 0 !important; }

/* ============================================================================
   CONTACT PAGE — hero / form / sidebar
   Ported from page-contact.jsx (Sunny direction).
   ========================================================================== */
.mlsimport-chero { padding: 64px 0 24px; position: relative; overflow: hidden; }
.mlsimport-chero__blob { position: absolute; top: 60px; right: -120px; width: 460px; height: 460px; background: radial-gradient(circle, var(--c-sky), transparent 70%); opacity: .55; z-index: 0; pointer-events: none; }
.mlsimport-chero .mlsimport-container { position: relative; z-index: 1; }
.mlsimport-chero .nl-eyebrow .elementor-heading-title { margin-bottom: 22px; }
.mlsimport-chero__title { max-width: 1000px; text-wrap: balance; }
.mlsimport-chero__title .elementor-heading-title { font-size: 80px !important; line-height: .98; font-weight: var(--font-display-weight); letter-spacing: var(--heading-tracking); color: var(--c-text) !important; }
.mlsimport-chero__sub { max-width: 640px; }
.mlsimport-chero__sub .elementor-widget-container, .mlsimport-chero__sub { font-size: 20px !important; color: var(--c-text-muted) !important; line-height: 1.5; margin: 22px 0 0 !important; }

.mlsimport-cbody { padding: 40px 0 60px; }
.mlsimport-cbody__grid { display: grid !important; grid-template-columns: 1.4fr 1fr; gap: 56px; align-items: flex-start; }

/* Contact form (custom widget) */
.mlsimport-cform { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); padding: 36px 36px 32px; }
.mlsimport-cform__eyebrow { margin-bottom: 22px; }
.mlsimport-cform__row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.mlsimport-cform__field { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.mlsimport-cform__row2 .mlsimport-cform__field { margin-top: 0; }
.mlsimport-cform__label { font-size: 13px; font-weight: 600; color: var(--c-text); }
.mlsimport-cform__req { color: var(--c-accent); margin-left: 4px; }
.mlsimport-cform input, .mlsimport-cform textarea { appearance: none; width: 100%; padding: 12px 14px; font-size: 14.5px; font-family: inherit; background: var(--c-bg); border: 1px solid var(--c-border); border-radius: var(--radius-sm); color: var(--c-text); outline: none; transition: border-color .15s; box-sizing: border-box; }
.mlsimport-cform input:focus, .mlsimport-cform textarea:focus { border-color: var(--c-accent); }
.mlsimport-cform textarea { min-height: 140px; resize: vertical; line-height: 1.5; }
.mlsimport-cform__chips { display: flex; gap: 8px; flex-wrap: wrap; }
.mlsimport-cform__chip { appearance: none; border: 1px solid var(--c-border); background: transparent; color: var(--c-text-muted); padding: 8px 14px; border-radius: 999px; font-size: 13px; font-weight: 500; cursor: pointer; font-family: inherit; transition: background .12s, color .12s, border-color .12s; }
.mlsimport-cform__chip.is-sel { border-color: var(--c-accent); background: var(--c-accent-soft); color: var(--c-accent); }
.mlsimport-cform__submit { margin-top: 24px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.mlsimport-cform__btn { padding: 15px 26px; font-size: 15px; }
.mlsimport-cform__btn[disabled] { opacity: .45; cursor: not-allowed; }
.mlsimport-cform__privacy { font-size: 12.5px; color: var(--c-text-muted); flex: 1; }
.mlsimport-cform__success { text-align: center; padding: 56px 48px; }
.mlsimport-cform__success-ic { width: 64px; height: 64px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 22px; }
.mlsimport-cform__success-title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 36px; line-height: 1.1; letter-spacing: var(--heading-tracking); margin: 0; }
.mlsimport-cform__success-sub { font-size: 17px; color: var(--c-text-muted); margin: 14px auto 0; max-width: 480px; }

/* Contact sidebar (custom widget) */
.mlsimport-cside { display: flex; flex-direction: column; gap: 18px; }
.mlsimport-cside__resp { background: var(--c-mint); border-radius: var(--radius-lg); padding: 28px 26px; color: #1c1917; }
.mlsimport-cside__badge { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px; background: rgba(28,25,23,.85); color: #fbf7ee; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.mlsimport-cside__badge-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; display: inline-block; }
.mlsimport-cside__resp-sub { margin-top: 14px; font-size: 14px; color: rgba(28,25,23,.7); line-height: 1.5; }
.mlsimport-cside__channels { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; }
.mlsimport-cside__ch { padding: 20px 22px; display: flex; align-items: flex-start; gap: 14px; }
.mlsimport-cside__ch + .mlsimport-cside__ch { border-top: 1px solid var(--c-border); }
.mlsimport-cside__ch-ic { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 10px; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; }
.mlsimport-cside__ch-body { flex: 1; min-width: 0; }
.mlsimport-cside__ch-title { font-size: 11px; font-weight: 700; color: var(--c-text-muted); letter-spacing: .06em; text-transform: uppercase; }
.mlsimport-cside__ch-link { display: block; font-size: 15.5px; font-weight: 600; color: var(--c-text); margin-top: 4px; }
.mlsimport-cside__ch-note { font-size: 12.5px; color: var(--c-text-muted); margin-top: 4px; }

/* ── Pricing / contact responsive ── */
@media (max-width: 900px) {
  .mlsimport-pricing__title { font-size: 52px; }
  .mlsimport-plan__card { grid-template-columns: 1fr; }
  .mlsimport-trust__grid { grid-template-columns: repeat(2, 1fr); }
  .mlsimport-chero__title { font-size: 52px; }
  .mlsimport-cbody__grid { grid-template-columns: 1fr; gap: 32px; }
  .mlsimport-cform__row2 { grid-template-columns: 1fr; }
}

/* `.mlsimport a { color: inherit }` (specificity 0,1,1) swallows pill-button colours on
   anchor buttons — restore them with a higher-specificity rule. */
.mlsimport a.btn-pill { color: var(--c-text); }
.mlsimport a.btn-primary { color: var(--c-primary-text); }

/* ============================================================================
   GEORGIA MLS PAGE — ported from page-georgia-mls.jsx (Sunny direction).
   Shared heading helpers (native heading widgets need !important to beat the kit).
   ========================================================================== */
.gml-alt { background: var(--c-surface-2); }
.gml-h2 .elementor-heading-title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 44px !important; line-height: 1.08; letter-spacing: var(--heading-tracking); color: var(--c-text) !important; }
.gml-h2--52 .elementor-heading-title { font-size: 52px !important; }
.gml-h2--34 .elementor-heading-title { font-size: 34px !important; }
.gml-h2--26 .elementor-heading-title { font-size: 26px !important; }
.gml-lead .elementor-widget-container, .gml-lead { font-size: 17px !important; color: var(--c-text-muted) !important; line-height: 1.6; margin: 16px 0 0 !important; }
.gml-head { max-width: 680px; }

/* 1 · Hero */
.gml-hero { position: relative; overflow: hidden; }
.gml-hero__blob { position: absolute; top: -120px; right: -80px; width: 560px; height: 560px; background: radial-gradient(circle, var(--c-butter), transparent 70%); opacity: .55; z-index: 0; pointer-events: none; }
.gml-hero .mlsimport-container { position: relative; z-index: 1; }
.gml-hero__grid { display: grid !important; grid-template-columns: minmax(0,1.05fr) minmax(0,0.95fr); align-items: center; }
.elementor-widget.gml-hero__chip { display: inline-flex; width: fit-content; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 500; background: var(--c-surface); color: var(--c-text-muted); border: 1px solid var(--c-border); font-family: var(--font-mono); letter-spacing: .02em; }
.gml-hero__chip .elementor-widget-container, .gml-hero__chip p { display: contents; }
.gml-hero__chip-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c-accent); flex: 0 0 auto; }

/* Reset the <p> wpautop injects inside text widgets used as icon boxes / badges. */
.gml-scard__ic p, .gml-icard__ic p, .gml-login__row-ic p, .gml-contact__row-ic p, .gml-price__feat-ic p,
.gml-fcard__who p, .gml-api__badge p, .gml-price__badge p, .gml-hero__chip p,
.gml-fcard__price p, .gml-fcard__plabel p, .gml-fcard__init p, .gml-fcard__note p,
.gml-stat__l p, .gml-disp__note p, .gml-api__bridge p, .gml-gmap p { margin: 0 !important; display: inline-flex; align-items: center; gap: 8px; }
.gml-fcard__note p, .gml-fcard__init p { display: block; }
.gml-hero__title .elementor-heading-title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 56px !important; line-height: 1.04; letter-spacing: var(--heading-tracking); color: var(--c-text) !important; }
.gml-hero__sub .elementor-widget-container, .gml-hero__sub { font-size: 19px !important; color: var(--c-text-muted) !important; line-height: 1.55; margin: 22px 0 0 !important; max-width: 500px; }
.gml-hero__btns { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; }
.gml-hero .elementor-button { border-radius: 999px !important; font-weight: 500; font-size: 15px; padding: 15px 24px; display: inline-flex; align-items: center; gap: 8px; line-height: 1.5; }
.gml-hero__btn-p .elementor-button { background: var(--c-primary) !important; color: var(--c-primary-text) !important; }
.gml-hero__btn-g .elementor-button { background: transparent !important; color: var(--c-text) !important; border: 1px solid var(--c-border); }
.gml-hero__works .elementor-widget-container, .gml-hero__works { font-size: 13px !important; color: var(--c-text-soft) !important; margin: 18px 0 0 !important; }

/* Georgia map (custom widget) */
.mlsimport-gmap { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 14px 16px 12px; display: flex; flex-direction: column; }
.mlsimport-gmap__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.mlsimport-gmap__title { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; }
.mlsimport-gmap__counties { font-size: 10.5px; color: var(--c-text-soft); font-family: var(--font-mono); }
.mlsimport-gmap__legend { display: flex; flex-wrap: wrap; gap: 18px; padding-top: 12px; border-top: 1px solid var(--c-border); font-size: 12px; color: var(--c-text-muted); }
.mlsimport-gmap__leg { display: inline-flex; align-items: center; gap: 7px; }
.mlsimport-gmap__leg-sw { width: 14px; height: 10px; border-radius: 3px; }
.mlsimport-gmap__leg-sw--area { background: rgba(232,93,60,.25); border: 1px dashed var(--c-accent); }
.mlsimport-gmap__leg-sw--state { background: var(--c-surface-2); border: 1px solid var(--c-border); }
.mlsimport-gmap__leg-sw--city { width: 8px; height: 8px; border-radius: 50%; background: var(--c-accent); }

/* 2 · Getting started */
.gml-start__grid { display: grid !important; grid-template-columns: repeat(3, 1fr); }
.gml-scard { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg) !important; min-height: 260px; display: flex !important; flex-direction: column !important; }
.gml-scard__ic .elementor-widget-container, .gml-scard__ic { width: 52px; height: 52px; border-radius: var(--radius-md); color: #1c1917; display: flex; align-items: center; justify-content: center; margin: 0 0 22px !important; }
.gml-scard__ic--peach .elementor-widget-container, .gml-scard__ic--peach { background: var(--c-peach); }
.gml-scard__ic--mint .elementor-widget-container, .gml-scard__ic--mint { background: var(--c-mint); }
.gml-scard__ic--lavender .elementor-widget-container, .gml-scard__ic--lavender { background: var(--c-lavender); }
.gml-scard__title .elementor-heading-title { font-size: 22px !important; font-weight: 600; letter-spacing: var(--heading-tracking); line-height: 1.2; color: var(--c-text) !important; margin-bottom: 10px; }
.gml-scard__body .elementor-widget-container, .gml-scard__body { color: var(--c-text-muted) !important; font-size: 14.5px !important; line-height: 1.55; margin: 0 !important; }
.gml-scard__link .elementor-widget-container, .gml-scard__link { margin: auto 0 0 !important; padding-top: 18px; }
.gml-scard__link a { font-size: 14px; font-weight: 600; color: var(--c-accent); display: inline-flex; align-items: center; gap: 7px; }

/* 3 · What is GAMLS */
.gml-what__grid { display: grid !important; grid-template-columns: 1.1fr 0.9fr; align-items: flex-start; }
.gml-what__p .elementor-widget-container, .gml-what__p { color: var(--c-text-muted) !important; font-size: 16.5px !important; line-height: 1.65; margin: 14px 0 0 !important; }
.gml-what__p strong { color: var(--c-text); }
.gml-facts { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg) !important; padding: 10px 26px; }
.gml-facts__row { display: flex !important; flex-direction: row !important; justify-content: space-between !important; align-items: baseline; gap: 16px; padding: 16px 0; }
.gml-facts__k { flex: 0 0 auto; }
.gml-facts__v { flex: 1 1 auto; }
.gml-facts__row + .gml-facts__row { border-top: 1px solid var(--c-border); }
.gml-facts__v { text-align: right; }
.gml-facts__k { font-size: 13px; color: var(--c-text-soft); font-family: var(--font-mono); letter-spacing: .02em; }
.gml-facts__v { font-size: 15px; font-weight: 600; color: var(--c-text); text-align: right; }

/* 4 · Coverage */
.gml-cov__stats { display: grid !important; grid-template-columns: repeat(4, minmax(0,1fr)); }
.gml-stat { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); }
.gml-stat__n .elementor-heading-title { font-family: var(--font-heading); font-size: 40px !important; font-weight: var(--font-display-weight); line-height: 1; letter-spacing: var(--heading-tracking); color: var(--c-text) !important; }
.gml-stat__l .elementor-widget-container, .gml-stat__l { font-size: 13px !important; color: var(--c-text-muted) !important; margin: 8px 0 0 !important; }
.gml-cov__cols { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.gml-cov__col { min-width: 0; }
.gml-cov__colhead { display: flex !important; flex-direction: row !important; align-items: center !important; margin-bottom: 16px; }
.gml-cov__colhead .elementor-heading-title { font-size: 12px !important; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-text-muted) !important; }
.gml-cov__colic .elementor-widget-container, .gml-cov__colic { color: var(--c-text); display: flex; align-items: center; }
/* .elementor-widget. prefix: Elementor's frontend.min.css applies flex-wrap/gap on every widget
   root later in the cascade at 0-1-0, so a flex widget root needs 0-2-0 to keep wrap + gap. */
.elementor-widget.gml-cov__pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 !important; }
.gml-cov__pills .elementor-widget-container, .gml-cov__pills .elementor-widget-container p { display: contents; }
.gml-cov__pills .chip { font-size: 13px; background: var(--c-surface); }

/* 5 · Eligibility + shared icon cards */
.gml-2col { display: grid !important; grid-template-columns: repeat(2, 1fr); }
.gml-icard { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg) !important; display: flex !important; flex-direction: row !important; align-items: flex-start; }
.gml-icard__ic .elementor-widget-container, .gml-icard__ic { flex: 0 0 auto; width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; margin: 0 !important; }
.gml-icard__title .elementor-heading-title { font-size: 17px !important; font-weight: 600; color: var(--c-text) !important; margin-bottom: 6px; }
.gml-icard__body .elementor-widget-container, .gml-icard__body { font-size: 14px !important; color: var(--c-text-muted) !important; line-height: 1.55; margin: 0 !important; }

/* 6 · Fees */
.gml-fees__grid { display: grid !important; grid-template-columns: repeat(3, 1fr); }
.gml-fcard { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg) !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; }
.gml-fcard__who .elementor-widget-container, .gml-fcard__who { padding: 18px 24px !important; font-weight: 600; font-size: 17px !important; color: #1c1917 !important; margin: 0 !important; }
.gml-fcard__who--peach .elementor-widget-container, .gml-fcard__who--peach { background: var(--c-peach); }
.gml-fcard__who--mint .elementor-widget-container, .gml-fcard__who--mint { background: var(--c-mint); }
.gml-fcard__who--lavender .elementor-widget-container, .gml-fcard__who--lavender { background: var(--c-lavender); }
.gml-fcard__pricerow { display: flex !important; flex-direction: row !important; align-items: baseline !important; }
.gml-fcard__price .elementor-widget-container, .gml-fcard__price { font-family: var(--font-heading); font-size: 40px !important; font-weight: var(--font-display-weight); line-height: 1; letter-spacing: var(--heading-tracking); color: var(--c-text) !important; margin: 0 !important; }
.gml-fcard__plabel .elementor-widget-container, .gml-fcard__plabel { font-size: 14px !important; color: var(--c-text-muted) !important; margin: 0 !important; }
.gml-fcard__init .elementor-widget-container, .gml-fcard__init { font-size: 13.5px !important; color: var(--c-text-muted) !important; margin: 0 !important; }
.gml-fcard__init b { font-family: var(--font-mono); color: var(--c-text); font-weight: 600; }
.gml-fcard__note .elementor-widget-container, .gml-fcard__note { font-size: 13px !important; color: var(--c-text-soft) !important; line-height: 1.5; border-top: 1px solid var(--c-border); padding-top: 16px !important; margin: 0 !important; }
.gml-foot { font-size: 13px; color: var(--c-text-soft); font-family: var(--font-mono); }
.gml-foot .elementor-widget-container, .gml-foot { font-size: 13px !important; color: var(--c-text-soft) !important; font-family: var(--font-mono); margin: 16px 0 0 !important; }

/* 7 · Login */
.gml-login__card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); display: grid !important; grid-template-columns: 1fr 0.9fr; align-items: center; }
.gml-login__p .elementor-widget-container, .gml-login__p { font-size: 15.5px !important; color: var(--c-text-muted) !important; line-height: 1.6; margin: 14px 0 0 !important; }
.gml-login__rows { display: flex !important; flex-direction: column !important; }
.gml-login__row { display: flex !important; flex-direction: row !important; align-items: center !important; background: var(--c-surface-2); border-radius: var(--radius-md); }
.gml-login__row-ic .elementor-widget-container, .gml-login__row-ic { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 8px; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; margin: 0 !important; }
.gml-login__row-l .elementor-widget-container, .gml-login__row-l { font-size: 14.5px !important; font-weight: 500; color: var(--c-text) !important; margin: 0 !important; }

/* 8 · API status */
.gml-api__grid { display: grid !important; grid-template-columns: 0.85fr 1.15fr; align-items: flex-start; }
.elementor-widget.gml-api__badge, .gml-api__badge { display: inline-flex; width: fit-content; align-items: center; gap: 8px; padding: 6px 12px !important; border-radius: 999px; background: var(--c-mint); font-size: 12.5px !important; font-weight: 600; color: #1c1917 !important; margin: 16px 0 0 !important; }
.gml-api__badge .elementor-widget-container, .gml-api__badge p { display: contents; }
.gml-api__badge-dot { width: 7px; height: 7px; border-radius: 50%; background: #1f8a5b; }
.gml-api__p .elementor-widget-container, .gml-api__p { font-size: 15.5px !important; color: var(--c-text-muted) !important; line-height: 1.6; margin: 16px 0 0 !important; }
.gml-api__bridge { display: flex !important; flex-direction: row !important; align-items: center !important; margin-top: 18px; }
.gml-api__bridge-ic .elementor-widget-container, .gml-api__bridge-ic { color: var(--c-text-soft); display: flex; align-items: center; }
.gml-api__bridge-tx .elementor-widget-container, .gml-api__bridge-tx { font-size: 12.5px !important; color: var(--c-text-soft) !important; font-family: var(--font-mono); margin: 0 !important; }
.gml-steps { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg) !important; padding: 12px 32px; }
.elementor-widget.gml-steps__row, .gml-steps__row { display: flex; gap: 18px; align-items: flex-start; padding: 18px 0; }
.gml-steps__row .elementor-widget-container, .gml-steps__row p { display: contents; }
.gml-steps__row + .gml-steps__row { border-top: 1px solid var(--c-border); }
.gml-steps__n { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 13px; font-weight: 600; }
.gml-steps__txt { display: flex; flex-direction: column; }
.gml-steps__title { display: block; font-size: 16px; font-weight: 600; margin-bottom: 3px; color: var(--c-text); }
.gml-steps__body { display: block; font-size: 14px; color: var(--c-text-muted); line-height: 1.5; }

/* 9 · Display steps */
.gml-disp__grid { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; }
.gml-disp__cards { display: grid !important; grid-template-columns: 1fr 1fr; }
.gml-dcard { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg) !important; min-height: 180px; }
.gml-dcard__step .elementor-widget-container, .gml-dcard__step { font-family: var(--font-mono); font-size: 12px !important; color: var(--c-text-soft) !important; font-weight: 500; letter-spacing: .04em; margin: 0 0 22px !important; }
.gml-dcard__title .elementor-heading-title { font-size: 18px !important; font-weight: 600; letter-spacing: var(--heading-tracking); line-height: 1.2; color: var(--c-text) !important; margin-bottom: 8px; }
.gml-dcard__body .elementor-widget-container, .gml-dcard__body { color: var(--c-text-muted) !important; font-size: 13.5px !important; line-height: 1.5; margin: 0 !important; }
.gml-mock { border-radius: var(--bw-radius); }
.gml-mock__ph { height: 300px; }
.gml-disp__note { display: flex !important; flex-direction: row !important; align-items: center !important; }
.gml-disp__note-ic .elementor-widget-container, .gml-disp__note-ic { color: var(--c-text-muted); display: flex; align-items: center; }
.gml-disp__note-tx .elementor-widget-container, .gml-disp__note-tx { font-size: 13.5px !important; color: var(--c-text-muted) !important; margin: 0 !important; }

/* 11 · Pricing block */
.gml-price__card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl) !important; overflow: hidden; display: grid !important; grid-template-columns: 1fr 1.1fr; box-shadow: 0 24px 60px -28px rgba(0,0,0,.15); }
.gml-price__left { background: var(--c-mint); display: flex !important; flex-direction: column !important; position: relative; overflow: hidden; color: #1c1917; }
.gml-price__left::before { content: ""; position: absolute; top: -80px; right: -80px; width: 220px; height: 220px; border-radius: 50%; background: var(--c-butter); opacity: .5; }
.gml-price__left > * { position: relative; }
.elementor-widget.gml-price__badge, .gml-price__badge { display: inline-flex; width: fit-content; align-items: center; gap: 8px; padding: 5px 12px !important; background: rgba(28,25,23,.85); color: #fbf7ee !important; border-radius: 999px; font-size: 11px !important; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin: 0 !important; }
.gml-price__badge .elementor-widget-container, .gml-price__badge p { display: contents; }
.gml-price__badge-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.gml-price__pricerow { display: flex !important; flex-direction: row !important; align-items: baseline !important; }
.gml-price__price .elementor-widget-container, .gml-price__price { font-family: var(--font-heading); font-size: 84px !important; font-weight: var(--font-display-weight); line-height: 1; letter-spacing: var(--heading-tracking); color: #1c1917 !important; margin: 0 !important; }
.gml-price__per .elementor-widget-container, .gml-price__per { font-size: 18px !important; color: rgba(28,25,23,.6) !important; margin: 0 !important; }
.gml-price__billed .elementor-widget-container, .gml-price__billed { font-size: 13px !important; color: rgba(28,25,23,.6) !important; margin: 0 !important; }
.gml-price__cta .elementor-button { background: var(--c-primary) !important; color: var(--c-primary-text) !important; border-radius: 999px !important; padding: 15px 24px; font-size: 15px; width: 100%; justify-content: center; display: inline-flex; align-items: center; gap: 8px; }
.gml-price__link .elementor-widget-container, .gml-price__link { text-align: center; margin: 0 !important; }
.gml-price__link a { font-size: 13.5px; color: rgba(28,25,23,.7); border-bottom: 1px solid rgba(28,25,23,.2); padding-bottom: 2px; }
.gml-price__right { display: flex !important; flex-direction: column !important; }
.gml-price__feat { display: flex !important; flex-direction: row !important; align-items: flex-start !important; }
.gml-price__feat-ic .elementor-widget-container, .gml-price__feat-ic { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; margin: 1px 0 0 !important; }
.gml-price__feat-t .elementor-widget-container, .gml-price__feat-t { font-size: 15px !important; line-height: 1.45; color: var(--c-text) !important; margin: 0 !important; }

/* 12 · Contact GAMLS */
.gml-contact__card { background: var(--c-surface-2); border: 1px solid var(--c-border); border-radius: var(--radius-xl) !important; display: grid !important; grid-template-columns: 0.8fr 1.2fr; align-items: center; }
.gml-contact__p .elementor-widget-container, .gml-contact__p { font-size: 15px !important; color: var(--c-text-muted) !important; line-height: 1.6; margin: 14px 0 0 !important; }
.gml-contact__rows { display: flex !important; flex-direction: column !important; }
.gml-contact__row { display: flex !important; flex-direction: row !important; gap: 18px; align-items: flex-start; padding: 18px 0; }
.gml-contact__row + .gml-contact__row { border-top: 1px solid var(--c-border); }
.gml-contact__row-ic .elementor-widget-container, .gml-contact__row-ic { flex: 0 0 auto; width: 38px; height: 38px; border-radius: var(--radius-sm); background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; margin: 0 !important; }
.gml-contact__row-l .elementor-widget-container, .gml-contact__row-l { margin: 0 0 5px !important; }
.gml-contact__row-l .elementor-heading-title { color: var(--c-text-soft) !important; }
.gml-contact__row-v .elementor-widget-container, .gml-contact__row-v { font-size: 15.5px !important; color: var(--c-text) !important; line-height: 1.5; margin: 0 !important; }

@media (max-width: 900px) {
  .gml-hero__grid, .gml-what__grid, .gml-login__card, .gml-api__grid, .gml-disp__grid, .gml-price__card, .gml-contact__card { grid-template-columns: 1fr; }
  .gml-start__grid, .gml-fees__grid, .gml-cov__stats { grid-template-columns: repeat(2, 1fr); }
  .gml-2col, .gml-cov__cols, .gml-disp__cards { grid-template-columns: 1fr; }
  .gml-h2 .elementor-heading-title { font-size: 34px !important; }
  .gml-hero__title .elementor-heading-title { font-size: 40px !important; }
}

/* ============================================================================
   FEATURES PAGE — full feature tour (mlsi_features widget)
   Ported from page-features.jsx + features-extra.jsx (Sunny direction).
   ========================================================================== */
.mlsimport-feat { color: var(--c-text); }

/* ── Section frame + shared SectionHead ── */
.mlsimport-fsec { padding: 72px 0; }
.mlsimport-fsec--pillars { padding: 56px 0; }
.mlsimport-fsec--stand { padding: 80px 0; }
.mlsimport-fsec--road { padding: 72px 0 40px; }
.mlsimport-fsec--alt { background: var(--c-surface-2); }
.mlsimport-fsec--anchor { scroll-margin-top: 84px; }

.mlsimport-fhead .eyebrow { margin-bottom: 14px; }
.mlsimport-fhead__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: clamp(34px, 4.4vw, 50px); line-height: 1.06; letter-spacing: var(--heading-tracking); margin: 0; text-wrap: balance; }
.mlsimport-fhead__lead { color: var(--c-text-muted); font-size: 18px; line-height: 1.55; margin-top: 18px; text-wrap: pretty; }
.mlsimport-fhead--center { margin: 0 auto; text-align: center; }

/* ── Check-mark line item ── */
.mlsimport-fcheck { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; line-height: 1.5; color: var(--c-text); }
.mlsimport-fcheck__ic { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.mlsimport-fcheck--dark { color: rgba(255,255,255,.92); }
.mlsimport-fcheck--dark .mlsimport-fcheck__ic { background: rgba(255,255,255,.14); color: var(--c-primary-text); }
.mlsimport-fchecks { display: flex; flex-direction: column; gap: 11px; }
.mlsimport-fchecks--2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 26px; }
.mlsimport-fchecks--top { margin-top: 22px; }

/* ── Pastel feature card ── */
.mlsimport-fcard { border-radius: var(--radius-lg); padding: 28px 26px; display: flex; flex-direction: column; gap: 14px; color: #1c1917; min-width: 0; height: 100%; }
.mlsimport-fcard__ic { width: 44px; height: 44px; border-radius: 12px; background: rgba(28,25,23,.08); color: #1c1917; display: flex; align-items: center; justify-content: center; }
.mlsimport-fcard__title { font-family: var(--font-heading); font-weight: 600; font-size: 21px; letter-spacing: var(--heading-tracking); line-height: 1.2; }
.mlsimport-fcard__body { margin: 0; font-size: 14.5px; line-height: 1.55; color: rgba(28,25,23,.72); flex: 1; }
.mlsimport-fcard--plain { background: var(--c-surface); border: 1px solid var(--c-border); color: var(--c-text); }
.mlsimport-fcard--plain .mlsimport-fcard__ic { background: var(--c-accent-soft); color: var(--c-accent); }
.mlsimport-fcard--plain .mlsimport-fcard__body { color: var(--c-text-muted); }

.mlsimport-fgrid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 44px; }

/* ── Hero ── */
.mlsimport-fhero { padding: 64px 0 36px; position: relative; overflow: hidden; }
.mlsimport-fhero__blob { position: absolute; top: -40px; right: -6%; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, var(--c-butter), transparent 70%); opacity: .55; z-index: 0; pointer-events: none; }
.mlsimport-fhero .mlsimport-container { position: relative; z-index: 1; }
.mlsimport-fhero .eyebrow { margin-bottom: 20px; }
.mlsimport-fhero__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: clamp(44px, 6.4vw, 84px); line-height: 1.0; letter-spacing: var(--heading-tracking); margin: 0; max-width: 1000px; text-wrap: balance; }
.mlsimport-fhero__lead { font-size: 20px; color: var(--c-text-muted); line-height: 1.5; margin-top: 24px; max-width: 680px; text-wrap: pretty; }
.mlsimport-fhero__cta { margin-top: 30px; display: flex; gap: 12px; flex-wrap: wrap; }
.mlsimport-fhero__cta .btn-pill { padding: 15px 24px; font-size: 15px; }
.mlsimport-fhero__cta .btn-ghost { border: 1px solid var(--c-border); }
.mlsimport-fhero__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 52px; }
.mlsimport-fstat { border-radius: var(--radius-lg); padding: 24px; color: #1c1917; }
.mlsimport-fstat__n { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: 42px; line-height: 1; letter-spacing: var(--heading-tracking); }
.mlsimport-fstat__label { font-size: 13.5px; color: rgba(28,25,23,.72); margin-top: 8px; line-height: 1.4; }

/* ── Pillars ── */
.mlsimport-fpillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 44px; }
.mlsimport-fpillar { display: block; }
.mlsimport-fpillar .mlsimport-fcard { transition: transform .15s ease; }
.mlsimport-fpillar:hover .mlsimport-fcard { transform: translateY(-3px); }

/* ── 2-column split layout ── */
.mlsimport-fsplit { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 56px; }
.mlsimport-fsplit--center { align-items: center; }
.mlsimport-fsplit--img { grid-template-columns: minmax(0,1fr) minmax(0,0.9fr); }
.mlsimport-fsplit--map { grid-template-columns: minmax(0,0.95fr) minmax(0,1fr); }

/* ── Connectivity: provider panel ── */
.mlsimport-fprov { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); padding: 28px 26px; box-shadow: 0 24px 60px -30px rgba(0,0,0,.18); }
.mlsimport-fprov__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.mlsimport-fprov__label { font-size: 13px; font-weight: 600; font-family: var(--font-mono); color: var(--c-text-muted); letter-spacing: .04em; }
.mlsimport-fprov__head .chip { font-size: 11.5px; padding: 4px 10px; }
.mlsimport-fprov__dot { width: 6px; height: 6px; border-radius: 50%; background: #62c554; }
.mlsimport-fprov__list { display: flex; flex-wrap: wrap; gap: 9px; }
.mlsimport-fprov__chip { display: inline-flex; align-items: center; gap: 8px; padding: 11px 15px; border-radius: 999px; background: var(--c-surface-2); color: var(--c-text); border: 1px solid var(--c-border); font-size: 14px; font-weight: 500; }
.mlsimport-fprov__chip svg { color: var(--c-accent); }
.mlsimport-fprov__chip.is-primary { background: var(--c-primary); color: var(--c-primary-text); border-color: transparent; }
.mlsimport-fprov__chip.is-primary svg { color: inherit; }
.mlsimport-fprov__tag { font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-family: var(--font-mono); padding: 2px 6px; border-radius: 4px; background: rgba(255,255,255,.18); }
.mlsimport-fprov__foot { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--c-border); display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--c-text-muted); }
.mlsimport-fprov__foot svg { color: var(--c-accent); flex: 0 0 auto; }

/* ── Setup wizard ── */
.mlsimport-fwiz { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-top: 44px; }
.mlsimport-fwiz__step { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); padding: 22px 18px; display: flex; flex-direction: column; gap: 12px; position: relative; min-height: 168px; }
.mlsimport-fwiz__num { width: 30px; height: 30px; border-radius: 50%; background: var(--c-primary); color: var(--c-primary-text); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; font-family: var(--font-mono); }
.mlsimport-fwiz__title { font-size: 15px; font-weight: 600; letter-spacing: var(--heading-tracking); }
.mlsimport-fwiz__body { font-size: 12.5px; color: var(--c-text-muted); line-height: 1.45; }
.mlsimport-fwiz__arrow { position: absolute; top: 36px; right: -7px; color: var(--c-text-soft); z-index: 1; }

/* ── Import control ── */
.mlsimport-fctrl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 44px; }
.mlsimport-ffilter { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 24px; display: flex; gap: 16px; align-items: flex-start; }
.mlsimport-ffilter__ic { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 11px; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; }
.mlsimport-ffilter__title { font-size: 16px; font-weight: 600; letter-spacing: var(--heading-tracking); }
.mlsimport-ffilter__body { font-size: 13.5px; color: var(--c-text-muted); margin-top: 4px; line-height: 1.45; }
.mlsimport-ftaskbar { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 12px; background: var(--c-butter); border-radius: var(--radius-lg); padding: 22px 26px; align-items: center; color: #1c1917; }
.mlsimport-ftaskbar__lead { font-weight: 600; font-size: 15px; }
.mlsimport-ftaskbar__chip { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; padding: 7px 13px; border-radius: 999px; background: rgba(255,255,255,.55); }
.mlsimport-ftaskbar__chip svg { color: var(--c-accent); }

/* ── Auto-sync note ── */
.mlsimport-fnote { margin-top: 16px; font-size: 13.5px; color: var(--c-text-muted); display: flex; align-items: center; gap: 10px; }
.mlsimport-fnote svg { color: var(--c-accent); flex: 0 0 auto; }

/* ── Images / CDN gallery mock ── */
.mlsimport-fgallery__body { background: var(--c-surface); padding: 14px; }
.mlsimport-fgallery__hero { height: 150px; border-radius: 10px; margin-bottom: 8px; }
.mlsimport-fgallery__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.mlsimport-fgallery__thumb { height: 52px; border-radius: 8px; font-size: 9px; }
.mlsimport-fgallery__foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 11.5px; color: var(--c-text-soft); font-family: var(--font-mono); }

/* ── Field mapping selector mock ── */
.mlsimport-fsel { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); overflow: hidden; box-shadow: 0 24px 60px -30px rgba(0,0,0,.18); }
.mlsimport-fsel__search { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--c-border); }
.mlsimport-fsel__search > svg { color: var(--c-text-soft); flex: 0 0 auto; }
.mlsimport-fsel__ph { font-size: 13px; color: var(--c-text-soft); }
.mlsimport-fsel__spacer { flex: 1; }
.mlsimport-fsel__tab { font-size: 11px; padding: 4px 9px; }
.mlsimport-fsel__tab.is-sel { background: var(--c-accent-soft); color: var(--c-accent); border-color: transparent; }
.mlsimport-fsel__hd { display: grid; grid-template-columns: 20px 1.1fr 1fr 0.9fr; font-size: 11px; font-family: var(--font-mono); color: var(--c-text-soft); padding: 10px 18px; border-bottom: 1px solid var(--c-border); letter-spacing: .03em; }
.mlsimport-fsel__row { display: grid; grid-template-columns: 20px 1.1fr 1fr 0.9fr; align-items: center; padding: 13px 18px; border-bottom: 1px solid var(--c-border); }
.mlsimport-fsel__row.is-last { border-bottom: none; }
.mlsimport-fsel__row.is-off { opacity: .5; }
.mlsimport-fsel__row > svg { color: var(--c-text-soft); cursor: grab; }
.mlsimport-fsel__reso { font-family: var(--font-mono); font-size: 12.5px; color: var(--c-text); }
.mlsimport-fsel__label { font-size: 13.5px; color: var(--c-text-muted); }
.mlsimport-fsel__dest { display: flex; align-items: center; justify-content: space-between; }
.mlsimport-fsel__pill { font-size: 12px; padding: 3px 9px; border-radius: 999px; background: var(--c-surface-2); color: var(--c-text-muted); }
.mlsimport-ftoggle { width: 34px; height: 19px; border-radius: 999px; padding: 2px; background: var(--c-border); display: flex; justify-content: flex-start; flex: 0 0 auto; }
.mlsimport-ftoggle.is-on { background: var(--c-accent); justify-content: flex-end; }
.mlsimport-ftoggle__knob { width: 15px; height: 15px; border-radius: 50%; background: #fff; }

/* ── Standalone front-end ── */
.mlsimport-fstand__group { margin-top: 44px; }
.mlsimport-fstand__group + .mlsimport-fstand__group { margin-top: 36px; }
.mlsimport-fstand__gh { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; }
.mlsimport-fstand__gt { font-size: 17px; font-weight: 600; letter-spacing: var(--heading-tracking); }
.mlsimport-fstand__gs { font-size: 13px; color: var(--c-text-muted); }
.mlsimport-fstand__group .mlsimport-fgrid3 { margin-top: 0; }
.mlsimport-fblocks { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.mlsimport-fblock { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); padding: 16px; display: flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 500; }
.mlsimport-fblock__dot { width: 8px; height: 8px; border-radius: 2px; background: var(--c-accent); flex: 0 0 auto; }
.mlsimport-fstand__info { margin-top: 16px; }
.mlsimport-finfo { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 26px; }
.mlsimport-finfo__title { font-size: 16px; font-weight: 600; letter-spacing: var(--heading-tracking); margin-bottom: 14px; display: flex; align-items: center; gap: 9px; }
.mlsimport-finfo__title svg { color: var(--c-accent); flex: 0 0 auto; }

/* ── Theme support ── */
.mlsimport-fthemes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 44px; }
.mlsimport-ftheme { border-radius: var(--radius-lg); padding: 26px 24px; color: #1c1917; }
.mlsimport-ftheme__name { font-family: var(--font-heading); font-weight: 600; font-size: 22px; letter-spacing: var(--heading-tracking); margin-top: 16px; }
.mlsimport-ftheme__tag { font-size: 13px; color: rgba(28,25,23,.7); margin-top: 6px; }

/* ── Dev & add-ons ── */
.mlsimport-fdev { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.mlsimport-fdev__addon { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); padding: 34px 32px; }
.mlsimport-fdev__dev { background: var(--c-primary); color: var(--c-primary-text); border-radius: var(--radius-xl); padding: 34px 32px; }
.mlsimport-fbadge { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-family: var(--font-mono); color: var(--c-accent); background: var(--c-accent-soft); padding: 5px 11px; border-radius: 999px; margin-bottom: 18px; }
.mlsimport-fbadge--invert { color: var(--c-primary); background: var(--c-primary-text); }
.mlsimport-fdev__eyebrow { margin-bottom: 12px; color: rgba(255,255,255,.55); }
.mlsimport-fdev__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: clamp(28px, 3vw, 38px); line-height: 1.1; letter-spacing: var(--heading-tracking); margin: 0; }

/* ── Roadmap ── */
.mlsimport-froad { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 36px; }
.mlsimport-froad__card { background: var(--c-surface); border: 1px dashed var(--c-border); border-radius: var(--radius-lg); padding: 26px; opacity: .92; }
.mlsimport-froad__tag { display: inline-block; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-family: var(--font-mono); color: var(--c-text-muted); background: var(--c-surface-2); padding: 4px 10px; border-radius: 999px; margin-bottom: 12px; }
.mlsimport-froad__title { font-family: var(--font-heading); font-weight: 600; font-size: 22px; letter-spacing: var(--heading-tracking); }
.mlsimport-froad__body { margin: 10px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--c-text-muted); }

/* ── Features responsive collapses ── */
@media (max-width: 960px) {
  .mlsimport-fhero__stats { grid-template-columns: repeat(2, 1fr); }
  .mlsimport-fpillars, .mlsimport-fctrl, .mlsimport-fgrid3, .mlsimport-fthemes { grid-template-columns: repeat(2, 1fr); }
  .mlsimport-fwiz { grid-template-columns: repeat(3, 1fr); }
  .mlsimport-fblocks { grid-template-columns: repeat(3, 1fr); }
  .mlsimport-fsplit, .mlsimport-fsplit--img, .mlsimport-fsplit--map, .mlsimport-fdev, .mlsimport-froad { grid-template-columns: 1fr; }
  .mlsimport-fsplit--map .mlsimport-fsel { order: 2; }
}
@media (max-width: 640px) {
  .mlsimport-fhero__stats, .mlsimport-fpillars, .mlsimport-fctrl, .mlsimport-fgrid3, .mlsimport-fthemes, .mlsimport-fwiz, .mlsimport-fblocks, .mlsimport-fchecks--2 { grid-template-columns: 1fr; }
  .mlsimport-fwiz__arrow { display: none; }
}

/* ============================================================================
   COMPATIBLE THEMES PAGE — theme compatibility tour (mlsi_compat widget)
   Reuses .mlsimport-fhead / .mlsimport-fcheck / .mlsimport-fsec atoms from the features block.
   ========================================================================== */
.mlsimport-compat { color: var(--c-text); }

/* ── Hero ── */
.mlsimport-cthero { padding: 64px 0 36px; position: relative; overflow: hidden; }
.mlsimport-cthero__blob { position: absolute; top: -60px; right: -4%; width: 480px; height: 480px; border-radius: 50%; background: radial-gradient(circle, var(--c-mint), transparent 70%); opacity: .5; z-index: 0; pointer-events: none; }
.mlsimport-cthero .mlsimport-container { position: relative; z-index: 1; }
.mlsimport-cthero .eyebrow { margin-bottom: 20px; }
.mlsimport-cthero__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: clamp(42px, 6vw, 80px); line-height: 1.01; letter-spacing: var(--heading-tracking); margin: 0; max-width: 980px; text-wrap: balance; }
.mlsimport-cthero__lead { font-size: 20px; color: var(--c-text-muted); line-height: 1.5; margin-top: 24px; max-width: 720px; text-wrap: pretty; }
.mlsimport-cthero__lead em { font-style: italic; }
.mlsimport-cthero__chips { margin-top: 28px; display: flex; gap: 10px; flex-wrap: wrap; }
.mlsimport-ctchip { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: var(--c-surface); color: var(--c-text); border: 1px solid var(--c-border); font-size: 14px; font-weight: 500; }
.mlsimport-ctchip svg { color: var(--c-accent); flex: 0 0 auto; }
.mlsimport-ctchip--accent { background: var(--c-accent-soft); color: var(--c-accent); border-color: transparent; font-weight: 600; }

/* ── Why native ── */
.mlsimport-ctwhy { padding: 56px 0; background: var(--c-surface-2); }
.mlsimport-ctwhy__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 44px; }
.mlsimport-ctw { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 26px 24px; display: flex; flex-direction: column; gap: 14px; }
.mlsimport-ctw__ic { width: 42px; height: 42px; border-radius: 11px; background: var(--c-accent-soft); color: var(--c-accent); display: flex; align-items: center; justify-content: center; }
.mlsimport-ctw__title { font-size: 17px; font-weight: 600; letter-spacing: var(--heading-tracking); line-height: 1.25; }
.mlsimport-ctw__body { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--c-text-muted); }

/* ── Supported themes (pastel cards w/ browser mockups) ── */
.mlsimport-cttgrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-top: 44px; }
.mlsimport-ctcard { border-radius: var(--radius-xl); overflow: hidden; color: #1c1917; display: flex; flex-direction: column; }
.mlsimport-ctcard__mockwrap { padding: 18px; }
.mlsimport-ctmock { background: rgba(255,255,255,.6); border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px -16px rgba(0,0,0,.3); }
.mlsimport-ctmock__bar { display: flex; align-items: center; gap: 5px; padding: 9px 12px; border-bottom: 1px solid rgba(28,25,23,.08); }
.mlsimport-ctmock__dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.mlsimport-ctmock__url { margin-left: 8px; font-size: 11px; font-family: var(--font-mono); color: rgba(28,25,23,.5); }
.mlsimport-ctmock__grid { padding: 12px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; background: #fff; }
.mlsimport-ctlist { border-radius: 8px; overflow: hidden; border: 1px solid rgba(28,25,23,.06); }
.mlsimport-ctlist__img { height: 56px; font-size: 8px; }
.mlsimport-ctlist__meta { padding: 7px 8px; }
.mlsimport-ctlist__price { font-size: 10px; font-weight: 700; }
.mlsimport-ctlist__sub { font-size: 8px; color: rgba(28,25,23,.55); margin-top: 2px; }
.mlsimport-ctcard__body { padding: 6px 26px 28px; display: flex; flex-direction: column; gap: 12px; }
.mlsimport-ctcard__head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mlsimport-ctcard__name { font-family: var(--font-heading); font-weight: 600; font-size: 26px; letter-spacing: var(--heading-tracking); }
.mlsimport-ctcard__tag { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-family: var(--font-mono); color: #1c1917; background: rgba(255,255,255,.6); padding: 4px 10px; border-radius: 999px; }
.mlsimport-ctcard__desc { margin: 0; font-size: 14px; line-height: 1.55; color: rgba(28,25,23,.78); }
.mlsimport-ctcard__points { display: flex; flex-direction: column; gap: 9px; margin-top: 4px; }
.mlsimport-ctcard .mlsimport-fcheck { color: #1c1917; }
.mlsimport-ctcard .mlsimport-fcheck__ic { background: rgba(28,25,23,.1); color: var(--c-accent); }

/* ── Standalone (dark) ── */
.mlsimport-ctstand { padding: 80px 0; background: var(--c-primary); color: var(--c-primary-text); }
.mlsimport-ctstand__head { max-width: 820px; }
.mlsimport-ctstand__eyebrow { margin-bottom: 14px; color: rgba(255,255,255,.55); }
/* Parent-scoped so it outranks the live kit's `.elementor-kit-6077 h2 { color }`,
   which would otherwise paint this dark-section heading near-black. */
.mlsimport-ctstand .mlsimport-ctstand__title { font-family: var(--font-heading); font-weight: var(--font-display-weight); font-size: clamp(34px, 4.4vw, 52px); line-height: 1.06; letter-spacing: var(--heading-tracking); margin: 0; text-wrap: balance; color: inherit; }
.mlsimport-ctstand__lead { font-size: 19px; line-height: 1.55; margin-top: 18px; opacity: .82; max-width: 700px; }
.mlsimport-ctsgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 44px; }
.mlsimport-cts { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-lg); padding: 26px 24px; display: flex; flex-direction: column; gap: 14px; }
.mlsimport-cts__ic { width: 42px; height: 42px; border-radius: 11px; background: var(--c-accent); color: #1c1917; display: flex; align-items: center; justify-content: center; }
.mlsimport-cts__title { font-size: 18px; font-weight: 600; letter-spacing: var(--heading-tracking); }
.mlsimport-cts__body { margin: 0; font-size: 14px; line-height: 1.55; opacity: .8; }
.mlsimport-ctblocks { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; align-items: center; }
.mlsimport-ctblocks__lead { font-size: 13px; opacity: .6; font-family: var(--font-mono); letter-spacing: .04em; }
.mlsimport-ctblock { font-size: 13.5px; padding: 7px 13px; border-radius: 999px; background: rgba(255,255,255,.1); }

/* ── At a glance + theme authors ── */
.mlsimport-ctglance__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 56px; align-items: flex-start; }
.mlsimport-cttable { margin-top: 24px; border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; }
.mlsimport-ctrow { display: flex; align-items: center; gap: 14px; padding: 16px 20px; background: var(--c-surface); border-bottom: 1px solid var(--c-border); }
.mlsimport-ctrow:last-child { border-bottom: none; }
.mlsimport-ctrow.is-accent { background: var(--c-accent-soft); }
.mlsimport-ctrow svg { color: var(--c-accent); flex: 0 0 auto; }
.mlsimport-ctrow__name { font-size: 15px; font-weight: 600; color: var(--c-text); flex: 0 0 auto; min-width: 200px; }
.mlsimport-ctrow__val { font-size: 13.5px; color: var(--c-text-muted); }
.mlsimport-ctauthor { background: var(--c-butter); border-radius: var(--radius-xl); padding: 40px 36px; color: #1c1917; position: relative; overflow: hidden; }
.mlsimport-ctauthor__blob { position: absolute; bottom: -70px; right: -50px; width: 200px; height: 200px; border-radius: 50%; background: rgba(255,255,255,.4); }
.mlsimport-ctauthor__inner { position: relative; }
.mlsimport-ctauthor__eyebrow { margin-bottom: 14px; color: rgba(28,25,23,.6); }
.mlsimport-ctauthor__title { font-family: var(--font-heading); font-weight: 600; font-size: clamp(28px, 3vw, 38px); line-height: 1.1; letter-spacing: var(--heading-tracking); margin: 0; }
.mlsimport-ctauthor__body { font-size: 16px; line-height: 1.6; margin-top: 16px; color: rgba(28,25,23,.78); }
.mlsimport-ctauthor__btn { margin-top: 24px; padding: 14px 24px; font-size: 15px; }

/* ── Compatible-themes responsive collapses ── */
@media (max-width: 960px) {
  .mlsimport-ctwhy__grid { grid-template-columns: repeat(2, 1fr); }
  .mlsimport-cttgrid, .mlsimport-ctsgrid, .mlsimport-ctglance__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .mlsimport-ctwhy__grid { grid-template-columns: 1fr; }
  .mlsimport-ctrow { flex-wrap: wrap; }
  .mlsimport-ctrow__name { min-width: 0; }
}

/* ============================================================================
   WooCommerce — Checkout (block) + Order-received "thank you" (classic),
   restyled to the MLSimport 2026 system: cream page, white cards, coral accent,
   DM Sans, pill buttons, rounded tables. Scoped to the WC body classes so it
   never leaks onto Elementor pages. Block CSS uses single-class rules, so the
   `.body-class .wc-block-*` (0,2,0) selectors win; `!important` only where the
   blocks set it themselves (buttons, inputs, sidebar surface).
   ========================================================================== */

/* ── shared page chrome ──────────────────────────────────────────────────── */
/* One grid for every non-Elementor template. The footer CTA panel sits in a
   1240px container with 32px inline padding, so its content spans 1176px;
   hello-elementor caps `.site-main` at 1140px above 1200px viewport, which left
   cart, checkout, single product and plain pages 36-84px narrow. `main.site-main`
   out-specifies the theme's `body:not([class*=elementor-page-]) .site-main`, and
   putting the gutter here means every child inherits the 1176px column without
   its own padding rule. Elementor pages carry `elementor-page-<id>` on <body>
   and are excluded; the dashboard has no `.site-main` at all. */
body:not([class*="elementor-page-"]) main.site-main {
  max-width: 1240px;
  padding-inline: 32px;
  box-sizing: border-box;
}
/* The theme re-caps the page title at 1140px inside that box. */
body:not([class*="elementor-page-"]) .page-header .entry-title { max-width: none; }
/* The cart ships as an `alignwide` block and the theme pulls those 80px left of
   the gutter, which left the cart off-centre against everything above it. */
.woocommerce-cart .wp-block-woocommerce-cart.alignwide { margin-inline: 0; }

.woocommerce-checkout .page-content,
.woocommerce-order-received .page-content {
  padding: 72px 0 80px;
}
.woocommerce-checkout .entry-title,
.woocommerce-order-received .entry-title {
  margin: 0 0 28px;
  font-family: var(--font-heading);
  font-weight: var(--font-display-weight);
  letter-spacing: var(--heading-tracking);
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1.1;
  color: var(--c-text);
}

/* ── checkout: branded page header (replaces the plain "Checkout" title) ──── */
.woocommerce-checkout .mlsimport-cohead {
  margin: 0 0 34px;
}
.woocommerce-checkout .mlsimport-cohead__title {
  margin: 0 0 10px;
  font-family: var(--font-heading);
  font-weight: var(--font-display-weight);
  letter-spacing: var(--heading-tracking);
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1.1;
  color: var(--c-text);
}
.woocommerce-checkout .mlsimport-cohead__sub {
  margin: 0;
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.5;
  color: var(--c-text-muted);
}
.woocommerce-checkout .mlsimport-cohead__note {
  margin: 18px 0 0;
  padding: 14px 18px;
  border: 1px solid var(--c-border);
  border-left: 3px solid var(--c-accent);
  border-radius: var(--radius-md);
  background: var(--c-surface);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
  color: var(--c-text-muted);
}
.woocommerce-checkout a,
.woocommerce-order-received a { color: var(--c-accent); }
.woocommerce-checkout a:hover,
.woocommerce-order-received a:hover { text-decoration: underline; }

/* ── checkout: form steps as white cards ─────────────────────────────────── */
.woocommerce-checkout .wc-block-checkout { max-width: none; margin: 0; }
.woocommerce-checkout .wc-block-components-checkout-step {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius-md);
  padding: 26px 28px !important;
  margin-bottom: 18px;
}
.woocommerce-checkout .wc-block-components-checkout-step::after { display: none; } /* kill default divider line */
.woocommerce-checkout .wc-block-components-checkout-step__title,
.woocommerce-checkout .wc-block-components-title {
  font-family: var(--font-heading) !important;
  font-weight: 600 !important;
  letter-spacing: var(--heading-tracking);
  color: var(--c-text) !important;
}
.woocommerce-checkout .wc-block-components-checkout-step__description {
  color: var(--c-text-muted);
}

/* inputs + selects */
.woocommerce-checkout .wc-block-components-text-input input,
.woocommerce-checkout .wc-block-components-textarea,
.woocommerce-checkout .wc-blocks-components-select__select {
  border-radius: var(--radius-sm) !important;
  border: 1px solid var(--c-border) !important;
  background: var(--c-surface) !important;
  font-family: var(--font-body) !important;
  color: var(--c-text) !important;
}
/* The focus ring belongs to the control only. The floating <label> was in this
   selector list too, which painted a 3px coral box around every filled field's
   label (blocks add `.is-active` as soon as a value exists). */
.woocommerce-checkout .wc-block-components-text-input input:focus,
.woocommerce-checkout .wc-block-components-textarea:focus,
.woocommerce-checkout .wc-blocks-components-select__select:focus {
  border-color: var(--c-accent) !important;
  box-shadow: 0 0 0 3px var(--c-accent-soft) !important;
  outline: none !important;
}
/* Floated label = small muted caption sitting above the value, never a box. */
.woocommerce-checkout .wc-block-components-text-input label {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.woocommerce-checkout .wc-block-components-text-input.is-active label {
  color: var(--c-text-muted) !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
}
/* Coral only while the field is actually focused. */
.woocommerce-checkout .wc-block-components-text-input input:focus + label {
  color: var(--c-accent) !important;
}

/* ── checkout: order summary sidebar → elevated white card ───────────────── */
.woocommerce-checkout .wc-block-checkout__sidebar {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  padding: 26px 28px;
  box-shadow: 0 24px 60px -28px rgba(0,0,0,.18);
}
.woocommerce-checkout .wc-block-components-totals-item__label { color: var(--c-text-muted); }
.woocommerce-checkout .wc-block-components-totals-footer-item {
  font-family: var(--font-heading);
  font-weight: 600;
  color: var(--c-text);
}
.woocommerce-checkout .wc-block-components-product-price__value,
.woocommerce-checkout .wc-block-components-totals-item__value { color: var(--c-text); }

/* place-order button → dark pill */
.woocommerce-checkout .wc-block-components-checkout-place-order-button {
  background: var(--c-primary) !important;
  color: var(--c-primary-text) !important;
  border-radius: 999px !important;
  border: none !important;
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  padding: 16px 26px !important;
  transition: transform .16s cubic-bezier(.34,1.56,.64,1), box-shadow .18s ease;
}
.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -10px rgba(0,0,0,.45) !important;
}

/* notices */
.woocommerce-checkout .wc-block-components-notice-banner { border-radius: var(--radius-sm); }

/* ── thank you: same grid as the Elementor sections ──────────────────────── */
/* Width comes from the shared `main.site-main` rule above; only the 880px
   column the classic template asks for has to be dropped. */
.woocommerce-order-received .woocommerce { max-width: none; margin: 0; }
/* The title is above `.page-content`, so move that block's top space onto the
   header — otherwise the h1 hugs the nav and floats away from the order card. */
.woocommerce-order-received .page-header { padding-block-start: 72px; }
.woocommerce-order-received .page-content { padding-block-start: 0; }
.woocommerce-order-received .woocommerce-thankyou-order-received,
.woocommerce-order-received .woocommerce-notice--success {
  background: var(--c-accent-soft);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-md);
  padding: 16px 22px;
  margin-bottom: 26px;
  font-weight: 500;
  color: var(--c-text);
}

/* order overview (number / date / total) → single card row */
.woocommerce-order-overview.order_details {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 14px 36px;
  margin: 0 0 30px;
  padding: 22px 26px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-md);
}
.woocommerce-order-overview.order_details li {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--c-text-soft);
  flex: 0 0 auto;
}
.woocommerce-order-overview.order_details li strong {
  display: block;
  margin-top: 5px;
  font-size: 16px;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  color: var(--c-text);
}

/* section titles */
.woocommerce-order-received .woocommerce-order-details__title,
.woocommerce-order-received .woocommerce-column__title {
  font-family: var(--font-heading);
  font-weight: 600;
  letter-spacing: var(--heading-tracking);
  color: var(--c-text);
  margin-bottom: 14px;
}

/* order details table → rounded card */
.woocommerce-order-received .woocommerce-table--order-details {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 36px;
  background: var(--c-surface);
}
.woocommerce-order-received .woocommerce-table--order-details th,
.woocommerce-order-received .woocommerce-table--order-details td {
  padding: 14px 18px;
  border: none;
  border-bottom: 1px solid var(--c-border);
  text-align: left;
}
.woocommerce-order-received .woocommerce-table--order-details td.woocommerce-table__product-total,
.woocommerce-order-received .woocommerce-table--order-details th.woocommerce-table__product-total,
.woocommerce-order-received .woocommerce-table--order-details tfoot td { text-align: right; }
.woocommerce-order-received .woocommerce-table--order-details thead th {
  background: var(--c-surface-2);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--c-text-muted);
  font-weight: 600;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-order-received .woocommerce-table--order-details tfoot tr:last-child td {
  border-bottom: none;
  font-family: var(--font-heading);
  font-weight: 600;
  color: var(--c-text);
}

/* billing address card */
.woocommerce-order-received .woocommerce-customer-details address {
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius-md);
  padding: 20px 24px;
  background: var(--c-surface);
  font-style: normal;
  line-height: 1.7;
  color: var(--c-text-muted);
}

@media (max-width: 980px) {
  .woocommerce-checkout .wc-block-components-checkout-step { padding: 20px 20px; }
}

/* ============================================================================
   CRMLS PAGE (/california-regional-mls/) — built by build-mlsimport-california-regional-mls.php
   Reuses gml-* skins; crm-* are page variants.
   ========================================================================== */
.mlsimport-visual-slot {
  border: 2px dashed var(--c-border); border-radius: var(--radius-lg);
  background: var(--c-surface); min-height: 440px;
  display: flex; align-items: center; justify-content: center;
}
.mlsimport-visual-slot::after {
  content: "VISUAL SLOT"; font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.14em; color: var(--c-text-soft);
}
/* TOC chip strip */
.elementor-widget.crm-toc, .crm-toc { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.crm-toc .elementor-widget-container, .crm-toc p { display: contents; }
.crm-toc__label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-text-soft); margin-right: 6px; }
.crm-toc a.chip { text-decoration: none; color: var(--c-text); }
.crm-toc a.chip:hover { border-color: var(--c-accent); color: var(--c-accent); }
/* linked card titles + linked section heading keep heading color */
.crm-scard__title a, .crm-h2link a { color: inherit; text-decoration: none; }
.crm-scard__title a:hover, .crm-h2link a:hover { color: var(--c-accent); }
/* two-column prose */
.crm-cols { display: grid !important; grid-template-columns: 1fr 1fr; align-items: start; }
.crm-col { display: flex; flex-direction: column; gap: 14px; }
.crm-pull .elementor-widget-container, .crm-pull {
  background: var(--c-accent-soft); border-radius: var(--radius-md);
  padding: 18px 20px; font-weight: 500;
}
/* quote paragraph */
.crm-quote .elementor-widget-container, .crm-quote {
  border-left: 3px solid var(--c-accent); background: var(--c-surface);
  border-radius: 0 var(--radius-md) var(--radius-md) 0; padding: 20px 24px;
}
/* setup step cards: 5-up row */
.crm-steps__grid { display: grid !important; grid-template-columns: repeat(5, 1fr); }
/* in-practice grid */
.crm-prac__grid { display: grid !important; grid-template-columns: 1.1fr 0.9fr; align-items: center; }
.crm-prac__left { display: flex; flex-direction: column; gap: 14px; }
/* FAQ cards */
/* closing CTA band */
.crm-after { margin-top: 8px; }
@media (max-width: 1024px) {
  .crm-steps__grid { grid-template-columns: repeat(2, 1fr); }
  .crm-cols, .crm-prac__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .crm-steps__grid { grid-template-columns: 1fr; }
}
/* CRMLS v2 polish */
.gml-hero__grid .mlsimport-visual-slot { align-self: stretch; height: auto; }
.crm-introlead .elementor-widget-container, .crm-introlead { max-width: 880px; }
.crm-reso__card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); display: grid !important; grid-template-columns: 1.05fr 0.95fr; align-items: center; }
.crm-reso__panel { background: var(--c-surface-2); border-radius: var(--radius-md); }
@media (max-width: 1024px) { .crm-reso__card { grid-template-columns: 1fr; } }
/* CRMLS v3 fixes (from close-up inspection) */
.mlsimport-visual-slot { align-items: center !important; justify-content: center !important; }
.mlsimport-visual-slot::after { margin: auto; }
/* FAQ answers may contain inline links (wp_kses-allowed) */
.faq-answer a { color: var(--c-accent); text-decoration: underline; }
/* Coverage pill groups: 3-up row (CRMLS lists are short — 6/4/2 — so two Georgia-style
   columns leave dead space; base .gml-cov__cols 2-col is overridden here) */
.crm-cov__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .crm-cov__cols { grid-template-columns: 1fr; } }

/* ==== BRIGHT-MLS PAGE ==== */
/* Four fee tiers on this page — widen the tiers grid from the widget's 3 columns. */
.brt-tiers .mlsimport-elementor-tiers { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1024px) {
  .brt-tiers .mlsimport-elementor-tiers { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .brt-tiers .mlsimport-elementor-tiers { grid-template-columns: 1fr; }
}

/* brt: equal-height colored tier headers (longest label wraps to 3 lines). */
.brt-tiers .mlsimport-elementor-tier__who { display: flex; align-items: center; min-height: 114px; }
@media (max-width: 1024px) {
  .brt-tiers .mlsimport-elementor-tier__who { min-height: 88px; }
}
@media (max-width: 640px) {
  .brt-tiers .mlsimport-elementor-tier__who { min-height: 0; }
}
/* brt: stats→region-cards and tiers→billing are one continuous zone — collapse
   the doubled 64px section padding between them. */
.brt-covstats .mlsimport-elementor-sec { padding-bottom: 12px; }
.brt-covmap .mlsimport-elementor-sec { padding-top: 12px; }
.brt-tiers .mlsimport-elementor-sec { padding-bottom: 12px; }
.brt-billing .mlsimport-elementor-sec { padding-top: 12px; }

/* Visual slot with an embedded interactive map (bare mode): drop the
   placeholder chrome and let the map fill the whole slot. */
.mlsimport-visual-slot:has(.mlsimport-elementor-mlsimport-map__module) { border: 0; background: transparent; }
.mlsimport-visual-slot:has(.mlsimport-elementor-mlsimport-map__module)::after { display: none; }
.mlsimport-visual-slot > .elementor-element { width: 100%; height: 100%; }
.mlsimport-visual-slot .elementor-widget-container { width: 100%; height: 100%; }
.mlsimport-visual-slot .mlsimport-elementor-sec { padding: 0; width: 100%; height: 100%; }
.mlsimport-visual-slot .mlsimport-elementor-wrap { max-width: none; padding: 0; height: 100%; }
.mlsimport-visual-slot .mlsimport-elementor-mlsimport-map__module { max-width: none; height: 100%; display: flex; flex-direction: column; }
.mlsimport-visual-slot .mlsimport-elementor-mlsimport-map__canvas { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mlsimport-visual-slot .mlsimport-elementor-mlsimport-map__stage { flex: 1; min-height: 0; }
.mlsimport-visual-slot .mlsimport-elementor-mlsimport-map__stage svg { height: 100%; }
.mlsimport-visual-slot .mlsimport-elementor-mlsimport-map__legend { justify-content: center; margin-top: 10px; }

/* ==== MLS-PIN PAGE ==== */
/* pin: coverage stats→prose and the three fee widgets are continuous zones —
   collapse the doubled 64px section padding between them (brt pattern). */
.pin-cov1 .mlsimport-elementor-sec { padding-bottom: 12px; }
.pin-cov2 .mlsimport-elementor-sec { padding-top: 12px; }
.pin-fees1 .mlsimport-elementor-sec { padding-bottom: 12px; }
.pin-fees2 .mlsimport-elementor-sec { padding-top: 12px; padding-bottom: 12px; }
.pin-fees3 .mlsimport-elementor-sec { padding-top: 12px; }
/* pin: Data Services group has 2 tiers — 2-col grid instead of the default 3. */
.pin-fees3 .mlsimport-elementor-tiers { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 640px) {
  .pin-fees3 .mlsimport-elementor-tiers { grid-template-columns: 1fr; }
}

/* ==== BLOG CONTENT SHORTCODES ==== */
/* Legacy class names from the old hello-mlsimport theme (see inc/shortcodes.php)
   — 45 published posts embed them, and custom CSS may target them, so the names
   are kept while the styling is re-cut in 2026 tokens. */

/* pro tip — hairline-ruled aside, mint accent like .mlsimport-callout */
.mlsimport_pro_tip_wrapper {
  margin: 32px 0;
  padding: 22px 26px;
  background: var(--c-mint);
  border-radius: var(--radius-md);
  border-left: 3px solid var(--c-accent);
}
.mlsimport_pro_tip_title {
  font-family: var(--font-heading);
  font-weight: var(--font-display-weight);
  font-size: 19px;
  line-height: 1.25;
  letter-spacing: var(--heading-tracking);
  color: var(--c-text);
  margin-bottom: 8px;
}
.mlsimport_pro_tip_content { font-size: 16.5px; line-height: 1.6; color: var(--c-text); }
.mlsimport_pro_tip_content p:first-child { margin-top: 0; }
.mlsimport_pro_tip_content p:last-child { margin-bottom: 0; }

/* call out — plain surface card */
.mlsimport_callout_wrapper {
  margin: 32px 0;
  padding: 24px 26px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-md);
}
.mlsimport_callout_wrapper_title {
  font-family: var(--font-heading);
  font-weight: var(--font-display-weight);
  font-size: 19px;
  line-height: 1.25;
  letter-spacing: var(--heading-tracking);
  color: var(--c-text);
  margin-bottom: 8px;
}
.mlsimport_callout_wrapper_content { font-size: 16.5px; line-height: 1.6; color: var(--c-text); }
.mlsimport_callout_wrapper_content p:first-child { margin-top: 0; }
.mlsimport_callout_wrapper_content p:last-child { margin-bottom: 0; }

/* related post — thumbnail + link row between hairlines */
.mlsimport_related_post_wrapper {
  display: flex;
  align-items: center;
  gap: 22px;
  margin: 32px 0;
  padding: 20px 0;
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
}
.mlsimport_related_post_image {
  width: 116px;
  height: 68px;
  flex: 0 0 116px;
  border-radius: var(--radius-sm);
  background-color: var(--c-surface-2);
  background-position: center;
  background-size: cover;
}
.mlsimport_related_post_content_wrapper { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.mlsimport_related_post_title {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--c-text-soft);
}
.mlsimport_related_post_content a {
  font-family: var(--font-heading);
  font-size: 19px;
  font-weight: var(--font-display-weight);
  line-height: 1.25;
  letter-spacing: var(--heading-tracking);
  color: var(--c-text);
  text-decoration: none;
}
.mlsimport_related_post_content a:hover { color: var(--c-accent); }

/* action button — design-system pill */
.mlsimport_action_button_wrapper { width: 100%; text-align: center; margin: 32px 0; }
.mlsimport_action_button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 34px;
  background: var(--c-primary);
  color: var(--c-primary-text) !important;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  transition: background 0.18s ease, transform 0.18s ease;
}
.mlsimport_action_button:hover { background: var(--c-accent); transform: translateY(-1px); }

/* offer presentation — card with a hero shot plus up to three thumbnails */
.mlsimport_offer_presentation_wrapper {
  margin: 40px 0;
  padding: 30px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
}
.mlsimport_offer_presentation_title {
  font-family: var(--font-heading);
  font-weight: var(--font-display-weight);
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: var(--heading-tracking);
  color: var(--c-text);
  margin-bottom: 12px;
}
.mlsimport_offer_presentation_content { font-size: 16.5px; line-height: 1.6; color: var(--c-text-muted); margin-bottom: 22px; }
.mlsimport_offer_presentation_content p:first-child { margin-top: 0; }
.mlsimport_offer_presentation_image_wrapper { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; }
.mlsimport_offer_presentation_image_wrapper img {
  border-radius: var(--radius-sm);
  border: 1px solid var(--c-border);
  transition: border-color 0.18s ease, transform 0.18s ease;
}
.mlsimport_offer_presentation_image_wrapper a:hover img { border-color: var(--c-accent); transform: translateY(-2px); }
.mlsimport_present_image_small { max-width: 185px !important; }
.mlsimport_offer_presentation_wrapper .mlsimport_action_button_wrapper { margin: 24px 0 0; }
.mlsimport_offer_presentation_wrapper .mlsimport_action_button { margin: 0; padding: 12px 30px; }

/* call to action — full-width panel, also used inside sticky sidebar columns */
.wpstream_call_to_action_form {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 32px 0;
  padding: 32px 30px;
  background: var(--c-butter);
  border-radius: var(--radius-lg);
  text-align: center;
}
.wpstream_call_to_action_form_back { display: none; } /* legacy decorative layer, unused */
.wpstream_call_to_action_title {
  font-family: var(--font-heading);
  font-weight: var(--font-display-weight);
  font-size: 27px;
  line-height: 1.15;
  letter-spacing: var(--heading-tracking);
  color: var(--c-text);
  margin-bottom: 12px;
}
.wpstream_call_to_action_content { font-size: 16.5px; line-height: 1.55; color: var(--c-text); margin-bottom: 22px; }
.wpstream_call_to_action_button { margin: 0; }
.wpstream_call_to_action_exp { margin-top: 12px; font-size: 13px; line-height: 1.35; color: var(--c-text-muted); }
.wpstream_sticky-column > .elementor-widget-wrap { position: sticky; top: 150px; }

@media (max-width: 700px) {
  .mlsimport_related_post_wrapper { flex-direction: column; align-items: flex-start; gap: 14px; }
  .mlsimport_related_post_image { width: 100%; flex: 0 0 auto; height: 160px; }
  .mlsimport_offer_presentation_image_wrapper { justify-content: center; }
  .mlsimport_present_image_small { max-width: 46% !important; }
  .wpstream_call_to_action_title { font-size: 23px; }
}
