body {font-family:'Poppins',sans-serif;background:#f4f7fb;}

/* TOPBAR */
.topbar {
background:#0b2c4a;color:#fff;font-size:14px;
padding:6px 0;
}
.topbar .left {text-align:left;}
.topbar .right {text-align:right;}


/* NAVBAR */
.navbar {
background:#fff;
transition:all 0.4s ease;
}

/* NAV LINKS */
.nav-link {
position:relative;
padding:10px 18px;
font-weight:500;
color:#333;
transition:0.3s;
}

/* UNDERLINE ANIMATION */
.nav-link::after {
content:'';
position:absolute;
left:0;
bottom:0;
width:0%;
height:2px;
background:#ffa500;
transition:0.4s ease;
}

.nav-link:hover::after {
width:100%;
}

/* ACTIVE */
.active-nav {
color:#ffa500 !important;
font-weight:600;
}

.active-nav::after {
width:100%;
}

/* MEGA MENU */
.mega-dropdown {
position:relative;
}

.mega-menu {
position:absolute;
top:120%;
left:50%;
transform:translateX(-50%) translateY(20px);
width:500px;
background:#fff;
border-radius:15px;
padding:25px;
box-shadow:0 30px 80px rgba(0,0,0,0.15);
opacity:0;
visibility:hidden;
transition:all 0.4s ease;
}

/* SHOW EFFECT */
.mega-dropdown:hover .mega-menu {
opacity:1;
visibility:visible;
transform:translateX(-50%) translateY(0);
}

/* HEADINGS */
.mega-menu h6 {
font-weight:600;
margin-bottom:15px;
color:#0b2c4a;
}

/* LINKS */
.mega-menu a {
display:block;
padding:8px 0;
color:#333;
text-decoration:none;
transition:0.3s;
font-size:14px;
}

.mega-menu a i {
width:25px;
color:#0b2c4a;
}

/* HOVER EFFECT */
.mega-menu a:hover {
color:#ffa500;
padding-left:10px;
}




/* NAV LINK SPACING */
.navbar-nav .nav-item {
margin: 0 6px; /* increase spacing between menus */
}

/* NAV LINKS */
.nav-link {
padding:10px 20px;
font-weight:500;
color:#333;
border-radius:10px;
transition:0.3s;
}

/* HOVER EFFECT */
.nav-link:hover {
background:rgba(255,165,0,0.1);
color:#ffa500;
}

/* ACTIVE MENU */
.active-nav {
background:#ffa500;
color:#000 !important;
font-weight:600;
border-radius:10px;
}

/* REMOVE UNDERLINE EFFECT (if applied earlier) */
.nav-link::after {
display:none;
}





/* BUTTON */
.btn-main {
background:#0b2c4a;
color:#fff;
border-radius:30px;
padding:8px 22px;
transition:0.3s;
}

.btn-main:hover {
background:#ffa500;
color:#000;
transform:translateY(-2px);
}

/* STICKY SCROLL EFFECT */
.navbar.scrolled {
box-shadow:0 10px 30px rgba(0,0,0,0.1);
background:#fff;
}

/* SLIDER HEIGHT */
.carousel-item {
height: 80vh;
position: relative;
}

.carousel-item img {
height: 100%;
object-fit: cover;
}

/* DARK OVERLAY */
.slider-overlay {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.8));
z-index:1;
}

/* CAPTION */
.custom-caption {
z-index:2;
bottom:20%;
animation:fadeUp 1s ease;
}

.custom-caption h2 {
font-size:42px;
font-weight:700;
}

.custom-caption p {
font-size:18px;
}

/* ANIMATION */
@keyframes fadeUp {
from {opacity:0; transform:translateY(40px);}
to {opacity:1; transform:translateY(0);}
}

/* ARROWS */
.carousel-control-prev,
.carousel-control-next {
width:60px;
}

.custom-arrow {
background-color:rgba(0,0,0,0.5);
border-radius:50%;
padding:20px;
}

/* INDICATORS */
.carousel-indicators button {
width:12px;
height:12px;
border-radius:50%;
background-color:#fff;
opacity:0.5;
}

.carousel-indicators .active {
opacity:1;
background-color:#d4af37;
}
/* SECTION */
.section {padding:80px 0;}

/* PRODUCT CARD PREMIUM */
.product-card {
background:#fff;
border-radius:18px;
box-shadow:0 15px 40px rgba(0,0,0,0.08);
transition:all 0.4s ease;
display:flex;
flex-direction:column;
justify-content:space-between;
position:relative;
overflow:hidden;
}

.product-card:hover {
transform:translateY(-10px);
box-shadow:0 25px 60px rgba(0,0,0,0.15);
}

/* ICON BOX */
.icon-box {
width:70px;
height:70px;
margin:auto;
border-radius:50%;
background:rgba(11,44,74,0.1);
display:flex;
align-items:center;
justify-content:center;
transition:0.3s;
}

.icon-box i {
font-size:28px;
color:#0b2c4a;
}

.product-card:hover .icon-box {
background:#0b2c4a;
}

.product-card:hover .icon-box i {
color:#fff;
}

/* SUBHEADING */
.subheading {
font-size:13px;
margin-bottom:10px;
}

/* DESCRIPTION (2 LINE FIX) */
.desc {
font-size:14px;
min-height:48px;
}

/* BUTTON */
.btn-main {
background:#0b2c4a;
color:#fff;
border-radius:30px;
padding:6px 18px;
font-size:13px;
transition:0.3s;
}

.btn-main:hover {
background:#d4af37;
color:#000;
transform:scale(1.05);
}

/* COUNTER */
.counter-section {
background:url('https://images.unsplash.com/photo-1580281657527-47d9f3f71c36') center/cover;
color:#fff;position:relative;
}
.counter-section::before{
content:'';position:absolute;top:0;left:0;width:100%;height:100%;
background:rgba(0,0,0,0.7);
}
.counter-section .container{position:relative;}
.counter {font-size:40px;color:#d4af37;font-weight:700;}

/* WHY */
.why-box {
background:#fff;padding:25px;border-radius:15px;
box-shadow:0 10px 30px rgba(0,0,0,0.1);
transition:0.3s;
}
.why-box:hover {transform:translateY(-8px);}
.why-box i {font-size:40px;color:#0b2c4a;}


/* CTA SECTION */
.cta-ultra {
background:linear-gradient(135deg,#0b2c4a,#021526);
color:#fff;
padding:90px 0;
position:relative;
overflow:hidden;
}

/* LIGHT GLOW EFFECT */
.cta-ultra::before {
content:'';
position:absolute;
top:-50%;
left:-50%;
width:200%;
height:200%;
background:radial-gradient(circle, rgba(255,165,0,0.15), transparent 70%);
animation:rotateGlow 12s linear infinite;
}

/* TEXT */
.cta-title {
font-size:36px;
font-weight:700;
margin-bottom:15px;
}

.cta-subtitle {
max-width:750px;
margin:auto;
font-size:16px;
color:#ddd;
line-height:1.6;
}

/* BUTTONS */
.btn-cta-primary {
background:#ffa500;
color:#000;
padding:12px 28px;
border-radius:30px;
font-weight:600;
transition:0.3s;
}

.btn-cta-primary:hover {
background:#fff;
color:#000;
transform:translateY(-3px);
}

.btn-cta-outline {
border:2px solid #fff;
color:#fff;
padding:12px 28px;
border-radius:30px;
transition:0.3s;
}

.btn-cta-outline:hover {
background:#ffa500;
border-color:#ffa500;
color:#000;
transform:translateY(-3px);
}

/* ANIMATION */
@keyframes rotateGlow {
0% {transform:rotate(0deg);}
100% {transform:rotate(360deg);}
}


.footer-ultra {
background:#0a0f1c;
color:#bbb;
padding:70px 0 20px;
font-size:14px;
}

/* LOGO */
.footer-logo {
color:#fff;
font-weight:700;
margin-bottom:15px;
}

/* TEXT */
.footer-text {
line-height:1.6;
}

/* HEADINGS */
.footer-ultra h5 {
color:#fff;
margin-bottom:15px;
font-weight:600;
}

/* LINKS */
.footer-links {
list-style:none;
padding:0;
}

.footer-links li {
margin-bottom:8px;
}

.footer-links a {
color:#bbb;
text-decoration:none;
transition:0.3s;
}

.footer-links a:hover {
color:#ffa500;
padding-left:5px;
}

/* CONTACT ICONS */
.footer-ultra i {
margin-right:8px;
color:#ffa500;
}

/* SOCIAL */
.social-icons a {
display:inline-block;
width:35px;
height:35px;
line-height:35px;
text-align:center;
background:#111827;
color:#fff;
border-radius:50%;
margin-right:8px;
transition:0.3s;
}

.social-icons a:hover {
background:#ffa500;
color:#000;
transform:translateY(-3px);
}

/* NEWSLETTER */
.newsletter-box {
display:flex;
margin-top:10px;
}

.newsletter-box input {
flex:1;
padding:8px 10px;
border:none;
border-radius:20px 0 0 20px;
outline:none;
}

.newsletter-box button {
background:#ffa500;
border:none;
padding:8px 15px;
border-radius:0 20px 20px 0;
color:#000;
transition:0.3s;
}

.newsletter-box button:hover {
background:#fff;
}

/* HR */
.footer-ultra hr {
border-color:#222;
margin:30px 0;
}

/* BOTTOM */
.footer-bottom {
color:#777;
font-size:13px;
}

/* FADE ANIMATION */
.fade-in {
opacity:0;
transform:translateY(40px);
transition:1s;
}
.fade-in.show {
opacity:1;
transform:translateY(0);
}


.floating-buttons {
position:fixed;
bottom:20px;
right:20px;
z-index:9999;
display:flex;
flex-direction:column;
gap:12px;
}

/* COMMON STYLE */
.float-btn {
display:flex;
align-items:center;
gap:10px;
padding:10px 18px;
border-radius:50px;
color:#fff;
font-size:14px;
text-decoration:none;
box-shadow:0 10px 25px rgba(0,0,0,0.2);
transition:0.3s;
animation:pulse 2s infinite;
}

/* ICON */
.float-btn i {
font-size:18px;
}

/* CALL BUTTON */
.call-btn {
background:#0b2c4a;
}

.call-btn:hover {
background:#ffa500;
color:#000;
transform:translateY(-3px);
}

/* WHATSAPP BUTTON */
.whatsapp-btn {
background:#25D366;
}

.whatsapp-btn:hover {
background:#128C7E;
transform:translateY(-3px);
}

/* PULSE ANIMATION */
@keyframes pulse {
0% {box-shadow:0 0 0 0 rgba(0,0,0,0.3);}
70% {box-shadow:0 0 0 10px rgba(0,0,0,0);}
100% {box-shadow:0 0 0 0 rgba(0,0,0,0);}
}

/* MOBILE */
@media(max-width:576px){
.float-btn span {
display:none;
}
.float-btn {
padding:12px;
border-radius:50%;
}
}



#goTopBtn {
position:fixed;
bottom:20px;
left:20px; /* you can change to right:20px if needed */
z-index:9999;
background:#0b2c4a;
color:#fff;
border:none;
width:45px;
height:45px;
border-radius:50%;
font-size:18px;
cursor:pointer;
display:none;
box-shadow:0 10px 25px rgba(0,0,0,0.2);
transition:0.3s;
}

/* HOVER */
#goTopBtn:hover {
background:#ffa500;
color:#000;
transform:translateY(-3px);
}

/* SHOW ANIMATION */
#goTopBtn.show {
display:block;
animation:fadeInUp 0.4s ease;
}

@keyframes fadeInUp {
from {opacity:0; transform:translateY(20px);}
to {opacity:1; transform:translateY(0);}
}


 /* HERO */
        .category-hero {
            background:
                linear-gradient(rgba(7, 22, 44, .8), rgba(7, 22, 44, .8)),
                url('slider1.jpeg') center/cover;
            padding: 90px 0;
            color: #fff;
            text-align: center;
        }

        .category-hero h1 {
            font-size: 48px;
            font-weight: 700;
        }

        .category-hero p {
            font-size: 18px;
            opacity: .9;
            max-width: 700px;
            margin: auto;
        }

      
        /* STICKY */
        .sticky-filter {
            position: sticky;
            top: 90px;
            z-index: 10;
        }

        /* FOOTER */
        .footer {
            background: #081420;
            color: #fff;
            padding: 50px 0 20px;
            margin-top: 60px;
        }

        .footer h5 {
            margin-bottom: 20px;
            font-weight: 600;
        }

        .footer p,
        .footer a {
            color: #c8d2dc;
            font-size: 14px;
            text-decoration: none;
        }

        .footer a:hover {
            color: #fff;
        }

        .footer-bottom {
            border-top: 1px solid rgba(255, 255, 255, .1);
            padding-top: 20px;
            margin-top: 30px;
            text-align: center;
        }

        /* MOBILE */
        @media(max-width:768px) {

            .category-hero h1 {
                font-size: 34px;
            }

            .alpha-title {
                font-size: 24px;
            }

            .alphabet-filter {
                justify-content: flex-start;
                overflow: auto;
                padding-bottom: 10px;
            }

        }