/* About-only composition; shared type, colors, header and footer are unchanged. */
.about-page .about-hero{padding:72px 0 64px;text-align:left}
.about-page .about-hero h1{font-size:clamp(60px,9.6vw,135px);line-height:.98;letter-spacing:0;margin:0}
.about-page .about-hero .eyebrow{margin-bottom:16px}
.about-page .about-hero h1 .ln{display:inline}
.about-page .about-hero h1 .about-title-line{display:block;white-space:nowrap}
.about-page .about-accent{color:var(--ac)}
.about-page .about-story{padding:0}
.about-page .story-track{position:relative}
.about-page .story-stops{list-style:none;margin:0;padding:0;display:grid;gap:48px}
.about-page .story-stop{display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);align-items:center;position:relative;gap:24px}
.about-page .story-card{grid-column:1;grid-row:1;padding:clamp(24px,2.4vw,32px);border:1px solid var(--line);border-radius:28px;background:var(--card);transition:transform .35s var(--e),background .35s,color .35s,border-color .35s;position:relative}
.about-page .story-card .eyebrow{color:var(--chapter-accent);font-size:12px;letter-spacing:1.5px;margin:0 0 16px}
.about-page .story-card h2{font-size:clamp(32px,3vw,44px);line-height:1.04;margin:0 0 16px;max-width:9em}
.about-page .story-copy{color:var(--muted);font-size:16px;line-height:1.6;margin:0;transition:color .35s}
.about-page .story-pending{display:block;margin-top:20px;color:var(--chapter-accent);font-size:12px;line-height:1.5}
.about-page .story-image{grid-column:3;grid-row:1;margin:0;aspect-ratio:16/10;position:relative;overflow:hidden;border-radius:28px;border:1px solid var(--line);background:var(--card)}
.about-page .story-image img{display:block;width:100%;height:100%;object-fit:cover;transform:translateY(var(--parallax,0px)) scale(1.07)}
.about-page .story-stop:nth-child(even) .story-card{grid-column:3}
.about-page .story-stop:nth-child(even) .story-image{grid-column:1}
.about-page .story-line{position:absolute;left:calc(50% - 1px);width:2px;top:var(--line-start,0px);bottom:var(--line-end,0px);background:var(--line);pointer-events:none}
.about-page .story-progress{display:block;position:absolute;inset:0;background:var(--ac);transform:scaleY(0);transform-origin:top;box-shadow:0 0 16px color-mix(in srgb,var(--ac) 40%,transparent)}
.about-page .story-dot{grid-column:2;grid-row:1;justify-self:center;width:14px;height:14px;border-radius:50%;background:var(--ac);box-shadow:0 0 20px color-mix(in srgb,var(--ac) 33%,transparent);position:relative}
.about-page .story-dot::before{content:"";position:absolute;inset:-7px;border:1px solid color-mix(in srgb,var(--ac) 40%,transparent);border-radius:50%;background:var(--bg);z-index:-1}
.about-page .story-stop.is-visible .story-dot::after{content:"";position:absolute;inset:-7px;border:1px solid var(--ac);border-radius:50%;animation:story-pulse .9s var(--e) both}
@keyframes story-pulse{from{transform:scale(.6);opacity:1}to{transform:scale(2);opacity:0}}
.js .about-page .story-card{opacity:0;translate:-28px 0}
.js .about-page .story-stop:nth-child(even) .story-card{translate:28px 0}
.js .about-page .story-image{opacity:0;scale:.95;transition:opacity .85s var(--e),scale .85s var(--e)}
.js .about-page .story-card{transition:opacity .8s var(--e),translate .8s var(--e),transform .35s var(--e),background .35s,color .35s,border-color .35s}
.js .about-page .story-stop.is-visible .story-card{opacity:1;translate:0 0}
.js .about-page .story-stop.is-visible .story-image{opacity:1;scale:1}
.about-page .story-disclosure{text-align:center;max-width:620px;margin:44px auto 0}
.about-page .about-closing{text-align:center;padding:48px 0 88px}
.about-page .about-closing .btn{background:var(--ac);border-color:var(--ac);color:#111}
@media(hover:hover) and (pointer:fine){
.about-page .story-card:hover{transform:scale(1.03);background:var(--ac);border-color:var(--ac);color:#111}
.about-page .story-card:hover :is(.eyebrow,.story-copy,.story-pending){color:#111}
}
@media(max-width:899px){
.about-page .about-hero{padding:48px 0 40px}
.about-page .story-stops{gap:36px}
.about-page .story-stop{grid-template-columns:20px minmax(0,1fr);gap:20px;align-items:start}
.about-page .story-card,.about-page .story-stop:nth-child(even) .story-card{grid-column:2;grid-row:1;padding:28px}
.about-page .story-image,.about-page .story-stop:nth-child(even) .story-image{grid-column:2;grid-row:2}
.about-page .story-dot{grid-column:1;grid-row:1;margin-top:38px}
.about-page .story-line{left:9px}
.about-page .story-card h2{font-size:clamp(32px,5vw,44px);max-width:none}
.js .about-page .story-stop:nth-child(even) .story-card,.js .about-page .story-card{translate:16px 0}
.js .about-page .story-stop.is-visible .story-card{translate:0 0}
.about-page .about-closing{padding:40px 0 64px}
}
@media(max-width:600px){
.about-page .story-stop{grid-template-columns:16px minmax(0,1fr);gap:16px}
.about-page .story-line{left:7px}
.about-page .story-card,.about-page .story-stop:nth-child(even) .story-card{padding:24px}
.about-page .story-card .eyebrow{font-size:11px;letter-spacing:1px;margin-bottom:18px}
.about-page .story-card h2{font-size:32px;overflow-wrap:normal}
.about-page .story-copy{font-size:16px}
.about-page .story-card,.about-page .story-image{border-radius:28px}
.about-page .story-disclosure{text-align:left;margin:32px 0 0 32px}
}
@media(max-width:450px){
.about-page .about-hero{padding:36px 0 28px}
.about-page .about-hero h1{font-size:clamp(36px,11vw,50px)}
}
@media(prefers-reduced-motion:reduce){
.js .about-page .story-stop .story-card,.js .about-page .story-stop .story-image{opacity:1;translate:none;scale:none;transform:none}
.about-page .story-dot::after{display:none}
.about-page .story-image img{transform:none}
.about-page .story-card:hover{transform:none}
}

/* Match the homepage accent transitions. */
.about-page .about-accent{transition:color .5s}
.about-page .story-progress,.about-page .story-dot{transition:background .5s,box-shadow .5s}
.about-page .story-dot::before{transition:border-color .5s}