*{box-sizing:border-box}
:root{--paper:#f3f0e9;--ink:#0c0c0c;--line:#cbc7be;--accent:#ff5a1f}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(243,240,233,.94);backdrop-filter:blur(12px);z-index:20}
.brand{font-weight:800;letter-spacing:.08em}
.nav nav{display:flex;gap:25px;font-size:13px}
.nav nav a{transition:opacity .2s}.nav nav a:hover{opacity:.5}
.menu{display:none;border:0;background:none;font-size:24px}
.hero{min-height:calc(100vh - 82px);padding:8vh 5vw 4vh;display:flex;flex-direction:column}
.eyebrow,.kicker{font-size:11px;font-weight:700;letter-spacing:.18em}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:5vw;align-items:end;flex:1}
.hero h1{font-size:clamp(72px,11vw,160px);letter-spacing:-.075em;line-height:.78;margin:5vh 0;font-weight:800}
.hero h1 span,.closing h2 span{color:var(--accent)}
.hero-copy{padding-bottom:5vh}
.hero-copy p{font-size:clamp(19px,2vw,28px);line-height:1.35;max-width:760px}
.actions{display:flex;gap:30px;align-items:center;margin-top:4vh}
.primary{background:var(--ink);color:white;padding:16px 24px}
.scroll{font-size:10px;letter-spacing:.15em}
.section{padding:110px 5vw;border-top:1px solid var(--line)}
.split{display:grid;grid-template-columns:1.15fr 1fr;gap:10vw}
.section h2{font-size:clamp(42px,6vw,88px);letter-spacing:-.055em;line-height:.95;margin:35px 0}
.facts p{font-size:20px;border-top:1px solid #aaa;padding:20px 0;margin:0}
.dark{background:var(--ink);color:var(--paper)}
.section-head{display:grid;grid-template-columns:1.5fr .7fr;gap:8vw;align-items:end}
.section-head p{font-size:18px;line-height:1.5;opacity:.65}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#3c3c3c;margin-top:70px;border:1px solid #3c3c3c}
.cards article{background:var(--ink);padding:32px;min-height:260px;display:flex;flex-direction:column}
.cards article.featured{grid-column:span 2}
.cards h3{font-size:32px;letter-spacing:-.04em;line-height:1;margin:22px 0 auto}
.cards small,.cards p{opacity:.55}
.statement h2{font-size:clamp(78px,12vw,165px);margin:50px 0 35px}
.statement-copy{max-width:700px;font-size:24px;line-height:1.35}
.feature{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:8vw}
.book-mark{border:1px solid var(--ink);padding:35px;min-height:560px;display:flex;flex-direction:column;justify-content:space-between}
.book-small,.soon{font-size:11px;font-weight:700;letter-spacing:.17em}
.giant{font-weight:900;font-size:clamp(78px,11vw,155px);line-height:.72;letter-spacing:-.08em;margin:0}
.book-copy p{font-size:20px;line-height:1.5;max-width:560px}
.media-list{margin-top:60px}
.media-list article{display:grid;grid-template-columns:180px 1fr;gap:30px;border-top:1px solid #444;padding:28px 0}
.media-list span{font-size:10px;letter-spacing:.15em;opacity:.5}
.media-list h3{font-size:clamp(24px,3vw,42px);line-height:1.05;margin:0;letter-spacing:-.035em}
.timeline{max-width:1050px;margin-left:auto;margin-top:60px}
.timeline p{display:grid;grid-template-columns:110px 1fr;gap:30px;border-top:1px solid #aaa;padding:22px 0;margin:0;font-size:18px;line-height:1.35}
.timeline b{font-size:11px;letter-spacing:.14em}
.closing{padding:120px 5vw;background:#dedbd2}
.closing>p{font-size:11px;letter-spacing:.17em;font-weight:700}
.closing h2{font-size:clamp(65px,10vw,145px);line-height:.8;letter-spacing:-.07em;margin:45px 0 0}
footer{padding:35px 5vw;display:flex;justify-content:space-between;font-size:11px;border-top:1px solid #aaa}
@media(max-width:900px){
 .menu{display:block}.nav nav{display:none;position:absolute;top:82px;left:0;right:0;background:var(--paper);padding:25px 5vw;flex-direction:column;font-size:18px}.open .nav nav{display:flex}
 .hero{min-height:auto;padding-top:7vh}.hero-grid,.split,.feature,.section-head{grid-template-columns:1fr}.hero-copy{padding-bottom:5vh}
 .cards{grid-template-columns:1fr}.cards article.featured{grid-column:span 1}
 .statement h2{font-size:18vw}.section{padding:75px 6vw}
 .media-list article{grid-template-columns:1fr;gap:12px}
 footer{gap:18px;flex-direction:column}
}
@media(max-width:600px){
 .hero h1{font-size:20vw}.hero-copy p{font-size:19px}.actions{align-items:flex-start;flex-direction:column}
 .book-mark{min-height:440px}.timeline p{grid-template-columns:80px 1fr}
}