/* =========================================================
   منصة الابتكارات التعلمية — نظام الهوية البصرية
   Design System v2
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@500;600;700&family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&display=swap');

:root{
  /* ---------- الألوان: الهوية الأساسية (مستخرجة من الشعار) ---------- */
  --brand-950:#062a56;
  --brand-900:#01366d;   /* كحلي الشعار */
  --brand-800:#0a4382;
  --brand-700:#1256a0;
  --brand-600:#1a6fbe;
  --brand-500:#2a86c8;
  --brand-100:#e2ecf7;
  --brand-50: #f1f6fb;

  /* ---------- اللون المكمّل: أخضر الشعار ---------- */
  --green-700:#2b7a3f;
  --green-600:#3d9440;
  --green-500:#62ae40;   /* أخضر الشعار */
  --green-400:#86c45c;
  --green-300:#a9d489;
  --green-100:#ecf6e5;

  /* ---------- ألوان المراحل الدراسية ---------- */
  --stage-kg:      #1a6fbe;
  --stage-primary: #3d9440;
  --stage-middle:  #01366d;
  --stage-high:    #0f8a7a;

  /* ---------- الأسطح والنصوص ---------- */
  --ink:      #0b211c;
  --ink-2:    #40605a;
  --ink-3:    #6b8781;
  --page:     #fbfcfb;
  --surface:  #ffffff;
  --surface-2:#f2f6f4;
  --line:     #e0e8e4;
  --line-2:   #eef3f0;
  --danger:#a33b2c;
  --success:#1c7a45;

  /* ---------- الخطوط ---------- */
  --font-display:'El Messiri','Tahoma',sans-serif;
  --font-body:'IBM Plex Sans Arabic','Tahoma',sans-serif;

  /* ---------- الإيقاع ---------- */
  --gap-xs:.5rem; --gap-sm:1rem; --gap-md:1.75rem; --gap-lg:3rem; --gap-xl:6rem;
  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-pill:999px;
  --container:1200px;

  /* ---------- الظلال ---------- */
  --sh-xs:0 1px 2px rgba(8,40,34,.06);
  --sh-sm:0 2px 8px rgba(8,40,34,.06),0 1px 2px rgba(8,40,34,.04);
  --sh-md:0 14px 30px -14px rgba(8,40,34,.22);
  --sh-lg:0 28px 60px -22px rgba(8,40,34,.32);
  --sh-green:0 12px 26px -12px rgba(98,174,64,.45);
}

/* ================= الأساسيات ================= */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  background:var(--page);
  color:var(--ink);
  font-size:16.5px;
  line-height:1.78;
  -webkit-font-smoothing:antialiased;
}
html[dir="rtl"] body{direction:rtl;text-align:right;}
img,svg{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
button{font-family:inherit;cursor:pointer;}
input,textarea,select{font-family:inherit;font-size:1rem;}
:focus-visible{outline:3px solid var(--green-500);outline-offset:3px;border-radius:4px;}
.container{max-width:var(--container);margin-inline:auto;padding-inline:1.5rem;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important;}
  .reveal{opacity:1!important;transform:none!important;}
}

/* ================= الطباعة ================= */
h1,h2,h3,h4{font-family:var(--font-display);color:var(--brand-900);line-height:1.26;margin:0 0 .55em;font-weight:600;}
h1{font-size:clamp(2.1rem,3.4vw,3.15rem);line-height:1.2;font-weight:700;letter-spacing:-.005em;}
h2{font-size:clamp(1.7rem,2.7vw,2.5rem);font-weight:700;}
h3{font-size:1.26rem;}
h4{font-size:1.05rem;}
p{margin:0 0 1em;max-width:64ch;color:var(--ink-2);}
.lede{font-size:1.2rem;line-height:1.75;color:var(--ink-2);max-width:48ch;}
strong{color:var(--ink);font-weight:600;}

.eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-size:.88rem;font-weight:600;color:var(--green-600);
  background:var(--green-100);
  padding:.35rem .9rem;border-radius:var(--r-pill);
  margin-bottom:1rem;
}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green-500);}
.section-dark .eyebrow,.page-hero .eyebrow{background:rgba(134,196,92,.16);color:var(--green-300);}

/* ================= الأزرار ================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.95rem 1.9rem;border-radius:var(--r-sm);border:1.5px solid transparent;
  font-weight:600;font-size:.97rem;
  transition:background .18s,color .18s,border-color .18s,box-shadow .2s,transform .12s;
}
.btn:active{transform:translateY(1px);}
.btn svg{width:18px;height:18px;flex-shrink:0;}
.btn-primary{background:var(--brand-900);color:#fff;box-shadow:var(--sh-sm);}
.btn-primary:hover{background:var(--brand-800);box-shadow:var(--sh-md);}
.btn-green{background:var(--green-600);color:#fff;box-shadow:var(--sh-green);}
.btn-green:hover{background:var(--green-700);color:#fff;}
.btn-outline{border-color:var(--brand-900);color:var(--brand-900);}
.btn-outline:hover{background:var(--brand-900);color:#fff;}
.btn-light{background:#fff;color:var(--brand-900);}
.btn-light:hover{background:var(--brand-100);}
.btn-ghost{color:var(--brand-800);padding:.3rem 0;font-weight:600;display:inline-flex;align-items:center;gap:.4rem;}
.btn-ghost svg{width:16px;height:16px;transition:transform .18s;}
html[dir="rtl"] .btn-ghost svg{transform:scaleX(-1);}
html[dir="rtl"] .btn-ghost:hover svg{transform:scaleX(-1) translateX(4px);}
.btn-block{width:100%;}
.btn-sm{padding:.6rem 1.15rem;font-size:.88rem;}

/* ================= الرأس ================= */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(251,252,251,.88);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .2s,border-color .2s;
}
.site-header.is-scrolled{box-shadow:var(--sh-sm);border-color:transparent;}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.9rem;}
.brand{display:flex;align-items:center;gap:.7rem;}
.brand img{width:auto;height:42px;}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-text b{font-family:var(--font-display);font-size:1.18rem;font-weight:700;color:var(--brand-900);}
.brand-text span{font-size:.72rem;color:var(--ink-3);}
.site-footer .brand-text b{color:#fff;}
.site-footer .brand-text span{color:#94aec9;}

.nav-links{display:flex;align-items:center;gap:2rem;font-size:.97rem;font-weight:500;}
.nav-links a{color:var(--ink-2);padding-block:.35rem;position:relative;transition:color .16s;}
.nav-links a::after{
  content:"";position:absolute;inset-inline:0;bottom:-2px;height:2px;
  background:var(--green-500);transform:scaleX(0);transition:transform .18s;
}
.nav-links a:hover{color:var(--brand-900);}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1);}
.nav-links a[aria-current="page"]{color:var(--brand-900);font-weight:600;}
.nav-actions{display:flex;align-items:center;gap:.65rem;}
.nav-toggle{display:none;background:none;border:1.5px solid var(--line);border-radius:10px;width:44px;height:44px;align-items:center;justify-content:center;}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
  content:"";display:block;width:20px;height:2px;background:var(--brand-900);position:relative;transition:transform .2s,opacity .2s;
}
.nav-toggle span::before{position:absolute;top:-6px;}
.nav-toggle span::after{position:absolute;top:6px;}
.nav-toggle[aria-expanded="true"] span{background:transparent;}
.nav-toggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg);}
.nav-toggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg);}

@media (max-width:980px){
  .nav-toggle{display:flex;}
  .nav-links{
    position:absolute;inset-inline:0;top:100%;background:var(--page);
    border-bottom:1px solid var(--line);box-shadow:var(--sh-md);
    flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.5rem 1.2rem;display:none;
  }
  .nav-links.is-open{display:flex;}
  .nav-links a{padding-block:.85rem;border-bottom:1px solid var(--line-2);}
  .nav-actions .btn-outline{display:none;}
}

/* ================= الأقسام ================= */
.section{padding-block:var(--gap-xl);}
.section-tight{padding-block:var(--gap-lg);}
.section-alt{background:var(--surface-2);}
.section-pattern{background:var(--surface-2) url('../assets/img/pattern.svg') repeat;}
.section-dark{
  background:linear-gradient(140deg,var(--brand-950),var(--brand-800) 60%,var(--brand-700));
  color:#e9f1fa;
}
.section-dark h1,.section-dark h2,.section-dark h3{color:#fff;}
.section-dark p{color:#cfe0f0;}
.section-head{max-width:660px;margin-bottom:var(--gap-lg);}
.section-head.center{margin-inline:auto;text-align:center;}
.section-head p{margin-bottom:0;}
.head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--gap-md);margin-bottom:var(--gap-lg);flex-wrap:wrap;}
.head-row .section-head{margin-bottom:0;}

/* ================= البطل ================= */
.hero{position:relative;overflow:hidden;padding-block:4rem 5rem;}
.hero::before{
  content:"";position:absolute;inset-block-start:-160px;inset-inline-start:-140px;
  width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,var(--brand-100),transparent 68%);
  z-index:0;
}
.hero>*{position:relative;z-index:1;}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:var(--gap-lg);align-items:center;}
.hero-copy{max-width:36rem;}
.hero-visual{justify-self:center;width:100%;max-width:460px;}
.hero-copy h1{margin-bottom:.4em;}
.hero-badge{
  display:inline-flex;align-items:center;gap:.6rem;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-pill);
  padding:.4rem 1rem .4rem .5rem;font-size:.85rem;color:var(--ink-2);margin-bottom:1.3rem;
  box-shadow:var(--sh-xs);
}
.hero-badge b{
  background:var(--brand-900);color:#fff;border-radius:var(--r-pill);
  padding:.15rem .7rem;font-size:.78rem;font-weight:600;
}
.hero-actions{display:flex;gap:.9rem;margin-top:var(--gap-md);flex-wrap:wrap;}
.hero-visual{position:relative;}
.hero-visual{position:relative;}
.hero-visual img{width:100%;border-radius:var(--r-lg);}
.hero-float{
  position:absolute;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);box-shadow:var(--sh-lg);padding:.85rem 1rem;
  display:flex;align-items:center;gap:.7rem;font-size:.85rem;
}
.hero-float b{display:block;font-size:.92rem;color:var(--brand-900);font-family:var(--font-display);}
.hero-float span{color:var(--ink-3);font-size:.78rem;}
.hero-float .pill{
  width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  background:var(--brand-100);color:var(--brand-800);flex-shrink:0;
}
.hero-float .pill svg{width:20px;height:20px;}
.hero-float-1{inset-block-start:16%;inset-inline-start:-8%;}
.hero-float-2{inset-block-end:11%;inset-inline-end:-6%;}
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-copy{max-width:none;}
  .hero-visual{max-width:440px;margin-inline:auto;}
  .hero-float-1{inset-inline-start:-4%;}
  .hero-float-2{inset-inline-end:-2%;}
}
@media (max-width:560px){.hero-float{display:none;}}

/* ================= شريط الأرقام ================= */
.stats-bar{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--sh-sm);overflow:hidden;
}
.stat{padding:1.6rem 1.4rem;text-align:center;border-inline-start:1px solid var(--line-2);}
.stat:first-child{border-inline-start:0;}
.stat b{display:block;font-family:var(--font-display);font-size:2rem;color:var(--brand-900);line-height:1.1;}
.stat span{font-size:.88rem;color:var(--ink-3);}
@media (max-width:760px){
  .stats-bar{grid-template-columns:1fr 1fr;}
  .stat:nth-child(3){border-inline-start:0;}
  .stat:nth-child(n+3){border-top:1px solid var(--line-2);}
}

/* ================= بطاقات المزايا ================= */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-md);}
@media (max-width:900px){.feature-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.feature-grid{grid-template-columns:1fr;}}
.feature-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:1.9rem 1.7rem;position:relative;overflow:hidden;
  transition:box-shadow .22s,transform .22s,border-color .22s;
}
.feature-card::before{
  content:"";position:absolute;inset-block-start:0;inset-inline:0;height:3px;
  background:linear-gradient(to left,var(--brand-600),var(--green-500));
  transform:scaleX(0);transform-origin:right;transition:transform .25s;
}
.feature-card:hover{box-shadow:var(--sh-md);transform:translateY(-4px);border-color:var(--line-2);}
.feature-card:hover::before{transform:scaleX(1);}
.icon-tile{
  width:52px;height:52px;border-radius:14px;margin-bottom:1.2rem;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,var(--brand-100),#fff);
  border:1px solid var(--line);color:var(--brand-700);
}
.icon-tile svg{width:24px;height:24px;}
.icon-tile.green{background:linear-gradient(145deg,var(--green-100),#fff);color:var(--green-600);}
.feature-card h3{font-size:1.14rem;margin-bottom:.4em;}
.feature-card p{font-size:.95rem;margin-bottom:0;}

/* ================= بطاقات المراحل ================= */
.stage-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap-md);}
@media (max-width:1000px){.stage-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.stage-grid{grid-template-columns:1fr;}}
.stage-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;display:flex;flex-direction:column;
  transition:box-shadow .22s,transform .22s;
}
.stage-card:hover{box-shadow:var(--sh-lg);transform:translateY(-5px);}
.stage-card .thumb{position:relative;aspect-ratio:16/10;overflow:hidden;}
.stage-card .thumb img{width:100%;height:100%;object-fit:cover;}
.stage-card .age{
  position:absolute;inset-block-start:.8rem;inset-inline-start:.8rem;
  background:rgba(255,255,255,.92);color:var(--stage,var(--brand-800));
  font-size:.76rem;font-weight:600;padding:.25rem .75rem;border-radius:var(--r-pill);
}
.stage-card .body{padding:1.4rem 1.5rem 1.6rem;display:flex;flex-direction:column;flex:1;}
.stage-card h3{margin-bottom:.35em;}
.stage-card p{font-size:.93rem;flex:1;}
.chip-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.1rem;}
.chip{
  font-size:.76rem;padding:.22rem .7rem;border-radius:var(--r-pill);
  background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line-2);
}
.stage-card .bar{height:4px;background:var(--stage,var(--brand-700));}

/* ================= لوحة مقسومة ================= */
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg);align-items:center;}
.split.wide-start{grid-template-columns:1.15fr .85fr;}
@media (max-width:900px){.split,.split.wide-start{grid-template-columns:1fr;}}
.media-frame{
  border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);
  box-shadow:var(--sh-md);background:var(--surface);
}
.check-list{display:grid;gap:.9rem;margin:1.4rem 0;}
.check-list li{display:flex;gap:.75rem;align-items:flex-start;font-size:.97rem;color:var(--ink-2);}
.check-list .tick{
  width:24px;height:24px;border-radius:50%;flex-shrink:0;margin-top:.25rem;
  background:var(--brand-100);color:var(--brand-700);
  display:flex;align-items:center;justify-content:center;
}
.check-list .tick svg{width:13px;height:13px;}

/* ================= الخطوات ================= */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-md);counter-reset:s;}
@media (max-width:860px){.steps{grid-template-columns:1fr;}}
.step::before{
  counter-increment:s;content:counter(s,arabic-indic);
  font-family:var(--font-display);font-size:1.15rem;
  width:46px;height:46px;border-radius:50%;
  background:var(--surface);border:1.5px solid var(--green-300);color:var(--green-600);
  display:flex;align-items:center;justify-content:center;margin-bottom:1rem;
}
.section-dark .step::before{background:rgba(255,255,255,.06);border-color:rgba(134,196,92,.5);color:var(--green-300);}
.step h3{font-size:1.1rem;}
.step p{font-size:.94rem;margin-bottom:0;}

/* ================= المعلمون ================= */
.teacher-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap-md);}
@media (max-width:980px){.teacher-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.teacher-grid{grid-template-columns:1fr;}}
.teacher-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;transition:box-shadow .22s,transform .22s;
}
.teacher-card:hover{box-shadow:var(--sh-lg);transform:translateY(-5px);}
.teacher-card .portrait{aspect-ratio:5/3;overflow:hidden;}
.teacher-card .portrait img{width:100%;height:100%;object-fit:cover;}
.teacher-card .body{padding:1.25rem 1.35rem 1.5rem;}
.teacher-card h3{font-size:1.08rem;margin-bottom:.1em;}
.teacher-role{display:block;color:var(--green-600);font-size:.86rem;font-weight:600;margin-bottom:.7em;}
.teacher-card p{font-size:.92rem;margin-bottom:.9rem;}

/* ================= الشهادات ================= */
.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-md);}
@media (max-width:900px){.quote-grid{grid-template-columns:1fr;}}
.quote-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:1.8rem 1.7rem;position:relative;box-shadow:var(--sh-xs);
}
.quote-card::before{
  content:"”";position:absolute;inset-block-start:.2rem;inset-inline-start:1.2rem;
  font-family:var(--font-display);font-size:4.5rem;line-height:1;color:var(--green-300);opacity:.55;
}
.stars{display:flex;gap:.15rem;margin-bottom:.9rem;color:var(--green-500);}
.stars svg{width:16px;height:16px;}
.quote-card p{font-size:1rem;color:var(--ink);margin-bottom:1.3rem;}
.quote-who{display:flex;align-items:center;gap:.75rem;}
.quote-who img{width:46px;height:46px;border-radius:50%;object-fit:cover;border:1px solid var(--line);}
.quote-who b{display:block;font-size:.93rem;color:var(--brand-900);}
.quote-who span{font-size:.8rem;color:var(--ink-3);}

/* ================= بطاقة عامة ================= */
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:1.8rem;transition:box-shadow .22s,transform .22s;
}
.card.is-interactive:hover{box-shadow:var(--sh-md);transform:translateY(-3px);}
.card-soft{background:var(--brand-50);border-color:var(--brand-100);}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-md);}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-md);}
@media (max-width:860px){.grid-2,.grid-3{grid-template-columns:1fr;}}

/* ================= التبويبات ================= */
.tabs{
  display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:var(--gap-md);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:.4rem;width:fit-content;box-shadow:var(--sh-xs);
}
.tab-btn{
  background:none;border:0;padding:.7rem 1.4rem;border-radius:var(--r-pill);
  font-weight:600;font-size:.95rem;color:var(--ink-2);transition:background .18s,color .18s;
}
.tab-btn:hover{color:var(--brand-900);}
.tab-btn[aria-selected="true"]{background:var(--brand-900);color:#fff;}
.tab-panel{display:none;}
.tab-panel.is-active{display:block;animation:fadeIn .25s ease;}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ================= الأسئلة الشائعة ================= */
.faq-list{display:grid;gap:.7rem;}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;transition:border-color .2s,box-shadow .2s;}
.faq-item.is-open{border-color:var(--brand-100);box-shadow:var(--sh-sm);}
.faq-q{
  width:100%;background:none;border:0;text-align:inherit;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.1rem 1.3rem;font-family:var(--font-display);font-size:1.04rem;color:var(--brand-900);
}
.faq-q .plus{width:26px;height:26px;flex-shrink:0;position:relative;border-radius:50%;background:var(--brand-50);}
.faq-q .plus::before,.faq-q .plus::after{content:"";position:absolute;background:var(--brand-700);top:50%;left:50%;transform:translate(-50%,-50%);}
.faq-q .plus::before{width:12px;height:2px;}
.faq-q .plus::after{width:2px;height:12px;transition:transform .2s;}
.faq-item.is-open .plus::after{transform:translate(-50%,-50%) scaleY(0);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .28s ease;}
.faq-item.is-open .faq-a{max-height:340px;}
.faq-a p{padding:0 1.3rem 1.2rem;font-size:.95rem;margin:0;}

/* ================= شريط الدعوة ================= */
.cta-band{
  position:relative;overflow:hidden;
  background:linear-gradient(140deg,var(--brand-950),var(--brand-800) 65%,var(--brand-600));
  color:#fff;border-radius:var(--r-lg);padding:3.4rem;
  display:flex;align-items:center;justify-content:space-between;gap:var(--gap-md);flex-wrap:wrap;
  box-shadow:var(--sh-lg);
}
.cta-band::after{
  content:"";position:absolute;inset-block-start:-60px;inset-inline-start:-40px;
  width:280px;height:280px;border-radius:50%;background:rgba(134,196,92,.12);
}
.cta-band>*{position:relative;z-index:1;}
.cta-band h2{color:#fff;margin-bottom:.3em;}
.cta-band p{color:#cfe0f0;margin-bottom:0;max-width:46ch;}

/* ================= رأس الصفحات الداخلية ================= */
.page-hero{
  padding-block:3.4rem 3rem;
  background:linear-gradient(140deg,var(--brand-950),var(--brand-800));
  color:#fff;position:relative;overflow:hidden;
}
.page-hero::after{
  content:"";position:absolute;inset-block-start:-120px;inset-inline-end:-80px;
  width:360px;height:360px;border-radius:50%;background:rgba(134,196,92,.1);
}
.page-hero>*{position:relative;z-index:1;}
.page-hero h1{color:#fff;}
.page-hero p{color:#cfe0f0;}
.crumb{font-size:.85rem;color:#a9c3de;margin-bottom:1rem;}
.crumb a:hover{color:var(--green-300);}

/* ================= النماذج ================= */
.form-grid{display:grid;gap:1.2rem;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
@media (max-width:640px){.form-row{grid-template-columns:1fr;}}
.field{display:flex;flex-direction:column;gap:.45rem;}
.field label{font-size:.92rem;font-weight:600;color:var(--ink);}
.field input,.field textarea,.field select{
  border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.85rem 1rem;
  background:var(--surface);color:var(--ink);transition:border-color .16s,box-shadow .16s;
}
.field input:focus,.field textarea:focus,.field select:focus{
  border-color:var(--brand-600);box-shadow:0 0 0 3px rgba(26,111,190,.14);outline:none;
}
.field.invalid input,.field.invalid textarea,.field.invalid select{border-color:var(--danger);}
.field .error{font-size:.8rem;color:var(--danger);display:none;}
.field.invalid .error{display:block;}
textarea{resize:vertical;min-height:130px;}
.radio-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;}
@media (max-width:600px){.radio-cards{grid-template-columns:1fr;}}
.radio-card{
  border:1.5px solid var(--line);border-radius:var(--r-sm);padding:1rem .8rem;
  cursor:pointer;text-align:center;transition:border-color .16s,background .16s;position:relative;
}
.radio-card input{position:absolute;opacity:0;pointer-events:none;}
.radio-card:has(input:checked){border-color:var(--brand-700);background:var(--brand-50);}
.radio-card b{display:block;font-size:.95rem;margin-bottom:.15rem;color:var(--brand-900);}
.radio-card span{font-size:.78rem;color:var(--ink-3);}
.form-note{
  display:flex;gap:.7rem;align-items:flex-start;background:var(--brand-50);
  border:1px solid var(--brand-100);border-radius:var(--r-sm);
  padding:1rem 1.1rem;font-size:.9rem;color:var(--brand-800);
}
.form-note svg{width:20px;height:20px;flex-shrink:0;margin-top:.25rem;color:var(--brand-700);}
.form-status{margin-top:.6rem;padding:.9rem 1.1rem;border-radius:var(--r-sm);font-size:.92rem;display:none;}
.form-status.show{display:block;}
.form-status.ok{background:#e4f3e9;color:var(--success);}
.form-status.err{background:#f8e8e4;color:var(--danger);}
.checkbox-row{display:flex;align-items:flex-start;gap:.6rem;font-size:.9rem;color:var(--ink-2);}
.checkbox-row input{margin-top:.35rem;}

/* ================= الدخول والتسجيل ================= */
.auth-wrap{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 78px);}
@media (max-width:980px){.auth-wrap{grid-template-columns:1fr;}}
.auth-aside{
  background:linear-gradient(150deg,var(--brand-950),var(--brand-700));
  color:#fff;padding:3.5rem 3rem;display:flex;flex-direction:column;justify-content:center;gap:1.2rem;
  position:relative;overflow:hidden;
}
.auth-aside::after{content:"";position:absolute;inset-block-end:-100px;inset-inline-start:-80px;width:320px;height:320px;border-radius:50%;background:rgba(134,196,92,.1);}
.auth-aside>*{position:relative;z-index:1;}
.auth-aside h2{color:#fff;}
.auth-aside p{color:#cfe0f0;}
.auth-aside img{max-width:320px;border-radius:var(--r-md);}
@media (max-width:980px){.auth-aside{display:none;}}
.auth-main{display:flex;align-items:center;justify-content:center;padding:3.5rem 1.5rem;}
.auth-card{width:min(470px,100%);}
.auth-card.wide{width:min(600px,100%);}
.auth-card h1{font-size:1.9rem;margin-bottom:.25em;}
.auth-card>p{margin-bottom:var(--gap-md);}
.auth-foot{text-align:center;margin-top:1.4rem;font-size:.92rem;color:var(--ink-2);}
.auth-foot a{color:var(--brand-800);font-weight:600;}
.auth-divider{display:flex;align-items:center;gap:.9rem;margin:1.4rem 0;color:var(--ink-3);font-size:.85rem;}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--line);}

/* ================= التذييل ================= */
.site-footer{background:var(--brand-950);color:#b3c8dd;padding-block:var(--gap-lg) var(--gap-md);}
.footer-grid{
  display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:var(--gap-lg);
  padding-bottom:var(--gap-lg);border-bottom:1px solid rgba(255,255,255,.1);
}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:540px){.footer-grid{grid-template-columns:1fr;}}
.footer-grid h4{color:#fff;font-size:1rem;margin-bottom:1rem;}
.footer-grid nav a{display:block;padding-block:.35rem;font-size:.93rem;color:#b3c8dd;transition:color .16s;}
.footer-grid nav a:hover{color:var(--green-300);}
.footer-brand p{font-size:.9rem;color:#94aec9;margin-top:1rem;}
.footer-newsletter{display:flex;gap:.5rem;margin-top:1.1rem;}
.footer-newsletter input{
  flex:1;min-width:0;padding:.7rem .9rem;border-radius:var(--r-sm);
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;font-size:.88rem;
}
.footer-newsletter input::placeholder{color:#8aa3bd;}
.footer-newsletter .btn{padding:.7rem 1.1rem;font-size:.85rem;}
.footer-social{display:flex;gap:.55rem;margin-top:1.2rem;}
.footer-social a{
  width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.14);color:#b3c8dd;transition:border-color .16s,color .16s,background .16s;
}
.footer-social a:hover{border-color:var(--green-300);color:var(--green-300);background:rgba(134,196,92,.08);}
.footer-social svg{width:17px;height:17px;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:var(--gap-md);font-size:.83rem;color:#7f97b3;flex-wrap:wrap;gap:.6rem;}

/* ================= ظهور تدريجي عند التمرير ================= */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease;}
.reveal.is-visible{opacity:1;transform:none;}

/* ================= مساعدات ================= */
.text-center{text-align:center;}
.mb-0{margin-bottom:0;}
.badge{display:inline-block;font-size:.78rem;padding:.25rem .8rem;border-radius:var(--r-pill);background:var(--green-100);color:var(--green-700);font-weight:600;}

/* ================= تحسينات الشاشات الصغيرة ================= */
@media (max-width:520px){
  .brand-text b{font-size:1.02rem;white-space:nowrap;}
  .brand-text span{display:none;}
  .brand img{width:38px;height:38px;}
  .nav-actions .btn-sm{padding:.5rem .85rem;font-size:.82rem;}
  .section{padding-block:3.5rem;}
  .cta-band{padding:2.2rem 1.6rem;}
  .hero{padding-block:2.5rem 3rem;}
  .auth-main{padding:2.5rem 1.2rem;}
  .card{padding:1.4rem;}
  .quote-card{padding:1.5rem 1.4rem;}
}

/* ================= الباقات والأسعار ================= */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-md);align-items:stretch;}
@media (max-width:900px){.price-grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto;}}
.price-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:2rem 1.8rem;position:relative;display:flex;flex-direction:column;
  transition:box-shadow .22s,transform .22s;
}
.price-card:hover{box-shadow:var(--sh-md);transform:translateY(-4px);}
.price-card.featured{
  border-color:var(--brand-700);box-shadow:var(--sh-lg);
  background:linear-gradient(180deg,var(--brand-50),var(--surface) 40%);
}
.price-card .tag-top{
  position:absolute;inset-block-start:-13px;inset-inline-end:1.6rem;
  background:var(--green-500);color:#2a1e05;font-size:.78rem;font-weight:600;
  padding:.25rem .9rem;border-radius:var(--r-pill);box-shadow:var(--sh-green);
}
.price-card h3{margin-bottom:.2em;}
.price-card .sub{font-size:.9rem;color:var(--ink-3);margin-bottom:1.2rem;}
.price-amount{display:flex;align-items:baseline;gap:.4rem;margin-bottom:.3rem;}
.price-amount b{font-family:var(--font-display);font-size:2.6rem;color:var(--brand-900);line-height:1;}
.price-amount span{font-size:.92rem;color:var(--ink-3);}
.price-note{font-size:.82rem;color:var(--ink-3);margin-bottom:1.4rem;}
.price-card .check-list{margin:0 0 1.6rem;flex:1;}
.price-card .check-list li{font-size:.93rem;}
.price-table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.price-table th,.price-table td{padding:.95rem 1.1rem;text-align:start;font-size:.94rem;border-bottom:1px solid var(--line-2);}
.price-table thead th{background:var(--brand-50);color:var(--brand-900);font-family:var(--font-display);font-weight:600;}
.price-table tbody tr:last-child th,.price-table tbody tr:last-child td{border-bottom:0;}
.price-table td{color:var(--ink-2);}
.table-scroll{overflow-x:auto;border-radius:var(--r-md);}

/* ================= صفحة الخطأ 404 ================= */
.error-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-block:var(--gap-xl);gap:.5rem;}
.error-wrap .code{font-family:var(--font-display);font-size:clamp(4rem,12vw,7rem);color:var(--brand-100);line-height:1;}
.error-wrap img{max-width:260px;margin-bottom:1rem;}

/* =========================================================
   مكوّنات إضافية: الباقات، المدونة، لوحة الطالب، الصفحات النصية
   ========================================================= */

/* ---------------- بطاقات الباقات ---------------- */
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-md);align-items:stretch;}
@media (max-width:900px){.plan-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto;}}
.plan{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:2rem 1.8rem;display:flex;flex-direction:column;position:relative;
  transition:box-shadow .22s,transform .22s;
}
.plan:hover{box-shadow:var(--sh-md);transform:translateY(-4px);}
.plan.featured{
  border-color:var(--brand-700);box-shadow:var(--sh-lg);
  background:linear-gradient(180deg,var(--brand-50),var(--surface) 40%);
}
.plan .tagline{font-size:.92rem;color:var(--ink-3);margin-bottom:1.2rem;}
.plan .price{display:flex;align-items:baseline;gap:.4rem;margin-bottom:.3rem;}
.plan .price b{font-family:var(--font-display);font-size:2.6rem;color:var(--brand-900);line-height:1;}
.plan .price span{font-size:.9rem;color:var(--ink-3);}
.plan .vat{font-size:.8rem;color:var(--ink-3);margin-bottom:1.4rem;}
.plan .ribbon{
  position:absolute;inset-block-start:-13px;inset-inline-end:1.6rem;
  background:var(--green-600);color:#fff;font-size:.78rem;font-weight:700;
  padding:.25rem .9rem;border-radius:var(--r-pill);box-shadow:var(--sh-green);
}
.plan .check-list{flex:1;margin-block:1.2rem 1.6rem;}
.plan .check-list li{font-size:.93rem;}

.compare-table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.compare-table th,.compare-table td{padding:.95rem 1.1rem;text-align:start;font-size:.93rem;border-bottom:1px solid var(--line-2);}
.compare-table thead th{background:var(--brand-50);color:var(--brand-900);font-family:var(--font-display);font-weight:600;}
.compare-table tbody tr:last-child td{border-bottom:0;}
.compare-table td:not(:first-child),.compare-table th:not(:first-child){text-align:center;}
.compare-table .yes{color:var(--success);font-weight:700;}
.compare-table .no{color:var(--ink-3);}
.table-scroll{overflow-x:auto;border-radius:var(--r-md);}

/* ---------------- المدونة ---------------- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-md);}
@media (max-width:900px){.post-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.post-grid{grid-template-columns:1fr;}}
.post-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .22s,transform .22s;
}
.post-card:hover{box-shadow:var(--sh-lg);transform:translateY(-5px);}
.post-card .cover{aspect-ratio:16/9;overflow:hidden;background:var(--surface-2);}
.post-card .cover img{width:100%;height:100%;object-fit:cover;}
.post-card .body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1;}
.post-meta{display:flex;align-items:center;gap:.6rem;font-size:.8rem;color:var(--ink-3);margin-bottom:.6rem;}
.post-card h3{font-size:1.1rem;margin-bottom:.45em;}
.post-card p{font-size:.93rem;flex:1;}

/* ---------------- المقال ---------------- */
.article{max-width:760px;margin-inline:auto;}
.article h2{font-size:1.6rem;margin-top:2.2rem;}
.article h3{font-size:1.2rem;margin-top:1.6rem;}
.article p,.article li{font-size:1.04rem;line-height:1.95;}
.article ul{margin:0 0 1.2em;display:grid;gap:.5rem;}
.article ul li{position:relative;padding-inline-start:1.3rem;color:var(--ink-2);}
.article ul li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:.75em;width:7px;height:7px;border-radius:50%;background:var(--green-500);}
.article blockquote{
  margin:1.8rem 0;padding:1.2rem 1.4rem;background:var(--brand-50);
  border-inline-start:3px solid var(--brand-700);border-radius:var(--r-sm);
}
.article blockquote p{margin:0;color:var(--brand-800);font-size:1.05rem;}
.article figure{margin:2rem 0;}
.article figcaption{font-size:.85rem;color:var(--ink-3);margin-top:.6rem;text-align:center;}

/* ---------------- لوحة الطالب ---------------- */
.dash{display:grid;grid-template-columns:260px 1fr;gap:var(--gap-md);align-items:flex-start;}
@media (max-width:980px){.dash{grid-template-columns:1fr;}}
.dash-side{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:1.4rem;position:sticky;top:90px;
}
@media (max-width:980px){.dash-side{position:static;}}
.dash-user{display:flex;align-items:center;gap:.8rem;padding-bottom:1.1rem;margin-bottom:1.1rem;border-bottom:1px solid var(--line-2);}
.dash-user img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:1px solid var(--line);}
.dash-user b{display:block;font-size:.98rem;color:var(--brand-900);}
.dash-user span{font-size:.8rem;color:var(--ink-3);}
.dash-menu a{
  display:flex;align-items:center;gap:.7rem;padding:.7rem .8rem;border-radius:var(--r-sm);
  font-size:.94rem;color:var(--ink-2);transition:background .16s,color .16s;
}
.dash-menu a svg{width:19px;height:19px;}
.dash-menu a:hover{background:var(--surface-2);color:var(--brand-900);}
.dash-menu a.is-active{background:var(--brand-900);color:#fff;}
.dash-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-sm);margin-bottom:var(--gap-md);}
@media (max-width:760px){.dash-cards{grid-template-columns:1fr;}}
.dash-stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:1.3rem 1.4rem;}
.dash-stat span{font-size:.85rem;color:var(--ink-3);display:block;margin-bottom:.3rem;}
.dash-stat b{font-family:var(--font-display);font-size:1.8rem;color:var(--brand-900);line-height:1.1;}
.progress{height:8px;border-radius:var(--r-pill);background:var(--surface-2);overflow:hidden;margin-top:.8rem;}
.progress i{display:block;height:100%;border-radius:var(--r-pill);background:linear-gradient(to left,var(--brand-600),var(--green-500));}
.schedule{width:100%;border-collapse:collapse;}
.schedule th,.schedule td{padding:.85rem 1rem;text-align:start;font-size:.92rem;border-bottom:1px solid var(--line-2);}
.schedule thead th{color:var(--ink-3);font-weight:600;font-size:.82rem;}
.schedule tbody tr:last-child td{border-bottom:0;}
.status{font-size:.78rem;padding:.2rem .7rem;border-radius:var(--r-pill);font-weight:600;white-space:nowrap;}
.status.up{background:var(--brand-100);color:var(--brand-800);}
.status.done{background:#e4f3e9;color:var(--success);}
.status.soon{background:var(--green-100);color:var(--green-700);}

/* ---------------- صفحة الخطأ 404 ---------------- */
.error-wrap{text-align:center;padding-block:var(--gap-xl);}
.error-wrap img{margin-inline:auto;margin-bottom:1.2rem;}
.error-code{font-family:var(--font-display);font-size:clamp(4.5rem,13vw,8rem);line-height:1;color:var(--brand-900);opacity:.16;margin-bottom:.1em;}
.error-wrap p{margin-inline:auto;}

/* ---------------- الصفحات النصية ---------------- */
.legal{max-width:760px;margin-inline:auto;}
.legal h2{font-size:1.4rem;margin-top:2.2rem;}
.legal p,.legal li{font-size:1rem;}
.legal ul{display:grid;gap:.5rem;margin-bottom:1.2em;}
.legal ul li{position:relative;padding-inline-start:1.3rem;color:var(--ink-2);}
.legal ul li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:.75em;width:6px;height:6px;border-radius:50%;background:var(--brand-600);}
.legal .updated{font-size:.88rem;color:var(--ink-3);}