:root{
  --primary:#2563eb;
  --dark:#0f172a;
  --light:#f8fafc;
}

body{
  font-family:Poppins,sans-serif;
  scroll-behavior:smooth;
  background:var(--light);
  
}

.rdi20{
   border: 4px solid #fff;
  padding: 10px;
  border-radius: 50px 20px;
}


/* ================= NAVBAR ================= */
.navbar{
  transition:.4s;
   background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.1);
}
.navbar.scrolled{
  background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.1);
}
.navbar-brand{
  font-weight:700;
 
}
.nav-link{
  padding:14px 18px;
  font-weight:500;
}
.nav-link.active{
  color:var(--primary)!important;
}

/* Hamburger */
.custom-toggler{
  border:none;background:none;
}
.custom-toggler span{
  display:block;width:26px;height:3px;
  background:var(--primary);
  margin:5px 0;border-radius:5px;
  transition:.4s;
}
.custom-toggler:not(.collapsed) span:nth-child(1){
  transform:rotate(45deg) translate(6px,6px);
}
.custom-toggler:not(.collapsed) span:nth-child(2){opacity:0;}
.custom-toggler:not(.collapsed) span:nth-child(3){
  transform:rotate(-45deg) translate(6px,-6px);
}



/* ================= NAV MENU SPACING FIX ================= */

/* Ensure proper horizontal spacing */
.navbar-nav{
  gap: 8px; /* modern & clean */
}

/* Fallback for older browsers */
.navbar-nav .nav-item{
  margin-right: 6px;
}

/* Ensure clickable area spacing */
.navbar-nav .nav-link{
  padding: 14px 18px;
  white-space: nowrap;
}


/* Mega menu */
.mega-menu{
  width:620px;
  padding:20px;
  border-radius:18px;
  box-shadow:0 20px 50px rgba(0,0,0,.15);
  opacity:0;transform:translateY(20px);
  visibility:hidden;
  transition:.4s;
}
.dropdown:hover .mega-menu{
  opacity:1;transform:translateY(0);visibility:visible;
}
.mega-item{
  padding:15px;border-radius:14px;
  transition:.3s;
}
.mega-item:hover{background:#f1f5f9;}

@media(max-width:991px){
  .mega-menu{
    width:100%;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    box-shadow:none;
  }
}

/* ================= SECTIONS ================= */
section{padding:40px 0;} 


.hero{
  background:linear-gradient(135deg,#2563eb,#06b6d4);
  color:#fff;
  padding-top:130px;
}
.hero img{max-width:100%;}

/* Services */
.service-box{
  background:#fff;
  border-radius:18px;
  padding:35px;
  box-shadow:0 20px 40px rgba(0,0,0,.08);
  transition:.3s;
  height:100%;
}
.service-box:hover{transform:translateY(-8px);}

.soft-card {
  background: #ffffff;
  border-radius: 14px;
  padding: 28px;
  transition: all 0.35s ease;
  border: 1px solid #d8d8d8;
  text-align: center;              /* ✅ force center */
}

/* Hover effect */
.soft-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.08);
}

/* Soft list */
.soft-list li {
  margin-bottom: 10px;
}
.soft-list i {
  color: #0d6efd;
  margin-right: 8px;
}

.icon-circle {
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, #0d6efd, #5a9bff);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  margin: 0 auto 15px auto;        /* ✅ perfect center */
}

/* Testimonials */
.testimonial{
  background:#fff;
  padding:35px;
  border-radius:18px;
  box-shadow:0 20px 40px rgba(0,0,0,.08);
}
.testimonial img{
  width:60px;height:60px;border-radius:50%;
}


/* ================= INNER PAGE HERO ================= */

.inner-hero{
  background: linear-gradient(135deg, #2563eb, #06b6d4);
  padding: 110px 0 40px; /* height control */
  color:#fff;
}

.inner-hero h1{
  font-size:28px;
  font-weight:600;
  margin-bottom:5px;
}

.inner-hero .breadcrumb{
  background:none;
  padding:0;
  margin:0;
}

.inner-hero .breadcrumb-item,
.inner-hero .breadcrumb-item a{
  color:rgba(255,255,255,.85);
  font-size:13px;
  text-decoration:none;
}

.inner-hero .breadcrumb-item.active{
  color:#fff;
}

/* Mobile */
@media(max-width:768px){
  .inner-hero{
    padding:90px 0 30px;
  }
  .inner-hero h1{
    font-size:22px;
  }
}



/* CTA */
.cta{
  background:linear-gradient(135deg,#2563eb,#06b6d4);
  color:#fff;
  border-radius:30px;
  padding:70px 40px;
}

/* Footer */
footer{
  background:#020617;
  color:#94a3b8;
}

/* Floating buttons */
.float-btn{
  position:fixed;right:20px;z-index:999;
  width:55px;height:55px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:24px;
}
.whatsapp{bottom:90px;background:#25D366;}
.call{bottom:20px;background:#2563eb;}

/* MAIN CARD */
/* CARD BASE */
.hover-card{
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 20px 40px rgba(0,0,0,.08);
  height:100%;
}

/* IMAGE */
.card-img img{
  width:100%;
  display:block;
  object-fit:cover;
  transition:transform .7s ease, opacity .6s ease;
}

/* CONTENT */
.card-content{
  padding:25px;
  background:#fff;
  transition:.6s ease;
}

/* ================= DESKTOP ONLY EFFECT ================= */
@media (min-width:992px){

  .hover-card{
    position:relative;
    min-height:380px;
  }

  .card-img{
    position:absolute;
    inset:0;
    z-index:1;
  }

  .card-img img{
    height:100%;
  }

  .card-content{
    position:relative;
    z-index:2;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    opacity:0;
    transform:translateY(40px);
  }

  .hover-card:hover .card-img img{
    transform:scale(.85);
    opacity:0;
  }

  .hover-card:hover .card-content{
    opacity:1;
    transform:translateY(0);
  }
}

/* ================= TABLET & MOBILE ================= */
@media (max-width:991px){

  .hover-card{
    display:block;
  }

  .card-img{
    position:relative;
  }

  .card-img img{
    height:220px;
  }

  .card-content{
    opacity:1;
    transform:none;
    text-align:left;
  }
}


/* ================= ADMIN BAR FIX ================= */

/* Desktop admin bar height */
body.admin-bar .navbar.fixed-top{
  top:32px;
}

/* Mobile admin bar height */
@media (max-width:782px){
  body.admin-bar .navbar.fixed-top{
    top:46px;
  }
}

/* ================= ADMIN BAR + CONTENT FIX ================= */

/* Push entire page down when admin bar is present */
body.admin-bar{
  padding-top: 32px;
}

/* Mobile admin bar height */
@media (max-width:782px){
  body.admin-bar{
    padding-top: 46px;
  }
}

/* ================= featured image ================= */

.post-content img{
  max-width:100%;
  height:auto;
}

.post-content{
  font-size:16px;
  line-height:1.7;
}


 

/* ================= BLOG SIDEBAR – BLOCK WIDGETS ================= */

/* Sidebar column separation */
aside.col-lg-4{
  padding-left:30px;
}

/* Widget card */
aside.col-lg-4 .sidebar-widget{
  background:#ffffff;
  border-radius:16px;
  padding:22px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  border:1px solid #eef2f7;
}

/* Give space between widgets */
aside.col-lg-4 .sidebar-widget + .sidebar-widget{
  margin-top:25px;
}

/* Block widget lists */
aside.col-lg-4 ul{
  list-style:none;
  padding:0;
  margin:0;
}

/* List items */
aside.col-lg-4 ul li{
  padding:10px 0;
  border-bottom:1px dashed #e5e7eb;
}

aside.col-lg-4 ul li:last-child{
  border-bottom:none;
}

/* Links */
aside.col-lg-4 ul li a{
  color:#334155;
  font-size:15px;
  text-decoration:none;
  display:block;
  transition:all .3s ease;
}

/* Hover effect */
aside.col-lg-4 ul li a:hover{
  color:#2563eb;
  padding-left:6px;
}


/* Sidebar block headings */
aside.col-lg-4 h2,
aside.col-lg-4 h3,
aside.col-lg-4 h4{
  font-size:18px;
  font-weight:600;
  margin-bottom:16px;
  position:relative;
}

/* Accent underline */
aside.col-lg-4 h2::after,
aside.col-lg-4 h3::after,
aside.col-lg-4 h4::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-6px;
  width:45px;
  height:3px;
  background:linear-gradient(135deg,#2563eb,#06b6d4);
  border-radius:5px;
}


/* ================= BLOG THUMBNAIL FIX ================= */

.blog-thumb{
  width:200px;
  height:130px;
  flex-shrink:0;
  overflow:hidden;
  border-radius:10px;
  background:#f1f5f9;
}

.blog-thumb-img{
  width:100%;
  height:100%;
  object-fit:cover; /* KEY */
  display:block;
}


@media(max-width:768px){
  .blog-thumb{
    width:100%;
    height:180px;
    margin-bottom:10px;
  }
}

/* ================= SUBMENU BASE FIX ================= */

/* Hide all submenus initially */
.navbar-nav .sub-menu{
  display:none;
  list-style:none;
  margin:0;
  padding:8px 0;
}


.navbar-nav .current-menu-item > .nav-link{
  background:#7CFC8A;
}

/* Desktop only */
@media (min-width:992px){

  .navbar-nav .menu-item-has-children{
    position:relative;
  }

  .navbar-nav .menu-item-has-children > .sub-menu{
    position:absolute;
    top:100%;
    left:0;
    min-width:220px;
    background:#ffffff;
    border-radius:12px;
    box-shadow:0 15px 40px rgba(0,0,0,.15);
    z-index:999;
  }

  /* Show on hover */
  .navbar-nav .menu-item-has-children:hover > .sub-menu{
    display:block;
    animation:submenuFade .25s ease;
  }
}

/* Animation */
@keyframes submenuFade{
  from{
    opacity:0;
    transform:translateY(8px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}


/* ================= DESKTOP SUBMENU ARROW ================= */
@media (min-width:992px){

  .navbar-nav .menu-item-has-children > .nav-link::after{
    content:"▾";
    margin-left:6px;
    font-size:12px;
    display:inline-block;
    transition:transform .3s ease;
  }

  /* Rotate arrow on hover */
  .navbar-nav .menu-item-has-children:hover > .nav-link::after{
    transform:rotate(180deg);
  }

}

/* ================= DESKTOP ACTIVE PARENT ================= */
@media (min-width:992px){

  /* Active page OR active parent */
  .navbar-nav .current-menu-item > .nav-link,
  .navbar-nav .current-menu-parent > .nav-link{
    background:#7CFC8A;
    color:#000;
  }

}


/* ================= BLOG MOBILE FIX ================= */
@media (max-width:768px){

  .blog-item{
    flex-direction:column; /* STACK image + content */
  }

  .blog-thumb{
    width:100%;
    height:180px;
    margin-right:0;
    margin-bottom:12px;
  }

  .blog-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:10px;
  }

  .blog-content{
    width:100%;
  }
}






/* mobile menu */
/* ================= MOBILE MENU FINAL DESIGN ================= */
@media (max-width:991px){

  /* Entire mobile menu panel */
  .navbar-collapse{
    background:#002c45;
    padding:0;
  }
	

  /* Menu list */
  .navbar-nav{
    width:100%;
  }

  /* Top-level menu items */
  .navbar-nav > .nav-item > .nav-link{
    color:#ffffff;
    padding:14px 18px;
    font-size:16px;
    font-weight:500;
    border-bottom:1px solid rgba(255,255,255,.12);
    background:transparent;
  }

  /* Hover */
  .navbar-nav > .nav-item > .nav-link:hover{
    background:rgba(255,255,255,.05);
  }

  /* ACTIVE MENU (TEXT ONLY – NO BG) */
  .navbar-nav .current-menu-item > .nav-link,
  .navbar-nav .current-menu-parent > .nav-link{
    color:#7CFC8A; /* light green */
    background:transparent;
  }

  /* Submenu base */
  .navbar-nav .sub-menu{
    background:#003e5f;
    padding:0;
    margin:0;
    border-radius:0;
  }

  /* Submenu links */
  .navbar-nav .sub-menu .nav-link{
    color:#ffffff;
    padding:12px 28px;
    font-size:15px;
    border-bottom:1px solid rgba(255,255,255,.10);
  }

  .navbar-nav .sub-menu .nav-link:hover{
    background:rgba(255,255,255,.06);
  }

  /* Arrow indicator */
  .menu-item-has-children > .nav-link::after{
    content:"▾";
    float:right;
    font-size:14px;
    transition:transform .3s ease;
  }

  /* Rotate arrow on open */
  .menu-item-has-children.open > .nav-link::after{
    transform:rotate(180deg);
  }

}


.img-wrap{

}


/* Animation */

.bubble{
  position: absolute;
  bottom: 20px;
  background: rgba(255,255,255,0.35);
  border-radius: 50%;
  animation: floatUp 6s infinite ease-in-out;
}

.b1{ width:20px;height:20px;left:20%;animation-delay:0s;}
.b2{ width:30px;height:30px;left:40%;animation-delay:2s;}
.b3{ width:15px;height:15px;left:60%;animation-delay:4s;}
.b4{ width:35px;height:35px;left:75%;animation-delay:4s;}
.arrrow{width:35px;height:35px;left:75%;animation-delay:4s;}

@keyframes floatUp{
  0%{ transform:translateY(0); opacity:0;}
  30%{opacity:1;}
  100%{ transform:translateY(-300px); opacity:0;}
}

/* Thin policy bar above footer */
.policy-bar {
  background: #272424;      /* dark grey */
  padding: 6px 10px;        /* thin height */
  text-align: center;
  font-size: 12px;          /* small font */
  line-height: 1.4;
}

.policy-bar a {
  color: #bfbfbf;           /* light grey text */
  text-decoration: underline;
  margin: 0 4px;
  transition: color 0.3s ease;
}

.policy-bar a:hover {
  color: #ffffff;
}

.policy-bar span {
  color: #8f8f8f;
  margin: 0 4px;
}

/* Mobile optimization */
@media (max-width: 576px) {
  .policy-bar {
    font-size: 11px;
  }
}




/* Force green active tab in Bootstrap 5 (WordPress override fix) */
.nav-tabs .nav-link.active,
.nav-tabs .nav-link.active:focus,
.nav-tabs .nav-link.active:hover {
    background-color: #198754 !important;
    color: #ffffff !important;
    border-color: #198754 #198754 transparent !important;
	border: 1px solid #747474;
}

/* Normal (inactive) tabs */
.nav-tabs .nav-link {
    color: #198754 !important;
    font-weight: 600;
	border: 1px solid #747474;
}

.nav-tabs {
    border-bottom: 2px solid #198754;
}

.tab-content {
    	border: 1px solid #747474;
    border-top: none;
    padding: 10px;
    background: #fff;
}
