/* ═══════════════════════════════════════════════════════════════════════
   KH — Mr Khattab El-Rayes · نظام تصميم مبني على عالمَي المنهج
   ─────────────────────────────────────────────────────────────────────
   الفكرة: الوضع الفاتح = حديقة المدرسة في ضوء النهار
           الوضع الداكن  = أعماق المحيط حيث تسير النوتلس
   كل الألوان توكنز تتبدّل مع [data-theme]، ولا لون ثابت في المكوّنات.
   ═══════════════════════════════════════════════════════════════════════ */

/* ══════════════════ 1 · توكنز الهوية المشتركة ══════════════════ */

:root {
  /* من شعار المدرس */
  --kh-crimson:    #D8202F;
  --kh-crimson-dk: #A5121F;
  --kh-gold:       #E9A22B;

  /* من عالم الحديقة */
  --kh-leaf:       #4E8B3B;
  --kh-moss:       #2F6B33;
  --kh-soil:       #2A1B10;
  --kh-terracotta: #C4562F;

  /* من عالم الأعماق */
  --kh-brass:      #C8963E;
  --kh-brass-lit:  #E7C15A;
  --kh-copper:     #A9663A;
  --kh-teal:       #2AA9BE;
  --kh-cyan:       #37C4D8;

  --kh-radius:     8px;
  --kh-radius-lg:  14px;
  --kh-radius-xl:  20px;
  --kh-ease:       cubic-bezier(.2, .7, .3, 1);

  /* العربية: Tajawal — نفس الفونت الهندسي العريض في هوية المنصة */
  --kh-font-ar: "Tajawal", "Cairo", sans-serif;
  --kh-font-en: "Plus Jakarta Sans", system-ui, sans-serif;

  color-scheme: light;
}

/* ══════════════════ 2 · الوضع الداكن — الأعماق ══════════════════ */

:root[data-theme="dark"] {
  color-scheme: dark;

  --kh-bg:        #04121D;
  --kh-bg-2:      #071E2E;
  --kh-surface:   rgba(12, 35, 51, .78);
  --kh-surface-2: rgba(18, 50, 68, .62);
  --kh-solid:     #0C2333;
  --kh-text:      #FFFFFF;
  --kh-text-2:    #EAF4FA;
  --kh-text-3:    #C9D8E4;

  --kh-border:    rgba(200, 150, 62, .30);
  --kh-border-2:  rgba(127, 227, 239, .18);
  --kh-accent:    #37C4D8;
  --kh-accent-2:  #E7C15A;
  --kh-eyebrow:   #58D2E4;
  --kh-brand-ink: #FF7A85;

  --kh-shadow:    0 18px 44px rgba(0, 0, 0, .52);
  --kh-shadow-sm: 0 8px 20px rgba(0, 0, 0, .4);

  /* حجاب قراءة النص فوق صور الهيرو */
  --kh-scrim-1:   linear-gradient(180deg, rgba(4, 18, 29, .52), rgba(4, 18, 29, .86));
  --kh-scrim-2:   radial-gradient(ellipse 78% 90% at 82% 42%, transparent, rgba(4, 18, 29, .74) 74%);
  --kh-art-filter: saturate(1.05) contrast(1.04) brightness(.94);

  --kh-glass:     rgba(4, 18, 29, .74);
  --kh-hairline:  rgba(231, 193, 90, .5);
}

/* ══════════════════ 3 · الوضع الفاتح — الحديقة ══════════════════ */

:root[data-theme="light"] {
  color-scheme: light;

  --kh-bg:        #F6F1E4;
  --kh-bg-2:      #FFFDF6;
  --kh-surface:   #FFFCF4;
  --kh-surface-2: #FBF5E8;
  --kh-solid:     #FFFCF4;
  --kh-text:      #140E09;
  --kh-text-2:    #2A1B10;
  --kh-text-3:    #4A3424;

  --kh-border:    rgba(42, 27, 16, .16);
  --kh-border-2:  rgba(78, 139, 59, .26);
  --kh-accent:    #2F6B33;
  --kh-accent-2:  #8C4F27;
  --kh-eyebrow:   #2F6B33;
  --kh-brand-ink: #B01523;

  --kh-shadow:    0 16px 38px rgba(42, 27, 16, .13);
  --kh-shadow-sm: 0 6px 16px rgba(42, 27, 16, .1);

  --kh-scrim-1:   linear-gradient(180deg, rgba(255, 253, 246, .58), rgba(246, 241, 228, .9));
  --kh-scrim-2:   radial-gradient(ellipse 78% 90% at 82% 42%, transparent, rgba(255, 253, 246, .8) 74%);
  --kh-art-filter: saturate(1.04) contrast(1.02) brightness(1.03);

  --kh-glass:     rgba(255, 253, 246, .84);
  --kh-hairline:  rgba(169, 102, 58, .45);
}

/* الجسم يتبع التوكنز، ونعم للانتقال الناعم بين الوضعين */

html {
  background: var(--kh-bg) !important;
  color: var(--kh-text) !important;
  font-size: 18px !important;
}

/* الجسم شفاف حتى تظهر طبقة الخلفية المحيطة الموضوعة خلف المحتوى */
body {
  position: relative;
  background: transparent !important;
  color: var(--kh-text) !important;
  font-family: var(--kh-font-ar), var(--kh-font-en) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  line-height: 1.85 !important;
  letter-spacing: .01em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition: color .3s var(--kh-ease);
}

button, input, select, textarea, label, .uk-btn {
  font-family: inherit;
}

/* النصوص القديمة في المنصة تتبع توكنز KH عشان تفضل واضحة في الوضعين */
:root[data-theme="dark"] {
  --text: #FFFFFF;
  --text-strong: #FFFFFF;
  --muted: #EAF4FA;
  --muted-strong: #FFFFFF;
  --field-text: #FFFFFF;
}

:root[data-theme="light"] {
  --text: #140E09;
  --text-strong: #140E09;
  --muted: #2A1B10;
  --muted-strong: #140E09;
  --field-text: #140E09;
}

h1, h2, h3, h4, h5, .uk-section__title, .uk-cta__title, .uk-auth__en,
.acc-title, .acc-card h2, .acc-card h3, .ukcat-hero h1, .ukcat-card__body h2 {
  font-weight: 800 !important;
  color: var(--kh-text) !important;
  line-height: 1.35 !important;
}

h1, .uk-cta__title, .ukcat-hero h1 {
  font-size: clamp(2rem, 4.4vw, 3.15rem) !important;
}

h2, .uk-section__title, .acc-title {
  font-size: clamp(1.55rem, 3.1vw, 2.3rem) !important;
}

h3, .acc-card h3, .ukcat-lec h3 {
  font-size: clamp(1.2rem, 2.2vw, 1.5rem) !important;
}

p, li, td, th, label, .hint, .uk-section__sub, .uk-cta__sub, .uk-auth__sub,
.ukcat-note, .ukcat-hero__sub, .ukcat-lec__desc, .acc-muted, .acc-hint,
.acc-meta, .acc-subtitle, .kh-hero__desc, .kh-board__copy p:last-child,
.kh-path__step p:last-child, .kh-stage__hint, .kh-features__card p,
.kh-reviews__card p {
  font-size: 1.08rem !important;
  font-weight: 700 !important;
  line-height: 1.9 !important;
  color: var(--kh-text) !important;
}

.uk-section__en, .uk-cta__en, .ukcat-kicker, .kh-board__en, .kh-path__en,
.kh-stage__en, .kh-hero__eyebrow, .uk-brand__sub, .acc-brand__sub,
.uk-footer__heading, .kh-hdr__eyebrow {
  font-size: .82rem !important;
  font-weight: 800 !important;
  color: var(--kh-eyebrow) !important;
}

.uk-btn, .btn-submit, .acc-nav__item, .acc-pill {
  font-size: 1.05rem !important;
  font-weight: 800 !important;
}

.input, .field .input, select.input, textarea.input {
  font-size: 1.08rem !important;
  font-weight: 700 !important;
  color: var(--kh-text) !important;
}

.input::placeholder { color: var(--kh-text-3) !important; font-weight: 600 !important; }

.uk-brand__name, .uk-footer__name, .acc-brand__name {
  font-size: 1.12rem !important;
  font-weight: 800 !important;
  color: var(--kh-text) !important;
}

.kh-hero__slogan,
.uk-hdr__tagline,
.uk-footer__tag {
  color: var(--kh-brand-ink) !important;
  font-weight: 800 !important;
}

.kh-hero__role {
  color: var(--kh-accent-2) !important;
  font-weight: 800 !important;
  font-size: 1.12rem !important;
}

.kh-hero__name {
  color: var(--kh-text) !important;
  font-weight: 800 !important;
}

html.theme-switching * {
  transition: background-color .3s var(--kh-ease), color .3s var(--kh-ease),
              border-color .3s var(--kh-ease) !important;
}

.container { width: min(1220px, calc(100% - 2rem)) !important; }

/* صفحات الحساب: الحاوية التسويقية كانت تقص العرض وتسيب فراغ على الشمال */
.acc-topbar .container,
.acc-page,
.acc-page .container,
.acc-shell .container,
.acc-main > .container,
body.parent-portal .acc-page,
body.parent-portal .acc-topbar .container {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

::selection { background: var(--kh-brass); color: #1B1206; }

.kh-motif { display: block; color: inherit; }

/* ══════════════════ 4 · الخلفية المحيطة ══════════════════ */

.kh-ambient {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

/* أعمدة ضوء: أشعة شمس في النهار، أعمدة ضوء تحت الماء في الليل */
.kh-ambient__shaft {
  position: absolute;
  inset-block-start: -14vh;
  width: 16vw;
  height: 92vh;
  filter: blur(26px);
  transform: rotate(6deg);
}

:root[data-theme="dark"] .kh-ambient__shaft {
  background: linear-gradient(180deg, rgba(127, 227, 239, .16), transparent 78%);
}

:root[data-theme="light"] .kh-ambient__shaft {
  background: linear-gradient(180deg, rgba(233, 162, 43, .2), transparent 76%);
}

.kh-ambient__shaft--a { inset-inline-start: 8%;  animation: khSway 19s ease-in-out infinite; }
.kh-ambient__shaft--b { inset-inline-start: 42%; height: 76vh; animation: khSway 25s ease-in-out infinite reverse; }
.kh-ambient__shaft--c { inset-inline-start: 74%; height: 84vh; animation: khSway 22s ease-in-out infinite; }

.kh-ambient__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(100px);
}

.kh-ambient__glow--surface {
  inset-block-start: -20vh;
  inset-inline-start: 50%;
  width: 72vw;
  height: 44vh;
  translate: -50% 0;
  background: color-mix(in srgb, var(--kh-accent) 22%, transparent);
}

.kh-ambient__glow--ember {
  inset-block-end: -16vh;
  inset-inline-end: -8vw;
  width: 46vw;
  height: 46vw;
  background: color-mix(in srgb, var(--kh-gold) 18%, transparent);
}

/* رموز القصتين — رسوم حقيقية معزولة */
.kh-ambient__motif {
  position: absolute;
  opacity: .22;
  pointer-events: none;
}

:root[data-theme="light"] .kh-ambient__motif { opacity: .28; }

.kh-ambient__motif img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 18px 28px rgba(0, 0, 0, .28));
}

.kh-ambient__motif--nautilus {
  inset-block-start: 4vh;
  inset-inline-end: -4vw;
  width: min(42vw, 460px);
  animation: khTurn 120s linear infinite;
}

.kh-ambient__motif--helm {
  inset-block-end: 6vh;
  inset-inline-start: -5vw;
  width: min(34vw, 380px);
  animation: khTurn 80s linear infinite reverse;
}

.kh-ambient__motif--can {
  inset-block-end: -2vh;
  inset-inline-end: 6vw;
  width: min(26vw, 300px);
}

.kh-ambient__motif--jelly {
  inset-block-start: 34vh;
  inset-inline-start: 3vw;
  width: min(22vw, 260px);
  animation: khFloat 16s ease-in-out infinite;
}

.kh-ambient__motif--seedling {
  inset-block-end: 1vh;
  inset-inline-start: 32vw;
  width: min(22vw, 260px);
}

.kh-ambient__particles {
  position: absolute;
  inset: 0;
  opacity: .22;
  background-image:
    radial-gradient(circle, currentColor 1px, transparent 1.7px),
    radial-gradient(circle, currentColor 1px, transparent 1.7px);
  background-size: 150px 150px, 210px 210px;
  color: var(--kh-accent);
  animation: khDrift 30s linear infinite;
}

/* قاع البحر ليلاً · حوض الزرع نهاراً */
.kh-ambient__floor {
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0;
  height: 22vh;
}

:root[data-theme="dark"] .kh-ambient__floor {
  background:
    linear-gradient(180deg, transparent, rgba(42, 27, 16, .5) 55%, rgba(42, 27, 16, .76)),
    radial-gradient(ellipse 60% 100% at 20% 100%, rgba(78, 139, 59, .14), transparent 70%);
}

:root[data-theme="light"] .kh-ambient__floor {
  background:
    linear-gradient(180deg, transparent, rgba(78, 139, 59, .1) 60%, rgba(169, 102, 58, .14)),
    radial-gradient(ellipse 60% 100% at 22% 100%, rgba(78, 139, 59, .14), transparent 70%);
}

@keyframes khSway  { 0%, 100% { transform: rotate(6deg) translateX(0); } 50% { transform: rotate(2deg) translateX(2vw); } }
@keyframes khTurn  { to { transform: rotate(360deg); } }
@keyframes khFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-26px); } }
@keyframes khDrift { to { background-position: 150px -150px, -210px 130px; } }

/* ══════════════════ 5 · الهيدر ══════════════════ */

.uk-hdr.kh-hdr {
  position: sticky;
  inset-block-start: 0;
  z-index: 120;
  border: 0 !important;
  border-block-end: 1px solid var(--kh-border) !important;
  background: var(--kh-glass) !important;
  backdrop-filter: blur(18px) saturate(1.2);
  box-shadow: var(--kh-shadow-sm);
}

/* شريط مسامير نحاسية */
.uk-hdr.kh-hdr::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-start: 0;
  height: 6px;
  background:
    repeating-linear-gradient(90deg, var(--kh-brass-lit) 0 3px, transparent 3px 26px),
    linear-gradient(90deg, var(--kh-copper), var(--kh-brass) 45%, var(--kh-crimson));
  opacity: .9;
}

.kh-hdr__beam {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: conic-gradient(from 220deg at 12% 120%,
    color-mix(in srgb, var(--kh-accent) 20%, transparent), transparent 32%);
}

.kh-hdr__grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(color-mix(in srgb, var(--kh-brass) 12%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--kh-brass) 12%, transparent) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .85), transparent);
}

.kh-hdr__top {
  background: color-mix(in srgb, var(--kh-bg) 55%, transparent) !important;
  border-block-end: 1px solid var(--kh-border) !important;
}

.kh-hdr__eyebrow {
  display: inline-flex !important;
  align-items: center;
  gap: .5rem;
  color: var(--kh-accent-2) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.kh-hdr__eyebrowIco {
  display: grid;
  place-items: center;
  color: var(--kh-brass);
  animation: khTurn 30s linear infinite;
}

.kh-hdr__top .uk-hdr__tagline {
  color: var(--kh-brand-ink) !important;
  font-weight: 800 !important;
  letter-spacing: .14em;
}

.kh-hdr__parent {
  color: var(--kh-accent) !important;
  border-block-end: 1px dotted color-mix(in srgb, var(--kh-accent) 55%, transparent);
}

.kh-hdr__bar {
  min-height: 164px !important;
  padding-block: 12px !important;
}

.uk-brand__mark {
  position: relative;
  display: grid;
  place-items: center;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.uk-brand__logo {
  width: auto !important;
  height: 140px !important;
  max-width: 128px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
  box-shadow: none !important;
  image-rendering: auto;
}

.uk-brand__logo--light { display: block !important; }
.uk-brand__logo--dark { display: none !important; }

:root[data-theme="light"] .uk-brand__logo--light,
html[data-theme="light"] .uk-brand__logo--light { display: block !important; }
:root[data-theme="light"] .uk-brand__logo--dark,
html[data-theme="light"] .uk-brand__logo--dark { display: none !important; }

:root[data-theme="dark"] .uk-brand__logo--light,
html[data-theme="dark"] .uk-brand__logo--light { display: none !important; }
:root[data-theme="dark"] .uk-brand__logo--dark,
html[data-theme="dark"] .uk-brand__logo--dark { display: block !important; }

.uk-brand__name {
  font-family: var(--kh-font-en), var(--kh-font-ar) !important;
  font-size: 1.04rem !important;
  font-weight: 800 !important;
  color: var(--kh-text) !important;
}

.uk-brand__sub {
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--kh-accent) !important;
}

.uk-burger span { background: var(--kh-accent-2) !important; }

/* سويتش الثيم */
.theme-switch {
  border: 1px solid var(--kh-border) !important;
  background: var(--kh-surface-2) !important;
}

.theme-switch__btn { color: var(--kh-text-2) !important; }
.theme-switch__btn.is-active { color: var(--kh-text) !important; }

.theme-switch__knob {
  background: linear-gradient(150deg, var(--kh-brass-lit), var(--kh-copper)) !important;
  color: #22160A !important;
}

/* ══════════════════ 6 · الأزرار ══════════════════ */

.uk-btn {
  border-radius: var(--kh-radius) !important;
  border: 1px solid transparent !important;
  font-weight: 800 !important;
  transition: transform .18s var(--kh-ease), box-shadow .18s var(--kh-ease) !important;
}

.uk-btn--red {
  background: linear-gradient(180deg, #E4303F, var(--kh-crimson-dk)) !important;
  border-color: #F2606C !important;
  color: #FFF3F4 !important;
  box-shadow: 0 8px 20px rgba(216, 32, 47, .3), inset 0 1px 0 rgba(255, 255, 255, .22) !important;
}

.uk-btn--navy {
  background: linear-gradient(180deg, var(--kh-surface-2), var(--kh-surface)) !important;
  border-color: var(--kh-brass) !important;
  color: var(--kh-accent-2) !important;
}

.uk-btn--outline {
  background: color-mix(in srgb, var(--kh-accent) 8%, transparent) !important;
  border-color: color-mix(in srgb, var(--kh-accent) 45%, transparent) !important;
  color: var(--kh-accent) !important;
}

.uk-btn--white {
  background: linear-gradient(180deg, var(--kh-brass-lit), var(--kh-brass)) !important;
  border-color: #F3DA9C !important;
  color: #24170A !important;
}

.uk-btn--onDark {
  background: transparent !important;
  border-color: color-mix(in srgb, var(--kh-text) 38%, transparent) !important;
  color: var(--kh-text) !important;
}

.uk-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--kh-shadow) !important;
}

/* ══════════════════ 7 · عناوين الأقسام ══════════════════ */

.uk-section { padding-block: clamp(2.6rem, 5vw, 4.6rem) !important; }

.uk-section__head { position: relative; margin-block-end: 1.9rem; }

.uk-section__en {
  color: var(--kh-eyebrow) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .24em;
  text-transform: uppercase;
}

.uk-section__title {
  font-family: var(--kh-font-ar), var(--kh-font-en) !important;
  font-size: clamp(1.45rem, 2.7vw, 2.15rem) !important;
  font-weight: 800 !important;
  color: var(--kh-text) !important;
}

.uk-section__sub { color: var(--kh-text-2) !important; }

/* الفاصل: عين سونار + خط نحاسي */
.uk-section__head::after {
  content: "";
  display: block;
  width: 176px;
  height: 10px;
  margin-block-start: 14px;
  background:
    radial-gradient(circle at 12px 50%, var(--kh-crimson) 3.4px, transparent 4.2px),
    radial-gradient(circle at 12px 50%, transparent 5.6px, var(--kh-brass) 5.6px 6.6px, transparent 6.8px),
    linear-gradient(90deg, transparent 0 24px, var(--kh-brass) 24px 100%) center/100% 1px no-repeat;
}

.uk-rule { display: none !important; }

/* ══════════════════ 8 · الهيرو — صورة القصة بحجمها الكامل ══════════════════ */

.kh-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: clamp(2.4rem, 6vw, 5rem) clamp(2rem, 4vw, 3.2rem);
}

.kh-hero__stage {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.kh-hero__art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: var(--kh-art-filter);
  transition: opacity .45s var(--kh-ease);
}

/* كل وضع يعرض صورة عالَمه */
:root[data-theme="dark"]  .kh-hero__art--growth,
:root[data-theme="light"] .kh-hero__art--depth { opacity: 0; }

:root[data-theme="dark"]  .kh-hero__art--depth,
:root[data-theme="light"] .kh-hero__art--growth { opacity: 1; }

.kh-hero__scrim {
  position: absolute;
  inset: 0;
  background: var(--kh-scrim-1), var(--kh-scrim-2);
}

.kh-hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(1.2rem, 3vw, 2.6rem);
  align-items: center;
}

.kh-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 .9rem;
  padding: .32rem .8rem .32rem .5rem;
  border: 1px solid var(--kh-border);
  border-radius: 999px;
  background: var(--kh-glass);
  color: var(--kh-eyebrow);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
  backdrop-filter: blur(8px);
}

.kh-hero__eyebrow .kh-motif { color: var(--kh-brass); }

.kh-hero__name {
  margin: 0;
  font-family: var(--kh-font-en), var(--kh-font-ar);
  font-size: clamp(1.9rem, 5vw, 3.5rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -.01em;
  color: var(--kh-text);
}

.kh-hero__slogan {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin: .85rem 0 0;
  padding: .34rem .85rem;
  border: 1px solid color-mix(in srgb, var(--kh-crimson) 48%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--kh-crimson) 14%, transparent);
  color: var(--kh-brand-ink);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .16em;
}

.kh-hero__slogan::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--kh-crimson);
  box-shadow: 0 0 12px var(--kh-crimson);
}

.kh-hero__role {
  margin: .9rem 0 0;
  color: var(--kh-accent-2);
  font-weight: 700;
}

.kh-hero__desc {
  margin: .7rem 0 1.5rem;
  max-width: 56ch;
  color: var(--kh-text-2);
  font-size: 1.02rem;
  line-height: 2;
}

.kh-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}

/* صورة المدرس كاملة — إطار مستطيل وليس دائرة */
.kh-hero__portraitWrap {
  display: grid;
  place-items: center;
}

.kh-hero__portrait {
  position: relative;
  margin: 0;
  width: min(420px, 100%);
  aspect-ratio: 3 / 4;
  border-radius: var(--kh-radius-xl);
  padding: 8px;
  overflow: hidden;
  background: linear-gradient(150deg, var(--kh-brass-lit), var(--kh-copper));
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--kh-brass) 28%, var(--kh-bg)),
              var(--kh-shadow);
}

.kh-hero__portrait img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: calc(var(--kh-radius-xl) - 4px);
  object-fit: cover;
  object-position: center 12%;
}

.kh-hero__portrait::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: calc(var(--kh-radius-xl) - 4px);
  pointer-events: none;
  background: linear-gradient(150deg, rgba(255, 255, 255, .22), transparent 42%);
}

/* ══════════════════ 9 · العالمان — الصور بحجم يستحقّها ══════════════════ */

.kh-worlds__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
}

.kh-world {
  position: relative;
  margin: 0;
  overflow: hidden;
  min-height: clamp(300px, 34vw, 420px);
  border: 1px solid var(--kh-border);
  border-radius: var(--kh-radius-xl);
  box-shadow: var(--kh-shadow);
}

.kh-world img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s var(--kh-ease);
}

.kh-world:hover img { transform: scale(1.05); }

.kh-world figcaption {
  position: relative;
  z-index: 1;
  display: grid;
  gap: .45rem;
  height: 100%;
  align-content: end;
  padding: clamp(1.1rem, 2.4vw, 1.8rem);
  background: linear-gradient(180deg, transparent 20%, rgba(4, 18, 29, .5) 52%, rgba(4, 18, 29, .93));
  color: #F2F9FD;
}

.kh-world__tag {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .26rem .66rem;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.kh-world__title {
  font-family: var(--kh-font-en), var(--kh-font-ar);
  font-size: clamp(1.15rem, 2.2vw, 1.5rem);
  font-weight: 800;
}

.kh-world__text {
  color: rgba(242, 249, 253, .82);
  font-size: .93rem;
  line-height: 1.85;
  max-width: 44ch;
}

.kh-world--growth { border-color: color-mix(in srgb, var(--kh-leaf) 50%, transparent); }
.kh-world--growth .kh-world__tag { background: var(--kh-leaf); color: #F4FFEC; }

.kh-world--depth { border-color: color-mix(in srgb, var(--kh-teal) 46%, transparent); }
.kh-world--depth .kh-world__tag { background: var(--kh-teal); color: #04222A; }

/* ══════════════════ 10 · المهارات — لوحة مهنية ══════════════════ */

.kh-board {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.15rem;
}

.kh-board__item {
  display: grid;
  grid-template-columns: 148px minmax(0, 1fr);
  gap: 0;
  overflow: hidden;
  min-height: 168px;
  border: 1px solid var(--kh-border);
  border-radius: var(--kh-radius-lg);
  background: var(--kh-surface);
  box-shadow: var(--kh-shadow-sm);
  transition: border-color .22s var(--kh-ease), box-shadow .22s var(--kh-ease), transform .22s var(--kh-ease);
}

.kh-board__item:hover {
  transform: translateY(-3px);
  border-color: var(--kh-brass);
  box-shadow: var(--kh-shadow);
}

.kh-board__media {
  margin: 0;
  display: grid;
  place-items: center;
  padding: 1.1rem .7rem;
  background:
    radial-gradient(circle at 50% 40%, color-mix(in srgb, currentColor 16%, transparent), transparent 68%),
    var(--kh-surface-2);
}

.kh-board__media img,
.kh-board__media .uk-meaning-icon {
  width: 112px;
  height: 112px;
  object-fit: contain;
  filter: drop-shadow(0 10px 16px rgba(0, 0, 0, .22));
}

.kh-board__copy {
  display: grid;
  align-content: center;
  gap: .18rem;
  padding: 1.15rem 1.2rem 1.15rem .4rem;
}

.kh-board__num {
  font-family: var(--kh-font-en), var(--kh-font-ar);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .18em;
  color: var(--kh-accent-2);
}

.kh-board__en {
  margin: 0;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--kh-text-3);
}

.kh-board__copy h3 {
  margin: .1rem 0 .2rem;
  font-size: 1.22rem;
  color: var(--kh-text);
}

.kh-board__copy p:last-child {
  margin: 0;
  color: var(--kh-text-2);
  font-size: .92rem;
  line-height: 1.85;
}

.kh-board__item--growth { color: var(--kh-leaf); }
.kh-board__item--ember  { color: var(--kh-terracotta); }
.kh-board__item--depth  { color: var(--kh-teal); }
.kh-board__item--abyss  { color: var(--kh-brass); }

/* ══════════════════ 11 · الرحلة — مسار مرقم ══════════════════ */

.kh-path {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kh-path::before {
  content: "";
  position: absolute;
  inset-inline: 10%;
  inset-block-start: 86px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--kh-brass) 12%, var(--kh-brass) 88%, transparent);
  opacity: .55;
}

.kh-path__step {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  text-align: center;
  gap: .35rem;
}

.kh-path__media {
  margin: 0 0 .35rem;
  display: grid;
  place-items: center;
  width: 92px;
  height: 92px;
}

.kh-path__media img,
.kh-path__media .uk-meaning-icon {
  width: 72px;
  height: 72px;
  object-fit: contain;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .2));
}

.kh-path__n {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-block: .15rem .25rem;
  border-radius: 50%;
  background: linear-gradient(150deg, var(--kh-brass-lit), var(--kh-copper));
  color: #22160A;
  font-family: var(--kh-font-en), var(--kh-font-ar);
  font-size: .92rem;
  font-weight: 800;
  box-shadow: 0 0 0 4px var(--kh-bg), 0 0 0 5px color-mix(in srgb, var(--kh-brass) 55%, transparent);
}

.kh-path__en {
  margin: 0;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--kh-eyebrow);
}

.kh-path__step h3 {
  margin: 0;
  font-size: 1.12rem;
  color: var(--kh-text);
}

.kh-path__step p:last-child {
  margin: .15rem 0 0;
  max-width: 28ch;
  color: var(--kh-text-2);
  font-size: .9rem;
  line-height: 1.8;
}

/* ══════════════════ 12 · أشرطة متحركة لا تنتهي ══════════════════ */

/* ══════════════════ 12 · أشرطة متحركة لا تنتهي ══════════════════ */

.kh-marquee {
  --kh-marquee-gap: 1.1rem;
  overflow: hidden;
  width: 100%;
  direction: ltr;
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.kh-marquee__track {
  display: flex;
  width: max-content;
  gap: 0;
  animation: khMarquee 42s linear infinite;
}

.kh-marquee--rev .kh-marquee__track {
  animation-name: khMarqueeRev;
  animation-duration: 36s;
}

.kh-marquee__seq {
  display: flex;
  align-items: stretch;
  gap: var(--kh-marquee-gap);
  padding-inline-end: var(--kh-marquee-gap);
}

.kh-marquee:hover .kh-marquee__track,
.kh-marquee:focus-within .kh-marquee__track {
  animation-play-state: paused;
}

.kh-stages .kh-marquee { --kh-marquee-gap: 1.15rem; }
.kh-stages .kh-marquee__track { animation-duration: 48s; }
.kh-achievers .kh-marquee { --kh-marquee-gap: 1.25rem; }
.kh-reviews .kh-marquee { --kh-marquee-gap: 1.1rem; }
.kh-reviews .kh-marquee__track { animation-duration: 52s; }

.kh-marquee .kh-stage {
  flex: 0 0 min(300px, 78vw);
  max-width: min(300px, 78vw);
  direction: rtl;
}

.kh-marquee .kh-achievers__card {
  flex: 0 0 240px;
  width: 240px;
  height: 320px;
}

.kh-marquee .kh-reviews__card {
  flex: 0 0 min(280px, 82vw);
  max-width: min(280px, 82vw);
  direction: rtl;
}

@keyframes khMarquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes khMarqueeRev {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}

/* ══════════════════ 13 · المسارات (الصفوف) ══════════════════ */

.kh-stage {
  position: relative;
  display: block;
  overflow: hidden;
  border: 1px solid var(--kh-border);
  border-radius: var(--kh-radius-lg);
  background: var(--kh-surface);
  box-shadow: var(--kh-shadow-sm);
  color: inherit;
  text-decoration: none;
  transition: transform .22s var(--kh-ease), border-color .22s var(--kh-ease), box-shadow .22s var(--kh-ease);
}

.kh-stage:hover {
  transform: translateY(-4px);
  border-color: var(--kh-brass);
  box-shadow: var(--kh-shadow);
}

.kh-stage__media {
  position: relative;
  height: 210px;
  overflow: hidden;
  background: var(--kh-surface-2);
}

.kh-stage__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s var(--kh-ease);
}

.kh-stage:hover .kh-stage__media img { transform: scale(1.06); }

/* إطار كوّة معدنية */
.kh-stage__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 46%, transparent 50%, rgba(4, 18, 29, .42) 84%);
  box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--kh-brass) 34%, transparent);
}

.kh-stage__body { padding: 1.1rem; }

.kh-stage__en {
  margin: 0;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--kh-eyebrow);
}

.kh-stage__body h3 { margin: .32rem 0 .48rem; font-size: 1.16rem; color: var(--kh-text); }

.kh-stage__hint {
  margin: 0 0 .95rem;
  color: var(--kh-text-2);
  font-size: .9rem;
  line-height: 1.8;
}

.kh-stage__cta {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--kh-accent-2);
  font-weight: 800;
  font-size: .89rem;
}

.kh-stage--growth { border-block-start: 3px solid var(--kh-leaf); }
.kh-stage--depth  { border-block-start: 3px solid var(--kh-teal); }
.kh-stage--ember  { border-block-start: 3px solid var(--kh-terracotta); }

/* ══════════════════ 13 · لوحة المتميزين ══════════════════ */

.kh-achievers__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
  gap: 1.1rem;
}

.kh-achievers__card {
  position: relative;
  display: grid;
  place-items: center;
  margin: 0;
  overflow: hidden;
  padding: 8px;
  border: 1px solid var(--kh-border);
  border-radius: var(--kh-radius-lg);
  background: var(--kh-surface);
  box-shadow: var(--kh-shadow-sm);
}

.kh-achievers__card img {
  width: 100%;
  height: 100%;
  border-radius: 6px;
  object-fit: contain;
  object-position: center;
  background: color-mix(in srgb, var(--kh-bg) 70%, transparent);
}

/* ══════════════════ 14 · المميزات ══════════════════ */

.kh-features__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(238px, 1fr));
  gap: 1rem;
}

.kh-features__card {
  padding: 1.2rem;
  border: 1px solid var(--kh-border);
  border-inline-start: 3px solid var(--kh-brass);
  border-radius: var(--kh-radius-lg);
  background: var(--kh-surface);
  box-shadow: var(--kh-shadow-sm);
}

.kh-features__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: var(--kh-radius);
  border: 1px solid var(--kh-border);
  background: color-mix(in srgb, var(--kh-gold) 12%, transparent);
  color: var(--kh-accent-2);
}

.kh-features__icon img { width: 26px; height: 26px; object-fit: contain; }

.kh-features__card h3 { margin: .75rem 0 .42rem; font-size: 1.07rem; color: var(--kh-text); }
.kh-features__card p  { margin: 0; color: var(--kh-text-2); font-size: .91rem; line-height: 1.85; }

/* ══════════════════ 15 · آراء أولياء الأمور ══════════════════ */

.kh-reviews__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(246px, 1fr));
  gap: 1rem;
}

.kh-reviews__card {
  position: relative;
  padding: 1.6rem 1.2rem 1.2rem;
  border: 1px solid var(--kh-border-2);
  border-radius: var(--kh-radius-lg);
  background: var(--kh-surface);
  box-shadow: var(--kh-shadow-sm);
}

.kh-reviews__quote {
  position: absolute;
  inset-block-start: 6px;
  inset-inline-start: 14px;
  font-family: var(--kh-font-en), var(--kh-font-ar);
  font-size: 2.7rem;
  line-height: 1;
  color: color-mix(in srgb, var(--kh-brass) 55%, transparent);
}

.kh-reviews__card p { margin: 0; color: var(--kh-text-2); line-height: 1.95; }

/* ══════════════════ 16 · نداء الإجراء ══════════════════ */

.kh-cta .uk-cta__box {
  position: relative;
  overflow: hidden;
  padding: clamp(1.8rem, 4vw, 3rem) !important;
  border: 1px solid var(--kh-border) !important;
  border-radius: var(--kh-radius-xl) !important;
  background: var(--kh-surface) !important;
  box-shadow: var(--kh-shadow) !important;
  text-align: center;
}

.kh-cta__art { position: absolute; inset: 0; z-index: 0; }

.kh-cta__art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kh-cta__art::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--kh-scrim-1);
}

.kh-cta .uk-cta__en,
.kh-cta .uk-cta__title,
.kh-cta .uk-cta__sub,
.kh-cta .uk-cta__actions { position: relative; z-index: 1; }

.kh-cta .uk-cta__en {
  color: var(--kh-eyebrow) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .24em;
  text-transform: uppercase;
}

.kh-cta .uk-cta__title { color: var(--kh-text) !important; }
.kh-cta .uk-cta__sub   { color: var(--kh-text-2) !important; }

.kh-cta .uk-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  justify-content: center;
}

/* ══════════════════ 17 · الدخول والتسجيل ══════════════════ */

.uk-auth { padding-block: clamp(1.6rem, 4vw, 3rem) !important; }

.uk-auth__card {
  overflow: hidden !important;
  border: 1px solid var(--kh-border) !important;
  border-radius: var(--kh-radius-xl) !important;
  background: var(--kh-surface) !important;
  box-shadow: var(--kh-shadow) !important;
}

.uk-auth__card::before {
  content: "";
  display: block;
  height: 6px;
  background:
    repeating-linear-gradient(90deg, var(--kh-brass-lit) 0 3px, transparent 3px 24px),
    linear-gradient(90deg, var(--kh-copper), var(--kh-brass) 50%, var(--kh-crimson));
}

.uk-auth__logo {
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.uk-auth__logo img {
  width: auto !important;
  height: 140px !important;
  max-width: 220px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  object-fit: contain !important;
  background: transparent !important;
  box-shadow: none !important;
}

.uk-auth__en {
  font-family: var(--kh-font-en), var(--kh-font-ar) !important;
  color: var(--kh-text) !important;
}

.uk-auth__script {
  color: var(--kh-accent-2) !important;
  font-family: var(--kh-font-en), var(--kh-font-ar) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.uk-auth__sub { color: var(--kh-text-2) !important; }

.uk-auth__divider {
  color: var(--kh-text-3) !important;
  font-size: 11px !important;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.uk-auth__link { color: var(--kh-accent) !important; }

.uk-auth__art { position: relative; overflow: hidden; }

.uk-auth__art img { width: 100%; height: 100%; object-fit: cover; }

.uk-auth__art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 50% 42%, transparent 48%, rgba(4, 18, 29, .6) 84%);
  box-shadow: inset 0 0 0 4px color-mix(in srgb, var(--kh-brass) 36%, transparent);
}

.uk-auth__artFlag { display: none !important; }

.uk-auth__artNote {
  position: absolute;
  z-index: 1;
  inset-inline: 14px;
  inset-block-end: 14px;
  display: grid;
  gap: .22rem;
  padding: .85rem .95rem;
  border: 1px solid var(--kh-border);
  border-radius: var(--kh-radius);
  background: rgba(4, 18, 29, .8);
  backdrop-filter: blur(8px);
}

.uk-auth__artNote strong { color: #F2F9FD; }
.uk-auth__artNote span   { color: #8FE0EC; font-size: .82rem; }

/* الحقول */
.label { color: var(--kh-text-2) !important; font-weight: 700 !important; font-size: .87rem !important; }

.input,
.field .input,
select.input,
textarea.input {
  border: 1px solid var(--kh-border) !important;
  border-radius: var(--kh-radius) !important;
  background: var(--kh-bg-2) !important;
  color: var(--kh-text) !important;
}

.input::placeholder { color: var(--kh-text-3) !important; }

.input:focus {
  outline: none !important;
  border-color: var(--kh-accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--kh-accent) 20%, transparent) !important;
}

.hint { color: var(--kh-text-3) !important; }

.btn-submit {
  border: 1px solid #F2606C !important;
  border-radius: var(--kh-radius) !important;
  background: linear-gradient(180deg, #E4303F, var(--kh-crimson-dk)) !important;
  color: #FFF3F4 !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 20px rgba(216, 32, 47, .3), inset 0 1px 0 rgba(255, 255, 255, .2) !important;
}

/* ══════════════════ 18 · الكتالوج ══════════════════ */

.ukcat-hero,
.ukcat-card,
.ukcat-lec,
.ukcat-empty {
  border: 1px solid var(--kh-border) !important;
  border-radius: var(--kh-radius-lg) !important;
  background: var(--kh-surface) !important;
  box-shadow: var(--kh-shadow-sm) !important;
}

.ukcat-hero { overflow: hidden !important; }
.ukcat-hero__media img { object-fit: cover; }

.ukcat-kicker {
  color: var(--kh-eyebrow) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.ukcat-hero h1,
.ukcat-card__body h2,
.ukcat-lec h3 { color: var(--kh-text) !important; }

.ukcat-hero__sub,
.ukcat-hero__meta,
.ukcat-counts,
.ukcat-note,
.ukcat-lec__meta,
.ukcat-lec__desc { color: var(--kh-text-2) !important; }

.ukcat-pill { border-radius: 4px !important; font-weight: 800 !important; }
.ukcat-pill--free { background: var(--kh-leaf) !important; color: #F4FFEC !important; }
.ukcat-pill--buy  { background: linear-gradient(180deg, var(--kh-brass-lit), var(--kh-brass)) !important; color: #22160A !important; }

.ukcat-price b { color: var(--kh-accent-2) !important; }
.ukcat-price s { color: var(--kh-text-3) !important; }

.ukcat-lec__num {
  border-radius: 50% !important;
  background: linear-gradient(150deg, var(--kh-brass-lit), var(--kh-copper)) !important;
  color: #22160A !important;
  font-weight: 800 !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--kh-brass) 30%, var(--kh-bg));
}

/* ══════════════════ 19 · الفوتر ══════════════════ */

.uk-footer.kh-footer {
  position: relative;
  margin-block-start: 2.6rem;
  border: 0 !important;
  border-block-start: 1px solid var(--kh-border) !important;
  background: var(--kh-surface-2) !important;
}

.uk-footer__flag { display: none !important; }

.uk-footer.kh-footer::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-start: 0;
  height: 6px;
  background:
    repeating-linear-gradient(90deg, var(--kh-brass-lit) 0 3px, transparent 3px 26px),
    linear-gradient(90deg, var(--kh-crimson), var(--kh-brass) 50%, var(--kh-leaf));
  opacity: .85;
}

.kh-footer__motifs {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.kh-footer__motif {
  position: absolute;
  inset-block-end: -8px;
  width: 150px;
  opacity: .2;
}

:root[data-theme="light"] .kh-footer__motif { opacity: .26; }

.kh-footer__motif img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.kh-footer__motif--anchor { inset-inline-start: 3%; }
.kh-footer__motif--trowel { inset-inline-start: 28%; width: 132px; }
.kh-footer__motif--can    { inset-inline-end: 28%; width: 132px; }
.kh-footer__motif--prop   { inset-inline-end: 4%; animation: khTurn 28s linear infinite; }

.uk-footer.kh-footer > .container { position: relative; z-index: 1; }

.uk-footer__name { font-family: var(--kh-font-en), var(--kh-font-ar) !important; color: var(--kh-text) !important; }

.uk-footer__role,
.uk-footer__copy,
.uk-footer__dev,
.uk-footer__nav a,
.uk-footer__link,
.uk-footer__phone { color: var(--kh-text-2) !important; }

.uk-footer__heading {
  color: var(--kh-accent-2) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.uk-footer__tag { color: var(--kh-brand-ink) !important; font-weight: 800 !important; letter-spacing: .16em; }

.uk-footer__logo {
  display: inline-grid !important;
  place-items: center;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.uk-footer__logo img {
  width: auto !important;
  height: 168px !important;
  max-width: 152px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
  box-shadow: none !important;
}

.uk-footer__cash {
  color: #E60000 !important;
  font-weight: 800 !important;
}

.uk-footer__nav a:hover,
.uk-footer__link:hover,
.uk-footer__phone:hover { color: var(--kh-accent) !important; }

/* ══════════════════ 20 · صفحات الحساب ══════════════════ */

body.student-no-header,
body.uk-platform.student-no-header {
  background: var(--kh-bg) !important;
  color: var(--kh-text) !important;
}

.acc-topbar__bar {
  border: 0 !important;
  border-radius: 0 0 var(--kh-radius-lg) var(--kh-radius-lg) !important;
  background: var(--kh-glass) !important;
  backdrop-filter: blur(18px);
  box-shadow: var(--kh-shadow-sm) !important;
  color: var(--kh-text) !important;
}

.acc-topbar__bar::after {
  content: "" !important;
  position: absolute;
  inset-inline: 0;
  inset-block-start: 0;
  height: 6px;
  background:
    repeating-linear-gradient(90deg, var(--kh-brass-lit) 0 3px, transparent 3px 26px),
    linear-gradient(90deg, var(--kh-copper), var(--kh-brass) 50%, var(--kh-crimson)) !important;
}

.acc-brand__logo,
.acc-brand__logoFallback {
  width: auto !important;
  height: 112px !important;
  max-width: 102px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
  box-shadow: none !important;
}

.acc-brand__name { font-family: var(--kh-font-en), var(--kh-font-ar) !important; color: var(--kh-text) !important; }

.acc-brand__sub {
  color: var(--kh-accent) !important;
  font-size: 10.5px !important;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.acc-sidebar,
.acc-card,
.acc-stat,
.acc-course,
.acc-notifs {
  border: 1px solid var(--kh-border) !important;
  border-radius: var(--kh-radius-lg) !important;
  background: var(--kh-surface) !important;
  box-shadow: var(--kh-shadow-sm) !important;
  color: var(--kh-text) !important;
}

.acc-hero {
  border: 1px solid var(--kh-border) !important;
  border-radius: var(--kh-radius-lg) !important;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--kh-leaf) 16%, var(--kh-surface)) 0%, var(--kh-surface) 58%) !important;
  box-shadow: var(--kh-shadow-sm) !important;
  color: var(--kh-text) !important;
}

.acc-hero h1 {
  color: var(--kh-text) !important;
}

.acc-hero__script {
  color: var(--kh-crimson) !important;
  font-family: var(--kh-font-en), var(--kh-font-ar) !important;
  font-weight: 800 !important;
}

.acc-hero__sub {
  color: var(--kh-text-2) !important;
}

.acc-hero__kicker {
  color: var(--kh-accent) !important;
  border-color: var(--kh-border) !important;
  background: color-mix(in srgb, var(--kh-accent) 12%, transparent) !important;
}

.acc-stats__grid {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)) !important;
}

.acc-sidebar::before {
  background: linear-gradient(90deg,
    var(--kh-crimson) 0 33.3%, var(--kh-brass) 33.3% 66.6%, var(--kh-leaf) 66.6%) !important;
}

.acc-title,
.acc-card h2,
.acc-card h3,
.acc-stat__value { color: var(--kh-text) !important; }

.acc-muted,
.acc-hint,
.acc-meta,
.acc-subtitle,
.acc-stat__label,
.acc-stat__hint { color: var(--kh-text-2) !important; }

.acc-student,
.acc-pill,
.acc-bell,
.acc-burger {
  border: 1px solid var(--kh-border) !important;
  border-radius: var(--kh-radius) !important;
  background: var(--kh-surface-2) !important;
  color: var(--kh-text) !important;
}

.acc-student__ico,
.acc-pill__ico { color: var(--kh-accent-2) !important; }

.acc-pill:hover { background: var(--kh-crimson) !important; border-color: var(--kh-crimson) !important; color: #fff !important; }
.acc-pill:hover .acc-pill__ico { color: #fff !important; }

.acc-bell__badge { background: var(--kh-crimson) !important; color: #fff !important; }
.acc-burger span { background: var(--kh-accent-2) !important; }

.acc-notifs__head {
  background: var(--kh-surface-2) !important;
  border-block-end: 2px solid var(--kh-brass) !important;
  color: var(--kh-text) !important;
}

.acc-nav__item {
  border: 1px solid transparent !important;
  border-radius: var(--kh-radius) !important;
  color: var(--kh-text) !important;
  font-weight: 700 !important;
}

.acc-nav__ico { color: var(--kh-text-2) !important; }

.acc-nav__item:hover {
  background: color-mix(in srgb, var(--kh-accent) 12%, transparent) !important;
  color: var(--kh-accent) !important;
}

.acc-nav__item:hover .acc-nav__ico { color: var(--kh-accent) !important; }

.acc-nav__item.is-active {
  background: color-mix(in srgb, var(--kh-brass) 18%, transparent) !important;
  border-color: var(--kh-border) !important;
  color: var(--kh-accent-2) !important;
  box-shadow: inset 3px 0 0 var(--kh-crimson) !important;
}

.acc-nav__item.is-active .acc-nav__ico { color: var(--kh-accent-2) !important; }

.acc-nav__item.is-danger {
  background: color-mix(in srgb, var(--kh-crimson) 12%, transparent) !important;
  border-color: color-mix(in srgb, var(--kh-crimson) 40%, transparent) !important;
  color: var(--kh-crimson) !important;
}

.acc-nav__item.is-danger .acc-nav__ico { color: var(--kh-crimson) !important; }

/* ══════════════════ 21 · الشاشات الصغيرة ══════════════════ */

@media (max-width: 1024px) {
  .kh-worlds__grid { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .kh-hdr__bar { min-height: 128px !important; }
  .uk-brand__mark { width: auto !important; height: auto !important; }
  .uk-brand__logo { height: 104px !important; max-width: 96px !important; }
  .uk-footer__logo img { height: 128px !important; max-width: 116px !important; }
  .acc-brand__logo,
  .acc-brand__logoFallback { height: 88px !important; max-width: 80px !important; }

  .kh-hero { padding-block: 2rem 1.6rem; }

  .kh-hero__inner {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .kh-hero__portraitWrap { order: -1; margin-block-end: .6rem; }
  .kh-hero__portrait { width: min(280px, 72vw); }
  .kh-hero__desc { margin-inline: auto; }
  .kh-hero__actions { justify-content: center; }

  .kh-journey__list::before { display: none; }

  .kh-board { grid-template-columns: 1fr; }
  .kh-board__item { grid-template-columns: 120px minmax(0, 1fr); }
  .kh-board__media img,
  .kh-board__media .uk-meaning-icon { width: 88px; height: 88px; }

  .kh-path {
    grid-template-columns: 1fr 1fr;
    gap: 1.6rem 1rem;
  }
  .kh-path::before { display: none; }

  .kh-ambient__motif--nautilus,
  .kh-ambient__motif--helm,
  .kh-ambient__motif--jelly { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .kh-ambient__shaft,
  .kh-ambient__particles,
  .kh-ambient__motif,
  .kh-hdr__eyebrowIco,
  .kh-footer__motif--prop,
  .kh-marquee__track { animation: none !important; }

  .kh-world img,
  .kh-stage__media img { transition: none; }

  .kh-marquee { overflow-x: auto; mask-image: none; -webkit-mask-image: none; }
}

/* ══════════════════ 22 · وضوح النصوص — الحساب ══════════════════ */

html[data-theme="light"] .acc-topbar__bar,
html[data-theme="dark"] .acc-topbar__bar,
.acc-topbar__bar {
  background: var(--kh-glass) !important;
  color: var(--kh-text) !important;
}

.acc-topbar__bar .acc-brand__name,
.acc-topbar__bar .acc-brand__sub,
.acc-topbar__bar .acc-student,
.acc-topbar__bar .acc-student__name,
.acc-topbar__bar .acc-student span,
.acc-topbar__bar .acc-pill,
.acc-topbar__bar .acc-pill span,
.acc-topbar__bar .acc-bell,
.acc-topbar__bar .acc-bell__ico,
.acc-topbar__bar .acc-burger,
.acc-topbar__bar .acc-theme__btn,
.acc-topbar__bar .theme-switch__btn,
.acc-topbar__bar .acc-btn--ghost,
.acc-topbar__bar a.acc-btn.acc-btn--ghost {
  color: var(--kh-text) !important;
  -webkit-text-fill-color: var(--kh-text);
}

.acc-topbar__bar .acc-brand__sub {
  color: var(--kh-accent) !important;
  -webkit-text-fill-color: var(--kh-accent);
}

.acc-topbar__bar .acc-student__ico,
.acc-topbar__bar .acc-pill__ico {
  color: var(--kh-accent-2) !important;
}

.acc-hero,
.acc-hero h1,
.acc-hero p,
.acc-hero__script,
.acc-hero__sub,
.acc-hero__kicker {
  color: var(--kh-text) !important;
  -webkit-text-fill-color: var(--kh-text);
}

.acc-hero__script {
  font-family: var(--kh-font-en), var(--kh-font-ar) !important;
  font-weight: 800 !important;
  color: var(--kh-crimson) !important;
  -webkit-text-fill-color: var(--kh-crimson);
}

.acc-hero__sub,
.acc-hero__kicker {
  color: var(--kh-text-2) !important;
  -webkit-text-fill-color: var(--kh-text-2);
  font-weight: 800 !important;
}

html[data-theme="dark"] .acc-sidebar,
html[data-theme="dark"] .acc-card,
html[data-theme="dark"] .acc-stat,
html[data-theme="dark"] .acc-course,
html[data-theme="dark"] .acc-notifs,
.acc-sidebar,
.acc-card,
.acc-stat,
.acc-course,
.acc-notifs {
  background: var(--kh-surface) !important;
  color: var(--kh-text) !important;
}

.acc-stat__val,
.acc-stat__value,
.acc-stat__lbl,
.acc-stat__label,
.acc-card h2,
.acc-card h3,
.acc-title,
.acc-course__title,
.acc-nav__item,
.acc-nav__lbl,
.acc-label,
.acc-course__meta {
  color: var(--kh-text) !important;
  -webkit-text-fill-color: var(--kh-text);
}

.acc-stat__lbl,
.acc-stat__label,
.acc-muted,
.acc-hint,
.acc-meta,
.acc-subtitle {
  color: var(--kh-text-2) !important;
  -webkit-text-fill-color: var(--kh-text-2);
}

html[data-theme="dark"] .acc-nav__item,
html[data-theme="dark"] .acc-nav__item .acc-nav__lbl,
html[data-theme="dark"] .acc-nav__item .acc-nav__ico,
html[data-theme="light"] .acc-nav__item,
html[data-theme="light"] .acc-nav__item .acc-nav__lbl,
html[data-theme="light"] .acc-nav__item .acc-nav__ico {
  color: var(--kh-text) !important;
  -webkit-text-fill-color: var(--kh-text);
}

.acc-notifs__head,
.acc-notifs__title,
.acc-notifs__close {
  color: var(--kh-text) !important;
  -webkit-text-fill-color: var(--kh-text);
}