/* A shorter, more intentional homepage rhythm. Loaded after the base theme. */
.journey-section {
  display: none;
}

.journey-heading {
  max-width: 700px;
}

.journey-heading > p:last-child {
  margin-bottom: 0;
}

.journey-stage {
  margin-top: 26px;
}

.journey-feather {
  opacity: .55;
}

.milestones {
  margin-bottom: 24px;
}

.pathways-section {
  padding: 62px 0 68px;
}

.pathways-section::before {
  inset: 20px;
}

.pathways-section .section-heading {
  max-width: 730px;
  margin-bottom: 34px;
}

.pathway-card {
  min-height: 0;
  padding: 30px 28px;
}

.pathway-card p {
  margin-bottom: 18px;
}

.home-class-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0 0 22px;
}

.home-class-list > span {
  padding: 5px 9px;
  border: 1px solid rgba(117, 27, 35, .13);
  border-radius: 999px;
  background: #fff8e8;
  color: var(--maroon);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.25;
}

.home-community {
  padding: 54px 0 60px;
}

.home-community-heading h2 {
  font-size: clamp(38px, 4.4vw, 56px);
}

.home-community-heading > p:last-child {
  margin-top: 12px;
}

.home-photo-rail {
  max-width: 1040px;
  margin-top: 30px;
  gap: clamp(10px, 1.35vw, 17px);
}

.home-photo-rail figure,
.home-photo-rail figure:nth-child(even) {
  height: clamp(245px, 23vw, 310px);
  border-width: 6px;
  border-radius: 112px 112px 16px 16px;
}

.guide-section {
  padding: 64px 0 62px;
}

.guide-grid {
  gap: clamp(42px, 6vw, 76px);
}

.story-card {
  max-width: 1030px;
  padding: 36px 48px;
  background: linear-gradient(120deg, #f8e9c7, #fff8e8 58%, #f6e2cc);
  border: 1px solid rgba(163, 101, 37, .13);
  border-radius: 26px;
  box-shadow: 0 18px 46px rgba(82, 45, 25, .08);
}

.guide-story {
  margin-top: 42px;
}

.story-card blockquote {
  font-size: clamp(21px, 2.2vw, 29px);
}

.next-step-section {
  padding: 62px 0 66px;
}

.next-step-card {
  padding-block: 50px;
}

/* Keep the guide layout fluid through tablet widths. The base two-column
   minimums are intentionally generous for desktop, but can otherwise push a
   few pixels beyond narrower tablet viewports. */
@media (min-width: 701px) and (max-width: 900px) {
  .guide-grid {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 34px;
  }

  .guide-copy {
    min-width: 0;
  }

  .guide-photo span {
    right: -12px;
  }
}

@media (max-width: 720px) {
  .pathways-section { padding: 54px 0 58px; }
  .pathways-section::before { inset: 12px; }
  .pathways-section .section-heading { margin-bottom: 28px; }
  .pathway-card { padding: 26px 24px; }
  .home-community { padding: 48px 0 52px; }
  .home-community-heading h2 { font-size: 38px; }
  .home-photo-rail { margin-top: 26px; }
  .home-photo-rail figure,
  .home-photo-rail figure:nth-child(even) {
    height: auto;
    aspect-ratio: 4 / 5;
    border-width: 4px;
    border-radius: 68px 68px 11px 11px;
  }
  .guide-section { padding: 58px 0 52px; }
  .story-card { width: calc(100% - 32px); padding: 30px 24px; }
  .guide-story { margin-top: 34px; }
  .next-step-section { padding: 58px 0 62px; }
  .next-step-card { padding-block: 38px; }
}