/* Our Story: copper on charcoal, with the rhythm of an art monograph. */
.story-page { --story-inset:max(9cqw, calc((100cqw - 980px) / 2)); background:radial-gradient(ellipse at 88% 9%,#88502c22,transparent 43%),#151311; }
.story-opening { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 270px; align-items:center; gap:3rem; padding:38px var(--story-inset) 30px; border-bottom:1px solid #88644080; background:linear-gradient(90deg,#11100e35,#11100e10),url('assets/03_September-13-2026.webp') center/cover; }
.story-kicker { font-size:12px; letter-spacing:.3em; color:var(--copper); margin:0 0 16px; }
.story-page h1 { font-size:clamp(40px,4.9cqw,70px); line-height:1; white-space:normal; text-transform:none; letter-spacing:-.045em; margin:0 0 22px; }
.story-page h1 em { font-weight:400; color:var(--copper); }
.story-manifesto { font:400 clamp(19px,1.9cqw,27px)/1.45 var(--display-font); margin:0; }
.story-manifesto span { color:var(--copper-bright); }
.story-emblem { display:grid; place-items:center; min-width:0; width:270px; justify-self:end; }
.emblem-frame { position:relative; display:grid; place-items:center; width:min(100%,190px); aspect-ratio:1; border:1px solid #b9845566; transform:rotate(45deg); }
.emblem-frame:before { content:""; position:absolute; inset:13px; border:1px solid #b984552e; }
.emblem-frame img { width:65%; height:auto; transform:rotate(-45deg); opacity:.88; }
.story-narrative { display:grid; grid-template-columns:180px minmax(0,740px); gap:60px; padding:30px var(--story-inset) 30px; justify-content:center; }
.story-margin { display:flex; flex-direction:column; align-items:flex-start; gap:24px; padding-top:15px; color:var(--copper); font-size:12px; letter-spacing:.2em; }
.story-margin i { height:60px; width:1px; background:linear-gradient(var(--line),#88644010); margin-left:4px; }
.story-prose p { color:#d8d1c9; font-size:17px; line-height:1.75; margin:0 0 24px; }
.story-prose p.story-lead { font:400 clamp(20px,1.6cqw,23px)/1.5 var(--display-font); color:var(--ivory); margin-bottom:26px; }
.story-prose strong { font-weight:400; color:var(--copper-bright); }
.story-divider { display:flex; align-items:center; justify-content:center; gap:25px; margin:30px 0; }
.story-divider span { height:1px; width:90px; background:linear-gradient(90deg,transparent,var(--line)); }
.story-divider span:last-child { transform:rotate(180deg); }
.story-divider img { width:40px; height:auto; opacity:.85; }
.story-closing { border-top:1px solid #88644080; margin:0 9%; padding:30px 0 36px; display:flex; align-items:end; justify-content:space-between; gap:30px; }
.story-closing p { font:400 clamp(24px,2.2cqw,32px)/1.15 var(--display-font); margin:0; }
.story-closing p span { color:var(--copper); }
.story-home { font-size:14px; padding:12px 0; border-bottom:1px solid var(--line); }
.story-home span { color:var(--copper); padding-left:18px; }
.story-home:hover { color:var(--copper-bright); }
.desktop-nav a[aria-current="page"] { color:var(--copper-bright); border-bottom:1px solid var(--copper); }
@media(max-width:850px) { .story-opening { padding:30px 7% 26px; gap:30px; grid-template-columns:minmax(0,1fr) 200px; } .story-emblem { width:200px; } .emblem-frame { width:140px; } .story-narrative { grid-template-columns:minmax(0,1fr); padding:26px 7% 20px; gap:0; } .story-margin { display:none; } .story-closing { margin:0 7%; } }
@media(max-width:550px) { .story-opening { grid-template-columns:1fr; padding:28px 7% 24px; gap:0; } .story-title-block { position:relative; z-index:1; } .story-page h1 { font-size:40px; } .story-emblem { position:absolute; width:120px; right:7%; top:36px; opacity:.16; } .emblem-frame { width:85px; } .story-manifesto { font-size:19px; } .story-prose p { font-size:17px; line-height:1.8; } .story-prose p.story-lead { font-size:20px; } .story-closing { flex-direction:column; align-items:flex-start; gap:20px; } }
