@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&family=Tajawal:wght@400;500;700;800&display=swap');
:root{--ink:#162943;--inksoft:#567086;--navy:#082755;--navy2:#0a3a76;--blue:#1e64ab;--gold:#d7a843;--white:#fff;--light:#f5f8fb;--border:#e7edf3;--shadow:0 20px 55px rgba(9,39,78,.1);font-family:'Manrope','DM Sans',sans-serif;color:var(--ink);background:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px}button,a{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #eab650;outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.56}img{max-width:100%;object-fit:contain}h1,h2,h3,p{margin-top:0}p{line-height:1.73}.container{max-width:1200px;padding:0 28px;margin:0 auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}.head-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;gap:12px;align-items:center;background:none;border:0;padding:0;text-align:start;color:var(--navy);flex-shrink:0}.brand img{width:53px;height:53px;border-radius:50%}.brand strong{font-size:18px;letter-spacing:.055em;font-weight:800;display:block;line-height:1.1}.brand strong i{font-style:normal;color:var(--gold)}.brand small{font-size:10px;display:block;margin-top:5px;color:#687990;font-weight:700;letter-spacing:.02em}.navigation{display:flex;align-items:center;gap:5px}.nav-btn{padding:11px 12px;border:0;background:transparent;color:#486078;border-radius:10px;font-size:13px;font-weight:700;white-space:nowrap}.nav-btn:hover,.nav-btn.active{background:#eaf3fd;color:var(--navy2)}.toolbar{display:flex;align-items:center;gap:8px}.langs{display:flex;align-items:center;padding:4px;border:1px solid var(--border);background:#f5f8fb;border-radius:12px}.langs button{border:0;padding:7px 8px;border-radius:8px;font-size:11px;font-weight:800;background:transparent;color:#8494a8}.langs button.chosen{color:#fff;background:var(--navy);box-shadow:0 3px 9px #0827552d}.mobile-menu{display:none;border:0;background:#edf3fa;border-radius:12px;padding:8px 13px;color:var(--navy);font-size:23px}
.hero{position:relative;overflow:hidden;background:linear-gradient(122deg,#071e42,#0b3471 66%,#165897);color:#fff}.hero:after{position:absolute;content:'';inset:auto 0 0;height:65px;background:linear-gradient(transparent,#05244940);pointer-events:none}.hero-sheen{position:absolute;top:-350px;right:-150px;height:780px;width:850px;border-radius:50%;background:radial-gradient(circle,#79c2ff1a 0%,transparent 69%)}.hero-inner{display:grid;grid-template-columns:1.05fr 1fr;min-height:530px;align-items:center;gap:40px;position:relative;padding-top:58px;padding-bottom:58px}.hero-copy{z-index:1}.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid #ffffff35;border-radius:99px;background:#ffffff13;font-size:11px;font-weight:700;letter-spacing:.025em}.dot{width:7px;height:7px;background:#e2ae42;border-radius:50%}.hero h1{font-size:clamp(37px,4.15vw,59px);line-height:1.18;letter-spacing:-.048em;margin:24px 0 20px;font-weight:800;max-width:640px}.hero h1 em{font-style:normal;color:#e7bb62}.hero-copy>p{color:#dfedfc;max-width:560px;font-size:15px;line-height:1.85}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;border:0;border-radius:12px;padding:14px 20px;font-weight:800;font-size:13px;line-height:1.3;transition:transform .15s,box-shadow .15s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--gold);color:#16283f;box-shadow:0 12px 35px rgba(171,121,38,.18)}.btn-primary:hover{background:#ecc36c}.btn-ghost{background:#ffffff0b;color:#fff;border:1px solid #ffffff72}.btn-light{background:#eaf1f9;color:var(--navy)}.hero-location{margin-top:30px;color:#cbdff4;font-size:12px;display:flex;gap:10px;align-items:center}.hero-location span{color:var(--gold)}.hero-art{position:relative;height:430px;display:flex;align-items:center;justify-content:center}.hero-ring{position:absolute;border-radius:50%;border:1px solid #9dc5f532}.ring-one{width:390px;height:390px}.ring-two{width:490px;height:490px}.art-big{position:relative;z-index:1;width:305px;height:305px;border-radius:50%;background:radial-gradient(circle at 32% 25%,#fff 0%,#edf5fb 70%,#bbd5ed 100%);border:9px solid #e5b55e;outline:8px solid #ffffff12;box-shadow:0 25px 75px #020e2899;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:33px}.art-big img{width:190px;height:188px;border-radius:50%}.art-big p{font-size:10px;color:#28496b;font-weight:800;text-align:center;line-height:1.45;margin:8px 0 0}.float-card{position:absolute;z-index:2;background:#fff;color:var(--navy);box-shadow:var(--shadow);border:1px solid #e5effd;padding:15px;border-radius:14px;display:flex;align-items:center;gap:8px}.float-one{left:-20px;bottom:20px;flex-direction:column;align-items:flex-start;max-width:225px}.float-card b{font-size:13px}.float-one small{font-size:11px;line-height:1.5;color:#5d7894}.float-two{right:-12px;top:44px}.float-two span{font-size:20px}
.section{padding-top:85px;padding-bottom:85px}.section-top{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}.section-top>div{max-width:760px}.overline{text-transform:uppercase;letter-spacing:.15em;color:#b58a39;font-size:11px;font-weight:800}.section h2,.page h1,.academy-banner h2{color:var(--navy);font-size:clamp(29px,3.5vw,43px);letter-spacing:-.035em;margin:12px 0}.section-top p,.page-title p{color:var(--inksoft);font-size:15px;max-width:750px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}.feature{border:1px solid var(--border);border-radius:18px;padding:29px;background:#fff;box-shadow:0 10px 35px #0a2d5b08}.feature-icon{height:64px;width:64px;display:grid;place-items:center;background:#eaf3fc;border-radius:18px;font-size:30px;margin-bottom:16px}.feature h3{font-size:19px;color:var(--navy);margin-bottom:8px}.feature p{color:#60758c;font-size:13px;margin:0}.academy-banner{background:linear-gradient(115deg,#eaf3fc,#f7fafc);border:1px solid #dceaf6;border-radius:23px;padding-top:38px;padding-bottom:38px;display:flex;justify-content:space-between;align-items:center;gap:28px}.academy-banner>div{max-width:680px}.academy-banner p{margin:4px 0 22px;color:var(--inksoft)}.metrics{display:flex;flex-wrap:wrap;gap:14px;color:var(--navy2);font-size:12px;font-weight:800}.metrics span{border:1px solid #cfe4f8;padding:9px 11px;border-radius:40px;background:#fff}.academy-banner .btn{white-space:nowrap}
.page{min-height:calc(100vh - 300px);padding-top:68px;padding-bottom:100px}.page-title{max-width:790px;margin-bottom:28px}.page-title h1{margin-top:13px}.info-strip{background:#ecf6ff;border:1px solid #d2e7fa;display:flex;gap:24px;align-items:center;flex-wrap:wrap;color:#32608d;font-size:12px;padding:17px 20px;font-weight:700;border-radius:13px;margin:30px 0}.courses{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.course-card{border:1px solid #e3ebf5;padding:25px;border-radius:20px;box-shadow:0 12px 35px rgba(14,46,83,.055);background:#fff;display:flex;flex-direction:column;min-height:260px;transition:transform .16s,box-shadow .16s}.course-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.course-symbol{--symbol:#c8a25b;display:grid;place-items:center;width:67px;height:67px;border-radius:18px;color:var(--symbol);background:color-mix(in srgb,var(--symbol) 11%,white);font-weight:900;font-size:27px;margin-bottom:16px}.course-level{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#9caaaf;font-weight:800}.course-card h3{color:#12345f;margin:7px 0 4px;font-size:21px}.course-card p{font-size:12px;color:#637c95;line-height:1.5}.course-bottom{margin-top:auto;padding-top:20px;display:flex;justify-content:space-between;gap:10px;align-items:center;border-top:1px solid #eef2f6}.course-bottom span{font-size:11px;color:#7590a6}.course-bottom button{border:0;background:#e8f0fb;padding:9px 11px;border-radius:9px;color:var(--navy2);font-weight:800;font-size:11px}.notice{color:#6d788a;font-size:12px;margin:27px 0 0;border-left:3px solid var(--gold);padding-left:12px}
.lesson-page{padding-top:42px;padding-bottom:95px;min-height:75vh}.back-link{border:0;background:transparent;padding:9px 0;color:#356fa6;font-weight:700;margin-bottom:20px;font-size:13px}.lesson-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:27px}.lesson-aside{border:1px solid var(--border);padding:30px;background:#f5f9fd;border-radius:22px;align-self:start}.lesson-aside h2{font-size:22px;color:var(--navy);margin:12px 0}.lesson-aside p{font-size:13px;color:#637c90}.lesson-pills{display:flex;gap:7px;flex-wrap:wrap;margin:25px 0}.lesson-pills span{font-size:10px;font-weight:800;padding:8px 12px;border:1px solid #d7e7f8;background:#fff;border-radius:99px}.aside-note{background:#e7f1fc;padding:13px;border-radius:11px;font-size:12px;color:#2c577e;line-height:1.7}.lesson-main{min-height:450px;border:1px solid var(--border);border-radius:23px;padding:32px 40px;box-shadow:0 14px 38px #0a254611}.lesson-progress{display:flex;justify-content:space-between;font-size:12px;font-weight:800;color:#627891;margin-bottom:10px}.progress-track{height:8px;background:#e8eef4;border-radius:20px;overflow:hidden}.progress-track div{height:100%;background:linear-gradient(90deg,var(--gold),#eac97e);border-radius:20px;transition:width .2s}.lesson-content{padding-top:34px}.lesson-content h1{margin:9px 0 12px;color:var(--navy);font-size:29px}.lesson-explanation{background:#f5f9fd;border-radius:12px;padding:22px;font-size:14px;color:#405870;border:1px solid #e9eff6}.quiz-box{padding-top:14px}.quiz-label{font-size:12px;font-weight:800;color:#b78c39}.quiz-box h3{margin-top:12px;color:#163960}.answers{display:grid;gap:10px;margin-top:19px}.answer{display:flex;align-items:center;text-align:start;gap:12px;padding:14px 15px;background:#fff;border:1px solid #dce7f1;border-radius:12px;color:var(--ink);font-weight:700}.answer:hover:not(:disabled),.answer.selected{background:#eaf3fe;border-color:#3e84ca}.answer.correct{background:#e5f7ed;border-color:#48b773}.answer.incorrect{background:#fff0f0;border-color:#d27676}.answer-index{width:27px;height:27px;display:grid;place-items:center;border-radius:9px;background:#edf3f9;color:#326997;flex-shrink:0;font-weight:900}.quiz-submit{margin-top:19px}.answer-feedback{margin:15px 0;border-radius:10px;padding:12px 15px;font-size:13px;font-weight:700}.answer-feedback.good{background:#e4f5ea;color:#246b42}.answer-feedback.bad{background:#fff4e6;color:#946117}.result{text-align:center;padding:60px 12px}.result-icon{font-size:66px;margin-bottom:17px}.result h1{font-size:42px;color:var(--navy);margin:15px 0}.result p{font-size:13px;color:var(--inksoft)}.result-actions{display:flex;justify-content:center;gap:12px;margin-top:24px}
.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.project-card{padding:27px;border:1px solid var(--border);border-radius:19px;background:#fff;min-height:250px}.project-symbol{font-size:38px;display:block;margin-bottom:20px}.project-status{font-size:10px;font-weight:800;color:#aa7f25;background:#fff6df;padding:6px 9px;border-radius:99px}.project-card h3{font-size:19px;margin:19px 0 8px;color:#153460}.project-card p{font-size:13px;color:#677e93}.project-cta{margin-top:32px;padding:30px;border-radius:18px;background:#eff6fe;display:flex;justify-content:space-between;align-items:center;gap:20px}.project-cta h2{margin:0;color:var(--navy)}.join-options{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.join-options a{display:flex;align-items:center;flex-direction:column;text-align:center;gap:12px;background:#fff;border:1px solid var(--border);padding:33px 19px;border-radius:18px;transition:transform .17s}.join-options a:hover{transform:translateY(-3px);border-color:#b9d5ef}.join-options a span{font-size:40px}.join-options a h3{color:var(--navy);font-size:19px;margin:0}.join-options a b{color:#b28a42}.contact-panel{margin-top:26px;padding:28px 35px;background:linear-gradient(120deg,#062b5d,#12508d);color:#fff;border-radius:19px;display:flex;align-items:center;justify-content:space-between;gap:20px}.contact-panel h2{font-size:22px}.contact-panel p{color:#e6eefa;font-size:17px;margin:0;direction:ltr}.dashboard-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:22px}.stats-card,.teacher-card{border:1px solid var(--border);border-radius:20px;padding:32px;background:#fff;box-shadow:0 10px 37px #061f3d08}.stats-card>span:first-child{font-size:37px;display:block;margin-bottom:12px}.stats-card strong{display:block;font-size:75px;color:var(--navy);line-height:1.4}.stats-card strong small{font-size:26px;color:#8298ab}.stats-card p{color:#6e8293;font-size:13px;margin-top:13px}.stats-card .btn{margin-top:22px}.teacher-icon{font-size:42px}.teacher-card h2{color:var(--navy);font-size:24px;margin:16px 0}.teacher-card p{color:#657c92;font-size:14px}.teacher-card .btn{margin-top:25px}
.footer{background:#051e41;color:#e6eef8}.footer-inner{padding-top:30px;padding-bottom:30px;display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-brand{display:flex;align-items:center;gap:14px}.footer-brand img{width:52px;height:52px;border-radius:50%;background:white}.footer-brand strong{font-size:15px;letter-spacing:.05em}.footer-brand p{font-size:11px;line-height:1.55;color:#b9cad9;margin:7px 0 0}.footer-inner>div:last-child{text-align:end}.footer-inner a{display:block;font-weight:800;direction:ltr}.footer-inner small{display:block;color:#9fb2c7;font-size:10px;margin-top:8px}
[dir="rtl"]{font-family:'Tajawal','Manrope',sans-serif}[dir="rtl"] .hero h1{letter-spacing:0}[dir="rtl"] .brand strong{letter-spacing:.05em}[dir="rtl"] .back-link{direction:rtl}[dir="rtl"] .notice{border-left:0;border-right:3px solid var(--gold);padding-left:0;padding-right:12px}[dir="rtl"] .float-one{left:auto;right:-20px}[dir="rtl"] .float-two{right:auto;left:-12px}
@media(max-width:1100px){.nav-btn{padding:9px 7px;font-size:12px}.head-inner{gap:13px}.brand strong{font-size:16px}.brand img{height:45px;width:45px}.hero-inner{gap:15px}.hero-art{transform:scale(.9)}.float-one{left:0}.float-two{right:0}}
@media(max-width:850px){.container{padding-left:20px;padding-right:20px}.head-inner{min-height:70px}.mobile-menu{display:block}.navigation{display:none;position:absolute;top:70px;left:0;right:0;padding:13px 20px 20px;background:#fff;border-bottom:1px solid var(--border);box-shadow:0 18px 35px #1429441c;flex-direction:column;align-items:stretch}.navigation.is-open{display:flex}.nav-btn{text-align:start;padding:13px;font-size:14px}.hero-inner{grid-template-columns:1fr;gap:5px;padding-top:53px;padding-bottom:20px}.hero-copy{text-align:center}.hero-copy>p{margin-left:auto;margin-right:auto}.hero h1{max-width:670px;margin-left:auto;margin-right:auto}.hero-actions,.hero-location{justify-content:center}.hero-art{transform:scale(.79);margin-top:-30px;margin-bottom:-35px}.section{padding-top:60px;padding-bottom:60px}.features,.courses,.projects{grid-template-columns:repeat(2,1fr)}.academy-banner{margin:0 20px}.lesson-layout{grid-template-columns:1fr}.lesson-aside{display:grid;grid-template-columns:70px 1fr;column-gap:15px}.lesson-aside>h2,.lesson-aside>p,.lesson-aside>.overline{grid-column:2}.lesson-aside>.course-symbol{grid-row:1/4}.lesson-pills,.lesson-aside>.aside-note{grid-column:1/-1}.lesson-aside{padding:20px}.lesson-aside h2{margin:4px 0}.lesson-aside p{margin:0}.join-options{grid-template-columns:1fr 1fr}}
@media(max-width:590px){.brand strong{font-size:14px}.brand small{font-size:9px}.brand img{width:42px;height:42px}.head-inner{gap:7px}.langs{padding:2px}.langs button{padding:6px;font-size:10px}.mobile-menu{padding:4px 9px}.hero h1{font-size:36px}.hero-copy>p{font-size:14px}.hero-art{height:350px;transform:scale(.62);margin-top:-18px;margin-bottom:-60px}.hero-inner{padding-top:35px}.hero-actions .btn{width:100%}.hero-location{font-size:10px;flex-wrap:wrap}.section h2,.page h1{font-size:30px}.section{padding-top:53px;padding-bottom:53px}.features,.courses,.projects,.join-options,.dashboard-grid{grid-template-columns:1fr}.academy-banner{margin:0 15px;display:block}.academy-banner .btn{margin-top:22px}.page{padding-top:43px}.lesson-main{padding:23px 18px}.lesson-content h1{font-size:24px}.lesson-explanation{padding:16px}.project-cta,.contact-panel,.footer-inner{flex-direction:column;align-items:start}.footer-inner>div:last-child{text-align:start}.result-actions{flex-wrap:wrap}.info-strip{gap:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}