:root{
  --navy:#07172d;--navy2:#0d2948;--blue:#0e5d8e;--cyan:#37a7d8;
  --gold:#d6ad42;--gold2:#f0cc6c;--paper:#f4f1e8;--white:#fff;
  --ink:#0f1d31;--muted:#687487;--line:#dfe5ec;--green:#22c76a;
  --shadow:0 24px 70px rgba(4,18,37,.14)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:#e7ebf0;color:var(--ink);
  font-family:Inter,system-ui,-apple-system,"Segoe UI","Noto Naskh Arabic",Arial,sans-serif;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{font:inherit}
.site-shell{max-width:1500px;margin:auto;background:#f8f7f2;min-height:100vh;box-shadow:0 0 80px rgba(7,23,45,.12)}
.topbar{
  position:sticky;top:0;z-index:100;height:82px;padding:0 5vw;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:rgba(248,247,242,.9);backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(7,23,45,.07)
}
.brand{display:flex;align-items:center;gap:12px;direction:ltr}
.brand-mark{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  color:var(--navy);font-weight:1000;letter-spacing:-1px;
  background:linear-gradient(145deg,var(--gold2),var(--gold));
  box-shadow:0 8px 20px rgba(214,173,66,.25)
}
.brand-copy{display:flex;flex-direction:column;text-align:left}
.brand-copy strong{font-size:16px;letter-spacing:.8px}
.brand-copy small{font-size:10px;color:var(--muted);margin-top:2px}
.desktop-nav{display:flex;gap:26px;direction:ltr}
.desktop-nav a{font-size:12px;font-weight:800;color:#24334a;position:relative}
.desktop-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:2px;background:var(--gold);transition:.25s}
.desktop-nav a:hover:after{right:0}
.menu-btn{display:none;width:44px;height:44px;border-radius:14px;border:1px solid var(--line);background:#fff;color:var(--navy);font-size:20px}
.mobile-menu{display:none}

.hero{
  min-height:680px;padding:80px 5vw 70px;
  display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;
  background:
    radial-gradient(circle at 12% 12%,rgba(55,167,216,.11),transparent 32%),
    linear-gradient(180deg,#fbfaf6,#f2f4f6)
}
.hero-copy{max-width:700px}
.pill,.parent-brand,.section-kicker{direction:ltr;text-align:right;font-weight:900;letter-spacing:1.25px}
.pill{
  display:inline-flex;padding:9px 13px;border-radius:999px;background:#eaf3f7;
  border:1px solid #cfe1e9;color:var(--blue);font-size:10px
}
.parent-brand{margin-top:18px;font-size:9px;color:#8792a1}
.hero h1{font-size:clamp(46px,5vw,76px);line-height:1.18;letter-spacing:-2.1px;margin:18px 0 22px}
.hero h1 span{color:var(--blue)}
.hero-lead{font-size:17px;line-height:2.05;color:var(--muted);max-width:680px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:15px;font-size:12px;font-weight:900;direction:ltr}
.btn-gold{background:linear-gradient(145deg,var(--gold2),var(--gold));color:var(--navy);box-shadow:0 12px 28px rgba(214,173,66,.24)}
.btn-glass{background:#fff;border:1px solid var(--line);color:var(--navy)}
.hero-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:36px;max-width:520px;direction:ltr}
.hero-trust div{padding:16px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 30px rgba(7,23,45,.05)}
.hero-trust strong{display:block;font-size:21px;color:var(--navy)}
.hero-trust span{font-size:9px;color:var(--muted)}

.hero-visual{
  min-height:530px;border-radius:42px;position:relative;overflow:hidden;
  background:
    linear-gradient(135deg,rgba(255,255,255,.06),transparent 45%),
    linear-gradient(145deg,var(--navy),#0b3357 70%,#115a7c);
  box-shadow:0 36px 90px rgba(5,27,51,.28)
}
.grid-lines{
  position:absolute;inset:0;opacity:.13;
  background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);
  background-size:42px 42px
}
.visual-badge{position:absolute;left:28px;top:28px;z-index:2;direction:ltr;font-size:10px;font-weight:900;color:var(--gold2);letter-spacing:1px}
.orb{position:absolute;border-radius:50%;filter:blur(3px)}
.orb-1{width:220px;height:220px;background:rgba(55,167,216,.18);right:-60px;top:70px}
.orb-2{width:180px;height:180px;background:rgba(214,173,66,.13);left:40px;bottom:20px}
.dashboard-card{position:absolute;z-index:3;backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff}
.main-card{left:9%;right:9%;top:28%;padding:28px;border-radius:26px}
.main-card span{direction:ltr;display:block;text-align:right;color:var(--gold2);font-size:8px;font-weight:900;letter-spacing:1.2px}
.main-card h3{font-size:25px;line-height:1.8;margin:10px 0}
.main-card p{font-size:13px;line-height:2;color:#cfdae7}
.mini-card{position:absolute;z-index:4;padding:15px 18px;border-radius:18px;background:rgba(255,255,255,.92);box-shadow:0 18px 40px rgba(2,14,29,.24);direction:ltr}
.mini-card b{display:block;font-size:12px}.mini-card span{font-size:8px;color:var(--muted)}
.mini-a{left:6%;bottom:10%}.mini-b{right:5%;bottom:14%}

.intro-band{padding:90px 5vw;background:#fff}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end}
.section-kicker{font-size:9px;color:var(--blue);margin-bottom:10px}
.intro-band h2,.section-head h2,.projects-section h2,.admission h2,.contact h2{font-size:clamp(32px,4vw,54px);line-height:1.25;margin:0}
.intro-band h2 span,.admission h2 span{color:var(--blue)}
.intro-band p,.section-head p,.projects-copy p,.admission-copy p,.contact p{font-size:14px;line-height:2;color:var(--muted)}
.process{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:48px;direction:ltr}
.process article{min-height:165px;padding:20px;border-radius:22px;background:#f7f8fa;border:1px solid var(--line);position:relative;overflow:hidden}
.process article:before{content:"";position:absolute;inset:auto -40px -60px auto;width:110px;height:110px;border-radius:50%;background:rgba(55,167,216,.08)}
.process span{font-size:10px;color:var(--gold);font-weight:1000}
.process b{display:block;margin:24px 0 8px;font-size:16px}
.process small{color:var(--muted);line-height:1.65}

.modules-section{padding:90px 5vw;background:#f5f3ed}
.section-head{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:end;margin-bottom:36px}
.section-head h2{direction:ltr;text-align:left}
.section-head p{margin:0}
.modules-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;direction:ltr}
.module-card{
  min-height:300px;padding:24px 20px;border-radius:24px;background:#fff;border:1px solid #e1e5ea;
  position:relative;overflow:hidden;transition:.25s;box-shadow:0 10px 34px rgba(7,23,45,.045)
}
.module-card:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(7,23,45,.11)}
.num{position:absolute;right:16px;top:16px;font-size:10px;font-weight:1000;color:#8d98a6}
.icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#eaf3f7;color:var(--blue);font-size:23px;font-weight:900;margin-top:6px}
.module-card h3{font-size:17px;margin:24px 0 10px;color:var(--navy)}
.module-card p{font-size:12px;line-height:1.8;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.chips span{font-size:7px;font-weight:900;padding:6px 7px;border-radius:999px;background:#f3f5f7;color:#677385;border:1px solid #e6e9ed}
.module-card.featured{background:linear-gradient(145deg,var(--navy),#0b3152);color:#fff;border-color:transparent}
.module-card.featured h3{color:#fff}.module-card.featured p{color:#c9d5e2}.module-card.featured .num{color:var(--gold2)}
.module-card.featured .icon{background:rgba(255,255,255,.08);color:var(--gold2)}
.module-card.featured .chips span{background:rgba(255,255,255,.08);color:#d7e0eb;border-color:rgba(255,255,255,.1)}

.projects-section{
  padding:90px 5vw;display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;
  background:linear-gradient(145deg,var(--navy),#0a3458);color:#fff
}
.section-kicker.gold{color:var(--gold2)}
.projects-section h2{margin:8px 0 18px}.projects-copy p{color:#c4d0de}
.project-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px;direction:ltr}
.project-tags span{font-size:8px;font-weight:900;padding:8px 10px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.055);color:#d8e2ec}
.project-board{display:grid;grid-template-columns:1fr 1fr;gap:12px;direction:ltr}
.project-board article{padding:22px;border-radius:22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px)}
.project-board article.wide{grid-column:1/3;background:linear-gradient(135deg,rgba(214,173,66,.16),rgba(255,255,255,.06))}
.project-board span{display:block;color:var(--gold2);font-size:7px;font-weight:900;letter-spacing:.9px}
.project-board b{display:block;margin:20px 0 6px;font-size:17px}
.project-board small{color:#afbdcd;font-size:9px}

.showcase{padding:90px 5vw;background:#fff}
.showcase-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.showcase figure{margin:0;padding:12px;border-radius:28px;background:#f4f6f8;border:1px solid var(--line);box-shadow:0 18px 55px rgba(7,23,45,.07)}
.showcase img{width:100%;height:560px;object-fit:contain;border-radius:20px;background:#e9edf2}
.showcase figcaption{padding:14px 6px 4px;font-size:11px;color:var(--muted);direction:ltr}

.admission{padding:90px 5vw;display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center;background:#f5f3ed}
.price-card{padding:34px;border-radius:32px;color:#fff;background:linear-gradient(145deg,var(--navy),#0c365a);box-shadow:var(--shadow)}
.price-label{direction:ltr;font-size:8px;font-weight:900;color:var(--gold2);letter-spacing:1px}
.price-card h2{font-size:38px;margin:10px 0}.price-card p{color:#c7d2df;line-height:1.8}
.price{display:flex;align-items:baseline;gap:8px;direction:ltr;margin:28px 0}
.price small{color:var(--gold2);font-weight:900}.price strong{font-size:60px;color:#fff}.price span{font-size:10px;color:#aebdcc}
.full{width:100%}
.admission-copy h2{margin:8px 0 24px}.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px;direction:ltr}
.checks div{padding:14px;border-radius:15px;background:#fff;border:1px solid var(--line);font-size:11px;font-weight:800}

.contact{padding:80px 5vw;background:#0b203a;color:#fff}
.contact h2{margin:7px 0 12px}.contact p{color:#b8c5d4}
.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px;direction:ltr}
.contact-grid a{padding:17px 18px;border-radius:17px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.contact-grid small{display:block;color:#8fa2b6;font-size:7px;font-weight:900}.contact-grid b{display:block;margin-top:6px;font-size:13px}
.contact-grid a.wa{background:rgba(34,199,106,.16);border-color:rgba(34,199,106,.4)}
.address{margin-top:16px;padding:17px;border-radius:17px;background:rgba(214,173,66,.1);border:1px solid rgba(214,173,66,.22);font-size:12px;direction:ltr;text-align:left}

footer{padding:34px 5vw 90px;background:#07172d;color:#d4deea;text-align:center}
.footer-brand{display:flex;align-items:center;justify-content:center;gap:10px;direction:ltr}
.brand-mark.small{width:36px;height:36px;border-radius:11px;font-size:11px}
.footer-brand div{display:flex;flex-direction:column;text-align:left}.footer-brand strong{font-size:12px}.footer-brand small{font-size:8px;color:#8ca0b4}
footer p{font-size:10px;color:#9eafc1}footer>small{font-size:8px;color:#6f879d}

.floating{position:fixed;right:max(18px,calc((100vw - 1500px)/2 + 18px));bottom:18px;z-index:120;display:grid;gap:9px}
.floating a{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;font-weight:1000;box-shadow:0 14px 35px rgba(0,0,0,.22);direction:ltr}
.float-wa{background:var(--green);color:#fff}.float-call{background:var(--gold);color:var(--navy)}

@media(max-width:1100px){
  .desktop-nav{display:none}.menu-btn{display:grid;place-items:center}
  .mobile-menu{position:fixed;top:82px;right:24px;left:24px;z-index:95;padding:12px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 22px 50px rgba(7,23,45,.18)}
  .mobile-menu.open{display:grid}
  .mobile-menu a{padding:12px 10px;border-bottom:1px solid #edf0f3;font-size:12px;font-weight:800;direction:ltr;text-align:left}
  .hero{grid-template-columns:1fr;gap:44px}.hero-visual{min-height:470px}
  .modules-grid{grid-template-columns:repeat(2,1fr)}
  .process{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  body{background:#f8f7f2}
  .site-shell{width:100%;box-shadow:none}
  .topbar{height:70px;padding:0 16px}
  .brand-mark{width:42px;height:42px}.brand-copy strong{font-size:13px}.brand-copy small{font-size:8px}
  .mobile-menu{top:70px;right:12px;left:12px}
  .hero{padding:26px 14px 44px;min-height:auto;gap:18px}
  .hero-copy{order:1}.hero-visual{order:2;min-height:390px;border-radius:28px}
  .pill{font-size:8px}.parent-brand{font-size:7px}
  .hero h1{font-size:38px;letter-spacing:-.8px;margin:15px 0}
  .hero-lead{font-size:13px;line-height:2}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr}
  .btn{padding:12px 10px;font-size:10px}
  .hero-trust{gap:7px;margin-top:20px}
  .hero-trust div{padding:12px 8px;border-radius:14px}.hero-trust strong{font-size:16px}.hero-trust span{font-size:7px}
  .visual-badge{left:20px;top:20px;font-size:7px}
  .main-card{left:7%;right:7%;top:24%;padding:19px;border-radius:21px}
  .main-card h3{font-size:18px}.main-card p{font-size:10.5px}
  .mini-card{padding:11px 13px;border-radius:14px}.mini-card b{font-size:9px}.mini-card span{font-size:6.5px}
  .intro-band,.modules-section,.showcase,.admission,.contact{padding:60px 14px}
  .intro-grid,.section-head,.projects-section,.admission{grid-template-columns:1fr;gap:20px}
  .intro-band h2,.section-head h2,.projects-section h2,.admission h2,.contact h2{font-size:31px}
  .intro-band p,.section-head p,.projects-copy p,.contact p{font-size:12.5px}
  .process{grid-template-columns:1fr 1fr;gap:8px;margin-top:30px}
  .process article{min-height:135px;padding:16px}.process b{margin:16px 0 7px;font-size:13px}.process small{font-size:9px}
  .modules-grid{grid-template-columns:1fr;gap:9px}
  .module-card{min-height:auto;padding:19px;border-radius:20px}
  .module-card h3{margin:18px 0 7px}.module-card p{font-size:11.5px}
  .projects-section{padding:60px 14px}
  .project-board{grid-template-columns:1fr}.project-board article.wide{grid-column:auto}
  .showcase-grid{grid-template-columns:1fr}.showcase img{height:auto}
  .price-card{padding:24px}.price-card h2{font-size:29px}.price strong{font-size:48px}
  .checks{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr 1fr}.contact-grid b{font-size:11px}
  .address{font-size:10px}
  .floating{right:14px}.floating a{width:48px;height:48px;border-radius:16px}
}
@media(max-width:380px){
  .hero-actions,.contact-grid{grid-template-columns:1fr}
  .process{grid-template-columns:1fr}
}