.story-page h1,.story-page h2,.story-page h3 { font-family:var(--font-display); font-weight:400; letter-spacing:-.035em; }
.story-page h2 { font-size:clamp(36px,4.7vw,64px); line-height:1.06; margin:18px 0 26px; }
.story-page h3 { font-size:28px; line-height:1.15; margin:15px 0; }
.story-page p { font-size:15px; line-height:1.85; color:var(--muted); }
.story-page p+p { margin-top:18px; }
.story-space { padding-top:100px; padding-bottom:100px; }
.story-hero { display:grid; grid-template-columns:1fr 1fr; padding-top:40px; padding-bottom:48px; gap:50px; align-items:center; }
.story-hero h1 { font-size:clamp(54px,6.5vw,94px); line-height:.99; margin:26px 0; }
.story-hero-copy>p { max-width:38ch; font-size:17px; }
.story-hero .btn { margin-top:30px; }
.story-caption { display:block; font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; margin-top:40px; }
.story-hero-photo { position:relative; margin:0; overflow:hidden; }
.story-hero-photo img { display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; animation:story-drift 16s ease-in-out infinite; }
.story-hero-photo figcaption { position:absolute; bottom:20px; left:20px; right:20px; padding:14px; background:var(--cream); text-align:center; font:9px var(--font-mono); text-transform:uppercase; letter-spacing:.13em; }
@keyframes story-drift { 0%,100%{transform:scale(1.01)} 50%{transform:scale(1.06)} }
.story-ribbon { display:flex; justify-content:space-around; flex-wrap:wrap; gap:20px; padding:25px; background:var(--butter); font:10px var(--font-mono); letter-spacing:.12em; text-transform:uppercase; }
.story-why { display:grid; grid-template-columns:1fr 2fr; gap:60px; }
.story-why>.eyebrow { padding-top:26px; }
.story-why>div { max-width:700px; }
.story-manifesto { padding:85px 25px; background:var(--ink); color:var(--cream); text-align:center; }
.story-manifesto .logo-dots { margin:0 auto 32px; }
.story-manifesto p { font:400 clamp(36px,5vw,66px)/1.15 var(--font-display); letter-spacing:-.03em; color:var(--cream); margin-bottom:32px; }
.story-manifesto .eyebrow { color:var(--butter); }
.story-heading { display:flex; justify-content:space-between; gap:45px; align-items:end; margin-bottom:38px; }
.story-heading h2 { margin-bottom:0; }
.story-heading>p { max-width:38ch; }
.story-butters { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.story-butters img,.story-formats img { width:100%; height:auto; aspect-ratio:1; object-fit:cover; display:block; margin-bottom:26px; }
.story-butters article { border-bottom:1px solid var(--line); padding-bottom:22px; }
.story-butters p { font-size:13px; }
.story-latin { display:block; margin-top:22px; color:var(--butter-deep); font:9px/1.7 var(--font-mono); text-transform:uppercase; letter-spacing:.05em; }
.story-science { background:var(--cream-2); }
.story-science-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.story-science-grid figure { margin:0; position:relative; }
.story-science-grid img { width:100%; height:auto; display:block; }
.story-science-grid figcaption { position:absolute; bottom:20px; left:20px; padding:14px; background:var(--cream); font:10px var(--font-mono); text-transform:uppercase; letter-spacing:.1em; }
.story-science-copy article { display:flex; gap:24px; padding:25px 0; border-bottom:1px solid var(--line); }
.story-element { flex:0 0 62px; height:72px; display:grid; place-items:center; border:1px solid var(--line-2); font:32px var(--font-display); }
.story-science-copy h3 { margin-top:0; font-size:25px; }
.story-science-copy p { font-size:14px; }
.story-note { margin-top:40px; border-top:1px solid var(--line); padding-top:28px; max-width:900px; }
.story-note p { margin:12px 0 20px; font-size:13px; }
.story-values { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:35px; }
.story-values article { padding:30px; background:var(--cream-2); }
.story-values article:nth-child(2){background:#e1e4d9;}
.story-values p { font-size:14px; }
.story-values .btn-ghost { margin-top:25px; display:inline-block; }
.story-ritual { display:grid; grid-template-columns:1.15fr 1fr; background:var(--cream-2); align-items:center; }
.story-ritual figure { margin:0; height:100%; min-height:620px; }
.story-ritual img { width:100%; height:100%; object-fit:cover; }
.story-ritual>div { padding:50px; }
.story-ritual .story-small { font-size:12px; }
.story-formats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.story-formats>a { color:inherit; text-decoration:none; }
.story-formats img { transition:filter .5s; }
.story-formats>a:hover img { filter:brightness(1.04); }
.story-formats p { font-size:14px; }
.story-close { text-align:center; padding:95px 25px; background:#e1e4d9; }
.story-close h2 { font-size:clamp(56px,7vw,90px); }
.story-close .btn { margin:30px 0 20px; }
.story-contact { display:block; font-size:12px; text-underline-offset:4px; }
@media(max-width:900px){
 .story-hero { gap:28px; } .story-butters { grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px 22px; }
 .story-science-grid { gap:30px; } .story-values { gap:16px; } .story-values article { padding:22px; }
 .story-ritual>div { padding:30px; }
}
@media(max-width:650px){
 .story-space { padding-top:60px; padding-bottom:60px; } .story-hero { grid-template-columns:1fr; padding-top:40px; gap:35px; }
 .story-hero h1 { font-size:64px; } .story-hero-photo img { aspect-ratio:1; } .story-caption { margin-top:25px; }
 .story-ribbon { font-size:8px; gap:14px; } .story-why { grid-template-columns:1fr; gap:10px; }
 .story-heading { display:block; } .story-heading>p { margin-top:22px; } .story-butters h3 { font-size:25px; }
 .story-butters .eyebrow { font-size:8px; } .story-science-grid,.story-values,.story-ritual,.story-formats { grid-template-columns:1fr; }
 .story-science-copy article { gap:18px; } .story-element { flex-basis:50px; height:60px; }
 .story-ritual figure { min-height:0; height:320px; } .story-ritual>div { padding:32px 24px; }
 .story-formats { gap:42px; } .story-close { padding:65px 22px; }
}
@media(prefers-reduced-motion:reduce){html:not(.motion-ready) .story-hero-photo img{animation:none;}}