:root { --primary-color: #92400e; --secondary-color: #78350f; --accent-color: #fbbf24; } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: Arial, sans-serif; line-height: 1.6; } .sticky-nav { position: fixed; top: 0; left: 0; width: 100%; background-color: var(--primary-color); color: #fff; padding: 1em; display: flex; justify-content: space-between; align-items: center; } .sticky-nav ul { list-style: none; margin: 0; padding: 0; display: flex; } .sticky-nav li { margin-right: 20px; } .sticky-nav a { color: #fff; text-decoration: none; } .hero { background-image: linear-gradient(to bottom, var(--primary-color), var(--secondary-color)); height: 100vh; display: flex; justify-content: center; align-items: center; color: #fff; } .hero h1 { font-size: 48px; } .hero p { font-size: 18px; } .cta { background-color: var(--accent-color); color: #000; border: none; padding: 10px 20px; font-size: 18px; cursor: pointer; } .services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 20px; } .grid-item { background-color: #f7f7f7; padding: 20px; border: 1px solid #ddd; } .grid-item h3 { font-size: 18px; margin-bottom: 10px; } .grid-item p { font-size: 14px; } .emoji { font-size: 24px; margin-bottom: 10px; } .about { padding: 20px; } .testimonials { padding: 20px; } .testimonial { background-color: #f7f7f7; padding: 20px; border: 1px solid #ddd; margin-bottom: 20px; } .testimonial p { font-size: 14px; } .testimonial span { color: var(--primary-color); font-size: 18px; } .contact { padding: 20px; } #contact-form { display: flex; flex-direction: column; } #contact-form input, #contact-form textarea { padding: 10px; margin-bottom: 20px; border: 1px solid #ccc; } #contact-form button { background-color: var(--accent-color); color: #000; border: none; padding: 10px 20px; font-size: 18px; cursor: pointer; } .footer { background-color: var(--primary-color); color: #fff; padding: 10px; text-align: center; }