/* Monolith's compact coverflow geometry, adapted to the original client logos. */
#clients{background:#2F3A85;color:#FFFFFF}
#clients .showcase-background{background:radial-gradient(ellipse at 50% 54%,#257ACD42,transparent 65%),linear-gradient(110deg,#2D3A83,#2F3A85 50%,#252D69)}
#clients .showcase-shell{padding:23px 4% 82px;grid-template-rows:55px minmax(0,1fr);gap:7px}
#clients .showcase-header h2{font-size:clamp(28px,2.8vw,42px);letter-spacing:-1px}
#clients .showcase-header h2 span{color:#C15F9F}
#clients .showcase-eyebrow{color:#FFFFFF80;font-size:7px;letter-spacing:2.4px}
#clients .clients-content{grid-template-rows:30px minmax(0,1fr) 120px 39px 12px;gap:5px;overflow:visible}
#clients .clients-intro{justify-content:center;gap:24px;padding:0;order:0}
#clients .clients-intro>span{font-size:9px;color:#FFFFFF99;letter-spacing:2.2px;text-transform:uppercase}
#clients .clients-intro>strong{font-size:13px;color:#FFFFFFB8}
#clients .client-partnership{display:grid;place-items:center;width:31px;height:31px;border:1px solid #B3DFFF30;border-radius:50%;background:#FFFFFF08;box-shadow:0 0 18px #257ACD33}
#clients .client-partnership svg{width:21px;height:21px;stroke:#ADD9F3;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
#clients .client-partnership svg path:last-child{stroke:#D99AC4}
#clients .clients-stage{perspective:1800px;isolation:auto;overflow:hidden;min-height:220px;margin-inline:-4.4%;cursor:grab;touch-action:pan-y}
#clients .clients-stage.is-dragging,#clients .clients-stage.is-dragging .client-card{cursor:grabbing}
#clients .clients-floor{inset:5% 20% -2%;height:auto;background:radial-gradient(ellipse,#257ACD33,transparent 65%);transform:none;opacity:.7}
#clients .client-card{top:45%;height:84%;max-height:440px;width:min(28vw,350px);max-width:none;aspect-ratio:auto;border:0;border-radius:0;padding:0;box-shadow:none;overflow:visible;background:transparent;transition:transform .95s cubic-bezier(.22,1,.36,1),opacity .8s;transform-style:preserve-3d;-webkit-box-reflect:unset;user-select:none}
#clients .client-card-surface,#clients .client-card-reflection{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;border:1px solid #ffffff6b;border-radius:14px;background:linear-gradient(145deg,color-mix(in srgb,var(--card-accent) 72%,white),var(--card-accent));overflow:hidden}
#clients .client-card-surface{box-shadow:0 30px 60px -28px #1410088c,0 8px 22px -14px #14100866;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s}
#clients .client-card-liquid{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;padding:inherit;border-radius:inherit;background:#FFFFFF;pointer-events:none;clip-path:polygon(0 0,100% 0,100% -5%,0 -5%)}
#clients .client-card-liquid .client-card-number{color:#2F3A8599}
#clients .client-card-liquid .client-card-rule{background:linear-gradient(90deg,#257ACD,#C15F9F)}
#clients .client-card img{position:relative;z-index:1;width:100%;height:auto;max-height:88%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:8px;padding:10px;box-shadow:0 10px 20px #0000000f;transition:transform .7s cubic-bezier(.22,1,.36,1)}
#clients .client-card-surface:before{content:'';position:absolute;inset:0;background:linear-gradient(#00000016,transparent 25%,transparent 75%,#00000012);pointer-events:none}
#clients .client-card-surface:after{background:radial-gradient(ellipse at var(--light-x,50%) var(--light-y,35%),#fff8,transparent 65%);z-index:3}
#clients .client-card-reflection{top:calc(100% + 5px);bottom:auto;height:100%;transform:scaleY(-1);opacity:.17;mask-image:linear-gradient(transparent 62%,#000 100%);pointer-events:none;box-shadow:none}
#clients .client-card-number{top:9px;left:10px;color:#fff9;font-size:8px;z-index:2}
#clients .client-card-rule{background:#ffffff80;bottom:9px;width:28px;left:calc(50% - 14px);height:1px}
#clients .client-caption{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:17px 1fr;gap:6px 36px;min-height:0;align-items:center;padding:0 3%;position:relative;z-index:3}
#clients .client-position{grid-column:1/3;grid-row:1;color:#FFFFFF66;font-size:10px;letter-spacing:1px;gap:5px}
#clients .client-position b{color:#DCA5CA;font-size:15px}
#clients .client-name-ar{grid-column:1;grid-row:2}
#clients .client-name-en{grid-column:2;grid-row:2}
#clients .client-caption h3{font-size:clamp(24px,2.5vw,40px);line-height:1.13;color:#FFFFFF;letter-spacing:-1px;text-wrap:balance}
#clients .client-name-ar h3{line-height:1.2}
#clients .client-sector{margin:9px 0 0;color:#B9D2EE;font-size:13px;line-height:1.4;display:flex;align-items:center;gap:8px}
#clients .client-sector:before{content:'';width:4px;height:4px;border-radius:50%;background:#C15F9F;flex-shrink:0}
#clients .client-name-ar .client-sector{font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:700;direction:rtl}
#clients .client-name-en .client-sector{font:600 10px/1.4 'Montserrat',sans-serif;direction:ltr;letter-spacing:.2px}
#clients .clients-navigation{gap:20px}
#clients .clients-arrow{width:39px;height:39px;background:transparent;border:1px solid #FFFFFF33;color:#FFFFFFC9;font-size:23px;transition:border-color .3s,background .3s,transform .3s}
#clients .clients-arrow:hover{border-color:#C15F9F;background:#FFFFFF19;transform:scale(1.05)}
#clients .clients-dots{max-width:48%;gap:1px}
#clients .clients-dots button{flex-basis:16px;width:16px}
#clients .clients-dots i{height:3px;background:#FFFFFF2E}
#clients .clients-dots button[aria-pressed='true'] i{background:#C15F9F;transform:scaleY(1.8)}
#clients .clients-gesture{display:flex;justify-content:center;gap:20px;direction:ltr;font:600 7px 'Montserrat',sans-serif;letter-spacing:1px;color:#FFFFFF66}
#clients .clients-gesture>span:last-child{font:700 9px 'IBM Plex Sans Arabic',sans-serif;letter-spacing:0}
@media(hover:hover) and (pointer:fine){
 #clients .client-card.is-hovered .client-card-surface{transform:translateY(-7px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));box-shadow:0 36px 64px -24px #14100880,0 0 0 1px #fff8}
 #clients .client-card.is-hovered img{transform:scale(1.045)}
 #clients .client-card.is-hovered .client-card-surface:after{opacity:.28}
}
@media(min-width:1600px){#clients .showcase-shell{padding-top:32px;padding-bottom:92px;grid-template-rows:70px minmax(0,1fr)}#clients .clients-content{grid-template-rows:32px minmax(0,1fr) 142px 44px 14px;gap:9px}#clients .client-card{width:380px}}
@media(max-height:650px) and (min-width:761px){#clients .showcase-shell{padding-top:12px;padding-bottom:74px;grid-template-rows:45px minmax(0,1fr)}#clients .clients-content{grid-template-rows:26px minmax(0,1fr) 98px 33px 10px;gap:3px}#clients .client-caption h3{font-size:25px}#clients .clients-stage{min-height:170px}#clients .client-card{width:min(27vw,280px)}#clients .clients-arrow{width:32px;height:32px}#clients .client-card-surface,#clients .client-card-reflection{padding:18px}}
@media(max-width:760px){
 #clients .showcase-shell{padding:23px 5% 112px;grid-template-rows:60px minmax(0,1fr);gap:8px}
 #clients .showcase-header h2{font-size:27px;letter-spacing:-.8px}#clients .showcase-eyebrow{font-size:6px;letter-spacing:1.1px}
 #clients .clients-content{grid-template-rows:30px minmax(215px,1fr) 146px 36px 12px;gap:7px;overflow-y:auto;overflow-x:hidden;padding-bottom:3px}
 #clients .clients-intro{gap:12px}#clients .clients-intro>span{font-size:6px;letter-spacing:.7px}#clients .clients-intro>strong{font-size:10px}
 #clients .clients-stage{margin-inline:-5.6%;perspective:1100px;min-height:215px}
 #clients .client-card{width:62vw;max-width:300px;height:81%;max-height:345px;top:43%}
 #clients .client-card-surface,#clients .client-card-reflection{padding:15px;border-radius:12px}#clients .client-card img{padding:7px;border-radius:6px;max-height:88%}
 #clients .client-caption{padding:0 2px;gap:7px 16px;grid-template-rows:15px 1fr}#clients .client-caption h3{font-size:20px;letter-spacing:-.5px;line-height:1.25}
 #clients .client-sector{font-size:11px;margin-top:8px;gap:6px}#clients .client-name-en .client-sector{font-size:8px}
 #clients .clients-dots{max-width:61%}#clients .clients-dots button{flex-basis:13px;width:13px}#clients .clients-navigation{gap:12px}#clients .clients-arrow{width:34px;height:34px}
 #clients .clients-gesture{font-size:6px;gap:13px}#clients .clients-gesture>span:last-child{font-size:8px}
}
@media(max-width:380px){#clients .showcase-header h2{font-size:24px}#clients .client-caption h3{font-size:17px}#clients .clients-content{grid-template-rows:30px minmax(200px,1fr) 132px 34px 11px;gap:6px}#clients .clients-stage{min-height:200px}}
@media(prefers-reduced-motion:reduce){#clients{transition:none}#clients .client-card,#clients .client-card-surface,#clients .client-card img{transition:none!important}#clients .client-card.is-hovered img{transform:none}}
