@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
:root{--navy:#0B1F33;--deep:#071827;--blue:#123B52;--mint:#35BFA3;--mint-soft:#E7F7F3;--bg:#F7FAF9;--text:#102A43;--muted:#607487;--line:#DCE7E5;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);font-family:"DM Sans",Arial,sans-serif;line-height:1.55}a{text-decoration:none;color:inherit}.container{width:min(1160px,calc(100% - 40px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;font:800 22px/1 "Manrope";letter-spacing:-.7px}.brand>span:last-child>span{color:var(--mint)}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:linear-gradient(145deg,var(--navy),var(--blue));color:white}.nav-links{display:flex;align-items:center;gap:24px;font-size:13px;font-weight:700;color:#465B6D}.nav-links a:hover{color:var(--mint)}.nav-button{background:var(--navy);color:white!important;padding:12px 18px;border-radius:9px}.menu-toggle{display:none;border:0;background:none;font-size:24px;color:var(--navy)}
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#F8FBFA,#EEF8F5 60%,#F7FAF9);padding:82px 0 88px}.hero-glow{position:absolute;width:600px;height:600px;border-radius:50%;right:-210px;top:-250px;background:rgba(53,191,163,.14)}.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .75fr;gap:80px;align-items:center}.eyebrow{font-size:11px;letter-spacing:1.4px;font-weight:800;color:var(--blue)}.eyebrow i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--mint);margin-right:7px}.hero h1{font:800 clamp(43px,5vw,66px)/1.04 "Manrope";letter-spacing:-3px;margin:18px 0}.hero h1 em{font-style:normal;color:var(--blue)}.hero-lead{max-width:620px;color:var(--muted);font-size:17px}.hero-actions{display:flex;gap:11px;margin:28px 0}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 20px;border-radius:10px;font-size:14px;font-weight:800}.button.primary{background:var(--navy);color:white}.button.primary:hover{background:var(--blue)}.button.secondary{background:white;border:1px solid var(--line)}.button.mint-button{background:var(--mint);color:#07382F}.full{width:100%}.trust-points{display:flex;flex-wrap:wrap;gap:10px 18px;color:#53687A;font-size:11px;font-weight:700}.hero-card{background:white;border:1px solid var(--line);border-radius:22px;padding:30px;box-shadow:0 22px 60px rgba(11,31,51,.12)}.mini-label{color:var(--mint);font-size:10px;letter-spacing:1.5px;font-weight:800}.hero-card h2{font:800 25px/1.15 "Manrope";margin:12px 0 6px}.hero-card>p{color:var(--muted);font-size:13px;margin:0 0 20px}.amount-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:13px}.amount-grid button{height:52px;border:1px solid var(--line);background:white;border-radius:9px;font-weight:800;color:var(--text);cursor:pointer}.amount-grid button:hover,.amount-grid button.selected{border-color:var(--mint);background:var(--mint-soft);color:#0C4A40}.amount-grid .wide{grid-column:1/-1}.card-note{font-size:10px!important;text-align:center;margin-top:12px!important;color:#8796A1!important}
.quick-facts{border-bottom:1px solid var(--line)}.facts{display:grid;grid-template-columns:repeat(4,1fr)}.facts div{text-align:center;padding:22px 10px;border-right:1px solid var(--line)}.facts div:first-child{border-left:1px solid var(--line)}.facts strong,.facts span{display:block}.facts strong{font:700 14px "Manrope"}.facts span{font-size:11px;color:var(--muted)}
.section{padding:100px 0}.soft{background:var(--bg)}.section-intro{max-width:680px;margin-bottom:45px}.section-intro.centered{text-align:center;margin-left:auto;margin-right:auto}.section-intro h2,.two-col h2{font:800 clamp(34px,4vw,48px)/1.08 "Manrope";letter-spacing:-1.8px;margin:10px 0 12px}.section-intro p,.muted{color:var(--muted);font-size:15px;margin:0}.cards{display:grid;gap:15px}.cards.six{grid-template-columns:repeat(3,1fr)}.cards article{background:white;border:1px solid var(--line);border-radius:17px;padding:26px}.card-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--mint-soft);color:#0C4A40;font-weight:800}.cards h3{font:700 17px "Manrope";margin:17px 0 7px}.cards p{font-size:13px;color:var(--muted);margin:0}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.step{background:white;border:1px solid var(--line);border-radius:17px;padding:27px}.step>span{color:var(--mint);font:800 12px "Manrope"}.step h3{font:700 17px "Manrope";margin:26px 0 7px}.step p{font-size:13px;color:var(--muted);margin:0}.center-button{text-align:center;margin-top:30px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.check-list{list-style:none;padding:0;margin:24px 0 0}.check-list li{padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}.check-list li:before{content:"✓";color:var(--mint);font-weight:900;margin-right:10px}.notice-card{border:1px solid var(--line);background:var(--bg);border-radius:20px;padding:31px}.notice-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--mint-soft);color:#0C4A40;font-weight:800}.notice-card h3{font:700 20px "Manrope";margin:18px 0 8px}.notice-card p{color:var(--muted);font-size:13px}.notice-card a,.text-link{color:#0C4A40;font-weight:800;font-size:13px}
.why{background:#F1F7F5}.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.benefit-grid div{background:white;border:1px solid var(--line);padding:26px;border-radius:16px}.benefit-grid span{color:var(--mint);font:800 12px "Manrope"}.benefit-grid h3{font:700 17px "Manrope";margin:20px 0 7px}.benefit-grid p{color:var(--muted);font-size:13px;margin:0}
.cta{padding:0 0 100px;background:#F1F7F5}.cta-inner{background:linear-gradient(120deg,var(--navy),var(--blue));border-radius:23px;padding:52px;display:flex;align-items:center;justify-content:space-between;gap:30px;color:white}.eyebrow.mint{color:var(--mint)}.cta h2{font:800 37px "Manrope";margin:9px 0 7px;letter-spacing:-1.3px}.cta p{color:#C0D0D9;margin:0}.faq-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:90px}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:18px 0;font:700 14px "Manrope"}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary b{color:var(--mint);font-size:20px}.faq-list details p{color:var(--muted);font-size:13px;margin:-2px 25px 19px 0}.legal-strip{background:#F4F7F8;border-top:1px solid var(--line);padding:30px 0}.legal-strip h3{font:700 14px "Manrope";margin:0 0 6px}.legal-strip p{font-size:11px;line-height:1.6;color:#667989;margin:0}
.footer{background:var(--deep);color:white;padding:65px 0 25px}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:45px;padding-bottom:45px}.brand.light>span:last-child>span{color:var(--mint)}.footer-brand p{max-width:350px;color:#91A5B6;font-size:12px}.footer h4{font:700 13px "Manrope";margin:0 0 11px}.footer-grid>div:not(.footer-brand){display:flex;flex-direction:column;gap:9px}.footer-grid a:not(.brand){font-size:12px;color:#91A5B6}.footer-grid a:hover{color:white}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:20px;color:#71889B;font-size:10px}.footer-bottom p{margin:7px 0}
@media(max-width:900px){.nav-links{gap:12px}.hero-grid{gap:35px}.steps{grid-template-columns:1fr 1fr}.benefit-grid{grid-template-columns:1fr 1fr}.faq-layout{gap:45px}}
@media(max-width:760px){.container{width:calc(100% - 30px)}.menu-toggle{display:block}.nav-links{display:none;position:absolute;top:76px;left:15px;right:15px;background:white;border:1px solid var(--line);border-radius:14px;padding:10px;flex-direction:column;align-items:stretch;box-shadow:0 15px 40px rgba(11,31,51,.12)}.nav-links.open{display:flex}.nav-links a{padding:11px}.nav-button{text-align:center}.hero{padding:60px 0}.hero-grid,.two-col,.faq-layout{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-lead{margin-left:auto;margin-right:auto}.hero-actions,.trust-points{justify-content:center}.facts{grid-template-columns:1fr 1fr}.facts div:nth-child(n+3){border-top:1px solid var(--line)}.cards.six{grid-template-columns:1fr 1fr}.cta-inner{padding:38px 28px;align-items:flex-start;flex-direction:column}}
@media(max-width:520px){.hero h1{font-size:41px}.hero-actions{flex-direction:column}.hero-actions .button{width:100%}.cards.six,.steps,.benefit-grid{grid-template-columns:1fr}.section{padding:72px 0}.section-intro h2,.two-col h2{font-size:34px}.cta{padding-bottom:72px}.cta h2{font-size:30px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.amount-grid button{height:50px}}

/* LUMOLOANS V3 - visible motion */
@keyframes lumoFadeUp {
  0% { opacity:0; transform:translateY(35px); }
  100% { opacity:1; transform:translateY(0); }
}
@keyframes lumoHeroCard {
  0% { opacity:0; transform:translateY(45px) scale(.96); }
  100% { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes lumoFloat {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-10px); }
}
@keyframes lumoGlow {
  0%,100% { transform:scale(1); opacity:.35; }
  50% { transform:scale(1.15); opacity:.65; }
}
@keyframes lumoShine {
  0% { left:-120%; }
  100% { left:140%; }
}

/* Initial page entrance */
.site-header { animation:lumoFadeUp .55s ease-out both !important; }
.hero-copy { animation:lumoFadeUp .8s .08s ease-out both !important; }
.hero-card { animation:lumoHeroCard .85s .22s cubic-bezier(.2,.8,.2,1) both !important; }
.hero-glow { animation:lumoGlow 5s ease-in-out infinite !important; }

/* Make the card visibly float after its entrance */
.hero-card:hover { transform:translateY(-8px) !important; transition:transform .25s ease, box-shadow .25s ease !important; box-shadow:0 22px 45px rgba(11,31,51,.16) !important; }

/* Cards and sections */
.cards article, .steps .step, .benefit-grid > div, .notice-card, .quick-facts .facts > div {
  animation:lumoFadeUp .65s ease-out both !important;
}
.cards article:nth-child(1), .steps .step:nth-child(1) { animation-delay:.10s !important; }
.cards article:nth-child(2), .steps .step:nth-child(2) { animation-delay:.18s !important; }
.cards article:nth-child(3), .steps .step:nth-child(3) { animation-delay:.26s !important; }
.cards article:nth-child(4), .steps .step:nth-child(4) { animation-delay:.34s !important; }
.cards article:nth-child(5), .steps .step:nth-child(5) { animation-delay:.42s !important; }
.cards article:nth-child(6), .steps .step:nth-child(6) { animation-delay:.50s !important; }

.cards article, .steps .step, .benefit-grid > div {
  transition:transform .25s ease, box-shadow .25s ease !important;
}
.cards article:hover, .steps .step:hover, .benefit-grid > div:hover {
  transform:translateY(-9px) !important;
  box-shadow:0 18px 38px rgba(11,31,51,.12) !important;
}

/* Buttons get a clearly visible shine on hover */
.button, .nav-button {
  position:relative;
  overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease !important;
}
.button:hover, .nav-button:hover {
  transform:translateY(-3px) !important;
  box-shadow:0 10px 24px rgba(11,31,51,.15) !important;
}
.button::after, .nav-button::after {
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:55%;
  height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);
  transform:skewX(-18deg);
  pointer-events:none;
}
.button:hover::after, .nav-button:hover::after {
  animation:lumoShine .7s ease-out both !important;
}

/* Amount selection */
.amount-grid button { transition:transform .2s ease, box-shadow .2s ease !important; }
.amount-grid button:hover { transform:translateY(-3px) !important; box-shadow:0 8px 18px rgba(11,31,51,.10) !important; }
.amount-grid button.selected { animation:lumoFadeUp .25s ease-out both !important; }

/* Respect accessibility preference */
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; }
}
