/* =====================================
   DOWNTOWN KINGSTON INTEGRATED PLAN
====================================== */

.dkip .case-study {
  --dkip-blue: #004876;
  --dkip-brick: #e64b38;
  --dkip-soft-brick: #ffa489;
  --dkip-copper: #7d9c91;
  --dkip-light-copper: #cedfd7;
  --dkip-dry-limestone: #f3f2ee;
  --dkip-wet-limestone: #323e48;
}

.dkip-case-hero h1,
.dkip-overview h2,
.dkip-section-heading h2,
.dkip-system h2,
.dkip-presentation h2,
.dkip-outcome h2 {
  color: var(--dkip-blue);
}

.dkip-overview h2,
.dkip-section-heading h2,
.dkip-system h2,
.dkip-presentation h2,
.dkip-outcome h2 {
  margin: 0.65rem 0 1.5rem;
  font: 600 clamp(2.3rem, 4.6vw, 4.8rem) / 1 var(--display);
  letter-spacing: -0.045em;
}

.dkip .case-study img {
  display: block;
  width: 100%;
  height: auto;
}

.dkip .case-study figure {
  margin: 0;
}

.dkip figcaption,
.dkip-caption {
  padding-block: 0.85rem;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dkip-overview,
.dkip-outcome {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8%;
  padding-block: 9rem;
}

.dkip-copy .lead {
  margin-top: 0;
  font: 500 clamp(1.3rem, 2vw, 2rem) / 1.25 var(--display);
}

.dkip-logo-section,
.dkip-guidelines {
  padding-top: 8rem;
  background: var(--dkip-dry-limestone);
}

.dkip-section-heading {
  display: grid;
  grid-template-columns: 0.45fr 1fr 0.8fr;
  gap: 3rem;
  padding-bottom: 3rem;
}

.dkip-section-heading h2 {
  margin-top: 0;
}

.dkip-system {
  display: grid;
  grid-template-columns: 0.7fr 1fr 1fr;
  align-items: end;
  gap: 2rem;
  padding-block: 9rem;
}

.dkip-system figure {
  overflow: hidden;
  background: var(--dkip-dry-limestone);
}

.dkip-system figcaption,
.dkip-presentation figcaption {
  padding-inline: 0.25rem;
}

.dkip-bus,
.dkip-presentation-scene {
  background: var(--dkip-blue);
}

.dkip-bus figcaption,
.dkip-presentation-scene figcaption {
  color: white;
}

.dkip-guidelines {
  background: var(--dkip-light-copper);
}

.dkip-presentation {
  display: grid;
  grid-template-columns: 0.7fr 1.3fr;
  align-items: center;
  gap: 6%;
  padding-block: 9rem;
}

.dkip-outcome {
  border-top: 1px solid var(--dkip-wet-limestone);
}

.dkip-reveal {
  opacity: 0;
  transform: translateY(2.5rem);
  transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.dkip-reveal.is-visible {
  opacity: 1;
  transform: none;
}

@media (max-width: 850px) {
  .dkip-overview,
  .dkip-outcome,
  .dkip-section-heading,
  .dkip-system,
  .dkip-presentation {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .dkip-overview,
  .dkip-outcome,
  .dkip-system,
  .dkip-presentation {
    padding-block: 6rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dkip-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}