/* On-Demand Jet Charter — aircraft window centrepiece */
.charter {
  max-width: var(--content-width);
  margin: 0 auto;
  padding: clamp(56px, 8vw, 128px) var(--gutter);
  box-sizing: border-box;
}
.charter-head { text-align: center; }
.charter-eyebrow { color: var(--prism-teal); }
.charter-title {
  font-family: var(--font-display);
  letter-spacing: var(--display-tracking);
  font-weight: var(--display-weight);
  font-size: var(--h3-size);
  line-height: var(--display-leading);
  color: var(--prism-band-text);
  max-width: 11.5em;
  margin: 0 auto 22px;
}
.charter-sub {
  max-width: 1040px; /* always wider than the headline */
  margin: 0 auto;
  font-size: 19px;
  color: var(--prism-band-text-body);
}

.charter-stage {
  display: grid;
  grid-template-columns: minmax(300px, 560px) 1fr;
  gap: clamp(32px, 6vw, 112px);
  align-items: center;
  margin-top: clamp(24px, 4vw, 56px);
}
.charter-text { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
.charter-btn { margin-top: 10px; background: var(--prism-band-text); color: var(--prism-ink); }
.charter-btn:hover { background: #fff; }
.charter-copy {
  margin: 0;
  max-width: 36em;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 19px;
  line-height: 1.75;
  letter-spacing: -0.011em;
  color: var(--prism-band-text-body);
}
.charter-copy em { font-style: normal !important; color: #fff; font-weight: 500; }

/* ---- aircraft window (frame image with a transparent opening; the video sits behind it) ---- */
.cw { --w: .5; position: relative; z-index: 1; width: 100%; max-width: 560px; margin: 0 auto; }
.cw-win {
  position: relative;
  width: 100%;
  aspect-ratio: var(--ar);
  transform: scale(calc(.96 + var(--w) * .08)); /* --w (0..1) is set by assets/js/window.js as you scroll */
}
.cw-view {
  position: absolute;
  left: calc(var(--hx) - .4%); top: calc(var(--hy) - .4%);
  width: calc(var(--hw) + .8%); height: calc(var(--hh) + .8%);
  overflow: hidden;
  border-radius: 46% / 32%;
  background: #2a3138;
}
.cw-video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #2a3138;
  transform: translateY(calc((var(--w) - .5) * -6%)) scale(1.12);
}
.cw-frame {
  position: relative; display: block; width: 100%; height: 100%; max-width: none; pointer-events: none;
  /* feather the image's black backdrop into the page */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 90%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 90%, transparent 100%);
  mask-composite: intersect;
}
@media (prefers-reduced-motion: reduce) { .cw-video, .cw-win { transform: none; } }

@media (max-width: 860px) {
  .charter-stage { grid-template-columns: 1fr; }
  .cw { max-width: 420px; }
  .charter-copy { max-width: none; }
}