/*
Theme Name:  LoanCenter Redesign
Author: Nowcom
Version:     1.8.3
Text Domain: loancenter-redesign
*/

/* ── Reset ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Inter', sans-serif; color: #0d1f3c; }
img  { display: block; max-width: 100%; }
a    { text-decoration: none; }

/* ── Design Tokens ──────────────────────────────────── */
:root {
  --navy:       #0d1f3c;
  --dark-blue:  #152640;
  --mid-blue:   #2b4c81;
  --brand-blue: #1a69c4;
  --cyan:       #01a1c8;
  --cyan-alt:   #00a8e8;
  --text-muted: #3d5a7a;
  --text-body:  #2a3d55;
  --grad-btn:   linear-gradient(90deg, #05a1dd 0%, #1b3f68 56%, #000000 100%);
  --grad-hero:  linear-gradient(169deg, #0199be 0%, #1a3d76 100%);
  --shadow-btn: 0 8px 30px rgba(26,105,196,0.25);
}

/* ── Layout helpers ─────────────────────────────────── */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ════════════════════════════════════════════════════ *
 *  NAVBAR
 * ════════════════════════════════════════════════════ */
.navbar {
  background: #fff;
  border-bottom: 1px solid #eaeaea;
  height: 69px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}
.navbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  max-width: 1266px;
  margin: 0 auto;
}
.navbar__logo img {
  width: 144.19px;
  height: auto;
}
.navbar__links {
  display: flex;
  align-items: center;
  gap: 32px;
  list-style: none;
}
.navbar__links a {
  font-weight: 700;
  font-size: 14px;
  color: var(--mid-blue);
  line-height: 20px;
  white-space: nowrap;
}
.navbar__links a:hover { 
  opacity: .75; 
  text-decoration: none;
}

/* ── Dropdown menus ── */
.navbar__links li {
  position: relative;
  list-style: none;
}
/* Hidden by default */
.navbar__links .sub-menu {
  display: none;
  position: absolute;
  top: 130%;
  left: 0;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(13, 31, 60, 0.12), 0 2px 6px rgba(13, 31, 60, 0.06);
  list-style: none;
  padding: 8px 0;
  margin: 0;
  min-width: 210px;
  z-index: 500;
}
/* Invisible bridge fills the gap between the nav link and the dropdown
   so the mouse doesn't leave the hover zone while crossing it */
.navbar__links .sub-menu::before {
  content: "";
  position: absolute;
  top: -12px;
  left: 0;
  right: 0;
  height: 12px;
}
/* Show on hover of the parent li */
.navbar__links .menu-item-has-children:hover > .sub-menu,
.navbar__links .menu-item-has-children:focus-within > .sub-menu {
  display: block;
}
/* Submenu links */
.navbar__links .sub-menu a {
  display: block;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  color: #0d1f3c;
  white-space: nowrap;
  opacity: 1;
}
.navbar__links .sub-menu a:hover {
  color: #01a1c8;
  opacity: 1;
  background: #f7fafd;
}

.navbar__actions {
  display: flex;
  align-items: center;
  gap: 16px;
}
.btn-phone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 160px;
  height: 36px;
  padding: 11px 16px;
  box-sizing: border-box;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  box-shadow: var(--shadow-btn);
  border: none;
  border-radius: 9999px;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  line-height: 14px;
  color: #fff;
  white-space: nowrap;
  cursor: pointer;
}
.btn-signin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 109px;
  height: 36px;
  padding: 11px 16px;
  box-sizing: border-box;
  background: #000;
  box-shadow: var(--shadow-btn);
  border: none;
  border-radius: 9999px;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  line-height: 14px;
  color: #fff;
  white-space: nowrap;
  cursor: pointer;
}
.btn-signin img { width: 20px; height: 20px; }
.navbar__extra {
  display: flex;
  align-items: center;
  gap: 16px;
}
.navbar__extra a {
  font-weight: 700;
  font-size: 14px;
  color: var(--mid-blue);
}

/* ════════════════════════════════════════════════════ *
 *  HERO
 * ════════════════════════════════════════════════════ */
.hero {
  position: relative;
  background: var(--grad-hero);
  height: 787px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* decorative circles */
.hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hero__circle {
  position: absolute;
  background: rgba(255,255,255,0.07);
  border: none;
  border-radius: 50%;
}
.hero__circle--1 { width: 340px; height: 340px; left: 50%; transform: translateX(-270%); top: 35%; opacity: 0.5; }
.hero__circle--2 { width: 440px; height: 440px; left: 50%; transform: translateX(-40%); bottom: -41px; opacity: 0.5; }
.hero__circle--3 { width: 500px; height: 500px; left: 50%; transform: translateX(72%); top: -105px; opacity: 0.5; }
.hero__circle--4 { width: 220px; height: 220px; right: 50%; transform: translate(-40%, -100px); opacity: 0.5; }

.hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: 545px auto;
  align-items: center;
  justify-content: center;
  gap: 62px;
  width: calc(100% - 62px);
  margin-top: -98px;
}

.hero__headline {
  font-family: 'Roboto', sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 80px;
  letter-spacing: -1px;
  color: #fff;
  margin-bottom: 16px;
}
.hero__headline strong { font-weight: 700; }
.hero__subline {
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  color: #fff;
  margin-bottom: 24px;
}
.btn-hero {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  width: 188px;
  height: 50px;
  border-radius: 9999px;
  background: var(--grad-btn);
  border: 2px solid var(--cyan);
  box-shadow: var(--shadow-btn);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  white-space: nowrap;
}
.btn-hero:hover { opacity: .9; color: #fff; text-decoration: none; }

.hero__photos {
  position: relative;
  height: 425px;
}
.hero__ring {
  position: absolute;
  left: 305.5px;
  top: -66px;
  width: 363px;
  height: 363px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.hero__ring img { width: 100%; height: 100%; }
.hero__dots {
  position: absolute;
  left: -9.5px;
  top: 276px;
  width: 205px;
  height: 196px;
  pointer-events: none;
  z-index: 0;
}
.hero__dots img {
  width: 100%;
  height: 100%;
}
.hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 207px 207px;
  column-gap: 12px;
  row-gap: 12px;
  margin-left: 39.5px;
}
.hero__photo {
  border-radius: 20px;
  border: 7px solid rgba(255,255,255,.4);
  overflow: hidden;
  position: relative;
}
.hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.0);
}
.hero__photo--tl img { transform: scale(1.04); }
.hero__photo--tr img { transform-origin: 0% 63%; }
.hero__photo--bl img { transform: scale(1.01) scaleX(1) translateY(0px); transform-origin: 50% 20%; }
.hero__photo--br img { transform: scale(1) scaleX(1); object-position: 50% center; }
.hero__photo--tl { border-radius: 50px 3px 3px 20px; }
.hero__photo--tr { border-radius: 3px 40px 20px 3px; position: relative; top: 35px; }
.hero__photo--bl { border-radius: 20px 3px 3px 40px; }
.hero__photo--br { border-radius: 3px 20px 40px 3px; position: relative; top: 35px; }

.hero__badge {
  position: absolute;
  right: -20px;
  top: 210px;
  background: rgba(255,255,255,.95);
  border-radius: 20px;
  padding: 16px 20px;
  box-shadow: 0 4px 16px rgba(13,31,60,.1), 0 2px 6px rgba(13,31,60,.06);
  white-space: nowrap;
  z-index: 2;
}
.hero__badge-sub  { font-size: 15px; font-weight: 500; color: #6b8099; line-height: 18px; }
.hero__badge-main { font-size: 18px; font-weight: 700; color: var(--brand-blue); line-height: 27px; white-space: nowrap; }

/* ════════════════════════════════════════════════════ *
 *  FINANCING OPTIONS PANEL
 * ════════════════════════════════════════════════════ */
.financing {
  position: relative;
  margin-top: -99px;
  z-index: 3;
  padding: 0 20px 60px;
  background: linear-gradient(180deg, rgba(247,250,253,0) 0px, rgba(247,250,253,0) 99px, #f7fafd 99px);
}
.financing__panel {
  max-width: 1185px;
  min-height: 674px;
  margin: 0 auto;
  border-radius: 56px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(27, 63, 104, 1) 81%, rgba(28, 98, 125, 1) 117%);
  padding: 54px 62px 30px;
}
.financing__title {
  font-family: 'Inter', sans-serif;
  font-size: 34px;
  font-weight: 800;
  line-height: 34px;
  letter-spacing: 0;
  color: #fff;
  margin-bottom: 16px;
}
.financing__desc {
  max-width: 1082px;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 25.5px;
  letter-spacing: 0.26px;
  color: #fff;
  margin-bottom: 18px;
}
.financing__chips {
  display: flex;
  gap: 12px;
  margin-bottom: 22px;
}
.financing__chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 32px;
  border-radius: 9999px;
  padding: 6px 16px;
  background: #3abddd;
  color: #d8f5ff;
  font-weight: 700;
  font-size: 13px;
  line-height: 1;
  letter-spacing: 0.2px;
  text-transform: uppercase;
}
.financing__chip--priority { width: 189px; }
.financing__chip--profiles { width: 178px; }
.financing__cards {
  display: grid;
  grid-template-columns: repeat(4, 250.25px);
  justify-content: center;
  gap: 24px;
}
.financing-card {
  width: 250.25px;
  height: 365px;
  background: #ffffff;
  border-radius: 20px 60px 20px 20px;
  border-top: 1px solid #eef2f7;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0 1px 2px rgba(13, 31, 60, 0.04), 0 1px 3px rgba(13, 31, 60, 0.08);
}
.financing-card__icon {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: rgba(255, 247, 232, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0;
}
.financing-card__icon svg {
  width: 24px;
  height: 24px;
  stroke: #2874d0;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.financing-card__icon img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}
.financing-card h3 {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: -0.3px;
  color: #0d1f3c;
  margin-bottom: 0;
}
.financing-card p {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 24px;
  color: #3d5a7a;
  letter-spacing: 0;
}
.financing-card__cta {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 51px;
  width: 100%;
  border-radius: 9999px;
  background: linear-gradient(90deg, #05a1dd 0%, #2b4c81 100%);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  box-shadow: 0 8px 30px rgba(26,105,196,0.25);
}
.financing__note {
  text-align: center;
  margin-top: 20px;
  font-family: 'Inter', sans-serif;
  color: #ffffff;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
}

/* Mobile nav drawer */
.navbar__overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 999; }
.navbar__overlay.is-open { display: block; }
.navbar__mobile {
  position: fixed; top: 0; right: -320px; width: 300px; height: 100%; background: #fff;
  z-index: 1000; transition: right 0.3s ease; padding: 24px 20px;
  display: flex; flex-direction: column; gap: 20px;
  box-shadow: -4px 0 24px rgba(0,0,0,0.18); overflow-y: auto;
}
.navbar__mobile.is-open { right: 0; }
.navbar__mobile-header { display: flex; align-items: center; justify-content: space-between; }
.navbar__mobile-header img { width: 120px; height: auto; }
.navbar__mobile-close { background: none; border: none; cursor: pointer; padding: 4px; display: flex; align-items: center; justify-content: center; }
.navbar__mobile-links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.navbar__mobile-links li { border-bottom: 1px solid #eaeaea; list-style: none; }
.navbar__mobile-links a { display: block; padding: 14px 0; font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 600; color: #0d1f3c; text-decoration: none; }
.navbar__mobile-links a:hover { color: #01a1c8; }
/* Mobile sub-menu */
.navbar__mobile-links .sub-menu { list-style: none; padding: 0; margin: 0; background: #f7fafd; }
.navbar__mobile-links .sub-menu li { border-bottom: none; border-top: 1px solid #eaeaea; }
.navbar__mobile-links .sub-menu a { padding: 11px 0 11px 20px; font-size: 14px; font-weight: 500; color: #3d5a7a; }
.navbar__mobile-links .sub-menu a:hover { color: #01a1c8; }
.navbar__mobile-actions { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
.navbar__mobile-btn-phone { display: flex !important; width: 100%; justify-content: center; }
.navbar__mobile-btn-signin { display: flex !important; width: 100%; justify-content: center; }

/* ════════════════════════════════════════════════════ *
 *  VALUE PROPS – "How It Works"
 * ════════════════════════════════════════════════════ */
.value-props {
  background: linear-gradient(180deg, #f7fafd 0%, #ffffff 100%);
  padding: 48px 16px;
}
.value-props__heading-group {
  text-align: center;
  margin-bottom: 16px;
}
.value-props__eyebrow {
  font-weight: 700;
  font-size: 14px;
  color: var(--cyan-alt);
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 27px;
  margin-bottom: 4px;
}
.value-props__title {
  font-weight: 800;
  font-size: 44px;
  color: var(--navy);
  line-height: 48.4px;
  letter-spacing: -0.5px;
}
.value-props__subtitle {
  font-size: 16px;
  font-weight: 400;
  color: var(--text-body);
  line-height: 25.6px;
  text-align: center;
  margin-bottom: 48px;
}

/* steps */
.value-props__steps {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 43px;
}
.value-props__connector {
  position: absolute;
  top: 46px;
  left: 0;
  width: 80%;
  transform: translateX(10%);
  height: 2px;
  background: #c3d9fa;
  pointer-events: none;
}
.step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 23px;
  position: relative;
  z-index: 1;
}
.step__circle {
  position: relative;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.step__circle::before {
  content: "";
  position: absolute;
  width: 119px;
  height: 119px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(1, 161, 200, 1) 0%, rgba(43, 76, 129, 1) 100%);
  opacity: 0.25;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  pointer-events: none;
}
.step__circle::after { content: none; }
.step__number {
  font-weight: 600;
  font-size: 45px;
  color: #FFA600;
  line-height: 1;
}
.step__label {
  font-weight: 700;
  font-size: 18px;
  color: var(--navy);
  line-height: 27px;
  letter-spacing: -0.3px;
  text-align: center;
}
.step__desc {
  font-weight: 400;
  font-size: 15px;
  color: var(--text-muted);
  line-height: 24px;
  text-align: center;
}
.step__desc strong { font-weight: 700; }

/* CTA row */
.value-props__cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin-top: 48px;
  text-align: center;
}
.btn-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 24px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #05a1dd 0%, #2b4c81 100%);
  box-shadow: var(--shadow-btn);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  white-space: nowrap;
  border: none;
  cursor: pointer;
  line-height: 22.5px;
}
.btn-cta:hover { opacity: .9; }
.value-props__small {
  font-size: 14px;
  font-weight: 400;
  color: #2d2e2f;
  line-height: 24px;
}

/* ════════════════════════════════════════════════════ *
 *  LOAN CARD – Built for Everyone
 * ════════════════════════════════════════════════════ */
.loan-card {
  background: var(--dark-blue);
  padding: 70px 20px;
}
.loan-card__inner {
  display: flex;
  align-items: center;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}
.loan-card__copy { flex: 1 1 400px; min-width: 0; }
.loan-card__eyebrow {
  font-weight: 700;
  font-size: 14px;
  color: var(--cyan-alt);
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 27px;
  margin-bottom: 8px;
}
.loan-card__title {
  font-weight: 700;
  font-size: 38px;
  color: #fff;
  line-height: 45.6px;
  letter-spacing: -0.5px;
  margin-bottom: 24px;
}
.loan-card__body {
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  line-height: 27.2px;
  margin-bottom: 24px;
}
.btn-started {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 24px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  box-shadow: var(--shadow-btn);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  border: none;
  cursor: pointer;
  line-height: 22.5px;
}
.btn-started:hover { opacity: .9; }
.btn-started img { width: 16px; height: 16px; }
.loan-card__image {
  flex: 1 1 400px;
  max-width: 568px;
  height: 426px;
  border-radius: 160px 28px 28px 28px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,.12), 0 4px 12px rgba(13,31,60,.06);
}
.loan-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 31% 45%;
  transform: scale(1) translateY(0px);
  transform-origin: 23% center;
}

/* ════════════════════════════════════════════════════ *
 *  INNOVATION PIPELINE (light)
 * ════════════════════════════════════════════════════ */
.innovation {
  background: #ffffff;
  padding: 80px 20px 60px;
}
.innovation__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.innovation__heading-group {
  text-align: center;
  margin-bottom: 48px;
}
.innovation__title {
  font-weight: 800;
  font-size: 44px;
  color: #0d1f3c;
  line-height: 48.4px;
  letter-spacing: -0.5px;
  margin-bottom: 8px;
}
.innovation__subtitle {
  font-size: 16px;
  font-weight: 400;
  color: #3d5a7a;
  line-height: 25.6px;
}
.innovation__cards {
  display: flex;
  gap: 24px;
}
.innovation__card {
  flex: 1;
  background: #f7fafd;
  border: none;
  border-top: 1px solid #eef2f7;
  border-radius: 20px 20px 80px 20px;
  padding: 33px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0 1px 2px rgba(13,31,60,.04), 0 1px 3px rgba(13,31,60,.08);
}
.innovation__card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: space-between;
}
.innovation__icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: #FFF7E8;
  padding: 0 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.innovation__icon svg { width: 20px; height: 20px; color: #FFA600; }
.innovation__badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 16px;
  background: #142e31;
  border-radius: 99999px;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 27px;
  color: #ffffff;
  letter-spacing: 1px;
  text-transform: uppercase;
  flex: 0 0 148px;
}
.innovation__card-title {
  font-weight: 700;
  font-size: 18px;
  color: #0d1f3c;
  line-height: 27px;
}
.innovation__card-desc {
  font-size: 15px;
  font-weight: 400;
  color: #3d5a7a;
  line-height: 22px;
  overflow: hidden;
  padding-right: 15px;
}

/* ════════════════════════════════════════════════════ *
 *  LOAN CALCULATOR
 * ════════════════════════════════════════════════════ */
.calculator {
  background: #ffffff;
  padding: 0 20px 80px;
}
.alr-calculator {
  background: #ffffff;
  padding: 70px 20px 70px;
}
.calculator__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.calculator__panel {
  background: linear-gradient(180deg, #2b4c81 0%, #01a1c8 100%);
  border-radius: 70px;
  padding: 60px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 27px;
}
.calculator__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  background: #3abddd;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 600;
  color: #ffffff;
}
.calculator__title {
  font-size: 44px;
  font-weight: 800;
  color: #ffffff;
  line-height: 1.2;
  letter-spacing: -0.5px;
}
.calculator__subtitle {
  font-size: 16px;
  font-weight: 600;
  color: rgba(255,255,255,.9);
  line-height: 1.6;
}
.calculator__body {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 54px;
  background: #ffffff;
  border-radius: 30px;
  padding: 36px;
  text-align: left;
  width: 100%;
  box-sizing: border-box;
}
.calculator__controls {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.calculator__label-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.calculator__label {
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: -0.3px;
  color: #6e6e6e;
}
.calculator__value {
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: -0.3px;
  color: #039cc4;
}
.calc-slider {
  width: 100%;
  -webkit-appearance: none;
  appearance: none;
  height: 6px;
  border-radius: 3px;
  background: #e2e8f0;
  outline: none;
  margin-bottom: 6px;
  cursor: pointer;
}
.calc-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--cyan);
  cursor: pointer;
  box-shadow: 0 0 0 3px rgba(1,161,200,.2);
}
.calc-slider::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--cyan);
  cursor: pointer;
  border: none;
  box-shadow: 0 0 0 3px rgba(1,161,200,.2);
}
.calculator__range-labels {
  display: flex;
  justify-content: space-between;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 27px;
  letter-spacing: -0.3px;
  color: #6e6e6e;
  margin-top: 2px;
}
.calculator__results {
  width: 100%;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}
.calculator__monthly {
  background: linear-gradient(180deg, #01a1c8 0%, #2b4c81 100%);
  border-radius: 20px;
  border: 1px solid #d9d9d9;
  padding: 30px 24px 40px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}
.calculator__monthly-label {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 1px;
  color: #ffffff;
  text-transform: uppercase;
}
.calculator__monthly-amount {
  font-size: 58px;
  font-weight: 800;
  color: #ffffff;
  line-height: 1;
}
.calculator__totals {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}
.calculator__total-item {
  flex: 1;
  padding: 16px;
  text-align: center;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}
.calculator__total-label {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 21.75px;
  letter-spacing: 0px;
  text-transform: uppercase;
  color: #212121;
  margin-bottom: 4px;
}
.calculator__total-amount {
  font-family: 'Inter', sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 29px;
  letter-spacing: -0.3px;
  color: #039cc4;
}
.calculator__disclaimer {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0px;
  color: #212121;
  padding: 12px 0;
  text-align: center;
}
.calculator__cta {
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  color: #fff;
  border: none;
  border-radius: 9999px;
  padding: 11px 24px;
  font-size: 15px;
  font-weight: 600;
  line-height: 22.5px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  align-self: center;
  margin-top: 12px;
  box-shadow: 0 8px 30px rgba(26,105,196,.25);
}
.calculator__cta:hover { opacity: .9; }

/* ── Reviews ── */
.reviews { background: #0d1f3c url('assets/images/reviews-bg-pattern.png') center center / cover no-repeat; padding: 80px 20px; }
.reviews__inner { max-width: 1200px; margin: 0 auto; text-align: center; }
.reviews__chip { display: inline-block; color: #01a1c8; font-family: 'Inter'; font-size: 14px; font-weight: 700; line-height: 27px; letter-spacing: 1px; text-transform: uppercase; text-align: center; margin-bottom: 16px; }
.reviews__title { font-size: 38px; font-weight: 800; color: #ffffff; margin: 0 0 16px; letter-spacing: -0.5px; }
.reviews__subtitle { font-family: 'Inter'; font-size: 16px; font-weight: 400; line-height: 26.4px; letter-spacing: 0px; text-align: center; color: rgba(255,255,255,0.6); margin: 0 0 48px; }
.reviews__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; text-align: left; }
.review-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.10); border-radius: 28px 70px 28px 28px; padding: 32px; display: flex; flex-direction: column; gap: 20px; min-height: 352.5px; }
.review-card__quote { display: flex; gap: 2px; line-height: 1; width: 24px; height: 24px; opacity: 0.6; overflow: hidden; }
.review-card__quote img { width: 11px; height: 22px; display: block; }
.review-card__stars { display: flex; gap: 2px; }
.review-card__stars img { width: 13.33px; height: 12.71px; display: block; }
.review-card__text { font-family: 'Inter'; font-size: 15px; font-weight: 400; line-height: 25.5px; letter-spacing: 0px; color: rgba(255,255,255,0.85); flex: 1; }
.review-card__author { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,0.08); }
.review-card__avatar { width: 40px; height: 40px; border-radius: 50%; background: #01a1c8; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px; color: #ffffff; flex-shrink: 0; }
.review-card__name { font-size: 14px; font-weight: 700; color: #ffffff; margin: 0 0 2px; }
.review-card__role { font-family: 'Inter'; font-size: 12px; font-weight: 500; line-height: 18px; letter-spacing: 0px; color: rgba(255,255,255,0.45); margin: 0; }

/* ── FAQ hero (page-faq.php only) — Figma node 3508:22483 ── */
.faq-hero {
  position: relative;
  background: linear-gradient(174.4deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 60px 20px 30px;
  overflow: hidden;
}
.faq-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.faq-hero__circles .hero__circle--2 { top: 55%; }
.faq-hero__circles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }
.faq-hero__inner {
  position: relative;
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}
.faq-hero .faq-hero__chip { color: #ffffff; }
.faq-hero .faq-hero__title { color: #ffffff; }
.faq-hero .faq-hero__subtitle { color: #ffffff; }

/* ── FAQ ── */
.faq { background: #ffffff; padding: 80px 20px; }
.faq__inner { max-width: 960px; margin: 0 auto; text-align: center; }
/* Dedicated FAQ page (page-faq.php) only: wider question list */
.faq-page .faq__inner { max-width: 1200px; }
.faq__chip { display: inline-block; font-family: 'Inter'; font-size: 14px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #3d5a7a; margin-bottom: 16px; }
.faq__title { font-size: 44px; font-weight: 800; color: #0d1f3c; margin: 0 0 16px; letter-spacing: -0.5px; }
.faq__subtitle { font-family: 'Inter'; font-size: 16px; font-weight: 700; line-height: 26.4px; letter-spacing: 0px; text-align: center; color: #152640; margin: 0 0 32px; }
.faq__search { display: flex; align-items: center; background: #ffffff; border: 1px solid #01a1c8; border-radius: 9999px; padding: 0 0 0 20px; margin: 0 auto 40px; gap: 8px; height: 54px; max-width: 520px; box-sizing: border-box; box-shadow: 0 1px 2px 0 rgba(13,31,60,0.04), 0 1px 3px 0 rgba(13,31,60,0.08); overflow: hidden; }
.faq__search input { flex: 1; border: none; outline: none; font-size: 15px; font-weight: 700; color: #3d5a7a; background: transparent; width: calc(100% - 50px); }
.faq__search input::placeholder { color: #b0bec5; }
.faq__search-btn { background: #01a1c8; border: none; border-radius: 0 9999px 9999px 0; width: 60px; align-self: stretch; display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; color: #ffffff; }
.faq__list { display: flex; flex-direction: column; gap: 12px; text-align: left; }
.faq__item { border: 1px solid #eef2f7; border-radius: 12px; overflow: hidden; background: #ffffff; min-height: 70px; box-shadow: 0 1px 2px 0 rgba(13,31,60,0.04), 0 1px 3px 0 rgba(13,31,60,0.08); }
.faq__item.is-open { border-color: #01a1c8; box-shadow: 0 2px 6px 0 rgba(13,31,60,0.06), 0 4px 16px 0 rgba(13,31,60,0.10); }
.faq__question { -webkit-appearance: none; appearance: none; display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; cursor: pointer; gap: 16px; background: none; border: none; width: 100%; text-align: left; font-family: inherit; color: inherit; }
.faq__question-text { font-size: 15px; font-weight: 600; color: #0d1f3c; }
.faq__item.is-open .faq__question-text { color: #01a1c8; }
.faq__chevron { flex-shrink: 0; width: 28px; height: 28px; border-radius: 9999px; background: #f7fafd; display: flex; align-items: center; justify-content: center; padding: 0 6.5px; box-sizing: border-box; transition: transform 0.2s; color: #3d5a7a; }
.faq__item.is-open .faq__chevron { transform: rotate(180deg); color: #01a1c8; background: rgba(1,161,200,0.12); }
.faq__answer { max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.35s ease; margin: 0 24px; padding: 0 0; font-family: 'Inter'; font-size: 15px; font-weight: 700; line-height: 25.8px; letter-spacing: 0px; color: #3d5a7a; text-align: left; border-top: 0px solid #eef2f7; }
.faq__answer p { margin-bottom: 10px; }
.faq__item.is-open .faq__answer { max-height: max-content; padding: 16px 0 20px; border-top: 1px solid #eef2f7; }

/* ── BLOG ── */
.blog { background: linear-gradient(169deg, #0199be 0%, #1a3d76 100%); padding: 70px 20px; }
.ctl-blog { background: linear-gradient(171.4deg, #000000 0%, #1B3F68 69.4%, #1C627D 115.67%); padding: 70px 20px; }
.blog__inner { max-width: 1200px; margin: 0 auto; text-align: center; }
.blog__eyebrow { display: inline-block; font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; line-height: 27px; letter-spacing: 1px; text-transform: uppercase; text-align: center; color: #ffffff; margin-bottom: 16px; }
.blog__title { font-family: 'Inter', sans-serif; font-size: 44px; font-weight: 800; line-height: 48.4px; letter-spacing: -0.5px; text-align: center; color: #ffffff; margin: 0 0 16px; }
.blog__subtitle { font-family: 'Inter', sans-serif; font-size: 16px; font-weight: 700; line-height: 26.4px; letter-spacing: 0px; text-align: center; color: #ffffff; margin: 0 0 48px; }
.blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 48px; }
@media (max-width: 900px) { .blog__grid { grid-template-columns: 1fr; } }
.blog-card { background: #ffffff; border-radius: 20px; text-align: left; display: flex; flex-direction: column; border: 1px solid #EEF2F7; box-shadow: 0 1px 2px 0 rgba(13,31,60,0.04), 0 1px 3px 0 rgba(13,31,60,0.08); }
.blog-card__image-wrap { padding: 20px 20px 0; }
.blog-card__image { display: block; width: 100%; height: 209px; object-fit: cover; object-position: center; border-radius: 12px; }
.blog-card__body { padding: 24px; display: flex; flex-direction: column; flex: 1; gap: 16px; }
.blog-card__category { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; line-height: 27px; letter-spacing: 1px; text-transform: uppercase; color: #04A1C7; }
.blog-card__title { font-family: 'Inter', sans-serif; font-size: 22px; font-weight: 700; line-height: 27px; letter-spacing: -0.3px; color: #0D1F3C; margin: 0; }
.blog-card__excerpt { font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700; line-height: 25.8px; letter-spacing: 0px; color: #1E3650; margin: 0; flex: 1; }
.blog-card__link { display: inline-flex; align-items: center; gap: 8px; font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 600; line-height: 22.5px; letter-spacing: 0px; background: linear-gradient(90deg, #01A1C8 0%, #2B4C81 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-top: 4px; }
.blog-card__link:hover { opacity: 0.75; }
.blog__cta-wrap { display: flex; justify-content: center; }
.blog__cta { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 32px; border: 2px solid #ffffff; border-radius: 9999px; background: transparent; color: #ffffff; font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background 0.2s, color 0.2s; }
.blog__cta:hover { background: #ffffff; color: #0d1f3c; text-decoration: none; }

/* Slider dots – hidden by default, shown only at mobile via media queries */
.financing__dots,
.innovation__dots,
.reviews__dots { display: none; }

/* ── FOOTER ── */
.footer { background: #051328; color: #ffffff; padding-left: 20px; padding-right: 20px; }
.footer__main { max-width: 1200px; margin: 0 auto; padding: 64px 0 14px; box-sizing: border-box; display: grid; grid-template-columns: repeat(5, 1fr); gap: 60px; }
@media (max-width: 900px) { .footer__main { grid-template-columns: 1fr 1fr; } }
.footer__brand { width: 251px; display: flex; flex-direction: column; gap: 16px; }
.footer__brand-logo { margin-bottom: 0; }
.footer__brand-logo img { width: 206.66px; height: 41.46px; }
.footer__brand-desc { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; line-height: 23.8px; letter-spacing: 0px; color: #ffffff; }
.footer__brand-hours { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 400; line-height: 23.8px; color: #ffffff; }
.footer__brand-phone { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 400; color: #ffffff; }
.footer__brand-phone a { color: #ffffff; font-weight: 400; }
.footer__brand-address { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 400; color: #ffffff; line-height: 23.8px; }
.footer__col-title { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; line-height: 27px; letter-spacing: 1px; text-transform: uppercase; color: #ffffff; margin-bottom: 20px; }
.footer__col-links { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.footer__col-links a { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; line-height: 21px; letter-spacing: 0px; color: #ffffff; }
.footer__col-links a:hover { color: #01a1c8; }
.footer__divider { border: none; border-top: 1px solid rgba(255,255,255,0.1); margin: 0; }
.footer__disclosure { max-width: 1200px; margin: 0 auto; padding: 20px 0 32px; }
.footer__disclosure-wrap { background: rgba(255,255,255,0.08); border-radius: 20px; padding: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
@media (max-width: 700px) { .footer__disclosure-wrap { grid-template-columns: 1fr; } }
.footer__disclosure-block { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 700; line-height: 19.5px; letter-spacing: 0px; color: #ffffff; }
.footer__disclosure-block strong { display: block; font-weight: 700; color: #ffffff; margin-bottom: 12px; }
.footer__disclosure-block p { margin-bottom: 12px; }
.footer__disclosure-block p:last-child { margin-bottom: 0; }
.footer__disclosure-block a { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 700; line-height: 19.5px; color: #ffffff; text-decoration: underline; text-decoration-style: solid; text-underline-offset: 0; }
.footer__all-caps { font-size: 12px; font-weight: 700; color: #ffffff; line-height: 20px; }
.footer__badges { display: flex; flex-direction: row; align-items: center; gap: 32px; flex-wrap: wrap; margin-top: 64px; border-radius: 16px; padding: 16px; }
.footer__badges img { height: auto; }
.footer__bottom { }
.footer__bottom-inner { max-width: 1200px; margin: 0 auto; padding: 20px 0 48px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.footer__copyright { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 700; line-height: 19.5px; letter-spacing: 0px; color: #ffffff; }
.footer__bottom-links { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.footer__bottom-links ul { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.footer__bottom-links ul li { margin: 0; padding: 0; }
.footer__bottom-links a { font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 700; line-height: 19.5px; letter-spacing: 0px; color: #ffffff; }
.footer__bottom-links li.larger-text a { font-size: 14px; }
.footer__bottom-links a:hover { color: #01a1c8; }

@media (min-width: 1025px) {
  .navbar__hamburger { display: none; }
}

@media (max-width: 1200px) {
  .navbar { padding: 0 36px; }
  .navbar__extra { display: none; }
  .financing__panel {
    max-width: 100%;
    border-radius: 34px;
    padding: 36px 30px 24px;
  }
  .financing__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .financing-card {
    width: auto;
    min-height: 360px;
    height: auto;
    border-radius: 20px;
  }
  .financing__title { font-size: 38px; line-height: 46px; }
  .financing__desc { font-size: 16px; line-height: 26px; }
  .financing-card h3 { font-size: 28px; line-height: 34px; }
  .financing__chip { font-size: 12px; }
  .loan-card__image { flex: 0 0 42%; max-width: 42%; height: 320px; border-radius: 100px 28px 28px 28px; box-shadow: 0 4px 12px rgba(13,31,60,0.06), 0 12px 40px rgba(13,31,60,0.12); }
}

@media (max-width: 1024px) {
  /* NAVBAR */
  .navbar { padding: 0 48px; }
  .navbar__links { display: none; }
  .btn-phone { display: none; }
  .btn-signin { display: none; }
  .navbar__hamburger { display: flex; flex-direction: column; justify-content: space-between; width: 34px; height: 27px; cursor: pointer; padding: 0; background: none; border: none; }
  .navbar__hamburger span { display: block; width: 34px; height: 5px; background: linear-gradient(90deg, #01A1C8 0%, #2B4C81 100%); border-radius: 3px; }

  /* HERO */
  .hero { height: auto; padding: 60px 48px; }
  .hero__inner { grid-template-columns: 384px calc(100% - 438px); justify-content: start; gap: 30px; width: calc(100% - 0px); margin-top: 0; }
  .hero__headline { font-size: 43px; line-height: 48px; }
  .hero__subline { font-size: 16px; }
  .hero__photos { height: 370px; overflow: visible; }
  .hero__grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: 168px 168px; gap: 8px; margin-left: 0px; }
  .hero__photo { width: auto; height: auto; }
  .hero__photo--tr { top: 18px; }
  .hero__photo--br { top: 18px; }
  .hero__circle--1 { width: 280px; height: 280px; left: 0; transform: unset; top: auto; bottom: -100px; }
  .hero__circle--2 { width: 240px; height: 240px; left: 50%; transform: translateX(40px); bottom: -155px; }
  .hero__circle--3 { width: 300px; height: 300px; left: auto; transform: translateX(80%); right: 0; top: 30px; }
  .hero__circle--4 { width: 180px; height: 180px; left: 45%; top: -5px; transform: none; }
  .hero__badge { left: auto; right: -24px; top: 158px; bottom: auto; padding: 10px 14px; border-radius: 14px; }
  .hero__ring { position: absolute; left: auto; top: -39px; right: -70px; width: 240px; height: 240px; pointer-events: none; z-index: 0; opacity: 0.55; }
  .hero__badge-sub { font-size: 12px; line-height: 15px; }
  .hero__badge-main { font-size: 14px; line-height: 20px; }
  .hero__dots { left: -20px; top: 233px; width: 140px; height: 134px; }

  /* FINANCING - full bleed at tablet */
  .financing { margin-top: 0; background: none; padding: 0; }
  .financing__panel { max-width: 100%; margin: 0; border-radius: 0; padding: 60px 48px; min-height: 0; }
  .financing__chips { justify-content: center; }
  .financing__cards { grid-template-columns: repeat(4, 1fr); gap: 24px; }
  .financing-card { min-height: 0; height: auto; padding: 24px; gap: 16px; border-radius: 20px 70px 20px 20px; background: #ffffff; border: 1px solid #EEF2F7; box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08); }
  .financing-card__icon img { width: 24px; height: 24px; }
  .financing-card h3 { font-size: 18px; line-height: 24px; }
  .financing-card__cta { height: 45px; }
  .financing__title { font-size: 25px; line-height: 25px; font-weight: 700; letter-spacing: 0; text-align: center; }
  .financing__desc { font-size: 16px; line-height: 25.5px; text-align: center; }

  /* LOAN CARD */
  .loan-card { padding: 70px 48px; background: #152640; }
  .loan-card__copy { flex: 1 1 0; min-width: 0; }
  .loan-card__title { font-size: 35px; }
  .loan-card__image { flex: 0 0 38%; height: 280px; max-width: 38%; border-radius: 100px 28px 28px 28px; box-shadow: 0 4px 12px rgba(13,31,60,0.06), 0 12px 40px rgba(13,31,60,0.12); }

  /* INNOVATION PIPELINE */
  .innovation { padding: 70px 48px; }

  .reviews__title { font-size: 34px; line-height: 45px; }

  .faq { padding: 70px 48px; }

  .blog { padding: 70px 48px; }
  

  /* SECTION CONTAINERS */
  .value-props__steps { gap: 48px 16px; overflow: visible; }
  .value-props { padding: 48px 28px 48px; overflow-x: hidden; overflow-y: visible; }
  .step__circle { width: 72px; height: 72px; }
  .step__circle::before { width: 94px; height: 94px; }
  .step__number { font-size: 34px; }
  .step { min-width: 180px; }
  .innovation__cards { grid-template-columns: repeat(2, 1fr); }
  .reviews__grid { grid-template-columns: repeat(2, 1fr); }
  .calculator__body { padding: 40px 36px; }
  .calculator__controls { flex: 1; }
  .calculator__monthly { border-radius: 20px; border: 1px solid #D9D9D9; padding: 30px 24px 40px; gap: 8px; }
  .calculator { padding: 0; background: transparent; }
  .calculator__inner { max-width: 100%; }
  .calculator__panel { border-radius: 0; padding: 60px 45px; gap: 27px; }
  .calculator__title { font-size: 34px; line-height: 1.27; }
  .reviews { padding: 70px 48px; }
  .footer { padding: 0; }
  .footer__main { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; gap: 48px 32px; padding-left: 48px; padding-right: 48px; }
  .footer__brand { grid-row: span 2; }
  .footer__main > :nth-child(4) { grid-column-start: 2; }
  .footer__disclosure { padding-left: 48px; padding-right: 48px; }
  .footer__bottom-inner { padding-left: 48px; padding-right: 48px; }
  .footer__disclosure-wrap { grid-template-columns: 1fr; }
  .footer__bottom-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
  .footer__bottom-links, .footer__bottom-links ul { width: 100%; justify-content: space-between; }
  .footer__bottom-links ul { gap: 32px; }
}

@media (max-width: 991px) {
  .financing__cards { grid-template-columns: repeat(2, 1fr); }
  .value-props__steps { flex-wrap: wrap; }
  .value-props__connector { display: none; }
  .step { flex-basis: 40%; }
  .innovation__cards { flex-wrap: wrap; }
  .innovation__card { flex-grow: 0; min-width: calc(50% - 12px); }
  .innovation__card:last-child { align-self: center; }
  .calculator__body { grid-template-columns: 1fr; }
  .blog__grid { grid-template-columns: repeat(2, 1fr); }
  .footer__bottom-inner { gap: 24px; }
  .footer__bottom-links ul { flex-direction: column; align-items: flex-start; gap: 24px; }
}

@media (max-width: 767px) {
  .navbar { padding: 0 36px; }
  .hero { padding: 0; }
  .hero__circle--1 { width: 200px; height: 200px; left: 0; top: 220px; }
  .hero__circle--2 { width: 140px; height: 140px; left: auto;right: -30px; top: auto; bottom: 94px; }
  .hero__circle--3 { width: 240px; height: 240px; transform: translate(55%, -41%); top: 50%; }
  .hero__circle--4 { width: 130px; height: 130px; left: auto; right: -15px; }
  .hero__inner { grid-template-columns: 1fr; padding: 48px 36px; }
  .financing {
    background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(27,63,104,1) 81%, rgba(28,98,125,1) 117%) !important;
    padding: 60px 36px;
  }
  .value-props__steps { margin-bottom: 24px; }
  /* Innovation Pipeline */
  .innovation { overflow: hidden; padding: 70px 36px; }
  .innovation__cards { display: block !important; width: 100% !important; overflow: visible !important; gap: 0 !important; }
  .innovation__card {
    display: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .innovation__card.is-active { display: flex !important; }
  .innovation__card-desc { height: auto; }
  /* Dot indicators – innovation */
  .innovation__dots { display: flex !important; justify-content: center; gap: 8px; margin: 24px 0 4px; }
  .innovation__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(206,206,206,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
  .innovation__dot.is-active { background: var(--cyan); transform: scale(1.2); }
  /* Slider – JS-driven show/hide */
  .financing__panel {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    min-height: 0 !important;
  }
  .financing__note { padding: 0; text-align: center; }
  .financing__cards {
    display: block;
    width: 100%;
    overflow: visible;
    padding: 0;
    gap: 0 !important;
  }
  .financing-card {
    display: none;
    width: 100%;
    max-width: 296px;
    min-width: 0;
    margin: 0 auto;
    box-sizing: border-box;
    height: auto;
    min-height: auto;
    border-radius: 20px 70px 20px 20px;
    border: none;
    border-top: 1px solid #EEF2F7;
    background: #ffffff;
    padding: 24px;
    gap: 16px;
    box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08);
  }
  .financing-card.is-active { display: flex; }
  /* Dot indicators – financing */
  .financing__dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 24px 0 4px;
  }
  .financing__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255,255,255,1);
    border: none;
    cursor: pointer;
    padding: 0;
    transition: background 0.2s, transform 0.2s;
    flex-shrink: 0;
  }
  .financing__dot--active {
    background: var(--cyan);
    transform: scale(1.2);
  }
  .financing__chips {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    padding: 0 16px;
  }
  .financing__chip { justify-content: center; }
  .financing-card__icon img { width: 16px; height: 16px; }
  .financing__note { padding: 0 16px; }
  .loan-card { padding: 48px 36px; }
  .loan-card__inner { flex-direction: column; }
  .loan-card__title { max-width: 450px; }
  .loan-card__image { max-width: 100% !important; width: 100%; }
  .loan-card__copy { flex-basis: auto !important; }
  .calculator__panel { padding: 60px 36px; }
  .calculator__totals { flex-wrap: wrap; }

  /* Reviews */
  .reviews { overflow: hidden; padding: 70px 36px; }
  .reviews__grid { display: block !important; overflow: visible !important; gap: 0 !important; }
  .review-card { display: none !important; min-height: 0; border-radius: 20px 60px 20px 20px; }
  .review-card.is-active { display: flex !important; }
  /* Dot indicators – reviews */
  .reviews__dots { display: flex !important; justify-content: center; gap: 8px; margin: 24px 0 0; }
  .reviews__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
  .reviews__dot.is-active { background: var(--cyan); transform: scale(1.2); }

  .faq { padding: 70px 36px; }

  .blog { padding: 70px 36px; }
  .blog__title { font-size: 34px; line-height: 45px; }
  .blog__grid { grid-template-columns: 1fr; justify-items: center; }
  .blog-card { max-width: 368px; border-bottom-right-radius: 100px; }
  .blog-card:not(:first-child) { display: none; }
  .blog-card__image { height: auto; aspect-ratio: 320 / 209; }
  
  /* Footer */
  .footer { overflow: hidden; }
  .footer__main { grid-template-columns: 1fr 1fr !important; grid-auto-rows: unset; gap: 32px 24px; padding: 64px 36px 36px 36px; }
  .footer__main > :nth-child(4) { grid-column-start: 1; }
  .footer__brand { grid-column: 1 / -1; grid-row: span 1; width: 100%; max-width: 100%; padding-bottom: 32px; border-bottom: 1px solid rgba(255,255,255,0.12); }
  .footer__brand-desc { max-width: 255px; }
  .footer__col-title { font-size: 13px; }
  .footer__col-links { gap: 10px; }
  .footer__disclosure { padding: 0 36px 16px; }
  .footer__disclosure-wrap { grid-template-columns: 1fr; }
  .footer__disclosure-block { overflow-wrap: break-word; word-break: break-word; }
  .footer__badges { display: grid !important; grid-template-columns: 1fr 1fr; gap: 24px 16px; align-items: center; justify-items: center; margin-top: 32px; }
  .footer__badges img { max-width: 100%; height: auto; }
  .footer__bottom-inner { flex-direction: column; align-items: flex-start; gap: 24px; padding-top: 24px; padding-bottom: 40px; padding-left: 36px; padding-right: 36px; }
}

@media (max-width: 440px) {
  /* HERO – stacked */
  .hero { height: auto; padding: 0; }
  .hero__inner { flex-direction: column; gap: 32px; margin-top: 0; align-items: flex-start; }
  .hero__copy { flex: 0 0 auto; width: 100%; }
  .hero__headline { font-size: 42px; line-height: 50px; }
  .hero__subline { font-size: 18px; }
  .hero__photos { flex: 0 0 auto; width: 100%; height: 320px; overflow: visible; align-self: center; }
  .hero__grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: 148px 148px; gap: 8px; margin-left: 0; }
  .hero__photo { width: auto; height: auto; }
  .hero__photo--tr { top: 16px; }
  .hero__photo--br { top: 16px; }
  .hero__ring { width: 210px; height: 210px; }
  .hero__dots { left: -20px; top: 225px; width: 121px; height: 96px; }
  .hero__badge { left: auto; right: -10px; top: 130px; bottom: auto; padding: 8px 12px; border-radius: 12px; }
  .hero__badge-sub { font-size: 11px; line-height: 14px; }
  .hero__badge-main { font-size: 13px; line-height: 18px; }

  /* How It Works – single column */
  .value-props { overflow: hidden; }
  .value-props__steps { flex-direction: column !important; align-items: center !important; }
  .value-props__connector { display: none !important; }
  .step { flex: 0 0 auto !important; width: 100%; max-width: 320px; gap: 16px; }
  .step__circle { width: 92px !important; height: 92px !important; }
  .step__circle::before { width: 119px !important; height: 119px !important; }
  .step__number { font-size: 45px !important; }
  .step__label { font-size: 18px; }
  .step__desc { font-size: 15px; text-align: center; }

  /* How It Works CTA */
  .value-props__cta { margin-top: 40px; width: 100%; max-width: 250px; margin-left: auto; margin-right: auto; }
  .btn-cta { width: 100%; padding: 16px 24px; font-size: 16px; font-weight: 700; white-space: normal; }
  .value-props__small { font-size: 14px; text-align: center; }

  /* Loan Card – stacked */
  .loan-card__inner { flex-direction: column !important; align-items: flex-start !important; }
  .loan-card__copy { flex: 0 0 auto !important; width: 100%; }
  .loan-card__title { font-size: 38px; line-height: 1.2 !important; margin-bottom: 16px; }
  .loan-card__body { font-size: 15px !important; line-height: 1.7 !important; }
  .loan-card__image { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; height: 426px !important; border-radius: 70px 28px 28px 28px !important; box-shadow: 0 4px 12px 0 rgba(13,31,60,0.06), 0 12px 40px 0 rgba(13,31,60,0.12) !important; }
  .loan-card__image img { object-position: 70% 20% !important; transform: none !important; }

  /* Calculator – stacked mobile */
  .calculator { background: linear-gradient(180deg, #2b4c81 0%, #01a1c8 100%); }
  .calculator__inner { max-width: 100% !important; }
  .calculator__panel {
    background: transparent;
    border-radius: 0 !important;
    gap: 20px !important;
    align-items: center !important;
    text-align: center !important;
    width: 100%;
  }
  .calculator__chip { align-self: center; }
  .calculator__label-row { flex-direction: column; }
  .calculator__body { padding: 40px 24px; }
  .calculator__controls { width: 100%; text-align: left; }
  .calculator__monthly-amount { font-size: 36px; }
  .calculator__cta { width: 100%; box-sizing: border-box; margin-top: 4px; align-self: stretch; }

  /* Blog */
  .blog__title { font-size: 34px !important; line-height: 45px !important; }
}


/* ════════════════════════════════════════════════════════════════════════
 *  REFINANCE PAGE  (refi-*)
 * ════════════════════════════════════════════════════════════════════════ */

/* ── Shared refinance button ── */
.btn-refi-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 28px;
  height: 50px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #05a1dd 0%, #2b4c81 100%);
  box-shadow: var(--shadow-btn);
  border: none;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
}
.btn-refi-primary:hover { opacity: .9; color: #fff; text-decoration: none; }

.btn-refi-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  border-radius: 9999px;
  background: transparent;
  border: 2px solid #ffffff;
  box-shadow: 0 8px 30px rgba(26,105,196,0.25);
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
}
.btn-refi-outline:hover { background: rgba(255,255,255,0.12); color: #fff; text-decoration: none; }

/* ── HERO ── */
.refi-hero {
  position: relative;
  background: linear-gradient(173.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 60px 20px 60px;
  overflow: hidden;
}
.refi-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
/* circle--1: mid-left, partially off bottom */
/* circle--2: large, far right, partially off bottom */
.refi-hero__circles .hero__circle--2 { top:55%; }
/* circle--3: upper right */
.refi-hero__circles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }


.refi-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}
.refi-hero__copy {
  flex: 0 0 520px;
}
.refi-hero__headline {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin-bottom: 16px;
}
.refi-hero__headline strong { font-weight: 700; }
.refi-hero__subline {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255,255,255,0.9);
  margin-bottom: 12px;
}
.refi-hero__trust {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  margin-bottom: 28px;
  line-height: 1.5;
}
.refi-hero__photo-wrap {
  flex: 1 1 600px;
  max-width: 476px;
  position: relative;
  min-height: 340px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 36px;
}
.refi-hero__ring {
  position: absolute;
  top: -90px;
  left: 46%;
  width: 340px;
  height: 340px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.refi-hero__ring img { width: 100%; height: 100%; }
.refi-hero__dots {
  position: absolute;
  bottom: -26px;
  left: -82px;
  width: 180px;
  height: 160px;
  pointer-events: none;
  z-index: 0;
}
.refi-hero__dots img { width: 100%; height: 100%; }
.refi-hero__photo {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 476px;
  height: 315px;
  border-radius: 20px 70px 20px 20px;
  border: 7px solid rgba(255,255,255,0.4);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(13,31,60,0.25);
}
.refi-hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.refi-hero__badge {
  position: absolute;
  right: 0;
  bottom: -16px;
  z-index: 2;
  background: rgba(255,255,255,0.95);
  border-radius: 20px;
  padding: 16px 20px;
  box-shadow: 0 4px 16px rgba(13,31,60,0.1), 0 2px 6px rgba(13,31,60,0.06);
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: flex-start;
  text-align: left;
}
.refi-hero__badge-label {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  line-height: 18px;
  text-transform: uppercase;
  margin: 0;
}
.refi-hero__badge-amount {
  font-size: 30px;
  font-weight: 700;
  color: #1a69c4;
  line-height: 27px;
  margin: 0;
  white-space: nowrap;
}
.refi-hero__badge-note {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  line-height: 18px;
  margin: 0;
  width: 149px;
}

/* ── WHY REFINANCE ── */
.refi-why {
  background: #f7fafd;
  padding: 80px 20px;
}
.refi-why__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.refi-why__heading {
  text-align: center;
  margin-bottom: 48px;
}
.refi-why__title {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.5px;
  color: #151515;
  margin: 0 0 12px;
}
.refi-why__subtitle {
  font-size: 16px;
  font-weight: 400;
  color: var(--text-body);
  line-height: 1.6;
  margin: 0;
}
.refi-why__body {
  display: flex;
  align-items: flex-start;
  gap: 60px;
  margin-bottom: 48px;
}
.refi-why__photo-wrap {
  flex: 0 0 582px;
  height: 338px;
  border-radius: 100px 28px 28px 28px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(13,31,60,0.06), 0 12px 40px rgba(13,31,60,0.12);
}
.refi-why__photo-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.refi-why__list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
}
.refi-why__item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px;
  background: #ffffff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
  cursor: pointer;
  transition: box-shadow 0.2s;
}
.refi-why__item:hover { box-shadow: 0 4px 16px rgba(13,31,60,0.1); }
.refi-why__item-icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: #FFF7E8;
  display: flex;
  align-items: center;
  justify-content: center;
}
.refi-why__item-text { flex: 1; min-width: 0; }
.refi-why__item-title {
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #0d1f3c;
  line-height: 27px;
  letter-spacing: -0.3px;
  margin: 0;
}
.refi-why__item-desc {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #0d1f3c;
  line-height: 27px;
  margin: 0;
}
.refi-why__item-chevron {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 6.5px;
  box-sizing: border-box;
}
.refi-why__cta-wrap {
  text-align: center;
}

/* ── HOW IT WORKS ── */
.refi-how {
  background: #ffffff;
  padding: 80px 20px;
}
.refi-how__panel {
  max-width: 1200px;
  margin: 0 auto;
  background: linear-gradient(176.3deg, #000 0%, #1b3f68 69%, #1c627d 115%);
  border-radius: 70px;
  padding: 60px 60px 64px;
}
.refi-how__heading {
  text-align: center;
  margin-bottom: 48px;
}
.refi-how__title {
  font-family: 'Inter', sans-serif;
  font-size: 38px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: #fff;
  margin: 0 0 12px;
}
.refi-how__subtitle {
  font-size: 18px;
  font-weight: 400;
  color: rgba(255,255,255,0.75);
  line-height: 1.6;
  margin: 0;
}
.refi-how__steps {
  display: flex;
  gap: 24px;
  align-items: stretch;
}
.refi-how__step {
  flex: 1;
  background: #ffffff;
  border: none;
  border-top: 1px solid #eef2f7;
  border-radius: 20px 70px 20px 20px;
  padding: 24px 37px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08);
}
.refi-how__step-num {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #FFF7E8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.refi-how__step-num span {
  font-family: 'Inter', sans-serif;
  font-size: 45px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  background: #FFA600;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.refi-how__step-title {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.4;
  letter-spacing: -0.3px;
  margin: 0;
}
.refi-how__step-desc {
  font-size: 15px;
  font-weight: 400;
  color: var(--text-muted);
  line-height: 1.6;
  margin: 0;
}
.refi-how__dots {
  display: none;
}

/* ── SAVINGS CTA ── */
.refi-cta {
  background: linear-gradient(168.6deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 20px;
}
.refi-cta__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.refi-cta__heading {
  text-align: center;
  margin-bottom: 40px;
}
.refi-cta__title {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: #fff;
  margin: 0 0 10px;
}
.refi-cta__subtitle {
  font-size: 16px;
  font-weight: 400;
  color: rgba(255,255,255,0.85);
  line-height: 1.6;
  margin: 0;
}
.refi-cta__body {
  display: flex;
  gap: 24px;
  align-items: stretch;
  justify-content: center;
  margin-bottom: 40px;
}
.refi-cta__savings-card {
  flex: 0 0 468px;
  background: #fff;
  border: none;
  border-top: 1px solid #eef2f7;
  border-radius: 30px;
  padding: 46px 24px;
  box-shadow: 0 0 240px rgba(1,161,200,0.5);
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.refi-cta__amount-row {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  margin-bottom: 8px;
}
.refi-cta__amount {
  font-family: 'Inter', sans-serif;
  font-size: 90px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.3px;
  background: linear-gradient(180deg, #000000 0%, #1b3f68 63%, #1c627d 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.refi-cta__amount-unit {
  font-size: 34px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 1px;
  color: #04a1c7;
  padding-bottom: 12px;
}
.refi-cta__amount-note {
  font-size: 15px;
  font-weight: 400;
  color: #1e3650;
  line-height: 24px;
  letter-spacing: 0;
  text-align: center;
  max-width: 350px;
  margin: 0 auto 24px;
}
.refi-cta__bar-section { text-align: left; }
.refi-cta__bar-labels {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
.refi-cta__bar-label {
  font-size: 17px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: -0.3px;
  color: #6e6e6e;
}
.refi-cta__bar-label--after { color: #039cc4; }
.refi-cta__bar {
  position: relative;
  height: 8px;
  background: #e2e8f0;
  border-radius: 9999px;
  overflow: hidden;
  margin-bottom: 6px;
}
.refi-cta__bar-fill {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 11%;
  background: #00a9ce;
  border-radius: 9999px;
}
.refi-cta__bar-captions {
  display: flex;
  justify-content: space-between;
}
.refi-cta__bar-caption {
  font-size: 14px;
  font-weight: 600;
  line-height: 27px;
  letter-spacing: -0.3px;
  color: #6e6e6e;
}
.refi-cta__bar-caption--right { color: #000000; }

/* Benefits column */
.refi-cta__benefits {
  flex: 0 0 468px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}
.refi-cta__benefit {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #ffffff;
  border: none;
  border-top: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 16px;
  box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08);
}
.refi-cta__benefit-icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: #FFF7E8;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #1a69c4;
}
.refi-cta__benefit-icon svg { width: 22px; height: 22px; }
.refi-cta__benefit-text {
  font-size: 17px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.4;
}
.refi-cta__benefits-desc {
  margin-top: 8px;
  padding-top: 0;
}
.refi-cta__benefits-desc p:first-child {
  font-size: 19px;
  font-weight: 500;
  color: #ffffff;
  line-height: 27px;
  letter-spacing: -0.5px;
  margin: 0 0 4px;
}
.refi-cta__benefits-desc p:last-child {
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  line-height: 25.6px;
  letter-spacing: 0;
  margin: 0;
}
.refi-cta__footer {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.refi-cta__note {
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  line-height: 25.6px;
  letter-spacing: 0;
  text-align: center;
  margin: 0;
}

/* ── FAQ – refinance variant adds extra top/bottom space ── */
.refi-faq {
  padding-top: 80px;
  padding-bottom: 80px;
}

/* ── BOTTOM CTA ── */
.refi-bottom-cta {
  background: linear-gradient(174.8deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 100px 20px;
  text-align: center;
}
.refi-bottom-cta__inner {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.refi-bottom-cta__eyebrow {
  font-size: 14px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  color: #ffffff;
  margin: 0;
}
.refi-bottom-cta__title {
  font-family: 'Inter', sans-serif;
  font-size: 38px;
  font-weight: 700;
  line-height: 45.6px;
  letter-spacing: -0.5px;
  text-align: center;
  color: #ffffff;
  margin: 0;
}
.refi-bottom-cta__subtitle {
  font-size: 16px;
  font-weight: 400;
  line-height: 27.2px;
  letter-spacing: 0px;
  text-align: center;
  color: #ffffff;
  margin: 0 0 8px;
  max-width: 753px;
}
.refi-bottom-cta__fine {
  font-size: 14px;
  font-weight: 400;
  line-height: 27.2px;
  letter-spacing: 0px;
  text-align: center;
  color: #ffffff;
  margin: 0;
}

/* ── REFINANCE RESPONSIVE: 1024px ── */
@media (max-width: 1024px) {
  .refi-why-wrap { display: flex; flex-direction: column-reverse; }
  .refi-hero { padding: 60px 48px; }
  .refi-hero__circles .hero__circle--1 {
    left: 0;
    bottom: -150px;
  }
  .refi-hero__circles .hero__circle--2 {
    top: auto;
  }
  .refi-hero__circles .hero__circle--3 {
    width: 300px;
    height: 300px;
    left: auto;
    transform: translateX(80%);
    right: 0;
    top: 30px;
  }
  .refi-hero__inner { gap: 64px; padding-right: 40px; }
  .refi-hero__copy { max-width: 50%; flex-basis: 50%; }
  .refi-hero__headline { font-size: 36px; }
  .refi-hero__headline-break { display: none; }
  .refi-hero__headline-segment--inline-block { display: inline-block; }
  .refi-hero__photo-wrap { padding-right: 0; }
  .refi-hero__ring { position: absolute; left: auto; top: -39px; right: -70px; width: 240px; height: 240px; pointer-events: none; z-index: 0; opacity: 0.55; }
  .refi-hero__dots { left: -50px; }
  .refi-hero__badge { right: -40px; }

  .refi-why { padding: 60px 48px; }
  .refi-why__body { gap: 32px; }
  .refi-why__photo-wrap { flex: 0 0 320px; height: 280px; }

  .refi-how { padding: 0; }
  .refi-how__panel { border-radius: 0; padding: 60px 48px; }
  .refi-how__title { font-size: 35px; }
  .refi-how__title-break { display: none; }
  .refi-how__step-title { font-size: 21px; }

  .refi-cta { padding: 70px 48px; background: #152640; }
  .refi-cta__body { gap: 32px; }
  .refi-cta__savings-card { flex-basis: calc(50% - 12px); }
  .refi-cta__benefits { flex-basis: calc(50% - 12px); }

  .faq.refi-faq { padding-left: 78px; padding-right: 78px; }

  .refi-bottom-cta { padding: 60px 45px; }
}

/* ── REFINANCE RESPONSIVE: 767px ── */
@media (max-width: 767px) {
  .refi-hero { padding: 48px 36px 64px; }
  .refi-hero__circles .hero__circle--1 { bottom: -100px; opacity: 0.5; width: 200px; height: 200px; left: 0; top: 220px; }
  .refi-hero__circles .hero__circle--2 { width: 200px; height: 200px; left: auto; right: -20px; top: auto; bottom: 0; }
  .refi-hero__circles .hero__circle--3 { width: 240px; height: 240px; transform: translate(55%, -41%); top: 50%; }
  .refi-hero__circles .hero__circle--4 { width: 160px; height: 160px; left: auto; top: -5px; right: -15px; }
  .refi-hero__inner { flex-direction: column; gap: 40px; padding-right: 0; }
  .refi-hero__headline { font-size: 42px; }
  .refi-hero__copy { max-width: none; flex-basis: auto; }
  .refi-hero__photo-wrap { width: 100%; max-width: none; height: auto; min-height: 0; flex: none; justify-content: flex-start; }
  .refi-hero__ring { width: 240px; height: 240px; right: -45px;  }
  .refi-hero__photo { max-width: calc(100% - 36px); aspect-ratio: 3 / 2; height: auto; }
  .refi-hero__badge { right: 0; bottom: -24px; }

  .refi-why { padding: 48px 36px; }
  .refi-why__body { flex-direction: column; }
  .refi-why__photo-wrap { flex: 0 0 auto; width: 100%; height: auto; }
  .refi-why__photo-wrap img { object-position: top center; aspect-ratio: 1.05 / 1; max-height: 350px; }
  .refi-why__list { width: 100%; }

  .refi-how__panel { padding: 60px 36px; }
  .refi-how__steps { display: block; width: 100%; overflow: visible; gap: 0; }
  .refi-how__step {
    display: none;
    width: 100%;
    box-sizing: border-box;
  }
  .refi-how__step.is-active { display: flex; }
  .refi-how__step-desc { height: auto; }
  /* Dot indicators – refi how */
  .refi-how__dots { display: flex; justify-content: center; gap: 8px; margin: 24px 0 4px; }
  .refi-how__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(206,206,206,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
  .refi-how__dot.is-active { background: var(--cyan); transform: scale(1.2); }
  /* Slider – JS-driven show/hide */

  .refi-cta { padding: 48px 36px; }

  .refi-cta__body { flex-direction: column; gap: 32px; }
  .refi-cta__savings-card { flex: 0 0 auto; width: 100%; max-width: 420px; margin: 0 auto; }

  .faq.refi-faq { padding-left: 36px; padding-right: 36px; }

  .refi-bottom-cta { padding-left: 36px; padding-right: 36px; }
}

/* ── REFINANCE RESPONSIVE: 440px ── */
@media (max-width: 440px) {
  .refi-hero__badge-label { font-size: 13px; }
  .refi-hero__badge-amount { font-size: 24px; }
  .refi-hero__badge-note { font-size: 13px; }
  .refi-hero__photo { height: 230px; }
  .refi-hero__circles .hero__circle--1 {
    width: 200px;
    height: 200px;
    left: 0;
    top: 220px;
  }
  .refi-hero__circles .hero__circle--2 {
    width: 140px;
    height: 140px;
    left: auto;
    right: -30px;
    top: auto;
    bottom: 0;
  }
  .refi-hero__circles .hero__circle--3 {
    width: 240px;
    height: 240px;
    transform: translate(70%, 5%);
  }
  .refi-hero__circles .hero__circle--4 {
    width: 160px;
    height: 160px;
    left: auto;
    right: -15px;
    top: -15px;
  }

  .refi-why__item { display: grid; grid-template-columns: 1fr 30px; }
  .refi-why__item-icon { grid-column: span 2; }

  .refi-cta__amount { font-size: clamp(15vw, 50px, 90px); }
  .refi-cta__bar-label { font-size: clamp(16px, 17px, 4.5vw); line-height: 1.3em; }
  .refi-cta__bar-captions { gap: 8px; }
  .refi-cta__bar-caption { font-size: clamp(3.4vw, 14px, 3.5vw) }

  .refi-faq { padding-top: 70px; padding-bottom: 70px; }
}

/* ════════════════════════════════════════════════════
   TITLE LOAN PAGE  (tl-*)
════════════════════════════════════════════════════ */

/* ── BUTTONS ── */
.btn-tl-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  height: 45px;
  width: fit-content;
  white-space: nowrap;
  border-radius: 9999px;
  background: linear-gradient(270deg, #000 17%, #1b3f68 43%, #05a1dd 109%);
  border: 2px solid #00a9ce;
  box-shadow: 0 8px 30px rgba(26,105,196,0.25);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
}
.btn-tl-dark:hover { opacity: 0.9; color: #fff; text-decoration: none; }
.btn-tl-cyan {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  height: 45px;
  width: fit-content;
  border-radius: 9999px;
  background: #00a9ce;
  border: none;
  box-shadow: 0 8px 30px rgba(26,105,196,0.25);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
.btn-tl-cyan:hover { background: #0095b8; color: #fff; text-decoration: none; }

/* ── HERO ── */
.tl-hero {
  position: relative;
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 60px 0;
  /* overflow visible so badges can protrude outside the photo frame;
     decorative circles stay clipped by .tl-hero__circles which has its own overflow:hidden */
}
.tl-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.tl-hero__ring {
  position: absolute;
  top: -60px;
  right: -40px;
  width: 340px;
  height: 340px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.tl-hero__ring img { width: 100%; height: 100%; }
.tl-hero__circles .hero__circle--1 { width: 340px; height: 340px; left: 60px; bottom: -100px; opacity: 0.5; }
.tl-hero__circles .hero__circle--2 { width: 580px; height: 580px; right: -120px; bottom: -260px; opacity: 0.5; left: auto; }
.tl-hero__circles .hero__circle--3 { width: 500px; height: 500px; right: 200px; top: -180px; opacity: 0.5; left: auto; }
.tl-hero__circles .hero__circle--4 { width: 220px; height: 220px; left: 300px; top: -80px; opacity: 0.5; }
.tl-hero__inner {
  display: flex;
  align-items: center;
  gap: 80px;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  padding-right: 30px;
}
.tl-hero__copy {
  flex: 0 0 520px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tl-hero__headline {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-weight: 700;
  line-height: 50.6px;
  letter-spacing: -1px;
  color: #fff;
  margin: 0 0 16px;
}
.tl-hero__subline {
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  color: rgba(255,255,255,0.92);
  margin: 0;
}
.tl-hero__features {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.tl-hero__feature {
  display: flex;
  align-items: center;
  gap: 15px;
  background: #fff;
  border: 1px solid #d4d4d4;
  border-radius: 20px;
  padding: 13px 16px;
}
.tl-hero__feature svg { flex-shrink: 0; }
.tl-hero__feature-text {
  font-size: 13px;
  font-weight: 500;
  color: rgba(53,53,53,0.9);
}
.tl-hero__cta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
.tl-hero__disclaimer {
  font-size: 13px;
  font-weight: 400;
  line-height: 28.8px;
  letter-spacing: 0;
  color: #ffffff;
  white-space: nowrap;
  margin: 0;
}
.tl-hero__photo-wrap {
  flex: 1;
  position: relative;
  min-height: 380px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tl-hero__photo {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 549px;
  height: 363px;
  border-radius: 20px 70px 20px 20px;
  border: 7px solid rgba(255,255,255,0.4);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(13,31,60,0.25);
}
.tl-hero__photo img { width: 100%; height: 100%; object-fit: cover; }
.tl-hero__dots {
  position: absolute;
  bottom: -25px;
  left: -57px;
  width: 180px;
  height: 160px;
  pointer-events: none;
  z-index: 0;
}
.tl-hero__dots img { width: 100%; height: 100%; }
.tl-hero__badge {
  position: absolute;
  z-index: 2;
  background: rgba(255,255,255,0.97);
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(13,31,60,0.1), 0 2px 6px rgba(13,31,60,0.06);
  padding: 14px 16px;
}
.tl-hero__badge--credit {
  left: -31px;
  bottom: 54px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 25px 25px rgba(0,0,0,0.25);
  padding: 17px 17px 16px 17px;
}
.tl-hero__badge-icon {
  width: 48px;
  height: 48px;
  background: #dcfce7;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.tl-hero__badge-label {
  font-size: 12px;
  font-weight: 700;
  color: #6a7282;
  margin: 0 0 2px;
}
.tl-hero__badge-label--upper { text-transform: uppercase; letter-spacing: 0.5px; }
.tl-hero__badge-value {
  font-size: 14px;
  font-weight: 700;
  color: #101828;
  margin: 0;
  white-space: nowrap;
}
.tl-hero__badge--zero {
  right: -40px;
  top: 77%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 11px;
  min-width: 130px;
  padding: 16px 20px;
  border-radius: 20px;
}
.tl-hero__badge--zero .tl-hero__badge-label--upper {
  font-size: 15px;
  font-weight: 500;
  color: #2b4c81;
  margin: 0;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.tl-hero__badge-big {
  font-size: 30px;
  font-weight: 700;
  color: #1a69c4;
  line-height: 27px;
  margin: 0;
}
.tl-hero__badge-sub {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  line-height: 18px;
  margin: 0;
}

/* ── INTRO ── */
.tl-intro {
  background: #fff;
  padding: 70px 20px;
}
.tl-intro__inner {
  display: flex;
  align-items: center;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}
.tl-intro__copy {
  flex: 0 0 568px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tl-intro__title {
  font-family: 'Inter', sans-serif;
  font-size: 38px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: var(--navy);
  margin: 0;
}
.tl-intro__body p {
  font-size: 16px;
  font-weight: 400;
  line-height: 27.2px;
  color: var(--text-muted);
  margin: 0 0 12px;
}
.tl-intro__disclaimer {
  font-size: 13px;
  color: #30353a;
  line-height: 1.6;
  margin: 0;
}
.tl-intro__photo-wrap {
  flex: 0 0 568px;
  height: 426px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,0.12), 0 4px 12px rgba(13,31,60,0.06);
}
.tl-intro__photo-wrap img { width: 100%; height: 100%; object-fit: cover; }

/* ── COMPARE ── */
.tl-compare {
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 20px;
}
.tl-compare__inner {
  display: flex;
  align-items: center;
  gap: 27px;
  max-width: 1200px;
  margin: 0 auto;
}
.tl-compare__copy {
  flex: 0 0 586px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.tl-compare__title {
  font-family: 'Inter', sans-serif;
  font-size: 34px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
  color: #ffffff;
  margin: 0;
}
.tl-compare__body {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
  color: #fff;
  margin: 0;
}
.tl-compare__disclaimer {
  font-size: 14px;
  color: rgba(255,255,255,0.8);
  margin: 0;
}
.tl-compare__cards {
  flex: 0 0 586px;
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: stretch;
}
.tl-compare__card {
  flex: 0 0 281px;
  border-radius: 20px;
  padding: 25px;
}
.tl-compare__card--lc {
  background: #fff;
  box-shadow: 0 4px 20px rgba(13,31,60,0.1);
}
.tl-compare__card--them {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
}
.tl-compare__card-label {
  font-size: 15px;
  font-weight: 600;
  line-height: 21.75px;
  letter-spacing: 0;
  text-transform: uppercase;
  margin: 0 0 16px;
}
.tl-compare__card--lc .tl-compare__card-label {
  background: linear-gradient(90deg, #01a1c8, #2b4c81);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.tl-compare__card--them .tl-compare__card-label { color: rgba(255,255,255,0.7); }
.tl-compare__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tl-compare__list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: 0;
  color: #3c4248;
}
.tl-compare__list li svg { flex-shrink: 0; margin-top: 2px; }
.tl-compare__list--negative li { color: rgba(255,255,255,0.85); }

/* ── HOW IT WORKS ── */
.tl-how {
  background: #f3f7fc;
  padding: 70px 20px;
}
.tl-how__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.tl-how__container {
  background: linear-gradient(173.94deg, #000 0%, #1b3f68 69.4%, #1c627d 115.67%);
  border-radius: 70px;
  padding: 60px;
}
.tl-how__header {
  text-align: center;
  margin-bottom: 40px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tl-how__title {
  font-size: 34px;
  font-weight: 800;
  color: #fff;
  margin: 0;
}
.tl-how__subtitle {
  font-size: 18px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  line-height: 1.5;
  max-width: 700px;
  margin: 0 auto;
}
.tl-how__steps {
  display: flex;
  gap: 27px;
  align-items: stretch;
}
.tl-how__step {
  flex: 1;
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px 70px 20px 20px;
  padding: 24px 37px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
}
.tl-how__step--featured {
  border: 2px solid #01a1c8;
  box-shadow: 1px 4px 17.8px 0px rgba(1,161,200,0.52), 0px 1px 3px 0px rgba(13,31,60,0.08), 0px 1px 2px 0px rgba(13,31,60,0.04);
}
.tl-how__step-chip {
  position: absolute;
  top: -16px;
  left: 64%;
  transform: translateX(-50%);
  background: #3ABDDD;
  color: #fff;
  font-size: 13px;
  /* font-weight: 700; */
  letter-spacing: 0.5px;
  padding: 6px 16px;
  border-radius: 9999px;
  white-space: nowrap;
}
.tl-how__step-num {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #FFF7E8;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  flex-shrink: 0;
}
.tl-how__step-num span {
  font-size: 45px;
  font-weight: 600;
  background: #FFA600;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.tl-how__step-content { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.tl-how__step-title {
  font-size: 21px;
  font-weight: 700;
  color: var(--navy);
  line-height: 27px;
  letter-spacing: -0.3px;
  margin: 0;
}
.tl-how__step-body {
  font-size: 16px;
  font-weight: 400;
  color: var(--text-muted);
  line-height: 26.4px;
  margin: 0;
}
.tl-how__step-badge {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #f7fafd;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 16px;
  box-shadow: 0 1px 2px rgba(13,31,60,0.06);
}
.tl-how__step-badge-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: #FFF7E8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.tl-how__step-badge-text {
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.4;
}
.tl-how__step-offers {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tl-how__step-offers-label {
  font-size: 14px;
  font-weight: 700;
  color: #949596;
  line-height: 16px;
  letter-spacing: 0;
  text-transform: none;
  margin: 0;
}
.tl-how__step-offers-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  height: 117px;
}
.tl-how__offer {
  background: rgba(255,255,255,0.95);
  border-radius: 20px;
  padding: 16px 20px;
  box-shadow: 0px 4px 16px 0px rgba(13,31,60,0.1), 0px 2px 6px 0px rgba(13,31,60,0.06);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tl-how__offer--alt { }
.tl-how__offer-rate {
  font-size: 15px;
  font-weight: 700;
  color: #6b8099;
  text-transform: uppercase;
  line-height: 18px;
  margin: 0;
}
.tl-how__offer-amount {
  font-size: 22px;
  font-weight: 700;
  color: #1a69c4;
  letter-spacing: -0.3px;
  line-height: 27px;
  white-space: nowrap;
  margin: 0;
}
.tl-how__offer--alt .tl-how__offer-amount { color: #1a69c4; }
.tl-how__offer-monthly {
  font-size: 15px;
  font-weight: 400;
  color: #00a9ce;
  line-height: 18px;
  margin: 0;
}
.tl-how__footer {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  margin-top: 40px;
}
.tl-how__footer-note {
  font-size: 14px;
  color: rgba(255,255,255,0.65);
  margin: 0;
}
.tl-how__trust {
  display: flex;
  gap: 24px;
  font-size: 14px;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
}
.tl-how__trust-item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tl-how__trust-item::before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #00a9ce;
  flex-shrink: 0;
}

/* ── WHAT TO KNOW ── */
.tl-know {
  background: #f7fafd;
  padding: 80px 20px;
}
.tl-know__inner {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}
.tl-know__header {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 820px;
}
.tl-know__title {
  font-size: 34px;
  font-weight: 800;
  color: #0d1f3c;
  margin: 0;
  line-height: 1.2;
}
.tl-know__subtitle {
  font-size: 16px;
  font-weight: 400;
  color: #3c4248;
  margin: 0;
  line-height: 1.65;
}
.tl-know__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 27px;
  width: 100%;
}
.tl-know__card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 24px 37px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 426px;
  box-shadow: 0px 1px 2px 0px rgba(13,31,60,0.04), 0px 1px 3px 0px rgba(13,31,60,0.08);
}
.tl-know__card-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #FFF7E8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.tl-know__card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tl-know__card-title {
  font-size: 21px;
  font-weight: 700;
  color: #0d1f3c;
  margin: 0;
  line-height: 1.3;
  letter-spacing: -0.3px;
}
.tl-know__card-text {
  font-size: 16px;
  font-weight: 400;
  color: #3d5a7a;
  margin: 0;
  line-height: 1.65;
}
.tl-know__footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
}
.tl-know__footer-note {
  font-size: 13px;
  color: #30353a;
  margin: 0;
}
.tl-know__footer-legal {
  font-size: 13px;
  color: #30353a;
  margin: 8px 0 0;
}

/* ── WHY PEOPLE ── */
.tl-why {
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 20px;
}
.tl-why__inner {
  display: flex;
  align-items: flex-start;
  gap: 72px;
  max-width: 1200px;
  margin: 0 auto;
}
.tl-why__copy {
  flex: 0 0 536px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.tl-why__title {
  font-family: 'Inter', sans-serif;
  font-size: 37px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: #fff;
  margin: 0;
}
.tl-why__body {
  font-size: 15px;
  font-weight: 400;
  color: rgba(255,255,255,0.85);
  line-height: 1.6;
  margin: 0;
}
.tl-why__photo-wrap {
  width: 100%;
  height: 307px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(13,31,60,0.06), 0 12px 40px rgba(13,31,60,0.12);
}
.tl-why__photo-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.tl-why__disclaimer {
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: 0;
  color: #ffffff;
  margin: 0;
}
.tl-why__benefits {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
}
.tl-why__benefit {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  background: #fff;
  border-radius: 20px;
  padding: 20px 24px;
  box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08);
}
.tl-why__benefit-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: #FFF7E8;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  flex-shrink: 0;
}
.tl-why__benefit-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--navy);
  margin: 0 0 6px;
}
.tl-why__benefit-body {
  font-size: 14px;
  font-weight: 400;
  color: var(--text-muted);
  line-height: 1.55;
  margin: 0;
}

/* ── TL FAQ ── */
.btn-tl-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  height: 45px;
  width: fit-content;
  white-space: nowrap;
  border-radius: 9999px;
  border: 2px solid transparent;
  background: linear-gradient(#fff, #fff) padding-box,
              linear-gradient(90deg, #01a1c8, #2b4c81) border-box;
  box-shadow: none;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  color: #01a1c8;
}
.btn-tl-outline span {
  background: linear-gradient(90deg, #01a1c8, #2b4c81);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.btn-tl-outline svg { flex-shrink: 0; stroke: #01a1c8; }
.tl-faq .faq__subtitle { max-width: 960px; }
.tl-faq__footer {
  text-align: center;
  padding-top: 32px;
  padding-bottom: 8px;
}
.faq__answer-list {
  margin: 12px 0 0 20px;
  padding: 0;
}
.faq__answer-list li {
  margin-bottom: 6px;
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
}

/* ── TL RESPONSIVE: 1024px ── */
@media (max-width: 1024px) {
  .tl-hero__inner,
  .tl-intro__inner,
  .tl-compare__inner,
  .tl-why__inner { gap: 40px; }
  .tl-hero__photo { width: calc(100% - 48px); }
  .tl-hero__badge--credit { display: none; }
  .tl-know__cards { gap: 16px; }
  .tl-know__title { font-size: 28px; }
  .tl-hero__copy { flex: 0 0 420px; }
  .tl-hero__headline { font-size: 36px; }
  .tl-intro__copy,
  .tl-intro__photo-wrap { flex: 0 0 auto; }
  .tl-how__container { border-radius: 40px; padding: 40px 36px; }
  .tl-why__copy { flex: 0 0 400px; }
}

/* ── TL RESPONSIVE: 768px ── */
@media (max-width: 768px) {
  .tl-hero__inner,
  .tl-intro__inner,
  .tl-compare__inner,
  .tl-why__inner { flex-direction: column; gap: 32px; }
  .tl-hero__copy,
  .tl-intro__copy,
  .tl-compare__copy,
  .tl-why__copy { flex: none; width: 100%; }
  .tl-hero__photo-wrap,
  .tl-intro__photo-wrap { width: 100%; }
  .tl-how__steps { flex-direction: column; }
  .tl-how__container { border-radius: 30px; padding: 32px 24px; }
  .tl-how__trust { flex-direction: column; gap: 8px; align-items: center; }
  .tl-hero__badge--zero { right: 0; top: auto; bottom: -50px; transform: none; }
  .tl-compare__cards { flex-direction: column; }
  .tl-know__cards { grid-template-columns: 1fr; }
  .tl-know__card { padding: 24px; }
  .tl-why__copy { flex: none; width: 100%; }
  .tl-intro__photo-wrap { flex: none; width: 100%; height: 260px; }
}

/* ── TL RESPONSIVE: 440px ── */
@media (max-width: 440px) {
  .tl-hero { padding: 80px 20px 48px; }
  .tl-hero__headline { font-size: 28px; line-height: 1.2; }
  .tl-hero__subline { font-size: 15px; }
  .tl-hero__photo { height: 240px; border-radius: 16px 50px 16px 16px; }
  .tl-how__container { border-radius: 24px; padding: 28px 20px; }
  .tl-how__title { font-size: 26px; }
  .tl-compare__title,
  .tl-why__title,
  .tl-intro__title,
  .tl-know__title { font-size: 26px; }
}

/* ════════════════════════════════════════════════════
   PERSONAL LOANS PAGE  (pl-*)
════════════════════════════════════════════════════ */

/* ── BUTTONS ── */
.btn-pl-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  height: 50px;
  width: fit-content;
  white-space: nowrap;
  border-radius: 9999px;
  background: linear-gradient(270deg, #000 17%, #1b3f68 43%, #05a1dd 109%);
  border: 2px solid #01a1c8;
  box-shadow: 0 8px 30px rgba(26,105,196,0.25);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
}
.btn-pl-dark:hover { opacity: 0.9; color: #fff; text-decoration: none; }

.btn-pl-ghost {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 24px;
  height: 45px;
  width: fit-content;
  border-radius: 9999px;
  background: transparent;
  border: none;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
.btn-pl-ghost:hover { text-decoration: underline; color: #fff; }

.btn-pl-cyan {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  height: 45px;
  width: fit-content;
  border-radius: 9999px;
  background: #00a9ce;
  border: none;
  box-shadow: 0 8px 30px 0 rgba(26,105,196,0.25);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
.btn-pl-cyan:hover { opacity: 0.9; color: #fff; text-decoration: none; }

.btn-pl-grad {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  min-height: 45px;
  border-radius: 9999px;
  background: linear-gradient(to right, #01a1c8, #2b4c81 100.17%);
  box-shadow: 0 8px 15px rgba(26,105,196,0.25);
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
.btn-pl-grad:hover { opacity: 0.9; color: #fff; text-decoration: none; }

.btn-pl-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  height: 45px;
  width: fit-content;
  white-space: nowrap;
  border-radius: 9999px;
  border: 2px solid transparent;
  background: linear-gradient(#fff, #fff) padding-box,
              linear-gradient(90deg, #01a1c8, #2b4c81) border-box;
  box-shadow: none;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  color: #01a1c8;
}
.btn-pl-outline span {
  background: linear-gradient(90deg, #01a1c8, #2b4c81);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.btn-pl-outline svg { flex-shrink: 0; stroke: #01a1c8; }

/* ── HERO ── */
.pl-hero {
  position: relative;
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 80px 20px 130px;
  overflow: hidden;
}
.pl-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.pl-hero__circles .hero__circle--2 {
  top: 55%;
}
.pl-hero__circles .hero__circle--3 {
  width: 480px;
  height: 480px;
  transform: translateX(85%);
  top: -220px;
}
.pl-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;
}
.pl-hero__copy {
  flex: 0 0 540px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.pl-hero__headline {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  line-height: 1.33;
  letter-spacing: -1px;
}
.pl-hero__subline {
  font-size: 18px;
  color: rgba(255,255,255,0.9);
  margin: 0;
  line-height: 1.6;
}
.pl-hero__bullets {
  list-style: none;
  margin: 0;
  padding: 0 0 0 32px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pl-hero__bullet {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.3px;
}
.pl-hero__bullet-dot {
  width: 13px;
  height: 13px;
  border-radius: 12px;
  flex-shrink: 0;
  background: linear-gradient(171.4deg, #000 0%, #1b3f68 69.4%, #1c627d 115.7%);
}
.pl-hero__cta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pl-hero__photo-wrap {
  flex: 0 1 476px;
  position: relative;
  align-self: center;
}
.pl-hero__ring {
  position: absolute;
  top: -90px;
  left: 46%;
  width: 340px;
  height: 340px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.pl-hero__ring img { width: 100%; height: 100%; }
.pl-hero__dots {
  position: absolute;
  bottom: -21px;
  left: -86px;
  width: 120px;
  pointer-events: none;
  z-index: 0;
}
.pl-hero__dots img { width: 100%; }
.pl-hero__photo {
  position: relative;
  z-index: 1;
  border-radius: 20px 70px 20px 20px;
  overflow: hidden;
  border: 7px solid rgba(255,255,255,0.4);
  height: 315px;
}
.pl-hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
.pl-hero__badge {
  position: absolute;
  bottom: 44px;
  left: -74px;
  z-index: 2;
  background: #fff;
  border-radius: 16px;
  border-top: 1px solid #e5e7eb;
  padding: 0px 17px 1px 17px;
  height: 82px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}
.pl-hero__badge-icon {
  width: 48px;
  height: 48px;
  background: #dcfce7;
  border-radius: 33554400px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
}
.pl-hero__badge-label {
  font-size: 12px;
  font-weight: 700;
  color: #6a7282;
  margin: 0;
}
.pl-hero__badge-value {
  font-size: 14px;
  font-weight: 700;
  color: #101828;
  margin: 0;
  white-space: nowrap;
}
.pl-hero__badge-sub {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  margin: 0;
}

/* Apply-online form between hero and "How Personal Loans Work" is rendered
   by template-parts/section-prove-otp-form-widget.php via the
   [prove_otp_form] shortcode — it's already styled generically under
   "PROVE OTP FORM WIDGET" (.loc-prove-otp-form-section / -inner) further
   down in this file, shared with the personal-loans location subpages. No
   page-specific CSS needed here.
   */

/* ── HOW PERSONAL LOANS WORK ── */
.pl-how-wrap {
  position: relative;
  margin-top: 0;
  z-index: 1;
  padding: 0 20px 0;
  background: #fff;
}
.pl-how-wrap__panel {
  max-width: 1202px;
  min-height: 590px;
  margin: 0 auto;
  padding: 60px 0;
  display: flex;
  flex-direction: column;
  gap: 44px;
  box-sizing: border-box;
}
.pl-how-wrap__header {
  text-align: center;
  color: #000;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.pl-how-wrap__title {
  font-size: 35px;
  font-weight: 800;
  margin: 0;
  line-height: 1.2;
}
.pl-how-wrap__subtitle {
  font-size: 18px;
  font-weight: 500;
  margin: 0;
  line-height: 1.55;
  letter-spacing: 0.26px;
}
.pl-how-wrap__cards {
  display: flex;
  gap: 27px;
}
.pl-how-wrap__card {
  flex: 1;
  background: #fff;
  border: none;
  border-top: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 44px 34px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0px 1px 2px 0px rgba(13,31,60,0.04), 0px 1px 3px 0px rgba(13,31,60,0.08);
}
.pl-how-wrap__card-icon {
  width: 52px;
  height: 52px;
  background: #FFF7E8;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pl-how-wrap__card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pl-how-wrap__card-title {
  font-size: 21px;
  font-weight: 700;
  color: #0d1f3c;
  margin: 0;
  letter-spacing: -0.3px;
  line-height: 1.3;
}
.pl-how-wrap__card-text {
  font-size: 15px;
  color: #3d5a7a;
  margin: 0;
  line-height: 1.6;
}
.pl-how-wrap__dots {
  display: none;
}
.pl-how-wrap__disclaimer {
  font-size: 13px;
  text-align: center;
  margin: 0;
}

/* ── BORROW REASONS ── */
.pl-reasons {
  background: linear-gradient(160deg, #01A1C8 8.49%, #2B4C81 91.51%);
  padding: 40px 20px 70px;
}
.pl-reasons__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 44px;
}
.pl-reasons__header {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pl-reasons__title {
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  line-height: 1.15;
}
.pl-reasons__subtitle {
  font-size: 16px;
  color: #fff;
  margin: 0;
  line-height: 1.5;
}
.pl-reasons__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.pl-reasons__card {
  background: #fff;
  border: 1px solid #f1f5f9;
  border-radius: 16px;
  padding: 25px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 1px 1.5px rgba(0,0,0,0.1), 0 1px 1px rgba(0,0,0,0.1);
}
.pl-reasons__card-icon {
  width: 52px;
  height: 52px;
  background: #FFF7E8;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pl-reasons__card-title {
  font-size: 18px;
  font-weight: 700;
  color: #1d293d;
  margin: 0;
  line-height: 1.35;
}
.pl-reasons__card-body {
  font-size: 15px;
  font-weight: 400;
  color: #3d5a7a;
  margin: 0;
  line-height: 20px;
}
.pl-reasons__card-body--bold {
  font-weight: 700;
}
.pl-reasons__card-tags {
  font-size: 13px;
  color: #30353a;
  margin: 0;
}

/* ── CALCULATOR ── */
.pl-calc {
  background: #f9fcfe;
  padding: 70px 20px;
}
.pl-calc__panel {
  max-width: 1202px;
  margin: 0 auto;
  background: linear-gradient(-11.2deg, #01a1c8 8.49%, #2b4c81 91.51%);
  border-radius: 70px;
  padding: 60px;
  display: flex;
  flex-direction: column;
  gap: 27px;
  box-sizing: border-box;
}
.pl-calc__header {
  text-align: center;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.pl-calc__title {
  font-size: 44px;
  font-weight: 800;
  margin: 0;
  line-height: 1.1;
  letter-spacing: -0.5px;
}
.pl-calc__subtitle {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  line-height: 1.65;
}
.pl-calc__body {
  background: #fff;
  border-radius: 30px;
  padding: 40px 60px;
  display: flex;
  gap: 54px;
  align-items: center;
  flex-wrap: wrap;
}
.pl-calc__controls {
  flex: 1;
  min-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.pl-calc__row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pl-calc__row-labels {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pl-calc__row-name {
  font-size: 17px;
  font-weight: 700;
  color: #6e6e6e;
  letter-spacing: -0.3px;
}
.pl-calc__row-value {
  font-size: 20px;
  font-weight: 700;
  color: #039cc4;
  letter-spacing: -0.3px;
}
.calc-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 8px;
  border-radius: 4px;
  background: #e2e8f0;
  outline: none;
  cursor: pointer;
}
.calc-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #01a1c8;
  border: none;
  box-shadow: 0 2px 6px rgba(1,161,200,0.4);
  cursor: pointer;
}
.calc-slider::-moz-range-thumb {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #01a1c8;
  border: none;
  box-shadow: 0 2px 6px rgba(1,161,200,0.4);
  cursor: pointer;
}
.pl-calc__row-range {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  font-weight: 600;
  color: #6e6e6e;
  letter-spacing: -0.3px;
}
.pl-calc__result {
  flex: 1;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  gap: 23px;
}
.pl-calc__result-box {
  background: linear-gradient(172.2deg, #01a1c8 8.49%, #2b4c81 91.51%);
  border: 1px solid #d9d9d9;
  border-radius: 20px;
  padding: 30px 32px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
}
.pl-calc__result-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
}
.pl-calc__result-label {
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  margin: 0;
}
.pl-calc__result-amount {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}
.pl-calc__result-num {
  font-size: 58px;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.3px;
}
.pl-calc__result-unit {
  font-size: 22px;
  font-weight: 700;
  color: #FFA600;
  line-height: 1.2;
  letter-spacing: -0.3px;
  padding-bottom: 6px;
}
.pl-calc__result-note {
  font-size: 14px;
  font-weight: 400;
  color: #fff;
  text-align: center;
  margin: 0;
  line-height: 16px;
  width: 100%;
}
.pl-calc__result-disclaimer {
  font-size: 14px;
  font-weight: 700;
  color: #212121;
  text-align: center;
  margin: 0;
  line-height: 16px;
}
.pl-calc__trust {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: center;
}
.pl-calc__trust-item {
  font-size: 14px;
  color: rgba(60,66,72,0.75);
  display: flex;
  align-items: center;
  gap: 4px;
}
.pl-calc__trust-item::before {
  content: '';
  display: inline-block;
  width: 13px;
  height: 13px;
  border-radius: 12px;
  background: linear-gradient(to right, #01a1c8, #2b4c81);
  flex-shrink: 0;
}

/* ── HOW IT WORKS (STEPS) ── */
.pl-how {
  background: #fff;
  padding: 70px 20px;
}
.pl-how__inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}
.pl-how__header {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.pl-how__title {
  font-size: 44px;
  font-weight: 800;
  color: #0d1f3c;
  margin: 0;
  line-height: 1.1;
  letter-spacing: -0.5px;
}
.pl-how__subtitle {
  font-size: 16px;
  color: #2a3d55;
  margin: 0;
  line-height: 1.6;
}
.pl-how__steps {
  display: flex;
  gap: 43px;
  width: 100%;
  position: relative;
}
.pl-how__steps::before {
  content: '';
  position: absolute;
  top: 46px;
  left: calc(16.66% + 5px);
  right: calc(16.66% + 5px);
  height: 2px;
  background: #c9e0ff;
  z-index: 0;
}
.pl-how__step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 23px;
  text-align: center;
  position: relative;
  z-index: 1;
}
.pl-how__step-num {
  position: relative;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 3.5px rgba(108,127,131,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pl-how__step-num::before {
  content: "";
  position: absolute;
  width: 119px;
  height: 119px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(1,161,200,1) 0%, rgba(43,76,129,1) 100%);
  opacity: 0.25;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  pointer-events: none;
}
.pl-how__step-num span {
  font-size: 45px;
  font-weight: 600;
  color: #FFA600;
  line-height: 1;
}
.pl-how__step-title {
  font-size: 18px;
  font-weight: 700;
  color: #0d1f3c;
  margin: 0;
  letter-spacing: -0.3px;
  line-height: 1.5;
}
.pl-how__step-body {
  font-size: 15px;
  color: #3d5a7a;
  margin: 0;
  line-height: 1.6;
}
.pl-how__step--featured {
  /* highlighted step */
}
.pl-how__step-badge {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
}
.pl-how__step-badge-icon {
  width: 52px;
  height: 52px;
  background: #FFF7E8;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pl-how__step-badge-text {
  font-size: 18px;
  font-weight: 700;
  color: #0d1f3c;
  letter-spacing: -0.3px;
  white-space: nowrap;
}
.pl-how__footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.pl-how__footer-note {
  font-size: 13px;
  line-height: 28.8px;
  color: #30353a;
  margin: 0;
}

/* ── FAQ footer link ── */
.pl-faq__footer {
  text-align: center;
  padding: 80px 0 10px;
}

/* ── BOTTOM CTA ── */
.pl-cta {
  padding: 70px 20px;
  background: linear-gradient(174.4deg, #01a1c8 8.49%, #2b4c81 91.51%);
}
.pl-cta__inner {
  max-width: 700px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.pl-cta__eyebrow {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255,255,255,0.8);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0;
}
.pl-cta__title {
  font-size: 38px;
  font-weight: 800;
  color: #fff;
  margin: 0;
  line-height: 1.1;
  letter-spacing: -0.5px;
}
.pl-cta__subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  margin: 0;
  line-height: 1.7;
}
.pl-cta__fine {
  font-size: 14px;
  color: rgba(255,255,255,0.7);
  margin: 0;
}

/* ════════════════════════════════════════════════════
   PL RESPONSIVE
════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .pl-hero { padding: 60px 48px; }
  .pl-hero__copy { flex: 0 0 420px; }
  .pl-hero__headline { max-width: 250px; font-size: 40px; }
  .pl-hero__subline { font-size: 16px; }
  .pl-hero__photo-wrap { flex-basis: 380px; }
  .pl-hero__ring {position: absolute; left: auto; top: -39px; right: -70px; width: 240px; height: 240px; pointer-events: none; z-index: 0; opacity: 0.55; }
  .pl-hero__badge { left: -60px; }

  .pl-how-wrap { margin-top: 0; padding: 0; }
  .pl-how-wrap__panel { border-radius: 0; padding: 60px 48px; }

  .pl-reasons { padding: 70px 48px; }
  .pl-reasons__title { font-size: 35px; }
  .pl-reasons__grid { grid-template-columns: repeat(2, 1fr); }

  .pl-calc { padding: 0; }
  .pl-calc__panel { border-radius: 0; padding: 60px 48px; }
  .pl-calc__title { font-size: 35px; }
  .pl-calc__body { padding: 40px 48px; gap: 36px; }

  .pl-how { padding: 70px 48px; }

  .pl-faq__footer {
    padding-top: 48px;
  }

  .pl-cta { padding: 70px 48px; }
}
@media (max-width: 767px) {
  .pl-hero { padding: 48px 36px; }
  .pl-hero__inner { flex-direction: column; gap: 40px; }
  .pl-hero__copy { flex: none; width: 100%; }
  .pl-hero__photo-wrap { flex: 0 0 auto; width: 100%; align-self: auto; padding-left: 36px; }
  .pl-hero__dots { left: -50px; width: 180px; height: 160px; bottom: -26px; }
  .pl-hero__photo { height: auto; aspect-ratio: 4 / 3; }
  .pl-hero__badge { left: 0px; bottom: 24px; }

  .pl-how-wrap__panel { padding-left: 36px; padding-right: 36px; }
  .pl-how-wrap__cards { display: block; width: 100%; overflow: visible; gap: 0; }
  .pl-how-wrap__card {
    display: none;
    width: 100%;
    box-sizing: border-box;
  }
  .pl-how-wrap__card.is-active { display: flex; }
  /* Dot indicators – pl how */
  .pl-how-wrap__dots { display: flex; justify-content: center; gap: 8px; margin: 0 0 4px; }
  .pl-how-wrap__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(206,206,206,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
  .pl-how-wrap__dot.is-active { background: var(--cyan); transform: scale(1.2); }
  /* Slider – JS-driven show/hide */

  .pl-reasons { padding-left: 36px; padding-right: 36px; }

  .pl-calc__panel { padding-left: 36px; padding-right: 36px; }
  .pl-calc__body { flex-direction: column; padding-left: 24px; padding-right: 24px; }
  .pl-calc__controls { min-width: auto; width: 100%; }
  .pl-calc__result { min-width: auto; }
  .pl-calc__result-box { padding-left: 16px; padding-right: 16px; }
  .pl-calc__trust { flex-direction: column; align-items: center; }

  .pl-how__title { font-size: 35px; }
  .pl-how__steps { flex-direction: column; gap: 48px; }
  .pl-how__steps::before { display: none; }

  .pl-reasons__grid { grid-template-columns: 1fr; }

  .pl-cta { padding-left: 36px; padding-right: 36px; }
}
@media (max-width: 440px) {
  .pl-hero__cta { justify-content: center; }
  .btn-pl-ghost { padding-left: 0px; padding-right: 0px; }
  .pl-hero__photo-wrap { padding-left: 24px; }
  .pl-hero__photo { height: 230px; aspect-ratio: auto; }
  .pl-hero__badge { bottom: 20px; }
  .pl-calc__row-labels { flex-direction: column; }
  .pl-calc__result-num { font-size: 30px; }

  .btn-pl-grad { white-space: normal; }
}

/* ════════════════════════════════════════════════════════════════════════
 *  ACCESSIBILITY
 * ════════════════════════════════════════════════════════════════════════ */

/* Skip-to-content link */
.skip-to-content {
  position: absolute;
  top: -100%;
  left: 16px;
  z-index: 10000;
  background: var(--brand-blue);
  color: #ffffff;
  padding: 12px 20px;
  border-radius: 0 0 8px 8px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: underline;
  transition: top 0.15s;
}
.skip-to-content:focus {
  top: 0;
}

/* Global focus-visible ring */
:focus { outline: none; }
:focus-visible {
  outline: 3px solid var(--brand-blue);
  outline-offset: 3px;
}

/* ══════════════════════════════════════════════════════════════
   CAR TITLE LOANS PAGE  (prefix: ctl-)
   Figma: Main Light-Car Title Loan  node 2347:2609
══════════════════════════════════════════════════════════════ */

/* ── CTL SHARED TOKENS ── */
.ctl-section-eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--cyan-alt);
  margin-bottom: 8px;
}
.ctl-btn-cyan {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  padding: 11px 24px;
  border-radius: 9999px;
  background: var(--cyan);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  box-shadow: var(--shadow-btn);
  transition: opacity .2s;
  white-space: nowrap;
  border: none;
  cursor: pointer;
  max-width: 188px;
}
.ctl-btn-cyan:hover { opacity: .88; color: #fff; text-decoration: none; }
.fl-btn-cyan {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  padding: 11px 24px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #01A1C8 0%, #2B4C81 100.17%);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  box-shadow: var(--shadow-btn);
  transition: opacity .2s;
  white-space: nowrap;
  border: none;
  cursor: pointer;
  max-width: 188px;
}
.fl-btn-cyan:hover { opacity: .88; }
.ctl-btn-gradient {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  padding: 11px 24px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  box-shadow: var(--shadow-btn);
  transition: opacity .2s;
  white-space: nowrap;
  border: none;
  cursor: pointer;
}
.ctl-btn-gradient:hover { opacity: .88; color: #fff; text-decoration: none; }

/* Yellow icon badge (52×52, rounded-12) */
.ctl-yellow-icon {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
  background: #fff7e8;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* Large circle icon (92×92, rounded-full) – How Do Title Loans Work cards */
.ctl-icon-circle {
  width: 92px;
  height: 92px;
  flex-shrink: 0;
  background: #fff7e8;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── CTL HERO ── */
.ctl-hero {
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  position: relative;
  padding: 60px 20px 108px;
  overflow: hidden;
}
.ctl-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}
.ctl-hero__inner--no-padding-right { padding-right: 0; }

/* Left copy */
.ctl-hero__copy {
  flex: 0 0 540px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 564px;
  color: #fff;
}
.ctl-hero__eyebrow-wrapper {
  margin: 0;
}
.ctl-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 32px;
  border-radius: 9999px;
  padding: 6px 16px;
  background: #3abddd;
  color: #d8f5ff;
  font-weight: 700;
  font-size: 13px;
  line-height: 1.2;
  letter-spacing: 0.2px;
  margin: 0;
}
.ctl-hero__headline {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin: 0;
}
.ctl-hero__subline {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255,255,255,0.9);
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ctl-hero__subline a {
  color: rgba(255, 255, 255, 0.9);
  text-decoration: underline;
}
/* ul inside .ctl-hero__subline inherits the .ctl-hero__bullets / .ctl-hero__bullet layout,
   using ::before for the dot so no extra markup is required. */
.ctl-hero__subline ul {
  list-style: none;
  margin: 0;
  padding: 0 0 0 32px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ctl-hero__subline ul li {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 18px;
  font-weight: 700;
  line-height: 21px;
  color: #fff;
  letter-spacing: -0.3px;
}
.ctl-hero__subline ul li::before {
  content: '';
  display: block;
  width: 13px;
  height: 13px;
  border-radius: 12px;
  flex-shrink: 0;
  background: linear-gradient(171.4deg, #000 0%, #1b3f68 69.4%, #1c627d 115.7%);
}
.ctl-hero__subline-lg {
  font-size: 20px;
  font-weight: 700;
}
.ctl-hero__bullets {
  list-style: none;
  margin: 0;
  padding: 0 0 0 32px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ctl-hero__bullet {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.3px;
}
.ctl-hero__bullet-dot {
  width: 13px;
  height: 13px;
  border-radius: 12px;
  flex-shrink: 0;
  background: linear-gradient(171.4deg, #000 0%, #1b3f68 69.4%, #1c627d 115.7%);
}
.ctl-hero__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  height: 50px;
  padding: 11px 24px;
  width: 188px;
  border-radius: 9999px;
  background: var(--grad-btn);
  border: 2px solid var(--cyan);
  box-shadow: var(--shadow-btn);
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  transition: opacity .2s;
  white-space: nowrap;
}
.ctl-hero__cta-btn:hover { opacity: .88; color: #fff; text-decoration: none; }

/* Decorative bubbles — same pattern as .refi-hero__circles */
.ctl-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
/* circle--1: mid-left, partially off bottom */
/* circle--2: large, far right, partially off bottom */
.ctl-hero__circles .hero__circle--2 { top:55%; }
/* circle--3: upper right */
.ctl-hero__circles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }

/* Photo wrap — matches .tl-hero__photo-wrap */
.ctl-hero__photo-wrap {
  flex: 1 1 600px;
  max-width: 476px;
  position: relative;
  min-height: 380px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 36px;
}
.ctl-hero__photo-wrap--no-padding-right { padding-right: 0; }
/* Ring decoration — top-right, matches .tl-hero__ring */
.ctl-hero__ring {
  position: absolute;
  top: -60px;
  left: 46%;
  width: 340px;
  height: 340px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.ctl-hero__ring img { width: 100%; height: 100%; }
/* Dot grid decoration — bottom-left, matches .tl-hero__dots */
.ctl-hero__dots {
  position: absolute;
  bottom: -6px;
  left: -82px;
  width: 180px;
  height: 160px;
  pointer-events: none;
  z-index: 0;
}
.ctl-hero__dots img { width: 100%; height: 100%; }
/* Main photo frame */
.ctl-hero__photo {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 476px;
  height: 315px;
  border-radius: 20px 70px 20px 20px;
  border: 7px solid rgba(255,255,255,0.4);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(13,31,60,0.25);
}
.ctl-hero__photo img { width: 100%; height: 100%; object-fit: cover; }
/* Savings badge */
.ctl-hero__savings-badge {
  position: absolute;
  bottom: -2px;
  right: 0;
  background: rgba(255,255,255,0.95);
  border-radius: 20px;
  padding: 16px 20px;
  box-shadow: 0 4px 16px rgba(13,31,60,0.1), 0 2px 6px rgba(13,31,60,0.06);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: flex-start;
  text-align: left;
}
.ctl-hero__savings-label {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin: 0 0 4px;
}
.ctl-hero__savings-amount {
  font-size: 30px;
  font-weight: 700;
  color: var(--brand-blue);
  margin: 0;
  line-height: 1;
}
.ctl-hero__savings-note {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  margin: 0;
  max-width: 149px;
  line-height: 18px;
}

/* ── CTL CAR VALUE WIDGET (shortcode wrapper) ── */
.ctl-car-value-section {
  z-index: 1;
  padding: 0 20px 0;  
}
.ctl-car-value-widget {
  position: relative;
  max-width: 1200px;
  margin: -66px auto 0;
  padding: 0;
}
.ctl-car-value-widget--light {
  background: #F7FAFD;
}
/* All inner styling lives in the plugin's main.min.css
   under the .ctl-car-value-widget scope */

/* ── CTL MAKE YOUR CAR WORK FOR YOU ── */
.ctl-make-car-work {
  background: #fff;
  padding: 70px 20px;
}
.ctl-make-car-work__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
}
.ctl-make-car-work__title {
  font-size: 38px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.5px;
  margin: 0 0 16px;
}
.ctl-make-car-work__body {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3c4248;
  margin: 0;
}

/* ── RV MAKE IT EASY (two-column split) ── */
.rv-make-easy {
  background: #fff;
  padding: 70px 36px;
}
.rv-make-easy__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  gap: 64px;
  align-items: center;
}
.rv-make-easy__copy {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 4px 0;
}
.rv-make-easy__eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #00a8e8;
  line-height: 27px;
  margin: 0;
}
.rv-make-easy__title {
  font-size: 38px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.2;
  color: #0d1f3c;
  margin: 0;
}
.rv-make-easy__body {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3d5a7a;
  margin: 0;
}
.rv-make-easy__photo-wrap {
  flex: 1 1 0;
  border-radius: 70px 28px 28px 28px;
  overflow: hidden;
  box-shadow: 0px 12px 40px rgba(13, 31, 60, 0.12), 0px 4px 12px rgba(13, 31, 60, 0.06);
  height: 426px;
}
.rv-make-easy__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 900px) {
  .rv-make-easy__inner {
    flex-direction: column;
    gap: 40px;
  }
  .rv-make-easy__photo-wrap {
    width: 100%;
    height: 280px;
    border-radius: 40px 16px 16px 16px;
  }
  .rv-make-easy__title {
    font-size: 28px;
  }
}

/* ── CTL HOW DO TITLE LOANS WORK? ── */
.ctl-how-works {
  background: #f7fafd;
  padding: 70px 20px;
  box-shadow: 0 4px 2px rgba(0,0,0,0.06);
}
.ctl-how-works--white-bg {
  background: #ffffff;
}
.mtl-how-works {
  background: linear-gradient(172.26deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 0;
  box-shadow: 0 4px 2px rgba(0,0,0,0.06);
}
.ctl-how-works__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.ctl-how-works__top {
  display: flex;
  gap: 27px;
  align-items: stretch;
}
.mtl-how-works__top {
  display: flex;
  gap: 27px;
  align-items: center;
  flex-direction: column;
}
.ctl-how-works__copy {
  flex-shrink: 0;
  width: 383px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
}
.mtl-how-works__copy {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  align-items: center;
}
.ctl-how-works__title {
  font-size: 38px;
  font-weight: 700;
  color: #1f1f1f;
  line-height: 1.15;
  margin: 0;
}
.mtl-how-works__title {
  font-size: 38px;
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  margin: 0;
}
.ctl-how-works__body {
  font-size: 16px;
  line-height: 1.6;
  color: #3c4248;
  letter-spacing: .26px;
  margin: 0;
}
.mtl-how-works__body {
  font-size: 17px;
  line-height: 1.6;
  color: #fff;
  letter-spacing: .26px;
  margin: 0;
  text-align: center;
}
.ctl-how-works__video-wrap {
  flex: 1;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,0.12), 0 4px 12px rgba(13,31,60,0.06);
  max-height: 350px;
}
.ctl-how-works__video-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ctl-how-works__video-player {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  background: #000;
}
.ctl-how-works__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70px;
  height: 70px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.ctl-how-works__play svg { margin-left: 4px; }

/* 3 benefit cards */
.ctl-how-works__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 27px;
}
.ctl-how-works__card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 30px 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}
.mtl-how-works__card {
  flex-direction: column;
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 30px 24px;
  display: flex;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}
.ctl-how-works__card-text {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--navy);
  letter-spacing: -.3px;
  margin: 0;
}

/* ── CTL WHAT IS A CAR TITLE LOAN? ── */
.ctl-what-is {
  background: #fff;
  padding: 70px 20px;
}
.ctl-what-is--light-bg {
  background: #f7fafd;
}
.ctl-what-is__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 64px;
}
.ctl-what-is__copy {
  flex: 0 0 568px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ctl-what-is__title {
  font-size: 38px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.5px;
  line-height: 1.2;
  margin: 0;
}
.ctl-what-is__body {
  font-size: 16px;
  line-height: 1.7;
  color: #3c4248;
  margin: 0;
}
.ctl-what-is__body sup a { color: inherit; font-size: 11px; }
.ctl-what-is__photo-wrap {
  flex: 0 0 calc(100% - 632px);
  height: 426px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,0.12), 0 4px 12px rgba(13,31,60,0.06);
}
.ctl-what-is__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── CTL BENEFITS ── */
.ctl-benefits {
  background: linear-gradient(172.26deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 20px;
}
.mtl-benefits {
  background: #fff;
  padding: 70px 20px;
}
.ctl-benefits__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.mtl-benefits__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 10px;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.rvtl-benefits__subtitle {
  max-width: 706px;
}
.ctl-benefits__header { 
  display: flex; 
  flex-direction: column; 
  gap: 8px; 
}
.mtl-benefits__header { 
  display: flex; 
  flex-direction: column; 
  gap: 8px; 
  align-items: center;
  text-align: center;
}
.ctl-benefits__title {
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.5px;
  line-height: 1.5;
  margin: 0;
}
.mtl-benefits__title {
  font-size: 40px;
  font-weight: 700;
  color: #0D1F3C;
  letter-spacing: -.5px;
  line-height: 1.5;
  margin: 0;
}
.ctl-benefits__subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
}
.ctl-benefits__text {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ctl-benefits__text ul,
.ctl-benefits__text ol { padding-left: 24px; }
.ctl-benefits__text li { margin-bottom: 8px; }
.ctl-benefits__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.ctl-benefits__card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 33px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}
.mtl-benefits__card {
  background: #F7FAFD;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 16px 16px;
  display: flex;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
  align-items: center;
}
.ctl-benefits__card-text {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--navy);
  letter-spacing: -.3px;
  margin: 0;
}
.ctl-benefits__body-text,
.ctl-benefits__footer-text {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
}
.mtl-benefits__footer-text {
  font-size: 16px;
  color: #2A3D55;
  line-height: 1.6;
  margin: 0;
  text-align: center;
}
.ctl-benefits__btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  border-radius: 9999px;
  background: transparent;
  border: 2px solid #ffffff;
  box-shadow: 0 8px 30px rgba(26,105,196,0.25);
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
}
.ctl-benefits__btn-outline:hover { background: rgba(255,255,255,0.12); color: #fff; text-decoration: none; }

/* ── CTL OUR AUTO LOAN PROCESS ── */
.ctl-process {
  background: #fff;
  padding: 70px 20px;
}
.mtl-process {
  background: #fff;
  padding: 70px 0;
}
.rvtl-process {
  background: #F7FAFD;
  padding: 70px 0;
}
.ctl-process__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.ctl-process__header {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
}
.ctl-process__title {
  font-size: 44px;
  font-weight: 800;
  color: var(--navy);
  letter-spacing: -.5px;
  margin: 0;
}
.ctl-process__subtitle {
  font-size: 16px;
  color: var(--text-body);
  line-height: 1.6;
  text-align: center;
  margin: 0;
}
.mtl-process__subtitle {
  font-size: 16px;
  color: var(--text-body);
  line-height: 1.6;
  text-align: center;
  margin: 0;
  max-width: 706px;
}
.ctl-process__steps {
  display: flex;
  gap: 43px;
  position: relative;
}
.slider__dots {
  display: none;
}
/* Horizontal connector line */
.ctl-process__connector {
  position: absolute;
  top: 45px;
  left: calc(12.5% + 20px);
  width: calc(75% - 40px);
  height: 2px;
  background: #c9e0ff;
  z-index: 0;
}
.ctl-process__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex: 1;
  gap: 23px;
  position: relative;
  z-index: 1;
}
.ctl-process__circle {
  width: 92px;
  height: 92px;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 0 3.5px rgba(108,127,131,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.ctl-process__circle::before {
  content: "";
  position: absolute;
  width: 119px;
  height: 119px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(1, 161, 200, 1) 0%, rgba(43, 76, 129, 1) 100%);
  opacity: 0.25;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  pointer-events: none;
}
.ctl-process__circle span {
  font-size: 45px;
  font-weight: 600;
  color: #ffa600;
  line-height: 1;
}
.ctl-process__step-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.3px;
  margin: 0;
  line-height: 1.5;
}
.ctl-process__step-desc {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-muted);
  line-height: 1.72;
  margin: 0;
}
.ctl-process__step-desc a { color: var(--text-muted); text-decoration: underline; }

/* ── CTL TIPS FOR GETTING YOUR CASH FASTER ── */
.ctl-tips {
  background: #f7fafd;
  padding: 70px 20px;
}
.ctl-tips__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.ctl-tips__header { display: flex; flex-direction: column; gap: 8px; }
.ctl-tips__title {
  font-size: 44px;
  font-weight: 800;
  color: var(--navy);
  letter-spacing: -.5px;
  margin: 0;
}
.ctl-tips__subtitle {
  font-size: 16px;
  color: var(--text-body);
  line-height: 1.6;
  margin: 0;
}
.ctl-tips__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ctl-tips__item {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}
.ctl-tips__item-text {
  font-size: 18px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.5;
  letter-spacing: -.3px;
  margin: 0;
}
.ctl-tips__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-body);
}
.ctl-tips__body p { margin: 0; }
.ctl-tips__body sup a { color: inherit; font-size: 11px; }
.ctl-tips__body ul,
.ctl-tips__body ol { padding-left: 24px; }
.ctl-tips__body li { margin-bottom: 8px; }
.ctl-tips__ctas {
  display: flex;
  gap: 16px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

/* ── CTL LOCATIONS ── */

.ctl-locations {
  background: #fff;
  padding: 70px 20px;
}
.ctl-locations__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 27px;
  align-items: center;
  width: 100%;
}
.ctl-locations__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
}
.ctl-locations__eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #0d1f3c;
  line-height: 27px;
  margin: 0;
}
.ctl-locations__title {
  font-size: 44px;
  font-weight: 800;
  letter-spacing: -0.5px;
  line-height: 1.1;
  color: #0d1f3c;
  margin: 0;
}
.ctl-locations__widget {
  width: 100%;
}

/* ── dealer-locator widget overrides (scoped to ctl-locations) ── */

/* Remove stale margin from radio holder */
.ctl-locations .dealer-locator-widget__radio-holder {
  margin-bottom: 0;
}

/* Search + radio type on the same row */
.ctl-locations .dealer-locator-widget__search-bar-dealer-type-wrapper {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 24px;
  width: 100%;
}

/* ── Search bar ── */
.ctl-locations .dealer-locator-widget__search-bar {
  flex: 1 0 0;
  min-width: 368px;
  max-width: 520px;
  height: 54px;
  background: #fff;
  border: 1px solid #01a1c8;
  border-radius: 9999px;
  box-shadow: 0px 1px 3px rgba(13, 31, 60, 0.08), 0px 1px 2px rgba(13, 31, 60, 0.04);
  padding: 0;
  margin-bottom: 0;
  box-sizing: border-box;
  overflow: hidden;
}
.ctl-locations .dealer-locator-widget__input-button {
  display: flex;
  align-items: center;
  height: 100%;
  margin-right: 0;
}
.ctl-locations .dealer-locator-widget__zip {
  flex: 1;
  border: none;
  background: none;
  font-size: 15px;
  font-weight: 700;
  padding: 0 20px;
  color: #0d1f3c;
  min-width: 0;
}
.ctl-locations .dealer-locator-widget__zip::placeholder {
  color: rgba(13, 31, 60, 0.5);
  font-weight: 700;
}
.ctl-locations .dealer-locator-widget__zip:focus {
  outline: none;
}
.ctl-locations .dealer-locator-widget__btn-submit {
  background: #01a1c8;
  border: none;
  border-radius: 0 9999px 9999px 0;
  width: 60px;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  color: #ffffff;
  margin: unset;
}
.ctl-locations .dealer-locator-widget__btn-submit .fa-search {
  font-size: 18px !important;
}

/* ── Radio pills ── */
.ctl-locations .dealer-locator-widget__dealer-type {
  flex: 1 0 0;
  min-width: 368px;
  max-width: 656px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  align-items: center;
}
.ctl-locations .dealer-locator-widget__radio {
  flex: 1 0 0;
  min-width: 260px;
}
.ctl-locations .dealer-locator-widget__label {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 54px;
  padding: 0 16px;
  background: #f7fafd;
  border: 1px solid #eef2f7;
  border-radius: 80px;
  box-shadow: 0px 1px 1.5px rgba(13, 31, 60, 0.08), 0px 1px 1px rgba(13, 31, 60, 0.04);
  font-size: 18px;
  font-weight: 700;
  color: #0d1f3c;
  cursor: pointer;
  margin: 0;
  user-select: none;
}
/* Custom radio circle */
.ctl-locations .dealer-locator__radio-checkmark {
  width: 26px;
  height: 26px;
  min-width: 22px;
  border-radius: 50%;
  border: 2px solid #c5cfd9;
  background: #fff;
  position: relative;
  margin-right: 0;
}
.ctl-locations .dealer-locator__radio-checkmark::after {
  content: "";
  width: 16px;
  height: 16px;
  background: #01a1c8;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: none;
}
.ctl-locations .dealer-locator-widget__label input:checked + .dealer-locator__radio-checkmark {
  border-color: #D4D4D4;
}
.ctl-locations .dealer-locator-widget__label input:checked + .dealer-locator__radio-checkmark::after {
  display: block;
}

/* ── Map container ── */
.ctl-locations .dealer-locator__dealers-gmap {
  display: block !important;
  margin-top: 24px;
}
.ctl-locations .dealer-locator__gmap {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.15);
  flex: unset !important;
}
.ctl-locations .dealer-locator__gmap > * {
  border-radius: 20px;
  overflow: hidden;
  border: none !important;
}

/* Tab bar — underline style matching Figma */
.ctl-locations-faq__tabbar {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid #CBCBCB;
  gap: 0;
}
.ctl-locations-faq__tabbar-label {
  font-size: 15px;
  font-weight: 700;
  color: #6E6E6E;
  padding: 12px 20px 12px 0;
  white-space: nowrap;
  align-self: center;
}
.ctl-locations-faq__tabs {
  display: flex;
  gap: 32px;
}
.ctl-locations-faq__tab {
  position: relative;
  padding: 12px 32px;
  background: transparent;
  border-top: 1px solid transparent;
  border-right: 1px solid transparent;
  border-left: 1px solid transparent;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #0d1f3c;
  cursor: pointer;
  transition: color 0.15s;
  white-space: nowrap;
}
.ctl-locations-faq__tab:hover { color: #01a1c8; }
.ctl-locations-faq__tab--active {
  background: #fff;
  color: #01a1c8;
  border-top-color: #CBCBCB;
  border-right-color: #CBCBCB;
  border-left-color: #CBCBCB;
  border-radius: 16px 16px 0 0;
}

/* Table container — rounded bordered box */
.ctl-locations-faq__panel--hidden { display: none; }
.ctl-locations-faq__content-wrap {
  margin-top: 27px;
}

.faq__answer ul {
  list-style: disc;
  padding-left: 20px;
  margin-bottom: 10px;
}

@media screen and (min-width: 768px) {
  body .title-loan-container {
    margin-left: 0 !important;
  }
}
@media (max-width: 1024px) {
  .ctl-blog { padding-left: 48px; padding-right: 48px; }
  .ctl-locations { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 767px) {
  .ctl-locations { padding-left: 36px; padding-right: 36px; }
  .ctl-locations .dealer-locator-widget__search-bar,
  .ctl-locations .dealer-locator-widget__dealer-type {
    min-width: 100%;
  }
  .ctl-blog { padding-left: 36px; padding-right: 36px; }
  .ctl-locations-faq__tabs { gap: 0; }
  .ctl-locations-faq__tabbar { overflow-x: auto; -webkit-overflow-scrolling: touch; overflow-y: hidden; }
  .ctl-locations-faq__tab { padding: 16px 15px; font-size: 15px; }
}

/* ── CTL CASH WIDGET (Motorcycle / RV pages) ── */
/* ── CASH WIDGET SECTION — overlaps hero (mirrors .ctl-car-value-section technique) ── */
.ctl-cash-widget-section {
  position: relative;
  margin-top: -38px;
  z-index: 1;
  padding: 0;
}
.ctl-cash-widget-inner {
  max-width: 1200px;
  margin: 0 auto;
  background: linear-gradient(177.47deg, #000000 0%, #1b3f68 69.4%, #1c627d 115.67%);
  border-radius: 70px;
  padding: 45px 60px;
  box-sizing: border-box;
}

/* Widget renders its own title via .car-worth-form-title */
.ctl-cash-widget-inner .car-worth-form-title {
  font-size: 35px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1.1;
  color: #fff;
  margin: 0 0 24px;
}

/* ── customer-info-widget overrides (scoped to cash widget section) ── */
.ctl-cash-widget-inner .title-loan-short-widget {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-sizing: border-box;
}

/* 3-column flex-wrap field grid */
.ctl-cash-widget-inner .title-loan-short-widget__form-field-wrapper {
  display: flex !important;
  flex-wrap: wrap;
  gap: 16px;
  grid-template-columns: unset !important;
  margin-bottom: 20px;
}
.ctl-cash-widget-inner .title-loan-short-widget__form-group {
  flex: 1 0 0;
  min-width: 260px;
  margin-bottom: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}
.ctl-cash-widget-inner .title-loan-short-widget__form-group--zip-state {
  display: flex;
  align-items: center;
  gap: 0;
}
.ctl-cash-widget-inner .title-loan-short-widget__form-group--zip-state .title-loan-short-widget__zip-code {
  flex: 1;
}
.ctl-cash-widget-inner .title-loan-short-widget__state {
  display: none; /* Hidden — zip auto-fills state */
}

/* Inputs & selects */
.ctl-cash-widget-inner .title-loan-short-widget__form-control,
.ctl-cash-widget-inner .title-loan-short-widget__dropdown {
  height: 46px;
  border: 1px solid #d4d4d4 !important;
  border-radius: 8px !important;
  font-size: 13px;
  font-weight: 700;
  color: rgba(53, 53, 53, 0.9);
  padding: 8px 16px !important;
  background: #fff !important;
  width: 100%;
  box-sizing: border-box;
}
.ctl-cash-widget-inner .title-loan-short-widget__form-control::placeholder {
  color: rgba(53, 53, 53, 0.9);
  font-weight: 700;
}
.ctl-cash-widget-inner .title-loan-short-widget__dropdown {
  cursor: pointer;
}

/* Bottom row: consent left, submit button right — on same line */
.ctl-cash-widget-inner .title-loan-short-widget__wrapper {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto auto;
  column-gap: 24px;
  row-gap: 0;
  align-items: center;
}
.ctl-cash-widget-inner .car-worth-form-title {
  grid-column: 1 / -1;
}
.ctl-cash-widget-inner .title-loan-short-widget__form-field-wrapper {
  grid-column: 1 / -1;
}
.ctl-cash-widget-inner .title-loan-short-widget__agreement__terms-of-use {
  grid-column: 1;
  grid-row: 3;
  margin-bottom: 0;
}
.ctl-cash-widget-inner .title-loan-short-widget__agreement__consent-to-share {
  grid-column: 1 / -1;
  margin-bottom: 0;
}
.ctl-cash-widget-inner .text-center {
  grid-column: 2;
  grid-row: 3;
}

/* Consent / checkbox */
.ctl-cash-widget-inner .title-loan-short-widget__checkbox {
  color: rgba(255, 255, 255, 1);
  font-size: 16px;
}
.ctl-cash-widget-inner .title-loan-short-widget__checkbox a {
  color: rgba(255, 255, 255, 1);
}
.ctl-cash-widget-inner .title-loan-short-widget__checkbox-checkmark {
    border: 0px !important;
    width: 28px !important;
    height: 28px !important;
    flex-shrink: 0;
    border-radius: 50% !important;
    margin-top: 0 !important;
    background-color: #ffffff;
}

.title-loan-short-widget__checkbox-checkmark:before {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  bottom: auto !important;
  right: auto !important;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0 !important;
  width: 14px !important;
  height: 14px !important;
  font-size: 0 !important;
  color: transparent !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.5L5.5 9.5L12.5 1.5' stroke='%23FFA600' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
  transition: transform 0.15s, opacity 0.15s;
}

.title-loan-short-widget__checkbox-input:checked + .title-loan-short-widget__checkbox-checkmark:before {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1 !important;
}

/* Submit button */
.ctl-cash-widget-inner .title-loan-short-widget__submit {
  background: #01a1c8 !important;
  border: none !important;
  border-radius: 9999px !important;
  width: auto;
  min-width: 140px;
  padding: 13px 36px !important;
  font-size: 15px !important;
  font-weight: 700;
  text-transform: none !important;
  letter-spacing: 0;
  cursor: pointer;
  color: #fff !important;
  white-space: nowrap;
}
.ctl-cash-widget-inner .title-loan-short-widget__submit:hover {
  opacity: 0.88;
}

@media (max-width: 900px) {
  .ctl-cash-widget-section { padding: 0 16px 48px; margin-top: 0; }
  .ctl-cash-widget-inner { border-radius: 32px; padding: 32px 28px; }
  .ctl-cash-widget-inner .title-loan-short-widget__wrapper {
    grid-template-columns: 1fr;
  }
  .ctl-cash-widget-inner .text-center {
    grid-column: 1;
    grid-row: auto;
    justify-content: center;
    margin-top: 16px;
  }
  .ctl-cash-widget-inner .title-loan-short-widget__form-group { min-width: 100%; }
  .ctl-cash-widget-inner .title-loan-short-widget__submit { width: 100%; }
}

/* ── 3-column benefits grid ── */
.ctl-benefits__cards--three {
  grid-template-columns: repeat(3, 1fr);
}

/* ── 4-column benefits grid ── */
.ctl-benefits__cards--four {
  grid-template-columns: repeat(4, 1fr);
}
.mtl-benefits__cards--four {
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 900px) {
  .ctl-benefits__cards--four {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 540px) {
  .ctl-benefits__cards--four {
    grid-template-columns: 1fr;
  }
}

/* ── CTL CONTACT ── */
.ctl-contact {
  background: var(--navy);
  padding: 60px 36px;
}
.ctl-contact__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  text-align: center;
}
.ctl-contact__heading {
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  max-width: 640px;
  line-height: 1.5;
  margin: 0;
}
.ctl-contact__details {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 32px;
}
.ctl-contact__item {
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(255,255,255,0.8);
  font-size: 15px;
  font-weight: 600;
}
.ctl-contact__item svg { flex-shrink: 0; color: #01a1c8; }
.ctl-contact__item p { margin: 0; line-height: 1.5; }
@media (max-width: 768px) {
  .ctl-contact { padding: 48px 20px; }
  .ctl-contact__heading { font-size: 18px; }
}

/* ── CTL DISCLAIMER ── */
.ctl-disclaimer {
  background: linear-gradient(160deg, #01A1C8 8.49%, #2B4C81 91.51%);
  padding: 32px 20px;
}
.ctl-disclaimer__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ctl-disclaimer__inner p {
  font-size: 12px;
  color: #FFF;
  margin: 0;
  line-height: 1.5;
}

/* ── CTL RESPONSIVE: 1024px ── */
@media (max-width: 1024px) {
  .ctl-hero { padding: 60px 48px; }
  .ctl-hero__circles .hero__circle--1 {
    left: 0;
    bottom: -150px;
  }
  .ctl-hero__circles .hero__circle--2 {
    top: auto;
  }
  .ctl-hero__circles .hero__circle--3 {
    width: 300px;
    height: 300px;
    left: auto;
    transform: translateX(80%);
    right: 0;
    top: 30px;
  }
  .ctl-hero__inner { padding-right: 40px; gap: 64px; }
  .ctl-hero__inner--no-padding-right { padding-right: 0; }
  .ctl-hero__copy { max-width: 50%; flex-basis: 50%; }
  .ctl-hero__headline { font-size: 40px; }
  .ctl-hero__photo-wrap { padding-right: 0; }
  .ctl-hero__photo { max-width: 420px; height: 290px; }
  .ctl-hero__ring { position: absolute; left: auto; top: -39px; right: -70px; width: 240px; height: 240px; pointer-events: none; z-index: 0; opacity: 0.55; }
  .ctl-hero__dots { left: -50px; }
  .ctl-hero__savings-badge { right: -40px; }
  .ctl-car-value-section { padding: 0; border-radius: 0; }
  .ctl-car-value-widget { margin-top: 0; }
  body .ctl-car-value-widget .car-worth-form { border-radius: 0; padding: 60px 48px;}
  .ctl-make-car-work { padding-left: 48px; padding-right: 48px; }
  .ctl-how-works { padding-left: 48px; padding-right: 48px; }
  .ctl-how-works__top { flex-direction: column; }
  .ctl-how-works__copy { width: 100%; }
  .ctl-how-works__cards {
    grid-template-columns: repeat(2, 1fr);
  }
  .ctl-what-is { padding-left: 48px; padding-right: 48px; }
  .ctl-what-is__copy { flex: 0 0 432px; }
  .ctl-what-is__photo-wrap { flex: 0 0 calc(100% - 472px); height: 340px; }
  .ctl-what-is__inner { gap: 40px; }
  .ctl-benefits { padding-left: 48px; padding-right: 48px; }
  .ctl-benefits__cards { gap: 16px; }
  .ctl-process { padding-left: 48px; padding-right: 48px; }
  .ctl-tips { padding-left: 48px; padding-right: 48px; }
  .ctl-disclaimer { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 991px) {
  .ctl-what-is__copy, .ctl-what-is__photo-wrap { flex-basis: calc(50% - 20px); }
}

/* ── CTL RESPONSIVE: 767px ── */
@media (max-width: 767px) {
  .ctl-hero { padding: 48px 36px 64px; }
  .ctl-hero__circles .hero__circle--1 { bottom: -100px; opacity: 0.5; width: 200px; height: 200px; left: 0; top: 220px; }
  .ctl-hero__circles .hero__circle--2 { width: 200px; height: 200px; left: auto; right: -20px; top: auto; bottom: 0; }
  .ctl-hero__circles .hero__circle--3 { width: 240px; height: 240px; transform: translate(55%, -41%); top: 50%; }
  .ctl-hero__circles .hero__circle--4 { width: 160px; height: 160px; left: auto; top: -5px; right: -15px; }
  .ctl-hero__inner { flex-direction: column; padding-right: 0; gap: 40px; }
  .ctl-hero__copy { max-width: none; flex-basis: auto; width: 100%; }
  .ctl-hero__photo-wrap { width: 100%; max-width: none; height: auto; min-height: 0; flex: none; justify-content: flex-start; }
  .ctl-hero__photo { max-width: calc(100% - 36px); aspect-ratio: 3 / 2; height: auto; }
  .ctl-hero__inner--no-padding-right .ctl-hero__photo { max-width: 100%; }
  .ctl-hero__ring { width: 240px; height: 240px; right: -45px; }
  .ctl-hero__dots { left: -20px; bottom: -10px; width: 121px; height: 96px; }
  .ctl-hero__savings-badge { right: 0; bottom: -10px; }
  body .ctl-car-value-widget .car-worth-form { padding-left: 36px; padding-right: 36px; }
  .ctl-car-value__row { grid-template-columns: 1fr 1fr; }
  .ctl-car-value__inner { padding: 24px; }
  .ctl-car-value__consent { flex-direction: column; align-items: flex-start; }
  .ctl-make-car-work { padding-left: 36px; padding-right: 36px; }
  .ctl-how-works { padding-left: 36px; padding-right: 36px; }
  .ctl-how-works__inner { gap: 27px; }
  .ctl-how-works__top { flex-direction: column; }
  .ctl-how-works__copy { width: 100%; }
  .ctl-how-works__video-wrap { height: 220px; }
  .ctl-how-works__cards { grid-template-columns: 1fr; gap: 16px; }
  .ctl-how-works__card { padding: 30px 24px; }
  .ctl-what-is { padding-left: 36px; padding-right: 36px; }
  .ctl-what-is__inner { flex-direction: column; }
  .ctl-what-is__copy { flex: none; }
  .ctl-what-is__photo-wrap { flex: none; width: 100%; height: 260px; border-radius: 16px; }
  .ctl-benefits { padding-left: 36px; padding-right: 36px; }
  .ctl-benefits__cards { grid-template-columns: 1fr; }
  .ctl-process { padding-left: 36px; padding-right: 36px; }
  .ctl-process__steps { display: block; width: 100%; overflow: visible; align-items: stretch; }
  .slider__slide {
    display: none;
    width: 100%;
    box-sizing: border-box;
  }
  .slider__slide.is-active { display: flex; }
  .slider__dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-bottom: 4px;
  }
  .slider__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(206, 206, 206, 1);
    border: none;
    cursor: pointer;
    padding: 0;
    transition: background 0.2s, transform 0.2s;
    flex-shrink: 0;
  }
  .slider__dot.is-active{
    background: var(--cyan);
    transform: scale(1.2);
  }
  .ctl-process__connector { display: none; }
  .ctl-tips { padding-left: 36px; padding-right: 36px; }
  .ctl-tips__title { text-align: center; }
  .ctl-tips__subtitle { text-align: center; }
  .ctl-tips__ctas { flex-direction: column; }
  .ctl-disclaimer { padding-left: 36px; padding-right: 36px; }
}

/* ── CTL RESPONSIVE: 480px ── */
@media (max-width: 480px) {
  .ctl-hero__savings-label { font-size: 13px; }
  .ctl-hero__savings-amount { font-size: 24px; }
  .ctl-hero__savings-note { font-size: 13px; }
  .ctl-hero__photo { height: 230px; }
  .ctl-hero__circles .hero__circle--1 {
    width: 200px;
    height: 200px;
    left: 0;
    top: 220px;
  }
  .ctl-hero__circles .hero__circle--2 {
    width: 140px;
    height: 140px;
    left: auto;
    right: -30px;
    top: auto;
    bottom: 0;
  }
  .ctl-hero__circles .hero__circle--3 {
    width: 240px;
    height: 240px;
    transform: translate(70%, 5%);
  }
  .ctl-hero__circles .hero__circle--4 {
    width: 160px;
    height: 160px;
    left: auto;
    right: -15px;
    top: -15px;
  }
  .ctl-car-value__row { grid-template-columns: 1fr; }
  .ctl-how-works__card { padding: 20px 16px; }
  .ctl-process__steps { grid-template-columns: 1fr; }
  .ctl-benefits__cards { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════════
   ABOUT US PAGE  (au-*)
════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.au-hero {
  position: relative;
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  overflow: hidden;
  padding: 70px 24px 85px;
}

.au-hero__bubbles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.au-bubble {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,0.07);
  border: none;
}
.au-hero__bubbles .hero__circle--2 { top: 55%; }
.au-hero__bubbles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }

.au-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 64px;
  position: relative;
}

.au-hero__copy { 
  flex: 0 0 564px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 564px;
  color: #fff;
}
.au-hero__headline {
  font-size: 44px;
  font-weight: 800;
  color: #fff;
  margin: 0;
  line-height: 1.15;
  letter-spacing: -0.5px;
}
.au-hero__body {
  font-size: 18px;
  color: rgba(255,255,255,0.85);
  line-height: 1.7;
  margin: 0 0 16px;
}
.au-hero__body:last-child { margin-bottom: 0; }

.au-hero__photo-wrap {
  flex: 1 1 600px;
  max-width: 476px;  /* upper limit cap */
  position: relative;
  min-height: 380px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.au-hero__ring {
  position: absolute;
  top: -75px;
  left: 46%;
  width: 340px;
  height: 340px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.au-hero__ring img { width: 100%; height: 100%; }
.au-hero__dots {
  position: absolute;
  bottom: -83px;
  left: -82px;
  width: 180px;
  height: 160px;
  pointer-events: none;
  z-index: 0;
}
.au-hero__dots img { width: 100%; height: 100%; }
.au-hero__photo {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 476px;
    height: 315px;
    border-radius: 20px 70px 20px 20px;
    border: 7px solid rgba(255, 255, 255, 0.4);
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(13, 31, 60, 0.25);
}
.au-hero__photo img { 
  width: 100%; height: 100%; object-fit: cover; 
}

/* ── Lending Made Easy (overlaps hero) ── */
.au-lending {
  position: relative;
  margin-top: -40px;
  z-index: 1;
  padding: 0 24px 0;
}
.au-lending__inner {
  max-width: 1200px;
  margin: 0 auto;
  background: linear-gradient(177.47deg, #000000 0%, #1b3f68 69.4%, #1c627d 115.67%);
  border-radius: 70px;
  padding: 60px 45px;
  box-sizing: border-box;
}
.au-lending__title {
  font-size: 35px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 32px;
  letter-spacing: -0.5px;
}
.au-lending__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 27px;
}
.au-lending__card {
  background: #fff;
  border-radius: 16px;
  padding: 44px 34px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0;
  place-content: flex-start;
  min-height: 220px;
}
.au-lending__icon {
  width: 102px;
  height: 102px;
  border-radius: 50%;
  background: #fff7e8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.au-lending__icon img { filter: none; height: 36px; width: auto; }
.au-lending__card-text {
  font-size: 17px;
  font-weight: 700;
  margin-top: 24px;
  color: #0d1b2e;
  line-height: 1.4;
}
.au-lending__dots {
  display: none;
}

/* ── LoanCenter Has Your Back ── */
.au-back {
  padding: 72px 24px;
  background: #fff;
}
.au-back__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.au-back__title {
  font-size: 38px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 0 0 20px;
  letter-spacing: -0.5px;
}
.au-back__body {
  font-size: 16px;
  color: #444;
  line-height: 1.75;
  margin: 0 0 16px;
}
.au-back__body a { color: #01a1c8; text-decoration: none; }
.au-back__body a:hover { text-decoration: underline; }

/* ── More Resources ── */
.au-resources {
  background: linear-gradient(160deg, #01A1C8 8.49%, #2B4C81 91.51%);
  padding: 72px 24px;
}
.au-resources__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.au-resources__title {
  font-size: 44px;
  font-weight: 800;
  color: #fff;
  margin: 0 0 36px;
  letter-spacing: -0.5px;
}
.au-resources__grid {
  background: rgba(238, 242, 247, 1);
  border-radius: 16px;
  padding: 36px 40px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px 40px;
}
.au-resources__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.au-resources__list li {
  display: flex;
  align-items: center;
  gap: 10px;
}
.au-resources__list li::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #01a1c8;
  flex-shrink: 0;
}
.au-resources__list a {
  color: rgba(13, 31, 60, 1);
  text-decoration: none;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
}
.au-resources__list a:hover { color: #01a1c8; text-decoration: underline; }

/* ── AU Responsive ── */
@media (max-width: 1024px) {
  .au-hero {  padding: 70px 46px; }
  .au-hero__bubbles .hero__circle--1 { bottom: -16px; }
  .au-hero__bubbles .hero__circle--2 { top: auto; width: 280px; height: 280px; }
  .au-hero__bubbles .hero__circle--3 { width: 300px; height: 300px; left: auto; transform: translateX(83%); right: 0; top: 30px; }
  .au-hero__inner { align-items: center; }
  .au-hero__copy { max-width: 50%; }
  .au-hero__ring { top: -39px; left: auto; right: -55px; width: 240px; height: 240px; }
  .au-hero__dots { left: -50px; }
  .au-lending { margin-top: 0px; padding: 0; }
  .au-lending__inner { padding: 40px 48px; border-radius: 0; }
  .au-lending__cards { grid-template-columns: repeat(4, 1fr); }
  .au-back { padding: 70px 48px; }
  .au-resources { padding: 70px 48px; }
  .au-resources__grid { gap: 12px 24px; padding: 34px 36px; }
  .au-resources__list { gap: 24px; }
}
@media (max-width: 991px) {
  .au-lending__cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .au-hero { padding: 48px 36px; }
  .au-hero__bubbles .hero__circle--1 { bottom: -100px; opacity: 0.5; width: 200px; height: 200px; left: 0; top: 220px; }
  .au-hero__bubbles .hero__circle--2 { width: 200px; height: 200px; left: auto; right: -20px; top: auto; bottom: 0; }
  .au-hero__bubbles .hero__circle--3 { width: 240px; height: 240px; transform: translate(55%, -41%); top: 50%; }
  .au-hero__bubbles .hero__circle--4 { width: 160px; height: 160px; left: auto; top: -5px; right: -15px; }
  .au-hero__inner { flex-direction: column; padding: 0px; gap: 32px; }
  .au-hero__copy { max-width: none; flex-basis: auto; }
  .au-hero__photo-wrap { width: 100%; max-width: none; height: auto; min-height: 0; flex: none; justify-content: flex-start; }
  .au-hero__photo { height: auto; max-width: 100%; }
  .au-hero__ring { width: 240px; height: 240px; right: -45px; }
  .au-hero__dots { bottom: -20px; left: -20px; width: 180px; height: 160px; }

  .au-lending__inner { padding-left: 36px; padding-right: 36px; }
  .au-lending__cards { display: block; }
  .au-lending__card { display: none; }
  .au-lending__card.is-active { display: flex; }
  /* Dot indicators – au lending */
  .au-lending__dots { display: flex; justify-content: center; gap: 8px; margin: 24px 0 4px; }
  .au-lending__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(206,206,206,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
  .au-lending__dot.is-active { background: var(--cyan); transform: scale(1.2); }
  /* Slider – JS-driven show/hide */
  .au-back { padding: 70px 36px 54px; }
  .au-resources { padding-left: 36px; padding-right: 36px; }
  .au-resources__grid { grid-template-columns: 1fr; }
  .au-resources__list { gap: 12px; }
}

@media (max-width: 440px) {
  .au-hero__bubbles .hero__circle--1 { width: 200px; height: 200px; left: 0; top: 220px; }
  .au-hero__bubbles .hero__circle--2 { width: 140px; height: 140px; left: auto; right: -30px; top: auto; bottom: 0; }
  .au-hero__bubbles .hero__circle--3 { width: 240px; height: 240px; transform: translate(70%, 5%); }
  .au-hero__bubbles .hero__circle--4 { width: 160px; height: 160px; left: auto; right: -15px; top: -15px; }
}

/* ════════════════════════════════════════════════════════════
   SHARED INFO-PAGE HERO BUBBLES  (info-bubble)
════════════════════════════════════════════════════════════ */

.info-hero__circles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.info-bubble {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,0.07);
  border: none;
}
.info-bubble--1 { width: 340px; height: 340px; left: -60px;   bottom: -80px;  opacity: 0.55; }
.info-bubble--2 { width: 560px; height: 560px; right: -100px; bottom: -220px; opacity: 0.45; }
.info-bubble--3 { width: 460px; height: 460px; right: 240px;  top:  -160px;   opacity: 0.45; }
.info-bubble--4 { width: 200px; height: 200px; left:  280px;  top:  -70px;    opacity: 0.50; }

/* ════════════════════════════════════════════════════════════
   BENEFITS FOR MILITARY PAGE  (mil-*)
════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.mil-hero {
  position: relative;
  overflow: visible;
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 24px 0;
}
.mil-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.mil-hero__card {
  position: relative;
  z-index: 2;
  border-radius: 30px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  padding: 48px 60px;
  box-sizing: border-box;
  margin-bottom: -165px;
}
.mil-hero__headline {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 16px;
  letter-spacing: -1px;
  line-height: 1.15;
  text-align: left;
}
.mil-hero__subline {
  font-size: 20px;
  font-weight: 500;
  color: rgba(255,255,255,0.9);
  line-height: 1.4;
  margin: 0;
}

/* ── Content ── */
.mil-content {
  position: relative;
  background: #fff;
  padding: 230px 24px 72px;
  z-index: 1;
}
.mil-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.mil-content__heading {
  font-size: 24px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 40px 0 12px;
}
.mil-content__inner > .mil-content__heading:first-child { margin-top: 0; }
.mil-content__body {
  font-size: 16px;
  color: #444;
  line-height: 1.75;
  margin: 0 0 12px;
}
.mil-content__body a { color: #01a1c8; text-decoration: none; }
.mil-content__body a:hover { text-decoration: underline; }
.mil-content__label {
  font-size: 15px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 16px 0 4px;
}
.mil-content__list {
  padding-left: 24px;
  margin: 8px 0 16px;
}
.mil-content__list li {
  font-size: 16px;
  color: #444;
  line-height: 1.75;
  margin-bottom: 6px;
}
.mil-content__thank-you {
  font-size: 22px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 40px 0 0;
}

@media (max-width: 1024px) {
  .mil-hero { padding: 70px 48px; }
  .mil-hero__card { margin-bottom: 0; padding: 48px; }
  .mil-content { padding: 70px 48px; }
}
@media (max-width: 768px) {
  .mil-hero { padding-left: 36px; padding-right: 36px; }
  .mil-content { padding-left: 36px; padding-right: 36px; }
}
@media (max-width: 480px) {
  .mil-hero__card { padding-left: 36px; padding-right: 36px; }
  .mil-hero__headline { font-size: 28px; }
}

/* ════════════════════════════════════════════════════════════
   CREDIT EDUCATION PAGE  (ce-*)
════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.ce-hero {
  position: relative;
  overflow: visible;
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 24px 0;
}
.ce-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.ce-hero__card {
  position: relative;
  z-index: 2;
  border-radius: 30px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  padding: 48px 60px;
  box-sizing: border-box;
  margin-bottom: -160px;
}
.ce-hero__headline {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 16px;
  letter-spacing: -1px;
  line-height: 1.15;
  text-align: left;
}
.ce-hero__subline {
  font-size: 20px;
  font-weight: 500;
  color: rgba(255,255,255,0.9);
  line-height: 1.4;
  margin: 0;
}
.ce-hero__subline strong { color: #fff; font-weight: 700; }

/* ── Content ── */
.ce-content {
  position: relative;
  background: #fff;
  padding: 215px 24px 72px;
  z-index: 1;
}
.ce-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.ce-content__heading {
  font-size: 24px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 40px 0 12px;
}
.ce-content__inner > .ce-content__heading:first-child { margin-top: 0; }
.ce-content__body {
  font-size: 16px;
  color: #444;
  line-height: 1.75;
  margin: 0 0 16px;
}
.ce-content__body a { color: #01a1c8; text-decoration: none; }
.ce-content__body a:hover { text-decoration: underline; }

@media (max-width: 1024px) {
  .ce-hero { padding: 70px 48px; }
  .ce-hero__card { margin-bottom: 0; padding: 48px; }
  .ce-content { padding: 70px 48px; }
}
@media (max-width: 768px) {
  .ce-hero { padding-left: 36px; padding-right: 36px; }
  .ce-content { padding-left: 36px; padding-right: 36px; }
}
@media (max-width: 480px) {
  .ce-hero__card { padding-left: 36px; padding-right: 36px; }
  .ce-hero__headline { font-size: 28px; }
}

/* ════════════════════════════════════════════════════════════
   WESTLAKE DIRECT TERMS & CONDITIONS PAGE  (wdt-*)
════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.wdt-hero {
  position: relative;
  overflow: visible;
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 24px 0;
}
.wdt-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.wdt-hero__card {
  position: relative;
  z-index: 2;
  border-radius: 30px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  padding: 48px 60px;
  box-sizing: border-box;
  margin-bottom: -147px;
}
.wdt-hero__headline {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 16px;
  letter-spacing: -1px;
  line-height: 1.15;
}
.wdt-hero__subline {
  font-size: 20px;
  font-weight: 500;
  color: rgba(255,255,255,0.9);
  line-height: 1.4;
  margin: 0;
}

/* ── Content ── */
.wdt-content {
  position: relative;
  background: #fff;
  padding: 215px 24px 72px;
  z-index: 1;
}
.wdt-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.wdt-content__body {
  font-size: 16px;
  color: #444;
  line-height: 1.75;
  margin: 0 0 24px;
}
.wdt-content__body a { color: #01a1c8; text-decoration: none; word-break: break-word; }
.wdt-content__body a:hover { text-decoration: underline; }

@media (max-width: 1024px) {
  .wdt-hero { padding: 70px 48px; }
  .wdt-hero__card { margin-bottom: 0; padding: 48px; }
  .wdt-content { padding: 70px 48px; }
}
@media (max-width: 768px) {
  .wdt-hero { padding-left: 36px; padding-right: 36px; }
  .wdt-content { padding-left: 36px; padding-right: 36px; }
}
@media (max-width: 480px) {
  .wdt-hero__card { padding-left: 36px; padding-right: 36px; }
  .wdt-hero__headline { font-size: 28px; }
}

/* ════════════════════════════════════════════════════════════
   WESTLAKE DIRECT DISCLOSURES PAGE  (wdd-*)
════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.wdd-hero {
  position: relative;
  overflow: visible;
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 24px 0;
}
.wdd-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.wdd-hero__card {
  position: relative;
  z-index: 2;
  border-radius: 30px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  padding: 48px 60px;
  box-sizing: border-box;
  margin-bottom: -24px;
}
.wdd-hero__headline {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  letter-spacing: 1px;
}

/* ── Content ── */
.wdd-content {
  position: relative;
  background: #fff;
  padding: 70px 24px 72px;
  z-index: 1;
}
.wdd-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.wdd-content__page-title {
  font-size: 24px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 0 0 28px;
}
.wdd-content__state-heading {
  font-size: 18px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 28px 0 6px;
}
.wdd-content__list a,
.wdd-content__body a {
  color: #01a1c8;
  text-decoration: none;
}

.wdd-content__list {
  padding-left: 25px;
}

@media (max-width: 1024px) {
  .wdd-hero { padding: 70px 48px; }
  .wdd-hero__card { margin-bottom: 0; padding: 48px; }
  .wdd-content { padding: 70px 48px; }
}
@media (max-width: 768px) {
  .wdd-hero { padding-left: 36px; padding-right: 36px; }
  .wdd-content { padding-left: 36px; padding-right: 36px; }
}
@media (max-width: 480px) {
  .wdd-hero__card { padding-left: 36px; padding-right: 36px; }
  .wdd-hero__headline { font-size: 28px; }
}

/* ════════════════════════════════════════════════════════════
   POLICY PAGE TEMPLATE (terms-*)
    - TERMS OF USE PAGE
    - PRIVACY POLICY PAGE
    - ESIGN POLICY PAGE
════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.terms-hero {
  position: relative;
  overflow: visible;
  background: linear-gradient(170.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 24px 0;
}
.terms-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.terms-hero__card {
  position: relative;
  z-index: 2;
  border-radius: 30px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  padding: 48px 60px;
  box-sizing: border-box;
  margin-bottom: -24px;
}
.terms-hero__headline {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  letter-spacing: 1px;
}

.terms-section__head {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 32px;
}

/* ── Category tabs ────────────────────────────────── */
.terms-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px 48px;
  border-bottom: 1px solid #d7d7d7;
}
.terms-tabs__item {
  display: flex;
  align-items: center;
  padding: 16px 0;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  color: #191919;
  white-space: nowrap;
  background: transparent;
  border: none;
  border-bottom: 5px solid transparent;
  margin-bottom: -1px;
  transition: border-color 0.2s, font-weight 0.2s;
}
.terms-tabs__item:hover { color: #191919; border-bottom-color: rgba(1, 170, 211, 0.4); cursor: pointer; }
.terms-tabs__item--active {
  font-weight: 700;
  border-bottom-color: #01aad3;
}

/* ── Content ── */
.terms-content {
  position: relative;
  background: #fff;
  padding: 70px 24px 72px;
  z-index: 1;
}
.terms-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.terms-content__page-title {
  font-size: 24px;
  font-weight: 700;
  color: #0d1b2e;
  margin: 0 0 28px;
}
.terms-content__state-heading {
  font-size: 18px;
  font-weight: 700;
  color: #0d1b2e;
  line-height: 27.2px;
  margin-bottom: 24px;
}
.terms-content__body {
  color: #0D1F3C;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 27.2px;
  margin-bottom: 24px;
  word-break: break-word;
}
.terms-content__list,
.terms-content__policy-list--no-disc {
  margin-bottom: 24px;
  color: #0D1F3C;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 27.2px;
}
.terms-content__list {
  padding-left: 36px;
}
.terms-content__policy-list--no-disc {
  list-style: none;
  padding-left: 0;
}
.terms-content__list a,
.terms-content__policy-list--no-disc a,
.terms-content__body a {
  color: #01a1c8;
  text-decoration: none;
  word-wrap: break-word;
}

.terms-content__policy-list--no-disc ul,
.terms-content__policy-list--no-disc ol {
  padding-left: 36px;
  margin-bottom: 24px;
}

.terms-content__list li,
.terms-content__policy-list--no-disc li {
  margin-bottom: 8px; 
}
.terms-content__list ul,
.terms-content__list ol,
.terms-content__policy-list--no-disc ul,
.terms-content__policy-list--no-disc ol {
  margin-top: 16px; 
}

@media (max-width: 1024px) {
  .terms-hero { padding: 70px 48px; }
  .terms-hero__card { margin-bottom: 0; padding: 48px; }
  .terms-content { padding: 70px 48px; }
}
@media (max-width: 768px) {
  .terms-hero { padding-left: 36px; padding-right: 36px; }
  .terms-content { padding-left: 36px; padding-right: 36px; }
}
@media (max-width: 480px) {
  .terms-hero__card { padding-left: 36px; padding-right: 36px; }
  .terms-hero__headline { font-size: 28px; }
}

/* =============================================================
   AUTO LOANS PAGE  (al- prefix)
   ============================================================= */

/* Hero — inherits all .ctl-hero rules */
.al-hero { /* no overrides needed */ }

/* ── Apply Online Now section ── */
.al-apply-section {
  position: relative;
  z-index: 2;
  margin-top: -66px;
  padding: 0 24px;
  /* Transparent for the 66px overlap zone so the hero shows through;
     #F7FAFD starts immediately after the overlap point */
  background: linear-gradient(to bottom, transparent 66px, #F7FAFD 66px);
}
.al-apply-widget {
  max-width: 1200px;
  margin: 0 auto;
  background: linear-gradient(177.85deg, #000000 0%, #1b3f68 69.4%, #1c627d 115.67%);
  border-radius: 70px;
  padding: 45px 60px;
}
.al-apply-widget .lc-cvw-form-title {
  grid-column: 1 / -1;
  color: #fff !important;
  font-size: 35px !important;
  font-weight: 700 !important;
  letter-spacing: -1px;
  text-align: left !important;
  text-transform: none !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}
/* 4-column grid: title full-width, all 4 fields in one row (via display:contents),
   agreement spans cols 1-3, submit in col 4 */
.al-apply-widget form.title-loan-short-widget {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 16px;
  row-gap: 20px;
  align-items: center;
  width: 100%;
}
.al-apply-widget .customer-info-auto-loan-widget {
  background-color: unset !important;
  padding: 0 !important;
}
/* display:contents dissolves both __row divs so the 4 form-groups
   become direct grid children and auto-fill the 4 columns on one row */
.al-apply-widget .customer-info-auto-loan-widget__row {
  display: contents !important;
}
.al-apply-widget .customer-info-auto-loan-widget__form-group {
  min-width: 0;
  margin-bottom: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}
.al-apply-widget .zip-code-wrapper { padding: 0; }
.al-apply-widget .customer-info-auto-loan-widget__form-control {
  display: block;
  width: 100%;
  height: 47px;
  background: #fff !important;
  border: 1px solid #d4d4d4 !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: rgba(53,53,53,0.9) !important;
  box-sizing: border-box;
}
.al-apply-widget .state-projector { display: none; }
/* Agreement spans cols 1-3, submit sits in col 4 */
.al-apply-widget .row.agreement-wrapper {
  grid-column: 1 / span 3;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: flex-start;
}
.al-apply-widget .agreement,
.al-apply-widget .col-md-12.agreement {
  padding: 0;
  width: 100%;
}
.al-apply-widget .disclaimer-container,
.al-apply-widget .disclaimer-container p {
  color: rgba(255,255,255,1) !important;
  font-size: 16px;
  line-height: 1.55;
  margin: 0;
}
.al-apply-widget .disclaimer-container a {
  color: rgba(255,255,255,1) !important;
  text-decoration: underline;
}
.al-apply-widget .customer-info-auto-loan-widget__text--center {
  grid-column: 4;
  align-self: center;
  justify-self: end;
  text-align: right;
}
.al-apply-widget .customer-info-auto-loan-widget__button,
.al-apply-widget .btn-action-submit {
  background: #01a1c8 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px !important;
  padding: 13px 36px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  white-space: nowrap;
  min-width: 140px;
  display: inline-block;
}
/* Checkbox — circular white 28px with orange SVG tick, shown only when checked */
.al-apply-widget .checkbox-container.style-c {
  align-items: flex-start;
}
.al-apply-widget .checkbox-container.style-c .checkbox {
  width: 26.5px !important;
  height: 26.5px !important;
  min-width: 26.5px !important;
  border-radius: 50% !important;
  border: 0 !important;
  background-color: #ffffff !important;
  margin-top: 2px !important;
  margin-right: 12px !important;
  padding: 0 !important;
}
/* Checkmark hidden by default; plugin's :checked rule shows it */
.al-apply-widget .checkbox-container.style-c .checkbox .checkmark {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  bottom: auto !important;
  right: auto !important;
  width: 14px !important;
  height: 14px !important;
  font-size: 0 !important;
  color: transparent !important;
  /* Let the plugin's opacity: 0 / :checked opacity: 1 rule handle visibility */
  transform: translate(-50%, -50%) scale(0) !important;
}
.al-apply-widget .checkbox-container.style-c .checkbox input[type="checkbox"]:checked + .checkmark {
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(1) !important;
}
.al-apply-widget .checkbox-container.style-c .checkbox .checkmark:before {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 14px !important;
  height: 14px !important;
  content: "" !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11' fill='none'%3E%3Cpath d='M1.5 5.5L5.5 9.5L12.5 1.5' stroke='%23FFA600' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
  border: none !important;
  background-color: transparent !important;
  border-radius: 0 !important;
  display: block !important;
}
.al-apply-widget .checkbox-container.style-c .checkbox .checkmark:after {
  display: none !important;
}

/* ── Find Vehicles Near You ── */
.al-vehicles {
  padding: 70px 0 10px 0;
  background: #F7FAFD;
}
.al-vehicles__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}
.al-vehicles__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  margin-bottom: 36px;
}
.al-vehicles__title {
  font-size: 38px;
  font-weight: 700;
  color: #0d1f3c;
  margin: 0;
  letter-spacing: -0.5px;
  line-height: 1.2;
}
.al-vehicles__see-all {
  display: fflex;
  background: #01a1c8;
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  padding: 11px 30px;
  border-radius: 9999px;
  text-decoration: none !important;
  box-shadow: 0 8px 15px rgba(26,105,196,0.25);
}
.al-vehicles__grid {
  width: 100%;
}
/* Hide elements the shortcode renders that we replace with our own */
.al-vehicles__grid .vehicle-items__header { display: none !important; }
.al-vehicles__grid .browse-vehicles { display: none !important; }
/* Reset plugin's wrapper padding */
.al-vehicles__grid #featured-vehicles,
.al-vehicles__grid .vehicle-near-you-wrapper {
  padding: 0 !important;
  margin: 0 !important;
}
/* Ensure vehicle cards grid fills full width */
.al-vehicles__grid .vehicle-items-wrapper {
  width: 100% !important;
}
.al-vehicles__grid [class*="vehicle-grid"],
.al-vehicles__grid [class*="vehicles-grid"],
.al-vehicles__grid [class*="lc-vny"] {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 27px !important;
}

/* ── Get the Right Auto Loan for You ── */
.al-right-loan {
  background: linear-gradient(168.6deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 0;
}
.al-right-loan__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.al-right-loan__header {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}
.al-right-loan__title {
  font-size: 44px;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  margin: 0;
  letter-spacing: -0.5px;
  text-align: left;
}
.al-right-loan__subtitle {
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  line-height: 1.6;
  margin: 0;
}
.al-right-loan__subheading {
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  margin: 0;
  width: 100%;
}
.al-right-loan__features {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.al-right-loan__feature {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}
.al-right-loan .ctl-yellow-icon {
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  background: #fff7e8;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.al-right-loan__feature-text {
  flex: 1 1 0;
  font-size: 18px;
  font-weight: 700;
  color: #0d1f3c;
  line-height: 1.5;
  margin: 0;
  letter-spacing: -0.3px;
}
.al-right-loan__credit {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}
.al-right-loan__credit-title {
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  margin: 0;
}
.al-right-loan__credit-body {
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  line-height: 1.6;
  margin: 0;
}
.al-right-loan__ctas {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

/* ── Dealer Purchase Auto Loan Process ── */
.al-process {
  background: #fff;
  padding: 70px 0;
}
.al-process__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.al-process__header {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.al-process__title {
  font-size: 44px;
  font-weight: 800;
  color: #0d1f3c;
  text-align: center;
  letter-spacing: -0.5px;
  margin: 0;
  line-height: 1.1;
}
.al-process__steps {
  display: flex;
  gap: 43px;
  align-items: flex-start;
  position: relative;
  width: 100%;
}
.al-process__steps::before {
  content: '';
  position: absolute;
  top: 46px;
  left: 46px;
  right: 46px;
  height: 2px;
  background: #c9e0ff;
  z-index: 0;
}
.al-process__connector { display: none; }
.al-process .ctl-process__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex: 1 1 0;
  gap: 23px;
  position: relative;
  z-index: 1;
}
.al-process .ctl-process__circle {
  width: 92px !important;
  height: 92px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 0 0 1px rgba(108,127,131,0.15), 0 2px 8px rgba(108,127,131,0.2) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0;
  border: none !important;
  background-image: none !important;
}
.al-process .ctl-process__circle span {
  font-size: 45px !important;
  font-weight: 600 !important;
  color: #ffa600 !important;
  line-height: 1 !important;
  display: block !important;
}
.al-process .ctl-process__step-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #0d1f3c !important;
  letter-spacing: -0.3px !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}
.al-process .ctl-process__step-desc {
  font-size: 15px !important;
  font-weight: 400 !important;
  color: #3d5a7a !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

/* ── Avoid Spending Hours at the Dealership ── */
.al-shopping {
  background: #f7fafd;
  padding: 70px 0;
}
.al-shopping__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 64px;
}
.al-shopping__copy {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 4px 0;
}
.al-shopping__eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #00a8e8;
  margin: 0;
  line-height: 1.5;
}
.al-shopping__title {
  font-size: 38px;
  font-weight: 700;
  color: #0d1f3c;
  line-height: 1.2;
  margin: 0;
  letter-spacing: -0.5px;
}
.al-shopping__body {
  font-size: 16px;
  color: #3c4248;
  line-height: 1.7;
  margin: 0;
}
.al-shopping__body p { margin: 0 0 1em; }
.al-shopping__body p:last-child { margin-bottom: 0; }
.al-shopping__feature {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.al-shopping__feature-title {
  font-size: 24px;
  font-weight: 700;
  color: #0d1f3c;
  line-height: 1.36;
  margin: 0;
}
.al-shopping__feature-body {
  font-size: 16px;
  color: #3c4248;
  line-height: 1.6;
  margin: 0;
}
.al-shopping__photo-wrap {
  flex: 0 0 568px;
  height: 570px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,0.12), 0 4px 12px rgba(13,31,60,0.06);
}
.al-shopping__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.al-loan-calculator {
  padding-top: 80px;
}

/* ══════════════════════════════════════
   AUTO LOANS — RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 1200px) {
  .al-hero__inner { padding-left: 80px; padding-right: 80px; }
  .al-shopping__inner { flex-direction: column; }
  .al-shopping__photo-wrap { flex: none; width: 100%; height: 360px; }
}
@media (max-width: 1024px) {
  .al-hero__inner { padding: 60px 40px 80px; }
  .al-hero__headline { font-size: 40px; }
  .al-apply-section { margin-top: 0; padding: 0; border-radius: 0; }
  .al-apply-widget { border-radius: 0; padding: 40px 48px; }
  .al-vehicles__inner { padding-left: 48px; padding-right: 48px; }
  .al-right-loan__inner { padding-left: 48px; padding-right: 48px; }
  .al-process__inner { padding-left: 48px; padding-right: 48px; }
  .al-process__steps { flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 48px; }
  .al-process__steps::before { display: none; }
  .al-process .ctl-process__step { flex-basis: calc(33.333% - 46px); flex-grow: 0; }
  .al-shopping__inner { padding-left: 48px; padding-right: 48px; }
  .al-shopping__title-br { display: none; }
  .al-loan-calculator { padding-top: 0; }
  .al-calc { border-radius: 0; padding: 0; }
  .al-calc__inner { padding: 0; }
  .al-calc__card { border-radius: 0; padding: 60px 48px; }
  .al-calc__title { font-size: 34px; }
  .al-calc__body { flex-direction: column; }
  .al-calc__controls { max-width: 100%; }
  .al-calc__results { min-width: 0; }
  .al-vehicles__grid [class*="vehicle-grid"],
  .al-vehicles__grid [class*="vehicles-grid"],
  .al-vehicles__grid [class*="lc-vny"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 767px) {
  .al-hero__inner { flex-direction: column; padding: 60px 20px 80px; }
  .al-apply-widget { padding: 40px 36px; }
  .al-apply-widget form.title-loan-short-widget {
    grid-template-columns: 1fr 1fr;
  }
  .al-apply-widget .lc-cvw-form-title { grid-column: 1 / -1; }
  .al-apply-widget .customer-info-auto-loan-widget__form-group { min-width: 0; }
  .al-apply-widget .row.agreement-wrapper { grid-column: 1 / -1; }
  .al-apply-widget .customer-info-auto-loan-widget__text--center { grid-column: 1 / -1; text-align: left; justify-self: center; }
  .al-vehicles { padding-bottom: 70px;}
  .al-vehicles__inner { padding-left: 36px; padding-right: 36px; }
  .al-vehicles__title {text-align: center; }
  .al-right-loan__inner { padding-left: 36px; padding-right: 36px; }
  .al-right-loan__ctas { align-items: flex-start; }
  .al-process__steps { flex-direction: column; }
  .al-process .ctl-process__step:not(.is-active) { display: none; }
  .al-shopping__photo-wrap { height: 280px; }
  .al-vehicles__grid [class*="vehicle-grid"],
  .al-vehicles__grid [class*="vehicles-grid"],
  .al-vehicles__grid [class*="lc-vny"] {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}
@media (max-width: 480px) {
  .al-apply-widget form.title-loan-short-widget {
    grid-template-columns: 1fr;
  }
  .al-apply-widget .row.agreement-wrapper { grid-column: 1; }
  .al-apply-widget .customer-info-auto-loan-widget__text--center { grid-column: 1; }
  .al-right-loan__feature { flex-direction: column; align-items: flex-start; }
}

/* ══════════════════════════════════════════
   FLORIDA LOANS PAGE  (prefix: fl-)
══════════════════════════════════════════ */

/* Hero — inherits all .ctl-hero rules */
.fl-hero { /* no overrides needed */ }

/* ── All the Financing You Need in One Place ── */
.fl-financing {
  position: relative;
  z-index: 2;
  margin-top: -60px;
  padding: 0 20px 0;
}

.fl-financing__inner {
  max-width: 1200px;
  margin: 0 auto;
  background: linear-gradient(171.4deg, #000000 0%, #1B3F68 69.4%, #1C627D 115.67%);
  border-radius: 70px;
  padding: 60px;
}

.fl-financing__title {
  font-size: 35px;
  font-weight: 700;
  color: #ffffff;
  text-align: center;
  margin: 0 0 36px;
  line-height: 1.25;
}

.fl-financing__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.fl-financing__card {
  background: #FFFFFF;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 16px;
  padding: 44px 34px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.fl-financing__card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fl-financing__card-title {
  font-size: 21px;
  font-weight: 700;
  color: #0D1F3C;
  margin: 0;
  line-height: 1.3;
}

.fl-financing__card-text {
  font-size: 15px;
  line-height: 1.6;
  color: #3D5A7A;
  margin: 0;
}

.fl-financing__dots {
  display: none;
}

/* ── Smarter Lending, Powered by Technology ── */
.fl-smarter {
  background: #ffffff;
  padding: 70px 20px;
}

.fl-smarter__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.fl-smarter__header {
  text-align: center;
  margin-bottom: 52px;
}

.fl-smarter__title {
  font-size: 44px;
  font-weight: 800;
  color: #0D1F3C;
  margin: 0 0 12px;
  line-height: 1.2;
}

.fl-smarter__subtitle {
  font-size: 16px;
  font-weight: 700;
  color: #2A3D55;
  margin: 0;
}

.fl-smarter__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}

.fl-smarter__card {
  border: 1px solid #EEF2F7;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(13,31,60,0.08);
  display: flex;
  flex-direction: column;
  padding: 24px;
}

.fl-smarter__card-image-wrap {
  width: 100%;
  height: 220px;
  border-radius: 12px;
  overflow: hidden;
}

.fl-smarter__card-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.fl-smarter__card-body {
  padding: 28px 0 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1;
}

.fl-smarter__card-title {
  font-size: 21px;
  font-weight: 700;
  color: #0D1F3C;
  margin: 0;
}

.fl-smarter__card-desc {
  font-size: 15px;
  line-height: 1.65;
  color: #1E3650;
  margin: 0;
  font-weight: 700;
}

.fl-smarter__card-body .ctl-btn-cyan {
  align-self: flex-start;
  margin-top: 8px;
}

.fl-smarter__dots {
  display: none;
}

/* ── Responsive ── */
@media (min-width: 900px) {
  .fl-financing { margin-top: -60px; }
}

@media (max-width: 1024px) {
  .fl-hero.ctl-hero .ctl-hero__photo img{
    object-position: left center;
  }
  .fl-financing { margin-top: 0; padding: 0; }
  .fl-financing__inner { border-radius: 0; padding: 60px 48px; }

  .fl-smarter { padding-left: 48px; padding-right: 48px; }
  .fl-smarter__title { font-size: 35px; }

  .fl-blog { padding-left: 48px; padding-right: 48px; }

}

@media (max-width: 767px) {
  .fl-financing__inner { padding-left: 36px; padding-right: 36px; }
  .fl-financing__cards { display: block; width: 100%; overflow: visible; gap: 0; }
  .fl-financing__card {
    display: none;
    width: 100%;
    box-sizing: border-box;
  }
  .fl-financing__card.is-active { display: flex; }
  .fl-financing__card-desc { height: auto; }
  /* Dot indicators – fl financing */
  .fl-financing__dots { display: flex; justify-content: center; gap: 8px; margin: 24px 0 4px; }
  .fl-financing__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(206,206,206,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
  .fl-financing__dot.is-active { background: var(--cyan); transform: scale(1.2); }
  /* Slider – JS-driven show/hide */

  .fl-smarter { padding-left: 36px; padding-right: 36px; }
  .fl-smarter__grid { display: block; width: 100%; overflow: visible; gap: 0; }
  .fl-smarter__card {
    display: none;
    width: 100%;
    box-sizing: border-box;
  }
  .fl-smarter__card-image-wrap { height: 209px; }
  .fl-smarter__card-body { padding: 40px 0 24px; }
  .fl-smarter__card.is-active { display: flex; }
  .fl-smarter__card-desc { height: auto; }
  /* Dot indicators – fl smarter */
  .fl-smarter__dots { display: flex; justify-content: center; gap: 8px; margin: 24px 0 4px; }
  .fl-smarter__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(206,206,206,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
  .fl-smarter__dot.is-active { background: var(--cyan); transform: scale(1.2); }
  /* Slider – JS-driven show/hide */

  .fl-blog { background: linear-gradient(169deg, #0199be 0%, #1a3d76 100%); padding-left: 36px; padding-right: 36px; }
}


/* ════════════════════════════════════════════════════ *
 *  UTAH DISCLOSURE & FEE SCHEDULE
 * ════════════════════════════════════════════════════ */

/* ── Hero ── */
.utah-disc-hero { 
  padding-top: 60px;
  padding-bottom: 80px;
}

.utah-disc-hero__inner {
  gap: 40px;
  align-items: center;
}

.utah-disc-hero__copy { 
  flex-basis: 620px; 
  max-width: 620px; 
}

.utah-disc-hero__headline {
  font-family: 'Inter', sans-serif;
  font-size: 60px;
  font-weight: 500;
  line-height: 1.34;
  letter-spacing: -1px;
  color: #fff;
}
.utah-disc-hero__headline strong { font-weight: 700; }

.utah-disc-hero__chip {
  display: inline-block;
  background: #3ABDDD;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 6px 16px;
  border-radius: 999px;
  max-width: max-content;
}

.utah-disc-hero__complaints {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.utah-disc-hero__complaints-title {
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 4px;
}
.utah-disc-hero__complaints p {
  font-size: 16px;
  line-height: 1.65;
  color: rgba(255,255,255,0.9);
  margin: 0;
}
.utah-disc-hero__complaints strong { color: #fff; }

/* ── How to Get Your Loan ── */
.utah-disc-how {
  padding: 70px 20px;
  background: #f7fafd;
}
.utah-disc-how__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.utah-disc-how__heading { display: flex; flex-direction: column; gap: 8px; }
.utah-disc-how__title {
  font-size: 44px;
  font-weight: 800;
  color: #30353a;
  letter-spacing: -0.5px;
  line-height: 1.1;
  margin: 0;
}
.utah-disc-how__subtitle {
  font-size: 16px;
  font-weight: 400;
  color: #30353a;
  line-height: 1.6;
  margin: 0;
}
/* 3-col: Loan Details | Repayment | [Fees stacked above More Info] */
.utah-disc-how__cards {
  display: flex;
  gap: 32px;
  align-items: stretch;
}
.utah-disc-how__cards > .utah-disc-how__card { flex: 1 0 0; min-width: 0; max-width: 378px; }
/* Right-column stack */
.utah-disc-how__card-stack {
  flex: 1 0 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.utah-disc-how__card-stack .utah-disc-how__card { flex: 1; }
.utah-disc-how__card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 24px;
}
/* Icon-row variant: icon on left, content on right */
.utah-disc-how__card--icon-row {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.utah-disc-how__card--icon-row .utah-disc-how__card-body { flex: 1; min-width: 0; }
.utah-disc-how__card-icon-wrap {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.utah-disc-how__card-icon-wrap--yellow { background: #fff7e8; }
/* Card body */
.utah-disc-how__card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
/* Gradient title — all cards share this */
.utah-disc-how__card-title {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.3px;
  line-height: 27px;
  margin: 0;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.utah-disc-how__card-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0;
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  color: #30353a;
}
.utah-disc-how__card-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.utah-disc-how__card-list strong { font-weight: 600; }
/* SVG check icon */
.utah-disc-how__check-icon {
  flex-shrink: 0;
  margin-top: 2px;
}
/* Fees / More Info plain text */
.utah-disc-how__card-text {
  font-size: 15px;
  line-height: 1.65;
  color: #30353a;
  margin: 0;
}
/* NMLS gradient link */
.utah-disc-how__link {
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-decoration: none;
  filter: drop-shadow(0 4px 8px rgba(26,105,196,0.18));
}
.utah-disc-how__link:hover { opacity: 0.8; }
.utah-disc-how__note {
  font-size: 16px;
  line-height: 1.6;
  color: #30353a;
  margin: 0;
}

/* ── Utah's Range Rate ── */

/* ── Utah's Range Rate ── */
.utah-disc-rates {
  padding: 80px 20px;
  background: #fff;
}
.utah-disc-rates__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.utah-disc-rates__title {
  font-size: 44px;
  font-weight: 800;
  color: #0d1f3c;
  text-align: center;
  letter-spacing: -0.5px;
  margin-bottom: 8px;
}

/* Tab bar — underline style matching Figma */
.utah-disc-rates__tabbar {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid #CBCBCB;
  gap: 0;
}
.utah-disc-rates__tabbar-label {
  font-size: 15px;
  font-weight: 700;
  color: #6E6E6E;
  padding: 12px 20px 12px 0;
  white-space: nowrap;
  align-self: center;
}
.utah-disc-rates__tabs {
  display: flex;
  gap: 0;
  margin: 0;
}
.utah-disc-rates__tab {
  position: relative;
  padding: 12px 32px;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #0d1f3c;
  cursor: pointer;
  transition: color 0.15s;
  white-space: nowrap;
}
.utah-disc-rates__tab:hover { color: #01a1c8; }
.utah-disc-rates__tab--active {
  background: #fff;
  color: #01a1c8;
  border-top: 1px solid #CBCBCB;
  border-right: 1px solid #CBCBCB;
  border-left: 1px solid #CBCBCB;
  border-radius: 16px 16px 0 0;
}

/* Table container — rounded bordered box */
.utah-disc-rates__panel--hidden { display: none; }
.utah-disc-rates__table-wrap {
  overflow-x: auto;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
}
.utah-disc-rates__label-mobile {
  display: none;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.8em;
  color: #6E6E6E;
  margin-bottom: 8px;
  border-bottom: 1px solid #CBCBCB;
}
.utah-disc-rates__label-amount {
  font-size: 22px;
  font-weight: 700;
  color: #0D1F3C;
}
.utah-disc-rates__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  color: #0d1f3c;
}
/* Round the outer corners of the table to match its container */
.utah-disc-rates__table thead tr:first-child th:first-child { border-radius: 16px 0 0 0; }
.utah-disc-rates__table thead tr:first-child th:last-child  { border-radius: 0 16px 0 0; }
.utah-disc-rates__table tbody tr:last-child td:first-child  { border-radius: 0 0 0 16px; }
.utah-disc-rates__table tbody tr:last-child td:last-child   { border-radius: 0 0 16px 0; }

.utah-disc-rates__table th {
  background: #F5FDFF;
  font-weight: 700;
  font-size: 14px;
  color: #0d1f3c;
  text-align: center;
  padding: 16px 12px;
  border-bottom: 1px solid #e5e7eb;
}
.utah-disc-rates__table th:first-child { text-align: left; padding-left: 20px; }
.utah-disc-rates__table td {
  padding: 14px 12px;
  text-align: center;
  border-bottom: 1px solid #edf2f7;
  font-size: 15px;
}
.utah-disc-rates__table td:first-child { text-align: left; padding-left: 20px; }
.utah-disc-rates__table tbody tr:last-child td { border-bottom: none; }
.utah-disc-rates__table tbody tr:nth-child(even) { background: #f5f8fb; }
.utah-disc-rates__table tbody tr:hover { background: #eaf4fb; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .utah-disc-hero { padding-bottom: 70px; }
  .utah-disc-hero__copy { max-width: 50%; }
  .utah-disc-hero__headline { font-size: 44px; }
  .utah-disc-hero__headline-break { display: none; }
  .utah-disc-how { padding-left: 48px; padding-right: 48px; }
  .utah-disc-how__cards { flex-wrap: wrap; }
  .utah-disc-how__cards > .utah-disc-how__card { flex-basis: calc(33% - 32px); }
  .utah-disc-how__card-stack { flex-basis: calc(33% - 32px); }
  .utah-disc-rates { padding-left: 48px; padding-right: 48px; }
}
@media (max-width: 991px) {
  .utah-disc-how__cards > .utah-disc-how__card { max-width: none; flex-grow: 1; flex-basis: calc(50% - 16px); }
  .utah-disc-how__card-stack { flex-basis: 100%; }

  .utah-disc-rates__tabbar { display: none; }
  .utah-disc-rates__table-wrap { overflow-x: hidden; border: 0; border-radius: 0; }
  .utah-disc-rates__panel { margin-top: 16px; margin-bottom: 48px; border: 0; }
  .utah-disc-rates__panel:last-child { margin-bottom: 0; }
  .utah-disc-rates__table-border-mobile { overflow-x: auto; padding-bottom: 10px; scrollbar-color: #D9D9D9 #FFF9F9; scrollbar-width: thin; }
  .utah-disc-rates__table-border-mobile::-webkit-scrollbar { height: 5px; }
  .utah-disc-rates__table-border-mobile::-webkit-scrollbar-track { background: #FFF9F9; border-radius: 0; }
  .utah-disc-rates__table-border-mobile::-webkit-scrollbar-thumb { background: #D9D9D9; border-radius: 0; }
  .utah-disc-rates__table-border-mobile::-webkit-scrollbar-thumb:hover { background: #D9D9D9; }
  .utah-disc-rates__table { border: 1px solid #CCCCCC; border-radius: 16px; }
  .utah-disc-rates__label-mobile { display: flex; gap: 8px; margin-bottom: 8px; align-items: center; }
  .utah-disc-rates__panel--hidden { display: block;  }
  .utah-disc-rates__table th { min-width: 170px; }
  .utah-disc-rates__table thead tr:first-child th:first-child { border-radius: 0; }
  .utah-disc-rates__table thead tr:first-child th:last-child  { border-radius: 0; }
  .utah-disc-rates__table tbody tr:last-child td:first-child  { border-radius: 0; }
  .utah-disc-rates__table tbody tr:last-child td:last-child   { border-radius: 0; }
}
@media (max-width: 767px) {
  .utah-disc-hero { padding-top: 38px; padding-bottom: 48px; }
  .utah-disc-hero__copy { max-width: none; flex-basis: auto; }
  .utah-disc-hero__headline { font-size: 35px; }
  .utah-disc-how { padding-left: 36px; padding-right: 36px; }
  .utah-disc-how__title { font-size: 35px; }
  .utah-disc-how__cards { flex-direction: column; gap: 16px; }
  .utah-disc-how__cards > .utah-disc-how__card,
  .utah-disc-how__card-stack { flex: 1 1 auto; width: 100%; }
  .utah-disc-how__card-stack { gap: 16px; }
  .utah-disc-rates { padding-left: 36px; padding-right: 36px; }
  .utah-disc-rates__title { font-size: 35px; }
  .utah-disc-rates__tab { padding: 10px 20px; font-size: 14px; }
}
@media (max-width: 400px) {
  .utah-disc-how__card--icon-row {
    flex-direction: column;
  }
}


/* ════════════════════════════════════════════
   LOCATIONS PAGE
   ════════════════════════════════════════════ */

/* ── Hero ── */
.loc-hero {
  position: relative;
  background: linear-gradient(173.9deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 0 20px 0;
  overflow: hidden;
}

/* Decorative bubbles — exact positions from Figma (1534px canvas) */
.loc-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.loc-hero__circle {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.04);
}
.loc-hero__circle--1 { width: 320px; height: 320px; left: 50%; transform: translateX(-263%); top: 55%; }
.loc-hero__circle--2 { width: 340px; height: 340px; left: 50%; transform: translateX(-40%);   top: 80%; }
.loc-hero__circle--3 { width: 500px; height: 500px; left: 50%; transform: translateX(70%); top: -100px; }
.loc-hero__circle--4 { width: 220px; height: 220px; right: 50%; transform: translate(-40%, -90px); }

/* Decorative ring arc — section-level absolute, matches Figma Union element */
.loc-hero__ring {
  position: absolute;
  left: 50%;
  transform: translateX(270px);
  top: -176px;
  width: 363px;
  height: 363px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.loc-hero__ring img { width: 100%; height: 100%; }

.loc-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 1225px;
  margin: 0 auto;
  padding: 60px 0 60px;
}

/* copy — left column, max ~45% width so map has room on right */
.loc-hero__copy { max-width: 545px; }

.loc-hero__headline {
  font-family: 'Inter', sans-serif;
  font-size: 60px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin: 0 0 24px;
}
.loc-hero__headline strong { font-weight: 700; }

.loc-hero__body {
  font-size: 18px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.88);
  margin: 0;
}

/* map — anchored to the right, sized by height so aspect ratio is preserved */
.loc-hero__map {
  position: absolute;
  left: 50%;
  transform: translateX(-49%);
  width: 100%;
  z-index: 0;
  pointer-events: none;
  mix-blend-mode: color-dodge;
}
.loc-hero__map img {
  height: 100%;
  width: auto;
  display: block;
}

/* ── Search by State ── */
.loc-states {
  padding: 70px 20px;
  background: #F7FAFD;
}

.loc-states .container { padding: 0;}

.loc-states__white-bg { background: #fff; }

.loc-states__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.loc-states__title {
  font-family: 'Inter', sans-serif;
  font-size: 35px;
  font-weight: 700;
  color: #1e2a3a;
  text-align: center;
  margin: 0 0 40px;
  letter-spacing: -0.5px;
}

.loc-states__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
}

.loc-states__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 11px 12px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: #fff;
  color: #0e8faa;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
  transition: background 0.18s ease, color 0.18s ease;
  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #01a1c8, #2b4c81) border-box;
}
.loc-states__btn span {
  background: linear-gradient(90deg, #01a1c8, #2b4c81);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.loc-states__btn:hover,
.loc-states__btn:focus-visible {
  background: #0e8faa;
  color: #fff;
  outline: none;
  text-decoration: none;
}
.loc-states__btn:hover span,
.loc-states__btn:focus-visible span {
  background: none;
  color: #fff;
}
.loc-states__card { width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; }
.loc-states__grid--mobile,
.loc-states__dots {
  display: none;
}
.loc-states__dots { justify-content: center; gap: 8px; margin: 24px 0 4px; }
.loc-states__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(206,206,206,1); border: none; cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; flex-shrink: 0; }
.loc-states__dot.is-active { background: var(--cyan); transform: scale(1.2); }

/* ── Responsive ── */
@media (min-width: 1400px) {
  .loc-hero__map { transform: translateX(-42%); max-width: 1268px; }
}
@media (max-width: 1024px) {
  .loc-hero { padding-left: 48px; padding-right: 48px; }
  .loc-hero__circle--1 { transform: translateX(-158%); top: auto; bottom: -160px; }
  .loc-hero__circle--2 { transform: translateX(10%); top: auto; bottom: -300px; }
  .loc-hero__circle--3 { transform: translateY(-50%); top: 50%; left: auto; right: -450px; }
  .loc-hero__circle--4 { transform: translate(55%, -10px); right: 50%; }
  .loc-hero__headline { font-size: 42px; }
  .loc-hero__copy { max-width: 420px; }
  .loc-hero__ring { width: 280px; height: 280px; top: -140px; left: auto; right: 60px; transform: none; }
  .loc-states { padding-left: 48px; padding-right: 48px; }
  .loc-states__grid--desktop { display: flex; flex-wrap: wrap; justify-content: center; }
  .loc-states__btn { width: calc(25% - 9px); }
}

@media (max-width: 767px) {
  .loc-hero { padding-left: 36px; padding-right: 36px; padding-bottom: 58vw; }
  .loc-hero__circle--1 { transform: none; bottom: -100px; width: 200px; height: 200px; left: 0; top: 220px; }
  .loc-hero__circle--2 { transform: none; width: 200px; height: 200px; left: auto; right: -20px; top: auto; bottom: 0; }
  .loc-hero__circle--3 { transform: none; width: 240px; height: 240px; transform: translate(55%, -41%); top: 50%; left: auto; right: 0; }
  .loc-hero__circle--4 { transform: none; width: 160px; height: 160px; left: auto; top: -5px; right: -15px; }
  .loc-hero__copy { max-width: 100%; }
  .loc-hero__map { right: -52px; left: auto; width: 175vw; height: auto; top: auto; bottom: -44px; transform: none; }
  .loc-hero__map img { width: 100%; height: auto; }
  .loc-hero__ring { display: none; }
  .loc-states { padding-left: 36px; padding-right: 36px; }
  .loc-states__grid--desktop { display: none; }
  .loc-states__grid--mobile { display: block; }
  .loc-states__btn { width: calc(50% - 6px); }
  .loc-states__card:not(.is-active) { display: none; }
  /* Dot indicators – loc states */
  .loc-states__inner:not(.loc-count-1) .loc-states__dots { display: flex; }
  /* Slider – JS-driven show/hide */
  .loc-states__inner.loc-count-1 .loc-states__card { justify-content: center; }
}

@media (max-width: 480px) {
  .loc-hero__circle--1 { width: 200px; height: 200px; left: 0; top: 220px; }
  .loc-hero__circle--2 { width: 140px; height: 140px; left: auto; right: -30px; top: auto; bottom: 0; }
  .loc-hero__circle--3 { width: 240px; height: 240px; transform: translate(70%, 5%); }
  .loc-hero__circle--4 { width: 160px; height: 160px; left: auto; right: -15px; top: -15px; }
}
@media (max-width: 399px) {
  .loc-states__btn { font-size: 12px; }
}

/* ── Locations Cities (two-column split) ── */
.loc-cities-content {
  background: #F7FAFD;
  padding: 70px 20px;
}
.loc-cities-content__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  gap: 64px;
  align-items: center;
}
.loc-cities-content__copy {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 4px 0;
}
.loc-cities-content__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #00a8e8;
  line-height: 27px;
  margin: 0;
}
.loc-cities-content__title {
  font-family: 'Inter', sans-serif;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.2;
  color: #0d1f3c;
  margin: 0;
}
.loc-cities-content__body {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3C4248;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.loc-cities-content__body ul,
.loc-cities-content__body ol { padding-left: 24px; }
.loc-cities-content__body li {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3C4248;
  margin-bottom: 8px; 
}
.loc-cities-content__photo-wrap {
  flex: 1 1 0;
  border-radius: 70px 28px 28px 28px;
  overflow: hidden;
  box-shadow: 0px 12px 40px rgba(13, 31, 60, 0.12), 0px 4px 12px rgba(13, 31, 60, 0.06);
  height: 426px;
}
.loc-cities-content__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.loc-cities-additional-content { 
  background: #FFFFFF;
  padding: 70px 20px;
}
.loc-cities-additional-content__inner {
  max-width: 1200px;
  margin: 0 auto;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3C4248;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.loc-cities-additional-content__inner h2 {
  font-family: 'Inter', sans-serif;
  font-size: 38px;
  font-weight: 700;
  line-height: 1.2;
  color: #1f1f1f;
  margin: 0;
}
.loc-cities-additional-content__inner h3 {
  font-family: 'Inter', sans-serif;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.2;
  color: #1f1f1f;
  margin: 0;
}
.loc-cities-additional-content__inner p {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3C4248;
  margin: 0;
}
.loc-cities-additional-content__inner ul,
.loc-cities-additional-content__inner ol { padding-left: 24px; }
.loc-cities-additional-content__inner li { 
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3C4248;
  margin-bottom: 8px;
}
@media (max-width: 1024px) {
  .loc-cities-content,
  .loc-cities-additional-content {
    padding-left: 48px;
    padding-right: 48px;
  }
}

@media (max-width: 900px) {
  .loc-cities-content__inner {
    flex-direction: column-reverse;
    gap: 24px;
  }
  .loc-cities-content__photo-wrap {
    flex: unset;
    width: 100%;
    height: 280px;
    border-radius: 40px 16px 16px 16px;
    overflow: hidden;
    box-shadow: 0px 12px 40px rgba(13, 31, 60, 0.12), 0px 4px 12px rgba(13, 31, 60, 0.06);
  }
  .loc-cities-content__title {
    font-size: 28px;
  }
}

@media (max-width: 767px) {
  .loc-cities-content,
  .loc-cities-additional-content {
    padding-left: 36px;
    padding-right: 36px;
  }
}

/* ════════════════════════════════════════════
   PROVE OTP FORM WIDGET
   ════════════════════════════════════════════ */
.loc-prove-otp-form-section {
  z-index: 1;
  padding: 0 20px 0;
}
.loc-prove-otp-form-inner {
  max-width: 1200px;
  position: relative;
  max-width: 1200px;
  margin: -66px auto 0;
  background: linear-gradient(177.47deg, #000000 0%, #1b3f68 69.4%, #1c627d 115.67%);
  border-radius: 70px;
  padding: 45px 60px;
  box-sizing: border-box;
}

/* Widget renders its own title via .otp-form__title */
.otp-form__title {
  font-size: 35px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1.1;
  color: #fff;
  margin: 0 0 24px;
}

.otp-form__subtitle {
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 27px;
}

.wp-block-nowcom-block-widgets-bubble-banner-header h1, .nowcom-otp-form-form-container .otp-form__title, .nowcom-otp-form-form-container .otp-form__subtitle, .nowcom-otp-form-form-container .otp-form__action-wrapper {
  text-align: center;
}

.otp-form__row {
  justify-content: center;
  flex-direction: column;
  margin-bottom: 24px;
}

.otp-form__action {
  background: #00a9ce !important;
  background-color: #00a9ce !important;
  border: none !important;
  border-radius: 9999px !important;
  width: 187px !important;
  height: 44px !important;
  float: none !important;
  margin: 0 !important;
  box-shadow: 0 8px 15px rgba(26, 105, 196, 0.25);
  text-transform: none !important;
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
  font-family: 'Inter', sans-serif;
}

.otp-form__action:hover {
  color: #fff;
  opacity: 0.88;
}

/* ── Personal loans variant (Figma node 3611:22035) ──
   The generic rules above stack everything centered in one column. This
   page's Figma design is a 2-column / 2-row card instead: title+subtitle
   stacked on the left with the phone field beside them (bottom-aligned),
   and the agreement/disclaimer text beside the submit button underneath.
   Scoped to the block's own style-variant class so the shared/default
   layout used elsewhere is untouched. */
.is-style-prove-otp-personal-loans {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas:
    "title    phone"
    "subtitle phone"
    "footer footer";
  column-gap: 64px;
  row-gap: 8px;
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
}
.is-style-prove-otp-personal-loans .otp-form__title {
  grid-area: title;
  align-self: end;
  min-width: 0;
  margin: 0 !important;
  text-align: left !important;
}
.is-style-prove-otp-personal-loans .otp-form__subtitle {
  grid-area: subtitle;
  align-self: start;
  min-width: 0;
  margin: 0 0 16px !important;
  text-align: left !important;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.26px;
}
.is-style-prove-otp-personal-loans .otp-form__row {
  grid-area: phone;
  align-self: center;
  display: block;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}
.is-style-prove-otp-personal-loans .otp-form__tel.otp-form__col {
  flex: none !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}
/* The plugin's own style.scss caps this input at max-width:400px with no
   !important — that cap (not our width:100%) is what was squeezing the
   field down below the Figma design's width, so it needs an explicit
   override here regardless of stylesheet load order. */
.is-style-prove-otp-personal-loans .otp-form__tel-input {
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 47px;
  background: #fff !important;
  border: 1px solid #d4d4d4 !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: rgba(53,53,53,0.9) !important;
  box-sizing: border-box;
}
/* Agreement + button share the same full-width "footer" grid area (instead
   of agreement being confined to column 1 alongside the title) — an "auto"
   grid column is sized to the widest max-content contribution of every
   single-column item placed in it, and this disclaimer sentence is much
   wider than the title text, so leaving it in column 1 was blowing that
   column out and starving the phone-field column down to almost nothing.
   Spanning both columns and aligning each item to its own edge (start /
   end) keeps them from affecting column sizing while still sitting side
   by side, since 971px (784+187) comfortably fits the ~1080px row. */
.is-style-prove-otp-personal-loans .otp-form__agreement-wrapper {
  grid-area: footer;
  display: grid;
  grid-template-columns: auto 187px;
  column-gap: 24px;
  align-items: center;
}
.is-style-prove-otp-personal-loans .otp-form__agreement {
  justify-self: start;
  align-self: center;
  max-width: 100%;
  min-width: 0;
  margin: 0 !important;
  color: rgba(255,255,255,1);
  font-size: 16px;
  line-height: 1.65;
  text-align: left !important;
}
.is-style-prove-otp-personal-loans .otp-form__agreement a {
  color: rgba(255,255,255,1);
  text-decoration: underline;
}
.is-style-prove-otp-personal-loans .otp-form__action-wrapper {
  justify-self: end;
  align-self: center;
  text-align: right !important;
  margin: 0 !important;
}
.is-style-prove-otp-personal-loans .otp-form__action {
  width: 187px !important;
  height: 45px !important;
  padding: 11px 24px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #fff !important;
}

@media (max-width: 767px) {
  .is-style-prove-otp-personal-loans {
    grid-template-columns: 1fr;
    grid-template-areas:
      "title"
      "subtitle"
      "phone"
      "footer";
    row-gap: 16px;
  }
  .is-style-prove-otp-personal-loans .otp-form__subtitle { margin-bottom: 0 !important; }
  .is-style-prove-otp-personal-loans .otp-form__agreement-wrapper {
    grid-template-columns: 1fr;
    row-gap: 16px;
  }
  .is-style-prove-otp-personal-loans .otp-form__action-wrapper { justify-self: flex-start; }
}

@media (max-width: 1024px) {
  .loc-prove-otp-form-section {
    padding: 0;
    border-radius: 0;
  }
  .loc-prove-otp-form-inner {
    border-radius: 0;
    padding: 60px 48px;
    margin-top: 0;
  }
}

@media (max-width: 767px) {
  .loc-prove-otp-form-inner {
    padding-left: 36px;
    padding-right: 36px;
  }
}


/* ════════════════════════════════════════════════════ *
 *  BLOG ARCHIVE  (archive.php  →  /blog/)
 * ════════════════════════════════════════════════════ */

/* ── Hero ─────────────────────────────────────────── */
.ba-hero {
  position: relative;
  background: linear-gradient(175.93deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 36px 24px 0;
  overflow: visible;
}

/* Decorative bubbles — match Figma: left, bottom-center, top-right */
.ba-hero__circles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.ba-hero__circle {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
}
.ba-hero__circle--1 {
  /* large left circle, mostly off-screen left */
  width: 560px;
  height: 560px;
  left: 50%;
  top: 100px;
  transform: translateX(-185%);
}
.ba-hero__circle--2 {
  /* large bottom-center circle, mostly below fold */
  width: 500px;
  height: 500px;
  left: 50%;
  transform: translateX(-50%);
  top: 160px;
}
.ba-hero__circle--3 {
  /* large top-right circle, mostly off-screen right */
  width: 500px;
  height: 500px;
  left: 50%;
  transform: translateX(80%);
  top: -320px;
}

/* ── Featured card outer wrapper ─────────────────── */
/* Pull this entire section up so the card floats over the hero.
   No background here — the card's own white bg creates the visual. */
.ba-featured-inner {
  max-width: 1200px;
  margin: 0 auto;
}

/* ── Featured card ───────────────────────────────── */
.ba-featured-card {
  display: flex;
  align-items: center;
  gap: 64px;
  background: #fff;
  border: 2px solid #e8dfdf;
  border-radius: 30px;
  box-shadow: 0 4px 2.5px rgba(0, 0, 0, 0.06);
  padding: 40px;
  position: relative;
  z-index: 10;
}

.ba-featured-card__left {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px 0;
}

.ba-featured-card__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #00a8e8;
}

.ba-featured-card__title {
  font-family: 'Inter', sans-serif;
  font-size: 38px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: #0d1f3c;
  margin: 0;
}
.ba-featured-card__title-link {
  color: inherit;
}
.ba-featured-card__title-link:hover { opacity: 0.8; }

.ba-featured-card__excerpt {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3c4248;
  margin: 16px 0;
}

.ba-featured-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 24px;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  border-radius: 9999px;
  box-shadow: 0 8px 15px rgba(26, 105, 196, 0.25);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 22.5px;
  white-space: nowrap;
  transition: opacity 0.2s;
  align-self: flex-start;
}
.ba-featured-card__btn:hover { opacity: 0.85; color: #fff; }

.ba-featured-card__right {
  flex-shrink: 0;
  width: 568px;
}
.ba-featured-card__image {
  width: 100%;
  height: auto;
  border-radius: 28px;
  box-shadow: 0 12px 40px rgba(13, 31, 60, 0.12), 0 4px 12px rgba(13, 31, 60, 0.06);
  display: block;
  object-fit: cover;
}

/* ── Recent Blogs section ────────────────────────── */
.ba-section {
  position: relative;
  background: #fff;
  padding: 285px 20px 20px;
  margin-top: -215px;
  z-index: 2;
}
.ba-section__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 49px;
}

.ba-section__head {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.ba-section__title {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.5px;
  color: #191919;
  margin: 0;
}

/* ── Category tabs ────────────────────────────────── */
.ba-tabs {
  display: flex;
  align-items: flex-end;
  gap: 48px;
  border-bottom: 1px solid #d7d7d7;
}
.ba-tabs__item {
  display: flex;
  align-items: center;
  padding: 16px 0;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  color: #191919;
  white-space: nowrap;
  border-bottom: 5px solid transparent;
  margin-bottom: -1px;
  transition: border-color 0.2s, font-weight 0.2s;
}
.ba-tabs__item:hover { color: #191919; border-bottom-color: rgba(1, 170, 211, 0.4); }
.ba-tabs__item--active {
  font-weight: 700;
  border-bottom-color: #01aad3;
}

/* ── Post grid ───────────────────────────────────── */
.ba-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* ── Individual post card ─────────────────────────── */
.ba-card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  box-shadow: 0 1px 1.5px rgba(13, 31, 60, 0.08), 0 1px 1px rgba(13, 31, 60, 0.04);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ba-card__img-wrap {
  border-radius: 12px;
  overflow: hidden;
  flex-shrink: 0;
}
.ba-card__img {
  display: block;
  width: 100%;
  height: 209px;
  object-fit: cover;
  object-position: center;
  border-radius: 12px;
}
.ba-card__img--placeholder {
  background: #eef2f7;
}

.ba-card__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1;
}

.ba-card__meta {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ba-card__date {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #04a1c7;
}

.ba-card__title {
  font-family: 'Inter', sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.23;
  letter-spacing: -0.3px;
  color: #0d1f3c;
  margin: 0;
}
.ba-card__title-link { color: inherit; }
.ba-card__title-link:hover { opacity: 0.8; }

.ba-card__excerpt {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.72;
  color: #1e3650;
  margin: 0;
  flex: 1;
}
/* WP auto-generates a <p> tag inside excerpt */
.ba-card__excerpt p { margin: 0; }

.ba-card__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 22.5px;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-top: auto;
  transition: opacity 0.2s;
}
.ba-card__link:hover { opacity: 0.75; }
.ba-card__arrow { flex-shrink: 0; }

/* ── Pagination / Load More ──────────────────────── */
/* ── Load More / Spinner ─────────────────────────── */
.ba-load-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 8px;
}
.ba-load-more-wrap.hide { display: none; }

.ba-btn-load-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 32px;
  border: none;
  border-radius: 9999px;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  box-shadow: 0 8px 30px rgba(26, 105, 196, 0.25);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 22.5px;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.2s;
}
.ba-btn-load-more:hover { opacity: 0.85; }

.ba-spinner-wrap {
  display: flex;
  justify-content: center;
  margin-top: 8px;
}
/* Spinner — simple rotating ring */
.ba-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(1, 161, 200, 0.25);
  border-top-color: #01a1c8;
  border-radius: 50%;
  animation: ba-spin 0.75s linear infinite;
}
.ba-spinner.hide { display: none; }
@keyframes ba-spin { to { transform: rotate(360deg); } }

/* Fade-in for dynamically appended cards */
.ba-card--fade-in {
  animation: ba-fade-in 0.35s ease both;
}
@keyframes ba-fade-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

.ba-no-posts {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: #3c4248;
  text-align: center;
  padding: 40px 0;
}



/* ── Responsive ──────────────────────────────────── */
@media (max-width: 1100px) {
  .ba-featured-card { gap: 40px; }
  .ba-featured-card__right { width: 420px; }
  .ba-featured-card__left { gap: 8px; }
}
@media (max-width: 1024px) {
  .ba-hero { padding: 70px 48px; }
  .ba-section { margin-top: 0; }
  .ba-grid { grid-template-columns: repeat(2, 1fr); }
  .ba-section { padding: 70px 48px 20px; }
  .ba-featured-card { flex-direction: column-reverse; gap: 24px; }
  .ba-featured-card__right { width: 100%; }
  .ba-tabs { gap: 24px; }
}

@media (max-width: 767px) {
  .ba-hero { padding-left: 36px; padding-right: 36px; }
  .ba-featured-card { padding: 24px; }
  .ba-grid { grid-template-columns: 1fr; }
  .ba-section { padding-left: 36px; padding-right: 36px; }
  .ba-tabs {
    gap: 48px;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
  }
  .ba-tabs__item { white-space: nowrap; font-size: 14px; }
}
@media (max-width: 480px) {
  .ba-featured-card__title { font-size: 24px; }
}

/* ============================================================
   SINGLE POST  (sp-)
   Mirrors loancenter-new/single-post — redesign design system
   ============================================================ */

/* ── Outer wrapper ─────────────────────────────────────── */
.sp-wrap {
  font-family: 'Inter', sans-serif;
  color: var(--navy, #0d1f3c);
}

/* ── Banner (featured image + breadcrumb overlay bar) ────
   Figma: Loan-Center-Credit-Card node 3510:23854 ── */
.sp-banner {
  position: relative;
  max-width: 1200px;
  margin: 70px auto 0;
  height: 469px;
  border-radius: 30px;
  overflow: hidden;
}
.sp-banner__image {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center top;
}
.sp-banner__breadcrumbs {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 15px 37px;
  background: linear-gradient(179.08deg, #01a1c8 8.49%, #2b4c81 91.51%);
}
.sp-banner__crumb {
  font-size: 14px;
  line-height: 27.2px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  margin: 0;
}
a.sp-banner__crumb:hover { text-decoration: underline; }
.sp-banner__crumb--active {
  font-weight: 500;
  font-family: inherit;
  white-space: normal;
  pointer-events: none;
}
.sp-banner__crumb-sep {
  display: flex;
  align-items: center;
  color: #fff;
  flex: 0 0 auto;
}

/* No featured image: show just the gradient breadcrumb bar */
.sp-banner--no-image { height: auto; }

/* ── Body (content + sidebar grid) ────────────────────── */
.sp-body {
  max-width: 1200px;
  margin: 0 auto;
  padding: 48px 0px 64px;
  display: grid;
  grid-template-columns: 1fr 403px;
  gap: 48px;
  align-items: start;
}

/* ── Meta: categories & tags (above banner) ────────────── */
.sp-meta {
  background: #fff;
  padding: 12px 0;
}
.sp-meta__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
}
.sp-meta__group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.sp-meta__label {
  font-size: 14px;
  font-weight: 600;
  color: var(--navy, #0d1f3c);
  white-space: nowrap;
}
.sp-meta__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.sp-meta__pill {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid #c8d8ee;
  font-size: 13px;
  color: var(--mid-blue, #2b4c81);
  text-decoration: none;
  background: #f0f4fb;
  transition: background 0.15s, color 0.15s;
}
.sp-meta__pill:hover {
  background: var(--mid-blue, #2b4c81);
  color: #fff;
  border-color: var(--mid-blue, #2b4c81);
}

/* ── Post content area ─────────────────────────────────── */
.sp-content__title {
  font-family: 'Inter', sans-serif;
  font-size: 38px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: var(--navy, #0d1f3c);
  margin: 0 0 24px;
}
.sp-content__body {
  margin-top: 0;
  font-size: 16px;
  line-height: 1.75;
  color: #333;
}
.sp-content__body img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
.sp-content__body h2,
.sp-content__body h3,
.sp-content__body h4 {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  color: var(--navy, #0d1f3c);
  margin-top: 1.6em;
  margin-bottom: 0.5em;
  line-height: 1.3;
}
.sp-content__body h2 { font-size: 26px; }
.sp-content__body h3 { font-size: 22px; }
.sp-content__body h4 { font-size: 18px; }
.sp-content__body p  { margin-bottom: 1.2em; }
.sp-content__body a  {
  color: var(--cyan, #01a1c8);
  text-decoration: underline;
}
.sp-content__body a:hover { color: var(--mid-blue, #2b4c81); }
.sp-content__body ul,
.sp-content__body ol {
  padding-left: 1.5em;
  margin-bottom: 1.2em;
}
.sp-content__body li { margin-bottom: 0.4em; }
.sp-content__body blockquote {
  margin: 1.5em 0;
  padding: 16px 24px;
  border-left: 4px solid var(--cyan, #01a1c8);
  background: #f0f8fc;
  border-radius: 0 8px 8px 0;
  font-style: italic;
  color: #555;
}

/* ── Sidebar ───────────────────────────────────────────── */
.sp-sidebar {
  display: flex;
  flex-direction: column;
  gap: 48px;
  background: #f2f2f2;
  padding: 32px;
  border-radius: 36px;
}
.sp-sidebar-widget {
  background: #fff;
  margin-bottom: 24px;
}
.sp-sidebar-widget__title {
  font-size: 16px;
  font-weight: 700;
  color: var(--navy, #0d1f3c);
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid #e8edf5;
}
/* Recent posts list inside sidebar */
.sp-sidebar .wp-block-latest-posts__list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.sp-sidebar .wp-block-latest-posts__list li {
  padding: 8px 0;
  border-bottom: 1px solid #f0f3f8;
}
.sp-sidebar .wp-block-latest-posts__list li:last-child { border-bottom: none; }
.sp-sidebar .wp-block-latest-posts__list a {
  font-size: 14px;
  color: var(--navy, #0d1f3c);
  text-decoration: none;
  line-height: 1.4;
}
.sp-sidebar .wp-block-latest-posts__list a:hover {
  color: var(--cyan, #01a1c8);
}

/* ── [blog-info-widget] "Apply Now" widget ────────────────
   Figma: Loan-Center-Credit-Card node 3530:24543 ── */
.sp-sidebar .blog-info-widget {
  background: linear-gradient(163.97deg, #000000 0%, #1b3f68 69.404%, #1c627d 115.67%);
  border-radius: 16px;
  padding: 32px;
  color: #fff;
}

/* Title (was an orange ribbon banner) */
.sp-sidebar .blog-info-widget .ribbon {
  margin: 0 0 24px;
}
.sp-sidebar .blog-info-widget .ribbon-content {
  background: none;
  margin: 0;
  padding: 0;
}
.sp-sidebar .blog-info-widget .ribbon-content::before,
.sp-sidebar .blog-info-widget .ribbon-content::after {
  display: none;
}
.sp-sidebar .blog-info-widget .blog-widget__h2 {
  font-family: 'Inter', sans-serif;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1.2;
  text-align: left;
  text-transform: none;
  color: #fff;
  margin: 0;
}

/* Fields — single column, white rounded pills */
.sp-sidebar .blog-info-widget .blog-widget__grid {
  display: block;
}
.sp-sidebar .blog-info-widget .blog-widget__control-wrapper {
  margin-bottom: 16px;
}
/* Neutralize the plugin's old 2-column grid spacing (>=768px) so every
   field is the same full-container width, matching the single-column design */
.sp-sidebar .blog-info-widget .blog-widget__grid-cols {
  margin-right: 0;
  width: 100%;
}
.sp-sidebar .blog-info-widget .blog-widget__control {
  height: 46px;
  padding: 8px 16px;
  border: 1px solid #d4d4d4;
  border-radius: 8px;
  background: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: rgba(53,53,53,0.9);
}
.sp-sidebar .blog-info-widget .blog-widget__control::placeholder {
  font-weight: 700;
  color: rgba(53,53,53,0.9);
  opacity: 1;
}
.sp-sidebar .blog-info-widget select.blog-widget__control {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23FFA600' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
}
.sp-sidebar .blog-info-widget .blog-widget__zip {
  padding-right: 35px;
}
.sp-sidebar .blog-info-widget .blog-state {
  color: rgba(53,53,53,0.9);
  font-size: 12px;
  font-weight: 700;
}

/* "How did you hear about us?" — hidden by default in the plugin markup,
   shown here to match the design */
.sp-sidebar .blog-info-widget .blog-widget__how-about-us {
  display: flex !important;
}

/* Checkbox agreement */
.sp-sidebar .blog-info-widget .blog-widget__agreement__terms-of-use {
  margin-bottom: 24px;
}
.sp-sidebar .blog-info-widget .blog-widget__checkbox-checkmark {
  width: 26px;
  height: 26px;
  min-width: 26px;
  margin-top: 0;
  border-radius: 50%;
  background: #FFF7E8;
  border: none;
}
.sp-sidebar .blog-info-widget .blog-widget__checkbox-checkmark::before {
  left: 50%;
  top: 50%;
  width: auto;
  border-radius: 0;
  color: #FFA600;
  font-size: 13px;
  font-weight: 700;
  transform: translate(-50%, -50%) scale(0);
}
.sp-sidebar .blog-info-widget .blog-widget__checkbox-input:checked + .blog-widget__checkbox-checkmark::before {
  transform: translate(-50%, -50%) scale(1);
}
.sp-sidebar .blog-info-widget .blog-widget__checkbox-consent {
  font-size: 14px;
  line-height: 1.6;
  color: #fff;
  padding-left: 12px;
}
.sp-sidebar .blog-info-widget .blog-widget__checkbox a {
  color: #fff;
}

/* Submit button */
.sp-sidebar .blog-info-widget .blog-widget__submit {
  display: block;
  margin: 0 auto;
  min-width: 160px;
  padding: 12px 32px;
  border: none;
  border-radius: 9999px;
  background: #00A9CE;
  box-shadow: 0 8px 15px rgba(26,105,196,0.25);
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
}

/* ── [blog-widgets] "Quicklinks" card ──────────────────────
   Figma: Loan-Center-Credit-Card node 3530:24484 ── */
.sp-sidebar .blog-widgets-wrapper {
  width: 100%;
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
  padding: 24px;
  margin-top: 0;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__header {
  width: auto;
  background: none;
  color: inherit;
  font-family: 'Inter', sans-serif;
  padding: 0 0 12px;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__header::before {
  content: "Quicklinks";
  display: block;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #04a1c7;
  margin-bottom: 4px;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__title {
  margin: 0;
  padding: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.3px;
  line-height: 1.25;
  color: #0d1f3c;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents {
  padding: 0;
  margin-top: 4px;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents ul,
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents ol {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents li {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  font-size: 15px;
  font-weight: 400;
  color: #1e3650;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents li::before {
  content: "";
  display: block;
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  border: none;
  border-radius: 50%;
  background-color: #00a9ce;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='10' viewBox='0 0 11 10' fill='none'%3E%3Cpath d='M1 5H10M10 5L6 1M10 5L6 9' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  box-shadow: 0 8px 15px rgba(26,105,196,0.25);
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents li a,
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents li a:focus,
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents li a:hover {
  margin: 0;
  font-weight: 700;
  color: #1e3650;
  text-decoration: none;
}
.sp-sidebar .blog-widgets-wrapper .blog-widgets__contents li a:hover {
  text-decoration: underline;
}

/* ── [Latest from the Blog] sidebar section ────────────────
   Figma: Loan-Center-Credit-Card node 3530:24172
   Post cards reuse the .ba-card component styles. ── */
.sp-latest-blog {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 0;
}
.sp-latest-blog__header {
  text-align: center;
}
.sp-latest-blog__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #0d1f3c;
  margin: 0 0 8px;
}
.sp-latest-blog__title {
  font-family: 'Inter', sans-serif;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1.2;
  color: #0d1f3c;
  margin: 0 0 12px;
}
.sp-latest-blog__subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
  color: #1e3650;
  margin: 0;
}
.sp-latest-blog__view-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  padding: 11px 24px;
  border: 2px solid #01a1c8;
  border-radius: 9999px;
  box-shadow: 0 8px 30px rgba(26,105,196,0.25);
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #01a1c8;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.2s;
}
.sp-latest-blog__view-all:hover {
  background: rgba(1,161,200,0.08);
}

/* ── Responsive ────────────────────────────────────────── */
@media screen and (max-width: 900px) {
  .sp-body {
    grid-template-columns: 1fr;
    padding: 32px 16px 48px;
    gap: 32px;
  }
  .sp-sidebar { position: static; padding: 20px; border-radius: 24px; gap: 32px; }
  .sp-content__title { font-size: 28px; }
  .sp-banner { height: 320px; border-radius: 16px; }
  .sp-banner__breadcrumbs { padding: 12px 20px; }
  .sp-banner__crumb { font-size: 13px; }
}

/* ══════════════════════════════════════════════════════════════
   CTLR HERO  (Car Title Loan Refinance)
   Own-prefixed clone of ctl-hero — independent of CTL page styles
══════════════════════════════════════════════════════════════ */
.ctlr-hero {
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  position: relative;
  padding: 60px 20px 120px;
  overflow: hidden;
}
.ctlr-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}
.ctlr-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.ctlr-hero__circles .hero__circle--2 { top: 55%; }
.ctlr-hero__circles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }
.ctlr-hero__copy {
  flex: 0 0 520px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 564px;
  color: #fff;
}
.ctlr-hero__headline {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin: 0;
}
.ctlr-hero__subline {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255,255,255,0.9);
  margin: 0;
}
.ctlr-hero__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  height: 50px;
  padding: 11px 24px;
  width: 188px;
  border-radius: 9999px;
  background: var(--grad-btn);
  border: 2px solid var(--cyan);
  box-shadow: var(--shadow-btn);
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  transition: opacity .2s;
  white-space: nowrap;
}
.ctlr-hero__cta-btn:hover { opacity: .88; color: #fff; text-decoration: none; }
.ctlr-hero__photo-wrap {
  flex: 1 1 600px;
  max-width: 476px;
  position: relative;
  min-height: 380px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 36px;
}
.ctlr-hero__ring {
  position: absolute;
  top: -60px;
  left: 46%;
  width: 340px;
  height: 340px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.ctlr-hero__ring img { width: 100%; height: 100%; }
.ctlr-hero__dots {
  position: absolute;
  bottom: -6px;
  left: -82px;
  width: 180px;
  height: 160px;
  pointer-events: none;
  z-index: 0;
}
.ctlr-hero__dots img { width: 100%; height: 100%; }
.ctlr-hero__photo {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 476px;
  height: 315px;
  border-radius: 20px 70px 20px 20px;
  border: 7px solid rgba(255,255,255,0.4);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(13,31,60,0.25);
}
.ctlr-hero__photo img { width: 100%; height: 100%; object-fit: cover; }
.ctlr-hero__savings-badge {
  position: absolute;
  bottom: -2px;
  right: 0;
  background: rgba(255,255,255,0.95);
  border-radius: 20px;
  padding: 16px 20px;
  box-shadow: 0 4px 16px rgba(13,31,60,0.1), 0 2px 6px rgba(13,31,60,0.06);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: flex-start;
}
.ctlr-hero__savings-label {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin: 0 0 4px;
}
.ctlr-hero__savings-amount {
  font-size: 30px;
  font-weight: 700;
  color: var(--brand-blue);
  margin: 0;
  line-height: 1;
}
.ctlr-hero__savings-note {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  margin: 0;
  max-width: 149px;
  line-height: 18px;
}

/* CTLR Car Value Widget */
.ctlr-car-value-section {
  z-index: 1;
  padding: 0 20px 0;
}
.ctlr-car-value-widget {
  position: relative;
  max-width: 1200px;
  margin: -66px auto 0;
  padding: 0;
}

/* CTLR Shared Tokens */
.ctlr-section-eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--cyan-alt);
  margin-bottom: 8px;
}
.ctlr-icon-circle {
  width: 92px;
  height: 92px;
  flex-shrink: 0;
  background: #fff7e8;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* CTLR Hero Responsive */
@media (max-width: 1024px) {
  .ctlr-hero__inner { gap: 32px; }
  .ctlr-hero__copy { flex: 0 0 50%; width: 100%; }
  .ctlr-hero__photo-wrap { flex: 0 0 50%; max-width: calc(50% - 32px); padding-right: 32px; min-height: 0; }
  .ctlr-hero__headline { font-size: 40px; }
}
@media (max-width: 768px) {
  .ctlr-hero { padding: 48px 20px 80px; }
  .ctlr-hero__inner { flex-direction: column; }
  .ctlr-hero__copy, .ctlr-hero__photo-wrap { flex-basis: auto; width: 100%; max-width: 100%; min-height: 0; }
  .ctlr-hero__photo-wrap { padding-right: 36px; }
  .ctlr-hero__photo { min-height: 230px; border-radius: 16px 50px 16px 16px; }
  .ctlr-hero__savings-badge {
    right: 0;
    bottom: -24px;
  }
}

/* ══════════════════════════════════════════════════════════════
   CAR TITLE LOAN REFINANCE PAGE  (prefix: ctlr-)
   Figma: Loan-Center-Credit-Card  node 3312:18560
══════════════════════════════════════════════════════════════ */

/* ── CTLR INTRO (Don't let high monthly payments...) ── */
.ctlr-intro {
  background: #fff;
  padding: 70px 20px;
}
.ctlr-intro__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
}
.ctlr-intro__title {
  font-size: 38px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.5px;
  margin: 0 0 16px;
  line-height: 1.2;
}
.ctlr-intro__body {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #3c4248;
  margin: 0 0 12px;
}
.ctlr-intro__body:last-child {
  margin-bottom: 0;
}

/* ── CTLR PROCESS (Our Process is Simple - 5 steps) ── */
.ctlr-process {
  padding: 70px 20px;
}
.ctlr-process__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.ctlr-process__header {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
}
.ctlr-process__title {
  font-size: 44px;
  font-weight: 800;
  color: var(--navy);
  letter-spacing: -.5px;
  margin: 0;
}
.ctlr-process__steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  position: relative;
}
.ctlr-process__connector {
  position: absolute;
  top: 45px;
  left: calc(10% + 20px);
  width: calc(80% - 40px);
  height: 2px;
  background: #c9e0ff;
  z-index: 0;
}
.ctlr-process__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  position: relative;
  z-index: 1;
}
.ctlr-process__circle {
  width: 92px;
  height: 92px;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 0 3.5px rgba(108,127,131,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.ctlr-process__circle::before {
  content: "";
  position: absolute;
  width: 119px;
  height: 119px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(1,161,200,1) 0%, rgba(43,76,129,1) 100%);
  opacity: 0.25;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  pointer-events: none;
}
.ctlr-process__circle span {
  font-size: 45px;
  font-weight: 600;
  color: #ffa600;
  line-height: 1;
}
.ctlr-process__step-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.3px;
  margin: 0;
  line-height: 1.5;
}
.ctlr-process__step-desc {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-muted);
  line-height: 1.72;
  margin: 0;
}
.ctlr-process__step-desc a { color: var(--text-muted); text-decoration: underline; }

/* ── CTLR BENEFITS (Benefits of Refinancing...) ── */
.ctlr-benefits {
  background: linear-gradient(172.26deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 20px;
}
.ctlr-benefits__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.ctlr-benefits__header {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ctlr-benefits__title {
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.5px;
  line-height: 1.25;
  margin: 0;
}
.ctlr-benefits__subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
}
.ctlr-benefits__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.ctlr-benefits__card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 24px 28px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}
.ctlr-benefits__card-text {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--navy);
  letter-spacing: -.3px;
  margin: 0;
  max-width: 180px;
}
.ctlr-benefits__footer-text {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
}

/* ── CTLR HOW TO REFINANCE (two-column: copy + photo) ── */
.ctlr-how-refi {
  background: #fff;
  padding: 70px 20px;
}
.ctlr-how-refi__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 64px;
}
.ctlr-how-refi__copy {
  flex: 0 0 568px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ctlr-how-refi__title {
  font-size: 38px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.5px;
  line-height: 1.2;
  margin: 0;
}
.ctlr-how-refi__body {
  font-size: 16px;
  line-height: 1.7;
  color: #3c4248;
  margin: 0;
}
.ctlr-how-refi__photo-wrap {
  flex: 0 0 calc(100% - 632px);
  height: 426px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,0.12), 0 4px 12px rgba(13,31,60,0.06);
}
.ctlr-how-refi__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── CTLR RESPONSIVE ── */
@media (max-width: 1024px) {
  .ctlr-how-refi__inner {
    gap: 40px;
  }
  .ctlr-how-refi__copy,
  .ctlr-how-refi__photo-wrap {
    flex: 1 1 50%;
  }
  .ctlr-how-refi__photo-wrap {
    height: 320px;
  }
  .ctlr-process__steps {
    grid-template-columns: repeat(3, 1fr);
    gap: 36px;
  }
  .ctlr-process__connector {
    display: none;
  }
  .ctlr-intro__title,
  .ctlr-how-refi__title {
    font-size: 32px;
  }
  .ctlr-benefits__title {
    font-size: 34px;
  }
}
@media (max-width: 768px) {
  .ctlr-intro,
  .ctlr-process,
  .ctlr-benefits,
  .ctlr-how-refi {
    padding: 48px 20px;
  }
  .ctlr-process__steps {
    grid-template-columns: repeat(2, 1fr);
    gap: 36px;
  }
  .ctlr-benefits__cards {
    grid-template-columns: 1fr;
  }
  .ctlr-how-refi__inner {
    flex-direction: column;
  }
  .ctlr-how-refi__photo-wrap {
    height: 260px;
  }
  .ctlr-process__title,
  .ctlr-benefits__title,
  .ctlr-intro__title,
  .ctlr-how-refi__title {
    font-size: 28px;
  }
  .ctlr-benefits__title-br { display: none; }
}
@media (max-width: 560px) {
  .ctlr-process__steps {
    grid-template-columns: 1fr;
  }
}

/* ══════════════════════════════════════════════════════════════
   ALR HERO  (Auto Loan Refinance)
   Own-prefixed clone of ctl-hero — independent of CTL page styles
══════════════════════════════════════════════════════════════ */
.alr-hero {
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  position: relative;
  padding: 60px 20px 120px;
  overflow: hidden;
}
.alr-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}
.alr-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.alr-hero__circles .hero__circle--2 { top: 55%; }
.alr-hero__circles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }
.alr-hero__copy {
  flex: 0 0 520px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 564px;
  color: #fff;
}
.alr-hero__headline {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin: 0;
}
.alr-hero__subline {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255,255,255,0.9);
  margin: 0;
}
.alr-hero__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  height: 50px;
  padding: 11px 24px;
  width: 188px;
  border-radius: 9999px;
  background: var(--grad-btn);
  border: 2px solid var(--cyan);
  box-shadow: var(--shadow-btn);
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  transition: opacity .2s;
  white-space: nowrap;
}
.alr-hero__cta-btn:hover { opacity: .88; color: #fff; text-decoration: none; }
.alr-hero__photo-wrap {
  flex: 1 1 600px;
  max-width: 476px;
  position: relative;
  min-height: 380px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 36px;
}
.alr-hero__ring {
  position: absolute;
  top: -60px;
  left: 46%;
  width: 340px;
  height: 340px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.alr-hero__ring img { width: 100%; height: 100%; }
.alr-hero__dots {
  position: absolute;
  bottom: -44px;
  left: -104px;
  width: 180px;
  height: 160px;
  pointer-events: none;
  z-index: 0;
}
.alr-hero__dots img { width: 100%; height: 100%; }
.alr-hero__photo {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 476px;
  height: 315px;
  border-radius: 20px 70px 20px 20px;
  border: 7px solid rgba(255,255,255,0.4);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(13,31,60,0.25);
}
.alr-hero__photo img { width: 100%; height: 100%; object-fit: cover; }
.alr-hero__savings-badge {
  position: absolute;
  bottom: -2px;
  right: 0;
  background: rgba(255,255,255,0.95);
  border-radius: 20px;
  padding: 16px 20px;
  box-shadow: 0 4px 16px rgba(13,31,60,0.1), 0 2px 6px rgba(13,31,60,0.06);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: flex-start;
}
.alr-hero__savings-label {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin: 0 0 4px;
}
.alr-hero__savings-amount {
  font-size: 30px;
  font-weight: 700;
  color: var(--brand-blue);
  margin: 0;
  line-height: 1;
}
.alr-hero__savings-note {
  font-size: 15px;
  font-weight: 500;
  color: #6b8099;
  margin: 0;
  max-width: 149px;
  line-height: 18px;
}

/* ALR Shared Tokens */
.alr-section-eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--cyan-alt);
  margin-bottom: 8px;
}

/* ALR Hero Responsive */
@media (max-width: 1024px) {
  .alr-hero { padding: 48px 48px 80px; }
  .alr-hero__inner { gap: 32px; }
  .alr-hero__copy { flex: 0 0 50%; width: 50%; }
  .alr-hero__photo-wrap { flex: 0 0 50%; max-width: calc(50% - 32px); padding-right: 32px; }
  .alr-hero__headline { font-size: 40px; }
}
@media (max-width: 768px) {
  .alr-hero { padding: 48px 36px 80px; }
  .alr-hero__inner { flex-direction: column; }
  .alr-hero__copy, .alr-hero__photo-wrap { flex-basis: auto; width: 100%; max-width: 100%; min-height: 0; }
  .alr-hero__photo-wrap { padding-right: 36px; }
  .alr-hero__photo { min-height: 230px; border-radius: 16px 50px 16px 16px; }
  .alr-hero__savings-badge { right: 0; bottom: -24px; }
}

/* ══════════════════════════════════════════════════════════════
   AUTO LOAN REFINANCE PAGE  (prefix: alr-)
   Figma: Loan-Center-Credit-Card  node 3312:19426
══════════════════════════════════════════════════════════════ */

/* ── ALR INTRO (Ready to reduce your monthly payments?) ── */
.alr-intro {
  background: #fff;
  padding: 70px 20px;
}
.alr-intro__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 64px;
}
.alr-intro__copy {
  flex: 0 0 568px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.alr-intro__title {
  font-size: 38px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.5px;
  line-height: 1.2;
  margin: 0;
}
.alr-intro__body {
  font-size: 16px;
  line-height: 1.7;
  color: #3c4248;
  margin: 0;
}
.alr-intro__photo-wrap {
  flex: 0 0 calc(100% - 632px);
  height: 426px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,0.12), 0 4px 12px rgba(13,31,60,0.06);
}
.alr-intro__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── ALR WHY REFINANCE (4-card row on gradient bg) ── */
.alr-why {
  background: linear-gradient(172.26deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 20px;
}
.alr-why__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.alr-why__header {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.alr-why__title {
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.5px;
  line-height: 1.2;
  margin: 0;
}
.alr-why__subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
}
.alr-why__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.alr-why__card {
  background: #fff;
  border-radius: 20px;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}
.alr-why__card-icon {
  width: 64px;
  height: 64px;
  border-radius: 9999px;
  background: #fff7e8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.alr-why__card-text {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--navy);
  letter-spacing: -.3px;
  margin: 0;
}

/* ── ALR PROCESS (How Can I Refinance? — 4 steps) ── */
.alr-process {
  background: #fff;
  padding: 70px 20px;
}
.alr-process__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.alr-process__header {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
}
.alr-process__title {
  font-size: 40px;
  font-weight: 800;
  color: var(--navy);
  letter-spacing: -.5px;
  margin: 0;
  line-height: 1.2;
}
.alr-process__subtitle {
  font-size: 16px;
  color: var(--text-body);
  line-height: 1.6;
  margin: 0;
}
.alr-process__steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 43px;
  position: relative;
}
.alr-process__connector {
  position: absolute;
  top: 45px;
  left: calc(12.5% + 20px);
  width: calc(75% - 40px);
  height: 2px;
  background: #c9e0ff;
  z-index: 0;
}
.alr-process__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  position: relative;
  z-index: 1;
}
.alr-process__circle {
  width: 92px;
  height: 92px;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 0 3.5px rgba(108,127,131,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.alr-process__circle::before {
  content: "";
  position: absolute;
  width: 119px;
  height: 119px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(1,161,200,1) 0%, rgba(43,76,129,1) 100%);
  opacity: 0.25;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 8px));
  pointer-events: none;
}
.alr-process__circle span {
  font-size: 45px;
  font-weight: 600;
  color: #ffa600;
  line-height: 1;
}
.alr-process__step-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.3px;
  margin: 0;
  line-height: 1.5;
  max-width: 200px;
}
.alr-process__step-desc {
  font-size: 15px;
  font-weight: 400;
  color: var(--text-muted);
  line-height: 1.72;
  margin: 0;
}

/* ── ALR BENEFITS (dark gradient bg, two-column copy + photo) ── */
.alr-benefits {
  background: linear-gradient(172.26deg, #0d1f3c 8.49%, #1a3d76 91.51%);
  padding: 70px 20px;
}
.alr-benefits__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 64px;
}
.alr-benefits__copy {
  flex: 0 0 568px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.alr-benefits__eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--cyan-alt);
  margin: 0;
}
.alr-benefits__title {
  font-size: 38px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.5px;
  line-height: 1.2;
  margin: 0;
}
.alr-benefits__body {
  font-size: 16px;
  line-height: 1.7;
  color: rgba(255,255,255,0.85);
  margin: 0;
}
.alr-benefits__photo-wrap {
  flex: 0 0 calc(100% - 632px);
  height: 426px;
  border-radius: 28px 70px 28px 28px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(13,31,60,0.25), 0 4px 12px rgba(13,31,60,0.12);
}
.alr-benefits__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── ALR RESPONSIVE ── */
@media (max-width: 1024px) {
  .alr-benefits__inner {
    gap: 40px;
  }
  .alr-benefits__copy, .alr-benefits__photo-wrap { flex: 1 1 50%; }
  .alr-intro__copy,
  .alr-intro__photo-wrap {
    flex: 0 0 auto;
    width: 100%;
  }
  .alr-intro__photo-wrap,
  .alr-benefits__photo-wrap {
    height: 320px;
  }

  .alr-intro__copy,
  .alr-intro__photo-wrap {
    flex: 1 1 50%;
  }

  .alr-why__cards {
    grid-template-columns: repeat(2, 1fr);
  }
  .alr-process__steps {
    grid-template-columns: repeat(2, 1fr);
    gap: 36px;
  }
  .alr-process__connector {
    display: none;
  }
  .alr-intro__title,
  .alr-benefits__title,
  .alr-why__title,
  .alr-process__title {
    font-size: 32px;
  }
}
@media (max-width: 768px) {
  .alr-intro,
  .alr-why,
  .alr-process,
  .alr-benefits {
    padding: 48px 0;
  }
  .alr-intro__inner {
    flex-direction: column;
    gap: 40px;
  }
  .alr-benefits__inner {
    flex-direction: column;
  }
  .alr-intro__photo-wrap {
    height: 260px;
  }
  .alr-benefits__photo-wrap {
    height: auto;
    width: 100%;
  }
  .alr-benefits__inner {
    flex-direction: column;
  }
  .alr-intro__title,
  .alr-benefits__title,
  .alr-why__title,
  .alr-process__title {
    font-size: 28px;
  }
}
@media (max-width: 560px) {
  .alr-why__cards {
    grid-template-columns: 1fr;
  }
  .alr-process__steps {
    grid-template-columns: 1fr;
  }
}

/* =============================================================
   PROMO CODE PAGE  (pcp- prefix)
   ============================================================= */

.pcp-hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(167.15deg, var(--cyan) 8.49%, var(--mid-blue) 91.51%);
  padding: 100px 24px;
}
.pcp-hero__bubbles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.pcp-hero__bubbles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }

.pcp-hero__inner {
  position: relative;
  max-width: 669px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  text-align: center;
}

.pcp-hero__headline {
  margin: 0;
  color: #fff;
  font-size: 44px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -1px;
}

/* ── Apply Online Now card ── */
.pcp-card {
  width: 100%;
  max-width: 569px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  background: linear-gradient(170.53deg, #000000 0%, #1b3f68 69.4%, #1c627d 115.67%);
  border-radius: 70px;
  padding: 45px 60px;
  box-sizing: border-box;
}

.pcp-card__title {
  margin: 0;
  width: 100%;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.227;
  letter-spacing: -0.3px;
  text-align: center;
}

.pcp-card__consent {
  width: 100%;
}
.pcp-card__consent p {
  margin: 0;
  color: #fff;
  font-size: 16px;
  line-height: 1.65;
  text-align: center;
}
.pcp-card__consent a {
  color: #fff;
  text-decoration: underline;
}

.pcp-card__phone {
  display: block;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.227;
  letter-spacing: -0.3px;
  text-align: center;
  text-decoration: none;
}
.pcp-card__phone:hover { text-decoration: underline; color: #fff; }

/* ── [wcc-promo-code] widget overrides ── */
.pcp-widget { width: 100%; }
.pcp-widget nowcom-widgets-promo-code-container,
.pcp-widget .promo-code-container,
.pcp-widget .promo-code-container .wrapper {
  display: block;
  width: 100%;
}
/* Heading is projected via the shortcode's own content-container; the page
   already renders its own title above the widget, so hide the widget's copy
   to avoid a duplicate/empty heading block. */
.pcp-widget .promo-code-container > .wrapper > .heading { display: none; }

.pcp-widget .form-group { width: 100%; margin-bottom: 16px; }
.pcp-widget .form-group:last-of-type { margin-bottom: 0; }

.pcp-widget .form-control,
.pcp-widget .dropdown-toggler {
  width: 100%;
  height: 47px;
  box-sizing: border-box;
  padding: 8px 16px;
  background: #fff;
  border: 1px solid #d4d4d4;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: rgba(53, 53, 53, 0.9);
}
.pcp-widget .form-control::placeholder { color: rgba(53, 53, 53, 0.9); font-weight: 700; }
.pcp-widget .form-control:focus,
.pcp-widget .dropdown-toggler:focus { outline: none; border-color: var(--cyan); }

/* Product-type dropdown (shown for MANUAL_B / "Show 3 Products") */
.pcp-widget .dropdown-wrapper { position: relative; width: 100%; }
.pcp-widget .dropdown-toggler {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  gap: 15px;
}
.pcp-widget .dropdown-toggler .caret {
  flex-shrink: 0;
  width: 10px;
  height: 5px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid rgba(53, 53, 53, 0.9);
}
.pcp-widget .dropdown-items {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 20;
  margin: 0;
  padding: 4px 0;
  list-style: none;
  background: #fff;
  border: 1px solid #d4d4d4;
  border-radius: 8px;
  overflow-y: auto;
  box-shadow: 0 8px 15px rgba(26, 105, 196, 0.15);
}
.pcp-widget .dropdown-wrapper:not(.toggled) .dropdown-items { display: none; }
.pcp-widget .dropdown-items li a {
  display: flex;
  align-items: center;
  padding: 0 16px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: rgba(53, 53, 53, 0.9);
  text-decoration: none;
}
.pcp-widget .dropdown-items li a:hover,
.pcp-widget .dropdown-items li a.active { background: #f7fafd; color: var(--mid-blue); }

.pcp-widget .messages-wrapper { width: 100%; }
.pcp-widget .not-found-message,
.pcp-widget .maxed-attempt-message {
  color: #fff;
  text-align: center;
  font-size: 14px;
  margin-bottom: 16px;
}

.pcp-widget .action-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 8px;
}
.pcp-widget .btn.btn-primary {
  width: 187px;
  padding: 11px 24px;
  background: #00a9ce;
  color: #fff;
  border: none;
  border-radius: 9999px;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  box-shadow: 0 8px 15px rgba(26, 105, 196, 0.25);
  cursor: pointer;
  transition: opacity .2s;
}
.pcp-widget .btn.btn-primary:hover { opacity: .88; }
.pcp-widget .btn.btn-primary:disabled { opacity: .6; cursor: not-allowed; }

.pcp-widget .ohnohoney { position: absolute; left: -9999px; opacity: 0; }

@media (max-width: 767px) {
  .pcp-hero { padding-left: 48px; padding-right: 48px; }
}
@media (max-width: 767px) {
  .pcp-hero { padding: 64px 36px; }
  .pcp-hero__headline { font-size: 32px; }
  .pcp-card { padding: 40px; border-radius: 40px; }
  .pcp-card__title,
  .pcp-card__phone { font-size: 18px; }
}

/* ════════════════════════════════════════════════════════════
   REVIEWS PAGE  (reviews-*)
════════════════════════════════════════════════════════════ */

/* ── Hero ─────────────────────────────────────────── */
.reviews-hero {
  position: relative;
  background: linear-gradient(175.93deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 36px 24px 0;
  overflow: visible;
}

/* Decorative bubbles — match Figma: left, bottom-center, top-right */
.reviews-hero__circles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.reviews-hero__circle {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
}
.reviews-hero__circle--1 {
  /* large left circle, mostly off-screen left */
  width: 560px;
  height: 560px;
  left: 50%;
  top: 100px;
  transform: translateX(-185%);
}
.reviews-hero__circle--2 {
  /* large bottom-center circle, mostly below fold */
  width: 500px;
  height: 500px;
  left: 50%;
  transform: translateX(-50%);
  top: 160px;
}
.reviews-hero__circle--3 {
  /* large top-right circle, mostly off-screen right */
  width: 500px;
  height: 500px;
  left: 50%;
  transform: translateX(80%);
  top: -320px;
}

/* ── Featured card outer wrapper ─────────────────── */
/* Pull this entire section up so the card floats over the hero.
   No background here — the card's own white bg creates the visual. */
.reviews-featured-inner {
  max-width: 1200px;
  margin: 0 auto;
}

/* ── Featured card ───────────────────────────────── */
.reviews-featured-card {
  display: flex;
  align-items: center;
  gap: 64px;
  background: #fff;
  border: 2px solid #e8dfdf;
  border-radius: 30px;
  box-shadow: 0 4px 2.5px rgba(0, 0, 0, 0.06);
  padding: 40px;
  position: relative;
  z-index: 10;
}

.reviews-featured-card__left {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 4px 0;
  text-align: center;
}

.reviews-featured-card__title {
  font-family: 'Inter', sans-serif;
  font-size: 34px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: #191919;
  margin: 0;
}

.reviews-featured-card__rating {
  color: #000;
  leading-trim: both;
  text-edge: cap;
  font-family: Inter;
  font-size: 86px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
}

.reviews-featured-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 24px;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  border-radius: 9999px;
  box-shadow: 0 8px 15px rgba(26, 105, 196, 0.25);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 22.5px;
  white-space: nowrap;
  transition: opacity 0.2s;
  align-self: center;
}
.reviews-featured-card__btn:hover { opacity: 0.85; color: #fff; }

.reviews-featured-card__right {
  flex-shrink: 0;
  width: 568px;
}
.reviews-featured-card__image {
  width: 100%;
  height: auto;
  border-radius: 28px;
  box-shadow: 0 12px 40px rgba(13, 31, 60, 0.12), 0 4px 12px rgba(13, 31, 60, 0.06);
  display: block;
  object-fit: cover;
}

/* ── Reviews section ────────────────────────── */
.reviews-section {
  position: relative;
  background: #fff;
  padding: 285px 20px 70px;
  margin-top: -215px;
  z-index: 2;
}
.reviews-section__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 49px;
}

/* ── Reviews grid ───────────────────────────────────── */
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

/* ── Individual post card ─────────────────────────── */
.reviews-card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  box-shadow: 0 1px 1.5px rgba(13, 31, 60, 0.08), 0 1px 1px rgba(13, 31, 60, 0.04);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.reviews-card__rating-wrap {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  flex-direction: row;
}

.reviews-card__rating-body {
  color: #000;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 29.8px; /* 186.25% */
}

.reviews-card__name {
  color: #0D1F3C;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 27px; /* 150% */
  letter-spacing: -0.3px;
}

.no-reviews-message {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: #3c4248;
  text-align: center;
  padding: 40px 0;
}

/* ── Pagination / Load More ──────────────────────── */
/* ── Load More / Spinner ─────────────────────────── */
.reviews-load-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 8px;
}
.reviews-load-more-wrap.hide { display: none; }

.reviews-btn-load-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 32px;
  border: none;
  border-radius: 9999px;
  background: linear-gradient(90deg, #01a1c8 0%, #2b4c81 100%);
  box-shadow: 0 8px 30px rgba(26, 105, 196, 0.25);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 22.5px;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.2s;
}
.reviews-btn-load-more:hover { opacity: 0.85; }

.reviews-spinner-wrap {
  display: flex;
  justify-content: center;
  margin-top: 8px;
}
/* Spinner — simple rotating ring */
.reviews-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(1, 161, 200, 0.25);
  border-top-color: #01a1c8;
  border-radius: 50%;
  animation: reviews-spin 0.75s linear infinite;
}
.reviews-spinner.hide { display: none; }
@keyframes reviews-spin { to { transform: rotate(360deg); } }

/* Fade-in for dynamically appended cards */
.reviews-card--fade-in {
  animation: reviews-fade-in 0.35s ease both;
}
@keyframes reviews-fade-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Responsive ──────────────────────────────────── */
@media (max-width: 1100px) {
  .reviews-featured-card { gap: 40px; }
  .reviews-featured-card__right { width: 420px; }
  .reviews-featured-card__left { gap: 8px; }
}
@media (max-width: 1024px) {
  .reviews-hero { padding: 70px 48px; }
  .reviews-section { margin-top: 0; }
  .reviews-section { padding: 70px 48px 70px; }
  .reviews-featured-card { flex-direction: column-reverse; gap: 24px; }
  .reviews-featured-card__right { width: 100%; }
}

@media (max-width: 767px) {
  .reviews-hero { padding-left: 36px; padding-right: 36px; }
  .reviews-featured-card { padding: 24px; }
  .reviews-grid { grid-template-columns: 1fr; }
  .reviews-section { padding-left: 36px; padding-right: 36px; }
}
@media (max-width: 480px) {
  .reviews-featured-card__title { font-size: 24px; }
}

/* ══════════════════════════════════════════════════════════════
   VEHICLES LIST PAGE  (prefix: vl-)
══════════════════════════════════════════════════════════════ */

/* ── CTL HERO ── */
.vl-hero {
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  position: relative;
  padding: 60px 20px 108px;
  overflow: hidden;
}
.vl-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}

.vl-hero__copy {
  display: flex;
  flex-direction: column;
  gap: 24px;
  color: #fff;
}
.vl-hero__headline {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin: 0;
}
.vl-hero__subline {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255,255,255,0.9);
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
/* Decorative bubbles — same pattern as .refi-hero__circles */
.vl-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
/* circle--1: mid-left, partially off bottom */
/* circle--2: large, far right, partially off bottom */
.vl-hero__circles .vl-hero__circle--2 { top:55%; }
/* circle--3: upper right */
.vl-hero__circles .vl-hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }

.vl-browse-vehicles { 
  background: #FFFFFF;
  padding: 70px 20px;
}
.vl-browse-vehicles__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 27px;
}
.vl-browse-vehicles__title {
  color: #1F1F1F;
  font-family: 'Inter', sans-serif;
  font-size: 38px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin-bottom: 24px;
}
.vl-browse-vehicles-breadcrumbs__wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 22px;
  padding-bottom: 32px;
}
.vl-browse-vehicles-breadcrumbs__item {
  color: #3C4248;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 25.5px; /* 159.375% */
}
.vl-browse-vehicles-group__wrapper {
  display: flex;
  padding: 32px 0;
  flex-direction: column;
  justify-content: center;
  gap: 27px;
  align-self: stretch;
  border-top: 1px solid #DEDEDE;
}
.vl-browse-vehicles-group__title {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  background: linear-gradient(135deg, #0D3B7A 0%, #1A69C4 60%, #00A8E8 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.vl-browse-vehicles__links {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 27px;
}
.vl-browse-vehicles__card-link {
  border-radius: 16px;
  border: 1px solid #EEF2F7;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(13, 31, 60, 0.08), 0 1px 2px 0 rgba(13, 31, 60, 0.04);
  padding: 24px;
  color: #0D1F3C;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 27px; /* 150% */
  letter-spacing: -0.3px;
  text-decoration: none;
}
.vl-browse-vehicles__card-link:hover {
  text-decoration: none;
}

/* ── VL BENEFITS ── */
.vl-benefits {
  background: linear-gradient(172.26deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 70px 20px;
}
.vl-benefits__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.vl-benefits__header { 
  display: flex; 
  flex-direction: column; 
  gap: 8px; 
}
.vl-benefits__title {
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.5px;
  line-height: 1.5;
  margin: 0;
}
.vl-benefits__subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.vl-benefits__subtitle ul,
.vl-benefits__subtitle ol {
  margin: 0;
  padding-left: 24px;
}
.vl-benefits__text {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.vl-benefits__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.vl-benefits__card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 33px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  box-shadow: 0 1px 1.5px rgba(13,31,60,0.08), 0 1px 1px rgba(13,31,60,0.04);
}

/* Yellow icon badge (52×52, rounded-12) */
.vl-yellow-icon {
  width: 92px;
  height: 92px;
  flex-shrink: 0;
  background: #fff7e8;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vl-benefits__card-text {
  color: #0D1F3C;
  text-align: center;
  font-family: Inter;
  font-size: 21px;
  font-style: normal;
  font-weight: 700;
  line-height: 27px; /* 128.571% */
  letter-spacing: -0.3px;
}
.vl-benefits__body-text {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  line-height: 1.6;
  margin: 0;
}

/* ── CTL RESPONSIVE: 1024px ── */
@media (max-width: 1024px) {
  .vl-hero { padding: 60px 48px; }
  .vl-hero__circles .hero__circle--1 {
    left: 0;
    bottom: -150px;
  }
  .vl-hero__circles .hero__circle--2 {
    top: auto;
  }
  .vl-hero__circles .hero__circle--3 {
    width: 300px;
    height: 300px;
    left: auto;
    transform: translateX(80%);
    right: 0;
    top: 30px;
  }
  .vl-hero__headline { font-size: 40px; }
  .vl-browse-vehicles { padding-left: 48px; padding-right: 48px; }
  .vl-browse-vehicles__links { grid-template-columns: repeat(2, 1fr); }
  .vl-benefits { padding-left: 48px; padding-right: 48px; }
  .vl-benefits__cards { gap: 16px; grid-template-columns: repeat(2, 1fr); }
}

/* ── CTL RESPONSIVE: 767px ── */
@media (max-width: 767px) {
  .vl-hero { padding: 48px 36px 64px; }
  .vl-hero__circles .hero__circle--1 { bottom: -100px; opacity: 0.5; width: 200px; height: 200px; left: 0; top: 220px; }
  .vl-hero__circles .hero__circle--2 { width: 200px; height: 200px; left: auto; right: -20px; top: auto; bottom: 0; }
  .vl-hero__circles .hero__circle--3 { width: 240px; height: 240px; transform: translate(55%, -41%); top: 50%; }
  .vl-hero__circles .hero__circle--4 { width: 160px; height: 160px; left: auto; top: -5px; right: -15px; }
  .vl-hero__inner { flex-direction: column; padding-right: 0; gap: 40px; }
  .vl-hero__copy { max-width: none; flex-basis: auto; width: 100%; }
  .vl-browse-vehicles { padding-left: 36px; padding-right: 36px; }
  .vl-browse-vehicles__links { grid-template-columns: 1fr; }
  .vl-benefits { padding-left: 36px; padding-right: 36px; }
  .vl-benefits__cards { grid-template-columns: 1fr; }
}

/* ── CTL RESPONSIVE: 480px ── */
@media (max-width: 480px) {
  .vl-hero__savings-label { font-size: 13px; }
  .vl-hero__savings-amount { font-size: 24px; }
  .vl-hero__savings-note { font-size: 13px; }
  .vl-hero__photo { height: 230px; }
  .vl-hero__circles .hero__circle--1 {
    width: 200px;
    height: 200px;
    left: 0;
    top: 220px;
  }
  .vl-hero__circles .hero__circle--2 {
    width: 140px;
    height: 140px;
    left: auto;
    right: -30px;
    top: auto;
    bottom: 0;
  }
  .vl-hero__circles .hero__circle--3 {
    width: 240px;
    height: 240px;
    transform: translate(70%, 5%);
  }
  .vl-hero__circles .hero__circle--4 {
    width: 160px;
    height: 160px;
    left: auto;
    right: -15px;
    top: -15px;
  }
  .vl-benefits__cards { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════════
   LC LANDING PAGE  (lc-land-*)
════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.lc-land-hero {
  position: relative;
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  padding: 84px 20px 0;
  overflow: hidden;
}
.lc-land-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.lc-land-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.lc-land-hero__card {
  display: flex;
  align-items: center;
  gap: 64px;
  background: linear-gradient(176.52deg, #000 0%, #1b3f68 69.404%, #1c627d 115.67%);
  border-radius: 20px;
  box-shadow: 0 4px 2.5px rgba(0, 0, 0, 0.06);
  padding: 45px 50px;
  position: relative;
  z-index: 10;
}
.lc-land-hero__copy {
  flex: 0 0 363px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  color: #fff;
}
.lc-land-hero__title {
  font-size: 44px;
  font-family: 'Inter', sans-serif;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin: 0;
}
.lc-land-hero__desc {
  font-size: 16px;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  line-height: 25.5px;
  letter-spacing: 0.26px;
  color: rgba(255,255,255,0.9);
  margin: 0;
}
.lc-land-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  padding: 12px 28px;
  border-radius: 9999px;
  background: #00A9CE;
  border: 2px solid #00A9CE;
  box-shadow: 0 8px 30px rgba(26,105,196,0.35);
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  transition: opacity .2s;
  white-space: nowrap;
}
.lc-land-hero__cta:hover { opacity: .88; color: #fff; text-decoration: none; }

/* Gallery — slider with thumbnail strip */
.lc-land-hero__gallery {
  border-radius: 20px;
  border: 1px solid #EEF2F7;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(13, 31, 60, 0.08), 0 1px 2px 0 rgba(13, 31, 60, 0.04);
  flex: 1 1 0;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 16px;
  padding: 24px;
  min-width: 0;
}
.lc-land-slider {
  flex: 0 0 calc(66% - 8px);
  min-width: 0;
  height: 385px;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid #D8D8D8;
  box-shadow: 0 12px 40px rgba(13,31,60,0.25);
}
.lc-land-slider__track {
  display: flex;
  height: 100%;
  transition: transform .4s ease;
}
.lc-land-slider__slide { flex: 0 0 100%; height: 100%; }
.lc-land-slider__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Thumbnail strip — equal-height rows matching slider height */
.lc-land-slider__thumbs {
  flex: 0 0 34%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 385px;
  scrollbar-width: none;
}
.lc-land-slider__thumbs::-webkit-scrollbar { display: none; }
.lc-land-slider__thumb {
  flex: 1 1 0;
  min-height: 0;
  width: 100%;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  background: none;
  transition: border-color .2s;
}
.lc-land-slider__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.lc-land-slider__thumb.is-active { border-color: #01a1c8; }
.lc-land-slider__thumb:hover     { border-color: rgba(1,161,200,0.5); }

/* ── Content wrapper ── */
.lc-land-content { 
  position: relative;
  background: #fff; 
  padding: 320px 20px 70px;
  margin-top: -260px;
  z-index: 2;
}
.lc-land-content__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

/* ── Tab nav ── */
.lc-land-tabs {
  display: flex;
  align-items: flex-end;
  border-bottom: 1px solid #d7d7d7;
  flex-wrap: wrap;
}
.lc-land-tabs__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  font-size: 16px;
  font-weight: 600;
  color: #0d1f3c;
  text-decoration: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
  transition: border-color .2s, color .2s;
  white-space: nowrap;
}
.lc-land-tabs__item:hover { color: #01a1c8; border-bottom-color: rgba(1,161,200,0.4); text-decoration: none; }
.lc-land-tabs__item--active { border-bottom-color: #01a1c8; color: #01a1c8; }

/* ── Section ── */
.lc-land-section { display: flex; flex-direction: column; gap: 24px; }
.lc-land-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.lc-land-section__header .lc-land-section__title { margin: 0; }
.lc-land-changes-search {
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid #d8d8d8;
  border-radius: 9999px;
  padding: 0 0 0 16px;
  height: 44px;
  min-width: 33%;
  overflow: hidden;
}
.lc-land-changes-search input {
  flex: 1;
  border: none;
  outline: none;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #0d1f3c;
  background: transparent;
  min-width: 0;
}
.lc-land-changes-search input::placeholder { color: #aab4c0; }
.lc-land-changes-search__btn {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  align-self: stretch;
  background: #01a1c8;
  border: none;
  border-radius: 0 9999px 9999px 0;
  color: #fff;
  cursor: pointer;
  padding: 0;
}
@media (max-width: 767px) {
  .lc-land-section__header { flex-direction: column; align-items: flex-start; }
  .lc-land-changes-search { min-width: 100%; width: 100%; }
}
.lc-land-section__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 40px;
  font-weight: 700;
  color: #0d1f3c;
  letter-spacing: -.3px;
  margin: 0;
}

/* ── Accordion ── */
.lc-land-accordion { display: flex; flex-direction: column; gap: 16px; }
.lc-land-accordion__item {
  border: 1px solid #eef2f7;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08);
}
.lc-land-accordion__item.is-open { border-color: #01a1c8; }
.lc-land-accordion__header {
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 18px 24px;
  background: none;
  border: none;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  color: #0d1f3c;
  text-align: left;
  cursor: pointer;
  gap: 16px;
}
.lc-land-accordion__item.is-open .lc-land-accordion__header { color: #01a1c8; }
.lc-land-accordion__chevron { flex-shrink: 0; transition: transform .25s; color: #3d5a7a; }
.lc-land-accordion__item.is-open .lc-land-accordion__chevron { transform: rotate(180deg); color: #01a1c8; }
.lc-land-accordion__body {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease, padding .35s ease;
  padding: 0 24px;
  font-size: 15px;
  line-height: 1.7;
  color: #3d5a7a;
  border-top: 0 solid #eef2f7;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.lc-land-accordion__item.is-open .lc-land-accordion__body {
  max-height: 2000px;
  padding: 16px 24px 20px;
  border-top-width: 1px;
}
.lc-land-accordion__body ul,
.lc-land-accordion__body ol {
  padding-left: 32px;
  margin: 8px 0;
}
.lc-land-accordion__body li { margin-bottom: 4px; }

/* ── Model changes table ── */
.lc-land-table-wrap { overflow-x: auto; border: 1px solid #e5e7eb; border-radius: 16px; }

/* Model Changes card grid */
.lc-land-changes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.lc-land-change-card {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08);
}
/* display:flex overrides UA [hidden]; restore hide behaviour for search filter */
.lc-land-change-card[hidden] { display: none !important; }
.lc-land-change-card__gen {
  font-size: 14px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #01a1c8;
  margin: 0;
}
.lc-land-change-card__year {
  font-size: 24px;
  font-weight: 700;
  line-height: 27px;
  color: #0d1f3c;
  letter-spacing: -0.3px;
  margin: 0 0 8px;
}
.lc-land-change-card__feat {
  font-size: 15px;
  line-height: 20px;
  color: #3d5a7a;
  margin: 0;
}
.lc-land-change-card__feat p { margin: 0 0 6px; }
.lc-land-change-card__feat p:last-child { margin-bottom: 0; }

/* ── Loan offers ── */
.lc-land-model-content {
  background: #F7FAFD;
  padding: 70px 20px;
}
.lc-land-model-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.lc-land-offers-content {
  background: linear-gradient(160deg, #01A1C8 8.49%, #2B4C81 91.51%);
  padding: 70px 20px;
}
.lc-land-offers-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
/* Offer title text white on gradient bg */
.lc-land-offers-content .lc-land-section__title { color: #fff; }
@media (max-width: 1024px) {
  .lc-land-model-content  { padding-left: 48px; padding-right: 48px; }
  .lc-land-offers-content { padding-left: 48px; padding-right: 48px; }
}
@media (max-width: 767px) {
  .lc-land-model-content  { padding-left: 36px; padding-right: 36px; }
  .lc-land-offers-content { padding-left: 36px; padding-right: 36px; }
}

.lc-land-offers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.lc-land-offer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 1px 2px rgba(13,31,60,0.04), 0 1px 3px rgba(13,31,60,0.08);
}
.lc-land-offer__img { flex-shrink: 0; width: auto; height: 52px; object-fit: contain; border-radius: 9999px; background: #f7fafd; }
.lc-land-offer__body { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.lc-land-offer__title { font-size: 18px; font-weight: 700; line-height: 27px; color: #1D293D; margin: 0; }
.lc-land-offer__desc  { font-size: 15px; color: #3D5A7A; font-weight: 400; margin: 0; line-height: 1.6; }
.lc-land-offer__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  padding: 10px 22px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #01A1C8 0%, #2B4C81 100.17%);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .2s;
}
.lc-land-offer__cta:hover { opacity: .88; color: #fff; text-decoration: none; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .lc-land-hero { padding: 60px 48px; }
  .lc-land-hero__copy { flex: 0 0 360px; }
  .lc-land-hero__title { font-size: 36px; }
  .lc-land-hero__card { flex-direction: column; }
  .lc-land-hero__copy { flex-basis: auto; width: 100%; }
  .lc-land-content { padding: 70px 48px; margin-top: 0; }
  .lc-land-changes-grid,
  .lc-land-offers { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .lc-land-hero { padding: 48px 36px; }
  .lc-land-hero__inner { flex-direction: column; gap: 32px; }
  .lc-land-hero__card { padding: 24px; }
  .lc-land-hero__copy { flex: none; width: 100%; }
  .lc-land-hero__gallery { width: 100%; flex-direction: column; }
  .lc-land-slider__thumbs { flex-direction: row; height: auto; }
  .lc-land-content { padding-left: 36px; padding-right: 36px; }
  .lc-land-offer { flex-direction: column; }
  .lc-land-offer__img { width: 100%; height: 160px; }
  .lc-land-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .lc-land-tabs__item { font-size: 14px; padding: 12px 16px; }
  .lc-land-changes-grid,
  .lc-land-offers { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .lc-land-hero__title { font-size: 28px; }
}

/* ══════════════════════════════════════════════════════════════
   DEFAULT PAGE (prefix: pg-)
══════════════════════════════════════════════════════════════ */

/* ── PG HERO ── */
.pg-hero {
  background: linear-gradient(172.7deg, #01a1c8 8.49%, #2b4c81 91.51%);
  position: relative;
  padding: 60px 20px;
  overflow: hidden;
}
.pg-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
}
.pg-hero__copy {
  display: flex;
  flex-direction: column;
  gap: 24px;
  color: #fff;
}
.pg-hero__headline {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -1px;
  color: #fff;
  margin: 0;
}
/* Decorative bubbles — same pattern as .refi-hero__circles */
.pg-hero__circles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
/* circle--1: mid-left, partially off bottom */
/* circle--2: large, far right, partially off bottom */
.pg-hero__circles .hero__circle--2 { top:55%; }
/* circle--3: upper right */
.pg-hero__circles .hero__circle--3 { width: 480px; height: 480px; transform: translateX(85%); top: -220px; }
/* ── CTL RESPONSIVE: 1024px ── */

/* ── Content ── */
.pg-content {
  position: relative;
  background: #fff;
  padding: 70px 24px 72px;
  z-index: 1;
}
.pg-content--light-bg { background: #f7fafd; }
.pg-content__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.pg-content__body {
  color: #0D1F3C;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 27.2px;
}
.pg-content__body p {
  margin-bottom: 24px;
}
.pg-content__body a {
  color: #01a1c8;
  text-decoration: none;
  word-wrap: break-word;
}
.pg-content__body ul,
.pg-content__body ol {
  padding-left: 36px;
  margin-bottom: 24px;
}
.pg-content__body li {
  margin-bottom: 8px; 
}

@media (max-width: 1024px) {
  .pg-hero { padding: 60px 48px; }
  .pg-hero__circles .hero__circle--1 {
    left: 0;
    bottom: -150px;
  }
  .pg-hero__circles .hero__circle--2 {
    top: auto;
  }
  .pg-hero__circles .hero__circle--3 {
    width: 300px;
    height: 300px;
    left: auto;
    transform: translateX(80%);
    right: 0;
    top: 30px;
  }
  .pg-content { padding: 70px 48px; }
}

/* ── CTL RESPONSIVE: 767px ── */
@media (max-width: 767px) {
  .pg-hero { padding: 48px 36px; }
  .pg-hero__circles .hero__circle--1 { bottom: -100px; opacity: 0.5; width: 200px; height: 200px; left: 0; top: 220px; }
  .pg-hero__circles .hero__circle--2 { width: 200px; height: 200px; left: auto; right: -20px; top: auto; bottom: 0; }
  .pg-hero__circles .hero__circle--3 { width: 240px; height: 240px; transform: translate(55%, -41%); top: 50%; }
  .pg-hero__circles .hero__circle--4 { width: 160px; height: 160px; left: auto; top: -5px; right: -15px; }
  .pg-hero__inner { flex-direction: column; padding-right: 0; gap: 40px; }
  .pg-hero__copy { max-width: none; flex-basis: auto; width: 100%; }
  .pg-content { padding-left: 36px; padding-right: 36px; }
}

/* ── CTL RESPONSIVE: 480px ── */
@media (max-width: 480px) {
  .pg-hero__circles .hero__circle--1 {
    width: 200px;
    height: 200px;
    left: 0;
    top: 220px;
  }
  .pg-hero__circles .hero__circle--2 {
    width: 140px;
    height: 140px;
    left: auto;
    right: -30px;
    top: auto;
    bottom: 0;
  }
  .pg-hero__circles .hero__circle--3 {
    width: 240px;
    height: 240px;
    transform: translate(70%, 5%);
  }
  .pg-hero__circles .hero__circle--4 {
    width: 160px;
    height: 160px;
    left: auto;
    right: -15px;
    top: -15px;
  }
}

/* ══════════════════════════════════════════════════════════════
   CONTACT US PAGE (prefix: cup-)
══════════════════════════════════════════════════════════════ */
.cup-content { 
  background: #f7fafd;
  padding: 70px 24px 72px;
}
.cup-content__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  gap: 32px;
}
.cup-content__form {
  flex: 0 1 660px;
}
.cup-content__form-title {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  background: var(--buttons, linear-gradient(90deg, #01A1C8 0%, #2B4C81 100.17%));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 16px;
}
.cup-content__form-description {
  color: #3C4248;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 25.5px; /* 141.667% */
  letter-spacing: 0.26px;
  margin-bottom: 32px;
}
.contactForms__col-md-6 {
  width: 100%;
  margin: 0;
}
.lc-redesign__name-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.lc-redesign__contact-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.cup-content__form .contactForms label {
  margin-left: 0;
  color: rgba(53, 53, 53, 0.90);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 25.5px; /* 141.667% */
  letter-spacing: 0.26px; 
}
.cup-content__form .contactForms select,
.cup-content__form .contactForms input[type="tel"],
.cup-content__form .contactForms input[type="email"],
.cup-content__form .contactForms input[type="text"],
.cup-content__form .contactForms textarea {
  border-radius: 8px;
  border: 1px solid #D4D4D4;
  background: #FFF;
  display: flex;
  padding: 8px 8px 8px 16px;
  align-items: center;
  gap: 15px;
  flex: 1 0 0;
  color: rgba(53, 53, 53, 0.90);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 19.5px; /* 150% */
  width: 100%;
}
/* custom select: hide native arrow and use a positioned SVG arrow
   positioned a bit left and slightly lower than center */
.cup-content__form .contactForms select {
  /* increase padding to make room for custom arrow */
  padding-right: 38px;
  -webkit-padding-end: 38px;
  -moz-padding-end: 38px;

  /* remove native appearance so we can draw our own arrow */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  /* custom, colored SVG chevron as data URI */
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='13'%20height='9'%20viewBox='0%200%2013%209'%20fill='none'%3E%3Cpath%20d='M1.5%201.5L6.5%206.5L11.5%201.5'%20stroke='%23FFA600'%20stroke-width='3'%20stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  /* move arrow left from the far-right and a touch lower (56% vertical) */
  background-position: calc(100% - 12px) 56%;
  background-size: 10px 6px;
}

/* hide IE/Edge native dropdown arrow */
.cup-content__form .contactForms select::-ms-expand {
  display: none;
}
.cup-content__form .contactForms input[type="text"]::placeholder,
.cup-content__form .contactForms input[type="tel"]::placeholder,
.cup-content__form .contactForms input[type="email"]::placeholder,
.cup-content__form .contactForms textarea::placeholder { 
  color: rgba(53, 53, 53, 0.50);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 25.5px; /* 141.667% */
  letter-spacing: 0.26px; opacity: 1; 
}
.cup-content__form .contactForms input[type="text"]::-ms-input-placeholder,
.cup-content__form .contactForms input[type="tel"]::-ms-input-placeholder,
.cup-content__form .contactForms input[type="email"]::-ms-input-placeholder,
.cup-content__form .contactForms textarea::-ms-input-placeholder { 
  color: rgba(53, 53, 53, 0.50);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 25.5px; /* 141.667% */
  letter-spacing: 0.26px; 
}
.cup-content__form .contactForms input[type="text"]:-ms-input-placeholder,
.cup-content__form .contactForms input[type="tel"]:-ms-input-placeholder,
.cup-content__form .contactForms input[type="email"]:-ms-input-placeholder,
.cup-content__form .contactForms textarea:-ms-input-placeholder { 
  color: rgba(53, 53, 53, 0.50);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 25.5px; /* 141.667% */
  letter-spacing: 0.26px; 
}
.lc-redesign__submit-row {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  gap: 16px;
}
.contactForms .zendesk-file-attachments {
  flex: 1 1 100%;
  margin-bottom: 0;
}
.contactForms input[type="file"] {
  border-radius: 9999px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 25.5px; /* 141.667% */
  letter-spacing: 0.26px; 
  min-height: 43px;
}
.contactForms input[type="file"]::file-selector-button {
  background-color: #01A1C8;
  color: #fff;
  border: none;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
}
.contactForms input[type="file"]::-webkit-file-upload-button {
  background-color: #01A1C8;
  color: #fff;
  border: none;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
}
.contactForms .submit-btn {
  flex: 0 0 auto;
  margin-top: 0;
}
.contactForms #submit_contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 24px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #05a1dd 0%, #2b4c81 100%);
  box-shadow: var(--shadow-btn);
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  letter-spacing: initial;
  line-height: 1;
  width: 142px;
  min-height: 43px;
  height: auto;
}
.cup-content__info {
  flex: 1 1 300px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.pg-content__info-card {
  display: flex;
  padding: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  border-radius: 20px 50px 20px 20px;
  border: 1px solid #EEF2F7;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(13, 31, 60, 0.08), 0 1px 2px 0 rgba(13, 31, 60, 0.04);
}
.pg-content__info-card-title {
  color: #0D1F3C;
  font-family: 'Inter', sans-serif;
  font-size: 25px;
  font-style: normal;
  font-weight: 700;
  line-height: 27px; /* 108% */
  letter-spacing: -0.3px;
}
.pg-content__info-cols-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.pg-content__info-card-text {
  color: #222;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px; /* 160% */
}
.pg-content__info-card-text-bold {
  color: #0D1F3C;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 27px; /* 180% */
  letter-spacing: -0.3px;
  text-transform: uppercase;
}
.pg-content__info-card-ccpa-link {
  color: #0D1F3C;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 27px; /* 180% */
  letter-spacing: -0.3px;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
  text-transform: uppercase;
}
@media (min-width: 1200px) {
  .pg-content__info-cols-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 1024px) {
  .cup-content { padding: 70px 48px; }
  .cup-content__form { flex-basis: 76%; }
}
@media (max-width: 991px) {
  .cup-content__inner { flex-direction: column; gap: 48px; }
}

/* ── CTL RESPONSIVE: 767px ── */
@media (max-width: 767px) {
  .cup-content { padding-left: 36px; padding-right: 36px; }
  .lc-redesign__name-row,
  .lc-redesign__contact-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .contactForms form .row { margin-bottom: 8px; }
  .contactForms textarea { margin-bottom: 0; }
  .lc-redesign__submit-row { flex-direction: column; align-items: stretch; gap: 24px; }
  .contactForms .submit-btn { max-width: 100%; }
  .contactForms #submit_contact { width: 100%; }
  .pg-content__info-card { border-radius: 20px; }
}

/* 404 page styles */
.page-404 {
  padding: 80px 20px;
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}
.page-404 .pg-content__inner { max-width: 920px; text-align: center; }
.page-404 .pg-content__body h1 {
  font-size: clamp(28px, 6vw, 40px);
  font-weight: 800;
  line-height: 1.2;
  color: #0d1f3c;
  margin-bottom: 12px;
}
.page-404__status {
  font-size: clamp(80px, 18vw, 160px);
  font-weight: 900;
  color: #00a9ce;
  margin: 8px 0 0;
  line-height: 1;
  letter-spacing: -2px;
}
.page-404 .page-404__note { margin-top: 12px; color: #6b8099; font-weight: 500; }
@media (max-width: 600px) {
  .page-404 { padding: 48px 16px; }
  .page-404__status { font-size: clamp(60px, 24vw, 120px); }
}