/* OneLMS product landing pages (/private-lms/, /hybrid-lms/, /online-institute-management-system/,
   /offline-institute-management-system/). Same look as the home page. /tutors/ keeps its own inline copy. */
:root{--ink:#0d1526;--txt:#2b3a4f;--muted:#64748b;--paper:#fff;--paper-2:#f6f9fe;--paper-3:#eef3fb;--line:#e8edf6;--line-2:#d5dfef;
  --brand:#2563eb;--brand-2:#1d4ed8;--brand-tint:#eff4ff;--brand-tint-2:#dbe7ff;--ok:#0d8a5c;
  --r:16px;--r-sm:10px;--shadow:0 1px 2px rgba(16,24,40,.04),0 12px 28px -12px rgba(16,24,40,.15);--shadow-brand:0 8px 20px -8px rgba(37,99,235,.5);
  --btn-grad:linear-gradient(180deg,#3b82f6 0%,#2563eb 55%,#1d4ed8 100%);
  --btn-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 1px 2px rgba(16,24,40,.12),0 10px 24px -10px rgba(37,99,235,.6);
  --wa-grad:linear-gradient(180deg,#0f9a5c 0%,#0a7a4b 100%);
  --wa-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(16,24,40,.12),0 10px 24px -10px rgba(10,122,75,.55)}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--txt);font:15px/1.62 'Inter',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:'Inter Tight','Inter',sans-serif;color:var(--ink);letter-spacing:-.02em;line-height:1.14;font-weight:600}
b{font-weight:600;color:var(--ink)}
.ic{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ic.fill{fill:currentColor;stroke:none}
#sprite{position:absolute;width:0;height:0;overflow:hidden}
section{padding:72px 28px;scroll-margin-top:66px}
.wrap{max-width:1100px;margin:0 auto}
.alt{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.shead{max-width:700px;margin:0 auto 40px;text-align:center}
.shead h2{font-size:clamp(26px,3.6vw,36px)}
.shead p{margin-top:12px;color:var(--muted);font-size:15.5px}
/* buttons: one system shared with the home page (pill shape, soft gradient, lift on hover) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:50px;padding:12px 26px;border-radius:999px;font:600 15px/1.25 'Inter';letter-spacing:-.005em;text-align:center;cursor:pointer;border:1px solid transparent;-webkit-tap-highlight-color:transparent;transition:transform .18s ease,box-shadow .18s ease,background-color .18s,border-color .18s,color .18s}
.btn .ic{width:18px;height:18px;transition:transform .18s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.985)}
.btn:focus-visible{outline:3px solid var(--brand-tint-2);outline-offset:2px}
.btn:hover .ic:has(use[href="#i-arrow"]){transform:translateX(3px)}
.btn-pri{background:var(--btn-grad);color:#fff;box-shadow:var(--btn-shadow)}
.btn-pri:hover{box-shadow:var(--btn-shadow),0 16px 30px -14px rgba(37,99,235,.55)}
.btn-ghost{background:var(--paper);color:var(--ink);border-color:var(--line-2);box-shadow:0 1px 2px rgba(16,24,40,.06)}
.btn-ghost:hover{background:var(--brand-tint);border-color:var(--brand-tint-2);color:var(--brand)}
.btn-wa{background:var(--wa-grad);color:#fff;box-shadow:var(--wa-shadow)}
.btn-wa:hover{box-shadow:var(--wa-shadow),0 16px 30px -14px rgba(10,122,75,.5)}
@media(prefers-reduced-motion:reduce){.btn,.btn .ic{transition:none}.btn:hover,.btn:active{transform:none}}
/* header + breadcrumb */
header{position:sticky;top:0;z-index:200;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:14px;max-width:1100px;margin:0 auto;padding:0 28px;height:62px}
.brand{display:flex;align-items:center;gap:10px;font:600 17px 'Inter Tight';color:var(--ink);margin-right:auto}
.bmark{width:30px;height:30px;border-radius:7px;background:var(--brand);display:grid;place-items:center;color:#fff;font:600 15px 'Inter Tight'}
.nav .tel{font-size:13.5px;font-weight:600;color:var(--ink)}
.nav .btn{min-height:40px;padding:0 18px;font-size:13.5px}
.crumb{max-width:1100px;margin:0 auto;padding:16px 28px 0;font-size:13px;color:var(--muted)}
.crumb a{color:var(--brand)}
/* hero */
.hero{padding:28px 28px 64px;background:radial-gradient(58% 70% at 8% 0,var(--brand-tint) 0,transparent 68%)}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:start}
.pill{display:inline-flex;padding:7px 15px;border:1px solid var(--brand-tint-2);background:var(--brand-tint);border-radius:999px;font-size:12.5px;font-weight:500;color:var(--brand)}
.hero h1{font-size:clamp(30px,4.2vw,46px);margin-top:18px;letter-spacing:-.03em}
.hero .lede{margin-top:16px;font-size:16.5px;color:var(--muted);max-width:560px}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.chip{padding:10px 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--paper);font-size:13px;color:var(--muted)}
.chip b{display:block;font:600 20px 'Inter Tight';letter-spacing:-.02em}
.fine{margin-top:16px;font-size:13px;color:var(--muted)}
.fine a{color:var(--brand);font-weight:600}
.ticks{list-style:none;margin-top:22px;display:grid;gap:10px}
.ticks li{display:flex;gap:10px;font-size:14.5px}
.ticks .ic{width:16px;height:16px;color:var(--brand);margin-top:5px}
.dform{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--shadow);scroll-margin-top:78px}
.dform h2{font-size:22px}
.dform .sub{font-size:13.5px;color:var(--muted);margin:6px 0 18px}
.dform label{display:block;font:600 12.5px 'Inter';color:var(--ink);margin-bottom:14px}
.dform input{display:block;width:100%;margin-top:6px;padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);font:500 16px 'Inter';outline:none}
.dform input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint-2)}
.dform .btn{width:100%;margin-top:4px}
.dform .dnote{margin-top:12px;font-size:12.5px;color:var(--muted);text-align:center}
.dform .dnote a{color:var(--brand);font-weight:600}
.dform .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
/* cards */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:26px 24px}
.card .ico{width:42px;height:42px;border-radius:12px;background:linear-gradient(150deg,var(--brand-tint),var(--brand-tint-2));color:var(--brand);display:grid;place-items:center;margin-bottom:16px}
.card h3{font-size:16px}
.card p{font-size:13.5px;color:var(--muted);margin-top:6px}
.card ul{list-style:none;margin-top:12px;display:grid;gap:8px}
.card li{display:flex;gap:8px;font-size:13.5px}
.card li .ic{width:15px;height:15px;color:var(--brand);margin-top:4px}
/* comparison table */
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.tbl table{width:100%;border-collapse:collapse;min-width:520px}
.tbl th,.tbl td{padding:13px 16px;text-align:center;border-bottom:1px solid var(--line);font-size:13.5px}
.tbl th:first-child,.tbl td:first-child{text-align:left;color:var(--txt)}
.tbl thead th{font:600 14px 'Inter Tight';color:var(--ink);background:var(--paper-2)}
.tbl tbody tr:last-child td{border-bottom:none}
.tbl .hl{background:var(--brand-tint)}
.tbl .y{color:var(--brand);font-weight:600}
.tbl .n{color:var(--line-2)}
.note{max-width:760px;margin:18px auto 0;text-align:center;font-size:14px;color:var(--muted)}
.note a{color:var(--brand);font-weight:600}
/* pay-after-approval reassurance: staged builds only (Hybrid, University, Custom) */
.assure{margin-top:16px;padding:12px 16px;border-radius:var(--r-sm);background:#e6f7f0;color:var(--txt);font-size:14px;line-height:1.55}
.assure b{color:var(--ok)}
/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.step{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.step .n{width:32px;height:32px;border-radius:10px;background:var(--brand-tint);color:var(--brand);display:grid;place-items:center;font:600 14px 'Inter Tight';margin-bottom:14px}
.step h3{font-size:15px}
.step p{font-size:13px;color:var(--muted);margin-top:5px}
/* faq */
.faqs{max-width:780px;margin:0 auto;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}
.faq{border-bottom:1px solid var(--line)}
.faq:last-child{border-bottom:none}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;font:600 15px 'Inter Tight';color:var(--ink);cursor:pointer;padding:18px 22px;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{width:17px;height:17px;color:var(--muted);transition:transform .25s}
.faq[open] summary .ic{transform:rotate(180deg);color:var(--brand)}
.faq p{font-size:14px;color:var(--muted);padding:0 22px 18px}
/* other plans */
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rel{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.rel:hover{border-color:var(--brand)}
.rel h3{font-size:16px}
.rel p{font-size:13px;color:var(--muted);margin-top:5px}
.rel em{display:block;font:600 14px 'Inter Tight';font-style:normal;color:var(--ink);margin-top:10px}
/* closing call to action + footer */
.cta{background:linear-gradient(135deg,#152355 0%,#1e40af 52%,#3b82f6 100%);color:#fff;border-radius:24px;padding:60px 32px;text-align:center}
.cta h2{color:#fff;font-size:clamp(25px,3.4vw,38px)}
.cta p{margin:14px auto 26px;max-width:540px;color:rgba(255,255,255,.72)}
.cta .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cta .btn{min-width:210px}
.cta .btn-light{background:#fff;color:var(--brand-2);box-shadow:0 1px 2px rgba(0,0,0,.08),0 14px 30px -14px rgba(0,0,0,.5)}
.cta .btn-light:hover{background:#f3f7ff}
.cta .btn-line{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.38);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.cta .btn-line:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.65)}
footer{padding:36px 28px;border-top:1px solid var(--line);background:var(--paper-2);text-align:center;font-size:12.5px;color:var(--muted)}
footer a{color:var(--txt);text-decoration:underline}
footer .flinks{margin-top:10px;display:flex;gap:6px 16px;flex-wrap:wrap;justify-content:center}
/* phones: Call + WhatsApp bar */
.cbar{display:none}
@media(max-width:900px){
  section{padding:52px 20px}
  .hero{padding:20px 20px 44px}
  .crumb{padding:14px 20px 0}
  .hero .wrap,.two,.related{grid-template-columns:1fr}
  .grid3{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .cbar{position:fixed;left:0;right:0;bottom:0;z-index:310;display:grid;grid-template-columns:1fr 1.5fr;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);box-shadow:0 -10px 26px -14px rgba(16,24,40,.3)}
  .cbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:999px;font:600 15px 'Inter';transition:transform .15s}
  .cbar a:active{transform:scale(.98)}
  .cbar .ic{width:19px;height:19px}
  .cbar .cb-call{border:1px solid var(--line-2);background:var(--paper);color:var(--ink);box-shadow:0 1px 2px rgba(16,24,40,.06)}
  .cbar .cb-wa{background:var(--wa-grad);color:#fff;box-shadow:var(--wa-shadow)}
  body{padding-bottom:72px}
  .nav{padding:0 20px}.nav .tel{display:none}
}
@media(max-width:560px){
  .grid3,.steps{grid-template-columns:1fr}.dform{padding:22px}.cta{padding:44px 22px}
  .cta .row{flex-direction:column;align-items:stretch}.cta .btn{width:100%;min-width:0}
  .chips{flex-wrap:nowrap}.chip{flex:1;padding:10px 12px;font-size:12px}.chip b{font-size:17px}
}