/* Project-backed client stories, with the site's navy/gold palette. */
.client-proof-glass{padding:56px 0 36px;background:var(--navy);color:#fff;border-color:rgba(236,204,110,.2)}
.client-proof-glass .wrap{display:block}
.client-glass-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:8px}
.client-glass-heading span{display:block;color:var(--gold);font-size:14px;font-weight:700;margin-bottom:12px}
.client-proof-glass .client-glass-heading h2{margin:0;color:#fff;font-size:clamp(26px,2.1vw,38px);line-height:1.15}
.client-proof-glass .client-glass-heading p{margin:0;color:#c8c9d5;font-size:16px;line-height:1.5}
.client-reel{width:100%;overflow-x:auto;direction:ltr;padding:32px 0 40px;scrollbar-width:thin;scrollbar-color:#eccc6e #1b1c30;--client-edge-fade:clamp(24px,8vw,160px);cursor:grab;touch-action:pan-y;user-select:none}
.client-reel.is-dragging{cursor:grabbing}
.client-reel.is-dragging .client-glass-surface{pointer-events:none}
.client-reel-track{display:flex;width:max-content}
.client-reel-group{display:flex;gap:24px;flex:none;margin:0;padding:0 24px 0 0;list-style:none}
.client-glass-card{width:290px;flex:0 0 290px;direction:rtl}
.client-glass-surface{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:420px;height:420px;padding:26px;border:1px solid rgba(236,204,110,.28);border-radius:26px;overflow:hidden;background:#111223;box-shadow:0 18px 24px -24px #000}
.client-glass-project-image{position:absolute;z-index:-2;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:var(--client-image-position,center top)}
.client-glass-surface::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(17,18,35,.1) 0%,rgba(17,18,35,.2) 22%,rgba(17,18,35,.85) 48%,rgba(17,18,35,.96) 70%,#111223 100%);pointer-events:none}
.client-glass-copy{position:relative;display:flex;flex-direction:column;width:100%;min-width:0;min-height:208px}
.client-glass-copy h3{margin:0;color:#fff;font-size:26px;font-weight:800;line-height:1.15;text-wrap:balance}
.client-proof-glass .client-glass-copy .client-glass-pain{margin:12px 0 20px;color:#f0f0f5;font-size:16px;line-height:1.5;text-wrap:pretty}
.client-glass-footer{display:flex;flex-direction:column;gap:14px;margin-top:auto;padding-top:16px;border-top:1px solid rgba(236,204,110,.27)}
.client-proof-glass .client-glass-copy .client-glass-type{margin:0;color:#eccc6e;font-size:13px;font-weight:700;line-height:1.4}
.client-glass-links{position:relative;display:flex;gap:10px}
.client-glass-links a{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;background:#fff;color:#111223;text-decoration:none;transition:transform 160ms cubic-bezier(.23,1,.32,1),background-color 160ms}
.client-glass-links svg{width:21px;height:21px}
.client-glass-links a:focus-visible{outline:3px solid var(--gold);outline-offset:5px}
.client-glass-links a:active{transform:scale(.96)}
.client-reel.is-looping{overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--client-edge-fade),#000 calc(100% - var(--client-edge-fade)),transparent);mask-image:linear-gradient(to right,transparent,#000 var(--client-edge-fade),#000 calc(100% - var(--client-edge-fade)),transparent)}
.client-reel.is-looping .client-glass-card{will-change:transform}
.client-reel.is-static .client-reel-track{width:100%}
.client-reel.is-static .client-reel-group{width:100%;padding-inline:24px}
.client-reel.is-static .client-glass-card{flex:1 1 0;width:auto;min-width:0}
.client-reel.is-keyboard{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
@media(hover:hover) and (pointer:fine){
  .client-glass-card{perspective:1000px}
  .client-glass-surface{isolation:auto;overflow:visible;transform-style:preserve-3d;transition:transform 240ms cubic-bezier(.23,1,.32,1)}
  .client-glass-project-image{z-index:0;border-radius:25px}
  .client-glass-surface::before{z-index:1;border-radius:25px}
  .client-glass-surface::after{content:"";position:absolute;inset:7px;z-index:1;border:1px solid #ffffff24;border-radius:22px;background:linear-gradient(135deg,#ffffff12,transparent 55%);transform:translate3d(0,0,25px);pointer-events:none}
  .client-glass-copy{z-index:2;transform-style:preserve-3d;transform:translate3d(0,0,26px)}
  .client-glass-footer,.client-glass-links{transform-style:preserve-3d}
  .client-glass-card:hover{z-index:2}
  .client-glass-card:hover .client-glass-surface{transform:rotate3d(1,1,0,30deg)}
  .client-glass-card:hover .client-glass-links a{transform:translate3d(0,0,50px)}
  .client-glass-links a:nth-child(2){transition-delay:40ms}
  .client-glass-links a:nth-child(3){transition-delay:80ms}
  .client-glass-links a:hover{background:var(--gold);transform:translateY(-3px)}
}
@media(max-width:599px){
  .client-proof-glass{padding:36px 0 16px}
  .client-glass-heading{display:block}
  .client-proof-glass .client-glass-heading p{margin-top:12px;font-size:15px}
  .client-glass-card{width:268px;flex-basis:268px}
  .client-reel-group{gap:20px;padding-right:20px}
  .client-glass-surface{padding:24px;min-height:410px;height:410px;border-radius:24px}
}
@media(prefers-reduced-motion:reduce){
  .client-reel.is-looping{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
  .client-glass-surface,.client-glass-copy,.client-glass-links a{transition:none!important;transform:none!important}
  .client-glass-surface::after{transform:none}
}