/* PHOTO GUIDE shared visual system
   Gear-style hero + Preparation-style page sequence
===================================================== */

.field-guide-unified-page {
  --fgu-navy: #153a5b;
  --fgu-deep: #0d3149;
  --fgu-teal: #397b70;
  --fgu-line: #dbe5e8;
  --fgu-soft: #f7f9f9;
  --fgu-muted: #6d808a;
}

.field-guide-unified-page .guide-article-navigation {
  display: none !important;
}

.field-guide-unified-page .trip-ready,
.field-guide-unified-page .gear-v2-next,
.field-guide-unified-page .tech-v2-next,
.field-guide-unified-page .manner-v2-next {
  display: none !important;
}

.field-guide-unified-hero {
  position: relative !important;
  min-height: 520px !important;
  color: #fff !important;
  background-position: center !important;
  background-size: cover !important;
  overflow: hidden;
}

.field-guide-unified-hero .photo-map-hero-overlay,
.field-guide-unified-hero .trip-hero-shade,
.field-guide-unified-hero .gear-v2-hero-shade,
.field-guide-unified-hero .tech-v2-hero-shade,
.field-guide-unified-hero .manner-v2-hero-shade {
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(
      90deg,
      rgba(4, 28, 44, .84) 0%,
      rgba(4, 28, 44, .62) 43%,
      rgba(4, 28, 44, .15) 76%
    ) !important;
}

.field-guide-unified-hero .photo-map-hero-inner,
.field-guide-unified-hero .trip-hero-inner,
.field-guide-unified-hero .gear-v2-hero-inner,
.field-guide-unified-hero .tech-v2-hero-inner,
.field-guide-unified-hero .manner-v2-hero-inner {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  min-height: 444px !important;
  padding-top: 42px !important;
  padding-bottom: 48px !important;
}

.field-guide-unified-hero h1 {
  max-width: 760px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  color: #fff !important;
  font-size: clamp(43px, 5.1vw, 64px) !important;
  line-height: 1.16 !important;
  letter-spacing: .01em;
}

.field-guide-unified-hero p,
.field-guide-unified-hero span {
  color: inherit;
}

.field-guide-unified-nav {
  position: relative !important;
  top: auto !important;
  z-index: 8 !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.16) !important;
  background: transparent !important;
  backdrop-filter: none !important;
  color: #fff !important;
}

.field-guide-unified-page .field-guide-nav {
  position: relative !important;
  top: auto !important;
  z-index: 8 !important;
  border-bottom: 1px solid rgba(255,255,255,.16) !important;
  background: transparent !important;
  backdrop-filter: none !important;
}

.field-guide-unified-page .field-guide-nav .field-guide-brand,
.field-guide-unified-page .field-guide-nav .field-guide-links a {
  color: #fff !important;
}

.field-guide-unified-page
.field-guide-nav
.field-guide-links
a[aria-current="page"]::after {
  background: #fff !important;
}

.field-guide-unified-nav a {
  color: #fff !important;
}

.field-guide-unified-nav [aria-current="page"] {
  opacity: 1 !important;
}

/* Remove the old right-side "find photo spots" CTA on all five guide articles. */
.field-guide-unified-page .field-guide-spot-button,
.field-guide-unified-page .gear-v2-field-spot,
.field-guide-unified-page .tech-v1-field-spot,
.field-guide-unified-page .manner-v1-field-spot {
  display: none !important;
}

/* Use the released space for the five article jump links. */
.field-guide-unified-page .field-guide-nav-inner,
.field-guide-unified-page .gear-v2-field-nav-inner,
.field-guide-unified-page .tech-v1-field-nav-inner,
.field-guide-unified-page .manner-v1-field-nav-inner {
  grid-template-columns: auto minmax(0, 1fr) !important;
}

.field-guide-unified-page .field-guide-links,
.field-guide-unified-page .gear-v2-field-links,
.field-guide-unified-page .tech-v1-field-links,
.field-guide-unified-page .manner-v1-field-links {
  justify-content: flex-end !important;
  margin-left: auto;
}

.field-guide-unified-page .field-guide-hierarchy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  min-width: 0;
}

.field-guide-unified-page .field-guide-hierarchy > a,
.field-guide-unified-page .field-guide-hint-children a {
  flex: 0 0 auto;
  padding: 10px 0;
  font-size: 13px;
  white-space: nowrap;
}

.field-guide-unified-page .field-guide-hierarchy a[aria-current="page"]::after {
  bottom: 3px;
}

.field-guide-hint-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.field-guide-hint-title {
  color: #b8ded5;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.field-guide-hint-children {
  display: flex;
  gap: 12px;
}

@media (max-width: 1050px) {
  .field-guide-unified-page .field-guide-nav-inner,
  .field-guide-unified-page .gear-v2-field-nav-inner,
  .field-guide-unified-page .tech-v1-field-nav-inner,
  .field-guide-unified-page .manner-v1-field-nav-inner {
    grid-template-columns: 1fr !important;
    gap: 8px;
    padding-top: 12px;
  }

  .field-guide-unified-page .field-guide-hierarchy {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 12px;
    width: 100%;
    margin-left: 0;
  }

  .field-guide-unified-page .field-guide-hierarchy > a {
    display: grid;
    place-items: center;
    min-height: 42px;
    padding: 8px 4px;
    text-align: center;
    white-space: normal;
  }

  .field-guide-hint-group {
    grid-column: 1 / -1;
    padding: 8px 12px;
    border-radius: 7px;
    background: rgba(255,255,255,.08);
  }

  .field-guide-hint-children {
    justify-content: center;
    gap: 18px;
  }

  .field-guide-unified-page .field-guide-hint-children a { padding: 7px 0; }
}

.field-guide-unified-page [data-guide-article] > section:not(.field-guide-unified-hero):not(.field-guide-sequence) {
  scroll-margin-top: 84px;
}

/* Compact previous / next navigation aligned to both edges. */
.field-guide-sequence {
  padding: 20px 0 24px;
  border-top: 1px solid var(--fgu-line);
  background: var(--fgu-soft);
}

.field-guide-sequence-inner {
  width: min(var(--max), calc(100% - 48px));
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 18px;
}

.field-guide-sequence-card {
  display: grid;
  width: min(100%, 220px);
  min-height: 62px;
  padding: 9px 12px 10px;
  border: 1px solid var(--fgu-line);
  border-radius: 7px;
  background: #fff;
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

.field-guide-sequence-card:hover {
  transform: translateY(-1px);
  border-color: #9bb8c0;
  box-shadow: 0 5px 13px rgba(21, 58, 91, .05);
}

.field-guide-sequence-card > span {
  color: var(--fgu-teal);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
}

.field-guide-sequence-card > small {
  margin-top: 4px;
  color: var(--fgu-muted);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .07em;
}

.field-guide-sequence-card > b {
  margin-top: 1px;
  color: var(--fgu-navy);
  font-size: 14px;
  line-height: 1.3;
}

.field-guide-sequence-card.is-prev {
  margin-right: auto;
  text-align: left;
}

.field-guide-sequence-card.is-next {
  margin-left: auto;
  text-align: right;
}

@media (max-width: 760px) {
  .field-guide-unified-hero {
    min-height: 510px !important;
  }

  .field-guide-unified-hero .photo-map-hero-inner,
  .field-guide-unified-hero .trip-hero-inner,
  .field-guide-unified-hero .gear-v2-hero-inner,
  .field-guide-unified-hero .tech-v2-hero-inner,
  .field-guide-unified-hero .manner-v2-hero-inner {
    min-height: 400px !important;
  }

  .field-guide-unified-hero h1 {
    font-size: 39px !important;
  }

  .field-guide-unified-page .field-guide-nav-inner,
  .field-guide-unified-page .gear-v2-field-nav-inner,
  .field-guide-unified-page .tech-v1-field-nav-inner,
  .field-guide-unified-page .manner-v1-field-nav-inner {
    grid-template-columns: 1fr !important;
  }

  .field-guide-unified-page .field-guide-links,
  .field-guide-unified-page .gear-v2-field-links,
  .field-guide-unified-page .tech-v1-field-links,
  .field-guide-unified-page .manner-v1-field-links {
    justify-content: center !important;
    margin-left: 0;
  }

  .field-guide-sequence {
    padding: 16px 0 19px;
  }

  .field-guide-sequence-inner {
    width: min(100% - 32px, var(--max));
    gap: 10px;
  }

  .field-guide-sequence-card {
    width: min(46%, 190px);
    min-height: 58px;
    padding: 8px 10px;
  }
}

/* Keep the PHOTO MAP visible near the first mobile viewport. */
@media (max-width: 760px) {
  .field-guide-unified-page
  .field-guide-unified-hero.photo-map-hero {
    min-height: 360px !important;
  }

  .field-guide-unified-page
  .field-guide-unified-hero
  .photo-map-hero-inner {
    min-height: 280px !important;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
}

@media (max-width: 480px) {
  .field-guide-sequence-card {
    width: min(48%, 168px);
  }

  .field-guide-sequence-card > b {
    font-size: 14px;
  }
}