*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; font-weight: 300; background: #171814; color: #D0C8B8; overflow-x: hidden; }

#hero { position: relative; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; }
.hero-wreath { position: absolute; width: 80vmin; height: 80vmin; opacity: 0; animation: wreathFadeIn 3s ease forwards 0.5s; }
@keyframes wreathFadeIn { to { opacity: 1; } }
#wreath-svg { width: 100%; height: 100%; }
.wreath-path { stroke-dasharray: 1000; stroke-dashoffset: 1000; animation: drawPath 4s ease forwards 1s; }
@keyframes drawPath { to { stroke-dashoffset: 0; } }
.hero-content { position: relative; z-index: 2; text-align: center; opacity: 0; animation: fadeUp 1.5s ease forwards 2s; }
@keyframes fadeUp { to { opacity: 1; transform: translateY(0); } }
.hero-content { transform: translateY(20px); }
.hero-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 48px; color: #D0C8B8; letter-spacing: 0.02em; margin-bottom: 12px; }
.hero-subtitle { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 16px; color: #8B7355; letter-spacing: 0.15em; text-transform: uppercase; }
.scroll-indicator { position: absolute; bottom: 40px; display: flex; flex-direction: column; align-items: center; gap: 8px; opacity: 0; animation: fadeIn 1s ease forwards 3.5s; }
@keyframes fadeIn { to { opacity: 0.5; } }
.scroll-indicator span { font-family: 'Inter', sans-serif; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #8B7355; }

#catalogue { max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.specimen-section { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; padding: 120px 0; border-bottom: 1px solid rgba(139, 115, 85, 0.15); opacity: 0; transform: translateY(30px); transition: opacity 1s ease, transform 1s ease; }
.specimen-section.revealed { opacity: 1; transform: translateY(0); }
.specimen-section:nth-child(even) { direction: rtl; }
.specimen-section:nth-child(even) > * { direction: ltr; }
.specimen-number { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 72px; color: rgba(139, 115, 85, 0.2); display: block; line-height: 1; margin-bottom: 8px; }
.specimen-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 36px; color: #D0C8B8; margin-bottom: 4px; }
.specimen-common { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-style: italic; font-size: 18px; color: #8B7355; margin-bottom: 24px; }
.specimen-text p { font-family: 'Source Serif 4', 'Inter', serif; font-weight: 400; font-size: 15px; line-height: 1.8; color: rgba(208, 200, 184, 0.75); margin-bottom: 16px; }
.specimen-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.meta-tag { font-family: 'Inter', sans-serif; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #8B7355; padding: 4px 12px; border: 1px solid rgba(139, 115, 85, 0.25); border-radius: 2px; }

.specimen-illustration { display: flex; flex-direction: column; align-items: center; }
.botanical-svg { width: 100%; max-width: 300px; height: auto; }
.botanical-svg .draw-path { stroke-dasharray: 500; stroke-dashoffset: 500; transition: stroke-dashoffset 2s ease; }
.specimen-section.revealed .draw-path { stroke-dashoffset: 0; }
.illustration-label { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 13px; color: rgba(139, 115, 85, 0.5); margin-top: 16px; text-align: center; }

#footer { padding: 80px 40px; text-align: center; }
.footer-border { margin-bottom: 32px; }
.footer-vine { width: 100%; max-width: 600px; height: 40px; margin: 0 auto; display: block; }
.footer-text { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 16px; color: #8B7355; letter-spacing: 0.1em; margin-bottom: 8px; }
.footer-latin { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; font-size: 13px; color: rgba(139, 115, 85, 0.4); }

@media (max-width: 768px) {
    .specimen-section { grid-template-columns: 1fr; gap: 40px; padding: 80px 0; }
    .specimen-section:nth-child(even) { direction: ltr; }
    .hero-title { font-size: 36px; }
    .specimen-title { font-size: 28px; }
    #catalogue { padding: 0 24px; }
}
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #171814; }
::-webkit-scrollbar-thumb { background: #8B7355; border-radius: 2px; }
