
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
@import url('https://api.fontshare.com/v2/css?f[]=clash-display@400,500,600,700&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --text:#1a1a1a;
  --text-muted:#444444;
  --blue:#005ef5;
  --dark:#0047c4;
  --bg:#ffffff;
  --soft:#f4f7ff;
  --border:rgba(0,94,245,0.1);
  --gap:96px;
}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:#1a1a1a;font-family:'Inter',sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,255,255,0.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);height:66px;padding:0 64px;}
.nav-inner{max-width:1200px;margin:0 auto;height:100%;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{display:flex;align-items:flex-end;gap:0;text-decoration:none;line-height:1;}
.nav-logo img{height:38px;width:auto;display:block;margin-bottom:-4px;margin-right:-6px;}
.nav-logo-text{font-family:'Clash Display',sans-serif;font-size:24px;font-weight:700;color:#0a0a0a;letter-spacing:-0.3px;line-height:1;}
.nav-links{display:flex;align-items:center;gap:26px;}
.nav-links a{font-size:14px;font-weight:500;color:var(--blue);text-decoration:none;opacity:0.6;transition:opacity .18s;}
.nav-links a:hover,.nav-links a.active{opacity:1;}
.nav-cta{background:var(--blue);color:#fff !important;padding:9px 20px;border-radius:7px;font-weight:700;font-size:14px;opacity:1 !important;white-space:nowrap;}
.nav-cta:hover{background:var(--dark) !important;}

/* HAMBURGER */
.hamburger{display:none;background:none;border:none;cursor:pointer;padding:4px;flex-direction:column;gap:5px;}
.hamburger span{display:block;width:22px;height:2px;background:var(--blue);border-radius:2px;transition:all .25s;}
.mobile-menu{display:none;position:fixed;top:66px;left:0;right:0;bottom:0;background:#fff;z-index:99;flex-direction:column;align-items:flex-start;padding:32px 28px;gap:0;border-top:1px solid var(--border);overflow-y:auto;}
.mobile-menu.open{display:flex;}
.mobile-menu a{font-family:'Clash Display',sans-serif;font-size:26px;font-weight:700;color:var(--blue);text-decoration:none;padding:14px 0;border-bottom:1px solid var(--border);width:100%;opacity:1;}
.mobile-menu a:last-child{border-bottom:none;}
.mobile-menu .mob-cta{margin-top:24px;background:var(--blue);color:#fff;padding:14px 28px;border-radius:8px;font-size:16px;text-align:center;border-bottom:none;}

/* LAYOUT */
.pw{padding-top:66px;}
.s-white{background:var(--bg);padding:80px 64px;}
.s-soft{background:var(--soft);padding:80px 64px;}
.s-blue{background:var(--blue);padding:80px 64px;}
.s-blue .eyebrow{color:rgba(255,255,255,0.5);}
.s-blue h2,.s-blue h3{color:#fff;}
.s-blue p,.s-blue .lead,.s-blue .body-text{color:rgba(255,255,255,0.82);}
.s-blue .snum{color:rgba(255,255,255,0.13);}
.s-blue .step h3{color:#fff;}
.s-blue .step p{color:rgba(255,255,255,0.78);}
.con{max-width:1200px;margin:0 auto;}

/* HERO */
.hero{min-height:calc(100vh - 66px);display:flex;align-items:center;padding:0 64px 64px;background:var(--bg);}
.hero-inner{display:flex;flex-direction:row;gap:40px;align-items:center;width:100%;max-width:1200px;margin:0 auto;}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--blue);opacity:0.6;margin-bottom:18px;}
h1{font-family:'Clash Display',sans-serif;font-size:clamp(52px,5.5vw,80px);font-weight:700;line-height:0.95;letter-spacing:0.5px;margin-bottom:24px;color:var(--blue);}
.hero-sub{font-size:17px;line-height:1.74;color:#444444;max-width:420px;margin-bottom:32px;}
.hform{display:flex;max-width:420px;margin-bottom:10px;}
.hform input{flex:1;padding:13px 16px;font-size:14px;font-family:'Inter',sans-serif;border:1.5px solid var(--blue);border-right:none;border-radius:7px 0 0 7px;background:transparent;color:var(--blue);outline:none;}
.hform input::placeholder{color:var(--blue);opacity:0.33;}
.hform button{padding:13px 20px;font-size:14px;font-weight:700;font-family:'Inter',sans-serif;background:var(--blue);color:#fff;border:1.5px solid var(--blue);border-radius:0 7px 7px 0;cursor:pointer;white-space:nowrap;}
.hform button:hover{background:var(--dark);}
.hnote{font-size:12px;color:#888888;}
.hero-left-content{flex:1;}.hero-img{flex:1;display:flex;justify-content:flex-end;align-items:center;}
.hero-img img{width:100%;max-width:620px;height:auto;}

/* SECTION ROW — mirrors hero-inner layout exactly */
.section-row{display:flex;flex-direction:row;gap:40px;align-items:center;width:100%;max-width:1200px;margin:0 auto;}
.section-row.rev{flex-direction:row-reverse;}
.sr-content{flex:1;display:flex;flex-direction:column;justify-content:center;}
.sr-img{flex:1;display:flex;justify-content:flex-end;align-items:center;}
.section-row.rev .sr-img{justify-content:flex-start;}
.sr-img img{width:100%;max-width:620px;height:auto;object-fit:contain;}

/* TYPE */
h2{font-family:'Clash Display',sans-serif;font-size:clamp(30px,3.4vw,46px);font-weight:700;line-height:1.06;letter-spacing:0.3px;margin-bottom:16px;color:#0a0a0a;}
h3{font-family:'Clash Display',sans-serif;font-size:20px;font-weight:700;margin-bottom:8px;color:#0a0a0a;}
.body-text{font-size:16px;line-height:1.78;color:#444444;}
.lead{font-size:18px;line-height:1.72;color:#333333;margin-bottom:28px;}
.mb20{margin-bottom:20px;}

/* STEPS */
.steps-col{display:flex;flex-direction:column;gap:28px;margin-top:8px;}
.snum{font-family:'Clash Display',sans-serif;font-size:52px;font-weight:700;line-height:1;margin-bottom:6px;color:rgba(0,0,0,0.07);}

/* FAQ */
.faq{max-width:680px;margin:40px auto 0;}
.fitem{border-bottom:1px solid var(--border);padding:20px 0;}
.fitem:first-child{border-top:1px solid var(--border);}
.fq{font-weight:700;font-size:16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;user-select:none;color:#1a1a1a;}
.ftoggle{font-size:22px;font-weight:300;opacity:0.35;flex-shrink:0;transition:transform .2s;line-height:1;}
.fitem.open .ftoggle{transform:rotate(45deg);}
.fa{font-size:15px;line-height:1.7;color:#555555;display:none;padding-top:12px;}
.fitem.open .fa{display:block;}

/* BUTTONS — all same size as nav CTA */
.btn{display:inline-block;padding:9px 20px;border-radius:7px;font-size:14px;font-weight:700;text-decoration:none;cursor:pointer;border:none;transition:all .18s;font-family:'Inter',sans-serif;line-height:1.4;}
.btn-solid{background:var(--blue);color:#fff;}
.btn-solid:hover{background:var(--dark);}
.btn-ghost{background:transparent;border:2px solid var(--blue);color:var(--blue);}
.btn-ghost:hover{background:var(--blue);color:#fff;}
.btn-wh{background:#fff;color:var(--blue);font-weight:700;}
.btn-wh:hover{opacity:0.88;}
.btn-wh-ghost{background:transparent;border:2px solid rgba(255,255,255,0.7);color:#fff;}
.btn-wh-ghost:hover{background:rgba(255,255,255,0.12);}

/* CTA */
.cta{text-align:center;}
.cta h2{max-width:520px;margin:0 auto 14px;}
.cta p{max-width:400px;margin:0 auto 28px;font-size:17px;}
.cta blockquote{font-family:'Clash Display',sans-serif;font-size:clamp(22px,2.8vw,34px);font-weight:700;max-width:680px;margin:0 auto 20px;color:#fff;line-height:1.2;font-style:normal;}
.btn-pair{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* FOOTER */
footer{background:var(--blue);padding:22px 64px;}
.footer-inner{max-width:1200px;margin:0 auto;width:100%;display:flex;align-items:center;justify-content:space-between;}
.flogo{display:flex;align-items:flex-end;gap:0;}
.flogo img{height:38px;width:auto;display:block;margin-bottom:-4px;margin-right:-6px;}
.flogo-text{font-family:'Clash Display',sans-serif;font-size:20px;font-weight:700;color:#fff;line-height:1;}
.fcopy{font-size:12px;color:rgba(255,255,255,0.5);}
.flinks{display:flex;gap:20px;}
.flinks a{font-size:12px;color:rgba(255,255,255,0.5);text-decoration:none;transition:color .18s;}
.flinks a:hover{color:#fff;}

/* MOBILE */
@media(max-width:768px){
  nav{padding:0 20px;}
  .hamburger{display:flex;}
  .nav-links{display:none;}
  .hero,.s-white,.s-soft,.s-blue{padding:56px 20px;}
  .hero-inner{flex-direction:column;gap:32px;}
  .hero-inner > div{flex:none;width:100%;}
  .hero-inner .hero-img{order:-1;justify-content:center;}
  .hero-img img{max-width:300px;}
  h1{font-size:40px;}
  .section-row,.section-row.rev{flex-direction:column;gap:28px;}
  .section-row .sr-img,.section-row.rev .sr-img{order:-1;justify-content:center;flex:none;width:100%;}
  .section-row .sr-content,.section-row.rev .sr-content{flex:none;width:100%;}
  .sr-img img{max-width:300px;}
  .faq{max-width:100%;}
  footer{padding:20px;}
  .footer-inner{flex-direction:column;gap:12px;text-align:center;}
  .hform{flex-direction:column;max-width:100%;}
  .hform input{border-right:1.5px solid var(--blue);border-bottom:none;border-radius:7px 7px 0 0;}
  .hform button{border-radius:0 0 7px 7px;}
}
