:root{--black:#080808;--ivory:#f4f0e5;--red:#e32219;--muted:#aba79d;--line:rgba(244,240,229,.16)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--ivory);font-family:"DM Sans",sans-serif;overflow-x:hidden}
.grain{position:fixed;z-index:50;inset:0;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}
.progress{position:fixed;z-index:70;top:0;left:0;width:var(--progress,0%);height:2px;background:var(--red)}
.nav{height:84px;position:fixed;z-index:60;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid rgba(255,255,255,.13);font-size:.72rem;letter-spacing:.15em;transition:.35s}
.nav.scrolled{height:70px;background:rgba(8,8,8,.76);backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:13px;color:var(--ivory);text-decoration:none}
.brand span{display:grid;place-items:center;width:34px;height:34px;background:var(--red);font:700 1rem "Oswald"}
.brand b{font-weight:600}
.nav nav{display:flex;gap:32px}
.nav nav a,.nav-cta{color:var(--ivory);text-decoration:none}
.nav nav a{opacity:.68;transition:.25s}
.nav nav a:hover{opacity:1}
.nav-cta i{color:var(--red);font-style:normal;margin-left:8px;font-size:1rem}
.hero{height:100svh;min-height:760px;position:relative;display:grid;grid-template-columns:58% 42%;overflow:hidden;background:radial-gradient(circle at 73% 28%,#251818,#0c0b0b 34%,#080808 65%)}
.hero:after{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(90deg,transparent 0 48%,rgba(255,255,255,.035) 48% 48.06%,transparent 48.06%),linear-gradient(0deg,rgba(0,0,0,.42),transparent 42%)}
.red-slash{position:absolute;z-index:1;width:150vw;height:72px;left:-38vw;top:56%;background:var(--red);transform:rotate(-39deg);opacity:.8;mix-blend-mode:multiply}
.hero-copy{position:relative;z-index:8;align-self:center;padding:18vh 0 8vh 7vw;max-width:59vw}
.eyebrow,.kicker{margin:0 0 24px;color:var(--red);font-size:.72rem;font-weight:600;letter-spacing:.28em}
.hero h1,.opening h2,.journey h2,.author h2,.final-story h2,.editions h2,footer h2{font-family:"Oswald",sans-serif;font-weight:700;line-height:.82;letter-spacing:-.055em;margin:0}
.hero h1{font-size:clamp(6.2rem,13vw,13.5rem);filter:drop-shadow(0 12px 35px rgba(0,0,0,.3))}
.hero h1 span{display:block}
.hero h1 span:last-child{color:transparent;-webkit-text-stroke:2px var(--ivory)}
.hero-line{margin:32px 0 38px;font-size:clamp(1.15rem,1.55vw,1.45rem);line-height:1.55;color:#ddd9d0}
.underline-link{display:inline-flex;align-items:center;gap:18px;color:var(--ivory);text-decoration:none;font-size:.72rem;letter-spacing:.2em;padding-bottom:10px;border-bottom:1px solid var(--red)}
.underline-link span{color:var(--red);font-size:1rem}
.portrait{position:relative;z-index:3;height:100%;overflow:hidden}
.portrait:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--black),transparent 24%),linear-gradient(0deg,var(--black),transparent 25%)}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:60% center;filter:contrast(1.05) saturate(.76) brightness(.87)}
.hero-book{position:absolute;z-index:10;left:52%;bottom:3vh;width:clamp(200px,19vw,350px);margin:0;filter:drop-shadow(0 30px 38px rgba(0,0,0,.78));will-change:transform}
.hero-book img{display:block;width:100%;height:auto;position:relative;z-index:2}
.aura{position:absolute;z-index:1;inset:18% 0 4%;background:radial-gradient(circle,rgba(227,34,25,.25),transparent 64%);filter:blur(25px);transform:scale(1.15)}
.hero-book figcaption{display:flex;justify-content:space-between;margin-top:12px;padding-top:11px;border-top:1px solid rgba(255,255,255,.2);font-size:.52rem;letter-spacing:.18em;color:#aaa}
.hero-book figcaption b{color:var(--ivory);font-weight:500}
.hero-no{position:absolute;z-index:12;bottom:4vh;left:4vw;color:#6d6a65;font-size:.62rem;letter-spacing:.24em}
.hero-rail{position:absolute;z-index:12;right:2vw;top:50%;writing-mode:vertical-rl;color:#8b8780;font-size:.55rem;letter-spacing:.25em}
.opening{padding:13vw 7vw;background:var(--ivory);color:var(--black)}
.opening-grid,.final-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:9vw}
.opening h2,.final-story h2{font-size:clamp(4rem,7.8vw,8.8rem)}
.opening h2 em{font-style:normal;color:var(--red)}
.opening-copy{max-width:650px}
.opening-copy p,.final-grid p{font-size:1.04rem;line-height:1.82;color:#3e3b36}
.opening-copy .lead{font-size:clamp(1.35rem,2vw,1.95rem);line-height:1.42;color:var(--black)}
.statement{font-weight:600!important;color:var(--black)!important;font-size:1.18rem!important}
.quote-section{padding:13vw 10vw;text-align:center;border-bottom:1px solid var(--line);position:relative}
.quote-mark{display:block;color:var(--red);font:500 6rem/1 "Oswald"}
.quote-section blockquote{max-width:1200px;margin:0 auto 36px;font-size:clamp(2.5rem,5vw,5.5rem);font-weight:500;line-height:1.12;letter-spacing:-.045em}
.quote-credit{font-size:.65rem;letter-spacing:.25em;color:var(--muted)}
.journey{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;background:#050505}
.journey-art{min-height:760px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle,rgba(227,34,25,.2),transparent 55%)}
.journey-art img{width:min(70%,620px);filter:drop-shadow(0 35px 45px #000)}
.journey-copy{padding:10vw 8vw;align-self:center}
.journey h2{font-size:clamp(4.5rem,7.5vw,8.5rem);margin-bottom:42px}
.journey h2 span{color:var(--red)}
.journey-copy>p:not(.kicker){max-width:650px;color:#c4c0b7;font-size:1.04rem;line-height:1.8}
.themes{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.themes article{padding:7vw 4vw;min-height:340px;border-right:1px solid var(--line);transition:.4s}
.themes article:last-child{border-right:0}
.themes article:hover{background:var(--red);padding-left:4.5vw}
.themes article>span{font-size:.62rem;letter-spacing:.2em;color:var(--muted)}
.themes h3{margin:58px 0 12px;font:600 clamp(2.7rem,4vw,4.8rem) "Oswald";letter-spacing:-.04em}
.themes p{max-width:300px;color:var(--muted);line-height:1.65}
.themes article:hover p,.themes article:hover>span{color:var(--ivory)}
.author{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;background:var(--ivory);color:var(--black)}
.author-image{min-height:720px;overflow:hidden}
.author-image img{width:100%;height:100%;object-fit:cover;object-position:62% center}
.author-copy{padding:9vw 8vw;align-self:center}
.author h2{font-size:clamp(5rem,8.8vw,9.5rem)}
.author .lead{font-size:1.4rem;line-height:1.5}
.author-copy>p:not(.kicker):not(.lead){font-size:1rem;line-height:1.82;color:#45413b}
.signature{margin-top:50px;padding-top:23px;border-top:1px solid #aaa;font:600 1.1rem "Oswald";letter-spacing:.42em}
.final-story{padding:13vw 7vw}
.final-story h2 span{color:var(--red)}
.final-grid p{color:#c5c1b8}
.final-grid>div{padding-top:10px}
.final-grid .statement{color:var(--ivory)!important}
.editions{padding:13vw 7vw;background:var(--ivory);color:var(--black)}
.editions h2{font-size:clamp(5rem,10vw,11rem);margin-bottom:7vw}
.edition-list{border-top:1px solid #aaa}
.edition-list a{min-height:130px;display:grid;grid-template-columns:70px 1.4fr 1fr 70px;align-items:center;color:var(--black);text-decoration:none;border-bottom:1px solid #aaa;transition:.35s}
.edition-list a:hover{background:var(--red);color:var(--ivory);padding:0 2vw}
.edition-list a>span{font-size:.62rem}
.edition-list b{font:500 clamp(2rem,3.8vw,4rem) "Oswald"}
.edition-list small{font-size:.9rem}
.edition-list i{text-align:right;font-style:normal;font-size:1.8rem}
footer{min-height:64vh;padding:7vw;position:relative;display:flex;align-items:flex-end;justify-content:space-between;background:var(--red);color:var(--black)}
footer h2{font-size:clamp(7rem,17vw,19rem)}
footer h2 span{color:var(--ivory)}
footer div{text-align:right;font-size:.62rem;letter-spacing:.16em;line-height:2}
footer>a{position:absolute;right:7vw;top:7vw;width:56px;height:56px;display:grid;place-items:center;border:1px solid var(--black);color:var(--black);text-decoration:none;font-size:1.4rem}
.reveal{opacity:0;transform:translateY(36px);transition:opacity .9s cubic-bezier(.2,.75,.2,1),transform .9s cubic-bezier(.2,.75,.2,1)}
.reveal.visible{opacity:1;transform:none}
@media(max-width:850px){.nav{padding:0 20px}
.nav nav{display:none}
.brand b{display:none}
.hero{grid-template-columns:1fr;min-height:820px}
.hero-copy{padding:145px 24px 110px;max-width:none;align-self:end}
.hero h1{font-size:clamp(5.2rem,25vw,9rem)}
.hero-line{font-size:1.05rem;max-width:65%}
.portrait{position:absolute;inset:0;opacity:.54}
.portrait:after{background:linear-gradient(90deg,rgba(8,8,8,.8),transparent),linear-gradient(0deg,var(--black),transparent 65%)}
.red-slash{height:46px;top:50%}
.hero-book{left:auto;right:-6vw;bottom:15vh;width:clamp(160px,42vw,235px);z-index:7}
.hero-book figcaption{display:none}
.hero-rail{display:none}
.opening,.final-story,.editions{padding:100px 24px}
.opening-grid,.final-grid{grid-template-columns:1fr;gap:58px}
.opening h2,.final-story h2{font-size:18vw}
.opening-copy .lead{font-size:1.25rem}
.quote-section{padding:110px 24px}
.quote-section blockquote{font-size:2.25rem}
.journey{grid-template-columns:1fr}
.journey-art{min-height:560px}
.journey-copy{padding:90px 24px}
.journey h2{font-size:17vw}
.themes{grid-template-columns:1fr}
.themes article{min-height:230px;padding:52px 24px;border-right:0;border-bottom:1px solid var(--line)}
.themes h3{margin-top:32px}
.author{grid-template-columns:1fr}
.author-image{min-height:560px}
.author-copy{padding:90px 24px}
.author h2{font-size:21vw}
.editions h2{font-size:20vw}
.edition-list a{grid-template-columns:44px 1fr 34px;min-height:105px}
.edition-list small{display:none}
.edition-list b{font-size:2rem}
footer{min-height:68vh;padding:70px 24px 36px;display:block}
footer h2{position:absolute;bottom:135px;font-size:24vw}
footer div{position:absolute;bottom:30px;left:24px;text-align:left}
footer>a{right:24px;top:48px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.reveal{opacity:1;transform:none;transition:none}
.progress{display:none}
.hero-book{transform:rotate(-4deg)!important}
}
@media(max-width:850px){
.hero{display:block;min-height:900px;height:100svh}
.hero-copy{position:relative;padding:132px 24px 0;max-width:none;align-self:auto}
.hero h1{font-size:clamp(4.6rem,21vw,7.5rem)}
.hero-line{position:absolute;left:24px;top:710px;margin:0;font-size:1.05rem;max-width:72%}
.hero-copy .underline-link{position:absolute;left:24px;top:790px}
.portrait{position:absolute;inset:78px 0 auto auto;width:64vw;height:310px;opacity:.5}
.portrait img{object-position:62% 22%}
.portrait:after{background:linear-gradient(90deg,var(--black),transparent 34%),linear-gradient(0deg,var(--black),transparent 55%)}
.red-slash{top:48%}
.hero-book{left:auto;right:18px;top:370px;bottom:auto;width:clamp(145px,39vw,190px);z-index:7}
}
@media(max-width:480px){
.hero{min-height:860px}
.hero-copy{padding-top:122px}
.hero h1{font-size:20vw}
.portrait{width:60vw;height:270px}
.hero-book{top:340px;right:14px;width:145px}
.hero-line{top:665px;max-width:80%}
.hero-copy .underline-link{top:750px}
}
@media(max-width:850px){
.hero{height:auto;min-height:1080px;background:radial-gradient(circle at 75% 45%,#281515,#0b0a0a 42%,#080808 72%)}
.hero:after{background:linear-gradient(0deg,rgba(0,0,0,.55),transparent 38%)}
.hero-copy{padding:126px 22px 0}
.hero-copy .eyebrow{max-width:290px;margin-bottom:20px;font-size:.62rem;line-height:1.55}
.hero h1{font-size:clamp(4.8rem,22vw,8rem);line-height:.84}
.portrait{inset:380px 18px auto;width:auto;height:430px;opacity:1;border:1px solid rgba(255,255,255,.14);overflow:hidden}
.portrait img{object-position:58% 18%;filter:contrast(1.05) saturate(.8) brightness(.92)}
.portrait:after{background:linear-gradient(0deg,var(--black),transparent 28%),linear-gradient(90deg,rgba(8,8,8,.2),transparent 45%)}
.red-slash{top:610px;height:38px;opacity:.82}
.hero-book{top:675px;right:24px;width:clamp(145px,38vw,185px);filter:drop-shadow(0 24px 28px rgba(0,0,0,.82))}
.hero-line{top:855px;left:22px;max-width:58%;font-size:1.08rem;line-height:1.5}
.hero-copy .underline-link{top:980px;left:22px}
.hero-no{bottom:26px;left:22px}
}
@media(max-width:480px){
.hero{min-height:1020px}
.hero-copy{padding-top:116px}
.hero h1{font-size:20vw}
.portrait{inset:340px 14px auto;height:405px}
.portrait img{object-position:58% 16%}
.red-slash{top:565px}
.hero-book{top:625px;right:18px;width:140px}
.hero-line{top:790px;left:20px;max-width:58%;font-size:1rem}
.hero-copy .underline-link{top:915px;left:20px}
}

