/* ============  Design Tokens  ============ */
:root {
  --blue:   #030148;
  --dark:   #1d1f27;
  --light:  #f7f9fe;
  --white:  #ffffff;
  --radius: 12px;
  --shadow: 0 10px 25px rgb(0 0 0 / .06);
  --max-w:  1180px;
}

/* -------- Base -------- */
*,*::before,*::after{box-sizing:border-box;}
body{
  margin:0;
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--dark);
  background:var(--light);
  line-height:1.6;
  scroll-behavior:smooth;
}
img{max-width:100%;display:block;}
.container{width:min(var(--max-w),90%);margin-inline:auto;}

/* -------- Navigation -------- */
header{
  position:sticky;top:0;z-index:1000;
  background:var(--light);
  box-shadow:0 1px 6px rgb(0 0 0 / .04);
}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.65rem 0;}
.brand{
  font-weight:700;
  font-size:clamp(2.7rem, 5.25vw, 3.6rem);
  letter-spacing:.2px;
}

.nav-links{display:flex;align-items:center;gap:2rem;list-style:none;margin:0;padding:0;}
.nav-links a{color:var(--dark);text-decoration:none;font-weight:500;}
.nav-links a.btn{
  background:var(--blue);color:var(--white);
  padding:.5rem 1.2rem;border-radius:var(--radius);
}
.nav-links a.btn:hover{background:#1a186d;}
.nav-links a:hover:not(.btn){color:var(--blue);}

.burger{display:none;background:none;border:none;cursor:pointer;}
.burger span{display:block;width:22px;height:2px;background:var(--dark);margin:4px 0;transition:.3s}

/* -------- Hero -------- */
.hero{
  padding:3rem 0 0;                         /* 3 rem top | 0 bottom */
  display:flex;flex-direction:column;align-items:flex-start;
  gap:.5rem;
}
.tagline{
  font-size:clamp(1.4rem, 3vw, 2.1rem);
  line-height:1.25;
  margin:0;
}
.accent{color:var(--blue);}
.hero p{max-width:540px;font-size:1.05rem;margin:.6rem 0 0;}

/* -------- Sections -------- */
.section{margin-block:1.9rem;}
.section h2{font-size:2rem;margin-bottom:1rem;}

/* EXTRA SPACE under About (matches hero’s top padding) */
#about{padding-bottom:3rem;}

/* -------- CTA / Contact -------- */
.cta{
  margin-top:.6rem;
  background:var(--blue);
  color:var(--white);
  padding:3rem 0;                            /* unchanged */
  text-align:center;
}
.cta-inner{max-width:660px;margin:auto;}
.cta h2{font-size:2rem;margin-bottom:.5rem;}
.cta p{margin-bottom:1.5rem;}

.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  background:var(--white);color:var(--blue);
  padding:.75rem 1.3rem;border-radius:var(--radius);
  font-weight:600;text-decoration:none;
  box-shadow:var(--shadow);transition:.25s;
}
.btn:hover{transform:translateY(-2px);}
.btn svg{width:22px;height:22px;}

/* -------- Scroll‑reveal -------- */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .6s ease,transform .6s ease;}
.reveal.visible{opacity:1;transform:none;}

/* -------- Responsive -------- */
@media(max-width:750px){
  .nav-links{
    position:fixed;inset:0 0 auto auto;background:var(--light);
    flex-direction:column;padding:5rem 2rem;gap:1.4rem;
    transform:translateX(100%);transition:transform .4s;
  }
  .nav-links.open{transform:none;}
  .burger{display:block;}
  .burger.open span:nth-child(1){transform:translateY(6px) rotate(45deg);}
  .burger.open span:nth-child(2){opacity:0;}
  .burger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
}