.project-visual.has-project-image > .project-brand{display:block}
.project-visual.has-project-image > .project-preview-button{display:flex}
.project-visual.has-project-image > .project-live-capture{display:block}
.project-visual.has-project-image:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.72))}
.project-site-tour{background-image:none!important;background:#0a0a0c}
@media (min-width:901px){
  .projects-section{padding-top:112px;padding-bottom:112px}
  .dynamic-projects{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,3vw,44px)}
  .dynamic-projects .project-browser{border-radius:22px}
  .dynamic-projects .project-visual{height:clamp(390px,35vw,510px);min-height:0;padding:28px}
  .dynamic-projects .project-brand small{margin-bottom:12px;font-size:9px}
  .dynamic-projects .project-brand span{margin-top:0;font-size:10px}
  .dynamic-projects .project-preview-button{right:24px;bottom:24px;padding:13px 16px 13px 19px;gap:18px;font-size:12px}
  .dynamic-projects .project-case:hover .project-browser{transform:translateY(-6px)}
}
.project-live-capture{position:absolute;inset:-1px;z-index:-2;background-image:var(--project-capture);background-repeat:no-repeat;background-size:100% auto;background-position:center top;filter:saturate(.94) brightness(.74);transform:scale(1.015);animation:projectSiteTour 24s cubic-bezier(.55,.08,.35,.96) infinite alternate;animation-play-state:paused;transition:filter .55s ease,transform .55s ease;will-change:background-position,filter,transform}
.project-site-tour.is-tour-active .project-live-capture{animation-play-state:running}
.project-site-tour:after{background:linear-gradient(90deg,rgba(4,4,7,.78) 0%,rgba(4,4,7,.36) 44%,rgba(4,4,7,.12) 72%),linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.58))!important;transition:opacity .55s ease}
.project-site-tour:hover .project-live-capture{filter:saturate(1.08) brightness(.82);transform:scale(1.025)}
.project-site-tour:hover:after{opacity:.72}
.project-site-tour .project-brand,.project-site-tour .project-preview-button{position:relative;z-index:2}
.project-site-tour .project-preview-button{position:absolute}
@keyframes projectSiteTour{0%,20%{background-position:center top}91%,100%{background-position:center bottom}}
.project-case .project-visual{transition:transform .28s ease}
@media (prefers-reduced-motion:reduce){.project-case .project-visual{transform:none!important}.preview-loading span{animation:none}.project-live-capture{animation:none!important;background-position:center top}}
@media (max-width:760px){
  .decorative-arrow,.button i,.header-cta i,.text-link span,.circle-link b,.service-row>i,.project-preview-button i,.project-meta>a i,.project-expand{display:none!important}
  .hero-canvas,.hero-orbit,.project-orbit,.ambient-pointer,.cursor-dot,.cursor-ring{display:none!important}
  .hero-glow{opacity:.1!important;filter:blur(90px)!important;animation:none!important}
  .float-card,.status-pulse,.code-stream i,.quote-section:before{animation:none!important}
  .float-card{transform:none!important}
  .marquee div{animation-duration:48s!important}
  .page-transition{display:none!important}
  .project-browser,.project-visual,.service-row,.button,.circle-link{transform:none!important}
  .project-preview-button{gap:0!important;padding-inline:22px!important}
  .mobile-menu>a{display:inline-flex;align-items:center;width:max-content}
  .project-live-capture{animation-duration:27s;filter:saturate(.96) brightness(.7)}
  .project-site-tour:after{background:linear-gradient(180deg,rgba(4,4,7,.5),rgba(4,4,7,.2) 44%,rgba(4,4,7,.75))!important}
}
@media (min-width:761px) and (max-width:900px){.dynamic-projects{grid-template-columns:1fr;gap:70px}.dynamic-projects .project-visual{height:540px;min-height:0}}

/* Liquid ambience behind the project cases. */
.projects-section{isolation:isolate}
.projects-section>.project-orbit{
  display:block;
  width:clamp(230px,24vw,390px);
  height:clamp(300px,32vw,520px);
  top:8%;
  right:-7%;
  z-index:0;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.13);
  border-radius:58% 42% 61% 39% / 43% 58% 42% 57%;
  opacity:.48;
  background:
    radial-gradient(circle at 28% 20%,rgba(255,255,255,.28) 0 2%,rgba(255,255,255,.08) 10%,transparent 28%),
    radial-gradient(circle at 68% 72%,rgba(72,52,255,.26),transparent 46%),
    linear-gradient(145deg,rgba(255,76,76,.24),rgba(255,255,255,.025) 48%,rgba(49,34,140,.18));
  box-shadow:inset 24px 20px 48px rgba(255,255,255,.035),inset -35px -28px 70px rgba(0,0,0,.55),0 0 85px rgba(255,75,75,.09);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  will-change:transform,border-radius;
  animation:projectDropDrift 19s cubic-bezier(.45,.05,.35,1) infinite alternate,projectDropMorph 8s ease-in-out infinite alternate;
}
.projects-section>.project-orbit:before{
  content:"";
  position:absolute;
  inset:-42px;
  border:1px solid rgba(255,75,75,.12);
  border-radius:50%;
  opacity:0;
  animation:projectDropRipple 6s ease-out infinite;
}
.projects-section>.project-orbit:after{
  content:"";
  position:absolute;
  width:32%;
  height:10%;
  top:12%;
  left:19%;
  border-radius:50%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);
  filter:blur(7px);
  transform:rotate(-24deg);
  opacity:.42;
}
.projects-section>.container{z-index:2}
@keyframes projectDropDrift{
  0%{transform:translate3d(0,0,0) rotate(-7deg) scale(.94)}
  48%{transform:translate3d(-21vw,35%,0) rotate(9deg) scale(1.06)}
  100%{transform:translate3d(-48vw,74%,0) rotate(-4deg) scale(.9)}
}
@keyframes projectDropMorph{
  0%{border-radius:58% 42% 61% 39% / 43% 58% 42% 57%}
  50%{border-radius:41% 59% 38% 62% / 60% 38% 62% 40%}
  100%{border-radius:64% 36% 52% 48% / 36% 54% 46% 64%}
}
@keyframes projectDropRipple{
  0%{transform:scale(.72);opacity:0}
  18%{opacity:.55}
  100%{transform:scale(1.18);opacity:0}
}
@media (max-width:760px){
  .projects-section:after{
    content:"";
    position:absolute;
    z-index:0;
    width:145px;
    height:190px;
    top:10%;
    right:-62px;
    pointer-events:none;
    border:1px solid rgba(255,255,255,.1);
    border-radius:57% 43% 63% 37% / 42% 60% 40% 58%;
    opacity:.25;
    background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.22),transparent 22%),linear-gradient(145deg,rgba(255,75,75,.22),rgba(53,39,166,.14));
    box-shadow:inset -18px -22px 38px rgba(0,0,0,.42),0 0 50px rgba(255,75,75,.08);
    animation:projectDropMobile 15s ease-in-out infinite alternate;
  }
  @keyframes projectDropMobile{
    0%{transform:translate3d(0,0,0) rotate(-5deg)}
    100%{transform:translate3d(-42vw,85vh,0) rotate(12deg)}
  }
}
@media (prefers-reduced-motion:reduce){
  .projects-section>.project-orbit,.projects-section>.project-orbit:before,.projects-section:after{animation:none!important}
}