.animation-hub-body,.animation-detail-body{color:var(--ink);background:#f6f9ff}.animation-hub-body .site-header,.animation-detail-body .site-header{position:absolute}.animation-shell{width:min(100%,88rem);padding-inline:max(clamp(1.25rem, 5vw, 5.5rem), env(safe-area-inset-left));margin-inline:auto}.animation-breadcrumbs ol{color:var(--ink-content);flex-wrap:wrap;gap:.55rem;margin:0;padding:0;font-size:.74rem;list-style:none;display:flex}.animation-breadcrumbs li+li:before{color:#001a4059;content:"/";margin-right:.55rem}.animation-breadcrumbs a{color:inherit;text-underline-offset:.22em}.animation-breadcrumbs a:hover{color:var(--blue-text)}.animation-breadcrumbs a:focus-visible,.animation-selector a:focus-visible,.animation-directory__item:focus-visible,.animation-action:focus-visible,.animation-related__links a:focus-visible,.animation-faq summary:focus-visible{outline:2px solid var(--focus);outline-offset:.3rem;border-radius:.15rem}.animation-hub-hero{min-height:min(64dvh,39rem);padding-block:calc(var(--header-height) + var(--page-opening-top)) clamp(3.75rem, 7vw, 6rem);background:radial-gradient(circle at 79% 32%, #00b4c31f, transparent 25rem), radial-gradient(circle at 20% 7%, #0068ff1c, transparent 30rem), var(--ground);position:relative;overflow:hidden}.animation-hub-hero:after{aspect-ratio:1;content:"";pointer-events:none;border:1px solid #001a4014;border-radius:50%;width:45rem;position:absolute;bottom:-25rem;right:-12rem}.animation-hub-hero__grid{z-index:1;grid-template-columns:minmax(0,1.08fr) minmax(19rem,.6fr);align-items:end;gap:clamp(3rem,10vw,10rem);display:grid;position:relative}.animation-hub-hero__copy h1,.animation-detail-hero h1{font-variation-settings:"wght" 690;letter-spacing:-.052em;margin:1.5rem 0 0;font-size:clamp(3.25rem,6vw,5.75rem);font-weight:690;line-height:.98}.animation-hub-hero__copy h1{max-width:11.5ch}.animation-hub-hero__copy>p,.animation-detail-hero__copy>p{max-width:57ch;color:var(--ink-content);margin:1.75rem 0 0;font-size:clamp(1rem,1.25vw,1.16rem);line-height:1.72}.animation-selector{border-top:1px solid #001a4038}.animation-selector a{min-height:4.25rem;color:var(--ink);border-bottom:1px solid #001a402e;grid-template-columns:minmax(0,1fr) 1.1rem;align-items:center;gap:1rem;padding-inline:.25rem;font-size:1rem;font-weight:650;text-decoration:none;transition:color .18s,background-color .18s;display:grid}.animation-selector svg,.animation-directory__action svg,.animation-action svg,.animation-related__links svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;width:1.05rem;transition:transform .18s}.animation-selector a:hover{color:var(--blue-text);background:#ffffff73}.animation-selector a:hover svg,.animation-directory__item:hover .animation-directory__action svg,.animation-action:hover svg,.animation-related__links a:hover svg{transform:translate(.25rem)}.animation-directory,.animation-section{background:#f9fbff;padding-block:clamp(4.5rem,8vw,7.5rem)}.animation-directory__heading,.animation-section__heading{grid-template-columns:minmax(0,1fr) minmax(18rem,.48fr);align-items:end;gap:3rem;padding-bottom:clamp(2rem,4vw,3.25rem);display:grid}.animation-directory h2,.animation-section h2,.animation-close h2{font-variation-settings:"wght" 675;letter-spacing:-.047em;margin:0;font-size:clamp(2.35rem,4.5vw,4.6rem);font-weight:675;line-height:1.03}.animation-directory__heading>p,.animation-section__heading>p,.animation-scope__grid>div>p,.animation-related__grid>div>p,.animation-close p{color:var(--ink-content);margin:0;font-size:1rem;line-height:1.7}.animation-directory__list{border-top:1px solid #001a4033}.animation-directory__item{color:var(--ink);border-bottom:1px solid #001a402e;grid-template-columns:minmax(19rem,.82fr) minmax(0,1fr);align-items:center;gap:clamp(2rem,7vw,7rem);padding-block:clamp(2rem,4vw,3.5rem);text-decoration:none;display:grid}.animation-directory__item:nth-child(2n) .animation-directory__media{order:2}.animation-directory__media{aspect-ratio:16/10;border-radius:var(--radius-editorial-animation);background:#edf4ff;position:relative;overflow:hidden;box-shadow:0 1.5rem 3.5rem #001a401f}.animation-picture,.animation-picture img{width:100%;height:100%;display:block}.animation-picture img{object-fit:cover;object-position:var(--animation-image-position,center);transition:transform .48s cubic-bezier(.2,.72,.2,1),filter .22s}.animation-picture--contain img{object-fit:contain}.animation-directory__item:hover .animation-picture img{filter:saturate(1.04)contrast(1.01);transform:scale(1.025)}.animation-directory__copy h3{font-variation-settings:"wght" 670;letter-spacing:-.045em;margin:0;font-size:clamp(2rem,3.4vw,3.75rem);font-weight:670;line-height:1.05}.animation-directory__copy p{max-width:50ch;color:var(--ink-content);margin:1.15rem 0 0;font-size:1rem;line-height:1.7}.animation-directory__action{min-height:3rem;color:var(--blue-text);align-items:center;gap:.75rem;margin-top:1.25rem;font-size:.83rem;font-weight:680;display:inline-flex}.animation-close{color:#fff;background:var(--ink);padding-block:clamp(4rem,8vw,7.5rem)}.animation-close__grid{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:3rem;display:grid}.animation-close h2{color:#fff;max-width:13ch}.animation-close p{color:#ffffffad;max-width:55ch;margin-top:1.25rem}.animation-action{min-height:3.25rem;color:var(--ink);justify-content:center;align-items:center;gap:.9rem;font-size:.82rem;font-weight:650;text-decoration:none;display:inline-flex}.animation-action--primary{border:1px solid var(--blue);border-radius:var(--directional-control-radius);color:#fff;background:var(--blue);padding:0 1.5rem;transition:color .18s,background-color .18s,transform .18s}.animation-action--primary:hover{background:var(--wordmark-blue)}.animation-close .animation-action--primary{color:var(--ink);background:#fff;border-color:#fff}.animation-close .animation-action--primary:hover{color:#fff;background:0 0}.animation-action--text{color:var(--blue-text);margin-top:1.25rem}.animation-detail{--animation-accent:var(--blue);--animation-accent-soft:#0068ff1c}.animation-detail--2d-animation{--animation-accent:var(--cyan);--animation-accent-soft:#00b4c321}.animation-detail--3d-animation{--animation-accent:var(--wordmark-blue);--animation-accent-soft:#0068ff1a}.animation-detail--explainer-videos{--animation-accent:#005ad8;--animation-accent-soft:#005ad81a}.animation-detail-hero{padding-block:calc(var(--header-height) + var(--page-opening-top)) clamp(4rem, 7vw, 6.75rem);background:radial-gradient(circle at 84% 20%, var(--animation-accent-soft), transparent 25rem), radial-gradient(circle at 18% 6%, #0068ff14, transparent 30rem), var(--ground);position:relative;overflow:hidden}.animation-detail-hero__grid{grid-template-columns:minmax(0,.92fr) minmax(24rem,.82fr);align-items:center;gap:clamp(3rem,8vw,8rem);display:grid}.animation-detail-hero h1{max-width:11ch}.animation-detail-hero__copy .animation-action{margin-top:2rem}.animation-detail-hero__media{aspect-ratio:4/5;border-radius:var(--radius-editorial-detail);background:#edf4ff;margin:0;overflow:hidden;box-shadow:0 1.8rem 4rem #001a4029}.animation-detail--explainer-videos .animation-detail-hero__media{background:#fff}.animation-friction{background:#f9fbff}.animation-friction__list{border-top:1px solid #001a402e;grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.animation-friction__list article{border-bottom:1px solid #001a402e;min-height:13rem;padding:2rem 2rem 2rem 0}.animation-friction__list article+article{border-left:1px solid #001a4024;padding-left:2rem}.animation-friction h3,.animation-scope h3{margin:0;font-size:1rem;line-height:1.4}.animation-friction article p,.animation-scope article p{color:var(--ink-content);margin:.8rem 0 0;font-size:.9rem;line-height:1.65}.animation-scope{background:var(--ground)}.animation-scope__grid,.animation-faq__grid,.animation-related__grid{grid-template-columns:minmax(18rem,.62fr) minmax(0,1fr);gap:clamp(3rem,9vw,9rem);display:grid}.animation-scope__grid>div>p,.animation-related__grid>div>p{margin-top:1.25rem}.animation-scope__list{border-top:1px solid #001a4033}.animation-scope__list article{border-bottom:1px solid #001a402e;grid-template-columns:minmax(10rem,.55fr) minmax(0,1fr);align-items:start;gap:2rem;min-height:6.25rem;padding-block:1.35rem;display:grid}.animation-scope__list article p{margin:0}.animation-faq{background:#f9fbff}.animation-faq h2,.animation-related h2{font-size:clamp(2rem,3.5vw,3.5rem)}.animation-faq__list{border-top:1px solid #001a4033}.animation-faq details{border-bottom:1px solid #001a402e}.animation-faq summary{min-height:4.75rem;color:var(--ink);cursor:pointer;padding:1.5rem 2.5rem 1.5rem 0;font-size:.95rem;font-weight:650}.animation-faq details p{max-width:63ch;color:var(--ink-content);margin:0;padding:0 0 1.5rem;font-size:.9rem;line-height:1.68}.animation-related{background:var(--ground)}.animation-related__links{border-top:1px solid #001a4033}.animation-related__links a{min-height:4.75rem;color:var(--ink);border-bottom:1px solid #001a402e;grid-template-columns:minmax(0,1fr) 1rem;align-items:center;gap:1rem;padding-inline:.25rem;font-size:.95rem;font-weight:650;text-decoration:none;display:grid}.animation-related__links a:hover{color:var(--animation-accent)}@media (width<=64rem){.animation-hub-hero__grid,.animation-detail-hero__grid{grid-template-columns:minmax(0,1fr) minmax(18rem,.7fr);gap:3.5rem}.animation-directory__item{gap:3rem}.animation-scope__grid,.animation-faq__grid,.animation-related__grid{gap:3.5rem}}@media (width<=48rem){.animation-hub-hero{min-height:auto;padding-block:calc(var(--header-height) + 2.25rem) 3.5rem}.animation-hub-hero__grid,.animation-detail-hero__grid,.animation-directory__heading,.animation-section__heading,.animation-close__grid,.animation-scope__grid,.animation-faq__grid,.animation-related__grid{grid-template-columns:minmax(0,1fr)}.animation-hub-hero__copy h1,.animation-detail-hero h1{font-size:clamp(2.8rem,13vw,4.35rem)}.animation-selector{margin-top:.5rem}.animation-directory,.animation-section{padding-block:4rem}.animation-directory__heading,.animation-section__heading{gap:1.25rem}.animation-directory__item,.animation-directory__item:nth-child(2n){grid-template-columns:minmax(0,1fr);gap:1.75rem;padding-block:2rem}.animation-directory__item:nth-child(2n) .animation-directory__media{order:0}.animation-directory__media{aspect-ratio:16/10}.animation-close__grid{align-items:start}.animation-close .animation-action{width:fit-content}.animation-detail-hero{padding-block:calc(var(--header-height) + 2.25rem) 3.75rem}.animation-detail-hero__media{aspect-ratio:16/11}.animation-friction__list{grid-template-columns:minmax(0,1fr)}.animation-friction__list article{min-height:auto;padding:1.5rem 0}.animation-friction__list article+article{border-left:0;padding-left:0}.animation-scope__list{margin-top:.5rem}.animation-scope__list article{grid-template-columns:minmax(0,1fr);gap:.65rem;min-height:auto}.animation-faq__list,.animation-related__links{margin-top:.5rem}}@media (width<=34rem){.animation-shell{padding-inline:max(1.25rem, env(safe-area-inset-left))}.animation-breadcrumbs ol{gap:.4rem;font-size:.69rem}.animation-breadcrumbs li+li:before{margin-right:.4rem}.animation-hub-hero__copy h1,.animation-detail-hero h1{font-size:clamp(2.55rem,12.5vw,3.6rem)}.animation-hub-hero__copy>p,.animation-detail-hero__copy>p{margin-top:1.35rem;font-size:.94rem;line-height:1.62}.animation-directory h2,.animation-section h2,.animation-close h2{font-size:clamp(2.1rem,10vw,3rem)}.animation-directory__copy h3{font-size:2rem}.animation-directory__copy p,.animation-directory__heading>p,.animation-section__heading>p,.animation-scope__grid>div>p,.animation-related__grid>div>p,.animation-close p{font-size:.9rem}.animation-directory__media,.animation-detail-hero__media{border-radius:0 2.25rem}.animation-action--primary{width:100%}}@media (prefers-reduced-motion:reduce){.animation-selector a,.animation-selector svg,.animation-directory__action svg,.animation-directory__item img,.animation-action,.animation-action svg,.animation-related__links svg{transition-duration:1ms!important}.animation-directory__item:hover .animation-picture img{transform:none}}
