/* =========================================================
   Seven Summits — page-specific styles only.
   Everything global (resets, typography, nav, hero, shared
   components, colour tokens) lives in css/site.css.
   ========================================================= */

/* ---------------------------
   Page colour tokens
   (dark ocean theme, unique to this page)
   --------------------------- */
:root{
  --bg:           #06121f;
  --bg2:          #081a2b;
  --card:         rgba(255,255,255,0.035);
  --border:       rgba(255,255,255,0.075);
  --border-strong:rgba(255,255,255,0.12);
  --muted:        rgba(255,255,255,0.72);
  --muted2:       rgba(255,255,255,0.55);
  --accent-ink:   #140f06;
  --radius:       var(--site-surface-radius);
  --shadow:       var(--site-shadow);
  --media-h:      15rem;
}

/* ---------------------------
   Page background
   --------------------------- */
body{
  background:
    radial-gradient(1200px 600px at 30% 0%, rgba(12,34,60,0.55), rgba(6,18,31,0) 55%),
    radial-gradient(900px 700px at 100% 30%, rgba(8,35,55,0.35), rgba(6,18,31,0) 60%),
    linear-gradient(180deg, var(--bg2), var(--bg));
}

/* ---------------------------
   Hero modifiers
   --------------------------- */
.site-hero--summits{ background: var(--bg); }

.site-hero--summits .site-hero__image{
  object-position: 50% 13%;
  filter: saturate(0.95) contrast(1.05);
}

.site-hero--summits .site-hero__fade{
  background: linear-gradient(
    180deg,
    rgba(6,18,31,0.0)  0%,
    rgba(6,18,31,0.0)  45%,
    rgba(6,18,31,0.75) 78%,
    rgba(6,18,31,1.0)  100%
  );
}

/* ---------------------------
   Page sections
   --------------------------- */
.summits-section{ margin-top: 2rem; }
.summits-section--peaks{ margin-top: 4rem; }

/* On Seven Summits the box title is fully gold */
.summits-box-title{ color: var(--accent); }

/* Kilimanjaro (first card): less sky, more mountain */
.peaks-grid .peak-card:first-child .peak-card__media img{
  object-position: 50% 35%;
}

/* ---------------------------
   Overview card (spans full width)
   --------------------------- */
.peak-card--overview{ padding: 0; }

.overview-tiles{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
}

.overview-tile{
  height: var(--media-h);
  overflow: hidden;
  background: rgba(255,255,255,0.02);
}

.overview-tile img{
  width: 100%; height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 50%;
}

.overview-text{
  margin: 10px 0 18px;
  color: var(--muted2);
  font-size: .95rem;
  line-height: 1.55;
}

/* ---------------------------
   Inline links
   --------------------------- */
.summits-actions{ display: flex; gap: 12px; flex-wrap: wrap; }

.summits-link{
  padding-bottom: 2px;
  border-bottom: 1px solid transparent;
  color: rgba(255,255,255,0.92);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
}

.summits-link:hover{ border-bottom-color: rgba(255,255,255,0.35); }

/* ---------------------------
   Responsive
   --------------------------- */
@media (max-width: 760px){
  .summits-section--peaks{ margin-top: 3rem; }
  .peaks-grid{ grid-template-columns: 1fr; }
  .overview-tile{ height: 120px; }
}

/* Story block: Challenge / Response / Learning */
.peak-card__story {
  margin: 14px 0 0;
  padding-bottom: 6px;
}

.peak-card__story dt {
  font-size: 0.65rem;
  font-variant: small-caps;
  letter-spacing: 0.12em;
  color: var(--site-gold, #c8a45b);
  margin: 10px 0 2px;
  font-weight: 600;
}

.peak-card__story dt:first-child {
  margin-top: 0;
}

.peak-card__story dd {
  margin: 0;
  color: rgba(255,255,255,.85);
  font-size: .875rem;
  line-height: 1.55;
}