/* ════════════════════════════════════════════════
   Jakotango — expedition.css
   Interior pages: expeditions
   Mobile-first: base → 768px → 1025px
════════════════════════════════════════════════ */

/* ── Hero ──────────────────────────────────────── */
.pgt-hero {
  position: relative;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  background: #000;
}

.pgt-hero__slides {
  position: absolute;
  inset: 0;
}

.pgt-hero__slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1600ms ease;
}

.pgt-hero__slide.is-active { opacity: 1; }

.pgt-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg,
      rgba(10,10,10,0.48) 0%,
      transparent 28%,
      transparent 52%,
      rgba(10,10,10,0.78) 100%);
  pointer-events: none;
}

/* Title block */
.pgt-hero__content {
  position: absolute;
  z-index: 2;
  bottom: 100px;
  left: 0; right: 0;
  padding: 0 28px;
  text-align: center;
}

.pgt-hero__title {
  font-size: clamp(40px, 8vw, 108px);
  margin: 16px 0 14px;
  color: var(--ink);
}

.pgt-hero__coords {
  font-family: var(--sans);
  font-size: 10.5px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(232,227,216,0.4);
}

/* Key Facts panel — hidden on mobile, overlaid on desktop */
.pgt-hero__facts { display: none; }

/* ── Hero entrance animations ──────────────────── */
@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: none; }
}

.pgt-hero__content .eyebrow {
  animation: heroFadeUp 900ms var(--ease-out) 300ms both;
  color: var(--ink);
  text-shadow: 0 1px 16px rgba(0,0,0,0.7);
}

.pgt-hero__title {
  animation: heroFadeUp 1000ms var(--ease-out) 500ms both;
}

.pgt-hero__coords {
  animation: heroFadeUp 800ms var(--ease-out) 720ms both;
}

.pgt-hero__scroll {
  animation: heroFadeUp 700ms ease 980ms both;
}

/* Scroll indicator */
.pgt-hero__scroll {
  position: absolute;
  z-index: 2;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
}

.pgt-hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  overflow: hidden;
  position: relative;
}

.pgt-hero__scroll-line::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 1px;
  height: 48px;
  background: rgba(232,227,216,0.38);
  animation: scrollDrop 2.4s ease infinite;
}

@keyframes scrollDrop {
  0%   { transform: translateY(-48px); }
  45%  { transform: translateY(0); }
  75%  { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(48px); opacity: 0; }
}

/* ── Nav — mobile overrides ────────────────────── */
.nav__logo--hero img { width: 150px; }

@media (min-width: 768px) {
  .nav__logo--hero img { width: 180px; }
}

/* ── Intro ─────────────────────────────────────── */
.pgt-intro {
  padding: 80px 0 60px;
}

.pgt-intro__inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 28px;
  display: flex;
  flex-direction: column;
  gap: 36px;
}

/* Key Facts box — overrides when inside intro */
.pgt-intro__inner .pgt-facts__box {
  max-width: none;
  margin: 0;
}

/* Body */
.pgt-intro__heading {
  font-size: clamp(30px, 4.5vw, 52px);
  margin-bottom: 28px;
  color: var(--ink);
}

.pgt-intro__body p {
  font-size: 15px;
  line-height: 1.78;
  color: var(--ink-body);
  max-width: 60ch;
}

.pgt-intro__body p + p { margin-top: 18px; }

/* ── Film ──────────────────────────────────────── */
.pgt-film {
  padding: 80px 0;
  border-top: 1px solid var(--rule);
}

.pgt-film__inner {
  max-width: 100%;
}

.pgt-film__header { margin-bottom: 28px; padding: 0 28px; }

.pgt-film__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}

/* Thumbnail button */
.pgt-film__thumb {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  cursor: pointer;
  padding: 0;
}

.pgt-film__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(0.72);
  transition: filter 600ms ease, transform 800ms var(--ease-out);
}

.pgt-film__thumb:hover img {
  filter: brightness(0.88);
  transform: scale(1.03);
}

/* Play button */
.pgt-film__play {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 52px; height: 52px;
  border-radius: 50%;
  border: 1px solid rgba(232,227,216,0.55);
  transition: border-color 300ms, background 300ms, transform 300ms var(--ease-out);
}

.pgt-film__play::after {
  content: '';
  position: absolute;
  top: 50%; left: 54%;
  transform: translate(-50%, -50%);
  width: 0; height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 13px solid rgba(232,227,216,0.85);
  transition: border-left-color 300ms;
}

.pgt-film__thumb:hover .pgt-film__play {
  border-color: var(--gold);
  background: rgba(181,151,112,0.12);
  transform: translate(-50%, -50%) scale(1.1);
}

.pgt-film__thumb:hover .pgt-film__play::after {
  border-left-color: var(--gold);
}

/* ── Video modal ───────────────────────────────── */
.film-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(0,0,0,0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 400ms ease;
}

.film-modal.is-open {
  opacity: 1;
  pointer-events: all;
}

.film-modal__stage {
  width: min(92vw, 1080px);
  aspect-ratio: 16/9;
}

.film-modal__embed {
  width: 100%;
  height: 100%;
}

.film-modal__embed iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

.film-modal__close {
  position: absolute;
  top: 20px; right: 24px;
  width: 36px; height: 36px;
  padding: 0;
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 200ms;
}

.film-modal__close:hover { opacity: 1; }

.film-modal__close span {
  position: absolute;
  top: 50%; left: 50%;
  width: 20px; height: 1px;
  background: var(--ink);
  display: block;
}

.film-modal__close span:nth-child(1) { transform: translate(-50%, -50%) rotate(45deg); }
.film-modal__close span:nth-child(2) { transform: translate(-50%, -50%) rotate(-45deg); }

/* ── Key Facts — mobile/tablet only ────────────── */
.pgt-facts {
  padding: 72px 28px 80px;
  border-top: 1px solid var(--rule);
}

.pgt-facts__box {
  max-width: 640px;
  margin: 0 auto;
  border: 1px solid var(--rule-strong);
  padding: 36px 32px;
  position: relative;
}

.pgt-facts__box::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 36px; height: 2px;
  background: var(--gold);
}

.pgt-facts__label { margin-bottom: 28px; }

.pgt-facts__item {
  padding: 13px 0;
  border-bottom: 1px solid var(--rule);
}

.pgt-facts__item:last-child { border-bottom: 0; }

.pgt-facts__item dt {
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-faint);
  padding-top: 2px;
}

.pgt-facts__item dd {
  font-family: var(--sans);
  font-size: 13.5px;
  font-weight: 300;
  color: var(--ink-body);
  line-height: 1.55;
}

/* ── Reels ─────────────────────────────────────── */
.pgt-reels {
  padding: 72px 0 80px;
  border-top: 1px solid var(--rule);
}

.pgt-reels__header {
  padding: 0 28px;
  margin-bottom: 22px;
}

.pgt-reels__track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  gap: 2px;
  scrollbar-width: none;
}

.pgt-reels__track::-webkit-scrollbar { display: none; }

.pgt-reels__credit {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-faint);
  text-align: right;
  padding: 12px 28px 0;
}
.pgt-reels__credit em {
  font-style: italic;
  font-family: var(--serif);
  text-transform: none;
  letter-spacing: 0.04em;
  font-size: 13px;
}

.pgt-reel {
  flex: 0 0 calc(100% - 44px);
  scroll-snap-align: start;
  aspect-ratio: 9/16;
  overflow: hidden;
  background: var(--bg-2);
}

.pgt-reel video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Gallery ───────────────────────────────────── */
.pgt-gallery__header {
  padding: 60px 28px 24px;
  border-top: 1px solid var(--rule);
}

.pgt-gallery__cta .eyebrow { font-size: 9px; }

.pgt-gallery__cta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 10px;
  padding: 28px;
  background: var(--bg-2);
  border: 1px solid var(--rule);
  aspect-ratio: 1/1;
  text-decoration: none;
  transition: background 300ms ease;
}

.pgt-gallery__cta:hover { background: rgba(181,151,112,0.07); }

.pgt-gallery__cta-label {
  font-family: var(--serif);
  font-size: clamp(22px, 4vw, 32px);
  font-weight: 300;
  color: var(--ink);
  line-height: 1.1;
}

.pgt-gallery__cta-arrow {
  font-family: var(--sans);
  font-size: 13px;
  color: var(--gold);
  letter-spacing: 0.08em;
}

.pgt-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
}

.pgt-gallery__item,
.pgt-gallery__cta {
  min-width: 0;
  overflow: hidden;
}

.pgt-gallery__item {
  overflow: hidden;
  aspect-ratio: 1/1;
  transform: translateZ(0);
  position: relative;
  cursor: pointer;
}

.pgt-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(0.9);
  transition: transform 1200ms var(--ease-out), filter 1200ms ease;
}

.pgt-gallery__item:hover img {
  transform: scale(1.03);
  filter: brightness(1.02);
}

/* Photographer credit — always visible, very subtle */
.pgt-gallery__credit {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 28px 10px 9px;
  background: linear-gradient(to top, rgba(10,10,10,0.52), transparent);
  font-family: var(--sans);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(232,227,216,0.45);
  pointer-events: none;
  transition: color 400ms ease;
}

.pgt-gallery__item:hover .pgt-gallery__credit {
  color: rgba(232,227,216,0.75);
}

/* ── Join CTA ──────────────────────────────────── */
.pgt-join {
  padding: 100px 28px;
  text-align: center;
  border-top: 1px solid var(--rule);
}

.pgt-join .eyebrow { margin-bottom: 22px; display: block; }

.pgt-join__title {
  font-size: clamp(40px, 7vw, 76px);
  margin-bottom: 44px;
  color: var(--ink);
}

.pgt-join__cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 400;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-dim);
  padding: 14px 28px;
  border: 1px solid var(--rule-strong);
  transition: color 250ms, border-color 250ms;
}

.pgt-join__cta:hover {
  color: var(--gold);
  border-color: var(--gold);
}

.pgt-join__arrow {
  color: var(--gold);
  transition: transform 250ms var(--ease-out);
}

.pgt-join__cta:hover .pgt-join__arrow { transform: translateX(4px); }

/* ════════════════════════════════════════════════
   TABLET  768px
════════════════════════════════════════════════ */
@media (min-width: 768px) {

  .pgt-intro { padding: 96px 0 72px; }

  .pgt-intro__inner {
    padding: 0 32px;
    flex-direction: row;
    align-items: flex-start;
    gap: 0;
  }

  .pgt-intro__body {
    flex: 1;
  }

  .pgt-intro__inner .pgt-facts__box {
    flex: 0 0 260px;
    margin-left: 44px;
    border-left: 1px solid var(--rule);
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    padding: 16px 0 0 44px;
    align-self: flex-start;
  }

  .pgt-intro__inner .pgt-facts__box::before {
    left: 44px;
  }

  .pgt-film { padding: 96px 0; }
  .pgt-film__header { padding: 0 32px; }
  .pgt-film__grid { grid-template-columns: repeat(3, 1fr); }

  .pgt-reels { padding: 88px 0; }
  .pgt-reels__header { padding: 0 32px; }
  .pgt-reels__credit { padding-right: 32px; }
  .pgt-reels__track {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
    padding: 0 32px;
  }
  .pgt-reel { flex: unset; scroll-snap-align: unset; }

  .pgt-facts__box {
    padding: 40px 44px;
  }

  .pgt-gallery { grid-template-columns: 1fr 1fr; }

}

/* ════════════════════════════════════════════════
   DESKTOP  1025px
════════════════════════════════════════════════ */
@media (min-width: 1025px) {

  /* Hero — title anchors left, panel bottom-right */
  .pgt-hero__content {
    bottom: 108px;
    left: 60px;
    right: auto;
    max-width: 52%;
    padding: 0;
    text-align: left;
  }

  /* Key Facts panel */
  .pgt-hero__facts {
    display: block;
    position: absolute;
    z-index: 2;
    bottom: 40px;
    right: 60px;
    width: 300px;
    background: rgba(10,10,10,0.58);
    border: 1px solid rgba(232,227,216,0.16);
    padding: 22px 24px;
    animation: heroFadeUp 900ms var(--ease-out) 820ms both;
  }

  .pgt-hero__facts::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 28px; height: 2px;
    background: var(--gold);
  }

  .pgt-hero__facts-label { margin-bottom: 18px; }

  .pgt-hero__facts-list {
    display: flex;
    flex-direction: column;
  }

  .pgt-hero__facts-item {
    padding: 10px 0;
    border-bottom: 1px solid rgba(232,227,216,0.07);
  }

  .pgt-hero__facts-item:last-child { border-bottom: 0; }

  .pgt-hero__facts-item dt {
    font-family: var(--sans);
    font-size: 8.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 4px;
  }

  .pgt-hero__facts-item dd {
    font-family: var(--sans);
    font-size: 12.5px;
    font-weight: 300;
    color: var(--ink);
    line-height: 1.45;
  }

  /* Intro */
  .pgt-intro { padding: 120px 0 96px; }
  .pgt-intro__inner { padding: 0 44px; }
  .pgt-intro__body p { font-size: 17px; }
  .pgt-facts__item dd { font-size: 15px; }
  .pgt-gallery__credit { font-size: 11px; }

  /* Film */
  .pgt-film { padding: 112px 0; }
  .pgt-film__header { padding: 0 44px; }

  /* Reels */
  .pgt-reels { padding: 112px 0; }
  .pgt-reels__header { padding: 0 44px; }
  .pgt-reels__track { padding: 0 44px; }
  .pgt-reels__credit { padding-right: 44px; }

  /* Key Facts section — hidden; hero panel replaces it */
  .pgt-facts { display: none; }

  /* Gallery — 3 col editorial */
  .pgt-gallery { grid-template-columns: repeat(3, 1fr); }

}
