/* About — a journey in five moments */
.kj-about { background: var(--kj-tobacco); color: var(--kj-parchment); }
.kj-about__intro { text-align: center; padding: clamp(4rem, 9vw, 7rem) var(--gut) clamp(2rem, 4vw, 3rem); }
.kj-about .kj-about__kicker { font-family: var(--kj-serif) !important; font-style: italic; font-weight: 400 !important; font-size: 1.15rem !important; color: var(--kj-gold) !important; margin: 0 0 .7rem !important; }
.kj-about .kj-about__sub { font-family: var(--kj-serif); font-weight: 300; font-size: clamp(2.2rem, 5.4vw, 4rem); line-height: 1.05; color: var(--kj-parchment); margin: 0 auto; max-width: 16ch; }
.kj-story-line { list-style: none; margin: 0 auto !important; padding: clamp(1rem, 3vw, 2rem) var(--gut) 0 !important; max-width: 78rem !important; position: relative; }
/* the thread that ties the five moments together */
.kj-story-line::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; transform: translateX(-.5px);
	background: linear-gradient(rgba(212, 175, 55, 0), rgba(212, 175, 55, .55) 6%, rgba(212, 175, 55, .55) 94%, rgba(212, 175, 55, 0)); }
.kj-chapter { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: center; padding: clamp(3rem, 7vw, 6rem) 0; margin: 0 !important; }
.kj-chapter::before { content: ""; position: absolute; left: 50%; top: 50%; width: 11px; height: 11px; background: var(--kj-gold); transform: translate(-50%, -50%) rotate(45deg); box-shadow: 0 0 0 6px var(--kj-tobacco); z-index: 1; }
.kj-chapter.is-flip .kj-chapter__media { order: 2; }
.kj-chapter__media { margin: 0; }
.kj-chapter__img, .kj-chapter__ph { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; outline: 1px solid rgba(212, 175, 55, .5); outline-offset: 10px; }
.kj-chapter__ph { background: var(--kj-charcoal); display: grid; place-items: center; }
.kj-chapter__ph span { font-family: var(--kj-serif); font-size: 5rem; font-weight: 300; color: rgba(212, 175, 55, .35); }
.kj-about .kj-chapter__title { font-size: clamp(2rem, 4.2vw, 3.3rem) !important; font-weight: 300 !important; line-height: 1.08 !important; color: var(--kj-parchment) !important; margin: 0 0 1.2rem !important; font-variation-settings: "opsz" 144; }
.kj-about .kj-chapter__lead { font-family: var(--kj-serif); font-style: italic; font-size: clamp(1.4rem, 2.4vw, 1.9rem); color: var(--kj-gold); margin: 0 0 1.2rem; }
.kj-about .kj-chapter__text p:not(.kj-chapter__lead) { color: #E6DFC4; font-size: 1.08rem; line-height: 1.8; max-width: 34rem; }
.kj-about__close { text-align: center; padding: clamp(3rem, 7vw, 6rem) var(--gut) clamp(5rem, 10vw, 8rem); border-top: 1px solid rgba(212, 175, 55, .3); }
.kj-about .kj-about__tag { font-family: var(--kj-serif); font-weight: 300; font-size: clamp(2.8rem, 8vw, 6rem); line-height: 1; color: var(--kj-parchment); margin: 0 auto 2rem; max-width: none; }
.kj-about__close .kj-phero__actions { justify-content: center; }
@media (max-width: 860px) {
	.kj-story-line::before { left: calc(var(--gut) + 5px); }
	.kj-chapter { grid-template-columns: 1fr; gap: 2rem; padding-left: 2.2rem; }
	.kj-chapter::before { left: 5px; top: 3rem; transform: translate(-50%, 0) rotate(45deg); }
	.kj-chapter.is-flip .kj-chapter__media { order: 0; }
}
