/* ============================================================
   BUSINESS CAPITAL BANK — Landing page styles
   ============================================================ */
:root{
  --navy:        #071F3D;   /* primary navy: headings, body ink */
  --navy-2:      #003565;   /* secondary dark navy */
  --band-1:      #022a50;   /* navy band behind the form + funding examples */
  --band-2:      #04346a;
  --ink:         #051a33;   /* footer */
  --blue:        #087BD7;   /* primary blue */
  --blue-2:      #0559ad;   /* button gradient end */
  --blue-deep:   #0a5bb0;   /* outline icons */
  --blue-hi:     #3d9cf0;   /* accent on dark backgrounds */
  --blue-ink:    #0870c8;   /* blue for small text on light backgrounds (AA contrast) */
  --blue-soft:   #4797e0;   /* how-it-works numerals (large text, 3:1) */
  --blue-light:  #E8F5FF;
  --border:      #D6E1EA;
  --text:        #1e3350;
  --muted:       #5a6d83;
  --white:       #ffffff;

  --serif: 'DM Serif Display', Georgia, 'Times New Roman', serif;   /* single 400 weight — keep serif text at 400 */
  --sans:  'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --radius:    18px;
  --shadow:    0 24px 60px rgba(7,31,61,.18);
  --shadow-sm: 0 6px 18px rgba(7,31,61,.08);
  --maxw:      1180px;

  /* hero geometry — phones; overridden per breakpoint below */
  --overlap: 170px;   /* how far the form card rises into the hero photo */
  --wave-h:  70px;    /* height of the curved navy edge behind the card */
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--sans);
  color:var(--text);
  background:var(--white);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
:focus-visible{ outline:3px solid rgba(8,123,215,.45); outline-offset:2px; }

.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:16px; }

.accent{ color:var(--blue); }
.center{ text-align:center; }

.section-title{
  font-family:var(--serif); font-weight:400; color:var(--navy);
  font-size:clamp(30px,7.6vw,46px); line-height:1.12; letter-spacing:-.015em;
}
/* even out short multi-line text so single words don't strand on their own line */
.section-title,.form-card__title,.choose__title,.choose__text,.about__lead,
.examples__sub,.form-card__privacy,.success__text,.how-step__text{ text-wrap:balance; }

/* ============================================================
   BRAND (ascending-bar mark + serif wordmark)
   ============================================================ */
.brand{ display:inline-flex; align-items:center; gap:10px; color:var(--navy); }
.brand__mark{ width:34px; height:31px; flex:none; }
.brand__mark .b1{ fill:#0a2d5c; }
.brand__mark .b2{ fill:#0b67c4; }
.brand__mark .b3{ fill:#0a80ec; }
.brand__word{
  display:flex; flex-direction:column;
  font-family:var(--serif); font-weight:400; font-size:20px; line-height:1; letter-spacing:-.012em;
}
.brand__accent{ color:var(--blue); }

.brand--light{ color:#fff; }
.brand--light .b1{ fill:#3f7fc9; }
.brand--light .b2{ fill:#2b8fec; }
.brand--light .b3{ fill:#64b6ff; }
.brand--light .brand__accent{ color:#64b6ff; }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; isolation:isolate; overflow:hidden;
  background:#a9d4fb;              /* sky tone while the photo loads */
  color:var(--navy);
  min-height:calc(113vw + var(--overlap));
  padding-bottom:var(--overlap);
}
/* phones: portrait photo, slightly zoomed so the faces sit below the headline */
.hero__media{ position:absolute; z-index:-2; top:0; left:50%; width:112%; transform:translateX(-50%); display:block; }
.hero__img{ width:100%; height:auto; }
.hero__shade{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(232,244,255,.55) 0%, rgba(232,244,255,.18) 26%, rgba(232,244,255,0) 40%);
}
/* photo deepens toward navy where it meets the band behind the card */
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:var(--overlap); z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(2,42,80,0) 0%, rgba(2,42,80,.4) 100%);
}

/* nav */
.nav{
  position:relative; z-index:5;
  display:flex; align-items:center; justify-content:space-between;
  padding-top:14px; padding-bottom:10px;
}
.nav__right{ display:flex; align-items:center; gap:8px; }
.nav__phone{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.88); color:var(--navy-2);
  box-shadow:0 4px 14px rgba(7,31,61,.14);
  transition:background-color .15s, color .15s;
}
.nav__phone span{ display:none; }   /* icon-only on phones */
.nav__phone:hover{ background:#fff; color:var(--blue); }
.nav__toggle{ display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; width:42px; height:42px; }
.nav__toggle span{ display:block; width:26px; height:2.5px; border-radius:2px; background:var(--navy); transition:transform .25s, opacity .25s; }
.nav__toggle.is-open span:nth-child(1){ transform:translateY(8.5px) rotate(45deg); }
.nav__toggle.is-open span:nth-child(2){ opacity:0; }
.nav__toggle.is-open span:nth-child(3){ transform:translateY(-8.5px) rotate(-45deg); }

.mobile-menu{
  position:absolute; top:66px; right:16px; z-index:20;
  background:#fff; border:1px solid #e3ecf5; border-radius:14px; box-shadow:var(--shadow);
  display:none; flex-direction:column; padding:8px; min-width:220px;
}
.mobile-menu.is-open{ display:flex; }
.mobile-menu a{ padding:11px 14px; font-weight:500; font-size:15px; color:var(--navy); border-radius:9px; }
.mobile-menu a:hover{ background:var(--blue-light); }
.mobile-menu__cta{ background:linear-gradient(180deg,#0a80df 0%,var(--blue-2) 100%); color:#fff!important; text-align:center; margin-top:6px; }
.mobile-menu__cta:hover{ filter:brightness(1.08); }

/* hero copy */
.hero__inner{ position:relative; z-index:2; }
.hero__copy{ padding-top:10px; }
.hero__headline{
  font-family:var(--serif); font-weight:400; color:var(--navy);
  font-size:clamp(46px,13.4vw,64px); line-height:.94; letter-spacing:-.025em;
}
.hero__headline > span{ display:block; }
.hero__dot{ color:var(--blue); }
.hero__sub{ margin-top:12px; font-weight:300; color:var(--navy); font-size:clamp(15px,4.1vw,19px); line-height:1.36; max-width:15em; }
.hero__sub span{ display:block; text-wrap:balance; }
.hero__rule{ display:block; width:52px; height:2px; border-radius:2px; background:var(--blue); margin-top:14px; }

/* ============================================================
   FORM CARD
   ============================================================ */
/* the navy band starts where the hero photo ends (var(--overlap) below the card top) */
.apply{
  position:relative; margin-top:calc(-1 * var(--overlap)); padding-bottom:28px;
  background:linear-gradient(90deg, var(--band-1) 0%, var(--band-2) 100%) 0 var(--overlap) / 100% 100% no-repeat;
}
/* curved top edge of the band, sweeping up on the left behind the card */
.apply::before{
  content:""; position:absolute; left:0; right:0; z-index:0;
  top:calc(var(--overlap) - var(--wave-h)); height:calc(var(--wave-h) + 1px);
  background:
    radial-gradient(60% 100% at 0% 0%, rgba(14,96,182,.85) 0%, rgba(14,96,182,0) 100%),
    linear-gradient(90deg, var(--band-1) 0%, var(--band-2) 100%);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 200' preserveAspectRatio='none'%3E%3Cpath d='M0 0C420 0 900 64 1440 200V202H0z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 200' preserveAspectRatio='none'%3E%3Cpath d='M0 0C420 0 900 64 1440 200V202H0z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.apply > .container{ position:relative; z-index:1; }

.form-card{
  position:relative; z-index:2;
  background:#fff; border-radius:var(--radius);
  box-shadow:0 30px 70px rgba(2,26,56,.26), 0 2px 6px rgba(2,26,56,.06);
  max-width:890px; margin:0 auto; padding:22px 16px 18px;
}

/* step-1 header: money icon | divider | title */
.form-card__head{ display:flex; align-items:center; justify-content:center; gap:14px; margin-bottom:18px; }
.form-card__icon{ display:flex; flex:none; color:var(--blue); padding-right:14px; border-right:1.5px solid #bcd1e4; }
.form-card__icon svg{ width:44px; height:36px; }
.form-card__title{
  font-family:var(--serif); font-weight:400; color:var(--navy); text-align:center;
  font-size:clamp(23px,6.2vw,30px); line-height:1.15; letter-spacing:-.018em;
  margin-bottom:20px;
}
.form-card__head .form-card__title{ margin:0; text-align:left; }

.fstep{ display:none; }
.fstep.is-active{ display:block; animation:fade .35s ease; }
@keyframes fade{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none;} }

.amount-grid,.choice-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:16px; }
.amount,.choice{
  border:1.5px solid var(--border); border-radius:10px; background:#fff; color:var(--navy);
  min-height:54px; padding:12px 10px;
  transition:border-color .15s, background-color .15s, color .15s, box-shadow .15s;
}
.amount{ font-weight:600; font-size:clamp(15px,4.3vw,19px); letter-spacing:-.005em; }
.choice{ font-weight:500; font-size:15px; line-height:1.3; }
.amount:hover,.choice:hover{ border-color:#94c4ee; background:#f7fbff; }
.amount.is-selected,.choice.is-selected{
  border-color:var(--blue); background:var(--blue-light); color:var(--navy-2);
  box-shadow:inset 0 0 0 1px var(--blue), 0 6px 16px rgba(8,123,215,.16);
}

.btn-primary{
  width:100%; display:flex; align-items:center; justify-content:center; gap:12px;
  background:linear-gradient(180deg,#0a80df 0%,var(--blue-2) 100%); color:#fff;
  font-family:var(--serif); font-weight:400; font-size:clamp(20px,5.4vw,25px); letter-spacing:-.005em;
  min-height:56px; padding:12px 22px; border-radius:10px;
  box-shadow:0 10px 24px rgba(5,89,173,.28);
  transition:filter .15s, transform .15s, box-shadow .15s;
}
.btn-primary:hover{ filter:brightness(1.08); transform:translateY(-1px); box-shadow:0 14px 28px rgba(5,89,173,.34); }
.btn-primary:active{ transform:none; }
.btn-primary:focus-visible{ outline:3px solid rgba(8,123,215,.5); outline-offset:3px; }
.btn-primary:disabled{ opacity:.8; cursor:default; transform:none; filter:none; }
.btn-primary .arrow{ font-family:var(--sans); font-weight:300; font-size:1.05em; line-height:1; }
.btn-primary--call{ background:var(--navy-2); box-shadow:none; }

.btn-back{ display:block; margin:12px auto 0; color:var(--muted); font-size:14px; font-weight:500; padding:4px 8px; }
.btn-back:hover{ color:var(--navy); }

.form-card__note{ text-align:center; color:#33475e; font-size:14px; line-height:1.5; margin-top:14px; }
.form-card__note svg{ display:inline-block; vertical-align:-2px; margin-right:7px; color:var(--navy-2); }
.form-card__note .accent{ font-weight:500; color:var(--blue-ink); }
.form-card__sep{ color:#9fb1c3; margin:0 8px; }
/* phones: the two reassurances sit on their own centered lines */
.form-card__note--split .form-card__note-item{ display:block; white-space:nowrap; }
.form-card__note--split .form-card__sep{ display:none; }
@media (min-width:480px){
  .form-card__note--split .form-card__note-item{ display:inline; }
  .form-card__note--split .form-card__sep{ display:inline; }
}

.lead-form .field{ margin-bottom:12px; }
.lead-form input{
  width:100%; padding:15px 16px; border:1.5px solid var(--border); background:#fff;
  border-radius:10px; font-size:16px; font-family:inherit; color:var(--navy);
  transition:border-color .15s, box-shadow .15s;
}
.lead-form input::placeholder{ color:#8193a7; }
.lead-form input:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(8,123,215,.15); }
.lead-form input.invalid{ border-color:#d64545; box-shadow:0 0 0 3px rgba(214,69,69,.12); }
.lead-form .form-card__note{ font-size:13px; color:var(--muted); }

.fstep--success,.fstep--reject{ text-align:center; }
.step-alert{ margin:0 0 14px; padding:10px 14px; font-size:13px; line-height:1.45;
  color:#a8322b; background:#fdeeec; border:1px solid #f3cdc8; border-radius:10px; text-align:center; }
.step-alert[hidden]{ display:none; }
.success__check{ display:inline-flex; margin-bottom:8px; }
.success__text{ color:#44576d; max-width:420px; margin:0 auto 20px; }

/* form legal microcopy */
.form-card__consent{ font-size:12px; color:var(--muted); text-align:center; margin-top:10px; line-height:1.5; }
.form-card__consent a{ color:var(--blue-ink); text-decoration:underline; text-underline-offset:2px; }
.form-card__privacy{ font-size:12px; color:var(--muted); text-align:center; margin-top:14px; padding-top:12px; border-top:1px solid #edf2f7; line-height:1.5; }
.form-card__privacy svg{ display:inline-block; vertical-align:-2px; margin-right:5px; }
.form-card__disclaimer{ font-size:11.5px; color:var(--muted); text-align:center; margin-top:4px; line-height:1.5; }

/* 3-stage progress header — shown once the applicant is past step 1 (focus mode) */
.form-steps{ display:none; align-items:center; justify-content:space-between; gap:6px; max-width:440px; margin:0 auto 22px; }
body.form-focus .form-steps{ display:flex; }
.step{ display:flex; flex-direction:column; align-items:center; gap:6px; flex:0 0 auto; }
.step__num{
  width:34px; height:34px; border-radius:50%; display:grid; place-items:center;
  font-size:15px; font-weight:600; background:#cbd8e4; color:#fff; transition:background-color .3s;
}
.step.is-active .step__num,.step.is-complete .step__num{ background:var(--blue); }
.step__label{ font-size:10.5px; font-weight:600; letter-spacing:.8px; color:var(--muted); text-transform:uppercase; }
.step.is-active .step__label{ color:var(--blue-ink); }
.step__bar{ flex:1; height:3px; border-radius:3px; background:#d5e0ea; position:relative; top:-11px; overflow:hidden; }
.step__bar i{ position:absolute; inset:0; width:0; background:var(--blue); transition:width .4s; }
.step__bar.is-fill i{ width:100%; }

/* ============================================================
   REAL BUSINESSES. REAL FUNDING. (carousel on the navy band)
   ============================================================ */
.examples{
  background:linear-gradient(90deg, var(--band-1) 0%, var(--band-2) 100%);
  color:#fff; padding:14px 0 34px;
}
.examples__inner{ display:grid; grid-template-columns:minmax(0,1fr); gap:18px; }
.examples__title{
  font-family:var(--serif); font-weight:400; color:#fff;
  font-size:clamp(28px,7.6vw,38px); line-height:1.04; letter-spacing:.002em;
}
.examples__title .accent{ display:block; color:var(--blue-hi); }
.examples__sub{ color:#d2e1f0; font-size:15px; line-height:1.5; margin-top:10px; }

.examples__viewport{ position:relative; display:flex; align-items:center; gap:12px; margin-inline:-16px; }
.examples__track{
  flex:1; min-width:0;
  display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:4px 16px 8px; scroll-padding-inline:16px;
  -webkit-overflow-scrolling:touch; scrollbar-width:none; user-select:none;
}
.examples__track::-webkit-scrollbar{ display:none; }
.examples__track.is-grabbing{ cursor:grabbing; scroll-snap-type:none; }
.examples__track.is-grabbing .ex-card{ pointer-events:none; }

.examples__arrow{
  display:none; flex:none; width:42px; height:42px; border-radius:50%;
  border:1.5px solid rgba(255,255,255,.75); color:#fff;
  align-items:center; justify-content:center;
  transition:background-color .15s, border-color .15s, opacity .15s;
}
.examples__arrow:hover{ background:rgba(255,255,255,.12); border-color:#fff; }
.examples__arrow:disabled{ opacity:.35; cursor:default; }

.ex-card{
  position:relative; flex:0 0 152px; aspect-ratio:4 / 5; scroll-snap-align:start;
  border-radius:12px; overflow:hidden; border:1px solid rgba(255,255,255,.5);
  background:#0b2f57; box-shadow:0 10px 24px rgba(0,10,25,.28); color:#fff;
}
.ex-card__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ex-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(3,26,54,0) 34%, rgba(3,30,62,.78) 62%, rgba(3,30,62,.96) 100%);
}
.ex-card__body{ position:absolute; left:0; right:0; bottom:0; z-index:1; padding:0 12px 12px; }
.ex-card__amt{ font-weight:600; font-size:20px; line-height:1.15; letter-spacing:-.01em; }
.ex-card__name,.ex-card__loc{ font-size:12.5px; line-height:1.3; color:#e6f0fa; }
.ex-card__name{ margin-top:4px; }

.examples__dots{ display:flex; justify-content:center; gap:8px; margin-top:16px; }
.examples__dots span{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.35); cursor:pointer; transition:.2s; }
.examples__dots span.is-active{ background:var(--blue-hi); width:24px; border-radius:5px; }

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.how{ background:#fff; padding:46px 0 50px; }
.how__steps{ display:grid; gap:24px; max-width:420px; margin:28px auto 0; }
.how-step{ position:relative; display:flex; align-items:center; gap:18px; }
.how-step__num{
  flex:none; width:44px; text-align:center;
  font-family:var(--sans); font-weight:500; font-size:56px; line-height:1; color:var(--blue-soft);
}
.how-step__text{ color:var(--text); font-size:15.5px; line-height:1.45; }
/* connectors: vertical on phones, horizontal on desktop */
.how-step + .how-step::before{
  content:""; position:absolute; left:21px; top:-19px; width:2px; height:14px; border-radius:2px; background:#b9daf5;
}

/* ============================================================
   WHY BUSINESSES CHOOSE BUSINESS CAPITAL BANK
   ============================================================ */
.choose{ background:linear-gradient(180deg,#eef7fe 0%,#e6f2fd 100%); padding:50px 0 54px; }
.choose__grid{ display:flex; flex-wrap:wrap; justify-content:center; row-gap:32px; margin-top:32px; }
.choose__item{ flex:0 0 50%; padding:0 10px; text-align:center; display:flex; flex-direction:column; align-items:center; }
.choose__icon{ display:flex; align-items:center; height:48px; margin-bottom:10px; color:var(--blue-deep); }
.choose__title{ font-family:var(--serif); font-weight:400; color:var(--navy); font-size:20px; line-height:1.15; letter-spacing:-.01em; }
.choose__text{ color:var(--muted); font-size:13.5px; line-height:1.5; margin-top:8px; max-width:220px; }

/* ============================================================
   TRUST / ACCREDITATION TICKER
   ============================================================ */
.trust{ background:#fff; padding:42px 0 26px; overflow:hidden; }
.trust__label{
  display:flex; align-items:center; justify-content:center; gap:14px;
  font-weight:600; letter-spacing:3px; font-size:12px; text-transform:uppercase; color:var(--navy-2); margin-bottom:8px;
}
.trust__label::before,.trust__label::after{ content:""; width:40px; height:1px; background:var(--blue); opacity:.55; }
.trust__mask{
  position:relative; overflow:hidden; max-width:1120px; margin:0 auto;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
          mask-image:linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
.trust__track{ display:flex; width:max-content; animation:trust-scroll 30s linear infinite; will-change:transform; }
.trust__mask:hover .trust__track{ animation-play-state:paused; }
@keyframes trust-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

.trust__item{ flex:0 0 auto; margin:0 18px; }
.trust-badge{ width:172px; height:96px; display:flex; align-items:center; justify-content:center; padding:0 8px; }
.trust-badge img{ max-width:100%; max-height:56px; object-fit:contain; display:block; }
.tb-google img{ max-height:96px; }
.tb-inc img{ max-height:82px; }
.trust-badge--dark img{ max-height:82px; border-radius:4px; }
.trust-badge__fallback{ font-family:var(--serif); font-weight:400; color:var(--navy); text-align:center; font-size:16px; line-height:1.15; }
.trust-badge__fallback small{ display:block; font-family:var(--sans); font-size:10px; letter-spacing:1px; color:var(--muted); font-weight:500; margin-top:3px; }

/* ============================================================
   ABOUT US
   ============================================================ */
.about{ background:#fff; padding:44px 0 56px; border-top:1px solid #edf2f7; }
.about__inner{ max-width:820px; margin:0 auto; text-align:center; }
.about__eyebrow{
  display:inline-flex; align-items:center; gap:12px;
  font-weight:600; letter-spacing:3px; font-size:12px; text-transform:uppercase; color:var(--blue-ink); margin-bottom:14px;
}
.about__eyebrow::before,.about__eyebrow::after{ content:""; width:32px; height:1px; background:var(--blue); opacity:.55; }
.about__lead{ font-family:var(--serif); font-weight:400; color:var(--navy); font-size:clamp(24px,3.6vw,34px); line-height:1.22; letter-spacing:-.012em; margin-bottom:14px; }
.about__body{ font-size:16px; line-height:1.75; color:#3d5068; }
.about__body b{ color:var(--navy); font-weight:600; }

/* ============================================================
   CLOSING CTA
   ============================================================ */
.closing{
  position:relative; overflow:hidden; color:#fff; text-align:center; padding:60px 0 64px;
  background:
    radial-gradient(70% 120% at 88% 0%, rgba(8,123,215,.38) 0%, rgba(8,123,215,0) 60%),
    linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 100%);
}
.closing__inner{ position:relative; z-index:1; }
.closing__headline{ font-family:var(--serif); font-weight:400; line-height:1.1; letter-spacing:-.015em; }
.closing__headline span{ display:block; font-size:clamp(30px,7.4vw,50px); }
.closing__accent{ color:var(--blue-hi); }
.closing__rule{ display:block; width:52px; height:2px; border-radius:2px; background:var(--blue-hi); margin:20px auto 26px; }
.closing__btn{ max-width:340px; margin:0 auto; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:var(--ink); color:#9fb3c8; padding:44px 0 48px; }
.footer__inner{ text-align:center; display:flex; flex-direction:column; align-items:center; gap:14px; }
.footer__phone a{ color:#fff; font-family:var(--serif); font-size:24px; font-weight:400; }
.footer__phone a:hover{ color:var(--blue-hi); }
.footer__links{ display:flex; gap:10px; align-items:center; font-size:14px; }
.footer__links a{ color:#fff; }
.footer__links a:hover{ text-decoration:underline; }
.footer__links span{ color:#4f6680; }
.footer__disclaimer{ font-size:12.5px; max-width:640px; line-height:1.6; color:#8399b0; }
.footer__copy{ font-size:13px; color:#8399b0; }

/* ============================================================
   LEGAL PAGES (privacy policy, terms)
   ============================================================ */
.lhead{ background:var(--navy); }
.lhead__bar{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 16px; }
.lhead__phone{ display:inline-flex; align-items:center; gap:8px; background:#fff; color:var(--navy);
  font-weight:600; font-size:14px; padding:9px 16px; border-radius:40px; white-space:nowrap; }
.lhead__phone svg{ color:var(--blue); }
.ltitle{ background:linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%); padding:34px 0 40px; color:#fff; }
.ltitle h1{ font-family:var(--serif); font-weight:400; font-size:clamp(28px,6vw,40px); letter-spacing:-.015em; line-height:1.15; }
.ltitle__sub{ color:#c7d6e6; margin-top:6px; font-size:15px; }
.ltitle__eff{ color:var(--blue-hi); font-weight:600; font-size:12.5px; letter-spacing:.8px; margin-top:10px; text-transform:uppercase; }
.legal{ padding:40px 0 56px; background:#fff; }
.legal__wrap{ max-width:820px; margin:0 auto; }
.legal p{ font-size:15.5px; line-height:1.75; margin:0 0 16px; color:#26313d; }
.legal__lede{ font-size:16.5px; color:#33414f; }
.legal h2{ font-family:var(--serif); font-weight:400; color:var(--navy); font-size:24px; margin:30px 0 12px; }
.legal__jump{ margin:0 0 26px; font-size:14px; font-weight:500; }
.legal__jump a{ color:var(--blue-ink); }
.legal__part{ font-family:var(--serif); font-weight:400; color:var(--navy); font-size:30px; letter-spacing:-.01em; margin:6px 0 16px; padding-bottom:10px; border-bottom:2px solid var(--blue); scroll-margin-top:90px; }
.legal__sec{ font-family:var(--serif); font-weight:400; color:var(--navy); font-size:20px; margin:26px 0 10px; }
.legal__divider{ border:0; border-top:1px solid #e2e7ec; margin:46px 0; }
.legal ul{ margin:0 0 16px; padding-left:22px; }
.legal li{ font-size:15.5px; line-height:1.7; margin-bottom:8px; color:#26313d; }
.legal strong{ color:var(--navy); }
.legal a{ color:var(--blue-ink); }
.legal hr{ border:0; border-top:1px solid #e2e7ec; margin:26px 0; }

/* thank-you legal links */
.success__links{ margin-top:18px; font-size:12.5px; color:var(--muted); }
.success__links a{ color:var(--muted); text-decoration:underline; }
.success__links span{ margin:0 6px; color:#c3ccd5; }

/* standalone thank-you page — centered card on navy */
.ty-wrap{ min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:linear-gradient(180deg,var(--navy) 0%,var(--band-1) 100%); padding:28px 16px; }
.ty-wrap .focus-logo{ display:flex; margin-bottom:22px; }
.ty-wrap .form-card{ max-width:560px; width:100%; padding:30px 24px 26px; }

/* ============================================================
   DISTRACTION-FREE FOCUS MODE (while filling the form / thank-you)
   Once the user moves past the first question, the hero and every section
   below drop away so the form is the only thing on screen.
   ============================================================ */
.focus-logo{ display:none; align-items:center; justify-content:center; margin-bottom:22px; }
.focus-logo .brand__mark{ width:40px; height:36px; }
.focus-logo .brand__word{ font-size:23px; }

body.form-focus .hero,
body.form-focus .trust,
body.form-focus .about,
body.form-focus .examples,
body.form-focus .how,
body.form-focus .choose,
body.form-focus .closing,
body.form-focus .footer{ display:none; }

body.form-focus .apply{
  margin-top:0; min-height:100vh; padding:22px 0;
  display:flex; align-items:center;
  background:linear-gradient(180deg,var(--navy) 0%,var(--band-1) 100%);
}
body.form-focus .apply::before{ display:none; }
body.form-focus .apply .container{ width:100%; }
body.form-focus .focus-logo{ display:flex; }
body.form-focus .form-card{ max-width:720px; }

/* ============================================================
   SMALL PHONES
   ============================================================ */
@media (max-width:374px){
  .brand__word{ font-size:18px; }
  .brand__mark{ width:30px; height:27px; }
  .form-card__icon{ padding-right:10px; }
  .form-card__icon svg{ width:36px; height:30px; }
  .form-card__head{ gap:10px; }
  .amount{ font-size:14.5px; }
  .choose__title{ font-size:18px; }
}

/* ============================================================
   LARGE PHONES / SMALL TABLETS (portrait photo, recomposed)
   ============================================================ */
@media (min-width:600px){
  :root{ --overlap:200px; --wave-h:110px; }
  .container{ padding-inline:24px; }
  .examples__viewport{ margin-inline:-24px; }
  .examples__track{ padding-inline:24px; scroll-padding-inline:24px; }

  /* shift the portrait photo up so the faces sit just below the copy */
  .hero{ min-height:calc(60vw + 196px + var(--overlap)); }
  .hero__media{ width:100%; top:calc(196px - 41.3vw); }

  .brand__mark{ width:40px; height:36px; }
  .brand__word{ font-size:23px; }
  .nav{ padding-top:20px; }
  .mobile-menu{ top:74px; right:24px; }
  .hero__copy{ padding-top:14px; }
  .hero__headline{ font-size:clamp(64px,10.5vw,84px); }
  .hero__sub{ font-size:clamp(18px,2.6vw,21px); margin-top:16px; }
  .hero__rule{ margin-top:18px; }

  .form-card{ max-width:680px; padding:28px 30px 22px; }
  .form-card__icon svg{ width:52px; height:42px; }
  .amount-grid,.choice-grid{ gap:12px; }

  .ex-card{ flex-basis:170px; }

  .choose__item{ flex-basis:33.333%; }
  .lhead__bar{ padding-inline:24px; }
}

@media (min-width:768px){
  /* phone number becomes a quiet text link next to the menu button */
  .nav__phone{ width:auto; height:auto; padding:9px 16px; border-radius:40px; font-weight:600; font-size:15px; color:var(--navy); }
  .nav__phone svg{ color:var(--blue); }
  .nav__phone span{ display:inline; }
  .nav__right{ gap:14px; }

  .how__steps{ grid-template-columns:1fr 1fr; max-width:680px; column-gap:40px; row-gap:30px; }
  .how-step + .how-step::before{ display:none; }

  .ty-wrap .form-card{ padding:38px 44px 32px; }
}

/* ============================================================
   DESKTOP (wide photo, copy on the left, people on the right)
   ============================================================ */
@media (min-width:1024px){
  :root{ --overlap:clamp(210px,21vw,300px); --wave-h:clamp(90px,10vw,150px); }

  .hero{ min-height:0; background:#cfe5f9; }
  .hero__media{ inset:0; top:0; left:0; width:100%; height:100%; transform:none; }
  .hero__img{ height:100%; object-fit:cover; object-position:100% 28%; }
  .hero__shade{
    background:linear-gradient(90deg, rgba(234,245,255,.80) 0%, rgba(234,245,255,.52) 24%, rgba(234,245,255,0) 44%);
  }

  .nav{ padding-top:24px; padding-bottom:12px; }
  .brand__mark{ width:46px; height:42px; }
  .brand__word{ font-size:27px; }
  .nav__phone{ background:rgba(255,255,255,.86); box-shadow:0 4px 14px rgba(7,31,61,.12); }
  .nav__phone:hover{ background:#fff; color:var(--blue); }
  .mobile-menu{ top:82px; right:max(24px, calc((100vw - var(--maxw)) / 2 + 24px)); }

  .hero__copy{ padding-top:clamp(26px,2.8vw,44px); padding-bottom:44px; }
  .hero__headline{ font-size:clamp(84px,7.8vw,120px); line-height:.94; }
  .hero__sub{ font-size:clamp(20px,2.1vw,31px); margin-top:20px; line-height:1.3; max-width:11.6em; }
  .hero__sub span + span{ margin-top:.3em; }
  .hero__rule{ width:64px; margin-top:22px; }

  .form-card{ max-width:890px; padding:30px 40px 22px; }
  .form-card__head{ gap:22px; margin-bottom:22px; }
  .form-card__icon{ padding-right:22px; }
  .form-card__icon svg{ width:62px; height:50px; }
  .form-card__title{ font-size:34px; }
  .form-card__head .form-card__title{ font-size:40px; }
  .amount-grid,.choice-grid{ gap:10px 12px; margin-bottom:14px; }
  .amount{ min-height:58px; }
  .choice{ min-height:58px; font-size:16px; }
  .btn-primary{ min-height:58px; }

  /* funding examples: intro column + 4–5 visible cards with arrows */
  .examples{ padding:22px 0 46px; }
  .examples__inner{ max-width:1320px; grid-template-columns:250px minmax(0,1fr); align-items:center; gap:28px; }
  .examples__title{ font-size:31px; }
  .examples__viewport{ margin-inline:0; gap:14px; }
  .examples__arrow{ display:flex; }
  .examples__track{ gap:12px; padding:4px 2px 8px; scroll-padding-inline:2px; }
  .ex-card{ flex-basis:calc((100% - 3 * 12px) / 4); }
  .ex-card__amt{ font-size:22px; }
  .ex-card__name,.ex-card__loc{ font-size:13px; }
  .examples__dots{ display:none; }   /* arrows + drag handle navigation on desktop */

  .how{ padding:46px 0 52px; }
  .how__steps{ --how-gap:clamp(44px,5.2vw,76px); grid-template-columns:repeat(4,1fr); max-width:1080px; column-gap:var(--how-gap); margin-top:26px; }
  .how-step{ align-items:flex-start; gap:14px; }
  .how-step + .how-step::before{ display:block; left:calc(-1 * var(--how-gap) + 8px); top:30px; width:calc(var(--how-gap) - 16px); height:2px; }
  .how-step__num{ width:auto; font-size:clamp(60px,4.9vw,70px); }
  .how-step__text{ font-size:15px; padding-top:6px; }

  .choose{ padding:48px 0 56px; }
  .choose .container{ max-width:1260px; }
  .choose__grid{ flex-wrap:nowrap; justify-content:space-between; margin-top:30px; }
  .choose__item{ flex:1 1 0; padding:4px 18px; }
  .choose__item + .choose__item{ border-left:1px solid #c6d9ea; }
  .choose__title{ font-size:22px; }

  .closing{ padding:76px 0 80px; }
  .footer{ padding:52px 0 56px; }
}

@media (min-width:1200px){
  .ex-card{ flex-basis:calc((100% - 4 * 12px) / 5); }
}

/* very wide screens: keep the photo at its native width, anchored right,
   and feather its left edge into the sky so the copy never covers the people */
@media (min-width:1680px){
  .hero{ background:linear-gradient(180deg,#cfe6fc 0%,#e3effa 55%,#d9e3ec 100%); }
  .hero__media{ left:auto; right:0; width:1680px;
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 22%);
            mask-image:linear-gradient(90deg, transparent 0, #000 22%); }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .trust__track{ animation:none; }
  .fstep.is-active{ animation:none; }
}