body { font-family: 'Inter', Arial, sans-serif; background: #F8F1E6; color: #2c2c2c; margin: 0; }
header, footer { text-align: center; background: #255B3B; color: #fff; padding: 2em 1em; }
nav { background: #fff; padding: 0.7em; box-shadow: 0 2px 6px #0001; text-align: center; }
nav a { text-decoration: none; color: #255B3B; margin: 0 1.2em; font-weight: 500; font-size: 1em; transition: color 0.2s; }
nav a:hover { color: #C2611B; }
.logo { max-width: 110px; margin-bottom: 1rem; }
.quote { color: #ffe7ad; font-size: 1.08em; margin-top: 1em; font-style: italic; }
.hero { max-width: 900px; margin: 2em auto; background: #fff9f5; border-radius: 16px; padding: 2em 1em; box-shadow: 0 0 16px #0001; text-align: center; }
.hero img { max-width: 300px; width: 100%; border-radius: 12px; margin-bottom: 1em; }
.cta { display: inline-block; margin-top: 1.3em; background: #C2611B; color: #fff; padding: 0.85em 1.5em; border-radius: 5px; font-size: 1.08em; font-weight: bold; text-decoration: none; }
.section { max-width: 900px; margin: 2em auto; padding: 1.7em 1em 1.5em 1em; background: #fff; border-radius: 14px; box-shadow: 0 1px 10px #0001; }
.section h2 { color: #255B3B; margin-top: 0; font-size: 1.5em; }
footer { background: #255B3B; color: #fff; text-align: center; padding: 2em 1em 1em 1em; font-size: 0.97em; margin-top: 3em; }
@media (max-width: 600px) { nav a { margin: 0 0.6em; font-size: 0.98em; } .section, .hero { padding: 1.2em 0.3em; } .hero img { max-width: 96vw; } }