@import url("custom-v12-base.css");
@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@300;400;500;600;700;800&family=Inter:wght@400;500;600;700;800&display=swap');

/* ===== Global executive typography & spacing ===== */
html[lang="en"] body,
html[lang="en"] button,
html[lang="en"] input,
html[lang="en"] textarea,
html[lang="en"] select{font-family:'Inter',Arial,sans-serif!important}
html[lang="ar"] body,
html[lang="ar"] button,
html[lang="ar"] input,
html[lang="ar"] textarea,
html[lang="ar"] select,
html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6,
html[lang="ar"] .footer-brand{font-family:'Alexandria',Arial,sans-serif!important}
body{font-size:16px;line-height:1.75}
.wrap{width:min(1180px,92%)}
.nav{min-height:76px}
.brand{font-size:14px!important;letter-spacing:.12em}
.links a{font-size:12px!important;font-weight:700!important}
.kicker,.eyebrow{font-size:11px!important;font-weight:800!important;letter-spacing:.12em}

.hero{min-height:auto!important;padding-top:70px!important;padding-bottom:64px!important;gap:64px!important}
.hero h1{font-size:clamp(54px,6.5vw,86px)!important;line-height:.98!important;margin:14px 0 20px!important}
.hero h2{font-size:clamp(25px,2.65vw,36px)!important;line-height:1.2!important;margin-bottom:18px!important}
.hero p{font-size:17px!important;line-height:1.8!important}
.hero .cta{margin-top:27px!important}
.btn{min-height:46px!important;padding:11px 17px!important;font-size:13px!important}
.pill{font-size:11px!important;padding:7px 10px!important}

/* ===== Hero portrait ===== */
.hero-visual{min-height:470px!important;max-width:390px!important;width:100%!important;justify-self:center!important;position:relative!important}
.hero-img{height:470px!important;width:100%!important;overflow:hidden!important;border-radius:30px 30px 76px 30px!important;background:#d8d0c2!important}
.hero-img picture{display:block!important;width:100%!important;height:100%!important}
.hero-img picture img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 34%!important;border:0!important;margin:0!important;padding:0!important}
.executive-panel picture{display:block;width:min(100%,430px);justify-self:center}
.executive-panel picture img{width:100%!important;max-height:500px!important;object-fit:cover!important}

/* Smaller, lighter metric badges so the portrait remains the visual focus */
.float-card{width:auto!important;min-width:0!important;max-width:150px!important;padding:10px 12px!important;border-radius:15px!important;box-shadow:0 8px 24px rgba(44,39,33,.10)!important}
.float-card strong{font-size:15px!important;line-height:1.15!important}
.float-card span{font-size:9.5px!important;line-height:1.35!important;margin-top:3px!important}
.float-one{left:-18px!important;bottom:18px!important}
.float-two{right:-18px!important;top:24px!important}

.stats{margin-bottom:88px!important}
.stat{padding:22px!important}
.stat b{font-size:21px!important}
.stat span{font-size:12px!important;line-height:1.55!important}
section,.section{padding-top:82px!important;padding-bottom:82px!important}
.page-hero{padding-top:82px!important;padding-bottom:50px!important}
.page-hero h1{font-size:clamp(42px,5.2vw,66px)!important;line-height:1.08!important;max-width:980px!important;margin-bottom:16px!important}
.page-hero p{font-size:18px!important;line-height:1.75!important}
.page-content{padding-top:64px!important;padding-bottom:96px!important}
h3{font-size:clamp(34px,4.2vw,52px)!important;line-height:1.08!important;margin-bottom:20px!important}
h4{font-size:19px!important;line-height:1.35!important}
.lead{font-size:18px!important;line-height:1.8!important}
.card,.company,.mini-item,.principle,.contact-card{border-radius:18px!important}
.card{padding:24px!important}
.mini-item{padding:17px 18px!important}
.quote-box{font-size:16px!important;line-height:1.8!important;padding:24px!important}
.section-head{margin-bottom:30px!important}
.section-head p{font-size:15px!important;line-height:1.7!important}
.article-card .article-body{padding:21px!important}
.article-body h4{font-size:20px!important;line-height:1.35!important}
.article-body p{font-size:14px!important;line-height:1.7!important}
.article-page{max-width:820px!important}
.article-page p,.article-page li{font-size:17px!important;line-height:1.85!important}
.article-page h2{font-size:28px!important;line-height:1.28!important;margin-top:38px!important;margin-bottom:14px!important}
.author-box{margin-bottom:30px!important}
.related-insights{margin-top:48px!important}
.footer-brand{font-size:24px!important}
.footer-grid p,.footer-grid a{font-size:13px!important;line-height:1.6!important}
.site-footer{padding-top:50px!important}

html[lang="ar"] body{line-height:1.9;font-weight:400}
html[lang="ar"] .links a{font-weight:600!important;letter-spacing:0!important}
html[lang="ar"] .kicker,html[lang="ar"] .eyebrow{letter-spacing:.035em!important;font-weight:700!important}
html[lang="ar"] .hero h1{font-size:clamp(46px,5.1vw,70px)!important;line-height:1.22!important;font-weight:700!important;letter-spacing:-.01em!important}
html[lang="ar"] .hero h2{font-size:clamp(22px,2.2vw,31px)!important;line-height:1.6!important;font-weight:600!important}
html[lang="ar"] .hero p{font-size:16px!important;line-height:2!important}
html[lang="ar"] .page-hero h1{font-size:clamp(38px,4.7vw,58px)!important;line-height:1.38!important;font-weight:700!important;letter-spacing:-.01em!important}
html[lang="ar"] .page-hero p{font-size:16px!important;line-height:2!important}
html[lang="ar"] h3{font-size:clamp(29px,3.5vw,44px)!important;line-height:1.5!important;font-weight:700!important;letter-spacing:-.01em!important}
html[lang="ar"] h4{font-size:18px!important;line-height:1.65!important;font-weight:700!important}
html[lang="ar"] .lead{font-size:17px!important;line-height:2!important}
html[lang="ar"] .quote-box{line-height:2!important}
html[lang="ar"] .stat b{font-size:20px!important;line-height:1.5!important;font-weight:700!important}
html[lang="ar"] .article-page p,html[lang="ar"] .article-page li{font-size:16.5px!important;line-height:2.05!important}
html[lang="ar"] .article-page h2{font-size:26px!important;line-height:1.6!important}
html[lang="ar"] .client-card b,html[lang="ar"] .company b,html[lang="ar"] .contact-card strong,html[lang="ar"] .contact-card a{font-weight:700!important}

@media(max-width:850px){
  .nav{min-height:68px!important;padding:10px 16px!important}
  .brand{font-size:13px!important}
  .menu-toggle{width:42px!important;height:42px!important}
  .links{left:10px!important;right:10px!important;border-radius:14px!important;padding:9px!important}
  .links a{font-size:13px!important;padding:11px 13px!important;min-height:42px!important}
  .hero{grid-template-columns:1fr!important;padding-top:38px!important;padding-bottom:44px!important;gap:30px!important}
  .hero-copy{max-width:none!important}
  .hero h1{font-size:clamp(46px,12vw,64px)!important}
  .hero h2{font-size:25px!important;line-height:1.3!important}
  .hero p{font-size:16px!important;line-height:1.75!important}
  .hero-visual{min-height:390px!important;max-width:330px!important;margin-inline:auto!important}
  .hero-img{height:390px!important;border-radius:26px 26px 64px 26px!important}
  .float-card{max-width:132px!important;padding:9px 10px!important}
  .float-card strong{font-size:14px!important}
  .float-card span{font-size:9px!important}
  .float-one{left:-8px!important;bottom:14px!important}
  .float-two{right:-8px!important;top:16px!important}
  .executive-panel picture{width:min(100%,360px)}
  .executive-panel picture img{max-height:430px!important}
  .stats{grid-template-columns:1fr 1fr!important;margin-bottom:64px!important}
  .stat{padding:18px!important}
  section,.section{padding-top:64px!important;padding-bottom:64px!important}
  .page-hero{padding-top:58px!important;padding-bottom:34px!important}
  .page-hero h1{font-size:44px!important;line-height:1.12!important}
  .page-content{padding-top:48px!important;padding-bottom:76px!important}
  .feature-grid,.executive-panel,.contact-grid,.impact-band{grid-template-columns:1fr!important;gap:28px!important}
  .principle-grid,.expertise-value-strip{grid-template-columns:1fr 1fr!important}
  .gallery{grid-template-columns:1fr!important}
  .gallery img{height:390px!important}
  .job{grid-template-columns:1fr!important;gap:8px!important;padding:25px 0!important}
  .company-list{grid-template-columns:1fr!important}
  .article-grid{grid-template-columns:1fr 1fr!important}
  .article-page{width:min(92%,820px)!important}
  .footer-grid{grid-template-columns:1fr 1fr!important;gap:28px!important}
  .footer-grid>div:first-child{grid-column:1/-1!important}
  html[lang="ar"] .hero h1{font-size:44px!important;line-height:1.28!important}
  html[lang="ar"] .hero h2{font-size:22px!important;line-height:1.65!important}
  html[lang="ar"] .page-hero h1{font-size:38px!important;line-height:1.45!important}
  html[lang="ar"] h3{font-size:30px!important;line-height:1.55!important}
}

@media(max-width:560px){
  .wrap{width:min(92%,100%)!important}
  .hero{padding-top:28px!important;gap:24px!important}
  .hero h1{font-size:44px!important;line-height:1.02!important}
  .hero h2{font-size:22px!important;line-height:1.35!important}
  .hero p{font-size:15px!important;line-height:1.75!important}
  .trust-strip{gap:6px!important;margin-top:20px!important}
  .pill{font-size:10.5px!important}
  .cta{gap:8px!important;margin-top:24px!important}
  .btn{width:100%!important;min-height:46px!important}
  .hero-visual{min-height:320px!important;max-width:280px!important;margin-inline:auto!important}
  .hero-img{height:320px!important;border-radius:22px 22px 48px 22px!important}
  .float-card{max-width:116px!important;padding:8px 9px!important;border-radius:12px!important}
  .float-card strong{font-size:12.5px!important}
  .float-card span{font-size:8.5px!important}
  .float-one{left:-2px!important;bottom:10px!important}
  .float-two{right:-2px!important;top:12px!important}
  .executive-panel picture{width:min(88%,300px);margin-inline:auto}
  .executive-panel picture img{max-height:360px!important;border-radius:20px!important}
  .stats{grid-template-columns:1fr!important;border-radius:18px!important;margin-bottom:54px!important}
  .stat:not(:last-child){border-inline-end:0!important;border-bottom:1px solid rgba(65,57,48,.16)!important}
  section,.section{padding-top:54px!important;padding-bottom:54px!important}
  .page-hero{padding-top:46px!important;padding-bottom:30px!important}
  .page-hero h1{font-size:36px!important;line-height:1.15!important}
  .page-hero p{font-size:16px!important}
  .page-content{padding-top:40px!important;padding-bottom:66px!important}
  h3{font-size:30px!important;line-height:1.15!important}
  .lead{font-size:16px!important;line-height:1.75!important}
  .section-head{display:block!important}
  .section-head p{margin-top:10px!important}
  .principle-grid,.expertise-value-strip,.article-grid{grid-template-columns:1fr!important}
  .card,.principle,.mini-item,.company,.contact-card{padding:20px!important}
  .gallery img{height:330px!important;border-radius:20px!important}
  .client-carousel-shell{padding:0 38px!important}
  .client-card{min-height:170px!important;padding:22px 18px!important}
  .article-page p,.article-page li{font-size:16px!important;line-height:1.8!important}
  .article-page h2{font-size:24px!important;line-height:1.35!important}
  .footer-grid{grid-template-columns:1fr!important}
  .footer-grid>div:first-child{grid-column:auto!important}
  .footer-bottom{display:block!important}
  .footer-bottom span{display:block;margin-top:6px}
  html[lang="ar"] .hero h1{font-size:40px!important;line-height:1.32!important}
  html[lang="ar"] .hero h2{font-size:20px!important;line-height:1.7!important}
  html[lang="ar"] .hero p{font-size:15px!important;line-height:1.95!important}
  html[lang="ar"] .page-hero h1{font-size:33px!important;line-height:1.5!important}
  html[lang="ar"] h3{font-size:28px!important;line-height:1.6!important}
  html[lang="ar"] .lead{font-size:16px!important;line-height:2!important}
  html[lang="ar"] .article-page p,html[lang="ar"] .article-page li{font-size:16px!important;line-height:2!important}
}


/* FINAL portrait edge fix */
.executive-panel .portrait-small{width:100%!important;max-width:430px!important;height:500px!important;min-height:500px!important;justify-self:center!important;padding:0!important;margin:0!important;background:transparent!important;overflow:hidden!important;border-radius:28px!important}
.executive-panel .portrait-small picture{display:block!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important}
.executive-panel .portrait-small picture img{display:block!important;width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;object-position:center 25%!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important}
@media(max-width:850px){.executive-panel .portrait-small{max-width:360px!important;height:430px!important;min-height:430px!important;border-radius:24px!important}}
@media(max-width:560px){.executive-panel .portrait-small{max-width:300px!important;height:360px!important;min-height:360px!important;border-radius:20px!important}}
