/* Compact animated 3D showcase for existing client projects. */
.references{position:relative;display:block!important;overflow:hidden;padding-bottom:clamp(3.45rem,7vw,4.35rem);content-visibility:visible!important;contain:none!important}
.references .section-head{padding-top:clamp(3.9rem,8vw,4.8rem);padding-bottom:1rem;text-align:center}
.references .section-head h2{max-width:none;margin-inline:auto;font-size:clamp(1.83rem,2.75vw,2.83rem)}
.reference-carousel{position:relative;z-index:2;display:block!important;width:min(calc(100% - 1rem),94rem);min-height:28rem;margin-inline:auto;opacity:1!important;visibility:visible!important;transform:none!important}
.reference-carousel[data-reveal],.references .section-head[data-reveal]{opacity:1!important;visibility:visible!important;transform:none!important}
.reference-stage{position:relative;display:block!important;height:clamp(34rem,46vw,44rem);perspective:1500px;perspective-origin:50% 45%;opacity:1!important;visibility:visible!important}
.reference-stage:before{top:14%;width:min(64vw,52rem);height:62%;filter:blur(2.4rem)}
.reference-orbit{top:20%;width:min(60vw,50rem);opacity:.72;animation:reference-orbit-pulse 5.2s ease-in-out infinite}
.reference-card{top:6%;width:min(44%,39rem);height:76%;border-radius:1.4rem;box-shadow:0 2.2rem 6rem rgba(0,0,0,.72),inset 0 1px rgba(255,255,255,.1)}
.reference-card.is-active{transform:translate3d(-50%,0,6rem) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) scale(.94)}
.reference-card.is-previous{transform:translate3d(-98%,9%,-6rem) rotateY(32deg) rotateZ(-1deg) scale(.62)}
.reference-card.is-next{transform:translate3d(-2%,9%,-6rem) rotateY(-32deg) rotateZ(1deg) scale(.62)}
.reference-card>img{transition:transform 5.2s cubic-bezier(.2,.65,.25,1)}
.reference-card.sport>img{padding:0;clip-path:none;object-fit:cover;object-position:center 42%;transform:none}
.reference-card.is-active>img{transform:translateY(-1%) scale(1.035)}
.reference-card.sport.is-active>img{transform:scale(1.08)}
.browser-bar{height:1.65rem;padding-left:.72rem}.browser-bar i{width:.34rem}.browser-bar:after{top:.42rem;right:.72rem;left:3.8rem;height:.75rem}.reference-card>img{top:1.65rem;height:calc(100% - 1.65rem)}
.card-shade{inset:1.65rem 0 0}.card-copy{gap:.18rem;padding:1rem 1.15rem;transform:translateZ(3rem)}.card-copy small{font-size:.58rem}.card-copy strong{font-size:clamp(1.2rem,1.1vw,1.47rem)}.card-copy em{font-size:.62rem}
.reference-title{bottom:0}.reference-title strong{font-size:1.1rem}.reference-controls{width:min(100%,72rem);margin:-.25rem auto 0;padding-top:1.1rem}.reference-controls button{width:3.1rem}.reference-controls .reference-link{min-height:3.15rem;padding:.75rem 1.3rem;font-size:.78rem}
@keyframes reference-orbit-pulse{0%,100%{opacity:.48;transform:translateX(-50%) rotateX(76deg) translateZ(-5rem) scale(.96)}50%{opacity:.82;transform:translateX(-50%) rotateX(76deg) translateZ(-5rem) scale(1.04)}}
@media(max-width:700px){.references .section-head{padding-top:3.675rem}.reference-carousel{width:100%;min-height:22.4rem}.reference-stage{height:26rem;perspective:1000px}.reference-stage:before{width:92vw}.reference-orbit{top:23%;width:86vw}.reference-card{top:7%;width:min(72%,21rem);height:72%;border-radius:1rem}.reference-card.is-active{transform:translate3d(-50%,0,4rem) scale(.96)}.reference-card.is-previous{transform:translate3d(-94%,11%,-4rem) rotateY(26deg) scale(.58)}.reference-card.is-next{transform:translate3d(-6%,11%,-4rem) rotateY(-26deg) scale(.58)}.reference-title{bottom:1%}.reference-controls{width:min(calc(100% - 1rem),27rem);gap:.7rem}.reference-controls .reference-link{width:auto;flex:1}.reference-controls>div{gap:.4rem}.reference-count{min-width:3.9rem}}
@media(prefers-reduced-motion:reduce){.reference-orbit{animation:none}}

/* Fit this showcase to the screen without scaling the rest of the homepage. */
body.homepage-content-restored #referenzen {
  box-sizing: border-box;
  padding: 5.75rem 0 1.25rem;
  scroll-margin-top: 0;
}
body.homepage-content-restored #referenzen .section-head {
  padding-top: 0;
  padding-bottom: .75rem;
}
body.homepage-content-restored #referenzen .section-head > p { margin: 0 0 .45rem; }
body.homepage-content-restored #referenzen .section-head h2 {
  font-size: clamp(1.6rem,2.4vw,2.3rem) !important;
  margin-block: 0;
}
body.homepage-content-restored #referenzen .reference-carousel { min-height: 0; }
body.homepage-content-restored #referenzen .reference-stage {
  height: clamp(14rem,calc(100svh - 21rem),30rem);
}
body.homepage-content-restored #referenzen .reference-card { width: min(44%,32rem); }
body.homepage-content-restored #referenzen .reference-controls {
  padding-top: .65rem;
  margin-top: 0;
}
@media(min-width:701px) and (min-height:640px) {
  body.homepage-content-restored #referenzen {
    display: grid !important;
    grid-template-rows: auto minmax(0,1fr);
    height: min(100svh,56rem);
  }
  body.homepage-content-restored #referenzen .reference-carousel {
    display: grid !important;
    grid-template-rows: minmax(0,1fr) auto;
  }
  body.homepage-content-restored #referenzen .reference-stage { height: 100%; min-height: 0; }
}
@media(max-width:700px) {
  body.homepage-content-restored #referenzen { padding-top: 5rem; }
  body.homepage-content-restored #referenzen .reference-card { width: min(72%,21rem); }
  body.homepage-content-restored #referenzen .reference-controls {
    flex-direction: row;
    align-items: center;
  }
}
