.page-home .hero {
  padding-top: 8px;
  padding-bottom: clamp(40px, 6vw, 72px);
}

.page-home .hero__grid {
  display: grid;
  gap: 32px;
  align-items: center;
}

.page-home .hero__lead {
  order: 1;
}

.page-home .hero__media {
  order: 2;
}

.page-home .hero__lede {
  margin-top: 20px;
  max-width: 32em;
}

.page-home .hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.page-home .hero__index {
  list-style: none;
  margin: 44px 0 0;
  padding: 20px 0 0;
  border-top: 1px solid var(--gold-line);
  display: grid;
  gap: 14px;
}

.page-home .hero__index li {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-size: var(--step-17);
}

.page-home .hero__index .mono {
  color: var(--gold);
  font-size: var(--step-13);
  letter-spacing: 0.12em;
  flex: 0 0 auto;
}

.page-home .axis {
  align-items: start;
}

.page-home .axis__text h2,
.page-home .revision h2,
.page-home .newcomer h2,
.page-home .section--paper h2 {
  margin: 14px 0 20px;
}

.page-home .path-svg {
  display: block;
  width: 100%;
  max-width: 560px;
  height: auto;
  margin: 28px 0 4px;
  opacity: 0.9;
}

.page-home .steps {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  gap: 0;
  border-top: 1px solid var(--gold-line);
}

.page-home .step {
  padding: 20px 0;
  border-bottom: 1px solid var(--gold-line);
  display: grid;
  gap: 6px;
}

.page-home .step__num {
  color: var(--gold);
  font-size: var(--step-13);
  letter-spacing: 0.12em;
}

.page-home .step__title {
  font-size: var(--step-21);
  font-weight: 600;
  color: var(--paper);
  line-height: 1.5;
}

.page-home .step__desc {
  margin: 0;
  font-size: var(--step-17);
  line-height: 1.9;
  color: var(--slate);
  max-width: 32em;
}

.page-home .axis__more {
  margin-top: 24px;
  font-size: var(--step-17);
  line-height: 1.9;
  color: var(--slate);
  max-width: 34em;
}

.page-home .axis__media {
  margin-top: 32px;
}

.page-home .axis__cap {
  margin-top: 12px;
  font-size: var(--step-13);
  letter-spacing: 0.04em;
}

.page-home .cards-visual {
  margin: 32px 0 40px;
}

.page-home .index-cards {
  display: grid;
  gap: 24px;
}

.page-home .index-card {
  position: relative;
  padding: 28px 24px 24px;
  box-shadow: 0 10px 0 -6px rgba(107, 84, 35, 0.18);
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}

.page-home .index-card__no {
  position: absolute;
  top: 16px;
  right: 20px;
  color: var(--gold-deep);
  font-size: var(--step-21);
  letter-spacing: 0.08em;
}

.page-home .index-card h3 {
  margin: 0 0 16px;
}

.page-home .index-card__q {
  margin: 0 0 4px;
  font-size: var(--step-13);
  letter-spacing: 0.12em;
  color: var(--vermilion);
  font-weight: 600;
}

.page-home .index-card__a {
  margin: 0 0 16px;
  font-size: var(--step-17);
  line-height: 1.9;
  color: var(--ink-on-card);
}

.page-home .index-card__go {
  margin: 8px 0 0;
  opacity: 0.7;
  transition: opacity 200ms var(--ease);
}

.page-home .index-card:hover,
.page-home .index-card:focus-within {
  transform: translateY(-6px);
  box-shadow: 0 16px 0 -6px rgba(107, 84, 35, 0.22);
}

.page-home .index-card:hover .index-card__go,
.page-home .index-card:focus-within .index-card__go {
  opacity: 1;
}

.page-home .newcomer {
  align-items: start;
}

.page-home .routes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 24px;
}

.page-home .route {
  padding-left: 20px;
  border-left: 2px solid var(--gold-line);
}

.page-home .route__no {
  display: inline-block;
  color: var(--gold);
  font-size: var(--step-13);
  letter-spacing: 0.12em;
}

.page-home .route__title {
  margin: 8px 0 8px;
  font-size: var(--step-21);
  font-weight: 600;
  line-height: 1.5;
  color: var(--paper);
}

.page-home .route__desc {
  margin: 0;
  font-size: var(--step-17);
  line-height: 1.9;
  color: var(--slate);
  max-width: 34em;
}

.page-home .timeline {
  list-style: none;
  margin: 32px 0 0;
  padding: 0;
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  padding-bottom: 8px;
}

.page-home .timeline__item {
  position: relative;
  flex: 0 0 78%;
  scroll-snap-align: start;
  padding: 22px 20px 20px;
  background: linear-gradient(180deg, rgba(216, 169, 59, 0.14), rgba(216, 169, 59, 0.02));
  border-top: 2px solid var(--gold-line);
}

.page-home .timeline__item--now {
  border-top-color: var(--vermilion);
  background: linear-gradient(180deg, rgba(200, 64, 44, 0.18), rgba(200, 64, 44, 0.02));
}

.page-home .timeline__text {
  margin: 14px 0 0;
  font-size: var(--step-17);
  line-height: 1.9;
  color: var(--slate);
}

.page-home .revision__media {
  margin-top: 32px;
}

.page-home .revision__link {
  margin-top: 28px;
  font-size: var(--step-17);
  line-height: 1.9;
  color: var(--slate);
  max-width: 34em;
}

.page-home .section--paper .accordion {
  margin-top: 32px;
}

.page-home .contact-strip {
  margin-top: 24px;
  padding: 32px 24px;
  display: grid;
  gap: 28px;
}

.page-home .contact-strip h2 {
  margin: 0 0 12px;
  color: var(--paper);
}

.page-home .contact-strip .prose {
  color: var(--slate);
}

.page-home .contact-strip__rows {
  display: grid;
  gap: 16px;
  align-content: start;
}

.page-home .copy-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding: 14px 0;
  border-top: 1px solid var(--gold-line);
}

.page-home .copy-row__label {
  flex: 0 0 auto;
  color: var(--gold);
  font-size: var(--step-13);
  letter-spacing: 0.12em;
}

.page-home .copy-row__value {
  flex: 1 1 200px;
  min-width: 0;
  font-size: var(--step-17);
  color: var(--paper);
  word-break: break-all;
}

.page-home .copy-row .copy-btn {
  flex: 0 0 auto;
}

.page-home .contact-strip__more {
  margin: 4px 0 0;
}

@media (min-width: 768px) {
  .page-home .hero__index {
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
  }

  .page-home .hero__index li {
    border-left: 1px solid var(--gold-line);
    padding: 0 16px;
    display: block;
  }

  .page-home .hero__index li:first-child {
    border-left: 0;
    padding-left: 0;
  }

  .page-home .hero__index .mono {
    display: block;
    margin-bottom: 8px;
  }

  .page-home .index-cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
  }

  .page-home .index-card:nth-child(2) {
    transform: translateY(20px);
  }

  .page-home .index-card:nth-child(3) {
    transform: translateY(-8px);
  }

  .page-home .index-card:nth-child(2):hover,
  .page-home .index-card:nth-child(2):focus-within {
    transform: translateY(12px);
  }

  .page-home .index-card:nth-child(3):hover,
  .page-home .index-card:nth-child(3):focus-within {
    transform: translateY(-16px);
  }

  .page-home .timeline__item {
    flex: 1 1 0;
  }

  .page-home .contact-strip {
    grid-template-columns: 5fr 6fr;
    gap: 40px;
    padding: 44px 40px;
  }
}

@media (min-width: 960px) {
  .page-home .hero__grid {
    grid-template-columns: 5fr 7fr;
    gap: 0;
    align-items: center;
  }

  .page-home .hero__lead {
    padding-right: 48px;
    order: 1;
  }

  .page-home .hero__media {
    order: 2;
    border-left: 1px solid var(--gold-line);
    padding-left: 48px;
  }

  .page-home .axis__media {
    margin-top: 0;
  }

  .page-home .revision__media {
    margin-top: 0;
  }
}
</final>