/* Project New Ground — V2.11. Equal-format progress overview.
   Scoped entirely to #status; no changes to SEO, routes or content. */

#status .status-top.status-v15-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  max-width: 930px;
  margin: 0 auto;
  text-align: center;
}
#status .status-top.status-v15-top > div:first-child { width: 100%; }
#status .status-top .eyebrow { margin-inline: auto; }
#status .status-top .display { font-size: clamp(48px, 6vw, 88px); text-wrap: balance; }
#status .status-top .status-intro {
  max-width: 735px;
  margin: clamp(20px, 2.4vw, 31px) auto 0;
  font-size: clamp(16px, 1.65vw, 21px);
  line-height: 1.58;
}
#status .status-v15-top .status-badge {
  align-self: center;
  margin: 4px 0 0;
}

/* One visual language: 9 same-size cards, three rows of three on desktop. */
#status .progress-grid {
  display: grid;
  width: min(100%, 1160px);
  margin: clamp(44px, 5vw, 66px) auto 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: clamp(14px, 1.6vw, 20px);
  align-items: stretch;
}
#status .progress-grid > .progress-card,
#status .progress-grid > .progress-card.progress-card--wide,
#status .progress-grid > .progress-card.progress-card--binder-photo {
  grid-column: auto;
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  border: 1px solid rgba(234, 220, 200, .20);
  background: rgba(8, 36, 27, .62);
  box-shadow: none;
  transition: transform .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
}
#status .progress-grid .progress-card-media,
#status .progress-grid .progress-card--wide .progress-card-media,
#status .progress-grid .progress-card--binder-photo .progress-card-media {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #0b2c22;
}
#status .progress-grid .progress-card-media picture {
  display: block;
  width: 100%;
  height: 100%;
}
#status .progress-grid .progress-card-media img,
#status .progress-grid .progress-card--binder-photo .progress-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  object-fit: cover;
  object-position: center center;
  filter: sepia(.07) saturate(.79) contrast(1.03) brightness(.9);
  transform: scale(1);
  transition: transform .45s ease, filter .4s ease;
}
#status .progress-grid .progress-card-media::after,
#status .progress-grid .progress-card--binder-photo .progress-card-media::after {
  content: '';
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(9, 37, 27, .06), rgba(7, 27, 20, .22));
  pointer-events: none;
}
/* Adjust the crop for images with important details away from the centre. */
#status .progress-grid > .progress-card:nth-child(1) .progress-card-media img { object-position: 53% center; }
#status .progress-grid > .progress-card:nth-child(2) .progress-card-media img { object-position: 50% 47%; }
#status .progress-grid > .progress-card:nth-child(3) .progress-card-media img { object-position: 53% 55%; }
#status .progress-grid > .progress-card:nth-child(4) .progress-card-media img { object-position: 57% 46%; }
#status .progress-grid > .progress-card:nth-child(5) .progress-card-media img { object-position: 50% 48%; }
#status .progress-grid > .progress-card:nth-child(6) .progress-card-media img { object-position: 49% 43%; }
#status .progress-grid > .progress-card:nth-child(7) .progress-card-media img { object-position: 52% 49%; }
#status .progress-grid > .progress-card:nth-child(8) .progress-card-media img { object-position: 53% 50%; }
#status .progress-grid > .progress-card:nth-child(9) .progress-card-media img { object-position: 52% 46%; }

#status .progress-grid .progress-card-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: clamp(20px, 2.0vw, 26px);
}
#status .progress-grid .progress-card-meta {
  align-items: center;
  gap: 10px;
  min-height: 14px;
  font-size: 9px;
  letter-spacing: .12em;
}
#status .progress-grid .progress-card-meta b { letter-spacing: .09em; }
#status .progress-grid .progress-card h3 {
  margin: 20px 0 10px;
  font-size: clamp(19px, 1.65vw, 25px);
  line-height: 1.14;
  letter-spacing: -.02em;
  text-wrap: balance;
}
#status .progress-grid .progress-card p {
  margin: 0;
  font-size: 13px;
  line-height: 1.68;
  color: rgba(234, 220, 200, .67);
}
@media (hover: hover) and (pointer: fine) {
  #status .progress-grid > .progress-card:hover {
    transform: translateY(-4px);
    border-color: rgba(201, 169, 106, .48);
    background: rgba(13, 49, 36, .81);
    box-shadow: 0 15px 35px rgba(0,0,0,.14);
  }
  #status .progress-grid > .progress-card:hover .progress-card-media img,
  #status .progress-grid > .progress-card.progress-card--binder-photo:hover .progress-card-media img {
    transform: scale(1.045);
    filter: sepia(.04) saturate(.87) contrast(1.05) brightness(.94);
  }
}
@media (max-width: 1050px) {
  #status .progress-grid { width: 100%; grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 680px) {
  #status .status-top.status-v15-top { align-items: center; gap: 16px; }
  #status .status-top .display { font-size: clamp(44px, 10vw, 63px); }
  #status .status-top .status-intro { font-size: 16px; }
  #status .progress-grid { grid-template-columns: 1fr; grid-auto-rows: auto; gap: 14px; margin-top: 36px; }
  #status .progress-grid .progress-card h3 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  #status .progress-grid > .progress-card,
  #status .progress-grid .progress-card-media img { transition: none !important; }
  #status .progress-grid > .progress-card:hover { transform: none; }
  #status .progress-grid > .progress-card:hover .progress-card-media img { transform: none; }
}
