@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;800&display=swap');

:root{
  --grad-top: #71c9ff;
  --grad-bottom: #5c82f6;
  --ink: #0e0e10;
  --white: #ffffff;
  --muted: rgba(14,14,16,0.7);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:'Montserrat', sans-serif;
  font-weight:400;
  color:var(--ink);
  background:var(--white);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; }
img,svg{ display:block; max-width:100%; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 40px; }

h1,h2,h3,.eb{ font-weight:800; letter-spacing:-0.01em; }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--ink); color:var(--white);
  font-weight:800; font-size:15px;
  padding:16px 30px; border-radius:100px;
  text-decoration:none; border:none; cursor:pointer;
  transition:transform .15s ease;
}
.btn:hover{ transform:translateY(-2px); }

/* ---------- Hero ---------- */
.hero{
  background:linear-gradient(180deg, var(--grad-top) 0%, var(--grad-bottom) 100%);
  color:var(--ink);
  overflow:hidden;
}
.hero-inner{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  align-items:center;
  gap:40px;
  padding:80px 0 60px;
}
.hero-phone{
  display:flex; justify-content:center;
}
.hero-phone img{ width:min(100%, 420px); }
.hero-copy{ text-align:left; }
.hero-logo{ max-width:480px; margin-bottom:28px; }
.hero-logo img{ width:100%; height:auto; }
.hero-copy p{
  font-size:20px;
  font-weight:500;
  max-width:44ch;
  margin-bottom:34px;
}

/* ---------- Feature row ---------- */
.features{ padding:100px 0; }
.feature-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:44px;
  margin-bottom:8px;
}
.feature-card img{
  width:100%; aspect-ratio:1/1; object-fit:cover;
  border-radius:18px; margin-bottom:26px;
}
.feature-card h3{
  font-size:19px; font-weight:800; text-transform:uppercase;
  letter-spacing:0.02em; margin-bottom:12px; text-align:center;
}
.feature-card p{
  font-size:15px; color:var(--muted); text-align:center;
  max-width:34ch; margin:0 auto;
}

/* ---------- Contact ---------- */
.contact{
  background:linear-gradient(180deg, var(--grad-top) 0%, var(--grad-bottom) 100%);
  padding:90px 0;
}
.contact-inner{
  display:grid; grid-template-columns:1.3fr 1fr; align-items:center; gap:32px;
}
.contact-copy{ text-align:center; }
.contact-headline img{ max-width:520px; width:100%; margin:0 auto 20px; }
.contact-copy p{ font-size:16px; max-width:44ch; font-weight:500; margin:0 auto; }
.contact-cta{ text-align:center; }
.contact-cta .email-row{
  display:flex; align-items:center; justify-content:center; gap:10px;
  font-weight:700; font-size:16px; margin-bottom:16px;
}
.contact-cta .email-row img{ width:26px; height:auto; }
.contact-cta .btn{ width:100%; max-width:320px; }

/* ---------- Footer ---------- */
footer{ background:var(--white); padding:30px 0; }
.footer-inner{
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:16px;
}
.footer-copyright{ font-size:14px; font-weight:500; opacity:0.7; }
.footer-logo img{ height:44px; }
.footer-faq{ font-size:16px; font-weight:800; text-decoration:none; }

@media (max-width: 900px){
  .hero-inner{ grid-template-columns:1fr; text-align:center; padding-top:56px; }
  .hero-phone{ order:2; }
  .hero-copy{ order:1; text-align:center; }
  .hero-logo{ margin:0 auto 24px; }
  .hero-copy p{ margin-left:auto; margin-right:auto; }
  .feature-grid{ grid-template-columns:1fr; gap:56px; }
  .contact-inner{ grid-template-columns:1fr; text-align:center; }
  .contact-headline img{ margin:0 auto 20px; }
  .contact-copy p{ margin:0 auto; }
  .footer-inner{ flex-direction:column; text-align:center; }
}
