﻿
/*---------------------------------=========================================  Flight  Hero  section ============================================================ ------------------------------------*/

/* Flight Hero Banner */
.Flight-page-banner {
    position: relative;
    width: 100%;
    min-height: 400px;
    background-color: #eaf6ff;
    background-image: url('../images/b2bflight-hero-image.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

/* Banner Container */
.Flight-banner-container {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    min-height: 400px;
    padding: 20px 85px !important;
}

/* Banner Content */
.Flight-banner-content {
    position: relative;
    z-index: 2;
    max-width: 620px;
    padding-bottom: 12px;
}

/* Banner Eyebrow */
.Flight-banner-eyebrow {
    display: inline-block;
    margin-bottom: 9px;
    color: #0867ed;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 3px;
    line-height: 1.4;
}

/* Banner Title */
.Flight-banner-title {
    margin: 0 0 12px;
    color: #082b70;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1.2px;
}

    /* Highlighted Title */
    .Flight-banner-title span {
        display: block;
        color: #0867ed;
    }

/* Banner Description */
.Flight-banner-description {
    max-width: 480px;
    margin: 0;
    color: #365b92;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
}

/* First Flight Booking Offer */
.Flight-banner-offer {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    max-width: 100%;
    min-height: 72px;
    margin-top: 18px;
    padding: 9px 14px 9px 10px;
    border: 1px solid #ffd6ce;
    border-radius: 15px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 7px 22px rgba(160, 45, 45, .12);
    overflow: visible;
    isolation: isolate;
    transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

    /* Offer Hover */
    .Flight-page-banner:hover .Flight-banner-offer,
    .Flight-banner-offer:hover {
        transform: translateY(-3px);
        border-color: #ffaaa3;
        box-shadow: 0 12px 28px rgba(160, 45, 45, .18);
    }

/* Animated Gift Container */
.Flight-banner-gift {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-shrink: 0;
    width: 65px;
    height: 55px;
    overflow: visible;
    perspective: 500px;
}

/* Gift Box Body */
.Flight-banner-gift-box {
    position: absolute;
    z-index: 4;
    bottom: 2px;
    left: 10px;
    width: 45px;
    height: 35px;
    border: 1px solid #d60818;
    border-radius: 4px 4px 7px 7px;
    background: linear-gradient(135deg, #ff525b, #ed1725);
    box-shadow: 0 4px 9px rgba(226, 12, 24, .22);
}

/* Gift Box Vertical Ribbon */
.Flight-banner-gift-ribbon {
    position: absolute;
    top: 0;
    left: 50%;
    width: 10px;
    height: 100%;
    background: linear-gradient(90deg, #ffcf53, #fff0a3);
    transform: translateX(-50%);
}

/* Gift Box Lid */
.Flight-banner-gift-lid {
    position: absolute;
    z-index: 6;
    bottom: 35px;
    left: 7px;
    width: 51px;
    height: 12px;
    border: 1px solid #c80c1c;
    border-radius: 4px;
    background: linear-gradient(135deg, #ff646c, #f21c2b);
    transform-origin: 12% 90%;
    transition: transform .65s cubic-bezier(.22, 1, .36, 1), opacity .4s ease;
}

/* Gift Lid Ribbon */
.Flight-banner-gift-lid-ribbon {
    position: absolute;
    top: 0;
    left: 50%;
    width: 11px;
    height: 100%;
    background: #ffe084;
    transform: translateX(-50%);
}

/* Flight Ticket Inside Gift Box */
.Flight-banner-gift-ticket {
    position: absolute;
    z-index: 3;
    bottom: 16px;
    left: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    width: 36px;
    height: 42px;
    border: 1px dashed #90b8ff;
    border-radius: 5px;
    background: linear-gradient(145deg, #fff, #eaf3ff);
    color: #0867ed;
    box-shadow: 0 4px 10px rgba(8, 103, 237, .15);
    opacity: 0;
    transform: translateY(12px) scale(.65);
    transition: transform .75s cubic-bezier(.22, 1, .36, 1), opacity .4s ease;
}

    /* Flight Ticket Plane Icon */
    .Flight-banner-gift-ticket i {
        color: #0867ed;
        font-size: 14px;
        transform: rotate(-25deg);
    }

    /* Flight Ticket Heading */
    .Flight-banner-gift-ticket strong {
        color: #0867ed;
        font-size: 8px;
        font-weight: 900;
        line-height: 1.1;
    }

    /* Flight Ticket Subtitle */
    .Flight-banner-gift-ticket small {
        color: #059669;
        font-size: 7px;
        font-weight: 900;
        line-height: 1.1;
    }

/* Gift Lid Opening on Banner Hover */
.Flight-page-banner:hover .Flight-banner-gift-lid,
.Flight-banner-offer:hover .Flight-banner-gift-lid {
    transform: translate(-13px, -17px) rotate(-38deg);
}

/* Flight Ticket Coming Out on Hover */
.Flight-page-banner:hover .Flight-banner-gift-ticket,
.Flight-banner-offer:hover .Flight-banner-gift-ticket {
    z-index: 5;
    opacity: 1;
    transform: translateY(-39px) rotate(-9deg) scale(1.12);
    transition-delay: .12s;
}

/* Offer Content */
.Flight-banner-offer-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

    /* Offer Heading */
    .Flight-banner-offer-content strong {
        color: #e20c18;
        font-size: 17px;
        font-weight: 900;
        line-height: 1.1;
    }

    /* Offer Description */
    .Flight-banner-offer-content span {
        color: #082b70;
        font-size: 11px;
        font-weight: 700;
        line-height: 1.35;
        white-space: nowrap;
    }

/* Offer Plane Icon */
.Flight-banner-offer-plane {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    margin-left: 4px;
    border-radius: 50%;
    background: #fff0ed;
    color: #e20c18;
    font-size: 20px;
    transform: rotate(-25deg);
    transition: transform .45s ease, background .35s ease;
}

/* Offer Plane Hover */
.Flight-page-banner:hover .Flight-banner-offer-plane,
.Flight-banner-offer:hover .Flight-banner-offer-plane {
    transform: translateX(5px) rotate(0deg);
    background: #ffe2e2;
}

/* Decorative Travel Text */
.Flight-banner-travel-text {
    position: absolute;
    z-index: 2;
    top: 20%;
    right: 5%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: #082b70;
    font-family: "Brush Script MT", "Segoe Script", cursive;
    font-size: 20px;
    font-style: italic;
    font-weight: 700;
    line-height: 1.05;
    transform: rotate(-10deg);
    pointer-events: none;
}

    /* Decorative Travel Text Underline */
    .Flight-banner-travel-text::after {
        content: "";
        display: block;
        width: 100%;
        height: 9px;
        margin-top: 4px;
        border-bottom: 2px solid #0867ed;
        border-radius: 50%;
        transform: rotate(-7deg);
    }

    /* Decorative Travel Text Shine */
    .Flight-banner-travel-text span {
        background: linear-gradient( 110deg, #082b70 15%, #0867ed 38%, #8bcaff 48%, #0867ed 58%, #082b70 85% );
        background-size: 250% 100%;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: FlightTravelShine 5s linear infinite;
    }

/* Travel Text Shine Animation */
@keyframes FlightTravelShine {
    0% {
        background-position: 100% center;
    }

    100% {
        background-position: -150% center;
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .Flight-banner-offer,
    .Flight-banner-gift-lid,
    .Flight-banner-gift-ticket,
    .Flight-banner-offer-plane {
        transition: none;
    }

    .Flight-banner-travel-text span {
        animation: none;
    }
}



/*---------------------------------=========================================  Flight  Support strip  section ============================================================ ------------------------------------*/


/* Flight Support Section */
.Flight-support-section {
    position: relative;
    z-index: 5;
    margin-top: -30px;
    padding-bottom: 35px;
}

/* Support Strip */
.Flight-support-strip {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    padding: 0;
    background: #fff;
    border: 1px solid #e5effc;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(15, 65, 135, .09);
    overflow: hidden;
}

/* Support Item */
.Flight-support-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 18px 15px;
    background: #fff;
    overflow: hidden;
    isolation: isolate;
    cursor: pointer;
    transition: background .35s ease;
}

    /* Item Divider */
    .Flight-support-item:not(:last-child)::after {
        content: "";
        position: absolute;
        z-index: 3;
        right: 0;
        top: 25%;
        width: 1px;
        height: 50%;
        background: #dce8fa;
    }

/* Theme Colors */
.Flight-support-blue {
    --flight-color: #0867ed;
    --flight-bg: #e8f3ff;
}

.Flight-support-orange {
    --flight-color: #f59e0b;
    --flight-bg: #fff3e2;
}

.Flight-support-purple {
    --flight-color: #9333ea;
    --flight-bg: #f3e8ff;
}

.Flight-support-green {
    --flight-color: #059669;
    --flight-bg: #e6f9f0;
}

.Flight-support-violet {
    --flight-color: #7c3aed;
    --flight-bg: #f3e8ff;
}

/* Support Icon */
.Flight-support-icon {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: var(--flight-bg);
    color: var(--flight-color);
}

    /* Expanding Background Circle */
    .Flight-support-icon::before {
        content: "";
        position: absolute;
        z-index: -1;
        inset: 0;
        border-radius: 50%;
        background: var(--flight-bg);
        transform: scale(1);
        transform-origin: center;
        transition: transform .7s cubic-bezier(.22, 1, .36, 1);
        pointer-events: none;
    }

    /* Icon Symbol */
    .Flight-support-icon i {
        position: relative;
        z-index: 2;
        color: var(--flight-color);
        font-size: 23px;
        transition: transform .35s ease;
    }

/* Support Content */
.Flight-support-content {
    position: relative;
    z-index: 2;
    min-width: 0;
}

    /* Support Heading */
    .Flight-support-content h3 {
        margin: 0 0 4px;
        color: #082b70;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.3;
        transition: color .3s ease;
    }

    /* Support Description */
    .Flight-support-content p {
        margin: 0;
        color: #365b92;
        font-size: 9px;
        line-height: 1.4;
    }

/* Item Hover */
.Flight-support-item:hover {
    background: var(--flight-bg);
}

    /* Expanding Circle Hover */
    .Flight-support-item:hover .Flight-support-icon::before {
        transform: scale(20);
    }

    /* Icon Hover */
    .Flight-support-item:hover .Flight-support-icon i {
        transform: scale(1.15) rotate(-8deg);
    }

    /* Heading Hover */
    .Flight-support-item:hover .Flight-support-content h3 {
        color: var(--flight-color);
    }

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .Flight-banner-travel-text span {
        animation: none;
    }
}



/*---------------------------------=========================================  Flight airlines  section ============================================================ ------------------------------------*/

/* Popular Airlines Section */
.Flight-airlines-section {
    position: relative;
    width: 100%;
    padding: 25px 0 45px;
    background: #f4f9ff;
    overflow: hidden;
}

/* Section Header */
.Flight-airlines-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.Flight-airlines-heading h2 {
    margin: 0 0 5px;
    color: #082b70;
    font-size: 25px;
    font-weight: 800;
    line-height: 1.2;
}

    .Flight-airlines-heading h2 span {
        color: #0867ed;
    }

.Flight-airlines-heading p {
    margin: 0;
    color: #365b92;
    font-size: 12px;
    line-height: 1.5;
}

/* View All Airlines */
.Flight-airlines-view-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    flex-shrink: 0;
    min-height: 35px;
    padding: 0 15px;
    border: 1px solid #0867ed;
    border-radius: 8px;
    background: #fff;
    color: #0867ed;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition: background .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;
}

    .Flight-airlines-view-all:hover {
        background: #0867ed;
        color: #fff;
        transform: translateY(-2px);
    }

    .Flight-airlines-view-all i {
        transition: transform .3s ease;
    }

    .Flight-airlines-view-all:hover i {
        transform: translateX(4px);
    }

/* Slider Wrapper */
.Flight-airlines-slider {
    position: relative;
    width: 100%;
    padding: 5px 0 12px;
}

/* Visible Slider Area */
.Flight-airlines-marquee {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 6px 0 12px;
    touch-action: pan-y;
}

/* Smooth Infinite Track */
.Flight-airlines-track {
    display: flex;
    align-items: stretch;
    gap: 12px;
    width: max-content;
    transform: translate3d(0, 0, 0);
    will-change: transform;
    backface-visibility: hidden;
}

/* Airline Card */
.Flight-airlines-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 0 0 115px;
    width: 115px;
    height: 92px;
    padding: 10px 8px;
    border: 1px solid #e2ecfb;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(15, 65, 135, .05);
    text-align: center;
    overflow: hidden;
    cursor: default;
    transition: transform .35s cubic-bezier(.22, 1, .36, 1), border-color .35s ease, box-shadow .35s ease, background .35s ease;
}

    /* Card Highlight */
    .Flight-airlines-card::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: 0;
        height: 3px;
        border-radius: 0 0 4px 4px;
        background: #0867ed;
        transform: translateX(-50%);
        transition: width .35s ease;
    }

    /* Card Hover */
    .Flight-airlines-card:hover {
        transform: translateY(-5px);
        border-color: #b6d5ff;
        background: #fbfdff;
        box-shadow: 0 10px 22px rgba(15, 65, 135, .13);
    }

        .Flight-airlines-card:hover::before {
            width: 65%;
        }

/* Airline Logo Container */
.Flight-airlines-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 100%;
    height: 48px;
    margin-bottom: 7px;
}

    /* Airline Logo */
    .Flight-airlines-logo img {
        display: block;
        max-width: 90px;
        max-height: 44px;
        width: auto;
        height: auto;
        object-fit: contain;
        transition: transform .4s ease;
    }

/* Logo Hover */
.Flight-airlines-card:hover .Flight-airlines-logo img {
    transform: scale(1.12);
}

/* Airline Name */
.Flight-airlines-card h3 {
    margin: 0;
    color: #082b70;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.3;
    transition: color .3s ease;
}

.Flight-airlines-card:hover h3 {
    color: #0867ed;
}

/* Navigation Buttons */
.Flight-airlines-nav {
    position: absolute;
    z-index: 10;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid #dce8fa;
    border-radius: 50%;
    background: #fff;
    color: #0867ed;
    font-size: 13px;
    box-shadow: 0 4px 12px rgba(15, 65, 135, .12);
    cursor: pointer;
    transform: translateY(-50%);
    transition: background .3s ease, color .3s ease, box-shadow .3s ease;
}

.Flight-airlines-prev {
    left: -40px;
}

.Flight-airlines-next {
    right: -40px;
}

.Flight-airlines-nav:hover {
    background: #0867ed;
    color: #fff;
    box-shadow: 0 7px 17px rgba(8, 103, 237, .2);
}

.Flight-airlines-nav:focus-visible {
    outline: 2px solid #0867ed;
    outline-offset: 3px;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .Flight-airlines-track,
    .Flight-airlines-card,
    .Flight-airlines-logo img {
        transition: none;
    }
}



/*---------------------------------=========================================  Popular Flight Routes  section ============================================================ ------------------------------------*/


/* Popular Flight Routes Section */
.Flight-routes-section {
    position: relative;
    width: 100%;
    padding: 25px 0 50px;
    background: #f4f9ff;
}

/* Section Header */
.Flight-routes-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

/* Heading */
.Flight-routes-heading h2 {
    margin: 0 0 5px;
    color: #082b70;
    font-size: 25px;
    font-weight: 800;
    line-height: 1.2;
}

    /* Heading Highlight */
    .Flight-routes-heading h2 span {
        color: #0867ed;
    }

/* Heading Description */
.Flight-routes-heading p {
    margin: 0;
    color: #365b92;
    font-size: 12px;
    line-height: 1.5;
}

/* View All Routes */
.Flight-routes-view-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    flex-shrink: 0;
    min-height: 35px;
    padding: 0 15px;
    border: 1px solid #0867ed;
    border-radius: 8px;
    background: #fff;
    color: #0867ed;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition: background .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;
}

    .Flight-routes-view-all:hover {
        background: #0867ed;
        color: #fff;
        transform: translateY(-2px);
        box-shadow: 0 5px 14px rgba(8, 103, 237, .15);
    }

    .Flight-routes-view-all i {
        transition: transform .3s ease;
    }

    .Flight-routes-view-all:hover i {
        transform: translateX(4px);
    }

/* Six Column Grid */
.Flight-routes-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

/* Route Card */
.Flight-routes-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #fff;
    border: 1px solid #e2ecfb;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(15, 65, 135, .06);
    overflow: hidden;
    transition: transform .35s cubic-bezier(.22, 1, .36, 1), border-color .35s ease, box-shadow .35s ease;
}

    /* Card Hover */
    .Flight-routes-card:hover {
        transform: translateY(-5px);
        border-color: #b6d5ff;
        box-shadow: 0 12px 25px rgba(15, 65, 135, .13);
    }

/* Destination Image */
.Flight-routes-image {
    position: relative;
    width: 100%;
    height: 115px;
    overflow: hidden;
}

    /* Image */
    .Flight-routes-image img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transition: transform .65s cubic-bezier(.22, 1, .36, 1);
    }

/* Image Zoom Hover */
.Flight-routes-card:hover .Flight-routes-image img {
    transform: scale(1.09);
}

/* Route Body */
.Flight-routes-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex: 1;
    min-height: 52px;
    padding: 11px 9px;
}

    /* Route Title */
    .Flight-routes-body h3 {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px;
        min-width: 0;
        margin: 0;
        color: #082b70;
        font-size: 10px;
        font-weight: 800;
        line-height: 1.4;
        transition: color .3s ease;
    }

        /* Route Arrow Between Cities */
        .Flight-routes-body h3 span {
            color: #0867ed;
        }

/* Plane Icon */
.Flight-routes-plane {
    display: inline-block;
    flex-shrink: 0;
    margin-right: 2px;
    color: #0867ed;
    font-size: 14px;
    transform: rotate(0deg);
    transform-origin: center;
    transition: transform .5s cubic-bezier(.22, 1, .36, 1), color .35s ease;
}

/* Rotate Plane 90 Degrees on Hover */
.Flight-routes-card:hover .Flight-routes-plane {
    transform: rotate(90deg);
    color: #0054cf;
}

/* Route Title Hover */
.Flight-routes-card:hover .Flight-routes-body h3 {
    color: #0867ed;
}

/* Circular Arrow Button */
.Flight-routes-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 27px;
    height: 27px;
    border: 1px solid #dce8fa;
    border-radius: 50%;
    background: #fff;
    color: #0867ed;
    font-size: 12px;
    text-decoration: none;
    box-shadow: 0 3px 8px rgba(15, 65, 135, .08);
    transition: background .35s ease, color .35s ease, transform .35s ease, box-shadow .35s ease;
}

/* Circular Arrow Hover */
.Flight-routes-card:hover .Flight-routes-arrow {
    background: #0867ed;
    color: #fff;
    transform: translateX(2px);
    box-shadow: 0 5px 12px rgba(8, 103, 237, .22);
}

/* Arrow Icon Animation */
.Flight-routes-arrow i {
    transition: transform .35s ease;
}

.Flight-routes-card:hover .Flight-routes-arrow i {
    transform: translateX(2px);
}



/*---------------------------------=========================================  Flight  Booking Steps  section ============================================================ ------------------------------------*/

/* Flight Booking Section */
.Flight-booking-section {
    position: relative;
    width: 100%;
    padding: 25px 0 45px;
    background: linear-gradient( 110deg, #f4f9ff 0%, #eef8ff 65%, #e8f5ff 100% );
    overflow: hidden;
    isolation: isolate;
}

    /* Main Container */
    .Flight-booking-section > .container {
        position: relative;
        z-index: 2;
    }

/* Section Header */
.Flight-booking-header {
    position: relative;
    margin-bottom: 14px;
}

    /* Heading */
    .Flight-booking-header h2 {
        margin: 0 0 5px;
        color: #082b70;
        font-size: 25px;
        font-weight: 800;
        line-height: 1.2;
    }

        /* Heading Highlight */
        .Flight-booking-header h2 span {
            color: #0867ed;
        }

    /* Description */
    .Flight-booking-header p {
        margin: 0;
        color: #365b92;
        font-size: 12px;
        line-height: 1.5;
    }

/* Four Column Grid */
.Flight-booking-grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    max-width: 1200px;
    padding-top: 10px;
}

/* Step Wrapper */
.Flight-booking-step {
    position: relative;
    z-index: 1;
    min-width: 0;
    overflow: visible;
}

    /* Step Wrapper Hover */
    .Flight-booking-step:hover {
        z-index: 5;
    }

/* Step Card */
.Flight-booking-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 95px;
    padding: 19px 13px 12px;
    background: rgba(255, 255, 255, .97);
    border: 1px solid #e2ecfb;
    border-radius: 10px;
    box-shadow: 0 5px 18px rgba(15, 65, 135, .07);
    overflow: hidden;
    isolation: isolate;
    transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

/* Step Colors */
/* Step 1 - Create Partner Account - Blue */
.Flight-booking-blue {
    --booking-color: #0867ed;
    --booking-bg: #e3f0ff;
}

/* Step 2 - Account Verification - Orange */
.Flight-booking-orange {
    --booking-color: #ff8a00;
    --booking-bg: #fff0df;
}

/* Step 3 - Login Credentials - Green */
.Flight-booking-green {
    --booking-color: #059669;
    --booking-bg: #def8eb;
}

/* Step 4 - Search Flights - Cyan */
.Flight-booking-cyan {
    --booking-color: #0891b2;
    --booking-bg: #e0f7fc;
}

/* Step 5 - Compare & Choose - Pink */
.Flight-booking-pink {
    --booking-color: #e83e8c;
    --booking-bg: #ffe8f2;
}

/* Step 6 - Make Payment - Indigo */
.Flight-booking-indigo {
    --booking-color: #6366f1;
    --booking-bg: #eaeaff;
}

/* Step 7 - Get Confirmation - Purple */
.Flight-booking-purple {
    --booking-color: #9333ea;
    --booking-bg: #f3e8ff;
}


/* Step Number - Outside Clipped Card */
.Flight-booking-number {
    position: absolute;
    z-index: 20;
    top: -12px;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    background: var(--booking-color);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    transform: translateX(-50%);
    box-shadow: 0 3px 10px rgba(15, 65, 135, .13);
    pointer-events: none;
}

/* Icon Wrapper */
.Flight-booking-icon {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--booking-bg);
    color: var(--booking-color);
}

    /* Expanding Circle */
    .Flight-booking-icon::before {
        content: "";
        position: absolute;
        z-index: -1;
        inset: 0;
        border-radius: 50%;
        background: var(--booking-bg);
        transform: scale(1);
        transition: transform .7s cubic-bezier(.22, 1, .36, 1);
        pointer-events: none;
    }

    /* Icon */
    .Flight-booking-icon i {
        position: relative;
        z-index: 2;
        color: var(--booking-color);
        font-size: 24px;
        transition: transform .35s ease;
    }

/* Step Content */
.Flight-booking-content {
    position: relative;
    z-index: 2;
    min-width: 0;
}

    /* Step Heading */
    .Flight-booking-content h3 {
        margin: 0 0 4px;
        color: #082b70;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.3;
        transition: color .35s ease;
    }

    /* Step Description */
    .Flight-booking-content p {
        margin: 0;
        color: #365b92;
        font-size: 10px;
        line-height: 1.4;
    }

/* Connecting Arrows */
.Flight-booking-arrow {
    position: absolute;
    z-index: 10;
    top: 50%;
    right: -19px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #fff;
    color: #0867ed;
    font-size: 14px;
    transform: translateY(-50%);
    transition: transform .35s ease, background .35s ease;
}

/* Card Hover */
.Flight-booking-step:hover .Flight-booking-card {
    transform: translateY(-5px);
    border-color: var(--booking-color);
    box-shadow: 0 12px 25px rgba(15, 65, 135, .13);
}

/* Expanding Circle Hover */
.Flight-booking-step:hover .Flight-booking-icon::before {
    transform: scale(20);
}

/* Icon Hover */
.Flight-booking-step:hover .Flight-booking-icon i {
    transform: scale(1.15) rotate(-8deg);
}

/* Heading Hover */
.Flight-booking-step:hover .Flight-booking-content h3 {
    color: var(--booking-color);
}

/* Arrow Hover */
.Flight-booking-step:hover .Flight-booking-arrow {
    transform: translate(5px, -50%);
    background: #e8f3ff;
}

/* Last Step */
.Flight-booking-step:last-child .Flight-booking-arrow {
    display: none;
}

/* Decorative Flight Route Wrapper */
.Flight-booking-decoration {
    position: absolute;
    z-index: 1;
    top: 14px;
    right: 2.5%;
    width: 340px;
    height: 105px;
    pointer-events: none;
}

/* Decorative SVG */
.Flight-booking-route-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

/* Dashed Flight Path */
.Flight-booking-route-path {
    fill: none;
    stroke: #69a7ff;
    stroke-width: 1.7;
    stroke-dasharray: 4 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: .95;
}

/* Airplane Icon */
.Flight-booking-decoration-plane {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    color: #0867ed;
    font-size: 32px;
    transform: rotate(-35deg);
    animation: FlightDecorationFloat 4s ease-in-out infinite;
}

/* Plane Floating Animation */
@keyframes FlightDecorationFloat {
    0%, 100% {
        transform: translateY(0) rotate(-35deg);
    }

    50% {
        transform: translateY(-5px) rotate(-30deg);
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .Flight-booking-decoration-plane {
        animation: none;
    }
}



/*---------------------------------=========================================  Flight  offers  section ============================================================ ------------------------------------*/

/* Exclusive Flight Offers Section */
.Flight-offers-section {
    position: relative;
    width: 100%;
    padding: 25px 0 50px;
    background: #f4f9ff;
}

/* Section Header */
.Flight-offers-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

/* Heading */
.Flight-offers-heading h2 {
    margin: 0 0 5px;
    color: #082b70;
    font-size: 25px;
    font-weight: 800;
    line-height: 1.2;
}

    .Flight-offers-heading h2 span {
        color: #0867ed;
    }

/* Description */
.Flight-offers-heading p {
    margin: 0;
    color: #365b92;
    font-size: 12px;
    line-height: 1.5;
}

/* View All Offers Button */
.Flight-offers-view-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    flex-shrink: 0;
    min-height: 35px;
    padding: 0 15px;
    border: 1px solid #0867ed;
    border-radius: 8px;
    background: #fff;
    color: #0867ed;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition: background .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;
}

    .Flight-offers-view-all:hover {
        background: #0867ed;
        color: #fff;
        transform: translateY(-2px);
        box-shadow: 0 5px 14px rgba(8, 103, 237, .15);
    }

    .Flight-offers-view-all i {
        transition: transform .3s ease;
    }

    .Flight-offers-view-all:hover i {
        transform: translateX(4px);
    }

/* Four Column Offers Grid */
.Flight-offers-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

/* Offer Card */
.Flight-offers-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #fff;
    border: 1px solid #e2ecfb;
    border-radius: 11px;
    box-shadow: 0 5px 18px rgba(15, 65, 135, .06);
    overflow: hidden;
    transition: transform .35s cubic-bezier(.22, 1, .36, 1), border-color .35s ease, box-shadow .35s ease;
}

    /* Card Hover */
    .Flight-offers-card:hover {
        transform: translateY(-5px);
        border-color: #b6d5ff;
        box-shadow: 0 12px 25px rgba(15, 65, 135, .13);
    }

/* Offer Image */
.Flight-offers-image {
    position: relative;
    width: 100%;
    height: 145px;
    overflow: hidden;
}

    /* Image */
    .Flight-offers-image img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transition: transform .65s cubic-bezier(.22, 1, .36, 1);
    }

/* Image Hover */
.Flight-offers-card:hover .Flight-offers-image img {
    transform: scale(1.08);
}

/* Discount Badge */
.Flight-offers-badge {
    position: absolute;
    z-index: 2;
    top: 10px;
    left: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 25px;
    padding: 4px 10px;
    border-radius: 6px;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .12);
    transition: transform .35s ease;
}

/* Badge Hover */
.Flight-offers-card:hover .Flight-offers-badge {
    transform: translateY(-2px);
}

/* Discount Badge Colors */
.Flight-offers-red {
    background: #ef222b;
}

.Flight-offers-green {
    background: #00a86b;
}

.Flight-offers-purple {
    background: #8b1cf6;
}

.Flight-offers-orange {
    background: #ff8500;
}

/* Offer Body */
.Flight-offers-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 12px 14px 14px;
}

    /* Route Title */
    .Flight-offers-body h3 {
        margin: 0 0 6px;
        color: #082b70;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.3;
        transition: color .3s ease;
    }

        .Flight-offers-body h3 i {
            margin: 0 3px;
            color: #0867ed;
            font-size: 12px;
        }

.Flight-offers-card:hover .Flight-offers-body h3 {
    color: #0867ed;
}

/* Flight Details */
.Flight-offers-details {
    margin: 0 0 14px;
    color: #365b92;
    font-size: 11px;
    line-height: 1.4;
}

    .Flight-offers-details span {
        margin: 0 3px;
        color: #0867ed;
    }

/* Bottom Row */
.Flight-offers-bottom {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
}

/* Validity Details */
.Flight-offers-validity {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

    .Flight-offers-validity span {
        color: #6783ad;
        font-size: 10px;
        line-height: 1.3;
    }

    .Flight-offers-validity strong {
        color: #365b92;
        font-size: 11px;
        font-weight: 700;
        line-height: 1.3;
    }

/* Book Now Button */
.Flight-offers-book-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-shrink: 0;
    min-width: 105px;
    min-height: 35px;
    padding: 0 12px;
    border: 1px solid #0867ed;
    border-radius: 7px;
    background: linear-gradient(110deg, #0867ed, #1489ff);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(8, 103, 237, .16);
    overflow: hidden;
    transition: transform .35s ease, box-shadow .35s ease;
}

    /* Button Shine */
    .Flight-offers-book-btn::before {
        content: "";
        position: absolute;
        top: 0;
        left: -80%;
        width: 45%;
        height: 100%;
        background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, .4), transparent );
        transform: skewX(-25deg);
        transition: left .65s ease;
        pointer-events: none;
    }

    /* Button Content */
    .Flight-offers-book-btn span,
    .Flight-offers-book-btn i {
        position: relative;
        z-index: 2;
    }

    /* Button Hover */
    .Flight-offers-book-btn:hover {
        color: #fff;
        transform: translateY(-2px);
        box-shadow: 0 7px 17px rgba(8, 103, 237, .25);
    }

        /* Button Shine Hover */
        .Flight-offers-book-btn:hover::before {
            left: 135%;
        }

    /* Button Arrow */
    .Flight-offers-book-btn i {
        font-size: 12px;
        transition: transform .35s ease;
    }

    /* Arrow Hover */
    .Flight-offers-book-btn:hover i {
        transform: translateX(5px);
    }



/*---------------------------------=========================================  Flight  why  section ============================================================ ------------------------------------*/


/* Why Choose Flight Section */
.Flight-why-section {
    position: relative;
    width: 100%;
    padding: 25px 0 50px;
    background: #f4f9ff;
}

/* Section Header */
.Flight-why-header {
    margin-bottom: 18px;
}

    /* Section Heading */
    .Flight-why-header h2 {
        margin: 0;
        color: #082b70;
        font-size: 25px;
        font-weight: 800;
        line-height: 1.2;
    }

        /* Heading Highlight */
        .Flight-why-header h2 span {
            color: #0867ed;
        }

/* Five Column Grid */
.Flight-why-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

/* Benefit Card */
.Flight-why-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    min-height: 90px;
    padding: 13px 14px;
    background: #fff;
    border: 1px solid #e2ecfb;
    border-radius: 10px;
    box-shadow: 0 5px 18px rgba(15, 65, 135, .06);
    overflow: hidden;
    isolation: isolate;
    cursor: pointer;
    transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

/* Theme Colors */
.Flight-why-green {
    --why-color: #059669;
    --why-bg: #def8eb;
}

.Flight-why-orange {
    --why-color: #f59e0b;
    --why-bg: #fff1db;
}

.Flight-why-blue {
    --why-color: #0867ed;
    --why-bg: #e3f0ff;
}

.Flight-why-purple {
    --why-color: #9333ea;
    --why-bg: #f3e8ff;
}

.Flight-why-cyan {
    --why-color: #0875eb;
    --why-bg: #e2f0ff;
}

/* Icon Wrapper */
.Flight-why-icon {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--why-bg);
    color: var(--why-color);
}

    /* Expanding Background Circle */
    .Flight-why-icon::before {
        content: "";
        position: absolute;
        z-index: -1;
        inset: 0;
        border-radius: 50%;
        background: var(--why-bg);
        transform: scale(1);
        transform-origin: center;
        transition: transform .7s cubic-bezier(.22, 1, .36, 1);
        pointer-events: none;
    }

    /* Icon Symbol */
    .Flight-why-icon i {
        position: relative;
        z-index: 2;
        color: var(--why-color);
        font-size: 25px;
        transition: transform .35s ease;
    }

/* Benefit Content */
.Flight-why-content {
    position: relative;
    z-index: 2;
    min-width: 0;
}

    /* Benefit Heading */
    .Flight-why-content h3 {
        margin: 0 0 5px;
        color: #082b70;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.3;
        transition: color .35s ease;
    }

    /* Benefit Description */
    .Flight-why-content p {
        margin: 0;
        color: #365b92;
        font-size: 10px;
        line-height: 1.45;
    }

/* Card Hover */
.Flight-why-item:hover {
    transform: translateY(-5px);
    border-color: var(--why-color);
    box-shadow: 0 12px 25px rgba(15, 65, 135, .12);
}

    /* Expanding Circle Hover */
    .Flight-why-item:hover .Flight-why-icon::before {
        transform: scale(20);
    }

    /* Icon Hover */
    .Flight-why-item:hover .Flight-why-icon i {
        transform: scale(1.15) rotate(-8deg);
    }

    /* Heading Hover */
    .Flight-why-item:hover .Flight-why-content h3 {
        color: var(--why-color);
    }



/*---------------------------------=========================================  Flight  CTA  section ============================================================ ------------------------------------*/

/* Flight CTA Section */
.Flight-cta-section {
    position: relative;
    width: 100%;
    min-height: 225px;
    display: flex;
    align-items: center;
    padding: 22px 0;
    background-color: #eaf6ff;
    background-image: url('../images/b2bflight-cta-bg.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

    /* CTA Container */
    .Flight-cta-section > .container {
        position: relative;
        z-index: 2;
        width: 100%;
    }

/* CTA Wrapper */
.Flight-cta-wrapper {
    display: flex;
    align-items: center;
    gap: 22px;
    width: 100%;
}

/* Circular Flight Icon */
.Flight-cta-icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 85px;
    height: 85px;
    border: 5px solid rgba(255, 255, 255, .95);
    border-radius: 50%;
    background: rgba(255, 255, 255, .72);
    color: #0867ed;
    box-shadow: 0 5px 18px rgba(15, 65, 135, .08);
    transition: transform .45s ease, box-shadow .45s ease, background .45s ease;
}

    /* Flight Icon Symbol */
    .Flight-cta-icon i {
        font-size: 40px;
        transform: rotate(-35deg);
        transition: transform .5s cubic-bezier(.22, 1, .36, 1);
    }

/* Flight Icon Hover */
.Flight-cta-section:hover .Flight-cta-icon {
    transform: translateY(-4px);
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 10px 22px rgba(15, 65, 135, .14);
}

    /* Flight Icon Rotation Hover */
    .Flight-cta-section:hover .Flight-cta-icon i {
        transform: rotate(0deg) scale(1.12);
    }

/* CTA Content */
.Flight-cta-content {
    flex: 1;
    min-width: 0;
    max-width: 700px;
}

    /* CTA Heading */
    .Flight-cta-content h2 {
        margin: 0 0 7px;
        color: #082b70;
        font-size: 27px;
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -.4px;
    }

    /* CTA Description */
    .Flight-cta-content p {
        margin: 0;
        color: #365b92;
        font-size: 13px;
        font-weight: 500;
        line-height: 1.45;
    }

        /* Second Description Line */
        .Flight-cta-content p span {
            display: block;
        }

/* CTA Action */
.Flight-cta-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-shrink: 0;
    margin-left: auto;
}

/* Search Flights Button */
.Flight-cta-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    min-width: 185px;
    min-height: 48px;
    padding: 0 22px;
    border: 3px solid #fff;
    border-radius: 30px;
    background: linear-gradient(110deg, #0867ed, #1489ff);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 5px 15px rgba(8, 103, 237, .2);
    overflow: hidden;
    transition: transform .35s ease, box-shadow .35s ease, background .35s ease;
}

    /* Button Shine */
    .Flight-cta-button::before {
        content: "";
        position: absolute;
        top: 0;
        left: -80%;
        width: 45%;
        height: 100%;
        background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, .45), transparent );
        transform: skewX(-25deg);
        transition: left .65s ease;
        pointer-events: none;
    }

    /* Button Content */
    .Flight-cta-button span,
    .Flight-cta-button i {
        position: relative;
        z-index: 2;
    }

    /* Button Hover */
    .Flight-cta-button:hover {
        color: #fff;
        transform: translateY(-3px);
        box-shadow: 0 9px 22px rgba(8, 103, 237, .3);
    }

        /* Button Shine Hover */
        .Flight-cta-button:hover::before {
            left: 135%;
        }

    /* Arrow Icon */
    .Flight-cta-button i {
        font-size: 13px;
        transition: transform .35s ease;
    }

    /* Arrow Hover */
    .Flight-cta-button:hover i {
        transform: translateX(5px);
    }





/* Flight Page Responsive Media Queries */
/* Append after the existing Flight.css desktop rules. */

@media (min-width: 1400px) {
    .Flight-banner-container {
        padding-left: 85px !important;
        padding-right: 85px !important;
    }
}

@media (max-width: 1399.98px) {
    .Flight-banner-container {
        padding-left: 55px !important;
        padding-right: 55px !important;
    }

    .Flight-banner-title {
        font-size: 42px;
    }

    .Flight-support-item {
        gap: 9px;
        padding: 16px 10px;
    }

    .Flight-support-icon {
        width: 42px;
        height: 42px;
    }

    .Flight-booking-grid {
        max-width: calc(100% - 0px);
    }

    .Flight-booking-decoration {
        width: 255px;
        right: 65px;
    }

    .Flight-why-item {
        gap: 9px;
        padding: 12px 10px;
    }

    .Flight-why-icon {
        width: 44px;
        height: 44px;
    }

    .Flight-cta-content {
        max-width: 610px;
    }
}

@media (max-width: 1199.98px) {
    .Flight-page-banner, .Flight-banner-container {
        min-height: 365px;
    }

    .Flight-banner-container {
        padding: 25px 35px !important;
    }

    .Flight-banner-content {
        max-width: 540px;
    }

    .Flight-banner-title {
        font-size: 38px;
    }

    .Flight-banner-description {
        font-size: 13px;
        max-width: 420px;
    }

    .Flight-banner-travel-text {
        right: 3%;
        font-size: 18px;
    }

    .Flight-support-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .Flight-support-item {
        min-height: 77px;
        padding: 12px 15px;
    }

        .Flight-support-item:not(:last-child)::after {
            display: none;
        }

        .Flight-support-item:nth-child(-n+3) {
            border-bottom: 1px solid #e5effc;
        }

        .Flight-support-item:not(:nth-child(3n)) {
            border-right: 1px solid #e5effc;
        }

    .Flight-routes-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .Flight-routes-image {
        height: 145px;
    }

    .Flight-routes-body h3 {
        font-size: 12px;
    }

    .Flight-booking-grid {
        max-width: 100%;
    }

    .Flight-booking-decoration {
        width: 220px;
        height: 75px;
        top: 4px;
        opacity: .35;
    }

    .Flight-booking-header {
        z-index: 2;
    }

    .Flight-booking-card {
        gap: 8px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .Flight-booking-icon {
        width: 44px;
        height: 44px;
    }

    .Flight-booking-content h3 {
        font-size: 10px;
    }

    .Flight-booking-content p {
        font-size: 9px;
    }

    .Flight-offers-grid {
        gap: 11px;
    }

    .Flight-offers-body {
        padding: 11px;
    }

    .Flight-offers-bottom {
        align-items: stretch;
        flex-direction: column;
        gap: 9px;
    }

    .Flight-offers-book-btn {
        width: 100%;
    }

    .Flight-why-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .Flight-why-item {
        min-height: 85px;
    }

    .Flight-cta-wrapper {
        gap: 16px;
    }

    .Flight-cta-icon {
        width: 72px;
        height: 72px;
    }

        .Flight-cta-icon i {
            font-size: 34px;
        }

    .Flight-cta-content h2 {
        font-size: 23px;
    }

    .Flight-cta-content p {
        font-size: 12px;
    }

    .Flight-cta-button {
        min-width: 150px;
    }
}

@media (max-width: 991.98px) {
    .Flight-page-banner, .Flight-banner-container {
        min-height: 340px;
    }

    .Flight-page-banner {
        background-position: 58% center;
    }

    .Flight-banner-container {
        padding: 25px 25px !important;
    }

    .Flight-banner-content {
        max-width: 470px;
    }

    .Flight-banner-title {
        font-size: 34px;
    }

    .Flight-banner-description {
        max-width: 365px;
        font-size: 12px;
    }

    .Flight-banner-travel-text {
        right: 2%;
        top: 14%;
        font-size: 15px;
    }

    .Flight-banner-offer {
        min-height: 52px;
        gap: 8px;
        padding: 6px 10px;
    }

    .Flight-banner-offer-icon {
        width: 40px;
        height: 40px;
        font-size: 22px;
    }

    .Flight-banner-offer-content strong {
        font-size: 15px;
    }

    .Flight-support-section {
        margin-top: -20px;
        padding-bottom: 25px;
    }

    .Flight-airlines-section, .Flight-routes-section, .Flight-booking-section, .Flight-offers-section, .Flight-why-section {
        padding-top: 24px;
        padding-bottom: 35px;
    }

    .Flight-airlines-heading h2, .Flight-routes-heading h2, .Flight-booking-header h2, .Flight-offers-heading h2, .Flight-why-header h2 {
        font-size: 23px;
    }

    .Flight-airlines-prev {
        left: 3px;
    }

    .Flight-airlines-next {
        right: 3px;
    }

    .Flight-airlines-slider {
        padding-left: 28px;
        padding-right: 28px;
    }

    .Flight-airlines-card {
        flex-basis: 108px;
        width: 108px;
        height: 88px;
    }

    .Flight-routes-grid {
        gap: 12px;
    }

    .Flight-booking-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 20px;
        padding-top: 15px;
    }

    .Flight-booking-card {
        min-height: 100px;
        padding: 20px 15px 12px;
    }

    .Flight-booking-icon {
        width: 50px;
        height: 50px;
    }

    .Flight-booking-content h3 {
        font-size: 12px;
    }

    .Flight-booking-content p {
        font-size: 10px;
    }

    .Flight-booking-step:nth-child(2) .Flight-booking-arrow {
        display: none;
    }

    .Flight-booking-step:nth-child(3) .Flight-booking-arrow {
        display: flex;
    }

    .Flight-booking-decoration {
        top: 6px;
        right: 3%;
        width: 170px;
        opacity: .3;
    }

    .Flight-offers-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 15px;
    }

    .Flight-offers-image {
        height: 175px;
    }

    .Flight-offers-body {
        padding: 13px;
    }

    .Flight-offers-bottom {
        flex-direction: row;
        align-items: flex-end;
    }

    .Flight-offers-book-btn {
        width: auto;
    }

    .Flight-cta-section {
        min-height: 200px;
        background-position: 55% center;
    }

    .Flight-cta-content h2 {
        font-size: 21px;
    }

    .Flight-cta-button {
        min-width: 135px;
        min-height: 43px;
        padding: 0 13px;
    }
}

@media (max-width: 767.98px) {
    .Flight-page-banner, .Flight-banner-container {
        min-height: 350px;
    }

    .Flight-page-banner {
        background-position: 61% center;
    }

    .Flight-banner-container {
        align-items: flex-start;
        padding: 35px 16px 45px !important;
    }

    .Flight-banner-content {
        max-width: 400px;
        padding: 10px 12px;
        border-radius: 12px;
        background: rgba(235, 247, 255, .76);
    }

    .Flight-banner-eyebrow {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .Flight-banner-title {
        font-size: 31px;
        letter-spacing: -.7px;
    }

    .Flight-banner-description {
        font-size: 12px;
    }

    .Flight-banner-travel-text {
        display: none;
    }

    .Flight-support-section {
        margin-top: -25px;
    }

    .Flight-support-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .Flight-support-item {
        min-height: 78px;
        padding: 12px;
    }

        .Flight-support-item:nth-child(-n+3) {
            border-bottom: 0;
        }

        .Flight-support-item:not(:nth-child(3n)) {
            border-right: 0;
        }

        .Flight-support-item:not(:nth-last-child(-n+2)) {
            border-bottom: 1px solid #e5effc;
        }

        .Flight-support-item:nth-child(odd) {
            border-right: 1px solid #e5effc;
        }

    .Flight-support-content h3 {
        font-size: 11px;
    }

    .Flight-support-content p {
        font-size: 9px;
    }

    .Flight-airlines-header, .Flight-routes-header, .Flight-offers-header {
        align-items: flex-start;
        gap: 10px;
    }

    .Flight-airlines-heading h2, .Flight-routes-heading h2, .Flight-booking-header h2, .Flight-offers-heading h2, .Flight-why-header h2 {
        font-size: 21px;
    }

    .Flight-airlines-heading p, .Flight-routes-heading p, .Flight-booking-header p, .Flight-offers-heading p {
        font-size: 11px;
    }

    .Flight-airlines-view-all, .Flight-routes-view-all, .Flight-offers-view-all {
        min-height: 32px;
        padding: 0 10px;
        font-size: 10px;
    }

    .Flight-routes-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .Flight-routes-image {
        height: 130px;
    }

    .Flight-booking-decoration {
        display: none;
    }

    .Flight-booking-grid {
        gap: 24px 14px;
    }

    .Flight-booking-arrow {
        right: -19px;
    }

    .Flight-why-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 11px;
    }

    .Flight-cta-section {
        min-height: 220px;
        padding: 25px 0;
        background-position: 62% center;
    }

    .Flight-cta-wrapper {
        flex-wrap: wrap;
        gap: 12px;
    }

    .Flight-cta-icon {
        width: 62px;
        height: 62px;
        border-width: 3px;
    }

        .Flight-cta-icon i {
            font-size: 29px;
        }

    .Flight-cta-content {
        flex: 1 1 calc(100% - 80px);
    }

        .Flight-cta-content h2 {
            font-size: 20px;
        }

    .Flight-cta-action {
        width: 100%;
        margin-left: 74px;
        justify-content: flex-start;
    }
}

@media (max-width: 575.98px) {
    .Flight-page-banner, .Flight-banner-container {
        min-height: 365px;
    }

    .Flight-page-banner {
        background-position: 63% center;
    }

    .Flight-banner-container {
        padding: 28px 12px 55px !important;
    }

    .Flight-banner-content {
        max-width: 350px;
        padding: 10px;
    }

    .Flight-banner-title {
        font-size: 28px;
        line-height: 1.12;
    }

    .Flight-banner-description {
        font-size: 11px;
    }

    .Flight-banner-offer {
        margin-top: 12px;
        gap: 7px;
        min-height: 49px;
        padding: 6px 8px;
        border-radius: 10px;
    }

    .Flight-banner-offer-icon {
        width: 34px;
        height: 34px;
        font-size: 19px;
    }

    .Flight-banner-offer-content strong {
        font-size: 13px;
    }

    .Flight-banner-offer-content span {
        font-size: 9px;
    }

    .Flight-banner-offer-divider {
        height: 30px;
        margin: 0;
    }

    .Flight-banner-offer-code small {
        font-size: 9px;
    }

    .Flight-banner-offer-code strong {
        font-size: 13px;
    }

    .Flight-banner-offer-plane {
        width: 25px;
        height: 25px;
        font-size: 16px;
    }

    .Flight-support-section {
        margin-top: -35px;
        padding-bottom: 20px;
    }

    .Flight-support-item {
        gap: 8px;
        padding: 10px 8px;
        min-height: 72px;
    }

    .Flight-support-icon {
        width: 36px;
        height: 36px;
    }

        .Flight-support-icon i {
            font-size: 19px;
        }

    .Flight-support-content h3 {
        font-size: 10px;
    }

    .Flight-support-content p {
        font-size: 9px;
    }

    .Flight-airlines-section, .Flight-routes-section, .Flight-booking-section, .Flight-offers-section, .Flight-why-section {
        padding-top: 20px;
        padding-bottom: 28px;
    }

    .Flight-airlines-header, .Flight-routes-header, .Flight-offers-header {
        flex-wrap: wrap;
        gap: 9px;
        margin-bottom: 14px;
    }

    .Flight-airlines-heading, .Flight-routes-heading, .Flight-offers-heading {
        width: 100%;
    }

        .Flight-airlines-heading h2, .Flight-routes-heading h2, .Flight-booking-header h2, .Flight-offers-heading h2, .Flight-why-header h2 {
            font-size: 20px;
        }

    .Flight-airlines-card {
        flex-basis: 100px;
        width: 100px;
        height: 84px;
    }

    .Flight-airlines-track {
        gap: 9px;
    }

    .Flight-airlines-logo {
        height: 43px;
    }

        .Flight-airlines-logo img {
            max-width: 78px;
            max-height: 38px;
        }

    .Flight-airlines-nav {
        width: 28px;
        height: 28px;
    }

    .Flight-airlines-slider {
        padding-left: 20px;
        padding-right: 20px;
    }

    .Flight-routes-grid {
        gap: 9px;
    }

    .Flight-routes-image {
        height: 105px;
    }

    .Flight-routes-body {
        padding: 9px 7px;
        gap: 5px;
    }

        .Flight-routes-body h3 {
            font-size: 10px;
        }

    .Flight-routes-plane {
        font-size: 12px;
    }

    .Flight-routes-arrow {
        width: 24px;
        height: 24px;
        font-size: 11px;
    }

    .Flight-booking-grid {
        grid-template-columns: 1fr;
        gap: 22px;
        padding-top: 15px;
    }

    .Flight-booking-card {
        min-height: 88px;
        padding: 17px 15px 12px;
    }

    .Flight-booking-number {
        top: -12px;
        width: 29px;
        height: 29px;
        font-size: 14px;
    }

    .Flight-booking-arrow, .Flight-booking-step:nth-child(3) .Flight-booking-arrow {
        display: none;
    }

    .Flight-booking-content h3 {
        font-size: 12px;
    }

    .Flight-booking-content p {
        font-size: 10px;
    }

    .Flight-offers-grid {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .Flight-offers-image {
        height: 180px;
    }

    .Flight-offers-bottom {
        flex-direction: row;
    }

    .Flight-offers-book-btn {
        min-width: 112px;
    }

    .Flight-why-grid {
        gap: 9px;
    }

    .Flight-why-item {
        min-height: 90px;
        gap: 7px;
        padding: 10px 8px;
    }

    .Flight-why-icon {
        width: 37px;
        height: 37px;
    }

        .Flight-why-icon i {
            font-size: 19px;
        }

    .Flight-why-content h3 {
        font-size: 10px;
    }

    .Flight-why-content p {
        font-size: 9px;
    }

    .Flight-cta-section {
        min-height: 240px;
        padding: 22px 0;
        background-position: 67% center;
    }

    .Flight-cta-wrapper {
        gap: 10px;
    }

    .Flight-cta-icon {
        width: 50px;
        height: 50px;
    }

        .Flight-cta-icon i {
            font-size: 24px;
        }

    .Flight-cta-content {
        flex-basis: calc(100% - 60px);
    }

        .Flight-cta-content h2 {
            font-size: 18px;
        }

        .Flight-cta-content p {
            font-size: 11px;
        }

    .Flight-cta-action {
        margin-left: 60px;
    }

    .Flight-cta-button {
        min-width: 145px;
        min-height: 41px;
        font-size: 11px;
    }
}

@media (max-width: 399.98px) {
    .Flight-banner-container {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }

    .Flight-banner-content {
        max-width: 100%;
    }

    .Flight-banner-title {
        font-size: 25px;
    }

    .Flight-banner-eyebrow {
        letter-spacing: 1.5px;
    }

    .Flight-banner-offer {
        gap: 5px;
    }

    .Flight-banner-offer-icon {
        width: 30px;
        height: 30px;
        font-size: 17px;
    }

    .Flight-banner-offer-content strong {
        font-size: 12px;
    }

    .Flight-banner-offer-content span {
        white-space: normal;
        font-size: 8px;
    }

    .Flight-banner-offer-code strong {
        font-size: 12px;
    }

    .Flight-banner-offer-plane {
        display: none;
    }

    .Flight-support-item {
        gap: 6px;
        padding: 9px 6px;
    }

    .Flight-support-icon {
        width: 32px;
        height: 32px;
    }

        .Flight-support-icon i {
            font-size: 17px;
        }

    .Flight-support-content h3 {
        font-size: 9px;
    }

    .Flight-support-content p {
        font-size: 8px;
    }

    .Flight-routes-grid {
        grid-template-columns: 1fr;
    }

    .Flight-routes-image {
        height: 150px;
    }

    .Flight-routes-body h3 {
        font-size: 12px;
    }

    .Flight-why-grid {
        grid-template-columns: 1fr;
    }

    .Flight-why-item {
        min-height: 70px;
        padding: 11px 12px;
    }

    .Flight-why-icon {
        width: 43px;
        height: 43px;
    }

    .Flight-why-content h3 {
        font-size: 11px;
    }

    .Flight-why-content p {
        font-size: 10px;
    }

    .Flight-cta-content h2 {
        font-size: 16px;
    }

    .Flight-cta-action {
        margin-left: 0;
    }
}

@media (hover: none) {
    .Flight-support-item, .Flight-why-item {
        cursor: default;
    }
}

@media (prefers-reduced-motion: reduce) {
    .Flight-banner-travel-text span, .Flight-booking-decoration-plane {
        animation: none;
    }

    .Flight-support-icon::before, .Flight-booking-icon::before, .Flight-why-icon::before {
        transition: none;
    }
}


