@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

:root {
    --navy: #153b55;
    --navy2: #214f6c;
    --blue: #5aa8d4;
    --sky: #edf8fd;
    --mint: #eff9f5;
    --text: #294556;
    --muted: #6f8595;
    --line: #dce8ee;
    --white: #fff;
    --gold: #f1bb70
}

* {
    box-sizing: border-box
}

html {
    scroll-behavior: smooth
}

body {
    margin: 0;
    font-family: 'DM Sans', Arial, sans-serif;
    color: var(--text);
    line-height: 1.65;
    background: #fff
}

a {
    text-decoration: none;
    color: inherit
}

.container {
    width: min(1160px, 92%);
    margin: auto
}

.top-strip {
    background: #eef8fb;
    color: #52778d;
    text-align: center;
    font-size: .68rem;
    letter-spacing: .4px;
    padding: 7px 10px
}

.header {
    height: 76px;
    background: rgba(255, 255, 255, .94);
    backdrop-filter: blur(15px);
    border-bottom: 1px solid rgba(220, 232, 238, .8);
    position: sticky;
    top: 0;
    z-index: 100
}

.nav {
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.logo {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--navy)
}

.logo span {
    color: var(--blue)
}

.main-nav {
    display: flex;
    align-items: center;
    gap: 22px
}

.main-nav>a {
    font-size: .82rem;
    color: #5d7485;
    transition: .2s
}

.main-nav>a:hover {
    color: var(--blue)
}

.nav-cta {
    background: var(--navy);
    color: #fff !important;
    padding: 10px 16px;
    border-radius: 9px
}

.menu-toggle {
    display: none;
    border: 0;
    background: transparent;
    font-size: 1.5rem;
    color: var(--navy)
}

.hero {
    min-height: 620px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 20% 25%, #fff 0, transparent 30%), linear-gradient(135deg, #f5fcff, #eaf7f2)
}

.hero:before {
    content: "";
    position: absolute;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    right: -280px;
    top: -180px;
    border: 1px solid rgba(90, 168, 212, .15)
}

.hero-orbit {
    position: absolute;
    border: 1px solid rgba(90, 168, 212, .13);
    border-radius: 50%;
    pointer-events: none
}

.orbit-a {
    width: 500px;
    height: 500px;
    right: -120px;
    bottom: -290px
}

.orbit-b {
    width: 700px;
    height: 700px;
    left: -500px;
    top: -400px
}

.hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 55px;
    position: relative;
    z-index: 2
}

.eyebrow {
    font-size: .68rem;
    color: var(--blue);
    font-weight: 700;
    letter-spacing: 1.8px
}

.hero h1,
.page-hero h1,
.section-head h2,
.experience h2,
.promo h2,
.policy h2,
.contact-copy h2,
.guide-section h2 {
    font-family: 'Playfair Display', Georgia, serif;
    color: var(--navy);
    line-height: 1.08
}

.hero h1 {
    font-size: clamp(3.15rem, 5.8vw, 5.3rem);
    margin: 16px 0
}

.hero h1 em {
    color: var(--blue)
}

.hero p {
    font-size: 1.03rem;
    color: var(--muted);
    max-width: 560px
}

.hero-actions {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-top: 23px
}

.primary-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: var(--navy);
    color: #fff;
    padding: 14px 21px;
    border-radius: 10px;
    font-weight: 700;
    box-shadow: 0 15px 32px rgba(21, 59, 85, .17);
    transition: .25s
}

.primary-btn:hover {
    transform: translateY(-2px);
    background: #0f3047
}

.text-btn {
    font-size: .84rem;
    font-weight: 700;
    color: var(--blue)
}

.trust-row {
    display: flex;
    gap: 25px;
    margin-top: 28px;
    color: var(--muted);
    font-size: .72rem
}

.trust-row b {
    display: block;
    color: var(--navy);
    font-size: 1rem
}

.hero-image {
    position: relative
}

.hero-image>img {
    width: 100%;
    max-width: 520px;
    display: block;
    margin: auto;
    filter: drop-shadow(0 25px 35px rgba(44, 102, 132, .15))
}

.floating-fare,
.passport-card {
    position: absolute;
    background: rgba(255, 255, 255, .94);
    border: 1px solid #fff;
    box-shadow: 0 16px 40px rgba(34, 77, 100, .15);
    border-radius: 13px
}

.floating-fare {
    right: -5px;
    bottom: 40px;
    padding: 12px 16px
}

.floating-fare small,
.floating-fare span {
    display: block;
    color: var(--muted);
    font-size: .64rem
}

.floating-fare strong {
    font-size: 1.5rem;
    color: var(--blue);
    line-height: 1.2
}

.passport-card {
    left: 0;
    top: 55px;
    padding: 12px 16px;
    font-size: .78rem;
    color: var(--navy)
}

.passport-card small {
    display: block;
    color: var(--muted);
    font-size: .62rem
}

.search-wrap {
    margin-top: -54px;
    position: relative;
    z-index: 5
}

.search-box {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 20px;
    box-shadow: 0 22px 55px rgba(29, 71, 94, .13)
}

.search-tabs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px
}

.search-tabs button {
    border: 0;
    background: transparent;
    padding: 8px 13px;
    color: var(--muted);
    border-radius: 7px;
    cursor: pointer;
    font: inherit;
    font-size: .8rem
}

.search-tabs .active {
    background: #e8f5fb;
    color: var(--navy);
    font-weight: 700
}

.search-tabs span {
    color: #53846f;
    background: #eef9f4;
    padding: 6px 10px;
    border-radius: 20px;
    font-size: .68rem
}

.search-fields {
    display: grid;
    grid-template-columns: 1.2fr 34px 1.2fr .85fr .85fr 1fr 135px;
    gap: 8px
}

.search-fields label {
    border: 1px solid var(--line);
    border-radius: 9px;
    padding: 8px 10px;
    color: #8192a0;
    font-size: .6rem;
    font-weight: 700;
    text-transform: uppercase
}

.search-fields input,
.search-fields select {
    display: block;
    width: 100%;
    border: 0;
    outline: 0;
    padding: 3px 0 0;
    background: #fff;
    color: var(--navy);
    font: inherit;
    font-size: .76rem;
    text-transform: none
}

.swap {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #eef7fb;
    color: var(--blue);
    align-self: center
}

.search-btn {
    border: 0;
    border-radius: 9px;
    background: var(--blue);
    color: #fff;
    font-weight: 700;
    cursor: pointer
}

.search-note {
    font-size: .67rem;
    color: #8293a0;
    margin: 12px 2px 0
}

.section {
    padding: 92px 0
}

.section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 34px
}

.section-head h2 {
    font-size: clamp(2.1rem, 4vw, 3.2rem);
    margin: 7px 0
}

.section-head>p {
    color: var(--muted);
    max-width: 310px;
    font-size: .84rem
}

.destination-grid {
    display: grid;
    grid-template-columns: 1.35fr 1fr 1fr;
    gap: 18px
}

.destination-card {
    position: relative;
    min-height: 365px;
    border-radius: 18px;
    overflow: hidden;
    background: var(--navy);
    box-shadow: 0 12px 30px rgba(32, 68, 89, .08)
}

.destination-card img {
    width: 100%;
    height: 100%;
    position: absolute;
    object-fit: cover;
    transition: .5s
}

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

.destination-card:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent 25%, rgba(8, 36, 52, .88))
}

.destination-card>div {
    position: absolute;
    z-index: 2;
    left: 23px;
    right: 23px;
    bottom: 20px;
    color: #fff
}

.destination-card small {
    font-size: .59rem;
    letter-spacing: 1px;
    color: #d8edf7
}

.destination-card h3 {
    font-family: 'Playfair Display';
    font-size: 1.7rem;
    margin: 5px 0;
    color: white !important;
}

.destination-card p {
    font-size: .72rem;
    line-height: 1.5;
    color: #d9e8ef;
    margin: 0 0 8px
}

.destination-card strong {
    font-size: .85rem
}

.destination-card i {
    font-style: normal;
    margin-left: 8px
}

.featured {
    min-height: 435px
}

.featured h3 {
    font-size: 2.3rem
}

.why-section {
    background: #f7fbfd
}

.center-head {
    justify-content: center;
    text-align: center
}

.center-head>div {
    max-width: 690px
}

.center-head p {
    color: var(--muted);
    font-size: .9rem
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px
}

.feature-grid article {
    background: #fff;
    border: 1px solid var(--line);
    padding: 27px;
    border-radius: 15px
}

.feature-icon {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #edf7fb;
    color: var(--blue);
    font-size: 1.25rem
}

.feature-grid h3 {
    color: var(--navy);
    margin: 16px 0 6px
}

.feature-grid p {
    color: var(--muted);
    font-size: .83rem;
    margin: 0
}

.experience {
    background: #f6fafc;
    padding: 95px 0
}

.experience-grid {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 90px;
    align-items: center
}

.experience h2,
.promo h2,
.guide-section h2 {
    font-size: clamp(2.35rem, 5vw, 4rem);
    margin: 8px 0
}

.experience p,
.promo p,
.guide-section p {
    color: var(--muted)
}

.benefits {
    display: grid;
    gap: 12px
}

.benefits>div {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 13px;
    padding: 17px 20px
}

.benefits b {
    color: var(--blue)
}

.benefits h3 {
    margin: 3px 0;
    color: var(--navy);
    font-size: 1rem
}

.benefits p {
    font-size: .8rem;
    margin: 0
}

.guide-section {
    padding: 95px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 75px;
    align-items: center
}

.guide-image {
    min-height: 330px;
    border-radius: 20px;
    background: linear-gradient(135deg, #e8f7fc, #edf8f2);
    display: grid;
    place-items: center;
    padding: 30px
}

.guide-image img {
    width: 100%;
    max-width: 520px
}

.mini-stats {
    display: flex;
    gap: 12px;
    margin-top: 25px
}

.mini-stats>div {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 12px 15px;
    min-width: 110px
}

.mini-stats b {
    display: block;
    color: var(--navy);
    font-size: 1.05rem
}

.mini-stats span {
    color: var(--muted);
    font-size: .62rem
}

.promo {
    margin: 90px auto;
    min-height: 320px;
    background: linear-gradient(120deg, #153b55, #286081);
    border-radius: 21px;
    color: #fff;
    padding: 55px 62px;
    position: relative;
    overflow: hidden
}

.promo>div {
    position: relative;
    z-index: 2;
    max-width: 580px
}

.promo h2 {
    color: #fff
}

.promo p {
    color: #d2e6f0
}

.promo .eyebrow {
    color: #a7d9ef
}

.promo img {
    position: absolute;
    right: -40px;
    top: 0;
    height: 100%;
    opacity: .22
}

.page-hero {
    padding: 88px 0;
    background: linear-gradient(135deg, #f3faff, #eff9f5);
    text-align: center
}

.page-hero h1 {
    font-size: clamp(2.8rem, 5vw, 4.4rem);
    margin: 10px
}

.page-hero p {
    color: var(--muted)
}

.contact-grid {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 80px
}

.contact-copy h2 {
    font-size: 3rem
}

.contact-copy>p {
    color: var(--muted)
}

.contact-item {
    margin: 25px 0
}

.contact-item b,
.contact-item span {
    display: block
}

.contact-item span {
    color: var(--muted);
    font-size: .85rem
}

.contact-form {
    border: 1px solid var(--line);
    border-radius: 15px;
    padding: 28px;
    box-shadow: 0 15px 45px rgba(31, 68, 91, .06)
}

.contact-form label {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    color: var(--muted);
    margin-bottom: 15px
}

.contact-form input,
.contact-form textarea {
    display: block;
    width: 100%;
    margin-top: 6px;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px;
    font: inherit
}

.contact-form textarea {
    resize: vertical
}

.contact-form button {
    width: 100%;
    border: 0;
    border-radius: 9px;
    background: var(--navy);
    color: #fff;
    padding: 14px;
    font: inherit;
    font-weight: 700;
    cursor: pointer
}

.contact-form p {
    color: #4c8c6f;
    font-size: .8rem
}

.policy {
    max-width: 900px
}

.policy h2 {
    font-size: 2.8rem
}

.policy h3 {
    color: var(--navy);
    margin-top: 32px
}

.policy p {
    color: #617788
}

.policy a {
    color: var(--blue);
    font-weight: 700
}

.footer {
    background: #f5f9fb;
    border-top: 1px solid var(--line);
    padding: 58px 0 20px
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 45px
}

.footer p {
    color: var(--muted);
    font-size: .84rem;
    max-width: 360px
}

.footer h4 {
    color: var(--navy);
    margin-top: 0
}

.footer a,
.footer span {
    display: block;
    color: var(--muted);
    font-size: .78rem;
    margin: 9px 0
}

.socials {
    display: flex;
    gap: 10px;
    margin-top: 15px
}

.socials span {
    width: 30px;
    height: 30px;
    border: 1px solid var(--line);
    border-radius: 50%;
    display: grid;
    place-items: center
}

.copyright {
    border-top: 1px solid var(--line);
    margin-top: 32px;
    padding-top: 18px;
    color: var(--muted);
    font-size: .68rem
}

@media(max-width:1050px) {
    .search-fields {
        grid-template-columns: 1fr 1fr 1fr
    }

    .swap {
        display: none
    }

    .search-btn {
        min-height: 48px
    }

    .destination-grid {
        grid-template-columns: 1fr 1fr
    }

    .featured {
        grid-column: span 2
    }

    .footer-grid {
        grid-template-columns: 2fr 1fr 1fr
    }

    .guide-section {
        gap: 40px
    }
}

@media(max-width:760px) {
    .header {
        height: auto
    }

    .nav {
        min-height: 70px;
        position: relative;
        flex-wrap: wrap
    }

    .menu-toggle {
        display: block
    }

    .main-nav {
        display: none;
        width: 100%;
        padding: 10px 0 15px;
        flex-direction: column;
        align-items: center
    }

    .main-nav.open {
        display: flex
    }

    .main-nav .nav-cta {
        margin-top: 4px
    }

    .hero {
        padding: 60px 0 105px
    }

    .hero-grid,
    .experience-grid,
    .contact-grid,
    .guide-section {
        grid-template-columns: 1fr;
        text-align: center
    }

    .hero-copy>p {
        margin: auto
    }

    .hero-actions,
    .trust-row {
        justify-content: center;
        flex-wrap: wrap
    }

    .hero-image {
        max-width: 430px;
        margin: auto
    }

    .passport-card {
        left: 5px
    }

    .floating-fare {
        right: 5px
    }

    .search-tabs {
        flex-wrap: wrap
    }

    .search-fields,
    .destination-grid,
    .feature-grid,
    .footer-grid {
        grid-template-columns: 1fr
    }

    .featured {
        grid-column: auto
    }

    .destination-card {
        min-height: 330px
    }

    .section-head {
        display: block;
        text-align: center
    }

    .section-head>p {
        max-width: 100%
    }

    .promo {
        margin: 50px auto;
        padding: 42px 25px
    }

    .promo img {
        opacity: .11
    }

    .contact-copy h2 {
        font-size: 2.5rem
    }

    .footer {
        text-align: center
    }

    .footer p {
        margin: auto
    }

    .socials {
        justify-content: center
    }

    .policy h2 {
        font-size: 2.3rem
    }

    .mini-stats {
        justify-content: center
    }

    .guide-image {
        min-height: 250px
    }
}


/* =========================================================
   CSS FIXES - SEARCH BAR, POLICY CONTENT & FAQ
   ========================================================= */

/* Prevent horizontal overflow */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

main {
    overflow: hidden;
}

img {
    max-width: 100%;
}

/* Fix hero/search overlap and hidden statistics */
.hero {
    padding-bottom: 115px;
}

.search-wrap {
    margin-top: -72px;
    padding-bottom: 0;
}

.trust-row {
    position: relative;
    z-index: 3;
    margin-bottom: 20px;
}

/* Make the desktop search form fit cleanly */
.search-fields {
    grid-template-columns:
        minmax(140px, 1.2fr) 34px minmax(140px, 1.2fr) minmax(115px, .85fr) minmax(115px, .85fr) minmax(150px, 1fr) minmax(135px, .9fr);
    align-items: stretch;
}

.search-fields>* {
    min-width: 0;
}

.search-fields label {
    min-height: 59px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.search-fields input,
.search-fields select {
    min-width: 0;
}

.search-btn {
    min-height: 59px;
    white-space: nowrap;
}

/* Fix policy page: all content stays inside the centered container */
.policy {
    width: min(900px, 92%);
    margin-left: auto;
    margin-right: auto;
    padding-top: 70px;
    padding-bottom: 80px;
}

.policy h2 {
    margin-top: 0;
}

.policy h3 {
    margin-top: 34px;
    margin-bottom: 12px;
}

.policy p {
    max-width: 100%;
    margin: 0 0 16px;
}

/* Shared lists */
.content-list {
    padding-left: 24px;
    margin: 18px 0 24px;
    color: #617788;
}

.content-list li {
    margin: 9px 0;
    padding-left: 4px;
}

.content-list li::marker {
    color: var(--blue);
}

/* FAQ */
.faq-section {
    background: #f7fbfd;
    padding: 90px 0;
}

.faq-wrap {
    width: min(850px, 100%);
    margin: 0 auto;
}

.faq-intro {
    text-align: center;
    margin-bottom: 32px;
}

.faq-intro h2 {
    font-family: 'Playfair Display', Georgia, serif;
    color: var(--navy);
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    margin: 8px 0 12px;
}

.faq-intro p {
    color: var(--muted);
    max-width: 620px;
    margin: auto;
}

.faq-list {
    display: grid;
    gap: 12px;
}

.faq-item {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
}

.faq-question {
    width: 100%;
    border: 0;
    background: #fff;
    color: var(--navy);
    font: inherit;
    font-weight: 700;
    text-align: left;
    padding: 19px 22px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.faq-question .faq-icon {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    background: #edf7fb;
    color: var(--blue);
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    transition: transform .25s ease;
}

.faq-answer {
    display: none;
    padding: 0 22px 20px;
    color: var(--muted);
    font-size: .9rem;
}

.faq-item.active .faq-answer {
    display: block;
}

.faq-item.active .faq-icon {
    transform: rotate(45deg);
}

@media (max-width: 1100px) {
    .search-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .search-fields .swap {
        display: none;
    }

    .search-btn {
        min-height: 55px;
    }
}

@media (max-width: 760px) {
    .hero {
        padding-bottom: 100px;
    }

    .search-wrap {
        margin-top: -45px;
    }

    .trust-row {
        margin-bottom: 12px;
    }

    .search-fields {
        grid-template-columns: 1fr;
    }

    .search-box {
        padding: 15px;
    }

    .policy {
        width: 92%;
        padding-top: 50px;
        padding-bottom: 60px;
    }

    .policy h2 {
        font-size: 2.15rem;
    }

    .faq-section {
        padding: 65px 0;
    }

    .faq-question {
        padding: 17px;
        font-size: .88rem;
    }

    .faq-answer {
        padding: 0 17px 18px;
    }
}


/* ================= DREAMSFARE EXPERIENCE ENHANCEMENT ================= */
:root {
    --dream: #5aa8d4;
    --deep: #153b55;
    --soft: #f4fbfe;
    --mint: #eff9f5
}

body {
    background: #fff;
    color: #294556
}

.header {
    box-shadow: 0 4px 24px rgba(21, 59, 85, .04)
}

.logo {
    letter-spacing: -.5px
}

.logo-mark {
    display: inline-block;
    transform: rotate(-18deg);
    margin-right: 2px;
    color: var(--dream)
}

.hero {
    background: linear-gradient(130deg, #f9fdff 0%, #eaf8fc 55%, #eef9f5 100%)
}

.hero:after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 140px;
    background: linear-gradient(transparent, rgba(255, 255, 255, .28));
    pointer-events: none
}

.hero-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(5px);
    opacity: .5
}

.glow-one {
    width: 380px;
    height: 380px;
    right: -120px;
    top: 70px;
    background: #b8e3f5
}

.glow-two {
    width: 260px;
    height: 260px;
    left: -100px;
    bottom: -60px;
    background: #c9f0dc
}

.hero-copy {
    position: relative;
    z-index: 3
}

.hero h1 {
    letter-spacing: -1.8px
}

.hero p {
    max-width: 590px
}

.hero-image {
    z-index: 2
}

.floating-fare {
    animation: floaty 4s ease-in-out infinite
}

.passport-card {
    animation: floaty 5s ease-in-out infinite reverse
}

@keyframes floaty {
    50% {
        transform: translateY(-8px)
    }
}

.search-box {
    backdrop-filter: blur(18px);
    border-color: rgba(200, 224, 234, .9);
    box-shadow: 0 25px 70px rgba(29, 71, 94, .16)
}

.search-fields label {
    transition: .2s;
    background: #fff
}

.search-fields label:focus-within {
    border-color: var(--dream);
    box-shadow: 0 0 0 3px rgba(90, 168, 212, .10)
}

.search-btn {
    box-shadow: 0 10px 22px rgba(90, 168, 212, .22);
    transition: .25s
}

.search-btn:hover {
    transform: translateY(-2px);
    filter: brightness(.96)
}

.destination-card {
    isolation: isolate
}

.destination-card:before {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 18px;
    z-index: 4;
    pointer-events: none
}

.destination-card strong {
    display: inline-flex;
    align-items: center;
    gap: 6px
}

.feature-grid article {
    transition: transform .25s, box-shadow .25s
}

.feature-grid article:hover {
    transform: translateY(-7px);
    box-shadow: 0 20px 40px rgba(35, 78, 100, .08)
}

.feature-grid article:hover .feature-icon {
    transform: rotate(-8deg) scale(1.08)
}

.feature-icon {
    transition: .25s
}

.experience {
    position: relative;
    overflow: hidden
}

.experience:before {
    content: "✦";
    position: absolute;
    right: 7%;
    top: 20%;
    font-size: 9rem;
    color: rgba(90, 168, 212, .06)
}

.guide-image {
    position: relative;
    overflow: hidden
}

.guide-image:after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    border: 1px solid rgba(90, 168, 212, .25);
    border-radius: 50%;
    right: -70px;
    top: -70px
}

.dream-band {
    padding: 100px 20px;
    text-align: center;
    background: linear-gradient(135deg, #163e58, #286b8c);
    color: #fff;
    position: relative;
    overflow: hidden
}

.dream-band:before,
.dream-band:after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 50%
}

.dream-band:before {
    width: 520px;
    height: 520px;
    left: -280px;
    top: -280px
}

.dream-band:after {
    width: 620px;
    height: 620px;
    right: -350px;
    bottom: -430px
}

.dream-band .container {
    position: relative;
    z-index: 2;
    max-width: 800px
}

.dream-band h2 {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(2.5rem, 5vw, 4.3rem);
    line-height: 1.08;
    margin: 12px 0;
    color: #fff
}

.dream-band p {
    color: #d7eaf2;
    font-size: 1rem;
    max-width: 600px;
    margin: 0 auto 25px
}

.dream-band .eyebrow {
    color: #a9dbef
}

.light-btn {
    display: inline-flex;
    background: #fff;
    color: var(--deep);
    padding: 14px 22px;
    border-radius: 10px;
    font-weight: 700;
    box-shadow: 0 12px 35px rgba(0, 0, 0, .15)
}

.page-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #f5fcff, #edf9f4)
}

.page-hero:after {
    content: "";
    position: absolute;
    width: 380px;
    height: 380px;
    border: 1px solid rgba(90, 168, 212, .18);
    border-radius: 50%;
    right: -150px;
    top: -200px
}

.page-hero .container {
    position: relative;
    z-index: 2
}

.page-hero p {
    max-width: 700px;
    margin: 0 auto
}

.contact-form {
    background: #fff
}

.contact-form:focus-within {
    box-shadow: 0 20px 50px rgba(31, 68, 91, .09)
}

.policy {
    position: relative
}

.policy h3 {
    font-family: 'DM Sans', Arial, sans-serif;
    color: var(--deep);
    font-size: 1.12rem;
    border-left: 3px solid var(--dream);
    padding-left: 12px
}

.policy p {
    font-size: .95rem;
    line-height: 1.85
}

.faq-section {
    position: relative
}

.faq-item {
    transition: box-shadow .25s
}

.faq-item.active {
    box-shadow: 0 12px 30px rgba(31, 68, 91, .07);
    border-color: #cfe5ee
}

.footer {
    background: linear-gradient(180deg, #f7fbfd, #edf6fa)
}

.footer-logo {
    font-size: 1.6rem
}

@media(max-width:760px) {
    .dream-band {
        padding: 75px 20px
    }

    .hero h1 {
        letter-spacing: -1px
    }

    .floating-fare {
        right: 0
    }

    .passport-card {
        left: 0
    }

    .page-hero {
        padding: 65px 0
    }

    .section {
        padding: 70px 0
    }
}


/* =========================================================
   DREAMSFARE V2 — BRIGHTER, MORE IMMERSIVE UI UPDATE
   ========================================================= */

/* Logo sizing */
.logo {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    line-height: 0;
    padding: 3px 0;
}

.logo img {
    display: block;
    width: auto;
    height: 52px;
    max-width: 245px;
    object-fit: contain;
    object-position: left center;
    transition: transform .3s ease, filter .3s ease;
}

.logo:hover img {
    transform: translateY(-1px) scale(1.02);
    filter: drop-shadow(0 7px 13px rgba(38, 160, 205, .18));
}

/* Brighter global background and softer visual depth */
body {
    background: linear-gradient(180deg, #ffffff 0%, #fbfeff 42%, #f7fcff 100%);
}

.header {
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 8px 28px rgba(32, 96, 127, .06);
}

.header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(74, 180, 222, .38), rgba(20, 197, 179, .30), transparent);
}

.main-nav>a {
    position: relative;
    font-weight: 600;
}

.main-nav>a:not(.nav-cta)::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 0;
    height: 2px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--blue), #29c9c3);
    transition: width .28s ease;
}

.main-nav>a:not(.nav-cta):hover::after {
    width: 100%
}

.nav-cta {
    background: linear-gradient(135deg, #153b55, #1d6d93) !important;
    box-shadow: 0 9px 22px rgba(24, 91, 126, .18);
}

/* Hero becomes brighter and more atmospheric */
.hero {
    min-height: 650px;
    background:
        radial-gradient(circle at 12% 20%, rgba(255, 255, 255, .98) 0, rgba(255, 255, 255, .5) 22%, transparent 42%),
        radial-gradient(circle at 88% 18%, rgba(78, 194, 229, .20) 0, transparent 27%),
        radial-gradient(circle at 66% 92%, rgba(76, 218, 190, .16) 0, transparent 26%),
        linear-gradient(135deg, #f7fdff 0%, #e9f9ff 48%, #f1fcf7 100%);
}

.hero::after {
    content: "";
    position: absolute;
    width: 760px;
    height: 760px;
    border-radius: 50%;
    left: 45%;
    top: -610px;
    border: 1px solid rgba(66, 181, 217, .17);
    box-shadow: 0 0 0 75px rgba(72, 186, 220, .025), 0 0 0 150px rgba(72, 186, 220, .018);
    pointer-events: none;
}

.hero-copy {
    animation: dreamFadeUp .75s ease both
}

.hero-image {
    animation: dreamFloatIn .9s .08s ease both
}

.hero-image>img {
    filter: drop-shadow(0 28px 45px rgba(30, 121, 159, .18));
    animation: dreamFloat 6s ease-in-out infinite;
}

.hero h1 em {
    background: linear-gradient(90deg, #35a7dc, #13bfb8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.primary-btn {
    background: linear-gradient(135deg, #153b55 0%, #1c5e7d 100%);
    position: relative;
    overflow: hidden;
}

.primary-btn::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -120%;
    width: 60%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .25), transparent);
    transform: skewX(-20deg);
    transition: left .55s ease;
}

.primary-btn:hover::before {
    left: 150%
}

.primary-btn:hover {
    box-shadow: 0 18px 34px rgba(23, 83, 113, .22);
}

.text-btn {
    color: #229ad1
}

.trust-row span {
    padding: 9px 13px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .58);
    border: 1px solid rgba(91, 175, 211, .12);
    backdrop-filter: blur(8px);
}

/* Glass search panel */
.search-wrap {
    margin-top: -70px
}

.search-box {
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(255, 255, 255, .96);
    box-shadow: 0 28px 70px rgba(24, 91, 125, .16), 0 4px 16px rgba(28, 91, 118, .06);
    backdrop-filter: blur(18px);
}

.search-box::before {
    content: "";
    display: block;
    height: 3px;
    margin: -20px -20px 17px;
    border-radius: 18px 18px 0 0;
    background: linear-gradient(90deg, #43b3e1, #37d0c6, #a6e4c5);
}

.search-tabs .active {
    background: linear-gradient(135deg, #e6f8ff, #e9fbf6);
    box-shadow: inset 0 0 0 1px rgba(73, 174, 214, .13);
}

.search-fields label {
    background: #fff;
    box-shadow: 0 4px 12px rgba(35, 105, 137, .025);
    transition: border-color .2s, box-shadow .2s, transform .2s;
}

.search-fields label:focus-within {
    border-color: #65bde2;
    box-shadow: 0 0 0 4px rgba(90, 168, 212, .12);
    transform: translateY(-1px);
}

.search-btn {
    background: linear-gradient(135deg, #42a9d7, #2b87bb);
    box-shadow: 0 10px 22px rgba(53, 153, 202, .20);
    transition: transform .22s, box-shadow .22s;
}

.search-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 28px rgba(53, 153, 202, .28);
}

/* More polished cards and sections */
.section {
    position: relative
}

.destination-card {
    border: 1px solid rgba(255, 255, 255, .65);
    box-shadow: 0 18px 42px rgba(32, 91, 120, .12);
    transition: transform .35s ease, box-shadow .35s ease;
}

.destination-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 26px 55px rgba(29, 91, 121, .18);
}

.destination-card::before {
    content: "";
    position: absolute;
    z-index: 3;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .16);
    backdrop-filter: blur(7px);
    opacity: 0;
    transform: scale(.7);
    transition: .3s ease;
}

.destination-card:hover::before {
    opacity: 1;
    transform: scale(1)
}

.why-section {
    background:
        radial-gradient(circle at 8% 15%, rgba(82, 197, 232, .10), transparent 22%),
        radial-gradient(circle at 95% 75%, rgba(74, 216, 188, .10), transparent 22%),
        #f7fcff;
}

.feature-grid article {
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(31, 98, 129, .045);
    transition: transform .3s, box-shadow .3s, border-color .3s;
}

.feature-grid article::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background: linear-gradient(90deg, #48b7e2, #28c8bb);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s;
}

.feature-grid article:hover {
    transform: translateY(-6px);
    border-color: rgba(74, 182, 220, .32);
    box-shadow: 0 20px 40px rgba(32, 102, 132, .12);
}

.feature-grid article:hover::after {
    transform: scaleX(1)
}

.feature-icon {
    background: linear-gradient(135deg, #e5f8ff, #e8fbf5);
}

.experience {
    background:
        linear-gradient(120deg, rgba(255, 255, 255, .7), rgba(238, 250, 255, .9)),
        #f2fbff;
}

.benefits>div {
    transition: transform .25s, box-shadow .25s;
    box-shadow: 0 7px 20px rgba(34, 99, 130, .045);
}

.benefits>div:hover {
    transform: translateX(8px);
    box-shadow: 0 14px 28px rgba(34, 99, 130, .10);
}

.guide-image {
    background:
        radial-gradient(circle at 50% 45%, rgba(255, 255, 255, .95), rgba(234, 249, 253, .78) 42%, transparent 70%),
        linear-gradient(135deg, #ddf7ff, #e7fbf2);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .8), 0 18px 38px rgba(35, 113, 146, .08);
}

/* Dream band / CTA */
.dream-band {
    position: relative;
    overflow: hidden;
    background: linear-gradient(120deg, #123c57 0%, #176b89 52%, #20a99e 100%);
    box-shadow: 0 25px 55px rgba(17, 91, 113, .17);
}

.dream-band::before,
.dream-band::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.dream-band::before {
    width: 430px;
    height: 430px;
    right: -120px;
    top: -220px;
    border: 1px solid rgba(255, 255, 255, .18);
    box-shadow: 0 0 0 55px rgba(255, 255, 255, .035), 0 0 0 110px rgba(255, 255, 255, .02);
}

.dream-band::after {
    width: 260px;
    height: 260px;
    left: -100px;
    bottom: -160px;
    background: radial-gradient(circle, rgba(101, 229, 214, .20), transparent 70%);
}

/* FAQ more interactive */
.faq-section {
    background:
        radial-gradient(circle at 10% 15%, rgba(80, 193, 226, .08), transparent 22%),
        #fbfeff;
}

.faq-item {
    transition: transform .22s, box-shadow .22s, border-color .22s;
    box-shadow: 0 6px 16px rgba(33, 97, 127, .035);
}

.faq-item:hover {
    transform: translateY(-2px);
    border-color: rgba(75, 181, 218, .28);
    box-shadow: 0 12px 28px rgba(33, 97, 127, .08);
}

.faq-item.active {
    border-color: rgba(68, 177, 216, .38);
    box-shadow: 0 14px 32px rgba(33, 97, 127, .09);
}

.faq-question {
    transition: background .2s
}

.faq-item.active .faq-question {
    background: linear-gradient(90deg, #fbfeff, #f1fbfd)
}

/* Contact and legal pages */
.page-hero {
    background:
        radial-gradient(circle at 80% 20%, rgba(66, 188, 223, .16), transparent 28%),
        linear-gradient(135deg, #f3fcff, #eaf8f4);
}

.contact-card,
.policy {
    box-shadow: 0 14px 34px rgba(31, 95, 125, .06);
}

/* Scroll reveal */
.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease;
}

.reveal.visible {
    opacity: 1;
    transform: none;
}

@keyframes dreamFadeUp {
    from {
        opacity: 0;
        transform: translateY(26px)
    }

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

@keyframes dreamFloatIn {
    from {
        opacity: 0;
        transform: translateX(28px) translateY(12px)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@keyframes dreamFloat {

    0%,
    100% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-9px)
    }
}

@media (max-width:760px) {
    .header {
        height: 68px
    }

    .logo img {
        height: 43px;
        max-width: 205px
    }

    .hero {
        min-height: auto;
        padding-top: 45px
    }

    .trust-row {
        gap: 8px
    }

    .trust-row span {
        padding: 7px 9px
    }

    .search-wrap {
        margin-top: -46px
    }

    .search-box::before {
        margin: -15px -15px 14px
    }
}


/* =========================================================
   DREAMSFARE — LIGHT BLUE PREMIUM THEME
   ========================================================= */

:root {
    --navy: #123B5D;
    --blue: #38A9E0;
    --cyan: #5DD6E8;
    --teal: #45C7BE;
    --light-blue: #EAF7FF;
    --sky-bg: #F5FBFF;
    --muted: #557084;
    --line: #D8EDF7;
    --white: #FFFFFF;
}

body {
    background:
        radial-gradient(circle at 8% 10%, rgba(93, 214, 232, .12), transparent 24%),
        radial-gradient(circle at 92% 35%, rgba(69, 199, 190, .09), transparent 22%),
        #F5FBFF;
    color: #123B5D;
}

.header {
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid rgba(56, 169, 224, .10);
    box-shadow: 0 10px 30px rgba(18, 59, 93, .07);
}

.header::after {
    background: linear-gradient(90deg, transparent, #5DD6E8, #45C7BE, transparent);
}

.main-nav>a {
    color: #244F6C;
}

.main-nav>a:hover {
    color: #38A9E0;
}

.nav-cta,
.primary-btn {
    background: linear-gradient(135deg, #38A9E0 0%, #45C7BE 100%) !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(56, 169, 224, .22);
}

.nav-cta:hover,
.primary-btn:hover {
    background: linear-gradient(135deg, #2D9DD5 0%, #36B7AE 100%) !important;
    box-shadow: 0 18px 34px rgba(56, 169, 224, .28);
}

.hero {
    background:
        radial-gradient(circle at 13% 20%, rgba(255, 255, 255, .98) 0, rgba(255, 255, 255, .55) 24%, transparent 45%),
        radial-gradient(circle at 88% 15%, rgba(93, 214, 232, .22) 0, transparent 30%),
        radial-gradient(circle at 68% 90%, rgba(69, 199, 190, .14) 0, transparent 28%),
        linear-gradient(135deg, #F9FDFF 0%, #EAF7FF 52%, #F1FCFA 100%);
}

.hero h1 {
    color: #123B5D;
}

.hero h1 em {
    background: linear-gradient(90deg, #38A9E0, #45C7BE);
    -webkit-background-clip: text;
    background-clip: text;
}

.hero p {
    color: #557084;
}

.trust-row span {
    background: rgba(255, 255, 255, .72);
    border-color: rgba(56, 169, 224, .14);
    color: #315D78;
}

.search-box {
    background: rgba(255, 255, 255, .96);
    border-color: #D8EDF7;
    box-shadow: 0 25px 65px rgba(56, 169, 224, .15), 0 5px 18px rgba(18, 59, 93, .05);
}

.search-box::before {
    background: linear-gradient(90deg, #5DD6E8, #38A9E0, #45C7BE);
}

.search-tabs .active {
    background: linear-gradient(135deg, #EAF7FF, #ECFCF8);
    color: #123B5D;
}

.search-fields label {
    border-color: #D8EDF7;
    background: #fff;
}

.search-fields label:focus-within {
    border-color: #5DD6E8;
    box-shadow: 0 0 0 4px rgba(93, 214, 232, .16);
}

.search-fields small {
    color: #38A9E0;
}

.search-fields input,
.search-fields select {
    color: #123B5D;
}

.search-btn {
    background: linear-gradient(135deg, #38A9E0, #45C7BE);
    box-shadow: 0 12px 26px rgba(56, 169, 224, .22);
}

.section-head h2,
.experience h2,
.guide-section h2,
.faq-intro h2,
.page-hero h1 {
    color: #123B5D;
}

.section-head p,
.feature-grid p,
.experience p,
.guide-section p,
.faq-intro p {
    color: #557084;
}

.eyebrow {
    color: #38A9E0;
}

.destination-card {
    box-shadow: 0 18px 45px rgba(56, 169, 224, .13);
}

.destination-card:hover {
    box-shadow: 0 28px 58px rgba(56, 169, 224, .20);
}

.destination-card .price,
.price {
    color: #38A9E0;
}

.why-section {
    background:
        radial-gradient(circle at 7% 18%, rgba(93, 214, 232, .13), transparent 23%),
        radial-gradient(circle at 96% 80%, rgba(69, 199, 190, .10), transparent 24%),
        #F5FBFF;
}

.feature-grid article {
    background: #fff;
    border-color: #D8EDF7;
}

.feature-grid article:hover {
    border-color: rgba(56, 169, 224, .38);
    box-shadow: 0 22px 42px rgba(56, 169, 224, .14);
}

.feature-grid article::after {
    background: linear-gradient(90deg, #38A9E0, #5DD6E8, #45C7BE);
}

.feature-icon {
    background: linear-gradient(135deg, #EAF7FF, #E8FBF7);
    color: #38A9E0;
}

.experience {
    background:
        radial-gradient(circle at 15% 20%, rgba(93, 214, 232, .10), transparent 30%),
        linear-gradient(135deg, #F4FBFF, #EAF7FF 60%, #F2FCF8);
}

.benefits>div {
    background: #fff;
    border-color: #D8EDF7;
}

.benefits>div b {
    color: #38A9E0;
}

.guide-image {
    background:
        radial-gradient(circle at 50% 42%, rgba(255, 255, 255, .98), rgba(234, 247, 255, .82) 45%, transparent 72%),
        linear-gradient(135deg, #EAF7FF, #ECFCF8);
}

.content-list li::marker,
.feature-grid li::marker {
    color: #38A9E0;
}

.dream-band {
    background: linear-gradient(120deg, #123B5D 0%, #217FAF 50%, #45C7BE 100%);
}

.dream-band::before {
    border-color: rgba(255, 255, 255, .20);
}

.faq-section {
    background:
        radial-gradient(circle at 10% 18%, rgba(93, 214, 232, .12), transparent 25%),
        #F5FBFF;
}

.faq-item {
    border-color: #D8EDF7;
}

.faq-item:hover,
.faq-item.active {
    border-color: rgba(56, 169, 224, .40);
    box-shadow: 0 15px 32px rgba(56, 169, 224, .10);
}

.faq-question {
    color: #123B5D;
}

.faq-item.active .faq-question {
    background: linear-gradient(90deg, #F8FDFF, #ECFCF8);
}

.faq-question .faq-icon {
    background: #EAF7FF;
    color: #38A9E0;
}

.faq-answer {
    color: #557084;
}

.page-hero {
    background:
        radial-gradient(circle at 82% 20%, rgba(93, 214, 232, .20), transparent 30%),
        radial-gradient(circle at 20% 85%, rgba(69, 199, 190, .10), transparent 25%),
        linear-gradient(135deg, #F7FDFF, #EAF7FF, #F2FCF8);
}

.contact-card,
.policy {
    background: #fff;
    border: 1px solid #D8EDF7;
    box-shadow: 0 16px 36px rgba(56, 169, 224, .08);
}

.policy h2,
.policy h3 {
    color: #123B5D;
}

.policy p {
    color: #557084;
}

footer {
    background: linear-gradient(135deg, #0E334F, #123B5D 55%, #176C82);
}

.footer a:hover {
    color: #5DD6E8;
}

@media (max-width:760px) {
    body {
        background: #F5FBFF;
    }

    .search-box {
        box-shadow: 0 18px 45px rgba(56, 169, 224, .13);
    }
}


/* =========================================================
   DREAMSFARE TYPOGRAPHY SCALE — H1 BASE 52PX
   ========================================================= */

:root {
    --h1-size: 52px;
    --h2-size: 40px;
    --h3-size: 28px;
    --h4-size: 22px;
    --h5-size: 18px;
    --h6-size: 16px;
}

/* Global heading hierarchy */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--navy);
    line-height: 1.18;
    letter-spacing: -0.02em;
}

h1 {
    font-size: var(--h1-size);
    line-height: 1.12;
    font-weight: 700;
    margin: 0 0 18px;
}

h2 {
    font-size: var(--h2-size);
    line-height: 1.18;
    font-weight: 700;
    margin: 0 0 14px;
}

h3 {
    font-size: var(--h3-size);
    line-height: 1.28;
    font-weight: 650;
    margin: 0 0 12px;
}

h4 {
    font-size: var(--h4-size);
    line-height: 1.35;
    font-weight: 650;
    margin: 0 0 10px;
}

h5 {
    font-size: var(--h5-size);
    line-height: 1.4;
    font-weight: 650;
    margin: 0 0 8px;
}

h6 {
    font-size: var(--h6-size);
    line-height: 1.45;
    font-weight: 650;
    margin: 0 0 8px;
}

/* Main website hero */
.hero h1 {
    font-size: 52px;
    line-height: 1.1;
    max-width: 720px;
}

/* Section headings */
.section-head h2,
.experience h2,
.guide-section h2,
.faq-intro h2 {
    font-size: 40px;
    line-height: 1.2;
}

/* Inner page hero headings */
.page-hero h1 {
    font-size: 52px;
    line-height: 1.12;
}

/* Contact / content / legal hierarchy */
.contact-card h2,
.policy h2 {
    font-size: 40px;
    line-height: 1.2;
}

.policy h3,
.contact-card h3 {
    font-size: 28px;
    line-height: 1.3;
}

/* Responsive typography */
@media (max-width: 1024px) {
    :root {
        --h1-size: 46px;
        --h2-size: 36px;
        --h3-size: 26px;
        --h4-size: 21px;
    }

    .hero h1,
    .page-hero h1 {
        font-size: 46px;
    }

    .section-head h2,
    .experience h2,
    .guide-section h2,
    .faq-intro h2,
    .contact-card h2,
    .policy h2 {
        font-size: 36px;
    }
}

@media (max-width: 760px) {
    :root {
        --h1-size: 38px;
        --h2-size: 30px;
        --h3-size: 24px;
        --h4-size: 20px;
        --h5-size: 17px;
        --h6-size: 15px;
    }

    h1 {
        line-height: 1.15;
    }

    .hero h1,
    .page-hero h1 {
        font-size: 38px;
    }

    .section-head h2,
    .experience h2,
    .guide-section h2,
    .faq-intro h2,
    .contact-card h2,
    .policy h2 {
        font-size: 30px;
    }

    .policy h3,
    .contact-card h3 {
        font-size: 24px;
    }
}


/* =========================================================
   ABOUT US + TERMS CONTENT UPDATE
   ========================================================= */
.terms-fee-table {
    width: 100%;
    margin: 20px 0 32px;
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 10px 26px rgba(56, 169, 224, .06);
}

.terms-fee-row {
    display: grid;
    grid-template-columns: minmax(170px, .8fr) 1.6fr;
    gap: 24px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--line);
    color: var(--muted);
}

.terms-fee-row:last-child {
    border-bottom: 0
}

.terms-fee-row span:first-child {
    font-weight: 700;
    color: var(--navy)
}

.terms-fee-head {
    background: linear-gradient(90deg, var(--light-blue), #f0fcfa);
    color: var(--navy);
}

@media(max-width:600px) {
    .terms-fee-row {
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 15px;
    }
}


/* =========================================================
   DREAMSFARE CONTENT + SEO PAGE UPDATE
   ========================================================= */
.content-page {
    max-width: 980px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #D8EDF7;
    border-radius: 22px;
    padding: 42px;
    box-shadow: 0 18px 46px rgba(56, 169, 224, .08);
}

.content-page p,
.policy p {
    margin-bottom: 16px;
    color: #557084
}

.content-page h2,
.policy h2 {
    margin-top: 34px
}

.content-page h3,
.policy h3 {
    margin-top: 24px
}

.content-list {
    padding-left: 22px;
    margin: 16px 0 22px
}

.content-list li {
    margin: 9px 0;
    color: #557084
}

.number-list {
    padding-left: 24px;
    margin: 16px 0 22px
}

.number-list li {
    margin: 10px 0;
    color: #557084
}

.info-table {
    width: 100%;
    overflow: hidden;
    border: 1px solid #D8EDF7;
    border-radius: 16px;
    margin: 20px 0 30px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(56, 169, 224, .05);
}

.info-row {
    display: grid;
    grid-template-columns: minmax(180px, .8fr) 1.6fr;
    gap: 24px;
    padding: 16px 20px;
    border-bottom: 1px solid #E5F2F8;
    color: #557084;
}

.info-row:last-child {
    border-bottom: 0
}

.info-row>span:first-child {
    font-weight: 700;
    color: #123B5D
}

.info-head {
    background: linear-gradient(90deg, #EAF7FF, #ECFCF8);
    color: #123B5D;
}

.home-guide-content {
    background: linear-gradient(180deg, #fff, #F5FBFF)
}

@media(max-width:760px) {
    .content-page {
        padding: 24px 18px;
        border-radius: 16px
    }

    .info-row {
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 14px 16px
    }
}


/* =========================================================
   DREAMSFARE TYPOGRAPHY HIERARCHY — GLOBAL
   ========================================================= */
:root {
    --h1-size: 42px;
    --h2-size: 34px;
    --h3-size: 26px;
    --h4-size: 21px;
    --h5-size: 18px;
    --h6-size: 16px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.22;
    letter-spacing: -.018em
}

h1,
.hero h1,
.page-hero h1 {
    font-size: 42px !important;
    line-height: 1.14
}

h2,
.section-head h2,
.experience h2,
.guide-section h2,
.faq-intro h2,
.contact-card h2,
.policy h2 {
    font-size: 34px !important
}

h3,
.policy h3,
.contact-card h3 {
    font-size: 26px !important
}

h4 {
    font-size: 21px !important
}

h5 {
    font-size: 18px !important
}

h6 {
    font-size: 16px !important
}

.airlines-section {
    padding: 84px 0;
    background: linear-gradient(180deg, #F5FBFF, #FFFFFF);
}

.airline-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    margin-top: 30px;
}

.airline-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 26px;
    border: 1px solid #D8EDF7;
    border-radius: 22px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(56, 169, 224, .10);
    transition: .3s ease;
    text-decoration: none;
}

.airline-card:hover {
    transform: translateY(-8px);
    border-color: #5DD6E8;
    box-shadow: 0 24px 50px rgba(56, 169, 224, .18);
}

.airline-card img {
    width: 100%;
    height: 145px;
    object-fit: contain;
    border-radius: 14px;
    background: #F5FBFF;
    margin-bottom: 20px;
}

.airline-card h3 {
    margin: 0 0 10px;
    color: #123B5D
}

.airline-card p {
    margin: 0;
    color: #557084;
    line-height: 1.65
}

.airline-link {
    margin-top: auto;
    padding-top: 18px;
    color: #38A9E0;
    font-weight: 700;
}

.airline-hero-logo {
    width: min(320px, 80%);
    max-height: 180px;
    object-fit: contain;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #D8EDF7;
    box-shadow: 0 18px 45px rgba(56, 169, 224, .12);
}

.airline-page-intro {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 48px;
    align-items: center;
}

.airline-details {
    padding: 84px 0;
    background: #F5FBFF;
}

.airline-details .content-page {
    max-width: none
}

.airline-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin: 28px 0;
}

.airline-info-box {
    background: #fff;
    border: 1px solid #D8EDF7;
    border-radius: 16px;
    padding: 20px;
}

.airline-info-box strong {
    display: block;
    color: #38A9E0;
    margin-bottom: 7px
}

.airline-info-box span {
    color: #123B5D
}

@media(max-width:900px) {
    .airline-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .airline-page-intro {
        grid-template-columns: 1fr
    }

    .airline-info-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:760px) {
    :root {
        --h1-size: 36px;
        --h2-size: 30px;
        --h3-size: 24px;
        --h4-size: 20px;
        --h5-size: 17px;
        --h6-size: 15px
    }

    h1,
    .hero h1,
    .page-hero h1 {
        font-size: 36px !important
    }

    h2,
    .section-head h2,
    .experience h2,
    .guide-section h2,
    .faq-intro h2,
    .contact-card h2,
    .policy h2 {
        font-size: 30px !important
    }

    h3,
    .policy h3,
    .contact-card h3 {
        font-size: 24px !important
    }

    h4 {
        font-size: 20px !important
    }

    h5 {
        font-size: 17px !important
    }

    h6 {
        font-size: 15px !important
    }

    .airlines-section {
        padding: 58px 0
    }

    .airline-grid,
    .airline-info-grid {
        grid-template-columns: 1fr
    }
}


/* =========================================================
   DREAMSFARE FLIGHT-BOOKING VISUAL REFINEMENT
   ========================================================= */
:root {
    --navy: #0B3558;
    --navy2: #124C76;
    --blue: #1594D3;
    --sky: #EEF8FE;
    --mint: #F2FBFF;
    --text: #183B56;
    --muted: #667D8F;
    --line: #D9E8F1;
    --white: #FFFFFF;
}

body {
    background: #F7FBFE;
    color: var(--text);
}

.header {
    height: 80px;
    box-shadow: 0 5px 24px rgba(10, 53, 88, .06);
}

.main-nav>a {
    font-weight: 600;
}

.hero {
    min-height: 590px;
    background:
        radial-gradient(circle at 78% 24%, rgba(21, 148, 211, .16), transparent 25%),
        linear-gradient(120deg, #F7FCFF 0%, #EAF7FF 48%, #F6FCFF 100%);
}

.hero:after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -130px;
    bottom: -210px;
    border-radius: 50%;
    border: 1px solid rgba(21, 148, 211, .14);
}

.hero h1 {
    max-width: 720px;
    font-size: 42px !important;
    line-height: 1.13 !important;
}

.hero h1 em {
    font-style: normal;
    color: #1594D3
}

.hero p {
    max-width: 620px
}

.primary-btn {
    background: linear-gradient(135deg, #0B3558, #135B87);
    border-radius: 9px;
}

.search-wrap {
    margin-top: -42px
}

.search-box {
    border-radius: 16px;
    padding: 22px;
    box-shadow: 0 20px 50px rgba(11, 53, 88, .14);
}

.search-tabs span {
    color: #0B6B82;
    background: #EAFBFA;
}

.search-btn {
    background: linear-gradient(135deg, #1594D3, #0D7FBC);
    min-height: 52px;
    font-size: .82rem;
}

.destination-card {
    border-radius: 16px;
    min-height: 345px;
}

.destination-card strong {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
}

.why-section {
    background: #F1F8FC
}

.feature-grid article {
    border-radius: 14px;
    box-shadow: 0 8px 25px rgba(11, 53, 88, .04);
}

.feature-grid h3 {
    font-size: 22px !important;
    font-family: 'DM Sans', Arial, sans-serif;
}

.experience {
    background: #fff
}

.experience h2,
.guide-section h2,
.dream-band h2 {
    font-size: 34px !important;
}

.dream-band {
    background: linear-gradient(135deg, #0B3558, #0E5E8B);
}

.footer {
    background: #082B48;
}

.logo img {
    display: block;
    max-height: 50px;
    width: auto;
}

/* Legal pages: compact professional layout */
.legal-hero {
    padding: 72px 0 58px;
    text-align: center;
    background:
        radial-gradient(circle at 10% 0, rgba(21, 148, 211, .12), transparent 26%),
        linear-gradient(135deg, #F7FCFF, #EAF8FF);
    border-bottom: 1px solid #DCECF5;
}

.legal-hero-inner {
    max-width: 920px
}

.legal-hero h1 {
    font-family: 'Playfair Display', Georgia, serif;
    color: #0B3558;
    font-size: 42px !important;
    line-height: 1.14;
    margin: 10px 0 10px;
}

.legal-hero p {
    max-width: 720px;
    margin: 0 auto;
    color: #60798C;
}

.legal-meta {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.legal-meta span {
    background: #fff;
    border: 1px solid #D9E8F1;
    border-radius: 999px;
    padding: 7px 14px;
    font-size: .76rem;
    color: #5C7385;
}

.legal-layout {
    padding: 52px 0 86px;
    background: #F7FBFE;
}

.legal-grid {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.legal-sidebar {
    position: sticky;
    top: 105px;
}

.legal-nav-card {
    background: #fff;
    border: 1px solid #D9E8F1;
    border-radius: 14px;
    padding: 18px;
    box-shadow: 0 10px 30px rgba(11, 53, 88, .05);
}

.legal-nav-card strong {
    display: block;
    color: #0B3558;
    margin: 2px 0 12px;
}

.legal-nav-card a {
    display: block;
    padding: 8px 7px;
    color: #668092;
    font-size: .78rem;
    border-radius: 7px;
}

.legal-nav-card a:hover {
    color: #0B3558;
    background: #EEF8FE;
}

.legal-content {
    background: #fff;
    border: 1px solid #D9E8F1;
    border-radius: 18px;
    padding: 42px 46px;
    box-shadow: 0 16px 42px rgba(11, 53, 88, .07);
}

.legal-intro {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 22px;
    background: linear-gradient(135deg, #F2FAFF, #F8FDFF);
    border: 1px solid #D9EDF8;
    border-radius: 14px;
    margin-bottom: 26px;
}

.legal-icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    background: #E5F5FE;
    border-radius: 12px;
    font-size: 20px;
}

.legal-intro h2,
.legal-block h2 {
    font-family: 'DM Sans', Arial, sans-serif !important;
    font-size: 27px !important;
    line-height: 1.25;
    color: #0B3558;
    margin: 0 0 10px;
}

.legal-intro p,
.legal-block p {
    color: #60798C;
    margin: 0;
}

.legal-block {
    position: relative;
    padding: 30px 0 30px 0;
    border-bottom: 1px solid #E5EEF4;
}

.legal-block:last-of-type {
    border-bottom: 0
}

.section-number {
    display: inline-flex;
    margin-bottom: 10px;
    color: #1594D3;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.legal-block h3 {
    font-size: 21px !important;
    font-family: 'DM Sans', Arial, sans-serif !important;
    color: #0B3558;
    margin: 24px 0 8px;
}

.legal-note {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 18px 0;
    padding: 16px 18px;
    border-left: 4px solid #1594D3;
    background: #F2FAFF;
    color: #60798C;
}

.legal-note strong {
    color: #0B3558
}

.legal-contact {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    margin-top: 38px;
    padding: 28px;
    border-radius: 16px;
    background: linear-gradient(135deg, #0B3558, #0F5D88);
    color: #fff;
}

.legal-contact h3 {
    margin: 6px 0 4px;
    font-size: 25px !important;
    font-family: 'DM Sans', Arial, sans-serif !important;
}

.legal-contact p {
    margin: 0;
    color: #D8EBF6;
    max-width: 620px
}

.legal-contact .eyebrow {
    color: #7DD8FF
}

.legal-contact .primary-btn {
    flex: 0 0 auto;
    background: #fff;
    color: #0B3558;
    box-shadow: none;
}

.policy.container {
    max-width: 1040px;
    margin: 52px auto 82px;
    background: #fff;
    border: 1px solid #D9E8F1;
    border-radius: 18px;
    padding: 42px 46px;
    box-shadow: 0 16px 42px rgba(11, 53, 88, .07);
}

.policy h2 {
    font-family: 'DM Sans', Arial, sans-serif !important;
    font-size: 28px !important;
    color: #0B3558;
    border-top: 1px solid #E5EEF4;
    padding-top: 28px;
}

.policy h2:first-of-type {
    border-top: 0;
    padding-top: 0
}

.policy h3 {
    font-family: 'DM Sans', Arial, sans-serif !important;
    font-size: 22px !important;
    color: #0B3558;
    margin-top: 28px;
}

.policy p {
    color: #60798C
}

.info-table {
    border-radius: 14px;
    margin: 20px 0;
}

.info-row {
    font-size: .9rem
}

@media(max-width:900px) {
    .legal-grid {
        grid-template-columns: 1fr
    }

    .legal-sidebar {
        position: static
    }

    .legal-nav-card {
        display: none
    }

    .legal-content {
        padding: 30px 24px
    }
}

@media(max-width:760px) {
    .hero {
        min-height: auto;
        padding: 68px 0 90px
    }

    .hero h1,
    .legal-hero h1 {
        font-size: 36px !important
    }

    .legal-hero {
        padding: 58px 0 46px
    }

    .legal-layout {
        padding: 32px 0 60px
    }

    .legal-content,
    .policy.container {
        padding: 24px 18px;
        border-radius: 14px
    }

    .legal-intro {
        padding: 18px
    }

    .legal-contact {
        padding: 22px;
        align-items: flex-start;
        flex-direction: column
    }

    .section-head {
        align-items: flex-start
    }
}


/* FAQ — consistent homepage reference design */
.faq-section {
    padding: 78px 0;
    background: #F5FBFF !important;
}

.faq-wrap {
    max-width: 850px !important;
    margin: 0 auto !important;
}

.faq-intro {
    text-align: center !important;
    margin: 0 auto 32px !important;
    max-width: 760px !important;
}

.faq-intro .eyebrow {
    display: inline-block;
    margin-bottom: 12px !important;
}

.faq-intro h2 {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 34px !important;
    line-height: 1.2 !important;
    color: #0B3558 !important;
    margin: 0 0 12px !important;
}

.faq-intro p {
    color: #60798C !important;
    margin: 0 auto !important;
    max-width: 650px !important;
}

.faq-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.faq-item {
    background: #fff !important;
    border: 1px solid #D8EDF7 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

.faq-item:hover {
    transform: none !important;
    box-shadow: 0 8px 22px rgba(56, 169, 224, .07) !important;
}

.faq-question {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    padding: 20px 22px !important;
    background: #fff !important;
    border: 0 !important;
    color: #0B3558 !important;
    text-align: left !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
}

.faq-item.active .faq-question {
    background: linear-gradient(90deg, #F7FDFF, #EAFBFA) !important;
}

.faq-question .faq-icon {
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: #EAF7FF !important;
    color: #1594D3 !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    transition: transform .2s ease !important;
}

.faq-answer {
    display: none !important;
    padding: 0 22px 22px !important;
    background: #fff !important;
    color: #60798C !important;
    line-height: 1.7 !important;
    font-size: 15px !important;
}

.faq-item.active .faq-answer {
    display: block !important;
}

.faq-item.active .faq-icon {
    transform: rotate(45deg) !important;
}

@media(max-width:760px) {
    .faq-section {
        padding: 58px 0 !important
    }

    .faq-intro h2 {
        font-size: 30px !important
    }

    .faq-question {
        padding: 18px !important;
        font-size: 15px !important
    }

    .faq-answer {
        padding: 0 18px 18px !important
    }

    .faq-question .faq-icon {
        width: 28px !important;
        height: 28px !important;
        flex-basis: 28px !important
    }
}


/* =========================================================
   TERMS & CONDITIONS — HOMEPAGE FAQ STYLE PRESENTATION
   Content preserved; presentation updated only
   ========================================================= */
.terms-hero {
    text-align: center;
    padding: 74px 0 66px;
    background:
        radial-gradient(circle at 12% 8%, rgba(21, 148, 211, .13), transparent 25%),
        radial-gradient(circle at 88% 20%, rgba(93, 214, 232, .12), transparent 24%),
        linear-gradient(135deg, #F7FCFF 0%, #EAF8FF 58%, #F4FCFC 100%);
}

.terms-hero .container {
    max-width: 900px
}

.terms-hero h1 {
    margin: 12px auto 12px;
    font-size: 42px !important;
}

.terms-hero p {
    max-width: 720px;
    margin: 0 auto;
}

.terms-policy {
    max-width: 920px;
    margin: 0 auto 80px;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.terms-policy>p:first-child {
    margin: 34px 0 18px;
    padding: 24px 26px;
    background: #fff;
    border: 1px solid #B9E2F8;
    border-radius: 14px;
    color: #60798C;
    line-height: 1.8;
    box-shadow: 0 10px 28px rgba(11, 53, 88, .04);
}

.terms-section-card {
    position: relative;
    margin: 12px 0;
    padding: 26px 28px;
    background: #fff;
    border: 1px solid #D5EAF6;
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(11, 53, 88, .035);
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.terms-section-card:hover {
    border-color: #8ED5F4;
    box-shadow: 0 14px 32px rgba(11, 53, 88, .08);
    transform: translateY(-1px);
}

.terms-section-card h2 {
    position: relative;
    margin: 0 0 16px !important;
    padding-left: 14px;
    border-top: 0 !important;
    padding-top: 0 !important;
    font-size: 26px !important;
    font-family: 'DM Sans', Arial, sans-serif !important;
    color: #0B3558;
}

.terms-section-card h2:before {
    content: "";
    position: absolute;
    left: 0;
    top: 5px;
    width: 4px;
    height: 24px;
    border-radius: 999px;
    background: #5DD6E8;
}

.terms-section-card h3 {
    font-size: 21px !important;
    color: #0B3558;
}

.terms-section-card p {
    color: #60798C;
    line-height: 1.8;
}

.terms-section-card .content-list {
    margin: 16px 0;
}

.terms-section-card .info-table {
    margin: 18px 0 4px;
    border: 1px solid #D9EAF3;
    border-radius: 12px;
    overflow: hidden;
}

.terms-section-card .info-row {
    background: #fff;
}

.terms-section-card .info-head {
    background: linear-gradient(90deg, #EAF8FF, #EAFBF8);
    color: #0B3558;
}

@media(max-width:760px) {
    .terms-hero {
        padding: 58px 0 48px
    }

    .terms-hero h1 {
        font-size: 36px !important
    }

    .terms-policy {
        margin-bottom: 56px
    }

    .terms-policy>p:first-child,
    .terms-section-card {
        padding: 20px 18px;
        border-radius: 12px
    }

    .terms-section-card h2 {
        font-size: 23px !important
    }
}


/* =========================================================
   TERMS & CONDITIONS FAQ
   Same design + functionality as homepage FAQ
   Existing FAQ content remains unchanged
   ========================================================= */
.terms-faq,
.terms-policy .faq-section {
    padding: 0;
    margin: 34px 0 0;
    background: transparent;
}

.terms-faq .faq-list,
.terms-policy .faq-section .faq-list {
    max-width: 850px;
    margin: 0 auto;
}

.terms-faq .faq-item,
.terms-policy .faq-section .faq-item {
    margin: 12px 0;
    border: 1px solid #D2E8F5;
    border-radius: 13px;
    overflow: hidden;
    background: #fff;
    box-shadow: none;
}

.terms-faq .faq-item.active,
.terms-policy .faq-section .faq-item.active {
    border-color: #9EDAF6;
}

.terms-faq .faq-question,
.terms-policy .faq-section .faq-question {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    background: #fff;
    border: 0;
    color: #063B66;
    font-family: 'DM Sans', Arial, sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.terms-faq .faq-item.active .faq-question,
.terms-policy .faq-section .faq-item.active .faq-question {
    background: linear-gradient(90deg, #F2FCFF, #EAFBF8);
}

.terms-faq .faq-question .faq-icon,
.terms-policy .faq-section .faq-question .faq-icon,
.terms-faq .faq-question i,
.terms-policy .faq-section .faq-question i {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #EAF7FF;
    color: #1594D3;
    font-style: normal;
    font-size: 20px;
    font-weight: 700;
}

.terms-faq .faq-answer,
.terms-policy .faq-section .faq-answer {
    display: none;
    padding: 0 22px 20px;
    background: #fff;
    color: #60798C;
    line-height: 1.7;
}

.terms-faq .faq-item.active .faq-answer,
.terms-policy .faq-section .faq-item.active .faq-answer {
    display: block;
}

.terms-faq .faq-answer p,
.terms-policy .faq-section .faq-answer p {
    margin: 0;
    color: #60798C;
}

@media(max-width:760px) {

    .terms-faq .faq-question,
    .terms-policy .faq-section .faq-question {
        padding: 18px 16px;
        font-size: 15px
    }

    .terms-faq .faq-answer,
    .terms-policy .faq-section .faq-answer {
        padding: 0 16px 18px
    }
}


/* FAQ functionality fix: one icon only, controlled by JavaScript */
.terms-faq .faq-question .faq-icon {
    display: grid !important;
    place-items: center !important;
    line-height: 1 !important;
    transform: none !important;
}

.terms-faq .faq-item.active .faq-icon {
    transform: none !important;
}

.terms-faq .faq-item.active .faq-icon::before {
    content: none !important;
}

.terms-faq .faq-answer[hidden] {
    display: none !important;
}


/* =========================================================
   FINAL LEGAL PAGE LAYOUT UPDATE
   ========================================================= */

/* Privacy sidebar stays visible while reading */
.legal-layout .legal-grid {
    align-items: start !important;
}

.legal-layout .legal-sidebar {
    position: sticky !important;
    top: 100px !important;
    align-self: start !important;
    height: fit-content !important;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
    z-index: 5;
}

.legal-layout .legal-sidebar::-webkit-scrollbar {
    width: 4px
}

.legal-layout .legal-sidebar::-webkit-scrollbar-thumb {
    background: #C7E8F7;
    border-radius: 999px;
}

/* Terms & Conditions now uses the same professional legal-page layout as Privacy */
.terms-legal-layout {
    padding: 52px 0 82px;
    background: #F7FBFE;
}

.terms-legal-grid {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.terms-legal-sidebar {
    position: sticky;
    top: 100px;
    align-self: start;
    height: fit-content;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
    z-index: 5;
}

.terms-legal-sidebar .legal-nav-card {
    margin: 0;
}

.terms-legal-content {
    min-width: 0;
}

.terms-legal-content .terms-policy {
    max-width: none;
    margin: 0;
}

/* Terms content uses the same white content-panel language as Privacy */
.terms-legal-content .terms-policy>p:first-child {
    margin-top: 0;
}

.terms-legal-content .terms-section-card {
    border-radius: 14px;
}

.terms-legal-content .terms-faq-card {
    margin-bottom: 0;
}

/* FAQ before footer */
.terms-before-footer-faq {
    margin-top: 34px;
    padding: 36px 0 0;
}

.terms-before-footer-faq .terms-section-card {
    margin-bottom: 0;
}

/* Mobile */
@media(max-width:900px) {

    .legal-layout .legal-sidebar,
    .terms-legal-sidebar {
        position: static !important;
        max-height: none;
        overflow: visible;
    }

    .terms-legal-grid {
        grid-template-columns: 1fr
    }
}


/* =========================================================
   STICKY LEGAL SIDE NAVIGATION — PRIVACY + TERMS
   Sidebar stays aligned with the right-side content while scrolling
   ========================================================= */
.legal-layout .legal-grid,
.terms-legal-layout .terms-legal-grid {
    align-items: stretch !important;
}

/* The sidebar occupies the full left column so its card can track
   naturally with the content and then remain pinned while scrolling. */
.legal-layout .legal-sidebar,
.terms-legal-layout .terms-legal-sidebar {
    position: relative !important;
    top: auto !important;
    align-self: stretch !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Actual navigation card: sticky next to the scrolling content */
.legal-layout .legal-sidebar .legal-nav-card,
.terms-legal-layout .terms-legal-sidebar .legal-nav-card {
    position: sticky !important;
    top: 96px !important;
    align-self: start !important;
    height: fit-content !important;
    max-height: calc(100vh - 118px);
    overflow-y: auto !important;
    margin: 0 !important;
}

/* Smooth scrollbar when the menu is taller than the viewport */
.legal-layout .legal-sidebar .legal-nav-card::-webkit-scrollbar,
.terms-legal-layout .terms-legal-sidebar .legal-nav-card::-webkit-scrollbar {
    width: 4px;
}

.legal-layout .legal-sidebar .legal-nav-card::-webkit-scrollbar-thumb,
.terms-legal-layout .terms-legal-sidebar .legal-nav-card::-webkit-scrollbar-thumb {
    background: #C7E8F7;
    border-radius: 999px;
}

/* Keep Terms and Privacy side navigation visually identical */
.legal-layout .legal-nav-card,
.terms-legal-layout .legal-nav-card {
    width: 100%;
}

/* Mobile: normal flow */
@media(max-width:900px) {

    .legal-layout .legal-sidebar,
    .terms-legal-layout .terms-legal-sidebar {
        position: static !important;
        align-self: auto !important;
    }

    .legal-layout .legal-sidebar .legal-nav-card,
    .terms-legal-layout .terms-legal-sidebar .legal-nav-card {
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

.holiday-section {
    padding: 90px 20px;
    background: #f7fbfe;
    font-family: 'DM Sans', sans-serif;
}

.holiday-container {
    max-width: 1200px;
    margin: auto;
}

.section-heading {
    text-align: center;
    margin-bottom: 45px;
}

.subtitle {
    color: #42bfc6;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
}

.section-heading h2 {
    font-family: 'Playfair Display', serif;
    font-size: 44px;
    color: #173b35;
    margin: 14px 0;
}

.section-heading h2 span {
    color: #42bfc6;
}

.section-heading p {
    color: #777;
    font-size: 15px;
    line-height: 1.7;
}

.holiday-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.holiday-card {
    height: 340px;
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    display: flex;
    align-items: flex-end;
    text-decoration: none;
    background-size: cover;
    background-position: center;
    transition: transform .4s ease;
}

.holiday-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
            rgba(0, 0, 0, .85) 0%,
            rgba(0, 0, 0, .25) 55%,
            rgba(0, 0, 0, .05) 100%);
    transition: background .4s ease;
}

.holiday-card:hover {
    transform: translateY(-7px);
}

.holiday-card:hover::before {
    background: linear-gradient(to top,
            rgba(13, 49, 43, .95),
            rgba(0, 0, 0, .15));
}

.card-content {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 25px;
    color: #fff;
}

.card-number {
    position: absolute;
    top: -260px;
    right: 25px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .6);
    border-radius: 50%;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
}

.card-content h3 {
    font-family: 'Playfair Display', serif;
    font-size: 25px;
    margin-bottom: 9px;
    color: white;
}

.card-content p {
    font-size: 13px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .85);
    max-width: 260px;
}

.explore {
    display: inline-block;
    margin-top: 17px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    color: #38A9E0;
    transition: .3s;
}

.holiday-card:hover .explore {
    color: #fff;
    transform: translateX(5px);
}

/* Background images */

.family {
    background-image: url('https://images.unsplash.com/photo-1478131143081-80f7f84ca84d?w=800');
}

.romantic {
    background-image: url('https://images.unsplash.com/photo-1533105079780-92b9be482077?w=800');
}

.beach {
    background-image: url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=800');
}

.adventure {
    background-image: url('https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?w=800');
}

.city {
    background-image: url('https://images.unsplash.com/photo-1519608487953-e999c86e7455?w=800');
}

.weekend {
    background-image: url('https://images.unsplash.com/photo-1449158743715-0a90ebb6d2d8?w=800');
}

/* Tablet */

@media (max-width: 900px) {
    .holiday-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .holiday-card {
        height: 320px;
    }
}

/* Mobile */

@media (max-width: 550px) {
    .holiday-section {
        padding: 60px 16px;
    }

    .section-heading h2 {
        font-size: 32px;
    }

    .holiday-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .holiday-card {
        height: 300px;
    }
}

.travel-info {
    padding: 90px 20px;
    font-family: 'DM Sans', sans-serif;
    overflow: hidden;
}

.info-container {
    max-width: 1200px;
    margin: auto;
}

.section-tag {
    color: #38A9E0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    display: inline-block;
    margin-bottom: 16px;
}

.travel-info h2,
.dreamsfare-cta h2 {
    font-family: 'Playfair Display', serif;
    font-size: 42px;
    line-height: 1.25;
    color: var(--green);
    margin: 0 0 20px;
}

.travel-info h2 span {
    color: #38A9E0;
}

.section-description,
.destination-content p {
    color: var(--text);
    font-size: 14px;
    line-height: 1.9;
}


/* ACCOMMODATION */

.accommodation-section {
    background: var(--cream);
}

.accommodation-layout {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    align-items: center;
    gap: 65px;
}

.info-image {
    position: relative;
    height: 570px;
    border-radius: 12px;
    overflow: hidden;
}

.info-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

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

.image-label {
    position: absolute;
    bottom: 25px;
    left: 25px;
    padding: 12px 20px;
    background: white;
    color: var(--green);
    font-size: 11px;
    letter-spacing: 2px;
    font-weight: 700;
}

.tips-list {
    margin-top: 30px;
}

.tip-item {
    display: flex;
    gap: 20px;
    padding: 15px 0;
    border-bottom: 1px solid #e6e5df;
    align-items: flex-start;
    transition: .3s;
}

.tip-item:hover {
    padding-left: 8px;
}

.tip-number {
    min-width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #eee9df;
    color: #38A9E0;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 700;
}

.tip-item h4 {
    color: var(--green);
    font-size: 15px;
    margin: 2px 0 6px;
}

.tip-item p {
    color: #777;
    font-size: 13px;
    line-height: 1.6;
    margin: 0;
}


/* JOURNEY PLANNING */

.journey-section {
    background: #fff;
}

.center-heading {
    text-align: center;
    max-width: 680px;
    margin: 0 auto 45px;
}

.center-heading p {
    color: var(--text);
    font-size: 14px;
    line-height: 1.8;
}

.journey-wrapper {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 35px;
    align-items: stretch;
}

.journey-image {
    height: 440px;
    position: relative;
    overflow: hidden;
    border-radius: 12px;
}

.journey-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.journey-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent,
            rgba(0, 0, 0, .75));
}

.journey-image-text {
    position: absolute;
    z-index: 1;
    bottom: 35px;
    left: 30px;
    color: white;
}

.journey-image-text h3 {
    font: 600 28px/1.35 'Playfair Display', serif;
    color: white;
}

.journey-image-text p {
    font-size: 13px;
    margin-top: 12px;
}

.journey-table-wrapper {
    background: var(--cream);
    border-radius: 12px;
    padding: 15px;
    display: flex;
    align-items: center;
}

.journey-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
}

.journey-table th {
    padding: 18px 15px;
    background: var(--green);
    color: white;
    font-size: 13px;
    font-weight: 600;
}

.journey-table th:first-child {
    border-radius: 7px 0 0 7px;
}

.journey-table th:last-child {
    border-radius: 0 7px 7px 0;
}

.journey-table td {
    padding: 18px 15px;
    color: #626762;
    font-size: 13px;
    line-height: 1.6;
    border-bottom: 1px solid #e7e5dd;
}

.journey-table td:first-child {
    color: var(--green);
    font-weight: 700;
    white-space: nowrap;
}

.journey-table td span {
    color: #38A9E0;
    margin-right: 8px;
    font-size: 11px;
}


/* DESTINATION */

.destination-section {
    background: var(--cream);
}

.destination-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 65px;
}

.destination-content p {
    margin-bottom: 15px;
}

.destination-points {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    margin-top: 28px;
}

.destination-points div {
    font-size: 12px;
    color: var(--green);
    font-weight: 600;
    background: white;
    padding: 15px 12px;
    border-radius: 6px;
}

.destination-gallery {
    display: grid;
    grid-template-columns: 1.3fr .7fr;
    gap: 12px;
    height: 430px;
}

.destination-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    transition: .4s;
}

.destination-gallery img:hover {
    filter: brightness(.85);
}

.destination-small {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.destination-small img {
    height: calc(50% - 6px);
}


/* DREAMSFARE CTA */

.dreamsfare-cta {
    position: relative;
    padding: 100px 20px;
    text-align: center;
    background:
        linear-gradient(rgb(0 196 253 / 88%), rgba(15, 48, 41, .90)), url(https://images.unsplash.com/photo-1473116763249-2faaef81ccda?w=1600) center / cover no-repeat
}

.cta-content {
    max-width: 750px;
    margin: auto;
    position: relative;
    z-index: 1;
}

.dreamsfare-cta h2 {
    color: white;
    font-size: 46px;
    margin-bottom: 22px;
}

.dreamsfare-cta h2 span {
    color: #d5ad7c;
}

.dreamsfare-cta p {
    color: rgba(255, 255, 255, .85);
    font-size: 14px;
    line-height: 1.9;
    margin-bottom: 32px;
}

.dreamsfare-cta .section-tag {
    color: #d5ad7c;
}

.cta-button {
    display: inline-flex;
    gap: 25px;
    align-items: center;
    padding: 15px 27px;
    color: var(--green);
    background: #d5ad7c;
    text-decoration: none;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 700;
    transition: .3s;
}

.cta-button:hover {
    background: white;
    transform: translateY(-4px);
}

.cta-button span {
    font-size: 19px;
}


/* RESPONSIVE */

@media (max-width: 900px) {

    .accommodation-layout,
    .destination-layout {
        gap: 35px;
    }

    .journey-wrapper {
        grid-template-columns: 1fr;
    }

    .journey-image {
        height: 350px;
    }

    .travel-info h2 {
        font-size: 34px;
    }
}

@media (max-width: 600px) {
    .travel-info {
        padding: 60px 18px;
    }

    .accommodation-layout,
    .destination-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .info-image {
        height: 350px;
    }

    .travel-info h2 {
        font-size: 32px;
    }

    .center-heading {
        margin-bottom: 30px;
    }

    .journey-image {
        height: 300px;
    }

    .journey-table-wrapper {
        padding: 5px;
        overflow-x: auto;
    }

    .journey-table {
        min-width: 440px;
    }

    .journey-table td,
    .journey-table th {
        padding: 14px 10px;
    }

    .destination-gallery {
        height: 320px;
    }

    .destination-points {
        gap: 10px;
    }

    .destination-points div {
        font-size: 11px;
        padding: 12px 9px;
    }

    .dreamsfare-cta {
        padding: 75px 20px;
    }

    .dreamsfare-cta h2 {
        font-size: 34px;
    }
}



/* FLIGHT OPTIONS SECTION */

.flight-section {
    padding: 90px 20px;
    background: white;
    font-family: 'DM Sans', sans-serif;
}

.flight-container {
    max-width: 1200px;
    margin: auto;
}

.flight-layout {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    align-items: center;
    gap: 65px;
}

/* IMAGE */

.flight-image {
    height: 610px;
    position: relative;
    border-radius: 14px;
    overflow: hidden;
}

.flight-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

.flight-image:hover img {
    transform: scale(1.05);
}

.flight-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
            rgba(13, 45, 39, .85),
            rgba(13, 45, 39, .05) 75%);
}

.flight-image-overlay {
    position: absolute;
    bottom: 65px;
    left: 30px;
    right: 25px;
    z-index: 1;
    color: #fff;
}

.flight-image-overlay span {
    font-size: 10px;
    letter-spacing: 3px;
    color: #38A9E0;
    font-weight: 700;
}

.flight-image-overlay h3 {
    font-family: 'Playfair Display', serif;
    font-size: 34px;
    line-height: 1.3;
    margin: 15px 0;
    color: white;
}

.flight-image-overlay p {
    font-size: 13px;
    color: rgba(255, 255, 255, .85);
}

/* FLOATING BADGE */

.flight-badge {
    position: absolute;
    z-index: 2;
    bottom: 3px;
    left: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 15px 18px;
    background: rgba(255, 255, 255, .95);
    border-radius: 8px;
}

.flight-badge>span {
    width: 42px;
    height: 42px;
    background: #eee8dc;
    color: #38A9E0;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 20px;
}

.flight-badge strong {
    display: block;
    font-size: 13px;
    color: #173b35;
}

.flight-badge small {
    display: block;
    color: #888;
    font-size: 11px;
    margin-top: 4px;
}

/* CONTENT */

.flight-tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    color: #38A9E0;
    margin-bottom: 15px;
}

.flight-content h2 {
    font-family: 'Playfair Display', serif;
    color: #173b35;
    font-size: 42px;
    line-height: 1.25;
    margin: 0 0 20px;
}

.flight-content h2 span {
    display: block;
    color: #38A9E0;
}

.flight-intro {
    color: #666;
    font-size: 14px;
    line-height: 1.9;
    margin-bottom: 25px;
}

.flight-subheading {
    font-size: 15px;
    color: #173b35;
    margin-bottom: 12px;
}

/* FLIGHT TIPS */

.flight-tips {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 25px;
}

.flight-tip {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 17px 0;
    border-bottom: 1px solid #e5e2da;
    transition: .3s ease;
}

.flight-tip:hover {
    transform: translateX(5px);
}

.flight-icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    background: #eee8dc;
    border-radius: 50%;
    color: #bd8952;
    font-size: 11px;
    font-weight: 700;
}

.flight-tip-text h4 {
    color: #173b35;
    font-size: 14px;
    margin: 2px 0 7px;
}

.flight-tip-text p {
    font-size: 12px;
    color: #777;
    line-height: 1.7;
    margin: 0;
}

/* TABLET */

@media (max-width: 900px) {
    .flight-layout {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }

    .flight-image {
        height: 620px;
    }

    .flight-content h2 {
        font-size: 34px;
    }

    .flight-tips {
        grid-template-columns: 1fr;
    }
}

/* MOBILE */

@media (max-width: 600px) {
    .flight-section {
        padding: 60px 18px;
    }

    .flight-layout {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .flight-image {
        height: 420px;
    }

    .flight-image-overlay h3 {
        font-size: 28px;
    }

    .flight-content h2 {
        font-size: 32px;
    }

    .flight-tips {
        grid-template-columns: 1fr;
    }

    .flight-tip {
        padding: 15px 0;
    }
}

.dreams-hero {
    position: relative;
    min-height: 720px;
    display: flex;
    align-items: center;
    overflow: hidden;

    background:
        url('/assets/images/airport-journey.png') center center / cover no-repeat;

    font-family: 'DM Sans', sans-serif;
}

/* DARK OVERLAY */

.hero-overlay {
    position: absolute;
    inset: 0;

    background: linear-gradient(90deg, rgba(12, 43, 37, .94) 0%, rgb(33 144 205) 45%, rgba(12, 43, 37, .35) 100%)
}

/* CONTENT CONTAINER */

.hero-container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1200px;
    margin: auto;
    padding: 100px 25px 90px;
}

.hero-content {
    max-width: 760px;
}

/* TOP LABEL */

.hero-label {
    display: inline-block;
    color: #38A9E0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    margin-bottom: 25px;
}

/* HEADING */

.hero-content h1 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(42px, 5.2vw, 65px);
    line-height: 1.17;
    font-weight: 600;
    color: #fff;
    margin: 0 0 25px;
}

.hero-content h1 span {
    color: #38A9E0;
}

/* DESCRIPTION */

.hero-content p {
    max-width: 690px;
    font-size: 14px;
    line-height: 1.9;
    color: rgba(255, 255, 255, .85);
    margin-bottom: 14px;
}

/* BUTTONS */

.hero-buttons {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 32px;
}

.hero-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    padding: 16px 25px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    border-radius: 4px;
    transition: all .3s ease;
}

.primary-btn {
    background: #d2a36e;
    color: #173b35;
}

.primary-btn:hover {
    background: #fff;
    transform: translateY(-4px);
}

.secondary-btn {
    border: 1px solid rgba(255, 255, 255, .7);
    color: #fff;
    background: transparent;
}

.secondary-btn:hover {
    background: #fff;
    color: #173b35;
    transform: translateY(-4px);
}

/* HIGHLIGHTS */

.hero-highlights {
    display: flex;
    flex-wrap: wrap;
    gap: 35px;
    margin-top: 55px;
    padding-top: 25px;
    border-top: 1px solid rgba(255, 255, 255, .25);
}

.highlight-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.highlight-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(223, 180, 125, .6);
    color: #38A9E0;
    border-radius: 50%;
    font-size: 19px;
}

.highlight-item strong {
    display: block;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
}

.highlight-item small {
    display: block;
    color: rgba(255, 255, 255, .65);
    font-size: 11px;
    margin-top: 5px;
}

/* BOTTOM TEXT */

.hero-bottom-text {
    position: absolute;
    z-index: 2;
    right: 35px;
    bottom: 30px;
    color: rgba(255, 255, 255, .65);
    font-size: 10px;
    letter-spacing: 3px;
}

/* TABLET */

@media (max-width: 900px) {

    .dreams-hero {
        min-height: 680px;
    }

    .hero-content {
        max-width: 680px;
    }

    .hero-content h1 {
        font-size: 49px;
    }

    .hero-highlights {
        gap: 22px;
    }

}

/* MOBILE */

@media (max-width: 600px) {

    .dreams-hero {
        min-height: auto;
        background-position: 60% center;
    }

    .hero-overlay {
        background: rgba(12, 43, 37, .84);
    }

    .hero-container {
        padding: 85px 20px 75px;
    }

    .hero-label {
        font-size: 9px;
        letter-spacing: 2px;
    }

    .hero-content h1 {
        font-size: 39px;
        line-height: 1.22;
    }

    .hero-content p {
        font-size: 13px;
        line-height: 1.8;
    }

    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .hero-btn {
        width: 100%;
        justify-content: space-between;
    }

    .hero-highlights {
        flex-direction: column;
        gap: 20px;
        margin-top: 35px;
    }

    .hero-bottom-text {
        display: none;
    }

}

.airlines-section {
    padding: 65px 20px;
    background: #f5fbff;
    font-family: 'DM Sans', sans-serif;
}

.airlines-container {
    max-width: 1150px;
    margin: 0 auto;
}

/* HEADER */

.airlines-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 38px;
}

.header-left {
    flex: 1;
}

.section-label {
    display: block;
    color: #249de0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 15px;
}

.airlines-header h2 {
    font-family: 'Playfair Display', serif;
    color: #103d64;
    font-size: 34px;
    line-height: 1.3;
    margin: 0;
}

.header-description {
    max-width: 310px;
    color: #54718c;
    font-size: 13px;
    line-height: 1.8;
    margin: 0;
}

/* GRID */

.airlines-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}

/* CARD */

.airline-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 26px;
    background: #fff;
    border: 1px solid #d7eaf7;
    border-radius: 22px;
    transition: all .35s ease;
}

.airline-card:hover {
    transform: translateY(-7px);
    border-color: #76c7f2;
    box-shadow: 0 15px 35px rgba(36, 130, 190, .10);
}

/* IMAGE */

.airline-image {
    position: relative;
    height: 145px;
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 14px;
    background: #eaf8fd;
}

.airline-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .75;
    transition: transform .5s ease;
}

.airline-card:hover .airline-image img {
    transform: scale(1.08);
}

.airline-logo-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #075080;
    font-size: 55px;
    text-shadow: 0 2px 10px rgba(255, 255, 255, .7);
}

/* CONTENT */

.airline-card h3 {
    font-size: 24px;
    line-height: 1.3;
    color: #123e65;
    font-weight: 700;
    margin: 0 0 12px;
}

.airline-card p {
    color: #54718c;
    font-size: 14px;
    line-height: 1.9;
    margin: 0 0 25px;
}

/* LINK */

.airline-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: auto;
    color: #239fe3;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    line-height: 1.6;
    transition: all .3s ease;
}

.airline-link span {
    transition: transform .3s ease;
}

.airline-link:hover {
    color: #126aab;
}

.airline-link:hover span {
    transform: translateX(5px);
}

/* TABLET */

@media (max-width: 1000px) {

    .airlines-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .airlines-header h2 {
        font-size: 30px;
    }

}

/* MOBILE */

@media (max-width: 600px) {

    .airlines-section {
        padding: 50px 16px;
    }

    .airlines-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        margin-bottom: 28px;
    }

    .airlines-header h2 {
        font-size: 28px;
    }

    .header-description {
        max-width: 100%;
    }

    .airlines-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .airline-card {
        padding: 22px;
    }

    .airline-image {
        height: 175px;
    }

    .airline-card h3 {
        font-size: 22px;
    }

}

/* =========================================================
   DREAMSFARE — LIGHT BLUE UNIFIED THEME
   Clean, consistent visual layer for homepage and all inner pages.
   ========================================================= */

:root {
    --df-navy: #083b66;
    --df-blue: #1486c7;
    --df-sky: #55b9e8;
    --df-sky-light: #eaf8ff;
    --df-bg: #f6fbff;
    --df-white: #ffffff;
    --df-text: #123d5d;
    --df-muted: #617b90;
    --df-line: #d7eaf5;
    --df-shadow: 0 16px 45px rgba(8, 59, 102, .08);
}

body {
    background: var(--df-bg);
    color: var(--df-text);
}

/* Header and navigation */
.header {
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid var(--df-line);
    box-shadow: 0 6px 25px rgba(8, 59, 102, .05);
}

.logo img,
.footer-logo img {
    width: auto;
    object-fit: contain;
}

.logo img {
    max-height: 48px;
}

.footer-logo img {
    max-height: 50px;
}

.main-nav>a {
    color: var(--df-text);
    font-weight: 600;
    position: relative;
    padding: 8px 0;
}

.main-nav>a:hover,
.main-nav>a.is-active {
    color: var(--df-blue);
}

.main-nav>a.is-active:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    border-radius: 3px;
    background: var(--df-sky);
}

/* Homepage accents */
.eyebrow,
.section-label {
    color: var(--df-blue) !important;
}

.primary-btn,
.search-btn {
    background: linear-gradient(135deg, var(--df-blue), var(--df-sky));
    color: #fff;
    border: 0;
    box-shadow: 0 10px 22px rgba(20, 134, 199, .18);
}

.primary-btn:hover,
.search-btn:hover {
    background: var(--df-navy);
    color: #fff;
}

.text-btn {
    color: var(--df-blue) !important;
}

/* Shared inner-page hero */
.page-hero,
.legal-hero {
    position: relative;
    overflow: hidden;
    padding: 92px 0 82px;
    background:
        radial-gradient(circle at 90% 15%, rgba(85, 185, 232, .22), transparent 24%),
        radial-gradient(circle at 6% 105%, rgba(20, 134, 199, .12), transparent 31%),
        linear-gradient(135deg, #edfaff 0%, #dff5ff 52%, #f8fdff 100%);
    border-bottom: 1px solid var(--df-line);
}

.page-hero:before,
.legal-hero:before {
    content: "";
    position: absolute;
    width: 430px;
    height: 430px;
    right: -150px;
    top: -240px;
    border: 1px solid rgba(20, 134, 199, .18);
    border-radius: 50%;
}

.page-hero .container,
.legal-hero .container {
    position: relative;
    z-index: 1;
}

.page-hero h1,
.legal-hero h1 {
    max-width: 920px;
    color: var(--df-navy) !important;
    font-size: clamp(2.4rem, 5vw, 4.15rem);
    margin: 12px 0 14px;
}

.page-hero p,
.legal-hero p {
    max-width: 760px;
    color: var(--df-muted) !important;
}

.page-hero .eyebrow,
.legal-hero .eyebrow {
    color: var(--df-blue) !important;
}

/* Cards and content */
.section {
    padding-top: 72px;
    padding-bottom: 72px;
}

.content-page,
.policy,
.contact-form,
.legal-content {
    background: var(--df-white);
    border: 1px solid var(--df-line);
    border-radius: 18px;
    box-shadow: var(--df-shadow);
}

.content-page,
.policy {
    padding: clamp(28px, 4vw, 58px);
}

.content-page h2,
.policy h2,
.policy h3,
.contact-copy h2,
.section-head h2,
.legal-block h2,
.terms-section-card h2 {
    color: var(--df-navy) !important;
}

.content-page h2,
.policy h2 {
    font-size: clamp(1.75rem, 3vw, 2.45rem);
    margin-top: 1.7em;
}

.content-page h2:first-child,
.policy h2:first-child {
    margin-top: 0;
}

.content-page p,
.policy p {
    color: var(--df-muted);
}

.content-list li::marker,
.number-list li::marker {
    color: var(--df-blue);
}

.info-table {
    overflow: hidden;
    border: 1px solid var(--df-line) !important;
    border-radius: 14px;
    background: #fff;
}

.info-head {
    background: linear-gradient(90deg, #e7f7ff, #f5fcff) !important;
    color: var(--df-navy) !important;
}

.info-row {
    border-color: var(--df-line) !important;
}

/* Privacy and terms layouts */
.legal-layout,
.terms-legal-layout {
    background: var(--df-bg) !important;
}

.legal-nav-card,
.terms-legal-layout .legal-nav-card {
    background: #fff !important;
    border: 1px solid var(--df-line) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 35px rgba(8, 59, 102, .05);
}

.legal-nav-card strong {
    color: var(--df-navy) !important;
}

.legal-nav-card a {
    color: var(--df-muted) !important;
}

.legal-nav-card a:hover {
    color: var(--df-blue) !important;
}

.legal-block,
.terms-section-card {
    background: #fff !important;
    border-color: var(--df-line) !important;
    box-shadow: none !important;
}

.legal-block:before {
    background: var(--df-sky) !important;
}

/* FAQ styling, matching the homepage */
.faq-item,
.terms-faq .faq-item {
    background: #fff !important;
    border-color: var(--df-line) !important;
}

.faq-item.active,
.terms-faq .faq-item.active {
    border-color: #9edbf5 !important;
}

.faq-question,
.terms-faq .faq-question {
    color: var(--df-navy) !important;
    background: #fff !important;
}

.faq-item.active .faq-question,
.terms-faq .faq-item.active .faq-question {
    background: linear-gradient(90deg, #edfaff, #f6fcff) !important;
}

.faq-question .faq-icon,
.terms-faq .faq-question .faq-icon {
    background: #e9f7ff !important;
    color: var(--df-blue) !important;
}

.faq-answer,
.terms-faq .faq-answer {
    color: var(--df-muted) !important;
}

/* Airline pages */
.airline-directory-card,
.airline-card,
.airline-info-box {
    background: #fff !important;
    border-color: var(--df-line) !important;
}

.airline-directory-card:hover,
.airline-card:hover {
    border-color: #8ed5f4 !important;
    box-shadow: 0 18px 40px rgba(8, 59, 102, .10) !important;
}

.airline-link {
    color: var(--df-blue) !important;
}

.airline-feature-band {
    border: 1px solid var(--df-line);
    border-radius: 20px;
    overflow: hidden;
}

.airline-info-box strong {
    color: var(--df-navy) !important;
}

/* Contact page */
.contact-grid {
    align-items: stretch;
}

.contact-copy {
    background: linear-gradient(145deg, #07558a, #149bd2);
    border-radius: 20px;
    padding: clamp(28px, 4vw, 55px);
    color: #fff;
    box-shadow: 0 18px 40px rgba(20, 134, 199, .16);
}

.contact-copy h2,
.contact-copy p,
.contact-copy b,
.contact-copy span {
    color: #fff !important;
}

.contact-copy p {
    color: rgba(255, 255, 255, .82) !important;
}

.contact-item {
    border-color: rgba(255, 255, 255, .18) !important;
}

.contact-form {
    padding: clamp(28px, 4vw, 50px);
}

.contact-form input,
.contact-form textarea,
.contact-form select {
    background: #fbfdff !important;
    border-color: #cfe7f4 !important;
}

.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus {
    border-color: var(--df-sky) !important;
    box-shadow: 0 0 0 3px rgba(85, 185, 232, .16) !important;
}

.contact-form button {
    background: linear-gradient(135deg, var(--df-blue), var(--df-sky)) !important;
    color: #fff !important;
}

/* Footer */
.footer {
    background: #073a61 !important;
    color: rgba(255, 255, 255, .72) !important;
    border-top: 3px solid var(--df-sky);
}

.footer h4,
.footer a:hover,
.copyright {
    color: #fff !important;
}

.footer a {
    color: rgba(255, 255, 255, .70) !important;
}

/* General section polish */
.destination-card,
.feature-grid article,
.benefits,
.guide-section,
.airline-card {
    border-color: var(--df-line) !important;
}

.destination-card,
.feature-grid article {
    box-shadow: 0 12px 30px rgba(8, 59, 102, .05);
}

.destination-card:hover,
.feature-grid article:hover {
    box-shadow: 0 18px 38px rgba(8, 59, 102, .10);
}

.home-guide-content,
.why-section,
.airlines-section {
    background: transparent;
}

@media(max-width:900px) {

    .page-hero,
    .legal-hero {
        padding: 76px 0 66px;
    }
}

@media(max-width:680px) {

    .page-hero,
    .legal-hero {
        padding: 62px 0 54px;
    }

    .content-page,
    .policy {
        padding: 24px 20px;
    }

    .logo img {
        max-height: 42px;
    }
}

/* =========================================================
   DREAMSFARE — REFINED SINGLE-ACCENT DESIGN SYSTEM
   One brand accent: #238DB8. All other tones are neutrals.
   ========================================================= */
:root {
    --df-accent: #238DB8;
    --df-ink: #142C3D;
    --df-muted: #627687;
    --df-paper: #F5F8FA;
    --df-white: #FFFFFF;
    --df-border: #DCE5EB;
    --df-deep: #102A3D;
    --df-shadow: 0 22px 60px rgba(16, 42, 61, .12);
}

body {
    background: var(--df-paper);
    color: var(--df-ink);
}

.header {
    height: 82px;
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid var(--df-border);
    box-shadow: 0 8px 30px rgba(16, 42, 61, .045);
}

.nav {
    max-width: 1240px;
}

.logo img {
    max-height: 50px;
}

.main-nav {
    gap: 32px;
}

.main-nav>a {
    color: var(--df-muted);
    font-size: .88rem;
    font-weight: 600;
}

.main-nav>a:hover,
.main-nav>a.is-active {
    color: var(--df-accent);
}

.main-nav>a.is-active:after {
    background: var(--df-accent);
    height: 3px;
}

.main-nav .nav-cta {
    background: var(--df-accent);
    border-radius: 999px;
    padding: 12px 22px;
    color: #fff !important;
}

/* Homepage hero */
.dreams-hero {
    min-height: 690px;
    background-image: url('/assets/images/airport-journey.png');
    background-position: center 48%;
    background-size: cover;
    isolation: isolate;
}

.hero-overlay {
    background: linear-gradient(90deg, rgba(9, 29, 45, .94) 0%, rgba(9, 29, 45, .82) 47%, rgba(9, 29, 45, .25) 100%);
}

.hero-container {
    max-width: 1240px;
    padding: 108px 28px 112px;
}

.hero-content {
    max-width: 720px;
}

.hero-label {
    color: #fff;
    opacity: .92;
    letter-spacing: 2.2px;
    font-size: .7rem;
    padding: 9px 14px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    margin-bottom: 22px;
}

.hero-content h1 {
    font-family: 'DM Sans', Arial, sans-serif;
    font-size: clamp(2.8rem, 5.4vw, 5rem);
    line-height: 1.04;
    letter-spacing: -2.5px;
    font-weight: 700;
    max-width: 740px;
    margin: 0 0 24px;
}

.hero-content h1 span {
    color: var(--df-accent);
}

.hero-content p {
    max-width: 630px;
    font-size: 1rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, .82);
}

.hero-buttons {
    gap: 14px;
    margin-top: 30px;
}

.hero-btn {
    border-radius: 999px;
    padding: 15px 23px;
    font-size: .86rem;
    gap: 18px;
}

.primary-btn {
    background: var(--df-accent);
    color: #fff;
    box-shadow: 0 12px 28px rgba(35, 141, 184, .28);
}

.primary-btn:hover {
    background: #fff;
    color: var(--df-ink);
}

.secondary-btn {
    border-color: rgba(255, 255, 255, .6);
    background: rgba(255, 255, 255, .08);
    backdrop-filter: blur(8px);
}

.secondary-btn:hover {
    background: #fff;
    color: var(--df-ink);
}

.hero-highlights {
    gap: 28px;
    margin-top: 44px;
    padding-top: 24px;
    border-color: rgba(255, 255, 255, .22);
}

.highlight-icon {
    border-color: rgba(255, 255, 255, .48);
    color: #fff;
    background: rgba(255, 255, 255, .08);
}

.highlight-item strong {
    font-size: .8rem;
}

.highlight-item small {
    font-size: .7rem;
}

.hero-bottom-text {
    display: none;
}

/* Flight search panel */
.search-wrap {
    margin-top: -58px;
}

.search-box {
    border: 1px solid rgba(220, 229, 235, .9);
    border-radius: 22px;
    padding: 25px;
    box-shadow: 0 24px 70px rgba(16, 42, 61, .14);
}

.search-tabs .active {
    background: rgba(35, 141, 184, .10);
    color: var(--df-accent);
}

.search-tabs span {
    background: var(--df-paper);
    color: var(--df-muted);
}

.search-fields label {
    border-radius: 12px;
    border-color: var(--df-border);
    padding: 11px 13px;
}

.search-fields label:focus-within {
    border-color: var(--df-accent);
    box-shadow: 0 0 0 3px rgba(35, 141, 184, .1);
}

.search-btn {
    background: var(--df-accent);
    border-radius: 12px;
}

/* Consistent accent throughout the site */
.eyebrow,
.section-label,
.text-btn,
.airline-link {
    color: var(--df-accent) !important;
}

.section-head h2,
.experience h2,
.promo h2,
.policy h2,
.contact-copy h2,
.guide-section h2 {
    color: var(--df-ink);
}

.primary-btn,
.search-btn {
    background: var(--df-accent);
}

.page-hero,
.legal-hero {
    background: var(--df-paper);
    border-bottom: 1px solid var(--df-border);
}

.page-hero:before,
.legal-hero:before {
    border-color: rgba(35, 141, 184, .16);
}

.page-hero h1,
.legal-hero h1 {
    color: var(--df-ink) !important;
}

.content-page,
.policy,
.contact-form,
.legal-content,
.search-box {
    border-color: var(--df-border);
    box-shadow: var(--df-shadow);
}

.destination-card,
.feature-grid article,
.airline-card {
    border: 1px solid var(--df-border);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 12px 34px rgba(16, 42, 61, .06);
}

.destination-card:hover,
.feature-grid article:hover,
.airline-card:hover {
    transform: translateY(-5px);
    border-color: var(--df-accent);
    box-shadow: 0 20px 45px rgba(16, 42, 61, .12);
}

.destination-card,
.feature-grid article {
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

/* Rebuild footer as a clear, premium closing section */
.footer {
    position: relative;
    margin-top: 72px;
    padding: 68px 0 22px;
    background: var(--df-deep) !important;
    color: rgba(255, 255, 255, .72) !important;
    border: 0 !important;
    overflow: hidden;
}

.footer:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: rgba(255, 255, 255, .18);
}

.footer-grid {
    position: relative;
    display: grid;
    grid-template-columns: 1.65fr 1fr 1fr 1.25fr;
    gap: clamp(26px, 4vw, 64px);
    align-items: start;
    padding-bottom: 42px;
}

.footer-grid>div:first-child {
    padding-right: 24px;
}

.footer-logo img {
    max-height: 54px;
    filter: brightness(0) invert(1);
    opacity: .96;
}

.footer p {
    max-width: 320px;
    margin: 18px 0;
    color: rgba(255, 255, 255, .66);
    font-size: .88rem;
    line-height: 1.8;
}

.footer h4 {
    margin: 3px 0 20px;
    color: #fff !important;
    font-size: .9rem;
    letter-spacing: .2px;
}

.footer a,
.footer span {
    display: block;
    width: fit-content;
    margin: 12px 0;
    color: rgba(255, 255, 255, .68) !important;
    font-size: .82rem;
    line-height: 1.6;
    transition: color .2s ease, transform .2s ease;
}

.footer a:hover {
    color: #fff !important;
    transform: translateX(3px);
}

.footer .socials {
    gap: 9px;
    margin-top: 22px;
}

.footer .socials span {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 50%;
    color: #fff !important;
    font-size: .75rem;
    transition: .2s;
}

.footer .socials span:hover {
    background: var(--df-accent);
    border-color: var(--df-accent);
}

.copyright {
    position: relative;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-top: 0;
    padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, .17);
    color: rgba(255, 255, 255, .55) !important;
    font-size: .75rem;
}

.copyright:after {
    content: "Made for journeys worth remembering.";
    color: rgba(255, 255, 255, .42);
}

.footer .footer-grid>div:last-child span {
    max-width: 230px;
}

/* Responsive refinements */
@media(max-width:900px) {
    .dreams-hero {
        min-height: 650px;
        background-position: 58% center;
    }

    .hero-container {
        padding: 90px 25px 105px;
    }

    .footer-grid {
        grid-template-columns: 1.4fr 1fr 1fr;
    }

    .footer-grid>div:first-child {
        grid-column: 1/-1;
    }
}

@media(max-width:680px) {
    .header {
        height: auto;
    }

    .nav {
        min-height: 72px;
    }

    .dreams-hero {
        min-height: auto;
        background-position: 62% center;
    }

    .hero-overlay {
        background: rgba(9, 29, 45, .82);
    }

    .hero-container {
        padding: 76px 21px 92px;
    }

    .hero-content h1 {
        font-size: clamp(2.45rem, 11vw, 3.4rem);
        letter-spacing: -1.4px;
    }

    .hero-content p {
        font-size: .92rem;
    }

    .hero-highlights {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
        margin-top: 32px;
    }

    .hero-btn {
        width: 100%;
        justify-content: space-between;
    }

    .search-wrap {
        margin-top: -42px;
    }

    .search-box {
        padding: 18px;
        border-radius: 18px;
    }

    .search-fields {
        grid-template-columns: 1fr;
    }

    .footer {
        margin-top: 42px;
        padding: 48px 0 20px;
    }

    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 26px 18px;
        padding-bottom: 28px;
    }

    .footer-grid>div:first-child {
        grid-column: 1/-1;
        padding-right: 0;
    }

    .footer h4 {
        margin-bottom: 12px;
    }

    .copyright {
        display: block;
        line-height: 1.8;
    }

    .copyright:after {
        display: block;
        margin-top: 5px;
    }
}

@media(prefers-reduced-motion:reduce) {

    *,
    *:before,
    *:after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}

/* Distinct, legible journey callouts */
.dreamsfare-cta {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin: 76px auto;
    width: min(1240px, 92%);
    min-height: 330px;
    display: flex;
    align-items: center;
    border-radius: 26px;
    background: var(--df-deep);
    box-shadow: 0 24px 60px rgba(16, 42, 61, .14);
}

.dreamsfare-cta:before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(105deg, rgba(16, 42, 61, .97), rgba(16, 42, 61, .82) 58%, rgba(16, 42, 61, .45)),
        url('/assets/images/airport-journey.png') center 52%/cover;
}

.cta-overlay {
    display: none;
}

.cta-content {
    position: relative;
    max-width: 760px;
    padding: 58px clamp(26px, 6vw, 76px);
}

.section-tag {
    display: inline-block;
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 14px;
}

.cta-content h2 {
    color: #fff !important;
    font: 700 clamp(2rem, 4vw, 3.3rem)/1.12 'DM Sans', Arial, sans-serif;
    letter-spacing: -1.2px;
    margin: 0 0 16px;
}

.cta-content h2 span {
    color: var(--df-accent);
}

.cta-content p {
    color: rgba(255, 255, 255, .78);
    max-width: 610px;
    line-height: 1.8;
    margin: 0 0 25px;
}

.cta-button {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    padding: 14px 22px;
    border-radius: 999px;
    background: var(--df-accent);
    color: #fff;
    font-weight: 700;
    font-size: .85rem;
}

.cta-button:hover {
    background: #fff;
    color: var(--df-ink);
}

.promo {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 42px;
    align-items: center;
    padding: 48px;
    margin-top: 50px;
    margin-bottom: 75px;
    border: 1px solid var(--df-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(16, 42, 61, .07);
}

.promo>img {
    width: 100%;
    max-height: 230px;
    object-fit: contain;
}

.promo h2 {
    color: var(--df-ink) !important;
    font: 700 clamp(1.8rem, 3.5vw, 2.8rem)/1.13 'DM Sans', Arial, sans-serif;
    letter-spacing: -1px;
    margin: 12px 0;
}

.promo p {
    color: var(--df-muted);
    line-height: 1.8;
    max-width: 620px;
}

.promo .primary-btn {
    display: inline-flex;
    border-radius: 999px;
    margin-top: 8px;
}

@media(max-width:680px) {
    .dreamsfare-cta {
        margin: 48px auto;
        min-height: 0;
        border-radius: 20px;
    }

    .cta-content {
        padding: 42px 25px;
    }

    .promo {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 25px;
        margin-bottom: 48px;
    }

    .promo>img {
        max-height: 150px;
    }
}


/* =========================================================
   INNER PAGE HERO — CINEMATIC, CONSISTENT WITH HOMEPAGE
   Single accent: #238DB8. Shared across About, Contact,
   Legal, Airline directory and airline detail pages.
   ========================================================= */
.page-hero,
.legal-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 390px;
    display: flex;
    align-items: center;
    padding: 76px 0 82px;
    border: 0;
    background:
        linear-gradient(90deg, rgba(9, 29, 45, .94) 0%, rgba(9, 29, 45, .86) 52%, rgba(9, 29, 45, .53) 100%),
        url('/assets/images/airport-journey.png') center 48%/cover no-repeat !important;
}

.emirate-page-hero {
    background:
        linear-gradient(90deg, rgba(9, 29, 45, .94) 0%, rgba(9, 29, 45, .86) 52%, rgba(9, 29, 45, .53) 100%),
        url('/assets/images/emirates.avif') center 48%/cover no-repeat !important;
}

.qatar-page-hero {
    background:
        linear-gradient(90deg, rgba(9, 29, 45, .94) 0%, rgba(9, 29, 45, .86) 52%, rgba(9, 29, 45, .53) 100%),
        url('/assets/images/qatar-airways.jpg') center 48%/cover no-repeat !important;
}

.singapore-page-hero {
    background:
        linear-gradient(90deg, rgba(9, 29, 45, .94) 0%, rgba(9, 29, 45, .86) 52%, rgba(9, 29, 45, .53) 100%),
        url('/assets/images/singapore-airlines.webp') center 48%/cover no-repeat !important;
}

.turkish-page-hero {
    background:
        linear-gradient(90deg, rgba(9, 29, 45, .94) 0%, rgba(9, 29, 45, .86) 52%, rgba(9, 29, 45, .53) 100%),
        url('/assets/images/turkish-airlines.webp') center 48%/cover no-repeat !important;
}

.page-hero:before,
.legal-hero:before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    width: auto;
    height: auto;
    right: auto;
    top: auto;
    border: 0;
    border-radius: 0;
    background: linear-gradient(0deg, rgba(9, 29, 45, .18), transparent 48%);
}

.page-hero>.container,
.legal-hero>.container {
    position: relative;
    z-index: 1;
    width: min(1160px, 92%);
    margin: 0 auto;
}

.page-hero h1,
.legal-hero h1 {
    max-width: 850px;
    margin: 15px 0 18px;
    color: #fff !important;
    font-family: 'DM Sans', Arial, sans-serif;
    font-size: clamp(2.65rem, 5.2vw, 4.65rem);
    line-height: 1.04;
    font-weight: 700;
    letter-spacing: -2px;
    text-wrap: balance;
}

.page-hero p,
.legal-hero p {
    max-width: 650px;
    margin: 0;
    color: rgba(255, 255, 255, .82) !important;
    font-size: 1rem;
    line-height: 1.8;
}

.page-hero .eyebrow,
.legal-hero .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #fff !important;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: 2px;
    padding: 9px 14px;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
    backdrop-filter: blur(8px);
}

.page-hero .eyebrow:before,
.legal-hero .eyebrow:before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--df-accent);
    box-shadow: 0 0 0 4px rgba(35, 141, 184, .18);
}

.legal-hero .legal-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.legal-hero .legal-meta span {
    color: rgba(255, 255, 255, .8);
    background: rgba(255, 255, 255, .09);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    padding: 7px 12px;
    font-size: .72rem;
}

.page-hero .airline-page-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 44px;
    align-items: center;
}

.page-hero .airline-page-intro>div:first-child {
    max-width: 760px;
}

.page-hero .airline-page-intro>div:last-child {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 190px;
    min-height: 150px;
    border-radius: 22px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.page-hero .airline-hero-logo {
    display: block;
    width: auto;
    height: auto;
    object-fit: contain;
}

.page-hero.airline-list-hero {
    min-height: 360px;
}

.page-hero.terms-hero {
    min-height: 360px;
}

.page-hero+.section,
.legal-hero+.legal-layout {
    padding-top: 64px;
}

@media(max-width:760px) {

    .page-hero,
    .legal-hero {
        min-height: 340px;
        padding: 68px 0 72px;
        background-position: 58% center;
    }

    .page-hero h1,
    .legal-hero h1 {
        font-size: clamp(2.35rem, 10vw, 3.35rem);
        letter-spacing: -1.3px;
    }

    .page-hero p,
    .legal-hero p {
        font-size: .92rem;
    }

    .page-hero .airline-page-intro {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .page-hero .airline-page-intro>div:last-child {
        min-width: 0;
        min-height: 100px;
        width: fit-content;
        max-width: 210px;
        padding: 18px 22px;
    }

    .page-hero .airline-hero-logo {
        max-height: 65px;
        max-width: 160px;
    }

    .page-hero+.section,
    .legal-hero+.legal-layout {
        padding-top: 42px;
    }
}

@media(prefers-reduced-motion:reduce) {

    .page-hero,
    .legal-hero {
        scroll-behavior: auto;
    }
}

.page-hero,
.legal-hero {
    text-align: left;
}



/* =========================================================
   DREAMSFARE V10 — HERO CENTERING & CONTENT VISIBILITY FIX
   ========================================================= */

/* Centralise the homepage hero content */
.home-hero,
.hero.home-hero {
    text-align: center;
}

.home-hero .hero-content,
.hero.home-hero .hero-content,
.home-hero .hero-copy,
.hero.home-hero .hero-copy {
    width: 100%;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.home-hero h1,
.home-hero p,
.home-hero .hero-subtitle,
.hero.home-hero h1,
.hero.home-hero p,
.hero.home-hero .hero-subtitle {
    margin-left: auto;
    margin-right: auto;
}

.home-hero .hero-actions,
.home-hero .hero-buttons,
.home-hero .trust-row,
.hero.home-hero .hero-actions,
.hero.home-hero .hero-buttons,
.hero.home-hero .trust-row {
    justify-content: center;
    align-items: center;
}

.home-hero .eyebrow,
.hero.home-hero .eyebrow {
    margin-left: auto;
    margin-right: auto;
}

/* Content must never remain hidden until the user scrolls */
.reveal,
.reveal-up,
.reveal-left,
.reveal-right,
.fade-in,
.fade-up,
.animate-on-scroll,
[data-aos] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
}

/* Safety for About and other inner-page content */
.about-section,
.about-content,
.page-content,
.content-page,
.legal-content,
.legal-block {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

@media(max-width:768px) {

    .home-hero .hero-actions,
    .home-hero .hero-buttons,
    .home-hero .trust-row {
        justify-content: center;
    }
}

/* =========================================================
   DREAMSFARE — ACTUAL HOMEPAGE HERO CENTER ALIGNMENT
   ========================================================= */
.dreams-hero .hero-container {
    min-height: 700px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-sizing: border-box;
}

.dreams-hero .hero-content {
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.dreams-hero .hero-label {
    margin-left: auto;
    margin-right: auto;
}

.dreams-hero .hero-content h1 {
    width: 100%;
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
}

.dreams-hero .hero-content p {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

.dreams-hero .hero-buttons {
    width: 100%;
    justify-content: center;
}

.dreams-hero .hero-highlights {
    width: 100%;
    justify-content: center;
    text-align: left;
}

@media(max-width:768px) {
    .dreams-hero .hero-container {
        min-height: auto;
        padding-top: 90px;
        padding-bottom: 90px;
    }

    .dreams-hero .hero-highlights {
        text-align: center;
    }
}

/* =========================================================
   DREAMSFARE V11 — THEMED SINGLE FLIGHT CALENDAR
   ========================================================= */

.flight-search-box {
    position: relative;
}

.trip-type-tabs button {
    cursor: pointer;
}

.date-picker-group {
    position: relative;
    min-width: 0;
}

.date-trigger {
    width: 100%;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
    text-align: left;
}

.date-trigger .date-value {
    font-weight: 600;
    white-space: nowrap;
}

.date-trigger .date-icon {
    color: #1486c7;
    font-size: 15px;
    line-height: 1;
}

.date-trigger.has-date .date-value {
    color: #083b66;
}

.return-date-group.is-disabled {
    opacity: .5;
}

.return-date-group.is-disabled label {
    cursor: not-allowed;
}

.return-date-group.is-disabled .date-trigger {
    cursor: not-allowed;
}

.dreams-calendar {
    position: absolute;
    z-index: 1000;
    top: calc(100% - 6px);
    left: 50%;
    transform: translateX(-50%);
    width: min(410px, calc(100vw - 32px));
    padding: 18px;
    border: 1px solid #c9e7f6;
    border-radius: 18px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 24px 70px rgba(8, 59, 102, .18);
    backdrop-filter: blur(16px);
}

.dreams-calendar[hidden] {
    display: none !important;
}

.calendar-header {
    display: grid;
    grid-template-columns: 42px 1fr 42px;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.calendar-title {
    color: #083b66;
    font-size: 17px;
    font-weight: 800;
    text-align: center;
}

.calendar-nav {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid #d4ebf7;
    border-radius: 50%;
    background: #f4fbff;
    color: #1486c7;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    transition: .2s ease;
}

.calendar-nav:hover {
    background: #1486c7;
    color: #fff;
    border-color: #1486c7;
}

.calendar-trip-hint {
    margin: 0 0 14px;
    padding: 10px 13px;
    border-radius: 10px;
    background: linear-gradient(90deg, #e9f8ff, #f8fdff);
    color: #668195;
    font-size: 12px;
    text-align: center;
}

.calendar-trip-hint strong {
    color: #083b66;
}

.calendar-weekdays,
.calendar-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 5px;
}

.calendar-weekdays {
    margin-bottom: 7px;
}

.calendar-weekdays span {
    padding: 7px 0;
    color: #7a96aa;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}

.calendar-day {
    position: relative;
    min-height: 42px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #163f5f;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: .18s ease;
}

.calendar-day:hover:not(.past):not(.empty) {
    background: #e7f7ff;
    color: #1486c7;
}

.calendar-day.empty {
    pointer-events: none;
}

.calendar-day.past {
    color: #b7c8d3;
    cursor: not-allowed;
}

.calendar-day.today {
    box-shadow: inset 0 0 0 1px #66c5ed;
}

.calendar-day.selected {
    background: linear-gradient(135deg, #1486c7, #55b9e8);
    color: #fff;
    box-shadow: 0 7px 16px rgba(20, 134, 199, .22);
}

.calendar-day.in-range {
    border-radius: 0;
    background: #e4f6ff;
    color: #0876b4;
}

.calendar-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid #e1eff7;
}

.calendar-footer button {
    border: 0;
    background: transparent;
    color: #1486c7;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.calendar-footer button:hover {
    color: #083b66;
}

@media (max-width: 900px) {
    .dreams-calendar {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: min(410px, calc(100vw - 24px));
    }
}

@media (max-width: 520px) {
    .dreams-calendar {
        padding: 14px;
        border-radius: 16px;
    }

    .calendar-day {
        min-height: 38px;
    }
}


/* =========================================================
   DREAMSFARE V11 — COMPACT CALENDAR SIZE ADJUSTMENT
   ========================================================= */

.dreams-calendar {
    width: min(340px, calc(100vw - 32px));
    padding: 13px;
    border-radius: 15px;
    box-shadow: 0 18px 50px rgba(8, 59, 102, .15);
}

.calendar-header {
    grid-template-columns: 34px 1fr 34px;
    gap: 8px;
    margin-bottom: 10px;
}

.calendar-title {
    font-size: 15px;
}

.calendar-nav {
    width: 32px;
    height: 32px;
    font-size: 23px;
}

.calendar-trip-hint {
    margin-bottom: 9px;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 11px;
}

.calendar-weekdays,
.calendar-days {
    gap: 3px;
}

.calendar-weekdays {
    margin-bottom: 3px;
}

.calendar-weekdays span {
    padding: 4px 0;
    font-size: 10px;
}

.calendar-day {
    min-height: 32px;
    border-radius: 8px;
    font-size: 12px;
}

.calendar-day.selected {
    box-shadow: 0 5px 12px rgba(20, 134, 199, .18);
}

.calendar-footer {
    margin-top: 10px;
    padding-top: 10px;
}

.calendar-footer button {
    font-size: 11px;
}

@media(max-width:520px) {
    .dreams-calendar {
        width: min(330px, calc(100vw - 24px));
        padding: 12px;
    }

    .calendar-day {
        min-height: 30px;
    }
}


/* Return dates before the selected departure date are unavailable */
.calendar-day.before-departure {
    color: #c2d0d9;
    background: #f7fafc;
    cursor: not-allowed;
    opacity: .65;
}

.calendar-day.before-departure:hover {
    background: #f7fafc;
    color: #c2d0d9;
}


/* Airport autocomplete */
.airport-field {
    position: relative
}

.airport-suggestions {
    position: absolute;
    z-index: 1200;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 7px;
    background: #fff;
    border: 1px solid #cfe9f8;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(20, 67, 100, .16);
    overflow: hidden;
    max-height: 320px;
    overflow-y: auto;
}

.airport-suggestions[hidden] {
    display: none
}

.airport-option {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px 13px;
    border: 0;
    border-bottom: 1px solid #edf5fa;
    background: #fff;
    text-align: left;
    cursor: pointer;
    color: #063e69;
}

.airport-option:last-child {
    border-bottom: 0
}

.airport-option:hover {
    background: #eefaff
}

.airport-code {
    min-width: 46px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #e5f6ff;
    color: #0787ca;
    font-weight: 800;
    font-size: 13px;
}

.airport-copy {
    display: grid;
    gap: 3px;
    min-width: 0
}

.airport-copy strong {
    font-size: 13px;
    color: #063e69;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.airport-copy small {
    font-size: 11px;
    color: #6b8498;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.airport-empty {
    padding: 14px;
    color: #6b8498;
    font-size: 13px
}

.flight-search-result {
    max-width: 1160px;
    margin: 18px auto 0;
    padding: 16px 20px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    box-shadow: 0 10px 30px rgba(20, 67, 100, .08);
}

.flight-search-result.success {
    background: #effbff;
    border: 1px solid #bce7f7;
    color: #06466f
}

.flight-search-result.error {
    background: #fff7f4;
    border: 1px solid #ffd6cb;
    color: #a33d22
}

.flight-search-result strong {
    font-size: 15px
}

.flight-search-result p {
    margin: 5px 0 0;
    font-size: 13px;
    color: #53748b
}

.result-plane {
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #d8f3ff;
    margin-right: 9px
}

.result-note {
    font-size: 11px;
    font-weight: 700;
    color: #1189c7;
    white-space: nowrap
}

.swap {
    cursor: pointer
}

@media(max-width:700px) {
    .airport-suggestions {
        position: fixed;
        left: 16px;
        right: 16px;
        top: auto;
        max-height: 280px
    }

    .flight-search-result {
        margin: 14px 16px;
        align-items: flex-start;
        flex-direction: column
    }
}


/* Full airport search dropdown */
.airport-field {
    position: relative
}

.airport-suggestions {
    position: absolute;
    z-index: 5000;
    width: 325px;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    background: #fff;
    border: 1px solid #cfe8f7;
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(9, 58, 95, .18);
    overflow-y: auto;
    max-height: 360px;
}

.airport-suggestions[hidden] {
    display: none !important
}

.airport-dropdown-title {
    padding: 11px 14px;
    background: #effaff;
    color: #0a7fb8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    border-bottom: 1px solid #dceff8;
}

.airport-option {
    appearance: none;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 13px;
    border: 0;
    border-bottom: 1px solid #edf4f8;
    background: #fff;
    color: #063e69;
    text-align: left;
    cursor: pointer;
    font: inherit;
    transition: .18s ease;
}

.airport-option:last-child {
    border-bottom: 0
}

.airport-option:hover,
.airport-option.active {
    background: #eefaff
}

.airport-option.active {
    outline: 2px solid rgba(44, 162, 217, .35);
    outline-offset: -2px
}

.airport-all {
    background: linear-gradient(90deg, #eefbff, #f8fffd)
}

.airport-all-badge,
.airport-code-box {
    flex: 0 0 auto;
    width: 44px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #dff4ff;
    color: #087fb9;
    font-size: 11px;
    font-weight: 900;
}

.airport-arrow {
    font-size: 17px;
    color: #55a9d2;
    line-height: 1
}

.airport-code-box {
    width: 42px;
    height: 34px
}

.airport-details,
.airport-all-content {
    min-width: 0;
    display: grid;
    gap: 3px
}

.airport-name,
.airport-all-title {
    font-size: 12px;
    color: #063e69
}

.airport-description,
.airport-all-subtitle {
    font-size: 10px;
    color: #668095;
    white-space: normal
}

.all-airports-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 5px;
    border-radius: 20px;
    background: #bceeff;
    color: #0878af;
    font-style: normal;
    font-size: 8px;
    font-weight: 900;
}

.airport-no-results {
    padding: 16px;
    color: #6f8494;
    font-size: 12px
}

@media(max-width:700px) {
    .airport-suggestions {
        max-height: 280px
    }
}


/* Required search field validation */
.airport-field input.field-error,
.date-trigger.field-error {
    border-color: #e85d75 !important;
    box-shadow: 0 0 0 3px rgba(232, 93, 117, 0.12) !important;
}

.date-trigger.field-error {
    border-radius: 12px;
}