/* ==========================================================================
   Royal Canadian Air — white, blue and navy
   ========================================================================== */

:root {
  color-scheme: light;

  --white: #ffffff;
  --mist: #eef4fa;           /* pale sky for bands and cards */
  --mist-2: #e1ebf5;
  --ink: #062441;            /* navy: headings, body text, solid buttons */
  --navy-2: #042f5d;
  --text-soft: #4a5b70;      /* body copy on white, 6.9:1 */
  --text-faint: #7c8ca0;     /* decorative numbers only */
  --line: #d9e2ec;
  --accent: #0b5faa;         /* rules, focus, links, 6.5:1 on white */
  --accent-text: #0b5faa;
  --accent-deep: #0b5faa;    /* button hover fill */
  --sky: #54aae8;            /* on navy only */
  --error: #b3261e;

  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --wide: 118%;              /* font-stretch for headings */

  --gutter: clamp(16px, 5vw, 80px);
  --maxw: 1440px;
  --hh: 128px;               /* header height, updated by JS */
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: var(--hh); background: linear-gradient(135deg, #f6fafe 0%, #deedfa 55%, #c4dff6 100%) fixed; }
body {
  margin: 0;
  background-image: radial-gradient(circle, rgba(6, 36, 65, .075) 1px, transparent 1.4px);
  background-size: 24px 24px;
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
/* The moving gradient behind the light sections (js/shader-bg.js); it stays under everything */
.shader-bg { position: fixed; inset: 0; z-index: -1; width: 100vw; height: 100lvh; max-width: none; pointer-events: none; }
/* Fine film grain over the whole page, so large white areas don't feel flat */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 400; pointer-events: none; opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img, svg, canvas, video { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { padding: 0; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; top: 8px; left: 8px; z-index: 200;
  padding: 12px 18px; background: var(--ink); color: var(--white);
  transform: translateY(-150%); transition: transform .2s var(--ease);
}
.skip-link:focus { transform: none; }

/* ---------- Shared type ---------- */
.label-caps,
.section-num {
  font-family: var(--sans);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent-text);
  margin-bottom: 14px;
}
.section-title {
  font-family: var(--display);
  font-stretch: var(--wide);
  font-weight: 600;
  font-size: clamp(2.1rem, 4.4vw, 3.9rem);
  line-height: 1.04;
  letter-spacing: -.02em;
  text-wrap: balance;
}
.section-intro {
  margin-top: 22px;
  max-width: 54ch;
  color: var(--text-soft);
  font-weight: 400;
  font-size: 1.075rem;
  line-height: 1.7;
}

/* ---------- Buttons ---------- */
.btn {
  position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: .7em;
  min-height: 50px; padding: 14px 30px;
  font-family: var(--sans); font-size: .74rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; text-decoration: none;
  border: 1px solid var(--ink); border-radius: 999px; background: transparent;
  transition: color .35s var(--ease), border-color .35s var(--ease), transform .2s var(--ease);
}
/* Fill that sweeps in from the left on hover */
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--ink);
  transform: scaleX(0); transform-origin: right center;
  transition: transform .5s var(--ease-out);
}
.btn:hover::before { transform: scaleX(1); transform-origin: left center; }
.btn:active { transform: scale(.98); }
.btn-solid { background: var(--ink); color: var(--white); }
.btn-solid::before { background: var(--accent-deep); }
.btn-solid:hover { border-color: var(--accent-deep); }
.btn-line:hover { color: var(--white); }
.btn-white { border-color: var(--white); color: var(--white); }
.btn-white::before { background: var(--white); }
.btn-white:hover { color: var(--ink); }
.btn[disabled] { opacity: .55; cursor: progress; }
.btn[disabled]::before { display: none; }
/* Small drawn arrow that slides forward on hover */
.btn-arrow {
  position: relative; display: inline-block; width: 18px; height: 1px; background: currentColor;
  transition: width .35s var(--ease-out);
}
.btn-arrow::after {
  content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px;
  border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg);
}
.btn:hover .btn-arrow, a:hover > .door-go .btn-arrow { width: 28px; }
.link-btn {
  background: none; border: 0; padding: 6px 0;
  font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px;
  transition: text-decoration-color .2s, color .2s;
}
.link-btn:hover { color: var(--accent-text); text-decoration-color: var(--accent); }

/* ---------- Loader: an aircraft circling, on a loop (js/hero.js opens it at the end of a lap) ---------- */
#loader {
  position: fixed; inset: 0; z-index: 500; display: none; align-items: center; justify-content: center;
  background: radial-gradient(circle at 50% 50%, #0d4f93 0%, #062441 68%);
  transition: opacity .6s var(--ease), visibility .6s;
}
.js #loader { display: flex; }
.js.reduced #loader { display: none; }
#loader.is-done { opacity: 0; visibility: hidden; }
.ld-orbit { position: relative; display: grid; place-items: center; width: clamp(260px, 46vmin, 400px); aspect-ratio: 1; border: 1px solid rgba(255, 255, 255, .2); border-radius: 50%; }
.ld-name { margin: 0; color: var(--white); font-family: var(--display); font-stretch: var(--wide); font-weight: 600; font-size: clamp(.9rem, 2.2vmin, 1.25rem); letter-spacing: .04em; }
.ld-arm { position: absolute; inset: -1px; animation: ld-lap 1.8s linear infinite; }
/* The vapour trail: a ring that fades out behind the aircraft */
.ld-trail {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(255, 255, 255, 0) 0 52%, rgba(159, 214, 250, .9) 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
}
/* At the top of a clockwise circle the aircraft is heading right, which is the way the drawing's nose points */
.ld-plane { position: absolute; left: 50%; top: 0; width: 58px; height: 58px; max-width: none; transform: translate(-50%, -50%); filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .35)); }
@keyframes ld-lap { to { transform: rotate(360deg); } }

/* ---------- Wordmark ---------- */
.wordmark {
  display: inline-flex; align-items: baseline; gap: .25em;
  text-decoration: none; line-height: 1; white-space: nowrap;
}
.wm-sans { font-family: var(--sans); font-weight: 300; letter-spacing: -.01em; }
.wm-bold { font-family: var(--display); font-stretch: 125%; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; font-size: .82em; }

/* ==========================================================================
   Header (numbered hairline nav, centered logo)
   ========================================================================== */
.site-header {
  position: sticky; top: 0; z-index: 100;
  /* Darker text colours, so small labels stay readable when navy sections pass under the glass */
  --accent: #062441; --accent-text: #062441; --text-faint: #062441; --text-soft: #062441;
  transition: box-shadow .3s var(--ease);
}
/* A full-width bar of glass with square edges. The layers sit on pseudo-elements so the header doesn't become the containing block for the fixed mobile menu.
   ::before bends and blurs what is behind it (js/liquid-glass.js adds the bending); ::after is the tint and the light on the rim. */
.site-header::before, .site-header::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
}
.site-header::before {
  z-index: -2;
  -webkit-backdrop-filter: blur(14px) saturate(1.7); backdrop-filter: blur(14px) saturate(1.7);
}
.lg-refract .site-header::before { -webkit-backdrop-filter: url(#lg-refract); backdrop-filter: url(#lg-refract); }
.site-header::after {
  z-index: -1;
  background:
    radial-gradient(240px 110px at var(--gx, 22%) var(--gy, 0%), rgba(255, 255, 255, var(--glint, .3)), rgba(255, 255, 255, 0) 72%),
    linear-gradient(180deg, rgba(255, 255, 255, var(--sheen, .24)) 0%, rgba(255, 255, 255, 0) 38%),
    linear-gradient(rgba(var(--tint, 255, 255, 255), var(--glass, .2)), rgba(var(--tint, 255, 255, 255), var(--glass, .2)));
}
/* Over navy sections the words turn white, as the glass is clear enough to show the navy through it (js/liquid-glass.js) */
.site-header.on-dark { --tint: 6, 36, 65; --glass: .4; --glint: .08; --sheen: .06; --rim-glow: .1; }
.site-header.on-dark .nav { --ink: #fff; --accent: #fff; --accent-text: #fff; --text-faint: #fff; --text-soft: #fff; --sky: #fff; --line: rgba(255, 255, 255, .4); color: #fff; }
.nav, .wordmark, .wm-mark, .nav-num, .nav-label, .lang-toggle { transition: color .25s var(--ease); }
/* A soft halo keeps the words clear for the moment something dark passes behind the glass */
.site-header:not(.on-dark) .nav { text-shadow: 0 0 2px rgba(255, 255, 255, .9), 0 0 9px rgba(255, 255, 255, .85); }
.site-header:not(.on-dark) .wm-mark { filter: drop-shadow(0 0 5px rgba(255, 255, 255, .8)); }
.site-header.on-dark .nav { text-shadow: 0 0 6px rgba(6, 36, 65, .7); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .site-header, .site-header.on-dark { --tint: 255, 255, 255; --glass: .94; }
  .site-header.on-dark .nav { --ink: #062441; --accent: #062441; --accent-text: #062441; --text-faint: #062441; --text-soft: #062441; --sky: #54aae8; --line: #d9e2ec; color: #062441; }
}
.scroll-progress {
  position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: linear-gradient(90deg, var(--accent), var(--sky));
  transform: scaleX(0); transform-origin: left center; pointer-events: none;
}
.nav {
  max-width: var(--maxw); margin: 0 auto;
  padding: 20px var(--gutter) 16px;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px;
}
.nav-list { display: flex; gap: clamp(14px, 1.6vw, 34px); }
.nav-right { justify-content: flex-end; }
.nav-list a {
  position: relative;
  display: flex; flex-direction: column; gap: 2px;
  min-width: clamp(88px, 8vw, 132px);
  padding: 7px 0 9px;
  border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line);
  text-decoration: none;
}
/* Blue line that draws along the bottom rule on hover */
.nav-list a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent);
  transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease-out);
}
.nav-list a:hover::after, .nav-list a.is-active::after { transform: scaleX(1); }
.nav-num { font-size: .66rem; letter-spacing: .08em; color: var(--text-faint); line-height: 1.2; transition: color .2s; }
.nav-label {
  font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  line-height: 1.3; white-space: nowrap;
}
.nav-list a:hover .nav-num, .nav-list a.is-active .nav-num { color: var(--accent-text); }

.brand { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.brand .wordmark { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.wm-tagline {
  display: flex; align-items: center; gap: 10px;
  font-size: .62rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase;
  color: var(--accent-text); white-space: nowrap;
}
.wm-tagline::before, .wm-tagline::after { content: ""; width: 22px; height: 1px; background: var(--accent); }
.lang-toggle {
  margin-top: 2px; min-width: 44px; min-height: 28px; padding: 2px 10px;
  background: none; border: 0;
  font-size: .68rem; font-weight: 700; letter-spacing: .2em;
  text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--accent);
}
.lang-toggle:hover { color: var(--accent-text); }

.menu-btn {
  display: none; align-items: center; gap: 10px;
  min-height: 44px; padding: 0; background: none; border: 0;
  font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
}
.menu-lines, .menu-lines::before { display: block; width: 26px; height: 1px; background: var(--ink); position: relative; transition: transform .3s var(--ease); }
.menu-lines::before { content: ""; position: absolute; top: 7px; }
.menu-lines { transform: translateY(-4px); }
.menu-btn[aria-expanded="true"] .menu-lines { transform: rotate(45deg); }
.menu-btn[aria-expanded="true"] .menu-lines::before { transform: translateY(-7px) rotate(-90deg); }

.mobile-menu {
  position: fixed; inset: var(--hh) 0 0 0; z-index: 99; background: var(--white);
  padding: 12px var(--gutter) calc(24px + env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain;
  display: flex; flex-direction: column; gap: 24px;
  animation: menu-in .35s var(--ease-out);
}
@keyframes menu-in { from { opacity: 0; transform: translateY(-8px); } }
.mobile-menu[hidden] { display: none; }
.mobile-list a {
  display: flex; align-items: baseline; gap: 14px; min-height: 52px; padding: 11px 0;
  border-bottom: 1px solid var(--line); text-decoration: none;
  font-family: var(--display); font-stretch: var(--wide); font-weight: 600; font-size: 1.2rem; letter-spacing: -.01em;
}
.mobile-list a[aria-current="page"] { color: var(--accent-text); }
.mobile-list li:first-child a { border-top: 1px solid var(--ink); }
.mobile-list .nav-num { font-family: var(--sans); font-stretch: 100%; font-weight: 400; }
.mobile-meta { display: flex; flex-direction: column; gap: 10px; }

@media (max-width: 1240px) {
  .nav { grid-template-columns: 1fr auto 1fr; padding-top: 16px; padding-bottom: 14px; position: relative; }
  .nav-list { display: none; }
  .brand { grid-column: 2; }
  .menu-btn { display: inline-flex; grid-column: 3; justify-self: end; }
  .brand .lang-toggle { position: absolute; left: var(--gutter); top: 50%; transform: translateY(-50%); margin: 0; }
  .wm-tagline { display: none; }
}
@media (max-width: 480px) {
  .brand .wordmark { font-size: 1.22rem; }
  .menu-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .menu-btn { min-width: 44px; justify-content: flex-end; }
}

/* ==========================================================================
   Hero: looping sky video, with a jet that flies through on scroll
   Static by default; the .js class turns on the pinned version.
   ========================================================================== */
/* Pulled up under the glass header, so the sky shows through it */
.hero-scroll { position: relative; margin-top: calc(-1 * var(--hh)); }
.stage { position: relative; display: flex; flex-direction: column; overflow: hidden; background: #3f93dc; }
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }
/* A haze behind the text, so the navy slogan and grey copy stay readable on blue sky */
.hero-veil {
  position: absolute; inset: 0; pointer-events: none;
  background: rgba(255, 255, 255, .74);
}
/* --text-t and --text-b are the real top and bottom of the text, set by js/hero.js, so this also fits French and short screens */
.js:not(.reduced) .hero-veil {
  background: linear-gradient(180deg, rgba(255,255,255,0) calc(var(--text-t, 30%) - 20vh), rgba(255,255,255,.76) var(--text-t, 30%), rgba(255,255,255,.76) var(--text-b, 70%), rgba(255,255,255,0) calc(var(--text-b, 70%) + 20vh));
}
.hero-jet { display: none; position: absolute; left: 0; top: 0; width: clamp(742px, 71.4vw, 1400px); height: auto; max-width: none; pointer-events: none; }
.hero-intro {
  position: relative; z-index: 3;
  min-height: 60svh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: calc(var(--hh) + 32px) var(--gutter) 32px;
}
.hero-title {
  font-family: var(--display); font-stretch: 125%; font-weight: 700;
  font-size: clamp(2.5rem, 7vw, 6.4rem);
  line-height: .96; letter-spacing: -.035em;
  max-width: 14ch; text-wrap: balance;
}
/* Slogan printed as halftone dots (js/halftone-title.js); the real text stays for screen readers */
.hero-title-wrap { position: relative; display: flex; justify-content: center; width: 100%; }
.hero-title.is-halftone { color: transparent; }
.hero-title-dots { position: absolute; left: 50%; top: -48px; transform: translateX(-50%); pointer-events: none; }
.hero-sub {
  margin-top: 22px; max-width: 48ch;
  font-weight: 400; font-size: clamp(1rem, 1.25vw, 1.12rem);
  color: var(--text-soft);
}
/* A soft white halo keeps the small copy readable for the moment the jet passes behind it */
.js:not(.reduced) .hero-sub { text-shadow: 0 0 2px rgba(255,255,255,.95), 0 0 8px rgba(255,255,255,.95), 0 0 16px rgba(255,255,255,.8); }
.hero-ctas { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

.js:not(.reduced) .hero-scroll { height: 160vh; }
.js:not(.reduced) .stage { position: sticky; top: 0; height: 100vh; }
.js:not(.reduced) .hero-intro {
  position: absolute; inset: 0; min-height: 0;
  justify-content: center; padding-top: var(--hh); padding-bottom: 0;
}
.js:not(.reduced) .hero-jet { display: block; will-change: transform; transform: translate(-200vw, 0); }

@media (max-width: 767px) {
  .js:not(.reduced) .hero-scroll { height: 150vh; }
  .hero-jet { width: 155vw; }
  /* A bigger slogan on phones: it may use the full width */
  .hero-title { font-size: clamp(2.5rem, 12.2vw, 3.6rem); max-width: none; }
  .hero-sub { margin-top: 16px; font-size: .98rem; }
  .hero-ctas { margin-top: 22px; gap: 10px; }
  .hero-ctas .btn { letter-spacing: .1em; padding-left: 18px; padding-right: 18px; }
}
/* Short phones (iPhone SE and similar): keep the slogan clear of the header */
@media (max-width: 767px) and (max-height: 720px) {
  .hero-title { font-size: clamp(2.2rem, 10.2vw, 3rem); }
  .hero-sub { margin-top: 12px; font-size: .92rem; line-height: 1.5; }
  .hero-ctas { margin-top: 16px; }
  .hero-ctas .btn { min-height: 44px; padding-top: 10px; padding-bottom: 10px; }
  .hero-ctas .btn { padding-left: 20px; padding-right: 20px; }
}

/* ==========================================================================
   Featured carousel (center aircraft, neighbours cropped at the edges)
   ========================================================================== */
.featured {
  position: relative;
  padding: clamp(22px, 3.5vh, 40px) 0 clamp(22px, 3.5vh, 40px); text-align: center; overflow: hidden;
}
.carousel {
  position: relative; height: clamp(110px, 12vw, 180px);
  touch-action: pan-y; user-select: none;
  --glow: #cfd3d8; --mx: 50%; --my: 60%;
}
/* Soft blue glow behind the aircraft + a light that follows the pointer */
.carousel::before {
  content: ""; position: absolute; left: 50%; bottom: -10%; width: min(40vw, 520px); height: 120%;
  transform: translateX(-50%);
  background: radial-gradient(ellipse 50% 46% at 50% 62%, var(--glow), rgba(255,255,255,0) 70%);
  opacity: .55; transition: background 1s var(--ease); pointer-events: none;
}
.carousel::after {
  content: ""; position: absolute; inset: -20% 0; pointer-events: none;
  background: radial-gradient(circle 260px at var(--mx) var(--my), rgba(255,255,255,.75), rgba(255,255,255,0) 70%);
  mix-blend-mode: soft-light;
}
.carousel:focus-visible { outline-offset: -3px; }
.carousel-watermark {
  position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-62%);
  font-family: var(--display); font-stretch: 125%; font-weight: 800; text-transform: uppercase;
  font-size: clamp(2.6rem, 8vw, 7rem); line-height: 1; letter-spacing: -.03em; white-space: nowrap;
  color: transparent; -webkit-text-stroke: 1px rgba(6,36,65,.13);
  pointer-events: none; transition: opacity .5s;
}
.carousel-track { position: absolute; inset: 0; }
.slide {
  position: absolute; left: 50%; bottom: 0;
  width: min(26vw, 370px); height: 100%;
  margin-left: calc(min(26vw, 370px) / -2);
  transition: transform .9s var(--ease), opacity .9s var(--ease);
  will-change: transform;
}
.slide button {
  width: 100%; height: 100%; padding: 0; border: 0; background: none;
  display: flex; align-items: flex-end; justify-content: center;
}
.slide img {
  width: 100%; height: 100%; object-fit: contain; object-position: center bottom; position: relative; z-index: 1;
  transition: transform .6s var(--ease-out);
}
.slide::after, .ac-media::after {
  content: ""; position: absolute; left: 12%; right: 12%; bottom: 1%; height: 9%;
  background: radial-gradient(ellipse at center, rgba(0,0,0,.3), rgba(0,0,0,0) 70%);
  z-index: 0; transition: transform .6s var(--ease-out), opacity .6s;
}
.slide[aria-hidden="true"] button { cursor: pointer; }
.slide.is-current button { cursor: zoom-in; }

/* Everything under the aircraft sits in one compact row: details | controls | price + link */
.featured-bar {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px 28px;
  width: min(100% - 2 * var(--gutter), 1080px); margin: clamp(14px, 2vh, 22px) auto 0;
  padding-top: 14px; border-top: 1px solid var(--line);
}
.carousel-controls {
  position: relative; z-index: 5;
  display: flex; align-items: center; justify-content: center; gap: clamp(10px, 2vw, 22px);
}
.carousel-arrow {
  width: 44px; height: 44px; padding: 9px 14px; background: none; border: 0;
  transition: transform .3s var(--ease-out);
}
.carousel-arrow svg { width: 100%; height: 100%; fill: none; stroke: var(--ink); stroke-width: 1.2; }
.carousel-arrow:hover svg { stroke: var(--accent-text); }
.carousel-meter { display: flex; align-items: center; gap: 12px; font-size: .68rem; letter-spacing: .14em; font-variant-numeric: tabular-nums; }
.cm-now { font-weight: 700; }
.cm-count { color: var(--text-soft); white-space: nowrap; }
.cm-count .cm-now { color: var(--ink); }
.cm-bar { position: relative; width: clamp(60px, 10vw, 120px); height: 1px; background: var(--line); }
.cm-bar i { position: absolute; inset: 0; background: var(--accent); transform: scaleX(0); transform-origin: left; }
.carousel-meter.is-running .cm-bar i { animation: meter 6s linear forwards; }
@keyframes meter { to { transform: scaleX(1); } }
.cm-play { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--white); transition: border-color .2s; }
.cm-play:hover { border-color: var(--ink); }
.cm-play { position: relative; }
.cm-play::after { content: ""; position: absolute; inset: -4px; } /* 44px tap area around the 36px circle */
.cm-play svg { width: 12px; height: 12px; fill: none; stroke: var(--ink); stroke-width: 1.6; }
.cm-play .i-play { display: none; fill: var(--ink); stroke: none; }
.cm-play[aria-pressed="true"] .i-play { display: block; }
.cm-play[aria-pressed="true"] .i-pause { display: none; }

.carousel-info { text-align: left; min-width: 0; }
.ci-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.featured-side { display: flex; align-items: center; justify-content: flex-end; gap: 16px; }
.ci-year {
  font-family: var(--display); font-stretch: 125%; font-weight: 300;
  font-size: clamp(1.2rem, 1.6vw, 1.5rem); letter-spacing: .12em; line-height: 1;
}
.ci-model {
  font-family: var(--display); font-stretch: 125%; font-weight: 700;
  font-size: .74rem; letter-spacing: .2em; text-transform: uppercase;
}
.ci-spec { white-space: pre-line; margin-top: 4px; font-size: .78rem; line-height: 1.45; letter-spacing: .02em; color: var(--text-soft); }
.ci-price { font-weight: 700; font-size: 1rem; letter-spacing: .02em; white-space: nowrap; }
.featured-bar.is-changing .ci-fade { opacity: 0; transform: translateY(6px); }
.ci-fade { transition: opacity .45s var(--ease), transform .45s var(--ease); }
.featured-all { min-height: 40px; padding: 10px 20px; font-size: .66rem; white-space: nowrap; }
/* Narrower screens: controls on top, then details, then price and link on one line */
@media (max-width: 860px) {
  .featured-bar { grid-template-columns: 1fr auto; gap: 10px 16px; }
  .carousel-controls { grid-column: 1 / -1; order: -1; }
  .carousel-info { grid-column: 1 / -1; }
  .featured-side { grid-column: 1 / -1; justify-content: space-between; }
}

@media (max-width: 699px) {
  .slide { width: 40vw; margin-left: -20vw; }
  .carousel { height: 24vw; }
}

/* ==========================================================================
   Sections
   ========================================================================== */
.section {
  max-width: var(--maxw); margin: 0 auto;
  padding: clamp(48px, 7vh, 96px) var(--gutter);
}
.band { max-width: none; background: rgba(238, 244, 250, .4); position: relative; overflow: clip; }
.band > * { max-width: calc(var(--maxw) - 2 * var(--gutter)); margin-left: auto; margin-right: auto; position: relative; }
.band::before {
  content: ""; position: absolute; width: 60vw; height: 60vw; right: -20vw; top: -25vw; border-radius: 50%;
  background: radial-gradient(circle, rgba(11,95,170,.13), rgba(11,95,170,0) 65%); pointer-events: none;
}
.section-head { margin-bottom: clamp(24px, 4vh, 44px); }

/* Scroll reveal (added by JS, so content stays visible without it) */
.will-reveal { opacity: 0; transform: translateY(26px); transition: opacity .9s var(--ease-out) var(--d, 0ms), transform .9s var(--ease-out) var(--d, 0ms); }
.will-reveal.is-in { opacity: 1; transform: none; }

/* ---------- Three doors (home) ---------- */
.doors { padding-top: clamp(40px, 6vh, 72px); }
.door-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.6vw, 24px); }
/* Each door is an aircraft cabin window, built up in layers from the cabin wall to the sky.
   The blind stays down over the jet until the pointer rests on the window. */
.door { display: flex; justify-content: center; }
.door a {
  --sky-h: clamp(215px, 22vw, 290px);
  position: relative; display: flex; flex: 1; max-width: 370px; padding: clamp(15px, 1.6vw, 22px);
  border-radius: 50% / 31%; text-decoration: none; color: var(--white);
  /* Moulded cabin plastic, lit from the upper left */
  background:
    radial-gradient(120% 70% at 22% 6%, rgba(255, 255, 255, .95), rgba(255, 255, 255, 0) 62%),
    linear-gradient(155deg, #fbfcfd 0%, #e9edf2 38%, #c8d1dc 74%, #dde3ea 100%);
  box-shadow:
    0 30px 50px -20px rgba(6, 36, 65, .46), 0 3px 5px rgba(6, 36, 65, .16),
    0 0 0 1px rgba(6, 36, 65, .07), 0 0 0 5px rgba(255, 255, 255, .28), 0 0 0 6px rgba(6, 36, 65, .06),
    inset 0 2px 2px #fff, inset 0 -3px 6px rgba(6, 36, 65, .16);
  transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
/* The step down into the opening, then the rubber seal around the glass */
.door a::before {
  content: ""; position: absolute; inset: clamp(9px, 1vw, 14px); border-radius: inherit; pointer-events: none;
  background: linear-gradient(160deg, #5e6d7c 0%, #2c3947 45%, #4a5867 100%);
  box-shadow: inset 0 2px 4px rgba(6, 36, 65, .75), inset 0 -1px 1px rgba(255, 255, 255, .35), 0 1px 0 rgba(255, 255, 255, .8), 0 -1px 0 rgba(6, 36, 65, .16);
}
/* Four fasteners in the frame */
.door a::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  --screw: radial-gradient(circle at 40% 35%, #f4f6f8 0 1px, #9aa6b2 1.6px 2.6px, rgba(6, 36, 65, .32) 3px, rgba(6, 36, 65, 0) 3.6px);
  background: var(--screw) 50% 3px / 8px 8px no-repeat, var(--screw) 50% calc(100% - 3px) / 8px 8px no-repeat, var(--screw) 3px 50% / 8px 8px no-repeat, var(--screw) calc(100% - 3px) 50% / 8px 8px no-repeat;
}
.win-pane {
  position: relative; isolation: isolate; display: flex; flex: 1; flex-direction: column; justify-content: flex-end; overflow: hidden;
  border-radius: 50% / 31%; min-height: 100%;
  padding: var(--sky-h) clamp(26px, 2.8vw, 40px) clamp(48px, 4.4vw, 62px);
  background: #3f93dc url("../assets/img/sky-poster.jpg") var(--sky-x, 50%) 0 / auto 100% no-repeat;
  text-align: center;
}
.win-jet {
  position: absolute; z-index: 2; left: 50%; top: calc(var(--sky-h) * .36); width: 88%; max-width: none; height: auto;
  transform: translateX(-50%);
  transition: transform .9s var(--ease-out);
}
/* The inner pane: reflections, and the small breather hole every cabin window has */
.win-glass {
  position: absolute; z-index: 3; inset: 0; pointer-events: none;
  background:
    radial-gradient(circle at 50% calc(var(--sky-h) * .9), #1c2a39 0 1.5px, rgba(255, 255, 255, .75) 2px 2.6px, rgba(255, 255, 255, 0) 3.4px),
    linear-gradient(118deg, rgba(255, 255, 255, 0) 16%, rgba(255, 255, 255, .26) 25%, rgba(255, 255, 255, .07) 33%, rgba(255, 255, 255, 0) 40%),
    linear-gradient(118deg, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, .13) 46%, rgba(255, 255, 255, 0) 51%);
}
/* The blind: ribbed plastic, curved toward the edges, with a grip along its bottom lip */
.win-shade {
  position: absolute; z-index: 4; left: 0; right: 0; top: 0; height: calc(var(--sky-h) - 4px); pointer-events: none;
  background:
    linear-gradient(90deg, rgba(6, 36, 65, .22) 0%, rgba(6, 36, 65, 0) 18%, rgba(6, 36, 65, 0) 82%, rgba(6, 36, 65, .22) 100%),
    linear-gradient(180deg, rgba(6, 36, 65, .16) 0, rgba(6, 36, 65, 0) 26%),
    repeating-linear-gradient(180deg, #f8f9fb 0 7px, #e7ebf0 7px 8px, #d7dde4 8px 9px);
  box-shadow: 0 7px 12px rgba(2, 16, 30, .5);
  transition: transform .75s var(--ease-out);
}
.win-shade::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 13px;
  background: linear-gradient(180deg, #fdfdfe 0%, #dfe4ea 62%, #aeb8c3 100%);
  box-shadow: 0 -1px 0 rgba(6, 36, 65, .16);
}
.win-shade::after {
  content: ""; position: absolute; left: 50%; bottom: 3px; width: 46px; height: 7px; margin-left: -23px; border-radius: 4px;
  background: linear-gradient(180deg, #8e9aa7, #c5ccd5); box-shadow: inset 0 1px 1px rgba(6, 36, 65, .5), 0 1px 0 #fff;
}
/* Depth of the opening: the inner rim and its shadow, over everything in the window */
.win-pane::after {
  content: ""; position: absolute; z-index: 6; inset: 0; border-radius: inherit; pointer-events: none;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .22), inset 0 0 0 5px rgba(4, 22, 40, .42), inset 0 12px 22px rgba(2, 16, 30, .5), inset 0 -8px 16px rgba(2, 16, 30, .35);
}
.win-text { position: relative; display: flex; flex-direction: column; align-items: center; }
.win-text > * { position: relative; z-index: 5; }
/* The sky turns to navy just above the words, however long they run */
.win-text::before {
  content: ""; position: absolute; z-index: 3; left: -100px; right: -100px; top: -64px; bottom: -100px; pointer-events: none;
  background: linear-gradient(180deg, rgba(6, 36, 65, 0) 0, #062441 56px);
}
.door-num { font-size: .75rem; font-weight: 600; letter-spacing: .14em; color: var(--sky); }
.door-title {
  margin-top: 8px;
  font-family: var(--display); font-stretch: var(--wide); font-weight: 600;
  font-size: clamp(1.3rem, 1.95vw, 1.85rem); line-height: 1.08; letter-spacing: -.015em;
}
.door-body { margin-top: 10px; max-width: 30ch; font-size: .9rem; line-height: 1.5; color: rgba(255, 255, 255, .86); }
.door-go {
  margin-top: 14px; display: inline-flex; align-items: center; gap: .8em;
  font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
}
@media (max-width: 960px) {
  .door-list { grid-template-columns: 1fr; }
  /* One window at a time: tall and narrow, the way a real cabin window is */
  .door a { --sky-h: 200px; flex: 0 1 auto; width: min(76vw, 300px); padding: 13px; }
  .door a::before { inset: 8px; }
  .win-pane { padding-left: 20px; padding-right: 20px; padding-bottom: 58px; }
  .door-list { gap: 28px; }
}

/* ---------- Sub-page header ---------- */
.page-head {
  position: relative; isolation: isolate; max-width: var(--maxw); margin: 0 auto; overflow: hidden;
  padding: clamp(28px, 5vh, 60px) var(--gutter) 0;
}
.page-head .section-title { font-size: clamp(2.4rem, 5.6vw, 4.8rem); }
.page-head-word {
  position: absolute; right: var(--gutter); top: 10%; z-index: -1;
  font-family: var(--display); font-stretch: 125%; font-weight: 800; text-transform: uppercase;
  font-size: clamp(4rem, 14vw, 13rem); line-height: 1; letter-spacing: -.03em;
  color: transparent; -webkit-text-stroke: 1px rgba(6,36,65,.07); pointer-events: none;
}
.crumb { display: flex; gap: 10px; align-items: baseline; margin-bottom: 18px; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--text-soft); }
.crumb a { text-decoration: none; border-bottom: 1px solid var(--line); }
.crumb a:hover { border-color: var(--accent); color: var(--accent-text); }
.crumb .section-num { margin: 0; }

/* ---------- Fleet ---------- */


.line-select {
  width: 100%; min-height: 44px; padding: 8px 26px 8px 0;
  border: 0; border-bottom: 1px solid var(--ink); border-radius: 0;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23062441' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right 4px center / 12px 7px;
  -webkit-appearance: none; appearance: none;
  font-size: .95rem; cursor: pointer;
  transition: border-color .2s;
}
.line-select:hover { border-bottom-color: var(--accent); }

.seg { display: flex; flex-wrap: wrap; padding: 3px; gap: 3px; background: var(--mist); border-radius: 999px; }
.seg label { position: relative; flex: 1 1 auto; }
.seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.seg span {
  display: flex; align-items: center; justify-content: center; text-align: center;
  min-height: 42px; padding: 8px 14px; border-radius: 999px;
  font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  cursor: pointer; transition: background-color .3s var(--ease), color .3s var(--ease), box-shadow .3s;
}
.seg span:hover { background: rgba(255,255,255,.7); }
.seg input:checked + span { background: var(--ink); color: var(--white); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.seg input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; position: relative; z-index: 1; }
.seg-wide span { min-height: 52px; font-size: .78rem; }
.band .seg { background: var(--white); }
.band .seg span:hover { background: var(--mist); }



@keyframes bump { from { opacity: .2; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.ac-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 28px clamp(18px, 2vw, 28px); }
.ac {
  display: flex; flex-direction: column; padding: 18px 20px 20px; border-radius: 18px;
  background: var(--white); border: 1px solid transparent;
  transition: background-color .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease), transform .4s var(--ease-out);
}
.ac-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
/* Positioned inside the frame (not sized by %) so Safari keeps the photo within the card */
.ac-media img {
  position: absolute; z-index: 1; top: 8px; right: 4px; bottom: 10px; left: 4px;
  width: calc(100% - 8px); height: calc(100% - 18px); object-fit: contain; object-position: center bottom;
  transition: transform .7s var(--ease-out);
}
.ac-badge {
  position: absolute; top: 0; left: 0; z-index: 2; padding: 4px 10px; border-radius: 999px;
  background: var(--ink); color: var(--white);
  font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
}
.ac-body { padding-top: 20px; border-top: 1px solid var(--line); margin-top: 12px; display: flex; flex-direction: column; flex: 1; }
.ac-name { margin-top: 10px; font-family: var(--display); font-stretch: 125%; font-weight: 700; font-size: .82rem; letter-spacing: .16em; text-transform: uppercase; }
.ac-specs { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 6px; font-size: .78rem; color: var(--text-soft); }
.ac-specs li { padding: 3px 10px; border-radius: 999px; background: var(--mist); line-height: 1.4; transition: background-color .4s; }
.ac-actions { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 4px 22px; }
.ac-actions a { min-height: 44px; display: inline-flex; align-items: center; }
.ac.is-highlight { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(11,95,170,.18); }

.empty { padding: 36px 0; max-width: 46ch; }
.empty h3 { font-family: var(--display); font-stretch: var(--wide); font-weight: 600; font-size: 1.6rem; letter-spacing: -.01em; }
.empty p { margin-top: 12px; color: var(--text-soft); }
.empty-actions { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 960px) {
  body.sheet-open { overflow: hidden; }
}

/* ---------- About ---------- */
.story-grid { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(24px, 4.5vw, 72px); }
.story-title { max-width: 14ch; }
.story-head { position: sticky; top: calc(var(--hh) + 32px); align-self: start; }
.story-body p { max-width: 62ch; font-size: 1.07rem; line-height: 1.8; color: #2c3e52; }
.story-body p + p { margin-top: 1.2em; }
.story-body .lede {
  font-family: var(--display); font-stretch: 108%; font-weight: 400;
  font-size: clamp(1.3rem, 1.9vw, 1.6rem); line-height: 1.5; letter-spacing: -.01em; color: var(--ink); margin-bottom: 1.1em;
}
.values { margin-top: clamp(36px, 5vh, 64px); display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 4vw, 56px); }
.values li { position: relative; border-top: 1px solid var(--line); padding-top: 22px; }
.values li::before { content: ""; position: absolute; left: 0; top: -1px; width: 40px; height: 2px; background: var(--accent); transition: width .6s var(--ease-out); }
.values li:hover::before { width: 100%; }
.values h3 { font-family: var(--display); font-stretch: 125%; font-weight: 700; font-size: .82rem; letter-spacing: .16em; text-transform: uppercase; }
.values p { margin-top: 12px; color: var(--text-soft); line-height: 1.7; max-width: 36ch; }
@media (max-width: 860px) {
  .story-grid { grid-template-columns: 1fr; }
  .story-head { position: static; }
  .values { grid-template-columns: 1fr; }
}

/* ---------- Forms ---------- */
.form-page { padding-top: clamp(28px, 5vh, 60px); }
.form-layout { display: grid; grid-template-columns: 4fr 7fr; gap: clamp(24px, 4.5vw, 72px); align-items: start; }
.form-head { position: sticky; top: calc(var(--hh) + 32px); margin-bottom: 0; }
.form-page .section-title { font-size: clamp(2.1rem, 3.8vw, 3.3rem); }
.form-note { margin-top: 20px; padding-left: 14px; border-left: 2px solid var(--accent); font-size: .9rem; color: var(--text-soft); max-width: 44ch; }
.form-img { margin-top: clamp(18px, 3vh, 36px); width: 100%; max-width: 420px; filter: drop-shadow(0 18px 16px rgba(0,0,0,.12)); }
.form-img:not([src]) { display: none; }
@media (max-width: 960px) {
  .form-layout { grid-template-columns: 1fr; }
  .form-head { position: static; }
  .form-img { max-width: 300px; }
}

.lead-form { display: flex; flex-direction: column; gap: 32px; }
.lead-form[hidden] { display: none; } /* after sending, the form really hides */
.form-layout > .form-success { grid-column: 2; }   /* the thank-you note takes the form's place, never the photo's */
@media (max-width: 960px) { .form-layout > .form-success { grid-column: 1; } }
.form-block > legend {
  display: block; width: 100%; padding-bottom: 12px; margin-bottom: 16px; border-bottom: 1px solid var(--ink);
  font-family: var(--display); font-stretch: 125%; font-weight: 700; font-size: .8rem; letter-spacing: .18em;
}
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 28px; }
.span-2 { grid-column: 1 / -1; }
@media (max-width: 600px) { .grid-2 { grid-template-columns: 1fr; } }

.field { position: relative; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.field[hidden] { display: none; }
.field > label, .field > legend { color: var(--ink); transition: color .2s; }
.field:focus-within > label { color: var(--accent-text); }
.field > legend { margin-bottom: 8px; }
.opt { font-weight: 400; letter-spacing: .06em; text-transform: none; color: var(--text-soft); }
.field input[type="text"], .field input[type="email"], .field input[type="tel"], .field input[type="date"], .field input[type="password"], .field textarea {
  width: 100%; min-height: 46px; padding: 10px 0;
  border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; background: transparent;
  font-size: 1rem; font-weight: 400;
  -webkit-appearance: none; appearance: none;
  transition: border-color .2s, box-shadow .3s var(--ease);
}
.field textarea { resize: vertical; min-height: 110px; line-height: 1.6; border: 1px solid var(--ink); border-radius: 10px; padding: 12px 14px; }
.field input::placeholder, .field textarea::placeholder { color: #8796a8; }
.field input:focus, .field textarea:focus, .field select:focus { outline: none; border-color: var(--accent); box-shadow: 0 1px 0 0 var(--accent); }
.field textarea:focus { box-shadow: inset 0 0 0 1px var(--accent); }

.check { display: flex; gap: 14px; align-items: flex-start; cursor: pointer; font-size: .95rem; line-height: 1.55; }
.check input {
  flex: 0 0 auto; width: 20px; height: 20px; margin: 2px 0 0;
  -webkit-appearance: none; appearance: none; border: 1px solid var(--ink); border-radius: 4px; background: var(--white);
  display: grid; place-content: center; cursor: pointer;
}
.check input::after { content: ""; width: 10px; height: 10px; border-radius: 2px; background: var(--ink); transform: scale(0); transition: transform .2s var(--ease-out); }
.check input:checked::after { transform: scale(1); }
.check.field { flex-direction: row; }

.field.has-error input, .field.has-error textarea, .field.has-error select { border-color: var(--error); }
.check.has-error input { border-color: var(--error); }
.field-error { color: var(--error); font-size: .85rem; line-height: 1.4; }
.check .field-error { flex-basis: 100%; }
.check.has-error { flex-wrap: wrap; }
.form-summary { padding: 14px 18px; border-left: 3px solid var(--error); background: #fbf1f0; color: var(--error); font-size: .95rem; }
.btn-submit { align-self: flex-start; min-width: 260px; }
@media (max-width: 600px) { .btn-submit { align-self: stretch; } }


.form-success {
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
  padding: 44px 0; border-top: 1px solid var(--ink);
}
.form-success:focus { outline: none; }
.form-success svg { width: 48px; height: 48px; fill: none; stroke: var(--accent); stroke-width: 1.4; }
.form-success svg path { stroke-dasharray: 40; stroke-dashoffset: 40; animation: draw .7s .15s var(--ease) forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.fs-title { font-family: var(--display); font-stretch: var(--wide); font-weight: 600; font-size: 1.8rem; letter-spacing: -.01em; }
.fs-body { color: var(--text-soft); max-width: 50ch; }

/* ---------- Visit ---------- */
@media (max-width: 860px) { .visit-grid { grid-template-columns: 1fr; } .visit-list > div { grid-template-columns: 1fr; gap: 4px; } }

/* ---------- Footer ---------- */
.site-footer {
  border-top: 1px solid var(--line);
  max-width: var(--maxw); margin: 0 auto; padding: 36px var(--gutter) 28px;
  display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center;
}
.footer-brand .wordmark { font-size: 1.5rem; }
.footer-line { font-size: .85rem; color: var(--text-soft); }
.footer-credits { font-size: .78rem; color: var(--text-soft); max-width: 70ch; }
.footer-actions { display: flex; gap: 28px; }

/* ---------- Regular photos (not cut-outs): shown as rounded, cropped pictures ---------- */
.ac-media-link { display: contents; }
.ac-name a { text-decoration: none; }
.ac-name a:hover { color: var(--accent-text); }
.ac-media.is-photo { padding: 0; border-radius: 12px; overflow: hidden; background: var(--mist); }
.ac-media.is-photo img { inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.ac-media.is-photo::after { display: none; }
.ac-media.is-photo .ac-badge { top: 10px; left: 10px; }
.slide.is-photo img { object-fit: cover; border-radius: 18px; box-shadow: 0 24px 40px rgba(0,0,0,.14); }
.slide.is-photo::after { display: none; }
/* A jet on its own, on a pane of frosted glass */
.slide.is-glass::after { display: none; }
.slide.is-glass button {
  position: relative; align-items: center; padding: 3% 4% 7%; border-radius: clamp(18px, 2vw, 30px);
  background: linear-gradient(145deg, rgba(255, 255, 255, .62), rgba(255, 255, 255, .22) 55%, rgba(255, 255, 255, .34));
  border: 1px solid rgba(255, 255, 255, .78);
  box-shadow: 0 26px 50px -22px rgba(6, 36, 65, .42), inset 0 1px 0 #fff;
}
.slide.is-glass.is-current button { -webkit-backdrop-filter: blur(14px) saturate(1.5); backdrop-filter: blur(14px) saturate(1.5); }
.slide.is-glass img { object-position: center; }
.slide-tag {
  position: absolute; z-index: 2; left: 50%; bottom: 4.5%; transform: translateX(-50%); padding: 3px 11px; white-space: nowrap;
  border-radius: 999px; background: rgba(6, 36, 65, .9); color: var(--white); font-size: .62rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
}
.form-img.is-photo { aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px; filter: none; }

/* ---------- Aircraft page ---------- */
.ac-page { padding-top: clamp(40px, 6vh, 72px); }
.ac-page-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(280px, 4fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.gallery-stage {
  position: relative; aspect-ratio: 16 / 10; border-radius: 20px; overflow: hidden;
  background: radial-gradient(ellipse 60% 50% at 50% 70%, #fff, var(--mist) 75%);
  display: grid; place-items: center; touch-action: pan-y; user-select: none;
}
.gallery-stage:focus-visible { outline-offset: 4px; }
.gallery-img { width: 100%; height: 100%; object-fit: contain; padding: 6% 6% 5%; opacity: 0; transition: opacity .45s var(--ease); }
.gallery-img.is-in { opacity: 1; }
.gallery-stage.is-photo { background: var(--ink); }
.gallery-stage.is-photo .gallery-img { padding: 0; }
.gallery-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 64px; padding: 14px 16px;
  border: 0; border-radius: 999px; background: rgba(255,255,255,.82); transition: background-color .2s;
}
.gallery-arrow:hover { background: var(--white); }
.gallery-arrow svg { width: 100%; height: 100%; fill: none; stroke: var(--ink); stroke-width: 1.4; }
.gallery-arrow.prev { left: 12px; }
.gallery-arrow.next { right: 12px; }
.gallery-count {
  position: absolute; right: 14px; bottom: 12px; padding: 3px 12px; border-radius: 999px;
  background: rgba(6,36,65,.7); color: var(--white); font-size: .75rem; letter-spacing: .08em; font-variant-numeric: tabular-nums;
}
.gallery-count:empty { display: none; }
.gallery-thumbs { display: flex; gap: 10px; margin-top: 12px; overflow-x: auto; padding: 4px 2px 8px; scrollbar-width: thin; }
.gallery-thumbs button {
  flex: 0 0 auto; width: 104px; aspect-ratio: 16 / 10; padding: 0; border: 0; border-radius: 10px; overflow: hidden;
  background: var(--mist); opacity: .6; box-shadow: 0 0 0 1px var(--line); transition: opacity .2s, box-shadow .2s;
}
.gallery-thumbs button:hover { opacity: 1; }
.gallery-thumbs button[aria-current="true"] { opacity: 1; box-shadow: 0 0 0 2px var(--ink); }
.gallery-thumbs img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.gallery-thumbs .is-photo img { object-fit: cover; padding: 0; }

.ac-summary { position: sticky; top: calc(var(--hh) + 24px); display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.ac-summary .ac-badge { position: static; margin-bottom: 10px; }
.ac-summary-name { margin-top: 10px; font-family: var(--display); font-stretch: 125%; font-weight: 700; font-size: clamp(1.1rem, 1.6vw, 1.35rem); letter-spacing: .14em; text-transform: uppercase; line-height: 1.3; }
.ac-summary-actions { margin-top: 26px; display: flex; flex-direction: column; align-items: stretch; gap: 10px; width: 100%; }
.ac-summary-actions .link-btn { align-self: flex-start; margin-top: 6px; }

.ac-details { display: grid; grid-template-columns: minmax(0, 7fr) minmax(280px, 4fr); gap: clamp(28px, 4vw, 64px); margin-top: clamp(32px, 5vh, 56px); }
.ac-details-title { padding-bottom: 12px; margin-bottom: 8px; border-bottom: 1px solid var(--ink); font-family: var(--display); font-stretch: 125%; font-weight: 700; font-size: .85rem; letter-spacing: .18em; text-transform: uppercase; }
.spec-list { display: grid; grid-template-columns: 1fr 1fr; column-gap: 32px; }
.spec-list > div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.spec-list dt { font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--text-soft); padding-top: 2px; }
.spec-list dd { text-align: right; font-weight: 500; }
.ac-description p { white-space: pre-line; color: #2c3e52; line-height: 1.8; max-width: 62ch; }
.ac-description p + p { margin-top: 1em; }
.ac-gone { min-height: 50vh; }

@media (max-width: 960px) {
  .ac-page-grid, .ac-details { grid-template-columns: 1fr; }
  .ac-summary { position: static; }
}
@media (max-width: 600px) {
  .spec-list { grid-template-columns: 1fr; }
  .gallery-arrow { width: 40px; height: 52px; padding: 12px 13px; }
  .gallery-thumbs button { width: 84px; }
}

/* ---------- Hover motion: only with a real mouse ----------
   On phones a finger touch counts as "hover", so these effects would flicker on and off while
   scrolling (cards jumping, photos sliding out of their card). Touch screens skip them. */
@media (hover: hover) and (pointer: fine) {
  .slide.is-current button:hover img { transform: translateY(-4px) scale(1.02); }
  .carousel-arrow.prev:hover { transform: translateX(-4px); }
  .carousel-arrow.next:hover { transform: translateX(4px); }
  .door a:hover { transform: translateY(-6px); }
  .door a:hover .win-shade { transform: translateY(calc(-100% + 15px)); }
  .door a:hover .win-jet { transform: translateX(-50%) scale(1.07); }
  .ac:hover { background: var(--mist); transform: translateY(-3px); }
  .ac:hover .ac-media img { transform: translateX(3%) scale(1.04); }
  .ac:hover .ac-media::after { transform: translateX(3%) scaleX(1.1); opacity: .8; }
  .ac:hover .ac-media.is-photo img { transform: scale(1.05); }
  .ac:hover .ac-specs li { background: var(--white); }
}
/* Keyboard focus lifts the blind too, on every device */
.door a:focus-visible .win-shade, .door a.is-open .win-shade { transform: translateY(calc(-100% + 15px)); }
.reduced .win-shade, .reduced .win-jet { transition: none; }

/* ---------- Touch screens: lighter rendering so scrolling stays smooth on iPhone ----------
   The page-wide grain layer forces Safari to repaint on every scroll step. */
@media (hover: none), (pointer: coarse) {
  body::after { display: none; }
}

/* ---------- Fleet cards on phones: compact, clearly framed ---------- */
@media (max-width: 600px) {
  .ac-grid { gap: 14px; }
  .ac { background: var(--mist); padding: 12px 16px 14px; border-radius: 16px; }
  .ac-media { aspect-ratio: 16 / 8; border-radius: 10px; }
  .ac-media img { top: 6px; bottom: 6px; left: 10%; right: 10%; width: 80%; height: calc(100% - 12px); }
  .ac-media.is-photo img { inset: 0; width: 100%; height: 100%; }
  .ac-body { padding-top: 14px; margin-top: 8px; }
  .ac-specs { margin-top: 10px; }
  .ac-specs li { background: var(--white); }
  .ac-actions { margin-top: 4px; gap: 0 18px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}


/* ==========================================================================
   Royal Canadian Air additions
   ========================================================================== */
.wordmark { align-items: center; gap: .32em; }
.wm-mark { width: 1.05em; height: 1.05em; flex: none; color: var(--ink); }
.wm-mark-b { fill: var(--accent); }
.wm-sans { font-weight: 400; }
.wm-bold { color: var(--accent); }
.brand .wordmark { font-size: clamp(1.15rem, 1.7vw, 1.55rem); }
.is-placeholder { border-bottom: 1px dashed var(--accent); color: var(--accent-text); text-decoration: none; }

/* Aircraft photos in the carousel are wide pictures, so the stage is tall */
.carousel { height: clamp(210px, 27vw, 430px); margin-top: clamp(10px, 2vh, 24px); }
.slide { width: min(50vw, 760px); margin-left: calc(min(50vw, 760px) / -2); }
.slide.is-photo img { aspect-ratio: auto; object-fit: cover; object-position: center 62%; }
.slide:not(.is-current):not(.is-glass) img { filter: saturate(.75); }
.carousel-watermark { top: 8%; transform: none; font-size: clamp(3rem, 12vw, 11rem); }
.featured-side .ci-price { color: var(--accent-text); }
@media (max-width: 699px) {
  .carousel { height: 50vw; }
  .slide { width: 78vw; margin-left: -39vw; }
}

/* Moving band of services */
.ticker { overflow: hidden; background: var(--ink); color: var(--white); padding: 16px 0; }
.ticker-track { display: flex; width: max-content; animation: ticker 42s linear infinite; }
.ticker:hover .ticker-track { animation-play-state: paused; }
.ticker ul { display: flex; flex: none; }
.ticker li {
  display: flex; align-items: center; gap: 34px; padding-right: 34px; white-space: nowrap;
  font-family: var(--display); font-stretch: 125%; font-weight: 600; font-size: .8rem; letter-spacing: .2em; text-transform: uppercase;
}
.ticker li::after { content: ""; width: 26px; height: 9px; background: var(--sky); transform: skewX(-32deg); }
@keyframes ticker { to { transform: translateX(-50%); } }
.reduced .ticker-track { animation: none; }


/* Services: numbered panels that turn navy on hover */
.services-band { background: var(--ink); color: var(--white); max-width: none; position: relative; overflow: clip; }
.services-band > * { max-width: calc(var(--maxw) - 2 * var(--gutter)); margin-left: auto; margin-right: auto; }
.services-band .section-num { color: var(--sky); }
.services-band .section-intro { color: rgba(255,255,255,.78); }
.service-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.14); border-radius: 18px; overflow: hidden; }
.service { position: relative; padding: clamp(24px, 2.4vw, 36px); background: var(--ink); transition: background-color .5s var(--ease); }
.service-num { font-size: .75rem; font-weight: 600; letter-spacing: .14em; color: var(--sky); }
.service h3 { margin-top: clamp(34px, 5vh, 70px); font-family: var(--display); font-stretch: var(--wide); font-weight: 600; font-size: 1.32rem; line-height: 1.15; letter-spacing: -.01em; }
.service p { margin-top: 14px; font-size: .95rem; line-height: 1.65; color: rgba(255,255,255,.76); }
@media (hover: hover) and (pointer: fine) { .service:hover { background: var(--navy-2); } }
@media (max-width: 1080px) { .service-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .service-grid { grid-template-columns: 1fr; } .service h3 { margin-top: 18px; } }

/* Team */
/* Stack of portraits with one person's words beside it (js/team.js) */
#team { overflow-x: clip; }
.tm { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: clamp(56px, 8vw, 120px); max-width: 1080px; margin-top: 88px; }
.tm-stack { position: relative; isolation: isolate; aspect-ratio: 4 / 5; }
.tm-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 24px; transform-origin: bottom; opacity: .7; scale: .95; background: var(--mist-2); user-select: none; transition: opacity .4s ease-in-out, scale .4s ease-in-out, rotate .4s ease-in-out; }
.tm-photo.is-active { opacity: 1; scale: 1; }
.tm-body { display: flex; flex-direction: column; justify-content: space-between; gap: 40px; padding-block: 16px; min-width: 0; }
.tm-text { display: grid; }
.tm-slide { grid-area: 1 / 1; visibility: hidden; }
.tm-slide.is-live { visibility: visible; animation: tm-rise .2s ease-in-out; }
.tm-name { font-family: var(--display); font-stretch: var(--wide); font-weight: 600; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.15; }
.tm-role { margin-top: 6px; color: var(--accent-text); font-size: .93rem; font-weight: 600; }
.tm-quote { margin-top: 28px; color: var(--text-soft); font-size: clamp(1.05rem, 1.5vw, 1.25rem); line-height: 1.6; }
.tm-word { display: inline-block; animation: tm-word .2s ease-in-out both; animation-delay: calc(var(--i) * 20ms); }
.tm-email { display: inline-block; margin-top: 24px; font-size: .93rem; overflow-wrap: anywhere; }
.tm-nav { display: flex; gap: 12px; }
.tm-btn { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--mist); color: var(--ink); cursor: pointer; transition: background-color .25s var(--ease), color .25s var(--ease); }
.tm-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: rotate .3s var(--ease); }
@keyframes tm-rise { from { translate: 0 20px; opacity: 0; } }
@keyframes tm-word { from { filter: blur(10px); opacity: 0; translate: 0 5px; } }
@media (hover: hover) and (pointer: fine) {
  .tm-btn:hover { background: var(--ink); color: var(--white); }
  .tm-btn[data-dir="-1"]:hover svg { rotate: 12deg; }
  .tm-btn[data-dir="1"]:hover svg { rotate: -12deg; }
}
@media (max-width: 760px) {
  .tm { grid-template-columns: minmax(0, 1fr); gap: 40px; margin-top: 96px; }
  .tm-stack { width: min(100%, 300px); margin-inline: auto; }
  .tm-body { padding-block: 0; }
}
.reduced .tm-photo, .reduced .tm-btn svg { transition: none; }
.reduced .tm-slide.is-live, .reduced .tm-word { animation: none; }

/* Offices */
.office-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: clamp(20px, 3vw, 44px); margin-top: 30px; }
.office-item { border-top: 1px solid var(--ink); padding-top: 16px; }
.office-item h3 { font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--text-soft); margin-bottom: 8px; }
.office-item p, .office-item a { font-size: 1.05rem; overflow-wrap: anywhere; }

/* Fleet page */
.fleet-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding-bottom: 16px; margin-bottom: 30px; border-bottom: 1px solid var(--ink); }
.fleet-bar .seg { flex: 0 1 auto; }
.fleet-count { font-family: var(--display); font-stretch: 125%; font-weight: 700; font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; }
.fleet-note { margin-top: 30px; padding-left: 14px; border-left: 2px solid var(--accent); font-size: .9rem; color: var(--text-soft); max-width: 78ch; }
.ac-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: clamp(18px, 2vw, 28px); }
.ac-media { aspect-ratio: 16 / 9; }
.ac-role { font-size: .7rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-text); }
.ac-name { margin-top: 8px; font-size: 1.15rem; letter-spacing: .04em; font-stretch: 125%; }
.ac-bullets { margin-top: 14px; display: grid; gap: 7px; font-size: .92rem; color: var(--text-soft); line-height: 1.45; }
.ac-bullets li { position: relative; padding-left: 18px; }
.ac-bullets li::before { content: ""; position: absolute; left: 0; top: .55em; width: 9px; height: 5px; background: var(--accent); transform: skewX(-32deg); }
.ac-actions { margin-top: auto; padding-top: 16px; }
.ac-body { gap: 0; }

/* Aircraft page */
.ac-summary-role { font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-text); }
.ac-summary-name { font-size: clamp(1.9rem, 3.4vw, 3rem); letter-spacing: -.01em; text-transform: none; font-stretch: 118%; font-weight: 600; line-height: 1.08; }
.ac-summary-lede { margin-top: 12px; color: var(--text-soft); }
.gallery-stage.is-photo { background: var(--ink); }
.gallery-stage.is-photo .gallery-img { object-fit: contain; } /* the whole picture, concept tag included */

/* Lease cards */
.lease-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 2vw, 28px); margin-top: clamp(24px, 4vh, 44px); }
.lease-card { display: flex; flex-direction: column; padding: clamp(24px, 3vw, 44px); border-radius: 20px; background: var(--mist); }
.lease-card.is-featured { background: var(--ink); color: var(--white); }
.lease-num { font-size: .75rem; font-weight: 600; letter-spacing: .14em; color: var(--accent-text); }
.is-featured .lease-num { color: var(--sky); }
.lease-card h2 { margin-top: 12px; font-family: var(--display); font-stretch: var(--wide); font-weight: 600; font-size: clamp(1.6rem, 2.6vw, 2.3rem); line-height: 1.08; letter-spacing: -.015em; }
.lease-card > p { margin-top: 16px; line-height: 1.7; color: var(--text-soft); }
.is-featured > p { color: rgba(255,255,255,.8); }
.resp { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 24px; margin: 26px 0 22px; }
.resp h3 { padding-bottom: 10px; margin-bottom: 8px; border-bottom: 1px solid currentColor; font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.resp li { padding: 5px 0; font-size: .95rem; }
.lease-card .lease-legal { margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(6,36,65,.16); font-size: .82rem; line-height: 1.5; }
.is-featured .lease-legal { border-top-color: rgba(255,255,255,.2); }
@media (max-width: 900px) { .lease-grid { grid-template-columns: 1fr; } }
@media (max-width: 460px) { .resp { grid-template-columns: 1fr; } }

/* Medevac */
.med-hero { position: relative; isolation: isolate; overflow: hidden; color: var(--white); background: var(--ink); }
.med-hero img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; animation: med-drift 24s var(--ease) infinite alternate; }
@keyframes med-drift { to { transform: scale(1.07); } }
.reduced .med-hero img { animation: none; }
.med-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(6,36,65,.95) 0%, rgba(6,36,65,.76) 48%, rgba(6,36,65,.22) 100%); }
.med-hero-inner { max-width: var(--maxw); margin: 0 auto; padding: clamp(60px, 13vh, 150px) var(--gutter); }
.med-hero .crumb, .med-hero .crumb a { color: rgba(255,255,255,.8); border-color: rgba(255,255,255,.4); }
.med-hero .section-num { color: var(--sky); }
.med-hero .section-title { max-width: 16ch; font-size: clamp(2.4rem, 5.6vw, 4.8rem); }
.med-hero .section-intro { color: rgba(255,255,255,.86); }
.med-hero .btn { margin-top: 30px; }
.mission-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--line); border-bottom: 1px solid var(--line); }
.mission-grid > li { padding: clamp(18px, 2.2vw, 30px) clamp(14px, 2vw, 28px); background: var(--white); }
.mission-grid strong { display: block; font-family: var(--display); font-stretch: 125%; font-size: clamp(1.5rem, 2.6vw, 2.4rem); line-height: 1; color: var(--accent-text); }
.mission-grid span { display: block; margin-top: 10px; font-size: .85rem; color: var(--text-soft); line-height: 1.35; }
@media (max-width: 800px) { .mission-grid { grid-template-columns: 1fr 1fr; } .mission-grid > li:last-child { grid-column: 1 / -1; } }
.med-warning { margin-top: 20px; padding: 14px 16px; border-left: 3px solid var(--error); background: #fbf1f0; color: #7d1a14; font-size: .92rem; max-width: 46ch; }

/* Footer: navy, with columns */
.site-footer { max-width: none; display: block; text-align: left; margin-top: clamp(30px, 5vh, 60px); padding: clamp(40px, 6vh, 70px) var(--gutter) 26px; border: 0; background: var(--ink); color: rgba(255,255,255,.82); }
.footer-top, .footer-note, .footer-bottom { max-width: calc(var(--maxw) - 2 * var(--gutter)); margin-inline: auto; }
.footer-top { display: grid; grid-template-columns: 2fr 1fr 1.2fr; gap: 32px clamp(24px, 5vw, 80px); }
.site-footer .wordmark, .site-footer .wm-mark { color: var(--white); }
.site-footer .wm-bold { color: var(--sky); }
.site-footer .wm-mark-b { fill: var(--sky); }
.footer-brand p { margin-top: 14px; max-width: 40ch; font-size: .95rem; }
.footer-col h2 { margin-bottom: 12px; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--white); }
.footer-col a { text-decoration: none; }
.footer-col li, .footer-col p { padding: 3px 0; font-size: .95rem; overflow-wrap: anywhere; }
.footer-col a:hover { color: var(--sky); }
.site-footer .is-placeholder { color: var(--sky); border-color: var(--sky); }
.footer-note { margin-top: 30px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.18); font-size: .84rem; }
.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 28px; margin-top: 14px; }
.footer-line, .footer-credits { color: rgba(255,255,255,.72); }
.site-footer .link-btn:hover { color: var(--sky); text-decoration-color: var(--sky); }
@media (max-width: 760px) { .footer-top { grid-template-columns: 1fr; } }
p.is-placeholder, h3.is-placeholder { display: table; }
#c-facts { grid-template-columns: 1fr; }
@media (max-width: 767px) {
  .med-hero::after { background: rgba(6,36,65,.84); }
}

/* Word-by-word text (js/reveal-text.js) */
.rt-wait { opacity: 0; }
.rt-word { display: inline-block; animation: rt-word .8s var(--ease-out) both; }
@keyframes rt-word { from { opacity: 0; transform: translateY(.9em); filter: blur(6px); } }