&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
  &lt;head&gt;
    &lt;meta charset="UTF-8" /&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0" /&gt;
    &lt;title&gt;Community Resources&lt;/title&gt;
    &lt;script src="/tailwindcss.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body class="bg-gradient-to-br from-gray-900 to-gray-800 text-white min-h-screen font-sans"&gt;
    &lt;header class="py-6 px-4 bg-opacity-90 bg-black backdrop-blur-lg sticky top-0 z-50"&gt;
      &lt;div class="container mx-auto flex justify-between items-center"&gt;
        &lt;h1 class="text-2xl font-bold text-pink-500"&gt;Community&lt;/h1&gt;
        &lt;nav class="space-x-6"&gt;
          &lt;a href="#about" class="hover:text-pink-400 transition-colors"&gt;About&lt;/a&gt;
          &lt;a href="#community" class="hover:text-pink-400 transition-colors"&gt;Community&lt;/a&gt;
          &lt;a href="/internet/community.html/index.html" class="hover:text-pink-400 transition-colors"&gt;Home&lt;/a&gt;
        &lt;/nav&gt;
      &lt;/div&gt;
    &lt;/header&gt;

    &lt;main class="container mx-auto px-4 py-12"&gt;
      &lt;section id="hero" class="text-center mb-20 animate-fade-in-up"&gt;
        &lt;h2 class="text-5xl font-extrabold mb-6 bg-clip-text text-transparent bg-gradient-to-r from-pink-500 to-purple-600 drop-shadow-lg"&gt;
          Resources
        &lt;/h2&gt;
        &lt;p class="text-xl text-gray-300 max-w-3xl mx-auto mb-8"&gt;
          Everything you need to make the most of your Community Hub experience.
        &lt;/p&gt;
      &lt;/section&gt;

      &lt;section id="guides" class="mb-20"&gt;
        &lt;h3 class="text-3xl font-bold text-center mb-12"&gt;Getting Started Guides&lt;/h3&gt;
        &lt;div class="grid md:grid-cols-2 gap-12"&gt;
          &lt;div class="bg-gray-800 p-8 rounded-2xl text-center transform transition duration-300 hover:scale-105 hover:bg-gray-700"&gt;
            &lt;svg class="w-12 h-12 mx-auto text-purple-400 mb-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"&gt;&lt;path d="M12 2v20M19.172 11.846a6 6 0 010 8.308"&gt;&lt;/path&gt;&lt;/svg&gt;
            &lt;h4 class="text-xl font-semibold mb-3"&gt;Community Onboarding&lt;/h4&gt;
            &lt;p class="text-gray-400"&gt;Step-by-step guide to help you become part of the Community.&lt;/p&gt;
            &lt;a href="/internet/community.html/resources/onboarding-guide.html" class="mt-4 inline-block text-pink-500 hover:underline"&gt;Read Guide →&lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="bg-gray-800 p-8 rounded-2xl text-center transform transition duration-300 hover:scale-105 hover:bg-gray-700"&gt;
            &lt;svg class="w-12 h-12 mx-auto text-pink-400 mb-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"&gt;&lt;path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"&gt;&lt;/path&gt;&lt;/svg&gt;
            &lt;h4 class="text-xl font-semibold mb-3"&gt;Community Etiquette&lt;/h4&gt;
            &lt;p class="text-gray-400"&gt;Learn how to participate respectfully and effectively in all Community events and forums.&lt;/p&gt;
            &lt;a href="/internet/community.html/resources/etiquette.html" class="mt-4 inline-block text-pink-500 hover:underline"&gt;Read Guide →&lt;/a&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/section&gt;

      &lt;section id="tools" class="mb-20"&gt;
        &lt;h3 class="text-3xl font-bold text-center mb-12"&gt;Tools &amp; Templates&lt;/h3&gt;
        &lt;div class="grid md:grid-cols-3 gap-12"&gt;
          &lt;div class="bg-gray-800 p-8 rounded-2xl text-center transform transition duration-300 hover:scale-105 hover:bg-gray-700"&gt;
            &lt;svg class="w-12 h-12 mx-auto text-blue-400 mb-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"&gt;&lt;path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"&gt;&lt;/path&gt;&lt;/svg&gt;
            &lt;h4 class="text-xl font-semibold mb-3"&gt;Event Planning Toolkit&lt;/h4&gt;
            &lt;p class="text-gray-400"&gt;Everything you need to plan and execute a perfect community event or meetup.&lt;/p&gt;
            &lt;a href="/internet/community.html/resources/event-planning-toolkit.html" class="mt-4 inline-block text-pink-500 hover:underline"&gt;Access Toolkit →&lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="bg-gray-800 p-8 rounded-2xl text-center transform transition duration-300 hover:scale-105 hover:bg-gray-700"&gt;
            &lt;svg class="w-12 h-12 mx-auto text-yellow-400 mb-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"&gt;&lt;path d="M3 18h18M4.5 17.25l7.5-9m0 0l7.5 9"&gt;&lt;/path&gt;&lt;/svg&gt;
            &lt;h4 class="text-xl font-semibold mb-3"&gt;Content Creation Kit&lt;/h4&gt;
            &lt;p class="text-gray-400"&gt;A suite of tools and templates for creating engaging content as part of the Community.&lt;/p&gt;
            &lt;a href="/internet/community.html/resources/content-kit.html" class="mt-4 inline-block text-pink-500 hover:underline"&gt;Access Kit →&lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="bg-gray-800 p-8 rounded-2xl text-center transform transition duration-300 hover:scale-105 hover:bg-gray-700"&gt;
            &lt;svg class="w-12 h-12 mx-auto text-purple-400 mb-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"&gt;&lt;path d="M12 2v20M19.172 11.846a6 6 0 010 8.308" stroke-linecap="round" stroke-linejoin="round"&gt;&lt;/path&gt;&lt;/svg&gt;
            &lt;h4 class="text-xl font-semibold mb-3"&gt;Collaboration Platform&lt;/h4&gt;
            &lt;p class="text-gray-400"&gt;Access collaborative tools and workspace to help build Community projects together.&lt;/p&gt;
            &lt;a href="/internet/community.html/resources/collaboration-platform.html" class="mt-4 inline-block text-pink-500 hover:underline"&gt;Access →&lt;/a&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/section&gt;

      &lt;section id="faq" class="mb-20"&gt;
        &lt;h3 class="text-3xl font-bold text-center mb-12"&gt;Frequently Asked Questions&lt;/h3&gt;
        &lt;div class="max-w-3xl mx-auto"&gt;
          &lt;details class="mb-6"&gt;
            &lt;summary class="cursor-pointer bg-gray-800 p-4 rounded-2xl font-medium"&gt;How do I get involved in the Community?&lt;/summary&gt;
            &lt;div class="p-4 pt-2 bg-gray-900 rounded-b-2xl"&gt;
              &lt;p&gt;You can start by joining our Discord or Slack workspace, attending events, or contributing to ongoing open-source projects on our platform. Check out our Onboarding Guide for details!&lt;/p&gt;
            &lt;/div&gt;
          &lt;/details&gt;
          &lt;details class="mb-6"&gt;
            &lt;summary class="cursor-pointer bg-gray-800 p-4 rounded-2xl font-medium"&gt;How often are events held?&lt;/summary&gt;
            &lt;div class="p-4 pt-2 bg-gray-900 rounded-b-2xl"&gt;
              &lt;p&gt;We host weekly workshops and monthly meetups, all designed to help build connections and learn new skills. Check out our Events page to learn more!&lt;/p&gt;
            &lt;/div&gt;
          &lt;/details&gt;
          &lt;details class="mb-6"&gt;
            &lt;summary class="cursor-pointer bg-gray-800 p-4 rounded-2xl font-medium"&gt;Can I start my own Community subgroup?&lt;/summary&gt;
            &lt;div class="p-4 pt-2 bg-gray-900 rounded-b-2xl"&gt;
              &lt;p&gt;Absolutely! All you need is a few members and a charter. Check out our Event Planning Toolkit to get started!&lt;/p&gt;
            &lt;/div&gt;
          &lt;/details&gt;
        &lt;/div&gt;
      &lt;/section&gt;

      &lt;footer class="bg-gray-900 p-8 text-center"&gt;
        &lt;p class="text-gray-400"&gt;Need more help? &lt;a href="/internet/community.html/support/contact.html" class="text-pink-500 hover:underline"&gt;Contact Support&lt;/a&gt;&lt;/p&gt;
        &lt;p class="text-gray-600 mt-2"&gt;&amp;copy; 2025 Community Hub&lt;/p&gt;
      &lt;/footer&gt;
    &lt;/main&gt;
  &lt;/body&gt;
&lt;/html&gt;