:root{
  --ink:#37342F; --red:#BC5B34; --yel:#DFA637; --blu:#4F729F; --cream:#F5EEDF;
  --muted:#8A857B; --hair:#E4DFD4;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:#FFFFFF;color:var(--ink);font-family:'Inter',system-ui,sans-serif;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
.display{font-family:'Fraunces',Georgia,serif;font-weight:560;letter-spacing:-.015em;line-height:.94}
.mono{font-family:'IBM Plex Mono',monospace;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}
a{color:inherit;text-decoration:none}
.wrap{max-width:1280px;margin:0 auto;padding:0 5vw}

nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:22px 5vw;background:rgba(255,255,255,.86);backdrop-filter:blur(8px);border-bottom:1px solid var(--hair)}
nav .brand{font-family:'Fraunces',serif;font-weight:600;font-size:1.02rem;letter-spacing:.14em;text-transform:uppercase}
nav .brand em{font-style:normal;color:var(--red)}
nav ul{display:flex;gap:34px;list-style:none}
nav ul a{font-size:.88rem;letter-spacing:.05em;border-bottom:2px solid transparent;padding-bottom:3px}
nav ul a:hover,nav ul a.on{border-color:var(--red)}

.hero{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:2vw;padding:120px 5vw 40px;overflow:hidden}
.hero h1{font-size:clamp(64px,9.5vw,150px)}
.hero h1 .r{color:var(--red)}.hero h1 .y{color:var(--yel)}.hero h1 .b{color:var(--blu)}
.hero p.lede{margin:30px 0 38px;font-size:clamp(17px,1.35vw,21px);max-width:34em;color:#565149}
.hero .cta{display:flex;gap:16px;flex-wrap:wrap}
.btn{display:inline-block;padding:15px 30px;border:2px solid var(--ink);font-weight:600;font-size:.95rem;letter-spacing:.04em;transition:all .18s}
.btn:hover{background:var(--ink);color:#fff}
.btn.solid{background:var(--red);border-color:var(--red);color:#fff}
.btn.solid:hover{background:var(--ink);border-color:var(--ink)}
.hero .art{justify-self:center;width:min(46vw,640px)}
.hero .art svg{width:100%;height:auto;display:block}
.hero .kicker{display:block;margin-bottom:18px;color:var(--muted)}

.marquee{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);overflow:hidden;padding:26px 0;background:#fff}
.marquee .track{display:flex;gap:22px;width:max-content;animation:slide 60s linear infinite}
.marquee img{width:150px;height:150px;border:1px solid var(--hair)}
@keyframes slide{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee .track{animation:none}}

section.band{padding:110px 0}
.eyebrow{color:var(--red);font-weight:600;margin-bottom:14px}
h2.display{font-size:clamp(38px,4.6vw,66px);margin-bottom:26px}
.band p.copy{max-width:44em;color:#565149}

.inks{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--hair)}
.inks .chip{aspect-ratio:1/1.15;display:flex;flex-direction:column;justify-content:flex-end;padding:18px;color:#fff}
.inks .chip.light{color:var(--ink)}
.inks .chip b{font-family:'Fraunces',serif;font-size:1.2rem;font-weight:560}

.bookrow{display:grid;grid-template-columns:170px 1fr auto;gap:4vw;align-items:center;padding:44px 0;border-top:1px solid var(--hair)}
.bookrow:last-child{border-bottom:1px solid var(--hair)}
.bookrow .num{font-family:'Fraunces',serif;font-size:clamp(64px,7vw,110px);font-weight:560;line-height:1}
.bookrow .num small{display:block;font-size:.8rem;font-family:'IBM Plex Mono',monospace;letter-spacing:.1em;color:var(--muted);margin-top:6px}
.bookrow h3{font-family:'Fraunces',serif;font-size:1.5rem;font-weight:560;margin-bottom:8px}
.bookrow p{color:#565149;max-width:34em;font-size:.98rem}
.bookrow .thumbs{display:flex;gap:12px}
.bookrow .thumbs img{width:104px;height:104px;border:1px solid var(--hair)}

.timeline{display:flex;justify-content:space-between;position:relative;margin-top:60px;padding-top:34px;border-top:2px solid var(--ink)}
.timeline div{max-width:26%}
.timeline b{font-family:'Fraunces',serif;font-size:1.6rem;font-weight:560;display:block;margin-bottom:6px}
.timeline span{color:#565149;font-size:.92rem}

footer{padding:70px 5vw;border-top:1px solid var(--hair);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:.88rem}

.pagehead{padding:170px 0 50px}
.pagehead h1{font-size:clamp(46px,6vw,92px)}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 8px}
.filters button{padding:9px 18px;border:1.5px solid var(--hair);background:#fff;cursor:pointer;font-family:'IBM Plex Mono',monospace;font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.filters button.on{border-color:var(--ink);background:var(--ink);color:#fff}
.count{color:var(--muted);margin:8px 0 26px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;padding-bottom:120px}
.grid a{display:block}
.grid img{width:100%;aspect-ratio:1;border:1px solid var(--hair);display:block}
.grid .cap{display:flex;justify-content:space-between;margin-top:7px;font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.05em;color:var(--muted)}
.grid .cap .canon{color:var(--red);font-weight:600}

.minthero{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:start;padding-bottom:110px}
.bignum{font-family:'Fraunces',serif;font-size:clamp(90px,13vw,210px);font-weight:560;line-height:.9}
.bignum small{display:block;font-family:'IBM Plex Mono',monospace;font-size:.85rem;letter-spacing:.14em;color:var(--muted);margin-top:14px;text-transform:uppercase}
table.alloc{width:100%;border-collapse:collapse;margin:28px 0 34px}
table.alloc td,table.alloc th{padding:13px 4px;border-bottom:1px solid var(--hair);text-align:left;font-size:.95rem}
table.alloc th{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
table.alloc td.n{font-family:'IBM Plex Mono',monospace}
.mintbtn{width:100%;padding:20px;background:var(--hair);border:none;color:var(--muted);font-weight:600;font-size:1rem;letter-spacing:.04em;cursor:not-allowed}
.note{margin-top:16px;font-size:.88rem;color:var(--muted)}

article.prose{max-width:46em;padding-bottom:130px}
article.prose h2{font-family:'Fraunces',serif;font-size:2rem;font-weight:560;margin:64px 0 18px}
article.prose p{margin-bottom:18px;color:#48443D}
article.prose .swatches{display:flex;gap:10px;margin:26px 0}
article.prose .swatches div{flex:1;aspect-ratio:1/.7;display:flex;align-items:flex-end;padding:10px;font-family:'IBM Plex Mono',monospace;font-size:.68rem;color:#fff}
article.prose .swatches div.light{color:var(--ink);border:1px solid var(--hair)}

@media (max-width:900px){
  .hero{grid-template-columns:1fr;padding-top:130px;text-align:left}
  .hero .art{width:min(84vw,460px);justify-self:start}
  nav ul{gap:20px}
  .bookrow{grid-template-columns:1fr;gap:18px}
  .bookrow .thumbs{flex-wrap:wrap}
  .minthero{grid-template-columns:1fr}
  .inks{grid-template-columns:repeat(2,1fr)}
  .timeline{flex-direction:column;gap:26px}
  .timeline div{max-width:100%}
}