*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;line-height:1.6}body{background:#2C2C2C;color:#F2C94C;font-family:'Work Sans',sans-serif}
.container{max-width:900px;margin:0 auto;padding:0 24px}
.site-header{text-align:center;padding:48px 24px}
.logo{font-family:'Lora',serif;font-size:2.2rem;font-weight:600;color:#F2C94C}
.tagline{font-family:'Space Mono',monospace;font-size:0.8rem;color:#E8724A;margin-top:8px}
.hero{text-align:center;padding:40px 0;border-bottom:1px solid #2C4A5E}
.hero h2{font-family:'Lora',serif;font-size:1.8rem;color:#1E6B7B;margin-bottom:10px}
.hero p{color:#F2C94C;opacity:0.8;max-width:560px;margin:0 auto;font-size:0.9rem}
.concept-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding:40px 0}
.concept-card{background:rgba(44,74,94,0.3);border:1px solid #2C4A5E;border-radius:8px;padding:24px;opacity:0;transform:translateY(20px);transition:all 400ms ease-out}
.concept-card.visible{opacity:1;transform:translateY(0)}
.concept-card:hover{border-color:#F2C94C}
.concept-icon{width:40px;height:40px;border-radius:50%;margin-bottom:12px}
.concept-card h3{font-size:1.1rem;color:#1E6B7B;margin-bottom:6px}
.concept-card p{font-size:0.8rem;color:#F2C94C;opacity:0.7}
.quote-section{text-align:center;padding:40px 0}
blockquote{font-family:'Lora',serif;font-size:1.4rem;color:#E8724A;font-style:italic}
cite{display:block;font-family:'Space Mono',monospace;font-size:0.75rem;color:#2C4A5E;margin-top:8px;font-style:normal}
.site-footer{text-align:center;padding:24px;color:#2C4A5E;font-size:0.8rem}
@media(max-width:600px){.concept-grid{grid-template-columns:1fr}}