
:root{
  --navy:#0E2A54; --navy-2:#14355F; --teal:#17A6AC; --teal-d:#0E7C81; --teal-l:#7FD4D8;
  --ink:#14283F; --muted:#5B6B7C; --tint:#EEF3F7; --line:#DCE4EC;
  --amber-bg:#FDF6EC; --amber-line:#F0DCC0; --amber-ink:#8C5108;
  --green-bg:#EDF7F2; --green-line:#C6E3D5; --green-ink:#155F41;
  --white:#FFFFFF;
  --shadow:0 18px 44px rgba(14,42,84,.07); --shadow-sm:0 6px 18px rgba(14,42,84,.05);
  --wrap:1120px; --r:14px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;line-height:1.6;font-size:17px;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--teal-d);text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);}
.hdr .wrap{display:flex;align-items:center;gap:26px;height:74px;}
.hdr .logo img{height:34px;width:auto;}
.nav{margin-left:auto;display:flex;align-items:center;gap:26px;}
.nav a{color:var(--ink);font-size:15px;font-weight:600;text-decoration:none;white-space:nowrap;}
.nav a:hover{color:var(--teal-d);}
.nav a.on{color:var(--teal-d);}
.drop{position:relative;}
.drop>span{color:var(--ink);font-size:15px;font-weight:600;cursor:default;display:inline-flex;align-items:center;gap:5px;}
.drop>span:after{content:"";width:6px;height:6px;border-right:2px solid var(--muted);
  border-bottom:2px solid var(--muted);transform:rotate(45deg) translateY(-2px);}
.drop menu{position:absolute;top:100%;left:-16px;padding:8px;margin:0;background:#fff;border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--shadow);min-width:240px;display:none;list-style:none;}
.drop:hover menu,.drop:focus-within menu{display:block;}
.drop menu a{display:block;padding:9px 12px;border-radius:8px;font-weight:600;}
.drop menu a:hover{background:var(--tint);text-decoration:none;}
.btn{display:inline-block;padding:12px 22px;border-radius:10px;font-weight:700;font-size:15px;
  text-decoration:none;border:1.5px solid transparent;transition:.15s;cursor:pointer;text-align:center;}
.btn:hover{text-decoration:none;transform:translateY(-1px);}
.btn-p{background:var(--teal);color:#fff;}
.btn-p:hover{background:var(--teal-d);color:#fff;}
.btn-n{background:var(--navy);color:#fff;}
.btn-n:hover{background:#0a1f3e;color:#fff;}
.btn-o{background:transparent;color:var(--navy);border-color:var(--line);}
.btn-o:hover{border-color:var(--navy);color:var(--navy);}
.btn-w{background:#fff;color:var(--navy);}
.btn-w:hover{background:#f1f6f9;color:var(--navy);}
.btn-gw{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);}
.btn-gw:hover{background:rgba(255,255,255,.12);color:#fff;}
.mtoggle{display:none;}
.mbtn{display:none;margin-left:auto;background:none;border:0;padding:8px;cursor:pointer;}
.mbtn span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;}

/* ---------- hero ---------- */
.hero{background:var(--navy);background-image:url('assets/finlume-hero-gradient.jpg');
  background-size:cover;background-position:center;color:#fff;padding:92px 0 96px;
  position:relative;overflow:hidden;}
.hero>.wrap{position:relative;z-index:2;}
.hero::before,.hero::after{content:'';position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;z-index:1;pointer-events:none;}
.hero::before{width:640px;height:640px;background:radial-gradient(circle,rgba(79,195,206,.55),transparent 65%);top:-220px;right:-140px;animation:auroraA 16s ease-in-out infinite alternate;}
.hero::after{width:520px;height:520px;background:radial-gradient(circle,rgba(27,95,168,.6),transparent 65%);bottom:-220px;left:-120px;animation:auroraB 20s ease-in-out infinite alternate;}
@keyframes auroraA{from{transform:translate(0,0) scale(1);}to{transform:translate(-90px,60px) scale(1.15);}}
@keyframes auroraB{from{transform:translate(0,0) scale(1.1);}to{transform:translate(80px,-50px) scale(1);}}
@media(prefers-reduced-motion:reduce){.hero::before,.hero::after{animation:none;}}
.hero.sm{padding:74px 0 76px;}
.badge{display:inline-block;padding:7px 15px;border-radius:999px;background:rgba(127,212,216,.16);
  border:1px solid rgba(127,212,216,.4);color:var(--teal-l);font-size:13px;font-weight:700;
  letter-spacing:.4px;margin-bottom:22px;}
.hero h1{font-size:clamp(34px,5vw,54px);line-height:1.1;font-weight:800;letter-spacing:-1.2px;max-width:16ch;}
.hero.wide h1{max-width:22ch;}
.hero p.sub{margin-top:20px;font-size:clamp(17px,2vw,20px);color:#BBD4E2;max-width:60ch;line-height:1.55;}
.hero .acts{margin-top:34px;display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- sections ---------- */
section{padding:78px 0;}
section.tint{background:var(--tint);}
section.navy{background:var(--navy);background-image:url('assets/finlume-band-gradient.jpg');
  background-size:cover;background-position:center;color:#fff;}
.eyebrow{font-size:12.5px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--teal-d);margin-bottom:12px;}
section.navy .eyebrow{color:var(--teal-l);}
h2{font-size:clamp(26px,3.4vw,36px);line-height:1.18;font-weight:800;letter-spacing:-.8px;max-width:22ch;}
h2.wide{max-width:34ch;}
h3{font-size:20px;font-weight:800;letter-spacing:-.3px;line-height:1.3;}
.lead{margin-top:16px;font-size:18px;color:var(--muted);max-width:66ch;}
section.navy .lead{color:#BBD4E2;}
.mt{margin-top:44px;}
.mt-s{margin-top:26px;}

/* ---------- grids and cards ---------- */
.g2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;}
.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;}
.g4{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--shadow-sm);}
section.tint .card{background:#fff;}
.card.flat{box-shadow:none;background:var(--tint);border-color:transparent;}
.card.hi{border:2px solid var(--teal);box-shadow:var(--shadow);}
.card.amber{background:var(--amber-bg);border-color:var(--amber-line);}
.card.green{background:var(--green-bg);border-color:var(--green-line);}
.card ico{display:block;width:54px;height:54px;margin-bottom:18px;}
.card ico img{width:54px;height:54px;}
.card h3{margin-bottom:9px;}
.card p{color:var(--muted);font-size:15.5px;}
.card p+p{margin-top:10px;}
.card ul{margin-top:12px;padding-left:18px;color:var(--muted);font-size:15.5px;}
.card li{margin-bottom:7px;}
a.card{display:block;color:inherit;text-decoration:none;transition:.16s;}
a.card:hover{text-decoration:none;transform:translateY(-3px);box-shadow:var(--shadow);border-color:#C3D3DE;}
.arrow{margin-top:16px;color:var(--teal-d);font-weight:700;font-size:15px;}

/* ---------- stats ---------- */
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;}
.stat b{display:block;font-size:clamp(32px,4vw,44px);font-weight:800;color:var(--navy);letter-spacing:-1.4px;line-height:1;}
.stat p{margin-top:14px;color:var(--muted);font-size:15.5px;}
.stat cite{display:block;margin-top:12px;font-style:normal;font-size:12.5px;color:#93A3B2;}

/* ---------- steps ---------- */
.step{display:flex;gap:18px;padding:22px 0;border-top:1px solid var(--line);}
.step:first-child{border-top:0;padding-top:0;}
.num{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--teal);color:#fff;
  font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;}
.step h3{font-size:18px;margin-bottom:5px;}
.step p{color:var(--muted);font-size:15.5px;}

/* ---------- table ---------- */
.tbl{width:100%;border-collapse:collapse;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:#fff;font-size:15px;}
.tbl th{background:var(--navy);color:#fff;text-align:left;padding:15px 18px;font-weight:700;font-size:14.5px;}
.tbl td{padding:15px 18px;border-top:1px solid var(--line);color:var(--muted);vertical-align:top;}
.tbl td:first-child{color:var(--ink);font-weight:700;}
.tbl tr:nth-child(even) td{background:#F8FBFC;}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}

/* ---------- callout ---------- */
.note{border-radius:var(--r);padding:24px 26px;font-size:16px;line-height:1.62;}
.note b{font-weight:800;}
.note.amber{background:var(--amber-bg);border:1px solid var(--amber-line);color:#6B4A22;}
.note.amber b{color:var(--amber-ink);}
.note.green{background:var(--green-bg);border:1px solid var(--green-line);color:#2A5A46;}
.note.green b{color:var(--green-ink);}
.note.plain{background:var(--tint);border:1px solid var(--line);color:var(--ink);}
.note ul{margin:10px 0 0 18px;}
.note li{margin-bottom:7px;}

/* ---------- quote ---------- */
.quote{font-size:clamp(19px,2.4vw,25px);line-height:1.5;font-weight:600;letter-spacing:-.4px;color:#fff;max-width:52ch;}
.quote+.by{margin-top:22px;color:var(--teal-l);font-weight:700;font-size:15px;}

/* ---------- forms ---------- */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:32px;box-shadow:var(--shadow-sm);}
.form.on-navy{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);box-shadow:none;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:14px;font-weight:700;margin-bottom:7px;color:var(--ink);}
.form.on-navy .field label{color:#fff;}
.field input[type=text],.field input[type=email],.field input[type=tel],.field select,.field textarea{
  width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;font:inherit;font-size:15.5px;
  color:var(--ink);background:#fff;}
.field textarea{min-height:104px;resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--teal);
  box-shadow:0 0 0 3px rgba(23,166,172,.14);}
.row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;}
.checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;margin-top:4px;}
.chk{display:flex;gap:9px;align-items:flex-start;font-size:14.5px;color:var(--muted);font-weight:500;}
.form.on-navy .chk{color:#CFE2EC;}
.chk input{margin-top:3px;flex:0 0 auto;width:16px;height:16px;accent-color:var(--teal);}
.hp{position:absolute;left:-9999px;}
.smallprint{margin-top:14px;font-size:13px;color:#93A3B2;line-height:1.55;}
.form.on-navy .smallprint{color:#9FBCCD;}

/* ---------- device screenshot ---------- */
.split{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center;}
.split.rev>div:first-child{order:2;}
.device{display:block;width:100%;height:auto;max-width:322px;margin:0 auto;border-radius:26px;
  filter:drop-shadow(0 34px 64px rgba(4,16,34,.42));}
section.tint .device,section:not(.navy) .device{filter:drop-shadow(0 24px 48px rgba(14,42,84,.20));}
.shotcard{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;
  box-shadow:var(--shadow);}

/* ---------- prototype embed ---------- */
.embed{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#F7FAFC;box-shadow:var(--shadow-sm);}
.embed iframe{display:block;width:100%;height:940px;border:0;background:#F7FAFC;}
.fallback{border:1px solid var(--amber-line);background:var(--amber-bg);border-radius:var(--r);
  padding:40px 32px;text-align:center;}
.fallback h3{color:var(--amber-ink);margin-bottom:10px;}
.fallback p{color:#6B4A22;font-size:15.5px;max-width:60ch;margin:0 auto 20px;}
.mobonly{display:none;}

/* ---------- footer ---------- */
footer{background:var(--navy);color:#B6CCDC;padding:64px 0 30px;font-size:15px;}
footer .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px;}
footer h4{color:#fff;font-size:13px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:16px;}
footer a{color:#B6CCDC;display:block;margin-bottom:10px;text-decoration:none;font-size:15px;}
footer a:hover{color:#fff;text-decoration:none;}
footer .logo img{height:32px;margin-bottom:16px;}
footer .blurb{font-size:14.5px;line-height:1.6;max-width:34ch;color:#9FBCCD;}
.legalbar{margin-top:46px;padding-top:24px;border-top:1px solid rgba(255,255,255,.13);
  font-size:13px;line-height:1.65;color:#8FAEC2;max-width:96ch;}
.legalbar strong{color:#BBD4E2;font-weight:700;}
.copy{margin-top:18px;font-size:13px;color:#7C9AB0;}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .nav{position:fixed;inset:74px 0 auto 0;background:#fff;flex-direction:column;align-items:stretch;
    gap:0;padding:10px 18px 22px;border-bottom:1px solid var(--line);box-shadow:var(--shadow);display:none;}
  .mtoggle:checked ~ .nav{display:flex;}
  .nav a,.drop>span{padding:13px 4px;border-bottom:1px solid var(--line);}
  .nav .btn{margin-top:14px;}
  .drop menu{position:static;display:block;border:0;box-shadow:none;padding:0 0 0 14px;min-width:0;}
  .drop>span:after{display:none;}
  .mbtn{display:block;}
  footer .cols{grid-template-columns:1fr 1fr;}
  .split{grid-template-columns:1fr;gap:34px;}
  .split.rev>div:first-child{order:0;}
  .device{max-width:262px;}
  .embed{display:none;}
  .mobonly{display:block;}
  section{padding:58px 0;}
  .hero{padding:64px 0 68px;}
}
@media(max-width:520px){
  footer .cols{grid-template-columns:1fr;}
  .hero .acts .btn{width:100%;}
}

/* live prototype embed */
.livephone{width:340px;height:700px;max-width:100%;background:#0F1A22;border-radius:40px;padding:10px;
  box-shadow:0 34px 80px rgba(15,26,34,.35),0 0 0 1px rgba(255,255,255,.08);margin:0 auto;}
.livephone iframe{width:100%;height:100%;border:0;border-radius:31px;background:#F7FAFC;}
@media(max-width:700px){.livephone{height:600px;}}

/* wide infographics are desktop furniture; below tablet width their labels would be illegible */
@media(max-width:640px){.wideinfo{display:none;}}

/* slow light drift behind the video scenes */
.fvid::before{content:;position:absolute;inset:-30%;z-index:0;pointer-events:none;
  background:radial-gradient(circle at 30% 30%,rgba(79,195,206,.18),transparent 45%),
             radial-gradient(circle at 70% 65%,rgba(27,95,168,.22),transparent 45%);
  animation:fvdrift 22s ease-in-out infinite alternate;}
@keyframes fvdrift{from{transform:translate(0,0) rotate(0deg);}to{transform:translate(4%,3%) rotate(4deg);}}
.fvstage,.fvcap,.fvbar,.fvctl{z-index:1;}
@media(prefers-reduced-motion:reduce){.fvid::before{animation:none;}}

/* three live stages, side by side */
.trio{display:flex;gap:26px;justify-content:center;align-items:flex-end;flex-wrap:wrap;margin-top:34px;}
.triophone{text-align:center;}
.triolabel{color:rgba(255,255,255,.85);font-size:13.5px;font-weight:700;margin-bottom:12px;letter-spacing:.02em;}
.triophone.lead .triolabel{color:#4FC3CE;}
.livephone.sm{width:280px;height:576px;border-radius:34px;padding:8px;}
.livephone.sm iframe{border-radius:27px;}
.triophone.lead .livephone{width:320px;height:660px;}
@media(max-width:1023px){.triophone:not(.lead){display:none;}.trio{margin-top:26px;}}


/* stage colours — mirrors the app's colour-coded journey */
.card.stg{border-top:4px solid var(--sc);border-top-left-radius:0;border-top-right-radius:0}
.card.stg ico{background:var(--sb);border-radius:14px;padding:9px;width:54px;height:54px;box-sizing:content-box}
.card.stg h3{color:var(--st)}
.card.st-ff{--sc:#1D9E75;--st:#0F6E56;--sb:#E1F5EE}
.card.st-risk{--sc:#7F77DD;--st:#534AB7;--sb:#EEEDFE}
.card.st-tax{--sc:#EF9F27;--st:#854F0B;--sb:#FAEEDA}
.card.st-cash{--sc:#639922;--st:#3B6D11;--sb:#EAF3DE}

/* photo-backed cards: real people behind a navy fade, text stays fully readable */
.card.photocard{position:relative;color:#fff;border:0;background:#0C2142;background-size:cover;background-position:center 30%}
.card.photocard.p1{background-image:linear-gradient(180deg,rgba(12,33,66,.62) 0%,rgba(12,33,66,.88) 68%,rgba(12,33,66,.95) 100%),url(/assets/people-1.jpg)}
.card.photocard.p2{background-image:linear-gradient(180deg,rgba(12,33,66,.62) 0%,rgba(12,33,66,.88) 68%,rgba(12,33,66,.95) 100%),url(/assets/people-2.jpg)}
.card.photocard h3{color:#fff}
.card.photocard p{color:rgba(255,255,255,.88)}
.card.photocard .arrow a{color:#7FD8E2}
.card.photocard ico{background:rgba(255,255,255,.14);border-radius:14px;padding:9px;width:54px;height:54px;box-sizing:content-box;backdrop-filter:blur(2px)}

/* the waitlist close sits over a faded photo of the people this is for */
section.navy.photobg{background-image:linear-gradient(rgba(9,26,53,.90),rgba(9,26,53,.95)),url(/assets/people-3.jpg);background-size:cover;background-position:center 25%}


/* homepage hero: a person on a clear path — faded behind the navy, SJB-style */
.hero.photo{background-image:linear-gradient(96deg,#0A1F3C 0%,rgba(10,31,60,.97) 34%,rgba(10,31,60,.72) 60%,rgba(11,42,66,.42) 100%),url('assets/hero-journey.jpg');background-position:center right;}
@media(max-width:760px){.hero.photo{background-image:linear-gradient(180deg,rgba(10,31,60,.94) 0%,rgba(10,31,60,.86) 100%),url('assets/hero-journey.jpg');background-position:center;}}


/* the journey photo behind every page's hero, not just the homepage */
.hero{background-image:linear-gradient(96deg,#0A1F3C 0%,rgba(10,31,60,.97) 34%,rgba(10,31,60,.72) 60%,rgba(11,42,66,.42) 100%),url('assets/hero-journey.jpg');background-position:center right;}
@media(max-width:760px){.hero{background-image:linear-gradient(180deg,rgba(10,31,60,.94) 0%,rgba(10,31,60,.86) 100%),url('assets/hero-journey.jpg');background-position:center;}}
