{"id":225,"date":"2025-05-30T21:46:02","date_gmt":"2025-05-30T21:46:02","guid":{"rendered":"https:\/\/caeruscollective.org\/?page_id=225"},"modified":"2025-07-25T01:33:41","modified_gmt":"2025-07-25T01:33:41","slug":"home-2","status":"publish","type":"page","link":"https:\/\/caeruscollective.org\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n\n \n \n Caerus Collective - Landing Page<\/title>\n <style>\n \/* CSS Variables for Easy Customization *\/\n :root {\n --primary-color: #10b981;\n --primary-hover: #059669;\n --secondary-color: #0f172a;\n --text-light: #FFFFFF;\n --text-dark: black;\n --background-dark: #0f172a;\n --background-light: #f1f5f9;\n --card-background: #ffffff;\n --error-color: #ef4444;\n --success-color: #10b981;\n }\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Lato, sans-serif;\n line-height: 1.6;\n color: #ffffff;\n }\n\n .landing-container {\n min-height: 100vh;\n background: linear-gradient(135deg, var(--background-dark) 0%, #1e293b 50%, #1e40af 100%);\n position: relative;\n overflow: hidden;\n }\n\n .landing-container::before {\n content: '';\n position: absolute;\n top: 25%;\n left: 25%;\n width: 128px;\n height: 128px;\n border-radius: 50%;\n background: rgba(16, 185, 129, 0.05);\n filter: blur(40px);\n }\n\n .landing-container::after {\n content: '';\n position: absolute;\n bottom: 33%;\n right: 33%;\n width: 160px;\n height: 160px;\n border-radius: 50%;\n background: rgba(16, 185, 129, 0.05);\n filter: blur(80px);\n }\n\n .container {\n max-width: 1200px;\n margin: 0 auto;\n padding: 0 1rem;\n position: relative;\n z-index: 10;\n }\n\n \/* Hero Section *\/\n .hero-section {\n padding: 4rem 0 6rem;\n }\n\n .hero-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 4rem;\n align-items: center;\n }\n\n @media (min-width: 1024px) {\n .hero-grid {\n grid-template-columns: 1fr 1fr;\n }\n }\n\n .hero-content {\n color: white;\n }\n\n .hero-tagline {\n font-size: 0.875rem;\n font-weight: 600;\n color: var(--primary-color);\n letter-spacing: 0.1em;\n text-transform: uppercase;\n margin-bottom: 1rem;\n }\n\n .hero-title {\n font-size: 2.25rem;\n font-weight: 700;\n line-height: 1.1;\n color: #ffffff;\n margin-bottom: 1rem;\n }\n\n @media (min-width: 768px) {\n .hero-title {\n font-size: 3rem;\n }\n }\n\n @media (min-width: 1024px) {\n .hero-title {\n font-size: 3.75rem;\n }\n }\n\n @media (min-width: 1280px) {\n .hero-title {\n color: white;\n font-size: 4.5rem;\n }\n }\n\n .hero-highlight {\n color: var(--primary-color);\n position: relative;\n }\n\n .hero-highlight::after {\n content: '';\n position: absolute;\n bottom: -16px;\n left: 0;\n width: 100%;\n height: 24px;\n background: url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 300 24' fill='none' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cpath d='M10 18 Q 150 8 290 18' stroke='%2310b981' stroke-width='3' fill='none' stroke-linecap='round'\/%3E%3C\/svg%3E\") no-repeat;\n background-size: contain;\n }\n\n .hero-subtitle {\n font-size: 1.125rem;\n color: var(--text-light);\n font-weight: 500;\n margin-bottom: 1.5rem;\n }\n\n @media (min-width: 768px) {\n .hero-subtitle {\n font-size: 1.25rem;\n }\n }\n\n @media (min-width: 1024px) {\n .hero-subtitle {\n font-size: 1.5rem;\n }\n }\n\n .hero-description {\n font-size: 1rem;\n color: var(--text-light);\n line-height: 1.7;\n max-width: 36rem;\n margin-bottom: 2rem;\n }\n\n @media (min-width: 768px) {\n .hero-description {\n font-size: 1.225rem;\n }\n }\n\n .hero-button {\n background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-hover) 100%);\n color: white;\n padding: 0.875rem 1.75rem;\n font-size: 1rem;\n font-weight: 600;\n border-radius: 0.75rem;\n border: none;\n cursor: pointer;\n box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);\n transition: all 0.2s ease;\n text-decoration: none;\n display: inline-block;\n }\n\n @media (min-width: 768px) {\n .hero-button {\n padding: 1rem 2rem;\n font-size: 1.125rem;\n }\n }\n\n .hero-button:hover {\n background: linear-gradient(135deg, var(--primary-hover) 0%, #047857 100%);\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);\n transform: translateY(-2px);\n }\n\n \/* Image Collage *\/\n .image-collage {\n position: relative;\n height: 320px;\n margin: 0 auto;\n max-width: 480px;\n }\n\n @media (min-width: 768px) {\n .image-collage {\n height: 400px;\n max-width: 600px;\n }\n }\n\n .main-image {\n position: relative;\n z-index: 10;\n background: white;\n border-radius: 1rem;\n box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);\n overflow: hidden;\n transform: rotate(2deg);\n width: 100%;\n height: 240px;\n }\n\n @media (min-width: 768px) {\n .main-image {\n height: 320px;\n }\n }\n\n .main-image img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n .overlay-image-1 {\n position: absolute;\n top: -16px;\n right: -16px;\n z-index: 20;\n background: white;\n border-radius: 0.75rem;\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);\n overflow: hidden;\n transform: rotate(-6deg);\n width: 128px;\n height: 96px;\n }\n\n @media (min-width: 768px) {\n .overlay-image-1 {\n top: -24px;\n right: -24px;\n width: 192px;\n height: 128px;\n }\n }\n\n .overlay-image-2 {\n position: absolute;\n bottom: -12px;\n left: -12px;\n z-index: 20;\n background: white;\n border-radius: 0.75rem;\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);\n overflow: hidden;\n transform: rotate(3deg);\n width: 112px;\n height: 84px;\n }\n\n @media (min-width: 768px) {\n .overlay-image-2 {\n bottom: -16px;\n left: -16px;\n width: 176px;\n height: 112px;\n }\n }\n\n .overlay-image-1 img,\n .overlay-image-2 img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n .decorative-circle-1 {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 256px;\n height: 256px;\n border: 1px solid rgba(16, 185, 129, 0.2);\n border-radius: 50%;\n z-index: -10;\n }\n\n @media (min-width: 768px) {\n .decorative-circle-1 {\n width: 384px;\n height: 384px;\n }\n }\n\n .decorative-circle-2 {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 192px;\n height: 192px;\n border: 1px solid rgba(16, 185, 129, 0.1);\n border-radius: 50%;\n z-index: -10;\n }\n\n @media (min-width: 768px) {\n .decorative-circle-2 {\n width: 320px;\n height: 320px;\n }\n }\n\n \/* Content Section *\/\n .content-section {\n padding: 4rem 0;\n }\n\n .content-container {\n max-width: 64rem;\n margin: 0 auto;\n color: white;\n }\n\n .content-title {\n font-size: 1.5rem;\n font-weight: bold;\n text-align: center;\n color: #ffffff;\n margin-bottom: 2rem;\n line-height: 1.2;\n }\n\n @media (min-width: 768px) {\n .content-title {\n color: white;\n font-size: 1.875rem;\n }\n }\n\n @media (min-width: 1024px) {\n .content-title {\n font-size: 2.25rem;\n }\n }\n\n .content-highlight {\n color: var(--primary-color);\n position: relative;\n }\n\n .content-highlight::after {\n content: '';\n position: absolute;\n bottom: -4px;\n left: 0;\n width: 100%;\n height: 2px;\n background: var(--primary-color);\n border-radius: 9999px;\n opacity: 0.6;\n }\n\n .content-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 1.5rem;\n margin-bottom: 2rem;\n color: var(--text-light);\n }\n\n @media (min-width: 768px) {\n .content-grid {\n grid-template-columns: 1fr 1fr;\n gap: 2rem;\n }\n }\n\n .content-text {\n font-size: 1rem;\n line-height: 1.7;\n }\n\n @media (min-width: 768px) {\n .content-text {\n font-size: 1.225rem;\n }\n }\n\n .name-section {\n padding-top: 2rem;\n border-top: 1px solid rgba(148, 163, 184, 0.5);\n }\n\n .name-title {\n font-size: 1rem;\n font-weight: bold;\n color: var(--primary-color);\n margin-bottom: 1rem;\n letter-spacing: 0.05em;\n }\n\n @media (min-width: 768px) {\n .name-title {\n font-size: 1.45rem;\n }\n }\n\n .name-description {\n color: var(--text-light);\n line-height: 1.7;\n font-size: 1rem;\n }\n\n @media (min-width: 768px) {\n .name-description {\n font-size: 1.225rem;\n }\n }\n\n \/* Form Section *\/\n .form-section {\n background: var(--background-light);\n padding: 3rem 0;\n }\n\n @media (min-width: 768px) {\n .form-section {\n padding: 5rem 0;\n }\n }\n\n .form-card {\n max-width: 42rem;\n margin: 0 auto;\n background: var(--card-background);\n box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);\n border: none;\n border-radius: 1rem;\n overflow: hidden;\n }\n\n .form-accent {\n height: 4px;\n background: linear-gradient(90deg, var(--primary-color) 0%, var(--primary-hover) 100%);\n }\n\n .form-header {\n text-align: center;\n padding: 2rem 1.5rem 1rem;\n }\n\n @media (min-width: 768px) {\n .form-header {\n padding: 3rem 3rem 2rem;\n }\n }\n\n .form-title {\n font-size: 1.5rem;\n font-weight: bold;\n color: var(--text-dark);\n margin-bottom: 1rem;\n line-height: 1.2;\n }\n\n @media (min-width: 768px) {\n .form-title {\n font-size: 1.875rem;\n }\n }\n\n @media (min-width: 1024px) {\n .form-title {\n font-size: 2.25rem;\n }\n }\n\n .form-subtitle {\n color: #64748b;\n font-size: 1rem;\n }\n\n @media (min-width: 768px) {\n .form-subtitle {\n font-size: 1.25rem;\n }\n }\n\n .form-content {\n padding: 0 1.5rem 2rem;\n }\n\n @media (min-width: 768px) {\n .form-content {\n padding: 0 3rem 3rem;\n }\n }\n\n .form-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 1.5rem;\n margin-bottom: 2rem;\n }\n\n .form-grid-2 {\n display: grid;\n grid-template-columns: 1fr;\n gap: 1.5rem;\n }\n\n @media (min-width: 768px) {\n .form-grid-2 {\n grid-template-columns: 1fr 1fr;\n }\n }\n\n .form-group {\n margin-bottom: 0.75rem;\n }\n\n .form-label {\n display: block;\n color: var(--text-dark);\n font-weight: 600;\n margin-bottom: 0.75rem;\n font-size: 0.875rem;\n }\n\n @media (min-width: 768px) {\n .form-label {\n font-size: 1rem;\n }\n }\n\n .form-input,\n .form-select {\n width: 100%;\n border: 2px solid #e2e8f0;\n border-radius: 0.75rem;\n padding: 0.875rem;\n font-size: 0.875rem;\n color: var(--text-dark);\n background: white;\n transition: all 0.2s ease;\n }\n\n @media (min-width: 768px) {\n .form-input,\n .form-select {\n padding: 1rem;\n font-size: 1rem;\n }\n }\n\n .form-input:focus,\n .form-select:focus {\n outline: none;\n border-color: var(--primary-color);\n box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.1);\n }\n\n .form-input.error,\n .form-select.error {\n border-color: var(--error-color);\n }\n\n .form-input.error:focus,\n .form-select.error:focus {\n border-color: var(--error-color);\n box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);\n }\n\n .form-input::placeholder {\n color: #94a3b8;\n }\n\n .form-select {\n appearance: none;\n background-image: url(\"data:image\/svg+xml,%3csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'\/%3e%3c\/svg%3e\");\n background-position: right 0.5rem center;\n background-repeat: no-repeat;\n background-size: 1.5em 1.5em;\n padding-right: 2.5rem;\n }\n\n .error-message {\n color: var(--error-color);\n font-size: 0.75rem;\n font-weight: 500;\n margin-top: 0.25rem;\n }\n\n @media (min-width: 768px) {\n .error-message {\n font-size: 0.875rem;\n }\n }\n\n .form-submit {\n width: 100%;\n background: linear-gradient(90deg, var(--primary-color) 0%, var(--primary-hover) 100%);\n color: white;\n font-weight: bold;\n padding: 0.875rem;\n border-radius: 0.75rem;\n border: none;\n font-size: 1rem;\n margin-top: 2rem;\n cursor: pointer;\n transition: all 0.2s ease;\n box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);\n }\n\n @media (min-width: 768px) {\n .form-submit {\n padding: 1rem;\n font-size: 1.125rem;\n margin-top: 2.5rem;\n }\n }\n\n .form-submit:hover:not(:disabled) {\n background: linear-gradient(90deg, var(--primary-hover) 0%, #047857 100%);\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);\n transform: translateY(-2px);\n }\n\n .form-submit:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n transform: none;\n }\n\n .loading-spinner {\n display: inline-block;\n width: 20px;\n height: 20px;\n border: 2px solid #ffffff;\n border-radius: 50%;\n border-top-color: transparent;\n animation: spin 1s ease-in-out infinite;\n margin-right: 0.5rem;\n }\n\n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n\n .success-message {\n background: #dcfce7;\n border: 1px solid #bbf7d0;\n color: #166534;\n padding: 1rem;\n border-radius: 0.5rem;\n margin-bottom: 1rem;\n text-align: center;\n font-size: 0.875rem;\n }\n\n @media (min-width: 768px) {\n .success-message {\n font-size: 1rem;\n }\n }\n\n .error-banner {\n background: #fef2f2;\n border: 1px solid #fecaca;\n color: #dc2626;\n padding: 1rem;\n border-radius: 0.5rem;\n margin-bottom: 1rem;\n text-align: center;\n font-size: 0.875rem;\n }\n\n @media (min-width: 768px) {\n .error-banner {\n font-size: 1rem;\n }\n }\n\n \/* Additional responsive adjustments *\/\n @media (max-width: 640px) {\n .container {\n padding: 0 0.75rem;\n }\n \n .hero-section {\n padding: 3rem 0 4rem;\n }\n \n .content-section {\n padding: 3rem 0;\n }\n \n .hero-grid {\n gap: 3rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"landing-container\">\n <!-- Hero Section -->\n <section class=\"hero-section\">\n <div class=\"container\">\n <div class=\"hero-grid\">\n <!-- Left Column - Hero Content -->\n <div class=\"hero-content\">\n <p class=\"hero-tagline\">YOUR JOURNEY TO OWNERSHIP BEGINS HERE<\/p>\n <h1 class=\"hero-title\">\n Ready To Chart A \n <span class=\"hero-highlight\">New Path?<\/span>\n <\/h1>\n <p class=\"hero-subtitle\">Propelling Transformative Action.<\/p>\n \n <p class=\"hero-description\">\n The traditional pathways of how we think about work, ownership, and \n opportunity are being reshaped in real time. Your experience isn't just \n a bullet point, it's the ink to pen your next chapter.\n <\/p>\n\n <button class=\"hero-button\" onclick=\"scrollToForm()\">\n Partner With Us\n <\/button>\n  \n <a href=\"https:\/\/givebutter.com\/support-caerus\" class=\"hero-button\" style=\"display: inline-block; text-decoration: none;\">\n Donate\n<\/a>\n <\/div>\n\n <!-- Right Column - Image Collage -->\n <div class=\"image-collage\">\n <div class=\"main-image\">\n <img decoding=\"async\" \n src=\"https:\/\/caeruscollective.org\/wp-content\/uploads\/2025\/06\/Fauxels-Professional-Photo-scaled-e1748892548980.jpg\" \n alt=\"Business professionals collaborating\"\n loading=\"lazy\"\n \/>\n <\/div>\n \n <div class=\"overlay-image-1\">\n <img decoding=\"async\" \n src=\"https:\/\/caeruscollective.org\/wp-content\/uploads\/2025\/06\/Manufacturing-Team-Photo-1-scaled.jpg\" \n alt=\"Team meeting\"\n loading=\"lazy\"\n \/>\n <\/div>\n \n <div class=\"overlay-image-2\">\n <img decoding=\"async\" \n src=\"https:\/\/caeruscollective.org\/wp-content\/uploads\/2025\/02\/Entrepreneurship-Photo-2149521550-scaled.jpg\" \n alt=\"Professional working\"\n loading=\"lazy\"\n \/>\n <\/div>\n\n <div class=\"decorative-circle-1\"><\/div>\n <div class=\"decorative-circle-2\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Content Section -->\n <section class=\"content-section\">\n <div class=\"container\">\n <div class=\"content-container\">\n <h2 class=\"content-title\">\n Turning Obstacles To \n <span class=\"content-highlight\">On-Ramps<\/span>\n <\/h2>\n \n <div class=\"content-grid\">\n <p class=\"content-text\">\n Whether government bureaucracies or corporate boardrooms, you've navigated complex \n systems, managed diverse teams, and delivered results despite constraints.\n <\/p>\n \n <p class=\"content-text\">\n The Caerus Collective is your co-author, helping you confront challenges and convert \n obstacles into on-ramps, showing you the path to ownership is more accessible than you think.\n <\/p>\n <\/div>\n\n <div class=\"name-section\">\n <h3 class=\"name-title\">WHAT'S IN A NAME?<\/h3>\n <p class=\"name-description\">\n Drawing our name from the Greek God of opportunity and favorable moments, The Caerus Collective (pronounced: keh-rus) embodies the principle that lasting impact comes from recognizing and seizing the right moment with prepared, decisive action.\n <\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Form Section -->\n <section class=\"form-section\" id=\"partner-form\">\n <div class=\"container\">\n <div class=\"form-card\">\n <div class=\"form-accent\"><\/div>\n <div class=\"form-header\">\n <h2 class=\"form-title\">Ready to Seize the Moment?<\/h2>\n <p class=\"form-subtitle\">Connect with us to stay updated on upcoming programs<\/p>\n <\/div>\n \n <div class=\"form-content\">\n <div id=\"success-message\" class=\"success-message\" style=\"display: none;\">\n Thanks for your interest in the Collective! We'll be in touch with more information.\n <\/div>\n \n <div id=\"error-banner\" class=\"error-banner\" style=\"display: none;\">\n Please fix the errors in the form and try again.\n <\/div>\n\n <form id=\"contact-form\">\n <div class=\"form-grid\">\n <div class=\"form-grid-2\">\n <div class=\"form-group\">\n <label for=\"firstName\" class=\"form-label\">First Name<\/label>\n <input\n type=\"text\"\n id=\"firstName\"\n name=\"firstName\"\n class=\"form-input\"\n placeholder=\"John\"\n required\n \/>\n <div class=\"error-message\" id=\"firstName-error\"><\/div>\n <\/div>\n \n <div class=\"form-group\">\n <label for=\"lastName\" class=\"form-label\">Last Name<\/label>\n <input\n type=\"text\"\n id=\"lastName\"\n name=\"lastName\"\n class=\"form-input\"\n placeholder=\"Doe\"\n required\n \/>\n <div class=\"error-message\" id=\"lastName-error\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"email\" class=\"form-label\">Email<\/label>\n <input\n type=\"email\"\n id=\"email\"\n name=\"email\"\n class=\"form-input\"\n placeholder=\"john@example.com\"\n required\n \/>\n <div class=\"error-message\" id=\"email-error\"><\/div>\n <\/div>\n\n <div class=\"form-grid-2\">\n <div class=\"form-group\">\n <label for=\"city\" class=\"form-label\">City<\/label>\n <input\n type=\"text\"\n id=\"city\"\n name=\"city\"\n class=\"form-input\"\n placeholder=\"New York\"\n required\n \/>\n <div class=\"error-message\" id=\"city-error\"><\/div>\n <\/div>\n \n <div class=\"form-group\">\n <label for=\"state\" class=\"form-label\">State<\/label>\n <select id=\"state\" name=\"state\" class=\"form-select\" required>\n <option value=\"\">Select state<\/option>\n <option value=\"AL\">AL<\/option>\n <option value=\"AK\">AK<\/option>\n <option value=\"AZ\">AZ<\/option>\n <option value=\"AR\">AR<\/option>\n <option value=\"CA\">CA<\/option>\n <option value=\"CO\">CO<\/option>\n <option value=\"CT\">CT<\/option>\n <option value=\"DE\">DE<\/option>\n <option value=\"FL\">FL<\/option>\n <option value=\"GA\">GA<\/option>\n <option value=\"HI\">HI<\/option>\n <option value=\"ID\">ID<\/option>\n <option value=\"IL\">IL<\/option>\n <option value=\"IN\">IN<\/option>\n <option value=\"IA\">IA<\/option>\n <option value=\"KS\">KS<\/option>\n <option value=\"KY\">KY<\/option>\n <option value=\"LA\">LA<\/option>\n <option value=\"ME\">ME<\/option>\n <option value=\"MD\">MD<\/option>\n <option value=\"MA\">MA<\/option>\n <option value=\"MI\">MI<\/option>\n <option value=\"MN\">MN<\/option>\n <option value=\"MS\">MS<\/option>\n <option value=\"MO\">MO<\/option>\n <option value=\"MT\">MT<\/option>\n <option value=\"NE\">NE<\/option>\n <option value=\"NV\">NV<\/option>\n <option value=\"NH\">NH<\/option>\n <option value=\"NJ\">NJ<\/option>\n <option value=\"NM\">NM<\/option>\n <option value=\"NY\">NY<\/option>\n <option value=\"NC\">NC<\/option>\n <option value=\"ND\">ND<\/option>\n <option value=\"OH\">OH<\/option>\n <option value=\"OK\">OK<\/option>\n <option value=\"OR\">OR<\/option>\n <option value=\"PA\">PA<\/option>\n <option value=\"RI\">RI<\/option>\n <option value=\"SC\">SC<\/option>\n <option value=\"SD\">SD<\/option>\n <option value=\"TN\">TN<\/option>\n <option value=\"TX\">TX<\/option>\n <option value=\"UT\">UT<\/option>\n <option value=\"VT\">VT<\/option>\n <option value=\"VA\">VA<\/option>\n <option value=\"WA\">WA<\/option>\n <option value=\"WV\">WV<\/option>\n <option value=\"WI\">WI<\/option>\n <option value=\"WY\">WY<\/option>\n <\/select>\n <div class=\"error-message\" id=\"state-error\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"interest\" class=\"form-label\">What are you interested in?<\/label>\n <select id=\"interest\" name=\"interest\" class=\"form-select\" required>\n <option value=\"\">Select your interest<\/option>\n <option value=\"Buying a Business\">Buying a Business<\/option>\n <option value=\"Offering Services\">Offering Services<\/option>\n <option value=\"Being a Program Partner\">Being a Program Partner<\/option>\n <\/select>\n <div class=\"error-message\" id=\"interest-error\"><\/div>\n <\/div>\n <\/div>\n\n <button \n type=\"submit\" \n id=\"submit-button\" \n class=\"form-submit\"\n >\n Express Interest\n <\/button>\n <\/form>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/div>\n\n <script src=\"https:\/\/cdn.gpteng.co\/gptengineer.js\" type=\"module\"><\/script>\n <script>\n \/\/ CONFIGURATION - Update these values with your Supabase project information\n const SUPABASE_URL = \"https:\/\/sesszvrmyztxliexbrxr.supabase.co\";\n const SUPABASE_ANON_KEY = \"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InNlc3N6dnJteXp0eGxpZXhicnhyIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NDg2NDAzMzQsImV4cCI6MjA2NDIxNjMzNH0.k9lzuYPBWXfPKPQXRFN-VAf3reY281d72N7zf3-EOec\";\n\n \/\/ Form handling\n document.addEventListener('DOMContentLoaded', function() {\n const form = document.getElementById('contact-form');\n const submitButton = document.getElementById('submit-button');\n const successMessage = document.getElementById('success-message');\n const errorBanner = document.getElementById('error-banner');\n \n \/\/ Field validation\n function validateField(field, value) {\n const fieldError = document.getElementById(`${field}-error`);\n const inputElement = document.getElementById(field);\n \n let errorMessage = '';\n \n switch (field) {\n case 'firstName':\n case 'lastName':\n case 'city':\n if (value.trim() === '') {\n errorMessage = 'This field is required';\n }\n break;\n case 'email':\n const emailRegex = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\n if (value.trim() === '') {\n errorMessage = 'Email is required';\n } else if (!emailRegex.test(value)) {\n errorMessage = 'Please enter a valid email address';\n }\n break;\n case 'state':\n case 'interest':\n if (value === '') {\n errorMessage = 'Please make a selection';\n }\n break;\n }\n \n if (errorMessage) {\n fieldError.textContent = errorMessage;\n inputElement.classList.add('error');\n return false;\n } else {\n fieldError.textContent = '';\n inputElement.classList.remove('error');\n return true;\n }\n }\n \n \/\/ Input event listeners for real-time validation\n const inputFields = ['firstName', 'lastName', 'email', 'city', 'state', 'interest'];\n \n inputFields.forEach(field => {\n const input = document.getElementById(field);\n input.addEventListener('blur', () => {\n validateField(field, input.value);\n });\n input.addEventListener('input', () => {\n const fieldError = document.getElementById(`${field}-error`);\n if (fieldError.textContent) {\n validateField(field, input.value);\n }\n });\n });\n \n \/\/ Form submission\n form.addEventListener('submit', async function(e) {\n e.preventDefault();\n \n \/\/ Hide any previous messages\n successMessage.style.display = 'none';\n errorBanner.style.display = 'none';\n \n \/\/ Validate all fields\n let isValid = true;\n inputFields.forEach(field => {\n const input = document.getElementById(field);\n if (!validateField(field, input.value)) {\n isValid = false;\n }\n });\n \n if (!isValid) {\n errorBanner.textContent = 'Please fix the errors in the form';\n errorBanner.style.display = 'block';\n return;\n }\n \n \/\/ Prepare form data\n const formData = {\n first_name: document.getElementById('firstName').value,\n last_name: document.getElementById('lastName').value,\n email: document.getElementById('email').value,\n city: document.getElementById('city').value,\n state: document.getElementById('state').value,\n interest: document.getElementById('interest').value\n};\n \/\/ Show loading state\n submitButton.disabled = true;\n let loadingSpinner = document.createElement('span');\n loadingSpinner.className = 'loading-spinner';\n submitButton.prepend(loadingSpinner);\n submitButton.textContent = 'Submitting...';\n submitButton.prepend(loadingSpinner);\n \n try {\n \/\/ Send data to Supabase\n const response = await fetch(`${SUPABASE_URL}\/rest\/v1\/contact_submissions`, {\n method: 'POST',\n headers: {\n 'Content-Type': 'application\/json',\n 'apikey': SUPABASE_ANON_KEY,\n 'Prefer': 'return=minimal'\n },\n body: JSON.stringify(formData)\n });\n \n if (!response.ok) {\n throw new Error('Submission failed');\n }\n \n \/\/ Show success message\n form.reset();\n successMessage.style.display = 'block';\n \n \/\/ Scroll to success message\n successMessage.scrollIntoView({ behavior: 'smooth', block: 'center' });\n \n } catch (error) {\n console.error('Error submitting form:', error);\n errorBanner.textContent = 'Submission failed. Please try again later or contact us directly.';\n errorBanner.style.display = 'block';\n } finally {\n \/\/ Reset button\n submitButton.disabled = false;\n submitButton.innerHTML = 'Express Interest';\n }\n });\n });\n\n \/\/ Smooth scroll to form\n function scrollToForm() {\n document.getElementById('partner-form').scrollIntoView({ behavior: 'smooth' });\n }\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Caerus Collective – Landing Page YOUR JOURNEY TO OWNERSHIP BEGINS HERE Ready To Chart A New Path? Propelling Transformative Action. The traditional pathways of how we think about work, ownership, and opportunity are being reshaped in real time. Your experience isn’t just a bullet point, it’s the ink to pen your next chapter. Partner With […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_eb_attr":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-225","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/caeruscollective.org\/index.php?rest_route=\/wp\/v2\/pages\/225","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/caeruscollective.org\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/caeruscollective.org\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/caeruscollective.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/caeruscollective.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=225"}],"version-history":[{"count":6,"href":"https:\/\/caeruscollective.org\/index.php?rest_route=\/wp\/v2\/pages\/225\/revisions"}],"predecessor-version":[{"id":451,"href":"https:\/\/caeruscollective.org\/index.php?rest_route=\/wp\/v2\/pages\/225\/revisions\/451"}],"wp:attachment":[{"href":"https:\/\/caeruscollective.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=225"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}