:root {
  --ink:#132238; --forest:#1f6b4b; --paper:#f8fafb; --line:#dce4e8;
  --muted:#5e6b7d; --lime:#c8f3a3; --white:#fff; --error:#b3261e;
}
* { box-sizing:border-box }
html { scroll-behavior:smooth; scroll-padding-top:28px }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; -webkit-font-smoothing:antialiased }
a { color:inherit; text-underline-offset:4px }
button,input,select { font:inherit }
button,a,input,select,summary { touch-action:manipulation }
button,a { -webkit-tap-highlight-color:transparent }
[hidden] { display:none!important }
:focus-visible { outline:3px solid #69b28b; outline-offset:4px }
.wrap { max-width:1256px; margin:auto; padding-left:40px; padding-right:40px }
.skip { position:fixed; top:-90px; background:var(--ink); color:white; padding:12px; z-index:20 }
.skip:focus { top:0 }
.preview { background:#132238; color:#d9e8e1; text-align:center; padding:7px 16px; font-size:11px; letter-spacing:.1px }
.header { display:flex; align-items:center; justify-content:space-between; gap:28px; min-height:104px; border-bottom:1px solid #dfe8e7 }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; font-size:19px; font-weight:750; line-height:1.2; letter-spacing:-.6px; flex-shrink:0 }
.brand-logo { width:52px; height:52px; border-radius:15px; box-shadow:0 3px 9px #1322380b }
.brand-light { display:block; font-weight:400; font-size:10px; line-height:1.4; letter-spacing:.15px; color:var(--muted); margin-top:6px }
.header nav { display:flex; gap:27px; font-size:12px; font-weight:500 }
.header nav a { text-decoration:none }
.header nav a:hover { color:var(--forest) }
.button { display:inline-flex; align-items:center; justify-content:center; gap:25px; padding:17px 24px; border:1px solid var(--forest); background:var(--forest); color:white; border-radius:11px; font-size:14px; font-weight:650; line-height:1.4; text-decoration:none; cursor:pointer; transition:background .15s,transform .15s,box-shadow .15s }
.button:hover { background:#17543b; box-shadow:0 6px 16px #1f6b4b20; transform:translateY(-1px) }
.button:disabled { opacity:.55; cursor:wait; transform:none; box-shadow:none }
.button.outline { background:transparent; color:var(--ink); border-color:#b8c8ce }
.button.outline:hover { background:#ebf4ee }
.button.small { padding:12px 18px; font-size:12px; border-color:var(--ink) }
.full { width:100% }
.eyebrow { font-size:10px; font-weight:700; line-height:1.5; letter-spacing:1.8px }
.dot { display:inline-block; background:var(--forest); width:6px; height:6px; border-radius:50%; flex-shrink:0 }
h1,h2,h3 { text-wrap:balance }
h1 { font-size:64px; line-height:1.08; letter-spacing:-3.7px; margin:24px 0 20px; font-weight:750 }
h1 em { font-style:normal; color:var(--forest); font-weight:750 }
h2 { font-size:42px; line-height:1.15; letter-spacing:-1.9px; margin:14px 0 22px }
h3 { font-size:20px; line-height:1.35; letter-spacing:-.5px }
.muted { color:var(--muted) }
.fine { color:var(--muted); font-size:11px; line-height:1.75 }
.text-link { text-decoration:none; font-size:13px; font-weight:650 }
.text-link span { margin-left:12px }
.text-link:hover { text-decoration:underline }
#home { background:radial-gradient(ellipse at 25% 5%,#e8f5ef 0,transparent 27%) }
.hero { display:grid; grid-template-columns:1.22fr 1fr; gap:70px; align-items:center; padding-top:38px; padding-bottom:40px }
.hero-copy,.calculator { min-width:0 }
.hero-tag { display:inline-flex; align-items:center; gap:9px; border:1px solid #b8d7c9; border-radius:100px; padding:7px 12px; font-size:9px; letter-spacing:1.15px; color:#2b5d4a; background:#ffffff70; margin-top:0; margin-bottom:0 }
.intro { max-width:470px; font-size:15px; line-height:1.85; color:var(--muted); margin:0 }
.hero-links { display:flex; gap:30px; align-items:center; margin-top:21px }
.device-label { color:var(--muted); font-size:11px; display:flex; align-items:center; gap:8px }
.device-label>span { color:var(--forest); font-size:17px }
.hero-visual { position:relative; width:100%; height:220px; margin-top:29px; border-radius:20px; overflow:hidden; background:#dceee6; isolation:isolate }
.hero-photo { width:100%; height:100%; object-fit:cover; object-position:center 12%; display:block }
.hero-visual:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#102c2a00 40%,#1322380a),linear-gradient(0deg,#102c2ab0,transparent 70%); pointer-events:none; z-index:0 }
.photo-label { position:absolute; bottom:22px; left:22px; display:flex; align-items:center; gap:11px; color:white; font-size:11px; z-index:1 }
.photo-label strong { display:block; font-size:14px; margin-top:3px }
.photo-icon { display:grid; place-items:center; width:35px; height:35px; border:1px solid #ffffff65; border-radius:50%; font-size:23px }
.query-card { position:absolute; top:20px; left:20px; display:flex; align-items:center; gap:10px; padding:14px; background:#fffffff2; border:1px solid #fff; border-radius:13px; box-shadow:0 12px 32px #13223824; z-index:1; min-width:177px }
.query-card>img { border-radius:11px }
.query-label { font-size:7px; letter-spacing:1px; line-height:1.5; color:var(--muted) }
.query-label strong { display:block; font-size:23px; font-weight:750; line-height:1.1; letter-spacing:-1px; color:var(--ink); margin:2px 0 }
.query-label>span { letter-spacing:0; font-size:10px }
.query-arrow { color:var(--forest); font-size:20px; margin-left:6px }
.calculator { background:white; border:1px solid #d0dfe0; border-radius:24px; padding:26px 30px; box-shadow:0 15px 50px #13223809,0 3px 10px #13223803; position:relative }
.calculator:before { content:""; position:absolute; top:-1px; left:32px; right:32px; height:3px; border-radius:10px; background:linear-gradient(90deg,#1f6b4b,#a8e2ae) }
.card-top { display:flex; align-items:center; justify-content:space-between; gap:10px }
.pill { display:inline-flex; align-items:center; gap:7px; font-size:8px; letter-spacing:1.3px; color:var(--forest); font-weight:700 }
.calculator-icon { background:#edf6f0; color:var(--forest); border-radius:11px; width:34px; height:34px; display:grid; place-items:center; font-size:23px }
.calculator h2 { font-size:37px; letter-spacing:-1.7px; margin:14px 0 8px }
.calculator h2 br { display:none }
.calculator>p { font-size:12px; color:var(--muted); margin:0 0 22px }
.slider-block { border:1px solid #e0e7eb; border-radius:13px; padding:14px 17px; margin:13px 0; background:#fbfcfd }
.slider-label { display:flex; flex-direction:column; gap:3px; color:var(--muted); font-size:11px; margin:0 0 13px }
.slider-label output { font-size:34px; letter-spacing:-1.5px; font-weight:750; color:var(--ink); line-height:1.3 }
input[type=range] { width:100%; height:18px; margin:0; accent-color:var(--forest); cursor:pointer }
.range-extremes { display:flex; justify-content:space-between; color:var(--muted); font-size:9px; margin-top:3px }
.calculator-note { display:flex; align-items:center; gap:10px; padding:5px 0 15px; color:var(--muted); font-size:10px }
.calculator-note>span { width:26px; height:26px; display:grid; place-items:center; color:var(--forest); border:1px solid #c2ddcd; border-radius:50%; background:#f1f8f3; font-size:12px }
.calculator-note p { margin:0; line-height:1.6 }
.calculator-note strong { color:var(--ink); font-weight:600 }
.calculator .button { justify-content:space-between; padding:17px 20px }
.calculator .button>span { font-size:22px; line-height:1 }
.calculator>p.fine { font-size:9px; margin:13px 0 0; line-height:1.7 }
.principles { display:grid; grid-template-columns:repeat(4,1fr); gap:25px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding-top:21px; padding-bottom:21px }
.principles p { display:flex; align-items:center; gap:12px; margin:0 }
.principle-icon { display:grid; place-items:center; color:var(--forest); background:#e7f2ec; width:35px; height:35px; border-radius:10px; flex-shrink:0; font-size:18px }
.principles p>span:last-child { font-size:10px; color:var(--muted); line-height:1.6 }
.principles strong { display:block; font-size:13px; color:var(--ink); font-weight:650 }
.how { display:grid; grid-template-columns:1fr 1.2fr; gap:125px; padding-top:85px; padding-bottom:80px }
.section-heading>.eyebrow { color:var(--forest) }
.section-heading>p:not(.eyebrow) { font-size:14px; color:var(--muted); max-width:310px; line-height:1.8 }
.steps article { display:flex; gap:22px; padding:22px 0; border-bottom:1px solid var(--line) }
.steps article:first-child { padding-top:0 }
.steps article:last-child { border:0 }
.step-number { width:36px; height:36px; display:grid; place-items:center; border:1px solid #c2d9cb; border-radius:11px; background:#eaf4ed; color:var(--forest); font-size:14px; font-weight:650; flex-shrink:0; margin-top:4px }
.steps h3 { margin:5px 0 10px }
.steps p { font-size:13px; color:var(--muted); line-height:1.85; margin:0 }
.decision { display:grid; grid-template-columns:1.1fr 1fr; gap:100px; background:linear-gradient(120deg,#132238,#1c3c40); color:white; padding-top:50px; padding-bottom:50px; border-radius:24px }
.decision>div:first-child { padding-left:12px }
.decision .eyebrow { color:var(--lime) }
.decision h2 { font-size:38px }
.decision p:not(.eyebrow) { font-size:13px; color:#c8d8dc; max-width:430px; line-height:1.85 }
.decision .text-link { display:inline-block; margin-top:12px; color:var(--lime) }
.checklist { align-self:center }
.checklist p { border-bottom:1px solid #ffffff25; padding:11px 0 }
.checklist span { display:inline-grid; place-items:center; background:#ffffff10; border:1px solid #ffffff20; color:var(--lime); width:28px; height:28px; border-radius:50%; margin-right:12px }
.faq { display:grid; grid-template-columns:1fr 1.2fr; gap:100px; padding-top:90px; padding-bottom:80px }
.questions details { border-bottom:1px solid var(--line); font-size:14px }
.questions summary { padding:20px 24px 20px 0; cursor:pointer; font-weight:600 }
.questions details p { font-size:13px; color:var(--muted); padding-bottom:12px; line-height:1.85 }
.app-callout { display:flex; align-items:center; justify-content:space-between; gap:25px; border-top:1px solid var(--line); padding-top:45px; padding-bottom:55px }
.app-logo { width:88px; height:88px; border-radius:24px; flex-shrink:0; box-shadow:0 9px 18px #1322380b }
.app-callout>div { flex:1 }
.app-callout h2 { font-size:30px; margin-bottom:8px }
.app-callout>div>p:not(.eyebrow) { font-size:12px; color:var(--muted) }
.footer { padding:45px 0; background:#132238; color:#f1f6f7 }
.footer-top { display:flex; justify-content:space-between; align-items:center }
.footer-top p { color:#a9bdc7; font-size:13px }
.footer .brand-light { color:#a9bdc7 }
.footer-links { display:flex; flex-wrap:wrap; gap:25px; font-size:11px; margin:32px 0 22px }
.footer .fine { color:#a9bdc7; max-width:820px }
.application { display:grid; grid-template-columns:280px 1fr; gap:80px; min-height:750px; padding-top:45px; padding-bottom:80px }
.form-aside h1 { font-size:46px; letter-spacing:-2px; margin:16px 0 }
.form-aside>.eyebrow { color:var(--forest); margin-top:40px }
.form-aside>p { color:var(--muted); font-size:13px }
#progress { margin:35px 0; padding:0; list-style:none }
#progress li { display:flex; align-items:center; gap:12px; font-size:12px; color:var(--muted); margin:20px 0 }
#progress li span { width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--line); border-radius:9px; font-size:11px; flex-shrink:0 }
#progress li[aria-current=step] { color:var(--ink); font-weight:650 }
#progress li[aria-current=step] span { background:var(--forest); border-color:var(--forest); color:white }
.form-panel { padding:32px; border:1px solid #d4e0e5; border-radius:22px; background:white; box-shadow:0 12px 35px #13223805; min-width:0 }
.form-panel>.eyebrow { color:var(--forest) }
.form-panel h2 { font-size:31px; letter-spacing:-1px; margin-bottom:10px }
.form-panel>p { font-size:13px }
.fields { display:grid; grid-template-columns:1fr 1fr; gap:20px 18px; margin-top:28px }
.field { display:flex; flex-direction:column; min-width:0 }
.field.wide { grid-column:1/-1 }
.field label { margin-bottom:7px; font-size:12px; font-weight:600 }
.field input,.field select { width:100%; min-height:47px; border:1px solid #b8c8d3; border-radius:9px; padding:11px; background:white; color:var(--ink); font-size:15px }
.field input[aria-invalid=true],.field select[aria-invalid=true] { border:1.5px solid var(--error) }
.field .error { font-size:11px; color:var(--error); margin-top:5px }
.field.loan-range { margin:0; padding:18px 20px }
.loan-range .range-value { font-size:34px; font-weight:750; letter-spacing:-1.5px; line-height:1.3; margin-bottom:12px }
.field.loan-range input[type=range] { min-height:44px; height:44px; padding:0; border:0; border-radius:0; background:transparent }
.loan-range .range-extremes { font-size:11px; margin-top:0 }
.consent { grid-column:1/-1; display:grid; grid-template-columns:22px 1fr; gap:12px; align-items:start; margin:10px 0; font-size:13px }
.consent input { width:19px; height:19px; accent-color:var(--forest); margin-top:3px }
.consent .error { grid-column:2; color:var(--error); font-size:11px }
.form-buttons { display:flex; justify-content:space-between; gap:15px; margin-top:30px }
.form-buttons .button { font-size:13px }
.form-buttons .button:last-child { margin-left:auto }
.notice { padding:14px; margin:20px 0; border-left:3px solid #5f9e7c; background:#edf6f0; font-size:13px; line-height:1.75 }
.notice.error-notice { background:#fff0eb; border-color:var(--error) }
.notice button { margin-top:14px }
.review-section { padding:10px 0; border-bottom:1px solid var(--line) }
.review-section h3 { display:flex; justify-content:space-between; font-size:15px }
.review-section button { border:0; background:none; color:var(--forest); text-decoration:underline; cursor:pointer; font-size:12px }
.review-row { display:flex; justify-content:space-between; gap:20px; padding:5px 0; font-size:12px }
.review-row span:first-child { color:var(--muted) }
.review-row span:last-child { text-align:right; overflow-wrap:anywhere; max-width:60% }
.demo-fill { display:block; border:0; background:none; text-decoration:underline; font-size:11px; color:var(--muted); margin:25px auto 0; cursor:pointer }
.information { max-width:850px; padding-top:55px; padding-bottom:90px; min-height:500px }
.information h1 { font-size:44px; letter-spacing:-2px }
.information h2 { font-size:23px; letter-spacing:-.6px; margin-top:32px }
.information p,.information li { font-size:15px; line-height:1.85 }
.result-box { padding:25px; border:1px solid #d4e5d8; background:#edf6f0; border-radius:16px; margin-top:25px }
.result-box h3 { margin-top:0 }
.result-box .button { margin-top:18px }
.legal-note { padding:16px; border:1px solid #d5b780; background:#fff8e7; font-size:13px!important }
.legal-header { border-bottom:1px solid var(--line) }
.legal-summary { border:1px solid #d4e0e5; border-radius:18px; padding:18px 24px; background:#edf6f0; margin:24px 0 }
.legal-summary p { margin:12px 0 }
.legal-summary .button { margin:8px 0; white-space:normal }
.legal-id { overflow-wrap:anywhere }
.legal-links { display:flex; flex-wrap:wrap; gap:10px 22px; padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:13px }
@media(min-width:1500px) { .hero { gap:90px; padding-top:50px; padding-bottom:50px } }
@media(max-width:1100px) {
  .wrap { padding-left:30px; padding-right:30px }
  .header { gap:20px }.header nav { gap:17px; font-size:11px }
  .brand { font-size:17px }.brand-logo { width:47px; height:47px }
  .hero { gap:35px }h1 { font-size:56px; letter-spacing:-3px }
  .hero-visual { height:205px }.query-card { left:14px; top:14px; padding:10px }
  .how,.faq { gap:60px }.decision { margin-left:20px; margin-right:20px; gap:55px }
  .application { grid-template-columns:230px 1fr; gap:40px }
  .principles { gap:13px }.principles strong { font-size:12px }
}
@media(max-width:800px) {
  .wrap { padding-left:24px; padding-right:24px }
  .header nav { display:none }.header { min-height:88px }
  .hero { grid-template-columns:1fr; gap:25px; padding-top:30px }
  h1 { font-size:44px; letter-spacing:-2.4px }.hero-tag { font-size:7px; letter-spacing:.75px; padding:6px 8px }
  .intro { font-size:13px }.hero-links { flex-wrap:wrap; gap:9px; margin-top:17px }
  .hero-visual { height:240px }.query-card { min-width:135px; gap:6px }.query-card>img { width:30px; height:30px }.query-label strong { font-size:20px }.query-arrow { display:none }
  .photo-label { left:14px; bottom:14px; font-size:9px; gap:7px }.photo-label strong { font-size:11px }.photo-icon { width:27px; height:27px; font-size:19px }
  .calculator { padding:20px }.calculator h2 { font-size:30px }.pill { font-size:7px; letter-spacing:.8px }
  .principles { grid-template-columns:1fr 1fr; gap:22px }.principle-icon { width:31px; height:31px }
  .how,.faq { grid-template-columns:1fr; gap:25px; padding-top:60px; padding-bottom:55px }
  .section-heading>p:not(.eyebrow) { max-width:520px }
  .app-callout { gap:18px }.app-callout h2 { font-size:26px }.app-logo { width:64px; height:64px; border-radius:18px }.app-callout>.button { max-width:190px; font-size:12px }
  .application { grid-template-columns:190px 1fr; gap:25px }.form-panel { padding:25px }
}
@media(max-width:620px) {
  .wrap { padding-left:22px; padding-right:22px }
  .preview { font-size:10px; padding:7px 15px }
  .header { min-height:90px; gap:10px }.brand { font-size:15px; gap:9px; letter-spacing:-.45px }.brand-logo { width:44px; height:44px; border-radius:13px }.brand-light { font-size:9px; letter-spacing:0; margin-top:4px }
  .header>.button { font-size:10px; padding:10px 11px; gap:8px }.header>.button>span { display:none }
  .hero { grid-template-columns:1fr; gap:27px; padding-top:28px; padding-bottom:30px }
  .hero-tag { font-size:8px; letter-spacing:1px; padding:7px 10px }
  h1 { font-size:clamp(40px,10.8vw,62px); letter-spacing:-2.4px; line-height:1.1; margin:20px 0 16px }
  .intro { font-size:14px; max-width:440px; line-height:1.8 }.hero-links { gap:20px; margin-top:18px }.text-link { font-size:12px }
  .hero-visual { height:190px; margin-top:22px; border-radius:18px }.hero-photo { object-position:center 12% }
  .query-card { min-width:145px; padding:10px; left:14px; top:14px }.query-card>img { width:34px; height:34px }.query-label strong { font-size:22px }
  .photo-label { left:16px; bottom:15px }.photo-label strong { font-size:12px }
  .calculator { padding:24px; border-radius:21px }.calculator h2 { font-size:34px; margin:17px 0 8px }.calculator>p { font-size:12px }
  .pill { font-size:8px; letter-spacing:1px }.slider-label output { font-size:34px }.slider-block { padding:16px 18px }.range-extremes { font-size:10px }
  .calculator-note { font-size:11px; padding:6px 0 16px }.calculator>p.fine { font-size:10px }
  .principles { gap:20px 14px; padding-top:22px; padding-bottom:22px }.principles p { gap:8px }.principles p>span:last-child { font-size:9px }.principles strong { font-size:11px }
  h2 { font-size:34px }.steps h3 { font-size:18px }.steps article { gap:16px }
  .decision { grid-template-columns:1fr; gap:20px; padding:32px 24px; margin-left:12px; margin-right:12px; border-radius:21px }.decision>div:first-child { padding-left:0 }.decision h2 { font-size:32px }.checklist p { margin:0 }
  .app-callout { display:grid; grid-template-columns:64px 1fr; padding-top:35px; padding-bottom:40px; gap:15px }.app-callout h2 { font-size:25px }.app-callout>.button { grid-column:1/-1; max-width:none; justify-self:start; font-size:12px }.app-callout .eyebrow { font-size:8px; letter-spacing:1px }
  .footer { padding:30px 0 }.footer-top { align-items:flex-start; gap:12px }.footer-top>p { font-size:10px; margin:0 }.footer .brand { font-size:14px }.footer .brand-logo { width:38px; height:38px }.footer .brand-light { font-size:8px }.footer-links { gap:15px; font-size:10px }.footer .fine { font-size:10px }
  .application { grid-template-columns:1fr; gap:10px; min-height:0; align-content:start; align-items:start; padding-top:18px; padding-bottom:40px }
  .form-aside h1,.form-aside>.eyebrow,.form-aside>p { display:none }
  #progress { display:flex; flex-wrap:wrap; gap:9px; margin:20px 0 }#progress li { font-size:0; margin:0; gap:0 }#progress li[aria-current=step] { font-size:10px; gap:8px }#progress li span { width:26px; height:26px }
  .form-panel { padding:22px 18px; border-radius:18px }.form-panel h2 { font-size:28px }.fields { gap:18px 12px }.field label { font-size:11px }.field input,.field select { font-size:16px }.field.wide-mobile { grid-column:1/-1 }
  .form-buttons .button { padding:14px 15px }.review-row { font-size:11px }
  .information { padding-top:28px; padding-bottom:50px }.information h1 { font-size:35px }
}
@media(max-width:360px) {
  .header { flex-wrap:wrap; justify-content:space-between; padding-top:13px; padding-bottom:13px; gap:12px }
  .header>.button { font-size:9px }.brand { font-size:13px }.brand-logo { width:37px; height:37px }.brand-light { font-size:8px }
  .hero-tag { font-size:7px }.hero-links { gap:10px }.query-card { left:10px; top:10px; min-width:133px }
  .footer-top { flex-direction:column }
  #progress li[aria-current=step] { font-size:0; gap:0 }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto } * { transition:none!important } }
