/* Single Fin – AI Opportunity Finder (static mockup)
   Palette & type pulled from www.singlefin.io (Wix theme):
   navy #0D2345 (logo + contact band), slate #66748A (partners band),
   mint #F3F8F0 / #D2E4C7 / green #39641D (theme greens), greys #F0F0F0 #C7C7C7 #6E6E6E.
   Site fonts: Nimbus Sans Condensed (headings/nav) + Madefor Text (body) -> approximated
   with Roboto Condensed + Figtree (bundled locally, OFL). */
@font-face{font-family:"SF Cond";src:url(fonts/RobotoCondensed-VariableFont_wght.ttf) format("truetype");font-weight:100 900}
@font-face{font-family:"SF Body";src:url(fonts/Figtree-VariableFont_wght.ttf) format("truetype");font-weight:300 900}
:root{
  --navy:#0D2345; --navy-2:#16315c; --slate:#66748A; --mint:#F3F8F0; --mint-2:#D2E4C7; --green:#39641D; --green-2:#618741;
  --grey-1:#F0F0F0; --grey-2:#C7C7C7; --grey-3:#6E6E6E; --ink:#000; --white:#fff; --blue:#1A6AFF;
  --cond:"nimbus-sans-tw01con","SF Cond","Roboto Condensed","Arial Narrow",sans-serif;
  --body:"madefor-text","SF Body","Figtree","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--body);color:var(--ink);background:#fff;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

/* faux browser bar so the screenshot reads as a page on singlefin.io */
.chrome{background:#e9ebef;border-bottom:1px solid #d5d8de;padding:9px 16px;display:flex;align-items:center;gap:14px;font-family:var(--body)}
.chrome .dots{display:flex;gap:7px}.chrome .dots i{width:12px;height:12px;border-radius:50%;background:#ff5f57;display:block}
.chrome .dots i:nth-child(2){background:#febc2e}.chrome .dots i:nth-child(3){background:#28c840}
.chrome .url{flex:1;max-width:760px;margin:0 auto;background:#fff;border-radius:999px;padding:5px 16px;font-size:13px;color:#3c4043;display:flex;gap:8px;align-items:center}
.chrome .url b{font-weight:500;color:#111}.chrome .url .lock{opacity:.6}

/* site header (mirrors singlefin.io: logo left, condensed nav centre, socials right) */
.site-header{background:#fff;height:120px;display:flex;align-items:center;padding:0 88px;gap:40px;border-bottom:1px solid #eee}
.site-header .logo img{height:92px;width:auto;display:block}
.site-nav{flex:1;display:flex;justify-content:center;gap:58px;font-family:var(--cond);font-size:15px;letter-spacing:.1px}
.site-nav a{color:#000;padding:6px 0;position:relative}
.site-nav a.active{color:var(--navy)}
.site-nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--navy)}
.socials{display:flex;gap:16px;align-items:center}.socials img{width:23px;height:23px;display:block}
.burger{display:none}

/* footer (mirrors singlefin.io footer) */
.site-footer{text-align:center;font-family:var(--cond);font-size:14px;line-height:1.35;color:#000;padding:28px 20px 34px;background:#fff;border-top:1px solid #eee}
.site-footer .socials{justify-content:center;margin-bottom:14px}
.newsletter{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;padding:80px 88px;max-width:1440px;margin:0 auto}
.newsletter h2{font-family:var(--cond);font-weight:700;font-size:58px;line-height:1.08;margin:0;letter-spacing:-.5px}
.newsletter .small{font-family:var(--cond);font-size:13px;color:#000;margin-top:22px}
.newsletter .lead{font-family:var(--cond);font-size:20px;margin:6px 0 18px}

/* buttons: site uses fully rounded pills, navy fill or white/outline */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:13px 30px;font-family:var(--body);font-size:16px;font-weight:500;border:1px solid var(--navy);cursor:pointer;white-space:nowrap;line-height:1.2}
.btn-primary{background:var(--navy);color:#fff}
.btn-outline{background:#fff;color:var(--navy)}
.btn-white{background:#fff;color:var(--navy);border-color:#fff}
.btn-ghost{background:transparent;color:#000;border-color:#000}
.btn-lg{padding:16px 36px;font-size:17px}
.btn-block{width:100%}

/* tool shell */
.tool-hero{background:var(--navy);color:#fff;padding:34px 88px 30px}
.tool-hero .crumbs{font-family:var(--cond);font-size:14px;opacity:.75;letter-spacing:.3px}
.tool-hero h1{font-family:var(--cond);font-weight:700;font-size:44px;line-height:1.1;margin:6px 0 0;letter-spacing:-.3px}
.stepper{display:flex;gap:0;margin-top:26px;max-width:1100px}
.step{flex:1;display:flex;align-items:center;gap:10px;font-family:var(--cond);font-size:15px;color:rgba(255,255,255,.6);position:relative;padding-right:12px}
.step .n{width:28px;height:28px;border-radius:50%;border:1.5px solid rgba(255,255,255,.45);display:grid;place-items:center;font-size:14px;flex:none}
.step:after{content:"";flex:1;height:1.5px;background:rgba(255,255,255,.25);margin-left:6px}
.step:last-child:after{display:none}
.step.done{color:#fff}.step.done .n{background:var(--mint-2);border-color:var(--mint-2);color:var(--navy)}
.step.current{color:#fff;font-weight:700}.step.current .n{background:#fff;color:var(--navy);border-color:#fff}

.wrap{max-width:1104px;margin:0 auto;padding:48px 24px 72px}
.card{background:#fff;border:1px solid #e3e6ea;border-radius:24px;padding:40px 44px;box-shadow:0 10px 30px rgba(13,35,69,.06)}
.card h2{font-family:var(--cond);font-size:34px;font-weight:700;margin:0 0 6px;line-height:1.15}
.card .sub{color:var(--grey-3);margin:0 0 28px;font-size:16px}
.section-title{font-family:var(--cond);font-size:26px;font-weight:700;margin:0 0 4px}
.muted{color:var(--grey-3)}
.tiny{font-size:13px}

/* form fields – modelled on the site's contact form (label above, light input) */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px 26px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px 26px}
.field label{display:block;font-family:var(--cond);font-size:15px;margin:0 0 7px;color:#000}
.field .hint{font-size:13px;color:var(--grey-3);margin-top:6px}
.input,.select,.textarea{width:100%;font-family:var(--body);font-size:16px;color:#111;background:#fff;border:1px solid #c9ced6;border-radius:10px;padding:13px 14px;line-height:1.35}
.textarea{min-height:92px;resize:none}
.select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#555 50%),linear-gradient(135deg,#555 50%,transparent 50%);background-position:calc(100% - 20px) 21px,calc(100% - 15px) 21px;background-size:5px 5px;background-repeat:no-repeat}
.input.focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(13,35,69,.12)}
.input-unit{position:relative}.input-unit .unit{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--grey-3);font-size:14px}
.input-unit .pre{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--grey-3)}
.input-unit .input.has-pre{padding-left:28px}
.actions{display:flex;justify-content:space-between;align-items:center;margin-top:34px;padding-top:26px;border-top:1px solid #eceff2}
.back{font-family:var(--cond);font-size:16px;color:var(--navy)}

/* landing */
.hero{position:relative;color:#fff;background:#0d2345 url(hero-ocean.jpg) center/cover no-repeat}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,35,69,.92) 0%,rgba(13,35,69,.78) 50%,rgba(13,35,69,.55) 100%)}
.hero-inner{position:relative;max-width:1264px;margin:0 auto;padding:84px 88px 92px;display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.eyebrow{display:inline-block;font-family:var(--cond);font-size:14px;letter-spacing:1.6px;text-transform:uppercase;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);padding:6px 14px;border-radius:999px}
.hero h1{font-family:var(--cond);font-weight:700;font-size:64px;line-height:1.04;margin:20px 0 18px;letter-spacing:-.6px}
.hero .lede{font-size:19px;opacity:.92;max-width:560px;margin:0 0 28px}
.bullets{list-style:none;padding:0;margin:0 0 32px;display:grid;gap:14px}
.bullets li{display:flex;gap:14px;align-items:flex-start;font-size:17px}
.bullets .ck{flex:none;width:26px;height:26px;border-radius:50%;background:var(--mint-2);color:var(--navy);display:grid;place-items:center;font-weight:800;font-size:14px;margin-top:1px}
.cred{display:flex;gap:14px;align-items:center;font-size:14.5px;opacity:.92;border-top:1px solid rgba(255,255,255,.22);padding-top:20px;max-width:600px}
.cred .avatar{flex:none;width:42px;height:42px;border-radius:50%;background:#fff url(favicon.png) center/70% no-repeat}
.signin{background:#fff;color:#000;border-radius:24px;padding:38px 36px;box-shadow:0 30px 60px rgba(0,0,0,.25)}
.signin h3{font-family:var(--cond);font-size:30px;margin:0 0 4px;font-weight:700}
.signin p{margin:0 0 22px;color:var(--grey-3);font-size:15px}
.note{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--grey-3);margin-top:14px;line-height:1.45}
.note .i{flex:none;width:17px;height:17px;border-radius:50%;border:1.3px solid var(--grey-3);display:grid;place-items:center;font-size:11px;font-weight:700;margin-top:1px}
.signin .fine{font-size:12px;color:var(--grey-3);margin-top:18px;border-top:1px solid #eee;padding-top:14px}
.how{background:var(--mint)}
.how-inner{max-width:1264px;margin:0 auto;padding:64px 88px;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.how-item{padding:8px 36px;border-left:1px solid var(--mint-2)}
.how-item:first-child{border-left:0;padding-left:0}
.how-item .k{font-family:var(--cond);font-size:15px;color:var(--green);letter-spacing:1px;text-transform:uppercase}
.how-item h4{font-family:var(--cond);font-size:28px;font-weight:400;margin:6px 0 8px}
.how-item p{margin:0;font-size:15.5px;color:#222}

/* verify */
.verify{max-width:620px;margin:0 auto;text-align:center}
.verify .mail-ic{width:64px;height:64px;border-radius:50%;background:var(--mint);display:grid;place-items:center;margin:0 auto 18px}
.codes{display:flex;justify-content:center;gap:12px;margin:30px 0 10px}
.codes .c{width:62px;height:74px;border:1.5px solid #c9ced6;border-radius:12px;display:grid;place-items:center;font-family:var(--cond);font-size:36px;font-weight:700;color:var(--navy)}
.codes .c.filled{border-color:var(--navy)}
.codes .c.cur{border-color:var(--navy);box-shadow:0 0 0 3px rgba(13,35,69,.14)}
.codes .c.cur:after{content:"";width:2px;height:36px;background:var(--navy)}
.codes .sep{width:14px;align-self:center;height:2px;background:#c9ced6}

/* use case */
.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--cond);font-size:13px;letter-spacing:1px;text-transform:uppercase;padding:4px 12px;border-radius:999px;background:var(--mint);color:var(--green);border:1px solid var(--mint-2)}
.or{display:flex;align-items:center;gap:18px;margin:44px 0 22px;font-family:var(--cond);font-size:15px;color:var(--grey-3);text-transform:uppercase;letter-spacing:1.4px}
.or:before,.or:after{content:"";flex:1;height:1px;background:#e1e4e8}
.recs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rec{border:1px solid #e1e4e8;border-radius:18px;padding:22px 22px 20px;background:#fff;display:flex;flex-direction:column;gap:8px}
.rec .ic{width:42px;height:42px;border-radius:12px;background:var(--mint);display:grid;place-items:center}
.rec h5{font-family:var(--cond);font-size:21px;margin:4px 0 0;font-weight:700}
.rec p{margin:0;font-size:14.5px;color:#333;line-height:1.5}
.rec .tag{font-size:12.5px;color:var(--grey-3);margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:center}
.rec .tag a{color:var(--navy);font-weight:600}

/* quantify */
.qgroup{background:var(--mint);border-radius:18px;padding:26px 28px;margin-top:22px}
.qgroup h4{font-family:var(--cond);font-size:21px;margin:0 0 16px;font-weight:700}
.summary-pill{display:flex;gap:16px;align-items:center;background:#f6f7f9;border-radius:14px;padding:14px 18px;font-size:14.5px;margin-bottom:6px}
.summary-pill b{font-family:var(--cond);font-size:16px}

/* results */
.example-flag{display:inline-flex;align-items:center;gap:8px;background:#FFE9DF;color:#9a3b0b;border:1px solid #FFBFA1;font-family:var(--cond);font-weight:700;letter-spacing:1.5px;text-transform:uppercase;font-size:14px;padding:6px 14px;border-radius:8px}
.example-banner{background:#FFF6F1;border:1px dashed #FA854F;color:#7a3410;border-radius:12px;padding:12px 18px;font-size:14.5px;display:flex;gap:12px;align-items:center;margin-bottom:26px}
.report-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:26px}
.report-head h2{margin:10px 0 4px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.kpi{border:1px solid #e1e4e8;border-radius:18px;padding:22px 24px}
.kpi .l{font-family:var(--cond);font-size:16px;color:var(--grey-3)}
.kpi .v{font-family:var(--cond);font-size:48px;font-weight:700;line-height:1.05;color:var(--navy);margin-top:4px}
.kpi .s{font-size:13.5px;color:var(--grey-3);margin-top:4px}
.kpi.hl{background:var(--navy);border-color:var(--navy)}.kpi.hl .l,.kpi.hl .s{color:rgba(255,255,255,.75)}.kpi.hl .v{color:#fff}
.passband{display:grid;grid-template-columns:auto 1fr;gap:30px;align-items:center;background:var(--mint);border:1px solid var(--mint-2);border-radius:22px;padding:28px 32px;margin-top:22px}
.pass{width:168px;height:168px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;text-align:center;box-shadow:0 0 0 8px #fff,0 0 0 10px var(--green-2)}
.pass .t1{font-family:var(--cond);font-size:15px;letter-spacing:1.5px;text-transform:uppercase;opacity:.9}
.pass .t2{font-family:var(--cond);font-weight:800;font-size:38px;line-height:1}
.pass .t3{font-family:var(--cond);font-size:15px;letter-spacing:1px;text-transform:uppercase}
.pass .ck{font-size:26px;line-height:1;margin-bottom:2px}
.range h4{font-family:var(--cond);font-size:22px;margin:0 0 2px}
.bar{position:relative;height:16px;border-radius:999px;background:#fff;border:1px solid var(--mint-2);margin:52px 0 12px}
.bar .fill{position:absolute;top:0;bottom:0;left:22%;right:14%;border-radius:999px;background:linear-gradient(90deg,var(--mint-2),var(--green-2) 55%,var(--green))}
.bar .thr{position:absolute;top:-14px;bottom:-14px;left:31%;border-left:2px dashed var(--navy)}
.bar .thr span{position:absolute;top:-24px;left:-46px;width:92px;text-align:center;font-family:var(--cond);font-size:13px;color:var(--navy);white-space:nowrap}
.bar .mk{position:absolute;top:50%;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--green);transform:translate(-50%,-50%)}
.bar .mk.base{width:28px;height:28px;background:var(--green);border-color:#fff;box-shadow:0 0 0 2px var(--green)}
.bar .lbl{position:absolute;top:-46px;transform:translateX(-50%);text-align:center;font-family:var(--cond);white-space:nowrap}
.bar .lbl b{display:block;font-size:22px;color:var(--navy);line-height:1}
.bar .lbl small{font-size:13px;color:var(--grey-3);text-transform:uppercase;letter-spacing:1px}
.scale{display:flex;justify-content:space-between;font-size:12.5px;color:var(--grey-3);font-family:var(--cond)}
.two-col{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;margin-top:22px}
.panel{border:1px solid #e1e4e8;border-radius:20px;padding:26px 28px}
.panel h4{font-family:var(--cond);font-size:24px;margin:0 0 4px}
.timeline{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:0}
.timeline li{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:14px 0;border-top:1px solid #eef0f3}
.timeline li:first-child{border-top:0}
.timeline .d{font-family:var(--cond);font-weight:700;color:var(--navy);font-size:16px}
.timeline .w{font-weight:600;font-size:15.5px}
.timeline .x{font-size:14px;color:#444}
.facts{display:grid;gap:12px;margin-top:16px}
.facts div{display:flex;justify-content:space-between;border-bottom:1px solid #eef0f3;padding-bottom:10px;font-size:15px}
.facts div b{font-family:var(--cond);font-size:18px;color:var(--navy)}
.cta{margin-top:22px;background:var(--navy);color:#fff;border-radius:24px;padding:34px 38px;display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:center}
.cta h3{font-family:var(--cond);font-size:34px;margin:0 0 6px;font-weight:700;line-height:1.1}
.cta p{margin:0;opacity:.85;font-size:15.5px}
.checkrow{display:flex;gap:14px;align-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);border-radius:14px;padding:15px 18px;margin-bottom:14px;font-size:16px;font-weight:500}
.checkbox{flex:none;width:24px;height:24px;border-radius:6px;background:var(--mint-2);display:grid;place-items:center;color:var(--navy);font-weight:900;font-size:15px}

@media (max-width:1100px){
  .site-header{padding:0 28px}.site-nav{gap:26px}
  .hero-inner{grid-template-columns:1fr;padding:56px 28px}.tool-hero{padding:28px}
  .how-inner{grid-template-columns:1fr;padding:44px 28px;gap:24px}.how-item{border-left:0;padding:0}
  .newsletter{grid-template-columns:1fr;padding:56px 28px}
}
@media (max-width:760px){
  .site-header{height:84px}.site-header .logo img{height:60px}
  .site-nav,.site-header .socials{display:none}.burger{display:block;margin-left:auto;font-family:var(--cond)}
  .hero h1{font-size:42px}.grid-2,.grid-3,.recs,.kpis,.two-col,.cta,.passband{grid-template-columns:1fr}
  .card{padding:28px 22px}.stepper .step span.t{display:none}.newsletter h2{font-size:40px}
}

.report-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.btn-help{background:#39641D;color:#fff;border-color:#39641D}
.btn-help:hover{background:#618741}
@media(max-width:700px){.report-actions{width:100%}.report-actions .btn{flex:1;justify-content:center}}

.req{color:#B42318;font-weight:700}
.textarea::placeholder,.input::placeholder{color:#8a93a3;font-style:italic}
.field .hint{font-size:13px;color:#6E6E6E;margin-top:6px;line-height:1.4}
.rec-for{background:#F3F8F0;border:1px solid #D2E4C7;border-radius:12px;padding:12px 16px;margin:0 0 16px;font-size:15px;color:#0D2345}
.rec-for .spark{color:#39641D;margin-right:6px}
.rec-for a{color:#39641D;font-weight:600;margin-left:8px}

.pass.tier .t2{font-size:22px;letter-spacing:-0.02em}
.tiers{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 18px}
.tiers .t{font-family:var(--cond);font-size:13px;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid #c9ced6;color:#6E6E6E}
.tiers .t.on{background:#39641D;border-color:#39641D;color:#fff}
.tiers .t.muted-t{opacity:0.55}
.bar.wide{margin-top:8px}

.consent-box{margin-top:28px;padding-top:22px;border-top:1px solid #e6e9ef}
.disclaimer{background:#FFF8F0;border:1px solid #F0D9B5;border-radius:12px;padding:14px 16px;margin-bottom:16px}
.disclaimer .d-title{font-family:var(--cond);font-size:15px;font-weight:700;color:#8A4B08;margin-bottom:6px}
.disclaimer p{margin:0;font-size:14px;line-height:1.45;color:#4A3728}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.4;color:#0D2345;cursor:default}
.consent input{width:18px;height:18px;margin-top:2px;accent-color:#39641D;flex-shrink:0}
.consent a{color:#39641D;font-weight:600}
