/* Home page hero, for the student who studies on their own time — after school, college or work, often late at night.
   Left: headline, the main actions, and what's free to read anytime (no login).
   Right: "Pick your exam" — CAT, IPMAT (with JIPMAT and IIM B (B.Sc.)), CUET (UG): who the exam is for and where to start.
   The choice is remembered (shared with the dashboard's Practice tab).
   Below: the three ways to prepare — learn free, practise like exam day, get a guide (classes & mentoring on
   learn.scorebuddy.in; hidden inside the Android app by components/sb-app.js, like every course link).
   A live All-India mock running now shows as a banner above the headline (GET /api/live). */
const HX_EXAMS=[
{key:'CAT',tab:'CAT',who:'MBA at the IIMs and top B-schools',
line:'One exam stands between you and an IIM call. Know every slot it has ever thrown — then beat it.',
links:[['🧪','Full mocks & sectionals','cat-mock-tests.html?view=mock','Real-interface mocks + live All-India mocks'],
['🎯','Topic-wise tests','cat-mock-tests.html?view=topic','Fix one weak area at a time'],
['📜','CAT papers 2017–2025','cat-previous-year-papers.html','Every slot, with year-wise analysis'],
['🧭','MBA Guide 2026','mba-guide-2026.html','Colleges, cut-offs and timelines']]},
{key:'IPMAT',tab:'IPMAT',who:'an IIM right after Class 12 — IPMAT Indore & Rohtak, JIPMAT and IIM B (B.Sc.)',
line:'Four exams, four styles. Practise each one on its own terms, so none of them surprises you.',
links:[['🧪','Full mocks & sectionals','ipmat-mock-tests.html?view=mock','IPMAT Indore & Rohtak, JIPMAT, IIM B (B.Sc.)'],
['🎯','Topic-wise tests','ipmat-mock-tests.html?view=topic','Quant, Verbal and LR topic by topic'],
['📜','IPMAT, JIPMAT & IIM B (B.Sc.) papers','UG-previous-year-papers.html','Every paper since 2019, timed like the real thing'],
['🧭','UG Management Guide 2027','ug-management-guide-2027.html','IPMAT, JIPMAT, NPAT, SET and more']]},
{key:'CUET',tab:'CUET (UG)',who:'undergraduate admission at DU, BHU, JNU and other central universities',
line:'Every subject you pick is its own race. Train for each one — English, GAT and your domain subjects.',
links:[['🧪','Full subject mocks','cuet.html?view=full','English, GAT and every domain subject'],
['🧩','Sectional & topic tests','cuet.html?view=sectional','One section or topic at a time'],
['📜','CUET papers since 2022','cuet-previous-year-papers.html','With answers and solutions'],
['🔍','Every question, solved','/cuet/pyq','Free step-by-step solutions']]}];
/* free to read anytime, no login */
const HX_FREE=[['🧠','Daily Challenge','challenge'],['📖','Daily Reads','daily-reads.html'],['🎭','RC Tone Guide','rc-tone-guide.html'],['✍️','Grammar Rule Book','grammar.html'],['⚖️','Word Pairs','almost-the-same-word.html'],['🧪','Lexicon','lexicon.html'],['🔍','PYQ solutions','pyq']];
const HX_CSS=`
.hx{position:relative;overflow:hidden;background:radial-gradient(900px 420px at 88% -10%,rgba(29,47,160,.10),transparent 60%),radial-gradient(700px 380px at -5% 110%,rgba(224,43,43,.08),transparent 60%)}
html.sb-dark .hx{background:radial-gradient(900px 420px at 88% -10%,rgba(85,112,255,.16),transparent 60%),radial-gradient(700px 380px at -5% 110%,rgba(224,43,43,.10),transparent 60%)}
.hx-in{max-width:1200px;margin:0 auto;padding:60px 40px 52px;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:28px 52px;align-items:center}
.hx-in>*{min-width:0}
.hx-live{display:inline-flex;align-items:center;gap:10px;max-width:100%;padding:7px 14px 7px 8px;border-radius:999px;background:var(--white);border:1.5px solid var(--brand-accent,#e02b2b);color:var(--text-heading);font:600 13px/1.3 var(--font-body);text-decoration:none;box-shadow:0 8px 20px rgba(224,43,43,.12)}
.hx-live b{display:inline-flex;align-items:center;gap:6px;background:var(--brand-accent,#e02b2b);color:#fff;border-radius:999px;padding:4px 10px;font-size:11px;letter-spacing:.08em;white-space:nowrap}
.hx-live b i{width:7px;height:7px;border-radius:50%;background:#fff;animation:hxPulse 1.2s infinite}.hx-live span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@keyframes hxPulse{50%{opacity:.25}}@media(prefers-reduced-motion:reduce){.hx-live b i{animation:none}}
.hx-eyebrow{display:inline-flex;flex-wrap:wrap;gap:6px;font:800 11.5px/1 var(--font-body);letter-spacing:.04em;color:var(--navy-700,#1d2fa0)}
.hx-eyebrow span{background:var(--navy-100,#e5e9fb);border-radius:999px;padding:7px 12px}
html.sb-dark .hx-eyebrow{color:#c7d0ff}
.hx h1{font:800 50px/1.08 var(--font-display);letter-spacing:-.02em;color:var(--text-heading);margin:20px 0 18px}
.hx h1 em{font-style:normal;color:var(--brand-accent,#e02b2b)}
.hx h1{margin-bottom:12px}
.hx-sub{font:600 19px/1.4 var(--font-display);color:var(--text-body);margin:0 0 22px;padding-left:14px;border-left:4px solid var(--brand-accent,#e02b2b)}.hx-sub b{color:var(--text-heading);font-weight:800}
.hx-points{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:11px;max-width:580px}
.hx-points li{display:flex;gap:12px;align-items:flex-start;font:400 16px/1.5 var(--font-body);color:var(--text-body)}
.hx-points i{flex:none;width:32px;height:32px;border-radius:10px;background:var(--navy-100,#e5e9fb);display:grid;place-items:center;font-style:normal;font-size:16px;margin-top:-3px}
.hx-points b{color:var(--text-heading);font-weight:700}
.hx-acts{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.hx-btn{display:inline-flex;align-items:center;gap:8px;padding:15px 26px;border-radius:999px;font:700 15.5px/1 var(--font-body);text-decoration:none;transition:transform .12s,background .15s,border-color .15s,color .15s}
.hx-btn:active{transform:scale(.97)}
.hx-btn.p{background:#1d2fa0;color:#fff;box-shadow:0 12px 26px rgba(29,47,160,.30)}.hx-btn.p:hover{background:#141f6e;color:#fff}
html.sb-dark .hx-btn.p{background:#5570ff}html.sb-dark .hx-btn.p:hover{background:#4058e0}
.hx-btn.s{border:1.5px solid var(--border-strong,#c9cee0);color:var(--text-heading);background:var(--white)}.hx-btn.s:hover{border-color:var(--brand-primary,#1d2fa0);color:var(--brand-primary,#1d2fa0)}
.hx-note{font:500 13px/1.5 var(--font-body);color:var(--text-muted);margin:14px 0 0}
.hx-free{margin:26px 0 0}.hx-free p{font:800 11.5px/1 var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);margin:0 0 10px}
.hx-free div{display:flex;flex-wrap:wrap;gap:8px}
.hx-free a{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:999px;border:1px solid var(--border-default);background:var(--white);color:var(--text-heading);font:600 13px/1 var(--font-body);text-decoration:none;transition:border-color .15s,color .15s}
.hx-free a:hover{border-color:var(--brand-primary,#1d2fa0);color:var(--brand-primary,#1d2fa0)}
.hx-card{background:var(--white);border:1px solid var(--border-default);border-radius:24px;box-shadow:0 26px 60px rgba(11,16,51,.14);padding:24px}
.hx-card h2{font:800 12px/1 var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin:0 0 12px}
.hx-tabs{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--gray-100);margin:0 0 18px}
.hx-tabs button{flex:1;border:none;background:none;border-radius:999px;padding:10px 8px;font:700 13.5px/1.1 var(--font-body);color:var(--text-body);cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.hx-tabs button[aria-selected="true"]{background:var(--white);color:var(--brand-primary,#1d2fa0);box-shadow:0 2px 8px rgba(11,16,51,.12)}
.hx-who{font:700 15px/1.45 var(--font-body);color:var(--text-heading);margin:0 0 6px}
.hx-line{font:400 14px/1.55 var(--font-body);color:var(--text-body);margin:0 0 16px}
.hx-links{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.hx-links a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:14px;border:1px solid var(--border-default);text-decoration:none;color:var(--text-heading);transition:border-color .15s,background .15s,transform .12s}
.hx-links a:hover{border-color:var(--brand-primary,#1d2fa0);background:var(--navy-50,#f3f5fe);transform:translateX(2px)}
.hx-links i{flex:none;width:38px;height:38px;border-radius:12px;background:var(--navy-100,#e5e9fb);display:grid;place-items:center;font-style:normal;font-size:18px}
.hx-links b{display:block;font:700 14px/1.3 var(--font-body)}.hx-links small{display:block;font:400 12.5px/1.4 var(--font-body);color:var(--text-muted);margin-top:2px}
.hx-links em{margin-left:auto;font-style:normal;color:var(--text-muted);font-weight:700}
.hx-foot{font:500 12.5px/1.5 var(--font-body);color:var(--text-muted);margin:14px 2px 0}
.hx-ways{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:12px 0 0;padding:0;list-style:none}
.hx-ways li{display:flex}
.hx-ways a{flex:1;display:flex;gap:14px;align-items:flex-start;background:var(--white);border:1px solid var(--border-default);border-radius:18px;padding:18px;text-decoration:none;color:var(--text-heading);transition:border-color .15s,transform .12s}
.hx-ways a:hover{border-color:var(--brand-primary,#1d2fa0);transform:translateY(-2px)}
.hx-ways i{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-style:normal;font-size:21px;background:var(--navy-100,#e5e9fb)}
.hx-ways b{display:block;font:800 15.5px/1.3 var(--font-display)}.hx-ways span span{display:block;font:400 13.5px/1.5 var(--font-body);color:var(--text-body);margin-top:4px}
.hx-ways small{display:inline-block;margin-top:8px;font:700 12.5px/1 var(--font-body);color:var(--brand-primary,#1d2fa0)}
html.sb-dark .hx-ways small{color:#9fb0ff}
@media(max-width:1040px){.hx-in{grid-template-columns:minmax(0,1fr);gap:32px;padding:44px 28px}.hx h1{font-size:42px}.hx-ways{grid-template-columns:1fr;margin:0}}
@media(max-width:560px){.hx-in{padding:30px 16px 34px}.hx h1{font-size:34px}.hx h1 em{white-space:normal}.hx-points li{font-size:15px}.hx-sub{font-size:16.5px}.hx-btn{flex:1 1 100%;justify-content:center;padding:15px 18px}
.hx-card{padding:18px;border-radius:20px}.hx-tabs button{font-size:12.5px;padding:9px 4px}.hx-ways a{padding:15px}}`;
function Hero(){
const me=window.SBAuth&&window.SBAuth.currentUser();
const [,setTick]=React.useState(0);
React.useEffect(()=>{const f=()=>setTick(t=>t+1);window.addEventListener('sbauth:change',f);return()=>window.removeEventListener('sbauth:change',f);},[]);
const [exam,setExamS]=React.useState(()=>{try{const v=localStorage.getItem('sb_practice_course');return HX_EXAMS.some(x=>x.key===v)?v:'CAT';}catch(e){return 'CAT';}});
const setExam=v=>{setExamS(v);try{localStorage.setItem('sb_practice_course',v);}catch(e){}};
const [live,setLive]=React.useState(null);
React.useEffect(()=>{let on=true;fetch('/api/live',{credentials:'same-origin'}).then(r=>r.ok?r.json():null).then(l=>{if(on&&l&&l.now&&l.now.length)setLive(l.now[0]);}).catch(()=>{});return()=>{on=false;};},[]);
const trial=(window.SBAuth&&window.SBAuth.settings&&window.SBAuth.settings()||{}).trialDays||7;
const app=!!window.SB_APP;
const E=HX_EXAMS.find(x=>x.key===exam)||HX_EXAMS[0];
const tabKey=ev=>{const i=HX_EXAMS.findIndex(x=>x.key===exam);if(ev.key==='ArrowRight'||ev.key==='ArrowLeft'){ev.preventDefault();const n=HX_EXAMS[(i+(ev.key==='ArrowRight'?1:HX_EXAMS.length-1))%HX_EXAMS.length];setExam(n.key);const b=document.getElementById('hx-tab-'+n.key);if(b)b.focus();}};
return (<section className="hx" aria-labelledby="hx-h">
<style>{HX_CSS}</style>
<div className="hx-in">
<div>
{live?<a className="hx-live" href={'live/'+encodeURIComponent(live.slug)}><b><i/>LIVE NOW</b><span>{live.title} — take it with all of India →</span></a>
:<div className="hx-eyebrow"><span>CAT</span><span>IPMAT</span><span>JIPMAT</span><span>IIM B (B.Sc.)</span><span>CUET (UG)</span></div>}
<h1 id="hx-h">CAT, IPMAT or CUET? <em style={{whiteSpace:"nowrap"}}>Get a Scorebuddy.</em></h1>
<p className="hx-sub">Exams are tough. <b>Your Scorebuddy is tougher.</b></p>
<ul className="hx-points">
<li><i aria-hidden="true">🎓</i><span><b>Every management entrance, one home.</b> IPMAT, JIPMAT, IIM B (B.Sc.) and CUET after Class 12 — CAT for your MBA.</span></li>
<li><i aria-hidden="true">🌙</i><span><b>2 a.m. or 2 p.m. — we’re open.</b> Study after school, college or work, at your own pace.</span></li>
<li><i aria-hidden="true">📖</i><span><b>A fresh RC passage every day,</b> and every past paper solved — free to read.</span></li>
<li><i aria-hidden="true">🎯</i><span><b>Real papers on the real exam screen</b> — then find the topic stealing your marks.</span></li>
{app?null:<li><i aria-hidden="true">🧑‍🏫</i><span><b>Stuck? You’re not alone.</b> Live classes and 1-on-1 mentors, one click away.</span></li>}
</ul>
<div className="hx-acts">
{me?<a className="hx-btn p" href={me.isAdmin?'admin.html':'dashboard.html'}>Continue where you left off →</a>
:<a className="hx-btn p" href="login.html?next=dashboard.html">Start practising free →</a>}
<a className="hx-btn s" href="#study-modules">Explore free resources</a>
</div>
{me?null:<p className="hx-note">{app?'Log in with a one-time code — no password to remember.':trial+' days of full access to every test, free. No card needed.'}</p>}
<div className="hx-free"><p>Free to read · no login · 24×7</p>
<div>{HX_FREE.map(([ic,t,href])=><a key={href} href={href}><span aria-hidden="true">{ic}</span>{t}</a>)}</div></div>
</div>
<div className="hx-card">
<h2 id="hx-pick">Pick your exam</h2>
<div className="hx-tabs" role="tablist" aria-labelledby="hx-pick">
{HX_EXAMS.map(x=><button key={x.key} id={'hx-tab-'+x.key} type="button" role="tab" aria-selected={x.key===exam} aria-controls="hx-panel" tabIndex={x.key===exam?0:-1} onClick={()=>setExam(x.key)} onKeyDown={tabKey}>{x.tab}</button>)}
</div>
<div id="hx-panel" role="tabpanel" aria-labelledby={'hx-tab-'+E.key}>
<p className="hx-who">For {E.who}</p>
<p className="hx-line">{E.line}</p>
<ul className="hx-links">
{E.links.map(([ic,t,href,d])=><li key={href}><a href={href}><i aria-hidden="true">{ic}</i><span><b>{t}</b><small>{d}</small></span><em aria-hidden="true">→</em></a></li>)}
</ul>
<p className="hx-foot">Every attempt ends with your score, percentile and a question-by-question analysis.</p>
</div>
</div>
<ul className="hx-ways" aria-label="Three ways to prepare">
<li><a href="#study-modules"><i aria-hidden="true">🌙</i><span><b>Learn free, anytime</b><span>Daily RC reads, grammar rules, tone and vocabulary guides, and a solution for every PYQ — open day and night.</span><small>Explore free resources →</small></span></a></li>
<li><a href={me?'dashboard.html#practice':'login.html?next=dashboard.html'}><i aria-hidden="true">🎯</i><span><b>Practise like exam day</b><span>Real PYQs, full mocks, sectional and topic tests, and All-India live mocks — with your score, percentile and what to fix next.</span><small>{me||app?'Open my practice →':'Free for '+trial+' days →'}</small></span></a></li>
{app?null:<li><a href="https://learn.scorebuddy.in/courses" target="_blank" rel="noopener"><i aria-hidden="true">🧑‍🏫</i><span><b>Get a guide when you need one</b><span>Recorded and live classes, a personal study plan and 1-on-1 mentoring for CAT and IPMAT — at your pace, on your schedule.</span><small>Classes &amp; mentoring ↗</small></span></a></li>}
</ul>
</div>
</section>);
}
window.Hero=Hero;
