brew-steps{display:grid;grid-template-columns:[full-start] 1fr [content-start] min(var(--page-width),100% - var(--page-spacing) * 2) [content-end] 1fr [full-end];margin:6rem 0}brew-steps>*{grid-column:content}@media screen and (min-width: 990px){brew-steps{margin:8rem 0}.brew-steps__content{display:flex;flex-direction:row;margin-top:4rem;gap:4rem}}.brew-steps__copy-steps{display:none}@media screen and (min-width: 990px){.brew-steps__copy-steps{display:flex;flex-direction:column;gap:2rem;flex:1 0 calc(40% - (var(--page-spacing) / 2))}}.brew-steps__copy-step{display:grid;grid-template-columns:min-content 1fr;grid-template-rows:auto;grid-template-areas:"count headline" "divider copy";align-items:center;column-gap:3rem;row-gap:1.4rem;margin-bottom:1.4rem;opacity:.7;transition:opacity var(--duration-default) ease-in-out;cursor:pointer}.brew-steps__copy-step:hover{opacity:1}.copy-step__headline{position:relative;display:flex;align-items:center;list-style:none;outline:0;transition:opacity var(--duration-default) ease-in-out}.copy-step__headline:hover{opacity:.95}.copy-step__count{position:relative;grid-area:count;font-family:var(--font-space-mono);opacity:.5;transition:opacity var(--duration-default) ease-in-out}.brew-steps__copy-step.is-active .copy-step__count{opacity:.85}.copy-step__count:after{top:50%;left:50%;transform:translate(-50%,-50%);position:absolute;content:"";padding:1.4rem;border:.1rem solid currentColor;border-radius:100%;opacity:0;transition:opacity var(--duration-default) ease-in-out}.brew-steps__copy-step.is-active .copy-step__count:after{opacity:1}.copy-step__title{grid-area:headline;text-transform:uppercase;font-variation-settings:var(--sg--medium-extended);font-weight:500;font-size:unset}.copy-step__divider:empty{position:relative;display:flex;height:100%;justify-content:center}.copy-step__divider:before{grid-area:divider;content:"";height:100%;border-left:.075rem solid currentColor}.brew-steps__copy-step.is-active:last-child .copy-step__divider:after{content:"";width:100%;position:absolute;bottom:0;border-bottom:.075rem solid currentColor}.copy-step__body{display:grid;grid-template-rows:0fr;grid-area:copy;transition:grid-template-rows var(--duration-default) ease-in-out}.copy-step__body .content{max-width:60ch;font-size:1.4rem;line-height:1.4;overflow:hidden}.brew-steps__copy-step.is-active{opacity:1}.brew-steps__copy-step.is-active .copy-step__body{grid-template-rows:1fr}@media screen and (min-width: 990px){.brew-steps__track{display:flex;flex-direction:row;overflow:hidden;flex:1 0 calc(60% - (var(--page-spacing) / 2));border:.1rem solid currentColor;border-radius:1rem}}@media screen and (max-width: 989px){.brew-steps__track{grid-column:full;display:grid;grid-template-columns:inherit;padding-block:var(--page-spacing);overflow-x:scroll;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;cursor:grab;cursor:-webkit-grab;scroll-behavior:smooth}}.brew-steps__track-wrapper{display:flex;align-items:stretch;position:relative;overflow-x:scroll;scroll-snap-type:x mandatory}.brew-steps__media-entry{display:flex;flex-direction:column;flex:0 0 100%;position:relative;scroll-snap-align:center}.media-entry__copy{padding-top:1.4rem;padding-left:1.4rem;border-left:.1rem solid currentColor}@media screen and (min-width: 990px){.media-entry__copy{display:none}}.media-entry__title{text-transform:uppercase;font-variation-settings:var(--sg--medium-extended);font-weight:500;font-size:unset}.media-entry__body{line-height:1.4;margin-top:1rem}.brew-steps__media-entry video,.brew-steps__media-entry img{display:block;aspect-ratio:3/2;object-fit:cover;height:100%;width:100%}@media screen and (min-width: 990px){.media-entry__media{height:100%}}@media screen and (max-width: 989px){.brew-steps__content{display:grid;grid-column:full;grid-template-columns:[full-start] 1fr [content-start] min(var(--page-width),100% - var(--page-spacing) * 2) [content-end] 1fr [full-end]}.brew-steps__track{grid-column:full;display:grid;grid-template-columns:inherit;padding-block:var(--page-spacing);overflow-x:scroll;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;cursor:grab;cursor:-webkit-grab;scroll-behavior:smooth}.brew-steps__track-wrapper{grid-column:content;overflow-x:unset;gap:var(--page-spacing)}.brew-steps__track-wrapper:after{content:"";align-self:stretch;padding-inline-end:max(var(--page-spacing),((100vw - var(--page-width)) / 2));margin-inline-start:calc(-1 * var(--page-spacing))}.brew-steps__media-entry{min-width:none;max-width:80vw}.media-entry__media{border-radius:.8rem .8rem 0 0;border:.1rem solid currentColor;overflow:hidden}}
/*# sourceMappingURL=/cdn/shop/t/69/assets/component-product-brew-steps.css.map */