.story-button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-height:48px;padding:15px 23px;border:1px solid var(--gold);color:var(--ink);font-size:14px;line-height:1.4;transition:background .2s,color .2s}
.story-button:hover{background:var(--gold);color:var(--bg)}
.story-button span{font-size:21px;color:var(--gold)}
.story-button:hover span{color:var(--bg)}
.founder .story-button{margin-top:28px;margin-left:30px}
.story-page{max-width:1320px;margin:0 auto;padding:42px 5% 90px}
.story-back{display:inline-block;font-size:14px;line-height:1.6;color:var(--muted)}
.story-heading{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:60px;align-items:center;padding:54px 0 64px;border-bottom:1px solid var(--line)}
.story-heading h1{font-size:clamp(38px,4.8vw,70px);line-height:1.2;max-width:760px;margin:26px 0 36px}
.story-heading h1 em{display:block}
.story-author{font-size:15px;line-height:1.8}
.story-author span{display:block;color:var(--muted);font-size:12px}
.story-portrait{margin:0;padding:12px;border:1px solid #615737;max-width:340px;justify-self:end}
.story-portrait img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1)}
.story-body{max-width:730px;margin:58px auto 0;font-size:18px;line-height:1.95;color:#c3c0b5}
.story-body p{margin:0 0 25px}
.story-body>p:first-child{font-family:Prata,Georgia,serif;font-size:clamp(24px,3vw,34px);color:var(--ink);line-height:1.5;margin-bottom:34px}
.story-body strong{color:var(--ink);font-weight:600}
.story-ending{margin:52px 0;padding:32px 0 32px 26px;border-left:2px solid var(--gold);font:clamp(25px,3vw,36px)/1.65 Prata,Georgia,serif;color:var(--ink)}
.story-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding-top:22px;border-top:1px solid var(--line)}
@media(max-width:700px){.story-page{padding:30px 7% 56px}.story-heading{grid-template-columns:1fr;gap:25px;padding:34px 0}.story-heading h1{max-width:none;font-size:clamp(34px,8.5vw,52px)}.story-portrait{justify-self:start;max-width:240px}.story-body{margin-top:36px;font-size:16px;line-height:1.85}.story-ending{padding-left:18px;margin:36px 0}.founder .story-button{margin-left:30px}.story-heading .eyebrow{font-size:9px;letter-spacing:.12em}}

/* Keep the long title within its own column at every viewport size. */
.story-heading > div{min-width:0;container-type:inline-size}
.story-heading h1{max-width:100%;font-size:28px;font-size:min(46px,7cqw);line-height:1.3;overflow-wrap:anywhere}
.story-heading h1 em{max-width:100%}
@media(max-width:900px){
.story-heading{grid-template-columns:minmax(0,1fr);gap:28px}
.story-portrait{justify-self:start}
.story-heading h1{font-size:28px;font-size:min(46px,7cqw)}
}