:root{
  --ew-navy:#1e2a64;
  --ew-blue:#3aa6ff;
  --ew-sky:#e9f6ff;
  --ew-dark:#0f1637;
}

html, body { height: 100%; }
body{
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  padding-bottom: 76px; /* space for sticky footer nav */
  background: radial-gradient(1200px 600px at 10% -10%, rgba(58,166,255,.20), transparent 60%),
              radial-gradient(900px 500px at 110% 10%, rgba(30,42,100,.22), transparent 55%),
              #ffffff;
}

.ew-topbar{
  background: linear-gradient(90deg, var(--ew-navy), var(--ew-dark));
  color: #fff;
  font-size: .95rem;
}

.ew-topbar a{ color:#fff; text-decoration: none; opacity:.95; }
.ew-topbar a:hover{ text-decoration: underline; opacity:1; }

.navbar-brand img{ display:block; height:56px; width:auto; }
.navbar{ backdrop-filter: blur(8px); }
.ew-nav{
  background: rgba(15,22,55,.92);
  border-top: 1px solid rgba(255,255,255,.08);
}
.ew-nav .nav-link{
  color: rgba(255,255,255,.88);
  font-weight: 600;
  padding: .75rem .85rem;
  border-radius: 1rem;
}
.ew-nav .nav-link:hover, .ew-nav .nav-link:focus{
  color:#fff;
  background: rgba(58,166,255,.14);
}
.ew-nav .nav-link.active{
  color:#fff;
  background: rgba(58,166,255,.22);
  border: 1px solid rgba(58,166,255,.25);
}

.hero{
  position: relative;
  overflow: hidden;
  border-radius: 1.75rem;
  background: linear-gradient(135deg, rgba(30,42,100,.96), rgba(15,22,55,.98));
  color:#fff;
  box-shadow: 0 18px 50px rgba(15,22,55,.22);
}

.hero::before{
  content:"";
  position:absolute; inset:-40% -20% auto auto;
  width: 520px; height: 520px;
  background: radial-gradient(circle at 30% 30%, rgba(58,166,255,.65), transparent 60%);
  filter: blur(2px);
  transform: rotate(18deg);
  opacity:.9;
}

.hero .badge{
  background: rgba(58,166,255,.20);
  border: 1px solid rgba(58,166,255,.30);
  color:#d9f1ff;
}

.eyebrow{
  font-family: "Sora", system-ui, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .8rem;
  opacity: .9;
}

.hero h1{
  font-family: "Sora", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.hero p.lead{ color: rgba(255,255,255,.85); max-width: 50ch; }

.btn-ew{
  --bs-btn-bg: var(--ew-blue);
  --bs-btn-border-color: var(--ew-blue);
  --bs-btn-hover-bg: #2e9cff;
  --bs-btn-hover-border-color: #2e9cff;
  --bs-btn-color: #001018;
  font-weight: 700;
  border-radius: 999px;
}

.btn-outline-ew{
  --bs-btn-color: #ffffff;
  --bs-btn-border-color: rgba(255,255,255,.35);
  --bs-btn-hover-bg: rgba(255,255,255,.12);
  --bs-btn-hover-border-color: rgba(255,255,255,.5);
  border-radius: 999px;
  font-weight: 700;
}

.section-title{
  font-family: "Sora", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.card{
  border: 1px solid rgba(15,22,55,.08);
  border-radius: 1.25rem;
  box-shadow: 0 10px 24px rgba(15,22,55,.06);
}
.card .icon{
  width: 44px; height: 44px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(58,166,255,.16);
  border: 1px solid rgba(58,166,255,.22);
  color: var(--ew-navy);
}

.carousel-caption{
  text-align: left;
  bottom: 1.4rem;
}
.carousel-caption .cap-box{
  background: rgba(15,22,55,.72);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 1.25rem;
  padding: 1rem 1.1rem;
  max-width: 560px;
  backdrop-filter: blur(10px);
}
.carousel-caption h3{
  font-family: "Sora", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.carousel-caption p{ margin-bottom: 0; color: rgba(255,255,255,.86); }

.carousel-item img{
  height: 520px;
  object-fit: cover;
}
@media (max-width: 991.98px){
  .carousel-item img{ height: 420px; }
}
@media (max-width: 575.98px){
  body{ padding-bottom: 86px; }
  .carousel-item img{ height: 360px; }
}

.kpi{
  background: linear-gradient(180deg, rgba(233,246,255,.9), rgba(255,255,255,.9));
  border: 1px solid rgba(15,22,55,.07);
  border-radius: 1.25rem;
}

.faq .accordion-button{
  font-weight: 700;
}
.faq .accordion-item{
  border-radius: 1rem !important;
  overflow:hidden;
  border: 1px solid rgba(15,22,55,.10);
}

.cta-strip{
  background: linear-gradient(135deg, rgba(58,166,255,.16), rgba(30,42,100,.10));
  border: 1px solid rgba(58,166,255,.18);
  border-radius: 1.5rem;
}

.small-muted{ color: rgba(15,22,55,.72); }
