/* Asen FlightOps product site. Style B "Console". */

@font-face { font-family: "Questa Grande"; src: url("/assets/fonts/questa-grande-regular.otf") format("opentype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Figtree"; src: url("/assets/fonts/figtree-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Figtree"; src: url("/assets/fonts/figtree-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Figtree"; src: url("/assets/fonts/figtree-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Figtree"; src: url("/assets/fonts/figtree-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --ground: #0B1014;
  --panel: #111A20;
  --panel-2: #0E161B;
  --raised: #16222A;
  --line: #1E2B33;
  --line-2: #3A4A54;
  --text: #E6EDF1;
  --text-2: #C9D4DA;
  --text-3: #B7C4CC;
  --muted: #93A4AE;
  --faint: #6E7F89;
  --amber: #F2B544;
  --amber-bg: #3A2E12;
  --blue: #6CB6FF;
  --blue-bg: #132A3D;
  --orange: #FF9F45;
  --orange-bg: #3A2410;
  --serif: "Questa Grande", Georgia, "Times New Roman", serif;
  --sans: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --gutter: 56px;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; position: relative; background: var(--ground); color: var(--text); font-family: var(--sans); font-size: 18px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
img, svg { display: block; }
a { color: inherit; }
a:hover { color: var(--amber); }
:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; border-radius: 2px; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; margin: 0; }
h2 { font-size: clamp(34px, 4.2vw, 48px); line-height: 1.08; max-width: 16em; }
p { margin: 0; }

.skip { position: absolute; left: 16px; top: -60px; z-index: 50; background: var(--amber); color: var(--ground); padding: 10px 16px; border-radius: 3px; font-weight: 600; text-decoration: none; }
.skip:focus { top: 16px; }

.wrap { max-width: 1440px; margin: 0 auto; padding: 0 var(--gutter); }

/* Labels and buttons */
.eyebrow, .label { font-size: 13px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); margin-bottom: 14px; }
.eyebrow { font-size: 15px; letter-spacing: 0.18em; color: var(--amber); margin-bottom: 20px; }
.label--amber { color: var(--amber); }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 26px; border-radius: 3px; font: 600 16px/1 var(--sans); letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; cursor: pointer; border: 1px solid transparent; transition: background-color .15s, color .15s, border-color .15s; }
.btn--sm { min-height: 44px; padding: 0 20px; font-size: 15px; }
.btn--amber { background: var(--amber); color: var(--ground); }
.btn--amber:hover { background: #F7C668; color: var(--ground); }
.btn--ghost { border-color: var(--faint); color: var(--text); background: transparent; }
.btn--ghost:hover { border-color: var(--amber); color: var(--amber); }
.btn--block { width: 100%; }
.btn[disabled] { opacity: .6; cursor: progress; }

.chip { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; padding: 4px 9px; border-radius: 2px; white-space: nowrap; }
.chip--blocked { color: var(--orange); background: var(--orange-bg); }
.chip--open { color: var(--amber); background: var(--amber-bg); }
.chip--released { color: var(--blue); background: var(--blue-bg); }
.chip--neutral { color: var(--text-3); background: #1B2830; }

/* Header */
.site-header { position: relative; z-index: 3; display: flex; align-items: center; gap: 36px; padding: 20px var(--gutter); border-bottom: 1px solid rgba(230, 237, 241, 0.12); max-width: 1440px; margin: 0 auto; }
.brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--text); }
.brand:hover { color: var(--text); }
.brand__mark { width: 37px; height: 34px; flex: none; } /* mark with trail is 190 x 174 units */
.brand__name { font-family: var(--serif); font-size: 27px; line-height: 1; white-space: nowrap; }
.nav { display: flex; gap: 30px; flex: 1; }
.nav a { font-size: 15px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; color: var(--text-2); }
.nav a:hover { color: var(--amber); }
.header-actions { display: flex; align-items: center; gap: 14px; }
.menu { display: none; position: relative; }
.menu summary { list-style: none; width: 44px; height: 44px; display: grid; place-content: center; gap: 5px; border: 1px solid var(--line-2); border-radius: 3px; cursor: pointer; }
.menu summary::-webkit-details-marker { display: none; }
.menu summary span { display: block; width: 18px; height: 2px; background: var(--text); }
.menu__panel { position: absolute; right: 0; top: 52px; min-width: 220px; background: var(--panel); border: 1px solid var(--line-2); border-radius: 4px; padding: 8px; box-shadow: 0 20px 40px rgba(0, 0, 0, .5); }
.menu__panel a { display: block; padding: 12px 14px; text-decoration: none; font-weight: 600; font-size: 15px; letter-spacing: 0.04em; border-radius: 3px; }
.menu__panel a:hover { background: var(--raised); }

/* Hero */
.hero__photo, .hero__shade { position: absolute; left: 0; right: 0; top: 0; height: 600px; z-index: 0; pointer-events: none; }
.hero__photo { background: var(--ground) image-set(url("/assets/img/flightdeck-sunrise.webp") type("image/webp"), url("/assets/img/flightdeck-sunrise.jpg") type("image/jpeg")) center -60px / max(100%, 1440px) auto no-repeat; }
.hero__shade { height: 601px; background:
  radial-gradient(ellipse 36% 10% at 50% 55%, rgba(11,16,20,0.75) 0%, rgba(11,16,20,0) 100%),
  radial-gradient(ellipse 40% 22% at 50% 36%, rgba(11,16,20,0.35) 0%, rgba(11,16,20,0) 100%),
  linear-gradient(180deg, rgba(11,16,20,0.65) 0%, rgba(11,16,20,0) 22%, rgba(11,16,20,0.4) 36%, rgba(11,16,20,0.68) 46%, rgba(11,16,20,0.8) 58%, rgba(11,16,20,0.92) 68%, #0B1014 76%, #0B1014 100%); }
main { position: relative; z-index: 1; }
.hero { padding: 44px var(--gutter) 64px; max-width: 1440px; margin: 0 auto; }
.hero__copy { text-align: center; display: flex; flex-direction: column; align-items: center; }
.hero__copy h1 { font-size: clamp(38px, 5vw, 56px); line-height: 1.04; margin-bottom: 18px; }
.hero__lede { font-size: 18px; color: var(--text-2); max-width: 44em; margin-bottom: 24px; }
.ctas { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }

/* Sample operations workspace */
.ops { margin: 36px auto 0; max-width: 1240px; background: var(--panel); border: 1px solid var(--line-2); border-radius: 8px; box-shadow: 0 40px 80px rgba(0, 0, 0, 0.55); overflow: hidden; font-variant-numeric: tabular-nums; text-align: left; }
.ops__bar { display: flex; align-items: center; gap: 24px; min-height: 46px; padding: 0 18px; border-bottom: 1px solid var(--line); background: var(--panel-2); }
.ops__date { font-size: 14px; font-weight: 600; white-space: nowrap; }
.ops__date b { color: var(--amber); font-weight: 600; }
.ops__tabs { display: flex; gap: 22px; flex: 1; overflow-x: auto; scrollbar-width: none; }
.ops__tabs button { background: none; border: 0; border-bottom: 2px solid transparent; color: var(--muted); font: 600 13px var(--sans); letter-spacing: 0.08em; text-transform: uppercase; padding: 14px 0 12px; cursor: pointer; white-space: nowrap; }
.ops__tabs button:hover { color: var(--text); }
.ops__tabs button[aria-selected="true"] { color: var(--amber); border-bottom-color: var(--amber); }
.ops__sample { font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--faint); white-space: nowrap; }
.ops__body { display: grid; grid-template-columns: minmax(0, 1fr) 270px; min-height: 384px; }
.ops__main { position: relative; min-width: 0; }
.ops__fallback { padding: 24px; color: var(--muted); font-size: 15px; }
.ops__side { border-left: 1px solid var(--line); background: var(--panel-2); padding: 16px 18px 18px; font-size: 14px; }

/* Timeline view */
.tl { position: relative; height: 340px; margin: 0 0 0 0; }
.tl__hours { position: absolute; left: 92px; right: 12px; top: 0; bottom: 0; }
.tl__hour { position: absolute; top: 0; bottom: 0; border-left: 1px solid var(--line); }
.tl__hour span { position: absolute; left: 6px; top: 8px; font-size: 11px; font-weight: 600; letter-spacing: 0.1em; color: var(--faint); }
.tl__now { position: absolute; top: 0; bottom: 0; border-left: 2px solid var(--amber); z-index: 2; pointer-events: none; }
.tl__now span { position: absolute; left: 6px; bottom: 6px; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; color: var(--amber); white-space: nowrap; background: rgba(17, 26, 32, 0.85); padding: 1px 4px; }
.tl__row { position: absolute; left: 0; right: 0; height: 46px; }
.tl__ac { position: absolute; left: 20px; top: 13px; font-size: 14px; font-weight: 600; color: var(--text-2); }
.tl__flight { position: absolute; top: 0; height: 46px; border-radius: 3px; padding: 5px 9px; overflow: hidden; white-space: nowrap; text-align: left; cursor: pointer; font: inherit; color: var(--text); background: var(--raised); border: 1px solid var(--line-2); }
.tl__flight b { display: block; font-size: 13px; font-weight: 600; }
.tl__flight small { display: block; font-size: 12px; opacity: 0.8; }
.tl__flight:hover { border-color: var(--text-3); }
.tl__flight[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--text); }
.st-released { background: var(--blue-bg); border-color: var(--blue); }
.st-open { background: var(--amber-bg); border-color: var(--amber); }
.st-blocked { background: var(--orange-bg); border: 2px solid var(--orange); }
.st-airborne { background: #18303F; border-color: #4C86B8; }
.st-landed { background: #141E24; border-color: var(--line-2); color: var(--muted); }
.st-prep { background: var(--raised); border-color: var(--line-2); color: var(--text-2); }
.tl__mx { position: absolute; top: 0; height: 46px; border: 1px dashed var(--line-2); border-radius: 3px; padding: 5px 9px; color: var(--muted); font-size: 12px; background: repeating-linear-gradient(135deg, #16222A 0 8px, #111A20 8px 16px); overflow: hidden; white-space: nowrap; }
.tl__mx b { display: block; font-size: 13px; font-weight: 600; }

/* List view (phones, and inside other tabs) */
.list { list-style: none; margin: 0; padding: 6px 0; }
.list button { width: 100%; display: grid; grid-template-columns: 62px 74px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px 18px; background: none; border: 0; border-bottom: 1px solid var(--line); color: var(--text); font: 15px var(--sans); text-align: left; cursor: pointer; }
.list button:hover { background: var(--raised); }
.list button[aria-pressed="true"] { background: var(--raised); box-shadow: inset 3px 0 0 var(--amber); }
.list .t { color: var(--muted); }

/* Tables inside the workspace */
.view { padding: 16px 20px 20px; }
.view h3 { font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.view__note { margin-top: 12px; font-size: 13px; color: var(--faint); }
.grid-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.grid-table th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); padding: 6px 8px 8px 0; }
.grid-table td { padding: 9px 8px 9px 0; border-top: 1px solid var(--line); vertical-align: top; }
.grid-table tr.is-selected td { color: var(--amber); }
.checklist { list-style: none; margin: 0; padding: 0; }
.checklist li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 10px; align-items: start; padding: 10px 0; border-top: 1px solid var(--line); }
.checklist .n { font-size: 12px; font-weight: 600; color: var(--faint); padding-top: 2px; }
.checklist .d { display: block; font-size: 13px; color: var(--muted); }
.checklist .end { border-top: 1px solid var(--line-2); font-family: var(--serif); font-size: 20px; }
.bars { display: grid; gap: 12px; }
.bar__label { display: flex; justify-content: space-between; font-size: 14px; margin-bottom: 5px; }
.bar__label span:last-child { color: var(--muted); }
.bar__track { height: 8px; background: var(--raised); border-radius: 4px; overflow: hidden; }
.bar__fill { height: 100%; background: var(--blue); border-radius: 4px; }
.kv { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.kv div { background: var(--panel-2); border: 1px solid var(--line); border-radius: 3px; padding: 10px 12px; }
.kv span { display: block; font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.kv b { font-size: 17px; font-weight: 600; }

/* Side panel */
.side__label { font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.side__flight { font-family: var(--serif); font-size: 26px; margin: 4px 0 2px; }
.side__meta { color: var(--text-2); margin-bottom: 12px; }
.side__text { margin: 12px 0; line-height: 1.45; }
.side__list { list-style: none; margin: 6px 0 0; padding: 0; }
.side__list li { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px solid var(--line); }
.side__list li span:last-child { color: var(--blue); }

/* Sections */
.section { position: relative; border-top: 1px solid var(--line); }
#modules { border-top: 0; padding: 96px 0 88px; }
.section__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: 36px; }
.section__aside { font-size: 17px; color: var(--text-3); max-width: 26em; }
.modules { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.module { padding: 28px 28px 30px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.module--live { background: var(--panel); }
.module h3 { font-size: 26px; line-height: 1.2; margin: 18px 0 8px; }
.module p { font-size: 17px; color: var(--text-2); }
.tag { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-3); border: 1px solid var(--line-2); padding: 3px 9px; border-radius: 2px; }
.tag--live { color: var(--ground); background: var(--amber); border-color: var(--amber); }

.working { padding: 96px 0; overflow: hidden; }
.working__photo, .working__shade { position: absolute; top: 0; right: 0; bottom: 0; width: 62%; }
.working__photo { background: image-set(url("/assets/img/flightdeck-classic.webp") type("image/webp"), url("/assets/img/flightdeck-classic.jpg") type("image/jpeg")) 40% center / cover no-repeat; }
.working__shade { background: linear-gradient(90deg, #0B1014 0%, rgba(11,16,20,0.75) 30%, rgba(11,16,20,0.55) 100%); }
.working__grid { position: relative; display: grid; grid-template-columns: 420px minmax(0, 1fr); gap: 72px; align-items: start; }
.working__lede { margin: 20px 0 26px; font-size: 17px; color: var(--text-2); }
.checks { list-style: none; margin: 0; padding: 0; counter-reset: c; }
.checks li { counter-increment: c; display: flex; gap: 14px; align-items: baseline; padding: 13px 0; border-top: 1px solid var(--line); }
.checks li::before { content: "0" counter(c); font-size: 13px; font-weight: 600; color: var(--amber); }
.seatcheck { margin: 80px 0 0; background: rgba(17, 26, 32, 0.94); border: 1px solid var(--line-2); border-radius: 6px; box-shadow: 0 30px 60px rgba(0, 0, 0, 0.45); font-size: 17px; font-variant-numeric: tabular-nums; overflow: hidden; }
.seatcheck__head { display: flex; justify-content: space-between; gap: 12px; padding: 15px 24px; border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.seatcheck table { width: calc(100% - 48px); margin: 6px 24px; border-collapse: collapse; }
.seatcheck th, .seatcheck td { text-align: left; padding: 13px 8px 13px 0; font-weight: 400; }
.seatcheck thead th { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); padding: 10px 8px 8px 0; }
.seatcheck tbody tr { border-top: 1px solid var(--line); }
.seatcheck .ok { color: var(--blue); }
.seatcheck .bad { color: var(--orange); }
.seatcheck__foot { display: flex; align-items: center; gap: 14px; padding: 16px 24px; border-top: 1px solid var(--line); background: var(--ground); font-size: 16px; }

.release { min-height: 640px; overflow: hidden; display: flex; align-items: flex-end; padding: 0 0 72px; }
.release__photo, .release__shade { position: absolute; inset: 0; }
.release__photo { background: image-set(url("/assets/img/turnaround.webp") type("image/webp"), url("/assets/img/turnaround.jpg") type("image/jpeg")) right -40px top -300px / 980px auto no-repeat; }
.release__shade { background: linear-gradient(90deg, #0B1014 0%, #0B1014 38%, rgba(11,16,20,0.55) 58%, rgba(11,16,20,0.25) 100%), linear-gradient(0deg, #0B1014 0%, #0B1014 30%, rgba(11,16,20,0.5) 55%, rgba(11,16,20,0.2) 100%); }
.release__inner { position: relative; width: 100%; }
.release h2 { max-width: 20em; }
.release__lede { margin-top: 18px; font-size: 18px; color: var(--text-2); max-width: 40em; }
.sequence { list-style: none; margin: 52px 0 0; padding: 0; position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)) 190px; }
.sequence::before { content: ""; position: absolute; left: 7px; right: 10px; top: 6px; height: 2px; background: linear-gradient(90deg, var(--blue) 0%, var(--blue) 52%, var(--line-2) 52%); }
.sequence li { position: relative; display: flex; flex-direction: column; gap: 12px; }
.sequence__dot { width: 14px; height: 14px; border-radius: 50%; box-shadow: 0 0 0 4px var(--ground); }
.is-clear .sequence__dot { background: var(--blue); }
.is-open .sequence__dot { border: 2px solid var(--amber); background: var(--ground); }
.sequence__state { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.sequence__name { font-size: 17px; font-weight: 600; }
.sequence__end { align-items: flex-end; text-align: right; gap: 10px !important; }
.sequence__diamond { width: 22px; height: 22px; margin-top: -4px; transform: rotate(45deg); border: 2px solid var(--amber); background: var(--ground); box-shadow: 0 0 0 5px var(--ground); }
.sequence__release { font-family: var(--serif); font-size: 26px; line-height: 1; }
.sequence__pending { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); }

.built { min-height: 440px; overflow: hidden; display: flex; align-items: center; }
.built__photo, .built__shade { position: absolute; inset: 0; }
.built__photo { opacity: 0.6; background: image-set(url("/assets/img/apron-storm.webp") type("image/webp"), url("/assets/img/apron-storm.jpg") type("image/jpeg")) center 55% / cover no-repeat; }
.built__shade { background: linear-gradient(90deg, rgba(11,16,20,0.92) 0%, rgba(11,16,20,0.7) 45%, rgba(11,16,20,0.3) 100%), linear-gradient(0deg, rgba(11,16,20,0.6) 0%, rgba(11,16,20,0) 40%); }
.built__inner { position: relative; padding-top: 72px; padding-bottom: 72px; }
.built h2 { max-width: 13em; }
.built__inner > p:last-child { margin-top: 20px; max-width: 34em; font-size: 18px; }

.contact { padding: 96px 0; }
.contact__grid { display: grid; grid-template-columns: minmax(0, 1fr) 680px; gap: 72px; }
.contact__lede { margin: 20px 0 28px; font-size: 18px; color: var(--text-2); max-width: 30em; }
.contact__mail { margin-top: 22px; font-size: 16px; color: var(--muted); }
.form { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 32px; display: grid; gap: 18px; }
.form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.form label { display: flex; flex-direction: column; gap: 7px; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.form input, .form select, .form textarea { min-height: 46px; padding: 0 14px; border-radius: 3px; border: 1px solid var(--line-2); background: var(--ground); color: var(--text); font: 16px var(--sans); letter-spacing: 0; text-transform: none; }
.form textarea { padding: 12px 14px; resize: vertical; }
.form input:focus, .form select:focus, .form textarea:focus { outline: 2px solid var(--amber); outline-offset: 0; border-color: transparent; }
.form [aria-invalid="true"] { border-color: var(--orange); }
.form__trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form__note { font-size: 14px; color: var(--muted); }
.form__status { font-size: 15px; min-height: 1.5em; }
.form__status.is-ok { color: var(--blue); }
.form__status.is-error { color: var(--orange); }

.site-footer { border-top: 1px solid var(--line); padding: 28px 0 26px; font-size: 15px; color: var(--muted); }
.site-footer a { color: var(--text-2); }
.site-footer a:hover { color: var(--amber); }
.site-footer__top { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.site-footer__brand { display: inline-flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.site-footer__brand .brand__mark { width: 28.4px; height: 26px; }
.site-footer__brand .brand__name { font-size: 20px; color: var(--text); }
.site-footer__divider { width: 1px; height: 18px; background: var(--line-2); }
.site-footer__copy { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 13px; color: var(--faint); }
.site-footer__copy a { color: var(--faint); }

/* Simple pages (privacy, thanks, 404) */
.page { max-width: 820px; margin: 0 auto; padding: 72px 24px 96px; }
.page h1 { font-size: clamp(36px, 5vw, 52px); line-height: 1.06; margin-bottom: 18px; }
.page h2 { font-size: 28px; margin: 40px 0 12px; }
.page p, .page li { color: var(--text-2); font-size: 17px; line-height: 1.6; }
.page p + p { margin-top: 12px; }
.page ul { padding-left: 22px; }
.page .draft { border: 1px solid var(--amber); background: var(--amber-bg); color: var(--text); padding: 14px 18px; border-radius: 4px; font-size: 15px; margin-bottom: 28px; }
.simple-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 24px; border-bottom: 1px solid var(--line); max-width: 1440px; margin: 0 auto; }

/* Responsive */
@media (max-width: 1180px) {
  .nav { gap: 20px; }
  .working__grid { grid-template-columns: 1fr; gap: 0; }
  .working__photo, .working__shade { width: 100%; }
  .working__shade { background: linear-gradient(180deg, #0B1014 0%, rgba(11,16,20,0.85) 45%, rgba(11,16,20,0.75) 100%); }
  .seatcheck { margin-top: 48px; }
  .contact__grid { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 980px) {
  :root { --gutter: 24px; }
  .nav { display: none; }
  .site-header { justify-content: space-between; }
  .menu { display: block; }
  .header-actions .btn--ghost { display: none; }
  .br-wide { display: none; }
  .ops__body { grid-template-columns: 1fr; }
  .ops__side { border-left: 0; border-top: 1px solid var(--line); }
  .section__head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .modules { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sequence { grid-template-columns: 1fr; gap: 18px; }
  .sequence::before { left: 6px; right: auto; top: 8px; bottom: 60px; width: 2px; height: auto; background: linear-gradient(180deg, var(--blue) 0%, var(--blue) 55%, var(--line-2) 55%); }
  .sequence li { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 6px 14px; }
  .sequence__state { order: 3; width: 100%; padding-left: 28px; margin-top: -4px; }
  .sequence__end { align-items: center; text-align: left; flex-direction: row !important; }
  .release { min-height: 0; padding-top: 320px; }
  .release__photo { background-size: 760px auto; background-position: right -120px top -140px; }
  .kv { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  body { font-size: 17px; }
  .brand__name { font-size: 22px; }
  .brand__mark { width: 30.6px; height: 28px; }
  .header-actions .btn--amber { display: none; }
  .hero { padding-top: 32px; }
  .hero__photo { background-size: 900px auto; background-position: center -20px; }
  .modules { grid-template-columns: 1fr; }
  .form { padding: 22px; }
  .form__row { grid-template-columns: 1fr; }
  .ops__bar { flex-wrap: wrap; gap: 4px 16px; padding: 8px 14px 0; }
  .ops__tabs { order: 3; flex-basis: 100%; }
  .list button { grid-template-columns: 54px 66px minmax(0, 1fr); }
  .list button .chip { grid-column: 2 / -1; justify-self: start; }
  .seatcheck { font-size: 15px; }
  .seatcheck table { width: calc(100% - 32px); margin: 6px 16px; }
  .seatcheck__head, .seatcheck__foot { padding-left: 16px; padding-right: 16px; }
  .site-footer__divider { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Flight buttons inside tables */
.linkish { background: none; border: 0; padding: 0; color: inherit; font: 600 14px var(--sans); cursor: pointer; text-decoration: underline dotted var(--faint); text-underline-offset: 3px; }
.linkish[aria-pressed="true"] { color: var(--amber); }
.list b { font-weight: 600; }
.checklist .end .chip { font-family: var(--sans); }
.pick { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
@media (max-width: 640px) {
  .ops__tabs { gap: 16px; }
  .ops__tabs button { font-size: 12px; letter-spacing: 0.06em; }
}
/* Smaller photos on phones */
@media (max-width: 640px) {
  .hero__photo { background-image: image-set(url("/assets/img/flightdeck-sunrise-800.webp") type("image/webp"), url("/assets/img/flightdeck-sunrise-800.jpg") type("image/jpeg")); }
  .working__photo { background-image: image-set(url("/assets/img/flightdeck-classic-800.webp") type("image/webp"), url("/assets/img/flightdeck-classic-800.jpg") type("image/jpeg")); }
  .release__photo { background-image: image-set(url("/assets/img/turnaround-800.webp") type("image/webp"), url("/assets/img/turnaround-800.jpg") type("image/jpeg")); }
  .built__photo { background-image: image-set(url("/assets/img/apron-storm-800.webp") type("image/webp"), url("/assets/img/apron-storm-800.jpg") type("image/jpeg")); }
}

/* Top bar: stays visible while scrolling. Clear over the hero photo, solid once the page moves. */
html { scroll-padding-top: 96px; }
.topbar { position: sticky; top: 0; z-index: 20; transition: background-color .2s ease, box-shadow .2s ease; }
.topbar.is-scrolled, .topbar--solid { background: rgba(11, 16, 20, 0.94); box-shadow: 0 1px 0 var(--line), 0 10px 24px rgba(0, 0, 0, .35); }
@supports (backdrop-filter: blur(8px)) {
  .topbar.is-scrolled, .topbar--solid { background: rgba(11, 16, 20, 0.86); backdrop-filter: blur(10px); }
}
.topbar.is-scrolled .site-header { border-bottom-color: transparent; }
