:root { --wine:#310711; --wine-deep:#150207; --ivory:#f4f0e9; --champagne:#c8a77d; --paper:#f3eee7; --serif:"Cormorant Garamond",Georgia,serif; --sans:Manrope,Arial,sans-serif; }
* { box-sizing:border-box; }
html { background:var(--wine-deep); scroll-behavior:smooth; }
body { margin:0; color:var(--ivory); background:var(--wine-deep); font-family:var(--sans); }
a { color:inherit; }
.story-skip { position:fixed; z-index:50; top:8px; left:8px; padding:10px 14px; color:#111; background:#fff; transform:translateY(-150%); }
.story-skip:focus { transform:none; }
.story-header { position:absolute; z-index:10; top:0; right:0; left:0; display:flex; align-items:center; gap:28px; min-height:76px; padding:0 max(20px,calc((100% - 1180px)/2)); border-bottom:1px solid rgba(255,255,255,.22); background:linear-gradient(90deg,rgba(55,5,19,.9),rgba(13,11,9,.94) 48%,rgba(34,4,13,.9)); backdrop-filter:blur(16px); }
.story-brand { font:600 23px/1 var(--serif); letter-spacing:.055em; text-decoration:none; white-space:nowrap; }
.story-header nav { display:flex; align-items:center; justify-content:flex-end; gap:26px; width:100%; min-height:76px; font-size:13px; }
.story-header nav a { color:rgba(244,240,233,.78); text-decoration:none; }
.story-header nav .is-current { color:var(--champagne); }
.story-header-cta { display:inline-flex; align-items:center; justify-content:center; width:140px; min-height:44px; padding:0; border:1px solid rgba(200,167,125,.7); border-radius:999px; color:var(--ivory)!important; font:500 13px/1 var(--sans); white-space:nowrap; }
.story-eyebrow,.story-section-number { margin:0; color:var(--champagne); font-size:10px; letter-spacing:.2em; text-transform:uppercase; }
.story-hero { min-height:760px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:end; gap:6vw; padding:155px max(24px,7vw) 92px; background:linear-gradient(135deg,#150207,#4b091d 62%,#7c183d); }
.story-hero-copy { align-self:center; max-width:610px; }
.story-hero h1 { max-width:650px; margin:24px 0 26px; font:400 clamp(68px,8.7vw,136px)/.82 var(--serif); letter-spacing:-.06em; }
.story-lede { max-width:390px; margin:0; color:rgba(244,240,233,.72); font-size:16px; line-height:1.7; }
.story-hero-image { height:470px; margin:0; overflow:hidden; border:1px solid rgba(255,255,255,.28); }
.story-hero-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.7) brightness(.78); }
.story-section,.story-chapter,.story-values,.story-closing { padding:120px max(24px,7vw); }
.story-section { display:grid; grid-template-columns:minmax(180px,.65fr) minmax(0,1.35fr); gap:10vw; color:var(--wine); background:var(--paper); }
.story-section-copy { max-width:760px; }
.story-section h2,.story-chapter h2,.story-values h2,.story-closing h2 { margin:0 0 28px; font:400 clamp(44px,5vw,76px)/.9 var(--serif); letter-spacing:-.045em; }
.story-section-number { color:#987648; }
.story-section-copy p,.story-chapter-copy p,.story-values-copy p,.story-closing > p:not(.story-eyebrow):not(.story-signature) { max-width:650px; margin:0 0 20px; color:rgba(49,7,17,.7); font-size:15px; line-height:1.8; }
.story-chapter { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:10vw; background:#e8ded2; color:var(--wine); }
.story-chapter-image { height:540px; overflow:hidden; background:#21040b; }
.story-chapter-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.75) contrast(1.05); }
.story-chapter-copy { max-width:610px; }
.story-chapter-copy p { color:rgba(49,7,17,.7); }
.story-values { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10vw; background:var(--wine); }
.story-values h2 { max-width:580px; }
.story-values-copy { align-self:end; max-width:620px; color:rgba(244,240,233,.76); }
.story-values-copy p { color:inherit; }
.story-values-list { display:flex; gap:28px; margin-top:42px; padding-top:18px; border-top:1px solid rgba(200,167,125,.5); color:var(--champagne); font:400 clamp(27px,3vw,45px)/1 var(--serif); }
.story-closing { text-align:center; background:linear-gradient(135deg,#f4f0e9,#eadfd4); color:var(--wine); }
.story-closing h2 { max-width:850px; margin:20px auto 25px; }
.story-closing > p:not(.story-eyebrow):not(.story-signature) { margin:0 auto; color:rgba(49,7,17,.68); }
.story-signature { margin:55px auto 0!important; font:400 clamp(30px,4vw,58px)/1 var(--serif)!important; letter-spacing:-.03em; }
.story-signature em { color:#8d1d41; }
.story-button { display:inline-flex; gap:18px; margin-top:42px; padding-bottom:10px; border-bottom:1px solid rgba(49,7,17,.55); color:var(--wine); font-size:11px; letter-spacing:.16em; text-decoration:none; text-transform:uppercase; }
.story-button span { color:#8d1d41; font-size:16px; }
.story-footer { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:42px max(24px,7vw); color:rgba(244,240,233,.7); background:#150207; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.story-footer a { text-decoration:none; }
@media (max-width:800px) { .story-header { min-height:72px; padding:0 20px; } .story-brand { font-size:18px; } .story-header nav a:not(.story-header-cta) { display:none; } .story-header nav { gap:12px; font-size:9px; } .story-hero { min-height:760px; grid-template-columns:1fr; gap:42px; padding:125px 22px 62px; } .story-hero h1 { font-size:clamp(62px,18vw,100px); } .story-hero-image { height:260px; } .story-section,.story-chapter,.story-values { grid-template-columns:1fr; gap:38px; padding:76px 22px; } .story-section h2,.story-chapter h2,.story-values h2,.story-closing h2 { font-size:clamp(44px,12vw,66px); } .story-chapter-image { height:330px; order:2; } .story-chapter-copy { order:1; } .story-values-list { gap:18px; flex-wrap:wrap; } .story-closing { padding:82px 22px; } .story-footer { flex-direction:column; text-align:center; padding:36px 22px; } }
