/* Finora public page (www.appfinora.net) */
@font-face{font-family:"Bricolage";src:url(/welcome/fonts/bricolage.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Source Sans";src:url(/welcome/fonts/sourcesans.woff2) format("woff2");font-weight:200 900;font-display:swap}

:root{
  --ink:#101736;      /* headings, dark bands */
  --text:#2a3150;     /* body copy */
  --mute:#5d6584;     /* secondary copy */
  --paper:#f7f8fc;    /* page */
  --line:#dde2f0;     /* rules, frames */
  --blue:#2f5bea;     /* Finora blue, matches the app */
  --gain:#178a5b;     /* the colour of money going up */
  --wrap:1200px;
  --display:"Bricolage",ui-sans-serif,system-ui,sans-serif;
  --body:"Source Sans",ui-sans-serif,system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--paper);color:var(--text);font:400 18px/1.6 var(--body);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;border-radius:8px;z-index:10}
.skip:focus{left:12px}
h1,h2,h3{font-family:var(--display);color:var(--ink);margin:0;font-weight:700;letter-spacing:-.025em}
h2{font-size:clamp(30px,3.6vw,46px);line-height:1.08}
p{margin:0}
.small{font-size:15px;color:var(--mute)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 18px;border-radius:10px;font:600 16px/1 var(--body);text-decoration:none;white-space:nowrap;border:1.5px solid transparent}
.btn.big{min-height:52px;padding:0 24px;font-size:17px;border-radius:12px}
.btn.solid{background:var(--blue);color:#fff}
.btn.solid:hover{background:#2449c9}
.btn.ghost{border-color:var(--line);color:var(--ink);background:#fff}
.btn.ghost:hover{border-color:var(--ink)}
.btn.light{background:#fff;color:var(--ink)}
.btn.light:hover{background:#e9edfb}

/* header */
.top{position:sticky;top:0;z-index:5;background:rgba(247,248,252,.86);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent}
.top.scrolled{border-bottom-color:var(--line)}
.top-in{display:flex;align-items:center;gap:28px;height:72px}
.brand{display:inline-flex;align-items:center;gap:10px;font:700 22px/1 var(--display);color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.mark{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--blue);color:#fff;font-size:19px}
.links{display:flex;gap:24px;margin-right:auto}
.links a{text-decoration:none;color:var(--mute);font-weight:600;font-size:16px}
.links a:hover{color:var(--ink)}
.top-cta{display:flex;gap:10px}

/* hero */
.hero{padding:76px 0 0;overflow:hidden}
.hero h1{font-size:clamp(42px,6.6vw,88px);line-height:.98;letter-spacing:-.04em;font-weight:750;max-width:14ch}
.hero-row{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-top:34px}
.lede{max-width:56ch;font-size:20px;color:var(--text)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
.stage{position:relative;margin:56px 0 0;padding-bottom:40px}
.shot{border-radius:14px;border:1px solid var(--line);background:#fff;box-shadow:0 30px 60px -30px rgba(16,23,54,.35),0 2px 6px rgba(16,23,54,.06)}
.stage .desk{width:88%}
.stage .phone{position:absolute;right:0;bottom:0;width:23%;border-radius:28px;border:6px solid var(--ink);box-shadow:0 40px 70px -30px rgba(16,23,54,.55)}
.stage figcaption{margin-top:18px;font-size:14px;color:var(--mute)}

/* the three doors */
.doors{background:var(--ink);color:#c9cfe6;padding:104px 0 96px}
.doors-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:56px}
.doors h2{color:#fff}
.doors-head p{max-width:46ch;font-size:19px}
.door-list{list-style:none;margin:0;padding:0;border-top:1px solid #2a3360}
.door-list a{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:baseline;gap:24px;padding:26px 0;border-bottom:1px solid #2a3360;text-decoration:none}
.addr{font:700 clamp(28px,4.4vw,58px)/1 var(--display);letter-spacing:-.035em;color:#fff;overflow-wrap:anywhere}
.dom{color:#5d6aa6;font-weight:500}
.what{font-size:18px;color:#c9cfe6}
.door-list a:hover .dom,.door-list a:focus-visible .dom{color:#8ea6ff}

/* module sections */
.mod{padding:120px 0 40px}
.mod-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center}
.flip .mod-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.flip .mod-text{order:2}
.mod-name{font:700 17px/1 var(--body);color:var(--blue);margin-bottom:18px}
.mod-text h2{margin-bottom:20px}
.mod-text>p{font-size:19px;max-width:48ch}
.feat{list-style:none;margin:28px 0 0;padding:0}
.feat li{padding:14px 0 14px 30px;border-top:1px solid var(--line);position:relative;font-size:17px}
.feat li::before{content:"";position:absolute;left:4px;top:24px;width:12px;height:2px;background:var(--gain)}
.feat strong{color:var(--ink);font-weight:700}
.mod-media{margin:0;position:relative}
.mod-media.pair{padding:0 0 18% 0}
.mod-media.pair .over{position:absolute;width:72%;right:-4%;bottom:0}
.flip .mod-media .shot{width:100%}

/* phones */
.mobile{margin-top:120px;padding:104px 0;background:#e9edfb}
.mobile-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:56px}
.mobile-head p{max-width:46ch;font-size:19px}
.phones{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.phones li{text-align:center}
.phones img{border-radius:26px;border:6px solid var(--ink);box-shadow:0 30px 50px -28px rgba(16,23,54,.5);background:#fff}
.phones li:nth-child(even){margin-top:48px}
.phones span{display:block;margin-top:16px;font-weight:700;color:var(--ink)}

/* more */
.more{padding:120px 0}
.more-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px}
.more h2{max-width:14ch}
.more-list{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.more-list div{padding:20px 0;border-top:1px solid var(--line)}
.more-list dt{font:700 20px/1.2 var(--display);color:var(--ink);margin-bottom:6px;letter-spacing:-.01em}
.more-list dd{margin:0;color:var(--mute);font-size:17px}

/* security */
.security{padding:0 0 120px}
.sec-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding-top:64px;border-top:2px solid var(--ink)}
.security h2{margin-bottom:18px}
.security .sec-grid>div>p{font-size:19px;max-width:46ch}
.sec-list{list-style:none;margin:0;padding:0}
.sec-list li{padding:16px 0;border-bottom:1px solid var(--line);font-size:17px}
.sec-list li:first-child{padding-top:0}
.sec-list strong{display:block;color:var(--ink);font-family:var(--display);font-size:20px;letter-spacing:-.01em;margin-bottom:2px}

/* closing */
.close{background:var(--blue);color:#e3e9ff;padding:104px 0}
.close h2{color:#fff;font-size:clamp(34px,5vw,64px);max-width:16ch;letter-spacing:-.035em}
.close p{margin:22px 0 34px;font-size:19px;max-width:52ch}
.close .btn.solid{background:var(--ink)}
.close .btn.solid:hover{background:#000}

/* footer */
.foot{background:var(--ink);color:#c9cfe6;padding:64px 0 32px}
.foot .brand{color:#fff}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
.foot h3{font:700 16px/1 var(--body);color:#fff;margin:6px 0 14px;letter-spacing:0}
.foot nav a{display:block;text-decoration:none;color:#c9cfe6;padding:5px 0;font-size:16px}
.foot nav a:hover{color:#fff}
.foot .small{color:#8e96b8;margin-top:12px}
.copy{margin-top:48px;padding-top:24px;border-top:1px solid #2a3360}

/* one load moment: the product slides into place under the headline */
@media (prefers-reduced-motion:no-preference){
  .stage .desk{animation:rise .9s cubic-bezier(.2,.7,.2,1) .1s both}
  .stage .phone{animation:rise .9s cubic-bezier(.2,.7,.2,1) .35s both}
  @keyframes rise{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
}

/* tablet */
@media (max-width:980px){
  .links{display:none}
  .top-in{justify-content:space-between}
  .hero-row,.doors-head,.mobile-head{display:block}
  .hero-row .hero-cta,.doors-head p,.mobile-head p{margin-top:24px}
  .mod-grid,.flip .mod-grid,.more-grid,.sec-grid{grid-template-columns:1fr;gap:40px}
  .flip .mod-text{order:0}
  .mod{padding-top:88px}
  .phones{grid-template-columns:repeat(2,minmax(0,1fr))}
  .phones li:nth-child(even){margin-top:0}
}
/* phone */
@media (max-width:620px){
  body{font-size:17px}
  .wrap{padding:0 20px}
  .top-cta .ghost{display:none}
  .hero{padding-top:44px}
  .lede{font-size:18px}
  .hero-cta .btn{flex:1 1 100%}
  .stage .desk{width:100%}
  .stage .phone{position:relative;width:62%;margin:-38% 0 0 auto;border-width:5px}
  .door-list a{grid-template-columns:1fr;gap:8px}
  .mod-media.pair{padding:0}
  .mod-media.pair .over{position:relative;width:86%;right:auto;margin:-14% 0 0 auto}
  .more-list{grid-template-columns:1fr}
  .phones{gap:16px}
  .phones img{border-radius:20px;border-width:4px}
  .foot-grid{grid-template-columns:1fr}
}

/* join with a code */
.join{padding:110px 0;background:#fff;border-top:1px solid var(--line)}
.join-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:start}
.join-text h2{margin-bottom:18px}
.join-text p{font-size:19px;max-width:44ch}
.join-text .small{margin-top:18px;font-size:16px}
.join-form{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:28px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:700;color:var(--ink);font-size:16px;margin-bottom:6px}
.field input{width:100%;min-height:48px;padding:10px 14px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font:500 17px/1.3 var(--body)}
.field input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(47,91,234,.18)}
.field input[aria-invalid=true]{border-color:#c2410c}
#jCode{font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.note{font-size:14px;color:var(--mute);margin-top:6px}
.note.good{color:var(--gain);font-weight:600}
.note.bad{color:#c2410c;font-weight:600}
.form-msg{min-height:0;margin:4px 0 14px;font-weight:600;color:#c2410c}
.form-msg:empty{display:none}
.form-msg.good{color:var(--gain)}
.join-form .btn{width:100%}
.join-form .btn[disabled]{opacity:.6;cursor:progress}
@media (max-width:980px){.join-grid{grid-template-columns:1fr;gap:36px}}
@media (max-width:620px){.join{padding:80px 0}.join-form{padding:20px}.two{grid-template-columns:1fr;gap:0}}

.form-msg .redeem-link{display:inline-block;margin-top:6px;color:var(--blue);font-weight:700}