/* Masthead, navigation, tab bar, footer and page frames. */

/* ---------- Floating capsule masthead ---------- */
.masthead{position:fixed;z-index:60;top:12px;left:max(14px,calc((100vw - 1400px)/2));right:max(14px,calc((100vw - 1400px)/2));height:var(--header-h);display:flex;align-items:center;gap:22px;padding:0 14px 0 20px;border:1px solid rgba(168,194,207,.6);border-radius:18px;background:rgba(252,254,255,.93);box-shadow:0 10px 34px rgba(6,31,53,.09);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);transition:box-shadow .3s,background .3s,transform .45s var(--ease)}
.masthead.is-scrolled{background:rgba(255,255,255,.97);box-shadow:0 12px 36px rgba(6,31,53,.12)}
.masthead.is-hidden{transform:translateY(calc(-100% - 20px))}
.brand{display:flex;align-items:center;flex-shrink:0}
.brand-crop{display:block;width:152px;height:30px;overflow:hidden}
.brand-crop img{width:100%;height:100%;object-fit:contain;object-position:left center}
.nav-primary{display:flex;align-items:center;gap:4px;margin-left:8px}
.nav-link{position:relative;display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 12px;border-radius:10px;font-size:.875rem;font-weight:500;color:var(--ink-2);transition:background .2s,color .2s}
.nav-link svg.i{width:17px;height:17px;color:var(--muted);transition:color .2s}
.nav-link:hover{background:var(--wash);color:var(--navy)}
.nav-link.is-active{color:var(--navy);font-weight:600}
.nav-link.is-active svg.i{color:var(--blue)}
.nav-link.is-active::after{content:'';position:absolute;left:12px;right:12px;bottom:3px;height:2px;border-radius:2px;background:var(--blue)}
.nav-actions{display:flex;align-items:center;gap:6px;margin-left:auto}
.nav-util{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 11px;border-radius:10px;font-size:.8125rem;font-weight:500;color:var(--ink-2);white-space:nowrap;transition:background .2s}
.nav-util svg.i{width:17px;height:17px;color:var(--blue-dark)}
.nav-util:hover{background:var(--wash)}
.nav-sep{width:1px;height:22px;background:var(--line);margin-inline:4px}
.currency-btn{font-weight:600}
.account-btn{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 12px;border-radius:12px;background:var(--navy);color:#fff;font-size:.8125rem;font-weight:600;transition:background .2s}
.account-btn:hover{background:var(--navy-3)}
.account-btn svg.i{width:17px;height:17px}
.avatar{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#30a8ed,#0666a4);color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.02em}
.account-btn.is-user{padding-left:6px;background:#fff;color:var(--navy);border:1px solid var(--line)}
.menu-btn{display:none}

/* Dropdown menus (More, currency, account) */
.dropdown{position:relative}
.dropdown-panel{position:absolute;top:calc(100% + 10px);right:0;min-width:230px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .25s var(--ease),visibility .2s;z-index:70}
.dropdown.is-open .dropdown-panel{opacity:1;visibility:visible;transform:none}
.dropdown-panel.align-left{left:0;right:auto}
.menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:10px;font-size:.875rem;text-align:left;color:var(--ink);transition:background .15s}
.menu-item:hover,.menu-item:focus-visible{background:var(--wash)}
.menu-item svg.i{width:18px;height:18px;color:var(--blue-dark)}
.menu-item small{display:block;font-size:.72rem;color:var(--muted);font-weight:400}
.menu-item .grow b{font-weight:600}
.menu-item.is-active{background:var(--blue-soft)}
.menu-item.is-active::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--blue);margin-left:auto}
.menu-head{padding:10px 12px 6px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:600}
.menu-sep{height:1px;background:var(--line);margin:6px 4px}
.more-panel{min-width:300px}

/* ---------- Main view frame ---------- */
#main{display:block;min-height:100vh;outline:none} /* keeps the footer below the fold while a view renders (no layout shift) */
#main.view-enter{animation:fade-in .35s var(--ease)}
.page{padding-top:calc(var(--header-h) + 34px);padding-bottom:64px;min-height:70vh}
.page-flat{padding-top:calc(var(--header-h) + 24px)}

/* Navy band used by results & inner pages */
.band{position:relative;isolation:isolate;overflow:hidden;background:var(--navy-grad);color:#fff}
.band::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 18% -20%,rgba(48,168,237,.28),transparent 55%),radial-gradient(ellipse at 90% 120%,rgba(12,131,206,.22),transparent 50%)}
.band h1,.band h2,.band h3{color:#fff}
.page-hero{padding:calc(var(--header-h) + 58px) 0 48px}
.page-hero .display{font-size:clamp(2rem,4vw,3.4rem);max-width:820px}
.page-hero p{color:#c3d5df;max-width:640px;margin-top:14px}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.78rem;color:#9fbccd;margin-bottom:18px}
.crumbs a:hover{color:#fff}
.crumbs svg.i{width:14px;height:14px}
.crumbs.on-light{color:var(--muted)}
.crumbs.on-light a:hover{color:var(--navy)}

/* ---------- Mobile tab bar ---------- */
.tabbar{display:none}

/* ---------- Mobile drawer ---------- */
.drawer{position:fixed;inset:0;z-index:120;display:flex;justify-content:flex-end;visibility:hidden}
.drawer.is-open{visibility:visible}
.drawer-scrim{position:absolute;inset:0;background:rgba(4,17,30,.45);opacity:0;transition:opacity .3s}
.drawer.is-open .drawer-scrim{opacity:1}
.drawer-panel{position:relative;width:min(420px,100%);height:100%;background:#fff;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .45s var(--ease);overflow:hidden}
.drawer.is-open .drawer-panel{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 14px 20px;border-bottom:1px solid var(--line-2)}
.drawer-body{flex:1;overflow-y:auto;padding:18px 18px calc(28px + var(--safe-b));-webkit-overflow-scrolling:touch}
.drawer-user{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;background:var(--navy-grad);color:#fff;margin-bottom:18px}
.drawer-user .avatar{width:40px;height:40px;font-size:.9rem}
.drawer-user small{display:block;color:#a8c6d8;font-size:.75rem}
.service-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.service-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:74px;padding:10px 2px;border-radius:14px;background:var(--wash);font-size:.64rem;font-weight:600;text-align:center;line-height:1.25;color:var(--ink);transition:background .2s,transform .2s}
.service-tile svg.i{width:24px;height:24px;color:var(--blue-dark)}
.service-tile:active{transform:scale(.97)}
.service-tile.is-active{background:var(--blue-soft);box-shadow:inset 0 0 0 1.5px var(--blue-line)}
.drawer-links{display:grid;margin-top:18px}
.drawer-links a,.drawer-links button{display:flex;align-items:center;gap:12px;padding:13px 6px;border-bottom:1px solid var(--line-2);font-size:.9rem;text-align:left}
.drawer-links svg.i{width:19px;height:19px;color:var(--muted)}
.drawer-links svg.i:last-child{margin-left:auto;width:16px;height:16px}
.drawer-support{margin-top:20px;padding:16px;border-radius:14px;border:1px solid var(--line);display:grid;gap:10px}

/* ---------- Footer ---------- */
.footer{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 35% 0%,#113d57 0%,#061f35 55%);color:#fff}
.footer-top{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding-block:clamp(56px,8vw,96px) 48px}
.footer-top h2{color:#fff;font-size:clamp(2.2rem,4.4vw,4.1rem);font-weight:500;line-height:1.05;letter-spacing:-.055em;margin-top:16px}
.footer-top h2 em{color:#cfe7f3}
.footer-grid{display:grid;grid-template-columns:1.25fr repeat(3,1fr);gap:36px;padding-block:40px;border-top:1px solid rgba(255,255,255,.14)}
.footer-col h3{color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px}
.footer-col a,.footer-col button{display:block;padding:5px 0;font-size:.875rem;color:#b7c9d3;text-align:left;transition:color .2s}
.footer-col a:hover,.footer-col button:hover{color:#fff}
.footer-contact{display:grid;gap:12px;font-size:.875rem;color:#c5d6df}
.footer-contact a,.footer-contact div{display:flex;align-items:flex-start;gap:10px}
.footer-contact svg.i{width:18px;height:18px;color:var(--blue-glow);margin-top:2px}
.footer-routes{display:grid;gap:14px;padding-block:28px;border-top:1px solid rgba(255,255,255,.14);font-size:.8125rem}
.footer-routes>div{display:flex;gap:10px 14px;flex-wrap:wrap;align-items:baseline}
.footer-routes b{color:#fff;font-weight:600;white-space:nowrap}
.footer-routes a{color:#a9bfcc;white-space:nowrap}
.footer-routes a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.footer-wordmark-mask{overflow:hidden;margin-top:6px}
.footer-wordmark{font-family:var(--serif);font-size:21vw;line-height:1.05;letter-spacing:-.066em;text-align:center;white-space:nowrap;margin:0 20px;background:linear-gradient(100deg,#f8fdff,#a4c9dd 55%,#e6f6ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;transform:translateY(var(--footer-y,18%));transition:transform 1.2s var(--ease)}
.footer-wordmark.is-in{--footer-y:0%}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;padding-block:22px calc(22px + var(--tabbar-h));border-top:1px solid rgba(255,255,255,.14);font-size:.75rem;color:#9fb6c4}
.footer-bottom a:hover,.footer-bottom button:hover{color:#fff}
.proto-pill{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.2);color:#cfe3ee;font-size:.7rem;letter-spacing:.02em}
.proto-pill::before{content:'';width:7px;height:7px;border-radius:50%;background:#35d399;box-shadow:0 0 0 3px rgba(53,211,153,.2)}

/* Booking steps keep the footer to its legal strip. */
body.flow-mode .footer-top,body.flow-mode .footer-grid,body.flow-mode .footer-routes,body.flow-mode .footer-wordmark-mask{display:none}

/* ---------- Brand intro (from the editorial build, trimmed) ---------- */
html.intro-pending body{overflow:hidden}
html.intro-pending.intro-running #brand-intro{background:transparent}
#brand-intro{isolation:isolate;overflow:hidden;touch-action:none}
.intro-curtain{position:absolute;inset:0;background:#fff;transform-origin:50% 0;will-change:transform}
.intro-full-logo{position:absolute;left:0;top:0;width:410px;aspect-ratio:959/190;transform-origin:0 0;z-index:3;will-change:transform;visibility:hidden}
.intro-full-logo img{display:block;width:100%;height:100%;object-fit:contain;clip-path:inset(0 100% 0 0)}
.intro-aircraft{position:absolute;top:0;left:0;width:33px;height:33px;z-index:4;opacity:0;transform-origin:50% 50%;color:#1687cc;will-change:transform}
.intro-aircraft svg{display:block;width:100%;height:100%;fill:#f8fcff;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.intro-connection{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:2;pointer-events:none;opacity:0}
.intro-connection path{fill:none;stroke:#1687cc;stroke-width:1;stroke-linecap:round;vector-effect:non-scaling-stroke}
.intro-skip{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:5;min-height:44px;display:flex;align-items:center;gap:12px;padding:10px 14px;background:#ffffffed;border:1px solid #e4ebef;border-radius:10px;font-size:.8125rem;color:#425c6b;opacity:0;transition:background .2s,opacity .3s}
.intro-skip svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.intro-skip:focus-visible{opacity:1!important}
html.intro-pending .masthead{opacity:0;transition:none}
html.intro-pending .masthead .brand{visibility:hidden}
html.intro-pending.intro-revealing .masthead{opacity:1}
html.intro-pending.intro-landed .masthead .brand{visibility:visible}
html.intro-pending:not(.intro-revealing) .hero-photo,
html.intro-pending:not(.intro-revealing) .hero-wordmark>span,
html.intro-pending:not(.intro-revealing) .hero .line>span,
html.intro-pending:not(.intro-revealing) .hero-sub{animation-play-state:paused!important}
@media(max-width:600px){.intro-aircraft{width:27px;height:27px}.intro-skip{right:16px;font-size:.75rem}}
@media(prefers-reduced-motion:reduce){.intro-aircraft,.intro-connection{display:none}}

/* ---------- Responsive ---------- */
@media(max-width:1240px){
  .nav-util .util-label{display:none}
  .nav-util{padding:0 9px}
}
@media(max-width:1080px){
  .nav-link{padding:0 9px}
  .nav-link svg.i{display:none}
}
@media(max-width:959px){
  :root{--header-h:56px;--tabbar-h:calc(64px + var(--safe-b))}
  .masthead{top:8px;left:10px;right:10px;padding:0 6px 0 14px;border-radius:16px;gap:8px}
  .brand-crop{width:128px;height:26px}
  .nav-primary,.nav-util.hide-m,.nav-sep{display:none}
  .account-btn{width:40px;padding:0;justify-content:center;border-radius:12px}
  .account-btn .acc-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .account-btn.is-user{background:#fff;border:0}
  .menu-btn{display:inline-grid}
  .currency-btn .cur-label{display:none}
  .tabbar{position:fixed;z-index:55;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,1fr);height:var(--tabbar-h);padding-bottom:var(--safe-b);background:rgba(255,255,255,.97);border-top:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 -6px 24px rgba(6,31,53,.06)}
  .tab-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:.66rem;font-weight:600;color:var(--muted);letter-spacing:.01em;position:relative}
  .tab-item svg.i{width:22px;height:22px;stroke-width:1.6}
  .tab-item.is-active{color:var(--navy)}
  .tab-item.is-active svg.i{color:var(--blue)}
  .tab-item.is-active::before{content:'';position:absolute;top:0;width:28px;height:3px;border-radius:0 0 3px 3px;background:var(--blue)}
  body.flow-mode .tabbar,body.has-mobile-cta .tabbar{display:none}
  body.flow-mode,body.has-mobile-cta{--tabbar-h:0px}
  #main{padding-bottom:var(--tabbar-h)}
  .page{padding-top:calc(var(--header-h) + 24px);padding-bottom:40px}
  .page-hero{padding:calc(var(--header-h) + 40px) 0 34px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
  .footer-grid .footer-col:first-child{grid-column:1/-1}
  .footer-top{flex-direction:column;align-items:flex-start}
}
@media(max-width:520px){
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-bottom{flex-direction:column;align-items:flex-start}
  .footer-wordmark{font-size:23vw;margin:0 8px}
}
@media print{
  .masthead,.tabbar,.footer,#overlay-root,.toast-root,.no-print{display:none!important}
  .page{padding-top:0}
  body{background:#fff}
}

/* Careers entry point (links to the dedicated careers.html page) */
.nav-careers .nav-badge{margin-left:2px;padding:3px 7px;border-radius:999px;background:var(--blue-soft);color:var(--blue-dark);font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1}
/* keep the one-row header fitting now that Careers is in it (trimmed in steps as the window narrows) */
@media(max-width:1440px){.nav-careers .nav-badge{display:none}}
@media(max-width:1400px){.nav-link{padding:0 9px}}
@media(max-width:1340px){.nav-util[href^="tel:"] .util-label{display:none}}
@media(max-width:1240px){.nav-link svg.i{display:none}}
@media(max-width:1000px){.nav-link{padding:0 6px}.currency-btn .cur-label{display:none}}
.drawer-links a.drawer-careers{margin:0 0 8px;padding:14px 12px;border:1px solid var(--blue-line);border-radius:14px;background:var(--blue-soft);color:var(--ink);font-weight:600}
.drawer-links a.drawer-careers svg.i{color:var(--blue-dark)}
.drawer-careers small{display:block;font-size:.75rem;font-weight:400;color:var(--muted);margin-top:2px}