.elementor-1852 .elementor-element.elementor-element-b457e77{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1852 .elementor-element.elementor-element-66340e2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for container, class: .elementor-element-66340e2 */<!-- Elementor‑friendly: no external CSS frameworks; all styles are self‑contained.
<option>Weekly</option>
<option>Bi‑weekly</option>
<option>Monthly</option>
</select>
</label>
<label class="field"><span class="muted" style="font-size:14px">Time zone</span>
<input required name="tz" class="input" placeholder="America/New_York" />
</label>
</div>
<button class="btn green" style="margin-top:12px">Submit as Mentee</button>
<p id="menteeThanks" class="muted" style="display:none;margin-top:8px;color:#86efac">Thanks! We’ll email you your next steps.</p>
</form>
</div>
</div>
</section>


<!-- FAQ -->
<section id="faq" class="section" style="background:rgba(2,6,23,.25)">
<div class="container">
<h2 class="h2" style="text-align:center">Frequently asked questions</h2>
<div class="grid" style="grid-template-columns:1fr 1fr;margin-top:18px">
<details class="glass" style="padding:16px;border-radius:16px"><summary class="h3" style="cursor:pointer">How does the matching work?</summary>
<p class="muted" style="margin-top:10px">We compute a compatibility score using weighted attributes (goals, skills, cadence, availability, timezone overlap) and provide a rationale for each suggested pairing.</p>
</details>
<details class="glass" style="padding:16px;border-radius:16px"><summary class="h3" style="cursor:pointer">Can mentors limit capacity?</summary>
<p class="muted" style="margin-top:10px">Yes. Mentors set a maximum number of concurrent mentees; the engine respects these constraints when building cohorts.</p>
</details>
<details class="glass" style="padding:16px;border-radius:16px"><summary class="h3" style="cursor:pointer">Do you support program‑wide analytics?</summary>
<p class="muted" style="margin-top:10px">Program dashboards track sign‑ups, match rates, satisfaction, session counts, and goal attainment over time.</p>
</details>
<details class="glass" style="padding:16px;border-radius:16px"><summary class="h3" style="cursor:pointer">Is there a free tier?</summary>
<p class="muted" style="margin-top:10px">Yes — small cohorts can launch for free. Larger programs can request custom pricing.</p>
</details>
</div>
</div>
</section>


<!-- Footer -->
<footer>
<div class="container" style="padding:26px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px">
<div class="muted" style="font-size:14px">© <span id="year"></span> MENTORGLO. All rights reserved.</div>
<div style="display:flex;gap:16px;font-size:14px">
<a class="muted" href="#forms">Contact</a>
<a class="muted" href="#">Terms</a>
<a class="muted" href="#">Privacy</a>
</div>
</div>
</footer>


<!-- Scripts: vanilla JS only (safe in Elementor HTML widget) -->
<script>
// Year
document.getElementById('year').textContent = new Date().getFullYear();


// Demo preview score
document.getElementById('previewForm')?.addEventListener('submit', function(e){
e.preventDefault();
var score = Math.floor(82 + Math.random()*17);
document.getElementById('fitScore').textContent = score+"%";
document.getElementById('fitCard').style.display = 'block';
});


// Simple thanks handlers (no backend wired)
function show(id){var el=document.getElementById(id); if(el){el.style.display='block';}}
document.getElementById('mentorForm')?.addEventListener('submit', function(e){e.preventDefault(); show('mentorThanks');});
document.getElementById('menteeForm')?.addEventListener('submit', function(e){e.preventDefault(); show('menteeThanks');});


// Fun stat tickers
function tick(elId,target,step,delay){var el=document.getElementById(elId); if(!el)return; var n=0; step=step||13; delay=delay||16; (function inc(){n+=step; if(n>=target){el.textContent=target.toLocaleString()} else {el.textContent=n.toLocaleString(); requestAnimationFrame(inc)}})()}
tick('statMatches',4820,23,16);
tick('statHours',12300,47,16);
</script>
</body>
</html>/* End custom CSS */