/* Grim Automatisme — shared stylesheet */
:root{--red:#e11b22;--darkred:#a80f16;--blue:#1a56db;--darkblue:#123a9e;--ink:#161b28;--muted:#5c6474;--bg:#f5f7fb;--card:#fff;}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter','Tajawal',sans-serif;background:var(--bg);color:var(--ink)}
a{text-decoration:none}
img{max-width:100%}
.wrap{max-width:1120px;margin:auto;padding:0 20px}
/* header */
header{background:var(--card);box-shadow:0 2px 16px rgba(20,30,60,.08);position:sticky;top:0;z-index:50}
.nav{display:flex;justify-content:space-between;align-items:center;height:76px;gap:16px}
.logo img{height:50px;display:block}
.logo{display:flex;align-items:center}
.logo .name{font-family:'Tajawal';font-weight:900;font-size:18px;margin-left:12px;line-height:1}
.logo .name small{display:block;font-weight:400;font-size:11px;color:var(--muted);letter-spacing:1px;text-transform:uppercase}
.navmenu{display:flex;gap:22px;font-size:14px;font-weight:600;align-items:center}
.navmenu a{color:var(--ink);transition:.2s}
.navmenu a:hover,.navmenu a.act{color:var(--blue)}
.btn{background:linear-gradient(90deg,var(--red),var(--darkred));color:#fff;padding:11px 20px;border-radius:8px;font-weight:700;box-shadow:0 6px 16px rgba(225,27,34,.3);display:inline-block}
.btn.blue{background:linear-gradient(90deg,var(--blue),var(--darkblue))}
.btn.ghost{background:#fff;color:var(--red);box-shadow:none;border:2px solid var(--red)}
/* hero */
.hero{position:relative;color:#fff;overflow:hidden}
.hero .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.32)}
.hero .ovl{position:absolute;inset:0;background:linear-gradient(100deg,rgba(18,58,158,.85),rgba(168,15,22,.55) 60%,rgba(225,27,34,.35))}
.hero .inner{position:relative;padding:100px 0;max-width:640px}
.hero .pill{display:inline-block;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);padding:7px 16px;border-radius:30px;font-size:13px;letter-spacing:.5px}
.hero h1{font-family:'Tajawal';font-size:42px;line-height:1.12;margin:16px 0;font-weight:900}
.hero h1 b{color:#ff5a5e}
.hero p{font-size:17px;color:#eef1fb;line-height:1.65;max-width:560px}
.hero .ct{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap}
.hero .phones{margin-top:24px;display:flex;gap:20px;flex-wrap:wrap;font-weight:700}
.hero .phones span{background:rgba(0,0,0,.25);padding:9px 14px;border-radius:8px}
.hero .phones .ph{color:#5bf0c4}
/* page header for subpages */
.pagehead{background:linear-gradient(120deg,var(--darkblue),var(--darkred));color:#fff;padding:52px 0}
.pagehead h1{font-family:'Tajawal';font-size:34px;font-weight:900}
.pagehead p{color:#dfe5fb;margin-top:6px}
/* sections */
.sec{padding:58px 0}
.h2{font-family:'Tajawal';font-weight:900;font-size:29px;margin-bottom:10px}
.h2 span{color:var(--red)}
.sub{color:var(--muted);margin-bottom:30px;max-width:660px;line-height:1.6}
/* services grid */
.svgs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svg{background:var(--card);border:1px solid #e8edf6;border-radius:16px;padding:28px;transition:.2s;border-top:4px solid var(--blue)}
.svg:nth-child(2){border-top-color:var(--red)}
.svg:nth-child(3){border-top-color:var(--darkblue)}
.svg .i{font-size:34px}
.svg h3{font-family:'Tajawal';font-size:18px;margin:13px 0 8px;font-weight:900}
.svg p{color:var(--muted);font-size:14px;line-height:1.6}
.svg:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(20,30,60,.1)}
/* gallery */
.gal{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.gal .g{position:relative;border-radius:14px;overflow:hidden;border:1px solid #e4eaf4}
.gal img{width:100%;height:230px;object-fit:cover;display:block}
.gal h4{position:absolute;left:0;bottom:0;right:0;padding:32px 16px 14px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.8));font-family:'Tajawal';font-weight:700}
/* branches */
.br{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.brc{background:var(--card);border:1px solid #e8edf6;border-radius:14px;padding:22px;display:flex;gap:16px;align-items:center}
.brc .pin{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,var(--blue),var(--red));display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;flex-shrink:0}
.brc h4{font-family:'Tajawal';font-size:17px;font-weight:900}
.brc .ad{color:var(--muted);font-size:13px;margin:3px 0}
.brc .tel{color:var(--red);font-weight:800;font-size:15px}
/* contact */
.contactwrap{display:grid;grid-template-columns:1.2fr 1fr;gap:24px}
.cform{background:var(--card);border:1px solid #e8edf6;border-radius:16px;padding:26px}
.cform label{font-size:13px;font-weight:700;display:block;margin:12px 0 6px}
.cform input,.cform textarea,.cform select{width:100%;padding:12px;border:1px solid #d8e0ee;border-radius:8px;font-family:inherit;font-size:14px}
.cform textarea{min-height:110px;resize:vertical}
.cform .btn{margin-top:16px;border:none;cursor:pointer;font-size:15px}
.cinfo{display:flex;flex-direction:column;gap:16px}
.cinfo .cin{background:var(--card);border:1px solid #e8edf6;border-radius:12px;padding:18px;display:flex;gap:14px;align-items:center}
.cinfo .ic{width:44px;height:44px;border-radius:10px;background:#eef2ff;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.cinfo .tl{font-weight:800;font-size:15px}
.cinfo .sub{color:var(--muted);font-size:13px}
.wapp{display:inline-block;background:#25d366;color:#fff;padding:13px 22px;border-radius:10px;font-weight:700}
/* footer */
footer{background:#0d0f14;color:#8b93a6;padding:34px 0;margin-top:40px}
.fin{display:flex;justify-content:space-between;flex-wrap:wrap;gap:18px;font-size:13px;line-height:1.8}
.fin b{color:#dfe5fb;font-size:14px}
.fin a{color:#8b93a6;display:block}
.fin a:hover{color:#fff}
.cr{text-align:center;margin-top:22px;font-size:12px;color:#5a6272}
@media(max-width:780px){.svgs,.gal,.br,.contactwrap{grid-template-columns:1fr}.navmenu{display:none}.hero h1{font-size:30px}.hero .inner{padding:76px 0}}