:root {
  --paper: #f4efe5;
  --paper-light: #fbf8f1;
  --ink: #17211c;
  --muted: #686d66;
  --line: rgba(23,33,28,.18);
  --gold: #9e7b35;
  --serif: "Libre Caslon Display", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; color: var(--ink); background: var(--paper);
  font-family: var(--sans); -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 1000; background: #fff; padding: .8rem 1rem; }
.skip-link:focus { top: 1rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.site-header {
  height: 88px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 clamp(1.3rem, 4vw, 4.5rem); border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 50; background: rgba(244,239,229,.92);
  backdrop-filter: blur(16px);
}
.brand { display:flex; gap:.85rem; align-items:center; text-decoration:none; text-transform:uppercase; letter-spacing:.17em; font-size:.75rem; font-weight:600; }
.brand-mark { width:28px; height:25px; border:1.5px solid var(--ink); clip-path:polygon(50% 0,100% 42%,100% 100%,0 100%,0 42%); }
nav { display:flex; align-items:center; gap:2rem; }
nav a { text-decoration:none; font-size:.78rem; letter-spacing:.06em; }
.nav-cta { border:1px solid var(--ink); padding:.75rem 1rem; transition:.25s; }
.nav-cta:hover { background:var(--ink); color:var(--paper); }
.nav-toggle { display:none; background:none; border:0; padding:.5rem; }
.nav-toggle span:not(.sr-only) { display:block; width:24px; height:1px; margin:6px; background:var(--ink); }

.hero {
  min-height: calc(100svh - 88px); display:grid; grid-template-columns: 1.15fr .85fr;
  align-items:center; gap:clamp(2rem,6vw,8rem); padding:clamp(3rem,7vw,7rem) clamp(1.3rem,6vw,7rem);
  position:relative; overflow:hidden;
}
.hero-copy { max-width: 760px; position:relative; z-index:2; }
.eyebrow, .section-number, .book-kicker {
  text-transform:uppercase; letter-spacing:.2em; font-size:.68rem; font-weight:600;
}
.eyebrow { margin:0 0 2rem; }
h1, h2, blockquote { font-family:var(--serif); font-weight:400; }
h1 { font-size:clamp(3.5rem,7.8vw,8rem); line-height:.92; letter-spacing:-.04em; margin:0; max-width:900px; }
.hero-intro { max-width:590px; font-size:clamp(1rem,1.4vw,1.25rem); line-height:1.75; color:var(--muted); margin:2.2rem 0; }
.hero-actions { display:flex; align-items:center; gap:2rem; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:center; padding:1rem 1.4rem; text-decoration:none; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; transition:.25s; }
.button-dark { background:var(--ink); color:var(--paper); }
.button-dark:hover { transform:translateY(-2px); }
.text-link { text-underline-offset:5px; font-size:.82rem; }
.hero-art { display:flex; justify-content:center; position:relative; z-index:2; }
.cover-stage { width:min(390px,70vw); position:relative; transform:rotate(1.2deg); filter:drop-shadow(0 28px 28px rgba(22,29,25,.18)); }
.cover-stage img { width:100%; border-radius:2px; }
.coming-soon { position:absolute; right:-1rem; top:1.5rem; background:var(--ink); color:#fff; padding:.7rem 1rem; text-transform:uppercase; letter-spacing:.18em; font-size:.6rem; }
.hero-line { position:absolute; width:62vw; height:62vw; border:1px solid rgba(23,33,28,.08); border-radius:50%; right:-24vw; bottom:-43vw; }

.statement { padding:clamp(5rem,10vw,10rem) clamp(1.3rem,12vw,12rem); background:var(--ink); color:var(--paper); }
.statement .section-number { opacity:.6; }
.statement blockquote { margin:2.5rem 0; font-size:clamp(2.6rem,6vw,6.3rem); line-height:1.02; letter-spacing:-.035em; max-width:1200px; }
.statement > p:last-child { margin-left:auto; max-width:610px; color:rgba(244,239,229,.7); line-height:1.8; font-size:1.05rem; }

.books-section { padding:clamp(5rem,10vw,10rem) clamp(1.3rem,6vw,7rem); background:var(--paper-light); }
.section-heading { display:grid; grid-template-columns:1fr .55fr; gap:4rem; align-items:end; margin-bottom:6rem; }
.section-heading h2, .about h2, .closing h2 { font-size:clamp(3rem,6vw,6.4rem); line-height:.95; letter-spacing:-.035em; margin:1rem 0 0; }
.section-heading > p { color:var(--muted); line-height:1.75; margin:0; max-width:450px; }
.book-grid { border-top:1px solid var(--line); }
.book-card { display:grid; grid-template-columns:52px minmax(220px,330px) 1fr; gap:clamp(1.5rem,5vw,6rem); padding:4.5rem 0; border-bottom:1px solid var(--line); align-items:center; }
.book-number { align-self:start; font-size:.7rem; letter-spacing:.15em; color:var(--muted); padding-top:.5rem; }
.book-cover-link { display:block; text-decoration:none; }
.book-cover-wrap { position:relative; width:100%; box-shadow:0 22px 40px rgba(28,31,28,.12); overflow:hidden; background:#eee; }
.book-cover-wrap img { aspect-ratio: 2/3; object-fit:cover; width:100%; transition:transform .5s ease, filter .5s ease; }
.cover-hover { position:absolute; inset:auto 0 0; padding:1rem; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.76)); transform:translateY(100%); transition:.35s; font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; }
.book-cover-link:hover img { transform:scale(1.025); filter:brightness(.86); }
.book-cover-link:hover .cover-hover { transform:none; }
.status-pill { position:absolute; top:1rem; left:1rem; background:rgba(244,239,229,.94); padding:.6rem .8rem; font-size:.58rem; text-transform:uppercase; letter-spacing:.16em; }
.book-info { max-width:650px; }
.book-info h3 { font-family:var(--serif); font-size:clamp(2.6rem,5vw,5.6rem); font-weight:400; line-height:.95; margin:.7rem 0 .3rem; letter-spacing:-.035em; }
.book-subtitle { margin:.2rem 0 1.6rem; color:var(--gold); text-transform:uppercase; letter-spacing:.15em; font-size:.7rem; }
.book-info > p:not(.book-kicker):not(.book-subtitle) { line-height:1.8; color:var(--muted); max-width:580px; }
.book-action { display:inline-flex; gap:.5rem; margin-top:1.5rem; text-transform:uppercase; letter-spacing:.13em; font-size:.7rem; text-underline-offset:6px; }
.book-action.muted { text-decoration:none; color:var(--muted); }
.featured .book-cover-wrap { box-shadow:0 25px 50px rgba(28,31,28,.16); }

.continuum { padding:clamp(5rem,9vw,9rem) clamp(1.3rem,6vw,7rem); }
.continuum-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:3.5rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.continuum-grid > div { padding:3rem 2rem 3rem 0; border-right:1px solid var(--line); }
.continuum-grid > div:not(:first-child) { padding-left:2rem; }
.continuum-grid > div:last-child { border-right:0; }
.continuum-grid span { display:block; color:var(--gold); text-transform:uppercase; letter-spacing:.17em; font-size:.62rem; margin-bottom:2rem; }
.continuum-grid strong { display:block; font-family:var(--serif); font-size:2.1rem; font-weight:400; }
.continuum-grid p { color:var(--muted); line-height:1.65; font-size:.88rem; }

.about { display:grid; grid-template-columns:.35fr 1fr; gap:3rem; padding:clamp(5rem,10vw,10rem) clamp(1.3rem,9vw,10rem); background:#ddd4c2; }
.about-copy { max-width:1000px; }
.about-copy p { max-width:660px; margin:2rem 0 0 auto; font-size:1.05rem; line-height:1.8; color:#4f554e; }
.about-copy .signature { font-family:var(--serif); font-size:2rem; color:var(--ink); }

.closing { text-align:center; padding:clamp(6rem,12vw,12rem) 1.3rem; background:var(--ink); color:var(--paper); }
.closing h2 { margin:1.5rem auto 3rem; max-width:1000px; }
.button-light { background:var(--paper); color:var(--ink); }
.button-light:hover { transform:translateY(-2px); }

footer { padding:4rem clamp(1.3rem,6vw,7rem) 2rem; background:#0e1511; color:rgba(244,239,229,.7); }
.footer-brand { color:var(--paper); font-family:var(--serif); font-size:2.2rem; }
footer > p { max-width:520px; line-height:1.7; }
.footer-bottom { margin-top:5rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.15); display:flex; justify-content:space-between; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; }
.footer-bottom a { text-underline-offset:5px; }

.reveal { opacity:0; transform:translateY(25px); transition:opacity .8s ease, transform .8s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 900px) {
  .site-header { height:72px; }
  .nav-toggle { display:block; }
  nav { position:absolute; top:72px; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--line); display:none; padding:1.5rem; flex-direction:column; align-items:flex-start; }
  nav.open { display:flex; }
  .hero { grid-template-columns:1fr; min-height:auto; }
  .hero-copy { padding-top:2rem; }
  .hero-art { margin-top:2rem; }
  .section-heading { grid-template-columns:1fr; gap:2rem; }
  .book-card { grid-template-columns:30px minmax(180px,260px) 1fr; gap:1.5rem; }
  .continuum-grid { grid-template-columns:1fr 1fr; }
  .continuum-grid > div:nth-child(2) { border-right:0; }
  .continuum-grid > div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .about { grid-template-columns:1fr; }
}
@media (max-width: 650px) {
  h1 { font-size:3.65rem; }
  .hero { padding-top:2rem; }
  .book-card { grid-template-columns:26px 1fr; padding:3rem 0; }
  .book-cover-link, .book-card > .book-cover-wrap { grid-column:2; }
  .book-cover-wrap { max-width:280px; }
  .book-info { grid-column:2; }
  .continuum-grid { grid-template-columns:1fr; }
  .continuum-grid > div, .continuum-grid > div:not(:first-child) { border-right:0; border-bottom:1px solid var(--line); padding:2.2rem 0; }
  .continuum-grid > div:last-child { border-bottom:0; }
  .footer-bottom { gap:1.5rem; flex-direction:column; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
  * { animation:none !important; transition:none !important; }
}