/* ============================================================
   ZINO AVIATION — SECTION TYPE SCALE
   Dara: "make sure that all sections in all pages have the same
   font and font size for the main header, sub header and the body
   copy for each section so there's similarities. This does not
   affect the title cards."

   One rank per role, declared once. Loaded LAST on every page so
   it always settles the cascade — style.css, pages.css and
   type-luxury.css had each grown their own section sizes and they
   had drifted apart (h2 ran 36px to 56px, sub headers 15px to 39px,
   body copy 14.4px to 18px depending on the page).

   Card type is deliberately untouched: .principle-card, .service-card,
   .acq-bento-card, .acq-point-card and friends keep their own sizes.
   ============================================================ */

:root{
  /* 52.8px at a 1440 viewport */
  --t-title:    clamp(2rem, 3.85vw, 3.3rem);
  /* the same 52.8px on a 900px-tall screen, stepping down on shorter
     ones — the pinned full-screen panels have to hold one viewport */
  --t-title-vh: clamp(1.7rem, 5.87vh, 3.3rem);

  /* sub header: 31px at 1440, a clear rank under the title */
  --t-sub:      clamp(1.25rem, 2.15vw, 1.94rem);
  --t-sub-vh:   clamp(1.05rem, 3.45vh, 1.94rem);

  /* the tertiary line some sections carry under the sub header — it
     tracks the sub header down so it never crowds it on a phone */
  --t-subtle:   clamp(15.5px, 1.32vw, 19px);

  --t-body:     17px;
  --t-body-lh:  1.78;
}

/* ─── 1. Section title ─────────────────────────────────────── */
main h2,
main .sp-head h2,
main h2.sp-head,
main .sp-cta h2,
body.acq-page main h2,
body.acq-page .sp-head h2,
body.acq-page .sp-cta h2,
body.acq-page .acq-showcase-title,
body.acq-page .acq-ed-title,
.section h2,
.confidence-title,
.pexpand-title,
.journey-title,
.revenue-head h2,
.acq-inc-head h2 {
  font-family: var(--serif);
  font-size: var(--t-title);
  line-height: 1.1;
  font-weight: 400;
  letter-spacing: -0.012em;
}

/* Titles inside a pinned panel that must fit exactly one screen */
.jvpage--center .acq-diff-head h2,
body.acq-page .acq-includes .acq-inc-head h2,
.acq-includes .acq-inc-head h2,
.ch-stmt-title,
main .ch-stmt-title {
  font-size: var(--t-title-vh);
  line-height: 1.06;
}

/* Exemptions — compositions whose size is load-bearing, not a rank.
   The rotating headline is sized so even the longest phrase still holds
   one line beside its gold plate; the portal heading is panel chrome. */
main h2.jc-rotate-head { font-size: clamp(1.55rem, 3.05vw, 2.72rem); line-height: 1.24; }
main .ch-form-head h2  { font-size: clamp(1.5rem, 2.6vw, 2.1rem); }

/* ─── 2. Sub header ────────────────────────────────────────────
   Dara: "the sub copy lines of each section you gave the colour grey
   are to be made gold, and they are not supposed to be as big or
   bigger than the main copy line of the section." */
main .sp-subhead,
main p.sp-subhead.acq-showcase-sub {
  font-family: var(--sans);
  font-size: var(--t-sub);
  line-height: 1.32;
  font-weight: 500;
  letter-spacing: -0.012em;
  max-width: none;
  color: var(--gold-dark);
}
/* on dark grounds the same line takes the lighter gold */
.section--dark .sp-subhead,
.sp-dark .sp-subhead,
.sp-cta .sp-subhead,
.acq-diff-head .sp-subhead,
.jc-detail .sp-subhead,
main .sp-subhead--light { color: var(--gold-light); }

/* this one is reached by `.acq-inc-head p:not(.eyebrow)`, which outranks
   the rule above and was holding it at 16px/300 */
.acq-inc-head p.sp-subhead:not(.eyebrow) {
  font-weight: 500; color: var(--gold-light);
}

.jvpage--center .acq-diff-head .sp-subhead,
.acq-includes .acq-inc-head .sp-subhead { font-size: var(--t-sub-vh); }

/* Dara: "the body copy should not then come after it" — the sub header
   needs air under it before the copy starts. */
main .sp-subhead { margin: 16px 0 26px; }
.jvpage--center .acq-diff-head .sp-subhead { margin: 12px auto clamp(14px, 2.2vh, 24px); }

/* the CTA now closes the panel, under the cards */
.jvpage--center .acq-diff-actions { margin-top: clamp(12px, 2vh, 24px); }

/* ─── 3. The tertiary line ─────────────────────────────────── */
main .section-sub {
  font-size: var(--t-subtle);
  line-height: 1.55;
  font-weight: 500;
  color: var(--gold-dark);
  max-width: 720px;
}
.section--dark .section-sub,
.knowledge-copy .section-sub.light,
main .section-sub.light { color: var(--gold-light); }

/* two that are not sub headers at all: the closing section's line is
   body copy, and the principles statement is Dara's own treatment */
.journey-cinematic .section-sub,
.journey-cinematic .section-sub.light {
  font-size: var(--t-body); line-height: var(--t-body-lh);
  font-weight: 400; color: #fff;
  max-width: 720px; margin-left: auto; margin-right: auto;
}
.principles-intro .section-sub {
  font-size: clamp(1.15rem, 1.62vw, 1.46rem);
  font-weight: 400; color: #fff; max-width: none;
}
/* "Private aviation isn't just about aircraft. It's about trust."
   holds one straight line on desktop. */
@media (min-width: 901px){
  .principles-intro .sp-oneline { white-space: nowrap; }
}

/* ─── 4. Body copy ─────────────────────────────────────────── */
main .sp-body,
main .prose p,
main .intro-line,
main .jv-body,
main .knowledge-body,
main .confidence-col p,
main .confidence-col p.lead,
main .acq-showcase-text .sp-body,
main .acq-src-rest .sp-body,
main .acq-src-head .sp-body,
main .acq-finding-text .sp-body,
main .acq-adv-text .sp-body {
  font-size: var(--t-body);
  line-height: var(--t-body-lh);
}
main .acq-step .sp-body { font-size: var(--t-body); line-height: 1.66; }
/* one ink for body copy on light grounds; this block was sitting at #444 */
main .acq-showcase-text .sp-body { color: #2b2b2b; }

/* inside the pinned panels the same 17px is the ceiling, not a fixed
   size, so a short screen still holds its content */
main .jv1-copy .sp-body,
main .jv-copy .sp-body,
main .jv-copy .jv3-lead,
main .ch-stmt .sp-body,
main .jvpage--center .acq-diff-head .sp-body {
  font-size: clamp(13px, 1.9vh, 17px);
  line-height: 1.62;
}

/* ─── 5. Header logo, in white ─────────────────────────────── */
/* Dara: "change the Zino Aviation logo colour on the header to white."
   The artwork is a gold SVG, so it is knocked through to flat white
   here rather than shipping a second file. */
.nav-logo .logo-img--white { filter: brightness(0) invert(1); }

/* NB the header TYPE is deliberately NOT part of this scale. It was tried
   in the display serif and Dara preferred it as it was, so the bar keeps
   Jost at its original sizes from type-luxury.css. Do not fold the nav
   into the section ranks. */

/* Dara: the page links sit over by the CTA rather than hugging the logo */
@media (min-width: 1281px){
  .nav-links { justify-content: flex-end; padding-right: 20px; }
}

/* ─── 6. Body copy on dark grounds is pure white ─────────────
   Dara: "make all those body copy texts, except the ones that are in
   the form, pure white so that it will be easy to read." Every one of
   these was sitting between 46% and 94% white; they are listed rather
   than swept with a wildcard so that sub headers keep their gold, small
   labels keep their rank, and the charter form keeps its quieter greys.
   Only copy over a dark ground is touched — body copy on the cream and
   white sections keeps its dark ink. */
main .acq-hero-body,
main .sp-hero-sub,
main .intro-line,
main .knowledge-body,
main .principle-body,
main .service-card-desc,
main .kdetail-body,
main .prose.light p,
main .section--dark .sp-body,
main .sp-cta .sp-body,
main .acq-jv .sp-body,
main .jc-detail-copy .sp-body,
main .jc-network .sp-body,
main .ch-stmt .sp-body,
main .ch-fleet-text .sp-body,
main .acq-finding-text .sp-body,
main .acq-src-head .sp-body,
main .acq-src-rest .sp-body,
main .acq-src-close .sp-body,
main .acq-diff-head .sp-body,
main .acq-once-text .sp-body,
main .jv1-copy .sp-body,
main .jv-copy .sp-body,
main .acq-bento-card p,
main .acq-point-body p,
main .ch-why-body p,
main .ch-svc-body p,
main .jc-sol-body p,
main .jc-promise-card figcaption p,
main .sp-cta p:not(.sp-subhead):not(.eyebrow) {
  color: #fff;
}
/* three that are held by a two-class rule of their own, so they need one
   more class here to be reached at all */
main .principles-intro .intro-line,
main .jc-hero .sp-hero-sub,
main .ch-svc-card--dark .ch-svc-body p {
  color: #fff;
}
/* The showcase dims the items that are not playing, which is the only
   way you can tell which one is. The live one goes white with the rest;
   the others come up from 46% so they still read, and stay a step back. */
main .ch-dx-item p { color: rgba(255,255,255,0.62); }
main .ch-dx-item.is-on p { color: #fff; }
/* the charter form is the stated exception */
main .ch-form .sp-form-head p { color: rgba(255,255,255,0.66); }

/* ─── 7. Lines Dara asked to hold together ─────────────────── */
@media (min-width: 901px){
  /* "You simply need the right partner." stays whole */
  .acq-showcase-aside .sp-accent { white-space: nowrap; }
  /* the closing statement fits one line, so "in mind." is never
     left stranded on its own */
  .acq-src-close { max-width: 1000px; }
}
