@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,600&display=swap');

:root { --ink:#11192c; --ink-soft:#1d2840; --paper:#f3ede1; --paper-deep:#e6ddcd; --rust:#d86b50; --rust-dark:#a94d3d; --lilac:#b8abc9; --sage:#a9b59e; --blue:#80a6b9; --yellow:#d5b66b; --muted:#9d9aa0; --line:rgba(243,237,225,.18); --line-dark:rgba(17,25,44,.16); --serif:'Newsreader', Georgia, serif; --sans:'DM Sans', Arial, sans-serif; --mono:'DM Mono', monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button, input { font:inherit; }
.site-shell { overflow:hidden; }
.site-header { align-items:center; display:flex; justify-content:space-between; margin:0 auto; max-width:1480px; padding:28px 5.5vw 18px; position:relative; z-index:20; }
.wordmark { align-items:center; display:flex; gap:12px; }
.monogram { align-items:center; background:var(--rust); color:var(--paper); display:inline-flex; font-family:var(--mono); font-size:12px; font-weight:500; height:35px; justify-content:center; letter-spacing:-.05em; position:relative; width:35px; }
.monogram:after { border:1px solid var(--paper); content:''; height:25px; left:4px; opacity:.5; position:absolute; top:4px; width:25px; }
.wordmark-text { display:flex; flex-direction:column; gap:1px; line-height:1; }
.wordmark-text strong { font-family:var(--serif); font-size:18px; font-weight:500; letter-spacing:-.02em; }
.wordmark-text em { color:var(--rust); font-family:var(--mono); font-size:10px; font-style:normal; letter-spacing:.16em; text-transform:uppercase; }
.site-nav { align-items:center; display:flex; gap:36px; }
.site-nav a { color:rgba(243,237,225,.66); font-size:12px; letter-spacing:.02em; transition:color .2s ease; }
.site-nav a:hover { color:var(--paper); }
.site-nav .nav-cta { color:var(--paper); }
.nav-cta span, .text-link span, .button span, .profile-links span, .email-link span { color:var(--rust); margin-left:7px; }
.menu-toggle { background:none; border:0; color:var(--paper); cursor:pointer; display:none; font-size:12px; }
.menu-toggle span { color:var(--rust); font-size:20px; vertical-align:-2px; }
.section-pad { margin:0 auto; max-width:1480px; padding-left:8.5vw; padding-right:8.5vw; }
.hero { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(400px,.98fr); min-height:720px; padding-bottom:86px; padding-top:90px; position:relative; }
.hero:before { background:radial-gradient(circle, rgba(216,107,80,.14), transparent 60%); content:''; height:600px; left:-220px; pointer-events:none; position:absolute; top:100px; width:600px; }
.hero-copy { align-self:center; position:relative; z-index:2; }
.eyebrow, .section-label, .kicker { color:var(--rust); font-family:var(--mono); font-size:10px; letter-spacing:.14em; margin:0 0 28px; text-transform:uppercase; }
.eyebrow { align-items:center; display:flex; gap:10px; }
.eyebrow-line { background:var(--rust); display:inline-block; height:1px; width:42px; }
h1, h2, h3, p { margin-top:0; }
h1, h2, h3 { font-family:var(--serif); font-weight:400; }
h1 { font-size:clamp(4.25rem,8.7vw,8.5rem); letter-spacing:-.075em; line-height:.84; margin:0 0 34px; max-width:720px; }
h1 span, h2 em, h3 em { color:var(--rust); font-style:italic; }
.hero-intro { color:rgba(243,237,225,.68); font-size:15px; line-height:1.65; margin-bottom:34px; max-width:370px; }
.hero-actions, .featured-links { align-items:center; display:flex; flex-wrap:wrap; gap:25px; }
.button { align-items:center; display:inline-flex; font-size:11px; font-weight:600; gap:10px; justify-content:center; letter-spacing:.04em; padding:15px 20px; transition:background .2s ease, transform .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--rust); color:var(--paper); }
.button-primary:hover { background:#e1795c; }
.button-dark { background:var(--ink); color:var(--paper); }
.text-link { border-bottom:1px solid rgba(243,237,225,.28); color:var(--paper); font-size:11px; padding-bottom:5px; }
.hero-stats { border-top:1px solid var(--line); display:flex; gap:70px; margin-top:74px; max-width:500px; padding-top:18px; }
.hero-stats div { display:flex; flex-direction:column; gap:4px; }
.hero-stats strong { font-family:var(--serif); font-size:26px; font-weight:400; }
.hero-stats span { color:rgba(243,237,225,.48); font-family:var(--mono); font-size:8px; letter-spacing:.08em; max-width:100px; text-transform:uppercase; }
.hero-art { min-height:560px; position:relative; }
.orbit { border:1px solid rgba(216,107,80,.26); border-radius:50%; height:560px; left:52%; position:absolute; top:50%; transform:translate(-50%,-50%) rotate(18deg); width:430px; }
.orbit-two { border-color:rgba(184,171,201,.18); height:380px; transform:translate(-50%,-50%) rotate(-24deg); width:600px; }
.book-stack { box-shadow:24px 36px 55px rgba(0,0,0,.28); height:375px; position:absolute; transform-origin:bottom center; width:240px; }
.stack-back { left:41%; top:4%; transform:rotate(13deg); }
.stack-middle { left:23%; top:17%; transform:rotate(-10deg); }
.stack-front { left:39%; top:27%; transform:rotate(3deg); z-index:4; }
.cover-cover { align-content:space-between; color:var(--ink); display:flex; flex-direction:column; height:100%; justify-content:space-between; overflow:hidden; padding:23px 20px; position:relative; width:100%; }
.cover-cover:before { border:1px solid currentColor; content:''; inset:9px; opacity:.25; pointer-events:none; position:absolute; }
.cover-cover:after { background:currentColor; content:''; height:100px; opacity:.08; position:absolute; right:-36px; top:-34px; transform:rotate(40deg); width:170px; }
.cover-kicker { font-family:var(--mono); font-size:7px; letter-spacing:.12em; text-transform:uppercase; }
.cover-cover strong { font-family:var(--serif); font-size:29px; font-weight:500; letter-spacing:-.055em; line-height:.87; position:relative; z-index:2; }
.cover-rule { background:currentColor; height:1px; margin-top:auto; opacity:.5; width:40px; }
.cover-cover small { font-family:var(--mono); font-size:7px; letter-spacing:.15em; margin-top:12px; }
.cover-subtitle { font-family:var(--mono); font-size:8px; letter-spacing:.1em; line-height:1.3; margin-top:-4px; }
.cover-cream { background:var(--paper); }
.cover-rust { background:var(--rust); color:var(--paper); }
.cover-lilac { background:var(--lilac); }
.cover-sage { background:var(--sage); }
.cover-blue { background:var(--blue); }
.cover-purple { background:#9b83b0; color:var(--paper); }
.cover-yellow { background:var(--yellow); }
.cover-green { background:#75948b; color:var(--paper); }
.cover-ink { background:#28354c; color:var(--paper); }
.art-caption { bottom:15px; display:flex; gap:14px; left:2%; position:absolute; z-index:5; }
.art-caption span { color:var(--rust); font-family:var(--mono); font-size:10px; }
.art-caption p { color:rgba(243,237,225,.48); font-family:var(--serif); font-size:15px; line-height:1.05; margin:0; }
.featured { background:var(--paper); color:var(--ink); padding-bottom:118px; padding-top:118px; }
.section-heading .section-label { margin-bottom:22px; }
h2 { font-size:clamp(3rem,5vw,5.3rem); letter-spacing:-.065em; line-height:.9; margin:0; }
.featured-layout { align-items:center; display:grid; gap:clamp(60px,10vw,160px); grid-template-columns:minmax(250px,.62fr) minmax(300px,1fr); margin-top:74px; }
.featured-jacket { margin:auto; max-width:310px; position:relative; transform:rotate(-3deg); width:100%; }
.large-cover { aspect-ratio:3/4.7; box-shadow:22px 28px 38px rgba(17,25,44,.18); }
.large-cover strong { font-size:46px; }
.jacket-note { background:var(--rust); color:var(--paper); font-family:var(--mono); font-size:9px; letter-spacing:.14em; padding:9px 13px; position:absolute; right:-44px; text-transform:uppercase; top:20px; transform:rotate(90deg); }
.featured-copy { max-width:600px; }
.featured-copy h3 { font-size:clamp(3.1rem,5vw,5.5rem); letter-spacing:-.07em; line-height:.87; margin:0 0 28px; }
.featured-copy > p:not(.kicker) { color:rgba(17,25,44,.68); font-size:16px; line-height:1.75; max-width:560px; }
blockquote { border-left:2px solid var(--rust); color:var(--ink); font-family:var(--serif); font-size:18px; line-height:1.2; margin:30px 0; max-width:490px; padding:7px 0 7px 18px; }
.dark-link { border-color:var(--line-dark); color:var(--ink); }
.featured .section-label, .about .section-label, .contact .section-label { color:var(--rust-dark); }
.catalogue { background:var(--paper-deep); color:var(--ink); padding-bottom:120px; padding-top:106px; }
.catalogue-topline { align-items:end; display:flex; gap:40px; justify-content:space-between; }
.catalogue-tools { max-width:480px; width:100%; }
.search-box { align-items:center; border-bottom:1px solid rgba(17,25,44,.4); display:flex; gap:10px; padding-bottom:10px; }
.search-box span { font-size:25px; line-height:1; }
.search-box input { background:none; border:0; color:var(--ink); font-size:12px; outline:none; width:100%; }
.search-box input::placeholder { color:rgba(17,25,44,.55); }
.filter-row { display:flex; flex-wrap:wrap; gap:7px; margin-top:18px; }
.filter-chip { background:transparent; border:1px solid rgba(17,25,44,.22); color:rgba(17,25,44,.7); cursor:pointer; font-family:var(--mono); font-size:8px; letter-spacing:.06em; padding:8px 10px; text-transform:uppercase; transition:background .2s, color .2s; }
.filter-chip:hover, .filter-chip.is-active { background:var(--ink); color:var(--paper); }
.catalogue-note { align-items:center; color:rgba(17,25,44,.55); display:flex; font-family:var(--mono); font-size:9px; gap:9px; letter-spacing:.03em; margin:48px 0 28px; }
.catalogue-note span { background:var(--rust); display:inline-block; height:6px; width:6px; }
.book-list { border-top:1px solid var(--line-dark); }
.book-entry { align-items:start; border-bottom:1px solid var(--line-dark); display:grid; gap:25px; grid-template-columns:34px 110px minmax(0,1fr); padding:28px 0; transition:background .2s ease; }
.book-entry:hover { background:rgba(255,255,255,.18); }
.entry-index { color:var(--rust-dark); font-family:var(--mono); font-size:10px; padding-top:3px; }
.entry-cover { height:166px; width:110px; }
.entry-cover .cover-cover { padding:12px 11px; }
.entry-cover .cover-cover strong { font-size:19px; }
.entry-cover .cover-kicker, .entry-cover .cover-cover small { font-size:5px; }
.entry-main { min-width:0; padding:0 0 4px; }
.entry-meta { align-items:center; color:rgba(17,25,44,.55); display:flex; flex-wrap:wrap; font-family:var(--mono); font-size:8px; gap:11px; letter-spacing:.08em; margin:2px 0 13px; text-transform:uppercase; }
.entry-meta span + span:before { background:var(--rust); content:''; display:inline-block; height:4px; margin:0 10px 1px 0; width:4px; }
.entry-main h3 { font-size:clamp(2rem,3vw,3.45rem); letter-spacing:-.065em; line-height:.9; margin:0 0 14px; }
.entry-main > p { color:rgba(17,25,44,.67); font-size:13px; line-height:1.55; margin:0; max-width:650px; }
.detail-toggle { align-items:center; background:none; border:0; border-bottom:1px solid rgba(17,25,44,.25); color:var(--rust-dark); cursor:pointer; display:flex; font-family:var(--mono); font-size:9px; gap:10px; margin-top:18px; padding:0 0 6px; text-transform:uppercase; }
.detail-toggle span { font-size:16px; font-family:var(--sans); font-weight:300; line-height:10px; }
.detail-toggle[aria-expanded="true"] span { transform:rotate(45deg); }
.detail-panel { border-left:2px solid var(--rust); margin-top:19px; max-width:740px; padding:3px 0 3px 17px; }
.detail-panel[hidden] { display:none; }
.detail-panel p { color:rgba(17,25,44,.73); font-family:var(--serif); font-size:18px; line-height:1.38; margin:0 0 17px; }
.entry-links { display:flex; flex-wrap:wrap; gap:20px; }
.entry-links a { border-bottom:1px solid rgba(17,25,44,.25); color:var(--rust-dark); font-family:var(--mono); font-size:9px; padding-bottom:4px; text-transform:uppercase; }
.empty-state { border:1px dashed rgba(17,25,44,.3); color:rgba(17,25,44,.65); font-family:var(--mono); font-size:11px; margin:32px 0 0; padding:26px; text-align:center; }
.about { background:var(--ink-soft); display:grid; gap:clamp(60px,12vw,190px); grid-template-columns:minmax(220px,.65fr) minmax(300px,1fr); padding-bottom:130px; padding-top:132px; }
.about-mark { align-self:start; color:var(--rust); font-family:var(--serif); font-size:clamp(9rem,19vw,19rem); letter-spacing:-.12em; line-height:.67; position:relative; }
.about-mark span { position:relative; z-index:2; }
.about-mark i { border:1px solid rgba(216,107,80,.4); border-radius:50%; display:block; height:100px; position:absolute; right:0; top:-35px; width:100px; }
.about-mark i:nth-child(2) { height:180px; right:-30px; top:-80px; width:180px; }
.about-mark i:nth-child(3) { border-color:rgba(184,171,201,.25); height:260px; right:-70px; top:-120px; width:260px; }
.about-copy { max-width:630px; }
.about-copy h2 { margin-bottom:35px; }
.about-copy .lead { color:var(--paper); font-family:var(--serif); font-size:27px; letter-spacing:-.03em; line-height:1.08; max-width:600px; }
.about-copy > p:not(.section-label):not(.lead) { color:rgba(243,237,225,.6); font-size:14px; line-height:1.75; max-width:575px; }
.profile-links { display:flex; flex-wrap:wrap; gap:22px; margin-top:30px; }
.profile-links a { border-bottom:1px solid rgba(243,237,225,.25); font-family:var(--mono); font-size:9px; padding-bottom:6px; text-transform:uppercase; }
.contact { align-items:center; background:var(--rust); color:var(--paper); display:flex; justify-content:space-between; min-height:430px; padding-bottom:85px; padding-top:85px; }
.contact .section-label { color:var(--paper); opacity:.72; }
.contact h2 { font-size:clamp(4rem,7.5vw,8rem); }
.contact-inner > p:not(.section-label) { color:rgba(243,237,225,.8); font-size:14px; line-height:1.6; max-width:380px; }
.email-link { border-bottom:1px solid rgba(243,237,225,.6); display:inline-block; font-family:var(--serif); font-size:clamp(1.35rem,2.4vw,2.2rem); margin-top:15px; padding-bottom:7px; }
.email-link span { color:var(--paper); }
.contact-stamp { align-items:center; border:1px solid rgba(243,237,225,.6); border-radius:50%; display:flex; flex-direction:column; height:185px; justify-content:center; margin-right:4vw; position:relative; transform:rotate(13deg); width:185px; }
.contact-stamp:after { border:1px solid rgba(243,237,225,.4); border-radius:50%; content:''; inset:9px; position:absolute; }
.contact-stamp span { font-family:var(--mono); font-size:10px; letter-spacing:.12em; line-height:1.2; text-align:center; text-transform:uppercase; }
.contact-stamp strong { font-family:var(--serif); font-size:42px; font-weight:400; letter-spacing:-.1em; margin-top:7px; }
.site-footer { align-items:center; background:var(--ink); color:var(--paper); display:flex; flex-wrap:wrap; gap:26px; justify-content:space-between; padding:31px 5.5vw; }
.footer-wordmark .monogram { height:29px; width:29px; }
.footer-wordmark .monogram:after { height:20px; width:20px; }
.footer-wordmark .wordmark-text strong { font-size:15px; }
.footer-wordmark .wordmark-text em { font-size:8px; }
.site-footer p { color:rgba(243,237,225,.4); font-family:var(--mono); font-size:9px; letter-spacing:.04em; margin:0; }
.footer-source a { color:var(--paper); }
@media (max-width:900px) { .hero { grid-template-columns:1fr; padding-top:62px; } .hero-art { margin:30px auto 0; max-width:560px; width:100%; } .hero-copy { max-width:650px; } .featured-layout, .about { gap:70px; grid-template-columns:1fr; } .featured-jacket { margin-left:9vw; max-width:270px; } .about-mark { font-size:clamp(8rem,25vw,14rem); } .catalogue-topline { align-items:start; flex-direction:column; } .catalogue-tools { max-width:100%; } }
@media (max-width:640px) { .site-header { padding:22px 6vw 15px; } .menu-toggle { display:block; } .site-nav { background:var(--ink-soft); border-bottom:1px solid var(--line); display:none; flex-direction:column; gap:20px; left:0; padding:24px 6vw 28px; position:absolute; right:0; top:72px; } .site-nav.is-open { display:flex; } .section-pad { padding-left:6vw; padding-right:6vw; } .hero { min-height:auto; padding-bottom:72px; padding-top:75px; } h1 { font-size:clamp(4rem,19vw,6.5rem); } .hero-stats { gap:40px; margin-top:55px; } .hero-art { min-height:465px; transform:scale(.88); transform-origin:top left; width:114%; } .orbit { left:45%; top:44%; } .stack-back { left:39%; } .stack-middle { left:14%; } .stack-front { left:34%; } .art-caption { bottom:5px; left:-3%; } .featured, .catalogue, .about { padding-bottom:78px; padding-top:78px; } .featured-jacket { margin-left:6vw; max-width:235px; } .large-cover strong { font-size:35px; } .featured-copy h3 { font-size:3.4rem; } .book-entry { gap:15px; grid-template-columns:25px 80px minmax(0,1fr); } .entry-cover { height:122px; width:80px; } .entry-cover .cover-cover { padding:9px 8px; } .entry-cover .cover-cover strong { font-size:14px; } .entry-main h3 { font-size:1.9rem; } .entry-main > p { font-size:12px; } .entry-meta { display:block; line-height:1.5; } .entry-meta span + span:before { margin-left:8px; } .detail-panel p { font-size:16px; } .about-mark { margin-left:-4vw; } .contact { align-items:flex-start; flex-direction:column; gap:55px; min-height:0; } .contact-stamp { align-self:flex-end; height:145px; margin-right:2vw; width:145px; } .contact-stamp strong { font-size:34px; } .site-footer { align-items:flex-start; flex-direction:column; gap:16px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *, *:before, *:after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }
