{"id":7,"date":"2026-05-22T11:13:20","date_gmt":"2026-05-22T11:13:20","guid":{"rendered":"https:\/\/stemlearn.ai\/aiolympiad\/?page_id=7"},"modified":"2026-05-23T06:00:33","modified_gmt":"2026-05-23T06:00:33","slug":"register-student","status":"publish","type":"page","link":"https:\/\/stemlearn.ai\/aiolympiad\/register-student\/","title":{"rendered":"Register Student"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"7\" class=\"elementor elementor-7\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d5a0bca e-con-full e-flex e-con e-parent\" data-id=\"d5a0bca\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-638ebc0 elementor-widget elementor-widget-html\" data-id=\"638ebc0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================\nCOMPACT PREMIUM REGISTER HERO\nFULL RESPONSIVE VERSION\n========================= -->\n\n<!-- GOOGLE FONTS -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Mulish:wght@500;600;700;800&family=Nunito+Sans:wght@700;800;900&display=swap\" rel=\"stylesheet\">\n\n<style>\n\n*{\n  margin:0;\n  padding:0;\n  box-sizing:border-box;\n}\n\n.register-hero{\n\n  position:relative;\n\n  overflow:hidden;\n\n  width:100%;\n\n  background:\n  linear-gradient(\n    135deg,\n    #09135b 0%,\n    #24339a 100%\n  );\n\n}\n\n\/* PREMIUM GLOW *\/\n\n.register-hero::before{\n\n  content:\"\";\n\n  position:absolute;\n\n  top:-180px;\n  right:-120px;\n\n  width:420px;\n  height:420px;\n\n  background:\n  radial-gradient(circle,\n  rgba(83,255,241,.14),\n  transparent 72%);\n\n  pointer-events:none;\n\n}\n\n\/* CONTAINER *\/\n\n.register-container{\n\n  max-width:1180px;\n\n  margin:auto;\n\n  padding:\n  82px 24px 46px;\n\n  position:relative;\n  z-index:2;\n}\n\n\/* BACK BUTTON *\/\n\n.register-back{\n\n  display:inline-flex;\n  align-items:center;\n  gap:7px;\n\n  text-decoration:none !important;\n\n  color:#5ce0db;\n\n  font-family:'Mulish',sans-serif;\n  font-size:13px;\n  font-weight:700;\n\n  transition:.25s ease;\n}\n\n.register-back:hover{\n\n  color:#ffffff;\n\n  transform:translateX(-2px);\n\n  text-decoration:none !important;\n}\n\n.register-back svg{\n\n  width:14px;\n  height:14px;\n\n  flex-shrink:0;\n}\n\n\/* TITLE *\/\n\n.register-title{\n\n  margin-top:16px;\n\n  font-family:'Nunito Sans',sans-serif;\n\n  font-size:54px;\n  line-height:1;\n\n  font-weight:900;\n\n  letter-spacing:-2px;\n\n  color:#ffffff;\n}\n\n\/* SUBTEXT *\/\n\n.register-subtitle{\n\n  margin-top:12px;\n\n  font-family:'Mulish',sans-serif;\n\n  font-size:17px;\n  line-height:1.7;\n\n  font-weight:700;\n\n  color:rgba(255,255,255,.72);\n}\n\n\/* LARGE DESKTOP *\/\n\n@media(max-width:1200px){\n\n  .register-container{\n    max-width:1000px;\n  }\n\n}\n\n\/* TABLET *\/\n\n@media(max-width:991px){\n\n  .register-container{\n\n    padding:\n    76px 22px 40px;\n  }\n\n  .register-title{\n\n    font-size:44px;\n\n    letter-spacing:-1.5px;\n  }\n\n  .register-subtitle{\n\n    font-size:15px;\n  }\n\n}\n\n\/* MOBILE *\/\n\n@media(max-width:767px){\n\n  .register-container{\n\n    padding:\n    68px 18px 34px;\n  }\n\n  .register-back{\n\n    font-size:12px;\n\n    gap:6px;\n  }\n\n  .register-back svg{\n\n    width:13px;\n    height:13px;\n  }\n\n  .register-title{\n\n    margin-top:14px;\n\n    font-size:34px;\n\n    line-height:1.08;\n\n    letter-spacing:-1px;\n  }\n\n  .register-subtitle{\n\n    margin-top:10px;\n\n    font-size:13px;\n\n    line-height:1.7;\n  }\n\n}\n\n\/* SMALL MOBILE *\/\n\n@media(max-width:480px){\n\n  .register-container{\n\n    padding:\n    64px 16px 30px;\n  }\n\n  .register-title{\n\n    font-size:30px;\n  }\n\n  .register-subtitle{\n\n    font-size:12.5px;\n  }\n\n}\n\n<\/style>\n\n<section class=\"register-hero\">\n\n  <div class=\"register-container\">\n\n    <!-- BACK -->\n\n    <a href=\"https:\/\/stemlearn.ai\/aiolympiad\/\" class=\"register-back\">\n\n      <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      stroke-width=\"2\"\n      stroke=\"currentColor\">\n\n        <path stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        d=\"M15.75 19.5 8.25 12l7.5-7.5\"\/>\n\n      <\/svg>\n\n      Back to home\n\n    <\/a>\n\n    <!-- TITLE -->\n\n    <h1 class=\"register-title\">\n      Student Registration\n    <\/h1>\n\n    <!-- SUBTEXT -->\n\n    <div class=\"register-subtitle\">\n      All-inclusive \u20b9250 \u00b7 Books \u00b7 LMS \u00b7 Exam \u00b7 Certificate\n    <\/div>\n\n  <\/div>\n\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-365bfc8 e-con-full e-flex e-con e-parent\" data-id=\"365bfc8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8c764ae elementor-widget elementor-widget-html\" data-id=\"8c764ae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n    \n    \/* =========================================================\nPREMIUM AI OLYMPIAD FORM\nFINAL PERFECT FIXED CSS\n========================================================= *\/\n\n*{\n  margin:0;\n  padding:0;\n  box-sizing:border-box;\n}\n\n.ai-registration{\n\n  --navy:#20286D;\n  --teal:#18B7B4;\n  --teal2:#5FD4D6;\n  --bg:#F5F7FC;\n  --card:#FFFFFF;\n  --field:#F8FAFE;\n  --border:#DCE3EF;\n  --text:#687089;\n\n  width:100%;\n  background:var(--bg);\n\n  padding:48px 18px;\n\n  overflow:hidden;\n\n  font-family:'Mulish',sans-serif;\n}\n\n\/* =========================================================\nCONTAINER\n========================================================= *\/\n\n.ai-registration-container{\n\n  max-width:930px;\n\n  margin:auto;\n\n  overflow:hidden;\n\n  position:relative;\n}\n\n\/* =========================================================\nSTEPS\n========================================================= *\/\n\n.ai-steps{\n\n  display:grid;\n\n  grid-template-columns:\n  1fr 1fr 1fr;\n\n  gap:14px;\n\n  width:100%;\n\n  margin-bottom:28px;\n}\n\n.ai-step{\n\n  flex:1;\n\n  display:flex;\n  align-items:center;\n\n  gap:10px;\n\n  min-width:0;\n}\n\n.ai-step:last-child{\n  flex:0;\n}\n\n.ai-step-circle{\n\n  width:38px;\n  height:38px;\n\n  min-width:38px;\n\n  border-radius:50%;\n\n  border:2px solid #D8DFEC;\n\n  background:#fff;\n\n  display:flex;\n  align-items:center;\n  justify-content:center;\n\n  font-size:15px;\n  font-weight:900;\n\n  color:#7B8398;\n\n  font-family:'Nunito Sans',sans-serif;\n\n  transition:.3s ease;\n}\n\n.ai-step.active .ai-step-circle{\n\n  background:\n  linear-gradient(\n    135deg,\n    #18B7B4,\n    #5FD4D6\n  );\n\n  border:none;\n\n  color:#fff;\n\n  box-shadow:\n  0 10px 20px rgba(24,183,180,.18);\n}\n\n.ai-step-title{\n\n  font-size:13px;\n\n  font-weight:800;\n\n  color:#747C90;\n\n  white-space:nowrap;\n\n  font-family:'Nunito Sans',sans-serif;\n}\n\n.ai-step.active .ai-step-title{\n  color:#159E9C;\n}\n\n.ai-step-line{\n\n  flex:1;\n\n  height:2px;\n\n  background:#DDE4EF;\n\n  border-radius:20px;\n}\n\n.ai-step.active .ai-step-line{\n\n  background:\n  linear-gradient(\n    90deg,\n    #18B7B4,\n    #5FD4D6\n  );\n}\n\n\/* =========================================================\nFORM CARD\n========================================================= *\/\n\n.ai-form-card{\n\n  width:100%;\n\n  background:#fff;\n\n  border:1px solid #E2E8F2;\n\n  border-radius:30px;\n\n  padding:38px;\n\n  overflow:hidden;\n\n  position:relative;\n\n  box-shadow:\n  0 10px 28px rgba(16,24,40,.03);\n}\n\n\/* =========================================================\nSLIDER WRAPPER\n========================================================= *\/\n\n.ai-slider-wrapper{\n\n  width:100%;\n\n  overflow:hidden;\n\n  position:relative;\n}\n\n\/* =========================================================\nSLIDER FIX\n========================================================= *\/\n\n.ai-slider{\n\n  display:flex;\n\n  width:300%;\n\n  transition:transform .45s ease;\n\n  will-change:transform;\n}\n\n\/* =========================================================\nSTEP PANEL\n========================================================= *\/\n\n.ai-step-panel{\n\n  width:33.3333%;\n\n  min-width:33.3333%;\n\n  max-width:33.3333%;\n\n  flex:0 0 33.3333%;\n\n  overflow:hidden;\n\n  padding-right:0;\n}\n\n\/* =========================================================\nGRID\n========================================================= *\/\n\n.ai-form-grid{\n\n  display:grid;\n\n  grid-template-columns:\n  repeat(2,minmax(0,1fr));\n\n  gap:24px;\n\n  width:100%;\n}\n\n.ai-full{\n  grid-column:1\/-1;\n}\n\n\/* =========================================================\nLABEL\n========================================================= *\/\n\n.ai-label{\n\n  display:block;\n\n  margin-bottom:8px;\n\n  font-size:11px;\n\n  font-weight:900;\n\n  letter-spacing:.4px;\n\n  text-transform:uppercase;\n\n  color:var(--navy);\n\n  font-family:'Nunito Sans',sans-serif;\n}\n\n.ai-label span{\n  color:#FF5C72;\n}\n\n\/* =========================================================\nFIELDS\n========================================================= *\/\n\n.ai-input,\n.ai-select{\n\n  width:100%;\n\n  min-width:0;\n  border-radius:5px;\n\n  border:1.5px solid var(--border);\n\n \n\n  padding:0 18px;\n\n  outline:none;\n\n  font-size:15px;\n\n  font-weight:700;\n\n  color:var(--navy);\n\n  font-family:'Mulish',sans-serif;\n\n  transition:.25s ease;\n\n  appearance:none;\n  -webkit-appearance:none;\n}\n\n.ai-input::placeholder{\n  color:#98A0B8;\n}\n\n\/* =========================================================\nSELECT FIX\n========================================================= *\/\n\n.ai-select{\n\n  padding-right:48px;\n\n  background-image:url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2320286D' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'\/%3E%3C\/svg%3E\");\n\n  background-repeat:no-repeat;\n\n  background-position:right 16px center;\n\n  background-size:15px;\n}\n\n\/* =========================================================\nGRADE FIELD FIX\n========================================================= *\/\n\n#studentGrade{\n  width:100%;\n  height:42px;\n}\n\n\/* =========================================================\nFOCUS\n========================================================= *\/\n\n.ai-input:focus,\n.ai-select:focus{\n\n  border-color:#18B7B4;\n\n  background:#fff;\n\n  box-shadow:\n  0 0 0 4px rgba(24,183,180,.08);\n}\n\n\/* =========================================================\nERROR\n========================================================= *\/\n\n.ai-error{\n  border-color:#FF5C72 !important;\n}\n\n\/* =========================================================\nBUTTONS\n========================================================= *\/\n\n.ai-btn-row{\n\n  display:flex;\n  justify-content:space-between;\n  align-items:center;\n\n  gap:14px;\n\n  margin-top:34px;\n\n  width:100%;\n}\n\n.ai-btn{\n\n  border:none;\n\n  display:inline-flex;\n  align-items:center;\n  justify-content:center;\n\n  height:54px;\n\n  min-width:190px;\n\n  padding:0 28px;\n\n  border-radius:16px;\n\n  background:\n  linear-gradient(\n    135deg,\n    #18B7B4,\n    #5FD4D6\n  );\n\n  color:#fff;\n\n  font-size:17px;\n\n  font-weight:900;\n\n  font-family:'Nunito Sans',sans-serif;\n\n  cursor:pointer;\n\n  white-space:nowrap;\n\n  transition:.25s ease;\n\n  box-shadow:\n  0 14px 28px rgba(24,183,180,.14);\n}\n\n.ai-btn:hover{\n  transform:translateY(-2px);\n}\n\n.ai-btn-outline{\n\n  background:#fff !important;\n\n  color:#20286D !important;\n\n  border:1.5px solid #DCE3EF !important;\n\n  box-shadow:none !important;\n}\n\n\/* =========================================================\nSUMMARY\n========================================================= *\/\n\n.ai-summary{\n\n  width:100%;\n\n  background:#F7F9FD;\n\n  border:1px solid #E4EAF3;\n\n  border-radius:22px;\n\n  padding:24px;\n}\n\n.ai-summary-grid{\n\n  display:grid;\n\n  grid-template-columns:1fr 1fr;\n\n  gap:20px 40px;\n}\n\n.ai-summary-title{\n\n  font-size:12px;\n\n  font-weight:900;\n\n  color:#757E94;\n\n  letter-spacing:.5px;\n\n  text-transform:uppercase;\n\n  margin-bottom:24px;\n}\n\n.ai-summary-label{\n\n  font-size:12px;\n  color:#7B8397;\n}\n\n.ai-summary-value{\n\n  font-size:16px;\n\n  font-weight:900;\n\n  color:#20286D;\n\n  margin-top:3px;\n}\n\n\/* =========================================================\nPAY CARD\n========================================================= *\/\n\n.ai-pay-card{\n\n  width:100%;\n\n  margin-top:22px;\n\n  background:\n  linear-gradient(\n    135deg,\n    #171B68,\n    #3343B1\n  );\n\n  border-radius:24px;\n\n  padding:28px;\n\n  display:flex;\n  justify-content:space-between;\n  align-items:center;\n}\n\n.ai-pay-small{\n\n  color:#63DFDC;\n\n  font-size:12px;\n\n  font-weight:900;\n\n  text-transform:uppercase;\n}\n\n.ai-pay-amount{\n\n  font-size:58px;\n\n  line-height:1;\n\n  font-weight:900;\n\n  color:#fff;\n\n  margin-top:8px;\n}\n\n.ai-pay-note{\n\n  color:rgba(255,255,255,.7);\n\n  margin-top:8px;\n\n  font-size:14px;\n}\n\n\/* =========================================================\nCHECKBOX\n========================================================= *\/\n\n.ai-check{\n\n  margin-top:22px;\n\n  display:flex;\n  align-items:flex-start;\n\n  gap:10px;\n}\n\n.ai-check input{\n\n  width:16px;\n  height:16px;\n\n  accent-color:#18B7B4;\n\n  margin-top:2px;\n}\n\n.ai-check label{\n\n  font-size:14px;\n\n  line-height:1.6;\n\n  color:#737B91;\n}\n\n\/* =========================================================\nPREVENT OVERFLOW\n========================================================= *\/\n\n.ai-step-panel *{\n  max-width:100%;\n}\n\n\/* =========================================================\nRESPONSIVE\n========================================================= *\/\n\n@media(max-width:767px){\n\n  .ai-registration{\n    padding:28px 14px;\n  }\n\n  .ai-step-title{\n    display:none;\n  }\n\n  .ai-form-card{\n\n    padding:22px 16px;\n\n    border-radius:22px;\n  }\n\n  .ai-form-grid{\n\n    grid-template-columns:1fr;\n\n    gap:18px;\n  }\n\n  .ai-summary-grid{\n    grid-template-columns:1fr;\n  }\n\n  .ai-btn-row{\n    flex-direction:column;\n  }\n\n  .ai-btn{\n\n    width:100%;\n    min-width:100%;\n  }\n\n  .ai-pay-card{\n\n    flex-direction:column;\n    align-items:flex-start;\n\n    gap:20px;\n  }\n\n}\n<\/style>\n<!-- Based on uploaded original code -->\n<!-- :contentReference[oaicite:0]{index=0} -->\n\n<div class=\"ai-registration\">\n\n  <div class=\"ai-registration-container\">\n\n    <!-- ================================================= -->\n    <!-- STEPS -->\n    <!-- ================================================= -->\n\n    <div class=\"ai-steps\">\n\n      <!-- STEP 1 -->\n\n      <div class=\"ai-step active\" id=\"step1nav\">\n\n        <div class=\"ai-step-circle\">1<\/div>\n\n        <div class=\"ai-step-title\">\n          Personal Details\n        <\/div>\n\n        <div class=\"ai-step-line\"><\/div>\n\n      <\/div>\n\n      <!-- STEP 2 -->\n\n      <div class=\"ai-step\" id=\"step2nav\">\n\n        <div class=\"ai-step-circle\">2<\/div>\n\n        <div class=\"ai-step-title\">\n          Exam Preferences\n        <\/div>\n\n        <div class=\"ai-step-line\"><\/div>\n\n      <\/div>\n\n      <!-- STEP 3 -->\n\n    <div class=\"ai-step ai-last-step\" id=\"step3nav\">\n\n  <div class=\"ai-step-circle\">3<\/div>\n\n  <div class=\"ai-step-title\">\n    Review &amp; Pay\n  <\/div>\n\n<\/div>\n\n    <\/div>\n\n    <!-- ================================================= -->\n    <!-- FORM CARD -->\n    <!-- ================================================= -->\n\n    <div class=\"ai-form-card\">\n\n      <!-- IMPORTANT WRAPPER -->\n\n      <div class=\"ai-slider-wrapper\">\n\n        <!-- ================================================= -->\n        <!-- SLIDER -->\n        <!-- ================================================= -->\n\n        <div class=\"ai-slider\" id=\"aiSlider\">\n\n          <!-- ================================================= -->\n          <!-- STEP 1 -->\n          <!-- ================================================= -->\n\n          <div class=\"ai-step-panel\">\n\n            <div class=\"ai-form-grid\">\n\n              <!-- NAME -->\n\n              <div>\n\n                <label class=\"ai-label\">\n                  Student Full Name <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"text\"\n                id=\"studentName\"\n                class=\"ai-input step1-required\"\n                placeholder=\"As on school ID\">\n\n              <\/div>\n\n              <!-- GRADE -->\n\n              <div>\n\n                <label class=\"ai-label\">\n                  Grade <span>*<\/span>\n                <\/label>\n\n                <select\n                id=\"studentGrade\"\n                class=\"ai-select step1-required\">\n\n                  <option value=\"\">\n                    Select grade\n                  <\/option>\n\n                  <option>Grade 3<\/option>\n                  <option>Grade 4<\/option>\n                  <option>Grade 5<\/option>\n                  <option>Grade 6<\/option>\n                  <option>Grade 7<\/option>\n                  <option>Grade 8<\/option>\n                  <option>Grade 9<\/option>\n                  <option>Grade 10<\/option>\n\n                <\/select>\n\n              <\/div>\n\n              <!-- SCHOOL -->\n\n              <div class=\"ai-full\">\n\n                <label class=\"ai-label\">\n                  School Name <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"text\"\n                id=\"schoolName\"\n                class=\"ai-input step1-required\"\n                placeholder=\"Your current school\">\n\n              <\/div>\n\n              <!-- ADDRESS -->\n\n              <div class=\"ai-full\">\n\n                <label class=\"ai-label\">\n                  Address <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"text\"\n                id=\"address\"\n                class=\"ai-input step1-required\"\n                placeholder=\"Street address\">\n\n              <\/div>\n\n              <!-- CITY -->\n\n              <div>\n\n                <label class=\"ai-label\">\n                  City <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"text\"\n                id=\"city\"\n                class=\"ai-input step1-required\">\n\n              <\/div>\n\n              <!-- STATE -->\n\n              <div>\n\n                <label class=\"ai-label\">\n                  State <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"text\"\n                id=\"state\"\n                class=\"ai-input step1-required\">\n\n              <\/div>\n\n              <!-- PINCODE -->\n\n              <div>\n\n                <label class=\"ai-label\">\n                  Pincode <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"text\"\n                id=\"pincode\"\n                class=\"ai-input step1-required\"\n                placeholder=\"6 digits\">\n\n              <\/div>\n\n              <!-- PHONE -->\n\n              <div>\n\n                <label class=\"ai-label\">\n                  Parent Phone <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"text\"\n                id=\"phone\"\n                class=\"ai-input step1-required\"\n                placeholder=\"+91 98XXXXXXX\">\n\n              <\/div>\n\n              <!-- EMAIL -->\n\n              <div class=\"ai-full\">\n\n                <label class=\"ai-label\">\n                  Email ID <span>*<\/span>\n                <\/label>\n\n                <input\n                type=\"email\"\n                id=\"email\"\n                class=\"ai-input step1-required\"\n                placeholder=\"parent@email.com\">\n\n              <\/div>\n\n            <\/div>\n\n            <!-- BUTTON -->\n\n            <div class=\"ai-btn-row\">\n\n              <div><\/div>\n\n              <button\n              type=\"button\"\n              class=\"ai-btn\"\n              onclick=\"validateStep1()\">\n\n                Continue \u2192\n\n              <\/button>\n\n            <\/div>\n\n          <\/div>\n\n          <!-- ================================================= -->\n<!-- ================================================= -->\n<!-- STEP 2 -->\n<!-- ================================================= -->\n\n<div class=\"ai-step-panel\">\n\n  <div class=\"ai-form-grid\">\n\n    <!-- EXAM DATE -->\n\n    <div class=\"ai-full\">\n\n      <label class=\"ai-label\">\n        Preferred Exam Date <span>*<\/span>\n      <\/label>\n\n      <input\n      type=\"date\"\n      id=\"examDate\"\n      class=\"ai-input step2-required\">\n\n    <\/div>\n\n    <!-- SOURCE -->\n\n    <div class=\"ai-full\">\n\n      <label class=\"ai-label\">\n        How did you hear about us?\n      <\/label>\n\n      <select\n      id=\"hearAbout\"\n      class=\"ai-select\">\n\n        <option value=\"\">\n          Select\n        <\/option>\n\n        <option>School<\/option>\n\n        <option>Friend<\/option>\n\n        <option>Instagram<\/option>\n\n        <option>Google<\/option>\n\n        <option>YouTube<\/option>\n\n        <option>Newspaper<\/option>\n\n        <option>Other<\/option>\n\n      <\/select>\n\n    <\/div>\n\n  <\/div>\n\n  <!-- BUTTONS -->\n\n  <div class=\"ai-btn-row\">\n\n    <button\n    type=\"button\"\n    class=\"ai-btn ai-btn-outline\"\n    onclick=\"goToStep(1)\">\n\n      \u2190 Back\n\n    <\/button>\n\n    <button\n    type=\"button\"\n    class=\"ai-btn\"\n    onclick=\"validateStep2()\">\n\n      Continue \u2192\n\n    <\/button>\n\n  <\/div>\n\n<\/div>\n          <!-- ================================================= -->\n          <!-- STEP 3 -->\n          <!-- ================================================= -->\n\n          <div class=\"ai-step-panel\">\n\n            <!-- SUMMARY -->\n\n            <div class=\"ai-summary\">\n\n              <div class=\"ai-summary-title\">\n                Registration Summary\n              <\/div>\n\n              <div class=\"ai-summary-grid\">\n\n                <div>\n                  <div class=\"ai-summary-label\">Name<\/div>\n                  <div class=\"ai-summary-value\" id=\"rName\"><\/div>\n                <\/div>\n\n                <div>\n                  <div class=\"ai-summary-label\">Grade<\/div>\n                  <div class=\"ai-summary-value\" id=\"rGrade\"><\/div>\n                <\/div>\n\n                <div>\n                  <div class=\"ai-summary-label\">School<\/div>\n                  <div class=\"ai-summary-value\" id=\"rSchool\"><\/div>\n                <\/div>\n\n                <div>\n                  <div class=\"ai-summary-label\">City<\/div>\n                  <div class=\"ai-summary-value\" id=\"rCity\"><\/div>\n                <\/div>\n\n                <div>\n                  <div class=\"ai-summary-label\">Phone<\/div>\n                  <div class=\"ai-summary-value\" id=\"rPhone\"><\/div>\n                <\/div>\n\n                <div>\n                  <div class=\"ai-summary-label\">Email<\/div>\n                  <div class=\"ai-summary-value\" id=\"rEmail\"><\/div>\n                <\/div>\n\n                <div>\n                  <div class=\"ai-summary-label\">Exam Date<\/div>\n                  <div class=\"ai-summary-value\" id=\"rExamDate\"><\/div>\n                <\/div>\n\n\n\n              <\/div>\n\n            <\/div>\n\n            <!-- PAYMENT -->\n\n            <div class=\"ai-pay-card\">\n\n              <div>\n\n                <div class=\"ai-pay-small\">\n                  Total Payable\n                <\/div>\n\n                <div class=\"ai-pay-amount\">\n                  \u20b9250\n                <\/div>\n\n                <div class=\"ai-pay-note\">\n                  All-inclusive \u2022 One-time\n                <\/div>\n\n              <\/div>\n\n              <div\n              style=\"\n              font-size:48px;\n              color:#63DFDC;\n              \">\n\n                \ud83d\udcb3\n\n              <\/div>\n\n            <\/div>\n\n            <!-- TERMS -->\n\n            <div class=\"ai-check\">\n\n              <input\n              type=\"checkbox\"\n              id=\"agreeTerms\">\n\n              <label for=\"agreeTerms\">\n                I agree to the terms and conditions.\n              <\/label>\n\n            <\/div>\n\n            <!-- BUTTONS -->\n\n            <div class=\"ai-btn-row\">\n\n              <button\n              type=\"button\"\n              class=\"ai-btn ai-btn-outline\"\n              onclick=\"goToStep(2)\">\n\n                \u2190 Back\n\n              <\/button>\n\n              <button\n              type=\"button\"\n              class=\"ai-btn\"\n              onclick=\"submitForm()\">\n\n                Pay \u20b9250 & Confirm \u2192\n\n              <\/button>\n\n            <\/div>\n\n          <\/div>\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n\n<\/div>\n\n<script>\n\n\/* =========================================================\nMULTISTEP FORM JS\nFINAL FIXED VERSION\n========================================================= *\/\n\n\/* =========================================================\nCURRENT STEP\n========================================================= *\/\n\nlet currentStep = 1;\n\n\/* =========================================================\nGO TO STEP\n========================================================= *\/\n\nfunction goToStep(step){\n\n  currentStep = step;\n\n  const slider =\n  document.getElementById('aiSlider');\n\n  \/* =========================================\n  SLIDE FIX\n  ========================================= *\/\n\n  slider.style.transform =\n  `translateX(-${(step - 1) * 33.3333}%)`;\n\n  \/* =========================================\n  STEP ACTIVE STATE\n  ========================================= *\/\n\n  document\n  .querySelectorAll('.ai-step')\n  .forEach(item=>{\n    item.classList.remove('active');\n  });\n\n  if(step >= 1){\n\n    document\n    .getElementById('step1nav')\n    .classList.add('active');\n  }\n\n  if(step >= 2){\n\n    document\n    .getElementById('step2nav')\n    .classList.add('active');\n  }\n\n  if(step >= 3){\n\n    document\n    .getElementById('step3nav')\n    .classList.add('active');\n  }\n\n  \/* =========================================\n  SCROLL TOP\n  ========================================= *\/\n\n  const form =\n  document.querySelector('.ai-registration');\n\n  if(form){\n\n    form.scrollIntoView({\n      behavior:'smooth',\n      block:'start'\n    });\n\n  }\n\n}\n\n\/* =========================================================\nSTEP 1 VALIDATION\n========================================================= *\/\n\nfunction validateStep1(){\n\n  let valid = true;\n\n  const fields =\n  document.querySelectorAll('.step1-required');\n\n  fields.forEach(field=>{\n\n    field.classList.remove('ai-error');\n\n    if(field.value.trim() === ''){\n\n      field.classList.add('ai-error');\n\n      valid = false;\n    }\n\n  });\n\n  \/* =========================================\n  EMAIL VALIDATION\n  ========================================= *\/\n\n  const email =\n  document.getElementById('email');\n\n  const emailPattern =\n  \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\n\n  if(email){\n\n    if(!emailPattern.test(email.value.trim())){\n\n      email.classList.add('ai-error');\n\n      valid = false;\n    }\n\n  }\n\n  \/* =========================================\n  PHONE VALIDATION\n  ========================================= *\/\n\n  const phone =\n  document.getElementById('phone');\n\n  if(phone){\n\n    const phoneValue =\n    phone.value.replace(\/\\D\/g,'');\n\n    if(phoneValue.length < 10){\n\n      phone.classList.add('ai-error');\n\n      valid = false;\n    }\n\n  }\n\n  \/* =========================================\n  PINCODE VALIDATION\n  ========================================= *\/\n\n  const pincode =\n  document.getElementById('pincode');\n\n  if(pincode){\n\n    const pinValue =\n    pincode.value.replace(\/\\D\/g,'');\n\n    if(pinValue.length < 6){\n\n      pincode.classList.add('ai-error');\n\n      valid = false;\n    }\n\n  }\n\n  \/* =========================================\n  ALERT\n  ========================================= *\/\n\n  if(!valid){\n\n    alert(\n      'Please fill all required fields correctly.'\n    );\n\n    return;\n  }\n\n  \/* =========================================\n  NEXT STEP\n  ========================================= *\/\n\n  goToStep(2);\n\n}\n\n\/* =========================================================\nSTEP 2 VALIDATION\n========================================================= *\/\n\nfunction validateStep2(){\n\n  let valid = true;\n\n  const fields =\n  document.querySelectorAll('.step2-required');\n\n  fields.forEach(field=>{\n\n    field.classList.remove('ai-error');\n\n    if(field.value.trim() === ''){\n\n      field.classList.add('ai-error');\n\n      valid = false;\n    }\n\n  });\n\n  if(!valid){\n\n    alert(\n      'Please complete Step 2.'\n    );\n\n    return;\n  }\n\n  \/* =========================================\n  LOAD SUMMARY\n  ========================================= *\/\n\n  const setText = (id,value)=>{\n\n    const el =\n    document.getElementById(id);\n\n    if(el){\n      el.textContent = value || '-';\n    }\n\n  };\n\n  setText(\n    'rName',\n    document.getElementById('studentName')?.value\n  );\n\n  setText(\n    'rGrade',\n    document.getElementById('studentGrade')?.value\n  );\n\n  setText(\n    'rSchool',\n    document.getElementById('schoolName')?.value\n  );\n\n  setText(\n    'rCity',\n    document.getElementById('city')?.value\n  );\n\n  setText(\n    'rPhone',\n    document.getElementById('phone')?.value\n  );\n\n  setText(\n    'rEmail',\n    document.getElementById('email')?.value\n  );\n\n  setText(\n    'rExamDate',\n    document.getElementById('examDate')?.value\n  );\n\n\n\n  \/* =========================================\n  NEXT STEP\n  ========================================= *\/\n\n  goToStep(3);\n\n}\n\n\/* =========================================================\nFINAL SUBMIT\n========================================================= *\/\n\nfunction submitForm(){\n\n  const agree =\n  document.getElementById('agreeTerms');\n\n  if(agree && !agree.checked){\n\n    alert(\n      'Please accept terms & conditions.'\n    );\n\n    return;\n  }\n\n  \/* =========================================\n  RAZORPAY \/ WEBHOOK PLACE\n  ========================================= *\/\n\n  alert(\n    'Registration submitted successfully!'\n  );\n\n}\n\n\/* =========================================================\nREMOVE ERROR ON INPUT\n========================================================= *\/\n\ndocument.addEventListener(\n  'input',\n  function(e){\n\n    if(\n      e.target.classList.contains('ai-input')\n      ||\n      e.target.classList.contains('ai-select')\n    ){\n\n      e.target.classList.remove('ai-error');\n\n    }\n\n  }\n);\n\n\/* =========================================================\nPREVENT FORM SUBMIT\n========================================================= *\/\n\ndocument.addEventListener(\n  'click',\n  function(e){\n\n    const btn =\n    e.target.closest('button');\n\n    if(btn){\n\n      btn.setAttribute(\n        'type',\n        'button'\n      );\n\n    }\n\n  }\n);\n\n\/* =========================================================\nLOAD FIRST STEP\n========================================================= *\/\n\nwindow.addEventListener(\n  'load',\n  ()=>{\n\n    goToStep(1);\n\n  }\n);\n\n<\/script>\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>Back to home Student Registration All-inclusive \u20b9250 \u00b7 Books \u00b7 LMS \u00b7 Exam \u00b7 Certificate 1 Personal Details 2 Exam [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/comments?post=7"}],"version-history":[{"count":33,"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":388,"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/pages\/7\/revisions\/388"}],"wp:attachment":[{"href":"https:\/\/stemlearn.ai\/aiolympiad\/wp-json\/wp\/v2\/media?parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}