:root{--bg:#fff;--ink:#1a1a1a;--muted:#706a62;--gold:#b98a42;--line:#e6dfd4;--paper:#faf8f4;--font:'Cormorant Garamond',Georgia,serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:18px;line-height:1.65}
a{color:inherit}
.topbar{max-width:1120px;margin:auto;padding:24px 32px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}
.topbar a{text-decoration:none;color:var(--muted);letter-spacing:.06em}
.languages{display:flex;gap:10px;justify-content:center;margin:0 auto 28px}.languages a{text-decoration:none;border:1px solid var(--line);padding:5px 10px;font-size:13px;letter-spacing:.08em}.languages a.active{border-color:var(--gold);color:var(--gold)}
.hero{max-width:1050px;margin:0 auto;padding:64px 32px 54px;display:grid;grid-template-columns:minmax(220px,310px) 1fr;gap:clamp(38px,7vw,84px);align-items:center}
.cover{width:100%;box-shadow:0 18px 48px rgba(50,38,22,.16)}
.eyebrow{margin:0 0 8px;color:var(--gold);font-size:13px;letter-spacing:.16em;text-transform:uppercase}
h1{font-size:clamp(38px,5vw,64px);font-weight:300;line-height:1.04;letter-spacing:.045em;margin:0 0 18px}
.lead{font-size:21px;color:var(--muted);margin:0 0 28px}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{padding:9px 18px;border:1px solid var(--line);text-decoration:none;font-size:15px;letter-spacing:.055em}
.btn.primary{border-color:var(--gold)}
.btn:hover{background:var(--paper);border-color:var(--gold)}
.content{max-width:980px;margin:auto;padding:0 32px 80px}
.section{padding:52px 0;border-top:1px solid var(--line)}
.section h2{text-align:center;font-weight:300;font-size:clamp(28px,4vw,42px);letter-spacing:.1em;margin:0 0 10px}
.section-intro{max-width:700px;margin:0 auto 34px;text-align:center;color:var(--muted)}
.book-story{max-width:790px;margin:0 auto}
.book-story p{margin:0 0 1.15em}
.book-story .question{font-size:clamp(22px,3vw,30px);line-height:1.3;color:var(--ink);font-style:italic;margin:1.5em 0 .8em}
.book-story .answer{font-size:24px;letter-spacing:.08em;color:var(--gold)}
.book-story ul{margin:1.4em 0 1.6em;padding-left:1.3em}
.book-story li{margin:.45em 0}
.book-story .closing{font-size:21px;color:var(--ink)}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.gallery button{display:block;border:1px solid var(--line);padding:0;background:var(--paper);cursor:zoom-in;transition:transform .2s,box-shadow .2s}
.gallery button:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(50,38,22,.12)}
.gallery img{display:block;width:100%;height:auto}
.chapter-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 20px}
.chapter-gallery figure{margin:0;border:1px solid var(--line);background:var(--paper)}
.chapter-gallery button{display:grid;width:100%;aspect-ratio:3/4;place-items:center;border:0;padding:14px;background:#eee9e0;cursor:zoom-in;overflow:hidden}
.chapter-gallery img{display:block;width:100%;height:100%;object-fit:contain;transition:opacity .2s}
.chapter-gallery button:hover img{opacity:.88}
.chapter-gallery figcaption{display:flex;min-height:52px;align-items:center;justify-content:center;padding:9px 12px;text-align:center;color:var(--muted);font-size:16px;line-height:1.25;letter-spacing:.025em;border-top:1px solid var(--line)}
.pending{max-width:720px;margin:auto;padding:30px;border:1px dashed #cfc5b7;text-align:center;color:var(--muted);background:var(--paper)}
.guide-frame{display:block;width:100%;height:min(76vh,760px);border:1px solid var(--line);background:var(--paper);box-shadow:0 12px 30px rgba(50,38,22,.08)}
.guide-action{text-align:center;margin-top:20px}
.modal{position:fixed;inset:0;z-index:20;background:rgba(15,13,11,.92);display:none;align-items:center;justify-content:center;padding:24px}
.modal.open{display:flex}
.modal img{max-width:min(94vw,1050px);max-height:94vh;object-fit:contain}
.modal button{position:absolute;right:22px;top:12px;border:0;background:none;color:#fff;font:36px/1 Georgia;cursor:pointer}
footer{text-align:center;border-top:1px solid var(--line);padding:28px;color:var(--muted)}
@media(max-width:760px){.hero{grid-template-columns:1fr;padding-top:38px}.cover{max-width:260px;margin:auto}.hero-copy{text-align:center}.actions{justify-content:center}.gallery,.chapter-gallery{grid-template-columns:repeat(2,1fr)}.guide-frame{height:68vh}}
@media(max-width:420px){.topbar{padding:18px 20px}.hero,.content{padding-left:20px;padding-right:20px}.gallery{gap:12px}}
