:root {
  --ka-ink: #151638;
  --ka-muted: #70769a;
  --ka-line: #e8e9f5;
  --ka-panel: #ffffff;
  --ka-canvas: #f7f8fd;
  --ka-brand: #5b36e9;
  --ka-brand-2: #792cf0;
  --ka-cyan: #18c6c2;
  --ka-gold: #f6b52e;
  --ka-shadow: 0 18px 48px rgba(33, 28, 91, .08);
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ka-canvas); color: var(--ka-ink); font: 14px/1.55 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }

.ka-app { min-height: 100vh; display: flex; }
.ka-sidebar { width: 248px; flex: 0 0 248px; min-height: 100vh; padding: 25px 15px 18px; display: flex; flex-direction: column; color: #dfe3ff; background: linear-gradient(180deg, #10112f 0%, #141545 52%, #11122e 100%); }
.ka-brand-lockup { display: flex; align-items: center; gap: 12px; padding: 0 11px 31px; text-decoration: none; }
.ka-logo { width: 39px; height: 39px; display: grid; place-items: center; flex: 0 0 39px; border-radius: 11px; color: #fff; font-size: 25px; font-weight: 950; background: linear-gradient(140deg, #744dff, #3517c8); box-shadow: 0 7px 18px rgba(80, 52, 230, .45); }
.ka-brand-lockup b { display: block; color: #fff; font-size: 18px; line-height: 1.1; }
.ka-brand-lockup small { display: block; margin-top: 5px; color: #a9a8df; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.ka-side-section { display: grid; gap: 4px; }
.ka-side-section > small { padding: 0 13px 10px; color: #777ab4; font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.ka-side-link { display: flex; align-items: center; gap: 11px; min-height: 38px; padding: 9px 12px; border-radius: 9px; color: #aeb1d8; text-decoration: none; font-size: 12px; font-weight: 650; transition: .18s ease; }
.ka-side-link:hover { color: #fff; background: rgba(123, 92, 255, .16); }
.ka-side-link.is-active { color: #fff; background: linear-gradient(90deg, #5d37df, #4a2ac6); box-shadow: 0 9px 18px rgba(61, 41, 187, .3); }
.ka-side-icon { width: 19px; color: #a79bff; text-align: center; font-size: 16px; line-height: 1; }
.ka-side-link.is-active .ka-side-icon { color: #fff; }
.ka-side-admin { margin-top: 8px; color: #ffd978; }
.ka-side-bottom { margin-top: auto; padding-top: 20px; }
.ka-side-version { padding: 18px 13px 0; color: #66699f; font-size: 10px; }
.ka-content { min-width: 0; flex: 1; }
.ka-top { position: sticky; top: 0; z-index: 20; height: 74px; border-bottom: 1px solid var(--ka-line); background: rgba(255,255,255,.9); backdrop-filter: blur(16px); }
.ka-topbar { height: 100%; display: flex; align-items: center; gap: 22px; padding: 0 35px; }
.ka-menu-toggle { display: none; border: 0; background: transparent; color: var(--ka-ink); font-size: 22px; }
.ka-search { display: flex; align-items: center; gap: 9px; width: min(415px, 45vw); padding: 0 12px; border: 1px solid var(--ka-line); border-radius: 10px; background: #fbfbfe; color: #74799e; }
.ka-search input { width: 100%; border: 0; outline: 0; padding: 11px 0; color: var(--ka-ink); background: transparent; font-size: 11px; }
.ka-search input::placeholder { color: #9da1bd; }
.ka-top-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.ka-icon-btn { width: 31px; height: 31px; border: 0; background: transparent; color: #4d527a; cursor: pointer; font-size: 17px; }
.ka-user-menu { display: flex; align-items: center; gap: 8px; min-width: 144px; text-decoration: none; }
.ka-avatar { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 800; background: linear-gradient(135deg,#f1a575,#733ce1); }
.ka-user-menu b, .ka-user-menu small { display: block; white-space: nowrap; }
.ka-user-menu b { font-size: 10px; }
.ka-user-menu small { color: var(--ka-muted); font-size: 9px; }
.ka-chevron { margin-left: auto; color: #777b9e; }
.ka-top-login { color: var(--ka-brand); font-weight: 800; text-decoration: none; }
.ka-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 10px 17px; border: 0; border-radius: 9px; color: #fff !important; background: linear-gradient(100deg, var(--ka-brand), var(--ka-brand-2)); box-shadow: 0 8px 16px rgba(91,54,233,.18); cursor: pointer; font-size: 12px; font-weight: 800; text-decoration: none; }
.ka-btn-small { min-height: 32px; padding: 7px 13px; }
.ka-btn.secondary { color: var(--ka-brand) !important; background: #f0edff; box-shadow: none; }
.ka-main { max-width: 1400px; margin: 0 auto; padding: 25px 35px 72px; }
.ka-breadcrumb { display: flex; gap: 8px; margin-bottom: 18px; color: #9a9fba; font-size: 11px; }
.ka-breadcrumb a { text-decoration: none; }
.ka-breadcrumb strong { color: #4c5179; font-weight: 700; }
.ka-card { border: 1px solid var(--ka-line); border-radius: 15px; padding: 23px; background: var(--ka-panel); box-shadow: var(--ka-shadow); }
.ka-hero { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(275px,.8fr); gap: 18px; }
.ka-hero > .ka-card:first-child { min-height: 250px; color: #fff; border: 0; overflow: hidden; background: radial-gradient(circle at 78% 22%, rgba(151,129,255,.75), transparent 17%), linear-gradient(125deg,#252172,#5f37dd 63%,#2b1678); }
.ka-hero > .ka-card:first-child:after { content: "✦  ✧  ★"; position: absolute; opacity: .18; transform: translate(520px,-25px) rotate(-13deg); font-size: 70px; letter-spacing: 22px; }
.ka-hero > .ka-card:first-child .ka-muted { color: #dedcff; }
.ka-hero > .ka-card:last-child { display: flex; flex-direction: column; justify-content: center; }
h1 { margin: 0 0 11px; color: var(--ka-ink); font-size: clamp(28px, 4vw, 46px); line-height: 1.05; letter-spacing: -.035em; }
.ka-hero h1 { max-width: 570px; color: #fff; font-size: clamp(30px, 4vw, 48px); }
h2 { margin: 0 0 13px; color: var(--ka-ink); font-size: 23px; line-height: 1.15; letter-spacing: -.025em; }
h3 { margin: 0 0 7px; font-size: 14px; line-height: 1.25; }
p { margin: 0 0 12px; }
.ka-muted { color: var(--ka-muted); }
.ka-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 17px; }
.ka-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 15px; margin-top: 18px; }
.ka-stat { color: var(--ka-brand); font-size: 32px; font-weight: 900; line-height: 1.1; }
.ka-pill, .ka-badge { display: inline-flex; width: max-content; align-items: center; padding: 5px 9px; border-radius: 999px; color: #4d2bd2; background: #eeebff; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ka-course { position: relative; display: flex; min-height: 190px; flex-direction: column; gap: 7px; overflow: hidden; padding: 17px; border: 1px solid var(--ka-line); border-radius: 13px; color: var(--ka-ink); background: #fff; text-decoration: none; box-shadow: 0 8px 22px rgba(33,28,91,.045); transition: .18s ease; }
.ka-course:hover { transform: translateY(-3px); box-shadow: 0 15px 30px rgba(33,28,91,.1); }
.ka-course:before { content: ""; height: 75px; margin: -17px -17px 5px; background: linear-gradient(135deg,#dee8ff,#7658ef); }
.ka-course:nth-child(3n+2):before { background: linear-gradient(135deg,#ffe4b6,#8e43dc); }
.ka-course:nth-child(3n):before { background: linear-gradient(135deg,#bff8f2,#4371e9); }
.ka-course .ka-pill { position: absolute; top: 66px; left: 12px; color: #fff; background: rgba(32,27,99,.72); }
.ka-course strong { margin-top: auto; color: #73789b; font-size: 11px; }
.ka-table { width: 100%; border-collapse: collapse; overflow: hidden; border: 1px solid var(--ka-line); border-radius: 12px; background: #fff; }
.ka-table th, .ka-table td { padding: 13px 14px; border-bottom: 1px solid var(--ka-line); text-align: left; vertical-align: middle; }
.ka-table th { color: #8186a5; background: #fafaff; font-size: 10px; letter-spacing: .09em; text-transform: uppercase; }
.ka-table tr:last-child td { border-bottom: 0; }
input, textarea, select { width: 100%; padding: 11px 12px; border: 1px solid var(--ka-line); border-radius: 9px; outline: 0; color: var(--ka-ink); background: #fff; }
input:focus, textarea:focus, select:focus { border-color: #9077ee; box-shadow: 0 0 0 3px #eeeaff; }
label { display: block; margin: 10px 0; color: #4b5077; font-size: 12px; font-weight: 750; }
.ka-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px 15px; }
.ka-form-grid .full { grid-column: 1 / -1; }
.ka-progress { height: 7px; overflow: hidden; border-radius: 99px; background: #ececf8; }
.ka-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#18c6c2,#5b36e9); }
.ka-alert { margin: 12px 0; padding: 11px 13px; border-radius: 9px; color: #87521d; background: #fff2d9; }
.ka-list { display: grid; gap: 9px; }
.ka-list a, .ka-list > div { padding: 13px; border: 1px solid var(--ka-line); border-radius: 10px; background: #fff; text-decoration: none; }
.ka-list small { display: block; margin-top: 3px; color: var(--ka-muted); }
.ka-tabs { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 15px; }
.ka-tabs a { padding: 8px 11px; border-radius: 8px; color: var(--ka-brand); background: #f0edff; font-size: 11px; font-weight: 800; text-decoration: none; }
.ka-certificate { position: relative; margin: auto; max-width: 820px; padding: 58px 40px; border: 8px solid #263064; outline: 2px solid #e3b746; outline-offset: -15px; color: #20305d; text-align: center; background: linear-gradient(135deg,#fff,#fffaf0); box-shadow: var(--ka-shadow); }
.ka-certificate h1 { color: #263064; font-family: Georgia, serif; font-size: clamp(34px,5vw,58px); }
.ka-footer { display: flex; justify-content: space-between; gap: 20px; padding: 22px 35px; border-top: 1px solid var(--ka-line); color: #7b809f; background: #fff; font-size: 11px; }
.ka-footer b { display: block; color: var(--ka-ink); font-size: 13px; }
.ka-footer span { display: block; margin-top: 3px; }
.ka-footer nav { display: flex; gap: 17px; flex-wrap: wrap; align-items: center; }
.ka-footer nav a { text-decoration: none; }
.ka-mobile-nav { display: none; }

@media (max-width: 950px) {
  .ka-sidebar { position: fixed; z-index: 50; top: 0; bottom: 0; left: -270px; transition: left .22s ease; box-shadow: 10px 0 35px rgba(10,10,38,.25); }
  .ka-sidebar.is-open { left: 0; }
  .ka-menu-toggle { display: block; }
  .ka-topbar { padding: 0 22px; }
  .ka-search { width: min(400px, 47vw); }
}
@media (max-width: 680px) {
  .ka-top { height: 62px; }
  .ka-topbar { gap: 9px; padding: 0 14px; }
  .ka-search { width: auto; flex: 1; }
  .ka-search input { font-size: 10px; }
  .ka-top-actions { gap: 2px; }
  .ka-top-actions .ka-icon-btn { display: none; }
  .ka-user-menu { min-width: auto; }
  .ka-user-menu > span:nth-child(2), .ka-chevron { display: none; }
  .ka-top-login, .ka-btn-small { display: none; }
  .ka-main { padding: 17px 14px 82px; }
  .ka-breadcrumb { margin-bottom: 12px; }
  .ka-hero { grid-template-columns: 1fr; }
  .ka-hero > .ka-card:first-child { min-height: 260px; }
  .ka-card { padding: 17px; border-radius: 12px; }
  .ka-grid { grid-template-columns: 1fr; }
  .ka-form-grid { grid-template-columns: 1fr; }
  .ka-form-grid .full { grid-column: auto; }
  .ka-table { display: block; overflow-x: auto; white-space: nowrap; }
  .ka-footer { display: block; padding: 17px 14px 76px; }
  .ka-footer nav { margin-top: 12px; }
  .ka-mobile-nav { position: fixed; z-index: 40; right: 0; bottom: 0; left: 0; display: flex; justify-content: space-around; padding: 9px 4px 8px; border-top: 1px solid var(--ka-line); background: rgba(255,255,255,.96); box-shadow: 0 -7px 22px rgba(33,28,91,.08); }
  .ka-mobile-nav a { display: grid; gap: 1px; justify-items: center; color: #7b809f; font-size: 9px; font-weight: 700; text-decoration: none; }
  .ka-mobile-nav a:first-child { color: var(--ka-brand); }
  .ka-mobile-nav span { font-size: 18px; line-height: 1; }
  .ka-certificate { padding: 45px 17px; border-width: 5px; outline-offset: -11px; }
}

/* K-Academy owned reference theme: the landing and all module surfaces share
   the same calm white canvas, violet actions, rounded panels and progress language. */
body:has(.ka-landing), body:has(.ka-module-footer) { background: #f6f7fc; }
.ka-landing { display: grid; grid-template-columns: minmax(280px,.82fr) minmax(420px,1.18fr); align-items: center; gap: 28px; padding: 30px; min-height: 430px; border: 1px solid #e8e9f5; border-radius: 22px; background: linear-gradient(135deg,#fff 0%,#fbfaff 100%); box-shadow: 0 18px 45px rgba(48,36,134,.08); overflow: hidden; }
.ka-landing-copy { padding: 8px 0 8px 8px; }
.ka-kicker { display: inline-flex; align-items: center; gap: 7px; color: #5c43e8; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ka-kicker:before { content: ''; width: 20px; height: 3px; border-radius: 4px; background: #7057ed; }
.ka-landing-copy h1 { margin: 12px 0 16px; color: #211c69; font-size: clamp(38px,4.4vw,66px); line-height: .98; letter-spacing: -.06em; }
.ka-landing-copy p { max-width: 390px; margin: 0; color: #666b8a; font-size: 15px; line-height: 1.7; }
.ka-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 24px; }
.ka-btn { border: 0; border-radius: 9px; background: linear-gradient(135deg,#4932d5,#7958f2); box-shadow: 0 8px 18px rgba(84,62,220,.2); }
.ka-btn.secondary { color: #4f3bd2; border: 1px solid #dcd8ff; background: #fff; box-shadow: none; }
.ka-trusted { display: flex; align-items: center; gap: 8px; margin-top: 28px; color: #8589a5; font-size: 11px; font-weight: 700; }
.ka-trusted span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; background: #6c4bea; }
.ka-landing-art { display: flex; justify-content: center; min-width: 0; }
.ka-landing-art img { display: block; width: min(100%,760px); height: auto; }
.ka-landing-stats { display: grid; grid-template-columns: repeat(4,1fr); margin: 18px 0 28px; border: 1px solid #e7e8f3; border-radius: 16px; background: #fff; }
.ka-landing-stats div { padding: 18px 20px; border-right: 1px solid #ededf5; }
.ka-landing-stats div:last-child { border-right: 0; }
.ka-landing-stats b { display: block; color: #281e8a; font-size: 24px; letter-spacing: -.04em; }
.ka-landing-stats small { display: block; margin-top: 4px; color: #888ca8; font-size: 11px; font-weight: 700; }
.ka-feature-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; margin-bottom: 30px; }
.ka-feature-tile { display: grid; gap: 9px; min-height: 126px; padding: 18px; border: 1px solid #e6e7f3; border-radius: 14px; color: #2e2b52; text-decoration: none; background: #fff; transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.ka-feature-tile:hover { transform: translateY(-3px); border-color: #bdb3ff; box-shadow: 0 12px 28px rgba(67,49,175,.1); }
.ka-feature-tile > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; color: #fff; background: linear-gradient(135deg,#5739de,#a47cff); font-size: 14px; }
.ka-feature-tile b { font-size: 13px; line-height: 1.25; }
.ka-feature-tile small { color: #8589a5; font-size: 10px; line-height: 1.45; }
.ka-course-showcase { padding-top: 2px; }
.ka-section-head { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 14px; }
.ka-section-head h2 { margin: 5px 0 0; color: #24204d; font-size: 24px; letter-spacing: -.04em; }
.ka-section-head > a { color: #5841da; font-size: 11px; font-weight: 800; text-decoration: none; }
.ka-course-showcase .ka-course { min-height: 180px; }
.ka-module-footer { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin: 0 26px; padding: 24px 0 28px; border-top: 1px solid #e1e2ef; color: #7d819e; }
.ka-footer-brand { display: flex; align-items: center; gap: 8px; color: #25204d; text-decoration: none; }
.ka-footer-brand span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #fff; background: linear-gradient(135deg,#4932d5,#8d68f7); font-weight: 800; }
.ka-footer-brand b { font-size: 14px; }
.ka-module-footer small { display: block; margin: 7px 0 0 36px; color: #9094ad; font-size: 10px; }
.ka-module-footer nav { display: flex; flex-wrap: wrap; justify-content: end; gap: 16px; }
.ka-module-footer nav a { color: #6d7190; font-size: 11px; font-weight: 700; text-decoration: none; }
.ka-module-footer nav a:hover { color: #543ed9; }
.ka-search { position: relative; }
.ka-live-results { position: absolute; z-index: 90; top: calc(100% + 8px); left: 0; right: 0; display: grid; gap: 5px; padding: 8px; border: 1px solid #e4e4f0; border-radius: 14px; background: #fff; box-shadow: 0 18px 40px rgba(35,25,115,.15); }
.ka-live-results a,.ka-live-results span { padding: 9px 11px; border-radius: 9px; color: #302a62; font-size: 12px; text-decoration: none; }
.ka-live-results a:hover { background: #f1efff; color: #543ed9; }
.ka-live-results span { color: #8589a5; }
.ka-form-grid input:invalid,.ka-form-grid textarea:invalid,.ka-form-grid select:invalid { border-color: #e86a72; }

@media (max-width: 950px) {
  .ka-landing { grid-template-columns: 1fr; padding: 24px; }
  .ka-landing-copy { padding-left: 0; }
  .ka-landing-art { order: -1; }
  .ka-landing-art img { max-width: 650px; }
  .ka-feature-row { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 680px) {
  .ka-landing { gap: 6px; padding: 18px; min-height: 0; border-radius: 16px; }
  .ka-landing-art { margin: -2px -8px 5px; }
  .ka-landing-copy h1 { font-size: 43px; }
  .ka-landing-copy p { font-size: 13px; }
  .ka-landing-stats { grid-template-columns: repeat(2,1fr); margin: 14px 0 20px; }
  .ka-landing-stats div { padding: 14px; border-bottom: 1px solid #ededf5; }
  .ka-landing-stats div:nth-child(2) { border-right: 0; }
  .ka-landing-stats div:nth-child(3), .ka-landing-stats div:nth-child(4) { border-bottom: 0; }
  .ka-feature-row { gap: 9px; margin-bottom: 22px; }
  .ka-feature-tile { min-height: 115px; padding: 13px; }
  .ka-section-head { align-items: start; }
  .ka-section-head h2 { font-size: 20px; }
  .ka-module-footer { display: block; margin: 0 14px; padding-bottom: 86px; }
  .ka-module-footer nav { justify-content: start; margin-top: 18px; gap: 12px; }
}
