.community-hero {
  min-height: min(760px, 100svh);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.community-hero > p {
  max-width: 720px;
}

.community-paths {
  display: grid;
  margin-top: clamp(42px, 7vw, 82px);
  border-top: 1px solid var(--ink);
}

.community-paths a {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 22px;
  min-height: 112px;
  padding: 22px 0;
  border-bottom: 1px solid var(--ink);
  color: var(--ink);
  text-decoration: none;
  transition: color .25s ease, background-color .25s ease;
}

.community-paths span {
  grid-column: 1;
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.community-paths strong {
  grid-column: 1;
  align-self: end;
  font: 900 clamp(1.8rem, 4.6vw, 3rem)/1 var(--display);
  text-transform: uppercase;
}

.community-paths b {
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  font-size: 1.7rem;
  transition: transform .35s cubic-bezier(.16,1,.3,1);
}

.community-paths a:focus-visible {
  outline: 3px solid #6243c3;
  outline-offset: 5px;
}

.community-section-head {
  display: grid;
  gap: 24px;
  align-items: end;
  margin-bottom: 34px;
}

.community-section-head h2,
.community-impact h2 {
  max-width: 10ch;
  margin: 24px 0 0;
  font: 900 clamp(3rem, 8vw, 6rem)/.98 var(--display);
  letter-spacing: -.015em;
  text-transform: uppercase;
}

.community-section-head > p {
  max-width: 67ch;
  margin: 0;
  font-size: clamp(1rem, 1.45vw, 1.125rem);
  line-height: 1.75;
}

.community-page .roadmap-archive {
  scroll-margin-top: 110px;
}

.community-impact {
  display: grid;
  gap: clamp(38px, 7vw, 100px);
  align-items: center;
  color: var(--ink);
  background: var(--yellow);
}

.community-impact-copy > p {
  max-width: 64ch;
  margin: 28px 0 32px;
  font-size: clamp(1rem, 1.45vw, 1.125rem);
  line-height: 1.75;
}

.community-impact-media {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
}

.community-impact-media .media-tile {
  display: block;
  width: 100%;
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  background: var(--white);
  box-shadow: 9px 11px 0 var(--ink);
}

.community-impact-media img {
  display: block;
  width: 100%;
  height: auto;
}

.community-impact-media figcaption {
  max-width: 58ch;
  margin-top: 20px;
  font-size: .875rem;
  line-height: 1.6;
}

@media (hover: hover) and (pointer: fine) {
  .community-paths a:hover {
    color: var(--yellow);
    background: var(--ink);
  }

  .community-paths a:hover b {
    transform: translateY(7px);
  }
}

@media (min-width: 760px) {
  .community-paths {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .community-paths a {
    min-height: 150px;
    padding: 24px;
    border-right: 1px solid var(--ink);
  }

  .community-paths a:first-child {
    padding-left: 0;
  }

  .community-paths a:last-child {
    border-right: 0;
  }

  .community-section-head {
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
  }

  .community-impact {
    grid-template-columns: minmax(0, .85fr) minmax(360px, 1.15fr);
  }
}

@media (min-width: 1100px) {
  .community-hero {
    padding-bottom: 74px;
  }
}

@media (max-width: 759px) {
  .community-hero {
    min-height: auto;
  }

  .community-paths a {
    padding-inline: 4px;
  }

  .community-impact-media .media-tile {
    box-shadow: 6px 7px 0 var(--ink);
  }
}

@media (prefers-reduced-motion: reduce) {
  .community-paths a,
  .community-paths b {
    transition-duration: .001ms !important;
  }
}

/* Roadmap leads with the original interactive map, followed by documented milestones. */
.roadmap-page #roadmap{padding-top:125px;padding-bottom:60px;}
.roadmap-page-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;}
.roadmap-page-heading h1{font:400 clamp(48px,6vw,84px)/1.05 var(--display);color:var(--yellow);margin:18px 0 0;text-transform:uppercase;letter-spacing:.01em;}
.roadmap-page-heading>a{color:var(--yellow);}
.roadmap-page .roadmap-experience{margin-top:24px;}
.roadmap-milestones{background:var(--yellow);color:var(--ink);}
.roadmap-milestones h2{font:400 clamp(44px,6vw,82px)/1.05 var(--display);text-transform:uppercase;letter-spacing:.01em;margin:28px 0;}
.milestone-intro{max-width:650px;line-height:1.7;}
.milestone-list{list-style:none;padding:0;margin:40px 0 0;}
.milestone-list li{display:grid;grid-template-columns:200px minmax(0,1fr);gap:30px;border-top:1px solid #1115;padding:32px 0;}
.milestone-list time{font-size:14px;letter-spacing:.07em;font-weight:700;padding-top:6px;}
.milestone-list h3{font:400 clamp(30px,3.5vw,48px)/1.1 var(--display);text-transform:uppercase;margin:0 0 16px;}
.milestone-list p{max-width:740px;line-height:1.7;margin:0 0 16px;}
.milestone-list button{background:transparent;color:inherit;cursor:pointer;border:0;border-bottom:2px solid currentColor;}
@media(max-width:700px){.roadmap-page #roadmap{padding-top:108px;}.roadmap-page-heading{display:block;}.roadmap-page-heading>a{margin-top:16px;}.milestone-list li{grid-template-columns:1fr;gap:12px;padding:26px 0;}}

/* White wordmark and navigation on the dark opening of Roadmap. */
.roadmap-page:not(.menu-open) .site-header{color:var(--white);}
.roadmap-page:not(.menu-open) .site-header .brand img{filter:none;}
