I want you to act as an HTML5 and CSS Responsive Web Design expert specializing in building Christian websites. Task: I am looking to design a responsive, user-friendly Christian website for a church community that offers online sermons, event calendars, donation capabilities, and community forums. The website should provide an optimal viewing experience across a wide range of devices (desktops, tablets, smartphones) and ensure fast loading times, accessibility, and adherence to Christian values and aesthetics. Requirements & Features: Responsive Layout: Utilize modern HTML5 and CSS3 techniques (such as Flexbox and Grid) to create a fluid and adaptable layout that maintains usability and aesthetics on all screen sizes. Navigation: Design an intuitive and accessible navigation menu that includes sections like Home, About Us, Sermons, Events, Donate, and Community. Ensure the menu collapses gracefully on smaller screens with features like a hamburger menu for mobile devices. Visual Design: Implement a clean and visually appealing design that reflects Christian values, including appropriate color schemes, typography, and imagery (e.g., nature, community gatherings, religious symbols). Ensure high contrast and readability. Performance Optimization: Optimize images, leverage CSS minification, and use responsive images (e.g., srcset) to ensure fast loading times. Implement lazy loading where appropriate. Accessibility: Ensure the website adheres to WCAG 2.1 guidelines, including proper use of ARIA labels, keyboard navigability, and sufficient color contrast to accommodate all users. SEO Best Practices: Structure the HTML with semantic elements, optimize meta tags, and ensure clean URLs to improve search engine visibility and reach within the Christian community. Interactive Elements: Incorporate interactive features such as video embeds for sermons, event registration forms, donation buttons with secure payment gateways, and community forums using CSS and minimal JavaScript, ensuring they are responsive and accessible. Content Management Integration: Provide guidance on integrating with popular CMS platforms (e.g., WordPress, Drupal) if the church prefers to manage content dynamically. Testing: Provide strategies for testing the website’s responsiveness and performance across different devices and browsers. Recommend tools and methods for ongoing maintenance and updates. Specific Requests: Provide a detailed outline of the HTML5 structure and CSS3 styling needed to achieve the responsive layout described above. Recommend best practices for organizing CSS (e.g., BEM methodology, CSS preprocessors like SASS) to maintain clean and scalable code. Suggest optimization techniques to enhance website performance without compromising design quality. Explain how to implement accessibility features effectively within the HTML and CSS framework. Offer tips for SEO optimization specific to a Christian website context, such as targeting relevant keywords and optimizing for local searches. Include example code snippets for key components like the responsive navigation menu, donation buttons, and sermon video embeds. Deliverable: A comprehensive guide or example code snippets that demonstrate how to build the responsive Christian website according to the specifications, including explanations of the choices made for HTML5 semantics, CSS3 layout techniques, and optimization strategies.