@charset "UTF-8";
/* CSS Document */


@import url(https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.css);








        :root {
            --primary-color: #13335c;
            --accent-color: #ff6b35;
			--bg-light: #f8fafc;
			--border-color: #e2e8f0;
			--text-color: #475569;
            --star-color: #fbbf24; /* Golden yellow for stars */
        }



td, div, h1, h2, h3, p, input, form{
	margin:0;
	padding:0;
}
img{
	padding:0;
	margin:0;
	border:none;
	max-width:100%;
}
ul{
	list-style:none;
	margin:0;
	padding:0;
}
a:hover, a{
	transition:all ease-in-out 0.3s;
	text-decoration:none !important;
}
.btn:focus{
	outline:0 !important;
	box-shadow:none !important;
}
button:focus, input:focus, select:focus {
    outline: none !important;
    box-shadow: none !important;
}

body::-webkit-scrollbar {
	width: 0;
}



        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f4f7f6;
        }

        /* --- Navbar Smart Scroll & Glassmorphism Styling --- */
        .navbar.smart-scroll {
            position: fixed;
            top: 0px; 
            right: 0;
            left: 0;
            z-index: 1030;
            transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
            background: hsl(0deg 0% 100% / 90%);
            padding: 30px 0;
			backdrop-filter: blur(15px);
			
        }
/*.smart-scroll {
	background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 1) 0%,
        rgba(255, 255, 255, 0.9) 15%,
        rgba(255, 255, 255, 0.7) 30%,
        rgba(255, 255, 255, 0.45) 50%,
        rgba(255, 255, 255, 0.25) 70%,
        rgba(255, 255, 255, 0.1) 85%,
        rgba(255, 255, 255, 0) 100%
    );
	
}*/
        .scrolled-down {
            transform: translateY(-150%);
        }
        
        .navbar.scrolled-up {
            top: 0; 
            transform: translateY(0);
            background: rgba(19, 51, 92, 0.75); 
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            padding: 20px 0;
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }

        .navbar-brand {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            font-size: 1.6rem;
            letter-spacing: 1.5px;
        }

        /* --- Modern Offcanvas Menu Styling --- */
        div.custom-offcanvas {
            background-color: rgba(19, 51, 92, 0.75);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            color: white;
            border-right: 1px solid rgba(255, 255, 255, 0.1);
        }
        .custom-offcanvas .nav-link {
            color: rgba(255, 255, 255, 0.85);
            font-size: 1.1rem;
            padding: 12px 20px;
            transition: all 0.3s ease;
            border-radius: 8px;
            margin-bottom: 5px;
        }
        .custom-offcanvas .nav-link:hover, 
        .custom-offcanvas .nav-link:focus {
            color: var(--accent-color);
            background-color: rgba(255, 255, 255, 0.08);
        }

        .chevron-icon {
            transition: transform 0.3s ease;
            font-size: 0.9rem;
			color: #fff;
        }
        .nav-link[aria-expanded="true"] .chevron-icon {
            transform: rotate(180deg);
            color: var(--accent-color);
        }
        .nav-link[aria-expanded="true"] {
            background-color: rgba(255, 255, 255, 0.05);
        }
        
        .submenu-list {
            border-left: 2px solid rgba(255, 255, 255, 0.15);
            margin-left: 1.5rem;
            padding-left: 0.5rem;
            margin-top: 0.5rem;
            margin-bottom: 0.5rem;
        }
        .submenu-list .nav-link {
            font-size: 0.95rem;
            padding: 8px 15px;
            color: rgba(255, 255, 255, 0.6);
            margin-bottom: 2px;
        }
        .submenu-list .nav-link:hover {
            color: white;
            background-color: transparent;
            transform: translateX(6px); 
        }

        /* --- Banner & Video Parallax Section --- */
        .banner-section {
            position: relative;
            height: 100vh; 
            display: flex;
            align-items: center;
            overflow: hidden;
            padding-top: 80px; 
        }

        .video-wrapper {
            position: absolute;
            top: -15%; 
            left: 0;
            width: 100%;
            height: 130%; 
            z-index: -2;
            pointer-events: none;
        }

        .video-bg {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .video-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, rgba(19, 51, 92, 0.85) 0%, rgba(19, 51, 92, 0.5) 100%);
            z-index: -1;
        }
/* .banner-section:after {
    content: '';
    display: block;
    bottom: 0;
    right: 0;
    left: 0;
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100px;
   background: linear-gradient(
        to top,
        rgba(255, 255, 255, 1) 0%,
        rgba(255, 255, 255, 0.9) 15%,
        rgba(255, 255, 255, 0.7) 30%,
        rgba(255, 255, 255, 0.45) 50%,
        rgba(255, 255, 255, 0.25) 70%,
        rgba(255, 255, 255, 0.1) 85%,
        rgba(255, 255, 255, 0) 100%
    );




} */

.css-fade-up p{
	font-size: 15px;
}

/* --- Booking Widget Container --- */
.booking-widget-wrapper {
    background: rgba(0, 0, 0, 0.45); /* Dark semi-transparent overlay */
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    padding: 25px;
    border-radius: 8px;
    max-width: 450px;
    width: 100%;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* --- Radio Button Toggle (Transfer / Hourly) --- */
.booking-toggle {
    display: flex;
    margin-bottom: 20px;
    border-radius: 6px;
    overflow: hidden;
}

.booking-toggle input[type="radio"] {
    display: none; /* Hide actual radio buttons */
}

.booking-toggle label {
    flex: 1;
    text-align: center;
    padding: 14px;
    font-size: 1.1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
}

/* Checked States */
#radio-transfer:checked + label {
    background-color: #4a90e2; /* Modern Blue */
    color: white;
}

#radio-hourly:checked + label {
    background-color: #fe6a36; /* Modern Yellow/Orange */
    color: #111;
    font-weight: 600;
}

/* --- Input Groups --- */
.widget-input-group {
    display: flex;
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 4px;
    margin-bottom: 15px;
    background: rgba(0, 0, 0, 0.3);
    overflow: hidden;
    transition: border-color 0.3s;
}

.widget-input-group:focus-within {
    border-color: #4a90e2; /* Highlights border blue when typing */
}

.widget-icon {
    padding: 14px 18px;
    color: white;
    border-right: 1px solid rgba(255, 255, 255, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.widget-input-group input {
    flex: 1;
    background: transparent;
    border: none;
    color: white;
    padding: 14px 15px;
    font-size: 1rem;
    outline: none;
    width: 100%;
}

.widget-input-group input::placeholder {
    color: rgba(255, 255, 255, 0.9);
}

/* Change calendar icon color in date picker to white */
.widget-input-group input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
}

/* "Via" Button */
.btn-via {
    background: #4a90e2;
    color: white;
    border: none;
    border-left: 1px solid rgba(255, 255, 255, 0.4);
    padding: 0 18px;
    font-size: 1rem;
    cursor: pointer;
    transition: background 0.3s;
}

.btn-via:hover {
    background: #357ebd;
}

/* --- Time Selectors (HH / MM) --- */
.time-row {
    display: flex;
    gap: 15px;
    margin-bottom: 20px;
}

.widget-select {
    flex: 1;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: white;
    padding: 14px 15px;
    font-size: 1rem;
    border-radius: 4px;
    outline: none;
    cursor: pointer;
    appearance: none; /* Removes default browser dropdown arrow */
    /* Custom white dropdown arrow */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.6)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 18px;
    transition: border-color 0.3s;
}

.widget-select:focus {
    border-color: #4a90e2;
}

/* Dropdown options styling */
.widget-select option {
    background-color: #222;
    color: white;
    padding: 10px;
}

/* --- Submit Button --- */
.btn-widget-book {
    width: 100%;
    background: #4a90e2;
    color: white;
    border: none;
    padding: 16px;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.3s ease;
}

.btn-widget-book:hover {
    background: #357ebd;
}











/* --- SPLIT SCREEN LAYOUT --- */
        .login-wrapper {
            display: flex;
            min-height: 100vh;
        }

        /* Left Side: Form Area */
        .login-form-side {
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 40px 20px;
            background-color: #ffffff;
            position: relative;
        }

        /* Right Side: Image Area */
        .login-image-side {
            flex: 1.2;
            position: relative;
            background: url('https://picsum.photos/1920/1080') center/cover no-repeat;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            padding: 60px;
        }

        /* Dark gradient overlay for the image */
        .image-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(to bottom, rgba(19, 51, 92, 0.1) 0%, rgba(19, 51, 92, 0.9) 100%);
            z-index: 1;
        }

        .image-content {
            position: relative;
            z-index: 2;
            color: #ffffff;
        }

        /* --- BACK TO HOME BUTTON --- */
        .back-btn {
            position: absolute;
            top: 40px;
            left: 40px;
            font-weight: 600;
            display: inline-flex;
            align-items: center;
            color: #64748b;
        }

        .back-btn i {
            margin-right: 8px;
            font-size: 1.2rem;
            transition: transform 0.3s ease;
        }

        .back-btn:hover {
            color: var(--primary-color);
        }

        .back-btn:hover i {
            transform: translateX(-5px);
        }

        /* --- FORM CONTAINER STYLING --- */
        .form-container {
            width: 100%;
            max-width: 420px;
        }

        .brand-logo {
            font-size: 2rem;
            font-weight: 800;
            color: var(--primary-color);
            margin-bottom: 40px;
            display: flex;
            align-items: center;
        }

        .brand-logo i {
            color: var(--accent-color);
            margin-right: 10px;
        }

        .form-title {
            font-size: 2rem;
            font-weight: 800;
            color: var(--primary-color);
            margin-bottom: 10px;
            letter-spacing: -0.5px;
        }

        .form-subtitle {
            color: #64748b;
            margin-bottom: 40px;
            font-size: 1.05rem;
        }

        /* Premium Floating Inputs */
        .form-floating {
            margin-bottom: 20px;
        }

        .form-control {
            border: 1px solid var(--border-color);
            border-radius: 12px;
            padding-top: 1.625rem;
            padding-bottom: 0.625rem;
            font-size: 1rem;
            height: auto;
            background-color: var(--bg-light);
            color: var(--primary-color);
            transition: all 0.3s ease;
        }

        .form-control:focus {
            background-color: #ffffff;
            border-color: var(--accent-color);
            box-shadow: 0 0 0 4px rgba(255, 107, 53, 0.1);
        }

        .form-floating label {
            color: #94a3b8;
            padding-left: 20px;
            font-weight: 500;
        }

        /* Password Toggle Eye Icon */
        .password-wrapper {
            position: relative;
        }

        .toggle-password {
            position: absolute;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            color: #94a3b8;
            font-size: 1.2rem;
            transition: color 0.3s ease;
            z-index: 10;
        }

        .toggle-password:hover {
            color: var(--primary-color);
        }

        /* Buttons & Extras */
        .form-check-input:checked {
            background-color: var(--accent-color);
            border-color: var(--accent-color);
        }

        .btn-login {
            background-color: var(--primary-color);
            color: #ffffff;
            font-weight: 700;
            font-size: 1.1rem;
            padding: 16px;
            border-radius: 12px;
            width: 100%;
            border: none;
            margin-top: 10px;
            margin-bottom: 25px;
            transition: all 0.3s ease;
            box-shadow: 0 10px 20px rgba(19, 51, 92, 0.15);
        }

        .btn-login:hover {
            background-color: var(--accent-color);
            transform: translateY(-2px);
            box-shadow: 0 15px 30px rgba(255, 107, 53, 0.25);
        }

        /* Social Login Divider */
        .divider {
            display: flex;
            align-items: center;
            text-align: center;
            color: #94a3b8;
            font-size: 0.9rem;
            font-weight: 600;
            margin-bottom: 25px;
        }

        .divider::before, .divider::after {
            content: '';
            flex: 1;
            border-bottom: 1px solid var(--border-color);
        }

        .divider::before { margin-right: .5em; }
        .divider::after { margin-left: .5em; }

        .btn-google {
            background-color: #ffffff;
            border: 1px solid var(--border-color);
            color: var(--primary-color);
            font-weight: 600;
            padding: 14px;
            border-radius: 12px;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s ease;
        }

        .btn-google img {
            width: 20px;
            margin-right: 10px;
        }

        .btn-google:hover {
            background-color: var(--bg-light);
            border-color: #cbd5e1;
        }

        /* Responsive Design */
        @media (max-width: 991px) {
            /* Hides the image half entirely on tablets and phones */
            .login-image-side {
                display: none; 
            }
            .back-btn {
                top: 20px;
                left: 20px;
            }
        }














        /* --- Reliable CSS Fade-In Animations --- */
        .css-fade-up {
            animation: fadeUpAnim 1s ease-out forwards;
            opacity: 0;
            transform: translateY(30px);
        }
        
        .delay-1 {
            animation-delay: 0.2s;
        }

        @keyframes fadeUpAnim {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* --- Booking Form Styling --- */
        .card.booking-card {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(5px);
            border-radius: 16px;
            box-shadow: 0 20px 40px rgba(0,0,0,0.3);
            border: 1px solid rgba(255,255,255,0.2);
            position: relative;
            z-index: 10; /* Ensures it stays on top */
        }
        .btn-theme {
            background-color: var(--accent-color);
            color: white;
            transition: all 0.3s ease;
            letter-spacing: 1px;
        }
        .btn-theme:hover {
            background-color: #e65c2b;
            color: white;
            transform: translateY(-3px);
            box-shadow: 0 5px 15px rgba(255, 107, 53, 0.4);
        }
        .form-control:focus, .form-select:focus {
            border-color: var(--primary-color);
            box-shadow: 0 0 0 0.25rem rgba(19, 51, 92, 0.15);
        }


.smart-scroll .navbar-brand{
	padding: 10px 5px;
    border-radius: 5px;
    max-width: 100px;
    display: block;
    width: 100%;
}
.scrolled-up .navbar-brand {
    background-color: #fff;
    
    box-shadow: 0 0px 20px 0px #00000061;
    position: absolute;
    top: 0;
}
.scrolled-down .navbar-brand{
	top:-40px;
}


.smart-scroll button, .smart-scroll .social-icons a, .smart-scroll .social-icons a svg {
    color: #13335c;
	fill: #13335c;
}
.navbar.scrolled-up button, .scrolled-up .social-icons a, .scrolled-up .social-icons a svg{
	color: #fff;
	fill:#fff;
}
.social-icons .hover-opacity-100:hover{
	opacity: 100 !important;
}
.transition{
	transition: all ease-in-out 0.3s
}
/* --- Material Design Button --- */
.md-btn {
    position: relative;
    overflow: hidden;
    background-color: #12345c; /* Using your accent color */
    color: white;
    border: none;
    border-radius: 50px; /* Classic Material edge */
    padding: 12px 24px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1.25px;
    cursor: pointer;
    outline: none;
    
    /* Material Design resting shadow */
    box-shadow: 0 3px 1px -2px rgba(0,0,0,0.2),
                0 2px 2px 0 rgba(0,0,0,0.14),
                0 1px 5px 0 rgba(0,0,0,0.12);
                
    /* Smooth transitions for hover */
    transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1), 
                background-color 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.md-btn:hover, .md-btn:focus {
    background-color: #e65c2b; /* Slightly darker on hover */
    /* Material Design hover shadow (Lifted) */
    box-shadow: 0 2px 4px -1px rgba(0,0,0,0.2),
                0 4px 5px 0 rgba(0,0,0,0.14),
                0 1px 10px 0 rgba(0,0,0,0.12);
}

/* --- Ripple Effect Styling --- */
.md-ripple {
    position: absolute;
    border-radius: 50%;
    transform: scale(0);
    animation: ripple-animation 600ms linear;
    background-color: rgba(255, 255, 255, 0.4); /* White semi-transparent */
    pointer-events: none; /* Prevents the ripple from stealing clicks */
}

@keyframes ripple-animation {
    to {
        transform: scale(3); /* Scales the circle to cover the button */
        opacity: 0;
    }
}


/* Styling for the blinking cursor */
.cursor {
  display: inline-block;
  font-weight: bold;
  color: #ff6b35; /* Using your accent color! */
  animation: blink 1s step-end infinite;
}

/* Cursor blink animation */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

.banner-section h1{
	font-size: 60px
}









.service-section {
    padding: 60px 0;
    font-family: 'Inter', sans-serif;
    background-color: #fff;
}

.service-section h2 {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 30px;
    color: #1a1a1a;
}

.service-swiper {
    padding-bottom: 20px;
}

/* Slide width matching the image */
.service-swiper .swiper-slide {
    width: 380px; 
}

/* --- CARD DESIGN --- */
.service-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    /*border: 1px solid #f0f0f0;*/
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* --- INNER IMAGE SWIPER --- */
.inner-swiper {
    width: 100%;
    /*height: 240px;*/
    position: relative;
}

.inner-swiper .swiper-slide {
    width: 100%; /* Inner slides must be 100% of the card */
}

.inner-swiper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Inner Arrows (Transparent with white border) */
.inner-prev, .inner-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.6);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 10;
    font-size: 18px;
    transition: background 0.3s;
}

.inner-prev:hover, .inner-next:hover {
    background: rgba(255,255,255,0.2);
}

.inner-prev { left: 15px; }
.inner-next { right: 15px; }

/* Inner Pagination Dots */
.inner-swiper .swiper-pagination-bullet {
    background: #fff;
    opacity: 0.6;
    width: 6px;
    height: 6px;
    margin: 0 3px !important;
}

.inner-swiper .swiper-pagination-bullet-active {
    background: #ff4d4d; /* Matches the orange/red active dot */
    opacity: 1;
}

/* --- CARD CONTENT --- */
.card-content {
    padding: 30px;
    flex-grow: 1;
}

.card-content h3 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #111;
}

.card-content p {
    color: #555;
    font-size: 14px;
    margin-bottom: 25px;
    line-height: 1.6;
    position: relative;
    padding-bottom: 25px; /* Room for the line */
}

/* Two-Tone Divider Line using ::after */
.card-content p::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80px;
    height: 3px;
    background: linear-gradient(to right, #ff4d4d 50%, #e0e0e0 50%);
}

.card-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.card-content li {
    margin-bottom: 12px;
    font-size: 14px;
    color: #333;
    display: flex;
    align-items: flex-start;
    line-height: 1.5;
}

/* --- OUTER CONTROLS (Right-Aligned) --- */
.custom-slider-controls {
    display: flex;
    align-items: center;
    justify-content: flex-end; /* Aligns everything to the right */
    gap: 8px; /* Space between arrows and numbers */
    margin-top: 30px;
    padding-right: 15px;
}

/* Outer Arrow Buttons */
.custom-prev-btn,
.custom-next-btn {
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    color: #999; /* Light grey arrows */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: color 0.2s ease;
}

.custom-prev-btn:hover,
.custom-next-btn:hover {
    color: #000; /* Turn black on hover */
}

/* Container specifically for the numbers */
.custom-number-pagination {
    display: flex;
    gap: 4px; /* Space between individual numbers */
    width: auto !important; /* Forces Swiper to not take up 100% width */
}

/* Individual Numbered Bullets */
.custom-number-pagination .swiper-pagination-bullet {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: transparent; 
    color: #555; 
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1; 
    margin: 0 !important; 
    transition: all 0.3s ease;
    cursor: pointer;
}

.custom-number-pagination .swiper-pagination-bullet:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

/* ACTIVE Numbered Bullet (The black circle) */
.custom-number-pagination .swiper-pagination-bullet-active {
    background-color: #000; 
    color: #fff; 
}

@media (max-width: 768px) {
    .service-swiper .swiper-slide {
        width: 85%;
    }
}










/* --- MAIN CONTENT AREA --- */
        .service-details-section {
            padding: 80px 0;
        }

        .content-block {
            margin-bottom: 60px;
        }

        .content-block h2 {
            font-size: 2rem;
            font-weight: 800;
            color: var(--primary-color);
            margin-bottom: 25px;
        }

        .content-block p {
            font-size: 1.1rem;
            color: #334155;
            margin-bottom: 20px;
        }

        /* Feature Grid inside Content */
        .feature-box {
            background: var(--bg-light);
            padding: 25px;
            border-radius: 12px;
            border: 1px solid var(--border-color);
            height: 100%;
            transition: all 0.3s ease;
        }

        .feature-box:hover {
            background: #ffffff;
            box-shadow: 0 10px 25px rgba(0,0,0,0.05);
            transform: translateY(-5px);
        }

        .feature-icon {
            color: var(--accent-color);
            font-size: 2rem;
            margin-bottom: 15px;
        }

        .feature-box h4 {
            font-size: 1.15rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 10px;
        }

        /* Vertical Experience Timeline */
        .service-timeline {
            position: relative;
            padding-left: 40px;
            margin-top: 40px;
        }

        .service-timeline::before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 2px;
            background: var(--border-color);
        }

        .timeline-item {
            position: relative;
            margin-bottom: 40px;
        }

        .timeline-item:last-child {
            margin-bottom: 0;
        }

        .timeline-item::before {
            content: '';
            position: absolute;
            left: -46px; /* Positions dot on the line */
            top: 5px;
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: var(--accent-color);
            border: 3px solid #ffffff;
            box-shadow: 0 0 0 2px rgba(255, 107, 53, 0.2);
        }

        .timeline-item h4 {
            font-size: 1.25rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 10px;
        }

        /* Image Gallery inside content */
        .service-gallery img {
            width: 100%;
            height: 250px;
            object-fit: cover;
            border-radius: 12px;
            margin-bottom: 20px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.08);
        }

        /* --- STICKY BOOKING SIDEBAR --- */
        .booking-sidebar-wrapper {
            position: sticky;
            top: 120px; /* Sticks right below your navigation menu */
            z-index: 10;
        }

        .booking-card {
            background: #ffffff;
            border-radius: 16px;
            padding: 30px;
            box-shadow: 0 20px 50px rgba(0,0,0,0.08);
            border: 1px solid var(--border-color);
            position: relative;
            overflow: hidden;
        }

        /* Decorative top accent on booking card */
        .booking-card::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0;
            height: 5px;
            background: var(--accent-color);
        }

        .price-tag {
            display: flex;
            align-items: baseline;
            margin-bottom: 25px;
            padding-bottom: 20px;
            border-bottom: 1px solid var(--border-color);
        }

        .price-tag .label {
            font-size: 1rem;
            color: #64748b;
            font-weight: 600;
            margin-right: 10px;
        }

        .price-tag .amount {
            font-size: 2.5rem;
            font-weight: 800;
            color: var(--primary-color);
            line-height: 1;
        }

        .price-tag .unit {
            font-size: 1rem;
            color: #64748b;
            margin-left: 5px;
        }

        /* Form Inputs */
        .booking-card .form-control, .booking-card .form-select {
            background-color: var(--bg-light);
            border: 1px solid transparent;
            padding: 12px 15px;
            border-radius: 8px;
            font-size: 0.95rem;
        }

        .booking-card .form-control:focus, .booking-card .form-select:focus {
            background-color: #ffffff;
            border-color: var(--accent-color);
            box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1);
        }

        .booking-card .form-label {
            font-weight: 600;
            color: var(--primary-color);
            font-size: 0.9rem;
            margin-bottom: 6px;
        }

        .btn-book-now {
            background-color: var(--primary-color);
            color: #ffffff;
            font-weight: 700;
            font-size: 1.1rem;
            padding: 16px;
            border-radius: 8px;
            width: 100%;
            text-transform: uppercase;
            letter-spacing: 1px;
            border: none;
            transition: all 0.3s ease;
            margin-top: 10px;
        }

        .btn-book-now:hover {
            background-color: var(--accent-color);
            box-shadow: 0 10px 20px rgba(255, 107, 53, 0.3);
            transform: translateY(-2px);
        }

        /* Trust Badges in Sidebar */
        .trust-badges {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 15px;
            margin-top: 25px;
            color: #64748b;
            font-size: 0.85rem;
            font-weight: 500;
        }

        .trust-badges i {
            color: var(--primary-color);
            font-size: 1.2rem;
            margin-right: 5px;
        }

        @media (max-width: 991px) {
            .booking-sidebar-wrapper {
                position: relative;
                top: 0;
                margin-top: 50px;
            }
        }
    












/* --- INFORMATIVE ZIG-ZAG SECTIONS --- */
        .info-section {
            padding: 100px 0;
        }

        .info-section.bg-alternate {
            background-color: var(--bg-light);
        }

        .info-badge {
            background-color: rgba(255, 107, 53, 0.1);
            color: var(--accent-color);
            padding: 8px 18px;
            border-radius: 30px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
            font-size: 0.85rem;
            display: inline-block;
            margin-bottom: 20px;
        }

        .info-title {
            font-size: 2.5rem;
            font-weight: 800;
            color: var(--primary-color);
            margin-bottom: 25px;
            line-height: 1.2;
        }

        .info-text {
            font-size: 1.1rem;
            margin-bottom: 25px;
            color: #334155;
        }

        /* Detailed Feature Lists */
        .feature-list {
            list-style: none;
            padding: 0;
            margin-bottom: 30px;
        }

        .feature-list li {
            position: relative;
            padding-left: 35px;
            margin-bottom: 15px;
            font-weight: 500;
            color: var(--primary-color);
        }

        .feature-list li::before {
            content: "\F26A"; /* Bootstrap check-circle-fill icon */
            font-family: "bootstrap-icons";
            position: absolute;
            left: 0;
            top: 2px;
            color: var(--accent-color);
            font-size: 1.2rem;
        }

        /* Image Formatting */
        .info-img-wrapper {
            position: relative;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
        }

        .info-img-wrapper::after {
            content: '';
            position: absolute;
            inset: 0;
            border-radius: 20px;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,0.2);
            z-index: 2;
            pointer-events: none;
        }

        .info-img {
            width: 100%;
            height: 600px;
            object-fit: cover;
            transition: transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
        }

        .info-img-wrapper:hover .info-img {
            transform: scale(1.05);
        }

        /* Informative Data Cards attached to images */
        .data-card {
            position: absolute;
            bottom: 30px;
            left: -30px; /* Overlaps outside the image */
            background: #ffffff;
            padding: 25px;
            border-radius: 16px;
            box-shadow: 0 15px 35px rgba(0,0,0,0.1);
            z-index: 3;
            max-width: 250px;
            border: 1px solid var(--border-color);
        }

        .data-card.right {
            left: auto;
            right: -30px;
        }

        .data-value {
            font-size: 2rem;
            font-weight: 800;
            color: var(--accent-color);
            line-height: 1;
            margin-bottom: 5px;
        }

        .data-label {
            font-size: 0.9rem;
            font-weight: 600;
            color: var(--primary-color);
            text-transform: uppercase;
        }

        @media (max-width: 991px) {
            .info-img { height: 400px; }
            .data-card { left: 20px; right: auto; bottom: 20px; max-width: calc(100% - 40px); }
            .data-card.right { right: 20px; left: auto; }
            /* Force images to always be above text on mobile */
            .mobile-reverse { flex-direction: column-reverse; }
        }













/* --- SECTION HEADERS --- */
        .section-badge {
            background-color: rgba(255, 107, 53, 0.1);
            color: var(--accent-color);
            padding: 8px 16px;
            border-radius: 30px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
            font-size: 0.85rem;
            display: inline-block;
            margin-bottom: 20px;
        }

        .section-title {
            font-size: 2.5rem;
            font-weight: 800;
            color: var(--primary-color);
            margin-bottom: 20px;
            line-height: 1.2;
        }

        /* --- 1. SERVICES (Premium Grid) --- */
        .services-section {
            padding: 100px 0;
            background-color: var(--bg-light);
        }

        .service-box {
            background: #ffffff;
            border-radius: 16px;
            padding: 40px;
            height: 100%;
            border: 1px solid var(--border-color);
            transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
            position: relative;
            overflow: hidden;
        }

        .service-box:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0,0,0,0.08);
            border-color: transparent;
        }

        .service-icon {
            width: 70px; height: 70px;
            background: rgba(19, 51, 92, 0.05);
            color: var(--primary-color);
            border-radius: 16px;
            display: flex; align-items: center; justify-content: center;
            font-size: 2rem;
            margin-bottom: 25px;
            transition: all 0.4s ease;
        }

        .service-box:hover .service-icon {
            background: var(--primary-color);
            color: white;
            transform: scale(1.1);
        }

        .service-box h3 {
            font-size: 1.35rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 15px;
        }

        /* --- 2. FACILITIES (Split Screen Feature) --- */
        .facilities-section {
            padding: 100px 0;
            background-color: #ffffff;
        }

        .facility-img-wrapper {
            position: relative;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 20px 40px rgba(0,0,0,0.1);
        }

        .facility-img {
            width: 100%;
            height: 500px;
            object-fit: cover;
        }

        .facility-content-box {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
            padding: 50px;
            border-radius: 20px;
            border: 1px solid var(--border-color);
            position: relative;
            margin-left: -50px;
            margin-top: 50px;
            box-shadow: 0 15px 35px rgba(0,0,0,0.05);
            z-index: 2;
        }

        .facility-list {
            list-style: none;
            padding: 0; margin: 30px 0 0 0;
        }

        .facility-list li {
            display: flex;
            align-items: flex-start;
            margin-bottom: 15px;
            font-size: 1.05rem;
        }

        .facility-list i {
            color: var(--accent-color);
            font-size: 1.2rem;
            margin-right: 15px;
            margin-top: 2px;
        }

        /* --- 3. TRANSPORTATION OPTIONS (Image Cards) --- */
        .transport-section {
            padding: 100px 0;
            background-color: var(--bg-light);
        }

        .transport-card {
            background: #ffffff;
            border-radius: 16px;
            overflow: hidden;
            border: 1px solid var(--border-color);
            transition: all 0.4s ease;
            height: 100%;
        }

        .transport-card:hover {
            box-shadow: 0 20px 40px rgba(0,0,0,0.1);
            transform: translateY(-8px);
        }

        .transport-img-wrap {
            height: 240px;
            width: 100%;
            overflow: hidden;
            position: relative;
        }

        .transport-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.6s ease;
        }

        .transport-card:hover .transport-img {
            transform: scale(1.05);
        }

        .transport-body {
            padding: 30px;
        }

        .transport-body h4 {
            font-size: 1.4rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 10px;
        }

        .transport-features {
            display: flex;
            gap: 15px;
            margin-top: 20px;
            padding-top: 20px;
            border-top: 1px solid var(--border-color);
        }

        .t-feature {
            display: flex;
            align-items: center;
            font-size: 0.9rem;
            font-weight: 600;
            color: var(--primary-color);
        }

        .t-feature i {
            color: var(--accent-color);
            margin-right: 6px;
            font-size: 1.1rem;
        }

        /* Mobile Fixes */
        @media (max-width: 991px) {
            .facility-content-box {
                margin-left: 0;
                margin-top: -50px;
            }
            .section-title { font-size: 2rem; }
        }














/* --- Fleet Carousel Section --- */
.fleet-section {
	padding: 80px 0;
}

.fleet-card {
    background: #ffffff;
    border-radius: 16px; /* Rounded corners */
    overflow: hidden;
    /* Soft shadow */
    box-shadow: 0 10px 30px rgba(0,0,0,0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.fleet-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.12); /* Slightly deeper shadow on hover */
}

/* Inner Carousel Image Sizing */
.inner-carousel .carousel-item img {
    height: 240px;
    width: 100%;
    object-fit: cover;
}

/* Swiper Pagination Styling (Dots) */
.fleet-swiper {
    padding: 50px 0; /* Room for pagination dots */
}
.swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background-color: var(--primary-color);
    opacity: 0.3;
}
.swiper-pagination-bullet-active {
    background-color: var(--accent-color);
    opacity: 1;
    width: 25px;
    border-radius: 5px;
    transition: all 0.3s ease;
}

/* --- Custom Main Swiper Arrows --- */
.custom-swiper-arrow {
    background-color: white;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0 5px 20px rgba(0,0,0,0.15);
    color: var(--primary-color) !important; /* Overrides default Swiper blue */
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.custom-swiper-arrow::after {
    font-size: 1.3rem !important; /* Shrinks the default massive icon */
    font-weight: bold;
}
.custom-swiper-arrow:hover {
    background-color: var(--accent-color);
    color: white !important;
    transform: scale(1.1);
}

/* --- Custom Inner Carousel Arrows --- */
button.custom-inner-arrow {
    width: 36px;
    height: 36px;
    background-color: white !important; /* Overrides bootstrap transparent area */
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0 !important; /* Hidden by default */
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    margin: 0 10px; /* Space from the edges */
    transition: all 0.3s ease;
}

/* Reveal arrows only when hovering over that specific card */
.fleet-card:hover .custom-inner-arrow {
    opacity: 0.9 !important; 
}

.custom-inner-arrow i {
    color: var(--primary-color);
    font-size: 1.2rem;
    line-height: 0;
}

.custom-inner-arrow:hover {
    background-color: var(--accent-color) !important;
    opacity: 1 !important;
    transform: translateY(-50%) scale(1.1);
}
.custom-inner-arrow:hover i {
    color: white;
}












/* --- PAGE HEADER --- */
/* --- Inner Page GSAP Parallax Header --- */
.inner-parallax-header {
    position: relative;
    height: 45vh; /* Shorter than home page hero */
    min-height: 350px; /* Prevents it from getting too small on mobile */
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center; /* Centers content vertically */
    background-color: var(--primary-color, #13335c);
    
    /* CRITICAL: Accounts for your sticky menu! */
    /* Adjust this value to match your menu's exact height */
    padding-top: 100px; 
}

/* The Background Wrapper */
.inner-parallax-bg-wrapper {
    position: absolute;
    top: -15%; /* Pulls it up to give it room to scroll down */
    left: 0;
    width: 100%;
    height: 130%; /* Taller than the container for the parallax effect */
    z-index: 1;
}

.inner-parallax-bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Dark Overlay for Text Readability */
.inner-parallax-overlay {
    position: absolute;
    inset: 0;
    /* A solid semi-transparent deep blue */
    background: rgba(19, 51, 92, 0.75); 
    z-index: 2;
}

/* Content Container */
.inner-parallax-content {
    position: relative;
    z-index: 3;
    width: 100%;
}

/* Smooth fade-up animation for the text */
.inner-parallax-text-wrap {
    opacity: 0;
    transform: translateY(20px);
    animation: innerFadeUp 0.8s cubic-bezier(0.25, 0.8, 0.25, 1) 0.2s forwards;
}

@keyframes innerFadeUp {
    to { opacity: 1; transform: translateY(0); }
}

/* Custom Breadcrumb Styling */
.custom-breadcrumb .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color 0.3s ease;
}

.custom-breadcrumb .breadcrumb-item a:hover {
    color: var(--accent-color, #ff6b35);
}

.custom-breadcrumb .breadcrumb-item.active {
    color: white;
    font-weight: 600;
}

/* Change the breadcrumb separator color */
.custom-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    content: "›"; /* Modern minimalist separator */
    color: rgba(255, 255, 255, 0.4);
    font-size: 1.2rem;
    line-height: 1;
    vertical-align: middle;
}
        .blog-header {
            background: linear-gradient(to right, #0f172a, #1e293b);
            color: white;
            padding: 100px 0 80px;
            text-align: center;
            margin-bottom: 60px;
        }

        .blog-header h1 {
            font-size: 3.5rem;
            font-weight: 800;
            letter-spacing: -1px;
            margin-bottom: 15px;
        }

        .blog-header p {
            font-size: 1.25rem;
            color: #94a3b8;
            max-width: 600px;
            margin: 0 auto;
            font-weight: 400;
        }

        /* --- BLOG CARD DESIGN --- */
        .blog-card {
            background: var(--card-bg);
            border-radius: 16px;
            overflow: hidden;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
            border: 1px solid rgba(0, 0, 0, 0.04);
            display: flex;
            flex-direction: column;
            height: 100%;
            transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.4s ease;
        }

        .blog-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
        }

        /* Image Wrapper & Zoom Effect */
        .blog-img-wrapper {
            position: relative;
            overflow: hidden;
            height: 240px; /* Fixed height for uniformity */
            width: 100%;
        }

        .blog-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.6s ease;
        }

        .blog-card:hover .blog-img {
            transform: scale(1.08); /* Smooth zoom on hover */
        }

        /* Category Badge overlay on image */
        .blog-category-badge {
            position: absolute;
            top: 20px;
            left: 20px;
            background-color: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(4px);
            color: var(--primary-color);
            padding: 6px 14px;
            border-radius: 30px;
            font-size: 0.75rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            z-index: 2;
            box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        }

        /* Content Area */
        .blog-content {
            padding: 30px;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
        }

        .blog-meta {
            font-size: 0.85rem;
            color: var(--secondary-color);
            margin-bottom: 12px;
            display: flex;
            align-items: center;
            gap: 15px;
            font-weight: 500;
        }

        .blog-meta i {
            color: var(--accent-color);
            margin-right: 4px;
        }

        .blog-title {
            font-size: 1.35rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 15px;
            line-height: 1.3;
        }

        .blog-title a {
            color: inherit;
        }

        .blog-title a:hover {
            color: var(--accent-color);
        }

        .blog-excerpt {
            color: var(--secondary-color);
            font-size: 0.95rem;
            line-height: 1.6;
            margin-bottom: 25px;
            /* Clamps text to 3 lines with an ellipsis */
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        /* Custom Read More Link */
        .blog-read-more {
            margin-top: auto; /* Pushes button to the bottom of the card */
            display: inline-flex;
            align-items: center;
            color: var(--primary-color);
            font-weight: 600;
            font-size: 0.95rem;
            letter-spacing: 0.2px;
            padding-bottom: 4px;
            border-bottom: 2px solid transparent;
        }

        .blog-read-more i {
            margin-left: 6px;
            font-size: 1.1rem;
            transition: transform 0.3s ease;
        }

        .blog-read-more:hover {
            color: var(--accent-color);
            border-bottom-color: var(--accent-color);
        }

        .blog-read-more:hover i {
            transform: translateX(5px); /* Arrow slides right on hover */
        }

        /* --- PAGINATION --- */
        .custom-pagination {
            margin-top: 60px;
            margin-bottom: 80px;
        }

        .custom-pagination .page-link {
            border: none;
            color: var(--secondary-color);
            font-weight: 600;
            padding: 10px 18px;
            margin: 0 5px;
            border-radius: 8px;
            transition: all 0.3s ease;
        }

        .custom-pagination .page-link:hover {
            background-color: #e2e8f0;
            color: var(--primary-color);
        }

        .custom-pagination .page-item.active .page-link {
            background-color: var(--primary-color);
            color: white;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        }

        /* Responsive Adjustments */
        @media (max-width: 768px) {
            .blog-header h1 {
                font-size: 2.5rem;
            }
            .blog-header p {
                font-size: 1.1rem;
                padding: 0 20px;
            }
        }












/* --- CONTACT SECTION --- */
        .contact-section {
            padding: 100px 0;
        }

        /* Contact Info Cards */
        .contact-info-card {
            display: flex;
            align-items: flex-start;
            margin-bottom: 35px;
        }

        .contact-icon {
            width: 60px;
            height: 60px;
            background-color: rgba(255, 107, 53, 0.1);
            color: var(--accent-color);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            flex-shrink: 0;
            margin-right: 20px;
            transition: all 0.3s ease;
        }

        .contact-info-card:hover .contact-icon {
            background-color: var(--accent-color);
            color: white;
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3);
        }

        .contact-details h4 {
            font-size: 1.15rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 5px;
        }

        .contact-details p {
            margin-bottom: 0;
            color: var(--text-color);
            font-size: 1rem;
        }

        .contact-details a {
            color: var(--text-color);
            text-decoration: none;
            transition: color 0.3s ease;
        }

        .contact-details a:hover {
            color: var(--accent-color);
        }

        /* Modern Contact Form */
        .contact-form-wrapper {
            background: #ffffff;
            padding: 40px;
            border-radius: 16px;
            box-shadow: 0 10px 40px rgba(0,0,0,0.06);
            border: 1px solid var(--border-color);
        }

        .form-control, .form-select {
            padding: 14px 20px;
            background-color: var(--bg-light);
            border: 1px solid transparent;
            border-radius: 8px;
            font-size: 1rem;
            color: var(--text-color);
            transition: all 0.3s ease;
        }

        .form-control:focus, .form-select:focus {
            background-color: #ffffff;
            border-color: var(--accent-color);
            box-shadow: 0 0 0 4px rgba(255, 107, 53, 0.1);
        }

        .form-control::placeholder {
            color: #94a3b8;
        }

        .form-label {
            font-weight: 600;
            color: var(--primary-color);
            margin-bottom: 8px;
            font-size: 0.95rem;
        }

        .submit-btn {
            background-color: var(--primary-color);
            color: white;
            padding: 16px 30px;
            border: none;
            border-radius: 8px;
            font-weight: 600;
            font-size: 1.05rem;
            width: 100%;
            transition: all 0.3s ease;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .submit-btn:hover {
            background-color: var(--accent-color);
            box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3);
            transform: translateY(-2px);
        }

        /* --- MAP SECTION --- */
        .map-wrapper {
            width: 100%;
            height: 450px;
            background-color: #eee;
            margin-bottom: -5px; /* Removes gap at the bottom if footer is right below */
        }

        .map-wrapper iframe {
            width: 100%;
            height: 100%;
            border: 0;
            filter: grayscale(20%) contrast(1.1); /* Slightly styles the google map to look more premium */
        }

        @media (max-width: 991px) {
            .contact-form-wrapper {
                margin-top: 50px;
                padding: 30px;
            }
        }











/* --- 1. OUR STORY SECTION (Overlapping Images) --- */
        .about-story-section {
            padding: 100px 0;
        }

        .img-stack {
            position: relative;
            height: 100%;
            min-height: 500px;
        }

        .img-stack-back {
            width: 80%;
            height: 450px;
            object-fit: cover;
            border-radius: 16px;
            box-shadow: 0 20px 40px rgba(0,0,0,0.08);
        }

        .img-stack-front {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 55%;
            height: 300px;
            object-fit: cover;
            border-radius: 16px;
            border: 12px solid #ffffff;
            box-shadow: 0 15px 35px rgba(0,0,0,0.1);
            transform: translateY(20px);
        }

        .story-content h2 {
            font-size: 2.8rem;
            font-weight: 800;
            color: var(--primary-color);
            margin-bottom: 25px;
            line-height: 1.2;
        }

        .story-quote {
            font-family: 'Playfair Display', serif;
            font-size: 1.35rem;
            color: var(--primary-color);
            border-left: 4px solid var(--accent-color);
            padding-left: 25px;
            margin: 35px 0;
            font-style: italic;
        }

        .ceo-signature {
            font-family: 'Playfair Display', serif;
            font-size: 1.5rem;
            color: var(--primary-color);
            font-style: italic;
            margin-top: 15px;
        }

        /* --- 2. STATS/COUNTER SECTION --- */
        .stats-section {
            background-color: var(--primary-color);
            padding: 80px 0;
            color: white;
            position: relative;
        }

        /* Decorative background pattern */
        .stats-section::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
            background-size: 20px 20px;
            opacity: 0.5;
        }

        .stat-item {
            text-align: center;
            position: relative;
            z-index: 1;
        }

        .stat-number {
            font-size: 3.5rem;
            font-weight: 800;
            color: var(--accent-color);
            margin-bottom: 5px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .stat-label {
            font-size: 1.1rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 1px;
            opacity: 0.9;
        }

        /* --- 3. CORE VALUES SECTION --- */
        .values-section {
            padding: 100px 0;
            background-color: var(--bg-light);
        }

        .value-card {
            background: #ffffff;
            padding: 40px 30px;
            border-radius: 16px;
            text-align: center;
            height: 100%;
            transition: all 0.4s ease;
            border: 1px solid var(--border-color);
        }

        .value-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0,0,0,0.05);
            border-color: transparent;
        }

        .value-icon {
            width: 80px;
            height: 80px;
            background-color: rgba(255, 107, 53, 0.1);
            color: var(--accent-color);
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 2rem;
            margin-bottom: 25px;
            transition: all 0.4s ease;
        }

        .value-card:hover .value-icon {
            background-color: var(--accent-color);
            color: white;
            transform: scale(1.1);
        }

        .value-card h4 {
            font-size: 1.25rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 15px;
        }

        /* Responsive Adjustments */
        @media (max-width: 991px) {
            .img-stack { min-height: 400px; margin-bottom: 50px; }
            .img-stack-back { width: 100%; height: 350px; }
            .img-stack-front { width: 60%; height: 250px; }
            .story-content h2 { font-size: 2.2rem; }
            .stat-item { margin-bottom: 40px; }
        }














/* --- LEGAL LAYOUT --- */
        .legal-section {
            padding: 80px 0;
        }

        /* Sticky Sidebar Menu */
        .legal-sidebar {
            position: sticky;
            top: 120px; /* Sticks below your navbar */
            background: var(--bg-light);
            border-radius: 12px;
            padding: 30px;
            border: 1px solid var(--border-color);
        }

        .legal-sidebar h4 {
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 20px;
            font-size: 1.15rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .legal-nav {
            list-style: none;
            padding: 0; margin: 0;
            border-left: 2px solid var(--border-color);
        }

        .legal-nav li {
            position: relative;
        }

        .legal-nav a {
            display: block;
            padding: 10px 15px 10px 20px;
            color: var(--text-color);
            text-decoration: none;
            font-weight: 500;
            font-size: 0.95rem;
            transition: all 0.3s ease;
            position: relative;
            left: -2px; /* Overlaps the border for the active indicator */
            border-left: 2px solid transparent;
        }

        .legal-nav a:hover {
            color: var(--primary-color);
            background-color: rgba(0,0,0,0.02);
        }

        /* Active State handled by Javascript ScrollSpy */
        .legal-nav a.active {
            color: var(--accent-color);
            border-left-color: var(--accent-color);
            font-weight: 600;
            background-color: rgba(255, 107, 53, 0.05);
        }

        /* --- LEGAL CONTENT TYPOGRAPHY --- */
        .legal-content {
            padding-left: 20px;
        }

        /* Offset for anchor links so they don't hide under your sticky navbar */
        .legal-content section {
            scroll-margin-top: 130px; 
            margin-bottom: 50px;
        }

        .legal-content h2 {
            font-size: 1.75rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 20px;
            padding-bottom: 10px;
            border-bottom: 1px solid var(--border-color);
        }

        .legal-content h3 {
            font-size: 1.25rem;
            font-weight: 600;
            color: var(--primary-color);
            margin-top: 30px;
            margin-bottom: 15px;
        }

        .legal-content p {
            font-size: 1.05rem;
            line-height: 1.8;
            margin-bottom: 20px;
        }

        .legal-content ul {
            font-size: 1.05rem;
            line-height: 1.8;
            margin-bottom: 20px;
            padding-left: 25px;
        }

        .legal-content li {
            margin-bottom: 10px;
        }

        /* Last updated badge */
        .last-updated {
            display: inline-block;
            background-color: var(--bg-light);
            padding: 8px 16px;
            border-radius: 30px;
            font-size: 0.9rem;
            font-weight: 500;
            color: var(--primary-color);
            border: 1px solid var(--border-color);
            margin-bottom: 40px;
        }

        @media (max-width: 991px) {
            .legal-sidebar {
                position: relative;
                top: 0;
                margin-bottom: 40px;
            }
            .legal-content {
                padding-left: 0;
            }
        }















.md-opo{
	background-color: #ff6b35;
}
.md-opo:hover{
	background-color: #12345c;
}
/* --- GSAP Sticky Content Section --- */
.sticky-bg-section {
    position: relative;
    /* Make the section much taller than the screen so we have time to scroll through it */
    height: 140vh; 
}

.sticky-bg-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Matches the 250vh height of the parent */
    z-index: 1; 
}

.sticky-bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sticky-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Fades from 95% dark blue on the left to 30% on the right */
    background: linear-gradient(90deg, rgba(19, 51, 92, 0.95) 0%, rgba(19, 51, 92, 0.3) 100%);
}

/* Content wrapper matches the height of the viewport */
.sticky-content-wrapper {
    position: relative;
    height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    z-index: 2; /* Sits above the background */
}

/* Mobile Adjustment for Overlay */
@media (max-width: 991px) {
    .sticky-overlay {
        background: linear-gradient(180deg, rgba(19, 51, 92, 0.95) 0%, rgba(19, 51, 92, 0.5) 100%);
    }
}





/* --- Booking Process Section --- */
.process-section {
    padding: 100px 0;
    background-color: white;
}

.process-card {
    position: relative;
    border-radius: 20px; /* Soft rounded corners */
    overflow: hidden;
    height: 380px;
    padding: 35px;
    display: flex;
    align-items: flex-end; /* Pushes content to the bottom */
    box-shadow: 0 10px 30px rgba(0,0,0,0.08); /* Soft shadow */
    cursor: pointer;
}

/* Background Image */
.process-bg {
    position: absolute;
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 0;
}

/* Primary Navy Overlay (Visible by default) */
.process-overlay-primary {
    position: absolute;
    inset: 0; /* Shorthand for top, bottom, left, right 0 */
    background: linear-gradient(180deg, rgba(19, 51, 92, 0.1) 0%, rgba(19, 51, 92, 0.95) 100%);
    transition: opacity 0.5s ease;
    z-index: 1;
}

/* Accent Orange Overlay (Hidden by default) */
.process-overlay-accent {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 107, 53, 0.2) 0%, rgba(255, 107, 53, 0.95) 100%);
    opacity: 0;
    transition: opacity 0.5s ease;
    z-index: 1;
}

/* Top Right Circular Icon */
.process-icon {
    position: absolute;
    top: 30px;
    right: 30px;
    width: 65px;
    height: 65px;
    background-color: var(--accent-color);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    z-index: 2;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.4);
    transition: all 0.5s ease;
}

/* Text Content Container */
.process-content {
    position: relative;
    z-index: 2;
    color: white;
    transition: transform 0.5s ease;
    transform: translateY(15px); /* Starts slightly pushed down */
}

/* --- HOVER EFFECTS --- */
.process-card:hover .process-bg {
    transform: scale(1.15); /* Smooth zoom in on background */
}

.process-card:hover .process-overlay-primary {
    opacity: 0; /* Hide Navy */
}

.process-card:hover .process-overlay-accent {
    opacity: 1; /* Show Orange */
}

.process-card:hover .process-content {
    transform: translateY(0); /* Text slides up naturally */
}

.process-card:hover .process-icon {
    background-color: white;
    color: var(--accent-color);
    transform: scale(1.1); /* Icon pops out slightly */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}










.glass-menu {
  list-style: none;
  padding: 0;
}

.glass-menu li a {
  position: relative;
  display: block;
  padding: 12px 24px;
  text-decoration: none;
  color: #fff;
  font-family: sans-serif;
  font-weight: 600;
  letter-spacing: 1px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 8px;
  transition: all 0.3s ease;
  overflow: hidden;
}

.glass-menu li a::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  transition: left 0.5s ease;
}

.glass-menu li a:hover {
  transform: translateY(-5px);
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.glass-menu li a:hover::before {
  left: 100%;
}









/* --- FAQ Section Styling --- */
.faq-section {
    padding: 100px 0;
    background-color: #f4f7f6;
}

/* Stylized Image Wrapper */
.faq-img-wrapper {
    position: relative;
    z-index: 1;
}

.faq-img-wrapper img {
    border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);
    position: relative;
    z-index: 2;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Decorative Background Shape */
.faq-img-wrapper::before {
    content: '';
    position: absolute;
    top: -20px;
    left: -20px;
    width: 100%;
    height: 100%;
    background-color: var(--primary-color);
    border-radius: 20px;
    opacity: 0.1;
    z-index: 1;
}

.faq-img-wrapper::after {
    content: '';
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 60%;
    height: 60%;
    background-image: radial-gradient(var(--accent-color) 2px, transparent 2px);
    background-size: 20px 20px;
    opacity: 0.3;
    z-index: 0;
}

/* --- Modern Accordion Styling --- */
.custom-accordion .accordion-item {
    border: none;
    border-radius: 12px !important; /* Force rounding on all items */
    margin-bottom: 16px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.04);
    background: white;
    border-left: 4px solid transparent;
    transition: all 0.3s ease;
    overflow: hidden;
}

/* Highlight the active item with accent color and deeper shadow */
.custom-accordion .accordion-item:has(.accordion-collapse.show) {
    border-left-color: var(--accent-color);
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.custom-accordion .accordion-button {
    font-weight: 600;
    font-size: 1.1rem;
    color: var(--primary-color);
    background-color: white;
    padding: 20px 25px;
    box-shadow: none !important; /* Removes Bootstrap's default blue focus glow */
    border-radius: 12px !important;
}

/* Text color when open */
.custom-accordion .accordion-button:not(.collapsed) {
    color: var(--accent-color);
    background-color: white;
}

/* --- Custom Animated +/- Icons replacing default arrows --- */
.custom-accordion .accordion-button::after {
    background-image: none !important; /* Forces default SVG hidden */
    font-family: "bootstrap-icons";
    content: "\F4FE"; /* Plus icon */
    font-size: 1.4rem;
    color: var(--primary-color);
    transition: all 0.3s ease;
}

.custom-accordion .accordion-button:not(.collapsed)::after {
    background-image: none !important; /* Keeps default active SVG hidden */
    content: "\F2EA"; /* Dash/Minus icon */
    color: var(--accent-color);
    transform: rotate(180deg); /* Smooth spin effect */
}

.custom-accordion .accordion-body {
    padding: 0 25px 25px 25px;
    color: #6c757d;
    line-height: 1.7;
    font-size: 0.95rem;
}








/* --- Modern Mega Footer Styling --- */
.footer-section {
    position: relative;
    background-color: #101010;
    color: white;
    overflow: hidden;
    padding-top: 80px;
}

/* Subtle Geometric Background Overlay */
.footer-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        radial-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 40px 40px;
    background-position: 0 0, 20px 20px;
    z-index: 0;
}

.footer-container {
    position: relative;
    z-index: 1;
}

/* Footer Logo matching Navbar */
.footer-brand {
    display: inline-block;
}

.footer-desc {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.95rem;
    line-height: 1.7;
    margin-top: 20px;
}

/* Social Icons */
.footer-socials {
    display: flex;
    gap: 15px;
    margin-top: 25px;
}

.footer-socials a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.05);
    color: white;
    border-radius: 50%;
    text-decoration: none;
    transition: all 0.3s ease;
}

.footer-socials a:hover {
    background-color: var(--accent-color);
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(255, 107, 53, 0.4);
}

/* Column Headings */
.footer-heading {
    color: white;
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    position: relative;
    padding-bottom: 10px;
}

/* Small orange accent line under headings */
.footer-heading::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 2px;
    background-color: var(--accent-color);
}

/* Link Lists */
.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

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

.footer-links a {
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
}

/* Hover Animation: Changes color and slides right */
.footer-links a:hover {
    color: var(--accent-color);
    transform: translateX(6px);
}

/* Contact List */
.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-contact li {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.95rem;
    line-height: 1.6;
}

.footer-contact i {
    color: var(--accent-color);
    font-size: 1.2rem;
    margin-top: 2px;
}

/* Copyright Bar */
.footer-bottom {
    background-color: #000; /* Slightly darker than primary color */
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding: 25px 0;
    margin-top: 60px;
    position: relative;
    z-index: 1;
}

.copyright-text {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.9rem;
    margin: 0;
}









/* --- Modern Blog Section --- */
.blog-section {
    padding: 100px 0;
    background-color: #ffffff;
}

.blog-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.4s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0,0,0,0.03);
}

.blog-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}

/* Image Wrapper & Zoom Effect */
.blog-img-wrapper {
    position: relative;
    overflow: hidden;
    height: 240px;
}

.blog-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.blog-card:hover .blog-img {
    transform: scale(1.08); /* Smooth zoom on hover */
}

/* Category Badge overlay on image */
.blog-category-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background-color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(4px);
    color: var(--primary-color);
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    z-index: 2;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Content Area */
.blog-content {
    padding: 30px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.blog-meta {
    font-size: 0.85rem;
    color: #888;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.blog-meta i {
    color: var(--accent-color);
}

.blog-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 15px;
    line-height: 1.4;
    transition: color 0.3s ease;
}

.blog-title a {
    color: inherit;
    text-decoration: none;
}

.blog-card:hover .blog-title {
    color: var(--accent-color);
}

.blog-excerpt {
    color: #666;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 25px;
    /* Limits text to 3 lines with an ellipsis */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Custom Read More Link */
.blog-read-more {
    margin-top: auto; /* Pushes to the bottom */
    display: inline-flex;
    align-items: center;
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: none;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: color 0.3s ease;
}

.blog-read-more i {
    margin-left: 8px;
    transition: transform 0.3s ease;
}

.blog-read-more:hover {
    color: var(--accent-color);
}

.blog-read-more:hover i {
    transform: translateX(5px); /* Arrow slides right on hover */
}













/* --- INNER PARALLAX HEADER (From previous build) --- */
        .inner-parallax-header {
            position: relative;
            height: 45vh;
            min-height: 350px;
            width: 100%;
            overflow: hidden;
            display: flex;
            align-items: center;
            background-color: var(--primary-color);
            padding-top: 80px; /* Accounts for sticky nav */
        }

        .inner-parallax-bg-img {
            position: absolute;
            top: 0; left: 0; width: 100%; height: 100%;
            object-fit: cover;
            z-index: 1;
        }

        .inner-parallax-overlay {
            position: absolute;
            inset: 0;
            background: rgba(19, 51, 92, 0.85); 
            z-index: 2;
        }

        .inner-parallax-content {
            position: relative;
            z-index: 3;
            width: 100%;
        }

        /* --- MAIN ARTICLE CONTENT --- */
        .article-main {
            padding: 60px 0;
        }

        .article-featured-img {
            width: 100%;
            height: auto;
            border-radius: 16px;
            margin-bottom: 30px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.08);
        }

        .article-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            font-size: 0.95rem;
            color: #64748b;
            margin-bottom: 30px;
            padding-bottom: 20px;
            border-bottom: 1px solid var(--border-color);
        }

        .article-meta i {
            color: var(--accent-color);
            margin-right: 6px;
        }

        /* Typography optimized for reading */
        .article-body {
            /*font-size: 1.15rem;*/
            line-height: 1.8;
            color: #334155;
        }

        .article-body p {
            margin-bottom: 25px;
        }

        .article-body h2, .article-body h3 {
            color: var(--primary-color);
            font-weight: 700;
            margin-top: 45px;
            margin-bottom: 20px;
        }

        /* Premium Blockquote styling */
        .article-body blockquote {
            font-family: 'Merriweather', serif;
            font-size: 1.35rem;
            font-style: italic;
            color: var(--primary-color);
            border-left: 4px solid var(--accent-color);
            padding: 20px 30px;
            margin: 40px 0;
            background-color: var(--bg-light);
            border-radius: 0 12px 12px 0;
        }

        /* Post Tags & Share */
        .article-footer {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            margin-top: 50px;
            padding-top: 30px;
            border-top: 1px solid var(--border-color);
        }

        .post-tags a {
            display: inline-block;
            background-color: var(--bg-light);
            color: var(--primary-color);
            padding: 6px 14px;
            border-radius: 30px;
            font-size: 0.85rem;
            font-weight: 600;
            margin-right: 8px;
            margin-bottom: 8px;
            border: 1px solid var(--border-color);
        }

        .post-tags a:hover {
            background-color: var(--accent-color);
            color: white;
            border-color: var(--accent-color);
        }

        .share-links a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 38px; height: 38px;
            border-radius: 50%;
            background-color: var(--bg-light);
            color: var(--primary-color);
            margin-left: 8px;
            transition: all 0.3s;
        }

        .share-links a:hover {
            background-color: var(--primary-color);
            color: white;
            transform: translateY(-3px);
        }

        /* Author Box */
        .author-box {
            display: flex;
            align-items: center;
            background-color: var(--bg-light);
            padding: 40px;
            border-radius: 16px;
            margin-top: 50px;
            gap: 25px;
        }

        .author-img {
            width: 100px;
            height: 100px;
            border-radius: 50%;
            object-fit: cover;
            box-shadow: 0 8px 20px rgba(0,0,0,0.1);
        }

        .author-info h4 {
            font-size: 1.2rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 8px;
        }

        .author-info p {
            margin-bottom: 0;
            font-size: 0.95rem;
        }

        /* --- SIDEBAR STYLING --- */
        .sidebar {
            /* Makes the sidebar sticky so it stays on screen while reading */
            position: sticky;
            top: 80px; 
        }

        .sidebar-widget {
            background-color: #fff;
            border: 1px solid var(--border-color);
            border-radius: 16px;
            padding: 30px;
            margin-bottom: 30px;
            box-shadow: 0 4px 15px rgb(0 0 0 / 10%);
        }

        .widget-title {
            font-size: 1.15rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 25px;
            position: relative;
            padding-bottom: 12px;
        }

        .widget-title::after {
            content: '';
            position: absolute;
            bottom: 0; left: 0;
            width: 40px; height: 3px;
            background-color: var(--accent-color);
            border-radius: 2px;
        }

        /* Search Widget */
        .search-form .input-group {
            border-radius: 8px;
            overflow: hidden;
            border: 1px solid var(--border-color);
        }
        .search-form input {
            border: none;
            padding: 12px 20px;
            box-shadow: none !important;
        }
        .search-form button {
            background-color: var(--primary-color);
            color: white;
            border: none;
            padding: 0 20px;
        }

        /* Related Posts Widget with Images */
        .related-posts-list {
            list-style: none;
            padding: 0; margin: 0;
        }

        .related-post-item {
            display: flex;
            align-items: center;
            gap: 15px;
            margin-bottom: 20px;
            padding-bottom: 20px;
            border-bottom: 1px solid var(--border-color);
        }

        .related-post-item:last-child {
            margin-bottom: 0; padding-bottom: 0; border-bottom: none;
        }

        .related-post-img {
            width: 80px;
            height: 80px;
            border-radius: 8px;
            object-fit: cover;
            flex-shrink: 0; /* Prevents image from squishing */
        }

        .related-post-info h5 {
            font-size: 1rem;
            font-weight: 600;
            line-height: 1.4;
            margin-bottom: 6px;
        }

        .related-post-info h5 a {
            color: var(--primary-color);
        }

        .related-post-info h5 a:hover {
            color: var(--accent-color);
        }

        .related-post-date {
            font-size: 0.8rem;
            color: #94a3b8;
            display: flex;
            align-items: center;
            gap: 5px;
        }

        /* Categories Widget */
        .category-list {
            list-style: none;
            padding: 0; margin: 0;
        }

        .category-list li {
            margin-bottom: 12px;
        }

        .category-list li:last-child { margin-bottom: 0; }

        .category-list a {
            display: flex;
            justify-content: space-between;
            align-items: center;
            color: var(--text-color);
            font-weight: 500;
            padding: 8px 0;
            border-bottom: 1px dashed var(--border-color);
        }

        .category-list a:hover {
            color: var(--accent-color);
            padding-left: 5px; /* Slide effect */
        }

        .category-count {
            background-color: var(--bg-light);
            font-size: 0.8rem;
            padding: 2px 8px;
            border-radius: 20px;
            color: var(--primary-color);
        }

        @media (max-width: 991px) {
            .author-box {
                flex-direction: column;
                text-align: center;
            }
        }









.faq-main-section {
            padding: 80px 0;
            background-color: var(--bg-light);
        }

        /* Sticky Sidebar Menu */
        .faq-sidebar {
            position: sticky;
            top: 120px; /* Sticks below your navbar */
            background: white;
            border-radius: 16px;
            padding: 30px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.03);
            border: 1px solid var(--border-color);
        }

        .faq-sidebar h4 {
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 20px;
            font-size: 1.2rem;
        }

        .faq-nav {
            list-style: none;
            padding: 0; margin: 0;
        }

        .faq-nav li {
            margin-bottom: 10px;
        }

        .faq-nav a {
            display: flex;
            align-items: center;
            padding: 12px 15px;
            color: var(--text-color);
            text-decoration: none;
            font-weight: 500;
            border-radius: 8px;
            transition: all 0.3s ease;
        }

        .faq-nav a:hover, .faq-nav a.active {
            background-color: rgba(255, 107, 53, 0.1);
            color: var(--accent-color);
        }

        .faq-nav a i {
            margin-right: 12px;
            font-size: 1.1rem;
        }

        /* FAQ Category Headings */
        .faq-category-title {
            font-size: 1.8rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 30px;
            padding-top: 100px; /* Offset for sticky header when jumping to anchors */
            margin-top: -100px;
        }

       

        /* Support Block */
        .support-block {
            background-color: var(--primary-color);
            color: white;
            border-radius: 16px;
            padding: 40px;
            margin-top: 60px;
            text-align: center;
        }












/* --- REVIEWS SUMMARY SECTION --- */
        .review-summary-section {
            padding: 60px 0;
            background-color: #ffffff;
            border-bottom: 1px solid var(--border-color);
        }

        .rating-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 100px;
            height: 100px;
            background-color: rgba(255, 107, 53, 0.1);
            color: var(--accent-color);
            border-radius: 24px;
            font-size: 2.5rem;
            font-weight: 800;
            margin-right: 30px;
            flex-shrink: 0;
        }

        .summary-text h2 {
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 5px;
        }

        .summary-stars i {
            color: var(--star-color);
            font-size: 1.4rem;
            margin-right: 2px;
        }

        /* --- MASONRY REVIEW GRID --- */
        .reviews-feed-section {
            padding: 80px 0;
        }

        /* Pure CSS Masonry Layout */
        .review-masonry {
            column-count: 3;
            column-gap: 24px;
        }

        @media (max-width: 991px) {
            .review-masonry { column-count: 2; }
        }

        @media (max-width: 767px) {
            .review-masonry { column-count: 1; }
        }

        /* Individual Review Card */
        .review-card {
            background: #ffffff;
            border-radius: 16px;
            padding: 35px;
            margin-bottom: 24px;
            border: 1px solid var(--border-color);
            box-shadow: 0 4px 15px rgba(0,0,0,0.02);
            break-inside: avoid; /* Prevents cards from splitting across masonry columns */
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            position: relative;
        }

        .review-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 35px rgba(0,0,0,0.06);
        }

        /* Decorative Quote Mark */
        .review-card::before {
            content: "\F6B0"; /* Bootstrap Quote Icon */
            font-family: "bootstrap-icons";
            position: absolute;
            top: 25px;
            right: 30px;
            font-size: 2.5rem;
            color: var(--bg-light);
            opacity: 0.8;
        }

        .review-stars {
            margin-bottom: 15px;
        }

        .review-stars i {
            color: var(--star-color);
            font-size: 1.1rem;
        }

        .review-text {
            font-size: 1.05rem;
            line-height: 1.7;
            color: #334155;
            margin-bottom: 25px;
            font-style: italic;
        }

        /* Reviewer Profile Area */
        .reviewer-profile {
            display: flex;
            align-items: center;
            border-top: 1px solid var(--bg-light);
            padding-top: 20px;
        }

        .reviewer-img {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            object-fit: cover;
            margin-right: 15px;
        }

        .reviewer-info h4 {
            font-size: 1rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 0;
        }

        .reviewer-info span {
            font-size: 0.85rem;
            color: #94a3b8;
        }

        .review-platform {
            margin-left: auto; /* Pushes platform icon to the right */
            color: #cbd5e1;
            font-size: 1.2rem;
        }

        /* --- CTA SECTION --- */
        .cta-section {
            background-color: var(--primary-color);
            padding: 80px 0;
            text-align: center;
        }














/* --- Scroll Car Tracker --- */
.scroll-car-tracker {
    position: fixed;
    right: 15px; /* Sits just inside the scrollbar */
    top: 0;
    width: 45px; /* Small, unobtrusive size */
    z-index: 9999;
    pointer-events: none; /* Prevents it from blocking clicks on buttons underneath */
    opacity: 0; /* Hidden while in the banner section */
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s;
}

/* This is the inner container that handles the smooth turning animation */
.scroll-car-rotator {
    width: 100%;
    transform: rotate(180deg); /* Faces down by default */
    /* Smooth turning animation using a nice cubic-bezier curve */
    transition: transform 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
    filter: drop-shadow(0px 4px 6px rgba(0,0,0,0.3));
}

/* Make sure the SVG fills the wrapper */
.scroll-car-rotator svg {
    width: 100%;
    height: auto;
    display: block;
}












.interactive-reviews-section:after {
    content: '';
    background-color: red;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: linear-gradient(90deg, rgba(19, 51, 92, 0.95) 0%, rgba(19, 51, 92, 0.3) 100%);
	z-index: -1
}


/* --- Premium Interactive Reviews Section --- */
.interactive-reviews-section {
    padding: 100px 0;
    background-color: #0f172a; /* Premium dark background */
    color: #ffffff;
    overflow: hidden;
    position: relative;
    font-family: 'Poppins', sans-serif;
}

.reviews-intro-sticky {
    position: sticky;
    top: 120px; /* Keeps text in view while scrolling past */
    padding-right: 20px;
}

.reviews-intro-sticky h2 {
    font-size: 42px;
    font-weight: 800;
    color: #ffffff;
    line-height: 1.2;
    margin-bottom: 20px;
}

.reviews-intro-sticky h2 span {
    color: #fe6a36; /* Google Yellow Accent */
}

.reviews-intro-sticky p {
    color: #94a3b8;
    font-size: 16px;
    margin-bottom: 35px;
}

/* Big Google Badge */
.google-badge-large {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 20px 25px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    gap: 20px;
    backdrop-filter: blur(10px);
}

.google-badge-large img {
    width: 45px;
    height: 45px;
}

.google-badge-large .stars {
    color: #fbbc04;
    font-size: 20px;
    letter-spacing: 2px;
    margin-bottom: 4px;
}

.google-badge-large .text {
    color: #e2e8f0;
    font-size: 14px;
}

.google-badge-large .text strong {
    font-size: 18px;
    color: #ffffff;
}

/* --- Scrolling Columns Container --- */
.reviews-scroll-container {
    height: 700px; /* Adjust height as needed */
    display: flex;
    gap: 24px;
    overflow: hidden;
    /* This creates the fade out effect at the top and bottom */
    mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
}

.scroll-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    will-change: transform; /* Performance optimization */
}

/* Authentic Google Review Card */
.g-review-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    color: #111827;
}

.g-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 15px;
}

.g-user {
    display: flex;
    align-items: center;
    gap: 12px;
}

.g-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #468ebb;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
}

.g-user-info .g-name {
    font-weight: 700;
    font-size: 15px;
    line-height: 1.2;
}

.g-user-info .g-time {
    font-size: 12px;
    color: #64748b;
    margin-top: 2px;
}

.g-logo-small {
    width: 20px;
    height: 20px;
}

.g-stars {
    color: #fbbc04;
    font-size: 14px;
    margin-bottom: 12px;
}

.g-text {
    font-size: 14px;
    color: #4b5563;
    line-height: 1.6;
}

@media (max-width: 991px) {
    .reviews-intro-sticky {
        position: relative;
        top: 0;
        margin-bottom: 50px;
        text-align: center;
    }
    .reviews-scroll-container {
        height: 500px;
    }
}
/* Fix for overlapping review cards */
.scroll-wrapper-inner {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding-bottom: 24px; /* Ensures spacing between the original and the cloned loop */
}

/* Ensure the cards themselves don't shrink unexpectedly */
.g-review-card {
    flex-shrink: 0; 
}

















/* --- Full Screen Hero Swiper --- */
        .hero-swiper {
            width: 100%;
            height: 100vh; 
            position: relative;
            background-color: var(--primary-color);
        }

        .hero-slide {
            position: relative;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        .hero-bg-img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 1;
            transform: scale(1.1);
            transition: transform 6s ease-out;
        }
        
        .swiper-slide-active .hero-bg-img {
            transform: scale(1);
        }

        /* Left-Side Gradient Overlay */
        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            /* Extra dark on the left to ensure the route lists are easy to read */
            background: linear-gradient(90deg, rgba(19, 51, 92, 0.95) 0%, rgba(19, 51, 92, 0.85) 35%, rgba(19, 51, 92, 0) 100%);
            z-index: 2;
        }

        .hero-content {
            position: relative;
            z-index: 3;
            height: 100%;
            display: flex;
            align-items: center; 
        }

        .hero-text-wrapper {
            opacity: 0;
            transform: translateY(40px);
            transition: all 1s ease 0.3s; 
        }

        .swiper-slide-active .hero-text-wrapper {
            opacity: 1;
            transform: translateY(0);
        }

        /* --- Modern Route List Styling --- */
        .route-list {
            list-style: none;
            padding-left: 0;
            border-left: 2px solid rgba(255, 107, 53, 0.5); /* Accent color border */
            margin-left: 10px;
        }

        .route-list li {
            padding: 12px 0 12px 20px;
            font-size: 1.05rem;
            color: rgba(255, 255, 255, 0.9);
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            position: relative;
            display: flex;
            align-items: center;
        }

        .route-list li:last-child {
            border-bottom: none;
        }

        /* Map Pin Dot */
        .route-list li::before {
            content: '';
            position: absolute;
            left: -6px; /* Centers the dot on the border */
            top: 50%;
            transform: translateY(-50%);
            width: 10px;
            height: 10px;
            background-color: var(--accent-color);
            border-radius: 50%;
            box-shadow: 0 0 10px rgba(255, 107, 53, 0.8);
        }

        /* --- Navigation Arrows --- */
        .hero-nav-btn {
            position: absolute;
            bottom: 0;
            transform: translateY(-50%);
            width: 55px;
            height: 55px;
            background-color: rgba(255, 255, 255, 0.1);
            backdrop-filter: blur(5px);
            -webkit-backdrop-filter: blur(5px);
            border: 1px solid rgba(255,255,255,0.2);
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 10;
            cursor: pointer;
            transition: all 0.3s ease;
        }
        .hero-nav-btn i { font-size: 1.5rem; }
        .hero-nav-btn:hover {
            background-color: var(--accent-color);
            border-color: var(--accent-color);
            transform: translateY(-50%) scale(1.1);
        }
        .hero-prev { right: 100px; }
        .hero-next { right: 30px; }

        /* --- Material Button --- */
        .md-btn {
            position: relative;
            overflow: hidden;
            background-color: var(--accent-color);
            color: white;
            border: none;
            border-radius: 4px;
            padding: 14px 32px;
            font-size: 14px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1.25px;
            box-shadow: 0 3px 1px -2px rgba(0,0,0,0.2), 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12);
            transition: all 0.3s ease;
        }
        .md-btn:hover {
            background-color: #e65c2b;
            box-shadow: 0 4px 8px rgba(0,0,0,0.3);
            color: white;
        }

        @media (max-width: 991px) {
            .hero-overlay {
                background: linear-gradient(180deg, rgba(19, 51, 92, 0.95) 0%, rgba(19, 51, 92, 0.8) 100%);
            }
            .hero-nav-btn { width: 45px; height: 45px; }
            .hero-prev { right: 70px; }
            .hero-next { right: 10px; }
            .route-list li { font-size: 0.95rem; }
        }





























        /* Mobile Adjustments */
        



@media (max-width:1199px){
	
.banner-section h1 {
    font-size: 28px;
}
}

@media (max-width: 991px) {
            .smart-scroll {
                top: 10px; 
            }
            .banner-section {
                height: auto;
                min-height: 100vh;
                padding-top: 180px;
                padding-bottom: 120px;
            }
            /*.navbar-brand {
                position: static;
                transform: none;
            }*/
            .navbar .container-fluid {
                justify-content: space-between;
            }
			.faq-img-wrapper {
    max-width: 400px;
    display: block;
    margin: auto;
}
			
        }


@media (max-width:767px){
	.navbar-brand {
                position: static;
                transform: none;
		max-width: 80px;
            }
	
	.hero-swiper{
		height: 80vh;
	}
	.navbar.scrolled-up, .navbar.smart-scroll{
		padding: 5px 0;
	}
	
	    .faq-img-wrapper {
        max-width: 300px;
        display: block;
        margin: auto;
    }
	.scrolled-up .navbar-brand, .smart-scroll .navbar-brand{
		position: relative;
		left: 0
	}
	/*.navbar.smart-scroll{
		padding: 0;
	}*/
}