.hero{padding:clamp(28px,7vw,60px) 0 clamp(20px,4vw,40px);text-align:center}
.hero .kicker{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);margin-bottom:22px}
.hero h1{font-weight:400;font-style:italic;font-size:clamp(38px,5.6vw,72px);line-height:1.1;margin:0 auto 20px;max-width:820px}
.hero p{max-width:460px;margin:0 auto;font-size:16px;opacity:.75}
.section{padding:clamp(20px,4vw,40px) 0 clamp(48px,13vw,130px)}

.story-segments{display:flex;flex-direction:column}
.segment{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,56px);align-items:center;padding:clamp(32px,6vw,64px) 0;border-top:1px solid var(--rule)}
.story-segments .segment:first-child{border-top:none;padding-top:0}
.story-segments .segment:last-child{border-bottom:1px solid var(--rule);padding-bottom:clamp(32px,6vw,64px)}
.segment:nth-child(even) .segment-media{order:2}

.segment-copy h2{font-weight:400;font-style:italic;font-size:clamp(22px,3vw,32px);margin:0 0 14px}
.segment-copy p{margin:0;font-size:15px;line-height:1.65;opacity:.8;max-width:46ch}

@media (max-width:640px){
.segment{grid-template-columns:1fr;gap:20px}
.segment-media{order:-1 !important}
}