/* Structure‑matched, license‑safe fintech landing */
:root{
  --bg:#0b1020;
  --surface:#0f162f;
  --card:#111a3a;
  --muted:#9aa4c7;
  --text:#e8edff;
  --brand:#6d8bff;
  --brand-2:#7cf0ff;
  --ring: rgba(124,240,255,.35);
  --radius:16px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; color:var(--text);
  background: radial-gradient(1200px 600px at 10% -10%, #13214a 0%, rgba(19,33,74,0) 60%), var(--bg);
  font-family:'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.6;
}
.container{width:min(1120px,92%); margin-inline:auto}
.noise{position:fixed; inset:0; background-image:url('assets/pattern.svg'); opacity:.08; pointer-events:none; z-index:-1}

/* Header */
.header{position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; padding:18px 0;
  background:linear-gradient(to bottom, rgba(11,16,32,.85), rgba(11,16,32,.2)); border-bottom:1px solid rgba(255,255,255,.06); backdrop-filter:saturate(180%) blur(8px)}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--text); font-weight:800}
.nav{display:flex; align-items:center; gap:18px}
.nav a{color:var(--text); text-decoration:none; opacity:.9}
.nav a:hover{opacity:1}
.hamburger{display:none; position:relative; width:40px; height:40px; border:0; background:transparent}
.hamburger span{position:absolute; left:8px; right:8px; height:2px; background:#fff; border-radius:2px; transition:.3s}
.hamburger span:nth-child(1){top:11px}.hamburger span:nth-child(2){top:19px}.hamburger span:nth-child(3){top:27px}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.75rem 1rem; border-radius:999px; border:1px solid rgba(255,255,255,.14); text-decoration:none; color:var(--text); font-weight:700; box-shadow:var(--shadow)}
.btn--primary{background:linear-gradient(135deg, var(--brand), var(--brand-2)); border-color:transparent; color:#0a1226}
.btn--ghost{background:transparent}
.btn--primary:hover{filter:brightness(1.05)}
.btn--ghost:hover{background:rgba(255,255,255,.06)}

/* Hero */
.hero{display:grid; grid-template-columns:1.2fr 1fr; gap:28px; padding:48px 0 24px}
.hero__text h1{font-family:'Plus Jakarta Sans','Inter',sans-serif; font-weight:800; letter-spacing:-.5px; margin:10px 0 12px; font-size:clamp(1.8rem,2.8vw + 1rem,3rem)}
.eyebrow{display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:rgba(109,139,255,.12); color:#cfe3ff; font-weight:700; font-size:.9rem}
.grad{background:linear-gradient(135deg,var(--brand-2),var(--brand)); -webkit-background-clip:text; background-clip:text; color:transparent}
.lead{opacity:.9; max-width:56ch}
.lead-form{display:flex; gap:8px; margin:16px 0 6px}
.lead-form input{flex:1; padding:14px; border-radius:12px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); color:var(--text); outline:none}
.lead-form input:focus{box-shadow:0 0 0 6px var(--ring); border-color:transparent}
.points{display:grid; gap:8px; margin-top:8px}
.point{display:flex; align-items:flex-start; gap:10px; font-weight:600; opacity:.95}
.hero__media{padding:14px}
.hero__media img{width:100%; display:block; border-radius:12px; border:1px solid rgba(255,255,255,.12)}

.card{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius); box-shadow:var(--shadow)}
.section-head{margin-bottom:20px}
.section-head h2{margin:0 0 8px; font-size:clamp(1.4rem, 2.2vw + .8rem, 2rem)}
.section-head p{margin:0; color:var(--muted)}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}

/* Logos */
.logos{display:flex; align-items:center; gap:16px; padding:30px 0 8px}
.logos__title{color:var(--muted); font-weight:600}
.logos__strip{display:flex; flex-wrap:wrap; gap:10px}
.pill{padding:8px 12px; border-radius:12px; border:1px dashed rgba(255,255,255,.18); color:#d4dcff; opacity:.85}

/* Features */
.feature{padding:18px}
.icon{width:48px; height:48px; display:grid; place-items:center; border-radius:12px; background:rgba(109,139,255,.15); border:1px solid rgba(109,139,255,.3); margin-bottom:8px}
.feature h3{margin:10px 0 6px}
.mini{padding-left:18px; margin:10px 0 0; color:var(--muted)}

/* Programs */
.plan{padding:18px}
.plan__head{display:flex; align-items:baseline; justify-content:space-between; gap:6px; margin-bottom:6px}
.plan__list{padding-left:18px; margin:0 0 14px}
.plan--featured{outline:2px solid rgba(124,240,255,.35); box-shadow:0 0 0 8px rgba(124,240,255,.07)}

/* Testimonials */
.testimonial{padding:18px}
.testimonial blockquote{margin:0 0 12px; font-size:1.05rem}
.testimonial figcaption{display:flex; align-items:center; gap:10px}
.testimonial figcaption div{display:flex; flex-direction:column; line-height:1.2}
.testimonial figcaption span{color:var(--muted); font-size:.9rem}

/* Pricing */
.price{padding:18px}
.price h3{margin:0 0 8px}
.price__value{font-size:1.8rem; font-weight:800; margin:0 0 10px}
.price__value span{font-size:.9rem; font-weight:600; color:var(--muted)}
.price--featured{outline:2px solid rgba(109,139,255,.4); box-shadow:0 0 0 8px rgba(109,139,255,.08)}

/* FAQ */
.faq details{padding:14px 16px; margin:10px 0; cursor:pointer}
.faq summary{font-weight:700}
.faq p{margin:.6rem 0 0; color:#d8e1ff}

/* Contact */
.contact__form{padding:18px}
.form-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px}
.form-grid label{display:flex; flex-direction:column; gap:6px; font-weight:700}
.form-grid input,.form-grid textarea,.form-grid select{padding:12px; border-radius:12px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); color:var(--text); outline:none}
.form-grid input:focus,.form-grid textarea:focus,.form-grid select:focus{box-shadow:0 0 0 6px var(--ring); border-color:transparent}
.form-grid .wide{grid-column:1 / -1}
.form-note{color:var(--muted); margin-top:8px}

/* Footer */
.footer{padding:34px 0 50px}
.footer__top{display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:16px; border-bottom:1px solid rgba(255,255,255,.1)}
.footer__grid{display:grid; grid-template-columns:2fr repeat(3,1fr); gap:18px; padding:16px 0}
.footer__grid nav{display:flex; flex-direction:column; gap:6px}
.footer__grid nav a{color:var(--text); text-decoration:none; opacity:.85}
.footer__grid nav a:hover{opacity:1}
.footer__bottom{display:flex; align-items:center; justify-content:space-between; padding-top:12px; border-top:1px solid rgba(255,255,255,.1)}
.muted{color:var(--muted)}
.socials{display:flex; gap:10px}
.socials a{width:32px; height:32px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.18); border-radius:10px; text-decoration:none; color:var(--text); opacity:.85}
.socials a:hover{opacity:1; background:rgba(255,255,255,.06)}

/* Utilities */
.w-full{width:100%}

/* Responsive */
@media (max-width:960px){
  .nav{display:none}
  .hamburger{display:block}
  .hero{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr 1fr}
  .footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .grid-3{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .logos{flex-direction:column; align-items:flex-start}
}