| .hero { | |
| padding: 2.5rem 2rem; | |
| border-radius: 12px; | |
| background: linear-gradient(135deg, #0f1a0c 0%, #1c2b16 55%, #76b900 100%); | |
| color: #f8f9fb; | |
| margin: 1.5rem 0 2rem 0; | |
| } | |
| .hero-title { | |
| font-size: 2.2rem; | |
| margin: 0 0 0.6rem 0; | |
| } | |
| .hero-subtitle { | |
| font-size: 1.1rem; | |
| margin: 0 0 1.2rem 0; | |
| opacity: 0.9; | |
| } | |
| .hero-actions a { | |
| display: inline-block; | |
| margin-right: 0.8rem; | |
| padding: 0.5rem 0.9rem; | |
| border-radius: 6px; | |
| background: #76b900; | |
| color: #0f1a0c; | |
| text-decoration: none; | |
| font-weight: 600; | |
| } | |
| .hero-actions a.secondary { | |
| background: transparent; | |
| color: #f8f9fb; | |
| border: 1px solid #f8f9fb; | |
| } | |
| .card-grid { | |
| display: grid; | |
| gap: 1rem; | |
| grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); | |
| margin: 1.5rem 0 2rem 0; | |
| } | |
| .card { | |
| border: 1px solid rgba(0, 0, 0, 0.08); | |
| border-radius: 10px; | |
| padding: 1rem 1.2rem; | |
| background: #ffffff; | |
| } | |
| .card h3 { | |
| margin-top: 0; | |
| margin-bottom: 0.4rem; | |
| } | |
| .card p { | |
| margin: 0; | |
| color: #3c4758; | |
| } | |
| .quick-links { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 0.8rem; | |
| margin: 1rem 0 2rem 0; | |
| } | |
| .quick-links a { | |
| display: inline-block; | |
| padding: 0.4rem 0.8rem; | |
| border-radius: 999px; | |
| background: #edf2f7; | |
| color: #1a202c; | |
| text-decoration: none; | |
| font-weight: 600; | |
| } | |