html:has(.nf-flight-page) { height: 100%; overflow: hidden; }
body.nf-flight-page { height: 100dvh; overflow: hidden; padding-top: 0 !important; background: #287f9a; }
.flight-scene { position: relative; height: 100dvh; overflow: hidden; color: #fff; isolation: isolate; }
.flight-scene__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 62%; z-index: -3; }
.flight-scene__tint { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,71,90,.4), rgba(14,108,128,.13) 60%, rgba(12,87,106,.35)), linear-gradient(180deg, rgba(5,36,48,.42), transparent 48%, rgba(12,65,84,.15)); z-index: -2; }
.flight-layout { height: 100%; max-width: 1800px; margin: auto; padding: calc(var(--flight-header-height, 120px) + 30px) clamp(28px, 5.5vw, 100px) 40px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 450px); grid-template-rows: minmax(0, 1fr) auto; column-gap: 5vw; row-gap: 20px; }
.flight-intro { align-self: start; padding-top: clamp(18px, 5vh, 64px); }
.flight-eyebrow { margin: 0; font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.flight-intro > .flight-eyebrow { display: flex; gap: 12px; align-items: center; }
.flight-eyebrow > span { width: 25px; height: 1px; background: #fff; }
.flight-intro h1 { font-family: inherit; color: #fff; font-weight: 400; font-size: clamp(38px, 4.25vw, 70px); line-height: 1.13; letter-spacing: -.045em; margin: 23px 0 20px; }
.flight-intro__description { font-size: 15px; line-height: 1.8; color: rgba(255,255,255,.85); }
.flight-intro__detail { display: flex; align-items: center; gap: 16px; font-size: 11px; line-height: 1.8; margin-top: 32px; color: rgba(255,255,255,.85); }
.flight-intro__detail strong { font-weight: 500; color: #fff; }
.flight-arrow { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #ffffff80; border-radius: 50%; font-size: 25px; }
.flight-card { min-height: 0; align-self: stretch; width: 100%; height: 100%; display: flex; flex-direction: column; padding: 26px 28px 19px; border: 1px solid #ffffff45; border-radius: 17px; background: #ffffff0a; box-shadow: none; backdrop-filter: none; }
.flight-card [hidden] { display: none !important; }
.flight-card button, .flight-card input, .flight-card select, .flight-card textarea { font: inherit; }
.flight-card h2 { margin: 9px 0 6px; color: #fff; font-family: inherit; font-size: 25px; font-weight: 500; letter-spacing: -.035em; line-height: 1.2; }
.flight-card h2:focus { outline: none; }
.flight-card__heading > p:last-child { margin: 0; font-size: 12px; color: #e0edf0; }
.flight-card__heading .flight-eyebrow { color: #d2edf2; font-size: 9px; }
.flight-progress { list-style: none; display: flex; justify-content: space-between; gap: 10px; padding: 0 0 18px; margin: 0 0 20px; border-bottom: 1px solid #ffffff2b; }
.flight-progress li { font-size: 10px; color: #c7e2e9; white-space: nowrap; }
.flight-progress li span { margin-right: 5px; opacity: .7; font-size: 9px; }
.flight-progress li[aria-current] { color: #fff; font-weight: 700; }
#airTicketingForm { min-height: 0; flex: 1; display: flex; flex-direction: column; margin-top: 19px; }
.flight-steps { flex: 1; min-height: 0; overflow: visible; display: flex; flex-direction: column; gap: 13px; padding: 0 2px 2px; }
.flight-step { border: 0; padding: 0; margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 13px; animation: flight-enter .24s ease-out; }
.flight-trip-types { display: flex; background: #0b506442; border: 1px solid #ffffff26; border-radius: 7px; padding: 3px; margin-bottom: 2px; }
.flight-trip-types label { flex: 1; position: relative; cursor: pointer; }
.flight-trip-types input { position: absolute; opacity: 0; width: 100%; height: 100%; }
.flight-trip-types span { display: block; text-align: center; padding: 8px 0; border-radius: 5px; color: #e5f2f4; font-size: 11px; }
.flight-trip-types input:checked + span { background: #ffffff; color: #245b6d; font-weight: 600; }
.flight-trip-types input:focus-visible + span { outline: 2px solid #f6d69b; }
.flight-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; font-size: 11px; }
.flight-field > span:first-child { color: #edf8fa; }
.flight-field small { font-size: 10px; opacity: .65; font-weight: 400; margin-left: 5px; }
.flight-field input, .flight-field select, .flight-field textarea, #travellersTrigger { width: 100%; min-width: 0; height: 44px; border: 1px solid #ffffff59; border-radius: 6px; background: #ffffff09; color: #fff; padding: 0 12px; font-size: 12px; outline: none; color-scheme: dark; transition: border-color .2s, background .2s; }
.flight-field input::placeholder, .flight-field textarea::placeholder { color: #d5e9ed; opacity: .8; }
.flight-field select option { color: #173f4c; background: #fff; }
.flight-field textarea { padding-top: 10px; height: 76px; resize: none; }
.flight-card :is(input, select, textarea, button):focus-visible { outline: 2px solid #f6d69b; outline-offset: 2px; }
.flight-field input:focus, .flight-field textarea:focus { border-color: #fff; background: #ffffff12; }
.flight-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.flight-route { position: relative; display: grid; gap: 12px; }
.flight-input-icon { position: relative; display: block; }
.flight-input-icon svg { position: absolute; left: 13px; top: 14px; width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.flight-input-icon input { padding-left: 40px; }
#swapRouteBtn { position: absolute; z-index: 1; right: 13px; top: 57px; width: 28px; height: 28px; border-radius: 50%; background: #397f94; border: 1px solid #ffffff70; color: #fff; font-size: 19px; line-height: 1; }
#returnDateContainer.is-disabled { opacity: .4; }
.flight-travellers { position: relative; }
#travellersTrigger { display: flex; align-items: center; justify-content: space-between; text-align: left; gap: 8px; }
#travellersSummary { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#travellersPanel { position: absolute; z-index: 5; bottom: 52px; left: 0; width: 245px; padding: 16px; border: 1px solid #ffffff70; border-radius: 9px; background: #f5fafb; color: #184758; box-shadow: 0 10px 35px #063e5060; }
.flight-counter { display: flex; align-items: center; justify-content: space-between; padding: 7px 0; }
.flight-counter small { display: block; margin: 0; }
.flight-counter > div { display: flex; align-items: center; gap: 13px; }
.flight-counter button { border: 1px solid #b2ccd4; border-radius: 50%; width: 30px; height: 30px; font-size: 18px; }
.flight-counter button:disabled { opacity: .35; }
#travellersDone { width: 100%; padding: 8px; background: #235f72; color: #fff; border-radius: 5px; margin-top: 8px; }
.flight-hint { margin: 0; font-size: 11px; line-height: 1.65; color: #e1edf1; }
.flight-actions { display: flex; gap: 10px; margin-top: 15px; flex-shrink: 0; }
.flight-primary { flex: 1; min-height: 46px; border: 1px solid #fff; border-radius: 6px; color: #19566a; background: #fff; display: flex; justify-content: center; align-items: center; gap: 15px; padding: 10px 15px; font-weight: 600 !important; font-size: 12px !important; transition: background .2s; }
.flight-primary:hover { background: #e6f4f7; }
.flight-primary:disabled { opacity: .65; cursor: wait; }
#flightBack { padding: 0 13px; color: #fff; font-size: 12px; }
.flight-reassurance { font-size: 9px; text-align: center; color: #cce2e8; margin: 10px 0 0; }
#airTicketingStatus { font-size: 12px; line-height: 1.5; padding: 8px 10px; background: #6b242be6; border-radius: 5px; margin: 8px 0 0; flex-shrink: 0; }
.flight-review-route { border: 1px solid #ffffff50; background: #ffffff0b; padding: 16px; border-radius: 8px; }
.flight-review-route > span { font-size: 10px; opacity: .8; }
.flight-review-route strong { display: block; margin: 8px 0; font-size: 20px; font-weight: 500; overflow-wrap: anywhere; }
.flight-review-route p { font-size: 11px; margin: 0; }
.flight-review { display: grid; grid-template-columns: auto 1fr; gap: 10px 20px; font-size: 12px; margin: 4px 0; }
.flight-review dt { color: #cee4e9; }
.flight-review dd { margin: 0; text-align: right; overflow-wrap: anywhere; }
.flight-verification { max-width: 100%; }
.flight-success { text-align: center; padding: 25px 8px; }
.flight-success__icon { display: grid; place-items: center; margin: 0 auto 25px; width: 62px; height: 62px; font-size: 28px; border: 1px solid #ffffff80; border-radius: 50%; }
.flight-success h3 { color: #fff; font-family: inherit; font-size: 24px; font-weight: 400; }
.flight-success p { font-size: 13px; line-height: 1.8; margin: 15px 0 30px; }
.flight-success button { width: 100%; }
.flight-bottom { grid-column: 1 / -1; display: flex; justify-content: space-between; color: #ffffffbd; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.flight-honeypot, .flight-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.flight-mobile-context { display: none; }
.flight-card__heading, .flight-progress { flex-shrink: 0; }
.flight-layout { padding-top: calc(var(--flight-header-height, 88px) + 12px); padding-bottom: 20px; row-gap: 12px; }
.flight-review dd { min-width: 0; }
/* The flight surface owns its palette independently of the shared site theme. */
html body.nf-flight-page main.flight-scene :is(.flight-intro, .flight-card) { background-color: transparent !important; color: #fff !important; }
html body.nf-flight-page main.flight-scene :is(h1, h2, h3, p, strong) { color: #fff !important; }
html body.nf-flight-page main.flight-scene #air-ticketing-title,
html body.nf-flight-page main.flight-scene #flightStepTitle,
html body.nf-flight-page main.flight-scene .flight-success h3 { color: #fff !important; }
html body.nf-flight-page #airTicketingForm .flight-field :is(input, select, textarea) { background: #ffffff0c !important; color: #fff !important; border-color: #ffffff70 !important; }
html body.nf-flight-page #airTicketingForm .flight-field :is(input, textarea)::placeholder { color: #e1edf1 !important; }
html body.nf-flight-page main.flight-scene .flight-primary, html body.nf-flight-page main.flight-scene .flight-primary span { color: #19566a !important; }
@media (min-width: 701px) and (max-height: 800px) {
    .flight-card { padding: 18px 25px 14px; }
    .flight-progress { padding-bottom: 12px; margin-bottom: 14px; }
    .flight-card__heading .flight-eyebrow { display: none; }
    .flight-card h2 { margin-top: 0; }
    #airTicketingForm { margin-top: 15px; }
    .flight-step, .flight-steps { gap: 10px; }
    .flight-field { gap: 4px; }
    .flight-field textarea { height: 64px; }
    .flight-review { gap: 6px 15px; font-size: 11px; }
    .flight-review-route { padding: 10px 13px; }
    .flight-review-route strong { font-size: 18px; margin: 4px 0; }
    .flight-hint { font-size: 10px; line-height: 1.5; }
    .flight-actions { margin-top: 12px; }
    .flight-reassurance { margin-top: 7px; }
}
@media (min-width: 701px) and (max-height: 670px) {
    .flight-layout { padding-top: calc(var(--flight-header-height, 88px) + 5px); padding-bottom: 10px; grid-template-rows: minmax(0,1fr); }
    .flight-bottom, .flight-progress, .flight-card__heading > p:last-child { display: none; }
    .flight-card { padding: 14px 22px; }
    .flight-step, .flight-steps { gap: 8px; }
    .flight-field :is(input,select), #travellersTrigger { height: 40px; }
    .flight-route { gap: 8px; }
    #swapRouteBtn { top: 49px; }
    .flight-input-icon svg { top: 12px; }
    .flight-reassurance { display: none; }
}
@media (min-width: 701px) and (max-width: 950px) {
    .flight-layout { padding-inline: 24px; column-gap: 24px; grid-template-columns: minmax(0,1fr) 380px; }
    .flight-intro h1 { font-size: 38px; }
    .flight-intro__description br { display: none; }
    .flight-intro__detail { display: none; }
}
@media (max-width: 700px) {
    .flight-layout { display: flex; flex-direction: column; gap: 0; padding: calc(var(--flight-header-height, 78px) + 14px) 0 0; }
    .flight-intro, .flight-bottom { display: none; }
    .flight-scene__image { object-position: 45% 70%; }
    .flight-scene__tint { background: #0b566e40; }
    html body.nf-flight-page main.flight-scene section.flight-card { background: #f8fafb !important; color: #183e4c !important; }
    .flight-card { width: 100%; height: auto; flex: 1; border: 0; border-radius: 28px 28px 0 0; padding: 22px 24px max(16px, env(safe-area-inset-bottom)); box-shadow: 0 -8px 30px #103a4810; }
    .flight-mobile-context { display: flex; justify-content: space-between; align-items: center; color: #6b828c; font-size: 10px; letter-spacing: .13em; font-weight: 600; }
    #flightMobileCount { letter-spacing: 0; color: #19566a; padding: 4px 9px; border-radius: 20px; background: #e7eff2; }
    .flight-progress { margin: 14px 0 25px; padding: 0; border: 0; gap: 6px; }
    .flight-progress li { height: 4px; flex: 1; border-radius: 8px; background: #dfe8ec; color: transparent; font-size: 0; }
    .flight-progress li span { display: none; }
    .flight-progress li[aria-current], .flight-progress li.is-complete { background: #21647a; }
    .flight-card__heading .flight-eyebrow { display: block; font-size: 9px; letter-spacing: .13em; margin-bottom: 9px; }
    html body.nf-flight-page main.flight-scene section.flight-card :is(h2,h3,p,strong),
    html body.nf-flight-page main.flight-scene section.flight-card #flightStepTitle { color: #183e4c !important; }
    .flight-card h2 { font-size: 32px; font-weight: 500; line-height: 1.1; margin: 0 0 10px; }
    .flight-card__heading > p:last-child { font-size: 12px; line-height: 1.5; }
    #airTicketingForm { margin-top: 27px; }
    .flight-step, .flight-steps { gap: 20px; }
    .flight-field { gap: 8px; font-size: 12px; font-weight: 500; }
    .flight-field > span:first-child { color: #466371; }
    .flight-field small { font-size: 10px; }
    html body.nf-flight-page #airTicketingForm .flight-field :is(input,select,textarea) { background: #fff !important; color: #183e4c !important; border-color: #d9e4e9 !important; color-scheme: light; }
    html body.nf-flight-page #airTicketingForm .flight-field :is(input,textarea)::placeholder { color: #899ba4 !important; opacity: 1; }
    .flight-field input, .flight-field select, #travellersTrigger { height: 56px; border-radius: 12px; padding-inline: 14px; font-size: 16px; font-weight: 400; }
    .flight-field input[type="date"] { font-size: 14px; padding-inline: 9px; }
    .flight-field select { font-size: 14px; }
    .flight-field textarea { height: 140px; border-radius: 12px; font-size: 16px; padding: 13px 14px; font-weight: 400; }
    .flight-trip-types { border: 0; padding: 4px; background: #e7eef1; border-radius: 12px; margin-bottom: 3px; }
    .flight-trip-types span { padding: 11px 0; font-size: 12px; border-radius: 9px; color: #6c808b; }
    .flight-trip-types input:checked + span { color: #19566a; background: #fff; box-shadow: 0 2px 6px #254c5c12; }
    .flight-route { gap: 22px; }
    .flight-input-icon { color: #508598; }
    .flight-input-icon input { padding-left: 46px; }
    .flight-input-icon svg { left: 15px; top: 19px; width: 19px; height: 19px; }
    #swapRouteBtn { top: 74px; right: 17px; width: 34px; height: 34px; font-size: 23px; border: 3px solid #f8fafb; background: #e0edf1; color: #21647a; }
    .flight-field-grid { gap: 12px; }
    [data-step="2"] .flight-field-grid { grid-template-columns: 1fr; gap: 20px; }
    #travellersTrigger { background: #fff; border-color: #d9e4e9; color: #183e4c; font-size: 14px; }
    #travellersPanel { bottom: auto; top: 86px; width: min(280px, calc(100vw - 52px)); box-shadow: 0 12px 35px #153e4926; border-color: #d9e4e9; border-radius: 16px; }
    .flight-counter button { width: 38px; height: 38px; }
    #travellersDone { min-height: 42px; border-radius: 9px; }
    .flight-actions { padding-top: 15px; margin-top: 16px; border-top: 1px solid #e0e8ec; gap: 12px; }
    html body.nf-flight-page main.flight-scene .flight-primary { border: 0; border-radius: 14px; background: #195b71; min-height: 54px; font-size: 14px !important; color: #fff !important; box-shadow: 0 6px 16px #195b711c; }
    html body.nf-flight-page main.flight-scene .flight-primary span { color: #fff !important; }
    #flightBack { color: #245d71; border: 1px solid #d3e1e7; border-radius: 14px; min-width: 56px; font-size: 20px; }
    #flightBack span { display: none; }
    .flight-reassurance { margin-top: 12px; font-size: 10px; opacity: .65; }
    .flight-hint { color: #637d89; font-size: 11px; line-height: 1.6; }
    .flight-review-route { border: 1px solid #dce7eb; border-radius: 13px; padding: 14px; background: #edf4f6; }
    .flight-review-route > span { font-size: 10px; }
    .flight-review-route strong { font-size: 19px; margin: 5px 0; }
    .flight-review { font-size: 12px; gap: 8px 12px; }
    .flight-review dt { color: #6b828c; }
    .flight-review dd { color: #183e4c; }
    .flight-step[data-step="4"] { gap: 13px; }
    .flight-success { padding-top: 20px; }
    .flight-success__icon { color: #1d7465; background: #e3f1eb; border-color: #b9ded0; }
    html body.nf-flight-page main.flight-scene #airTicketingStatus { color: #9a2633 !important; background: #fdecef; }
}
@media (max-width: 700px) and (max-height: 740px) {
    .flight-layout { padding-top: calc(var(--flight-header-height, 78px) + 5px); }
    .flight-card { padding: 15px 20px 12px; border-radius: 23px 23px 0 0; }
    .flight-progress { margin: 10px 0 18px; }
    .flight-card h2 { font-size: 29px; margin-bottom: 7px; }
    .flight-card__heading .flight-eyebrow { display: none; }
    #airTicketingForm { margin-top: 20px; }
    .flight-step, [data-step="2"] .flight-field-grid { gap: 15px; }
    .flight-field input, .flight-field select, #travellersTrigger { height: 50px; }
    .flight-field textarea { height: 105px; }
    .flight-input-icon svg { top: 16px; }
    #swapRouteBtn { top: 68px; }
    .flight-actions { padding-top: 11px; margin-top: 10px; }
    .flight-reassurance { margin-top: 8px; }
    .flight-card[data-screen="4"] .flight-card__heading > p:last-child { display: none; }
    .flight-card[data-screen="4"] .flight-review { font-size: 11px; gap: 5px 10px; }
    .flight-card[data-screen="4"] .flight-review-route { padding: 9px 12px; }
    .flight-card[data-screen="4"] .flight-review-route strong { font-size: 17px; }
    .flight-step[data-step="4"] { gap: 8px; }
    .flight-card[data-screen="4"] .flight-hint { font-size: 10px; line-height: 1.4; }
}
/* Very short windows and an open mobile keyboard can scroll the document;
   the form never creates a nested scrolling panel or clips its controls. */
@media (max-height: 500px) {
    html:has(.nf-flight-page), body.nf-flight-page { overflow-y: auto; height: auto; }
    .flight-scene { height: auto; min-height: 100dvh; overflow: visible; }
    .flight-layout { min-height: 650px; }
}
@media (prefers-reduced-motion: no-preference) {
    .flight-step { animation: flight-enter .2s ease-out; }
    @keyframes flight-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
}