/* Motion refinement: preserve the editorial composition and each product's colour. */
:root { --feel-ease:cubic-bezier(.16,1,.3,1); }
body { --page-accent:var(--lime); }
.feel-reading { position:absolute; bottom:-1px; left:0; width:100%; height:2px; background:var(--page-accent); transform:scaleX(0); transform-origin:left; pointer-events:none; }
.feel-line { display:block; overflow:clip; padding-bottom:.12em; margin-bottom:-.12em; }
.feel-line-inner { display:block; }
body.motion-enabled .feel-title .feel-line-inner { animation:feelLineIn 1.1s var(--feel-ease) var(--line-delay,0ms) both!important; }
body.motion-enabled .feel-reveal { transition:opacity .85s var(--feel-ease) var(--arrival-delay,0ms),translate .85s var(--feel-ease) var(--arrival-delay,0ms)!important; }
body.motion-enabled .feel-reveal:not(.feel-arrived) { opacity:0!important; translate:0 32px; }
body.motion-enabled .feel-reveal.feel-arrived { opacity:1; translate:0 0; }
.motion-paused .feel-reveal { opacity:1!important; translate:0 0!important; }
body.motion-enabled .feel-reveal:focus-within { opacity:1!important; translate:0 0; }
.product-cover-heading { position:relative; }
.product-cover-heading:after { content:''; position:absolute; height:1px; width:90px; left:0; bottom:-22px; background:linear-gradient(90deg,var(--accent),transparent); transform-origin:left; }
body.motion-enabled .product-cover-heading:after { animation:feelRuleIn 1.4s var(--feel-ease) .3s both!important; }
.feel-photo-stage { isolation:isolate; outline:1px solid #24332412; transform-origin:center 55%; }
body.motion-enabled .feel-photo-stage { transform:perspective(1800px) translateY(var(--scroll-depth,0px)) rotateX(var(--scroll-turn,0deg)) rotateY(var(--feel-ry,0deg)); }
.feel-photo-stage>img { transform-origin:52% 48%; }
.story-photo:has(img[src*="zusammenspiel"]),.feel-photo-stage:has(img[src*="zusammenspiel"]) { background:#f8faf7; }
.story-photo img[src*="zusammenspiel"],.feel-photo-stage>img[src*="zusammenspiel"] { object-fit:contain; transform:none!important; }
body.motion-enabled .feel-photo-stage>img[src*="zusammenspiel"] { animation:none!important; }
body.motion-enabled .feel-photo-stage>img { animation:feelPhotoDrift 18s ease-in-out infinite alternate!important; animation-play-state:paused!important; }
body.motion-enabled .feel-photo-stage.feel-in-view>img { animation-play-state:running!important; }
body.motion-enabled .feel-photo-stage.feel-arrived { animation:feelFrameIn 1.3s var(--feel-ease) both!important; }
.feel-photo-stage:after { content:''; position:absolute; inset:0; pointer-events:none; z-index:1; background:linear-gradient(0deg,#08100c45,transparent 35%); }
.feel-photo-stage:before { content:''; position:absolute; inset:0; pointer-events:none; z-index:1; background:linear-gradient(110deg,transparent 25%,#fff2 49%,transparent 75%); transform:translateX(-110%); }
body.motion-enabled .feel-photo-stage:before { animation:feelLightPass 13s ease-in-out infinite!important; animation-play-state:paused!important; }
body.motion-enabled .feel-photo-stage.feel-in-view:before { animation-play-state:running!important; }
.feel-photo-marks { position:absolute; inset:0; pointer-events:none; z-index:2; color:var(--accent); }
.feel-bracket { position:absolute; width:28px; height:28px; border-color:var(--accent); border-style:solid; opacity:.85; }
.feel-bracket-a { top:18px; left:18px; border-width:1px 0 0 1px; }
.feel-bracket-b { bottom:18px; right:18px; border-width:0 1px 1px 0; }
.feel-orbit-mark { position:absolute; left:32px; top:32px; display:grid; place-items:center; width:46px; height:46px; border:1px solid #fff5; border-radius:50%; background:#10191330; backdrop-filter:blur(8px); }
.feel-orbit-mark i { position:absolute; inset:-6px; border:1px solid transparent; border-top-color:var(--accent); border-right-color:var(--accent); border-radius:50%; }
.feel-orbit-mark b { width:3px; height:3px; background:white; rotate:45deg; }
body.motion-enabled .feel-in-view .feel-orbit-mark i { animation:feelRotate 9s linear infinite!important; }
.feel-photo-line { position:absolute; bottom:0; height:2px; left:0; width:24%; background:linear-gradient(90deg,transparent,var(--accent),transparent); }
body.motion-enabled .feel-in-view .feel-photo-line { animation:feelSignal 9s ease-in-out infinite!important; }
.feel-photo-stage .cover-caption { z-index:3; border-left:2px solid var(--accent); backdrop-filter:blur(14px); background:#121c16bc; padding:14px 19px; max-width:calc(100% - 70px); }
.feel-photo-stage .cover-badge { z-index:3; box-shadow:0 8px 24px #0c170d19; }
body.motion-enabled .feel-in-view .cover-caption { animation:feelCaptionFloat 7s ease-in-out infinite!important; }
.product-jump a,.text-link,.home-more { position:relative; }
.product-jump a:after,.text-link:after,.home-more:after { content:''; position:absolute; left:0; bottom:-7px; height:1px; width:100%; background:currentColor; transform:scaleX(0); transform-origin:left; }
body.motion-enabled :is(.product-jump a,.text-link,.home-more):after { transition:transform .5s var(--feel-ease)!important; }
:is(.product-jump a,.text-link,.home-more):is(:hover,:focus-visible):after { transform:scaleX(1); }
.product-jump a:focus-visible,.button:focus-visible,.feel-surface:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.button { position:relative; isolation:isolate; overflow:hidden; }
.button:before { content:''; position:absolute; z-index:-1; inset:0; pointer-events:none; background:linear-gradient(105deg,transparent 15%,#fff5 50%,transparent 85%); transform:translateX(-110%); }
body.motion-enabled .button:is(:hover,:focus-visible):before { animation:feelButtonSheen .7s var(--feel-ease) both!important; }
body.motion-enabled .button,.motion-enabled .service-buttons button { transition:background .3s,color .3s,box-shadow .5s var(--feel-ease),border-color .3s!important; }
body.motion-enabled .button>span:last-child { display:inline-block; transition:transform .45s var(--feel-ease)!important; transform:translate(var(--feel-x,0px),var(--feel-y,0px)); }
.button:is(:hover,:focus-visible) { box-shadow:0 9px 26px #18201018; }
body.motion-enabled .nav-contact svg,body.motion-enabled .contact-circle svg,body.motion-enabled .connected-products a>span { transition:transform .65s var(--feel-ease)!important; }
.nav-contact:is(:hover,:focus-visible) svg,.connected-products a:is(:hover,:focus-visible)>span { transform:translate(4px,-4px); }
.feel-surface { --feel-x:0px; --feel-y:0px; --feel-rx:0deg; --feel-ry:0deg; --light-x:50%; --light-y:50%; }
.rich-features>article,.tiers-grid>article,.connected-products a { position:relative; isolation:isolate; }
.rich-features>article:before,.tiers-grid>article:before,.connected-products a:before { content:''; position:absolute; inset:-1px 0 auto; height:2px; background:var(--accent,var(--lime)); transform:scaleX(0); transform-origin:left; pointer-events:none; }
body.motion-enabled :is(.rich-features>article,.tiers-grid>article,.connected-products a):before { transition:transform .7s var(--feel-ease)!important; }
:is(.rich-features>article,.tiers-grid>article,.connected-products a):is(:hover,:focus-within):before { transform:scaleX(1); }
.rich-features>article:after,.tiers-grid>article:after { content:''; position:absolute; inset:0 -14px -15px; z-index:-1; opacity:0; pointer-events:none; background:radial-gradient(ellipse at var(--light-x,50%) var(--light-y,50%),color-mix(in srgb,var(--accent,var(--lime)) 13%,transparent),transparent 75%); }
body.motion-enabled :is(.rich-features>article,.tiers-grid>article):after { transition:opacity .45s ease!important; }
.rich-features>article.feel-pointed:after,.tiers-grid>article.feel-pointed:after { opacity:1; }
body.motion-enabled .rich-features .index { display:inline-block; transition:transform .6s var(--feel-ease)!important; }
.rich-features>article:hover .index { transform:translateX(7px); }
body.motion-enabled :is(.gallery-grid>button,.healthcare-tile,.product-card) { rotate:1 0 0 var(--feel-rx,0deg); }
body.motion-enabled .gallery-grid>button>img,body.motion-enabled .product-card-visual img { transition:scale .85s var(--feel-ease)!important; }
.gallery-grid>button:is(:hover,:focus-visible)>img,.product-card:is(:hover,:focus-visible) .product-card-visual img { scale:1.035; }
.gallery-grid>button { overflow:hidden; }
body.motion-enabled .gallery-grid button b { display:inline-block; transition:transform .5s var(--feel-ease)!important; }
.gallery-grid button:is(:hover,:focus-visible) b { transform:rotate(45deg); }
body.motion-enabled .story-photo.feel-arrived { animation:feelFrameIn 1.1s var(--feel-ease) both!important; }
body.motion-enabled .rich-features>article.feel-arrived { animation:feelRuleGlow 1.8s ease var(--arrival-delay,0ms) both!important; }
.contact { position:relative; isolation:isolate; overflow:hidden; }
.contact:before,.contact:after { content:''; position:absolute; z-index:-1; width:68vw; height:68vw; right:-15vw; top:-19vw; border:1px solid #17201813; border-radius:50%; pointer-events:none; }
.contact:after { width:50vw; height:50vw; top:-10vw; right:-6vw; border-style:dashed; }
body.motion-enabled .contact.feel-in-view:after { animation:feelRotate 90s linear infinite!important; }
.contact-circle { position:relative; overflow:visible; }
.contact-circle:after { content:''; position:absolute; inset:-12px; border:1px solid #1720182b; border-radius:50%; border-right-color:transparent; border-left-color:transparent; pointer-events:none; }
body.motion-enabled .contact.feel-in-view .contact-circle:after { animation:feelRotate 14s linear infinite!important; }
body.motion-enabled .contact-circle svg { transform:translate(var(--feel-x,0px),var(--feel-y,0px)); }
.contact-circle:is(:hover,:focus-visible) svg { scale:1.12; }
body.motion-enabled .contact-circle { transition:box-shadow .6s var(--feel-ease),background .4s!important; }
.contact-circle:is(:hover,:focus-visible) { box-shadow:0 0 0 9px #1720180d,0 20px 50px #17201820; }
body.motion-enabled .osboard-collage.feel-in-view { animation:feelCollageFloat 12s ease-in-out infinite!important; }
body.motion-enabled .dc-map.feel-in-view .dc-location i { animation:feelPing 3s ease-in-out infinite!important; }
body.motion-enabled .channels.feel-in-view>span i { animation:feelPing 4s ease-in-out infinite!important; }
.channels>span:nth-child(2n) i { animation-delay:1s!important; }
.channels>span:nth-child(3n) i { animation-delay:2s!important; }
body.motion-enabled .server-stack.feel-in-view>div { animation:feelServerFloat 7s ease-in-out infinite!important; }
.server-stack>div:nth-child(2) { animation-delay:-.7s!important; }
.server-stack>div:nth-child(3) { animation-delay:-1.4s!important; }
.server-stack>div:nth-child(4) { animation-delay:-2.1s!important; }
body.motion-enabled dialog[open]::backdrop { animation:feelBackdrop .35s ease both!important; }
body.motion-enabled .service-buttons button[aria-pressed=true] { box-shadow:inset 3px 0 0 #ba90ed; }
body.motion-enabled .service-buttons button[aria-pressed=true] img { animation:feelServiceIcon .45s var(--feel-ease) both!important; }
body.motion-enabled .journey-media-layer.leaving { animation:feelMediaExit .65s ease both!important; pointer-events:none; z-index:2; }
body.motion-enabled .journey-media-layer.active { z-index:1; animation:feelMediaEnter .9s var(--feel-ease) both!important; }
.motion-paused .journey-media-layer.leaving { display:none!important; }
body.motion-enabled .motion-dock { transition:box-shadow .4s,background .4s,scale .4s var(--feel-ease)!important; }
.motion-dock:is(:hover,:focus-visible) { scale:1.035; box-shadow:0 5px 30px #a376ed26; }
/* Important declarations in this layer also override explicit motion opt-in rules. */
@layer motion-preferences {
  body.feel-tab-hidden *,body.feel-tab-hidden *:before,body.feel-tab-hidden *:after { animation-play-state:paused!important; }
  body.motion-paused *,body.motion-paused *:before,body.motion-paused *:after { animation:none!important; transition:none!important; }
}
body.motion-paused .feel-line-inner { transform:none!important; opacity:1!important; }
body.motion-paused .feel-photo-stage,body.motion-paused .feel-surface { translate:none; rotate:none; }
@keyframes feelLineIn { from{transform:translateY(115%) rotate(2deg);opacity:.2} to{transform:translateY(0) rotate(0);opacity:1} }
@keyframes feelRuleIn { from{transform:scaleX(0)} to{transform:scaleX(1)} }
@keyframes feelFrameIn { from{clip-path:inset(5% 4% 5% 4% round 10px)} to{clip-path:inset(0 round 0)} }
@keyframes feelPhotoDrift { from{scale:1.015;translate:-.3% 0} to{scale:1.065;translate:.4% -.5%} }
@keyframes feelLightPass { 0%,15%{transform:translateX(-110%)} 70%,100%{transform:translateX(110%)} }
@keyframes feelCaptionFloat { 0%,100%{translate:0 0} 50%{translate:0 -7px} }
@keyframes feelRotate { to{transform:rotate(360deg)} }
@keyframes feelSignal { 0%{transform:translateX(-110%);opacity:0} 15%,75%{opacity:1} 100%{transform:translateX(440%);opacity:0} }
@keyframes feelButtonSheen { to{transform:translateX(110%)} }
@keyframes feelRuleGlow { 0%{border-top-color:transparent} 40%{border-top-color:var(--accent,var(--lime))} 100%{border-top-color:#8c9a8c60} }
@keyframes feelCollageFloat { 0%,100%{translate:0 0;rotate:0deg} 50%{translate:0 -12px;rotate:1deg} }
@keyframes feelPing { 0%,100%{box-shadow:0 0 0 0 #b5fa5300} 50%{box-shadow:0 0 0 7px #b5fa5320} }
@keyframes feelServerFloat { 0%,100%{translate:0 0} 50%{translate:8px -5px} }
@keyframes feelBackdrop { from{opacity:0} to{opacity:1} }
@keyframes feelServiceIcon { from{transform:scale(.75) rotate(-12deg)} to{transform:scale(1) rotate(0)} }
@keyframes feelMediaExit { to{opacity:0;transform:scale(1.04)} }
@keyframes feelMediaEnter { from{opacity:.2;transform:scale(1.035)} to{opacity:1;transform:scale(1)} }
@media(max-width:760px) {
  body.motion-enabled .feel-reveal:not(.feel-arrived) { translate:0 20px; }
  body.motion-enabled .feel-photo-stage { transform:translateY(var(--scroll-depth,0px)); }
  .feel-orbit-mark { width:30px; height:30px; left:23px; top:23px; }
  .feel-orbit-mark i { inset:-4px; }
  .feel-orbit-mark b { font-size:16px; }
  .feel-bracket { width:17px; height:17px; }
  .feel-bracket-a { top:10px; left:10px; }
  .feel-bracket-b { bottom:10px; right:10px; }
  .feel-photo-stage .cover-caption { left:14px; bottom:16px; max-width:calc(100% - 38px); font-size:8px; padding:11px 13px; line-height:1.6; }
  .product-cover-heading:after { bottom:-15px; width:55px; }
  .contact:before { width:120vw; height:120vw; right:-70vw; top:0; }
  .contact:after { width:95vw; height:95vw; right:-57vw; top:13vw; }
  .contact-circle:after { inset:-7px; }
  .feel-line { overflow:visible; }
  body.motion-enabled .feel-title .feel-line-inner { animation-name:feelMobileLine!important; }
}
@keyframes feelMobileLine { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
