/* Copy and social links on the left; a typographic learning sequence on the right. */
/* One inherited timeline drives each word and its matching rail segment. */
@property --chapter-reveal{syntax:'<percentage>';inherits:true;initial-value:0%}
@property --chapter-shift{syntax:'<length>';inherits:true;initial-value:0px}
.content-section{--journey-duration:9s;min-height:0;padding-block:80px;grid-template-columns:1.15fr 1fr;gap:90px;align-items:start;align-content:start}
.content-intro h2{max-width:580px}
.content-intro>.social-links{margin-top:28px}
.sharing-column{justify-self:center;min-width:0}
.sharing-column .learning-loop{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin:0;width:fit-content}
.journey-stage{position:relative;padding-inline-start:30px}
.journey-rail{position:absolute;inset-inline-start:0;top:0;width:16px;height:312px;overflow:visible}
.rail-base{stroke:var(--neutral-200);stroke-width:1}
.journey-chapters{list-style:none;margin:0;padding:0}
.journey-chapter{position:relative;display:flex;align-items:baseline;gap:22px;min-height:104px;color:var(--neutral-600);animation:chapter-sync var(--journey-duration) infinite cubic-bezier(.22,1,.36,1);animation-delay:var(--chapter-delay)}
.journey-chapter::before{content:'';position:absolute;inset-inline-start:-23px;top:0;width:2px;height:100%;background:var(--vermilion-500);clip-path:inset(0 0 calc(100% - var(--chapter-reveal)) 0)}
.chapter-number{font:11px var(--font-mono);color:var(--neutral-600)}
.chapter-word{position:relative;isolation:isolate;display:inline-block;font:700 68px/1.2 var(--font-head);letter-spacing:-.055em;color:inherit;transform:translateX(var(--chapter-shift))}
.chapter-word::before{content:'';position:absolute;inset:53% -.025em 14%;z-index:-1;background:var(--vermilion-500);clip-path:inset(0 calc(100% - var(--chapter-reveal)) 0 0)}
.sharing-column .learning-pause{margin:12px 0 0 0;padding:5px 0;font-size:10px}
.vertical-journey.is-paused *,.vertical-journey.is-paused *::before{animation-play-state:paused!important}
@keyframes chapter-sync{0%,33.33%,100%{--chapter-reveal:0%;--chapter-shift:0px;color:var(--neutral-600)}7%,27%{--chapter-reveal:100%;--chapter-shift:8px;color:var(--neutral-950)}}
[dir=rtl] .chapter-word{font-family:var(--font-body);font-size:56px;line-height:1.5;letter-spacing:0;transform:translateX(calc(-1 * var(--chapter-shift)))}
[dir=rtl] .chapter-word::before{clip-path:inset(0 0 0 calc(100% - var(--chapter-reveal)))}
@media(min-width:761px){.content-section{grid-template-rows:auto auto;row-gap:0}.content-intro{display:block;grid-column:1;grid-row:2}.content-section>.eyebrow{grid-column:1;grid-row:1;margin:0 0 18px}.content-intro>h2{grid-column:1;grid-row:2;margin:0 0 23px}.content-intro>.content-description{grid-column:1;grid-row:3}.content-intro>.social-links{grid-column:1;grid-row:4;align-self:start}.sharing-column{grid-column:2;grid-row:2;margin-top:-5px}}
@media(max-width:1100px) and (min-width:761px){.content-section{gap:0 42px}.chapter-word{font-size:58px}.journey-chapter{gap:18px}[dir=rtl] .chapter-word{font-size:48px}}
@media(max-width:760px){.content-section{min-height:0;padding-block:56px;grid-template-columns:1fr;gap:0}.content-section>.eyebrow{margin-bottom:18px}.content-intro h2{margin-top:0}.sharing-column{justify-self:start;margin-top:48px}.chapter-word{font-size:58px}[dir=rtl] .chapter-word{font-size:48px}.content-intro>.social-links{margin-top:26px}.journey-stage{padding-inline-start:25px}.journey-chapter::before{inset-inline-start:-18px}.journey-chapter{gap:20px}}
@media(prefers-reduced-motion:reduce){.vertical-journey *,.vertical-journey *::before{animation:none!important;transform:none!important}.chapter-word{color:var(--neutral-950)}.chapter-word::before{clip-path:inset(0 100% 0 0)}.journey-chapter:last-child .chapter-word::before{clip-path:inset(0)}.journey-chapter:last-child{--chapter-reveal:100%}.sharing-column .learning-pause{display:none}}

/* Desktop sequence spans exactly the headline-to-social-icons height. */
@media(min-width:761px){
 .sharing-column{align-self:stretch;margin-top:0;width:min(100%,290px);container-type:size}
 .sharing-column .learning-loop,.sharing-column .journey-stage{height:100%}
 .sharing-column .journey-chapters{height:100%;display:flex;flex-direction:column;justify-content:space-between}
 .sharing-column .journey-chapter{min-height:0}
 .sharing-column .chapter-word{font-size:clamp(42px,22cqh,60px);line-height:1.05}
 .sharing-column .journey-rail{height:100%}
 [dir=rtl] .sharing-column .chapter-word{font-size:clamp(38px,19cqh,52px);line-height:1.2}
}