/* ==========================================================
   Sri Langta Baba Aviation
   Premium Aviation Theme
   Version : 1.0
========================================================== */

/* ================= GOOGLE FONT ================= */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

/* ================= ROOT ================= */

:root{

    --primary:#081B3A;
    --secondary:#ff4d00;
    --white:#ffffff;
    --black:#111111;
    --text:#666666;
    --bg:#F5F8FC;

    --radius:12px;

    --transition:.35s ease;

    --shadow:0 12px 35px rgba(0,0,0,.08);

}




/* ================= RESET ================= */

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    font-family:'Poppins',sans-serif;
    background:var(--bg);
    color:var(--text);
    overflow-x:hidden;

}

img{

    max-width:100%;
    display:block;

}

a{

    text-decoration:none;

}

ul{

    list-style:none;

}

.container{

    width:90%;
    max-width:1320px;
    margin:auto;

}

/* ================= PRELOADER ================= */

.preloader{

    position:fixed;
    inset:0;
    background:#081B3A;
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:99999;

}

.loader{

    width:70px;
    height:70px;
    border-radius:50%;
    border:6px solid rgba(255,255,255,.2);
    border-top-color:#ff4d00;
    animation:spin 1s linear infinite;

}

@keyframes spin{

    to{

        transform:rotate(360deg);

    }

}

/* ================= BUTTON ================= */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: auto;
    min-width: 150px;

    padding: 15px 28px;

    border-radius: 50px;

    font-size: 16px;
    font-weight: 600;

    line-height: 1;
    white-space: nowrap;

    text-decoration: none;

    background: #ff5a00;
    color: #ffffff;

    border: none;

    transition: all 0.3s ease;

    box-sizing: border-box;
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(255, 90, 0, 0.25);
}

.btn:hover{

    transform:translateY(-4px);

    background:#be9820;

}

.btn-outline{

    background:transparent;

    border:2px solid #fff;

}

.btn-outline:hover{

    background:#fff;

    color:var(--primary);

}

/* ================= HEADER ================= */

.header{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:1000;

    transition:.4s;

    padding:19px 0;
    
    background:#081B3A;

}

.header .container{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.logo img{

    width:180px;

}


.header .navbar {
    margin-left: auto;
    margin-right: 25px;
}

.navbar ul{

    display:flex;

    gap:35px;

}

.navbar a{

    color:#fff;

    font-size:15px;

    font-weight:500;

    position:relative;

}

.navbar a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:0;

    height:2px;

    background:#ff4d00;

    transition:.3s;

}

.navbar a:hover::after,

.navbar .active::after{

    width:100%;

}

.mobile-menu{

    display:none;

    color:#fff;

    font-size:28px;

    cursor:pointer;

}

/* ================= HERO ================= */

.hero{

    min-height:100vh;

    background:url("../images/hero.jpg") center center/cover no-repeat;

    position:relative;

    display:flex;

    align-items:center;

}

.hero-overlay{

    position:absolute;

    inset:0;

    background:rgba(8,27,58,.72);

}

.hero .container{

    position:relative;

    z-index:5;

}

.hero-content{

    max-width:700px;

}

.subtitle{

    color:#ff4d00;

    font-size:18px;

    letter-spacing:2px;

    text-transform:uppercase;

}

.hero h1{

    color:#fff;

    font-size:68px;

    line-height:1.1;

    margin:20px 0;

}

.hero p{

    color:#ddd;

    line-height:1.9;

    margin-bottom:35px;

}

.hero-buttons{

    display:flex;

    gap:20px;

}

.scroll-down{

    position:absolute;

    bottom:35px;

    left:50%;

    transform:translateX(-50%);

    color:#fff;

    font-size:35px;

    animation:float 1.5s infinite;

}

@keyframes float{

    50%{

        transform:translate(-50%,10px);

    }

}

/* ================= SECTION TITLE ================= */

.section-title{

    text-align:center;

    margin-bottom:60px;

}

.section-title span{

    color:#ff4d00;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

}

.section-title h2{

    color:#081B3A;

    font-size:42px;

    margin-top:15px;

}

.section-title p{

    width:700px;

    max-width:100%;

    margin:20px auto 0;

}

/* ================= ABOUT ================= */

.about-preview{

    padding:120px 0;

    background:#fff;

}

.about-preview .container{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.about-left img{

    border-radius:18px;

    box-shadow:var(--shadow);

}

.about-right h2{

    font-size:42px;

    color:#081B3A;

    margin:18px 0;

}

.about-right p{

    line-height:1.9;

    margin-bottom:30px;

}

.about-right ul{

    margin-bottom:30px;

}

.about-right li{

    margin-bottom:15px;

    color:#333;

}

.about-right i{

    color:#ff4d00;

    margin-right:10px;

}

/*=====================================================
        SERVICES SECTION
=====================================================*/

.services{

    padding:120px 0;

    background:#f8fbff;

}

.service-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.service-card{

    background:#fff;

    padding:45px 30px;

    text-align:center;

    border-radius:18px;

    transition:.4s;

    box-shadow:0 15px 40px rgba(0,0,0,.06);

    position:relative;

    overflow:hidden;

}

.service-card::before{

    content:"";

    position:absolute;

    width:0;

    height:4px;

    background:#ff4d00;

    left:0;

    top:0;

    transition:.4s;

}

.service-card:hover::before{

    width:100%;

}

.service-card:hover{

    transform:translateY(-15px);

}

.service-card i{

    font-size:55px;

    color:#ff4d00;

    margin-bottom:25px;

}

.service-card h3{

    color:#081B3A;

    margin-bottom:15px;

    font-size:24px;

}

.service-card p{

    line-height:1.8;

    margin-bottom:25px;

}

.service-card a{

    color:#081B3A;

    font-weight:600;

    transition:.3s;

}

.service-card a:hover{

    color:#ff4d00;

}

/*=====================================================
                FLEET SECTION
=====================================================*/

.fleet{

    padding:120px 0;

    background:#ffffff;

}

.fleet-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:35px;

}

.fleet-card{

    overflow:hidden;

    border-radius:18px;

    background:#fff;

    box-shadow:0 20px 45px rgba(0,0,0,.08);

    transition:.4s;

}

.fleet-card:hover{

    transform:translateY(-12px);

}

.fleet-card img{

    width:100%;

    height:280px;

    object-fit:cover;

    transition:.5s;

}

.fleet-card:hover img{

    transform:scale(1.08);

}

.fleet-content{

    padding:30px;

}

.fleet-content h3{

    color:#081B3A;

    margin-bottom:10px;

}

.fleet-content p{

    color:#666;

}

/*=====================================================
            WHY CHOOSE US
=====================================================*/

.why-us{

    padding:120px 0;

    background:#F5F8FC;

}

.why-us .container{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.why-us img{

    border-radius:20px;

    box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.why-us span{

    color:#ff4d00;

    letter-spacing:2px;

    font-weight:600;

}

.why-us h2{

    font-size:42px;

    color:#081B3A;

    margin:18px 0;

}

.why-us p{

    line-height:1.9;

    margin-bottom:35px;

}

.features{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:25px;

}

.feature{

    display:flex;

    align-items:flex-start;

    gap:18px;

    background:#fff;

    padding:22px;

    border-radius:15px;

    transition:.35s;

    box-shadow:0 12px 30px rgba(0,0,0,.05);

}

.feature:hover{

    transform:translateY(-8px);

}

.feature i{

    font-size:28px;

    color:#ff4d00;

}

.feature h4{

    color:#081B3A;

    margin-bottom:6px;

}

/*=====================================================
            COUNTER SECTION
=====================================================*/

.counter{

    background:#081B3A;

    padding:90px 0;

}

.counter .container{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.counter-box{

    text-align:center;

}

.counter-box h2{

    color:#ff4d00;

    font-size:56px;

    margin-bottom:10px;

}

.counter-box p{

    color:#ffffff;

    letter-spacing:1px;

}

/*=====================================================
            CARD HOVER EFFECT
=====================================================*/

.service-card,
.fleet-card,
.feature{

    transition:all .35s ease;

}

.service-card:hover,
.fleet-card:hover,
.feature:hover{

    box-shadow:0 25px 50px rgba(0,0,0,.12);

}

/*=====================================================
        IMAGE ZOOM ANIMATION
=====================================================*/

.about-left img,
.fleet-card img{

    transition:.5s;

}

.about-left{

    overflow:hidden;

    border-radius:18px;

}

.about-left:hover img{

    transform:scale(1.06);

}

/*=====================================================
        FADE UP ANIMATION
=====================================================*/

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(50px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

.fade-up{

    animation:fadeUp .8s ease forwards;

}

/*=====================================================
                TESTIMONIAL SECTION
=====================================================*/

.testimonials{

    padding:120px 0;

    background:#ffffff;

}

.testimonial-wrapper{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.testimonial-card{

    background:#fff;

    border-radius:18px;

    padding:35px;

    text-align:center;

    box-shadow:0 20px 40px rgba(0,0,0,.07);

    transition:.35s;

}

.testimonial-card:hover{

    transform:translateY(-12px);

}

.testimonial-card img{

    width:90px;

    height:90px;

    border-radius:50%;

    object-fit:cover;

    margin:0 auto 20px;

    border:4px solid #ff4d00;

}

.testimonial-card p{

    line-height:1.9;

    margin-bottom:25px;

    color:#666;

    font-style:italic;

}

.testimonial-card h3{

    color:#081B3A;

    margin-bottom:5px;

}

.testimonial-card span{

    color:#ff4d00;

    font-size:14px;

}

/*=====================================================
                    NEWS
=====================================================*/

.news{

    padding:120px 0;

    background:#F5F8FC;

}

.news-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.news-card{

    background:#fff;

    border-radius:18px;

    overflow:hidden;

    transition:.35s;

    box-shadow:0 20px 40px rgba(0,0,0,.07);

}

.news-card:hover{

    transform:translateY(-12px);

}

.news-card img{

    width:100%;

    height:240px;

    object-fit:cover;

    transition:.5s;

}

.news-card:hover img{

    transform:scale(1.08);

}

.news-content{

    padding:28px;

}

.news-content span{

    color:#ff4d00;

    font-size:14px;

    font-weight:600;

}

.news-content h3{

    color:#081B3A;

    margin:15px 0;

    line-height:1.4;

}

.news-content p{

    line-height:1.8;

    margin-bottom:20px;

}

.news-content a{

    color:#081B3A;

    font-weight:600;

    transition:.3s;

}

.news-content a:hover{

    color:#ff4d00;

}

/*=====================================================
                CTA SECTION
=====================================================*/

.cta{

    padding:100px 0;

    text-align:center;

    background:linear-gradient(rgba(8,27,58,.90),rgba(8,27,58,.90)),
    url("../images/cta.jpg") center/cover no-repeat;

}

.cta h2{

    color:#fff;

    font-size:48px;

    margin-bottom:20px;

}

.cta p{

    color:#ddd;

    width:700px;

    max-width:100%;

    margin:auto;

    margin-bottom:35px;

    line-height:1.8;

}

/*=====================================================
                    FOOTER
=====================================================*/

footer{

    background:#06142d;

    color:#fff;

}

.footer-grid{

    display:grid;

    grid-template-columns:2fr 1fr 1fr 1fr;

    gap:40px;

    padding:90px 0;

}

footer h3{

    margin-bottom:20px;

    color:#fff;

}

footer p{

    color:#c7d0da;

    line-height:1.9;

}

footer ul li{

    margin-bottom:14px;

}

footer ul li a{

    color:#c7d0da;

    transition:.3s;

}

footer ul li a:hover{

    color:#ff4d00;

    padding-left:8px;

}

.footer-bottom{

    border-top:1px solid rgba(255,255,255,.08);

    text-align:center;

    padding:25px;

    color:#d6d6d6;

}

/*=====================================================
            BACK TO TOP BUTTON
=====================================================*/

.back-to-top{

    position:fixed;

    right:25px;

    bottom:25px;

    width:52px;

    height:52px;

    background:#ff4d00;

    color:#fff;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:20px;

    z-index:999;

    transition:.35s;

}

.back-to-top:hover{

    transform:translateY(-6px);

}

/*=====================================================
            WHATSAPP BUTTON
=====================================================*/

.whatsapp{

    position:fixed;

    left:25px;

    bottom:25px;

    width:58px;

    height:58px;

    background:#25D366;

    color:#fff;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:28px;

    z-index:999;

    box-shadow:0 10px 30px rgba(0,0,0,.18);

    transition:.35s;

}

.whatsapp:hover{

    transform:scale(1.08);

}

/*=====================================================
            CUSTOM SCROLLBAR
=====================================================*/

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-track{

    background:#e8eef5;

}

::-webkit-scrollbar-thumb{

    background:#ff4d00;

    border-radius:30px;

}

::-webkit-scrollbar-thumb:hover{

    background:#b9931f;

}

/*=====================================================
            TEXT SELECTION
=====================================================*/

::selection{

    background:#ff4d00;

    color:#fff;

}

/*=====================================================
            COMMON SPACING
=====================================================*/

section{

    position:relative;

}

.text-center{

    text-align:center;

}

.mt-50{

    margin-top:50px;

}

.mb-50{

    margin-bottom:50px;

}

/*=====================================================
            SIMPLE FADE EFFECT
=====================================================*/

.fade{

    opacity:0;

    transform:translateY(40px);

    transition:.8s;

}

.fade.show{

    opacity:1;

    transform:translateY(0);

}



/*=====================================================
                ABOUT PAGE CSS
======================================================*/

/*========== PAGE HERO ==========*/

.page-hero{

    height:420px;

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    margin-top:50px;

}

.page-hero .hero-overlay{

    position:absolute;

    inset:0;

    background:rgba(8,27,58,.72);

}

.page-content{

    position:relative;

    z-index:2;

}

.page-content h1{

    color:#fff;

    font-size:58px;

    margin-bottom:15px;

}

.page-content p{

    color:#fff;

    font-size:18px;

}

/*========== STORY ==========*/

.story{

    padding:120px 0;

    background:#fff;

}

.story-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:60px;

    align-items:center;

}

.story-grid img{

    border-radius:18px;

    box-shadow:0 15px 35px rgba(0,0,0,.1);

}

.story-grid p{

    line-height:1.9;

    margin-bottom:20px;

}

/*========== MISSION ==========*/

.mission-vision{

    padding:120px 0;

    background:#F5F8FC;

}

.mission-vision .container{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

}

.mission-box,
.vision-box{

    background:#fff;

    padding:45px;

    border-radius:18px;

    text-align:center;

    transition:.35s;

    box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.mission-box:hover,
.vision-box:hover{

    transform:translateY(-10px);

}

.mission-box .icon,
.vision-box .icon{

    width:85px;

    height:85px;

    margin:auto;

    border-radius:50%;

    background:#ff4d00;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:34px;

    margin-bottom:25px;

}

.mission-box h2,
.vision-box h2{

    color:#081B3A;

    margin-bottom:18px;

}

/*========== CORE VALUES ==========*/

.core-values{

    padding:120px 0;

    background:#fff;

}

.values-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.value-card{

    background:#fff;

    text-align:center;

    padding:40px 25px;

    border-radius:18px;

    transition:.35s;

    box-shadow:0 15px 35px rgba(0,0,0,.07);

}

.value-card:hover{

    transform:translateY(-12px);

}

.value-card i{

    font-size:55px;

    color:#ff4d00;

    margin-bottom:22px;

}

.value-card h3{

    color:#081B3A;

    margin-bottom:12px;

}

.value-card p{

    line-height:1.8;

}

/*========== CHAIRMAN ==========*/

.chairman{

    padding:120px 0;

    background:#fff;

}

.chairman .container{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.chairman img{

    border-radius:18px;

    box-shadow:0 15px 35px rgba(0,0,0,.1);

}

.chairman h4{

    margin-top:25px;

    color:#ff4d00;

}

/*========== TIMELINE ==========*/

.timeline{

    padding:120px 0;

    background:#F5F8FC;

}

.timeline-wrapper{

    position:relative;

    margin-top:60px;

    border-left:4px solid #ff4d00;

    padding-left:45px;

}

.timeline-item{

    position:relative;

    margin-bottom:50px;

}

.timeline-item::before{

    content:"";

    position:absolute;

    width:18px;

    height:18px;

    border-radius:50%;

    background:#ff4d00;

    left:-56px;

    top:8px;

}

.timeline-item h3{

    color:#081B3A;

    margin-bottom:10px;

}

.timeline-item p{

    line-height:1.8;

}

/*========== ANIMATION ==========*/

.value-card,
.timeline-item,
.mission-box,
.vision-box{

    transition:.35s;

}

.timeline-item:hover{

    transform:translateX(10px);

}

/*========== RESPONSIVE ==========*/

@media(max-width:991px){

.story-grid,
.chairman .container,
.mission-vision .container{

grid-template-columns:1fr;

}

.values-grid{

grid-template-columns:repeat(2,1fr);

}

.page-content h1{

font-size:42px;

}

}

@media(max-width:576px){

.values-grid{

grid-template-columns:1fr;

}

.page-content h1{

font-size:34px;

}

.story,
.core-values,
.timeline,
.chairman,
.mission-vision{

padding:80px 0;

}

.timeline-wrapper{

padding-left:25px;

}

.timeline-item::before{

left:-36px;

}

}

/*=========================================
        ABOUT PAGE IMPROVEMENT
=========================================*/

/* Common Section */

.about-preview,
.story,
.chairman,
.why-us{

    padding:100px 0;

}

/* Equal Grid */

.about-preview .container,
.story-grid,
.chairman .container,
.why-us .container{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

/* Image Box */

.about-left,
.story-grid > div:last-child,
.chairman .about-left,
.why-us .left{

    width:100%;
    height:500px;
    overflow:hidden;
    border-radius:20px;

}

/* Images */

.about-left img,
.story-grid img,
.chairman img,
.why-us img{

    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:.5s;

}

.about-left:hover img,
.story-grid:hover img,
.chairman:hover img,
.why-us:hover img{

    transform:scale(1.05);

}

/* Text */

.about-right,
.story-grid > div:first-child,
.chairman .about-right,
.why-us .right{

    display:flex;
    flex-direction:column;
    justify-content:center;

}

.about-right p,
.story p,
.chairman p,
.why-us p{

    line-height:1.9;
    margin-bottom:18px;

}

.about-right ul{

    margin-top:20px;

}

.about-right ul li{

    margin-bottom:12px;

}

/* Timeline */

.timeline-wrapper{

    max-width:900px;
    margin:60px auto 0;

}

/* Mission */

.mission-box,
.vision-box{

    min-height:320px;

}

/* Value Card */

.value-card{

    min-height:280px;

}

/* Hover */

.value-card:hover,
.mission-box:hover,
.vision-box:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 45px rgba(0,0,0,.12);

}