:root{--navy:#1B2A49;--navy2:#2C4A7A;--teal:#12A4A6;--teal2:#0E8587;--tl:#E3F5F5;--gray:#F1F3F6;--g2:#D5DBE3;
--text:#263238;--muted:#6B7785;--bg:#fff;--card:#F6F8FA;--ok:#1E7B4F;--okb:#D5F0E0;--warn:#9A6B00;--warnb:#FFF1C7}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Tajawal,Tahoma,Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.75;font-size:16px}
a{color:var(--teal2);text-decoration:none}img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.top{background:var(--navy);position:sticky;top:0;z-index:20;box-shadow:0 2px 10px rgba(0,0,0,.12)}
.bar{display:flex;align-items:center;gap:24px;min-height:70px}
.logo{display:flex;align-items:center;gap:10px;color:#fff}.logo b{display:block;font-size:19px}
.logo small{display:block;color:#5FC4C6;font-size:12px;margin-top:-4px}
.mark{width:40px;height:40px;border-radius:12px;background:var(--teal);display:grid;place-items:center;font-weight:800;font-size:22px;color:#fff}
nav{display:flex;gap:4px;margin-inline-start:auto;flex-wrap:wrap}
nav a{color:#C9D3E0;padding:8px 12px;border-radius:8px;font-weight:500}
nav a:hover,nav a.on{color:#fff;background:rgba(255,255,255,.08)}nav a.on{box-shadow:inset 0 -2px 0 var(--teal)}
.menu{display:none;margin-inline-start:auto;background:none;border:0;padding:8px;cursor:pointer}
.menu span{display:block;width:24px;height:2px;background:#fff;margin:5px 0}
.hero{background:var(--navy);color:#fff;padding:72px 0 88px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:auto -120px -160px auto;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(18,164,166,.35),transparent 65%)}
.hero .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center;position:relative;z-index:1}
.kicker{color:#5FC4C6;font-weight:700;letter-spacing:.3px}
h1{font-size:52px;line-height:1.2;margin:8px 0 16px;font-weight:800}
.hero p{color:#C9D3E0;font-size:19px;max-width:560px}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:12px;font-weight:700;background:var(--teal);color:#fff;border:0;cursor:pointer;font-family:inherit;font-size:16px}
.btn:hover{background:var(--teal2)}.btn.ghost{background:transparent;border:1.5px solid #5FC4C6;color:#fff}
.btn.light{background:var(--tl);color:var(--navy)}
.hero-art{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.hero-art img{border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.hero-art img:nth-child(1){transform:rotate(-3deg) translateY(18px)}.hero-art img:nth-child(2){transform:rotate(3deg)}
section{padding:72px 0}.alt{background:var(--gray)}
h2{font-size:34px;color:var(--navy);margin:0 0 10px;font-weight:800}
.lead{color:var(--muted);font-size:18px;max-width:720px;margin:0 0 36px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:-56px;position:relative;z-index:2}
.stat{background:#fff;border-radius:16px;padding:22px;box-shadow:0 10px 30px rgba(27,42,73,.10);text-align:center}
.stat b{display:block;font-size:36px;color:var(--teal);font-weight:800;line-height:1.1}.stat span{color:var(--muted)}
.grid{display:grid;gap:20px}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--card);border-radius:16px;padding:26px}
.alt .card{background:#fff}
.card h3{margin:14px 0 6px;color:var(--navy);font-size:20px}.card p{margin:0;color:var(--text)}
.ic{width:26px;height:26px}
.badge{width:52px;height:52px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center}
.badge.navy{background:var(--navy)}.badge.green{background:#2E9E6A}
.steps{counter-reset:s}.step{text-align:center;position:relative}
.step .badge{margin:0 auto 12px;width:72px;height:72px}.step .ic{width:32px;height:32px}
.step h3{margin:0;color:var(--navy)}.step p{color:var(--muted);margin:6px 0 0}
.svc{display:flex;flex-direction:column;gap:4px}
.svc ul{margin:10px 0 0;padding:0 18px 0 0}.svc li{margin:4px 0}
.tag{display:inline-block;background:var(--tl);color:var(--teal2);font-weight:700;font-size:13px;padding:2px 10px;border-radius:999px}
.cta{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;border-radius:22px;padding:44px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta h2{color:#fff}.cta p{color:#C9D3E0;margin:0}
.work img{border-radius:14px;box-shadow:0 8px 24px rgba(27,42,73,.12);aspect-ratio:4/3;object-fit:cover;width:100%}
.work h3{margin:14px 0 4px;color:var(--navy);font-size:18px}.work a.dl{font-weight:700}
.pagehead{background:var(--navy);color:#fff;padding:48px 0 40px}.pagehead h1{font-size:40px;margin:0 0 6px}.pagehead p{color:#C9D3E0;margin:0;font-size:18px}
.tools{display:flex;gap:12px;flex-wrap:wrap;align-items:center;background:#fff;border:1px solid var(--g2);border-radius:14px;padding:14px;margin:-26px 0 22px;position:relative;z-index:2;box-shadow:0 8px 24px rgba(27,42,73,.08)}
.tools input,.tools select{font-family:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--g2);border-radius:10px;background:#fff;color:var(--text);min-width:160px}
.tools input[type=search]{flex:1;min-width:220px}
.count{color:var(--muted);margin:0 0 14px}
.plist{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.pcard{background:var(--card);border-radius:14px;padding:18px;cursor:pointer;border:1px solid transparent;display:flex;flex-direction:column;gap:8px;transition:.15s}
.pcard:hover{border-color:var(--teal);background:#fff;box-shadow:0 8px 22px rgba(27,42,73,.08)}
.pcard h3{margin:0;font-size:17px;color:var(--navy);line-height:1.5}.pcard .meta{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:14px;margin-top:auto}
.pcard .cost{color:var(--navy);font-weight:800}
.more{display:block;margin:22px auto 0}
dialog{border:0;border-radius:18px;padding:0;max-width:820px;width:calc(100% - 24px);box-shadow:0 30px 80px rgba(0,0,0,.35)}
dialog::backdrop{background:rgba(27,42,73,.55)}
.dh{background:var(--navy);color:#fff;padding:22px 26px;position:relative}.dh h2{color:#fff;margin:4px 0 0;font-size:24px}
.dh .x{position:absolute;left:16px;top:14px;background:rgba(255,255,255,.12);border:0;color:#fff;width:36px;height:36px;border-radius:50%;font-size:20px;cursor:pointer}
.db{padding:22px 26px}.db h4{margin:18px 0 6px;color:var(--teal2)}.db ul{margin:0;padding:0 18px 0 0}
.kv{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.kv div{background:var(--gray);border-radius:10px;padding:10px 12px}.kv small{color:var(--muted);display:block}
table{width:100%;border-collapse:collapse}td,th{padding:9px 10px;border-bottom:1px solid var(--g2);text-align:right}
th{background:var(--navy);color:#fff;font-weight:700}
.budget td:last-child{text-align:left;font-variant-numeric:tabular-nums}.budget tr.tot td{background:var(--navy);color:#fff;font-weight:800}
.lv{display:inline-block;padding:1px 10px;border-radius:999px;font-size:13px;font-weight:700}
.lv.o{background:var(--tl);color:var(--teal2)}.lv.p{background:var(--gray);color:var(--navy)}.lv.r{background:#D9E6F5;color:var(--navy2)}
.gtable{background:#fff;border-radius:14px;overflow:hidden;border:1px solid var(--g2)}
.gtable td{font-size:14.5px;vertical-align:top}.gtable tr:hover td{background:#FAFCFD}
.gtable input{width:18px;height:18px;accent-color:var(--teal)}
.notice{background:var(--warnb);color:#5a4300;border-radius:12px;padding:12px 16px;margin:18px 0}
.empty{background:var(--gray);border-radius:16px;padding:40px;text-align:center;color:var(--muted)}
.foot{background:var(--navy);color:#C9D3E0;padding:36px 0;margin-top:40px}
.foot .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.foot b{color:#fff}.foot p{margin:4px 0}.muted{color:#8C9BB0;font-size:14px}
@media print{.top,.foot,.pagehead,main>section{display:none!important}dialog{position:static;display:block;box-shadow:none;max-width:none;width:100%}dialog::backdrop{display:none}.dh .x,.db .btn{display:none}}
@media (max-width:900px){
 .hero .wrap{grid-template-columns:1fr}.hero-art{display:none}h1{font-size:38px}
 .stats,.g4{grid-template-columns:repeat(2,1fr)}.g3,.g2{grid-template-columns:1fr}
 .menu{display:block}nav{display:none;position:absolute;top:70px;right:0;left:0;background:var(--navy);flex-direction:column;padding:10px 16px 16px}
 body.open nav{display:flex}.kv{grid-template-columns:repeat(2,1fr)}th{position:static}
 .gtable{overflow-x:auto}.gtable table{min-width:760px}
}