:root { --primary-color: #2A3D45; --secondary-color: #C17C74; --accent-color: #F2D3AC; --background-color: #F7F7F7; --text-color: #333333; --heading-font: 'Poppins', sans-serif; --body-font: 'Lato', sans-serif; } body { font-family: var(--body-font); color: var(--text-color); background-color: var(--background-color); } h1, h2, h3, h4, h5, h6 { font-family: var(--heading-font); font-weight: 600; } .navbar { border-bottom: 1px solid #eee; } .navbar-brand { font-family: var(--heading-font); font-weight: 700; font-size: 1.5rem; color: var(--primary-color); } .btn-primary { background-color: var(--primary-color); border-color: var(--primary-color); font-weight: 600; padding: 0.75rem 1.5rem; transition: background-color 0.3s ease; } .btn-primary:hover { background-color: #1a2b34; border-color: #1a2b34; } .hero-section { background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('https://images.unsplash.com/photo-1470770841072-f978cf4d019e?q=80&w=2070&auto=format&fit=crop') no-repeat center center; background-size: cover; color: white; padding: 10rem 0; text-align: left; } .hero-section h1 { font-size: 4.5rem; font-weight: 700; } .hero-section .lead { font-size: 1.5rem; margin-bottom: 2rem; } .features-section { padding: 6rem 0; } .feature h3 { font-size: 1.75rem; margin-bottom: 1rem; color: var(--primary-color); } .feature p { font-size: 1.1rem; color: #666; } .registration-form { background-color: #fff; padding: 3rem; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); } .registration-form h2 { text-align: center; margin-bottom: 2rem; color: var(--primary-color); }