:root {
  --text: #c7d7df;
  --text-soft: #a7bac5;
  --text-dim: #6f8492;
  --silver: #bed0da;
}

/* SECOND-PASS COLOR DEPTH */

h1 {
  color: #43bee9;
  background: linear-gradient(180deg, #69e6ff 0%, #34b7e4 48%, #2278aa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter:
    drop-shadow(0 2px 0 #0b3854)
    drop-shadow(0 5px 0 #061f32)
    drop-shadow(0 0 10px rgba(87, 230, 255, .15));
}

.hero h2,
.page-intro h2 {
  color: #3ea8d5;
  background: linear-gradient(
    180deg,
    #66dfff 0%,
    #42bde8 28%,
    #2d91c7 58%,
    #1a5e91 82%,
    #123f68 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter:
    drop-shadow(0 2px 0 rgba(7, 42, 66, .95))
    drop-shadow(0 4px 0 rgba(3, 24, 39, .88))
    drop-shadow(0 0 14px rgba(87, 230, 255, .11));
}

.hero-text,
.content-section > p,
.archive-card p,
.location-card p:last-child,
.gallery-info p:last-child {
  color: var(--text-soft);
}

.stat-value,
.orders-list li,
.faction-detail-value,
.mining-location-coordinates,
.mining-coordinates {
  color: var(--silver);
}

/* CINEMATIC IMAGE BANDS */

.cinematic-band {
  position: relative;
  min-height: 330px;
  margin: 46px 0 0;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  border: 1px solid rgba(87, 230, 255, .22);
  border-radius: 12px;
  background-color: #041019;
  box-shadow: 0 24px 60px rgba(0,0,0,.34);
  isolation: isolate;
}

.cinematic-band::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-size: cover;
  background-repeat: no-repeat;
  transition: transform .65s ease, filter .65s ease;
}

.cinematic-band::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(3, 10, 17, .97) 0%, rgba(4, 14, 23, .86) 34%, rgba(4, 13, 22, .38) 63%, rgba(2, 7, 12, .16) 100%),
    linear-gradient(0deg, rgba(2,7,12,.68), transparent 58%);
}

.cinematic-band:hover::before {
  transform: scale(1.015);
  filter: saturate(1.06) contrast(1.03);
}

.system-spotlight::before {
  background-image: url("images/gallery/kings-mountain-view-elw.webp");
  background-position: center center;
}

.katana-spotlight::before {
  background-image: url("images/gallery/katana.webp");
  background-position: center 48%;
}

.cinematic-copy {
  position: relative;
  width: min(560px, 72%);
  padding: clamp(24px, 4vw, 42px);
}

.cinematic-kicker {
  margin: 0 0 7px;
  color: var(--accent-orange);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .17em;
  text-transform: uppercase;
}

.cinematic-copy h3 {
  margin: 0 0 12px;
  color: #48c9f4;
  font-size: clamp(1.8rem, 4vw, 3rem);
  line-height: 1;
  letter-spacing: -.025em;
  text-transform: uppercase;
  text-shadow:
    0 2px 0 #0b3955,
    0 5px 16px rgba(0,0,0,.55),
    0 0 18px rgba(87,230,255,.08);
}

.cinematic-copy p:not(.cinematic-kicker) {
  margin: 0;
  color: #aebfca;
  line-height: 1.7;
}

.cinematic-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.cinematic-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  border: 1px solid rgba(87,230,255,.32);
  border-radius: 6px;
  color: var(--cyan);
  background: rgba(4,14,23,.58);
  text-decoration: none;
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.cinematic-link::after {
  content: "→";
  color: var(--accent-orange);
}

.cinematic-link:hover {
  background: rgba(87,230,255,.08);
  border-color: rgba(87,230,255,.5);
}

/* SYSTEM / COLONY LANDMARK */

.landmark-panel {
  position: relative;
  margin: 8px 0 42px;
  min-height: 360px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #040b11;
  box-shadow: 0 20px 55px rgba(0,0,0,.28);
}

.landmark-panel img {
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
  object-position: center center;
  display: block;
  filter: brightness(.72) saturate(.93) contrast(1.04);
}

.landmark-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: clamp(22px, 4vw, 38px);
  background:
    linear-gradient(90deg, rgba(2,8,13,.96), rgba(3,10,17,.65) 42%, rgba(2,7,12,.10) 73%),
    linear-gradient(0deg, rgba(2,7,12,.72), transparent 54%);
}

.landmark-copy {
  max-width: 520px;
}

.landmark-copy h3 {
  margin: 0 0 10px;
  color: #45c5ef;
  font-size: clamp(1.6rem, 3.5vw, 2.5rem);
  line-height: 1.05;
  text-transform: uppercase;
  text-shadow: 0 2px 0 #0c3852, 0 8px 22px rgba(0,0,0,.5);
}

.landmark-copy p:last-child {
  margin-bottom: 0;
  color: #aebfca;
  line-height: 1.67;
}

.location-card-featured {
  grid-column: 1 / -1;
  min-height: 270px;
  padding: 0;
  background:
    linear-gradient(90deg, rgba(3,10,17,.98) 0%, rgba(4,13,22,.82) 40%, rgba(3,9,15,.26) 72%),
    url("images/gallery/kings-mountain-view-elw.webp") center center / cover no-repeat;
}

.location-card-featured .featured-card-copy {
  width: min(540px, 72%);
  padding: clamp(22px, 4vw, 34px);
}

/* GALLERY SECOND PASS */

.gallery-card.gallery-featured {
  grid-column: 1 / -1;
}

.gallery-card.gallery-featured .gallery-image {
  width: 100%;
  height: clamp(280px, 42vw, 500px);
  object-fit: cover;
}

.gallery-card.gallery-featured.kmv-gallery .gallery-image {
  object-position: center center;
}

.gallery-card.gallery-featured.katana-gallery .gallery-image {
  object-position: center 46%;
}

.gallery-card.gallery-featured .gallery-info {
  display: grid;
  grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr);
  gap: 24px;
  align-items: start;
  padding: 22px;
}

.gallery-card.gallery-featured .gallery-info h4 {
  margin-bottom: 0;
  font-size: 1.45rem;
}

.gallery-card.gallery-featured .gallery-info p:last-child {
  margin: 0;
}

/* COMFORT / NIGHT-VIEW TUNING */

body {
  color: var(--text);
}

.panel-heading,
.stat-label,
.eyebrow,
.card-code,
.location-type,
.faction-role,
.gallery-placeholder,
footer {
  text-shadow: none;
}

@media (max-width: 820px) {
  .cinematic-band {
    min-height: 440px;
    align-items: flex-end;
  }

  .cinematic-band::after {
    background:
      linear-gradient(0deg, rgba(2,7,12,.98) 0%, rgba(3,10,17,.86) 46%, rgba(2,7,12,.18) 78%, rgba(2,7,12,.05) 100%);
  }

  .cinematic-copy,
  .location-card-featured .featured-card-copy {
    width: 100%;
  }

  .system-spotlight::before {
    background-position: 57% center;
  }

  .katana-spotlight::before {
    background-position: 61% center;
  }

  .landmark-panel,
  .landmark-panel img {
    min-height: 430px;
  }

  .landmark-overlay {
    align-items: flex-end;
    background:
      linear-gradient(0deg, rgba(2,7,12,.98), rgba(3,10,17,.78) 47%, rgba(2,7,12,.10) 82%);
  }

  .gallery-card.gallery-featured .gallery-info {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

@media (max-width: 520px) {
  .cinematic-band {
    min-height: 410px;
  }

  .cinematic-copy {
    padding: 23px 19px;
  }

  .landmark-panel,
  .landmark-panel img {
    min-height: 400px;
  }

  .landmark-overlay {
    padding: 22px 18px;
  }

  .gallery-card.gallery-featured .gallery-image {
    height: 250px;
  }
}