@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Libre+Caslon+Display&display=swap');

:root { --bg-color:#f1ede3; --surface-color:#ebe4d7; --surface-color-light:#e1d8c8; --text-primary:#12110f; --text-secondary:#756d62; --accent-primary:#9b2f28; --accent-primary-glow:rgba(155,47,40,.18); --accent-secondary:#b47a47; --accent-gold:#a86535; --font-serif:'Libre Caslon Display',Georgia,serif; --font-sans:'Inter',Arial,sans-serif; --glass-border:1px solid rgba(18,17,15,.16); }
body { background:var(--bg-color); color:var(--text-primary); font-family:var(--font-sans); }
.house-header { min-height:92px; padding:14px clamp(24px,5vw,72px); display:grid; grid-template-columns:260px 1fr; align-items:center; gap:36px; background:#12110f; border-bottom:1px solid rgba(241,237,227,.14); position:relative; top:auto; backdrop-filter:none; }
.house-brand img { display:block; width:230px; height:60px; object-fit:contain; object-position:left center; }
.house-header nav { display:flex; justify-content:flex-end; align-items:center; gap:clamp(18px,2.6vw,40px); }
.house-header nav a { color:#f1ede3; text-decoration:none; text-transform:uppercase; letter-spacing:.13em; font-size:10px; border-bottom:1px solid transparent; padding-bottom:4px; }
.house-header nav a:hover,.house-header nav a[aria-current="page"] { border-color:#b47a47; }

.hero { min-height:560px; margin:0; padding:100px clamp(24px,8vw,120px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; text-align:left; background:linear-gradient(90deg,rgba(9,9,8,.16),rgba(9,9,8,.78) 68%),url('../darkling-house-background.png') center/cover; border-bottom:0; color:#f1ede3; }
.event-eyebrow { margin:0 0 28px!important; color:inherit!important; text-transform:uppercase; letter-spacing:.18em; font:600 10px/1.2 var(--font-sans)!important; }
.hero h2 { max-width:850px; margin:0; color:#f1ede3; font:400 clamp(58px,8vw,118px)/.88 var(--font-serif); letter-spacing:-.05em; text-shadow:none; }
.hero p:not(.event-eyebrow) { max-width:620px; margin:34px 0 0; color:rgba(241,237,227,.78); font:400 clamp(18px,1.5vw,23px)/1.55 var(--font-serif); }
.price-filters { margin-top:42px; justify-content:flex-start; gap:10px; }
.filter-btn { padding:13px 18px; border:1px solid rgba(241,237,227,.32); border-radius:0; background:rgba(18,17,15,.22); color:#f1ede3; text-transform:uppercase; letter-spacing:.12em; font:600 10px/1 var(--font-sans); }
.filter-btn:hover,.filter-btn.active { background:#f1ede3; color:#12110f; border-color:#f1ede3; box-shadow:none; }

.books-grid { max-width:1500px; gap:0; padding:90px clamp(24px,6vw,92px) 120px; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); }
.book-card { border:0; border-right:1px solid rgba(18,17,15,.16); border-bottom:1px solid rgba(18,17,15,.16); border-radius:0; background:transparent; box-shadow:none; backdrop-filter:none; }
.book-card:hover { transform:none; border-color:rgba(18,17,15,.16); box-shadow:none; background:#e8e0d2; }
.book-cover-container { margin:22px; width:calc(100% - 44px); background:#12110f; }
.book-cover { opacity:1; }
.book-card:hover .book-cover { transform:scale(1.025); }
.book-info { padding:6px 24px 28px; }
.book-title { color:#12110f; font:400 27px/1.1 var(--font-serif); letter-spacing:-.02em; }
.book-author { color:#8f4a2f; font:600 9px/1 var(--font-sans); letter-spacing:.15em; }
.author-avatar { border-radius:0; border-color:#b47a47; }
.meta-tag { border-radius:0; background:transparent; border-color:rgba(18,17,15,.22); color:#493f35; }
.price-tag { background:#12110f; border-color:#12110f; color:#f1ede3; }
.book-blurb { color:#756d62; font:400 16px/1.55 var(--font-serif); }
.btn { border-radius:0; }
.btn-primary { margin-top:auto; background:#12110f; color:#f1ede3; border:1px solid #12110f; box-shadow:none; font:600 10px/1 var(--font-sans); letter-spacing:.14em; }
.btn-primary:hover { transform:none; background:#9b2f28; border-color:#9b2f28; box-shadow:none; filter:none; }
.empty-state { color:#756d62!important; font:400 22px/1.5 var(--font-serif); }

.form-container { width:min(920px,calc(100% - 48px)); margin:80px auto 120px; padding:clamp(30px,6vw,76px); border:1px solid rgba(18,17,15,.18); border-radius:0; background:#ebe4d7; box-shadow:20px 20px 0 #ded4c3; backdrop-filter:none; }
.submission-title { max-width:720px; margin:0; font:400 clamp(48px,7vw,84px)/.92 var(--font-serif); letter-spacing:-.045em; }
.submission-intro { max-width:620px; margin:28px 0 50px; color:#756d62; font:400 19px/1.55 var(--font-serif); }
.form-group label { color:#12110f; text-transform:uppercase; letter-spacing:.13em; font:600 10px/1.3 var(--font-sans); }
.form-group input,.form-group textarea,.form-group select { border:0; border-bottom:1px solid rgba(18,17,15,.34); border-radius:0; background:rgba(241,237,227,.56); color:#12110f; font-family:var(--font-serif); }
.form-group input:focus,.form-group textarea:focus,.form-group select:focus { border-color:#9b2f28; box-shadow:none; outline:1px solid rgba(155,47,40,.16); }
#success-message { border-radius:0; background:#dfe6d8; color:#22351f; border:1px solid #97a990; }

#event-overlay,#submissions-closed-overlay { background:rgba(18,17,15,.96)!important; color:#f1ede3!important; font-family:var(--font-serif)!important; }
#event-overlay>div,#submissions-closed-overlay>div { border:1px solid #b47a47!important; border-radius:0!important; background:#12110f!important; box-shadow:18px 18px 0 rgba(180,122,71,.22)!important; }
#event-overlay h1,#event-overlay h3,#submissions-closed-overlay h1 { color:#d59a68!important; text-shadow:none!important; font-family:var(--font-serif)!important; }

@media (max-width:780px) {
  .house-header { grid-template-columns:1fr; }
  .house-header nav { justify-content:flex-start; overflow-x:auto; padding-bottom:8px; }
  .hero { min-height:520px; }
  .price-filters { flex-wrap:wrap; }
  .form-container { box-shadow:10px 10px 0 #ded4c3; }
}
@media (max-width:520px) {
  .house-brand img { width:190px; }
  .hero { padding-block:76px; }
  .books-grid { padding-inline:18px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
