:root{--ink:#10233b;--muted:#60758b;--blue:#1769ff;--cyan:#14c8ff;--line:#dfeaf4;--green:#16b77a}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Segoe UI,Arial;background:linear-gradient(180deg,#f4fbff,#fff 42%);color:var(--ink)}
a{text-decoration:none;color:inherit}.wrap{max-width:1120px;margin:auto;padding:0 22px}.nav{height:74px;display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:900;font-size:21px;display:flex;gap:9px;align-items:center}.drop{width:25px;height:31px;background:linear-gradient(145deg,var(--cyan),var(--blue));border-radius:55%;transform:rotate(45deg)}
.links{display:flex;gap:24px;color:#425a72;font-size:14px}.navbtn,.primary{background:var(--blue);color:#fff;padding:12px 18px;border-radius:12px;font-weight:800}
.hero{text-align:center;padding:65px 0 35px}.eyebrow{display:inline-flex;padding:7px 11px;border-radius:999px;background:#e8f6ff;color:#0874ba;font-size:12px;font-weight:800}
.hero h1{font-size:clamp(42px,7vw,72px);line-height:.98;letter-spacing:-3px;margin:18px auto;max-width:850px}.hero h1 span{color:var(--blue)}
.hero p,.lead{max-width:680px;margin:0 auto;color:var(--muted);font-size:18px;line-height:1.6}.tool{max-width:760px;margin:34px auto 0;background:#fff;border:1px solid var(--line);box-shadow:0 18px 50px rgba(20,75,130,.10);border-radius:28px;padding:28px}
.tooltop{display:flex;justify-content:space-between}.status{font-size:13px;color:var(--green);font-weight:800}.phone{width:110px;height:110px;border-radius:30px;margin:15px auto;background:linear-gradient(145deg,#e9f8ff,#cde9ff);display:grid;place-items:center}
.phone:before{content:'♫';font-size:42px;color:var(--blue);font-weight:900}.progress{height:8px;background:#e8f0f7;border-radius:20px;overflow:hidden;margin:18px 0}.bar{height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--blue))}
.controls{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.start,.ghost{border:0;border-radius:14px;padding:15px 24px;font-weight:900;cursor:pointer}.start{background:var(--blue);color:white}.ghost{background:#fff;border:1px solid var(--line)}
.micro{font-size:12px;color:#7d8fa1;margin-top:14px}.section{padding:70px 0}.section h2{text-align:center;font-size:36px;letter-spacing:-1.5px;margin:0 0 12px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:35px}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px}.num{width:38px;height:38px;border-radius:11px;background:#eaf5ff;color:var(--blue);display:grid;place-items:center;font-weight:900}.card p,.content p,.content li{color:var(--muted);line-height:1.65}
.dark{background:#0e2136;color:#fff;border-radius:30px;padding:42px}.dark .card{color:var(--ink)}.pills{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:28px}.pill{padding:10px 14px;background:#fff;border:1px solid var(--line);border-radius:999px;color:#496177;font-size:13px}
.faq{max-width:800px;margin:30px auto}.faq details{border-bottom:1px solid var(--line);padding:18px 2px}.faq summary{font-weight:800}.faq p{color:var(--muted);line-height:1.6}
.subhero{text-align:center;padding:55px 0 20px}.subhero h1{font-size:50px;letter-spacing:-2px;margin:10px}.content{max-width:820px;margin:auto;padding:20px 0 70px}.content h2{margin-top:38px}.notice{background:#fff8e8;border:1px solid #f5dfac;padding:16px 18px;border-radius:14px;color:#775d22}.cta{text-align:center;background:#edf8ff;border-radius:24px;padding:30px;margin-top:35px}
.footer{border-top:1px solid var(--line);padding:30px 0 45px;color:#7890a6;font-size:13px}.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px}
@media(max-width:760px){.links{display:none}.grid3{grid-template-columns:1fr}.hero{padding-top:40px}.tool{padding:20px}.section{padding:50px 0}.subhero h1{font-size:40px}}

.langs{display:flex;gap:7px;align-items:center;margin-left:auto;margin-right:16px}
.langs a{font-size:12px;font-weight:900;padding:7px 9px;border-radius:9px;border:1px solid var(--line);background:#fff}
.langs a.active{background:var(--ink);color:#fff;border-color:var(--ink)}
@media(max-width:760px){.langs{margin-right:8px}.langs a{padding:6px 8px}}


/* === Header alignment fix === */
.nav{
  height:74px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  width:100%;
}
.nav .brand{
  justify-self:start;
  white-space:nowrap;
}
.nav .links{
  justify-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:34px;
  white-space:nowrap;
}
.nav .langs{
  margin:0 12px 0 0;
  justify-self:end;
}
/* Keep the language selector and CTA together on the right by placing CTA
   in the third grid track and positioning languages immediately before it. */
.nav .navbtn{
  justify-self:end;
  grid-column:3;
  grid-row:1;
}
.nav .langs{
  grid-column:3;
  grid-row:1;
  transform:translateX(-190px);
}

@media (max-width:900px){
  .nav{
    display:flex;
    justify-content:space-between;
    gap:10px;
  }
  .nav .links{display:none}
  .nav .langs{
    margin-left:auto;
    margin-right:4px;
    transform:none;
  }
  .nav .navbtn{
    padding:10px 13px;
    white-space:nowrap;
  }
}
@media (max-width:520px){
  .nav .navbtn{display:none}
  .brand{font-size:18px}
}