.c-anatomy.c-section--deferred{contain-intrinsic-size:auto calc(100svh + 14rem)}.c-anatomy__scroll{view-timeline-name:--anatomy}.c-anatomy__sticky{display:grid;gap:var(--space-lg);align-content:center}.c-anatomy__head{--stack-gap: var(--space-sm);text-align:center}.c-anatomy__head>*{margin-inline:auto}.c-anatomy__stage{position:relative;display:grid;place-items:center;width:min(100%,56rem,max(20rem,(100svh - var(--header-h, 4.5rem) - 16rem) * 4 / 3));margin-inline:auto;aspect-ratio:4 / 3;container-type:inline-size}.c-anatomy__can{position:relative;z-index:1;width:24cqi}.c-anatomy__can .c-can{width:100%}.c-anatomy__ingredient{position:absolute;inset-inline-start:50%;inset-block-start:50%;translate:-50% -50%;transform:translate(calc(var(--x, 0) * 1cqi),calc(var(--y, 0) * 1cqi));margin:0}.c-anatomy__media{width:clamp(3rem,15cqi,9rem);transform:rotate(var(--r, 0deg))}.c-anatomy__media img{width:100%;height:auto}.c-anatomy__line{position:absolute;inset-inline-start:50%;inset-block-start:50%;z-index:-1;width:calc(hypot(var(--x, 0),var(--y, 0))*.72cqi);height:1px;background:var(--calma-gold);transform-origin:0 50%;rotate:atan2(calc(var(--y, 0) * -1),calc(var(--x, 0) * -1))}.c-anatomy__label{position:absolute;inset-block-start:100%;inset-inline-start:50%;translate:-50% 0;width:min(11rem,28cqi);text-align:center;font-size:var(--text-xs)}.c-anatomy__label strong{display:block;font-weight:600;letter-spacing:.18em;text-transform:uppercase}.c-anatomy__label span{color:var(--fg-muted)}.c-anatomy__legend{display:none;margin:0;padding:0;list-style:none;text-align:center}.c-anatomy__note{margin-inline:auto;text-align:center;font-size:var(--text-xs);color:var(--fg-muted)}@media(prefers-reduced-motion:no-preference){.supports-scroll-timeline:not(.motion-off):not(.scroll-driven-off) .c-anatomy.c-section--deferred{contain-intrinsic-size:auto calc(220svh + 16rem)}.supports-scroll-timeline:not(.motion-off):not(.scroll-driven-off) .c-anatomy__scroll{height:220svh}.supports-scroll-timeline:not(.motion-off):not(.scroll-driven-off) .c-anatomy__sticky{position:sticky;inset-block-start:var(--header-h, 4.5rem);min-block-size:calc(100svh - var(--header-h, 4.5rem))}.supports-scroll-timeline:not(.motion-off):not(.scroll-driven-off) .c-anatomy__ingredient{animation:calma-ingredient-fly linear both;animation-timeline:--anatomy;animation-range:entry 20% cover 65%}.supports-scroll-timeline:not(.motion-off):not(.scroll-driven-off) .c-anatomy__media{animation:calma-ingredient-spin linear both;animation-timeline:--anatomy;animation-range:entry 20% cover 65%}.supports-scroll-timeline:not(.motion-off):not(.scroll-driven-off) .c-anatomy__line{animation:calma-line-draw linear both;animation-timeline:--anatomy;animation-range:cover 40% cover 65%}:is(.js:not(.motion-off):not(.supports-scroll-timeline),.js.scroll-driven-off:not(.motion-off)) .c-anatomy__ingredient{transition:transform var(--dur-slow) var(--ease-entrance),opacity var(--dur-slow) var(--ease-calma);transition-delay:calc(var(--i, 0) * var(--stagger))}:is(.js:not(.motion-off):not(.supports-scroll-timeline),.js.scroll-driven-off:not(.motion-off)) calma-reveal:defined:not(.is-revealed) .c-anatomy__ingredient{transform:scale(.4);opacity:0}}@keyframes calma-ingredient-fly{0%{transform:translate(0) scale(.4);opacity:0}}@keyframes calma-ingredient-spin{0%{transform:rotate(0)}}@keyframes calma-line-draw{0%{transform:scaleX(0)}}@media(max-width:749px){.c-anatomy__stage{aspect-ratio:1}.c-anatomy__can{width:34cqi}.c-anatomy__ingredient{transform:translate(calc(var(--xm, 0) * 1cqi),calc(var(--ym, 0) * 1cqi))}.c-anatomy__media{width:clamp(3.5rem,18cqi,5.5rem)}.c-anatomy__ingredient:nth-of-type(n+4){display:none}.c-anatomy__label,.c-anatomy__line{display:none}.c-anatomy__legend{display:grid;gap:var(--space-2xs)}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/section-can-anatomy.css.map */