/* Smoothness: fixed bars no longer blur the page behind them (that re-rendered every scroll frame).
   Near-opaque fills keep the same look. */
.site-header{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#fffffffa}
.section-navigator{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fffffff7}
.concierge-launcher{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0a0a0cfa}
.concierge-header{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0c0c0ff5}

/* Hero: motion is driven by elevate-hero.js with eased transforms, so no CSS transitions fight it. */
.hero-title-assembly span{transition:none;backface-visibility:hidden}
.v30-landing-actions{transition:none;will-change:transform,opacity}
.grid-pulse-sweep{filter:none;will-change:transform}
.v30-landing-hero-inner{contain:layout style}

/* Official social marks, optically centred in their tiles. The footer link rule (justify-content:space-between)
   was pushing every icon 13px left inside its tile. */
.social-dock a,.footer-links .social-dock a{display:grid;place-items:center;justify-content:center;align-content:center;padding:0;gap:0;min-height:0;line-height:0;border-bottom-width:1px}
.social-dock svg{display:block;fill:currentColor;stroke:none;width:19px;height:19px;margin:0}
.social-dock a[data-network=linkedin] svg{width:18px;height:18px}

/* Grid Pulse cells as GPU tiles (elevate-grid.G2.js); the sweep stops while the hero is off screen. */
.gp-cells{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;contain:strict}
.gp-cells i{position:absolute;left:0;top:0;width:var(--gp-cell,20px);height:var(--gp-cell,20px);border-radius:4px;opacity:0}
.grid-pulse.gp-offscreen .grid-pulse-sweep{animation-play-state:paused}

/* Looping decorations pause off screen (class set by elevate-hero.H2.js). */
.connection-flow.is-offscreen .connection-flow-beam{animation-play-state:paused}
/* Contact beam: move the dot with transform instead of animating left, so it never triggers layout. */
@media (prefers-reduced-motion:no-preference){
  .contact-pulse>i{container-type:inline-size}
  .contact-pulse>i:after{left:0;animation-name:contact-beam-x}
  .contact-pulse.is-offscreen>i:after{animation-play-state:paused}
}
@keyframes contact-beam-x{0%{opacity:0;transform:translateX(0)}20%,80%{opacity:1}to{opacity:0;transform:translateX(calc(100cqw - 7px))}}

/* What we work with: the site's own card carousel (light band, full-colour official marks).
   Transform-only loop, static edge fades instead of a per-frame mask, paused off screen and on hover. */
.work-with{overflow:hidden;background:#f3f3f0;color:#111;padding:clamp(4.5rem,7vw,7rem) 0;border-block:1px solid #d7d7d3}
.work-with-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,30rem);gap:clamp(1rem,4vw,5rem);align-items:end;margin-bottom:clamp(2.5rem,5vw,4.25rem)}
.work-with-heading .eyebrow{grid-column:1/-1;color:#68686d;margin:0}
.work-with-heading h2{margin:0;font-size:clamp(2.8rem,7vw,6.8rem);font-weight:720;line-height:.9;letter-spacing:-.065em;text-wrap:balance}
.work-with-heading>p:last-child{margin:0;max-width:42ch;color:#5d5d62;font-size:clamp(.96rem,1.4vw,1.12rem);line-height:1.6}
.work-with-window{position:relative;overflow:hidden;contain:paint}
.work-with-window::before,.work-with-window::after{content:"";position:absolute;top:0;bottom:0;z-index:2;width:8%;pointer-events:none}
.work-with-window::before{left:0;background:linear-gradient(90deg,#f3f3f0,rgb(243 243 240/0))}
.work-with-window::after{right:0;background:linear-gradient(270deg,#f3f3f0,rgb(243 243 240/0))}
.work-with-track{display:flex;width:max-content;padding-block:12px;animation:work-with-marquee 42s linear infinite;will-change:transform;-webkit-user-select:none;user-select:none}
.work-with.is-offscreen .work-with-track{animation-play-state:paused}
.work-with-set{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2rem);padding:0 clamp(1rem,2.2vw,2rem) 0 0;margin:0;list-style:none}
.work-with-brand{width:clamp(152px,15vw,218px);height:clamp(118px,12vw,164px);flex:0 0 auto;display:grid;place-items:center;align-content:center;gap:14px;border:1px solid #d5d5d1;border-radius:24px;background:#fff;transition:transform .35s cubic-bezier(.22,1,.36,1),border-color .25s,box-shadow .35s}
.work-with-logo{display:grid;place-items:center;width:clamp(50px,5.4vw,72px);height:clamp(50px,5.4vw,72px);transition:transform .35s cubic-bezier(.22,1,.36,1)}
.work-with-logo img{width:100%;height:100%;object-fit:contain;transform:scale(var(--s,1));-webkit-user-drag:none;pointer-events:none}
.work-with-brand strong{font:750 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.13em;text-transform:uppercase;color:#4f4f54;opacity:0;transform:translateY(5px);transition:opacity .25s,transform .3s}
@keyframes work-with-marquee{to{transform:translate3d(-50%,0,0)}}
@media(hover:hover) and (pointer:fine){
  .work-with-window:hover .work-with-track{animation-play-state:paused}
  .work-with-brand:hover{transform:translateY(-8px);border-color:color-mix(in srgb,var(--brand) 55%,#cfcfcb);box-shadow:0 20px 48px rgba(0,0,0,.09)}
  .work-with-brand:hover .work-with-logo{transform:scale(1.08)}
  .work-with-brand:hover strong{opacity:1;transform:none}
}
@media(max-width:700px){
  .work-with{padding:4.5rem 0}
  .work-with-heading{grid-template-columns:1fr;margin-bottom:3rem}
  .work-with-heading .eyebrow{grid-column:auto}
  .work-with-heading h2{font-size:clamp(3rem,15vw,5rem)}
  .work-with-window::before,.work-with-window::after{width:5%}
  .work-with-set{gap:12px;padding-right:12px}
  .work-with-track{animation-duration:34s}
  .work-with-brand{width:142px;height:118px;border-radius:18px;gap:10px}
  .work-with-logo{width:48px;height:48px}
  .work-with-brand strong{opacity:1;transform:none;font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  .work-with-window::before,.work-with-window::after{display:none}
  .work-with-track{width:100%;animation:none}
  .work-with-set{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;padding:0 clamp(1.25rem,4vw,3rem)}
  .work-with-set[aria-hidden="true"]{display:none}
  .work-with-brand{width:100%;height:132px;transform:none!important}
  .work-with-brand strong{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce) and (max-width:520px){.work-with-set{grid-template-columns:repeat(2,minmax(0,1fr))}}
