*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Cairo,sans-serif;background:#06100c;color:#f5f7f4;overflow-x:hidden;--gold:#e2b94e;--gold2:#f4d57d;--green:#123328;--panel:#0c1c16;--muted:#899891;--line:rgba(255,255,255,.08);transition:.45s}body.light{background:#f1f6f3;color:#12231d;--panel:#fff;--muted:#62726a;--line:rgba(10,35,26,.11)}a{text-decoration:none}.topbar{position:fixed;z-index:1500;top:0;left:0;right:0;height:76px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;background:rgba(5,14,10,.48);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}body.light .topbar{background:rgba(241,246,243,.78)}.brand{display:flex;align-items:center;gap:10px;color:inherit}.brand-icon{width:43px;height:43px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#1b4033,#0a1712);border:1px solid #e2b94e55;color:var(--gold2);font-size:20px;box-shadow:0 8px 30px #0004}.brand b,.brand small{display:block}.brand b{font-size:13px}.brand small{font-size:8px;color:var(--muted);margin-top:2px}.top-actions{display:flex;gap:7px}.tool-btn,.lang-switch,.menu-btn{height:41px;min-width:41px;border-radius:12px;border:1px solid var(--line);background:#0b1c16cc;color:#fff;cursor:pointer;display:grid;place-items:center;transition:.3s}.lang-switch{font:800 10px Cairo;color:var(--gold2);padding:0 13px}.menu-btn{font-size:23px}.tool-btn:hover,.lang-switch:hover,.menu-btn:hover{border-color:#e2b94e66;transform:translateY(-2px)}body.light .tool-btn,body.light .lang-switch,body.light .menu-btn{background:#fff;color:#18342a}.overlay{position:fixed;inset:0;background:#0009;backdrop-filter:blur(5px);z-index:1990;opacity:0;visibility:hidden;transition:.35s}.overlay.open{opacity:1;visibility:visible}.drawer{position:fixed;z-index:2000;top:0;right:0;width:min(410px,92vw);height:100vh;padding:24px;background:linear-gradient(180deg,#0d2119,#06100c);border-left:1px solid #e2b94e22;transform:translateX(105%);transition:.45s cubic-bezier(.22,.61,.36,1);box-shadow:-30px 0 90px #0007;display:flex;flex-direction:column}.drawer.open{transform:none}body.light .drawer{background:linear-gradient(180deg,#fff,#e9f1ed);color:#10231c;border-color:#12332818}.drawer-top{display:flex;justify-content:space-between;align-items:center}.drawer-top>button{background:none;border:0;color:#9eaaa4;font-size:18px}.drawer-banner{margin:30px 0 18px;padding:17px;border:1px solid #e2b94e22;background:#11291fcc;border-radius:17px;display:flex;gap:12px;align-items:center}.banner-icon{width:48px;height:48px;border-radius:14px;background:var(--gold);color:#171309;display:grid;place-items:center;font-size:22px}.drawer-banner b,.drawer-banner small{display:block}.drawer-banner b{font-size:11px}.drawer-banner small{font-size:8px;color:#71817a;margin-top:4px}.drawer-nav{display:grid;gap:6px}.drawer-nav a{padding:14px 12px;border:1px solid transparent;border-radius:13px;color:#9daaa4;display:flex;align-items:center;gap:13px;transition:.3s}.drawer-nav a i{width:23px;color:#71827a}.drawer-nav a span{font-size:11px;font-weight:700;flex:1}.drawer-nav a em{font-style:normal;font:700 8px Arial;color:#405149}.drawer-nav a:hover,.drawer-nav a.active{background:#122c22;color:#fff;border-color:#e2b94e1c;transform:translateX(-4px)}.drawer-nav a:hover i,.drawer-nav a.active i{color:var(--gold)}body.light .drawer-nav a{color:#5e7068}body.light .drawer-nav a:hover,body.light .drawer-nav a.active{background:#deebe5;color:#14271f}.drawer-bottom{margin-top:auto}.setting{display:flex;justify-content:space-between;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 5px;color:#7e8e86;font-size:10px}.setting button{border:0;background:none;color:var(--gold);font:700 10px Cairo}.drawer-cta{margin-top:13px;padding:14px 17px;border-radius:13px;background:linear-gradient(135deg,var(--gold2),var(--gold));color:#171309;display:flex;justify-content:space-between;font-size:11px;font-weight:900}.hero{min-height:100vh;position:relative;overflow:hidden;background:#07130e}.hero-bg{position:absolute;inset:0;background:radial-gradient(circle at 80% 40%,#174536 0,#0a1d15 32%,#06100c 72%)}.grid-bg{position:absolute;inset:0;opacity:.17;background-image:linear-gradient(#fff1 1px,transparent 1px),linear-gradient(90deg,#fff1 1px,transparent 1px);background-size:65px 65px;mask-image:linear-gradient(to bottom,#000,transparent)}.hero-orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.18}.orb1{width:400px;height:400px;background:#d7a62e;right:15%;top:25%}.orb2{width:320px;height:320px;background:#158263;left:-80px;bottom:-100px}.hero-wrap{position:relative;z-index:2;min-height:calc(100vh - 70px);padding:115px 3% 110px}.hero-copy{padding-right:3%}.eyebrow{display:flex;align-items:center;gap:10px;color:#d2bd7b;font-size:10px;font-weight:800;margin-bottom:18px}.eyebrow span:first-child{width:34px;height:1px;background:var(--gold)}.eyebrow i{color:var(--gold)}h1{font-size:clamp(44px,5.6vw,82px);line-height:1.04;letter-spacing:-2px;font-weight:900;margin:0 0 25px}h1 strong{color:var(--gold2);font-weight:900}body.light h1{color:#10251d}.hero-copy>p{max-width:680px;color:#a8b6af;font-size:15px;line-height:2}.hero-buttons{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0}.gold-btn,.ghost-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 22px;border-radius:11px;font-size:11px;font-weight:800;transition:.3s;border:0}.gold-btn{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#171309;box-shadow:0 15px 35px #e2b94e20}.gold-btn:hover{transform:translateY(-3px);color:#171309;box-shadow:0 20px 45px #e2b94e38}.ghost-btn{color:#e7ece9;border:1px solid #fff2;background:#ffffff06}.ghost-btn:hover{background:#fff;color:#10231c}.hero-pills{display:flex;gap:22px;flex-wrap:wrap;color:#8d9c95;font-size:9px}.hero-pills i{color:var(--gold);margin-left:5px}.hero-scene{height:520px;position:relative;overflow:hidden;border-radius:28px;background:linear-gradient(#0d2920 0 62%,#09100d 62%);border:1px solid #e2b94e24;box-shadow:0 30px 90px #0007}.scene-title{position:absolute;z-index:10;top:17px;left:17px;right:17px;display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:12px;background:#07130ecc;border:1px solid #fff1;font-size:9px;color:#9daaa4}.scene-title i{color:var(--gold)}.scene-title b{margin-right:auto;color:#71e3a0;font:900 8px Arial;letter-spacing:1px}.scene-sky{position:absolute;inset:0 0 38%;overflow:hidden}.sun{position:absolute;right:16%;top:18%;width:85px;height:85px;border-radius:50%;background:#f4d57d15;box-shadow:0 0 80px #f4d57d20}.cloud{position:absolute;width:100px;height:18px;background:#fff1;border-radius:20px;animation:cloud 18s linear infinite}.cloud:after{content:"";position:absolute;width:42px;height:42px;border-radius:50%;background:inherit;left:30px;top:-22px}.c1{top:25%;left:-120px}.c2{top:48%;left:25%;animation-duration:25s}.factory{position:absolute;right:6%;bottom:38%;width:190px;height:150px}.factory-body{position:absolute;bottom:0;right:0;width:175px;height:105px;background:#173d30;border:1px solid #e2b94e33;display:flex;gap:9px;padding:26px 14px}.factory-body i{width:37px;height:31px;background:#e2b94e1c;border:1px solid #e2b94e44}.factory-roof{position:absolute;top:15px;right:0;width:190px;height:24px;background:#c49331;clip-path:polygon(0 100%,8% 0,100% 0,100% 100%)}.chimney{position:absolute;left:25px;top:0;width:25px;height:70px;background:#173127}.smoke{position:absolute;left:15px;top:-15px;width:45px;height:45px;border-radius:50%;background:#aab7b844;filter:blur(7px);animation:smoke 4s infinite}.road{position:absolute;bottom:0;left:0;right:0;height:38%;background:#080e0c;border-top:1px solid #fff1}.road:after{content:"";position:absolute;top:52%;left:0;right:0;height:3px;background:repeating-linear-gradient(90deg,#d8b04d 0 55px,transparent 55px 110px);opacity:.25}.truck{position:absolute;bottom:31%;left:5%;width:300px;height:75px;animation:truck 8s ease-in-out infinite}.tank{position:absolute;right:48px;top:4px;width:200px;height:54px;border-radius:28px;background:linear-gradient(180deg,#f1cf69,#bd8e2d 48%,#8a641e);border:2px solid #f5d87c;display:grid;place-items:center;box-shadow:inset 0 6px 8px #fff4}.tank b{font:900 10px Arial;letter-spacing:3px;color:#171309}.cab{position:absolute;left:0;top:23px;width:78px;height:52px;background:#bd9133;border-radius:9px}.cab span{position:absolute;left:10px;top:7px;width:43px;height:23px;background:#102820;border:1px solid #f5d87c55;border-radius:4px}.wheel{position:absolute;bottom:-10px;width:27px;height:27px;border-radius:50%;background:#050807;border:5px solid #1e2924}.w1{left:17px}.w2{right:63px}.excavator{position:absolute;right:30%;bottom:31%;width:160px;height:120px;animation:bob 2s infinite ease-in-out}.ex-body{position:absolute;bottom:15px;right:0;width:92px;height:52px;background:#c39431;border-radius:9px}.ex-arm{position:absolute;right:68px;top:12px;width:100px;height:12px;background:#d9aa3d;border-radius:9px;transform:rotate(-27deg);transform-origin:right}.ex-bucket{position:absolute;right:140px;top:-2px;width:38px;height:29px;border:7px solid #b88a29;border-top:0;transform:rotate(-25deg)}.excavator i{position:absolute;bottom:0;width:28px;height:28px;border-radius:50%;background:#060908;border:5px solid #1d2823}.excavator i:first-of-type{right:12px}.excavator i:last-of-type{right:72px}.hose{position:absolute;left:37%;bottom:37%;width:115px;height:4px;background:#172b24;transform:rotate(-10deg);transform-origin:left}.hose:after{content:"";position:absolute;right:-2px;top:-5px;width:13px;height:13px;border-radius:50%;background:var(--gold)}.fuel{position:absolute;left:46%;bottom:35%;display:flex;gap:11px;transform:rotate(8deg)}.fuel i{display:block;width:4px;height:22px;border-radius:4px;background:var(--gold);animation:flow .7s infinite}.fuel i:nth-child(2){animation-delay:.15s}.fuel i:nth-child(3){animation-delay:.3s}.fuel i:nth-child(4){animation-delay:.45s}.scene-card{position:absolute;z-index:9;padding:11px 13px;border-radius:13px;background:#091812dd;border:1px solid #e2b94e22;display:flex;align-items:center;gap:8px;font-size:9px;color:#aab5af;backdrop-filter:blur(8px)}.scene-card i{color:var(--gold);font-size:17px}.scene-card b{color:#71e3a0}.card-a{left:17px;top:75px}.card-b{right:17px;bottom:18px}.hero-stats{position:absolute;z-index:8;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,1fr);background:#081710e8;border-top:1px solid #fff1}.hero-stats>div{padding:18px 15px;display:grid;grid-template-columns:36px 1fr;column-gap:9px;border-left:1px solid #fff1}.hero-stats i{grid-row:span 2;color:var(--gold);font-size:20px}.hero-stats b,.hero-stats small{display:block}.hero-stats b{font-size:10px}.hero-stats small{font-size:8px;color:#71817a;margin-top:3px}.section{padding:90px 0}.about{background:#091711}.section-tag{display:flex;align-items:center;gap:10px;color:var(--gold);font:800 10px Cairo;margin-bottom:16px}.section-tag:after{content:"";width:35px;height:1px;background:#e2b94e55}.section-tag span{color:#85958d}.section h2{font-size:clamp(31px,4vw,52px);line-height:1.2;margin:0 0 18px;font-weight:900}.section h2 strong{color:var(--gold2)}.about .big{color:#a2b0a9;line-height:2.1;font-size:14px;max-width:850px}.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px}.about-grid>div{padding:17px;background:#0d2119;border:1px solid var(--line);border-radius:15px}.about-grid i{color:var(--gold);font-size:21px}.about-grid b,.about-grid small{display:block}.about-grid b{font-size:10px;margin-top:12px}.about-grid small{font-size:8px;color:#72827a;margin-top:4px}.about-card{height:100%;min-height:350px;border-radius:25px;background:radial-gradient(circle at center,#173e31,#0b1b15 63%);border:1px solid #e2b94e22;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.about-ring{width:160px;height:160px;border-radius:50%;display:grid;place-items:center;border:1px dashed #e2b94e66;color:var(--gold);font-size:65px;animation:spin 18s linear infinite}.about-card>span{margin-top:25px;font-size:11px;color:#7f8e87}.about-card>strong{font-size:20px;color:var(--gold2)}.mini-road{position:absolute;bottom:35px;left:0;right:0;height:1px;background:#e2b94e44}.mini-truck{position:absolute;bottom:28px;left:25%;font-size:26px;color:#e2b94e;animation:driveMini 5s infinite}.services{background:#06100c}.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:35px}.section-head>p{max-width:450px;color:#819089;font-size:11px;line-height:2}.service{height:100%;min-height:300px;padding:27px;background:linear-gradient(145deg,#10251d,#091711);border:1px solid var(--line);border-radius:19px;position:relative;overflow:hidden;transition:.4s}.service:hover{transform:translateY(-8px);border-color:#e2b94e55;box-shadow:0 25px 55px #0005}.service.hot{background:linear-gradient(145deg,#183b2e,#0b1b15)}.service-icon{height:57px;width:57px;border-radius:15px;background:#17372b;color:var(--gold);display:grid;place-items:center;font-size:24px;position:relative}.service-icon span{position:absolute;top:-9px;left:-8px;font:900 8px Arial;color:#415149}.service h3{font-size:19px;margin:24px 0 10px}.service p{font-size:10px;color:#7f8e87;line-height:2}.service a{color:var(--gold2);font-size:10px;font-weight:800;position:absolute;bottom:25px}.service-extra{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.service-extra>div{padding:15px 18px;border-radius:13px;background:#0c1e17;border:1px solid var(--line);display:flex;align-items:center;gap:12px}.service-extra i{color:var(--gold);font-size:20px}.service-extra b,.service-extra span{display:block}.service-extra b{font-size:9px}.service-extra span{font-size:8px;color:#708078}.sectors{background:#091711}.sector-mosaic{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px}.sector{min-height:235px;padding:24px;background:#0e2119;border:1px solid var(--line);border-radius:18px;display:flex;flex-direction:column;justify-content:end;transition:.35s}.sector:hover{transform:translateY(-6px);border-color:#e2b94e44}.sector i,.sector-art i{font-size:37px;color:var(--gold);margin-bottom:auto}.sector h3{font-size:17px}.sector p{font-size:9px;color:#718078}.sector.big{background:linear-gradient(135deg,#16392c,#0d1f18);position:relative}.sector.big .sector-art{position:absolute;right:30px;top:30px;width:120px;height:120px;border-radius:50%;display:grid;place-items:center;border:1px solid #e2b94e33}.sector small{color:#63746b;font:700 8px Arial}.journey{background:#06100c}.journey>div>h2{margin-bottom:40px}.journey-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.journey-step{padding:26px;background:linear-gradient(145deg,#10241c,#0a1712);border:1px solid var(--line);border-radius:17px;position:relative}.journey-step>b{position:absolute;left:17px;top:14px;color:#304139;font:900 27px Arial}.journey-step i{color:var(--gold);font-size:25px}.journey-step h3{font-size:15px;margin-top:25px}.journey-step p{font-size:9px;color:#74837c;line-height:2}.cta{padding:0 0 90px;background:#06100c}.cta-box{padding:45px 50px;border-radius:25px;background:linear-gradient(110deg,#17392c,#0e2119);border:1px solid #e2b94e2b;display:flex;align-items:center;justify-content:space-between;gap:25px}.cta-box h2{font-size:clamp(25px,3.2vw,42px);margin:0 0 8px}.cta-box p{font-size:10px;color:#7e8d86;margin:0}.contact{background:#091711}.contact>div>div>p{color:#84928c;font-size:11px;line-height:2}.contact-cards{display:grid;gap:10px;margin-top:25px}.contact-cards>div{display:flex;gap:12px;align-items:center;padding:14px;border-radius:13px;background:#0d2119;border:1px solid var(--line)}.contact-cards i{width:40px;height:40px;display:grid;place-items:center;background:#17372b;color:var(--gold);border-radius:11px}.contact-cards small,.contact-cards b{display:block}.contact-cards small{font-size:7px;color:#718078}.contact-cards b{font-size:10px;margin-top:3px}form{background:#0d2119;border:1px solid var(--line);border-radius:20px;padding:28px}form label{display:block;font-size:9px;color:#a7b4ad;margin-bottom:6px}form input,form select,form textarea{width:100%;border:1px solid #fff1;background:#07130e;color:#fff;border-radius:10px;padding:12px;font:10px Cairo;outline:0}form input:focus,form select:focus,form textarea:focus{border-color:#e2b94e66}form option{background:#0b1c16}#formMsg{text-align:center;color:#78d99e;font-size:9px;margin-top:12px}footer{background:#040a07;padding:40px 0 22px}.footer-main{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-links{display:flex;gap:22px}.footer-links a{color:#75837d;font-size:9px}.copyright{border-top:1px solid #fff1;margin-top:30px;padding-top:18px;color:#53625b;font-size:8px}.floating{position:fixed;z-index:1300;left:22px;bottom:22px;background:var(--gold);color:#171309;border-radius:50px;padding:12px 16px;display:flex;align-items:center;gap:8px;font-size:10px;font-weight:900;box-shadow:0 15px 40px #0007}.backtop{display:none;position:fixed;z-index:1300;right:22px;bottom:22px;width:43px;height:43px;border-radius:12px;border:1px solid var(--line);background:#10251c;color:var(--gold);place-items:center}.loader-logo{width:65px;height:65px;border-radius:19px;background:#15372a;border:1px solid #e2b94e66;color:var(--gold);display:grid;place-items:center;position:relative}.loader-logo i{font-size:27px}.loader-logo b{position:absolute;font:900 7px Arial;bottom:7px}.loader-logo~span{width:7px;height:7px;background:var(--gold);border-radius:50%;animation:load .8s infinite alternate}.loader-logo~span:nth-of-type(2){animation-delay:.2s}.loader-logo~span:nth-of-type(3){animation-delay:.4s}#loader{position:fixed;z-index:9999;inset:0;background:#040b07;display:flex;justify-content:center;align-items:center;gap:7px;transition:.5s}#loader.hide{opacity:0;visibility:hidden}body.light .hero-bg{background:radial-gradient(circle at 80% 40%,#d8eae1,#edf4f1 40%,#f4f8f6 75%)}body.light .grid-bg{opacity:.35;background-image:linear-gradient(#17372b10 1px,transparent 1px),linear-gradient(90deg,#17372b10 1px,transparent 1px)}body.light .hero-copy>p{color:#60716a}body.light .hero-stats{background:#ffffffdd;color:#173027;border-color:#17372b18}body.light .hero-stats small{color:#65766e}body.light .section,body.light .about,body.light .services,body.light .sectors,body.light .journey,body.light .contact{background:#f0f5f2}body.light .service,body.light .sector,body.light .journey-step,body.light .about-grid>div,body.light form,body.light .contact-cards>div,body.light .service-extra>div{background:#fff;border-color:#17372b12;box-shadow:0 14px 35px #17372b08}body.light .about .big,body.light .service p,body.light .section-head>p,body.light .journey-step p{color:#62726b}body.light .about-card{background:radial-gradient(circle,#d9eae2,#fff 65%)}body.light .cta{background:#f0f5f2}body.light footer{background:#10231b}
@keyframes truck{0%,100%{transform:translateX(0)}45%,65%{transform:translateX(35px)}}@keyframes bob{50%{transform:translateY(-4px)}}@keyframes flow{0%{height:3px;opacity:.2;transform:translateY(-5px)}50%{opacity:1}100%{height:23px;opacity:.1;transform:translateY(9px)}}@keyframes smoke{0%{opacity:0;transform:scale(.5)}40%{opacity:.4}100%{opacity:0;transform:translate(-15px,-55px) scale(1.7)}}@keyframes cloud{from{transform:translateX(0)}to{transform:translateX(750px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes driveMini{0%,100%{transform:translateX(0)}50%{transform:translateX(170px)}}@keyframes load{to{transform:translateY(-8px);opacity:.35}}
@media(max-width:1199px){.hero-scene{margin-top:25px;height:430px}.hero-copy{padding-right:0}.hero-wrap{padding-top:105px}.sector-mosaic{grid-template-columns:2fr 1fr 1fr}.sector-mosaic .sector:last-child{grid-column:2/4}.journey-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:767px){.topbar{height:65px;padding:0 13px}.brand b{font-size:11px}.brand-icon{width:38px;height:38px}.hero-wrap{padding:95px 15px 95px}.hero-copy{text-align:right}.hero-scene{height:350px;border-radius:20px}.hero-stats{grid-template-columns:repeat(2,1fr)}.hero-stats>div{padding:12px}.hero-stats>div:nth-child(3),.hero-stats>div:nth-child(4){border-top:1px solid #fff1}.hero-stats b{font-size:9px}.hero-stats small{font-size:7px}.factory{transform:scale(.72);transform-origin:right bottom}.truck{transform:scale(.72);transform-origin:left bottom}.excavator{transform:scale(.72);transform-origin:right bottom}.service-extra{grid-template-columns:1fr}.section-head{display:block}.section-head>p{margin-top:15px}.about-grid{grid-template-columns:1fr}.sector-mosaic{grid-template-columns:1fr 1fr}.sector-mosaic .sector.big{grid-column:1/3;min-height:220px}.sector-mosaic .sector:last-child{grid-column:auto}.journey-grid{grid-template-columns:1fr}.cta-box{display:block;padding:32px 25px}.cta-box .gold-btn{margin-top:22px}.footer-main{display:block}.footer-links{margin-top:20px;flex-wrap:wrap}.floating{left:15px;bottom:15px}.backtop{right:15px;bottom:15px}}
@media(max-width:450px){.top-actions{gap:4px}.tool-btn,.lang-switch,.menu-btn{height:37px;min-width:37px}.lang-switch{padding:0 9px}.hero-scene{height:310px}.scene-card{font-size:7px}.scene-card i{font-size:13px}.factory{transform:scale(.55)}.truck{transform:scale(.56);left:0}.excavator{transform:scale(.55);right:24%}.hero-copy>p{font-size:12px}.hero-pills{gap:10px}.hero-buttons .gold-btn,.hero-buttons .ghost-btn{padding:11px 15px}.section{padding:65px 0}.sector-mosaic{grid-template-columns:1fr}.sector-mosaic .sector.big{grid-column:auto}.sector-mosaic .sector:last-child{grid-column:auto}}

/* ===== FINAL NAVBAR / DRAWER REDESIGN ===== */
:root{--nav-h:78px}
.topbar{height:var(--nav-h)!important;padding:0 clamp(14px,3vw,42px)!important;gap:22px!important;background:rgba(5,14,10,.76)!important;border-bottom:1px solid rgba(226,185,78,.12)!important;box-shadow:0 10px 35px rgba(0,0,0,.16)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important}
body.light .topbar{background:rgba(255,255,255,.86)!important;box-shadow:0 8px 30px rgba(20,50,40,.08)!important}
.nav-brand{display:flex!important;align-items:center!important;gap:11px!important;color:inherit!important;text-decoration:none!important;min-width:max-content!important}
.brand-copy b,.brand-copy small{display:block!important}.brand-copy b{font-size:12px!important;font-weight:900!important}.brand-copy small{font-size:7px!important;color:var(--muted)!important;margin-top:3px!important}
.desktop-nav{display:flex!important;align-items:center!important;justify-content:center!important;gap:3px!important;flex:1!important;height:100%!important}
.desktop-nav a{position:relative!important;height:42px!important;padding:0 11px!important;display:flex!important;align-items:center!important;justify-content:center!important;color:#91a099!important;text-decoration:none!important;font-size:9px!important;font-weight:800!important;border-radius:10px!important;transition:.22s ease!important;white-space:nowrap!important}
.desktop-nav a:after{content:""!important;position:absolute!important;bottom:3px!important;left:18%!important;right:18%!important;height:2px!important;border-radius:99px!important;background:var(--gold)!important;transform:scaleX(0)!important;transition:.22s ease!important}
.desktop-nav a:hover,.desktop-nav a.active{color:#fff!important;background:rgba(226,185,78,.07)!important}.desktop-nav a:hover:after,.desktop-nav a.active:after{transform:scaleX(1)!important}
body.light .desktop-nav a{color:#60726a!important}body.light .desktop-nav a:hover,body.light .desktop-nav a.active{color:#14271f!important}
.top-actions{display:flex!important;align-items:center!important;gap:7px!important;flex:0 0 auto!important}
.tool-btn,.lang-switch,.menu-btn{height:40px!important;min-width:40px!important;border-radius:11px!important;background:rgba(13,32,24,.82)!important;border:1px solid rgba(226,185,78,.13)!important}
body.light .tool-btn,body.light .lang-switch,body.light .menu-btn{background:#eef4f1!important;color:#20352d!important;border-color:#cadbd3!important}
.lang-switch{min-width:48px!important;font-size:9px!important}
.menu-btn{font-size:21px!important;box-shadow:0 5px 18px rgba(0,0,0,.14)!important}
.top-actions button:hover{transform:translateY(-1px)!important;background:rgba(226,185,78,.12)!important}
/* Drawer is independent from the navbar and never peeks during first paint */
.overlay{z-index:1990!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:opacity .28s ease,visibility 0s linear .28s!important}
.overlay.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transition:opacity .28s ease,visibility 0s!important}
.drawer{z-index:2000!important;top:0!important;right:0!important;width:min(400px,92vw)!important;height:100dvh!important;padding:20px!important;box-sizing:border-box!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;transform:translate3d(110%,0,0)!important;transition:transform .36s cubic-bezier(.22,.61,.36,1),opacity .22s ease,visibility 0s linear .36s!important;overflow:hidden!important}
.drawer.open{visibility:visible!important;opacity:1!important;pointer-events:auto!important;transform:translate3d(0,0,0)!important;transition:transform .36s cubic-bezier(.22,.61,.36,1),opacity .22s ease,visibility 0s!important}
.drawer-top{flex:0 0 auto!important;padding-bottom:3px!important}.drawer-top .brand{min-width:0!important}.drawer-top>button{width:40px!important;height:40px!important;border:1px solid var(--line)!important;border-radius:11px!important;display:grid!important;place-items:center!important;cursor:pointer!important;background:rgba(255,255,255,.03)!important}
.drawer-banner{flex:0 0 auto!important;margin:18px 0 14px!important}.drawer-nav{flex:1 1 auto!important;overflow-y:auto!important;overflow-x:hidden!important;scrollbar-width:none!important}.drawer-nav::-webkit-scrollbar{display:none!important}.drawer-nav a{transform:none!important}.drawer-nav a:hover,.drawer-nav a.active{transform:none!important}
.drawer-bottom{flex:0 0 auto!important;padding-top:10px!important}
body.drawer-open{overflow:hidden!important}
@media(max-width:1050px){.desktop-nav{gap:0!important}.desktop-nav a{padding:0 7px!important;font-size:8px!important}}
@media(max-width:820px){.desktop-nav{display:none!important}.topbar{height:70px!important;padding:0 14px!important}.brand-copy b{font-size:10px!important}.brand-copy small{font-size:6px!important}.tool-btn,.lang-switch,.menu-btn{height:38px!important;min-width:38px!important}.lang-switch{min-width:44px!important}}
@media(max-width:420px){.brand-icon{width:38px!important;height:38px!important;border-radius:11px!important;font-size:17px!important}.brand-copy{max-width:155px!important}.brand-copy b{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.top-actions{gap:4px!important}.drawer{width:92vw!important;padding:16px!important}}

/* ===== إصلاح الفراغ الجانبي في الجوال ===== */
html,body{max-width:100%;overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
section,footer,.hero{max-width:100%;overflow-x:clip}
.drawer{visibility:hidden;transition:transform .45s cubic-bezier(.22,.61,.36,1),visibility 0s linear .45s}
.drawer.open{visibility:visible;transition:transform .45s cubic-bezier(.22,.61,.36,1),visibility 0s}
