{"id":192,"date":"2026-07-06T17:00:15","date_gmt":"2026-07-06T17:00:15","guid":{"rendered":"https:\/\/donothing.co.in\/app\/?page_id=192"},"modified":"2026-07-10T10:36:53","modified_gmt":"2026-07-10T10:36:53","slug":"home","status":"publish","type":"page","link":"https:\/\/donothing.co.in\/app\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"192\" class=\"elementor elementor-192\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4c1475b e-con-full e-flex e-con e-parent\" data-id=\"4c1475b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e4391e1 elementor-widget elementor-widget-html\" data-id=\"e4391e1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap');\r\n\r\n.dnm-hh{--sun:#ffcf21;--sun-soft:#FFF6D6;--ink:#232323;--muted:#303030;--line:#ECECE8;\r\n  font-family:'Manrope',system-ui,sans-serif;position:relative;overflow:hidden;isolation:isolate;\r\n  background:#FFFFFF;-webkit-font-smoothing:antialiased;color:var(--ink);padding:124px 24px 72px}\r\n.dnm-hh *{box-sizing:border-box;margin:0;padding:0}\r\n.dnm-hh .glow{position:absolute;top:-160px;right:-120px;width:640px;height:640px;border-radius:50%;\r\n  background:radial-gradient(circle,rgba(255,207,33,.30),transparent 62%);filter:blur(14px);z-index:0}\r\n.dnm-hh .glow2{position:absolute;bottom:-220px;left:-160px;width:520px;height:520px;border-radius:50%;\r\n  background:radial-gradient(circle,rgba(255,207,33,.14),transparent 62%);filter:blur(14px);z-index:0}\r\n.dnm-hh .grid{max-width:1180px;margin:0 auto;position:relative;z-index:2;\r\n  display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}\r\n\r\n\/* left copy with entrance *\/\r\n.dnm-hh .rev{opacity:0;transform:translateY(16px);animation:hhrise .7s cubic-bezier(.22,1,.36,1) forwards}\r\n.dnm-hh .rev:nth-child(1){animation-delay:.05s}\r\n.dnm-hh .rev:nth-child(2){animation-delay:.15s}\r\n.dnm-hh .rev:nth-child(3){animation-delay:.25s}\r\n.dnm-hh .rev:nth-child(4){animation-delay:.35s}\r\n.dnm-hh .rev:nth-child(5){animation-delay:.45s}\r\n.dnm-hh .rev:nth-child(6){animation-delay:.55s}\r\n@keyframes hhrise{to{opacity:1;transform:none}}\r\n\r\n\/* Unified Subtitle Badge with Yellow Dot Only *\/\r\n.dnm-hh .sub-title {\r\n  display: inline-block;\r\n  padding: 12px 20px;\r\n  border-radius: 12px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n.dnm-hh .sub-title span {\r\n  position: relative;\r\n  padding-left: 20px;\r\n}\r\n.dnm-hh .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  top: 50%;\r\n  width: 10px;\r\n  height: 10px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n.dnm-hh h1{font-size:clamp(26px,4vw,46px);font-weight:600;letter-spacing:-0.03em;line-height:1.08;color:#1c1c1a}\r\n.dnm-hh .rotor{display:inline-block;position:relative;min-height:1.1em}\r\n.dnm-hh .rotor .word{background:linear-gradient(98deg,#232323,#575855);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;\r\n  position:relative;white-space:nowrap}\r\n.dnm-hh .rotor .word::after{content:\"\";position:absolute;left:0;right:0;bottom:.06em;height:3px;border-radius:2px;background:var(--sun);opacity:.9}\r\n.dnm-hh .rotor.swap .word{animation:hhword .5s cubic-bezier(.22,1,.36,1)}\r\n@keyframes hhword{0%{opacity:0;filter:blur(8px);transform:translateY(10px)}100%{opacity:1;filter:blur(0);transform:none}}\r\n.dnm-hh .sub{color:var(--muted);font-size:15px;font-weight:500;margin-top:20px;max-width:520px;line-height:1.6}\r\n.dnm-hh .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}\r\n.dnm-hh .chip{font-size:12.5px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 13px}\r\n.dnm-hh .ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}\r\n.dnm-hh .btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15.5px;border-radius:999px;padding:12px 24px;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:transform .15s ease,box-shadow .2s ease}\r\n.dnm-hh .btn-sun{background:var(--sun);color:var(--ink);rgba(255,207,33,.4)}\r\n.dnm-hh .btn-sun:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(255,207,33,.5)}\r\n.dnm-hh .btn-ghost{background:#fff;color:var(--ink);border-color:var(--line)}\r\n.dnm-hh .btn-ghost:hover{transform:translateY(-2px);border-color:#d9d9d2}\r\n.dnm-hh .badges{display:flex;gap:12px;align-items:center;margin-top:24px;flex-wrap:wrap}\r\n.dnm-hh .badges a{transition:transform .15s ease} .dnm-hh .badges a:hover{transform:translateY(-2px)}\r\n.dnm-hh .badges img{height:46px;width:auto;display:block}\r\n.dnm-hh .trust{display:flex;align-items:center;gap:12px;margin-top:22px;flex-wrap:wrap}\r\n.dnm-hh .trust .stars{display:flex;gap:2px;color:var(--sun)}\r\n.dnm-hh .trust span{font-size:13.5px;color:var(--muted);font-weight:600} .dnm-hh .trust b{color:var(--ink)}\r\n\r\n\/* right stage *\/\r\n.dnm-hh .stage{position:relative;display:flex;justify-content:center;align-items:center;min-height:560px}\r\n.dnm-hh .phone{position:relative;z-index:2;opacity:0;transform:scale(.92);animation:hhphone .8s .3s cubic-bezier(.22,1,.36,1) forwards}\r\n@keyframes hhphone{to{opacity:1;transform:none}}\r\n.dnm-hh .phone img{display:block;width:auto;max-width:100%;max-height:560px;border-radius:34px;}\r\n.dnm-hh .phone::after{content:\"\";position:absolute;inset:-6% -12%;z-index:-1;border-radius:50%;\r\n  background:radial-gradient(circle,rgba(255,207,33,.22),transparent 60%)}\r\n\r\n.dnm-hh .floats{position:absolute;inset:0;z-index:3;pointer-events:none}\r\n.dnm-hh .fcard{position:absolute;background:#fff;border:1px solid var(--line);border-radius:16px;\r\n  box-shadow:0 18px 44px rgba(35,35,35,.16);padding:11px 14px;\r\n  opacity:0;transform:translateY(16px) scale(.94);transition:opacity .6s ease,transform .6s cubic-bezier(.22,1,.36,1);transition-delay:var(--d)}\r\n.dnm-hh .stage.in .fcard{opacity:1;transform:none}\r\n.dnm-hh .fc-float{display:flex;align-items:center;gap:11px;animation:hhfloat var(--t) ease-in-out infinite;animation-delay:var(--d)}\r\n@keyframes hhfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}\r\n.dnm-hh .fc-ic{width:34px;height:34px;border-radius:10px;background:var(--sun-soft);border:1px solid #F3E2A0;display:grid;place-items:center;flex:none}\r\n.dnm-hh .fcard b{font-size:12.5px;display:block;line-height:1.2}\r\n.dnm-hh .fcard span{font-size:10.5px;color:var(--muted)}\r\n\r\n@media(max-width:960px){\r\n  .dnm-hh{padding:104px 20px 52px}\r\n  .dnm-hh .grid{grid-template-columns:1fr;gap:34px;text-align:center}\r\n  .dnm-hh .sub{margin-left:auto;margin-right:auto}\r\n  .dnm-hh .sub-title,.dnm-hh .chips,.dnm-hh .ctas,.dnm-hh .badges,.dnm-hh .trust{justify-content:center}\r\n  .dnm-hh .stage{min-height:0;flex-direction:column}\r\n  .dnm-hh .phone img{max-height:460px}\r\n  \/* floating cards float around the phone as on desktop, pulled in a bit *\/\r\n  .dnm-hh .floats{position:absolute;inset:0;display:block;margin:0;pointer-events:none}\r\n}\r\n\r\n@media(max-width:640px){\r\n  .dnm-hh{padding:92px 16px 44px}\r\n  .dnm-hh .grid{gap:30px}\r\n\r\n  \/* --- copy block: everything centered & consistent --- *\/\r\n  .dnm-hh .sub-title{margin:0 auto 20px;font-size:13px;padding:10px 16px}\r\n  .dnm-hh h1{font-size:29px;letter-spacing:-0.02em;line-height:1.12}\r\n  .dnm-hh .rotor{min-height:1.2em}\r\n  .dnm-hh .sub{font-size:15px;margin:15px auto 0;max-width:440px}\r\n  .dnm-hh .chips{gap:8px;margin-top:20px}\r\n  .dnm-hh .chip{font-size:12px;padding:6px 12px}\r\n\r\n  \/* --- CTAs: primary full width, secondary full width, stacked & centered --- *\/\r\n  .dnm-hh .ctas{flex-direction:column;align-items:stretch;gap:10px;margin-top:26px}\r\n  .dnm-hh .ctas .btn{width:100%;justify-content:center;padding:15px 18px;font-size:15px}\r\n\r\n  \/* --- badges: equal size, centered, aligned to same baseline --- *\/\r\n  .dnm-hh .badges{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:340px;margin:22px auto 0;align-items:center}\r\n  .dnm-hh .badges a{width:100%}\r\n  .dnm-hh .badges img{width:100%;height:48px;object-fit:contain;object-position:center}\r\n\r\n  \/* --- trust row centered --- *\/\r\n  .dnm-hh .trust{justify-content:center;text-align:center;gap:10px;margin-top:20px}\r\n  .dnm-hh .trust span{font-size:12.5px}\r\n\r\n  \/* --- phone: centered, roomy, full glow --- *\/\r\n  .dnm-hh .stage{margin-top:12px;padding:24px 10px 8px;overflow:visible}\r\n  .dnm-hh .phone{width:100%;max-width:290px;margin:0 auto}\r\n  .dnm-hh .phone img{width:100%;max-height:none;height:auto;border-radius:28px}\r\n\r\n  \/* --- all four floating cards kept, placed clear of each other & the phone edges --- *\/\r\n  .dnm-hh .floats .fcard{padding:8px 11px;box-shadow:0 12px 30px rgba(35,35,35,.16)}\r\n  .dnm-hh .floats .fcard b{font-size:10.5px}\r\n  .dnm-hh .floats .fcard span{font-size:9px}\r\n  .dnm-hh .fc-ic{width:28px;height:28px}\r\n  .dnm-hh .floats .fcard{inset:auto}\r\n  .dnm-hh .floats .fcard:nth-child(1){top:6px;left:-4px;right:auto;bottom:auto}\r\n  .dnm-hh .floats .fcard:nth-child(2){top:24%;right:-4px;left:auto;bottom:auto}\r\n  .dnm-hh .floats .fcard:nth-child(3){bottom:16%;left:-4px;top:auto;right:auto}\r\n  .dnm-hh .floats .fcard:nth-child(4){bottom:2px;right:2px;top:auto;left:auto}\r\n}\r\n\r\n@media(max-width:380px){\r\n  .dnm-hh h1{font-size:26px}\r\n  .dnm-hh .phone{max-width:240px}\r\n  .dnm-hh .floats .fcard{padding:7px 9px}\r\n  .dnm-hh .floats .fcard b{font-size:9.5px}\r\n  .dnm-hh .floats .fcard span{font-size:8px}\r\n  .dnm-hh .fc-ic{width:24px;height:24px}\r\n  .dnm-hh .floats .fcard:nth-child(1){left:-2px}\r\n  .dnm-hh .floats .fcard:nth-child(2){right:-2px}\r\n  .dnm-hh .floats .fcard:nth-child(3){left:-2px}\r\n}\r\n@media(prefers-reduced-motion:reduce){\r\n  .dnm-hh .rev,.dnm-hh .phone{animation:none;opacity:1;transform:none}\r\n  .dnm-hh .fcard{transition:none;opacity:1;transform:none} .dnm-hh .fc-float{animation:none}\r\n  .dnm-hh .rotor.swap .word{animation:none}\r\n}\r\n<\/style>\r\n\r\n<section class=\"dnm-hh\" id=\"home\" aria-label=\"Hero\">\r\n  <div class=\"grid\">\r\n    <div class=\"hh-copy\">\r\n      \r\n      <!-- Unified Badge applied here (Yellow Dot Only) -->\r\n      <div class=\"sub-title rev\">\r\n        <span>Learning Management Platform<\/span>\r\n      <\/div>\r\n      \r\n      <h1 class=\"rev\">One Platform To Run Your Institute's<br><span class=\"rotor\" id=\"hhRotor\"><span class=\"word\">live classes<\/span><\/span><\/h1>\r\n      <p class=\"sub rev\">Admissions, live classes, fees, attendance, tests and parent updates, all in one branded app for students, mentors and parents. You run the teaching, the platform runs the rest.<\/p>\r\n      \r\n      <div class=\"chips rev\">\r\n        <span class=\"chip\">Student App<\/span><span class=\"chip\">Mentor App<\/span><span class=\"chip\">Admin Portal<\/span>\r\n        <span class=\"chip\">Parent Portal<\/span><span class=\"chip\">Android + iOS<\/span>\r\n      <\/div>\r\n      \r\n      <div class=\"ctas rev\">\r\n        <a class=\"btn btn-sun\" href=#demo-booking>Book a free demo <svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"17\" height=\"17\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M5 12h14\" \/> <path d=\"m12 5 7 7-7 7\" \/> <\/svg><\/a>\r\n        <a class=\"btn btn-ghost\" href=\"#why-app\"><svg aria-hidden=\"true\" class=\"lucide lucide-play\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z\" \/> <\/svg> See how it works<\/a>\r\n      <\/div>\r\n      \r\n      <div class=\"rev\">\r\n        <div class=\"badges\">\r\n          <!-- Updated Links for Google Play and App Store -->\r\n          <a href=\"#book-demo\" aria-label=\"Get it on Google Play\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/1-1-scaled.webp\" alt=\"Get it on Google Play\" loading=\"lazy\"><\/a>\r\n          <a href=\"#book-demo\" aria-label=\"Download on the App Store\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/2-1-scaled.webp\" alt=\"Download on the App Store\" loading=\"lazy\"><\/a>\r\n        <\/div>\r\n        <div class=\"trust\">\r\n          <span class=\"stars\"><svg aria-hidden=\"true\" class=\"lucide lucide-star\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z\" \/> <\/svg><svg aria-hidden=\"true\" class=\"lucide lucide-star\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z\" \/> <\/svg><svg aria-hidden=\"true\" class=\"lucide lucide-star\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z\" \/> <\/svg><svg aria-hidden=\"true\" class=\"lucide lucide-star\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z\" \/> <\/svg><svg aria-hidden=\"true\" class=\"lucide lucide-star\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z\" \/> <\/svg><\/span>\r\n          <span>Trusted by <b>50+ Educational Institutes<\/b> Across India<\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"stage\" id=\"hhStage\">\r\n      <div class=\"phone\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/feature-1-2.png\" alt=\"Student app home showing live classes, schedule and progress\" loading=\"eager\"><\/div>\r\n      <div class=\"floats\"><div class=\"fcard\" style=\"top:4%;left:-3%;--d:0s;--t:5.2s\"><div class=\"fc-float\"><span class=\"fc-ic\" style=\"color:#e23b3b\"><svg aria-hidden=\"true\" class=\"lucide lucide-video\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5\" \/> <rect x=\"2\" y=\"6\" width=\"14\" height=\"12\" rx=\"2\" \/> <\/svg><\/span><div><b>Live class started<\/b><span>Physics \u00b7 Batch 12-A<\/span><\/div><\/div><\/div><div class=\"fcard\" style=\"top:26%;right:-5%;--d:0.5s;--t:6s\"><div class=\"fc-float\"><span class=\"fc-ic\" style=\"color:#1f9d55\"><svg aria-hidden=\"true\" class=\"lucide lucide-banknote\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <rect width=\"20\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\" \/> <circle cx=\"12\" cy=\"12\" r=\"2\" \/> <path d=\"M6 12h.01M18 12h.01\" \/> <\/svg><\/span><div><b>\u20b912,000 received<\/b><span>Aarav Gupta \u00b7 UPI<\/span><\/div><\/div><\/div><div class=\"fcard\" style=\"bottom:22%;left:-6%;--d:0.9s;--t:5.6s\"><div class=\"fc-float\"><span class=\"fc-ic\" style=\"color:#232323\"><svg aria-hidden=\"true\" class=\"lucide lucide-calendar-check\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M8 2v4\" \/> <path d=\"M16 2v4\" \/> <rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\" \/> <path d=\"M3 10h18\" \/> <path d=\"m9 16 2 2 4-4\" \/> <\/svg><\/span><div><b>Attendance 94%<\/b><span>Marked automatically<\/span><\/div><\/div><\/div><div class=\"fcard\" style=\"bottom:3%;right:1%;--d:1.3s;--t:6.4s\"><div class=\"fc-float\"><span class=\"fc-ic\" style=\"color:#c98a00\"><svg aria-hidden=\"true\" class=\"lucide lucide-trophy\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M10 14.66v1.626a2 2 0 0 1-.976 1.696A5 5 0 0 0 7 21.978\" \/> <path d=\"M14 14.66v1.626a2 2 0 0 0 .976 1.696A5 5 0 0 1 17 21.978\" \/> <path d=\"M18 9h1.5a1 1 0 0 0 0-5H18\" \/> <path d=\"M4 22h16\" \/> <path d=\"M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z\" \/> <path d=\"M6 9H4.5a1 1 0 0 1 0-5H6\" \/> <\/svg><\/span><div><b>Rank #8 this week<\/b><span>Ananya moved up 3<\/span><\/div><\/div><\/div><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function(){\r\n  var reduce=window.matchMedia('(prefers-reduced-motion: reduce)');\r\n  \/\/ reveal floating cards when the stage is in view\r\n  var stage=document.getElementById('hhStage');\r\n  if(stage){\r\n    if('IntersectionObserver' in window){\r\n      var io=new IntersectionObserver(function(es){es.forEach(function(e){ if(e.isIntersecting){ stage.classList.add('in'); io.disconnect(); } });},{threshold:.25});\r\n      io.observe(stage);\r\n    } else stage.classList.add('in');\r\n  }\r\n  \/\/ rotating headline word\r\n  var rotor=document.getElementById('hhRotor');\r\n  if(rotor && !reduce.matches){\r\n    var words=[\"Live Classes\", \"Fee Collection\", \"Attendance\", \"Mock Tests\", \"Parent Updates\", \"Every Batch\"], i=0, wordEl=rotor.querySelector('.word');\r\n    setInterval(function(){\r\n      i=(i+1)%words.length;\r\n      rotor.classList.remove('swap'); void rotor.offsetWidth;\r\n      wordEl.textContent=words[i];\r\n      rotor.classList.add('swap');\r\n    }, 2200);\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b5b196a e-con-full e-flex e-con e-parent\" data-id=\"b5b196a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ef63aad elementor-widget elementor-widget-html\" data-id=\"ef63aad\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"why-app\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\" \/>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n<title>Why choose our LMS<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n  :root {\r\n    --bg: #FAFAF7;\r\n    --card-bg: #Ffffff;\r\n    --accent: #FFCF21;\r\n    --heading-gradient: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n    --text: #303030;\r\n    --text-soft: #303030);\r\n    --radius: 20px;\r\n    --ease: cubic-bezier(0.4, 0, 0.2, 1);\r\n    --shadow: 0 2px 6px rgba(35, 35, 35, 0.04), 0 12px 32px rgba(35, 35, 35, 0.06);\r\n    --shadow-hover: 0 6px 16px rgba(35, 35, 35, 0.08), 0 24px 48px rgba(35, 35, 35, 0.005);\r\n\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n\r\n  body {\r\n    background: var(--bg);\r\n    color: var(--text);\r\n    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    -webkit-font-smoothing: antialiased;\r\n    text-rendering: optimizeLegibility;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  .lms-section {\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    padding: clamp(56px, 8vh, 88px) 24px clamp(56px, 8vh, 80px);\r\n  }\r\n\r\n  \/* ============ Section header ============ *\/\r\n  .lms-head {\r\n    max-width: 760px;\r\n    margin: 0 auto;\r\n    padding-bottom: clamp(28px, 4vh, 44px);\r\n    text-align: center;\r\n  }\r\n\r\n  .lms-head .sub-title {\r\n    display: inline-block;\r\n    padding: 12px 20px;\r\n    border-radius: 12px;\r\n    background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n    box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n    font-size: 14px;\r\n    font-weight: 500;\r\n    line-height: 24px;\r\n    letter-spacing: 1px;\r\n    text-transform: uppercase;\r\n    color: #232323;\r\n    margin-bottom: 24px;\r\n  }\r\n  .lms-head .sub-title span { position: relative; padding-left: 20px; }\r\n  .lms-head .sub-title span::before {\r\n    content: \"\";\r\n    position: absolute;\r\n    left: 0; top: 50%;\r\n    width: 10px; height: 10px;\r\n    background: var(--accent);\r\n    border-radius: 50%;\r\n    transform: translateY(-50%);\r\n  }\r\n\r\n  .lms-head h2 {\r\n    font-size: clamp(24px, 4vw, 46px);\r\n    font-weight: 600;\r\n    letter-spacing: -0.025em;\r\n    line-height: 1.12;\r\n    background: var(--heading-gradient);\r\n    -webkit-background-clip: text;\r\n    background-clip: text;\r\n    -webkit-text-fill-color: transparent;\r\n    color: transparent;\r\n  }\r\n  .lms-head p {\r\n    margin-top: 14px;\r\n    font-size: clamp(15px, 2vw, 15px);\r\n    line-height: 1.6;\r\n    color: var(--text-soft);\r\n    font-weight: 500;\r\n  }\r\n\r\n  .lms-head .sub-title, .lms-head h2, .lms-head p {\r\n    opacity: 0;\r\n    transform: translateX(-40px);\r\n    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);\r\n  }\r\n  .lms-head.in .sub-title { opacity: 1; transform: translateX(0); }\r\n  .lms-head.in h2 { opacity: 1; transform: translateX(0); transition-delay: 0.08s; }\r\n  .lms-head.in p  { opacity: 1; transform: translateX(0); transition-delay: 0.16s; }\r\n\r\n  \/* ============ Sticky horizontal rail (DESKTOP \/ tablet) ============ *\/\r\n  .lms-rail {\r\n    position: relative;\r\n    margin-left: calc(50% - 50vw);\r\n    margin-right: calc(50% - 50vw);\r\n  }\r\n  .lms-rail-sticky {\r\n    position: sticky;\r\n    top: 0;\r\n    height: 70svh;\r\n    display: flex;\r\n    align-items: center;\r\n    overflow: hidden;\r\n  }\r\n  .lms-grid {\r\n    --card-w: clamp(320px, 30vw, 400px);\r\n    --card-gap: 28px;\r\n    display: flex;\r\n    gap: var(--card-gap);\r\n    align-items: stretch;\r\n    padding-left: calc(50vw - var(--card-w) \/ 2);\r\n    padding-right: calc(50vw - var(--card-w) \/ 2);\r\n    will-change: transform;\r\n  }\r\n\r\n  \/* ============ Cards ============ *\/\r\n  .lms-card {\r\n    flex: 0 0 var(--card-w);\r\n    background: var(--card-bg);\r\n    border-radius: var(--radius);\r\n    box-shadow: var(--shadow);\r\n    padding: clamp(26px, 3vw, 36px) clamp(24px, 2.6vw, 32px);\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: flex-start;\r\n    gap: 12px;\r\n    min-height: 280px;\r\n    will-change: transform, opacity, filter;\r\n    transition: box-shadow 0.45s var(--ease);\r\n  }\r\n  .lms-card .icon {\r\n    width: 52px; height: 52px;\r\n    border-radius: 14px;\r\n    background: var(--accent);\r\n    display: grid; place-items: center;\r\n    flex-shrink: 0;\r\n  }\r\n  .lms-card .icon svg {\r\n    width: 26px; height: 26px;\r\n    stroke: #232323; fill: none;\r\n    stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;\r\n  }\r\n  .lms-card h3 {\r\n    font-size: 19px;\r\n    font-weight: 600;\r\n    letter-spacing: -0.01em;\r\n    line-height: 1.25;\r\n    background: var(--heading-gradient);\r\n    -webkit-background-clip: text;\r\n    background-clip: text;\r\n    -webkit-text-fill-color: transparent;\r\n    color: transparent;\r\n  }\r\n  .lms-card p {\r\n    font-size: 15px;\r\n    line-height: 1.6;\r\n    color: var(--text-soft);\r\n    font-weight: 500;\r\n  }\r\n\r\n  \/* ============ Progress dots ============ *\/\r\n  .lms-dots {\r\n    position: absolute;\r\n    left: 0; right: 0;\r\n    bottom: clamp(20px, 5vh, 48px);\r\n    display: flex;\r\n    justify-content: center;\r\n    gap: 6px;\r\n    pointer-events: none;\r\n  }\r\n  .lms-dots span {\r\n    width: 6px; height: 6px;\r\n    border-radius: 999px;\r\n    background: rgba(48, 48, 48, 0.18);\r\n    transition: background 0.3s var(--ease), width 0.3s var(--ease);\r\n  }\r\n  .lms-dots span.active { background: var(--accent); width: 18px; }\r\n\r\n  \/* ============ MOBILE: crisp snap carousel (no blur rail) ============ *\/\r\n  @media (max-width: 767px) {\r\n    .lms-rail { margin-left: 0; margin-right: 0; height: auto !important; }\r\n    .lms-rail-sticky { position: static; height: auto; overflow: visible; display: block; }\r\n\r\n    .lms-grid {\r\n      --card-w: 84vw;\r\n      display: flex;\r\n      gap: 14px;\r\n      overflow-x: auto;\r\n      scroll-snap-type: x mandatory;\r\n      -webkit-overflow-scrolling: touch;\r\n      scrollbar-width: none;\r\n      padding: 6px 8vw 10px;\r\n      transform: none !important;\r\n    }\r\n    .lms-grid::-webkit-scrollbar { display: none; }\r\n\r\n    .lms-card {\r\n      flex: 0 0 var(--card-w);\r\n      scroll-snap-align: center;\r\n      scroll-snap-stop: always;\r\n      min-height: 0;\r\n      padding: 30px 26px;\r\n      gap: 14px;\r\n      \/* JS owns transform \/ opacity \/ filter for the focus blur *\/\r\n      transition: filter .2s linear, box-shadow 0.45s var(--ease);\r\n    }\r\n    \/* bigger, better-aligned type on mobile *\/\r\n    .lms-card .icon { width: 58px; height: 58px; border-radius: 16px; }\r\n    .lms-card .icon svg { width: 29px; height: 29px; }\r\n    .lms-card h3 { font-size: 21px; }\r\n    .lms-card p { font-size: 16px; line-height: 1.62; }\r\n\r\n    .lms-dots { position: static; margin-top: 20px; pointer-events: auto; }\r\n  }\r\n\r\n  \/* ============ CTA ============ *\/\r\n  .lms-cta-wrap {\r\n    margin-top: clamp(32px, 5vh, 48px);\r\n    text-align: center;\r\n    opacity: 0;\r\n    transform: translateX(40px);\r\n    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);\r\n  }\r\n  .lms-cta-wrap.in { opacity: 1; transform: translateX(0); }\r\n  .lms-cta {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    font-size: 15px;\r\n    font-weight: 600;\r\n    color: #232323;\r\n    background: var(--accent);\r\n    text-decoration: none;\r\n    border-radius: 999px;\r\n    padding: 12px 24px;\r\n    transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease);\r\n  }\r\n  .lms-cta:hover { transform: translateY(-2px); }\r\n  .lms-cta:focus-visible { outline: 3px solid #232323; outline-offset: 3px; }\r\n  .lms-cta svg { width: 18px; height: 18px; stroke: #232323; stroke-width: 2.4; fill: none; stroke-linecap: round; stroke-linejoin: round; transition: transform 0.35s var(--ease); }\r\n  .lms-cta:hover svg { transform: translateX(4px); }\r\n\r\n  \/* ============ Reduced motion ============ *\/\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .lms-head .sub-title, .lms-head h2, .lms-head p,\r\n    .lms-card, .lms-cta-wrap {\r\n      opacity: 1 !important;\r\n      transform: none !important;\r\n      filter: none !important;\r\n      transition: none !important;\r\n    }\r\n    .lms-dots { display: none; }\r\n    .lms-rail { height: auto !important; margin-left: 0; margin-right: 0; }\r\n    .lms-rail-sticky { position: static; height: auto; overflow: visible; display: block; }\r\n    .lms-grid { padding: 0; transform: none !important; overflow: visible; }\r\n    .lms-card { flex: none; min-height: 0; }\r\n    @media (min-width: 1024px) {\r\n      .lms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }\r\n    }\r\n    @media (min-width: 768px) and (max-width: 1023px) {\r\n      .lms-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }\r\n    }\r\n    @media (max-width: 767px) {\r\n      .lms-grid { display: flex; flex-direction: column; gap: 16px; }\r\n    }\r\n  }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"lms-section\" id=\"why-lms\">\r\n\r\n  <header class=\"lms-head\" data-reveal>\r\n    <div class=\"sub-title\"><span>Made for Institute's<\/span><\/div>\r\n    <h2>Built for Institute Operations, Learning, and Growth<\/h2>\r\n    <p>Most platforms fix one problem. Ours runs your whole operation, from the front desk to the classroom to the parent's phone.<\/p>\r\n  <\/header>\r\n\r\n  <div class=\"lms-rail\" id=\"lms-rail\">\r\n    <div class=\"lms-rail-sticky\">\r\n\r\n      <div class=\"lms-grid\" id=\"lms-grid\">\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M3 10.5 12 3l9 7.5\"\/><path d=\"M5 9.5V21h14V9.5\"\/><path d=\"M9 21v-6h6v6\"\/><\/svg><\/div>\r\n          <h3>Everything in one place<\/h3>\r\n          <p>Admissions, fees, classes, tests and reports under one login, so nothing slips through the cracks.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M12 7v5l3.5 2\"\/><\/svg><\/div>\r\n          <h3>Automation that works overnight<\/h3>\r\n          <p>Fee reminders, attendance alerts and report cards send themselves, every single day, without your staff lifting a finger.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M4 12.5 9.5 18 20 6.5\"\/><\/svg><\/div>\r\n          <h3>Attendance in one tap<\/h3>\r\n          <p>Biometric, QR or app attendance, with an instant WhatsApp alert to every parent the moment it is marked.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><rect x=\"3\" y=\"6\" width=\"18\" height=\"13\" rx=\"2.5\"\/><path d=\"M3 10.5h18\"\/><path d=\"M7 15.5h4\"\/><\/svg><\/div>\r\n          <h3>Fees that collect themselves<\/h3>\r\n          <p>Accept UPI, cards and net banking, and track every due, instalment and receipt without touching a register.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M4 20V10\"\/><path d=\"M10 20V4\"\/><path d=\"M16 20v-8\"\/><path d=\"M22 20H2\"\/><\/svg><\/div>\r\n          <h3>Analytics you can act on<\/h3>\r\n          <p>See which batch, teacher or student needs attention before a quiet problem turns into a dropout.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><rect x=\"7\" y=\"2.5\" width=\"10\" height=\"19\" rx=\"2.5\"\/><path d=\"M10.5 18.5h3\"\/><\/svg><\/div>\r\n          <h3>Your own branded apps<\/h3>\r\n          <p>Android and iOS apps on your name, logo and colours, for students, mentors and parents.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><rect x=\"2.5\" y=\"5\" width=\"13\" height=\"14\" rx=\"2.5\"\/><path d=\"M15.5 10.5 21.5 7v10l-6-3.5\"\/><\/svg><\/div>\r\n          <h3>Live classes, never lost<\/h3>\r\n          <p>HD live classes with instant recordings, so a missed class never means a missed topic.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 2.5 4.5 5.5v6c0 4.5 3.2 8.2 7.5 9.5 4.3-1.3 7.5-5 7.5-9.5v-6L12 2.5Z\"\/><path d=\"M9 11.8l2.2 2.2 4-4.3\"\/><\/svg><\/div>\r\n          <h3>Content that stays yours<\/h3>\r\n          <p>Watermarking, screen-record blocking and encryption keep your lectures off WhatsApp and YouTube.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"lms-card\">\r\n          <div class=\"icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 3l1.8 4.6L18.5 9l-4.7 1.4L12 15l-1.8-4.6L5.5 9l4.7-1.4L12 3Z\"\/><path d=\"M18.5 14.5l.9 2.3 2.3.9-2.3.9-.9 2.3-.9-2.3-2.3-.9 2.3-.9.9-2.3Z\"\/><\/svg><\/div>\r\n          <h3>AI that lifts scores<\/h3>\r\n          <p>An AI doubt bot, smart test analysis and revision cards that push every student a little higher.<\/p>\r\n        <\/article>\r\n\r\n      <\/div>\r\n\r\n      <div class=\"lms-dots\" aria-hidden=\"true\"><\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"lms-cta-wrap\" data-reveal>\r\n    <a class=\"lms-cta\" href=#demo-booking>\r\n      See it live, book a demo\r\n      <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14\"\/><path d=\"M13 6l6 6-6 6\"\/><\/svg>\r\n    <\/a>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\n(function () {\r\n  'use strict';\r\n\r\n  var REDUCED = window.matchMedia('(prefers-reduced-motion: reduce)');\r\n  var MOBILE = window.matchMedia('(max-width: 767px)');\r\n\r\n  \/* ---------- Reveal for header \/ CTA ---------- *\/\r\n  var revealTargets = document.querySelectorAll('[data-reveal]');\r\n  if (REDUCED.matches || !('IntersectionObserver' in window)) {\r\n    revealTargets.forEach(function (el) { el.classList.add('in'); });\r\n  } else {\r\n    var revealIO = new IntersectionObserver(function (entries) {\r\n      entries.forEach(function (entry) {\r\n        if (entry.isIntersecting) { entry.target.classList.add('in'); revealIO.unobserve(entry.target); }\r\n      });\r\n    }, { threshold: 0.15, rootMargin: '0px 0px -8% 0px' });\r\n    revealTargets.forEach(function (el) { revealIO.observe(el); });\r\n  }\r\n\r\n  var rail = document.getElementById('lms-rail');\r\n  var grid = document.getElementById('lms-grid');\r\n  var dotsWrap = document.querySelector('.lms-dots');\r\n  var cards = Array.prototype.slice.call(grid.querySelectorAll('.lms-card'));\r\n  var dots = [];\r\n  var ticking = false, active = false, mobileOn = false;\r\n  var railMax = 0, runway = 0, cardMetrics = [];\r\n  var mobileScrollFn = null, cardsIO = null;\r\n\r\n  function ease(t) { return t * t * (3 - 2 * t); }\r\n  function clamp01(v) { return v < 0 ? 0 : (v > 1 ? 1 : v); }\r\n\r\n  function buildDots() {\r\n    dotsWrap.innerHTML = '';\r\n    dots = [];\r\n    for (var i = 0; i < cards.length; i++) {\r\n      var d = document.createElement('span');\r\n      if (i === 0) d.className = 'active';\r\n      dotsWrap.appendChild(d);\r\n      dots.push(d);\r\n    }\r\n  }\r\n\r\n  \/* ============ DESKTOP blur rail ============ *\/\r\n  function measure() {\r\n    grid.style.transform = 'translate3d(0,0,0)';\r\n    railMax = Math.max(0, grid.scrollWidth - window.innerWidth);\r\n    runway = railMax;\r\n    rail.style.height = (window.innerHeight + runway) + 'px';\r\n    cardMetrics = cards.map(function (c) { return { left: c.offsetLeft, width: c.offsetWidth }; });\r\n  }\r\n  function frame() {\r\n    ticking = false;\r\n    if (!active) return;\r\n    var railTop = rail.getBoundingClientRect().top;\r\n    var progress = runway > 0 ? clamp01(-railTop \/ runway) : 0;\r\n    var tx = progress * railMax;\r\n    grid.style.transform = 'translate3d(' + (-tx).toFixed(2) + 'px, 0, 0)';\r\n    var center = window.innerWidth \/ 2;\r\n    var range = 0.9;\r\n    var best = 0, bestFocus = -1;\r\n    for (var i = 0; i < cardMetrics.length; i++) {\r\n      var m = cardMetrics[i];\r\n      var dist = Math.abs(m.left + m.width \/ 2 - tx - center);\r\n      var focus = ease(clamp01(1 - dist \/ (m.width * range)));\r\n      var scale = 0.92 + 0.08 * focus;\r\n      var opacity = 0.5 + 0.5 * focus;\r\n      var blur = 4 * (1 - focus);\r\n      var card = cards[i];\r\n      card.style.transform = 'scale(' + scale.toFixed(4) + ') translateZ(0)';\r\n      card.style.opacity = opacity.toFixed(3);\r\n      card.style.filter = blur > 0.05 ? 'blur(' + blur.toFixed(2) + 'px)' : 'none';\r\n      card.style.boxShadow = focus > 0.55 ? 'var(--shadow-hover)' : 'var(--shadow)';\r\n      if (focus > bestFocus) { bestFocus = focus; best = i; }\r\n    }\r\n    for (var j = 0; j < dots.length; j++) dots[j].classList.toggle('active', j === best);\r\n  }\r\n  function requestTick() { if (!ticking) { ticking = true; window.requestAnimationFrame(frame); } }\r\n\r\n  var resizeTimer = null;\r\n  function onResize() {\r\n    clearTimeout(resizeTimer);\r\n    resizeTimer = setTimeout(applyMode, 140);\r\n  }\r\n\r\n  function enableDesktop() {\r\n    if (active) return;\r\n    active = true;\r\n    buildDots();\r\n    measure();\r\n    window.addEventListener('scroll', requestTick, { passive: true });\r\n    requestTick();\r\n  }\r\n  function disableDesktop() {\r\n    if (!active) return;\r\n    active = false;\r\n    window.removeEventListener('scroll', requestTick);\r\n    grid.style.transform = '';\r\n    rail.style.height = '';\r\n    cards.forEach(function (card) {\r\n      card.style.transform = ''; card.style.opacity = '';\r\n      card.style.filter = ''; card.style.boxShadow = '';\r\n    });\r\n  }\r\n\r\n  \/* ============ MOBILE: same blur-focus, driven by native swipe scroll ============\r\n   * The card snaps crisply, but as it swipes, distance from the row center\r\n   * drives the identical focus curve as desktop:\r\n   * centered \u2192 scale 1, opacity 1, blur 0, lifted shadow\r\n   * neighbor \u2192 scale 0.92, opacity 0.5, blur 4px, resting shadow\r\n   *\/\r\n  function mobileFrame() {\r\n    var mid = grid.scrollLeft + grid.clientWidth \/ 2;\r\n    var cw = cards[0] ? cards[0].offsetWidth : 1;\r\n    var range = 0.85;\r\n    var best = 0, bestFocus = -1;\r\n    for (var i = 0; i < cards.length; i++) {\r\n      var c = cards[i];\r\n      var cc = c.offsetLeft + c.offsetWidth \/ 2;\r\n      var dist = Math.abs(cc - mid);\r\n      var focus = ease(clamp01(1 - dist \/ (cw * range)));\r\n      var scale = 0.92 + 0.08 * focus;\r\n      var opacity = 0.5 + 0.5 * focus;\r\n      var blur = 4 * (1 - focus);\r\n      c.style.transform = 'scale(' + scale.toFixed(4) + ') translateZ(0)';\r\n      c.style.opacity = opacity.toFixed(3);\r\n      c.style.filter = blur > 0.05 ? 'blur(' + blur.toFixed(2) + 'px)' : 'none';\r\n      c.style.boxShadow = focus > 0.55 ? 'var(--shadow-hover)' : 'var(--shadow)';\r\n      if (focus > bestFocus) { bestFocus = focus; best = i; }\r\n    }\r\n    for (var j = 0; j < dots.length; j++) dots[j].classList.toggle('active', j === best);\r\n  }\r\n  function enableMobile() {\r\n    if (mobileOn) return;\r\n    mobileOn = true;\r\n    buildDots();\r\n    var raf = null;\r\n    mobileScrollFn = function () {\r\n      if (raf) return;\r\n      raf = window.requestAnimationFrame(function () { raf = null; mobileFrame(); });\r\n    };\r\n    grid.addEventListener('scroll', mobileScrollFn, { passive: true });\r\n    \/\/ start with the first card centered and in focus\r\n    grid.scrollLeft = 0;\r\n    mobileFrame();\r\n  }\r\n  function disableMobile() {\r\n    if (!mobileOn) return;\r\n    mobileOn = false;\r\n    if (mobileScrollFn) grid.removeEventListener('scroll', mobileScrollFn);\r\n    if (cardsIO) { cardsIO.disconnect(); cardsIO = null; }\r\n    grid.classList.remove('cards-in');\r\n    mobileScrollFn = null;\r\n    cards.forEach(function (card) {\r\n      card.style.transform = ''; card.style.opacity = '';\r\n      card.style.filter = ''; card.style.boxShadow = '';\r\n    });\r\n  }\r\n\r\n  function applyMode() {\r\n    if (REDUCED.matches) { disableDesktop(); disableMobile(); return; }\r\n    if (MOBILE.matches) { disableDesktop(); enableMobile(); }\r\n    else { disableMobile(); enableDesktop(); measure(); requestTick(); }\r\n  }\r\n\r\n  window.addEventListener('resize', onResize, { passive: true });\r\n  if (REDUCED.addEventListener) { REDUCED.addEventListener('change', applyMode); MOBILE.addEventListener('change', applyMode); }\r\n  else if (REDUCED.addListener) { REDUCED.addListener(applyMode); MOBILE.addListener(applyMode); }\r\n\r\n  window.addEventListener('load', function () { if (active) { measure(); requestTick(); } });\r\n\r\n  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', applyMode);\r\n  else applyMode();\r\n})();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5e495e3 e-con-full e-flex e-con e-parent\" data-id=\"5e495e3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-35f68be elementor-widget elementor-widget-html\" data-id=\"35f68be\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"platform-features\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap');\r\n\r\n:root {\r\n  --theme-color: #ffcf21;\r\n  --title-color: #232323;\r\n  --sun-soft: #FFF6D6;\r\n  --ink: #171717;\r\n  --dark: #232323;\r\n  --white: #ffffff;\r\n  --line: #ECECE8;\r\n  --muted: #303030;\r\n  --grey: #575855;\r\n  --shadow-s: 0 1px 2px rgba(23, 23, 23, .06), 0 4px 14px rgba(23, 23, 23, .05);\r\n  --shadow-m: 0 8px 30px rgba(23, 23, 23, .10);\r\n}\r\n\r\n.dnm-features-section {\r\n  font-family: 'Manrope', system-ui, sans-serif;\r\n  background-color: #ffffff;\r\n  padding: 96px 24px;\r\n  border-top: 1px solid var(--line);\r\n  border-bottom: 1px solid var(--line);\r\n  line-height: 1.6;\r\n  -webkit-font-smoothing: antialiased;\r\n  color: var(--ink);\r\n}\r\n\r\n.dnm-features-section * {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.dnm-features-section .wrap {\r\n  max-width: 1180px;\r\n  margin: 0 auto;\r\n}\r\n\r\n.dnm-features-section .center { \r\n  text-align: center; \r\n}\r\n\r\n\/* --- SUBTITLE BADGE --- *\/\r\n.dnm-features-section .sub-title {\r\n  display: inline-block;\r\n  padding: 12px 20px;\r\n  border-radius: 12px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.dnm-features-section .sub-title span {\r\n  position: relative;\r\n  padding-left: 20px;\r\n}\r\n\r\n.dnm-features-section .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  top: 50%;\r\n  width: 10px;\r\n  height: 10px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* --- GRADIENT HEADING --- *\/\r\n.dnm-features-section .h2 {\r\n  font-size: clamp(24px, 4vw, 42px); \r\n  font-weight: 600; \r\n  letter-spacing: -0.022em; \r\n  margin-bottom: 16px; \r\n  line-height: 1.14; \r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n}\r\n\r\n\/* --- TEXT --- *\/\r\n.dnm-features-section .lead { \r\n  color: #303030; \r\n  font-size: 15px; \r\n  max-width: 640px; \r\n  margin: 0 auto; \r\n  font-weight: 500;\r\n}\r\n\r\n\/* --- ANIMATED TABS --- *\/\r\n.dnm-features-section .tabs {\r\n  display: flex;\r\n  gap: 12px;\r\n  flex-wrap: wrap;\r\n  justify-content: center;\r\n  margin: 40px 0 44px;\r\n}\r\n\r\n.dnm-features-section .theme-btn {\r\n  position: relative;\r\n  display: inline-block;\r\n  overflow: hidden;\r\n  text-decoration: none;\r\n  border-radius: 8px;\r\n  border: none;\r\n  cursor: pointer;\r\n  background: transparent;\r\n  padding: 0;\r\n}\r\n\r\n.dnm-features-section .theme-btn .static-text,\r\n.dnm-features-section .theme-btn .hover-text {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 10px;\r\n  padding: 12px 28px;\r\n  font: 600 15px\/26px \"Manrope\", sans-serif;\r\n  border-radius: 8px;\r\n  background: var(--white);\r\n  color: #303030;\r\n  border: 1px solid var(--line);\r\n  transition: transform .5s cubic-bezier(.4,0,.2,1), background-color .5s ease, color .5s ease, border-color .5s ease;\r\n}\r\n\r\n.dnm-features-section .theme-btn .hover-text {\r\n  position: absolute;\r\n  inset: 0;\r\n  transform: translateY(100%);\r\n}\r\n\r\n\/* Standard Hover State (Grey Background & White Text) *\/\r\n.dnm-features-section .theme-btn:hover .static-text {\r\n  transform: translateY(-100%);\r\n  background: var(--grey);\r\n  color: var(--white);\r\n  border-color: var(--grey);\r\n}\r\n\r\n.dnm-features-section .theme-btn:hover .hover-text {\r\n  transform: translateY(0);\r\n  background: var(--grey);\r\n  color: var(--white);\r\n  border-color: var(--grey);\r\n}\r\n\r\n\/* Active (On) State (Yellow Background & Dark Text) *\/\r\n.dnm-features-section .theme-btn.on .static-text,\r\n.dnm-features-section .theme-btn.on:hover .static-text {\r\n  transform: translateY(-100%);\r\n  background: var(--theme-color);\r\n  color: var(--dark);\r\n  border-color: var(--theme-color);\r\n}\r\n\r\n.dnm-features-section .theme-btn.on .hover-text,\r\n.dnm-features-section .theme-btn.on:hover .hover-text {\r\n  transform: translateY(0);\r\n  background: var(--theme-color);\r\n  color: var(--dark);\r\n  border-color: var(--theme-color);\r\n}\r\n\r\n\/* --- GRID & CARDS --- *\/\r\n.dnm-features-section .grid3 {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 20px;\r\n}\r\n\r\n.dnm-features-section .card {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 20px;\r\n  padding: 26px;\r\n  box-shadow: var(--shadow-s);\r\n  transition: transform .18s ease, box-shadow .18s ease;\r\n}\r\n\r\n.dnm-features-section .card:hover {\r\n  transform: translateY(-3px);\r\n  box-shadow: var(--shadow-m);\r\n}\r\n\r\n.dnm-features-section .icon-tile {\r\n  width: 44px;\r\n  height: 44px;\r\n  border-radius: 13px;\r\n  background: var(--theme-color);\r\n  border: 1px solid #F3E2A0;\r\n  display: grid;\r\n  place-items: center;\r\n  color: var(--ink);\r\n  margin-bottom: 16px;\r\n}\r\n\r\n.dnm-features-section .icon-tile svg {\r\n  vertical-align: middle;\r\n}\r\n\r\n.dnm-features-section .card h3 {\r\n  font-size: 17.5px;\r\n  font-weight: 600;\r\n  margin-bottom: 8px;\r\n  color: var(--ink);\r\n}\r\n\r\n.dnm-features-section .card p {\r\n  color: #303030;\r\n  font-size: 14.5px;\r\n}\r\n\r\n\/* --- RESPONSIVE --- *\/\r\n@media(max-width: 1020px) {\r\n  .dnm-features-section .grid3 { grid-template-columns: 1fr 1fr; }\r\n}\r\n\r\n@media(max-width: 640px) {\r\n  .dnm-features-section { padding: 56px 0; }\r\n  .dnm-features-section .wrap { padding: 0 18px; }\r\n  .dnm-features-section .h2 { font-size: 26px; }\r\n  .dnm-features-section .lead { font-size: 14px; }\r\n  .dnm-features-section .sub-title { padding: 10px 16px; font-size: 14px; margin-bottom: 20px; }\r\n  .dnm-features-section .grid3 { grid-template-columns: 1fr; }\r\n  .dnm-features-section .card { padding: 22px; }\r\n  \r\n  \/* Horizontal scrolling for tabs on mobile *\/\r\n  .dnm-features-section .tabs {\r\n    flex-wrap: nowrap;\r\n    overflow-x: auto;\r\n    justify-content: flex-start;\r\n    padding-bottom: 8px;\r\n    margin: 28px -18px 26px;\r\n    padding-left: 18px;\r\n    padding-right: 18px;\r\n    -webkit-overflow-scrolling: touch;\r\n    scrollbar-width: none;\r\n  }\r\n  .dnm-features-section .tabs::-webkit-scrollbar { display: none; }\r\n  .dnm-features-section .theme-btn { flex: none; }\r\n  .dnm-features-section .theme-btn .static-text,\r\n  .dnm-features-section .theme-btn .hover-text { padding: 10px 20px; font-size: 14px; }\r\n}\r\n\r\n@media(prefers-reduced-motion: reduce) {\r\n  .dnm-features-section .card, .dnm-features-section .theme-btn .static-text, .dnm-features-section .theme-btn .hover-text { transition: none; transform: none !important; }\r\n  .dnm-features-section .theme-btn .hover-text { display: none; }\r\n  .dnm-features-section .theme-btn:hover .static-text { background: var(--grey); color: var(--white); border-color: var(--grey); }\r\n  .dnm-features-section .theme-btn.on .static-text, .dnm-features-section .theme-btn.on:hover .static-text { background: var(--theme-color); color: var(--dark); border-color: var(--theme-color); }\r\n}\r\n<\/style>\r\n\r\n<div class=\"dnm-features-section\" id=\"elementor-dnm-features\">\r\n  <div class=\"wrap\">\r\n    <div class=\"center\">\r\n      \r\n      <div class=\"sub-title\">\r\n        <span>Platform features<\/span>\r\n      <\/div>\r\n      \r\n      <h2 class=\"h2\">One Platform. Every Role Covered.<\/h2>\r\n      \r\n      <p class=\"lead\">A quick summary of what each portal does. Book a demo to see the full feature list in action.<\/p>\r\n    <\/div>\r\n    \r\n    <div class=\"tabs\" role=\"tablist\" aria-label=\"Feature categories\">\r\n      <button role=\"tab\" aria-selected=\"true\" class=\"theme-btn on\" data-tab=\"0\">\r\n        <span class=\"static-text\">Admin Portal<\/span>\r\n        <span class=\"hover-text\">Admin Portal<\/span>\r\n      <\/button>\r\n      <button role=\"tab\" aria-selected=\"false\" class=\"theme-btn\" data-tab=\"1\">\r\n        <span class=\"static-text\">Mentor Portal<\/span>\r\n        <span class=\"hover-text\">Mentor Portal<\/span>\r\n      <\/button>\r\n      <button role=\"tab\" aria-selected=\"false\" class=\"theme-btn\" data-tab=\"2\">\r\n        <span class=\"static-text\">Student Portal<\/span>\r\n        <span class=\"hover-text\">Student Portal<\/span>\r\n      <\/button>\r\n      <button role=\"tab\" aria-selected=\"false\" class=\"theme-btn\" data-tab=\"3\">\r\n        <span class=\"static-text\">Parent Portal<\/span>\r\n        <span class=\"hover-text\">Parent Portal<\/span>\r\n      <\/button>\r\n      <button role=\"tab\" aria-selected=\"false\" class=\"theme-btn\" data-tab=\"4\">\r\n        <span class=\"static-text\">Platform<\/span>\r\n        <span class=\"hover-text\">Platform<\/span>\r\n      <\/button>\r\n    <\/div>\r\n    \r\n    <div class=\"grid3 tab-panel\" data-panel=\"0\" style=\"display:grid\">\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"\/><path d=\"M16 3.128a4 4 0 0 1 0 7.744\"\/><path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"\/><circle cx=\"9\" cy=\"7\" r=\"4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Student & batch management<\/h3><p style=\"font-size:14px\">Profiles, batches, timetables and transfers in a few clicks.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M19 7V4a1 1 0 0 0-1-1H5a2 2 0 0 0 0 4h15a1 1 0 0 1 1 1v4h-3a2 2 0 0 0 0 4h3a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1\"\/><path d=\"M3 5v14a2 2 0 0 0 2 2h15a1 1 0 0 0 1-1v-4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Fees & payment gateway<\/h3><p style=\"font-size:14px\">Online collection, instalments, receipts and due tracking.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"8\" height=\"4\" x=\"8\" y=\"2\" rx=\"1\" ry=\"1\"\/><path d=\"M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2\"\/><path d=\"M12 11h4\"\/><path d=\"M12 16h4\"\/><path d=\"M8 11h.01\"\/><path d=\"M8 16h.01\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Lead CRM<\/h3><p style=\"font-size:14px\">Capture enquiries, follow up and convert more admissions.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m15.477 12.89 1.515 8.526a.5.5 0 0 1-.81.47l-3.58-2.687a1 1 0 0 0-1.197 0l-3.586 2.686a.5.5 0 0 1-.81-.469l1.514-8.526\"\/><circle cx=\"12\" cy=\"8\" r=\"6\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Certificates & white label<\/h3><p style=\"font-size:14px\">Branded certificates, ID cards and a fully white-labelled platform.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M3 3v16a2 2 0 0 0 2 2h16\"\/><path d=\"M18 17V9\"\/><path d=\"M13 17V5\"\/><path d=\"M8 17v-3\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Reports & analytics<\/h3><p style=\"font-size:14px\">Revenue, attendance and performance reports, export-ready.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"18\" height=\"11\" x=\"3\" y=\"11\" rx=\"2\" ry=\"2\"\/><path d=\"M7 11V7a5 5 0 0 1 10 0v4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Security & roles<\/h3><p style=\"font-size:14px\">Role-based access, audit logs and encrypted data.<\/p><\/div>\r\n    <\/div>\r\n    \r\n    <div class=\"grid3 tab-panel\" data-panel=\"1\" style=\"display:none\">\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5\"\/><rect x=\"2\" y=\"6\" width=\"14\" height=\"12\" rx=\"2\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Live classes & whiteboard<\/h3><p style=\"font-size:14px\">HD classes with an interactive whiteboard and recordings.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z\"\/><path d=\"M14 2v5a1 1 0 0 0 1 1h5\"\/><path d=\"M10 9H8\"\/><path d=\"M16 13H8\"\/><path d=\"M16 17H8\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Assignments & tests<\/h3><p style=\"font-size:14px\">Create, assign and auto-evaluate with detailed analysis.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3v12\"\/><path d=\"m17 8-5-5-5 5\"\/><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Content upload<\/h3><p style=\"font-size:14px\">Share notes, PDFs and videos with the right batches instantly.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8 2v4\"\/><path d=\"M16 2v4\"\/><rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\"\/><path d=\"M3 10h18\"\/><path d=\"m9 16 2 2 4-4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Attendance<\/h3><p style=\"font-size:14px\">One-tap batch attendance with automatic parent alerts.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 7v14\"\/><path d=\"M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Lesson planning<\/h3><p style=\"font-size:14px\">Plan syllabus coverage and track it against the calendar.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 7h6v6\"\/><path d=\"m22 7-8.5 8.5-5-5L2 17\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Performance tracking<\/h3><p style=\"font-size:14px\">Spot weak topics and students who need extra attention.<\/p><\/div>\r\n    <\/div>\r\n    \r\n    <div class=\"grid3 tab-panel\" data-panel=\"2\" style=\"display:none\">\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5\"\/><rect x=\"2\" y=\"6\" width=\"14\" height=\"12\" rx=\"2\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Live + recorded classes<\/h3><p style=\"font-size:14px\">Attend live or watch recordings anytime, on any device.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"8\" height=\"4\" x=\"8\" y=\"2\" rx=\"1\" ry=\"1\"\/><path d=\"M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2\"\/><path d=\"M12 11h4\"\/><path d=\"M12 16h4\"\/><path d=\"M8 11h.01\"\/><path d=\"M8 16h.01\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Mock tests<\/h3><p style=\"font-size:14px\">Exam-pattern tests with rank, percentile and solutions.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 8V4H8\"\/><rect width=\"16\" height=\"12\" x=\"4\" y=\"8\" rx=\"2\"\/><path d=\"M2 14h2\"\/><path d=\"M20 14h2\"\/><path d=\"M15 13v2\"\/><path d=\"M9 13v2\"\/><\/svg><\/span><h3 style=\"font-size:16px\">AI Doubt Bot<\/h3><p style=\"font-size:14px\">Instant answers to doubts, any time of day or night.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M10 14.66v1.626a2 2 0 0 1-.976 1.696A5 5 0 0 0 7 21.978\"\/><path d=\"M14 14.66v1.626a2 2 0 0 0 .976 1.696A5 5 0 0 1 17 21.978\"\/><path d=\"M18 9h1.5a1 1 0 0 0 0-5H18\"\/><path d=\"M4 22h16\"\/><path d=\"M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z\"\/><path d=\"M6 9H4.5a1 1 0 0 1 0-5H6\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Leaderboards<\/h3><p style=\"font-size:14px\">Healthy competition with batch and institute rankings.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 15V3\"\/><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"\/><path d=\"m7 10 5 5 5-5\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Offline downloads<\/h3><p style=\"font-size:14px\">Study material available even without internet.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Dark mode & revision cards<\/h3><p style=\"font-size:14px\">Comfortable late-night study with quick revision decks.<\/p><\/div>\r\n    <\/div>\r\n    \r\n    <div class=\"grid3 tab-panel\" data-panel=\"3\" style=\"display:none\">\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8 2v4\"\/><path d=\"M16 2v4\"\/><rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\"\/><path d=\"M3 10h18\"\/><path d=\"m9 16 2 2 4-4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Live attendance alerts<\/h3><p style=\"font-size:14px\">Know the moment your child reaches class.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 7h6v6\"\/><path d=\"m22 7-8.5 8.5-5-5L2 17\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Performance reports<\/h3><p style=\"font-size:14px\">Test scores, ranks and progress in simple language.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M19 7V4a1 1 0 0 0-1-1H5a2 2 0 0 0 0 4h15a1 1 0 0 1 1 1v4h-3a2 2 0 0 0 0 4h3a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1\"\/><path d=\"M3 5v14a2 2 0 0 0 2 2h15a1 1 0 0 0 1-1v-4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Fee visibility<\/h3><p style=\"font-size:14px\">Dues, receipts and payment options in one place.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Teacher feedback<\/h3><p style=\"font-size:14px\">Direct feedback from mentors after tests and PTMs.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z\"\/><path d=\"M14 2v5a1 1 0 0 0 1 1h5\"\/><path d=\"M10 9H8\"\/><path d=\"M16 13H8\"\/><path d=\"M16 17H8\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Progress reports<\/h3><p style=\"font-size:14px\">Monthly report cards delivered automatically.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M10.268 21a2 2 0 0 0 3.464 0\"\/><path d=\"M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326\"\/><\/svg><\/span><h3 style=\"font-size:16px\">PTM notifications<\/h3><p style=\"font-size:14px\">Never miss a parent-teacher meeting again.<\/p><\/div>\r\n    <\/div>\r\n    \r\n    <div class=\"grid3 tab-panel\" data-panel=\"4\" style=\"display:none\">\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8\"\/><path d=\"M10 19v-3.96 3.15\"\/><path d=\"M7 19h5\"\/><rect width=\"6\" height=\"10\" x=\"16\" y=\"12\" rx=\"2\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Android, iOS & Web<\/h3><p style=\"font-size:14px\">One platform, every device \u2014 always in sync.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Automation engine<\/h3><p style=\"font-size:14px\">Reminders, alerts and reports that send themselves.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\"\/><path d=\"m9 12 2 2 4-4\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Content security<\/h3><p style=\"font-size:14px\">Watermarking and encryption protect your lectures.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z\"\/><path d=\"M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12\"\/><path d=\"M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Multi-branch ready<\/h3><p style=\"font-size:14px\">Run every branch from one dashboard with branch-level control.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z\"\/><path d=\"M20 2v4\"\/><path d=\"M22 4h-4\"\/><circle cx=\"4\" cy=\"20\" r=\"2\"\/><\/svg><\/span><h3 style=\"font-size:16px\">AI across the platform<\/h3><p style=\"font-size:14px\">Smart insights for owners, teachers and students.<\/p><\/div>\r\n      <div class=\"card\"><span class=\"icon-tile\"><svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 3h12\"\/><path d=\"M6 8h12\"\/><path d=\"m6 13 8.5 8\"\/><path d=\"M6 13h3\"\/><path d=\"M9 13c6.667 0 6.667-10 0-10\"\/><\/svg><\/span><h3 style=\"font-size:16px\">Built for India<\/h3><p style=\"font-size:14px\">UPI payments, regional languages and WhatsApp alerts.<\/p><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  \/\/ Scoped specifically to this widget to prevent conflicts in Elementor\r\n  document.addEventListener('DOMContentLoaded', function() {\r\n    const featureSection = document.getElementById('elementor-dnm-features');\r\n    if(featureSection) {\r\n      const tabs = featureSection.querySelectorAll('.theme-btn');\r\n      const panels = featureSection.querySelectorAll('.tab-panel');\r\n\r\n      tabs.forEach(btn => {\r\n        btn.addEventListener('click', () => {\r\n          const n = btn.getAttribute('data-tab');\r\n          \r\n          \/\/ Reset all tabs inside this widget\r\n          tabs.forEach(b => { \r\n            b.classList.remove('on'); \r\n            b.setAttribute('aria-selected', 'false'); \r\n          });\r\n          \r\n          \/\/ Set active tab\r\n          btn.classList.add('on'); \r\n          btn.setAttribute('aria-selected', 'true');\r\n          \r\n          \/\/ Show matching panel, hide others\r\n          panels.forEach(p => {\r\n            p.style.display = (p.getAttribute('data-panel') === n) ? 'grid' : 'none';\r\n          });\r\n        });\r\n      });\r\n    }\r\n  });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1308589 e-con-full e-flex e-con e-parent\" data-id=\"1308589\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-167b343 elementor-widget elementor-widget-html\" data-id=\"167b343\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap');\r\n\r\n:root {\r\n  --theme-color: #ffcf21;\r\n  --title-color: #232323;\r\n  --ink: #171717;\r\n  --line: #ECECE8;\r\n  --muted: rgba(23,23,23,0.85);\r\n  --shadow-s: 0 4px 14px rgba(23,23,23,.03);\r\n  --shadow-m: 0 12px 34px rgba(23,23,23,.08);\r\n}\r\n\r\n.dnm-stats-section {\r\n  font-family: 'Manrope', system-ui, sans-serif;\r\n  background-color: #ffffff;\r\n  padding: 96px 24px;\r\n  border-top: 1px solid var(--line);\r\n  line-height: 1.6;\r\n  -webkit-font-smoothing: antialiased;\r\n  color: var(--ink);\r\n  text-align: center;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n.dnm-stats-section * {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.dnm-stats-section .wrap {\r\n  max-width: 1180px;\r\n  margin: 0 auto;\r\n  position: relative;\r\n  z-index: 2;\r\n}\r\n\r\n\/* Background Glow *\/\r\n.dnm-stats-section .glow {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 50%;\r\n  transform: translate(-50%, -50%);\r\n  width: 800px;\r\n  height: 400px;\r\n  background: radial-gradient(ellipse, rgba(255,207,33,.12), transparent 60%);\r\n  filter: blur(24px);\r\n  z-index: 0;\r\n  pointer-events: none;\r\n}\r\n\r\n\/* --- SUBTITLE BADGE --- *\/\r\n.dnm-stats-section .sub-title {\r\n  display: inline-block;\r\n  padding: 12px 20px;\r\n  border-radius: 12px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 13.5px;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.dnm-stats-section .sub-title span {\r\n  position: relative;\r\n  padding-left: 20px;\r\n}\r\n\r\n.dnm-stats-section .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  top: 50%;\r\n  width: 10px;\r\n  height: 10px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* --- GRADIENT HEADING & DESCRIPTION --- *\/\r\n.dnm-stats-section .h2 {\r\n  font-size: clamp(28px, 4vw, 42px); \r\n  font-weight: 600; \r\n  letter-spacing: -0.022em; \r\n  margin-bottom: 16px; \r\n  line-height: 1.14; \r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n}\r\n\r\n.dnm-stats-section .lead {\r\n  color: #303030;\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  margin: 0 auto 56px;\r\n  max-width: 600px;\r\n  line-height: 1.5;\r\n}\r\n\r\n\/* --- STATS GRID --- *\/\r\n.dnm-stats-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(4, 1fr);\r\n  gap: 24px;\r\n}\r\n\r\n.dnm-stat-card {\r\n  background: #fafaf7; \/* Changed background color *\/\r\n  border: 1px solid var(--line);\r\n  border-radius: 20px;\r\n  padding: 40px 24px;\r\n  box-shadow: var(--shadow-s);\r\n  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n.dnm-stat-card:hover {\r\n  transform: translateY(-6px);\r\n  box-shadow: var(--shadow-m);\r\n}\r\n\r\n.dnm-stat-num {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: baseline;\r\n  justify-content: center;\r\n  font-size: clamp(28px, 3vw, 46px);\r\n  font-weight: 600;\r\n  letter-spacing: -0.03em;\r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n  padding-bottom: 14px; \/* Space for the yellow line *\/\r\n  margin-bottom: 16px;\r\n  line-height: 1.1;\r\n}\r\n\r\n\/* Yellow line underneath the number *\/\r\n.dnm-stat-num::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  width: 40px;\r\n  height: 4px;\r\n  background-color: var(--theme-color);\r\n  border-radius: 4px;\r\n}\r\n\r\n.dnm-stat-num .suffix {\r\n  font-size: 0.6em;\r\n  font-weight: 600;\r\n  margin-left: 2px;\r\n}\r\n\r\n.dnm-stat-text {\r\n  font-size: 16px;\r\n  font-weight: 600;\r\n  color: var(--title-color);\r\n  margin-bottom: 8px;\r\n}\r\n\r\n.dnm-stat-desc {\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  color: #303030;\r\n  line-height: 1.5;\r\n  max-width: 220px;\r\n  margin: 0 auto;\r\n}\r\n\r\n\/* --- MOBILE OPTIMIZATIONS --- *\/\r\n@media(max-width: 1024px) {\r\n  .dnm-stats-grid {\r\n    grid-template-columns: repeat(2, 1fr);\r\n    gap: 24px;\r\n  }\r\n}\r\n\r\n@media(max-width: 640px) {\r\n  .dnm-stats-section { padding: 64px 0; }\r\n  .dnm-stats-section .wrap { padding: 0 16px; }\r\n  \r\n  .dnm-stats-section .sub-title { padding: 10px 16px; font-size: 13px; margin-bottom: 20px; }\r\n  .dnm-stats-section .h2 { font-size: 26px; margin-bottom: 12px; }\r\n  .dnm-stats-section .lead { font-size: 15px; margin-bottom: 40px; }\r\n  \r\n  .dnm-stats-grid { gap: 14px; }\r\n  \r\n  .dnm-stat-card { \r\n    padding: 32px 14px; \r\n    border-radius: 16px; \r\n  }\r\n  \r\n  .dnm-stat-num { \r\n    font-size: 38px; \r\n    padding-bottom: 12px; \r\n    margin-bottom: 14px;\r\n  }\r\n  \r\n  .dnm-stat-text { font-size: 14px; margin-bottom: 6px; }\r\n  \r\n  .dnm-stat-desc { \r\n    font-size: 12.5px; \r\n    line-height: 1.4;\r\n  }\r\n}\r\n\r\n@media(prefers-reduced-motion: reduce) {\r\n  .dnm-stat-card { transition: none; transform: none !important; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"dnm-stats-section\" aria-label=\"Institute Statistics\" id=\"dnm-stats\">\r\n  <div class=\"wrap\">\r\n    \r\n    <!-- Unified Badge (Yellow Dot) -->\r\n    <div class=\"sub-title\">\r\n      <span>Why institutes love it<\/span>\r\n    <\/div>\r\n    \r\n    <!-- Gradient Heading & Description -->\r\n    <h2 class=\"h2\">The Results Institutes Achieve<\/h2>\r\n    <p class=\"lead\">Real results from institutes that <b>stopped managing spreadsheet or whatsapp group<\/b> and went back to focusing on teaching.<\/p>\r\n    \r\n    <!-- Stats Grid -->\r\n    <div class=\"dnm-stats-grid\">\r\n      \r\n      <!-- Card 1 -->\r\n      <div class=\"dnm-stat-card\">\r\n        <div class=\"dnm-stat-num\">\r\n          <span class=\"dnm-counter\" data-target=\"99.9\" data-decimals=\"1\">0<\/span>\r\n          <span class=\"suffix\">%<\/span>\r\n        <\/div>\r\n        <div class=\"dnm-stat-text\">Platform uptime<\/div>\r\n        <p class=\"dnm-stat-desc\">Always available when your institute needs it.<\/p>\r\n      <\/div>\r\n      \r\n      <!-- Card 2 -->\r\n      <div class=\"dnm-stat-card\">\r\n        <div class=\"dnm-stat-num\">\r\n          <span class=\"dnm-counter\" data-target=\"50\" data-decimals=\"0\">0<\/span>\r\n          <span class=\"suffix\">%<\/span>\r\n        <\/div>\r\n        <div class=\"dnm-stat-text\">Less admin work<\/div>\r\n        <p class=\"dnm-stat-desc\">Automate fees, attendance, and daily tasks.<\/p>\r\n      <\/div>\r\n      \r\n      <!-- Card 3 -->\r\n      <div class=\"dnm-stat-card\">\r\n        <div class=\"dnm-stat-num\">\r\n          <span class=\"dnm-counter\" data-target=\"10\" data-decimals=\"0\">0<\/span>\r\n          <span class=\"suffix\">\u00d7<\/span>\r\n        <\/div>\r\n        <div class=\"dnm-stat-text\">Faster admissions<\/div>\r\n        <p class=\"dnm-stat-desc\">Enroll students faster with a digital admission process.<\/p>\r\n      <\/div>\r\n      \r\n      <!-- Card 4 -->\r\n      <div class=\"dnm-stat-card\">\r\n        <div class=\"dnm-stat-num\">\r\n          <span class=\"dnm-counter\" data-target=\"30\" data-decimals=\"0\">0<\/span>\r\n          <span class=\"suffix\">%<\/span>\r\n        <\/div>\r\n        <div class=\"dnm-stat-text\">Better engagement<\/div>\r\n        <p class=\"dnm-stat-desc\">Keep students connected with smart tools and updates.<\/p>\r\n      <\/div>\r\n      \r\n    <\/div>\r\n    \r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function() {\r\n  const section = document.getElementById('dnm-stats');\r\n  if (!section) return;\r\n\r\n  const counters = section.querySelectorAll('.dnm-counter');\r\n  const animationDuration = 2000; \/\/ Total animation time in milliseconds\r\n\r\n  \/\/ Easing function for smooth deceleration\r\n  const easeOutQuart = (t) => 1 - (--t) * t * t * t;\r\n\r\n  const animateCounter = (counter) => {\r\n    const target = parseFloat(counter.getAttribute('data-target'));\r\n    const isFloat = counter.getAttribute('data-decimals') === '1';\r\n    let startTime = null;\r\n\r\n    const step = (currentTime) => {\r\n      if (!startTime) startTime = currentTime;\r\n      const progress = Math.min((currentTime - startTime) \/ animationDuration, 1);\r\n      const easedProgress = easeOutQuart(progress);\r\n      \r\n      const currentVal = easedProgress * target;\r\n\r\n      if (isFloat) {\r\n        counter.textContent = currentVal.toFixed(1);\r\n      } else {\r\n        counter.textContent = Math.floor(currentVal);\r\n      }\r\n\r\n      if (progress < 1) {\r\n        window.requestAnimationFrame(step);\r\n      } else {\r\n        \/\/ Ensure final number is exact\r\n        counter.textContent = isFloat ? target.toFixed(1) : target;\r\n      }\r\n    };\r\n\r\n    window.requestAnimationFrame(step);\r\n  };\r\n\r\n  \/\/ Intersection Observer to trigger when visible\r\n  const observerOptions = {\r\n    root: null,\r\n    rootMargin: '0px',\r\n    threshold: 0.2 \/\/ Trigger when 20% of section is visible\r\n  };\r\n\r\n  const observer = new IntersectionObserver((entries, obs) => {\r\n    entries.forEach(entry => {\r\n      if (entry.isIntersecting) {\r\n        counters.forEach(counter => animateCounter(counter));\r\n        obs.unobserve(entry.target); \/\/ Run only once\r\n      }\r\n    });\r\n  }, observerOptions);\r\n\r\n  observer.observe(section);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fc89a49 e-con-full e-flex e-con e-parent\" data-id=\"fc89a49\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-54ec972 elementor-widget elementor-widget-html\" data-id=\"54ec972\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"admin-panel\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Admin Portal \u2014 Animated<\/title>\r\n\r\n<!-- ============================================================\r\n     COPY FOR YOUR SITE: everything from the <style> tag below\r\n     down to the closing <\/div> of .dnm-admin-section.\r\n     (The <!DOCTYPE>, <head> and <body> wrapper is only so this\r\n     file previews on its own.)\r\n============================================================ -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap');\r\n\r\n:root {\r\n  --theme-color: #ffcf21;\r\n  --title-color: #232323;\r\n  --ink: #171717;\r\n  --line: #ECECE8;\r\n  --muted: rgba(23,23,23,.64);\r\n  --shadow-s: 0 1px 2px rgba(23,23,23,.06), 0 4px 14px rgba(23,23,23,.05);\r\n  --shadow-m: 0 8px 30px rgba(23,23,23,.10);\r\n}\r\n\r\n.dnm-admin-section {\r\n  font-family: 'Manrope', system-ui, sans-serif;\r\n  background-color: #FAFAF7;\r\n  padding: 96px 24px;\r\n  line-height: 1.6;\r\n  -webkit-font-smoothing: antialiased;\r\n  color: var(--ink);\r\n  overflow: hidden;\r\n}\r\n\r\n.dnm-admin-section * {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.dnm-admin-section .wrap {\r\n  max-width: 1180px;\r\n  margin: 0 auto;\r\n}\r\n\r\n\/* --- SPLIT LAYOUT --- *\/\r\n.dnm-admin-section .split {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 64px;\r\n  align-items: center;\r\n}\r\n\r\n\/* --- SUBTITLE BADGE --- *\/\r\n.dnm-admin-section .sub-title {\r\n  display: inline-block;\r\n  padding: 12px 20px;\r\n  border-radius: 12px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 13.5px;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.dnm-admin-section .sub-title span {\r\n  position: relative;\r\n  padding-left: 20px;\r\n}\r\n\r\n.dnm-admin-section .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  top: 50%;\r\n  width: 10px;\r\n  height: 10px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* --- GRADIENT HEADING --- *\/\r\n.dnm-admin-section .h3 {\r\n  font-size: clamp(24px, 4vw, 42px); \r\n  font-weight: 600; \r\n  letter-spacing: -0.022em; \r\n  margin-bottom: 16px; \r\n  line-height: 1.14; \r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n}\r\n\r\n.dnm-admin-section .lead {\r\n  color: #303030;\r\n  font-size: 15px;\r\n  font-weight: 500;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n\/* --- FEATURE LIST --- *\/\r\n.dnm-admin-section .feat-list {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 12px 18px;\r\n  margin-bottom: 32px;\r\n}\r\n\r\n.dnm-admin-section .feat-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  color: var(--title-color);\r\n}\r\n\r\n.dnm-admin-section .feat-item svg {\r\n  color: var(--ink);\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  padding: 3px;\r\n  flex: none;\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n\/* --- BUTTON --- *\/\r\n.dnm-admin-section .btn-line {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  font-weight: 600;\r\n  font-size: 15px;\r\n  border-radius: 999px;\r\n  padding: 12px 24px;\r\n  cursor: pointer;\r\n  background: #fff;\r\n  color: var(--ink);\r\n  border: 1px solid var(--line);\r\n  text-decoration: none;\r\n  transition: transform .15s ease, box-shadow .15s ease;\r\n  font-family: 'Manrope', sans-serif;\r\n}\r\n\r\n.dnm-admin-section .btn-line:hover {\r\n  transform: translateY(-1px);\r\n  box-shadow: var(--shadow-s);\r\n}\r\n\r\n\/* --- VISUAL MOCKUP (CSS CODED) --- *\/\r\n.dnm-admin-section .split-visual {\r\n  position: relative;\r\n  display: flex;\r\n  justify-content: center;\r\n}\r\n\r\n.dnm-admin-section .visual-card {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 22px;\r\n  box-shadow: var(--shadow-m);\r\n  overflow: hidden;\r\n  width: 100%;\r\n  max-width: 500px;\r\n}\r\n\r\n.dnm-admin-section .ui-top {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 12px 16px;\r\n  background: #fff;\r\n  border-bottom: 1px solid var(--line);\r\n}\r\n\r\n.dnm-admin-section .ui-title {\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  color: var(--title-color);\r\n}\r\n\r\n.dnm-admin-section .ui-pills {\r\n  display: flex;\r\n  gap: 6px;\r\n}\r\n\r\n.dnm-admin-section .ui-pill {\r\n  width: 44px;\r\n  height: 8px;\r\n  border-radius: 99px;\r\n  background: var(--line);\r\n}\r\n\r\n.dnm-admin-section .ui-stats {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 12px;\r\n}\r\n\r\n.dnm-admin-section .ui-stat {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 12px;\r\n  padding: 12px;\r\n}\r\n\r\n.dnm-admin-section .ui-stat b {\r\n  display: block;\r\n  font-family: 'Manrope', sans-serif;\r\n  font-size: 16px;\r\n  color: var(--title-color);\r\n  line-height: 1.2;\r\n}\r\n\r\n.dnm-admin-section .ui-stat span {\r\n  font-size: 10px;\r\n  color: var(--muted);\r\n  font-weight: 600;\r\n  line-height: 1.2;\r\n  display: block;\r\n  margin-top: 4px;\r\n}\r\n\r\n.dnm-admin-section .ui-chart {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 12px;\r\n  padding: 16px;\r\n}\r\n\r\n.dnm-admin-section .bars {\r\n  display: flex;\r\n  align-items: flex-end;\r\n  gap: 8px;\r\n  height: 84px;\r\n  margin-top: 12px;\r\n}\r\n\r\n.dnm-admin-section .bar {\r\n  flex: 1;\r\n  border-radius: 6px 6px 3px 3px;\r\n  background: #EDEDE8;\r\n}\r\n\r\n.dnm-admin-section .bar.y {\r\n  background: var(--theme-color);\r\n}\r\n\r\n\/* Float Card *\/\r\n.dnm-admin-section .float-card {\r\n  position: absolute;\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 16px;\r\n  box-shadow: var(--shadow-m);\r\n  padding: 14px 16px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  top: -20px;\r\n  right: -10px;\r\n  z-index: 2;\r\n}\r\n\r\n.dnm-admin-section .float-ic {\r\n  width: 36px;\r\n  height: 36px;\r\n  border-radius: 11px;\r\n  background: var(--theme-color);\r\n  display: grid;\r\n  place-items: center;\r\n  color: var(--ink);\r\n  flex: none;\r\n}\r\n\r\n.dnm-admin-section .float-card b {\r\n  display: block;\r\n  font-size: 13.5px;\r\n  color: var(--title-color);\r\n  line-height: 1.2;\r\n  margin-bottom: 2px;\r\n}\r\n\r\n.dnm-admin-section .float-card span {\r\n  font-size: 11.5px;\r\n  color: var(--muted);\r\n  font-weight: 500;\r\n}\r\n\r\n\r\n\/* ==================================================================\r\n   \u2726 ANIMATIONS (added)\r\n   ================================================================== *\/\r\n\r\n\/* --- The bar chart: continuous \"live data\" wave up & down --- *\/\r\n.dnm-admin-section .bar {\r\n  transform-origin: bottom center;\r\n  animation-name: dnmWave;\r\n  animation-duration: 2.4s;\r\n  animation-timing-function: ease-in-out;\r\n  animation-iteration-count: infinite;\r\n  animation-fill-mode: none;\r\n  will-change: transform;\r\n}\r\n\r\n\/* Staggered delays create a wave that travels across the 8 bars *\/\r\n.dnm-admin-section .bar:nth-child(1) { animation-delay: 0s;   }\r\n.dnm-admin-section .bar:nth-child(2) { animation-delay: .12s; }\r\n.dnm-admin-section .bar:nth-child(3) { animation-delay: .24s; }\r\n.dnm-admin-section .bar:nth-child(4) { animation-delay: .36s; }\r\n.dnm-admin-section .bar:nth-child(5) { animation-delay: .48s; }\r\n.dnm-admin-section .bar:nth-child(6) { animation-delay: .60s; }\r\n.dnm-admin-section .bar:nth-child(7) { animation-delay: .72s; }\r\n.dnm-admin-section .bar:nth-child(8) { animation-delay: .84s; }\r\n\r\n\/* The highlighted (yellow) bars wave AND pulse a soft glow *\/\r\n.dnm-admin-section .bar.y {\r\n  animation-name: dnmWave, dnmGlow;\r\n  animation-duration: 2.4s, 2.2s;\r\n  animation-timing-function: ease-in-out, ease-in-out;\r\n  animation-iteration-count: infinite, infinite;\r\n}\r\n\r\n@keyframes dnmWave {\r\n  0%, 100% { transform: scaleY(1);  }\r\n  50%      { transform: scaleY(.6); }\r\n}\r\n\r\n@keyframes dnmGlow {\r\n  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 207, 33, 0);    }\r\n  50%      { box-shadow: 0 0 12px 1px rgba(255, 207, 33, .6); }\r\n}\r\n\r\n\/* --- Header \"live\" pill gently blinks --- *\/\r\n.dnm-admin-section .ui-pill:last-child {\r\n  animation: dnmPillPulse 1.8s ease-in-out infinite;\r\n}\r\n@keyframes dnmPillPulse {\r\n  0%, 100% { opacity: 1;  }\r\n  50%      { opacity: .4; }\r\n}\r\n\r\n\/* --- Card + stats rise in on load --- *\/\r\n.dnm-admin-section .visual-card {\r\n  animation: dnmRise .8s cubic-bezier(.22,.61,.36,1) both;\r\n}\r\n.dnm-admin-section .ui-stat {\r\n  animation: dnmRise .7s cubic-bezier(.22,.61,.36,1) both;\r\n}\r\n.dnm-admin-section .ui-stat:nth-child(1) { animation-delay: .15s; }\r\n.dnm-admin-section .ui-stat:nth-child(2) { animation-delay: .28s; }\r\n.dnm-admin-section .ui-stat:nth-child(3) { animation-delay: .41s; }\r\n\r\n@keyframes dnmRise {\r\n  0%   { opacity: 0; transform: translateY(16px); }\r\n  100% { opacity: 1; transform: translateY(0);    }\r\n}\r\n\r\n\/* --- Floating payment card: pops in, then gently bobs --- *\/\r\n.dnm-admin-section .float-card {\r\n  animation:\r\n    dnmFloatIn  .6s  cubic-bezier(.34,1.56,.64,1) .35s both,\r\n    dnmFloatBob 3.6s ease-in-out 1s infinite;\r\n}\r\n@keyframes dnmFloatIn {\r\n  0%   { opacity: 0; transform: translateY(-10px) scale(.92); }\r\n  100% { opacity: 1; transform: translateY(0) scale(1);       }\r\n}\r\n@keyframes dnmFloatBob {\r\n  0%, 100% { transform: translateY(0);    }\r\n  50%      { transform: translateY(-7px); }\r\n}\r\n\r\n\/* Icon inside the floating card breathes *\/\r\n.dnm-admin-section .float-ic {\r\n  animation: dnmPulse 2.6s ease-in-out infinite;\r\n}\r\n@keyframes dnmPulse {\r\n  0%, 100% { transform: scale(1);    }\r\n  50%      { transform: scale(1.09); }\r\n}\r\n\r\n\r\n\/* --- MOBILE OPTIMIZATIONS --- *\/\r\n@media(max-width: 1020px) {\r\n  .dnm-admin-section .split { grid-template-columns: 1fr; gap: 48px; }\r\n}\r\n\r\n@media(max-width: 640px) {\r\n  .dnm-admin-section { padding: 64px 0; }\r\n  .dnm-admin-section .wrap { padding: 0 16px; }\r\n  \r\n  .dnm-admin-section .sub-title { padding: 10px 16px; font-size: 14px; margin-bottom: 16px; }\r\n  .dnm-admin-section .h3 { font-size: 26px; }\r\n  .dnm-admin-section .lead { font-size: 15px; }\r\n  \r\n  \/* Feature List: 2 Columns for Mobile *\/\r\n  .dnm-admin-section .feat-list { \r\n    grid-template-columns: repeat(2, 1fr); \r\n    gap: 12px 10px; \r\n  }\r\n  .dnm-admin-section .feat-item { \r\n    font-size: 13px; \/* Slightly smaller text to fit side-by-side *\/\r\n    gap: 8px; \r\n  }\r\n  .dnm-admin-section .feat-item svg { \r\n    width: 16px; \r\n    height: 16px; \r\n    padding: 2px; \r\n  }\r\n  \r\n  .dnm-admin-section .split-visual { \r\n    margin-top: 24px; \r\n    justify-content: flex-start; \r\n    flex-direction: column; \/* Allows UI card and floating card to stack properly *\/\r\n  }\r\n  \r\n  .dnm-admin-section .visual-card { border-radius: 16px; width: 100%; max-width: 100%; }\r\n  \r\n  .dnm-admin-section .ui-stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }\r\n  .dnm-admin-section .ui-stat { padding: 10px; }\r\n  .dnm-admin-section .ui-stat b { font-size: 14px; }\r\n  .dnm-admin-section .bars { height: 60px; gap: 6px; }\r\n  \r\n  \/* Adjust the floating card for mobile so it doesn't break out of screen *\/\r\n  .dnm-admin-section .float-card { \r\n    position: relative; \r\n    top: auto; \r\n    right: auto; \r\n    margin-top: 16px; \r\n    width: 100%; \r\n    box-shadow: var(--shadow-s); \r\n    border-radius: 12px;\r\n  }\r\n}\r\n\r\n@media(prefers-reduced-motion: reduce) {\r\n  .dnm-admin-section .btn-line { transition: none; }\r\n\r\n  \/* Turn off all the added motion for users who prefer reduced motion,\r\n     while keeping everything fully visible. *\/\r\n  .dnm-admin-section .bar,\r\n  .dnm-admin-section .bar.y,\r\n  .dnm-admin-section .ui-pill:last-child,\r\n  .dnm-admin-section .visual-card,\r\n  .dnm-admin-section .ui-stat,\r\n  .dnm-admin-section .float-card,\r\n  .dnm-admin-section .float-ic {\r\n    animation: none !important;\r\n    opacity: 1 !important;\r\n    transform: none !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<div class=\"dnm-admin-section\">\r\n  <div class=\"wrap split\">\r\n    \r\n    <!-- Text Content -->\r\n    <div>\r\n      <!-- Subtitle Badge -->\r\n      <div class=\"sub-title\">\r\n        <span>Admin Features<\/span>\r\n      <\/div>\r\n      \r\n      <!-- Gradient Heading updated to H3 -->\r\n      <h3 class=\"h3\">The Owner\u2019s Command Center for the Whole Institute<\/h3>\r\n      \r\n      <p class=\"lead\">Everything an owner or admin needs <b>from the first enquiry to the final certificate<\/b> visible on one dashboard.<\/p>\r\n      \r\n      <div class=\"feat-list\">\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Student management\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Batch management\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Attendance\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Revenue tracking\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Reports & analytics\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Lead CRM\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Fee collection\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Payment gateway\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          White label\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Certificates\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Role-based security\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Multi-branch\r\n        <\/div>\r\n      <\/div>\r\n      \r\n      <a class=\"btn-line\" href=#demo-booking>\r\n        Book Free Demo \r\n        <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14\"\/><path d=\"m12 5 7 7-7 7\"\/><\/svg>\r\n      <\/a>\r\n    <\/div>\r\n    \r\n    <!-- Visual Mockup (CSS Coded) -->\r\n    <div class=\"split-visual\">\r\n      <div style=\"width:100%;\">\r\n        <div class=\"visual-card\">\r\n          <div class=\"ui-top\">\r\n            <span class=\"ui-title\">Admin Portal \u00b7 Revenue<\/span>\r\n            <div class=\"ui-pills\">\r\n              <span class=\"ui-pill\"><\/span>\r\n              <span class=\"ui-pill\" style=\"background:var(--theme-color)\"><\/span>\r\n            <\/div>\r\n          <\/div>\r\n          \r\n          <div style=\"padding:20px; display:grid; gap:14px;\">\r\n            <div class=\"ui-stats\">\r\n              <div class=\"ui-stat\">\r\n                <b>\u20b924.6L<\/b>\r\n                <span>Collected this quarter<\/span>\r\n              <\/div>\r\n              <div class=\"ui-stat\">\r\n                <b>\u20b91.8L<\/b>\r\n                <span>Pending dues<\/span>\r\n              <\/div>\r\n              <div class=\"ui-stat\">\r\n                <b>312<\/b>\r\n                <span>New admissions<\/span>\r\n              <\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"ui-chart\">\r\n              <span style=\"font-size:10px;font-weight:700;color:var(--title-color)\">Admissions \u00b7 last 8 months<\/span>\r\n              <div class=\"bars\">\r\n                <div class=\"bar\" style=\"height:30%\"><\/div>\r\n                <div class=\"bar\" style=\"height:42%\"><\/div>\r\n                <div class=\"bar\" style=\"height:38%\"><\/div>\r\n                <div class=\"bar\" style=\"height:55%\"><\/div>\r\n                <div class=\"bar\" style=\"height:50%\"><\/div>\r\n                <div class=\"bar\" style=\"height:68%\"><\/div>\r\n                <div class=\"bar y\" style=\"height:76%\"><\/div>\r\n                <div class=\"bar y\" style=\"height:95%\"><\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        \r\n        <!-- Floating Card overlay -->\r\n        <div class=\"float-card\">\r\n          <span class=\"float-ic\">\r\n            <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"20\" height=\"14\" x=\"2\" y=\"5\" rx=\"2\"\/><line x1=\"2\" x2=\"22\" y1=\"10\" y2=\"10\"\/><\/svg>\r\n          <\/span>\r\n          <div>\r\n            <b>\u20b915,000 received<\/b>\r\n            <span>UPI \u00b7 Ananya Gupta \u00b7 Fees<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n    \r\n  <\/div>\r\n<\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dbd9a46 e-con-full e-flex e-con e-parent\" data-id=\"dbd9a46\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9f2ac55 elementor-widget elementor-widget-html\" data-id=\"9f2ac55\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"mentor-panel\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Mentor Portal \u2014 Animated<\/title>\r\n\r\n<!-- ============================================================\r\n     COPY FOR YOUR SITE: everything from the <style> tag below\r\n     down to the closing <\/div> of .dnm-mentor-section.\r\n     Pure CSS \u2014 no <script> needed.\r\n============================================================ -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&family=Caveat:wght@500;600;700&display=swap');\r\n\r\n:root {\r\n  --theme-color: #ffcf21;\r\n  --title-color: #232323;\r\n  --ink: #171717;\r\n  --line: #ECECE8;\r\n  --muted: rgba(23,23,23,.64);\r\n  --shadow-s: 0 1px 2px rgba(23,23,23,.06), 0 4px 14px rgba(23,23,23,.05);\r\n  --shadow-m: 0 8px 30px rgba(23,23,23,.10);\r\n}\r\n\r\n.dnm-mentor-section {\r\n  font-family: 'Manrope', system-ui, sans-serif;\r\n  background-color: #ffffff;\r\n  padding: 96px 24px;\r\n  line-height: 1.6;\r\n  -webkit-font-smoothing: antialiased;\r\n  color: var(--ink);\r\n  overflow: hidden;\r\n}\r\n\r\n.dnm-mentor-section * {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.dnm-mentor-section .wrap {\r\n  max-width: 1180px;\r\n  margin: 0 auto;\r\n}\r\n\r\n\/* --- SPLIT LAYOUT (REVERSED ON DESKTOP) --- *\/\r\n.dnm-mentor-section .split {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 64px;\r\n  align-items: center;\r\n}\r\n\r\n.dnm-mentor-section .split.rev .text-content {\r\n  order: 2;\r\n}\r\n\r\n.dnm-mentor-section .split.rev .split-visual {\r\n  order: 1;\r\n}\r\n\r\n\/* --- SUBTITLE BADGE --- *\/\r\n.dnm-mentor-section .sub-title {\r\n  display: inline-block;\r\n  padding: 12px 20px;\r\n  border-radius: 12px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 13.5px;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.dnm-mentor-section .sub-title span {\r\n  position: relative;\r\n  padding-left: 20px;\r\n}\r\n\r\n.dnm-mentor-section .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  top: 50%;\r\n  width: 10px;\r\n  height: 10px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* --- GRADIENT HEADING --- *\/\r\n.dnm-mentor-section .h3 {\r\n  font-size: clamp(24px, 4vw, 42px); \r\n  font-weight: 600; \r\n  letter-spacing: -0.022em; \r\n  margin-bottom: 16px; \r\n  line-height: 1.14; \r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n}\r\n\r\n.dnm-mentor-section .lead {\r\n  color: #303030;\r\n  font-size: 15px;\r\n  font-weight: 500;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n\/* --- FEATURE LIST --- *\/\r\n.dnm-mentor-section .feat-list {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 12px 18px;\r\n  margin-bottom: 32px;\r\n}\r\n\r\n.dnm-mentor-section .feat-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  color: var(--title-color);\r\n}\r\n\r\n.dnm-mentor-section .feat-item svg {\r\n  color: var(--ink);\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  padding: 3px;\r\n  flex: none;\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n\/* --- BUTTON --- *\/\r\n.dnm-mentor-section .btn-line {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  font-weight: 600;\r\n  font-size: 15px;\r\n  border-radius: 999px;\r\n  padding: 12px 24px;\r\n  cursor: pointer;\r\n  background: #fff;\r\n  color: var(--ink);\r\n  border: 1px solid var(--line);\r\n  text-decoration: none;\r\n  transition: transform .15s ease, box-shadow .15s ease;\r\n  font-family: 'Manrope', sans-serif;\r\n}\r\n\r\n.dnm-mentor-section .btn-line:hover {\r\n  transform: translateY(-1px);\r\n  box-shadow: var(--shadow-s);\r\n}\r\n\r\n\/* --- VISUAL MOCKUP (CSS CODED) --- *\/\r\n.dnm-mentor-section .split-visual {\r\n  position: relative;\r\n  display: flex;\r\n  justify-content: center;\r\n}\r\n\r\n.dnm-mentor-section .visual-card {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 22px;\r\n  box-shadow: var(--shadow-m);\r\n  overflow: hidden;\r\n  width: 100%;\r\n  max-width: 500px;\r\n}\r\n\r\n.dnm-mentor-section .ui-top {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 12px 16px;\r\n  background: #fff;\r\n  border-bottom: 1px solid var(--line);\r\n}\r\n\r\n.dnm-mentor-section .ui-title {\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  color: var(--title-color);\r\n}\r\n\r\n.dnm-mentor-section .chip-live {\r\n  background: var(--theme-color);\r\n  color: var(--ink);\r\n  border: none;\r\n  font-size: 10px;\r\n  font-weight: 700;\r\n  padding: 4px 10px;\r\n  border-radius: 999px;\r\n  letter-spacing: 0.05em;\r\n}\r\n\r\n.dnm-mentor-section .ui-whiteboard {\r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  border-radius: 14px;\r\n  height: 160px;\r\n  color: #fff;\r\n  position: relative;\r\n  overflow: hidden;\r\n  padding: 12px 14px;\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.dnm-mentor-section .ui-stats {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 12px;\r\n}\r\n\r\n.dnm-mentor-section .ui-stat {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 12px;\r\n  padding: 12px;\r\n}\r\n\r\n.dnm-mentor-section .ui-stat b {\r\n  display: block;\r\n  font-family: 'Manrope', sans-serif;\r\n  font-size: 16px;\r\n  color: var(--title-color);\r\n  line-height: 1.2;\r\n}\r\n\r\n.dnm-mentor-section .ui-stat span {\r\n  font-size: 10px;\r\n  color: var(--muted);\r\n  font-weight: 600;\r\n  line-height: 1.2;\r\n  display: block;\r\n  margin-top: 4px;\r\n}\r\n\r\n\/* Float Card *\/\r\n.dnm-mentor-section .float-card {\r\n  position: absolute;\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 16px;\r\n  box-shadow: var(--shadow-m);\r\n  padding: 14px 16px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  bottom: -20px;\r\n  left: -10px;\r\n  z-index: 2;\r\n}\r\n\r\n.dnm-mentor-section .float-ic {\r\n  width: 36px;\r\n  height: 36px;\r\n  border-radius: 11px;\r\n  background: var(--theme-color);\r\n  display: grid;\r\n  place-items: center;\r\n  color: var(--ink);\r\n  flex: none;\r\n}\r\n\r\n.dnm-mentor-section .float-card b {\r\n  display: block;\r\n  font-size: 13.5px;\r\n  color: var(--title-color);\r\n  line-height: 1.2;\r\n  margin-bottom: 2px;\r\n}\r\n\r\n.dnm-mentor-section .float-card span {\r\n  font-size: 11.5px;\r\n  color: var(--muted);\r\n  font-weight: 500;\r\n}\r\n\r\n\r\n\/* ==================================================================\r\n   \u2726 ANIMATIONS + LIVE WHITEBOARD (added)\r\n   ================================================================== *\/\r\n\r\n\/* --- Live-class indicator pinned to the top of the board --- *\/\r\n.dnm-mentor-section .wb-live {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  font-size: 10px;\r\n  font-weight: 700;\r\n  letter-spacing: .08em;\r\n  color: rgba(255,255,255,.92);\r\n}\r\n.dnm-mentor-section .wb-live-dot {\r\n  position: relative;\r\n  width: 8px;\r\n  height: 8px;\r\n  border-radius: 50%;\r\n  background: #ff4d4f;\r\n  flex: none;\r\n  animation: wbLiveDot 1.4s ease-in-out infinite;\r\n}\r\n.dnm-mentor-section .wb-live-dot::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: -4px;\r\n  border-radius: 50%;\r\n  border: 2px solid rgba(255,77,79,.55);\r\n  animation: wbLiveRing 1.7s ease-out infinite;\r\n}\r\n.dnm-mentor-section .wb-live-label { color: #fff; }\r\n.dnm-mentor-section .wb-live-sub {\r\n  margin-left: auto;\r\n  font-weight: 600;\r\n  letter-spacing: 0;\r\n  color: rgba(255,255,255,.7);\r\n}\r\n\r\n\/* tiny \"live audio\" equaliser bars *\/\r\n.dnm-mentor-section .wb-eqbars {\r\n  display: inline-flex;\r\n  align-items: flex-end;\r\n  gap: 2px;\r\n  height: 11px;\r\n}\r\n.dnm-mentor-section .wb-eqbars i {\r\n  width: 2px;\r\n  height: 100%;\r\n  border-radius: 1px;\r\n  background: var(--theme-color);\r\n  transform-origin: bottom center;\r\n  animation: wbBars .9s ease-in-out infinite;\r\n}\r\n.dnm-mentor-section .wb-eqbars i:nth-child(1){ animation-delay: 0s;   }\r\n.dnm-mentor-section .wb-eqbars i:nth-child(2){ animation-delay: .15s; }\r\n.dnm-mentor-section .wb-eqbars i:nth-child(3){ animation-delay: .3s;  }\r\n.dnm-mentor-section .wb-eqbars i:nth-child(4){ animation-delay: .45s; }\r\n\r\n\/* --- The equation that writes itself on the board --- *\/\r\n.dnm-mentor-section .wb-eq-area {\r\n  flex: 1;\r\n  display: grid;\r\n  place-items: center;\r\n  min-height: 0;\r\n}\r\n.dnm-mentor-section .wb-eq {\r\n  position: relative;\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  max-width: 100%;\r\n}\r\n.dnm-mentor-section .wb-eq-text {\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  font-family: 'Caveat', cursive;\r\n  font-weight: 600;\r\n  font-size: clamp(20px, 4.6vw, 34px);\r\n  line-height: 1;\r\n  color: #fff;\r\n  letter-spacing: .5px;\r\n  text-shadow: 0 1px 10px rgba(255,255,255,.12);\r\n  clip-path: inset(0 100% 0 -6px);          \/* hidden until \"written\" *\/\r\n  animation: wbWrite 6s ease-in-out infinite;\r\n}\r\n.dnm-mentor-section .wb-eq-text sup { font-size: .62em; }\r\n\r\n\/* the marker tip that rides the writing edge *\/\r\n.dnm-mentor-section .wb-marker {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 0;\r\n  width: 9px;\r\n  height: 9px;\r\n  border-radius: 50%;\r\n  background: var(--theme-color);\r\n  box-shadow: 0 0 10px 2px rgba(255,207,33,.7);\r\n  transform: translate(-50%, -50%);\r\n  opacity: 0;\r\n  animation: wbMarker 6s ease-in-out infinite;\r\n}\r\n\r\n\/* --- Header LIVE chip gets a blinking dot --- *\/\r\n.dnm-mentor-section .chip-live {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 5px;\r\n}\r\n.dnm-mentor-section .chip-dot {\r\n  width: 6px;\r\n  height: 6px;\r\n  border-radius: 50%;\r\n  background: var(--ink);\r\n  animation: dnmBlink 1s steps(1, end) infinite;\r\n}\r\n\r\n\/* --- Card + stats rise in on load --- *\/\r\n.dnm-mentor-section .visual-card {\r\n  animation: dnmRise .8s cubic-bezier(.22,.61,.36,1) both;\r\n}\r\n.dnm-mentor-section .ui-stat {\r\n  animation: dnmRise .7s cubic-bezier(.22,.61,.36,1) both;\r\n}\r\n.dnm-mentor-section .ui-stat:nth-child(1){ animation-delay: .2s;  }\r\n.dnm-mentor-section .ui-stat:nth-child(2){ animation-delay: .33s; }\r\n.dnm-mentor-section .ui-stat:nth-child(3){ animation-delay: .46s; }\r\n\r\n\/* --- Floating card: pops in, then gently bobs --- *\/\r\n.dnm-mentor-section .float-card {\r\n  animation:\r\n    dnmFloatIn  .6s  cubic-bezier(.34,1.56,.64,1) .4s both,\r\n    dnmFloatBob 3.6s ease-in-out 1.1s infinite;\r\n}\r\n.dnm-mentor-section .float-ic {\r\n  animation: dnmPulse 2.6s ease-in-out infinite;\r\n}\r\n\r\n\/* --- Keyframes --- *\/\r\n@keyframes dnmRise {\r\n  0%   { opacity: 0; transform: translateY(16px); }\r\n  100% { opacity: 1; transform: translateY(0);    }\r\n}\r\n@keyframes dnmFloatIn {\r\n  0%   { opacity: 0; transform: translateY(10px) scale(.92); }\r\n  100% { opacity: 1; transform: translateY(0) scale(1);      }\r\n}\r\n@keyframes dnmFloatBob {\r\n  0%, 100% { transform: translateY(0);    }\r\n  50%      { transform: translateY(-7px); }\r\n}\r\n@keyframes dnmPulse {\r\n  0%, 100% { transform: scale(1);    }\r\n  50%      { transform: scale(1.09); }\r\n}\r\n@keyframes dnmBlink {\r\n  0%, 100% { opacity: 1;   }\r\n  50%      { opacity: .15; }\r\n}\r\n@keyframes wbLiveDot {\r\n  0%, 100% { opacity: 1;   }\r\n  50%      { opacity: .35; }\r\n}\r\n@keyframes wbLiveRing {\r\n  0%   { transform: scale(.6);  opacity: .8; }\r\n  100% { transform: scale(1.9); opacity: 0;  }\r\n}\r\n@keyframes wbBars {\r\n  0%, 100% { transform: scaleY(.35); }\r\n  50%      { transform: scaleY(1);   }\r\n}\r\n\/* clip reveals the ink left-to-right, holds, then wipes away *\/\r\n@keyframes wbWrite {\r\n  0%   { clip-path: inset(0 100% 0 -6px); }\r\n  38%  { clip-path: inset(0 -6px 0 -6px); }\r\n  70%  { clip-path: inset(0 -6px 0 -6px); }\r\n  92%  { clip-path: inset(0 100% 0 -6px); }\r\n  100% { clip-path: inset(0 100% 0 -6px); }\r\n}\r\n\/* marker rides the writing edge, then lifts off *\/\r\n@keyframes wbMarker {\r\n  0%   { left: 0;    opacity: 0; }\r\n  4%   { opacity: 1; }\r\n  38%  { left: 100%; opacity: 1; }\r\n  44%  { left: 100%; opacity: 0; }\r\n  100% { left: 0;    opacity: 0; }\r\n}\r\n\r\n\r\n\/* --- MOBILE OPTIMIZATIONS --- *\/\r\n@media(max-width: 1020px) {\r\n  .dnm-mentor-section .split { grid-template-columns: 1fr; gap: 48px; }\r\n  \r\n  \/* Reset order for mobile so text comes first *\/\r\n  .dnm-mentor-section .split.rev .text-content { order: 1; }\r\n  .dnm-mentor-section .split.rev .split-visual { order: 2; }\r\n}\r\n\r\n@media(max-width: 640px) {\r\n  .dnm-mentor-section { padding: 64px 0; }\r\n  .dnm-mentor-section .wrap { padding: 0 16px; }\r\n  \r\n  .dnm-mentor-section .sub-title { padding: 10px 16px; font-size: 14px; margin-bottom: 16px; }\r\n  .dnm-mentor-section .h3 { font-size: 26px; }\r\n  .dnm-mentor-section .lead { font-size: 15.5px; }\r\n  \r\n  \/* Feature List: 2 Columns for Mobile *\/\r\n  .dnm-mentor-section .feat-list { \r\n    grid-template-columns: repeat(2, 1fr); \r\n    gap: 12px 10px; \r\n  }\r\n  .dnm-mentor-section .feat-item { \r\n    font-size: 13px; \/* Slightly smaller text to fit side-by-side *\/\r\n    gap: 8px; \r\n  }\r\n  .dnm-mentor-section .feat-item svg { \r\n    width: 16px; \r\n    height: 16px; \r\n    padding: 2px; \r\n  }\r\n  \r\n  .dnm-mentor-section .split-visual { \r\n    margin-top: 24px; \r\n    justify-content: flex-start; \r\n    flex-direction: column; \r\n  }\r\n  \r\n  .dnm-mentor-section .visual-card { border-radius: 16px; width: 100%; max-width: 100%; }\r\n  .dnm-mentor-section .ui-stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }\r\n  .dnm-mentor-section .ui-stat { padding: 10px; }\r\n  .dnm-mentor-section .ui-stat b { font-size: 14px; }\r\n  \r\n  \/* Adjust the floating card for mobile so it doesn't break out of screen *\/\r\n  .dnm-mentor-section .float-card { \r\n    position: relative; \r\n    bottom: auto; \r\n    left: auto; \r\n    margin-top: 16px; \r\n    width: 100%; \r\n    box-shadow: var(--shadow-s); \r\n    border-radius: 12px;\r\n  }\r\n}\r\n\r\n@media(prefers-reduced-motion: reduce) {\r\n  .dnm-mentor-section .btn-line { transition: none; }\r\n\r\n  \/* Turn off the added motion; keep everything visible & readable. *\/\r\n  .dnm-mentor-section .visual-card,\r\n  .dnm-mentor-section .ui-stat,\r\n  .dnm-mentor-section .float-card,\r\n  .dnm-mentor-section .float-ic,\r\n  .dnm-mentor-section .chip-dot,\r\n  .dnm-mentor-section .wb-live-dot,\r\n  .dnm-mentor-section .wb-eqbars i,\r\n  .dnm-mentor-section .wb-eq-text,\r\n  .dnm-mentor-section .wb-marker {\r\n    animation: none !important;\r\n  }\r\n  .dnm-mentor-section .wb-live-dot::after { animation: none !important; opacity: 0 !important; }\r\n  .dnm-mentor-section .visual-card,\r\n  .dnm-mentor-section .ui-stat,\r\n  .dnm-mentor-section .float-card {\r\n    opacity: 1 !important;\r\n    transform: none !important;\r\n  }\r\n  .dnm-mentor-section .wb-eq-text { clip-path: none !important; } \/* show full equation *\/\r\n  .dnm-mentor-section .wb-marker { display: none !important; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"dnm-mentor-section\">\r\n  <!-- Note the 'rev' class here which switches the layout on desktop -->\r\n  <div class=\"wrap split rev\">\r\n    \r\n    <!-- Text Content -->\r\n    <div class=\"text-content\">\r\n      <!-- Subtitle Badge -->\r\n      <div class=\"sub-title\">\r\n        <span>Mentor Portal Features<\/span>\r\n      <\/div>\r\n      \r\n      <!-- Gradient Heading updated to H3 -->\r\n      <h3 class=\"h3\">Teachers Teach. The Platform Handles the Rest.<\/h3>\r\n      \r\n      <p class=\"lead\">Mentors run <b>live classes, share content and track every batch<\/b> without touching a register or a spreadsheet.<\/p>\r\n      \r\n      <div class=\"feat-list\">\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Live classes\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Interactive whiteboard\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Assignments\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Content upload\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Tests & evaluation\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Batch analytics\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Attendance\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Lesson planning\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Performance tracking\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Doubt resolution\r\n        <\/div>\r\n      <\/div>\r\n      \r\n      <a class=\"btn-line\" href=#demo-booking>\r\n        Book Free Demo \r\n        <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14\"\/><path d=\"m12 5 7 7-7 7\"\/><\/svg>\r\n      <\/a>\r\n    <\/div>\r\n    \r\n    <!-- Visual Mockup (CSS Coded) -->\r\n    <div class=\"split-visual\">\r\n      <div style=\"width:100%;\">\r\n        <div class=\"visual-card\">\r\n          <div class=\"ui-top\">\r\n            <span class=\"ui-title\">Mentor Portal \u00b7 Live class<\/span>\r\n            <span class=\"chip-live\"><span class=\"chip-dot\"><\/span>LIVE<\/span>\r\n          <\/div>\r\n          \r\n          <div style=\"padding:20px; display:grid; gap:12px;\">\r\n            \r\n            <!-- Whiteboard: live indicator on top + self-writing equation -->\r\n            <div class=\"ui-whiteboard\">\r\n              <div class=\"wb-live\">\r\n                <span class=\"wb-live-dot\"><\/span>\r\n                <span class=\"wb-live-label\">LIVE<\/span>\r\n                <span class=\"wb-eqbars\"><i><\/i><i><\/i><i><\/i><i><\/i><\/span>\r\n                <span class=\"wb-live-sub\">84 watching<\/span>\r\n              <\/div>\r\n              <div class=\"wb-eq-area\">\r\n                <div class=\"wb-eq\">\r\n                  <span class=\"wb-eq-text\">(a + b)<sup>2<\/sup> = a<sup>2<\/sup> + 2ab + b<sup>2<\/sup><\/span>\r\n                  <span class=\"wb-marker\"><\/span>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"ui-stats\">\r\n              <div class=\"ui-stat\">\r\n                <b>84<\/b>\r\n                <span>Live viewers<\/span>\r\n              <\/div>\r\n              <div class=\"ui-stat\">\r\n                <b>12<\/b>\r\n                <span>Doubts raised<\/span>\r\n              <\/div>\r\n              <div class=\"ui-stat\">\r\n                <b>96%<\/b>\r\n                <span>Attendance<\/span>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        \r\n        <!-- Floating Card overlay (Bottom Left) -->\r\n        <div class=\"float-card\">\r\n          <span class=\"float-ic\">\r\n            <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3v12\"\/><path d=\"m17 8-5-5-5 5\"\/><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"\/><\/svg>\r\n          <\/span>\r\n          <div>\r\n            <b>Notes uploaded<\/b>\r\n            <span>Ch 14 \u00b7 shared with 3 batches<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n    \r\n  <\/div>\r\n<\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4b94750 e-con-full e-flex e-con e-parent\" data-id=\"4b94750\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6e1c298 elementor-widget elementor-widget-html\" data-id=\"6e1c298\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"student-app\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Student App \u2014 Animated<\/title>\r\n\r\n<!-- ============================================================\r\n     COPY FOR YOUR SITE: everything from the <style> tag below\r\n     down to the closing <\/div> of .dnm-student-section.\r\n     No <script> needed for this one \u2014 it's pure CSS.\r\n============================================================ -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap');\r\n\r\n:root {\r\n  --theme-color: #ffcf21;\r\n  --title-color: #232323;\r\n  --ink: #171717;\r\n  --line: #ECECE8;\r\n  --muted: rgba(23,23,23,.64);\r\n  --shadow-s: 0 1px 2px rgba(23,23,23,.06), 0 4px 14px rgba(23,23,23,.05);\r\n  --shadow-m: 0 8px 30px rgba(23,23,23,.10);\r\n}\r\n\r\n.dnm-student-section {\r\n  font-family: 'Manrope', system-ui, sans-serif;\r\n  background-color: #FAFAF7;\r\n  padding: 96px 24px;\r\n  line-height: 1.6;\r\n  -webkit-font-smoothing: antialiased;\r\n  color: var(--ink);\r\n}\r\n\r\n.dnm-student-section * {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.dnm-student-section .wrap {\r\n  max-width: 1180px;\r\n  margin: 0 auto;\r\n}\r\n\r\n\/* --- SPLIT LAYOUT --- *\/\r\n.dnm-student-section .split {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 64px;\r\n  align-items: center;\r\n}\r\n\r\n\/* --- SUBTITLE BADGE --- *\/\r\n.dnm-student-section .sub-title {\r\n  display: inline-block;\r\n  padding: 12px 20px;\r\n  border-radius: 12px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 13.5px;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.dnm-student-section .sub-title span {\r\n  position: relative;\r\n  padding-left: 20px;\r\n}\r\n\r\n.dnm-student-section .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  top: 50%;\r\n  width: 10px;\r\n  height: 10px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* --- GRADIENT HEADING --- *\/\r\n.dnm-student-section .h3 {\r\n  font-size: clamp(24px, 4vw, 42px); \r\n  font-weight: 600; \r\n  letter-spacing: -0.022em; \r\n  margin-bottom: 16px; \r\n  line-height: 1.14; \r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n}\r\n\r\n.dnm-student-section .lead {\r\n  color: #303030;\r\n  font-size: 15px;\r\n  font-weight: 500;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n\/* --- FEATURE LIST --- *\/\r\n.dnm-student-section .feat-list {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 12px 18px;\r\n  margin-bottom: 32px;\r\n}\r\n\r\n.dnm-student-section .feat-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  color: var(--title-color);\r\n}\r\n\r\n.dnm-student-section .feat-item svg {\r\n  color: var(--ink);\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  padding: 3px;\r\n  flex: none;\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n\/* --- BUTTON --- *\/\r\n.dnm-student-section .btn-line {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  font-weight: 600;\r\n  font-size: 15px;\r\n  border-radius: 999px;\r\n  padding: 12px 24px;\r\n  cursor: pointer;\r\n  background: #fff;\r\n  color: var(--ink);\r\n  border: 1px solid var(--line);\r\n  text-decoration: none;\r\n  transition: transform .15s ease, box-shadow .15s ease;\r\n  font-family: 'Manrope', sans-serif;\r\n}\r\n\r\n.dnm-student-section .btn-line:hover {\r\n  transform: translateY(-1px);\r\n  box-shadow: var(--shadow-s);\r\n}\r\n\r\n\/* --- VISUAL MOCKUP --- *\/\r\n.dnm-student-section .split-visual {\r\n  position: relative;\r\n}\r\n\r\n.dnm-student-section .visual-card {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 22px;\r\n  box-shadow: var(--shadow-m);\r\n  overflow: hidden;\r\n}\r\n\r\n.dnm-student-section .ui-top {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 12px 16px;\r\n  background: #fff;\r\n  border-bottom: 1px solid var(--line);\r\n}\r\n\r\n.dnm-student-section .ui-title {\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n}\r\n\r\n.dnm-student-section .ui-pills {\r\n  display: flex;\r\n  gap: 6px;\r\n}\r\n\r\n.dnm-student-section .ui-pill {\r\n  width: 44px;\r\n  height: 8px;\r\n  border-radius: 99px;\r\n  background: var(--line);\r\n}\r\n\r\n.dnm-student-section .ui-stats {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 12px;\r\n}\r\n\r\n.dnm-student-section .ui-stat {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 12px;\r\n  padding: 12px;\r\n}\r\n\r\n.dnm-student-section .ui-stat b {\r\n  display: block;\r\n  font-family: 'Manrope', sans-serif;\r\n  font-size: 16px;\r\n  color: var(--title-color);\r\n  line-height: 1.2;\r\n}\r\n\r\n.dnm-student-section .ui-stat span {\r\n  font-size: 10px;\r\n  color: var(--muted);\r\n  font-weight: 600;\r\n  line-height: 1.2;\r\n  display: block;\r\n  margin-top: 4px;\r\n}\r\n\r\n.dnm-student-section .ui-chart {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 12px;\r\n  padding: 16px;\r\n}\r\n\r\n.dnm-student-section .bars {\r\n  display: flex;\r\n  align-items: flex-end;\r\n  gap: 8px;\r\n  height: 84px;\r\n  margin-top: 12px;\r\n}\r\n\r\n.dnm-student-section .bar {\r\n  flex: 1;\r\n  border-radius: 6px 6px 3px 3px;\r\n  background: #EDEDE8;\r\n}\r\n\r\n.dnm-student-section .bar.y {\r\n  background: var(--theme-color);\r\n}\r\n\r\n\/* Float Card *\/\r\n.dnm-student-section .float-card {\r\n  position: absolute;\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 16px;\r\n  box-shadow: var(--shadow-m);\r\n  padding: 14px 16px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  top: -20px;\r\n  left: -10px;\r\n}\r\n\r\n.dnm-student-section .float-ic {\r\n  width: 36px;\r\n  height: 36px;\r\n  border-radius: 11px;\r\n  background: var(--theme-color);\r\n  display: grid;\r\n  place-items: center;\r\n  color: var(--ink);\r\n  flex: none;\r\n}\r\n\r\n.dnm-student-section .float-card b {\r\n  display: block;\r\n  font-size: 13.5px;\r\n  color: var(--title-color);\r\n  line-height: 1.2;\r\n  margin-bottom: 2px;\r\n}\r\n\r\n.dnm-student-section .float-card span {\r\n  font-size: 11.5px;\r\n  color: var(--muted);\r\n  font-weight: 500;\r\n}\r\n\r\n\r\n\/* ==================================================================\r\n   \u2726 ANIMATIONS (added) \u2014 pure CSS, no number count-up\r\n   ================================================================== *\/\r\n\r\n\/* --- The bar chart: continuous \"live data\" wave up & down --- *\/\r\n.dnm-student-section .bar {\r\n  transform-origin: bottom center;\r\n  animation-name: dnmWave;\r\n  animation-duration: 2.4s;\r\n  animation-timing-function: ease-in-out;\r\n  animation-iteration-count: infinite;\r\n  animation-fill-mode: none;\r\n  will-change: transform;\r\n}\r\n\r\n\/* Staggered delays create a wave that travels across the 8 bars *\/\r\n.dnm-student-section .bar:nth-child(1) { animation-delay: 0s;   }\r\n.dnm-student-section .bar:nth-child(2) { animation-delay: .12s; }\r\n.dnm-student-section .bar:nth-child(3) { animation-delay: .24s; }\r\n.dnm-student-section .bar:nth-child(4) { animation-delay: .36s; }\r\n.dnm-student-section .bar:nth-child(5) { animation-delay: .48s; }\r\n.dnm-student-section .bar:nth-child(6) { animation-delay: .60s; }\r\n.dnm-student-section .bar:nth-child(7) { animation-delay: .72s; }\r\n.dnm-student-section .bar:nth-child(8) { animation-delay: .84s; }\r\n\r\n\/* The highlighted (yellow) bar waves AND pulses a soft glow *\/\r\n.dnm-student-section .bar.y {\r\n  animation-name: dnmWave, dnmGlow;\r\n  animation-duration: 2.4s, 2.2s;\r\n  animation-timing-function: ease-in-out, ease-in-out;\r\n  animation-iteration-count: infinite, infinite;\r\n}\r\n\r\n@keyframes dnmWave {\r\n  0%, 100% { transform: scaleY(1);  }\r\n  50%      { transform: scaleY(.6); }\r\n}\r\n\r\n@keyframes dnmGlow {\r\n  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 207, 33, 0);    }\r\n  50%      { box-shadow: 0 0 12px 1px rgba(255, 207, 33, .6); }\r\n}\r\n\r\n\/* --- Header \"live\" pill gently blinks (the accent one is first here) --- *\/\r\n.dnm-student-section .ui-pill:first-child {\r\n  animation: dnmPillPulse 1.8s ease-in-out infinite;\r\n}\r\n@keyframes dnmPillPulse {\r\n  0%, 100% { opacity: 1;  }\r\n  50%      { opacity: .4; }\r\n}\r\n\r\n\/* --- Card + stats rise in on load --- *\/\r\n.dnm-student-section .visual-card {\r\n  animation: dnmRise .8s cubic-bezier(.22,.61,.36,1) both;\r\n}\r\n.dnm-student-section .ui-stat {\r\n  animation: dnmRise .7s cubic-bezier(.22,.61,.36,1) both;\r\n}\r\n.dnm-student-section .ui-stat:nth-child(1) { animation-delay: .15s; }\r\n.dnm-student-section .ui-stat:nth-child(2) { animation-delay: .28s; }\r\n.dnm-student-section .ui-stat:nth-child(3) { animation-delay: .41s; }\r\n\r\n@keyframes dnmRise {\r\n  0%   { opacity: 0; transform: translateY(16px); }\r\n  100% { opacity: 1; transform: translateY(0);    }\r\n}\r\n\r\n\/* --- Floating card: pops in, then gently bobs --- *\/\r\n.dnm-student-section .float-card {\r\n  animation:\r\n    dnmFloatIn  .6s  cubic-bezier(.34,1.56,.64,1) .35s both,\r\n    dnmFloatBob 3.6s ease-in-out 1s infinite;\r\n}\r\n@keyframes dnmFloatIn {\r\n  0%   { opacity: 0; transform: translateY(-10px) scale(.92); }\r\n  100% { opacity: 1; transform: translateY(0) scale(1);       }\r\n}\r\n@keyframes dnmFloatBob {\r\n  0%, 100% { transform: translateY(0);    }\r\n  50%      { transform: translateY(-7px); }\r\n}\r\n\r\n\/* Icon inside the floating card breathes *\/\r\n.dnm-student-section .float-ic {\r\n  animation: dnmPulse 2.6s ease-in-out infinite;\r\n}\r\n@keyframes dnmPulse {\r\n  0%, 100% { transform: scale(1);    }\r\n  50%      { transform: scale(1.09); }\r\n}\r\n\r\n\r\n\/* --- MOBILE OPTIMIZATIONS --- *\/\r\n@media(max-width: 1020px) {\r\n  .dnm-student-section .split { grid-template-columns: 1fr; gap: 48px; }\r\n}\r\n\r\n@media(max-width: 640px) {\r\n  .dnm-student-section { padding: 64px 0; }\r\n  .dnm-student-section .wrap { padding: 0 18px; }\r\n  \r\n  .dnm-student-section .sub-title { padding: 10px 16px; font-size: 14px; margin-bottom: 16px; }\r\n  .dnm-student-section .h3 { font-size: 26px; }\r\n  .dnm-student-section .lead { font-size: 14px; }\r\n  \r\n  \/* Feature List: 2 Columns for Mobile *\/\r\n  .dnm-student-section .feat-list { \r\n    grid-template-columns: repeat(2, 1fr); \r\n    gap: 12px 10px; \r\n  }\r\n  .dnm-student-section .feat-item { \r\n    font-size: 13px; \/* Slightly smaller text to fit side-by-side *\/\r\n    gap: 8px; \r\n  }\r\n  .dnm-student-section .feat-item svg { \r\n    width: 16px; \r\n    height: 16px; \r\n    padding: 2px; \r\n  }\r\n  \r\n  .dnm-student-section .split-visual { margin-top: 16px; }\r\n  .dnm-student-section .visual-card { border-radius: 18px; }\r\n  .dnm-student-section .float-card { position: static; margin-top: 16px; width: 100%; box-shadow: var(--shadow-s); }\r\n  \r\n  .dnm-student-section .ui-stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }\r\n  .dnm-student-section .ui-stat { padding: 10px; }\r\n  .dnm-student-section .ui-stat b { font-size: 14px; }\r\n  .dnm-student-section .bars { height: 60px; gap: 6px; }\r\n}\r\n\r\n@media(prefers-reduced-motion: reduce) {\r\n  .dnm-student-section .btn-line { transition: none; }\r\n\r\n  \/* Turn off all the added motion for users who prefer reduced motion,\r\n     while keeping everything fully visible. *\/\r\n  .dnm-student-section .bar,\r\n  .dnm-student-section .bar.y,\r\n  .dnm-student-section .ui-pill:first-child,\r\n  .dnm-student-section .visual-card,\r\n  .dnm-student-section .ui-stat,\r\n  .dnm-student-section .float-card,\r\n  .dnm-student-section .float-ic {\r\n    animation: none !important;\r\n    opacity: 1 !important;\r\n    transform: none !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<div class=\"dnm-student-section\">\r\n  <div class=\"wrap split\">\r\n    \r\n    <!-- Text Content -->\r\n    <div>\r\n      <!-- Subtitle Badge -->\r\n      <div class=\"sub-title\">\r\n        <span>Student App Features<\/span>\r\n      <\/div>\r\n      \r\n      <!-- Gradient Heading updated to H3 -->\r\n      <h3 class=\"h3\">Everything a Serious Student Needs to Score More<\/h3>\r\n      \r\n      <p class=\"lead\">One app for <b>classes, tests, doubts and revision<\/b> designed to keep students engaged, not distracted.<\/p>\r\n      \r\n      <div class=\"feat-list\">\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Live classes\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Class recordings\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Mock tests\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Study material\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Performance analytics\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          AI Doubt Bot\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Leaderboards\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Offline downloads\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Dark mode\r\n        <\/div>\r\n        <div class=\"feat-item\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> \r\n          Revision cards\r\n        <\/div>\r\n      <\/div>\r\n      \r\n      <a class=\"btn-line\" href=#demo-booking>\r\n        Book Free Demo \r\n        <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14\"\/><path d=\"m12 5 7 7-7 7\"\/><\/svg>\r\n      <\/a>\r\n    <\/div>\r\n    \r\n    <!-- Visual Mockup -->\r\n    <div class=\"split-visual\">\r\n      <div class=\"visual-card\">\r\n        <div class=\"ui-top\">\r\n          <span class=\"ui-title\">Student App \u00b7 Performance<\/span>\r\n          <div class=\"ui-pills\">\r\n            <span class=\"ui-pill\" style=\"background:var(--theme-color)\"><\/span>\r\n            <span class=\"ui-pill\"><\/span>\r\n          <\/div>\r\n        <\/div>\r\n        \r\n        <div style=\"padding:20px; display:grid; gap:12px;\">\r\n          <div class=\"ui-stats\">\r\n            <div class=\"ui-stat\">\r\n              <b>#8<\/b>\r\n              <span>Batch rank<\/span>\r\n            <\/div>\r\n            <div class=\"ui-stat\">\r\n              <b>82%<\/b>\r\n              <span>Mock test avg<\/span>\r\n            <\/div>\r\n            <div class=\"ui-stat\">\r\n              <b>14 hrs<\/b>\r\n              <span>Study this week<\/span>\r\n            <\/div>\r\n          <\/div>\r\n          \r\n          <div class=\"ui-chart\">\r\n            <span style=\"font-size:10px;font-weight:700;color:var(--title-color)\">Mock test scores \u00b7 trend<\/span>\r\n            <div class=\"bars\">\r\n              <div class=\"bar\" style=\"height:45%\"><\/div>\r\n              <div class=\"bar\" style=\"height:52%\"><\/div>\r\n              <div class=\"bar\" style=\"height:48%\"><\/div>\r\n              <div class=\"bar\" style=\"height:60%\"><\/div>\r\n              <div class=\"bar\" style=\"height:66%\"><\/div>\r\n              <div class=\"bar\" style=\"height:62%\"><\/div>\r\n              <div class=\"bar\" style=\"height:74%\"><\/div>\r\n              <div class=\"bar y\" style=\"height:82%\"><\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n      \r\n      <!-- Floating Card overlay (Top Left) -->\r\n      <div class=\"float-card\">\r\n        <span class=\"float-ic\">\r\n          <svg aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 8V4H8\"\/><rect width=\"16\" height=\"12\" x=\"4\" y=\"8\" rx=\"2\"\/><path d=\"M2 14h2\"\/><path d=\"M20 14h2\"\/><path d=\"M15 13v2\"\/><path d=\"M9 13v2\"\/><\/svg>\r\n        <\/span>\r\n        <div>\r\n          <b>AI Doubt Bot<\/b>\r\n          <span>\"Explain Lenz's law\" \u00b7 answered in 4s<\/span>\r\n        <\/div>\r\n      <\/div>\r\n      \r\n    <\/div>\r\n    \r\n  <\/div>\r\n<\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d9def04 e-con-full e-flex e-con e-parent\" data-id=\"d9def04\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b99fb38 elementor-widget elementor-widget-html\" data-id=\"b99fb38\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap');\r\n\r\n.dnm-pay {\r\n  --theme-color:#ffcf21; --title-color:#232323; --ink:#171717; --line:#ECECE8;\r\n  --muted:rgba(23,23,23,.64); --paper:#FBFBF9; --green:#1f9d55; --green-soft:#E7F6EC;\r\n  --shadow-s:0 1px 2px rgba(23,23,23,.06),0 4px 14px rgba(23,23,23,.05);\r\n  --shadow-m:0 8px 30px rgba(23,23,23,.10); --shadow-l:0 30px 70px rgba(35,35,35,.16);\r\n  font-family:'Manrope',system-ui,sans-serif; background:#fff; padding:96px 24px; position:relative;\r\n  overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line);\r\n  -webkit-font-smoothing:antialiased; color:var(--ink);\r\n}\r\n.dnm-pay *{box-sizing:border-box;margin:0;padding:0}\r\n:root{}\r\n.dnm-pay,.dnm-pay .wrap{max-width:100vw;overflow-x:hidden}\r\n.dnm-pay img{max-width:100%}\r\n.dnm-pay .db-bars,.dnm-pay .db-days,.dnm-pay .db-feed,.dnm-pay .db-foot{min-width:0}\r\n.dnm-pay .fd-row>div{min-width:0}\r\n.dnm-pay .fd-row b,.dnm-pay .fd-row .meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\r\n\r\n.dnm-pay .wrap{max-width:1180px;margin:0 auto;position:relative;z-index:2}\r\n.dnm-pay .center{text-align:center;max-width:680px;margin:0 auto 52px}\r\n.dnm-pay .sub-title{display:inline-block;padding:12px 20px;border-radius:12px;\r\n  background:linear-gradient(180deg,rgba(35,35,35,.06) 0%,rgba(35,35,35,.01) 100%);\r\n  box-shadow:-1px -1px 0 rgba(35,35,35,.2),1px 1px 0 rgba(255,255,255,.8);\r\n  font-size:14px;font-weight:500;line-height:24px;letter-spacing:1px;text-transform:uppercase;color:var(--title-color);margin-bottom:24px}\r\n.dnm-pay .sub-title span{position:relative;padding-left:20px}\r\n.dnm-pay .sub-title span::before{content:\"\";position:absolute;left:0;top:50%;width:10px;height:10px;background:var(--theme-color);border-radius:50%;transform:translateY(-50%)}\r\n.dnm-pay .h2{font-size:clamp(28px,4vw,44px);font-weight:600;letter-spacing:-0.022em;margin-bottom:16px;line-height:1.14;\r\n  background:linear-gradient(98.77deg,#232323 41.04%,#575855 73.86%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}\r\n.dnm-pay .lead{color:#303030;font-size:15px;font-weight:500}\r\n\r\n.dnm-pay .split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}\r\n.dnm-pay .p-ben{display:flex;gap:14px;margin-bottom:22px}\r\n.dnm-pay .p-bic{width:44px;height:44px;border-radius:13px;background:var(--theme-color);border:1px solid #F3E2A0;display:grid;place-items:center;color:var(--ink);flex:none}\r\n.dnm-pay .p-ben b{font-size:15px;font-weight:600;display:block;margin-bottom:4px;color:var(--title-color)}\r\n.dnm-pay .p-ben p{color: #303030;font-size:14px}\r\n.dnm-pay .p-cta{display:inline-flex;align-items:center;gap:8px;margin-top:8px;background:var(--theme-color);color:var(--ink);\r\n  font-weight:700;font-size:15px;border-radius:999px;padding:14px 26px;text-decoration:none;box-shadow:0 6px 20px rgba(255,207,33,.35);transition:transform .15s ease}\r\n.dnm-pay .p-cta:hover{transform:translateY(-2px)}\r\n\r\n\/* ===== fee-collection dashboard ===== *\/\r\n.dnm-pay .db-wrap{display:flex;justify-content:center}\r\n.dnm-pay .db{width:100%;max-width:420px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-l);padding:22px;position:relative;overflow:hidden}\r\n.dnm-pay .db-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}\r\n.dnm-pay .db-h .l{display:flex;align-items:center;gap:10px}\r\n.dnm-pay .db-mark{width:40px;height:40px;border-radius:11px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;flex:none}\r\n.dnm-pay .db-mark img{width:100%;height:100%;object-fit:contain;padding:5px;display:block}\r\n.dnm-pay .db-h b{font-size:14.5px;display:block}\r\n.dnm-pay .db-h span{font-size:11px;color:var(--muted)}\r\n.dnm-pay .db-live{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;color:var(--green);\r\n  background:var(--green-soft);border-radius:999px;padding:5px 10px;letter-spacing:.04em;text-transform:uppercase}\r\n.dnm-pay .db-live i{width:7px;height:7px;border-radius:50%;background:var(--green);animation:dblive 1.4s ease-in-out infinite}\r\n@keyframes dblive{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}\r\n\r\n.dnm-pay .db-big{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:14px}\r\n.dnm-pay .db-big small{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}\r\n.dnm-pay .db-big .row{display:flex;align-items:flex-end;justify-content:space-between;margin-top:4px}\r\n.dnm-pay .db-num{font-size:28px;font-weight:600;letter-spacing:-0.02em}\r\n.dnm-pay .db-delta{font-size:12px;font-weight:800;color:var(--green);background:var(--green-soft);border-radius:999px;padding:4px 9px}\r\n.dnm-pay .db-bars{display:flex;align-items:flex-end;gap:7px;height:56px;margin-top:14px}\r\n.dnm-pay .db-bars .bar{flex:1;height:0;border-radius:5px 5px 3px 3px;background:#E7E7E1;transition:height .8s cubic-bezier(.22,1,.36,1)}\r\n.dnm-pay .db.in .db-bars .bar{height:var(--h)}\r\n.dnm-pay .db-bars .bar.y{background:var(--theme-color)}\r\n.dnm-pay .db-days{display:flex;gap:7px;margin-top:6px}\r\n.dnm-pay .db-days span{flex:1;text-align:center;font-size:9px;color:var(--muted);font-weight:700}\r\n\r\n.dnm-pay .db-feed-t{display:flex;align-items:center;justify-content:space-between;margin:16px 0 8px}\r\n.dnm-pay .db-feed-t b{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}\r\n.dnm-pay .db-auto{font-size:10px;font-weight:800;color:var(--ink);background:var(--theme-color);border-radius:999px;padding:3px 9px}\r\n.dnm-pay .db-feed{display:flex;flex-direction:column;gap:8px;min-height:150px}\r\n.dnm-pay .fd-row{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;\r\n  background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 11px}\r\n.dnm-pay .fd-row.new{animation:fdin .5s cubic-bezier(.22,1,.36,1)}\r\n@keyframes fdin{from{opacity:0;transform:translateY(-10px);background:var(--green-soft)}to{opacity:1;transform:none}}\r\n.dnm-pay .fd-ic{width:30px;height:30px;border-radius:9px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;flex:none}\r\n.dnm-pay .fd-row b{font-size:12px;display:block;line-height:1.25}\r\n.dnm-pay .fd-row .meta{font-size:10px;color:var(--muted)}\r\n.dnm-pay .fd-amt{text-align:right}\r\n.dnm-pay .fd-amt b{font-size:12.5px}\r\n.dnm-pay .fd-amt .t{font-size:9.5px;color:var(--green);font-weight:700}\r\n\r\n.dnm-pay .db-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}\r\n.dnm-pay .db-stat{border:1px solid var(--line);border-radius:14px;padding:13px}\r\n.dnm-pay .db-stat .k{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}\r\n.dnm-pay .db-stat .n{font-size:26px;font-weight:800;letter-spacing:-0.02em;margin-top:4px}\r\n.dnm-pay .db-stat.hi{background:var(--paper)}\r\n.dnm-pay .db-stat.hi .n{color:var(--ink)}\r\n.dnm-pay .db-stat.hi .k{color:var(--ink)}\r\n.dnm-pay .db-cap{text-align:center;font-size:12px;font-weight:600;color:var(--muted);margin-top:14px}\r\n.dnm-pay .db-cap b{color:var(--ink)}\r\n\r\n\/* logo marquee *\/\r\n.dnm-pay .wall{margin-top:72px;text-align:center}\r\n.dnm-pay .wall-t{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:26px}\r\n.dnm-pay .marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}\r\n.dnm-pay .track{display:flex;width:max-content;gap:14px;align-items:center;animation:dnm-marq 26s linear infinite}\r\n.dnm-pay .marquee:hover .track{animation-play-state:paused}\r\n@keyframes dnm-marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}\r\n.dnm-pay .p-logo{flex:none;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;align-items:center;justify-content:center;height:72px;width:190px}\r\n.dnm-pay .p-logo img{height:36px;max-width:150px;width:auto;object-fit:contain;display:block}\r\n.dnm-pay .wall-note{font-size:13px;color:var(--muted);margin-top:24px;font-weight:500}\r\n.dnm-pay .wall-note b{color:var(--ink)}\r\n\r\n@media(max-width:900px){\r\n  .dnm-pay .split{grid-template-columns:1fr;gap:40px}\r\n  .dnm-pay .db-wrap{order:-1}\r\n}\r\n@media(max-width:640px){\r\n  .dnm-pay{padding:56px 0}\r\n  .dnm-pay .wrap{padding:0 16px;overflow:hidden;max-width:100%}\r\n  .dnm-pay .center{margin-bottom:32px;max-width:100%}\r\n  .dnm-pay .sub-title{padding:10px 16px;font-size:13px;margin-bottom:18px}\r\n  .dnm-pay .h2{font-size:25px}\r\n  .dnm-pay .lead{font-size:15px}\r\n\r\n  \/* everything stacks in one vertical column *\/\r\n  .dnm-pay .split{grid-template-columns:1fr;gap:28px}\r\n  .dnm-pay .db-wrap{order:-1}\r\n  .dnm-pay .db-wrap,.dnm-pay .p-copy{width:100%;min-width:0}\r\n\r\n  \/* benefits: vertical stacked cards (no horizontal scroll) *\/\r\n  .dnm-pay .p-ben-slider{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;overflow:visible}\r\n  .dnm-pay .p-ben{\r\n    width:100%;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;\r\n    margin-bottom:0;box-shadow:var(--shadow-s);\r\n    display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto;gap:2px 14px;align-items:start}\r\n  .dnm-pay .p-ben div{display:contents}\r\n  .dnm-pay .p-bic{grid-column:1;grid-row:1 \/ span 2}\r\n  .dnm-pay .p-ben b{grid-column:2;grid-row:1;font-size:15px;margin-bottom:2px}\r\n  .dnm-pay .p-ben p{grid-column:2;grid-row:2;font-size:13.5px}\r\n  .dnm-pay .p-cta{width:100%;justify-content:center;margin-top:16px}\r\n\r\n  \/* dashboard: full width, contained *\/\r\n  .dnm-pay .db{max-width:100%;width:100%;padding:16px;min-width:0}\r\n  .dnm-pay .db-num{font-size:28px}\r\n  .dnm-pay .db-h b{font-size:13.5px}\r\n  .dnm-pay .db-h span{font-size:10.5px}\r\n  .dnm-pay .db-h .l{min-width:0}\r\n  .dnm-pay .db-h .l div{min-width:0}\r\n  .dnm-pay .db-h b,.dnm-pay .db-h span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}\r\n  .dnm-pay .fd-row{grid-template-columns:28px 1fr auto;gap:8px;padding:8px 10px}\r\n  .dnm-pay .fd-row b{font-size:11.5px}\r\n  .dnm-pay .fd-row .meta{font-size:9.5px}\r\n  .dnm-pay .fd-amt b{font-size:11.5px}\r\n  .dnm-pay .db-stat .n{font-size:22px}\r\n  .dnm-pay .db-stat{padding:11px}\r\n  .dnm-pay .db-foot{gap:8px}\r\n\r\n  \/* logo marquee *\/\r\n  .dnm-pay .wall{margin-top:44px}\r\n  .dnm-pay .track{gap:10px;animation-duration:22s}\r\n  .dnm-pay .p-logo{height:58px;width:140px;padding:10px}\r\n  .dnm-pay .p-logo img{height:28px;max-width:110px}\r\n}\r\n@media(prefers-reduced-motion:reduce){\r\n  .dnm-pay .p-cta{transition:none} .dnm-pay .track{animation:none;justify-content:center;flex-wrap:wrap;width:auto}\r\n  .dnm-pay .db-bars .bar{transition:none;height:var(--h)}\r\n  .dnm-pay .db-live i{animation:none} .dnm-pay .fd-row.new{animation:none}\r\n}\r\n<\/style>\r\n\r\n<section class=\"dnm-pay\" aria-label=\"Payment integrations\">\r\n  <div class=\"wrap\">\r\n    <div class=\"center\">\r\n      <div class=\"sub-title\"><span>Payments &amp; UPI<\/span><\/div>\r\n      <h2 class=\"h2\">Stop Chasing Students For Fees. Let the System Do It.<\/h2>\r\n      <p class=\"lead\">Reminders go out on their own, parents pay from any UPI app or card, and the money lands in your account. Your office never makes an awkward fee call again.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"split\">\r\n      <div class=\"p-copy\">\r\n        <div class=\"p-ben-slider\">\r\n          <div class=\"p-ben\"><span class=\"p-bic\"><svg aria-hidden=\"true\" class=\"lucide lucide-bell\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M10.268 21a2 2 0 0 0 3.464 0\" \/> <path d=\"M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326\" \/> <\/svg><\/span><div><b>Reminders that chase fees for you<\/b><p>Auto SMS and WhatsApp nudges go out on every due date, so no one on your team has to follow up.<\/p><\/div><\/div>\r\n          <div class=\"p-ben\"><span class=\"p-bic\"><svg aria-hidden=\"true\" class=\"lucide lucide-banknote\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <rect width=\"20\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\" \/> <circle cx=\"12\" cy=\"12\" r=\"2\" \/> <path d=\"M6 12h.01M18 12h.01\" \/> <\/svg><\/span><div><b>Money hits your account, not a queue<\/b><p>Online fees settle straight to your bank, so you stop counting cash and writing manual receipts.<\/p><\/div><\/div>\r\n          <div class=\"p-ben\"><span class=\"p-bic\"><svg aria-hidden=\"true\" class=\"lucide lucide-receipt\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M12 17V7\" \/> <path d=\"M16 8h-6a2 2 0 0 0 0 4h4a2 2 0 0 1 0 4H8\" \/> <path d=\"M4 3a1 1 0 0 1 1-1 1.3 1.3 0 0 1 .7.2l.933.6a1.3 1.3 0 0 0 1.4 0l.934-.6a1.3 1.3 0 0 1 1.4 0l.933.6a1.3 1.3 0 0 0 1.4 0l.933-.6a1.3 1.3 0 0 1 1.4 0l.934.6a1.3 1.3 0 0 0 1.4 0l.933-.6A1.3 1.3 0 0 1 19 2a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1 1.3 1.3 0 0 1-.7-.2l-.933-.6a1.3 1.3 0 0 0-1.4 0l-.934.6a1.3 1.3 0 0 1-1.4 0l-.933-.6a1.3 1.3 0 0 0-1.4 0l-.933.6a1.3 1.3 0 0 1-1.4 0l-.934-.6a1.3 1.3 0 0 0-1.4 0l-.933.6a1.3 1.3 0 0 1-.7.2 1 1 0 0 1-1-1z\" \/> <\/svg><\/span><div><b>Receipts and GST invoices on their own<\/b><p>Every payment creates a compliant receipt instantly, ready for the parent and your accountant.<\/p><\/div><\/div>\r\n          <div class=\"p-ben\"><span class=\"p-bic\"><svg aria-hidden=\"true\" class=\"lucide lucide-shield-check\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\" \/> <path d=\"m9 12 2 2 4-4\" \/> <\/svg><\/span><div><b>Bank-grade security on every rupee<\/b><p>PCI-DSS gateways and encrypted transactions keep both your institute and your parents protected.<\/p><\/div><\/div>\r\n        <\/div>\r\n        <a class=\"p-cta\" href=#demo-booking>See fee collection in a live demo <svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M5 12h14\" \/> <path d=\"m12 5 7 7-7 7\" \/> <\/svg><\/a>\r\n      <\/div>\r\n\r\n      <div class=\"db-wrap\">\r\n        <div class=\"db\" id=\"dnmDb\">\r\n          <div class=\"db-h\">\r\n            <div class=\"l\"><span class=\"db-mark\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/logo-1.png\" alt=\"Sharma Classes\"><\/span>\r\n              <div><b>Fee Collection<\/b><span>Sharma Classes \u00b7 running on autopilot<\/span><\/div><\/div>\r\n            <span class=\"db-live\"><i><\/i> Live<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"db-big\">\r\n            <small>Collected today<\/small>\r\n            <div class=\"row\"><div class=\"db-num\" id=\"dbNum\">\u20b90<\/div><span class=\"db-delta\">\u25b2 18%<\/span><\/div>\r\n            <div class=\"db-bars\"><span class=\"bar\" style=\"--h:42%\"><\/span><span class=\"bar\" style=\"--h:58%\"><\/span><span class=\"bar\" style=\"--h:50%\"><\/span><span class=\"bar\" style=\"--h:70%\"><\/span><span class=\"bar\" style=\"--h:64%\"><\/span><span class=\"bar\" style=\"--h:82%\"><\/span><span class=\"bar y\" style=\"--h:90%\"><\/span><\/div>\r\n            <div class=\"db-days\"><span>M<\/span><span>T<\/span><span>W<\/span><span>T<\/span><span>F<\/span><span>S<\/span><span>S<\/span><\/div>\r\n          <\/div>\r\n\r\n          <div class=\"db-feed-t\"><b>Incoming payments<\/b><span class=\"db-auto\">Auto-collected<\/span><\/div>\r\n          <div class=\"db-feed\" id=\"dbFeed\"><\/div>\r\n\r\n          <div class=\"db-foot\">\r\n            <div class=\"db-stat\"><div class=\"k\"><svg aria-hidden=\"true\" class=\"lucide lucide-bell\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M10.268 21a2 2 0 0 0 3.464 0\" \/> <path d=\"M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326\" \/> <\/svg> Reminders auto-sent<\/div><div class=\"n\" id=\"dbRem\">0<\/div><\/div>\r\n            <div class=\"db-stat hi\"><div class=\"k\"><svg aria-hidden=\"true\" class=\"lucide lucide-phone-off\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M10.1 13.9a14 14 0 0 0 3.732 2.668 1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2 18 18 0 0 1-12.728-5.272\" \/> <path d=\"M22 2 2 22\" \/> <path d=\"M4.76 13.582A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 .244.473\" \/> <\/svg> Calls by your staff<\/div><div class=\"n\">0<\/div><\/div>\r\n          <\/div>\r\n          <p class=\"db-cap\"><b>Your office chases nothing.<\/b> The system collects it all.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"wall\">\r\n      <p class=\"wall-t\">Works with India's leading payment gateways<\/p>\r\n      <div class=\"marquee\"><div class=\"track\">\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/1-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/2-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/3-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/4-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/5-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/6-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/1-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/2-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/3-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/4-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/5-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n          <div class=\"p-logo\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/6-scaled.webp\" alt=\"Payment gateway\" loading=\"lazy\"><\/div>\r\n      <\/div><\/div>\r\n      <p class=\"wall-note\">Plus <b>credit &amp; debit cards, net banking and wallets<\/b>, the methods your parents already use every day.<\/p>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function(){\r\n  var db=document.getElementById('dnmDb'); if(!db) return;\r\n  var numEl=document.getElementById('dbNum'), remEl=document.getElementById('dbRem'), feed=document.getElementById('dbFeed');\r\n  var reduce=window.matchMedia('(prefers-reduced-motion: reduce)');\r\n\r\n  function inr(v){ return '\u20b9'+v.toLocaleString('en-IN'); }\r\n  function tick(el, from, to, dur, fmt){\r\n    if(reduce.matches){ el.textContent=fmt?fmt(to):to; return; }\r\n    var t0=null;\r\n    function step(ts){ if(!t0)t0=ts; var p=Math.min((ts-t0)\/dur,1); var val=Math.round(from+(to-from)*(1-Math.pow(1-p,3)));\r\n      el.textContent=fmt?fmt(val):val; if(p<1) requestAnimationFrame(step); }\r\n    requestAnimationFrame(step);\r\n  }\r\n\r\n  var pool=[\r\n    ['Aarav Gupta','Batch 12-A','UPI',12000],\r\n    ['Priya Nair','Batch 10-B','GPay',8500],\r\n    ['Rohan Mehta','Batch 12-A','PhonePe',15000],\r\n    ['Sana Khan','Batch 9-A','Paytm',9500],\r\n    ['Ishaan Roy','Batch 11-C','UPI',11000],\r\n    ['Neha Verma','Batch 10-A','GPay',7500],\r\n    ['Kabir Shah','Batch 12-B','PhonePe',13500]\r\n  ];\r\n  var pi=0, collected=184500, rem=342, feedTimer=null;\r\n  var checkSVG='<svg aria-hidden=\"true\" class=\"lucide lucide-check\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M20 6 9 17l-5-5\" \/> <\/svg>';\r\n\r\n  function addRow(){\r\n    var p=pool[pi % pool.length]; pi++;\r\n    var row=document.createElement('div');\r\n    row.className='fd-row new';\r\n    row.innerHTML='<span class=\"fd-ic\">'+checkSVG+'<\/span>'+\r\n      '<div><b>'+p[0]+'<\/b><span class=\"meta\">'+p[1]+' \u00b7 '+p[2]+'<\/span><\/div>'+\r\n      '<div class=\"fd-amt\"><b>'+inr(p[3])+'<\/b><div class=\"t\">just now<\/div><\/div>';\r\n    feed.insertBefore(row, feed.firstChild);\r\n    while(feed.children.length>4) feed.removeChild(feed.lastChild);\r\n    \/\/ bump running totals\r\n    var newC=collected+p[3];\r\n    tick(numEl, collected, newC, 700, inr); collected=newC;\r\n    rem+=Math.floor(Math.random()*3)+1;\r\n    remEl.textContent=rem.toLocaleString('en-IN');\r\n    \/\/ relabel older rows time\r\n    var rows=feed.querySelectorAll('.fd-row .t');\r\n    for(var i=1;i<rows.length;i++) rows[i].textContent=(i*3)+'m ago';\r\n    for(var i=1;i<feed.children.length;i++) feed.children[i].classList.remove('new');\r\n  }\r\n\r\n  function start(){\r\n    db.classList.add('in');\r\n    tick(numEl, 0, collected, 1400, inr);\r\n    tick(remEl, 0, rem, 1400);\r\n    \/\/ seed a few rows\r\n    addRow(); setTimeout(addRow,300); setTimeout(addRow,600);\r\n    if(!reduce.matches) feedTimer=setInterval(addRow, 2800);\r\n  }\r\n\r\n  var started=false;\r\n  function begin(){ if(started)return; started=true; start(); }\r\n  if('IntersectionObserver' in window){\r\n    var io=new IntersectionObserver(function(es){es.forEach(function(e){ if(e.isIntersecting) begin(); });},{threshold:.3});\r\n    io.observe(db);\r\n  } else begin();\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-35e1336 e-con-full e-flex e-con e-parent\" data-id=\"35e1336\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5535440 elementor-widget elementor-widget-html\" data-id=\"5535440\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&display=swap');\r\n\r\n:root {\r\n  --theme-color: #ffcf21;\r\n  --title-color: #232323;\r\n  --ink: #171717;\r\n  --line: #ECECE8;\r\n  --muted: #575855;\r\n}\r\n\r\n.dnm-faq-section {\r\n  font-family: 'Manrope', system-ui, sans-serif;\r\n  background-color: #ffffff;\r\n  padding: 96px 24px;\r\n  border-top: 1px solid var(--line);\r\n  line-height: 1.6;\r\n  -webkit-font-smoothing: antialiased;\r\n  color: var(--ink);\r\n}\r\n\r\n.dnm-faq-section * {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.dnm-faq-section .wrap {\r\n  max-width: 1180px;\r\n  margin: 0 auto;\r\n}\r\n\r\n.dnm-faq-section .center { \r\n  text-align: center; \r\n  margin-bottom: 48px;\r\n}\r\n\r\n\/* --- SUBTITLE BADGE --- *\/\r\n.dnm-faq-section .sub-title {\r\n  display: inline-block;\r\n  padding: 12px 20px;\r\n  border-radius: 12px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 16px;\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.dnm-faq-section .sub-title span {\r\n  position: relative;\r\n  padding-left: 20px;\r\n}\r\n\r\n.dnm-faq-section .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  top: 50%;\r\n  width: 10px;\r\n  height: 10px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* --- GRADIENT HEADING --- *\/\r\n.dnm-faq-section .h2 {\r\n  font-size: clamp(28px, 4vw, 42px); \r\n  font-weight: 600; \r\n  letter-spacing: -0.022em; \r\n  margin-bottom: 16px; \r\n  line-height: 1.14; \r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n}\r\n\r\n\/* --- FAQ ACCORDION --- *\/\r\n.dnm-faq-section .faq {\r\n  max-width: 760px;\r\n  margin: 0 auto;\r\n}\r\n\r\n.dnm-faq-section .faq-item {\r\n  background: #fff;\r\n  border: 1px solid var(--line);\r\n  border-radius: 16px;\r\n  margin-bottom: 12px;\r\n  overflow: hidden;\r\n  transition: border-color 0.3s ease, box-shadow 0.3s ease;\r\n}\r\n\r\n.dnm-faq-section .faq-item:hover {\r\n  border-color: #d4d4cd;\r\n}\r\n\r\n\/* FAQ Question Button *\/\r\n.dnm-faq-section .faq-q {\r\n  width: 100%;\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  gap: 16px;\r\n  padding: 20px 24px;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n  font-family: 'Manrope', sans-serif;\r\n  font-size: 16px;\r\n  font-weight: 600;\r\n  color: var(--title-color);\r\n  text-align: left;\r\n}\r\n\r\n.dnm-faq-section .faq-q span {\r\n  flex: 1;\r\n}\r\n\r\n.dnm-faq-section .faq-q svg {\r\n  flex-shrink: 0; \/* Prevents arrow from getting squished *\/\r\n  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), color 0.3s ease;\r\n  color: #888;\r\n}\r\n\r\n.dnm-faq-section .faq-q.open svg {\r\n  transform: rotate(180deg);\r\n  color: var(--title-color);\r\n}\r\n\r\n\/* Smooth Accordion using CSS Grid *\/\r\n.dnm-faq-section .faq-a-wrapper {\r\n  display: grid;\r\n  grid-template-rows: 0fr;\r\n  transition: grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dnm-faq-section .faq-q.open + .faq-a-wrapper {\r\n  grid-template-rows: 1fr;\r\n}\r\n\r\n.dnm-faq-section .faq-a-inner {\r\n  overflow: hidden;\r\n  opacity: 0;\r\n  transition: opacity 0.4s ease, padding 0.4s ease;\r\n  padding: 0 24px 0;\r\n}\r\n\r\n.dnm-faq-section .faq-q.open + .faq-a-wrapper .faq-a-inner {\r\n  opacity: 1;\r\n  padding: 0 24px 22px;\r\n}\r\n\r\n\/* FAQ Text *\/\r\n.dnm-faq-section .faq-text {\r\n  color: #303030;\r\n  font-size: 15px;\r\n  font-weight: 500;\r\n  line-height: 1.7;\r\n}\r\n\r\n\/* --- MOBILE OPTIMIZATIONS --- *\/\r\n@media(max-width: 640px) {\r\n  .dnm-faq-section { padding: 64px 0; }\r\n  .dnm-faq-section .wrap { padding: 0 18px; }\r\n  .dnm-faq-section .sub-title { padding: 10px 16px; font-size: 14px; margin-bottom: 20px; }\r\n  .dnm-faq-section .h2 { font-size: 26px; }\r\n  \r\n  \/* Mobile Overflow & Wrapping Fix *\/\r\n  .dnm-faq-section .faq-q {\r\n    padding: 16px;\r\n    font-size: 14.5px;\r\n    align-items: flex-start; \/* Keeps the arrow at the top when text wraps to multiple lines *\/\r\n    line-height: 1.5;\r\n  }\r\n  .dnm-faq-section .faq-q span {\r\n    white-space: normal; \/* Forces text to wrap naturally *\/\r\n    word-break: break-word;\r\n    padding-right: 8px; \/* Adds breathing room between text and arrow *\/\r\n  }\r\n  .dnm-faq-section .faq-q svg {\r\n    width: 20px; \/* Makes the arrow larger and clearer on mobile *\/\r\n    height: 20px;\r\n    margin-top: 2px; \/* Aligns visually with the first line of text *\/\r\n    color: var(--title-color); \/* Darker icon for better visibility *\/\r\n  }\r\n\r\n  .dnm-faq-section .faq-a-inner {\r\n    padding: 0 16px 0;\r\n  }\r\n  .dnm-faq-section .faq-q.open + .faq-a-wrapper .faq-a-inner {\r\n    padding: 0 16px 18px;\r\n  }\r\n  .dnm-faq-section .faq-text {\r\n    font-size: 14px;\r\n  }\r\n}\r\n\r\n@media(prefers-reduced-motion: reduce) {\r\n  .dnm-faq-section .faq-a-wrapper, .dnm-faq-section .faq-a-inner, .dnm-faq-section .faq-q svg { transition: none !important; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"dnm-faq-section\" id=\"elementor-dnm-faq\">\r\n  <div class=\"wrap\">\r\n    \r\n    <div class=\"center\">\r\n      <div class=\"sub-title\">\r\n        <span>FAQ<\/span>\r\n      <\/div>\r\n      \r\n      <h2 class=\"h2\">Questions Institute Owners Ask Us<\/h2>\r\n    <\/div>\r\n\r\n    <div class=\"faq\">\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q open\" aria-expanded=\"true\">\r\n          <span>How long does it take to set up the platform for my institute?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Most institutes go live within 5\u20137 working days, including your branded apps, data import and staff training. Our team handles the entire setup.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>Will the apps be published under my institute's name?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Yes. The Student, Mentor and Parent apps are published on Google Play and the App Store under your institute's name, logo and colours. Students never see our brand.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>Can I migrate my existing student and fee data?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Yes. We import your existing data from Excel, Tally or any other software free of charge during onboarding.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>Do you support offline coaching institutes, or only online?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Both. Offline institutes use it for attendance, fees, tests and parent communication; hybrid and online institutes add live classes and recordings on top.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>How are fees collected through the platform?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Parents pay via UPI, cards, net banking or wallets through an integrated payment gateway. Receipts are generated automatically and dues are tracked in real time.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>Is my video content safe from piracy?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Yes. Videos are encrypted with dynamic watermarking and screen-recording protection, so your lectures stay exclusive to your students.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>What happens if my internet is slow during a live class?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Classes auto-adjust quality for low bandwidth, and every class is recorded so students can watch later without missing anything.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>Do teachers and staff need technical training?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">The platform is designed for non-technical users. We provide onboarding training in Hindi and English, plus ongoing support on call and WhatsApp.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>Can I manage multiple branches from one account?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Yes. You get one owner dashboard with branch-wise students, fees, attendance and reports, along with role-based access for branch managers.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"faq-item\">\r\n        <button class=\"faq-q\" aria-expanded=\"false\">\r\n          <span>What does it cost?<\/span>\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"19\" height=\"19\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <div class=\"faq-a-wrapper\">\r\n          <div class=\"faq-a-inner\">\r\n            <div class=\"faq-text\">Pricing depends on your student count and the modules you need. Book a free demo and we'll share a plan that fits your institute \u2014 most owners find it costs less than one staff salary.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  \/\/ Scoped JavaScript for the FAQ accordion to prevent conflicts\r\n  document.addEventListener('DOMContentLoaded', function() {\r\n    const faqSection = document.getElementById('elementor-dnm-faq');\r\n    \r\n    if (faqSection) {\r\n      const questions = faqSection.querySelectorAll('.faq-q');\r\n      \r\n      questions.forEach(q => {\r\n        q.addEventListener('click', () => {\r\n          const isOpen = q.classList.contains('open');\r\n          \r\n          \/\/ Close all open FAQs\r\n          questions.forEach(otherQ => {\r\n            otherQ.classList.remove('open');\r\n            otherQ.setAttribute('aria-expanded', 'false');\r\n          });\r\n          \r\n          \/\/ If the clicked FAQ wasn't already open, open it\r\n          if (!isOpen) {\r\n            q.classList.add('open');\r\n            q.setAttribute('aria-expanded', 'true');\r\n          }\r\n        });\r\n      });\r\n    }\r\n  });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-393b653 e-con-full e-flex e-con e-parent\" data-id=\"393b653\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4969e9a elementor-widget elementor-widget-html\" data-id=\"4969e9a\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"demo-booking\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600&display=swap');\r\n\r\n:root {\r\n  --theme-color: #ffcf21;\r\n  --title-color: #232323;\r\n  --ink: #171717;\r\n  --ink-soft: #303030;\r\n  --line: #ECECE8;\r\n  --muted: rgba(23,23,23,.64);\r\n  --radius-xl: 24px;\r\n  --radius: 12px;\r\n  --ease: cubic-bezier(.22,.61,.36,1);\r\n  --shadow-sm: 0 1px 2px rgba(23,23,23,.06), 0 4px 14px rgba(23,23,23,.05);\r\n  --shadow-lg: 0 24px 60px rgba(23,23,23,.14), 0 8px 24px rgba(23,23,23,.06);\r\n}\r\n\r\n.dnm-cta-form-section {\r\n  font-family: 'Manrope', system-ui, sans-serif;\r\n  background-color: #FAFAF7;\r\n  padding: 80px 24px;\r\n  line-height: 1.6;\r\n  -webkit-font-smoothing: antialiased;\r\n  color: var(--ink);\r\n  border-top: 1px solid var(--line);\r\n}\r\n\r\n.dnm-cta-form-section * {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n\/* Global max weight override for strong\/b inside this section *\/\r\n.dnm-cta-form-section b, \r\n.dnm-cta-form-section strong {\r\n  font-weight: 600;\r\n}\r\n\r\n.dnm-cta-form-section button { cursor: pointer; border: none; background: none; }\r\n.dnm-cta-form-section ul { list-style: none; }\r\n\r\n.dnm-cta-form-section .wrap {\r\n  width: 100%; \r\n  max-width: 1180px; \r\n  margin: 0 auto; \r\n  display: grid; \r\n  grid-template-columns: 1.05fr 0.95fr; \r\n  gap: 64px; \r\n  align-items: center;\r\n}\r\n\r\n\/* ===== LEFT COLUMN: COPY & BULLETS ===== *\/\r\n.dnm-cta-form-section .enrol-copy { position: relative; z-index: 1; }\r\n\r\n\/* --- SUBTITLE BADGE --- *\/\r\n.dnm-cta-form-section .sub-title {\r\n  display: inline-block;\r\n  padding: 10px 18px;\r\n  border-radius: 10px;\r\n  background: linear-gradient(180deg, rgba(35,35,35,.06) 0%, rgba(35,35,35,.01) 100%);\r\n  box-shadow: -1px -1px 0 rgba(35,35,35,.2), 1px 1px 0 rgba(255,255,255,.8);\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  line-height: 20px;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: var(--title-color);\r\n  margin-bottom: 24px;\r\n}\r\n.dnm-cta-form-section .sub-title span { position: relative; padding-left: 18px; }\r\n.dnm-cta-form-section .sub-title span::before {\r\n  content: \"\";\r\n  position: absolute; left: 0; top: 50%;\r\n  width: 8px; height: 8px;\r\n  background: var(--theme-color);\r\n  border-radius: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* --- GRADIENT HEADING --- *\/\r\n.dnm-cta-form-section .h2 {\r\n  font-size: clamp(32px, 4vw, 46px); \r\n  font-weight: 600; \r\n  letter-spacing: -0.022em; \r\n  margin-bottom: 16px; \r\n  line-height: 1.14; \r\n  background: linear-gradient(98.77deg, #232323 41.04%, #575855 73.86%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  color: transparent;\r\n}\r\n\r\n.dnm-cta-form-section .e-lead {\r\n  color: var(--ink-soft); \r\n  font-size: 16px; \r\n  max-width: 48ch;\r\n  margin-bottom: 32px; \r\n  line-height: 1.6; \r\n  font-weight: 500;\r\n}\r\n\r\n\/* Bullet Points *\/\r\n.dnm-cta-form-section .enrol-points {\r\n  display: flex; flex-direction: column; gap: 14px; margin-bottom: 40px;\r\n}\r\n.dnm-cta-form-section .enrol-points li {\r\n  display: flex; gap: 14px; align-items: flex-start;\r\n  font-size: 14.5px; color: var(--ink-soft); line-height: 1.5; font-weight: 600;\r\n}\r\n.dnm-cta-form-section .enrol-points .tick {\r\n  width: 24px; height: 24px; border-radius: 50%;\r\n  background: var(--theme-color); color: var(--ink);\r\n  display: grid; place-items: center; flex-shrink: 0;\r\n}\r\n.dnm-cta-form-section .enrol-points .tick svg { width: 14px; height: 14px; }\r\n\r\n\/* Contact Pill *\/\r\n.dnm-cta-form-section .enrol-call {\r\n  display: inline-flex; align-items: center; gap: 16px;\r\n  padding: 16px 24px; background: white; border: 1px solid var(--line);\r\n  border-radius: 16px; box-shadow: var(--shadow-sm);\r\n}\r\n.dnm-cta-form-section .enrol-call .ic {\r\n  width: 44px; height: 44px; border-radius: 50%;\r\n  background: var(--line); color: var(--ink); display: grid; place-items: center; flex-shrink: 0;\r\n}\r\n.dnm-cta-form-section .enrol-call .ic svg { width: 20px; height: 20px; }\r\n.dnm-cta-form-section .enrol-call small {\r\n  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;\r\n  color: var(--muted); font-weight: 600; display: block; margin-bottom: 2px;\r\n}\r\n.dnm-cta-form-section .enrol-call b {\r\n  font-size: 19px; font-weight: 600; color: var(--ink);\r\n  display: block; letter-spacing: -0.01em; line-height: 1.1;\r\n}\r\n\r\n\/* ===== RIGHT COLUMN: FORM CARD ===== *\/\r\n.dnm-cta-form-section .form-card {\r\n  background: white; border: 1px solid var(--line);\r\n  border-radius: var(--radius-xl); padding: clamp(28px, 4vw, 36px);\r\n  box-shadow: var(--shadow-lg); position: relative; z-index: 1;\r\n}\r\n.dnm-cta-form-section .form-card h3 {\r\n  font-size: 24px; color: var(--ink); font-weight: 600;\r\n  margin-bottom: 6px; letter-spacing: -0.01em; line-height: 1.1;\r\n}\r\n.dnm-cta-form-section .form-card .fc-sub {\r\n  font-size: 14px; color: var(--muted); margin-bottom: 24px; font-weight: 500;\r\n}\r\n\r\n\/* Form Elements *\/\r\n.dnm-cta-form-section .field { margin-bottom: 14px; }\r\n.dnm-cta-form-section .field label {\r\n  display: block; font-size: 12.5px; font-weight: 600;\r\n  margin-bottom: 6px; color: var(--ink); letter-spacing: .02em;\r\n}\r\n.dnm-cta-form-section .field label span.opt {\r\n  color: var(--muted); font-weight: 500; font-size: 11.5px; text-transform: none;\r\n}\r\n.dnm-cta-form-section .field label .req { color: #e23b3b; }\r\n\r\n.dnm-cta-form-section .field input,\r\n.dnm-cta-form-section .field select,\r\n.dnm-cta-form-section .field textarea {\r\n  width: 100%; \r\n  padding: 11px 14px; \r\n  border: 1px solid var(--line);\r\n  border-radius: var(--radius); \r\n  background: #FAFAF7; \r\n  font-family: inherit;\r\n  font-size: 14px; \r\n  color: var(--ink); \r\n  transition: .25s var(--ease); \r\n  font-weight: 500;\r\n}\r\n.dnm-cta-form-section .field input::placeholder { color: #9CA3AF; }\r\n.dnm-cta-form-section .field input:focus,\r\n.dnm-cta-form-section .field select:focus {\r\n  outline: none; border-color: var(--title-color); background: #fff;\r\n  box-shadow: 0 0 0 4px rgba(255, 207, 33, 0.2);\r\n}\r\n.dnm-cta-form-section .field select { cursor: pointer; }\r\n\r\n\/* Forces uppercase for the referral \/ coupon code *\/\r\n.dnm-cta-form-section .field input[name=\"referralCode\"] { text-transform: uppercase; }\r\n.dnm-cta-form-section .field input[name=\"referralCode\"]::placeholder { text-transform: none; }\r\n\r\n.dnm-cta-form-section .field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }\r\n\r\n\/* ===== COUPON TOGGLE + COLLAPSIBLE FIELD ===== *\/\r\n.dnm-cta-form-section .coupon-toggle {\r\n  display: inline-flex; align-items: center; gap: 9px;\r\n  font-family: inherit; font-size: 13.5px; font-weight: 600;\r\n  color: var(--ink); background: none; border: none;\r\n  padding: 2px 0; margin: 2px 0 4px; cursor: pointer;\r\n  transition: color .2s var(--ease);\r\n}\r\n.dnm-cta-form-section .coupon-toggle:hover { color: #000; }\r\n.dnm-cta-form-section .coupon-toggle .pm {\r\n  width: 22px; height: 22px; border-radius: 50%;\r\n  background: var(--theme-color); color: var(--ink);\r\n  display: grid; place-items: center; flex-shrink: 0;\r\n  transition: transform .25s var(--ease);\r\n}\r\n.dnm-cta-form-section .coupon-toggle .pm svg { width: 13px; height: 13px; }\r\n.dnm-cta-form-section .coupon-toggle[aria-expanded=\"true\"] .pm { transform: rotate(45deg); }\r\n\r\n.dnm-cta-form-section .coupon-wrap {\r\n  display: grid;\r\n  grid-template-rows: 0fr;\r\n  transition: grid-template-rows .3s var(--ease);\r\n}\r\n.dnm-cta-form-section .coupon-wrap.open { grid-template-rows: 1fr; }\r\n.dnm-cta-form-section .coupon-wrap > .coupon-inner { overflow: hidden; }\r\n\r\n\/* Submit Button *\/\r\n.dnm-cta-form-section .btn-submit {\r\n  width: 100%; display: inline-flex; align-items: center; justify-content: center;\r\n  gap: 8px; \r\n  padding: 14px 26px; \r\n  border-radius: 999px; font-weight: 600; font-size: 15.5px;\r\n  background: var(--theme-color); color: var(--title-color); border: none; cursor: pointer;\r\n  transition: all .2s var(--ease); margin-top: 8px;\r\n}\r\n.dnm-cta-form-section .btn-submit:hover:not(:disabled) {\r\n  transform: translateY(-2px); box-shadow: 0 8px 24px rgba(255,207,33,.4);\r\n}\r\n.dnm-cta-form-section .btn-submit:disabled { opacity: 0.75; cursor: not-allowed; }\r\n\r\n\/* Loader Spinner *\/\r\n.dnm-cta-form-section .vj-loader {\r\n  width: 18px; height: 18px;\r\n  border: 2px solid rgba(35,35,35,.2);\r\n  border-top-color: var(--title-color);\r\n  border-radius: 50%;\r\n  display: inline-block;\r\n  animation: vj-spin 0.7s linear infinite;\r\n}\r\n@keyframes vj-spin { to { transform: rotate(360deg); } }\r\n\r\n.dnm-cta-form-section .form-fine {\r\n  font-size: 12px; color: var(--muted); text-align: center;\r\n  margin-top: 14px; line-height: 1.5; font-weight: 500;\r\n}\r\n\r\n\/* Success State *\/\r\n.dnm-cta-form-section .form-success { display: none; text-align: center; padding: 30px 10px; }\r\n.dnm-cta-form-section .form-success.show { display: block; animation: vjfade .4s ease; }\r\n@keyframes vjfade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }\r\n\r\n.dnm-cta-form-section .form-success .s-ic {\r\n  width: 64px; height: 64px; border-radius: 50%;\r\n  background: #FFF6D6; color: var(--ink); display: grid; place-items: center;\r\n  margin: 0 auto 18px; border: 1px solid #F3E2A0;\r\n}\r\n.dnm-cta-form-section .form-success .s-ic svg { width: 30px; height: 30px; }\r\n.dnm-cta-form-section .form-success h3 { font-size: 24px; color: var(--ink); margin-bottom: 8px; font-weight: 600; }\r\n.dnm-cta-form-section .form-success p { color: var(--muted); font-size: 15px; font-weight: 500; }\r\n\r\n\/* ===== REVEAL ANIMATIONS ===== *\/\r\n.dnm-cta-form-section .vj-reveal {\r\n  opacity: 0; transform: translateY(26px);\r\n  transition: opacity .7s var(--ease), transform .7s var(--ease);\r\n}\r\n.dnm-cta-form-section .vj-reveal.in { opacity: 1; transform: none; }\r\n.dnm-cta-form-section .vj-reveal[data-d=\"1\"] { transition-delay: .12s; }\r\n\r\n\/* ===== ELEMENTOR EDITOR FIX ===== *\/\r\nbody.elementor-editor-active .dnm-cta-form-section .vj-reveal {\r\n  opacity: 1 !important;\r\n  transform: none !important;\r\n}\r\n\r\n\/* ===== RESPONSIVE ===== *\/\r\n@media (max-width: 960px) {\r\n  .dnm-cta-form-section .wrap { grid-template-columns: 1fr; gap: 48px; max-width: 680px; }\r\n  .dnm-cta-form-section .enrol-copy { text-align: center; display: flex; flex-direction: column; align-items: center; }\r\n  .dnm-cta-form-section .e-lead { margin-inline: auto; }\r\n}\r\n@media (max-width: 640px) {\r\n  .dnm-cta-form-section { padding: 64px 0; }\r\n  .dnm-cta-form-section .h2 { font-size: 28px; }\r\n  .dnm-cta-form-section .field-row { grid-template-columns: 1fr; gap: 0; }\r\n  .dnm-cta-form-section .form-card { padding: 28px 18px; border-radius: 20px;}\r\n  .dnm-cta-form-section .enrol-call { width: 100%; justify-content: center; }\r\n  .dnm-cta-form-section .enrol-points li { text-align: left; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"dnm-cta-form-section\" id=\"demo-section\">\r\n  <div class=\"wrap\">\r\n\r\n    <div class=\"enrol-copy vj-reveal\">\r\n      <div class=\"sub-title\">\r\n        <span>Book a free demo<\/span>\r\n      <\/div>\r\n      <h2 class=\"h2\">Ready to Upgrade Your Coaching Institute?<\/h2>\r\n      <p class=\"e-lead\">See the platform live with your institute's data. No cost, no commitment. Get an honest walkthrough of how we can automate your operations.<\/p>\r\n\r\n      <ul class=\"enrol-points\">\r\n        <li>\r\n          <span class=\"tick\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span> \r\n          A real live tour with your data\r\n        <\/li>\r\n        <li>\r\n          <span class=\"tick\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span> \r\n          Complete pricing & module breakdown\r\n        <\/li>\r\n        <li>\r\n          <span class=\"tick\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span> \r\n          Free setup consultation & migration plan\r\n        <\/li>\r\n      <\/ul>\r\n\r\n      <div class=\"enrol-call\">\r\n        <div class=\"ic\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg><\/div>\r\n        <div>\r\n          <small>Need answers immediately?<\/small>\r\n          <b>+91 80760 38376<\/b>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"form-card vj-reveal\" data-d=\"1\">\r\n      <form id=\"dnmDemoForm\" novalidate>\r\n        <h3>Get a free demo<\/h3>\r\n        <p class=\"fc-sub\">Fill this out and our team will schedule a time that works for you.<\/p>\r\n\r\n        <div class=\"field-row\">\r\n          <div class=\"field\">\r\n            <label>Your name <span class=\"req\">*<\/span><\/label>\r\n            <input type=\"text\" name=\"name\" placeholder=\"Rahul Sharma\" required>\r\n          <\/div>\r\n          <div class=\"field\">\r\n            <label>Institute name <span class=\"req\">*<\/span><\/label>\r\n            <input type=\"text\" name=\"institute\" placeholder=\"Sharma Classes\" required>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"field-row\">\r\n          <div class=\"field\">\r\n            <label>Phone <span class=\"req\">*<\/span><\/label>\r\n            <input type=\"tel\" name=\"phone\" placeholder=\"+91 98765 43210\" pattern=\"[0-9+ \\-]{10,15}\" required>\r\n          <\/div>\r\n          <div class=\"field\">\r\n            <label>Email <span class=\"req\">*<\/span><\/label>\r\n            <input type=\"email\" name=\"email\" placeholder=\"you@institute.com\" required>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"field\">\r\n          <label>Website <span class=\"opt\">(optional)<\/span><\/label>\r\n          <input type=\"text\" name=\"website\" inputmode=\"url\" placeholder=\"www.institute.com\">\r\n        <\/div>\r\n\r\n        <!-- Coupon toggle: hidden until clicked, optional -->\r\n        <button type=\"button\" class=\"coupon-toggle\" id=\"couponToggle\" aria-expanded=\"false\" aria-controls=\"couponWrap\">\r\n          <span class=\"pm\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14\"\/><path d=\"M12 5v14\"\/><\/svg><\/span>\r\n          <span class=\"ct-label\">Add coupon code<\/span>\r\n        <\/button>\r\n\r\n        <div class=\"coupon-wrap\" id=\"couponWrap\">\r\n          <div class=\"coupon-inner\">\r\n            <div class=\"field\" style=\"margin-top:8px;\">\r\n              <label>Coupon code <span class=\"opt\">(claim benefits)<\/span><\/label>\r\n              <input type=\"text\" name=\"referralCode\" placeholder=\"Enter code\">\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <button type=\"submit\" class=\"btn-submit\" id=\"dnmSubmitBtn\">\r\n          Book Free Demo \r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14\"\/><path d=\"m12 5 7 7-7 7\"\/><\/svg>\r\n        <\/button>\r\n        <p class=\"form-fine\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"vertical-align:-2px; margin-right:4px;\"><rect width=\"18\" height=\"11\" x=\"3\" y=\"11\" rx=\"2\" ry=\"2\"\/><path d=\"M7 11V7a5 5 0 0 1 10 0v4\"\/><\/svg> Your details stay private. We call only to schedule your demo.<\/p>\r\n      <\/form>\r\n\r\n      <div class=\"form-success\" id=\"dnmFormSuccess\">\r\n        <div class=\"s-ic\">\r\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z\"\/><path d=\"M20 2v4\"\/><path d=\"M22 4h-4\"\/><circle cx=\"4\" cy=\"20\" r=\"2\"\/><\/svg>\r\n        <\/div>\r\n        <h3 id=\"thanksName\">Thank you!<\/h3>\r\n        <p id=\"thanksMsg\">Our team will call you within 24 hours to schedule your free demo.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  \/\/ Webhook Script Initialization\r\nif (typeof window.vedaSubmit !== 'function') {\r\n    window.VEDA_CONFIG = window.VEDA_CONFIG || {\r\n      \/\/ 1. IS THIS YOUR ACTUAL GOOGLE SCRIPT URL?\r\n      ENDPOINT: 'https:\/\/script.google.com\/macros\/s\/AKfycbwFv340AXYIs_UrG0Jk6Xvugod--96AZ20_YYFqcK2OyzZ2pFzJ9sBTTEGa1L3WwQXzmw\/exec', \r\n      \r\n      \/\/ 2. DOES THIS EXACTLY MATCH THE 'EXPECTED_TOKEN' IN YOUR GOOGLE SCRIPT?\r\n      TOKEN: 'donothing_secret_v1_9a8b7c6d5e' \r\n    };\r\n    window.vedaSubmit = function(payload) {\r\n      payload.token = window.VEDA_CONFIG.TOKEN;\r\n      payload.pageUrl = window.location.href;\r\n      payload.origin = window.location.origin;\r\n      var formBody = new URLSearchParams();\r\n      Object.keys(payload).forEach(function(key) {\r\n        formBody.append(key, payload[key] == null ? '' : String(payload[key]));\r\n      });\r\n      return fetch(window.VEDA_CONFIG.ENDPOINT, {\r\n        method: 'POST',\r\n        mode: 'no-cors',\r\n        keepalive: true,\r\n        body: formBody\r\n      });\r\n    };\r\n  }\r\n\r\n  document.addEventListener('DOMContentLoaded', function() {\r\n\r\n    \/* ===== Reveal Animation Logic ===== *\/\r\n    const observer = new IntersectionObserver((entries) => {\r\n      entries.forEach(entry => {\r\n        if(entry.isIntersecting) {\r\n          entry.target.classList.add('in');\r\n          observer.unobserve(entry.target);\r\n        }\r\n      });\r\n    }, { threshold: 0.12, rootMargin: '0px 0px -40px 0px' });\r\n\r\n    document.querySelectorAll('.dnm-cta-form-section .vj-reveal').forEach(el => observer.observe(el));\r\n\r\n    \/* ===== Coupon Toggle Logic ===== *\/\r\n    const couponToggle = document.getElementById('couponToggle');\r\n    const couponWrap = document.getElementById('couponWrap');\r\n    if (couponToggle && couponWrap) {\r\n      const couponLabel = couponToggle.querySelector('.ct-label');\r\n      const couponInput = couponWrap.querySelector('input');\r\n      couponToggle.addEventListener('click', () => {\r\n        const isOpen = couponWrap.classList.toggle('open');\r\n        couponToggle.setAttribute('aria-expanded', isOpen ? 'true' : 'false');\r\n        if (couponLabel) couponLabel.textContent = isOpen ? 'Remove coupon code' : 'Add coupon code';\r\n        if (isOpen) {\r\n          if (couponInput) setTimeout(() => couponInput.focus(), 220);\r\n        } else {\r\n          if (couponInput) couponInput.value = '';\r\n        }\r\n      });\r\n    }\r\n\r\n    \/* ===== Website Normalizer ===== *\/\r\n    \/\/ Accepts a bare domain (www.institute.com) OR a full http(s):\/\/ link.\r\n    \/\/ Anything without a scheme is saved as https:\/\/ automatically.\r\n    function normalizeWebsite(value) {\r\n      var v = (value || '').trim();\r\n      if (!v) return '';\r\n      if (!\/^https?:\\\/\\\/\/i.test(v)) {\r\n        v = 'https:\/\/' + v.replace(\/^\\\/+\/, '');\r\n      }\r\n      return v;\r\n    }\r\n\r\n    \/* ===== Form Submission Logic & Webhook ===== *\/\r\n    const form = document.getElementById('dnmDemoForm');\r\n    const success = document.getElementById('dnmFormSuccess');\r\n    const submitBtn = document.getElementById('dnmSubmitBtn');\r\n\r\n    if(form && submitBtn) {\r\n      form.addEventListener('submit', (e) => {\r\n        e.preventDefault();\r\n\r\n        \/\/ Check required fields and show red borders if empty\r\n        if(!form.checkValidity()) { \r\n          form.reportValidity(); \r\n          return; \r\n        }\r\n\r\n        submitBtn.disabled = true;\r\n\r\n        \/\/ Prepare Data Payload\r\n        const payload = {\r\n          formName: \"LMS Demo Request\",\r\n          name: form.name.value.trim(),\r\n          institute: form.institute.value.trim(),\r\n          phone: form.phone.value.trim(),\r\n          email: form.email.value.trim(),\r\n          website: normalizeWebsite(form.website.value),\r\n          referralCode: form.referralCode ? form.referralCode.value.trim().toUpperCase() : ''\r\n        };\r\n\r\n        \/\/ Personalize Success Message\r\n        const firstName = payload.name.split(' ')[0];\r\n        document.getElementById('thanksName').textContent = 'Thank you, ' + (firstName || 'there') + '!';\r\n        document.getElementById('thanksMsg').textContent = 'Our team will call you within 24 hours to schedule your free demo for ' + payload.institute + '.';\r\n\r\n        \/\/ Fire the request in the background (keepalive keeps it alive) and\r\n        \/\/ show success instantly \u2014 the user never waits on the round-trip.\r\n        try { window.vedaSubmit(payload); } catch (err) {}\r\n        form.style.display = 'none';\r\n        success.classList.add('show');\r\n        success.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n      });\r\n    }\r\n  });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b4b17b5 e-flex e-con-boxed e-con e-parent\" data-id=\"b4b17b5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e14377b elementor-widget elementor-widget-html\" data-id=\"e14377b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"dnc-root\" id=\"dncRoot\">\r\n  <div class=\"dnc-backdrop\" id=\"dncBackdrop\"><\/div>\r\n  <div class=\"dnc-panel\" id=\"dncPanel\" role=\"dialog\" aria-label=\"Chat with support\">\r\n    <div class=\"dnc-head\">\r\n      <span class=\"dnc-avatar\"><img decoding=\"async\" src=\"https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/logo-1.png\" alt=\"Do Nothing\"><\/span>\r\n      <div><b>Do Nothing Support<\/b><span><span class=\"dnc-status\"><\/span>Online now, replies in seconds<\/span><\/div>\r\n      <div class=\"dnc-hbtns\">\r\n        <a class=\"dnc-call\" href=\"tel:+918076038376\" aria-label=\"Call us at 8076038376\"><svg aria-hidden=\"true\" class=\"lucide lucide-phone\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384\" \/> <\/svg><\/a>\r\n        <button class=\"dnc-close\" id=\"dncClose\" aria-label=\"Close chat\"><svg aria-hidden=\"true\" class=\"lucide lucide-x\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"17\" height=\"17\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M18 6 6 18\" \/> <path d=\"m6 6 12 12\" \/> <\/svg><\/button>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"dnc-body\" id=\"dncBody\"><\/div>\r\n    <div class=\"dnc-chips\" id=\"dncChips\"><button type=\"button\" class=\"dnc-chip\">What will it cost?<\/button><button type=\"button\" class=\"dnc-chip\">How fast can we go live?<\/button><button type=\"button\" class=\"dnc-chip\">Is my content safe from piracy?<\/button><button type=\"button\" class=\"dnc-chip\">Do parents get an app?<\/button><button type=\"button\" class=\"dnc-chip\">Book a demo<\/button><\/div>\r\n    <div class=\"dnc-foot\">\r\n      <input class=\"dnc-input\" id=\"dncInput\" placeholder=\"Type your question here\" autocomplete=\"off\">\r\n      <button class=\"dnc-send\" id=\"dncSend\" aria-label=\"Send message\"><svg aria-hidden=\"true\" class=\"lucide lucide-send\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" > <path d=\"M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z\" \/> <path d=\"m21.854 2.147-10.94 10.939\" \/> <\/svg><\/button>\r\n    <\/div>\r\n    <div class=\"dnc-note\">Call 80760 38376 or write to connect@donothing.co.in<\/div>\r\n  <\/div>\r\n  <button class=\"dnc-launch\" id=\"dncLaunch\" aria-label=\"Chat with us\"><span class=\"dnc-ring\"><\/span><svg class=\"dnc-logo\" aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"26\" height=\"26\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M7.9 20A9 9 0 1 0 4 16.1L2 22Z\"\/><\/svg><span class=\"dnc-badge\"><\/span><\/button>\r\n<\/div>\r\n<style>\r\n.dnc-root{font-family:'Manrope',system-ui,sans-serif;position:fixed;z-index:990;right:22px;bottom:22px;\r\n  -webkit-font-smoothing:antialiased;line-height:1.55;color:#303030}\r\n.dnc-root *{box-sizing:border-box;margin:0;padding:0}\r\n.dnc-backdrop{display:none;position:fixed;inset:0;background:rgba(23,23,23,.5);z-index:-1}\r\n.dnc-launch{width:52px;height:52px;border-radius:99px;background:#FFCF21;border:none;cursor:pointer;position:relative;overflow:visible;display:grid;place-items:center;\r\n  display:grid;place-items:center;color:#303030;box-shadow:0 10px 28px rgba(255,207,33,.45),0 4px 12px rgba(48,48,48,.18);\r\n  transition:transform .15s ease, background .2s ease;position:relative}\r\n\r\n.dnc-launch:focus-visible{outline:3px solid rgba(255,207,33,.6);outline-offset:3px}\r\n.dnc-launch{animation:dncBob 3.2s ease-in-out infinite}\r\n@keyframes dncBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}\r\n.dnc-launch:hover{animation-play-state:paused}\r\n\r\n\/* Updated logo hover styling *\/\r\n.dnc-logo{position:relative;z-index:2;width:23px;height:23px;color:#303030;flex:none;transition:transform .35s cubic-bezier(.34,1.56,.64,1), color .2s ease}\r\n.dnc-launch:hover .dnc-logo{transform:rotate(-8deg) scale(1.12); color: #ffffff;}\r\n\r\n.dnc-ring{position:absolute;inset:0;border-radius:99px;border:2px solid #FFCF21;opacity:0;z-index:1;\r\n  animation:dncRing 2.6s ease-out infinite}\r\n@keyframes dncRing{0%{transform:scale(1);opacity:.55}70%{opacity:0}100%{transform:scale(1.7);opacity:0}}\r\n.dnc-root.open .dnc-ring{display:none}\r\n.dnc-badge{position:absolute;top:2px;right:2px;width:13px;height:13px;border-radius:99px;background:#2BA84A;border:2.5px solid #FAFAF7}\r\n.dnc-panel{position:absolute;right:0;bottom:74px;width:372px;max-width:calc(100vw - 32px);height:540px;\r\n  max-height:calc(100vh - 120px);background:#FAFAF7;border:1px solid #ECECE8;border-radius:22px;overflow:hidden;\r\n  display:none;flex-direction:column;box-shadow:0 24px 60px rgba(48,48,48,.24)}\r\n.dnc-panel.open{display:flex}\r\n.dnc-head{background:linear-gradient(312deg,#232323 41.04%,#313131 73.86%);color:#fff;padding:16px 18px;\r\n  display:flex;align-items:center;gap:12px}\r\n.dnc-avatar{width:38px;height:38px;border-radius:12px;background:#fff;border:1px solid rgba(255,255,255,.5);display:grid;place-items:center;overflow:hidden;flex:none}\r\n.dnc-avatar img{width:100%;height:100%;object-fit:contain;padding:5px;display:block}\r\n.dnc-head b{display:block;font-size:15px;font-weight:600}\r\n.dnc-head span{display:block;font-size:11.5px;color:rgba(255,255,255,.65)}\r\n.dnc-status{display:inline-block;width:7px;height:7px;border-radius:99px;background:#2BA84A;margin-right:5px}\r\n.dnc-hbtns{margin-left:auto;display:flex;gap:8px}\r\n.dnc-call,.dnc-close{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:#fff;\r\n  width:32px;height:32px;border-radius:10px;cursor:pointer;display:grid;place-items:center;text-decoration:none}\r\n.dnc-call:hover,.dnc-close:hover{background:#FFCF21;color:#303030;border-color:#FFCF21}\r\n.dnc-body{flex:1;overflow-y:auto;padding:18px 16px;display:flex;flex-direction:column;gap:10px;\r\n  background:#FAFAF7 url('https:\/\/donothing.co.in\/app\/wp-content\/uploads\/2026\/07\/chat-bg.webp') repeat;\r\n  background-size:380px auto}\r\n.dnc-msg{max-width:82%;padding:11px 14px;border-radius:16px;font-size:13.5px;box-shadow:0 1px 2px rgba(48,48,48,.08)}\r\n.dnc-bot{background:#fff;border:1px solid #ECECE8;border-bottom-left-radius:6px;align-self:flex-start;color:#303030}\r\n.dnc-user{background:#303030;color:#fff;border-bottom-right-radius:6px;align-self:flex-end}\r\n.dnc-msg a{color:inherit;font-weight:600}\r\n.dnc-typing{display:inline-flex;gap:4px;padding:13px 15px;background:#fff;border:1px solid #ECECE8;\r\n  border-radius:16px;border-bottom-left-radius:6px;align-self:flex-start;box-shadow:0 1px 2px rgba(48,48,48,.08)}\r\n.dnc-typing i{width:6px;height:6px;border-radius:99px;background:#C9C9C2;animation:dncb 1.1s infinite}\r\n.dnc-typing i:nth-child(2){animation-delay:.15s}\r\n.dnc-typing i:nth-child(3){animation-delay:.3s}\r\n@keyframes dncb{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}\r\n.dnc-chips{display:flex;flex-wrap:wrap;gap:7px;padding:10px 16px;background:#fff;border-top:1px solid #ECECE8}\r\n.dnc-chip{border:1px solid #ECECE8;background:#FAFAF7;border-radius:999px;padding:7px 13px;font-size:12px;\r\n  font-weight:600;cursor:pointer;color:#303030;font-family:'Manrope',sans-serif;transition:all .14s ease}\r\n.dnc-chip:hover{background:#FFF6D6;border-color:#F3E2A0}\r\n.dnc-foot{display:flex;gap:8px;padding:12px 14px;background:#fff}\r\n.dnc-input{flex:1;border:1px solid #ECECE8;border-radius:12px;padding:11px 13px;font-size:13.5px;\r\n  font-family:'Manrope',sans-serif;background:#FAFAF7;color:#303030;min-width:0}\r\n.dnc-input:focus{outline:none;border-color:#303030;box-shadow:0 0 0 3px rgba(255,207,33,.35)}\r\n.dnc-send{width:44px;height:44px;border-radius:12px;background:#FFCF21;border:none;cursor:pointer;\r\n  display:grid;place-items:center;color:#303030;flex:none;transition:transform .14s ease}\r\n.dnc-send:hover{transform:translateY(-1px)}\r\n.dnc-note{text-align:center;font-size:10.5px;color:rgba(48,48,48,.5);padding:0 12px 9px;background:#fff}\r\n@media(max-width:640px){\r\n  .dnc-root{right:14px;bottom:calc(14px + env(safe-area-inset-bottom))}\r\n  .dnc-launch{width:48px;height:48px}\r\n  .dnc-logo{width:21px;height:21px}\r\n  .dnc-root.open .dnc-launch{display:none}\r\n  .dnc-root.open .dnc-backdrop{display:block}\r\n  \/* full bottom-sheet, safe-area aware, keyboard-safe *\/\r\n  .dnc-panel{position:fixed;right:0;left:0;bottom:0;top:auto;width:100%;max-width:100%;\r\n    height:86dvh;max-height:86dvh;border-radius:20px 20px 0 0;border:none}\r\n  .dnc-head{padding:14px 14px;border-radius:20px 20px 0 0}\r\n  .dnc-avatar{width:36px;height:36px}\r\n  .dnc-head b{font-size:14.5px}\r\n  .dnc-body{padding:16px 14px}\r\n  .dnc-msg{font-size:14px;max-width:88%}\r\n  .dnc-chips{padding:10px 14px}\r\n  .dnc-input{font-size:16px}\r\n  .dnc-send{width:48px;height:48px}\r\n  .dnc-foot{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}\r\n  .dnc-note{padding-bottom:calc(9px + env(safe-area-inset-bottom))}\r\n}\r\n@media(prefers-reduced-motion:reduce){.dnc-launch,.dnc-send,.dnc-chip{transition:none;animation:none}.dnc-typing i{animation:none}.dnc-ring{animation:none;display:none}.dnc-logo{transition:none}}\r\n<\/style>\r\n<script>\r\n\r\n(function(){\r\nvar KB = [{\"k\": [\"price\", \"pricing\", \"cost\", \"charges\", \"kitna\", \"rate\", \"expensive\", \"budget\", \"plan\", \"subscription\"], \"a\": \"Pricing depends on your student count and the modules you pick, so there is no fixed rate card. Most owners tell us it works out to less than one staff salary per month. Roughly how many students do you have? I can get an exact quote arranged for you.\"}, {\"k\": [\"demo\", \"trial\", \"try\", \"test drive\", \"see it\", \"dekhna\"], \"a\": \"Sure, we do a free 30 minute demo online where you see the whole platform with sample data from an institute like yours. Fill the form on this page or share your phone number here and our team will call within 24 hours to fix a time.\"}, {\"k\": [\"white label\", \"whitelabel\", \"own app\", \"my brand\", \"logo\", \"own name\", \"play store\", \"app store\", \"branding\"], \"a\": \"Yes, fully white label. The Student, Mentor and Parent apps go live on Google Play and the App Store under your institute name, your logo and your colours. Students never see our brand anywhere. Usually live within 5 to 7 working days.\"}, {\"k\": [\"setup\", \"how long\", \"go live\", \"start kab\", \"launch\", \"implementation\", \"onboard\"], \"a\": \"Most institutes go live in 5 to 7 working days. That includes your branded apps, importing your existing data and training your staff. Our team handles the whole setup, you do not need a technical person.\"}, {\"k\": [\"migrate\", \"migration\", \"import\", \"excel\", \"tally\", \"existing data\", \"transfer data\", \"old software\", \"switch\"], \"a\": \"We import your existing student, batch and fee data from Excel, Tally or any other software free of cost during onboarding. Nothing gets lost in the switch and your team does not have to re-enter anything.\"}, {\"k\": [\"live class\", \"bandwidth\", \"internet slow\", \"low latency\", \"lag\", \"video quality\", \"network\", \"connection\"], \"a\": \"Live classes run in HD and automatically adjust quality when a student has slow internet, so nobody gets thrown out. Every class is recorded on its own, so a missed class can be watched later the same day.\"}, {\"k\": [\"piracy\", \"screen record\", \"security\", \"leak\", \"watermark\", \"content safe\", \"steal\", \"download video\", \"copy\"], \"a\": \"Your content stays yours. Videos are encrypted, carry a dynamic watermark with the student name and phone number, screen recording is blocked, and each student account is limited to one mobile plus one web device. Leaks become traceable and pointless.\"}, {\"k\": [\"fee\", \"payment\", \"upi\", \"razorpay\", \"collect\", \"installment\", \"instalment\", \"gateway\", \"receipt\", \"gst\", \"invoice\", \"dues\"], \"a\": \"Parents pay online through UPI, cards, net banking or wallets. The system tracks dues and instalments, sends automatic reminders on WhatsApp and SMS, generates GST invoices and receipts on its own. Most institutes see 70 to 80 percent of fees move online within two months.\"}, {\"k\": [\"attendance\", \"biometric\", \"qr\", \"present\", \"absent\"], \"a\": \"Attendance works three ways: biometric, QR scan or one tap in the mentor app. The moment it is marked, parents get an automatic WhatsApp or SMS alert. For live classes it gets marked on its own based on who joined.\"}, {\"k\": [\"parent\", \"guardian\", \"ptm\", \"father\", \"mother\"], \"a\": \"Parents get their own portal. They see attendance alerts the moment their child reaches class, test marks with batch comparison, fee dues with online payment, teacher feedback and PTM reminders. In tier 2 and 3 cities this alone convinces many parents to stay enrolled.\"}, {\"k\": [\"branch\", \"franchise\", \"multiple\", \"multi\", \"locations\", \"centers\", \"centres\", \"chain\"], \"a\": \"Yes, built for it. You run every branch or franchise from one owner dashboard with branch-wise students, fees, attendance and reports. Branch managers get role-based access so they only see their own centre.\"}, {\"k\": [\"offline\", \"physical\", \"classroom only\", \"no online\", \"traditional\"], \"a\": \"Plenty of our institutes are fully offline. They use it for attendance, fee collection, tests, reports and parent communication. Online classes are there whenever you want them, but nothing forces you to teach online.\"}, {\"k\": [\"hindi\", \"language\", \"regional\", \"marathi\", \"tamil\", \"telugu\", \"bengali\", \"gujarati\"], \"a\": \"The platform works in Hindi and major regional languages, and our onboarding training also happens in Hindi or English, whichever your staff prefers.\"}, {\"k\": [\"support\", \"help\", \"training\", \"staff\", \"teach us\", \"customer care\"], \"a\": \"You get full onboarding training for your staff plus ongoing support on call and WhatsApp. The platform is made for non-technical users, most front desk teams are comfortable within a day or two.\"}, {\"k\": [\"whatsapp\", \"sms\", \"message\", \"notification\", \"alert\", \"reminder\"], \"a\": \"WhatsApp Business API is built in. Fee reminders, attendance alerts, class notices and results go out automatically on WhatsApp and SMS, so your office staff stops making those calls manually.\"}, {\"k\": [\"mock test\", \"exam\", \"jee\", \"neet\", \"upsc\", \"omr\", \"question bank\", \"test series\", \"rank\"], \"a\": \"You can run full mock tests on JEE, NEET and UPSC patterns with a question bank, OMR and subjective answers, instant results, rank lists and weak topic analysis for every student. Students say the rank list keeps them pushing.\"}, {\"k\": [\"doubt\", \"doubt bot\", \"ask question\", \"24x7\", \"instant answer\"], \"a\": \"Students can raise doubts by typing or clicking a photo of the problem. Teachers answer from their app, and there is also an instant doubt assistant that handles common questions any time of night so students are never stuck at 1 AM before an exam.\"}, {\"k\": [\"certificate\", \"completion\", \"id card\"], \"a\": \"Completion certificates and student ID cards are generated automatically with your institute branding. No designing, no printing shop visits unless you want physical copies.\"}, {\"k\": [\"capacity\", \"scale\", \"how many students\", \"10000\", \"large\", \"big institute\", \"small\"], \"a\": \"We run institutes from 40 students to chains above 10,000. The platform is cloud based with 99.9 percent uptime, so it grows with you and you never buy servers.\"}, {\"k\": [\"contact\", \"phone\", \"call me\", \"talk\", \"number\", \"email\", \"reach\"], \"a\": \"You can write to connect@donothing.co.in or call us directly at 80760 38376. You can also drop your number right here and our team will call you within 24 hours.\"}, {\"k\": [\"security data\", \"privacy\", \"dpdp\", \"data safe\", \"backup\"], \"a\": \"Student data is encrypted, backed up daily and handled as per Indian data protection rules. Admin logins have OTP verification and every action leaves an audit trail, so you always know who changed what.\"}];\r\nvar open = false;\r\nvar askedPhone = false;\r\nvar root = document.getElementById('dncRoot');\r\nvar panel = document.getElementById('dncPanel');\r\nvar body = document.getElementById('dncBody');\r\nvar input = document.getElementById('dncInput');\r\nvar chipsBox = document.getElementById('dncChips');\r\n\r\nfunction el(cls, html){ var d=document.createElement('div'); d.className=cls; d.innerHTML=html; return d; }\r\nfunction scroll(){ body.scrollTop = body.scrollHeight; }\r\nfunction botSay(text, delay){\r\n  var t = el('dnc-typing','<i><\/i><i><\/i><i><\/i>');\r\n  body.appendChild(t); scroll();\r\n  setTimeout(function(){\r\n    t.remove();\r\n    body.appendChild(el('dnc-msg dnc-bot', text));\r\n    scroll();\r\n  }, delay || (500 + Math.min(text.length*6, 1100)));\r\n}\r\nfunction userSay(text){ body.appendChild(el('dnc-msg dnc-user', text)); scroll(); }\r\n\r\nfunction score(msg, keys){\r\n  var s = 0;\r\n  for (var i=0;i<keys.length;i++){ if (msg.indexOf(keys[i]) !== -1) s += keys[i].length > 5 ? 2 : 1; }\r\n  return s;\r\n}\r\nfunction hasPhone(msg){ return (msg.replace(\/\\D\/g,'').length >= 10); }\r\n\r\nfunction answer(raw){\r\n  var msg = raw.toLowerCase();\r\n  if (hasPhone(msg)){\r\n    askedPhone = false;\r\n    botSay(\"Got it, thank you. Our team will call you within 24 hours on this number. If you want, keep asking questions in the meantime.\");\r\n    return;\r\n  }\r\n  if (\/^(hi|hii|hello|hey|namaste|namaskar|good (morning|afternoon|evening))\\b\/.test(msg)){\r\n    botSay(\"Hello! Ask me anything about the platform, or tap one of the quick questions below.\"); return;\r\n  }\r\n  if (\/thank|thanks|dhanyavad|shukriya\/.test(msg)){\r\n    botSay(\"Happy to help. If you want a proper walkthrough, just drop your phone number here and we will set up a free demo.\"); return;\r\n  }\r\n  if (\/\\b(bye|goodbye|see you|ok bye)\\b\/.test(msg)){\r\n    botSay(\"Take care. We are here whenever you are ready. You can also call 80760 38376 or write to connect@donothing.co.in.\"); return;\r\n  }\r\n  var best = null, bestScore = 0;\r\n  for (var i=0;i<KB.length;i++){\r\n    var s = score(msg, KB[i].k);\r\n    if (s > bestScore){ bestScore = s; best = KB[i]; }\r\n  }\r\n  if (best && bestScore > 0){ botSay(best.a); return; }\r\n  if (!askedPhone){\r\n    askedPhone = true;\r\n    botSay(\"Good question, and I want you to get a proper answer rather than a vague one. Share your phone number here and our team will call you within 24 hours. Or ask me about pricing, setup time, white label apps, fee collection or content security.\");\r\n  } else {\r\n    botSay(\"I may not have that one on hand. Call us at 80760 38376, write to connect@donothing.co.in, or leave your number here and someone from the team will get back to you quickly.\");\r\n  }\r\n}\r\n\r\nfunction send(){\r\n  var v = input.value.trim();\r\n  if (!v) return;\r\n  input.value = '';\r\n  userSay(v);\r\n  setTimeout(function(){ answer(v); }, 250);\r\n}\r\n\r\nfunction setOpen(v){\r\n  open = v;\r\n  panel.classList.toggle('open', open);\r\n  root.classList.toggle('open', open);\r\n  if (open && !body.hasChildNodes()) botSay(\"Hello! Welcome to Do Nothing LMS. Ask me anything about pricing, setup, apps, fee collection, content security, whatever is on your mind. I am here to help.\", 600);\r\n  if (open && window.innerWidth > 640) setTimeout(function(){ input.focus(); }, 300);\r\n}\r\ndocument.getElementById('dncLaunch').addEventListener('click', function(){ setOpen(!open); });\r\ndocument.getElementById('dncClose').addEventListener('click', function(){ setOpen(false); });\r\ndocument.getElementById('dncBackdrop').addEventListener('click', function(){ setOpen(false); });\r\ndocument.getElementById('dncSend').addEventListener('click', send);\r\ninput.addEventListener('keydown', function(e){ if (e.key === 'Enter') send(); });\r\nchipsBox.addEventListener('click', function(e){\r\n  var c = e.target.closest('.dnc-chip');\r\n  if (!c) return;\r\n  userSay(c.textContent);\r\n  setTimeout(function(){ answer(c.textContent); }, 250);\r\n});\r\n})();\r\n\r\n<\/script>\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>Learning Management Platform One Platform To Run Your Institute&#8217;slive classes Admissions, live classes, fees, attendance, tests and parent updates, all in one branded app for students, mentors and parents. You run the teaching, the platform runs the rest. Student AppMentor AppAdmin Portal Parent PortalAndroid + iOS Book a free demo See how it works Trusted [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-192","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/pages\/192","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/comments?post=192"}],"version-history":[{"count":254,"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/pages\/192\/revisions"}],"predecessor-version":[{"id":527,"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/pages\/192\/revisions\/527"}],"wp:attachment":[{"href":"https:\/\/donothing.co.in\/app\/wp-json\/wp\/v2\/media?parent=192"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}