:root{--color-oxblood:#4A0E0E;--color-claret:#6B1A1A;--color-gold:#C9A84C;--color-parchment:#F0E6D3;--color-vellum:#C7B89B;--color-mahogany:#2A0808;--color-leaf:#4A6741;--color-candle:#E8A635;--font-display:'Fraunces',serif;--font-body:'Lora',serif;--font-mono:'Inconsolata',monospace}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{background:var(--color-oxblood);color:var(--color-parchment);font-family:var(--font-body);font-weight:400;font-size:clamp(1rem,1.2vw + 0.4rem,1.25rem);line-height:1.72;overflow-x:hidden}

/* Texture overlays */
.paper-grain{position:fixed;inset:0;z-index:100;pointer-events:none;opacity:0.05;background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAOUlEQVQYV2P4z8DwHwMNMDAwMGCThQkyCUIFYRIgPhSGKYJpwKoIpgGnIpgGvIrQNRBUhK4BryIAN1EM/xl8tEoAAAAASUVORK5CYII=") repeat}
.vignette{position:fixed;inset:0;z-index:99;pointer-events:none;background:radial-gradient(ellipse at center,transparent 50%,rgba(42,8,8,0.4) 100%)}

/* Frontispiece */
.frontispiece{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:8vw}
.border-frame{position:absolute;inset:4%;width:92%;height:92%;z-index:1}
.frame-path,.fern-corner{stroke-dasharray:2000;stroke-dashoffset:2000;transition:stroke-dashoffset 2.5s cubic-bezier(0.22,0.61,0.36,1)}
.frontispiece.revealed .frame-path,.frontispiece.revealed .fern-corner{stroke-dashoffset:0}
.title-block{position:relative;z-index:2;text-align:center;opacity:0;transition:opacity 1.8s cubic-bezier(0.22,0.61,0.36,1);transition-delay:2.5s}
.frontispiece.revealed .title-block{opacity:1}
.site-name{font-family:var(--font-display);font-weight:900;font-size:clamp(2.4rem,5vw + 1rem,5.2rem);letter-spacing:0.02em;line-height:1.1;color:var(--color-parchment);font-variation-settings:'WONK' 1,'opsz' 144;transition:font-weight 0.6s ease}
.site-name:hover{font-weight:300}
.site-inscription{font-family:var(--font-body);font-style:italic;font-weight:400;font-size:clamp(0.8rem,0.9vw + 0.3rem,1rem);color:var(--color-vellum);margin-top:12px;opacity:0;transition:opacity 1.2s ease 3.8s}
.frontispiece.revealed .site-inscription{opacity:0.7}
.scroll-cue{width:24px;height:24px;position:absolute;bottom:8vh;z-index:2;opacity:0;animation:cue-pulse 2s ease-in-out infinite;transition:opacity 0.8s ease 4.5s}
.frontispiece.revealed .scroll-cue{opacity:1}
@keyframes cue-pulse{0%,100%{opacity:0.3;transform:translateY(0)}50%{opacity:0.8;transform:translateY(4px)}}

/* Study section */
.study{padding:12vh 8vw;position:relative}
.study-grid{display:grid;grid-template-columns:1fr minmax(200px,0.4fr);gap:clamp(2rem,4vw,4rem);max-width:1100px;margin:0 auto}
.main-column{display:flex;flex-direction:column;gap:clamp(3rem,5vh,6rem)}
.text-block h2{font-family:var(--font-display);font-weight:700;font-size:clamp(1.6rem,3vw + 0.5rem,2.8rem);letter-spacing:0.01em;line-height:1.15;margin-bottom:16px;font-variation-settings:'WONK' 1,'opsz' 72}
.text-block p{margin-bottom:1rem;max-width:60ch}
.drop-cap::first-letter{font-family:var(--font-display);font-weight:900;font-size:4rem;float:left;margin-right:8px;line-height:0.8;color:var(--color-leaf);font-variation-settings:'WONK' 1}
.ivy-line{width:100%;max-width:400px;height:40px;margin-bottom:16px}
.ivy-line path{stroke-dasharray:500;stroke-dashoffset:500;transition:stroke-dashoffset 1.5s ease}
.ivy-line.drawn path{stroke-dashoffset:0}

/* Margin column */
.margin-column{display:flex;flex-direction:column;gap:clamp(2rem,4vh,4rem);padding-top:2rem}
.margin-note{font-size:clamp(0.8rem,0.9vw + 0.3rem,1rem);color:var(--color-vellum);line-height:1.6;opacity:0;transform:translateX(30px);transition:opacity 800ms cubic-bezier(0.22,0.61,0.36,1),transform 800ms cubic-bezier(0.22,0.61,0.36,1)}
.margin-note.visible{opacity:1;transform:translateX(0)}
.note-ref{font-family:var(--font-mono);font-size:0.9em;color:var(--color-gold);display:block;margin-bottom:4px}
.margin-note em{font-style:italic}
.botanical-fern{width:80px;height:120px;margin:8px 0}
.botanical-fern path{stroke-dasharray:200;stroke-dashoffset:200;transition:stroke-dashoffset 2s ease}
.margin-note.visible .botanical-fern path{stroke-dashoffset:0}

/* Gold rule */
.gold-rule{display:flex;justify-content:center;padding:8vh 8vw}
.gold-rule svg{width:100%;max-width:600px;height:12px}

/* Herbarium */
.herbarium{padding:8vh 8vw;max-width:1200px;margin:0 auto}
.herb-title{font-family:var(--font-display);font-weight:700;font-size:clamp(1.6rem,3vw + 0.5rem,2.8rem);text-align:center;margin-bottom:6vh;font-variation-settings:'WONK' 1}
.herb-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.herb-card{background:var(--color-claret);border:1px solid rgba(201,168,76,0.25);padding:28px;transform:rotate(var(--tilt,0deg));transition:border-color 400ms cubic-bezier(0.25,0.46,0.45,0.94),transform 400ms ease}
.herb-card:hover{border-color:var(--color-gold);transform:rotate(0deg)}
.card-botanical{width:80px;height:80px;margin-bottom:16px}
.herb-card h3{font-family:var(--font-display);font-weight:600;font-size:1.2rem;margin-bottom:8px;font-variation-settings:'WONK' 0}
.herb-card p{font-size:clamp(0.85rem,1vw,1rem);color:var(--color-vellum);line-height:1.65;margin-bottom:12px}
.card-date{font-family:var(--font-mono);font-size:0.75rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--color-vellum);opacity:0.6}

/* Colophon */
.colophon{padding:12vh 8vw;text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.lavender-sprig{width:40px;height:70px;opacity:0.6}
.colophon-text{font-family:var(--font-body);font-style:italic;font-size:clamp(0.8rem,0.9vw + 0.3rem,1rem);color:var(--color-vellum)}
.colophon-meta{font-family:var(--font-mono);font-size:clamp(0.75rem,0.8vw + 0.2rem,0.9rem);color:var(--color-vellum);opacity:0.5}

/* Reveal animations */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity 1000ms cubic-bezier(0.22,0.61,0.36,1),transform 1000ms cubic-bezier(0.22,0.61,0.36,1)}
[data-reveal].visible{opacity:1;transform:translateY(0)}

/* Palette refs */
.ref-oxblood{color:#4A0E0E}
.ref-claret{color:#6B1A1A}
.ref-gold{color:#C9A84C}
.ref-parchment{color:#F0E6D3}
.ref-vellum{color:#C7B89B}
.ref-mahogany{color:#2A0808}
.ref-leaf{color:#4A6741}
.ref-candle{color:#E8A635}

@media(max-width:900px){
.study-grid{grid-template-columns:1fr}
.margin-column{border-left:2px solid rgba(201,168,76,0.3);padding-left:16px;margin-top:3rem}
.margin-note{font-size:0.9rem;transform:translateX(0)}
.herb-cards{grid-template-columns:1fr}
.herb-card{transform:none !important}
body{padding:0}
}