| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Navy Dreams: Intel & Beyond</title> | |
| <link rel="stylesheet" href="style.css"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script src="components/navbar.js"></script> | |
| <script src="components/hero.js"></script> | |
| <script src="components/features.js"></script> | |
| <script src="components/testimonial.js"></script> | |
| <script src="components/footer.js"></script> | |
| </head> | |
| <body class="bg-gray-100"> | |
| <custom-navbar></custom-navbar> | |
| <custom-hero></custom-hero> | |
| <div class="container mx-auto px-4 py-16"> | |
| <div class="max-w-4xl mx-auto"> | |
| <!-- Path to Joining Section --> | |
| <section class="mb-20"> | |
| <h2 class="text-3xl font-bold text-gray-800 mb-8 text-center">Navigating Your Path to Naval Intelligence</h2> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <!-- Age Waiver Info --> | |
| <div class="bg-white p-6 rounded-lg shadow-md border-l-4 border-blue-500"> | |
| <div class="flex items-center mb-4"> | |
| <i data-feather="alert-circle" class="text-blue-500 mr-3"></i> | |
| <h3 class="text-xl font-semibold text-gray-800">Age Waiver Possibilities</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4">While the standard cutoff is 42, the Canadian Armed Forces may consider age waiver requests for exceptional candidates.</p> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2 mt-1"></i> | |
| <span>Demonstrate exceptional skills or experience</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2 mt-1"></i> | |
| <span>Show outstanding physical fitness</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2 mt-1"></i> | |
| <span>Highlight unique language or technical skills</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <!-- Alternative Paths --> | |
| <div class="bg-white p-6 rounded-lg shadow-md border-l-4 border-indigo-500"> | |
| <div class="flex items-center mb-4"> | |
| <i data-feather="compass" class="text-indigo-500 mr-3"></i> | |
| <h3 class="text-xl font-semibold text-gray-800">Alternative Paths</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4">If direct entry isn't possible, consider these alternative routes:</p> | |
| <div class="space-y-4"> | |
| <div class="flex items-start"> | |
| <div class="bg-indigo-100 p-2 rounded-full mr-3"> | |
| <i data-feather="briefcase" class="text-indigo-600"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-800">Civilian Intelligence Roles</h4> | |
| <p class="text-sm text-gray-600">Apply your skills in related government agencies</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-indigo-100 p-2 rounded-full mr-3"> | |
| <i data-feather="book" class="text-indigo-600"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-800">Specialized Education</h4> | |
| <p class="text-sm text-gray-600">Pursue relevant degrees/certifications to strengthen your case</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-indigo-100 p-2 rounded-full mr-3"> | |
| <i data-feather="users" class="text-indigo-600"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-800">Reserve Forces</h4> | |
| <p class="text-sm text-gray-600">Consider joining the Naval Reserve as an alternative</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Step-by-Step Guide --> | |
| <section class="mb-20"> | |
| <h2 class="text-3xl font-bold text-gray-800 mb-8 text-center">Your Action Plan</h2> | |
| <div class="relative"> | |
| <!-- Vertical line --> | |
| <div class="absolute h-full w-0.5 bg-blue-200 left-4 top-0"></div> | |
| <!-- Steps --> | |
| <div class="space-y-8"> | |
| <!-- Step 1 --> | |
| <div class="relative flex items-start group"> | |
| <div class="absolute -left-1.5 mt-6 w-3 h-3 rounded-full bg-blue-500 group-hover:bg-blue-600 transition-colors"></div> | |
| <div class="flex-shrink-0 h-8 w-8 rounded-full bg-blue-500 text-white flex items-center justify-center z-10"> | |
| 1 | |
| </div> | |
| <div class="ml-6"> | |
| <h3 class="text-xl font-semibold text-gray-800">Initial Research</h3> | |
| <p class="mt-1 text-gray-600">Contact a Canadian Forces Recruiting Centre to discuss waiver possibilities and understand current needs in Naval Intelligence.</p> | |
| </div> | |
| </div> | |
| <!-- Step 2 --> | |
| <div class="relative flex items-start group"> | |
| <div class="absolute -left-1.5 mt-6 w-3 h-3 rounded-full bg-blue-500 group-hover:bg-blue-600 transition-colors"></div> | |
| <div class="flex-shrink-0 h-8 w-8 rounded-full bg-blue-500 text-white flex items-center justify-center z-10"> | |
| 2 | |
| </div> | |
| <div class="ml-6"> | |
| <h3 class="text-xl font-semibold text-gray-800">Build Your Case</h3> | |
| <p class="mt-1 text-gray-600">Document your relevant experience, skills, and achievements that would make you valuable despite your age.</p> | |
| </div> | |
| </div> | |
| <!-- Step 3 --> | |
| <div class="relative flex items-start group"> | |
| <div class="absolute -left-1.5 mt-6 w-3 h-3 rounded-full bg-blue-500 group-hover:bg-blue-600 transition-colors"></div> | |
| <div class="flex-shrink-0 h-8 w-8 rounded-full bg-blue-500 text-white flex items-center justify-center z-10"> | |
| 3 | |
| </div> | |
| <div class="ml-6"> | |
| <h3 class="text-xl font-semibold text-gray-800">Physical Preparation</h3> | |
| <p class="mt-1 text-gray-600">Begin rigorous physical training to exceed the basic fitness requirements and demonstrate your capability.</p> | |
| </div> | |
| </div> | |
| <!-- Step 4 --> | |
| <div class="relative flex items-start group"> | |
| <div class="absolute -left-1.5 mt-6 w-3 h-3 rounded-full bg-blue-500 group-hover:bg-blue-600 transition-colors"></div> | |
| <div class="flex-shrink-0 h-8 w-8 rounded-full bg-blue-500 text-white flex items-center justify-center z-10"> | |
| 4 | |
| </div> | |
| <div class="ml-6"> | |
| <h3 class="text-xl font-semibold text-gray-800">Formal Application</h3> | |
| <p class="mt-1 text-gray-600">Submit your application with a compelling waiver request, supported by documentation of your qualifications.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Resources Section --> | |
| <section class="mb-20"> | |
| <h2 class="text-3xl font-bold text-gray-800 mb-8 text-center">Essential Resources</h2> | |
| <div class="grid md:grid-cols-3 gap-6"> | |
| <a href="https://www.canada.ca/en/department-national-defence/services/caf-jobs.html" target="_blank" class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow"> | |
| <div class="text-blue-500 mb-4"> | |
| <i data-feather="external-link"></i> | |
| </div> | |
| <h3 class="text-lg font-semibold text-gray-800 mb-2">Official CAF Recruitment</h3> | |
| <p class="text-gray-600">Canadian Armed Forces careers website with official requirements</p> | |
| </a> | |
| <a href="https://www.forces.ca/en/" target="_blank" class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow"> | |
| <div class="text-blue-500 mb-4"> | |
| <i data-feather="anchor"></i> | |
| </div> | |
| <h3 class="text-lg font-semibold text-gray-800 mb-2">Forces.ca</h3> | |
| <p class="text-gray-600">Comprehensive resource for joining the Canadian military</p> | |
| </a> | |
| <a href="https://www.canada.ca/en/security-intelligence-service.html" target="_blank" class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow"> | |
| <div class="text-blue-500 mb-4"> | |
| <i data-feather="eye"></i> | |
| </div> | |
| <h3 class="text-lg font-semibold text-gray-800 mb-2">CSIS Careers</h3> | |
| <p class="text-gray-600">Civilian intelligence agency alternative career paths</p> | |
| </a> | |
| </div> | |
| </section> | |
| </div> | |
| </div> | |
| <custom-footer></custom-footer> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| <script src="script.js"></script> | |
| </body> | |
| </html> |