/* PJ Aviation — cinematic opening + guided scroll journey (loaded last). */

/* ---------- Opening screen: full-bleed, calm, one focal point ---------- */

/* ---------- Guide: progress line + chapter rail ---------- */
.gj-progress { position: fixed; z-index: 80; top: 0; left: 0; height: 2px; width: 100%; transform: scaleX(var(--gj-total, 0)); transform-origin: left; background: linear-gradient(90deg, #75551e, #d9bd7a, #75551e); pointer-events: none; }
.gj-rail { position: fixed; z-index: 70; right: 26px; top: 50%; transform: translateY(-50%); display: grid; gap: 4px; opacity: 0; pointer-events: none; transition: opacity .5s ease; }
body.gj-scrolled .gj-rail { opacity: 1; pointer-events: auto; }
.gj-rail a { display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-height: 30px; color: #29261f; text-decoration: none; font: 600 10px/1 "Hanken Grotesk", sans-serif; letter-spacing: .22em; text-transform: uppercase; }
.gj-rail a span { opacity: 0; transform: translateX(6px); transition: opacity .3s ease, transform .3s ease; background: rgb(255 253 247 / 92%); padding: 6px 8px; }
.gj-rail a i { width: 8px; height: 8px; border-radius: 50%; border: 1px solid #75551e; transition: background .3s ease, transform .3s ease, height .3s ease; }
.gj-rail a:hover span, .gj-rail a.is-active span { opacity: 1; transform: none; }
.gj-rail a.is-active i { background: #75551e; height: 26px; border-radius: 6px; }
.gj-rail a:focus-visible { outline: 2px solid #75551e; outline-offset: 3px; }
@media (max-width: 800px) { .gj-rail { display: none; } }

/* ---------- Reveal on scroll ---------- */
.gj-reveal { opacity: 0; transform: translateY(42px); transition: opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1); transition-delay: var(--gj-d, 0s); }
.gj-reveal.is-in { opacity: 1; transform: none; }
.chapter:not(.chapter-aviation) > img { transform: scale(calc(1.12 - var(--gj-c, 0) * .12)); transition: transform .1s linear; }

@keyframes gj-rise { from { opacity: 0; transform: translateY(36px); } to { opacity: 1; transform: none; } }
@keyframes gj-settle { from { opacity: 0; filter: blur(6px); } to { opacity: 1; filter: none; } }
@keyframes gj-drip { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .gj-cue i { animation: none !important; }
  .gj-reveal { opacity: 1; transform: none; transition: none; }
  .chapter > img { transform: none !important; }
}
@media (max-width: 800px) { .gj-cue { display: none; } }
body.horizons .human-main img { aspect-ratio: auto !important; height: auto !important; object-fit: contain !important; object-position: center !important; }

/* ---------- Journey+ ---------- */
.gx-list > * { opacity: 0; transform: translateY(18px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); transition-delay: calc(var(--gx-i,0) * 90ms + 80ms); position: relative; }
.gx-list.gx-in > * { opacity: 1; transform: none; }
.av-brief-specs.gx-list > div::after, .av-intake-dossier dl.gx-list > div::after, .trade-topics dl.gx-list > div::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%;
  background: linear-gradient(90deg, #c9a45c, rgba(201,164,92,0)); transform: scaleX(0); transform-origin: left;
  transition: transform 1.1s cubic-bezier(.2,.7,.2,1) calc(var(--gx-i,0) * 90ms + 300ms);
}
.gx-list.gx-in > div::after { transform: scaleX(1); }
.av-brief-specs dd, .av-intake-dossier dd { font-variant-numeric: tabular-nums; }

/* numbered trade topics */
.trade-topics dl.gx-list { counter-reset: gx-t; }
.trade-topics dl.gx-list > div { counter-increment: gx-t; padding-left: 3.2rem; }
.trade-topics dl.gx-list > div::before { content: "0" counter(gx-t); position: absolute; left: 0; top: .15em; font-family: Georgia, serif; font-style: italic; font-size: 1.5rem; color: #75551e; opacity: .85; }

/* heading rule draws in */
main h2.gx-in { background-image: linear-gradient(90deg, #c9a45c, transparent); background-repeat: no-repeat; background-position: 0 100%; background-size: 0 1px; animation: gx-rule 1.4s .2s cubic-bezier(.2,.7,.2,1) forwards; padding-bottom: .35em; }
@keyframes gx-rule { to { background-size: min(160px, 40%) 1px; } }

/* travel route timeline */
.travel-programme-route { position: relative; list-style: none; padding-left: 2.6rem !important; counter-reset: gx-r; }
.travel-programme-route::before, .travel-programme-route::after { content: ""; position: absolute; left: .7rem; top: .4rem; bottom: .4rem; width: 1px; background: rgba(184,137,62,.25); }
.travel-programme-route::after { background: linear-gradient(#e7c98a, #75551e); transform-origin: top; transform: scaleY(var(--gx-route,0)); transition: transform .25s linear; }
.travel-programme-route > li { counter-increment: gx-r; }
.travel-programme-route > li::before { content: counter(gx-r); position: absolute; left: -2.6rem; top: 0; width: 1.4rem; height: 1.4rem; border-radius: 50%; display: grid; place-items: center; font: 600 .7rem/1 Georgia, serif; background: #fffdf7; color: #75551e; border: 1px solid rgba(184,137,62,.5); z-index: 1; transition: background .5s, color .5s, box-shadow .5s; }
.travel-programme-route > li.gx-lit::before { background: #75551e; color: #fff; box-shadow: 0 0 0 6px rgba(201,164,92,.18); }

/* photo wipe */
.gj-reveal img { transition: transform 1.6s cubic-bezier(.2,.7,.2,1), clip-path 1.2s cubic-bezier(.2,.7,.2,1); }
figure.gj-reveal:not(.is-in) img { clip-path: inset(0 0 100% 0); transform: scale(1.08); }
figure.gj-reveal.is-in img { clip-path: inset(0 0 0 0); }

/* pointer light */
.gx-glow { position: relative; }
.gx-glow::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .4s;
  background: radial-gradient(380px circle at var(--gx-x,50%) var(--gx-y,50%), rgba(231,201,138,.18), transparent 60%); }
.gx-glow:hover::after { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .gx-list > *, figure.gj-reveal img { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
}

/* ---------- Deliberate composition ---------- */
body .travel-field-gallery { display: grid !important; grid-template-columns: repeat(6, 1fr) !important; gap: clamp(12px, 1.4vw, 20px) !important; grid-auto-flow: row dense; }
body .travel-field-gallery > figure { grid-column: span 2 !important; grid-row: auto !important; margin: 0 !important; width: auto !important; height: auto !important; transform: none; }
body .travel-field-gallery > figure > a { display: block; height: auto !important; }
body .travel-field-gallery > figure:nth-child(-n+2) { grid-column: span 3 !important; }
body .travel-field-gallery > figure img { width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; object-fit: cover !important; display: block; }
body .travel-field-gallery > figure:nth-child(-n+2) img { aspect-ratio: 16 / 10 !important; }
body .travel-field-gallery figcaption { margin-top: .7rem !important; padding-top: .55rem; border-top: 1px solid rgba(184,137,62,.35); letter-spacing: .04em; }

body .travel-film-archive-intro { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 2rem; align-items: end; border-top: 1px solid rgba(184,137,62,.35); padding-top: 2rem; margin-top: clamp(3rem,6vw,5rem) !important; }
body .travel-film-archive-intro h4 { margin: 0 !important; }
body .travel-film-archive-intro p { margin: 0 !important; max-width: 46ch; justify-self: end; }
body .travel-native-films { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: clamp(12px, 1.6vw, 24px) !important; max-width: none !important; width: 100% !important; }
body .travel-native-films > figure { margin: 0 !important; width: auto !important; max-width: none !important; }
body .travel-native-films video { width: 100% !important; height: auto !important; aspect-ratio: 9 / 16; object-fit: cover; display: block; }

body .travel-photo-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: clamp(12px,1.6vw,24px) !important; }
body .travel-photo-grid img { width: 100% !important; aspect-ratio: 4/3; object-fit: cover; }

@media (max-width: 760px) {
  body .travel-field-gallery { grid-template-columns: 1fr 1fr !important; }
  body .travel-field-gallery > figure { grid-column: span 1 !important; }
  body .travel-field-gallery > figure:first-child { grid-column: span 2 !important; }
  body .travel-film-archive-intro { grid-template-columns: 1fr; gap: .8rem; }
  body .travel-film-archive-intro p { justify-self: start; }
  body .travel-native-films { grid-template-columns: none !important; grid-auto-flow: column; grid-auto-columns: 72%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem; }
  body .travel-native-films > figure { scroll-snap-align: start; }
}
body .travel-field-gallery > figure > a { aspect-ratio: 4 / 3 !important; overflow: hidden; max-height: none !important; }
body .travel-field-gallery > figure:nth-child(-n+2) > a { aspect-ratio: 3 / 2 !important; }
body .travel-field-gallery > figure img { height: 100% !important; max-height: none !important; aspect-ratio: auto !important; }
body .travel-native-films video { aspect-ratio: 4 / 5 !important; }
body.horizons .travel-field-gallery { grid-auto-rows: auto !important; align-items: start; }
body.horizons .travel-field-gallery figure { display: block !important; min-width: 0; }
body.horizons .travel-field-gallery figure > a { flex: none !important; width: 100%; }


/* Trade photo shown whole */
body.horizons .trade-opportunities-grid > figure img { aspect-ratio: 4 / 3 !important; height: auto !important; max-height: none !important; object-fit: contain !important; object-position: center !important; width: 100% !important; }
body.horizons .trade-opportunities-grid { align-items: center !important; grid-template-columns: 6fr 6fr !important; }
@media (max-width: 900px) { body.horizons .trade-opportunities-grid { grid-template-columns: 1fr !important; } }
.trade-topics dl.gx-list > div::before { top: .9rem; }

/* ---------- Loader + smooth scroll ---------- */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }


/* Fly-through crest overlay */
body.gj-fly .placement-emblem { transition: opacity .25s ease; }
.gj-flycrest { position: fixed; left: 0; top: 0; z-index: 60; pointer-events: none; opacity: 0; will-change: transform, opacity; }
.gj-flycrest img { position: absolute; left: 0; top: 0; max-width: none !important; translate: -50% -50%; filter: drop-shadow(0 24px 40px rgba(40,26,8,.45)); }
.gj-flyglow { position: absolute; left: 0; top: 0; width: 120vmax; height: 120vmax; translate: -50% -50%; border-radius: 50%; opacity: 0;
  background: radial-gradient(circle, rgba(250,247,238,.85) 0%, rgba(238,232,217,.55) 18%, rgba(238,232,217,0) 42%); }
body.gj-fly .hero h1, body.gj-fly .hero p { transition: none; }

/* Page loader: crest with a turning ring, fades out once the page has loaded */
body::before, body::after { content: ""; position: fixed; z-index: 9999; pointer-events: none; transition: opacity .7s ease, visibility .7s; animation: gj-loadkill 0s linear 7s forwards; }
body::before { inset: 0; background: #faf7ee url(/media/brand/pj-crest-vector.svg) center / auto min(22vh, 150px) no-repeat; }
body::after { left: 50%; top: 50%; width: min(34vh, 230px); height: min(34vh, 230px); margin: calc(min(34vh, 230px) / -2) 0 0 calc(min(34vh, 230px) / -2);
  border-radius: 50%; border: 2px solid rgba(160,120,60,.18); border-top-color: #75551e; animation: gj-spin 1.1s linear infinite, gj-loadkill 0s linear 7s forwards; }
body.gj-loaded::before, body.gj-loaded::after { opacity: 0; visibility: hidden; }
@keyframes gj-spin { to { transform: rotate(360deg); } }
@keyframes gj-loadkill { to { opacity: 0; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { body::after { animation: gj-loadkill 0s linear 7s forwards; } }