.signature-quote{ position:relative; margin:6px auto 12px; max-width:960px; padding:40px 28px 34px; border-radius:20px; text-align:center; overflow:hidden; background: radial-gradient(circle at 20% 20%, rgba(14,165,233,.16), transparent 40%), radial-gradient(circle at 82% 82%, rgba(249,115,22,.12), transparent 42%), linear-gradient(140deg, rgba(2,6,23,.72), rgba(8,47,73,.5)); border:1px solid rgba(125,211,252,.32); box-shadow:0 22px 60px rgba(0,0,0,.35), 0 0 34px rgba(14,165,233,.18), inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter:blur(14px); animation:sigGlow 4.2s ease-in-out infinite; }
@keyframes sigGlow{ 0%,100%{ box-shadow:0 22px 60px rgba(0,0,0,.35), 0 0 26px rgba(14,165,233,.14), inset 0 1px 0 rgba(255,255,255,.06); border-color:rgba(125,211,252,.28); } 50%{ box-shadow:0 22px 60px rgba(0,0,0,.35), 0 0 52px rgba(14,165,233,.34), inset 0 1px 0 rgba(255,255,255,.08); border-color:rgba(125,211,252,.55); } }
.signature-quote::after{ content:'”'; position:absolute; top:2px; inset-inline-end:26px; font-family:'Noto Kufi Arabic',serif; font-size:5rem; line-height:1; color:rgba(125,211,252,.16); pointer-events:none; }
.sig-inner{ position:relative; z-index:2; display:grid; justify-items:center; gap:14px; }
.sig-fp{ width:44px; height:44px; color:#fed7aa; filter:drop-shadow(0 0 14px rgba(249,115,22,.45)); animation:sigPulse 3.2s ease-in-out infinite; }
@keyframes sigPulse{ 0%,100%{transform:translateY(0); opacity:.9} 50%{transform:translateY(-5px); opacity:1} }
.sig-line{ margin:0; font-family:'Noto Kufi Arabic','IBM Plex Sans Arabic',sans-serif; font-weight:800; font-size:clamp(1.9rem,4.8vw,3.2rem); line-height:1.4; letter-spacing:.5px; background:linear-gradient(180deg,#eaf6ff,#7dd3fc 55%,#fb923c); -webkit-background-clip:text; background-clip:text; color:transparent; }
html[dir='ltr'] .sig-line{ font-family:'Space Grotesk','Inter',sans-serif; font-style:italic; letter-spacing:.3px; }
.sig-stroke{ width:min(430px,80%); height:34px; overflow:visible; }
.sig-stroke path{ fill:none; stroke:url(#sigGrad); stroke-width:4; stroke-linecap:round; filter:drop-shadow(0 0 8px rgba(125,211,252,.5)); stroke-dasharray:920; stroke-dashoffset:920; animation:sigDraw 2.8s ease-in-out .35s forwards; }
@keyframes sigDraw{ to{ stroke-dashoffset:0; } }
.mission-quote{ position:relative; max-width:900px; margin:14px auto 6px; padding:44px 26px 40px; text-align:center; }
.mission-quote::before{ content:'“'; position:absolute; top:0; inset-inline-start:7%; font-family:'Noto Kufi Arabic',serif; font-size:4.6rem; line-height:1; color:rgba(251,146,60,.18); pointer-events:none; }
.mq-inner{ position:relative; z-index:2; display:grid; justify-items:center; gap:20px; }
.mq-line{ margin:0; max-width:820px; font-family:'Noto Kufi Arabic','IBM Plex Sans Arabic',sans-serif; font-weight:700; font-size:clamp(1.25rem,2.9vw,2.05rem); line-height:1.75; letter-spacing:.3px; background:linear-gradient(90deg,#7dd3fc,#eaf6ff,#fb923c,#7dd3fc); background-size:260% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:mqShimmer 7s linear infinite; }
html[dir='ltr'] .mq-line{ font-family:'Space Grotesk','Inter',sans-serif; font-style:italic; }
@keyframes mqShimmer{ 0%{background-position:0% 50%} 100%{background-position:260% 50%} }
.mq-bar{ width:0; height:3px; border-radius:4px; background:linear-gradient(90deg,transparent,#0ea5e9,#fb923c,transparent); box-shadow:0 0 14px rgba(14,165,233,.5); animation:mqBar 2.6s cubic-bezier(.2,.8,.2,1) .3s forwards; }
@keyframes mqBar{ to{ width:min(280px,64%); } }
.svc-visual{ position:relative; width:100%; height:180px; border-radius:16px; margin-bottom:20px; display:grid; place-items:center; overflow:hidden; background:radial-gradient(circle at 50% 42%, rgba(14,165,233,.2), transparent 60%), linear-gradient(160deg, rgba(2,6,23,.5), rgba(8,47,73,.34)); border:1px solid rgba(125,211,252,.2); }
.svc-visual .sv-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
.svc-visual::after{ content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(160deg, rgba(2,6,23,.5), rgba(8,47,73,.34)); pointer-events:none; }
.svc-visual .sv-ring{ position:absolute; width:74px; height:74px; border-radius:50%; border:2px solid rgba(125,211,252,.4); animation:svRing 2.8s ease-out infinite; z-index:2; }
.svc-visual .sv-ring.r2{ animation-delay:1.4s; }
@keyframes svRing{ 0%{ transform:scale(.55); opacity:.85; } 100%{ transform:scale(2.5); opacity:0; } }
.svc-visual .sv-scan{ position:absolute; top:0; left:-60%; width:55%; height:100%; background:linear-gradient(90deg, transparent, rgba(125,211,252,.22), transparent); animation:svScan 3.8s linear infinite; z-index:2; }
@keyframes svScan{ 0%{ left:-60%; } 100%{ left:120%; } }
.svc-visual .sv-ico{ position:relative; z-index:2; width:64px; height:64px; color:#eaf6ff; filter:drop-shadow(0 0 12px rgba(14,165,233,.55)); }
.sv-build .sv-ico{ animation:svFloat 3.4s ease-in-out infinite; }
.sv-cool .sv-ico{ animation:svSpin 5.5s linear infinite; transform-origin:50% 50%; }
.sv-secure .sv-ico{ animation:svBeat 2.6s ease-in-out infinite; }
.sv-solar{ background:radial-gradient(circle at 50% 42%, rgba(249,115,22,.24), transparent 60%), linear-gradient(160deg, rgba(2,6,23,.5), rgba(8,47,73,.34)); }
.sv-solar .sv-ring{ border-color:rgba(251,146,60,.5); }
.sv-solar .sv-ico{ color:#fed7aa; animation:svSpin 16s linear infinite; filter:drop-shadow(0 0 12px rgba(249,115,22,.6)); }
@keyframes svFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-9px); } }
@keyframes svSpin{ to{ transform:rotate(360deg); } }
@keyframes svBeat{ 0%,100%{ transform:scale(1); opacity:.92; } 50%{ transform:scale(1.14); opacity:1; } }
.services-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (max-width:920px){ .services-grid{ grid-template-columns:1fr; } }
.leadership-section{ position:relative; overflow:hidden; }
.leader-wrap{ position:relative; width:100%; margin:0 auto; display:flex; align-items:flex-start; justify-content:flex-start; }
.leader-photo{ position:relative; z-index:2; flex:0 0 auto; width:min(300px,40%); height:min(400px,58vw); margin-top:-26px; }
.leader-photo img{ width:100%; height:100%; object-fit:cover; object-position:center top; display:block; filter:drop-shadow(0 20px 30px rgba(6,40,28,.3)); -webkit-mask:linear-gradient(180deg,#000 76%, transparent); mask:linear-gradient(180deg,#000 76%, transparent); }
.leader-card{ position:relative; z-index:1; flex:1 1 auto; width:auto; min-width:0; margin-inline-start:-165px; margin-top:58px; padding:48px 44px 44px; padding-inline-start:198px; border-radius:34px; color:#eafff6; background:linear-gradient(155deg,#14614a,#0a3f2d 72%); filter:drop-shadow(0 26px 52px rgba(6,40,28,.42)); -webkit-mask:radial-gradient(circle 120px at 100% 0, transparent 118px, #000 119px); mask:radial-gradient(circle 120px at 100% 0, transparent 118px, #000 119px); }
html[dir='ltr'] .leader-card{ -webkit-mask:radial-gradient(circle 120px at 0 0, transparent 118px, #000 119px); mask:radial-gradient(circle 120px at 0 0, transparent 118px, #000 119px); }
.leader-card::before{ content:'“'; position:absolute; top:16px; inset-inline-start:200px; font-family:'Noto Kufi Arabic',serif; font-size:4.4rem; line-height:1; color:rgba(255,255,255,.14); pointer-events:none; }
.leader-quote{ position:relative; z-index:2; margin:18px 0 30px; font-family:'Noto Naskh Arabic',serif; font-style:italic; font-size:clamp(1.12rem,1.9vw,1.5rem); line-height:1.85; color:#f2fff9; }
html[dir='ltr'] .leader-quote{ font-family:'Space Grotesk','Inter',serif; }
.leader-meta{ position:relative; z-index:2; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.leader-name{ font-style:italic; }
.leader-role{ display:block; color:#a7f3d0; font-family:'Noto Naskh Arabic',serif; font-size:.98rem; margin-bottom:4px; }
.leader-name strong{ display:block; font-family:'Noto Naskh Arabic',serif; font-weight:700; font-size:1.16rem; color:#fff; line-height:1.5; }
html[dir='ltr'] .leader-role, html[dir='ltr'] .leader-name strong{ font-family:'Space Grotesk','Inter',serif; }
.leader-btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 22px; border-radius:999px; background:#fff; color:#0a3f2d; font-weight:700; font-size:.95rem; box-shadow:0 12px 26px rgba(0,0,0,.2); transition:transform .2s ease, box-shadow .2s ease; }
.leader-btn:hover{ transform:translateY(-2px); box-shadow:0 16px 34px rgba(0,0,0,.26); }
.leader-btn .icon{ width:16px; height:16px; }
.footer .dev-by{ display:inline-flex; align-items:center; gap:9px; text-decoration:none; color:inherit; opacity:.88; transition:opacity .2s ease; }
.footer .dev-by:hover{ opacity:1; }
.footer .dev-by img{ height:22px; width:auto; display:block; }
@media (prefers-reduced-motion: reduce){ .svc-visual .sv-ring, .svc-visual .sv-scan, .svc-visual .sv-ico{ animation:none; } }
@media (max-width:820px){ .leader-wrap{ flex-direction:column; align-items:center; } .leader-photo{ width:min(240px,60%); height:min(310px,74vw); margin-top:0; } .leader-card{ flex:0 0 auto; width:100%; margin-inline-start:0; margin-top:-70px; padding:96px 30px 34px; padding-inline-start:30px; -webkit-mask:radial-gradient(circle 110px at 50% 0, transparent 108px, #000 109px); mask:radial-gradient(circle 110px at 50% 0, transparent 108px, #000 109px); } html[dir='ltr'] .leader-card{ -webkit-mask:radial-gradient(circle 110px at 50% 0, transparent 108px, #000 109px); mask:radial-gradient(circle 110px at 50% 0, transparent 108px, #000 109px); } .leader-card::before{ top:14px; inset-inline-start:28px; } }
@media (max-width:560px){ .signature-quote{ padding:30px 16px 26px; } .signature-quote::after{ font-size:3.6rem; } .mission-quote{ padding:34px 14px 30px; } .svc-visual{ height:150px; } .leader-photo{ width:min(200px,56%); height:min(260px,70vw); } .leader-card{ margin-top:-56px; padding:82px 22px 30px; padding-inline-start:22px; -webkit-mask:radial-gradient(circle 92px at 50% 0, transparent 90px, #000 91px); mask:radial-gradient(circle 92px at 50% 0, transparent 90px, #000 91px); } html[dir='ltr'] .leader-card{ -webkit-mask:radial-gradient(circle 92px at 50% 0, transparent 90px, #000 91px); mask:radial-gradient(circle 92px at 50% 0, transparent 90px, #000 91px); } .leader-meta{ gap:12px; } }

/* ===== v2: homepage nav single-line + bigger white brand logo ===== */
.site-nav .nav-links{ flex-wrap:nowrap; }
.site-nav .nav-links > a,
.site-nav .nav-links .drop-toggle{ white-space:nowrap; font-size:clamp(.72rem,.92vw,.96rem); }
.site-nav .brand img{ height:96px; width:auto; filter:brightness(0) invert(1); }
@media (max-width:1180px){ .site-nav .brand strong{ display:none; } .site-nav .nav-links > a, .site-nav .nav-links .drop-toggle{ font-size:clamp(.66rem,.82vw,.9rem); } }
@media (max-width:640px){ .site-nav .brand img{ height:66px; } }