/* Shared mechanics for the homepage design concepts. Each concept file sets the look. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,video{display:block;max-width:100%}
h1,h2,h3,h4,p,figure,blockquote,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
summary{cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
:focus-visible{outline:2px solid #a89df0;outline-offset:4px}
.cx-skip{position:absolute;left:12px;top:-60px;z-index:200;padding:10px 14px;background:#111;color:#fff}
.cx-skip:focus{top:12px}
.cx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cx-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Media that swaps (services, case study) */
[data-swap-item]{opacity:0;transition:opacity .7s ease,transform 1.4s cubic-bezier(.2,.7,.2,1);transform:scale(1.04)}
[data-swap-item].is-active{opacity:1;transform:scale(1)}

/* Showreel */
[data-reel] [data-reel-copy]{transition:opacity .45s ease,transform .45s ease,visibility 0s linear 0s}
[data-reel].is-playing [data-reel-copy]{opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .35s ease,transform .35s ease,visibility 0s linear .35s}
.cx-reel-player{position:absolute;inset:0;z-index:6;background:#000}
.cx-reel-player[hidden]{display:none}
.cx-reel-player :is(video,iframe){position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:contain;background:#000}

/* Marquee */
.cx-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.cx-marquee__track{display:flex;width:max-content;animation:cx-marquee var(--cx-marquee-speed,40s) linear infinite}
.cx-marquee:hover .cx-marquee__track{animation-play-state:paused}
@keyframes cx-marquee{to{transform:translateX(-50%)}}

/* Quote slider */
[data-quote]{display:none}
[data-quote].is-active{display:block;animation:cx-fade .6s ease both}
@keyframes cx-fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Scroll reveal: content is visible without JavaScript */
.cx-js [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.cx-js [data-reveal].is-in{opacity:1;transform:none}

/* FAQ disclosure */
.cx-faq details>div{overflow:hidden}
.cx-faq details[open]>div{animation:cx-fade .4s ease both}

/* Review switcher */
.cx-switch{position:fixed;left:50%;bottom:14px;z-index:300;transform:translateX(-50%);display:flex;align-items:center;gap:4px;max-width:calc(100vw - 20px);overflow-x:auto;padding:5px;border-radius:999px;background:rgba(14,14,16,.9);backdrop-filter:blur(10px);box-shadow:0 12px 34px rgba(0,0,0,.3);font:500 12px/1.2 Arial,sans-serif;scrollbar-width:none}
.cx-switch__label{padding:0 10px 0 12px;color:#9a9aa3;white-space:nowrap}
.cx-switch a{padding:8px 12px;border-radius:999px;color:#e8e8ec;white-space:nowrap}
.cx-switch a:hover{background:rgba(255,255,255,.1)}
.cx-switch a[aria-current]{background:#5a4fa0;color:#fff}
@media(max-width:700px){.cx-switch__label{display:none}.cx-switch{bottom:10px}.cx-switch a{padding:7px 10px;font-size:11px}}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .cx-js [data-reveal]{opacity:1;transform:none}
}
#ast-scroll-top{display:none!important}