/*
Theme Name: Mortgagefy
Theme URI: https://mortgagefy.ca
Author: Mortgagefy
Version: 3.0.0
*/

/*
 * ──────────────────────────────────────────────────────────────
 * POST-LAUNCH CSS CLEANUP ROADMAP
 * ──────────────────────────────────────────────────────────────
 * This stylesheet currently contains ~4,700 lines with ~2,000
 * !important overrides. It works but makes future changes risky.
 *
 * Recommended steps (do NOT attempt before launch):
 *
 * 1. Run PurgeCSS against the live site to identify unused rules.
 * 2. Consolidate duplicate selectors — e.g. .section-lenders is
 *    defined 4 separate times with conflicting values.
 * 3. Reduce !important usage by increasing selector specificity
 *    or reordering rules so later declarations win naturally.
 * 4. Merge the footer newsletter styles (defined in 5 places)
 *    into a single block.
 * 5. Target: under 2,000 lines of clean, maintainable CSS.
 * ──────────────────────────────────────────────────────────────
 */

/* ============================================================
   GOOGLE FONTS
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800;900&display=swap');

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root {
  --blue:          #044dd6;
  --blue-dark:     #0340b0;
  --blue-tint:     #eff7ff;
  --blue-accent:   #b2c5ff;
  --blue-footer:   #0432a8;
  --white:         #ffffff;
  --black:         #0d0d1a;
  --text:          #374151;
  --muted:         #6b7280;
  --border:        #e5e9f0;
  --bg-light:      #f7f9fe;
  --gold:          #f59e0b;

  --font:          'DM Sans', sans-serif;
  --font-display:  'Outfit', sans-serif;
  --font-body:     'Plus Jakarta Sans', sans-serif;

  --container:     1200px;
  --pad:           clamp(16px, 2.5vw, 32px);
  --section-y:     80px;

  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-xl:   20px;

  /* Standard breakpoints (for reference — CSS vars can't be used in @media)
     --bp-sm:  480px    Mobile landscape
     --bp-md:  768px    Tablet
     --bp-lg:  1024px   Desktop
     --bp-xl:  1280px   Wide desktop
  */

  /* Z-index scale */
  --z-dropdown:    100;
  --z-sticky:      200;
  --z-header:      500;
  --z-overlay:     900;
  --z-modal:       1000;
  --z-mobile-cta:  9999;
  --z-exit-popup:  99999;
  --r-2xl:  24px;

  --shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 4px 16px rgba(4,77,214,.10);
  --shadow-lg: 0 8px 32px rgba(4,77,214,.14);
  --ease: cubic-bezier(.4,0,.2,1);
}

/* ============================================================
   RESET
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; overflow-x: hidden; }
body {
  font-family: var(--font);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  color: var(--text);
  background: #f0f2f7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input, textarea, select { font-family: inherit; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font);
  color: var(--black);
  -webkit-font-smoothing: antialiased;
}
h1 { font-size: clamp(38px, 4.5vw, 60px); font-weight: 800; line-height: 1.08; letter-spacing: -.03em; }
h2 { font-size: clamp(28px, 3.2vw, 46px); font-weight: 700; line-height: 1.15; letter-spacing: -.025em; }
h3 { font-size: clamp(18px, 2vw, 26px); font-weight: 700; line-height: 1.3; letter-spacing: -.015em; }
h4 { font-size: clamp(16px, 1.5vw, 20px); font-weight: 600; line-height: 1.4; }
p  { font-size: 15px; line-height: 1.75; color: var(--muted); }

.accent-label {
  display: inline-flex;
  align-items: center;
  padding: 5px 14px;
  border-radius: 100px;
  background: var(--blue-tint);
  border: 1px solid var(--blue-accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--blue);
  white-space: nowrap;
  width: fit-content;
}

/* ============================================================
   LAYOUT
   ============================================================ */
.container {
  width: 100%;
  max-width: calc(var(--container) + var(--pad) * 2);
  margin: 0 auto;
  padding: 0 var(--pad);
}
.section { padding: var(--section-y) 0; }
.section--light { background: var(--bg-light); }
.section--blue  { background: var(--blue); }
.section--white { background: var(--white); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 28px;
  border-radius: var(--r-md);
  font-family: var(--font);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.01em;
  border: 2px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: all .2s var(--ease);
  -webkit-font-smoothing: antialiased;
}
.btn--lg { padding: 15px 36px; font-size: 16px; border-radius: var(--r-lg); }
.btn--sm { padding: 9px 18px;  font-size: 13px; border-radius: var(--r-sm); }

.btn--primary {
  background: var(--blue);
  color: var(--white);
  border-color: var(--blue);
  box-shadow: 0 2px 8px rgba(4,77,214,.28);
}
.btn--primary:hover {
  background: var(--blue-dark);
  border-color: var(--blue-dark);
  box-shadow: 0 6px 20px rgba(4,77,214,.36);
  transform: translateY(-1px);
}
.btn--outline {
  background: transparent;
  color: var(--blue);
  border-color: var(--blue);
}
.btn--outline:hover { background: var(--blue); color: var(--white); }

.btn--white {
  background: var(--white);
  color: var(--blue);
  border-color: var(--white);
  box-shadow: 0 2px 12px rgba(0,0,0,.12);
}
.btn--white:hover { background: var(--blue-tint); box-shadow: 0 4px 20px rgba(0,0,0,.16); }

.btn--ghost {
  background: rgba(255,255,255,.1);
  color: var(--white);
  border-color: rgba(255,255,255,.4);
}
.btn--ghost:hover { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.65); }

/* ============================================================
   TOP BAR
   ============================================================ */
.top-bar {
  background: #0336b5;
  padding: 9px 0;
}
.top-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.top-bar__brand { font-size: 11px; font-weight: 400; color: rgba(255,255,255,.7); letter-spacing: .01em; }
.top-bar__links { display: flex; align-items: center; gap: 20px; }
.top-bar__links a {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 500; color: var(--white);
  transition: opacity .2s;
}
.top-bar__links a:hover { opacity: .8; }

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255,255,255,.97);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: none;
  box-shadow: 0 2px 16px rgba(0,0,0,.06);
  transition: box-shadow .2s;
}
.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
  gap: 32px;
}
.header__logo-text {
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 800;
  color: var(--blue);
  letter-spacing: -.025em;
}
.header__logo img { height: 44px; width: auto; }
.header__nav { display: flex; align-items: center; gap: 2px; }
.header__nav a {
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
  border-radius: var(--r-sm);
  transition: all .2s;
}
.header__nav a:hover, .header__nav a.active { color: var(--blue); background: var(--blue-tint); }
.header__cta { display: flex; align-items: center; gap: 10px; }
.hamburger { display: none; flex-direction: column; gap: 5px; padding: 8px; cursor: pointer; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--text); border-radius: 2px; transition: all .2s; }
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* Mobile Nav */
.mobile-nav { display: none; position: fixed; inset: 0; z-index: 200; background: var(--white); flex-direction: column; padding: 24px; overflow-y: auto; }
.mobile-nav.open { display: flex; }
.mobile-nav__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 32px; padding-bottom: 20px; border-bottom: 1px solid var(--border); }
.mobile-nav__close { font-size: 22px; color: var(--text); background: none; border: none; cursor: pointer; padding: 4px; }
.mobile-nav__links { display: flex; flex-direction: column; gap: 2px; }
.mobile-nav__links a { padding: 14px 16px; font-size: 17px; font-weight: 500; color: var(--text); border-radius: var(--r-sm); border-bottom: 1px solid var(--border); transition: all .2s; }
.mobile-nav__links a:hover { color: var(--blue); background: var(--blue-tint); padding-left: 22px; }

/* ============================================================
   HERO
   ============================================================ */
.section-hero { padding: 72px 0 64px; background: var(--white); overflow: hidden; position: relative; }
/* Hero blob removed */
.section-hero__inner { display: grid; grid-template-columns: 1fr .9fr; gap: 56px; align-items: center; }
.section-hero__content { display: flex; flex-direction: column; gap: 20px; align-items: flex-start; }
.section-hero__title { color: var(--black) !important; }
.section-hero__title span { color: var(--blue); }
.section-hero__subtitle { font-size: 17px; font-weight: 400; color: var(--muted); line-height: 1.7; max-width: 480px; }
.section-hero__actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.section-hero__trust {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  background: #f8fafe;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.section-hero__trust-stars { color: var(--gold); font-size: 15px; letter-spacing: 1px; }
.section-hero__trust-text { font-size: 13px; color: var(--muted); }
.section-hero__trust-text strong { color: var(--text); font-weight: 600; }

/* Hero visual */
.section-hero__image {
  background: linear-gradient(135deg, #e8efff 0%, #b2c5ff 45%, #3a6be6 100%);
  border-radius: var(--r-2xl);
  overflow: hidden;
  min-height: 440px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.section-hero__image::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 35% 50%, rgba(255,255,255,.35) 0%, transparent 55%),
              radial-gradient(circle at 80% 20%, rgba(4,77,214,.25) 0%, transparent 40%);
}
.section-hero__visual { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 40px; text-align: center; }
.section-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 18px;
  border-radius: 100px;
  background: rgba(255,255,255,.92);
  font-size: 13px;
  font-weight: 600;
  color: var(--blue);
  box-shadow: 0 4px 16px rgba(4,77,214,.15);
  backdrop-filter: blur(4px);
}
.section-hero__stats-row { display: flex; gap: 12px; }
.section-hero__stat {
  background: var(--white);
  border-radius: var(--r-lg);
  padding: 18px 24px;
  text-align: center;
  box-shadow: 0 4px 20px rgba(4,77,214,.14);
  min-width: 130px;
}
.section-hero__stat-num { font-family: var(--font-display); font-size: 46px; font-weight: 800; color: var(--blue); line-height: 1; letter-spacing: -.03em; display: block; }
.section-hero__stat-label { font-size: 12px; font-weight: 500; color: var(--muted); margin-top: 4px; display: block; }

/* ============================================================
   LENDER BAR
   ============================================================ */
.section-logos { padding: 18px 0; background: var(--white); border-top: 1px solid #eef0f5; border-bottom: 1px solid #eef0f5; }
.section-logos__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.section-logos__label { font-size: 10px; font-weight: 700; letter-spacing: .1em; color: #bbb; text-transform: uppercase; white-space: nowrap; }
.section-logos__list { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.section-logos__list span { font-size: 13px; font-weight: 700; color: #c5cad4; letter-spacing: -.01em; transition: color .2s; cursor: default; }
.section-logos__list span:hover { color: var(--blue); }

/* ============================================================
   INTRO / EDITORS
   ============================================================ */
.section-editors { padding: var(--section-y) 0; background: var(--white); }
.section-editors__inner { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(48px, 8vw, 110px); align-items: start; }
.section-editors__col { display: flex; flex-direction: column; gap: 16px; }
.section-editors__col h2 { color: var(--black); margin-top: 0; }
.section-editors__col > p { font-size: 16px; color: var(--muted); line-height: 1.8; }
.section-editors__list { display: flex; flex-direction: column; margin-top: 4px; }
.section-editors__item { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--border); font-size: 15px; font-weight: 500; color: var(--text); }
.section-editors__item:last-child { border-bottom: none; }
.section-editors__check { width: 22px; height: 22px; border-radius: 50%; background: var(--blue-tint); border: 1px solid var(--blue-accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 10px; font-weight: 700; color: var(--blue); }

/* ============================================================
   SERVICES TABS
   ============================================================ */
.section-tabs { padding: var(--section-y) 0; background: var(--bg-light); }
.section-tabs__header { text-align: center; margin-bottom: 36px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.section-tabs__header h2 { color: var(--black); }
.tabs-nav { display: flex; align-items: flex-end; gap: 0; flex-wrap: wrap; margin-bottom: 32px; border-bottom: 2px solid var(--border); }
.tabs-nav__btn { padding: 10px 16px; font-size: 13px; font-weight: 500; color: var(--muted); border-radius: var(--r-sm) var(--r-sm) 0 0; cursor: pointer; transition: all .2s; background: none; font-family: var(--font); border: none; position: relative; bottom: -2px; border-bottom: 2px solid transparent; }
.tabs-nav__btn:hover { color: var(--text); }
.tabs-nav__btn.active { color: var(--blue); font-weight: 700; border-bottom-color: var(--blue); }
.tabs-content__panel { display: none; }
.tabs-content__panel.active { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; animation: fadeUp .25s var(--ease); }
@keyframes fadeUp { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
.tabs-content__left { display: flex; flex-direction: column; gap: 12px; }
.tabs-content__stat { font-family: var(--font-display); font-size: clamp(72px, 10vw, 108px); font-weight: 800; color: var(--blue); line-height: .95; letter-spacing: -.04em; }
.tabs-content__stat-text { font-size: 14px; color: var(--muted); font-weight: 400; line-height: 1.5; max-width: 260px; }
.tabs-content__body h3 { font-size: 22px; font-weight: 700; color: var(--black); margin-bottom: 8px; }
.tabs-content__body p { font-size: 15px; color: var(--muted); line-height: 1.8; margin-bottom: 20px; }
.tabs-content__body .btn { width: auto !important; display: inline-flex !important; align-self: flex-start; }
.tabs-content__image img { width: 100%; height: 360px; object-fit: cover; border-radius: var(--r-xl); box-shadow: var(--shadow-lg); }
.tabs-content__image-placeholder { width: 100%; height: 360px; background: linear-gradient(135deg, var(--blue-tint) 0%, #c9d9ff 60%, rgba(4,77,214,.15) 100%); border-radius: var(--r-xl); display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; color: #5572ce; box-shadow: var(--shadow-md); position: relative; overflow: hidden; }
.tabs-content__image-placeholder::before { content: ''; position: absolute; top: -60px; right: -60px; width: 200px; height: 200px; border-radius: 50%; background: rgba(4,77,214,.1); }
.tabs-content__image-placeholder::after  { content: ''; position: absolute; bottom: -50px; left: -50px; width: 180px; height: 180px; border-radius: 50%; background: rgba(4,77,214,.07); }

/* ============================================================
   CTA SECTION
   ============================================================ */
.section-cta { padding: 72px 0; background: var(--blue); }
.section-cta__inner { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 18px; }
.section-cta__inner .accent-label { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.28); color: rgba(255,255,255,.92); }
.section-cta__inner h2 { font-size: clamp(30px, 3.5vw, 46px); font-weight: 800; color: var(--white) !important; letter-spacing: -.03em; }
.section-cta__inner p { font-size: 16px; color: rgba(255,255,255,.8); max-width: 560px; line-height: 1.7; }
.section-cta__actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-top: 6px; }
.section-cta .btn--white { background: var(--white); color: var(--blue); border-color: var(--white); border-radius: var(--r-md) !important; box-shadow: 0 2px 12px rgba(0,0,0,.1); }
.section-cta .btn--white:hover { background: var(--blue-tint); }
.section-cta .btn--ghost { background: transparent; color: var(--white); border-color: rgba(255,255,255,.4); border-radius: var(--r-md) !important; }
.section-cta .btn--ghost:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.65); }

/* ============================================================
   RATES & CALCULATOR
   ============================================================ */
.section-rates { padding: var(--section-y) 0; background: var(--white); }
.section-rates > .container > div[style] { margin-bottom: 44px; }
.section-rates > .container > div[style] h2 { color: var(--black); }
.section-rates > .container > div[style] p { color: var(--muted); }
.section-rates__inner { display: grid; grid-template-columns: 1fr 1.15fr; gap: 48px; align-items: center; }
.rates-table { width: 100%; border-collapse: collapse; border: 1px solid var(--border); border-radius: var(--r-lg); overflow: hidden; }
.rates-table thead tr { background: #f4f6fb; }
.rates-table th { text-align: left; padding: 13px 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); border-bottom: 2px solid var(--border); }
.rates-table td { padding: 13px 20px; font-size: 15px; border-bottom: 1px solid #f0f2f7; color: var(--text); transition: background .15s; }
.rates-table tr:last-child td { border-bottom: none; }
.rates-table tr:hover td { background: var(--blue-tint); }
.rate-value { font-size: 17px; font-weight: 700; color: var(--blue); }
.calculator-card { background: #f9faff; border-radius: var(--r-xl); padding: 32px; border: 1px solid #e4e9f8; }
.calculator-card h3 { font-size: 20px; font-weight: 700; color: var(--black); margin-bottom: 22px; }
.calc-field { margin-bottom: 16px; }
.calc-field label { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: 6px; }
.calc-field input, .calc-field select { width: 100%; padding: 11px 14px; border: 1.5px solid var(--border); border-radius: var(--r-sm); font-size: 15px; font-weight: 500; font-family: var(--font); background: var(--white); color: var(--text); outline: none; transition: border-color .2s, box-shadow .2s; }
.calc-field input:focus, .calc-field select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(4,77,214,.1); }
.calc-result { background: var(--blue); border-radius: var(--r-md); padding: 22px; text-align: center; margin-top: 18px; }
.calc-result__amount { font-family: var(--font-display); font-size: 38px; font-weight: 800; color: var(--white); line-height: 1; letter-spacing: -.02em; }
.calc-result__label { font-size: 13px; color: rgba(255,255,255,.72); margin-top: 4px; }

/* ============================================================
   REVIEWS
   ============================================================ */
.section-reviews { padding: var(--section-y) 0; background: var(--bg-light); }
.section-reviews__header { text-align: center; margin-bottom: 44px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.section-reviews__header h2 { color: var(--black); }
.reviews-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.review-card { background: var(--white); border-radius: var(--r-xl); padding: 28px; border: 1px solid var(--border); transition: box-shadow .2s; }
.review-card:hover { box-shadow: var(--shadow-md); }
.review-card__stars { color: var(--gold); font-size: 16px; letter-spacing: 2px; margin-bottom: 14px; display: block; }
.review-card__text { font-size: 14px; color: #555; line-height: 1.8; margin-bottom: 20px; font-style: italic; }
.review-card__name { font-size: 14px; font-weight: 700; color: var(--black); }
.review-card__source { font-size: 11px; color: #aaa; margin-top: 3px; }

/* ============================================================
   FAQ
   ============================================================ */
.section-faq { padding: var(--section-y) 0; background: var(--white); }
.section-faq__inner { display: grid; grid-template-columns: 1fr 1.6fr; gap: 80px; align-items: start; }
.section-faq__inner > div:first-child { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.section-faq__inner > div:first-child h2 { color: var(--black); }
.section-faq__inner > div:first-child p { font-size: 15px; color: var(--muted); line-height: 1.75; }
.faq-list { display: flex; flex-direction: column; }
.faq-item { border-bottom: 1px solid var(--border); }
.faq-item__question { width: 100%; text-align: left; padding: 18px 0; font-size: 15px; font-weight: 500; color: var(--text); cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: none; border: none; font-family: var(--font); transition: color .2s; }
.faq-item__question:hover, .faq-item__question.active { color: var(--blue); }
.faq-item__icon { width: 22px; height: 22px; flex-shrink: 0; border: 1.5px solid #ccc; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; color: var(--muted); transition: all .2s; }
.faq-item__question.active .faq-item__icon { background: var(--blue); border-color: var(--blue); color: var(--white); transform: rotate(45deg); }
.faq-item__answer { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.faq-item__answer.open { max-height: 500px; }
.faq-item__answer p { padding: 0 0 18px; font-size: 14px; color: var(--muted); line-height: 1.8; }

/* ============================================================
   BLOG POSTS
   ============================================================ */
.section-posts { padding: var(--section-y) 0; background: var(--bg-light); }
.section-posts__header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 36px; gap: 24px; }
.posts-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.post-card { background: var(--white); border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--border); transition: all .2s; }
.post-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.post-card__image { height: 200px; overflow: hidden; background: var(--blue-tint); }
.post-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.post-card:hover .post-card__image img { transform: scale(1.04); }
.post-card__body { padding: 22px; }
.post-card__category { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--blue); margin-bottom: 7px; display: block; }
.post-card__title { font-size: 16px; font-weight: 600; color: var(--text); margin-bottom: 10px; line-height: 1.4; }
.post-card__title a:hover { color: var(--blue); }
.post-card__meta { font-size: 12px; color: #aaa; display: flex; gap: 10px; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer { background: #0432a8; color: var(--white); }
.footer__top { padding: 56px 0 44px; }
.footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 44px; }
.footer__logo-text { font-family: var(--font-display); font-size: 22px; font-weight: 800; color: var(--white); letter-spacing: -.02em; display: block; margin-bottom: 14px; }
.footer__tagline { font-size: 13px; color: rgba(255,255,255,.75); line-height: 1.7; max-width: 260px; margin-bottom: 22px; }
.footer__col-title { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.7); margin-bottom: 16px; display: block; }
.footer__links { display: flex; flex-direction: column; gap: 8px; }
.footer__links a { font-size: 13px; color: rgba(255,255,255,.68); transition: color .2s; padding: 2px 0; display: block; }
.footer__links a:hover { color: var(--white); }
.footer__contact { display: flex; flex-direction: column; gap: 8px; }
.footer__contact a { font-size: 13px; color: rgba(255,255,255,.68); display: flex; align-items: flex-start; gap: 8px; padding: 2px 0; transition: color .2s; }
.footer__contact a:hover { color: var(--white); }
.footer__bottom { padding: 18px 0; border-top: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.footer__copy { font-size: 11px; color: rgba(255,255,255,.7); }
.footer__bottom-links { display: flex; gap: 20px; }
.footer__bottom-links a { font-size: 11px; color: rgba(255,255,255,.7); transition: color .2s; }
.footer__bottom-links a:hover { color: rgba(255,255,255,.7); }
.newsletter-form { display: flex; gap: 8px; }
.newsletter-form input { flex: 1; padding: 10px 14px; border: 1.5px solid rgba(255,255,255,.2); background: rgba(255,255,255,.09); border-radius: var(--r-sm); color: var(--white); font-size: 13px; outline: none; transition: border-color .2s, background .2s; font-family: var(--font); }
.newsletter-form input::placeholder { color: rgba(255,255,255,.4); }
.newsletter-form input:focus { border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.13); }
.newsletter-form button { padding: 10px 18px; background: rgba(255,255,255,.18); color: var(--white); border: 1.5px solid rgba(255,255,255,.32); border-radius: var(--r-sm); font-size: 13px; font-weight: 600; cursor: pointer; transition: all .2s; white-space: nowrap; font-family: var(--font); }
.newsletter-form button:hover { background: rgba(255,255,255,.28); border-color: rgba(255,255,255,.55); }

/* ============================================================
   PAGE HERO (inner pages)
   ============================================================ */
.page-hero {
  background: linear-gradient(135deg, var(--blue) 0%, #0234a4 100%);
  padding: 68px 0;
  position: relative;
  overflow: hidden;
}
.page-hero::before { content: ''; position: absolute; top: -200px; right: -200px; width: 500px; height: 500px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.06) 0%, transparent 70%); pointer-events: none; }
.page-hero .accent-label { background: rgba(255,255,255,.13); border-color: rgba(255,255,255,.26); color: rgba(255,255,255,.92); margin-bottom: 12px; }
.page-hero h1 { font-size: clamp(32px, 3.8vw, 52px); font-weight: 800; color: var(--white) !important; margin: 0 0 14px; letter-spacing: -.025em; }
.page-hero p { font-size: 16px; color: rgba(255,255,255,.8); max-width: 560px; line-height: 1.7; }
.page-hero__actions { display: flex; gap: 12px; margin-top: 28px; flex-wrap: wrap; }
.breadcrumbs { font-size: 12px; color: rgba(255,255,255,.6); margin-bottom: 14px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.breadcrumbs a { color: rgba(255,255,255,.6); transition: color .2s; }
.breadcrumbs a:hover { color: var(--white); }
.breadcrumbs span { color: rgba(255,255,255,.9); }

/* ============================================================
   SERVICE PAGE
   ============================================================ */
.service-content { padding: var(--section-y) 0; }
.service-content__inner { display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: start; }
.service-body { display: flex; flex-direction: column; gap: 20px; }
.service-body h2 { font-size: clamp(22px, 2.5vw, 30px); font-weight: 700; color: var(--black); }
.service-body h3 { font-size: 18px; font-weight: 700; color: var(--text); margin-top: 8px; }
.service-body p { font-size: 15px; color: var(--muted); line-height: 1.85; }
.service-body ul { display: flex; flex-direction: column; gap: 6px; list-style: none; padding: 0; }
.service-body ul li { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; color: var(--muted); line-height: 1.6; padding: 10px 14px; background: var(--bg-light); border-radius: var(--r-sm); border-left: 3px solid var(--blue-accent); }
.service-body ul li::before { content: '✓'; color: var(--blue); font-weight: 700; font-size: 12px; flex-shrink: 0; margin-top: 2px; }
.service-stat-box { background: var(--blue-tint); border: 1px solid var(--blue-accent); border-radius: var(--r-xl); padding: 28px; text-align: center; margin-bottom: 20px; }
.service-stat-box__number { font-family: var(--font-display); font-size: 58px; font-weight: 800; color: var(--blue); line-height: 1; letter-spacing: -.03em; display: block; }
.service-stat-box__text { font-size: 13px; color: var(--muted); margin-top: 8px; line-height: 1.5; }
.qualify-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--r-xl); padding: 28px; position: sticky; top: 96px; box-shadow: var(--shadow-sm); }
.qualify-card h3 { font-size: 18px; font-weight: 700; color: var(--black); margin-bottom: 14px; }
.qualify-card > p { font-size: 13px; color: var(--muted); margin-bottom: 18px; line-height: 1.5; }
.qualify-list { display: flex; flex-direction: column; gap: 0; margin-bottom: 22px; }
.qualify-list li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--muted); padding: 9px 0; border-bottom: 1px solid #f0f2f7; list-style: none; }
.qualify-list li:last-child { border-bottom: none; }
.qualify-list li::before { content: '✓'; color: var(--blue); font-weight: 700; font-size: 12px; flex-shrink: 0; }
.qualify-card .btn { width: 100%; justify-content: center; }

/* ============================================================
   ABOUT PAGE
   ============================================================ */
.about-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin: 40px 0 52px; }
.about-stat { text-align: center; padding: 22px 16px; background: var(--blue-tint); border: 1px solid var(--blue-accent); border-radius: var(--r-xl); transition: transform .2s, box-shadow .2s; }
.about-stat:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.about-stat__number { font-family: var(--font-display); font-size: clamp(28px, 3.5vw, 40px); font-weight: 800; color: var(--blue); line-height: 1; letter-spacing: -.02em; display: block; }
.about-stat__label { font-size: 12px; font-weight: 500; color: var(--muted); margin-top: 6px; line-height: 1.4; display: block; }
.about-intro { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap, 48px); align-items: start; margin-bottom: 52px; }

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contact-grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: 60px; align-items: start; }
.contact-info { display: flex; flex-direction: column; gap: 22px; }
.contact-item { display: flex; align-items: flex-start; gap: 16px; }
.contact-item__icon { width: 44px; height: 44px; background: var(--blue-tint); border: 1px solid var(--blue-accent); border-radius: var(--r-md); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
.contact-item__label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: 3px; display: block; }
.contact-item__value { font-size: 15px; font-weight: 500; color: var(--text); line-height: 1.5; }
.contact-item__value a { color: var(--blue); }
.contact-item__value a:hover { opacity: .8; }

/* ============================================================
   TEAM CARDS
   ============================================================ */
.section-team__header { text-align: center; margin-bottom: 44px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.team-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
.team-card { background: var(--white); border-radius: var(--r-xl); border: 1px solid var(--border); overflow: hidden; transition: all .2s; }
.team-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }
.team-card__image { height: 260px; overflow: hidden; background: var(--blue-tint); display: flex; align-items: center; justify-content: center; font-size: 64px; }
.team-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.team-card:hover .team-card__image img { transform: scale(1.04); }
.team-card__body { padding: 22px; }
.team-card__name { font-size: 17px; font-weight: 700; color: var(--black); margin-bottom: 3px; }
.team-card__role { font-size: 13px; font-weight: 500; color: var(--blue); margin-bottom: 14px; }
.team-card__links { display: flex; flex-direction: column; gap: 5px; }
.team-card__links a { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 7px; transition: color .2s; }
.team-card__links a:hover { color: var(--blue); }

/* ============================================================
   UTILITIES
   ============================================================ */
.text-center { text-align: center; }
.text-primary { color: var(--blue); }
.mt-8  { margin-top: 8px; }  .mt-16 { margin-top: 16px; } .mt-24 { margin-top: 24px; }
.mb-8  { margin-bottom: 8px; } .mb-16 { margin-bottom: 16px; } .mb-24 { margin-bottom: 24px; }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--blue-accent); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--blue); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .section-hero__inner { grid-template-columns: 1fr; }
  .section-hero__image { display: none; }
  .section-editors__inner { grid-template-columns: 1fr; }
  .section-rates__inner { grid-template-columns: 1fr; }
  .section-faq__inner { grid-template-columns: 1fr; gap: 40px; }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .service-content__inner { grid-template-columns: 1fr; }
  .qualify-card { position: static; }
  .about-intro { grid-template-columns: 1fr; }
  .about-stats { grid-template-columns: repeat(2,1fr); }
  .contact-grid { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 768px) {
  :root { --section-y: 60px; }
  .header__nav, .header__cta { display: none; }
  .hamburger { display: flex; }
  .reviews-grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .posts-grid { grid-template-columns: 1fr; }
  .tabs-content__panel.active { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: 1fr; }
  .section-cta__actions { flex-direction: column; align-items: center; }
  .section-hero__actions { flex-direction: column; align-items: flex-start; }
  .top-bar__brand { display: none; }
  .tabs-nav { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
  .about-stats { grid-template-columns: 1fr 1fr; }
  .section-cta { padding: 56px 0; }
}
@media (max-width: 480px) {
  .about-stats { grid-template-columns: 1fr 1fr; }
  .reviews-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   FINAL TARGETED FIXES
   ============================================================ */

/* Hero title blue line */
.section-hero__title span { color: var(--blue) !important; }

/* Tabs left col — proper vertical stack with gap */
.tabs-content__left {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding-bottom: 4px !important;
}
.tabs-content__stat { display: block !important; }
.tabs-content__stat-text { display: block !important; margin-bottom: 4px !important; }
.tabs-content__body { display: flex !important; flex-direction: column !important; gap: 8px !important; }

/* CTA buttons — ensure rounded rect, not pill */
.section-cta .btn {
  border-radius: 12px !important;
  padding: 14px 32px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  min-width: 186px !important;
}

/* Footer logo — Outfit 800 */
.footer__logo-text {
  font-family: 'Outfit', sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  color: #fff !important;
  display: block !important;
  margin-bottom: 14px !important;
}

/* Header logo — ensure Outfit */
.header__logo-text {
  font-family: 'Outfit', sans-serif !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  color: var(--blue) !important;
}

/* Section tab placeholder — center label nicely */
.tabs-content__image-placeholder span { position: relative; z-index: 1; }

/* Rates table first column wider */
.rates-table td:first-child, .rates-table th:first-child { width: 65%; }

/* Service body ul spacing */
.service-body > ul { margin-top: 4px !important; }

/* Call button style */
a[href^="tel"].btn:not(.btn--primary):not(.btn--outline) {
  background: transparent !important;
  border: 1.5px solid var(--blue-accent) !important;
  color: var(--blue) !important;
  border-radius: var(--r-md) !important;
}
a[href^="tel"].btn:not(.btn--primary):not(.btn--outline):hover {
  background: var(--blue-tint) !important;
}

/* FAQ icon fix */
.faq-item__icon { font-style: normal !important; }

/* Page hero accent label on blue bg */
.page-hero .accent-label {
  background: rgba(255,255,255,.13) !important;
  border-color: rgba(255,255,255,.28) !important;
  color: rgba(255,255,255,.94) !important;
}

/* Inner page h1 */
.page-hero h1 {
  color: #fff !important;
  font-weight: 800 !important;
}

/* Section rates centred header */
.section-rates > .container > [style*="text-align:center"],
.section-rates > .container > div:first-child[style] {
  text-align: center;
  margin-bottom: 44px;
}
.section-rates > .container > [style*="text-align:center"] h2,
.section-rates > .container > div:first-child[style] h2 {
  color: var(--black) !important;
}


/* ============================================================
   LEGACY VARIABLE ALIASES — fixes inline styles in PHP templates
   ============================================================ */
:root {
  /* Aliases for old variable names used in inline PHP styles */
  --color-primary:       #044dd6;
  --color-primary-hover: #0340b0;
  --color-primary-tint:  #eff7ff;
  --color-primary-accent:#b2c5ff;
  --color-white:         #ffffff;
  --color-black:         #0d0d1a;
  --color-dark:          #374151;
  --color-mid:           #6b7280;
  --color-muted:         #9ca3af;
  --color-border:        #e5e9f0;
  --color-bg-light:      #f7f9fe;
  --font-primary:        'Plus Jakarta Sans', 'DM Sans', sans-serif;
  --font-secondary:      'Plus Jakarta Sans', 'DM Sans', sans-serif;
  --font-display:        'Outfit', sans-serif;
  --radius:              8px;
  --radius-lg:           16px;
  --radius-xl:           20px;
  --shadow-sm:           0 1px 3px rgba(0,0,0,.06);
  --shadow-md:           0 4px 16px rgba(4,77,214,.10);
  --shadow-lg:           0 8px 32px rgba(4,77,214,.14);
  --transition:          0.2s ease;
  --gap:                 48px;
  --container-width:     1200px;
  --container-offset:    clamp(16px,2.5vw,32px);
  --section-padding:     80px;
}

/* Hero title — blue on the third line */
.section-hero__content h1 span,
h1 span[style*="color-primary"],
h1 span[style*="--color-primary"],
h1 span[style*="--blue"] {
  color: #044dd6 !important;
}
/* Extra safe fallback — any span inside h1.h1 */
h1.h1 span { color: #044dd6 !important; }

/* Tabs — stat text tight under the number, no h3 collision */
.tabs-content__left {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.tabs-content__stat-text { margin-top: 6px !important; margin-bottom: 20px !important; }

/* CTA buttons — hard fix to remove pill shape from inline styles */
.section-cta__actions a,
.section-cta__actions button {
  border-radius: 12px !important;
}

/* Calculator Full Calculator button */
.calculator-card a.btn--outline,
.calculator-card .btn--outline {
  width: 100% !important;
  justify-content: center !important;
  margin-top: 14px !important;
  border-radius: 10px !important;
  border: 1.5px solid #044dd6 !important;
  color: #044dd6 !important;
  font-weight: 600 !important;
  display: flex !important;
}
.calculator-card a.btn--outline:hover {
  background: #044dd6 !important;
  color: #fff !important;
}

/* Footer newsletter input — brighter border so it's visible */
.newsletter-form input {
  border: 1.5px solid rgba(255,255,255,0.28) !important;
}
.newsletter-form { gap: 8px; align-items: center; }

/* FAQ section — label and h2 have proper gap */
.section-faq__inner > div:first-child {
  gap: 16px !important;
}

/* Intro section editors — label and h2 have proper gap */
.section-editors__col { gap: 14px !important; }
.section-editors__col h2 { margin-top: 0 !important; }

/* Rates table border radius visible */
.rates-table { border-radius: 14px !important; }

/* Service stat box inline color fix */
.service-stat-box__number { color: #044dd6 !important; }
.service-stat-box { background: #eff7ff !important; border-color: #b2c5ff !important; }

/* About stat inline color fix */
.about-stat__number { color: #044dd6 !important; }
.about-stat { background: #eff7ff !important; border-color: #b2c5ff !important; }

/* Page hero — inner page inline styles get --color-primary */
.page-hero [style*="--color-primary"],
.page-hero [style*="color:var(--color-primary)"] {
  color: var(--color-primary) !important;
}

/* Team card body — fix inline styles using old vars */
.team-card__role { color: #044dd6 !important; }

/* Contact item icon */
.contact-item__icon { background: #eff7ff !important; border-color: #b2c5ff !important; }

/* Qualify list bullet */
.qualify-list li::before { color: #044dd6 !important; }

/* Service body list border left */
.service-body ul li { border-left-color: #b2c5ff !important; }
.service-body ul li::before { color: #044dd6 !important; }

/* Section editors check */
.section-editors__check {
  background: #eff7ff !important;
  border-color: #b2c5ff !important;
  color: #044dd6 !important;
}

/* Tabs nav active bottom border */
.tabs-nav__btn.active { border-bottom-color: #044dd6 !important; }


/* ============================================================
   FINAL VISUAL FIXES — full audit pass
   ============================================================ */

/* 1. Ghost button — always white text, visible on blue backgrounds */
.btn--ghost,
.page-hero .btn--ghost,
.page-hero a.btn:not(.btn--primary):not(.btn--white),
.page-hero__actions .btn:not(.btn--primary):not(.btn--white) {
  color: #ffffff !important;
  background: rgba(255,255,255,0.1) !important;
  border: 1.5px solid rgba(255,255,255,0.45) !important;
}
.btn--ghost:hover,
.page-hero .btn--ghost:hover {
  background: rgba(255,255,255,0.2) !important;
  border-color: rgba(255,255,255,0.7) !important;
  color: #ffffff !important;
}

/* 2. CTA section buttons — kill any inherited border-radius from inline styles */
.section-cta__actions .btn,
.section-cta__actions a.btn {
  border-radius: 10px !important;
  -webkit-border-radius: 10px !important;
}

/* 3. Page hero buttons — white text on both buttons */
.page-hero__actions .btn--white {
  background: #ffffff !important;
  color: #044dd6 !important;
  border-color: #ffffff !important;
  border-radius: 10px !important;
}
.page-hero__actions .btn--ghost {
  background: rgba(255,255,255,0.1) !important;
  color: #ffffff !important;
  border: 1.5px solid rgba(255,255,255,0.45) !important;
  border-radius: 10px !important;
}

/* 4. About page hero call button */
.page-hero a[href^="tel"] {
  color: #ffffff !important;
  background: rgba(255,255,255,0.1) !important;
  border: 1.5px solid rgba(255,255,255,0.45) !important;
  border-radius: 10px !important;
}
.page-hero a[href^="tel"]:hover {
  background: rgba(255,255,255,0.2) !important;
}

/* 5. Service page hero ghost button */
.page-hero .btn[class*="ghost"] {
  color: #ffffff !important;
}

/* 6. Footer newsletter — Subscribe button more visible */
.newsletter-form button {
  background: rgba(255,255,255,0.15) !important;
  border: 1.5px solid rgba(255,255,255,0.35) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
}
.newsletter-form button:hover {
  background: rgba(255,255,255,0.28) !important;
}

/* 7. Footer tagline paragraph — ensure it's visible */
.footer__tagline { color: rgba(255,255,255,0.65) !important; }

/* 8. Header — Calculate button clean outline */
.header__cta .btn--outline {
  color: #044dd6 !important;
  border-color: #044dd6 !important;
  background: transparent !important;
}
.header__cta .btn--outline:hover {
  background: #044dd6 !important;
  color: #ffffff !important;
}

/* 9. Tabs section — service name h3 visible above body copy */
.tabs-content__body h3 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #0d0d1a !important;
  margin-bottom: 10px !important;
  line-height: 1.25 !important;
}

/* 10. Intro section — heading colour fix */
.section-editors__col h2 {
  color: #0d0d1a !important;
  font-weight: 700 !important;
}
.section-editors__col > p { color: #6b7280 !important; }

/* 11. Rates section heading */
.section-rates h2 { color: #0d0d1a !important; }

/* 12. Reviews text readable */
.review-card__text {
  color: #4b5563 !important;
  font-style: italic !important;
}

/* 13. FAQ left side text */
.section-faq__inner > div:first-child p { color: #6b7280 !important; }

/* 14. Qualify card paragraph */
.qualify-card > p { color: #6b7280 !important; font-size: 13px !important; }

/* 15. Service body paragraphs */
.service-body p { color: #6b7280 !important; }
.service-body h2 { color: #0d0d1a !important; }
.service-body h3 { color: #374151 !important; }

/* 16. About page inline style fixes */
.about-intro h2 { color: #0d0d1a !important; }
.about-intro p  { color: #6b7280 !important; }

/* 17. Contact page info text */
.contact-info h2, .contact-info h3 { color: #0d0d1a !important; }
.contact-info > p { color: #6b7280 !important; }

/* 18. Page hero p tag */
.page-hero p { color: rgba(255,255,255,0.82) !important; }

/* 19. Breadcrumb separator */
.breadcrumbs { gap: 4px !important; align-items: center !important; }

/* 20. Section faq first answer expanded — text color */
.faq-item__answer p { color: #6b7280 !important; }

/* 21. Body text global */
body, p { color: #374151; }
li { color: #374151; }


/* ============================================================
   COMPREHENSIVE FINAL FIXES — all remaining visual issues
   ============================================================ */

/* ── Global text colour hierarchy ──────────────────────── */
body    { color: #374151 !important; }
h1,h2,h3,h4,h5,h6 { color: #0d0d1a !important; }
p       { color: #6b7280 !important; }
li      { color: #6b7280 !important; }
a       { color: inherit; }

/* ── Ensure headings inside white sections are dark ──────── */
.section-editors__col h2,
.section-tabs__header h2,
.section-rates h2,
.section-reviews__header h2,
.section-faq__inner h2,
.section-posts__header h2,
.calculator-card h3,
.qualify-card h3,
.service-body h2,
.service-body h3,
.about-intro h2,
.section-team__header h2,
.contact-grid h2, .contact-grid h3 {
  color: #0d0d1a !important;
}

/* ── Ensure copy text under headings is muted grey ────────── */
.section-editors__col p,
.tabs-content__body p,
.section-faq__inner > div:first-child p,
.review-card__text,
.service-body p,
.qualify-card p,
.about-intro p,
.contact-info p {
  color: #6b7280 !important;
}

/* ── Intro editors — make description appear properly ──────── */
.section-editors__col .accent-label { margin-bottom: 8px; }
.section-editors__col { gap: 16px !important; }

/* ── FAQ left column ────────────────────────────────────── */
.section-faq__inner > div:first-child p {
  color: #6b7280 !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  margin-top: 0 !important;
}

/* ── Footer newsletter — higher contrast ─────────────────── */
.newsletter-form {
  display: flex !important;
  gap: 8px !important;
  margin-top: 20px !important;
}
.newsletter-form input {
  flex: 1 !important;
  padding: 11px 14px !important;
  background: rgba(255,255,255,0.1) !important;
  border: 1.5px solid rgba(255,255,255,0.3) !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: 13px !important;
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  outline: none !important;
}
.newsletter-form input::placeholder { color: rgba(255,255,255,0.45) !important; }
.newsletter-form input:focus {
  border-color: rgba(255,255,255,0.6) !important;
  background: rgba(255,255,255,0.15) !important;
}
.newsletter-form button {
  padding: 11px 20px !important;
  background: rgba(255,255,255,0.2) !important;
  border: 1.5px solid rgba(255,255,255,0.45) !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.2s !important;
}
.newsletter-form button:hover {
  background: rgba(255,255,255,0.32) !important;
  border-color: rgba(255,255,255,0.65) !important;
}

/* ── Footer text colours ────────────────────────────────── */
.footer__tagline { color: rgba(255,255,255,0.65) !important; font-size: 13px !important; line-height: 1.7 !important; }
.footer__col-title { color: rgba(255,255,255,0.4) !important; }
.footer__links a { color: rgba(255,255,255,0.7) !important; }
.footer__links a:hover { color: #fff !important; }
.footer__contact a { color: rgba(255,255,255,0.7) !important; }
.footer__contact a:hover { color: #fff !important; }
.footer__copy { color: rgba(255,255,255,0.4) !important; }
.footer__bottom-links a { color: rgba(255,255,255,0.4) !important; }
.footer__bottom-links a:hover { color: rgba(255,255,255,0.75) !important; }

/* ── Section items list text ────────────────────────────── */
.section-editors__item { color: #374151 !important; font-weight: 500 !important; }

/* ── Tabs stat text ─────────────────────────────────────── */
.tabs-content__stat-text { color: #9ca3af !important; }

/* ── Rate table text ────────────────────────────────────── */
.rates-table td { color: #374151 !important; }
.rates-table td:first-child { font-weight: 500 !important; }

/* ── Calculator labels ───────────────────────────────────── */
.calc-field label { color: #9ca3af !important; }
.calc-result__label { color: rgba(255,255,255,0.75) !important; }

/* ── Review author ───────────────────────────────────────── */
.review-card__name { color: #0d0d1a !important; font-weight: 700 !important; }
.review-card__source { color: #9ca3af !important; }

/* ── FAQ answer text ─────────────────────────────────────── */
.faq-item__answer p { color: #6b7280 !important; }
.faq-item__question { color: #374151 !important; }
.faq-item__question:hover, .faq-item__question.active { color: #044dd6 !important; }

/* ── Service body list items ──────────────────────────────── */
.service-body ul li { color: #6b7280 !important; }

/* ── Post card ───────────────────────────────────────────── */
.post-card__title { color: #374151 !important; }
.post-card__meta  { color: #9ca3af !important; }

/* ── Contact form labels/inputs ──────────────────────────── */
.contact-grid label { color: #9ca3af !important; font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; }
.contact-grid input, .contact-grid textarea {
  color: #374151 !important;
  border: 1.5px solid #e5e9f0 !important;
  border-radius: 10px !important;
}
.contact-grid input:focus, .contact-grid textarea:focus {
  border-color: #044dd6 !important;
  box-shadow: 0 0 0 3px rgba(4,77,214,0.1) !important;
  outline: none !important;
}

/* ── About page stats label ──────────────────────────────── */
.about-stat__label { color: #6b7280 !important; }
.about-stat__number { color: #044dd6 !important; }

/* ── Team card ───────────────────────────────────────────── */
.team-card__name { color: #0d0d1a !important; }
.team-card__role { color: #044dd6 !important; }
.team-card__links a { color: #6b7280 !important; }
.team-card__links a:hover { color: #044dd6 !important; }

/* ── Breadcrumbs ─────────────────────────────────────────── */
.breadcrumbs, .breadcrumbs a { color: rgba(255,255,255,0.65) !important; }
.breadcrumbs span { color: rgba(255,255,255,0.9) !important; }

/* ── Qualify list ────────────────────────────────────────── */
.qualify-list li { color: #6b7280 !important; }

/* ── Service stat box ────────────────────────────────────── */
.service-stat-box__text { color: #6b7280 !important; }

/* ── Lender logos ────────────────────────────────────────── */
.section-logos__label { color: #bbb !important; }
.section-logos__list span { color: #c5cad4 !important; }
.section-logos__list span:hover { color: #044dd6 !important; }

/* ── Top bar ─────────────────────────────────────────────── */
.top-bar__brand { color: rgba(255,255,255,0.72) !important; }
.top-bar__links a { color: #fff !important; }

/* ── Trust badge ─────────────────────────────────────────── */
.section-hero__trust-text { color: #6b7280 !important; }
.section-hero__trust-text strong { color: #374151 !important; }

/* ── Header nav ──────────────────────────────────────────── */
.header__nav a { color: #374151 !important; }
.header__nav a:hover { color: #044dd6 !important; }

/* ── Accent labels on white background ───────────────────── */
.accent-label { color: #044dd6 !important; }

/* ── Page hero subtitle ──────────────────────────────────── */
.section-hero__subtitle { color: #6b7280 !important; }

/* ── Post category ───────────────────────────────────────── */
.post-card__category { color: #044dd6 !important; }


/* ============================================================
   DEFINITIVE FINAL POLISH — everything locked in
   ============================================================ */

/* ── Tabs stat number colour ─── */
.tabs-content__stat { color: #044dd6 !important; }

/* ── Tabs stat text — lighter grey ─── */
.tabs-content__stat-text { color: #9ca3af !important; font-size: 13px !important; }

/* ── Section background rhythm — clear alternation ─── */
.section-editors  { background: #ffffff !important; }
.section-tabs     { background: #f4f7fe !important; }
.section-rates    { background: #ffffff !important; }
.section-reviews  { background: #f4f7fe !important; }
.section-faq      { background: #ffffff !important; }
.section-posts    { background: #f4f7fe !important; }

/* ── Rates table — full width with no overflow ─── */
.section-rates__inner { align-items: end !important; }
.rates-table { table-layout: fixed !important; }
.rates-table td:first-child, .rates-table th:first-child { width: auto !important; }

/* ── Calculator result number font ─── */
.calc-result__amount { font-family: 'Outfit', sans-serif !important; }

/* ── Page hero — subtitle always readable ─── */
.page-hero p { color: rgba(255,255,255,0.85) !important; line-height: 1.7 !important; }
.page-hero h1 { color: #ffffff !important; }

/* ── Inner page section heading text ─── */
.service-content h2,
.service-content h3 { color: #0d0d1a !important; }
.service-content p  { color: #6b7280 !important; }

/* ── About stats section ─── */
.about-stats { margin-top: 0 !important; margin-bottom: 36px !important; }
.about-intro { margin-bottom: 0 !important; }

/* ── Team card hover border ─── */
.team-card:hover { border-color: #b2c5ff !important; }

/* ── Contact form card ─── */
.contact-grid > div:last-child > div {
  background: #f7f9fe !important;
  border-radius: 20px !important;
  border: 1px solid #e5e9f0 !important;
  padding: 36px !important;
}
.contact-grid input[type="text"],
.contact-grid input[type="email"],
.contact-grid input[type="tel"],
.contact-grid textarea {
  width: 100% !important;
  padding: 11px 14px !important;
  border: 1.5px solid #e5e9f0 !important;
  border-radius: 10px !important;
  font-size: 15px !important;
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  color: #374151 !important;
  background: #ffffff !important;
  outline: none !important;
  margin-top: 6px !important;
  display: block !important;
}
.contact-grid input:focus,
.contact-grid textarea:focus {
  border-color: #044dd6 !important;
  box-shadow: 0 0 0 3px rgba(4,77,214,0.1) !important;
}
.contact-grid label {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #9ca3af !important;
  display: block !important;
  margin-bottom: 2px !important;
}
.contact-grid button.btn--primary {
  width: 100% !important;
  justify-content: center !important;
  margin-top: 4px !important;
}

/* ── "Full Calculator" link on homepage ─── */
a[href*="calculator"].btn--outline {
  width: 100% !important;
  justify-content: center !important;
  display: flex !important;
  margin-top: 14px !important;
}

/* ── Reviews — remove italic, cleaner feel ─── */
.review-card__text { font-style: normal !important; }

/* ── FAQ question font weight ─── */
.faq-item__question { font-weight: 500 !important; font-size: 16px !important; }

/* ── Accent label on blue CTA ─── */
.section-cta .accent-label {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(255,255,255,0.28) !important;
  color: rgba(255,255,255,0.95) !important;
}

/* ── Footer grid spacing ─── */
.footer__grid { gap: 48px !important; }
.footer__links { gap: 10px !important; }
.footer__contact { gap: 10px !important; }

/* ── Qualify card button gap ─── */
.qualify-card .btn + .btn { margin-top: 10px !important; }

/* ── Service stat box alignment ─── */
.service-stat-box { text-align: center !important; }
.service-stat-box__number { 
  font-family: 'Outfit', sans-serif !important;
  display: block !important; 
  margin-bottom: 8px !important;
}

/* ── About page intro paragraph ─── */
.about-intro > div > p { color: #6b7280 !important; }

/* ── Section divider between FAQ and posts ─── */
.section-posts { border-top: none !important; }

/* ── Page breaks — uniform 12px gap between hero and next section ─── */
.page-hero + * { margin-top: 12px !important; }

/* ── General link hover ─── */
a:hover { opacity: 0.88; }
.btn:hover { opacity: 1 !important; }

/* ── Smooth transitions on cards ─── */
.review-card, .post-card, .team-card, .about-stat {
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
}

/* ── Remove double bottom border on tabs nav ─── */
.tabs-nav { border-bottom: 2px solid #e5e9f0 !important; }

/* ── Post card category tag ─── */
.post-card__category { letter-spacing: 0.08em !important; }

/* ── Accent label base — tighten ─── */
.accent-label {
  padding: 5px 13px !important;
  font-size: 11px !important;
  letter-spacing: 0.07em !important;
}


/* ============================================================
   LENDER CAROUSEL SECTION
   ============================================================ */
.section-lenders {
  padding: 20px 0;
  background: #fff;
  border-top: 1px solid #eef0f6;
  border-bottom: 1px solid #eef0f6;
}
.section-lenders__inner {
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 72px;
}

/* Big "100+" badge on the left */
.section-lenders__badge {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  padding-right: 28px;
}
.section-lenders__count {
  font-family: 'Outfit', sans-serif;
  font-size: 42px;
  font-weight: 800;
  color: #044dd6;
  line-height: 1;
  letter-spacing: -0.03em;
}
.section-lenders__label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #9ca3af;
  line-height: 1.3;
}

/* Vertical divider */
.section-lenders__divider {
  width: 1px;
  height: 44px;
  background: #e5e9f0;
  flex-shrink: 0;
  margin-right: 28px;
}

/* Carousel wrapper */
.section-lenders__carousel-wrap {
  flex: 1;
  overflow: hidden;
  position: relative;
}

/* Fade edges */
.section-lenders__fade-left,
.section-lenders__fade-right {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 60px;
  z-index: 2;
  pointer-events: none;
}
.section-lenders__fade-left {
  left: 0;
  background: linear-gradient(to right, #fff 0%, transparent 100%);
}
.section-lenders__fade-right {
  right: 0;
  background: linear-gradient(to left, #fff 0%, transparent 100%);
}

/* Scrolling track */
.section-lenders__track {
  display: flex;
  align-items: center;
  gap: 32px;
  animation: lenderScroll 28s linear infinite;
  will-change: transform;
}
.section-lenders__track:hover {
  animation-play-state: paused;
}

@keyframes lenderScroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Individual lender card */
.lender-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  cursor: default;
  transition: transform 0.2s ease;
}
.lender-item:hover { transform: translateY(-2px); }

/* Logo circle */
.lender-logo {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.02em;
  border: 1.5px solid transparent;
  transition: all 0.2s ease;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.lender-item:hover .lender-logo {
  box-shadow: 0 4px 14px rgba(0,0,0,0.12);
  transform: scale(1.05);
}

/* Lender name */
.lender-name {
  font-size: 11px;
  font-weight: 500;
  color: #9ca3af;
  text-align: center;
  white-space: nowrap;
  transition: color 0.2s;
}
.lender-item:hover .lender-name { color: #374151; }

/* Individual bank colour themes */
.lender-logo.td     { background: #3a7b3e; color: #fff; border-color: #2d6130; }
.lender-logo.scotia { background: #d4192c; color: #fff; border-color: #b01524; }
.lender-logo.fn     { background: #0d3b72; color: #fff; border-color: #0a2f5c; }
.lender-logo.mcap   { background: #e8442a; color: #fff; border-color: #c93820; }
.lender-logo.rfa    { background: #044dd6; color: #fff; border-color: #0340b0; }
.lender-logo.eq     { background: #1a1a2e; color: #fff; border-color: #111; }
.lender-logo.ht     { background: #c8102e; color: #fff; border-color: #a50d26; }
.lender-logo.ic     { background: #f7941d; color: #fff; border-color: #e08318; }
.lender-logo.street { background: #6b3fa0; color: #fff; border-color: #5a3488; }
.lender-logo.rbc    { background: #005daa; color: #fff; border-color: #004d8f; }

@media (max-width: 768px) {
  .section-lenders__count { font-size: 32px; }
  .section-lenders__badge { padding-right: 18px; }
  .section-lenders__divider { margin-right: 18px; }
  .lender-logo { width: 44px; height: 44px; font-size: 11px; border-radius: 11px; }
  .lender-name { font-size: 10px; }
  .section-lenders__track { gap: 22px; }
}


/* ============================================================
   LENDER CAROUSEL — IMAGE VERSION UPDATE
   ============================================================ */

/* Replace old text-based logo circles with image-based ones */
.lender-logo-img {
  width: 100px;
  height: 40px;
  object-fit: contain;
  border-radius: 8px;
  display: block;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.lender-item:hover .lender-logo-img {
  transform: scale(1.06) translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.15);
}

/* Remove old circle logo styles that no longer apply */
.lender-logo { display: none !important; }

/* Updated lender item sizing for image logos */
.lender-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 7px !important;
  flex-shrink: 0 !important;
  cursor: default !important;
  transition: transform 0.2s ease !important;
}
.lender-item:hover { transform: translateY(-2px) !important; }

/* Carousel track — adjusted gap for image items */
.section-lenders__track {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  animation: lenderScroll 32s linear infinite !important;
  will-change: transform !important;
}
.section-lenders__track:hover {
  animation-play-state: paused !important;
}

/* Lender name under logo */
.lender-name {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #aaa !important;
  text-align: center !important;
  white-space: nowrap !important;
  letter-spacing: 0.02em !important;
  transition: color 0.2s !important;
}
.lender-item:hover .lender-name { color: #374151 !important; }

/* Section height */
.section-lenders {
  padding: 24px 0 !important;
  background: #ffffff !important;
  border-top: 1px solid #eef0f6 !important;
  border-bottom: 1px solid #eef0f6 !important;
}

/* 100+ badge sizing */
.section-lenders__count {
  font-family: 'Outfit', sans-serif !important;
  font-size: 44px !important;
  font-weight: 800 !important;
  color: #044dd6 !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
}
.section-lenders__label {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.09em !important;
  color: #aaa !important;
  line-height: 1.35 !important;
}

@media (max-width: 768px) {
  .lender-logo-img { width: 80px; height: 32px; }
  .section-lenders__count { font-size: 32px !important; }
}


/* ================================================================
   PREMIUM REDESIGN — Mortgagefy v4.0
   Art-piece quality, conversion-optimised
   ================================================================ */

/* ── GOOGLE FONTS ──────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300..800;1,9..40,300..800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800;900&display=swap');

/* ── CSS CUSTOM PROPERTIES ─────────────────────────────────── */
:root {
  --blue:       #044dd6;
  --blue-dark:  #0235a8;
  --blue-light: #1a65e8;
  --blue-tint:  #eff5ff;
  --blue-glow:  rgba(4,77,214,0.25);
  --gold:       #f59e0b;
  --white:      #ffffff;
  --black:      #070d1f;
  --text:       #1e293b;
  --muted:      #64748b;
  --border:     #e2e8f0;
  --bg:         #f8faff;
  --radius:     12px;
  --radius-lg:  20px;
  --radius-xl:  28px;
  --shadow-sm:  0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:  0 4px 20px rgba(4,77,214,.10);
  --shadow-lg:  0 12px 40px rgba(4,77,214,.16);
  --shadow-xl:  0 24px 60px rgba(4,77,214,.20);
  --ease:       cubic-bezier(.22,1,.36,1);
  --ease-back:  cubic-bezier(.34,1.56,.64,1);
}

/* ── RESET / BASE ──────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  background: #f0f2f7 !important;
  color: var(--text) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ── TOP BAR ───────────────────────────────────────────────── */
.top-bar {
  background: linear-gradient(90deg, #022fa0 0%, #044dd6 50%, #022fa0 100%) !important;
  padding: 10px 0 !important;
  font-size: 12px !important;
  letter-spacing: .01em !important;
}
.top-bar__inner { align-items: center !important; }
.top-bar__links a {
  color: rgba(255,255,255,.92) !important;
  font-weight: 500 !important;
  font-size: 12.5px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: opacity .15s !important;
}
.top-bar__links a:hover { opacity: .75 !important; }

/* ── HEADER ────────────────────────────────────────────────── */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 200 !important;
  background: rgba(255,255,255,.92) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: none !important;
  box-shadow: 0 4px 24px rgba(0,0,0,.04) !important;
  transition: background .3s, box-shadow .3s !important;
}
.site-header.scrolled {
  background: rgba(255,255,255,.97) !important;
  box-shadow: 0 2px 32px rgba(0,0,0,.08) !important;
}
.header__inner { height: 70px !important; }
.header__logo-text {
  font-family: 'Outfit', sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -.03em !important;
  background: linear-gradient(135deg, #044dd6 0%, #1a65e8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.header__nav a {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--text) !important;
  padding: 8px 14px !important;
  border-radius: 8px !important;
  transition: all .2s var(--ease) !important;
  position: relative !important;
}
.header__nav a:hover {
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
}
.header__cta .btn--outline {
  border: 1.5px solid var(--blue) !important;
  color: var(--blue) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 9px 20px !important;
  border-radius: 10px !important;
  background: transparent !important;
  transition: all .2s var(--ease) !important;
}
.header__cta .btn--outline:hover {
  background: var(--blue) !important;
  color: white !important;
  transform: translateY(-1px) !important;
}
.header__cta .btn--primary {
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-light) 100%) !important;
  color: white !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 9px 22px !important;
  border-radius: 10px !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(4,77,214,.35) !important;
  transition: all .25s var(--ease) !important;
  position: relative !important;
  overflow: hidden !important;
}
.header__cta .btn--primary::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg, rgba(255,255,255,.2) 0%, transparent 60%) !important;
  opacity: 0 !important;
  transition: opacity .2s !important;
}
.header__cta .btn--primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(4,77,214,.45) !important;
}
.header__cta .btn--primary:hover::after { opacity: 1 !important; }

/* ── HERO ──────────────────────────────────────────────────── */
.section-hero {
  padding: 80px 0 72px !important;
  background: var(--white) !important;
  position: relative !important;
  overflow: hidden !important;
}
.section-hero::before,
.section-hero::after {
  display: none !important;
}
.section-hero__inner {
  display: grid !important;
  grid-template-columns: 1fr .95fr !important;
  gap: 60px !important;
  align-items: center !important;
  position: relative !important;
  z-index: 1 !important;
}
.accent-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  background: var(--blue-tint) !important;
  border: 1.5px solid rgba(4,77,214,.2) !important;
  border-radius: 100px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  color: var(--blue) !important;
  width: fit-content !important;
}
h1.h1, .section-hero h1 {
  font-size: clamp(40px, 4.5vw, 62px) !important;
  font-weight: 800 !important;
  line-height: 1.07 !important;
  letter-spacing: -.035em !important;
  color: var(--black) !important;
  margin: 0 !important;
}
h1.h1 span, .section-hero h1 span {
  background: linear-gradient(135deg, var(--blue) 0%, #1a65e8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.section-hero__subtitle {
  font-size: 17px !important;
  color: var(--muted) !important;
  line-height: 1.75 !important;
  max-width: 480px !important;
}
/* ── Uniform button widths in action groups ── */
.section-hero__actions .btn,
.section-cta__actions .btn,
.section-editors__actions .btn,
.page-hero__actions .btn {
  min-width: 190px !important;
  text-align: center !important;
  justify-content: center !important;
}

.section-hero__actions { display: flex !important; gap: 12px !important; align-items: center !important; flex-wrap: wrap !important; }

/* Hero primary CTA */
.section-hero__actions .btn--primary {
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-light) 100%) !important;
  color: white !important;
  padding: 14px 32px !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border: none !important;
  box-shadow: 0 6px 20px rgba(4,77,214,.38) !important;
  position: relative !important;
  overflow: hidden !important;
  transition: all .3s var(--ease) !important;
  letter-spacing: -.01em !important;
}
.section-hero__actions .btn--primary::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: -100% !important;
  width: 100% !important; height: 100% !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent) !important;
  transition: left .5s var(--ease) !important;
}
.section-hero__actions .btn--primary:hover::before { left: 100% !important; }
.section-hero__actions .btn--primary:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 32px rgba(4,77,214,.5) !important;
}

/* Hero phone button */
.section-hero__actions a[href^="tel"] {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 13px 24px !important;
  border: 2px solid var(--border) !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--text) !important;
  background: transparent !important;
  transition: all .2s var(--ease) !important;
}
.section-hero__actions a[href^="tel"]:hover {
  border-color: var(--blue) !important;
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
  transform: translateY(-2px) !important;
}

/* Trust badge */
.section-hero__trust {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 16px !important;
  background: #fffbeb !important;
  border: 1.5px solid rgba(245,158,11,.25) !important;
  border-radius: 12px !important;
}
.section-hero__trust-stars { color: var(--gold) !important; font-size: 14px !important; letter-spacing: 2px !important; }
.section-hero__trust-text { font-size: 13px !important; color: var(--text) !important; font-weight: 500 !important; }

/* Hero visual card */
.section-hero__image {
  border-radius: 28px !important;
  background: linear-gradient(145deg, #c8d9ff 0%, #9ab5ff 30%, #4470e8 70%, #1a3cc0 100%) !important;
  box-shadow: var(--shadow-xl), inset 0 1px 0 rgba(255,255,255,.3) !important;
  overflow: hidden !important;
  min-height: 460px !important;
  position: relative !important;
}
.section-hero__image::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 25% 35%, rgba(255,255,255,.35) 0%, transparent 50%),
    radial-gradient(circle at 75% 70%, rgba(4,30,120,.3) 0%, transparent 50%) !important;
}
.section-hero__visual {
  position: relative !important;
  z-index: 2 !important;
  padding: 44px 36px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
}
.section-hero__badge {
  background: rgba(255,255,255,.92) !important;
  backdrop-filter: blur(8px) !important;
  border-radius: 100px !important;
  padding: 10px 20px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--blue) !important;
  box-shadow: 0 4px 20px rgba(4,77,214,.15) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.section-hero__stats-row { display: flex !important; gap: 14px !important; }
.section-hero__stat {
  background: rgba(255,255,255,.96) !important;
  backdrop-filter: blur(12px) !important;
  border-radius: 18px !important;
  padding: 20px 26px !important;
  min-width: 140px !important;
  text-align: center !important;
  box-shadow: 0 8px 28px rgba(4,77,214,.18), inset 0 1px 0 rgba(255,255,255,.8) !important;
  transition: transform .3s var(--ease) !important;
}
.section-hero__stat:hover { transform: translateY(-4px) !important; }
.section-hero__stat-num {
  font-family: 'Outfit', sans-serif !important;
  font-size: 52px !important;
  font-weight: 800 !important;
  color: var(--blue) !important;
  line-height: 1 !important;
  letter-spacing: -.035em !important;
  display: block !important;
}
.section-hero__stat-label {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--muted) !important;
  margin-top: 5px !important;
  display: block !important;
}
.section-hero__stat-label .star { color: var(--gold) !important; }

/* ── LENDER CAROUSEL ───────────────────────────────────────── */
.section-lenders {
  padding: 22px 0 !important;
  background: var(--white) !important;
  border-top: 1px solid rgba(4,77,214,.07) !important;
  border-bottom: 1px solid rgba(4,77,214,.07) !important;
}
.section-lenders__count {
  font-family: 'Outfit', sans-serif !important;
  font-size: 46px !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-light) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  line-height: 1 !important;
  letter-spacing: -.03em !important;
}
.section-lenders__label {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  line-height: 1.4 !important;
}
.lender-logo-img {
  height: 36px !important;
  width: auto !important;
  max-width: 110px !important;
  object-fit: contain !important;
  filter: grayscale(100%) opacity(60%) !important;
  transition: filter .3s var(--ease), transform .3s var(--ease) !important;
  display: block !important;
}
.lender-item:hover .lender-logo-img {
  filter: grayscale(0%) opacity(100%) !important;
  transform: scale(1.08) translateY(-2px) !important;
}

/* ── INTRO SECTION ─────────────────────────────────────────── */
.section-editors {
  padding: 88px 0 !important;
  background: var(--white) !important;
}
.section-editors__inner {
  display: grid !important;
  grid-template-columns: 1fr 1.1fr !important;
  gap: 80px !important;
  align-items: start !important;
}
.section-editors__col h2 {
  font-size: clamp(30px, 3.2vw, 46px) !important;
  font-weight: 800 !important;
  color: var(--black) !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  margin-top: 0 !important;
}
.section-editors__col > p {
  font-size: 16.5px !important;
  color: var(--muted) !important;
  line-height: 1.8 !important;
}
.section-editors__item {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 13px 0 !important;
  border-bottom: 1px solid var(--border) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--text) !important;
  transition: color .2s !important;
}
.section-editors__item:last-child { border-bottom: none !important; }
.section-editors__item:hover { color: var(--blue) !important; }
.section-editors__check {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, var(--blue-tint), rgba(4,77,214,.12)) !important;
  border: 1.5px solid rgba(4,77,214,.25) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  color: var(--blue) !important;
  flex-shrink: 0 !important;
  transition: all .2s !important;
}
.section-editors__item:hover .section-editors__check {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: white !important;
  transform: scale(1.1) !important;
}

/* ── SERVICES TABS ─────────────────────────────────────────── */
.section-tabs {
  padding: 88px 0 !important;
  background: var(--bg) !important;
  position: relative !important;
  overflow: hidden !important;
}
.section-tabs::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(4,77,214,.15), transparent) !important;
}
.section-tabs__header h2 {
  font-size: clamp(28px, 3vw, 44px) !important;
  font-weight: 800 !important;
  color: var(--black) !important;
  letter-spacing: -.025em !important;
}
.tabs-nav {
  border-bottom: 1.5px solid var(--border) !important;
  gap: 2px !important;
  margin-bottom: 40px !important;
}
.tabs-nav__btn {
  padding: 11px 18px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--muted) !important;
  border-radius: 8px 8px 0 0 !important;
  transition: all .2s var(--ease) !important;
  border-bottom: 2.5px solid transparent !important;
  position: relative !important;
  bottom: -1.5px !important;
}
.tabs-nav__btn:hover { color: var(--blue) !important; background: rgba(4,77,214,.04) !important; }
.tabs-nav__btn.active {
  color: var(--blue) !important;
  font-weight: 700 !important;
  border-bottom-color: var(--blue) !important;
  background: rgba(4,77,214,.05) !important;
}
.tabs-content__stat {
  font-family: 'Outfit', sans-serif !important;
  font-size: clamp(80px, 11vw, 120px) !important;
  font-weight: 800 !important;
  line-height: .9 !important;
  letter-spacing: -.04em !important;
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-light) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  display: block !important;
}
.tabs-content__stat-text {
  font-size: 14px !important;
  color: var(--muted) !important;
  line-height: 1.55 !important;
  margin-bottom: 24px !important;
  max-width: 280px !important;
}
.tabs-content__body h3 {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: var(--black) !important;
  margin-bottom: 10px !important;
  letter-spacing: -.02em !important;
}
.tabs-content__body p { font-size: 15px !important; color: var(--muted) !important; line-height: 1.8 !important; }
.tabs-content__body .btn--primary {
  background: linear-gradient(135deg, var(--blue), var(--blue-light)) !important;
  box-shadow: 0 4px 16px rgba(4,77,214,.3) !important;
  border: none !important;
  padding: 12px 26px !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  transition: all .25s var(--ease) !important;
  width: auto !important;
  display: inline-flex !important;
}
.tabs-content__body .btn--primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(4,77,214,.42) !important;
}
.tabs-content__image-placeholder {
  border-radius: 24px !important;
  background: linear-gradient(145deg, #dce8ff 0%, #a8c0ff 40%, rgba(4,77,214,.25) 100%) !important;
  box-shadow: var(--shadow-lg) !important;
  height: 380px !important;
  position: relative !important;
  overflow: hidden !important;
}
.tabs-content__image-placeholder::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.4) 0%, transparent 60%) !important;
}

/* ── CTA SECTIONS ──────────────────────────────────────────── */
.section-cta {
  background: linear-gradient(135deg, #022fa0 0%, #044dd6 40%, #1a65e8 100%) !important;
  padding: 80px 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
.section-cta::before {
  content: '' !important;
  position: absolute !important;
  top: -200px !important; right: -200px !important;
  width: 600px !important; height: 600px !important;
  background: radial-gradient(circle, rgba(255,255,255,.07) 0%, transparent 60%) !important;
  pointer-events: none !important;
}
.section-cta::after {
  content: '' !important;
  position: absolute !important;
  bottom: -150px !important; left: -100px !important;
  width: 400px !important; height: 400px !important;
  background: radial-gradient(circle, rgba(255,255,255,.05) 0%, transparent 60%) !important;
  pointer-events: none !important;
}
.section-cta__inner {
  position: relative !important;
  z-index: 1 !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 18px !important;
}
.section-cta__inner h2 {
  font-size: clamp(32px, 3.8vw, 52px) !important;
  font-weight: 800 !important;
  color: white !important;
  letter-spacing: -.03em !important;
  line-height: 1.1 !important;
}
.section-cta__inner p {
  font-size: 17px !important;
  color: rgba(255,255,255,.82) !important;
  max-width: 540px !important;
  line-height: 1.7 !important;
}
.section-cta .accent-label {
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.24) !important;
  color: rgba(255,255,255,.95) !important;
}
.section-cta__actions { display: flex !important; gap: 12px !important; justify-content: center !important; flex-wrap: wrap !important; align-items: stretch !important; }
/* -- All CTA buttons: uniform outline style & same size -- */
.section-cta__actions .btn {
  background: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,0.5) !important;
  padding: 14px 34px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  box-shadow: none !important;
  transition: all .25s var(--ease) !important;
  min-width: 220px !important;
  width: 220px !important;
  height: 56px !important;
  text-align: center !important;
  justify-content: center !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  padding: 0 28px !important;
}
.section-cta__actions .btn:hover {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.8) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 32px rgba(0,0,0,.22) !important;
}
.section-cta .btn--ghost {
  background: rgba(255,255,255,.1) !important;
  color: white !important;
  border: 1.5px solid rgba(255,255,255,.4) !important;
  padding: 14px 34px !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  transition: all .25s var(--ease) !important;
}
.section-cta .btn--ghost:hover {
  background: rgba(255,255,255,.2) !important;
  border-color: rgba(255,255,255,.7) !important;
  transform: translateY(-2px) !important;
}

/* ── RATES + CALCULATOR ────────────────────────────────────── */
.section-rates { padding: 88px 0 !important; background: var(--white) !important; }
.section-rates h2 { font-size: clamp(28px,3vw,44px) !important; font-weight: 800 !important; color: var(--black) !important; letter-spacing: -.025em !important; }
.rates-table {
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-sm) !important;
}
.rates-table thead tr { background: linear-gradient(90deg, #f5f8ff 0%, #eef3ff 100%) !important; }
.rates-table th {
  padding: 14px 22px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  border-bottom: 2px solid var(--border) !important;
}
.rates-table td {
  padding: 14px 22px !important;
  font-size: 14.5px !important;
  color: var(--text) !important;
  border-bottom: 1px solid rgba(226,232,240,.6) !important;
  font-weight: 500 !important;
  transition: background .15s !important;
}
.rates-table tr:last-child td { border-bottom: none !important; }
.rates-table tbody tr:hover td { background: #f5f9ff !important; }
.rate-value {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--blue) !important;
}
.calculator-card {
  background: linear-gradient(145deg, #f8fbff 0%, #f0f5ff 100%) !important;
  border: 1.5px solid rgba(4,77,214,.12) !important;
  border-radius: 24px !important;
  padding: 34px !important;
  box-shadow: var(--shadow-md) !important;
}
.calculator-card h3 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--black) !important;
  margin-bottom: 24px !important;
  letter-spacing: -.015em !important;
}
.calc-field label {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  color: var(--muted) !important;
  margin-bottom: 7px !important;
  display: block !important;
}
.calc-field input, .calc-field select {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1.5px solid var(--border) !important;
  border-radius: 10px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  background: white !important;
  color: var(--text) !important;
  outline: none !important;
  transition: border-color .2s, box-shadow .2s !important;
  -webkit-appearance: none !important;
}
.calc-field input:focus, .calc-field select:focus {
  border-color: var(--blue) !important;
  box-shadow: 0 0 0 3.5px rgba(4,77,214,.12) !important;
}
.calc-result {
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-light) 100%) !important;
  border-radius: 14px !important;
  padding: 24px !important;
  text-align: center !important;
  margin-top: 20px !important;
  box-shadow: 0 8px 24px rgba(4,77,214,.35) !important;
  position: relative !important;
  overflow: hidden !important;
}
.calc-result::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: rgba(255,255,255,.3) !important;
}
.calc-result__amount {
  font-family: 'Outfit', sans-serif !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  color: white !important;
  line-height: 1 !important;
  letter-spacing: -.025em !important;
}
.calc-result__label {
  font-size: 13px !important;
  color: rgba(255,255,255,.75) !important;
  margin-top: 5px !important;
}

/* ── REVIEWS ───────────────────────────────────────────────── */
.section-reviews {
  padding: 88px 0 !important;
  background: var(--bg) !important;
}
.section-reviews__header h2 {
  font-size: clamp(28px,3vw,44px) !important;
  font-weight: 800 !important;
  color: var(--black) !important;
  letter-spacing: -.025em !important;
}
.reviews-grid { display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 24px !important; }
.review-card {
  background: var(--white) !important;
  border-radius: 20px !important;
  padding: 30px !important;
  border: 1px solid var(--border) !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s !important;
}
.review-card::before {
  content: '"' !important;
  position: absolute !important;
  top: 16px !important; right: 22px !important;
  font-family: Georgia, serif !important;
  font-size: 100px !important;
  font-weight: 900 !important;
  color: rgba(4,77,214,.06) !important;
  line-height: 1 !important;
  pointer-events: none !important;
}
.review-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--shadow-lg) !important;
  border-color: rgba(4,77,214,.2) !important;
}
.review-card__stars {
  font-size: 18px !important;
  letter-spacing: 2px !important;
  color: var(--gold) !important;
  margin-bottom: 16px !important;
  display: block !important;
}
.review-card__text {
  font-size: 14.5px !important;
  color: var(--muted) !important;
  line-height: 1.8 !important;
  margin-bottom: 22px !important;
  font-style: italic !important;
}
.review-card__name {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--black) !important;
}
.review-card__source {
  font-size: 11px !important;
  color: var(--muted) !important;
  margin-top: 3px !important;
}

/* ── FAQ ───────────────────────────────────────────────────── */
.section-faq { padding: 88px 0 !important; background: var(--white) !important; }
.section-faq__inner { display: grid !important; grid-template-columns: 1fr 1.6fr !important; gap: 80px !important; align-items: start !important; }
.section-faq__inner > div:first-child h2 {
  font-size: clamp(28px,3vw,42px) !important;
  font-weight: 800 !important;
  color: var(--black) !important;
  letter-spacing: -.025em !important;
}
.faq-item { border-bottom: 1px solid var(--border) !important; }
.faq-item__question {
  padding: 19px 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--text) !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  transition: color .2s !important;
}
.faq-item__question:hover, .faq-item__question.active { color: var(--blue) !important; }
.faq-item__icon {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  border: 1.5px solid var(--border) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
  transition: all .25s var(--ease-back) !important;
  color: var(--muted) !important;
}
.faq-item__question.active .faq-item__icon {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: white !important;
  transform: rotate(45deg) scale(1.1) !important;
}
.faq-item__answer p { padding: 0 0 20px !important; font-size: 14.5px !important; color: var(--muted) !important; line-height: 1.85 !important; }

/* ── FOOTER ────────────────────────────────────────────────── */
.site-footer {
  background: linear-gradient(160deg, #071a5e 0%, #0432a8 40%, #0235a8 100%) !important;
  color: white !important;
  position: relative !important;
  overflow: hidden !important;
}
.site-footer::before {
  content: '' !important;
  position: absolute !important;
  top: -200px !important; right: -200px !important;
  width: 500px !important; height: 500px !important;
  background: radial-gradient(circle, rgba(255,255,255,.04) 0%, transparent 60%) !important;
  pointer-events: none !important;
}
.footer__top { padding: 60px 0 48px !important; position: relative !important; z-index: 1 !important; }
.footer__grid {
  display: grid !important;
  grid-template-columns: 1.7fr 1fr 1fr 1fr !important;
  gap: 48px !important;
}
.footer__logo-text {
  font-family: 'Outfit', sans-serif !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  color: white !important;
  letter-spacing: -.025em !important;
  display: block !important;
  margin-bottom: 14px !important;
}
.footer__tagline { font-size: 13.5px !important; color: rgba(255,255,255,.6) !important; line-height: 1.75 !important; max-width: 270px !important; margin-bottom: 24px !important; }
.footer__col-title {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  color: rgba(255,255,255,.36) !important;
  margin-bottom: 18px !important;
  display: block !important;
}
.footer__links { display: flex !important; flex-direction: column !important; gap: 9px !important; }
.footer__links a {
  font-size: 13.5px !important;
  color: rgba(255,255,255,.65) !important;
  transition: color .2s, transform .2s !important;
  display: block !important;
}
.footer__links a:hover { color: white !important; transform: translateX(3px) !important; }
.footer__contact { display: flex !important; flex-direction: column !important; gap: 10px !important; }
.footer__contact a { font-size: 13.5px !important; color: rgba(255,255,255,.65) !important; display: flex !important; align-items: flex-start !important; gap: 8px !important; transition: color .2s !important; }
.footer__contact a:hover { color: white !important; }
.newsletter-form {
  display: flex !important;
  gap: 8px !important;
  margin-top: 20px !important;
}
.newsletter-form input {
  flex: 1 !important;
  padding: 11px 15px !important;
  background: rgba(255,255,255,.09) !important;
  border: 1.5px solid rgba(255,255,255,.22) !important;
  border-radius: 10px !important;
  color: white !important;
  font-size: 13px !important;
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  outline: none !important;
  transition: border-color .2s, background .2s !important;
}
.newsletter-form input::placeholder { color: rgba(255,255,255,.4) !important; }
.newsletter-form input:focus { border-color: rgba(255,255,255,.55) !important; background: rgba(255,255,255,.14) !important; }
.newsletter-form button {
  padding: 11px 20px !important;
  background: rgba(255,255,255,.18) !important;
  border: 1.5px solid rgba(255,255,255,.32) !important;
  border-radius: 10px !important;
  color: white !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all .2s var(--ease) !important;
}
.newsletter-form button:hover { background: rgba(255,255,255,.28) !important; transform: translateY(-1px) !important; }
.footer__bottom {
  padding: 20px 0 !important;
  border-top: 1px solid rgba(255,255,255,.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  position: relative !important;
  z-index: 1 !important;
}
.footer__copy { font-size: 12px !important; color: rgba(255,255,255,.38) !important; }
.footer__bottom-links a { font-size: 12px !important; color: rgba(255,255,255,.38) !important; transition: color .2s !important; }
.footer__bottom-links a:hover { color: rgba(255,255,255,.75) !important; }

/* ── PAGE HEROES ───────────────────────────────────────────── */
.page-hero {
  background: linear-gradient(145deg, #022fa0 0%, #044dd6 50%, #1350d0 100%) !important;
  padding: 72px 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
.page-hero::before {
  content: '' !important;
  position: absolute !important;
  top: -200px !important; right: -150px !important;
  width: 500px !important; height: 500px !important;
  background: radial-gradient(circle, rgba(255,255,255,.07) 0%, transparent 60%) !important;
  pointer-events: none !important;
}
.page-hero h1 { color: white !important; font-weight: 800 !important; letter-spacing: -.03em !important; }
.page-hero p { color: rgba(255,255,255,.82) !important; font-size: 17px !important; line-height: 1.7 !important; }
.page-hero .accent-label { background: rgba(255,255,255,.14) !important; border-color: rgba(255,255,255,.24) !important; color: rgba(255,255,255,.95) !important; }
.breadcrumbs, .breadcrumbs a { color: rgba(255,255,255,.62) !important; font-size: 12px !important; }
.breadcrumbs span { color: rgba(255,255,255,.9) !important; }
.page-hero__actions .btn--white {
  background: white !important;
  color: var(--blue) !important;
  border: none !important;
  padding: 13px 28px !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.14) !important;
  transition: all .25s var(--ease) !important;
}
.page-hero__actions .btn--white:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 24px rgba(0,0,0,.2) !important; }
.page-hero__actions a[href^="tel"],
.page-hero__actions .btn--ghost {
  background: rgba(255,255,255,.1) !important;
  color: white !important;
  border: 1.5px solid rgba(255,255,255,.4) !important;
  padding: 13px 28px !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: all .25s var(--ease) !important;
}
.page-hero__actions a[href^="tel"]:hover,
.page-hero__actions .btn--ghost:hover {
  background: rgba(255,255,255,.2) !important;
  border-color: rgba(255,255,255,.7) !important;
  transform: translateY(-2px) !important;
}

/* ── SERVICE PAGES ─────────────────────────────────────────── */
.service-stat-box {
  background: linear-gradient(145deg, var(--blue-tint), #ddeaff) !important;
  border: 1.5px solid rgba(4,77,214,.18) !important;
  border-radius: 22px !important;
  padding: 30px !important;
  text-align: center !important;
  box-shadow: var(--shadow-md) !important;
}
.service-stat-box__number {
  font-family: 'Outfit', sans-serif !important;
  font-size: 62px !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, var(--blue), var(--blue-light)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  line-height: 1 !important;
  display: block !important;
}
.qualify-card {
  background: var(--white) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: 22px !important;
  padding: 30px !important;
  box-shadow: var(--shadow-md) !important;
  position: sticky !important;
  top: 96px !important;
  transition: box-shadow .3s !important;
}
.qualify-card:hover { box-shadow: var(--shadow-lg) !important; }
.qualify-card h3 { font-size: 19px !important; font-weight: 700 !important; color: var(--black) !important; margin-bottom: 16px !important; }
.qualify-list li {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(226,232,240,.6) !important;
  font-size: 14px !important;
  color: var(--muted) !important;
  list-style: none !important;
  transition: color .2s !important;
}
.qualify-list li:hover { color: var(--text) !important; }
.qualify-list li:last-child { border-bottom: none !important; }
.qualify-list li::before {
  content: '✓' !important;
  width: 20px !important;
  height: 20px !important;
  background: linear-gradient(135deg, var(--blue-tint), rgba(4,77,214,.12)) !important;
  border: 1px solid rgba(4,77,214,.2) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  color: var(--blue) !important;
  flex-shrink: 0 !important;
}
.qualify-card .btn--primary {
  width: 100% !important;
  justify-content: center !important;
  padding: 14px !important;
  background: linear-gradient(135deg, var(--blue), var(--blue-light)) !important;
  border: none !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 16px rgba(4,77,214,.3) !important;
  transition: all .25s var(--ease) !important;
}
.qualify-card .btn--primary:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 24px rgba(4,77,214,.45) !important; }

/* ── ABOUT PAGE ────────────────────────────────────────────── */
.about-stat {
  background: linear-gradient(145deg, var(--blue-tint), #ddeaff) !important;
  border: 1.5px solid rgba(4,77,214,.15) !important;
  border-radius: 20px !important;
  padding: 26px 20px !important;
  text-align: center !important;
  transition: transform .3s var(--ease), box-shadow .3s !important;
}
.about-stat:hover { transform: translateY(-5px) !important; box-shadow: var(--shadow-lg) !important; }
.about-stat__number {
  font-family: 'Outfit', sans-serif !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, var(--blue), var(--blue-light)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.team-card {
  background: var(--white) !important;
  border-radius: 22px !important;
  border: 1px solid var(--border) !important;
  overflow: hidden !important;
  transition: transform .3s var(--ease), box-shadow .3s, border-color .3s !important;
}
.team-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--shadow-xl) !important;
  border-color: rgba(4,77,214,.25) !important;
}
.team-card__role { color: var(--blue) !important; font-weight: 600 !important; }

/* ════════════════════════════════════════════════════════════
   MONTFORT-INSPIRED CLEAN ANIMATIONS
   ════════════════════════════════════════════════════════════ */

/* -- Smooth scrolling -- */
html {
  scroll-behavior: smooth !important;
}

/* -- Base reveal (hidden) — gentle fade + rise -- */
.reveal {
  opacity: 0 !important;
  transform: translateY(40px) !important;
  transition:
    opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  will-change: opacity, transform !important;
}
.reveal.visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* -- Slide from left -- */
.reveal--left {
  opacity: 0 !important;
  transform: translateX(-40px) !important;
  transition:
    opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  will-change: opacity, transform !important;
}
.reveal--left.visible {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* -- Slide from right -- */
.reveal--right {
  opacity: 0 !important;
  transform: translateX(40px) !important;
  transition:
    opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  will-change: opacity, transform !important;
}
.reveal--right.visible {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* -- Stagger delays -- */
.reveal-delay-1 { transition-delay: .10s !important; }
.reveal-delay-2 { transition-delay: .20s !important; }
.reveal-delay-3 { transition-delay: .30s !important; }
.reveal-delay-4 { transition-delay: .40s !important; }
.reveal-delay-5 { transition-delay: .50s !important; }
.reveal-delay-6 { transition-delay: .60s !important; }

/* -- Custom cursor (mont-fort inspired) -- */
#mfy-cursor {
  position: fixed;
  top: 0; left: 0;
  z-index: 99999;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  will-change: transform;
  mix-blend-mode: difference;
}
.mfy-cursor__ring {
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 1.5px solid rgba(4, 77, 214, 0.5);
  position: absolute;
  top: -22px; left: -22px;
  transition: width 0.3s ease, height 0.3s ease, top 0.3s ease, left 0.3s ease, border-color 0.3s ease;
}
.mfy-cursor__dot {
  width: 4px; height: 4px;
  border-radius: 50%;
  background: #044dd6;
  position: absolute;
  top: -2px; left: -2px;
  transition: transform 0.3s ease, background 0.3s ease;
}
#mfy-cursor.mfy-cursor--active .mfy-cursor__ring {
  width: 60px; height: 60px;
  top: -30px; left: -30px;
  border-color: rgba(4, 77, 214, 0.3);
}
#mfy-cursor.mfy-cursor--active .mfy-cursor__dot {
  transform: scale(2);
}

/* -- Respect reduced motion -- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .reveal,
  .reveal--left,
  .reveal--right {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
  }
  #mfy-cursor { display: none !important; }
}

/* ── STICKY MOBILE CTA ─────────────────────────────────────── */
.sticky-cta {
  display: none !important;
  position: fixed !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 999 !important;
  background: white !important;
  padding: 12px 20px !important;
  box-shadow: 0 -4px 24px rgba(0,0,0,.12) !important;
  border-top: 1px solid var(--border) !important;
  gap: 10px !important;
}
.sticky-cta a {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 13px !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-align: center !important;
}
.sticky-cta .cta-apply { background: linear-gradient(135deg,var(--blue),var(--blue-light)) !important; color: white !important; }
.sticky-cta .cta-call  { background: var(--blue-tint) !important; color: var(--blue) !important; border: 1.5px solid rgba(4,77,214,.2) !important; }
@media (max-width: 768px) {
  .sticky-cta { display: flex !important; }
  body { padding-bottom: 80px !important; }
}

/* ── SECTION DIVIDERS ──────────────────────────────────────── */
.section-tabs, .section-reviews { position: relative !important; }

/* ── CONTACT FORM ──────────────────────────────────────────── */
.contact-grid { gap: 64px !important; }
.contact-item__icon {
  background: linear-gradient(145deg, var(--blue-tint), #ddeaff) !important;
  border: 1.5px solid rgba(4,77,214,.18) !important;
  box-shadow: 0 2px 8px rgba(4,77,214,.1) !important;
  transition: transform .2s var(--ease) !important;
}
.contact-item:hover .contact-item__icon { transform: scale(1.08) !important; }

/* ── UTILITY ───────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px !important; }
::-webkit-scrollbar-track { background: transparent !important; }
::-webkit-scrollbar-thumb { background: rgba(4,77,214,.3) !important; border-radius: 3px !important; }
::-webkit-scrollbar-thumb:hover { background: var(--blue) !important; }
::selection { background: rgba(4,77,214,.18) !important; color: var(--blue) !important; }

/* ── RESPONSIVE ────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .section-hero__inner { grid-template-columns: 1fr !important; }
  .section-hero__image { display: none !important; }
  .reviews-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
  .footer__grid { grid-template-columns: 1fr 1fr !important; gap: 36px !important; }
}
@media (max-width: 768px) {
  h1.h1, .section-hero h1 { font-size: clamp(32px,8vw,48px) !important; }
  .section-hero { padding: 56px 0 48px !important; }
  .section-editors, .section-tabs, .section-rates, .section-reviews, .section-faq { padding: 64px 0 !important; }
  .section-cta { padding: 60px 0 !important; }
  .section-editors__inner { grid-template-columns: 1fr !important; gap: 40px !important; }
  .section-faq__inner { grid-template-columns: 1fr !important; gap: 36px !important; }
  .section-rates__inner { grid-template-columns: 1fr !important; }
  .footer__grid { grid-template-columns: 1fr !important; }
  .tabs-nav { overflow-x: auto !important; flex-wrap: nowrap !important; }
}


/* ================================================================
   PREMIUM UPGRADE — Elite Conversion Design System
   ================================================================ */

/* ── Google Fonts upgrade ─────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300..800;1,9..40,300..800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --font:    'Plus Jakarta Sans', 'Plus Jakarta Sans', 'DM Sans', sans-serif;
  --gradient-hero:   linear-gradient(135deg, #0432b8 0%, #044dd6 40%, #1a6ef7 100%);
  --gradient-blue:   linear-gradient(135deg, #044dd6 0%, #1a6ef7 100%);
  --gradient-dark:   linear-gradient(135deg, #020c2b 0%, #041a5e 100%);
  --gradient-card:   linear-gradient(145deg, #ffffff 0%, #f4f7ff 100%);
  --glow-blue:       0 0 40px rgba(4,77,214,0.3);
  --glow-sm:         0 0 20px rgba(4,77,214,0.15);
  --shadow-card:     0 2px 8px rgba(0,0,0,0.04), 0 12px 40px rgba(4,77,214,0.08);
  --shadow-hover:    0 8px 24px rgba(0,0,0,0.08), 0 24px 64px rgba(4,77,214,0.14);
  --shadow-float:    0 20px 60px rgba(4,77,214,0.18), 0 4px 16px rgba(0,0,0,0.06);
}

/* ── Global font upgrade ──────────────────────────────────── */
*, *::before, *::after { font-family: var(--font) !important; }
.header__logo-text, .footer__logo-text,
.section-hero__stat-num, .tabs-content__stat,
.calc-result__amount, .about-stat__number,
.service-stat-box__number { font-family: 'Outfit', sans-serif !important; }

/* ── Smooth scroll + selection color ─────────────────────── */
html { scroll-behavior: smooth; }
::selection { background: rgba(4,77,214,0.15); color: #044dd6; }

/* ── Scroll reveal base ──────────────────────────────────── */
/* duplicate reveal block removed */

/* ════════════════════════════════════════════════════════════
   TOP BAR
   ════════════════════════════════════════════════════════════ */
.top-bar {
  background: linear-gradient(90deg, #020e3a 0%, #041a5e 50%, #020e3a 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
.top-bar__links a { font-size: 12px !important; letter-spacing: 0.01em !important; }
.top-bar__links a:hover { opacity: 0.75 !important; }

/* ════════════════════════════════════════════════════════════
   HEADER — glassmorphism sticky nav
   ════════════════════════════════════════════════════════════ */
.site-header {
  background: rgba(255,255,255,0.92) !important;
  backdrop-filter: blur(20px) saturate(1.8) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.8) !important;
  border-bottom: none !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.04) !important;
}
.site-header.scrolled {
  box-shadow: 0 2px 32px rgba(0,0,0,0.1) !important;
}
.header__logo-text {
  font-size: 22px !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  letter-spacing: -0.03em !important;
}
.header__nav a {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  padding: 7px 14px !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
  position: relative !important;
}
.header__nav a:hover {
  color: #044dd6 !important;
  background: rgba(4,77,214,0.07) !important;
}
.header__cta .btn--outline {
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
  border: 1.5px solid rgba(4,77,214,0.3) !important;
  color: #044dd6 !important;
  transition: all 0.2s ease !important;
}
.header__cta .btn--outline:hover {
  border-color: #044dd6 !important;
  background: rgba(4,77,214,0.05) !important;
}
.header__cta .btn--primary {
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(4,77,214,0.35) !important;
  transition: all 0.22s ease !important;
}
.header__cta .btn--primary:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 24px rgba(4,77,214,0.45) !important;
}

/* ════════════════════════════════════════════════════════════
   HERO — premium gradient mesh
   ════════════════════════════════════════════════════════════ */
.section-hero {
  background: #ffffff !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 80px 0 80px !important;
}
/* Hero blobs removed — unified page background replaces them */
.section-hero .accent-label {
  background: linear-gradient(135deg, rgba(4,77,214,0.08), rgba(26,110,247,0.06)) !important;
  border: 1px solid rgba(4,77,214,0.18) !important;
  color: #044dd6 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  padding: 6px 16px !important;
  backdrop-filter: blur(4px) !important;
}
.section-hero__title {
  font-size: clamp(42px, 5.5vw, 72px) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.04em !important;
  color: #050d1f !important;
}
.section-hero__title span { 
  background: linear-gradient(135deg, #044dd6 0%, #1a6ef7 60%, #0099ff 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.section-hero__subtitle {
  font-size: 18px !important;
  line-height: 1.7 !important;
  color: #5a6478 !important;
  font-weight: 400 !important;
  max-width: 460px !important;
}
.section-hero__actions .btn--primary {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  border: none !important;
  box-shadow: 0 6px 20px rgba(4,77,214,0.38) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  padding: 15px 32px !important;
  border-radius: 12px !important;
  transition: all 0.25s ease !important;
}
.section-hero__actions .btn--primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 32px rgba(4,77,214,0.5) !important;
}
.section-hero__trust {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 16px 10px 14px !important;
  background: #ffffff !important;
  border: 1px solid rgba(4,77,214,0.12) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 16px rgba(4,77,214,0.08), 0 1px 3px rgba(0,0,0,0.05) !important;
}
.trust-badge__score {
  font-size: 1.65rem !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  line-height: 1 !important;
  letter-spacing: -0.5px !important;
}
.trust-badge__right {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
}
.trust-badge__stars {
  color: #f59e0b !important;
  font-size: 13px !important;
  letter-spacing: 2px !important;
  line-height: 1 !important;
}
.trust-badge__label {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #64748b !important;
}
/* Hero visual — richer gradient */
.section-hero__image {
  background: linear-gradient(135deg, #dbe8ff 0%, #b8ceff 30%, #4d7ef5 70%, #044dd6 100%) !important;
  border-radius: 28px !important;
  box-shadow: var(--shadow-float) !important;
  min-height: 480px !important;
}
.section-hero__image::before {
  background: 
    radial-gradient(circle at 30% 40%, rgba(255,255,255,0.4) 0%, transparent 50%),
    radial-gradient(circle at 75% 15%, rgba(255,255,255,0.2) 0%, transparent 40%) !important;
}
.section-hero__stat {
  border-radius: 20px !important;
  box-shadow: 0 8px 32px rgba(4,77,214,0.18), 0 2px 8px rgba(0,0,0,0.06) !important;
  padding: 22px 28px !important;
  background: rgba(255,255,255,0.97) !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255,255,255,0.9) !important;
  transition: transform 0.25s ease !important;
}
.section-hero__stat:hover { transform: translateY(-3px) scale(1.02) !important; }
.section-hero__stat-num {
  font-size: 52px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.section-hero__badge {
  background: rgba(255,255,255,0.95) !important;
  border-radius: 100px !important;
  padding: 10px 20px !important;
  box-shadow: 0 8px 24px rgba(4,77,214,0.18) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255,255,255,0.95) !important;
  animation: floatBadge 3s ease-in-out infinite !important;
}
@keyframes floatBadge {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
.section-hero__visual .btn {
  background: linear-gradient(135deg, #0340b0, #044dd6) !important;
  box-shadow: 0 8px 24px rgba(4,77,214,0.35) !important;
  border-radius: 100px !important;
  font-weight: 700 !important;
  animation: floatBadge 3.5s ease-in-out 0.4s infinite !important;
}

/* ════════════════════════════════════════════════════════════
   LENDER CAROUSEL — premium redesign
   ════════════════════════════════════════════════════════════ */
.section-lenders {
  padding: 28px 0 !important;
  background: #f8faff !important;
  border-top: 1px solid rgba(4,77,214,0.07) !important;
  border-bottom: 1px solid rgba(4,77,214,0.07) !important;
}
.section-lenders__count {
  font-size: 48px !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  line-height: 1 !important;
}
.section-lenders__label {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  color: #9ca3af !important;
  text-transform: uppercase !important;
}
.section-lenders__divider {
  background: linear-gradient(180deg, transparent, rgba(4,77,214,0.2), transparent) !important;
}
.lender-logo-img {
  width: 110px !important;
  height: 44px !important;
  object-fit: contain !important;
  border-radius: 10px !important;
  filter: grayscale(20%) !important;
  transition: all 0.3s ease !important;
  opacity: 0.85 !important;
}
.lender-item:hover .lender-logo-img {
  filter: grayscale(0%) !important;
  opacity: 1 !important;
  transform: scale(1.08) translateY(-3px) !important;
  filter: drop-shadow(0 4px 12px rgba(4,77,214,0.2)) !important;
}
.lender-name {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #b0b8c8 !important;
  letter-spacing: 0.02em !important;
  transition: color 0.2s !important;
}
.lender-item:hover .lender-name { color: #044dd6 !important; }

/* ════════════════════════════════════════════════════════════
   INTRO — elevated typography
   ════════════════════════════════════════════════════════════ */
.section-editors { 
  background: #ffffff !important;
  padding: 100px 0 !important;
}
.section-editors__col h2 {
  font-size: clamp(30px, 3.8vw, 50px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.12 !important;
  color: #050d1f !important;
}
.section-editors__item {
  padding: 13px 0 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  transition: all 0.2s ease !important;
  border-bottom: 1px solid #f1f3f8 !important;
}
.section-editors__item:hover { padding-left: 8px !important; color: #044dd6 !important; }
.section-editors__check {
  width: 24px !important; height: 24px !important;
  background: linear-gradient(135deg, rgba(4,77,214,0.1), rgba(26,110,247,0.06)) !important;
  border: 1.5px solid rgba(4,77,214,0.2) !important;
  border-radius: 50% !important;
  color: #044dd6 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  transition: all 0.2s !important;
}
.section-editors__item:hover .section-editors__check {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  color: white !important;
  border-color: transparent !important;
}

/* ════════════════════════════════════════════════════════════
   SERVICES TABS — premium card style
   ════════════════════════════════════════════════════════════ */
.section-tabs {
  background: linear-gradient(180deg, #f8faff 0%, #eef3ff 100%) !important;
  padding: 100px 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
.section-tabs::before {
  content: '' !important;
  position: absolute !important;
  top: 0; left: 0; right: 0; bottom: 0 !important;
  background: radial-gradient(ellipse at 50% 0%, rgba(4,77,214,0.04) 0%, transparent 60%) !important;
  pointer-events: none !important;
}
.section-tabs__header h2 {
  font-size: clamp(28px, 3.5vw, 46px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: #050d1f !important;
}
.tabs-nav {
  border-bottom: 2px solid rgba(4,77,214,0.12) !important;
  gap: 4px !important;
  margin-bottom: 40px !important;
}
.tabs-nav__btn {
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 10px 18px !important;
  color: #6b7280 !important;
  border-radius: 10px 10px 0 0 !important;
  transition: all 0.2s ease !important;
  position: relative !important;
  bottom: -2px !important;
}
.tabs-nav__btn:hover { color: #044dd6 !important; background: rgba(4,77,214,0.04) !important; }
.tabs-nav__btn.active {
  color: #044dd6 !important;
  font-weight: 700 !important;
  border-bottom: 2px solid #044dd6 !important;
  background: rgba(4,77,214,0.04) !important;
}
.tabs-content__stat {
  font-size: clamp(80px, 11vw, 120px) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  letter-spacing: -0.05em !important;
  background: linear-gradient(135deg, #044dd6 0%, #1a6ef7 60%, #0099ff 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.tabs-content__stat-text {
  font-size: 14px !important;
  color: #9ca3af !important;
  line-height: 1.5 !important;
  max-width: 240px !important;
  font-weight: 400 !important;
}
.tabs-content__body h3 {
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  color: #050d1f !important;
}
.tabs-content__body p {
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: #6b7280 !important;
}
.tabs-content__body .btn {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(4,77,214,0.3) !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  transition: all 0.22s ease !important;
}
.tabs-content__body .btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 28px rgba(4,77,214,0.45) !important;
}
.tabs-content__image-placeholder {
  border-radius: 24px !important;
  background: linear-gradient(145deg, #dce8ff 0%, #b8ceff 40%, rgba(4,77,214,0.25) 100%) !important;
  box-shadow: var(--shadow-float) !important;
  transition: transform 0.4s ease, box-shadow 0.4s ease !important;
}
.tabs-content__image-placeholder:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 28px 80px rgba(4,77,214,0.22) !important;
}

/* ════════════════════════════════════════════════════════════
   CTA SECTIONS — premium gradient
   ════════════════════════════════════════════════════════════ */
.section-cta {
  background: linear-gradient(135deg, #020e3a 0%, #041a5e 35%, #044dd6 70%, #1a6ef7 100%) !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 80px 0 !important;
}
.section-cta::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
  pointer-events: none !important;
}
.section-cta::after {
  content: '' !important;
  position: absolute !important;
  top: -100px; right: -100px;
  width: 400px; height: 400px;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(26,110,247,0.3) 0%, transparent 65%) !important;
  pointer-events: none !important;
}
.section-cta__inner {
  position: relative !important;
  z-index: 1 !important;
}
.section-cta__inner h2 {
  font-size: clamp(32px, 4vw, 52px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.08 !important;
  color: #fff !important;
  text-shadow: 0 2px 20px rgba(0,0,0,0.15) !important;
}
.section-cta__inner p {
  font-size: 17px !important;
  color: rgba(255,255,255,0.78) !important;
  max-width: 520px !important;
  line-height: 1.7 !important;
}
.section-cta .btn--white {
  background: rgba(255,255,255,0.97) !important;
  color: #044dd6 !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.2) !important;
  border: 2px solid rgba(255,255,255,0.97) !important;
  transition: all 0.25s ease !important;
}
.section-cta .btn--white:hover {
  background: #fff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,0.28) !important;
}
.section-cta .btn--ghost {
  background: rgba(255,255,255,0.08) !important;
  color: #fff !important;
  border: 1.5px solid rgba(255,255,255,0.3) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(8px) !important;
  font-weight: 600 !important;
  transition: all 0.25s ease !important;
}
.section-cta .btn--ghost:hover {
  background: rgba(255,255,255,0.16) !important;
  border-color: rgba(255,255,255,0.6) !important;
  transform: translateY(-2px) !important;
}
.section-cta .accent-label {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.2) !important;
  color: rgba(255,255,255,0.9) !important;
  backdrop-filter: blur(4px) !important;
}

/* CTA Light variant — differentiated second CTA */
.section-cta--light {
  background: linear-gradient(135deg, #f0f4ff 0%, #e8eeff 50%, #dde6ff 100%) !important;
}
.section-cta--light::before,
.section-cta--light::after { display: none !important; }
.section-cta--light .section-cta__inner h2 {
  color: #0f172a !important;
  text-shadow: none !important;
}
.section-cta--light .section-cta__inner p {
  color: #475569 !important;
}
.section-cta--light .btn--primary {
  background: #044dd6 !important;
  color: #fff !important;
}
.section-cta--light .btn--outline,
.section-cta--light .btn--book-cta {
  border-color: #044dd6 !important;
  color: #044dd6 !important;
  margin-top: 0 !important;
}
.section-cta--light .btn--outline:hover,
.section-cta--light .btn--book-cta:hover {
  background: #044dd6 !important;
  color: #fff !important;
}

/* ════════════════════════════════════════════════════════════
   CALCULATOR & RATES — premium layout
   ════════════════════════════════════════════════════════════ */
.section-rates {
  background: #ffffff !important;
  padding: 100px 0 !important;
}
.section-rates h2 {
  font-size: clamp(28px, 3.5vw, 46px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
}
.rates-table {
  border: 1px solid rgba(4,77,214,0.1) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 16px rgba(4,77,214,0.06) !important;
}
.rates-table thead tr {
  background: linear-gradient(135deg, #f4f7ff, #eff3ff) !important;
}
.rates-table th {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: #9ca3af !important;
  padding: 14px 22px !important;
}
.rates-table td {
  padding: 14px 22px !important;
  font-size: 15px !important;
  color: #374151 !important;
  border-bottom: 1px solid rgba(4,77,214,0.05) !important;
  transition: background 0.15s !important;
}
.rates-table tr:hover td { background: #f5f8ff !important; }
.rate-value {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #044dd6 !important;
  font-variant-numeric: tabular-nums !important;
}
.calculator-card {
  background: linear-gradient(145deg, #f8faff, #f0f4ff) !important;
  border-radius: 24px !important;
  border: 1px solid rgba(4,77,214,0.1) !important;
  box-shadow: 0 4px 24px rgba(4,77,214,0.08) !important;
  padding: 36px !important;
}
.calculator-card h3 {
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #050d1f !important;
}
.calc-field label {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #9ca3af !important;
}
.calc-field input, .calc-field select {
  border: 1.5px solid rgba(4,77,214,0.12) !important;
  border-radius: 12px !important;
  background: #fff !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #050d1f !important;
  padding: 12px 16px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03) !important;
}
.calc-field input:focus, .calc-field select:focus {
  border-color: #044dd6 !important;
  box-shadow: 0 0 0 4px rgba(4,77,214,0.1), 0 2px 8px rgba(0,0,0,0.03) !important;
  outline: none !important;
}
.calc-result {
  background: linear-gradient(135deg, #044dd6 0%, #1a6ef7 100%) !important;
  border-radius: 16px !important;
  padding: 26px !important;
  box-shadow: 0 8px 24px rgba(4,77,214,0.35) !important;
  margin-top: 20px !important;
  position: relative !important;
  overflow: hidden !important;
}
.calc-result::before {
  content: '' !important;
  position: absolute !important;
  top: -40px; right: -40px;
  width: 120px; height: 120px;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.07) !important;
}
.calc-result__amount {
  font-size: 42px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: #fff !important;
}
.calc-result__label {
  font-size: 13px !important;
  color: rgba(255,255,255,0.7) !important;
  font-weight: 500 !important;
}
.calculator-card .btn--outline {
  width: 100% !important;
  margin-top: 16px !important;
  border-radius: 12px !important;
  border: 1.5px solid rgba(4,77,214,0.25) !important;
  color: #044dd6 !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}
.calculator-card .btn--outline:hover {
  background: #044dd6 !important;
  color: #fff !important;
  border-color: #044dd6 !important;
}

/* ════════════════════════════════════════════════════════════
   REVIEWS — floating cards
   ════════════════════════════════════════════════════════════ */
.section-reviews {
  background: linear-gradient(180deg, #f8faff 0%, #eef3ff 100%) !important;
  padding: 100px 0 !important;
}
.section-reviews__header h2 {
  font-size: clamp(28px, 3.5vw, 46px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: #050d1f !important;
}
.review-card {
  background: #fff !important;
  border-radius: 24px !important;
  padding: 32px !important;
  border: 1px solid rgba(4,77,214,0.07) !important;
  box-shadow: var(--shadow-card) !important;
  transition: all 0.3s ease !important;
  position: relative !important;
  overflow: hidden !important;
}
.review-card::before {
  content: '"' !important;
  position: absolute !important;
  top: 16px; right: 24px !important;
  font-size: 80px !important;
  font-family: Georgia, serif !important;
  color: rgba(4,77,214,0.06) !important;
  line-height: 1 !important;
  font-weight: 700 !important;
}
.review-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--shadow-hover) !important;
  border-color: rgba(4,77,214,0.12) !important;
}
.review-card__stars {
  color: #f59e0b !important;
  font-size: 16px !important;
  letter-spacing: 2px !important;
  margin-bottom: 16px !important;
  display: block !important;
}
.review-card__text {
  font-size: 14px !important;
  line-height: 1.85 !important;
  color: #4b5563 !important;
  font-style: italic !important;
  margin-bottom: 22px !important;
  font-weight: 400 !important;
}
.review-card__name {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #050d1f !important;
  letter-spacing: -0.01em !important;
}
.review-card__source {
  font-size: 11px !important;
  color: #9ca3af !important;
  font-weight: 500 !important;
  margin-top: 2px !important;
}

/* ════════════════════════════════════════════════════════════
   FAQ — clean accordion
   ════════════════════════════════════════════════════════════ */
.section-faq {
  background: #ffffff !important;
  padding: 100px 0 !important;
}
.section-faq__inner > div:first-child h2 {
  font-size: clamp(28px, 3.5vw, 46px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: #050d1f !important;
}
.faq-item {
  border-bottom: 1px solid rgba(4,77,214,0.08) !important;
}
.faq-item__question {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #1a1f2e !important;
  padding: 20px 0 !important;
  transition: all 0.2s ease !important;
  letter-spacing: -0.01em !important;
}
.faq-item__question:hover, .faq-item__question.active {
  color: #044dd6 !important;
}
.faq-item__icon {
  width: 28px !important; height: 28px !important;
  border-radius: 50% !important;
  border: 1.5px solid rgba(4,77,214,0.2) !important;
  background: rgba(4,77,214,0.04) !important;
  color: #044dd6 !important;
  font-size: 16px !important;
  transition: all 0.25s ease !important;
}
.faq-item__question.active .faq-item__icon {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  border-color: transparent !important;
  color: #fff !important;
  transform: rotate(45deg) !important;
  box-shadow: 0 4px 12px rgba(4,77,214,0.3) !important;
}
.faq-item__answer p {
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: #6b7280 !important;
  padding-bottom: 20px !important;
}

/* ════════════════════════════════════════════════════════════
   FOOTER — premium dark
   ════════════════════════════════════════════════════════════ */
.site-footer {
  background: linear-gradient(150deg, #020c2b 0%, #041640 50%, #031258 100%) !important;
  position: relative !important;
  overflow: hidden !important;
}
.site-footer::before {
  content: '' !important;
  position: absolute !important;
  top: 0; left: 0; right: 0; height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(4,77,214,0.5), rgba(26,110,247,0.5), transparent) !important;
}
.site-footer::after {
  content: '' !important;
  position: absolute !important;
  bottom: -200px; right: -200px;
  width: 500px; height: 500px;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(4,77,214,0.08) 0%, transparent 65%) !important;
  pointer-events: none !important;
}
.footer__top { position: relative; z-index: 1; }
.footer__logo-text {
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: #fff !important;
  display: block !important;
  margin-bottom: 14px !important;
}
.footer__tagline {
  color: rgba(255,255,255,0.75) !important;
  font-size: 13px !important;
  line-height: 1.75 !important;
}
.footer__col-title {
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,0.55) !important;
  margin-bottom: 18px !important;
  display: block !important;
}
.footer__links a {
  color: rgba(255,255,255,0.78) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  transition: all 0.2s ease !important;
  padding: 3px 0 !important;
  display: block !important;
}
.footer__links a:hover {
  color: #fff !important;
  transform: translateX(4px) !important;
}
.newsletter-form input {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px !important;
  color: #fff !important;
  font-size: 13px !important;
  padding: 11px 16px !important;
  transition: all 0.2s ease !important;
}
.newsletter-form input:focus {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(4,77,214,0.6) !important;
  box-shadow: 0 0 0 3px rgba(4,77,214,0.15) !important;
}
.newsletter-form button {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  padding: 11px 20px !important;
  box-shadow: 0 4px 16px rgba(4,77,214,0.4) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}
.newsletter-form button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 24px rgba(4,77,214,0.5) !important;
}
.footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.07) !important;
  padding: 20px 0 !important;
  position: relative; z-index: 1 !important;
}
.footer__copy, .footer__bottom-links a {
  font-size: 12px !important;
  color: rgba(255,255,255,0.55) !important;
}
.footer__bottom-links a:hover { color: rgba(255,255,255,0.85) !important; }

/* ════════════════════════════════════════════════════════════
   PAGE HEROES — inner pages
   ════════════════════════════════════════════════════════════ */
.page-hero {
  background: linear-gradient(135deg, #020e3a 0%, #041a5e 40%, #0432b8 75%, #1a6ef7 100%) !important;
  padding: 80px 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
.page-hero::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.015'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
  pointer-events: none !important;
}
.page-hero::after {
  content: '' !important;
  position: absolute !important;
  top: -150px; right: -150px;
  width: 450px; height: 450px;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(26,110,247,0.25) 0%, transparent 65%) !important;
  pointer-events: none !important;
}
.page-hero h1 {
  font-size: clamp(34px, 4.5vw, 56px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  color: #fff !important;
  position: relative; z-index: 1 !important;
  line-height: 1.08 !important;
}
.page-hero p {
  color: rgba(255,255,255,0.78) !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  position: relative; z-index: 1 !important;
}
.page-hero .accent-label {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.18) !important;
  color: rgba(255,255,255,0.88) !important;
  backdrop-filter: blur(4px) !important;
  position: relative; z-index: 1 !important;
}
.page-hero__actions { position: relative; z-index: 1 !important; }
.breadcrumbs { position: relative; z-index: 1 !important; }

/* ════════════════════════════════════════════════════════════
   SERVICE PAGES
   ════════════════════════════════════════════════════════════ */
.service-stat-box {
  background: linear-gradient(145deg, #eff7ff, #deeeff) !important;
  border: 1px solid rgba(4,77,214,0.15) !important;
  border-radius: 24px !important;
  box-shadow: 0 4px 20px rgba(4,77,214,0.08) !important;
  text-align: center !important;
  padding: 32px !important;
}
.service-stat-box__number {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  font-size: 62px !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
}
.qualify-card {
  background: #fff !important;
  border: 1px solid rgba(4,77,214,0.08) !important;
  border-radius: 24px !important;
  box-shadow: var(--shadow-card) !important;
  transition: box-shadow 0.3s ease !important;
}
.qualify-card:hover { box-shadow: var(--shadow-hover) !important; }
.qualify-list li {
  border-bottom: 1px solid rgba(4,77,214,0.05) !important;
  transition: padding-left 0.2s ease !important;
}
.qualify-list li:hover { padding-left: 8px !important; color: #044dd6 !important; }

/* ════════════════════════════════════════════════════════════
   ABOUT PAGE
   ════════════════════════════════════════════════════════════ */
.about-stat {
  background: linear-gradient(145deg, #eff7ff, #deeeff) !important;
  border: 1px solid rgba(4,77,214,0.12) !important;
  border-radius: 22px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 12px rgba(4,77,214,0.06) !important;
}
.about-stat:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 32px rgba(4,77,214,0.14) !important;
}
.about-stat__number {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.team-card {
  border-radius: 24px !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
  box-shadow: var(--shadow-card) !important;
  border: 1px solid rgba(4,77,214,0.06) !important;
}
.team-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--shadow-hover) !important;
}
.team-card__role {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  font-weight: 700 !important;
}

/* ════════════════════════════════════════════════════════════
   GLOBAL BUTTONS — premium system
   ════════════════════════════════════════════════════════════ */
.btn--primary {
  background: linear-gradient(135deg, #044dd6, #1a6ef7) !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(4,77,214,0.32) !important;
  font-weight: 700 !important;
  transition: all 0.22s cubic-bezier(.22,1,.36,1) !important;
  letter-spacing: -0.01em !important;
}
.btn--primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px rgba(4,77,214,0.46) !important;
}
.btn--primary:active { transform: translateY(0) !important; }

/* ════════════════════════════════════════════════════════════
   CONTACT FORM
   ════════════════════════════════════════════════════════════ */
.contact-grid input[type=text],
.contact-grid input[type=email],
.contact-grid input[type=tel],
.contact-grid textarea {
  border: 1.5px solid rgba(4,77,214,0.12) !important;
  border-radius: 12px !important;
  background: #fafbff !important;
  font-size: 15px !important;
  color: #050d1f !important;
  transition: all 0.2s ease !important;
}
.contact-grid input:focus,
.contact-grid textarea:focus {
  border-color: #044dd6 !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(4,77,214,0.1) !important;
}

/* ════════════════════════════════════════════════════════════
   ACCENT LABELS — global
   ════════════════════════════════════════════════════════════ */
.accent-label {
  background: linear-gradient(135deg, rgba(4,77,214,0.08), rgba(26,110,247,0.05)) !important;
  border: 1px solid rgba(4,77,214,0.15) !important;
  color: #044dd6 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  padding: 5px 14px !important;
  border-radius: 100px !important;
}

/* ════════════════════════════════════════════════════════════
   CUSTOM SCROLLBAR
   ════════════════════════════════════════════════════════════ */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f8faff; }
::-webkit-scrollbar-thumb { 
  background: linear-gradient(180deg, #044dd6, #1a6ef7);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: #044dd6; }



/* ============================================================
   MOBILE SPACING & OVERFLOW FIXES (must be last to win cascade)
   ============================================================ */
@media (max-width: 768px) {
  /* Tighten all major section padding on mobile */
  .section-rates { padding: 40px 0 !important; }
  .section-reviews { padding: 40px 0 !important; }
  .section-faq { padding: 40px 0 !important; }
  .section-posts { padding: 40px 0 !important; }
  .section-editors { padding: 40px 0 !important; }
  .section-cta { padding: 36px 0 !important; }
  .mfy-banner-cta { padding: 32px 0 !important; }
  .mfy-form-section,
  .mfy-form-section--bottom { padding: 40px 0 !important; }
  .mfy-proof { padding: 24px 0 !important; }

  /* Fix lender carousel horizontal overflow */
  .section-lenders { overflow: hidden !important; }
  .section-lenders__carousel-wrap { overflow: hidden !important; }
  .section-lenders__track { overflow: hidden !important; }

  /* Fix footer horizontal overflow */
  .footer__grid { grid-template-columns: 1fr !important; gap: 24px !important; }
  .site-footer { overflow-x: hidden !important; }
  .footer__top { padding: 36px 0 32px !important; }

  /* Global horizontal overflow prevention */
  html, body { overflow-x: hidden !important; max-width: 100vw !important; }
  .container { padding-left: 20px !important; padding-right: 20px !important; }

  /* Rates grid stack on mobile */
  .section-rates__inner { grid-template-columns: 1fr !important; gap: 28px !important; }

  /* Editors grid stack on mobile */
  .section-editors__inner { grid-template-columns: 1fr !important; gap: 28px !important; }

  /* FAQ grid stack on mobile */
  .section-faq__inner { grid-template-columns: 1fr !important; gap: 24px !important; }

  /* Reviews grid single column */
  .reviews-grid { grid-template-columns: 1fr !important; gap: 16px !important; }

  /* Form section bottom padding */
  .mfy-form-section--bottom .container { padding-bottom: 0 !important; }
}

/* ════════════════════════════════════════════════════════════
   404 PAGE
   ════════════════════════════════════════════════════════════ */
.mfy-404 { padding: 100px 0 80px; text-align: center; min-height: 60vh; display: flex; align-items: center; margin-top: 16px; }
.mfy-404 .container { max-width: 640px; }
.mfy-404__code { font-size: 120px; font-weight: 900; color: var(--blue, #044dd6); line-height: 1; letter-spacing: -4px; margin-bottom: 16px; }
.mfy-404__title { font-size: clamp(24px, 4vw, 36px); font-weight: 800; color: #0f172a; margin: 0 0 12px; }
.mfy-404__desc { font-size: 17px; color: #64748b; line-height: 1.7; margin: 0 0 32px; }
.mfy-404__actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 48px; }
.mfy-404__popular { border-top: 1px solid #e2e8f0; padding-top: 32px; }
.mfy-404__popular-title { font-size: 14px; font-weight: 700; color: #0f172a; margin: 0 0 16px; }
.mfy-404__popular-links { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.mfy-404__popular-links a { color: var(--blue, #044dd6); font-size: 14px; text-decoration: none; font-weight: 600; }
.mfy-404__popular-links a:hover { text-decoration: underline; }
.mfy-404__popular-links span { color: #94a3b8; }

/* ════════════════════════════════════════════════════════════
   MEGA MENU NAV LINKS
   ════════════════════════════════════════════════════════════ */
/* Mega menu structure */
.mfy-mega {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 780px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.15);
  padding: 0;
  z-index: 1000;
}
.mfy-mega__header {
  padding: 20px 24px 12px;
  background: linear-gradient(135deg, #0d0d2b, #1a1a4e);
  border-radius: 16px 16px 0 0;
  color: #fff;
}
.mfy-mega__title { font-size: 1.05rem; font-weight: 700; }
.mfy-mega__subtitle { font-size: 0.8rem; opacity: 0.7; }
.mfy-mega__grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  padding: 16px 20px;
}
.mfy-mega__col { padding: 0 8px; }
.mfy-mega__col--bordered { border-left: 1px solid #f0f0f0; }
.mfy-mega__col-title {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #044dd6;
  margin-bottom: 10px;
}
.mfy-mega__footer {
  padding: 12px 24px;
  border-top: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.mfy-mega__footer-note { font-size: 0.8rem; color: #64748b; }
.mfy-mega__view-all {
  font-size: 0.85rem;
  font-weight: 600;
  color: #044dd6;
  text-decoration: none;
}

/* Mega menu nav links */
.mfy-mega-link {
  display: block;
  padding: 7px 10px;
  border-radius: 8px;
  text-decoration: none;
  color: #1a1a2e;
  font-size: 0.88rem;
  font-weight: 500;
  transition: background 0.15s;
}
.mfy-mega-link:hover,
.mfy-mega-link:focus {
  background: #f0f4ff;
}

/* ════════════════════════════════════════════════════════════
   EXIT INTENT POPUP
   ════════════════════════════════════════════════════════════ */
.mfy-exit-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0,0,0,.6);
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.mfy-exit-card {
  background: #fff;
  border-radius: 16px;
  max-width: 440px;
  width: 100%;
  padding: 36px 28px;
  text-align: center;
  position: relative;
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
}
.mfy-exit-card__close {
  position: absolute;
  top: 12px;
  right: 16px;
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #64748b;
}
.mfy-exit-card__title {
  font-size: 1.4rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 8px;
}
.mfy-exit-card__desc {
  color: #475569;
  font-size: 0.95rem;
  line-height: 1.6;
  margin: 0 0 24px;
}
.mfy-exit-card__cta {
  display: inline-block;
  padding: 14px 32px;
  background: #044dd6;
  color: #fff;
  border-radius: 10px;
  font-weight: 700;
  font-size: 1rem;
  text-decoration: none;
  margin-bottom: 12px;
}
.mfy-exit-card__link {
  color: #044dd6;
  font-size: 0.9rem;
  text-decoration: underline;
}

/* ════════════════════════════════════════════════════════════
   ACCESSIBILITY: prefers-reduced-motion
   ════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .section-lenders__track {
    animation: none !important;
  }
  .section-lenders__track:hover {
    animation-play-state: paused !important;
  }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ════════════════════════════════════════════════════════════
   CONSENT CHECKBOX — branded custom styling
   ════════════════════════════════════════════════════════════ */
.mfy-form__consent input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  min-width: 20px;
  border: 2px solid #cbd5e1;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  position: relative;
  transition: background 0.15s, border-color 0.15s;
  margin-top: 2px;
  flex-shrink: 0;
}
.mfy-form__consent input[type="checkbox"]:checked {
  background: #044dd6;
  border-color: #044dd6;
}
.mfy-form__consent input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 6px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
}
.mfy-form__consent input[type="checkbox"]:focus-visible {
  outline: 2px solid #044dd6;
  outline-offset: 2px;
}

/* Visually hidden — accessible to screen readers */
.mfy-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ════════════════════════════════════════════════════════════
   CONTAINED CARD SECTIONS — rounded, non-full-bleed
   Applies to CTA, proof bar, banner CTA, and lenders
   ════════════════════════════════════════════════════════════ */

/* -- CTA Section -- */
.section-cta--contained {
  background: transparent !important;
  padding: 0 !important;
}
/* Uniform CTA buttons */
.section-cta__card .btn {
  min-width: 200px !important;
  min-height: 55px !important;
  padding: 14px 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
}
.section-cta__card {
  background: linear-gradient(135deg, #020e3a 0%, #041a5e 40%, #0432b8 75%, #1a6ef7 100%);
  border-radius: 24px;
  padding: 64px 48px;
  overflow: hidden;
  position: relative;
}
.section-cta__card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 20% 50%, rgba(53,98,212,.3) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.06) 0%, transparent 50%);
  pointer-events: none;
}

/* -- Proof Bar -- */
.mfy-proof--contained {
  background: transparent !important;
  padding: 0 !important;
}
.mfy-proof__card {
  background: linear-gradient(135deg, #0a1628 0%, #122a4e 40%, #044dd6 100%);
  border-radius: 24px;
  padding: 56px 32px;
  overflow: hidden;
}

/* -- Banner CTA -- */
.mfy-banner-cta--contained {
  background: transparent !important;
  padding: 0 !important;
}
.mfy-banner-cta__card {
  background: linear-gradient(135deg, #044dd6 0%, #0339a0 100%);
  border-radius: 24px;
  padding: 56px 48px;
  text-align: center;
  color: #fff;
  overflow: hidden;
  position: relative;
}
.mfy-banner-cta__card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 0%, rgba(255,255,255,.08) 0%, transparent 60%);
  pointer-events: none;
}
.mfy-banner-cta__card h2 {
  font-size: clamp(22px, 2.5vw, 32px);
  font-weight: 800;
  color: #fff;
  margin: 0 0 6px;
}
.mfy-banner-cta__card p {
  font-size: 15px;
  color: rgba(255,255,255,.8);
  margin: 0;
}

/* -- Lenders Section -- */
.section-lenders--contained {
  background: transparent !important;
  padding: 0 !important;
  border-top: none !important;
  border-bottom: none !important;
}
.section-lenders__card {
  background: #fff;
  border-radius: 24px;
  padding: 28px 32px;
  border: 1px solid var(--border);
  box-shadow: 0 4px 24px rgba(0,0,0,.04);
  overflow: hidden;
}

/* ════════════════════════════════════════════════════════════
   CLEAN CARD STYLING (mont-fort inspired)
   ════════════════════════════════════════════════════════════ */

/* (atmosphere elements removed — clean design) */
/* -- Clean white card surfaces (no glass morphism) -- */
.section-hero,
.section-editors,
.section.section-rates,
.section-tabs,
.section.section-reviews,
.section-faq,
.section-posts,
.mfy-form-section,
.page-section-card,
.svc-content,
.svc-trust,
.svc-inline-card,
.section-logos,
.mfy-404 {
  background: #fff !important;
  border: none !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.02) !important;
  transition: box-shadow 0.4s ease, transform 0.4s ease !important;
}

/* -- Dark card surfaces (heroes, CTAs) — subtle shadow -- */
.page-hero,
.cpage-hero,
.svc-hero,
.section-cta__card,
.mfy-proof__card,
.mfy-banner-cta__card,
.page-cta-card,
.svc-mid-cta,
.svc-bottom-form {
  box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}

/* ════════════════════════════════════════════════════════════
   TYPOGRAPHY — Clean and refined
   ════════════════════════════════════════════════════════════ */
body {
  font-family: 'Plus Jakarta Sans', 'DM Sans', sans-serif !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
}
h1, h2, h3, .h1, .h2, .h3,
.section-hero h1,
.page-hero h1,
.cpage-hero h1,
.svc-hero__title {
  font-family: 'Outfit', sans-serif !important;
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
}
h4, h5, h6, .h4, .h5, .h6 {
  font-family: 'DM Sans', sans-serif !important;
  letter-spacing: -0.01em !important;
}
.accent-label,
.section-hero__stat-label,
.about-stat__label,
.cpage-label {
  font-family: 'DM Sans', sans-serif !important;
  letter-spacing: 0.12em !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}
.section-hero__stat-num,
.about-stat__number,
.cpage-result-amt,
.cpage-stat-val {
  font-family: 'Outfit', sans-serif !important;
  letter-spacing: -0.03em !important;
  font-weight: 300 !important;
}

/* ════════════════════════════════════════════════════════════
   CARD-BASED SECTION LAYOUT — rounded cards on single background
   ════════════════════════════════════════════════════════════ */

/* -- White card sections -- */
.section-hero,
.section-editors,
.section.section-rates,
.section-tabs,
.section.section-reviews,
.section-faq,
.section-posts,
.mfy-form-section,
.mfy-404 {
  background: #fff !important;
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 12px !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
  overflow: hidden !important;
  border: none !important;
}

/* -- Trust text below rates grid -- */
.rates-trust-below {
  text-align: center;
  font-size: 0.82rem;
  color: #6b7280;
  padding: 12px 0 0;
}

/* Tighten bottom padding on rates section */
.section.section-rates {
  padding-bottom: 48px !important;
}

/* -- Promo rates as standalone card -- */
.section-promo-rates {
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
.section-promo-rates .promo-section {
  margin-top: 0 !important;
  border-radius: 24px !important;
}

/* -- Bottom form section — dark blue like CTA cards -- */
.mfy-form-section--bottom {
  background: linear-gradient(135deg, #020e3a 0%, #041a5e 40%, #0432b8 75%, #1a6ef7 100%) !important;
  position: relative !important;
}
.mfy-form-section--bottom::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 20% 50%, rgba(53,98,212,0.25) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 20%, rgba(255,255,255,0.04) 0%, transparent 50%);
  pointer-events: none;
}
.mfy-form-section--bottom h2 {
  color: #fff !important;
}
.mfy-form-section--bottom > .container > p,
.mfy-form-section--bottom p[style*="color"] {
  color: rgba(255,255,255,0.7) !important;
}
.mfy-form-section--bottom .mfy-form {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  backdrop-filter: blur(8px) !important;
}
.mfy-form-section--bottom .mfy-form input,
.mfy-form-section--bottom .mfy-form select {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: #fff !important;
}
.mfy-form-section--bottom .mfy-form input::placeholder {
  color: rgba(255,255,255,0.45) !important;
}
.mfy-form-section--bottom .mfy-form select {
  color: rgba(255,255,255,0.6) !important;
}
.mfy-form-section--bottom .mfy-form select option {
  background: #0a1a4a !important;
  color: #fff !important;
}
.mfy-form-section--bottom .mfy-form label,
.mfy-form-section--bottom .mfy-form .mfy-consent-text,
.mfy-form-section--bottom .mfy-form .mfy-shield-note {
  color: rgba(255,255,255,0.55) !important;
}
.mfy-form-section--bottom .mfy-form .mfy-consent-text a {
  color: rgba(255,255,255,0.75) !important;
}
.mfy-form-section--bottom .mfy-disclaimer {
  color: rgba(255,255,255,0.45) !important;
}
.mfy-form-section--bottom .mfy-disclaimer a {
  color: rgba(255,255,255,0.6) !important;
}

/* Tighten bottom form section — remove dead space below disclaimer */
.mfy-form-section--bottom {
  padding-bottom: 48px !important;
}
.mfy-form-section--bottom .container {
  padding-bottom: 0 !important;
}

/* ═══════════════════════════════════════════════════════════
   UNIFORM HERO ACTION BUTTONS — same size across all pages
   ═══════════════════════════════════════════════════════════ */
.page-hero__actions .btn,
.cpage-hero .btn,
.svc-hero .btn {
  min-width: 210px !important;
  min-height: 55px !important;
  padding: 14px 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  font-size: 0.95rem !important;
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL RULE: White text on all dark / blue backgrounds
   ═══════════════════════════════════════════════════════════ */
.page-hero,
.page-hero h1,
.page-hero p,
.page-hero span,
.cpage-hero,
.cpage-hero h1,
.cpage-hero p,
.cpage-hero span,
.svc-hero,
.svc-hero h1,
.svc-hero p,
.svc-hero span,
.svc-mid-cta,
.svc-mid-cta h2,
.svc-mid-cta p,
.svc-mid-cta span,
.svc-cta-bottom,
.svc-cta-bottom h2,
.svc-cta-bottom p,
.section-cta__card,
.section-cta__card h2,
.section-cta__card p,
.section-cta__card span,
.mfy-proof__card,
.mfy-proof__card h2,
.mfy-proof__card p,
.mfy-proof__card span,
.mfy-banner-cta__card,
.mfy-banner-cta__card h2,
.mfy-banner-cta__card p,
.mfy-banner-cta__card span,
.page-cta-card,
.page-cta-card h2,
.page-cta-card p,
.page-cta-card span,
.mfy-form-section--bottom h2,
.mfy-form-section--bottom p,
.mfy-form-section--bottom span {
  color: #fff !important;
}
.page-hero p,
.cpage-hero p,
.svc-hero p,
.svc-mid-cta p,
.svc-cta-bottom p,
.section-cta__card p,
.mfy-proof__card p,
.mfy-banner-cta__card p,
.page-cta-card p,
.mfy-form-section--bottom > .container > p {
  color: rgba(255,255,255,0.75) !important;
}
.page-hero .accent-label,
.cpage-hero .accent-label,
.svc-hero .accent-label,
.section-cta__card .accent-label,
.mfy-proof__card .accent-label,
.mfy-banner-cta__card .accent-label,
.page-cta-card .accent-label {
  color: rgba(255,255,255,0.6) !important;
  border-color: rgba(255,255,255,0.2) !important;
}

/* -- Inner page hero cards -- */
.page-hero,
.cpage-hero,
.svc-hero {
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  overflow: hidden !important;
}
.cpage-body {
  background: #fff !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  border-radius: 24px !important;
  overflow: visible !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
}

/* -- Service page section cards -- */
.svc-content,
.svc-trust {
  background: #fff !important;
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
  overflow: hidden !important;
}
.svc-mid-cta,
.svc-bottom-form {
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  overflow: hidden !important;
}

/* -- Booking page card -- */
.mfy-booking-page-wrapper {
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  overflow: hidden !important;
}

/* -- About / Contact section cards -- */
.page-section-card {
  background: #fff !important;
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
  overflow: hidden !important;
  padding: 48px 32px 40px !important;
}
/* Dark gradient inner-page CTA card */
.page-cta-card {
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  overflow: hidden !important;
}
/* Map section card */
.page-map-card {
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  overflow: hidden !important;
}

/* Dark CTA section cards */
.section-cta--contained,
.mfy-proof--contained,
.mfy-banner-cta--contained,
.section-lenders--contained {
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  border-radius: 24px !important;
  overflow: hidden !important;
}

/* -- Make inner containers fill the full card width -- */
.section-cta--contained > .container,
.mfy-proof--contained > .container,
.mfy-banner-cta--contained > .container,
.section-lenders--contained > .container,
.section-promo-rates > .container {
  max-width: 100% !important;
  padding: 0 !important;
}

/* -- Uniform spacing: every card gets exactly 12px top margin -- */
.section-hero,
.section-editors,
.section.section-rates,
.section-tabs,
.section.section-reviews,
.section-faq,
.section-posts,
.mfy-form-section,
.mfy-404,
.section-promo-rates,
.section-cta--contained,
.mfy-proof--contained,
.mfy-banner-cta--contained,
.section-lenders--contained,
.site-footer,
.page-section-card,
.svc-inline-card,
.section-logos,
.page-cta-card,
.page-map-card {
  margin-top: 12px !important;
  margin-bottom: 0 !important;
}

/* -- Neutralize inner section padding/borders inside card wrappers -- */
.section-lenders--contained.section-lenders {
  padding: 0 !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
}
.mfy-proof--contained.mfy-proof {
  padding: 0 !important;
}

/* Footer card */
.site-footer {
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  border-radius: 24px 24px 0 0 !important;
  overflow: hidden !important;
}

/* -- Service page inline section cards -- */
.svc-inline-card {
  background: #fff !important;
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
  overflow: hidden !important;
}

/* Lender logos card */
.section-logos {
  border-radius: 24px !important;
  max-width: 1248px !important;
  margin: 12px auto 0 !important;
  overflow: hidden !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
}

/* ════════════════════════════════════════════════════════════
   SERVICE PAGE — How It Works / Key Benefits / Testimonials
   (extracted from inline styles — fixes #2 & #3)
   ════════════════════════════════════════════════════════════ */

/* -- Shared narrow container for inner sections -- */
.svc-narrow { max-width: 900px; }

/* -- Shared section header block -- */
.svc-section-header { text-align: center; margin-bottom: 40px; }
.svc-section-header .h3 { margin-top: 8px; }

/* -- How It Works -- */
.hiw-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.hiw-step { text-align: center; }
.hiw-step__number {
  width: 56px;
  height: 56px;
  background: #044dd6;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  font-weight: 800;
  margin: 0 auto 16px;
}
.hiw-step__title { font-size: 1.05rem; margin-bottom: 8px; }
.hiw-step__text  { color: #666; font-size: 0.92rem; line-height: 1.5; }

@media (max-width: 768px) {
  .hiw-grid { grid-template-columns: 1fr; gap: 24px; }
}

/* -- Key Benefits -- */
.kb-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.kb-card {
  display: flex;
  gap: 14px;
  padding: 20px;
  background: #f8fafc;
  border-radius: 12px;
}
.kb-card__icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background: #e8f0fe;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kb-card__title { font-size: 0.95rem; }
.kb-card__text  { color: #666; font-size: 0.88rem; margin-top: 4px; line-height: 1.4; }

@media (max-width: 600px) {
  .kb-grid { grid-template-columns: 1fr; }
}

/* -- Testimonials -- */
.testi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.testi-card {
  background: #fff;
  border-radius: 14px;
  padding: 28px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}
.testi-card__label {
  display: flex;
  gap: 4px;
  margin-bottom: 14px;
  color: #f59e0b;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: .05em;
}
.testi-card__text {
  color: #333;
  font-size: 0.95rem;
  line-height: 1.6;
  margin-bottom: 16px;
}
.testi-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #eee;
  padding-top: 14px;
}
.testi-card__name     { font-size: 0.92rem; }
.testi-card__location { color: #888; font-size: 0.82rem; margin-top: 2px; }
.testi-card__badge {
  background: #e8f0fe;
  color: #044dd6;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
}

@media (max-width: 700px) {
  .testi-grid { grid-template-columns: 1fr; }
}

/* ── Visual Audit Fix #5: Mobile card side margins ─── */
@media (max-width: 768px) {
  .section-hero,
  .section-editors,
  .section-tabs,
  .section.section-rates,
  .section.section-reviews,
  .section-faq,
  .section-posts,
  .mfy-form-section,
  .mfy-form-section--bottom,
  .section-cta--contained,
  .mfy-proof--contained,
  .mfy-banner-cta--contained,
  .section-lenders--contained,
  .section-promo-rates,
  .page-hero,
  .cpage-hero,
  .svc-hero,
  .svc-content,
  .svc-trust,
  .svc-mid-cta,
  .svc-bottom-form,
  .page-section-card,
  .page-cta-card,
  .page-map-card,
  .mfy-booking-page-wrapper,
  .cpage-body,
  .mfy-404 {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }
}

/* ── Visual Audit Fix #7: Lender label minimum size ─── */
.section-lenders__label {
  font-size: 12px !important;
}

/* ── Visual Audit Fix #9: Equal-height review cards ─── */
.review-card {
  display: flex !important;
  flex-direction: column !important;
}
.review-card__text {
  flex: 1 !important;
}

/* ── Visual Audit Fix #11: Accent labels min 12px on mobile ─── */
@media (max-width: 768px) {
  .accent-label {
    font-size: 12px !important;
  }

  /* ── Visual Audit Fix #16: Footer clears sticky CTA bar ─── */
  .site-footer {
    padding-bottom: 44px !important;
  }
}