.n365-redesign.flights {
    min-height: 100vh;
    background: #f7f8f4;
    color: #19382b;
    font: 16px/1.45 Figtree, system-ui, sans-serif;
}
.flights .trip-header { background: white; color: inherit; border-bottom: 1px solid #d8e0d8 }
.flights .n365-topbar, .flights .trip-content { width: 100%; max-width: 1060px; margin: auto; padding: 14px 20px }
.flights .n365-topbar { min-height: 64px; gap: 16px }
.flights .n365-wordmark { color: #19382b }
.flights .trip-content { padding-block: 16px 44px }
.flights .flight-search { border-radius: 14px; background: #e6eee5 }
.flights .flight-search summary {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    min-height: 44px; padding: 9px 16px; cursor: pointer; color: #23432f; font-size: 14px;
}
.flights .flight-search summary::after { content: '⌄'; font-weight: 700 }
.flights .flight-search summary::-webkit-details-marker { display: none }
.flights .flight-search summary span { margin-left: auto }
.flights .flight-controls { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; padding: 0 14px 14px }
.flights .flight-controls label { display: grid; min-width: 0; flex: 1 1 140px; gap: 3px; font-size: 12px }
.flights .flight-controls :is(select,button) { min-height: 44px; border: 1px solid #adc1b0; padding: 6px; border-radius: 8px; background: white; color: #19382b; font: inherit }
.flights .flight-controls button { cursor: pointer; padding-inline: 14px }
.flights .trip-content h1 { margin: 20px 0 12px; color: inherit; font: 600 clamp(31px,5vw,56px)/1.05 Georgia,serif; letter-spacing: -.04em }
.flights .flight-filters { display: flex; flex-wrap: wrap; gap: 6px }
.flights .flight-filters a {
    display: inline-flex; align-items: center; min-height: 40px; padding: 5px 13px;
    border: 1px solid #9bad9f; border-radius: 24px; font-size: 14px; color: inherit; text-decoration: none;
}
.flights .flight-filters a[aria-current], .flights .flight-cta { background: #193d2d; color: white }
.flights .flight-day { margin-top: 18px }
.flights .flight-day + .flight-day { margin-top: 24px }
.flights .flight-day > h2 { margin: 0 0 9px; font: 600 20px/1.2 Georgia,serif }
.flights .flight-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px }
.flights .flight-card { min-width: 0 }
.flights .flight-tile {
    position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: end;
    height: 100%; min-height: 180px; aspect-ratio: 1.7; overflow: hidden; border-radius: 15px;
    padding: 20px 18px 17px; background: #294638; color: white; text-decoration: none;
}
.flights .flight-tile:hover { color: white }
.flights .flight-photo, .flights .flight-tile::after {
    position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; object-fit: cover;
}
.flights .flight-tile::after {
    content: ''; z-index: -1;
    background: linear-gradient(180deg,transparent 6%,rgba(6,20,13,.36) 37%,rgba(5,18,14,.96));
}
.flights .flight-info { display: grid; gap: 2px; padding-right: 34px; overflow-wrap: anywhere; text-shadow: 0 1px 4px #10251ecc }
.flights .flight-country { font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .14em }
.flights .flight-info h3 { color: inherit; font: 600 clamp(29px,4vw,40px)/1.05 Georgia,serif; margin: 0 }
.flights .flight-info .flight-term { font-size: 14px }
.flights .flight-info strong { font-size: 18px; font-weight: 750 }
.flights .flight-condition, .flights .flight-route { font-size: 13px }
.flights .flight-arrow {
    position: absolute; right: 14px; bottom: 17px; border: 1px solid #ffffff88;
    border-radius: 50%; width: 34px; height: 34px; display: grid; place-items: center; font-size: 20px;
}
.flights :is(a,button,select,summary):focus-visible { outline: 3px solid #b47518; outline-offset: 3px }
.flights .flight-detail {
    position: fixed; inset: 0; margin: auto; width: min(440px,calc(100% - 24px)); max-height: 90dvh;
    padding: 26px; border: none; border-radius: 16px; background: #fbfcf9; color: #19382b;
}
.flights .flight-detail:not([open]) { display: none }
.flights .flight-detail::backdrop { background: #1025199c }
.flights .flight-detail form { float: right }
.flights .flight-detail button {
    width: 42px; height: 42px; border: 0; border-radius: 50%; background: #eff3ed; color: inherit;
    font-size: 22px; cursor: pointer;
}
.flights .flight-detail h2 { margin: 14px 0 20px; font: 600 32px/1.1 Georgia,serif }
.flights .flight-detail dl {
    display: grid; grid-template-columns: auto 1fr; gap: 10px; clear: both;
    margin: 0; border-block: 1px solid #cfdbd1; padding: 16px 0; font-size: 14px;
}
.flights .flight-detail dd { text-align: right; margin: 0; font-weight: 650 }
.flights .flight-detail p { margin: 14px 0 }
.flights .flight-cta { display: block; padding: 12px; text-align: center; text-decoration: none; border-radius: 10px; font-weight: 650 }
.flights .flight-prices, .flights .photo-credits { margin: 22px 0 0; color: #526456; font-size: 13px }
.flights .photo-credits { margin-top: 8px; overflow-wrap: anywhere }
.flights .photo-credits summary { cursor: pointer }
.flights .flight-empty { margin-top: 18px; padding: 16px; background: white; border-radius: 14px }
@media(max-width:620px) {
    .flights .flight-grid { grid-template-columns: 1fr; gap: 12px }
    .flights .n365-topbar, .flights .trip-content { padding-inline: 14px }
    .flights .trip-content { padding-top: 12px }
    .flights .trip-content h1 { margin: 17px 0 11px }
    .flights .flight-filters a { padding-inline: 10px; font-size: 13px }
    .flights .flight-search summary { font-size: 13px }
}
@media(max-width:350px) {
    .flights .flight-tile { aspect-ratio: 1.5 }
    .flights .flight-search summary { flex-wrap: wrap }
}
