/* Entry, scroll and pointer transforms use separate elements. */
.motion-word{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.17em;margin-bottom:-.17em}.motion-word-inner{display:inline-block;transform-origin:0 100%}
.showcase-media{position:relative;perspective:1100px;isolation:isolate}.motion-image-scroll,.motion-image-pointer{position:absolute;inset:0;width:100%;height:100%;transform-origin:center}.motion-image-pointer{transform-style:preserve-3d}.motion-image-pointer img{width:100%;height:100%;object-fit:cover;transform-origin:center}
.motion-curtain{position:absolute;top:0;bottom:0;width:50.5%;z-index:2;background:var(--bg);pointer-events:none;opacity:0}.motion-curtain-left{left:0;transform-origin:left center}.motion-curtain-right{right:0;transform-origin:right center}.motion-sheen{position:absolute;inset:-20%;z-index:1;pointer-events:none;opacity:0;background:linear-gradient(115deg,transparent 25%,#ffffff12 48%,transparent 68%);mix-blend-mode:screen}
/* Scroll-controlled masks remain available for reversing the reveal. */
.motion-reveal-cover{position:absolute;inset:0;display:grid;z-index:3;pointer-events:none;opacity:0;overflow:hidden}.motion-reveal-cover>span{display:block;background:var(--bg);box-shadow:0 0 0 .6px var(--bg);transform-origin:center}.capability-scene[data-block-reveal=erase]{position:relative;isolation:isolate}.motion-erase-cover{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none;opacity:0;overflow:hidden;contain:paint}
.capability-scene{transition:border-color .35s}.capability-scene:has(.showcase-media:hover){border-color:color-mix(in srgb,var(--accent) 55%,var(--line))}.deployment-visual{perspective:900px}.guide-entry{position:relative}.guide-entry:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.16,1,.3,1);pointer-events:none}.guide-entry:hover:after,.guide-entry:focus-within:after{transform:scaleX(1)}
@media(max-width:800px),(hover:none),(pointer:coarse){.motion-sheen{display:none}.motion-image-pointer{transform:none!important}.capability-scene{transition:none}.guide-entry:after{display:none}}
@media(prefers-reduced-transparency:reduce){.motion-sheen{display:none}}
@media(prefers-reduced-motion:reduce){.motion-word{overflow:visible}.motion-word-inner,.motion-image-scroll,.motion-image-pointer,.showcase-media img{transform:none!important;opacity:1!important;filter:none!important;clip-path:none!important}.motion-curtain,.motion-sheen,.motion-reveal-cover,.motion-erase-cover{display:none!important}.guide-entry:after{transition:none}}
:root[data-motion=reduce] .motion-word{overflow:visible}:root[data-motion=reduce] .motion-word-inner,:root[data-motion=reduce] .motion-image-scroll,:root[data-motion=reduce] .motion-image-pointer,:root[data-motion=reduce] .showcase-media img{transform:none!important;opacity:1!important;filter:none!important;clip-path:none!important}:root[data-motion=reduce] .motion-curtain,:root[data-motion=reduce] .motion-sheen,:root[data-motion=reduce] .motion-reveal-cover,:root[data-motion=reduce] .motion-erase-cover{display:none!important}

/* Optical details. Text and controls stay on a crisp foreground plane. */
.fluted-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:.78;transition:opacity 1.6s cubic-bezier(.2,.6,.2,1)}.showcase-media[data-material=fluted][data-glass-clear=true] .fluted-canvas{opacity:0}
@media(min-width:801px) and (hover:hover) and (pointer:fine){.showcase-media[data-material=fluted]:hover .fluted-canvas{opacity:0}}
.showcase-media[data-material=focus] .motion-image-pointer{filter:blur(3.5px);transition:filter 1.6s cubic-bezier(.2,.6,.2,1)}.showcase-media[data-material=focus]:hover .motion-image-pointer,.showcase-media[data-material=focus]:focus-visible .motion-image-pointer,.showcase-media[data-material=focus][data-material-focus=true] .motion-image-pointer{filter:blur(0)}.showcase-media:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
/* A slow light sweep replaces the old mouse tilt. */
.showcase-media:after{content:"";position:absolute;inset:-35%;z-index:1;pointer-events:none;background:linear-gradient(110deg,transparent 32%,#ffffff18 49%,transparent 65%);transform:translateX(-85%);opacity:0;transition:transform 2.4s cubic-bezier(.2,.6,.2,1),opacity 1.2s}.showcase-media:hover:after,.showcase-media:focus-visible:after{transform:translateX(60%);opacity:.8}
.exchange-section{position:relative;isolation:isolate}.exchange-section>.exchange-heading,.exchange-section>.format-groups,.exchange-section>.media-note{position:relative;z-index:1}.liquid-field{position:absolute;inset:45px -35px 0;z-index:0;overflow:hidden;pointer-events:none}.liquid-lens{position:absolute;display:block;border:1px solid #bdcfff36;border-radius:48% 52% 61% 39%/46% 38% 62% 54%;background:radial-gradient(ellipse at 25% 18%,#e2edff33,transparent 43%),linear-gradient(145deg,#657cff24,transparent 50%,#c5deff13);box-shadow:inset 10px 12px 25px #ebf3ff11,inset -8px -15px 35px #4d68e630,0 20px 70px #0002}.lens-0{width:420px;height:300px;left:3%;top:32%;transform:rotate(-22deg)}.lens-1{width:330px;height:380px;left:39%;top:18%;border-radius:58% 42% 47% 53%/38% 59% 41% 62%;background:radial-gradient(ellipse at 30% 20%,#fff2a333,transparent 50%),linear-gradient(140deg,#8badef20,transparent 60%)}.lens-2{width:350px;height:270px;right:0;bottom:3%;transform:rotate(20deg)}
.format-groups{grid-template-columns:1.2fr .8fr 1.15fr;gap:24px}.format-group{min-width:0;padding:28px 26px 32px;border:1px solid #b8c9ed29;border-radius:18px;background:color-mix(in srgb,var(--surface) 64%,transparent);box-shadow:inset 0 1px 0 #ffffff18,0 18px 45px #00000012;backdrop-filter:blur(16px) saturate(1.1);-webkit-backdrop-filter:blur(16px) saturate(1.1)}.format-group h3{font-size:21px;line-height:1.4;margin-bottom:27px}.format-group>div>span{background:color-mix(in srgb,var(--surface) 78%,transparent);border-color:color-mix(in srgb,var(--text) 15%,transparent);font-size:12px;padding:8px 10px}
.development-credit{white-space:nowrap;color:var(--muted)}.development-credit:hover{color:var(--text)}
.brand-pointer{position:fixed;top:0;left:0;width:25px;height:25px;margin:-12.5px 0 0 -12.5px;z-index:10000;pointer-events:none;opacity:0;filter:drop-shadow(0 1px 2px #0009);contain:layout style}.brand-pointer[data-visible=true]{opacity:1}.brand-pointer>img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .65s cubic-bezier(.2,.7,.2,1)}.brand-pointer[data-intent=link]>img{transform:scale(1.25) rotate(18deg)}.brand-pointer[data-pressed=true]>img{transform:scale(.85)}
@media(min-width:801px) and (pointer:fine){:root[data-brand-cursor=on],:root[data-brand-cursor=on] *{cursor:none!important}}
@media(max-width:800px),(pointer:coarse){.showcase-media:after,.fluted-canvas,.brand-pointer{display:none}.showcase-media[data-material=focus] .motion-image-pointer{filter:blur(2px);transition-duration:1s}.showcase-media[data-material=fluted]:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:repeating-linear-gradient(90deg,#ffffff0a 0,transparent 3px,transparent 12px,#0000000b 16px);opacity:.45}.format-groups{grid-template-columns:1fr;gap:20px}.format-group{padding:25px;backdrop-filter:none;-webkit-backdrop-filter:none;background:color-mix(in srgb,var(--surface) 86%,transparent)}.liquid-field{inset:70px 0 0}.lens-0{width:270px;height:280px;left:-10%;top:30%}.lens-1{width:290px;height:320px;left:40%;top:52%}.lens-2{display:none}.development-credit{white-space:normal}}
@media(max-width:800px),(pointer:coarse){.showcase-media[data-material=fluted]:before{transition:opacity 1.6s cubic-bezier(.2,.6,.2,1)}.showcase-media[data-material=fluted] .motion-image-pointer{filter:blur(1.4px);transition:filter 1.6s cubic-bezier(.2,.6,.2,1)}.showcase-media[data-material=fluted][data-glass-clear=true]:before{opacity:0}.showcase-media[data-material=fluted][data-glass-clear=true] .motion-image-pointer{filter:blur(0)}}
@media(prefers-reduced-motion:reduce){.showcase-media[data-material=fluted]:before{display:none!important}.showcase-media[data-material=fluted] .motion-image-pointer{filter:none!important;transition:none!important}}
:root[data-motion=reduce] .showcase-media[data-material=fluted]:before{display:none!important}:root[data-motion=reduce] .showcase-media[data-material=fluted] .motion-image-pointer{filter:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.fluted-canvas,.brand-pointer,.liquid-field,.showcase-media:after{display:none!important}.showcase-media[data-material=focus] .motion-image-pointer{filter:none!important;transition:none!important}}
:root[data-motion=reduce] .fluted-canvas,:root[data-motion=reduce] .brand-pointer,:root[data-motion=reduce] .liquid-field,:root[data-motion=reduce] .showcase-media:after{display:none!important}:root[data-motion=reduce] .showcase-media[data-material=focus] .motion-image-pointer{filter:none!important;transition:none!important}
@media(forced-colors:active){.brand-pointer,.liquid-field,.fluted-canvas{display:none!important}:root[data-brand-cursor=on],:root[data-brand-cursor=on] *{cursor:revert!important}}
