/* The deeper card journey only: leave the gallery, product page and homepage intact. */
.cards-page .card-learning-flow {
  border-top: 1px solid var(--pc-line);
  margin-top: 8px;
}

.cards-page .card-learning-flow > .section { padding-block: 44px; }
.cards-page .card-learning-flow [id] { scroll-margin-top: 28px; }
.cards-page .card-learning-flow .wrap > *,
.cards-page .card-learning-flow .section-heading > *,
.cards-page .card-learning-flow .two-col > *,
.cards-page .card-learning-flow .wisdom-entry > *,
.cards-page .card-learning-flow .ritual-sequence li > *,
.cards-page .card-learning-flow .product-path-links > a > div { min-width: 0; }

.cards-page .card-learning-flow h2 {
  font-size: clamp(30px, 3.2vw, 42px);
  line-height: 1.12;
}
.cards-page .card-learning-flow h3 { font-size: 27px; line-height: 1.15; }
.cards-page .card-learning-flow .product-unity {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 8%;
}
.cards-page .card-learning-flow .product-storybook {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8%;
}
.cards-page .card-learning-flow .product-ritual {
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: 32px 8%;
}
.cards-page .card-learning-flow .product-connection-layout {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 7%;
}
.cards-page .card-learning-flow .connection-figure { max-width: 410px; width: 100%; }
.cards-page .card-learning-flow .wisdom-map { gap: 24px; padding-left: 30px; }
.cards-page .card-learning-flow .wisdom-entry { gap: 18px; }
.cards-page .card-learning-flow .wisdom-mark { width: 44px; font-size: 35px; }
.cards-page .card-learning-flow .edge-reading-note { gap: 16px; padding-bottom: 18px; }
.cards-page .card-learning-flow .edge-reading-note p { font-size: 23px; line-height: 1.4; }
.cards-page .card-learning-flow .storybook-page-count { font-size: 54px; }
.cards-page .card-learning-flow .product-paths { padding-top: 24px; }
.cards-page .card-learning-flow .product-path-links > a { gap: 22px; }
.cards-page .card-learning-flow .product-final p { max-width: 640px; margin-inline: auto; }
.cards-page .card-learning-flow .product-final .product-buy-button {
  max-width: 100%;
  min-height: 46px;
  gap: 14px;
  padding: 13px 20px;
}
.cards-page .card-learning-flow .product-final .product-checkout-note { font-size: 11px; }

@media (max-width: 760px) {
  .cards-page .card-learning-flow > .section { padding-block: 32px; }
  .cards-page .card-learning-flow .product-unity,
  .cards-page .card-learning-flow .product-storybook,
  .cards-page .card-learning-flow .product-ritual,
  .cards-page .card-learning-flow .product-connection-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 26px;
  }
  .cards-page .card-learning-flow .product-ritual > .text-link { grid-column: 1; }
  .cards-page .card-learning-flow .connection-figure { max-width: 350px; }
  .cards-page .card-learning-flow .realm-doors { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .cards-page .card-learning-flow .wheel-positions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
  .cards-page .card-learning-flow .storybook-page-count { font-size: 47px; margin-top: 20px; }
}

@media (max-width: 540px) {
  .cards-page .card-learning-flow h2 { font-size: 32px; }
  .cards-page .card-learning-flow h3 { font-size: 26px; }
  .cards-page .card-learning-flow .wisdom-map { padding-left: 20px; }
  .cards-page .card-learning-flow .wisdom-entry { gap: 14px; }
  .cards-page .card-learning-flow .wisdom-mark { width: 34px; font-size: 31px; }
  .cards-page .card-learning-flow .edge-reading-note p { font-size: 21px; }
  .cards-page .card-learning-flow .ritual-sequence li { gap: 16px; }
  .cards-page .card-learning-flow .product-path-links > a { gap: 14px; }
  .cards-page .card-learning-flow .product-final .product-buy-button { font-size: 11px; padding-inline: 16px; gap: 10px; }
}

@media (max-width: 360px) {
  .cards-page .card-learning-flow h2 { font-size: 30px; }
  .cards-page .card-learning-flow h3 { font-size: 24px; }
  .cards-page .card-learning-flow .wheel-positions { gap: 14px; }
}