:root{
  --primary:#0f2c4d;
  --primary-light:#173a63;
  --secondary:#0ea5e9;
  --accent:#14b8a6;
  --warm:#f59e0b;
  --warm-dark:#d97706;
  --light:#f8fafc;
  --gray:#64748b;
  --dark:#0f172a;
  --gradient-1: linear-gradient(135deg, #0f2c4d 0%, #0ea5e9 100%);
  --gradient-2: linear-gradient(135deg, #14b8a6 0%, #0ea5e9 100%);
  --gradient-3: linear-gradient(135deg, #f59e0b 0%, #ef4444 100%);
  --shadow:0 10px 30px rgba(15,44,77,0.08);
  --shadow-lg:0 20px 50px rgba(15,44,77,0.12);
}

*{scroll-behavior:smooth}
body{
  font-family:'Inter', system-ui, -apple-system, sans-serif;
  color:var(--dark);
  background:#fff;
  line-height:1.7;
}
h1,h2,h3,h4,h5{font-family:'Outfit', sans-serif; font-weight:700; line-height:1.2}

/* NAVBAR */
.navbar{
  background:rgba(255,255,255,0.95)!important;
  backdrop-filter:blur(12px);
  box-shadow:0 2px 20px rgba(0,0,0,0.06);
  padding:14px 0;
}
.navbar-brand{
  font-weight:800;
  font-size:1.5rem;
  letter-spacing:-0.02em;
}
.navbar-brand span:first-child{color:var(--primary)}
.navbar-brand span:last-child{color:var(--accent)}
.nav-link{
  font-weight:500;
  color:var(--dark)!important;
  margin:0 6px;
  position:relative;
}
.nav-link:after{
  content:'';
  position:absolute;
  bottom:0;
  left:50%;
  width:0;
  height:2px;
  background:var(--accent);
  transition:all .3s;
  transform:translateX(-50%);
}
.nav-link:hover:after,.nav-link.active:after{width:70%}
.btn-primary{
  background:var(--gradient-1);
  border:none;
  padding:10px 24px;
  font-weight:600;
  border-radius:50px;
  box-shadow:0 4px 14px rgba(14,165,233,0.3);
}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(14,165,233,0.4)}
.btn-accent{
  background:var(--accent);
  color:#fff;
  border:none;
  padding:10px 24px;
  font-weight:600;
  border-radius:50px;
}
.btn-warm{
  background:var(--warm);
  color:#fff;
  border:none;
  padding:10px 24px;
  font-weight:600;
  border-radius:50px;
}
.btn-warm:hover{background:var(--warm-dark); color:#fff; transform:translateY(-2px)}

/* HERO */
.hero{
  background:var(--gradient-1);
  color:#fff;
  padding:110px 0 90px;
  position:relative;
  overflow:hidden;
}
.hero:before{
  content:'';
  position:absolute;
  top:-20%;
  right:-15%;
  width:60%;
  height:140%;
  background:radial-gradient(circle, rgba(20,184,166,0.25) 0%, transparent 70%);
  pointer-events:none;
}
.hero:after{
  content:'';
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:80px;
  background:#fff;
  clip-path:ellipse(75% 100% at 50% 100%);
}
.hero h1{
  font-size:3.4rem;
  font-weight:800;
  line-height:1.1;
}
.hero h1 span{color:var(--warm)}
.hero .lead{color:rgba(255,255,255,0.85); font-size:1.18rem}
.hero-card{
  background:#fff;
  border-radius:20px;
  padding:28px;
  box-shadow:var(--shadow-lg);
  color:var(--dark);
}
.hero-stats{
  background:rgba(255,255,255,0.1);
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.15);
  border-radius:16px;
  padding:18px;
}

/* SECTIONS */
.section{padding:85px 0}
.section-light{background:var(--light)}
.badge-soft{
  background:rgba(20,184,166,0.12);
  color:var(--accent);
  padding:6px 14px;
  border-radius:50px;
  font-weight:600;
  font-size:0.85rem;
  letter-spacing:0.04em;
}
.badge-warm{background:rgba(245,158,11,0.15); color:var(--warm-dark)}
.section-title{font-size:2.6rem; margin-bottom:12px}
.section-title span{color:var(--secondary)}

/* SERVICE CARD */
.service-card{
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:all .35s ease;
  height:100%;
  border:1px solid #f1f5f9;
}
.service-card:hover{transform:translateY(-8px); box-shadow:var(--shadow-lg)}
.service-card img{height:210px; width:100%; object-fit:cover}
.service-card .card-body{padding:24px}
.service-card h5{font-size:1.25rem; margin-bottom:10px}
.service-card p{color:var(--gray); font-size:0.95rem; min-height:58px}
.service-icon{
  width:54px; height:54px;
  border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; margin-bottom:14px;
}

/* WHY US */
.feature-box{
  background:#fff;
  border-radius:16px;
  padding:26px;
  box-shadow:var(--shadow);
  border-left:4px solid var(--accent);
  height:100%;
}
.feature-box.warm{border-left-color:var(--warm)}
.feature-box.blue{border-left-color:var(--secondary)}

/* PROCESS */
.process-step{
  text-align:center;
  position:relative;
}
.process-number{
  width:64px; height:64px;
  background:var(--gradient-2);
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:1.3rem;
  margin:0 auto 16px;
  box-shadow:0 8px 20px rgba(20,184,166,0.3);
}
.process-step:not(:last-child):after{
  content:'';
  position:absolute;
  top:32px;
  left:60%;
  width:80%;
  height:2px;
  background:linear-gradient(90deg, var(--accent), transparent);
}
@media(max-width:768px){
  .process-step:not(:last-child):after{display:none}
}

/* TESTIMONIAL */
.testimonial-card{
  background:#fff;
  border-radius:18px;
  padding:28px;
  box-shadow:var(--shadow);
  height:100%;
  position:relative;
}
.testimonial-card:before{
  content:'“';
  position:absolute;
  top:12px;
  left:20px;
  font-size:4rem;
  color:rgba(20,184,166,0.15);
  font-family:serif;
  line-height:1;
}
.stars{color:var(--warm); font-size:1.1rem}

/* CTA */
.cta-section{
  background:var(--dark);
  color:#fff;
  border-radius:24px;
  padding:60px 40px;
  position:relative;
  overflow:hidden;
}
.cta-section:before{
  content:'';
  position:absolute;
  top:-30%;
  right:-20%;
  width:50%;
  height:160%;
  background:radial-gradient(circle, rgba(14,165,233,0.25), transparent 70%);
}

/* BLOG */
.blog-card{
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:.3s;
  height:100%;
}
.blog-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg)}
.blog-card img{height:220px; object-fit:cover; width:100%}
.blog-content{padding:22px}
.blog-meta{font-size:0.85rem; color:var(--gray)}

/* FORMS */
.form-control, .form-select{
  border-radius:12px;
  padding:12px 16px;
  border:1px solid #e2e8f0;
}
.form-control:focus{box-shadow:0 0 0 4px rgba(14,165,233,0.15); border-color:var(--secondary)}
.contact-info-card{
  background:#fff;
  border-radius:16px;
  padding:22px;
  box-shadow:var(--shadow);
}

/* FOOTER */
footer{
  background:#0b1e35;
  color:rgba(255,255,255,0.8);
  padding:70px 0 0;
}
footer h6{color:#fff; font-weight:700; margin-bottom:18px}
footer a{color:rgba(255,255,255,0.7); text-decoration:none; display:block; padding:4px 0}
footer a:hover{color:#fff; padding-left:4px}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,0.1);
  margin-top:50px;
  padding:22px 0;
  font-size:0.9rem;
  color:rgba(255,255,255,0.5);
}

/* SINGLE BLOG */
.single-blog-content p{margin-bottom:1.4rem; font-size:1.05rem; color:#334155}
.single-blog-content h3{margin:32px 0 16px; color:var(--primary)}
.single-blog-content ul{margin-bottom:20px}
.single-blog-content li{margin-bottom:8px; color:#334155}

/* ANIM */
.fade-up{animation:fadeUp .8s ease}
@keyframes fadeUp{from{opacity:0; transform:translateY(20px)} to{opacity:1; transform:translateY(0)}}

/* ALERTS */
.alert-custom{
  border-radius:12px;
  padding:14px 18px;
}
