/* ============================================
   HANS & GATES — Brand Overrides v3
   ============================================ */
:root {
    --hg-navy:   #1a3a6b;
    --hg-navy-d: #0f2244;
    --hg-orange: #e8420a;
    --hg-orange-h: #c43208;
    --hg-light:  #f3f4f6;
    --hg-white:  #ffffff;
    --hg-gray:   #6b7280;
}

/* LOGO — show only one */
.navbar-brand { padding: 10px 0; }
.navbar-brand img.logo { display: none !important; }
.navbar-brand img.logo-dark { display: block !important; height: 52px; width: auto; }

/* TOPBAR */
.topbar { background: var(--hg-navy-d); border-bottom: 1px solid rgba(255,255,255,0.08); }
.topbar a, .topbar span, .top-contact li { color: rgba(255,255,255,0.72) !important; font-size: 12.5px; }
.topbar a:hover { color: var(--hg-orange) !important; }

/* NAVBAR */
.navbar-primary { background: var(--hg-white); box-shadow: 0 2px 24px rgba(0,0,0,0.10); }
.navbar-primary .nav > li > a { color: var(--hg-navy) !important; font-weight: 700; font-size: 13px; letter-spacing: 0.8px; text-transform: uppercase; padding: 28px 15px; position: relative; transition: color 0.25s; }
.navbar-primary .nav > li > a::after { content:''; position:absolute; bottom:0; left:50%; right:50%; height:3px; background:var(--hg-orange); transition: left 0.25s, right 0.25s; }
.navbar-primary .nav > li > a:hover::after,
.navbar-primary .nav > li.active > a::after { left:0; right:0; }
.navbar-primary .nav > li > a:hover,
.navbar-primary .nav > li.active > a { color: var(--hg-orange) !important; }

/* BUTTONS */
.quote-btn .btn, .btn-primary, .btn { background:var(--hg-orange)!important; border-color:var(--hg-orange)!important; color:var(--hg-white)!important; text-transform:uppercase; font-weight:700; letter-spacing:1px; font-size:12px; border-radius:2px; padding:11px 22px; transition:all 0.28s ease; }
.quote-btn .btn:hover, .btn:hover { background:var(--hg-orange-h)!important; border-color:var(--hg-orange-h)!important; transform:translateY(-2px); box-shadow:0 8px 22px rgba(232,66,10,0.32); }
.btn.btn-outline, .btn-alt.btn-outline { background:transparent!important; border:2px solid var(--hg-white)!important; color:var(--hg-white)!important; }
.btn.btn-outline:hover, .btn-alt.btn-outline:hover { background:var(--hg-orange)!important; border-color:var(--hg-orange)!important; }
.btn-link { color:var(--hg-orange)!important; font-weight:700; text-transform:uppercase; font-size:12px; letter-spacing:1px; }
.btn-link:hover { color:var(--hg-navy)!important; }
.btn-light { background:var(--hg-white)!important; color:var(--hg-navy)!important; border-color:var(--hg-white)!important; }
.btn-light:hover { background:var(--hg-orange)!important; border-color:var(--hg-orange)!important; color:white!important; }
.cta-sameline .btn-light { background:var(--hg-white)!important; color:var(--hg-navy)!important; }
.cta-sameline .btn-light:hover { background:var(--hg-orange)!important; color:white!important; }

/* MEGA MENU */
.navbar-primary li.megamenu-services { position: static !important; }
.megamenu-services > .dropdown-menu { left:0!important; right:0!important; width:100%!important; padding:0!important; border:none!important; border-top:4px solid var(--hg-orange)!important; border-radius:0!important; box-shadow:0 20px 60px rgba(0,0,0,0.18)!important; background:var(--hg-white)!important; margin-top:0!important; }
.megamenu-inner { display:flex; width:100%; }
.megamenu-col { flex:1; border-right:1px solid #f0f0f0; transition:background 0.2s; }
.megamenu-col:last-child { border-right:none; }
.megamenu-col:hover { background:#fafbff; }
.megamenu-col > a { display:block; padding:28px 22px; text-decoration:none!important; color:inherit!important; }
.mm-icon-wrap { width:50px; height:50px; background:rgba(232,66,10,0.08); display:flex; align-items:center; justify-content:center; margin-bottom:14px; transition:background 0.25s; }
.megamenu-col:hover .mm-icon-wrap { background:var(--hg-orange); }
.mm-icon-wrap i { font-size:20px; color:var(--hg-orange); transition:color 0.25s; }
.megamenu-col:hover .mm-icon-wrap i { color:white; }
.mm-title { font-size:13px; font-weight:700; color:var(--hg-navy); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:6px; display:block; transition:color 0.2s; }
.megamenu-col:hover .mm-title { color:var(--hg-orange); }
.mm-sub { font-size:12px; color:var(--hg-gray); line-height:1.5; display:block; }
.megamenu-footer { background:var(--hg-navy); padding:14px 28px; display:flex; align-items:center; justify-content:space-between; }
.megamenu-footer span { color:rgba(255,255,255,0.6); font-size:12.5px; }
.megamenu-footer a.btn { padding:8px 20px!important; font-size:11px!important; }

/* Standard dropdowns */
.navbar-primary .dropdown-menu { border-top:3px solid var(--hg-orange); box-shadow:0 12px 40px rgba(0,0,0,0.14); border-radius:0; padding:8px 0; }
.navbar-primary .dropdown-menu > li > a { color:var(--hg-white)!important; font-size:13px; padding:9px 20px; transition:all 0.2s; }
.navbar-primary .dropdown-menu > li > a:hover { color:var(--hg-orange)!important; background:#f8f9ff; padding-left:26px; }

/* HERO SLIDER */
.banner.banner-slider { height: 100vh; min-height: 620px; }
.banner .fill { height:100vh; min-height:620px; background-size:cover; background-position:center; position:relative; }
.banner .fill::before { content:''; position:absolute; inset:0; background:linear-gradient(110deg, rgba(10,25,60,0.82) 0%, rgba(10,25,60,0.45) 55%, rgba(10,25,60,0.12) 100%); }
.banner-content { position:absolute; top:50%; transform:translateY(-50%); width:100%; z-index:10; }
.banner-text h2 { font-size:52px; font-weight:800; line-height:1.12; color:#fff; text-transform:uppercase; letter-spacing:-0.5px; margin-bottom:18px; }
.banner-text p { font-size:16px; color:rgba(255,255,255,0.85); max-width:540px; line-height:1.75; margin-bottom:34px; }
.slide-tag { display:inline-block; background:var(--hg-orange); color:white; font-size:10.5px; font-weight:800; letter-spacing:3px; text-transform:uppercase; padding:6px 18px; margin-bottom:22px; }

/* Progress bar */
.slider-progress { position:absolute; bottom:0; left:0; width:0%; height:4px; background:var(--hg-orange); z-index:30; transition:width 0s linear; }
.slider-progress.animating { width:100%; transition:width 5s linear; }

/* CAROUSEL ARROWS — redesigned */
.carousel-control { background:none!important; width:80px!important; top:0!important; bottom:0!important; display:flex!important; align-items:center!important; justify-content:center!important; opacity:1!important; transition:background 0.3s!important; margin:0!important; }
.carousel-control.left { left:0; background:linear-gradient(to right, rgba(10,25,60,0.5), transparent)!important; }
.carousel-control.right { right:0; background:linear-gradient(to left, rgba(10,25,60,0.5), transparent)!important; }
.carousel-control.left:hover { background:linear-gradient(to right, rgba(232,66,10,0.7), transparent)!important; }
.carousel-control.right:hover { background:linear-gradient(to left, rgba(232,66,10,0.7), transparent)!important; }
.carousel-control .arrow-btn { width:54px; height:54px; border:2px solid rgba(255,255,255,0.5); display:flex; align-items:center; justify-content:center; transition:all 0.3s ease; background:rgba(255,255,255,0.06); }
.carousel-control:hover .arrow-btn { border-color:var(--hg-orange); background:var(--hg-orange); }
.carousel-control .arrow-btn i { font-size:18px; color:white; }
.carousel-control .glyphicon { display:none!important; }

/* Indicators */
.carousel-indicators { bottom:28px; margin:0; }
.carousel-indicators li { width:36px; height:3px; border-radius:0; border:none; background:rgba(255,255,255,0.35); margin:0 5px; transition:all 0.3s; }
.carousel-indicators .active { background:var(--hg-orange); width:56px; }

/* STATS */
.section-stats { background:var(--hg-navy); padding:60px 0; }
.stat-item { text-align:center; padding:16px 10px; }
.stat-number { font-size:50px; font-weight:800; color:var(--hg-orange); line-height:1; display:block; }
.stat-label { font-size:12px; color:rgba(255,255,255,0.65); text-transform:uppercase; letter-spacing:2px; margin-top:8px; display:block; }
.stat-divider { border-right:1px solid rgba(255,255,255,0.12); }

/* HEADINGS */
.heading-section { color:var(--hg-navy); font-weight:800; }
.heading-section::after { content:''; display:block; width:48px; height:4px; background:var(--hg-orange); margin:14px auto 0; }
h2 { color:var(--hg-navy); }

/* SERVICE CARDS */
.section-services { background:#fff; }
.feature.boxed { border-radius:0; transition:all 0.32s ease; box-shadow:0 2px 18px rgba(0,0,0,0.07); border-bottom:3px solid transparent; overflow:hidden; background:#fff; }
.feature.boxed:hover { transform:translateY(-7px); box-shadow:0 20px 50px rgba(0,0,0,0.13); border-bottom-color:var(--hg-orange); }
.feature.boxed .fbox-photo { overflow:hidden; height:220px; }
.feature.boxed .fbox-photo img { width:100%; height:100%; object-fit:cover; transition:transform 0.55s ease; }
.feature.boxed:hover .fbox-photo img { transform:scale(1.07); }
.fbox-content { padding:22px 24px 26px; }
.fbox-content h3 { font-size:15.5px; font-weight:700; color:var(--hg-navy); margin-bottom:9px; }
.fbox-content h3 a { color:var(--hg-navy)!important; }
.fbox-content h3 a:hover { color:var(--hg-orange)!important; }
.fbox-content p { font-size:13.5px; color:var(--hg-gray); line-height:1.68; }

/* SUB-SERVICE CARDS (on main service page) */
.ss-card { background:white; display:flex; overflow:hidden; margin-bottom:20px; box-shadow:0 2px 16px rgba(0,0,0,0.07); transition:all 0.3s ease; text-decoration:none!important; border-left:4px solid transparent; }
.ss-card:hover { box-shadow:0 12px 36px rgba(0,0,0,0.13); transform:translateY(-4px); border-left-color:var(--hg-orange); }
.ss-card-img { width:170px; min-width:170px; overflow:hidden; }
.ss-card-img img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s; }
.ss-card:hover .ss-card-img img { transform:scale(1.07); }
.ss-card-body { padding:22px 24px; flex:1; }
.ss-card-body h4 { font-size:15px; font-weight:700; color:var(--hg-navy); margin-bottom:7px; }
.ss-card-body p { font-size:13.5px; color:var(--hg-gray); line-height:1.65; margin-bottom:12px; }

/* MINI sub-service grid (on individual service pages, 2x2) */
.sub-service-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:32px; }
.sub-card { border:1px solid #e8eaf0; padding:22px 20px; transition:all 0.28s ease; display:block; text-decoration:none!important; background:#fff; position:relative; overflow:hidden; }
.sub-card::before { content:''; position:absolute; bottom:0; left:0; width:0; height:3px; background:var(--hg-orange); transition:width 0.3s ease; }
.sub-card:hover::before { width:100%; }
.sub-card:hover { box-shadow:0 10px 30px rgba(0,0,0,0.10); transform:translateY(-3px); border-color:transparent; }
.sub-card .sc-icon { width:44px; height:44px; background:rgba(232,66,10,0.08); display:flex; align-items:center; justify-content:center; margin-bottom:14px; transition:background 0.25s; }
.sub-card:hover .sc-icon { background:var(--hg-orange); }
.sub-card .sc-icon i { font-size:18px; color:var(--hg-orange); transition:color 0.25s; }
.sub-card:hover .sc-icon i { color:white; }
.sub-card h4 { font-size:13.5px; font-weight:700; color:var(--hg-navy); margin-bottom:6px; }
.sub-card p { font-size:12.5px; color:var(--hg-gray); margin:0; line-height:1.55; }
.sub-card .sc-link { display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:700; color:var(--hg-orange); text-transform:uppercase; letter-spacing:0.8px; margin-top:12px; }

/* WHY US */
.why-item { display:flex; align-items:flex-start; gap:18px; margin-bottom:28px; }
.why-icon { width:52px; height:52px; min-width:52px; background:var(--hg-orange); display:flex; align-items:center; justify-content:center; color:white; font-size:20px; flex-shrink:0; }
.why-text h4 { color:var(--hg-navy); font-weight:700; font-size:15.5px; margin-bottom:5px; }
.why-text p { color:var(--hg-gray); font-size:13.5px; line-height:1.65; margin:0; }

/* CTA */
.call-action { background:var(--hg-navy); }
.call-action h2, .call-action h3 { color:#fff; }
.call-action p { color:rgba(255,255,255,0.78); }

/* TESTIMONIALS */
.section-quotes { background:#f8f9fb; }
.quotes-text p { font-size:16px; font-style:italic; color:#374151; line-height:1.82; }
.profile h5 { color:var(--hg-navy); font-weight:700; }
.profile h6 { color:var(--hg-orange); }

/* FOOTER */
.site-footer { background:#0a1a35; }
.site-footer h4 { color:var(--hg-white); font-size:13px; text-transform:uppercase; letter-spacing:2px; border-bottom:2px solid var(--hg-orange); padding-bottom:12px; margin-bottom:18px; }
.site-footer a { color:rgba(255,255,255,0.60)!important; }
.site-footer a:hover { color:var(--hg-orange)!important; }
.site-footer p { color:rgba(255,255,255,0.52); font-size:13.5px; }
.footer-bottom { background:#060f22; padding:18px 0; border-top:1px solid rgba(255,255,255,0.06); }
.footer-bottom p { color:rgba(255,255,255,0.38); font-size:12.5px; margin:0; }

/* INNER BANNER */
.banner-inner { background-size:cover; background-position:center; padding:110px 0 65px; position:relative; }
.banner-inner::before { content:''; position:absolute; inset:0; background:linear-gradient(110deg, rgba(10,25,60,0.88) 0%, rgba(10,25,60,0.55) 100%); }
.banner-inner .container { position:relative; z-index:2; }
.banner-inner h1 { color:white; font-size:36px; font-weight:800; text-transform:uppercase; margin-bottom:10px; }
.breadcrumb-wrap a, .breadcrumb-wrap span { color:rgba(255,255,255,0.65); font-size:13px; }
.breadcrumb-wrap .sep { margin:0 8px; color:var(--hg-orange); }
.breadcrumb-wrap .current { color:var(--hg-orange); }

/* SERVICE/SUB-SERVICE DETAIL */
.service-detail-wrap { padding:72px 0; }
.service-detail-wrap h2 { color:var(--hg-navy); font-weight:800; margin-bottom:16px; }
.service-detail-wrap h2::after { content:''; display:block; width:46px; height:4px; background:var(--hg-orange); margin-top:14px; }
.service-detail-wrap p { color:var(--hg-gray); font-size:14.5px; line-height:1.85; }
.feature-list { list-style:none; padding:0; margin:0 0 24px; }
.feature-list li { padding:11px 0 11px 28px; border-bottom:1px solid #f0f0f0; color:#374151; font-size:14px; position:relative; }
.feature-list li::before { content:'\f00c'; font-family:'FontAwesome'; position:absolute; left:0; color:var(--hg-orange); font-size:12px; top:13px; }
.service-sidebar { background:var(--hg-light); padding:28px; border-left:4px solid var(--hg-orange); margin-bottom:24px; }
.service-sidebar h4 { color:var(--hg-navy); font-weight:700; margin-bottom:14px; font-size:14px; text-transform:uppercase; letter-spacing:1px; }
.service-sidebar ul { list-style:none; padding:0; margin:0; }
.service-sidebar ul li a { color:#374151!important; font-size:13.5px; padding:9px 0; display:flex; align-items:center; gap:8px; border-bottom:1px solid #e5e7eb; transition:all 0.2s; }
.service-sidebar ul li a:hover { color:var(--hg-orange)!important; padding-left:6px; }
.service-sidebar ul li.active a { color:var(--hg-orange)!important; font-weight:700; }
.service-sidebar ul li:last-child a { border-bottom:none; }
.contact-sidebar { background:var(--hg-navy); padding:28px; border-left:4px solid var(--hg-orange); }
.contact-sidebar h4 { color:white; font-weight:700; margin-bottom:14px; font-size:14px; text-transform:uppercase; letter-spacing:1px; }
.contact-sidebar p { color:rgba(255,255,255,0.68); font-size:13.5px; margin-bottom:10px; }
.contact-sidebar p i { color:var(--hg-orange); margin-right:8px; }
.contact-sidebar a.btn { margin-top:8px; width:100%; text-align:center; display:block; }

/* PROJECTS */
.feature-project .fbox-content h3 a { color:var(--hg-navy)!important; }
.feature-project .fbox-content h3 a:hover { color:var(--hg-orange)!important; }
.feature-project.boxed:hover { border-bottom-color:var(--hg-orange); }

/* BACK TO TOP */
#back-to-top { position:fixed; bottom:28px; right:28px; width:44px; height:44px; background:var(--hg-orange); color:white; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:9999; opacity:0; transition:opacity 0.3s,transform 0.3s; transform:translateY(10px); }
#back-to-top.visible { opacity:1; transform:translateY(0); }
#back-to-top:hover { background:var(--hg-navy); }
.whatsapp-float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 20px;
  right: 20px;
  z-index: 100;

  background-color: #25D366;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;

  box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
  transition: transform 0.3s ease;
}

.whatsapp-float img {
  width: 35px;
  height: 35px;
}

.whatsapp-float:hover {
  transform: scale(1.1);
}


/* RESPONSIVE */
@media(max-width:991px) {
    .banner.banner-slider,.banner .fill { height:72vh; min-height:480px; }
    .banner-text h2 { font-size:34px; }
    .megamenu-inner { flex-direction:column; }
    .megamenu-col { border-right:none; border-bottom:1px solid #f0f0f0; }
}
@media(max-width:767px) {
    .banner.banner-slider,.banner .fill { height:88vh; }
    .banner-text h2 { font-size:26px; }
    .carousel-control { display:none!important; }
    .stat-number { font-size:38px; }
    .sub-service-grid { grid-template-columns:1fr; }
    .ss-card { flex-direction:column; }
    .ss-card-img { width:100%; min-width:100%; height:180px; }
}