/* air_section_nav — in-page jump bar (segmented | pills | underline).
   Offset model: the theme's fixed site header publishes --header-height on :root
   (airlock_header / air_header_lp both set 100px); 80px is the fallback for
   pages without a header module. module.js writes --air-secnav-height (the
   rendered bar height) onto <html> so target sections get the right
   scroll-margin-top without any JS scroll maths. */
.air-secnav-root{
  --air-secnav-header: var(--header-height, 80px);
  --air-secnav-gap: 12px;
  --air-secnav-z: 40;
  width:100%;
}
/* additive: campaign LP layouts (base-air-header-dark-lp) render a STATIC header
   that scrolls away — nothing to clear, so the bar pins to the top of the screen. */
.air-secnav-root--no-header{--air-secnav-header: 0px;}
.air-secnav-sentinel{height:1px;margin-bottom:-1px;}

.air-secnav-wrap{width:100%;max-width:var(--inner-container-width,1024px);margin-inline:auto;}
.air-secnav-wrap--sticky{position:sticky;top:calc(var(--air-secnav-header) + var(--air-secnav-gap));z-index:var(--air-secnav-z);}
/* JS upgrade: a nav sitting alone in its own dnd_section has nothing for
   position:sticky to stick to (the containing block is only as tall as the bar),
   so module.js swaps to a pinned bar + placeholder of the same height. */
.air-secnav-wrap--pinned{height:var(--air-secnav-height,64px);}
.air-secnav-wrap--pinned.is-stuck > .air-secnav{
  position:fixed;top:calc(var(--air-secnav-header) + var(--air-secnav-gap));
  left:16px;right:16px;z-index:var(--air-secnav-z);
  max-width:var(--inner-container-width,1024px);
  /* page content slides through the gap above a pinned bar — the lift is what
     makes it read as floating over the page rather than as a broken header. */
  box-shadow:0 12px 34px rgba(21,23,86,.14);
}
.air--dark .air-secnav-wrap--pinned.is-stuck > .air-secnav{box-shadow:0 12px 34px rgba(0,0,0,.34);}

/* the bar itself — the column lives on .air-secnav-wrap (theme's ONE content column) */
.air-secnav{width:auto;}
.air-secnav--center{margin-inline:auto;}
.air-secnav--left{margin-inline:0 auto;}
.air-secnav__track{display:flex;align-items:stretch;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.air-secnav__track::-webkit-scrollbar{display:none;}
a.air-secnav__item{
  display:flex;align-items:center;justify-content:center;text-align:center;
  flex:1 1 0;min-width:max-content;white-space:nowrap;
  font-size:14px;font-weight:600;line-height:1.2;letter-spacing:-.005em;
  color:var(--air-navy,#151858);text-decoration:none;
  padding:18px 24px;transition:background-color .22s ease,color .22s ease;
}
.air-secnav a.air-secnav__item:hover{color:var(--air-blue,#396CE3);}
.air-secnav__item:focus-visible{outline:2px solid var(--air-blue,#396CE3);outline-offset:-3px;}
.air-secnav--left .air-secnav__track{justify-content:flex-start;}
.air-secnav--center .air-secnav__track{justify-content:center;}

/* ---------- segmented (default — the joined pill bar) ---------- */
.air-secnav--segmented{background:#fff;border:1px solid var(--air-lavender,#ECECFB);border-radius:10px;overflow:hidden;}
.air-secnav--segmented .air-secnav__item + .air-secnav__item{box-shadow:inset 1px 0 0 0 var(--air-lavender,#ECECFB);}
.air-secnav--segmented .air-secnav__item.is-active{
  background:var(--air-gradient-panel,linear-gradient(186deg,#1C207E 4.74%,#151858 95.23%));
  color:#fff;border-radius:9px;box-shadow:none;
}
.air-secnav--segmented .air-secnav__item.is-active + .air-secnav__item{box-shadow:none;}
/* centered = full-column bar with equal segments (the mockup); left = bar hugs its labels */
.air-secnav--segmented.air-secnav--left{width:fit-content;max-width:100%;}
.air-secnav--segmented.air-secnav--left .air-secnav__item{flex:0 0 auto;}

/* ---------- pills (separate rounded chips) ---------- */
.air-secnav--pills .air-secnav__track{gap:10px;padding:2px;}
.air-secnav--pills .air-secnav__item{
  flex:0 0 auto;background:#fff;border:1px solid var(--air-lavender,#ECECFB);
  border-radius:200px;padding:12px 22px;
}
.air-secnav--pills .air-secnav__item.is-active{
  background:var(--air-gradient-panel,linear-gradient(186deg,#1C207E 4.74%,#151858 95.23%));
  border-color:transparent;color:#fff;
}

/* ---------- underline (text + indicator) ---------- */
.air-secnav--underline{border-bottom:1px solid var(--air-lavender,#ECECFB);}
.air-secnav--underline .air-secnav__track{gap:32px;}
.air-secnav--underline .air-secnav__item{
  flex:0 0 auto;padding:14px 2px;color:var(--air-navy-soft,#3C3F7E);
  box-shadow:inset 0 -2px 0 0 transparent;transition:color .22s ease,box-shadow .22s ease;
}
.air-secnav--underline .air-secnav__item.is-active{color:var(--air-navy,#151858);box-shadow:inset 0 -2px 0 0 var(--air-navy,#151858);}

/* ---------- targets ---------- */
.air-secnav-target{scroll-margin-top:calc(var(--air-secnav-headoff, var(--header-height,80px)) + var(--air-secnav-height,0px) + 28px);}
.air-secnav-target:focus{outline:none;}

/* ---------- on-dark ----------
   Selectors carry the extra class + element so they beat the page chrome's
   `.air--dark a:not(.airbtn)` link colour (which is pear by design). */
.air--dark .air-secnav--segmented{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18);}
.air--dark .air-secnav a.air-secnav__item{color:#fff;}
.air--dark .air-secnav a.air-secnav__item:hover{color:var(--air-blue-light,#92B3FF);}
.air--dark .air-secnav a.air-secnav__item:focus-visible{outline-color:var(--air-blue-light,#92B3FF);}
.air--dark .air-secnav--segmented .air-secnav__item + .air-secnav__item{box-shadow:inset 1px 0 0 0 rgba(255,255,255,.18);}
.air--dark .air-secnav--segmented a.air-secnav__item.is-active{background:#fff;color:var(--air-navy,#151858);box-shadow:none;}
.air--dark .air-secnav--segmented .air-secnav__item.is-active + .air-secnav__item{box-shadow:none;}
.air--dark .air-secnav--pills .air-secnav__item{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18);}
.air--dark .air-secnav--pills a.air-secnav__item.is-active{background:#fff;border-color:transparent;color:var(--air-navy,#151858);}
.air--dark .air-secnav--underline{border-bottom-color:rgba(255,255,255,.18);}
.air--dark .air-secnav--underline a.air-secnav__item{color:var(--air-blue-light,#92B3FF);}
.air--dark .air-secnav--underline a.air-secnav__item.is-active{color:#fff;box-shadow:inset 0 -2px 0 0 var(--air-periwinkle,#86A8FF);}

/* ---------- mobile: scroll the bar, never wrap ---------- */
@media (max-width:767px){
  .air-secnav__item{flex:0 0 auto;padding:14px 18px;}
  .air-secnav--center .air-secnav__track{justify-content:flex-start;}
  .air-secnav-wrap--pinned.is-stuck > .air-secnav{left:16px;right:16px;}
}

@media (prefers-reduced-motion: reduce){
  .air-secnav__item{transition:none;}
}