
:root{
  --navy:#13253A;
  --navy-2:#173A4D;
  --blue:#006ED2;
  --cyan:#35BFC6;
  --green:#00967D;
  --lime:#6EBE28;
  --white:#FFFFFF;
  --mist:#F3F8F7;
  --text:#1A3545;
  --muted:#617983;
  --line:#D7E7E3;
  --shadow:0 18px 50px rgba(0,80,70,.14);
  --radius:20px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1180px,92%);margin:auto}
.topbar{background:#04131f;color:#c6d4df;font-size:.86rem;padding:.55rem 0}
.topbar .container{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.navbar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.navwrap{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:1rem}
.brand{display:flex;align-items:center;gap:.8rem;font-weight:800;color:var(--navy);letter-spacing:-.03em}
.brand-mark{width:44px;height:44px;border-radius:13px;background:linear-gradient(135deg,var(--green),var(--lime));display:grid;place-items:center;color:white;font-weight:900;box-shadow:0 10px 25px rgba(15,111,255,.25)}
.brand small{display:block;color:var(--muted);font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;margin-top:-.2rem}
.navlinks{display:flex;gap:.9rem;align-items:center;font-size:.89rem;font-weight:650;white-space:nowrap}
.navlinks a{padding:.4rem .05rem;color:#29445a;white-space:nowrap}
.navlinks a:hover,.navlinks a.active{color:var(--blue)}
.navcta{background:var(--navy);color:white!important;padding:.8rem 1.05rem!important;border-radius:12px}
.menu-btn{display:none;border:0;background:var(--mist);padding:.65rem;border-radius:10px}
.hero{background:
 radial-gradient(circle at 80% 18%,rgba(42,199,222,.20),transparent 28%),
 linear-gradient(135deg,#06252a 0%,#0a4f50 55%,#006ED2 100%);
 color:#fff;padding:96px 0 84px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:3.2rem;align-items:center}
.eyebrow{display:inline-flex;gap:.5rem;align-items:center;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:#85e7ef}
.hero h1,.page-hero h1{font-size:clamp(2.25rem,4.6vw,4.2rem);line-height:1.02;letter-spacing:-.055em;margin:.7rem 0 1.2rem}
.hero p{font-size:1.14rem;color:#d5e6ef;max-width:720px}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.95rem 1.25rem;border-radius:12px;font-weight:800;border:1px solid transparent}
.btn-primary{background:var(--blue);color:white}
.btn-light{background:white;color:var(--navy)}
.btn-outline{border-color:rgba(255,255,255,.35);color:white}
.hero-panel{border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.08);backdrop-filter:blur(12px);padding:1.3rem;border-radius:24px;box-shadow:var(--shadow)}
.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.metric{background:rgba(255,255,255,.09);padding:1.2rem;border-radius:16px}
.metric strong{display:block;font-size:1.8rem}
.metric span{font-size:.82rem;color:#c4dce7}
.trust-strip{padding:1rem 0;border-bottom:1px solid var(--line);background:#fff}
.trust-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.8rem;text-align:center;font-size:.78rem;font-weight:800;color:#667b8d;text-transform:uppercase;letter-spacing:.08em}
section{padding:82px 0}
.section-soft{background:var(--mist)}
.section-dark{background:var(--navy);color:#fff}
.section-head{max-width:760px;margin-bottom:2.3rem}
.section-head.center{text-align:center;margin-left:auto;margin-right:auto}
.kicker{color:var(--blue);font-weight:850;text-transform:uppercase;letter-spacing:.11em;font-size:.8rem}
h2{font-size:clamp(1.75rem,3vw,2.6rem);line-height:1.12;letter-spacing:-.04em;margin:.5rem 0 1rem}
h3{line-height:1.2}
.lead{font-size:1.08rem;color:var(--muted)}
.section-dark .lead{color:#bdd0dd}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:1.55rem;box-shadow:0 10px 30px rgba(5,31,52,.05)}
.card:hover{transform:translateY(-4px);transition:.25s;box-shadow:var(--shadow)}
.icon{width:48px;height:48px;border-radius:13px;background:linear-gradient(135deg,#e5f7f2,#eff9df);display:grid;place-items:center;color:var(--blue);font-size:1.25rem;font-weight:900;margin-bottom:1rem}
.card p{color:var(--muted);font-size:.95rem}
.card ul,.content ul{padding-left:1.1rem}
.card li,.content li{margin:.35rem 0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.visual-panel{min-height:430px;border-radius:28px;background:
 linear-gradient(145deg,rgba(0,150,125,.94),rgba(110,190,40,.82)),
 url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="800" height="600"%3E%3Cg fill="none" stroke="white" stroke-opacity=".15"%3E%3Cpath d="M0 100h800M0 200h800M0 300h800M0 400h800M0 500h800"/%3E%3Cpath d="M100 0v600M200 0v600M300 0v600M400 0v600M500 0v600M600 0v600M700 0v600"/%3E%3C/g%3E%3C/svg%3E');
padding:2rem;color:white;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:var(--shadow)}
.visual-panel h3{font-size:2rem;margin:0}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:.65rem 1.2rem;margin-top:1.4rem}
.check{display:flex;gap:.6rem;align-items:flex-start}
.check:before{content:"✓";color:var(--green);font-weight:900}
.page-hero{background:linear-gradient(135deg,#06252a,#0b4b55);color:white;padding:76px 0}
.page-hero h1{font-size:clamp(2.2rem,4.2vw,3.8rem)}
.breadcrumb{font-size:.85rem;color:#94bacb}
.stat-band{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:-38px}
.stat-box{background:#fff;border:1px solid var(--line);padding:1.4rem;border-radius:16px;box-shadow:var(--shadow)}
.stat-box strong{font-size:1.8rem;color:var(--navy)}
.timeline{border-left:2px solid var(--line);padding-left:1.5rem}
.timeline-item{position:relative;margin-bottom:2rem}
.timeline-item:before{content:"";position:absolute;left:-1.93rem;top:.35rem;width:12px;height:12px;background:var(--blue);border-radius:50%;box-shadow:0 0 0 6px #e8f0ff}
.project{display:grid;grid-template-columns:.85fr 1.15fr;gap:2rem;padding:2rem;border-radius:24px;background:#fff;border:1px solid var(--line);margin-bottom:1.2rem}
.project-tag{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--blue);font-weight:850}
.project-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin-top:1rem}
.project-metrics div{background:var(--mist);padding:.8rem;border-radius:12px}
.project-metrics strong{display:block}
.quote{font-size:1.08rem;font-style:italic}
.person{display:flex;gap:.8rem;align-items:center;margin-top:1rem}
.avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--lime));display:grid;place-items:center;color:#fff;font-weight:900}
.team-card .avatar{width:72px;height:72px;border-radius:18px}
.partner-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.partner{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1.2rem;text-align:center;font-weight:850;color:#40596e}
.notice{background:#fff7df;border:1px solid #f0d483;border-radius:14px;padding:1rem 1.2rem;color:#654e13}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:2rem}
form{display:grid;gap:.9rem}
input,textarea,select{width:100%;padding:1rem;border:1px solid var(--line);border-radius:12px;font:inherit}
textarea{min-height:150px}
.map{border:0;width:100%;min-height:430px;border-radius:20px}
footer{background:#04131f;color:#c7d6df;padding:60px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:2rem}
footer h4{color:#fff}
footer a{display:block;color:#c7d6df;margin:.45rem 0}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:2rem;padding-top:1.2rem;font-size:.85rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.badge{display:inline-block;padding:.28rem .55rem;border-radius:999px;background:#e8f0ff;color:var(--blue);font-size:.75rem;font-weight:800}
@media(max-width:980px){
 .navlinks{display:none;position:absolute;top:76px;left:0;right:0;background:white;padding:1rem 4%;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}
 .navlinks.open{display:flex}.menu-btn{display:block}
 .hero-grid,.split,.project,.contact-grid{grid-template-columns:1fr}
 .grid-4{grid-template-columns:repeat(2,1fr)}
 .partner-grid{grid-template-columns:repeat(3,1fr)}
 .trust-grid{grid-template-columns:repeat(3,1fr)}
 .stat-band{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
 section{padding:62px 0}
 .grid-3,.grid-4,.footer-grid,.project-metrics{grid-template-columns:1fr}
 .hero{padding:72px 0}
 .metric-grid,.checks{grid-template-columns:1fr}
 .partner-grid,.trust-grid{grid-template-columns:repeat(2,1fr)}
 .stat-band{margin-top:1rem;grid-template-columns:1fr}
}

.card h3{font-size:1.18rem;margin:.45rem 0 .65rem}

.project h2{font-size:1.65rem;line-height:1.2;margin:.45rem 0 .8rem}

.team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;align-items:stretch}
.team-grid .team-card{height:100%;display:flex;flex-direction:column;justify-content:flex-start}
.team-grid .team-card p{margin-top:auto}
.about-stat-band .stat-box{display:flex;flex-direction:column;justify-content:center;min-height:120px}
.about-stat-band .stat-box strong{display:block;margin-bottom:.25rem}
@media(max-width:980px){.team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.team-grid{grid-template-columns:1fr}}

.metric:nth-child(1){border-top:3px solid var(--green)}
.metric:nth-child(2){border-top:3px solid var(--lime)}
.metric:nth-child(3){border-top:3px solid var(--blue)}
.metric:nth-child(4){border-top:3px solid var(--cyan)}
.card{position:relative;overflow:hidden}
.card:before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:linear-gradient(90deg,var(--green),var(--lime),var(--blue));opacity:.9}
.project{border-left:5px solid var(--green)}
.partner:nth-child(3n+1){border-top:3px solid var(--green)}
.partner:nth-child(3n+2){border-top:3px solid var(--lime)}
.partner:nth-child(3n+3){border-top:3px solid var(--blue)}
.btn-primary{background:linear-gradient(135deg,var(--green),var(--blue))}
.kicker{color:var(--green)}
.badge{background:#e7f7f2;color:var(--green)}

.brand-logo{display:flex;align-items:center;padding:.25rem 0}
.brand-logo img{width:190px;height:58px;object-fit:contain;object-position:left center}
.footer-logo{display:inline-flex;padding:.25rem 0}
.footer-logo img{width:205px;height:64px}
.hero{
  background:
    radial-gradient(circle at 84% 16%,rgba(110,190,40,.22),transparent 24%),
    radial-gradient(circle at 72% 78%,rgba(0,110,210,.18),transparent 30%),
    linear-gradient(135deg,#082D35 0%,#075E5B 52%,#006ED2 100%);
}
.page-hero{
  background:
    radial-gradient(circle at 85% 25%,rgba(110,190,40,.18),transparent 25%),
    linear-gradient(135deg,#0A3039,#087064 62%,#006ED2);
}
.btn-primary{background:linear-gradient(135deg,var(--green),var(--blue));box-shadow:0 10px 22px rgba(0,110,210,.18)}
.btn-primary:hover{filter:brightness(1.04)}
.kicker{color:var(--green)}
.card:before{background:linear-gradient(90deg,var(--green),var(--lime),var(--blue))}
.metric:nth-child(1){border-top-color:var(--green)}
.metric:nth-child(2){border-top-color:var(--blue)}
.metric:nth-child(3){border-top-color:var(--lime)}
.metric:nth-child(4){border-top-color:var(--cyan)}
.icon{background:linear-gradient(135deg,#E4F7F1,#EFF8DD);color:var(--green)}
.badge{background:#E5F7F2;color:#007B68}
.project{border-left-color:var(--green)}
.stat-box:nth-child(1){border-top:4px solid var(--green)}
.stat-box:nth-child(2){border-top:4px solid var(--lime)}
.stat-box:nth-child(3){border-top:4px solid var(--blue)}
.stat-box:nth-child(4){border-top:4px solid var(--cyan)}
@media(max-width:640px){
  .brand-logo img{width:150px;height:48px}
  .footer-logo img{width:175px;height:54px}
}

.brand-mark{display:none}
.team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Team portraits */
.team-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.25rem;
  align-items:stretch;
}
.team-grid .team-card{
  min-height:320px;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  justify-content:flex-start;
  padding:1.45rem;
}
.team-photo-wrap{
  width:150px;
  height:150px;
  border-radius:50%;
  overflow:hidden;
  margin:0 auto 1rem;
  border:4px solid #fff;
  outline:2px solid var(--green);
  box-shadow:0 10px 28px rgba(0,80,70,.18);
  background:linear-gradient(135deg,var(--green),var(--blue));
  flex:0 0 auto;
}
.team-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.team-photo-placeholder{
  display:grid;
  place-items:center;
  color:#fff;
  font-size:2rem;
  font-weight:900;
}
.team-card h3{
  margin:.35rem 0 .4rem;
}
.team-card p{
  margin:.2rem 0 0;
  min-height:3.2em;
}
@media(max-width:980px){
  .team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .team-grid{grid-template-columns:1fr}
  .team-photo-wrap{width:135px;height:135px}
}

/* Team image display fix */

.team-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:1.25rem;align-items:stretch}
.team-grid .team-card{min-height:320px;height:100%;display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.45rem}
.team-photo-wrap{width:150px;height:150px;border-radius:50%;overflow:hidden;margin:0 auto 1rem;border:4px solid #fff;outline:2px solid var(--green);box-shadow:0 10px 28px rgba(0,80,70,.18);background:linear-gradient(135deg,var(--green),var(--blue));flex:0 0 auto}
.team-photo{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;display:block!important}
.team-photo-placeholder{display:grid;place-items:center;color:#fff;font-size:2rem;font-weight:900}
.team-card h3{margin:.35rem 0 .4rem}
.team-card p{margin:.2rem 0 0;min-height:3.2em}
@media(max-width:980px){.team-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:640px){.team-grid{grid-template-columns:1fr!important}.team-photo-wrap{width:135px;height:135px}}

/* Global office contact details */
.office-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.25rem}
.office-card{height:100%}
.office-card h3{margin-bottom:.45rem}
.office-card address{font-style:normal;color:var(--muted);line-height:1.65}
.office-card .office-phone{display:inline-block;margin-top:.7rem;font-weight:700;color:var(--ink)}
.office-card .office-note{display:block;margin-top:.7rem;font-weight:700;color:var(--green)}
@media(max-width:760px){.office-grid{grid-template-columns:1fr}}


/* v10: responsive maps for every office location */
.map-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;align-items:start}
.map-card{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:18px;padding:1rem;box-shadow:0 12px 30px rgba(15,23,42,.06)}
.map-card h3{margin:0 0 .8rem}
.map-card .map{width:100%;height:320px;border:0;border-radius:12px;display:block}
@media (max-width:780px){.map-grid{grid-template-columns:1fr}.map-card .map{height:280px}}


/* v11: global presence globe and Pakistan office */
.global-globe{display:grid;grid-template-columns:minmax(320px,.95fr) minmax(300px,1.05fr);gap:3rem;align-items:center;margin:2.5rem 0 3rem;padding:2rem;border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,#061f2b,#075e5b 58%,#006ed2);color:#fff;overflow:hidden;box-shadow:var(--shadow)}
.global-globe-copy h3{font-size:2rem;margin:.35rem 0 .75rem}.global-globe-copy p{color:#d7e7ee}.global-globe-copy .kicker{color:#bbed7b}
.globe-location-list{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.2rem}.globe-location-list a{display:inline-flex;padding:.5rem .75rem;border:1px solid rgba(255,255,255,.22);border-radius:999px;color:#fff;background:rgba(255,255,255,.08);font-size:.86rem;font-weight:700}.globe-location-list a:hover{background:rgba(255,255,255,.16)}
.globe-visual{position:relative;width:min(100%,430px);aspect-ratio:1/1;margin:auto;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 34% 28%,#25bca2 0%,#087a72 38%,#063c55 73%,#041d2f 100%);box-shadow:inset -35px -25px 60px rgba(0,0,0,.32),0 24px 70px rgba(0,0,0,.28)}
.globe-visual:before,.globe-visual:after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none}.globe-visual:before{background:linear-gradient(95deg,transparent 24%,rgba(255,255,255,.15) 43%,transparent 58%)}.globe-visual:after{border:1px solid rgba(255,255,255,.25);box-shadow:inset 0 0 0 10px rgba(255,255,255,.025)}
.globe-grid{position:absolute;inset:12%;border:1px solid rgba(255,255,255,.18);border-radius:50%;pointer-events:none}.globe-grid-lat{inset:33% 7%;border-radius:50%}.globe-grid-lat:before,.globe-grid-lat:after{content:"";position:absolute;left:4%;right:4%;height:1px;background:rgba(255,255,255,.16)}.globe-grid-lat:before{top:-82%}.globe-grid-lat:after{bottom:-82%}
.globe-grid-lon-1{inset:7% 33%;border-radius:50%}.globe-grid-lon-2{inset:7% 20%;border-radius:50%}
.globe-pin{position:absolute;z-index:4;display:flex;align-items:center;gap:.28rem;color:white;font-size:.72rem;font-weight:800;text-shadow:0 1px 4px rgba(0,0,0,.65);transform:translate(-50%,-50%)}.globe-pin span{width:13px;height:13px;border-radius:50% 50% 50% 0;background:#bbed46;border:2px solid #fff;transform:rotate(-45deg);box-shadow:0 0 0 5px rgba(187,237,70,.18),0 4px 10px rgba(0,0,0,.35);animation:pinPulse 2.4s infinite}.globe-pin strong{white-space:nowrap}.globe-pin:hover span{background:#fff;box-shadow:0 0 0 7px rgba(255,255,255,.18)}
.pin-ireland{left:42%;top:31%}.pin-uk{left:47%;top:34%}.pin-uae{left:66%;top:52%}.pin-ksa{left:61%;top:58%}.pin-pakistan{left:75%;top:46%}.pin-brazil{left:30%;top:68%}
@keyframes pinPulse{0%,100%{box-shadow:0 0 0 4px rgba(187,237,70,.16),0 4px 10px rgba(0,0,0,.35)}50%{box-shadow:0 0 0 9px rgba(187,237,70,.04),0 4px 10px rgba(0,0,0,.35)}}
.office-map-link{display:inline-block;margin-top:.8rem;color:var(--blue);font-weight:750}.map-card p{margin:-.3rem 0 .8rem;color:var(--muted);font-size:.9rem}
@media(max-width:900px){.global-globe{grid-template-columns:1fr;gap:2rem}.globe-visual{max-width:390px}.global-globe-copy{text-align:center}.globe-location-list{justify-content:center}}
@media(max-width:520px){.global-globe{padding:1.2rem}.globe-pin strong{display:none}.globe-visual{max-width:310px}.global-globe-copy h3{font-size:1.55rem}}
