.brew-guides-section{position:relative;z-index:5;overflow:hidden;padding-top:var(--brew-guides-padding-top, 96px);padding-bottom:var(--brew-guides-padding-bottom, 96px);background-color:var(--brew-guides-bg, transparent);background-image:var(--brew-guides-bg-gradient, none);color:color-mix(in srgb,rgba(var(--color-foreground)) 100%,transparent)}.brew-guides-section .brew-guides__container{width:100%;max-width:var(--brew-guides-max-width, 1400px);padding-inline:clamp(16px,4vw,32px);margin-inline:auto;position:relative;z-index:1}.brew-guides-section__svg{position:absolute;left:0;right:0;z-index:0;width:100%;line-height:0;pointer-events:none}.brew-guides-section__svg--top{top:0;transform:scaleX(-1);transform-origin:center}.brew-guides-section__svg--bottom{bottom:0}.brew-guides-section__svg svg{display:block;width:100%;height:auto;fill:var(--color)}.brew-guides-section__svg--top-simple-slope svg{transform:rotateX(180deg)}.brew-guides-section__svg--bottom-flip svg{transform:rotateX(180deg)}.brew-guides-section .guides{position:relative;color:inherit}.brew-guides-section .guide-header{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:30px}.brew-guides-section .guide-header.all-selector{flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.brew-guides-section .guide-header .right{width:100%;text-align:right}.brew-guides-section .guide-header.all-selector .right{text-align:center;display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.brew-guides-section .guide-header .right button{margin:0}.brew-guides-section .brew-guides__heading{margin:0;white-space:nowrap;text-align:center;display:flex;font-family:var(--brew-guides-heading-font-family, var(--font-heading-family));font-size:var(--brew-guides-heading-font-size-mobile, clamp(3.2rem, 7vw, 6.2rem));font-style:var(--brew-guides-heading-font-style, var(--font-heading-style));font-weight:var(--brew-guides-heading-font-weight, var(--font-heading-weight));color:var(--brew-guides-heading-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent));line-height:var(--brew-guides-heading-line-height, 1.1);letter-spacing:var(--brew-guides-heading-letter-spacing, 0);text-transform:var(--brew-guides-heading-text-transform, none)}.brew-guides-section .guides-intro{margin:0 auto 24px;max-width:760px;text-align:center;font-family:var(--brew-guides-body-font-family, var(--font-body-family));font-size:var(--brew-guides-body-font-size-mobile, calc(var(--font-body-scale) * 1.6rem));font-style:var(--brew-guides-body-font-style, var(--font-body-style));font-weight:var(--brew-guides-body-font-weight, 400);color:var(--brew-guides-body-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent));line-height:var(--brew-guides-body-line-height, 1.5);letter-spacing:var(--brew-guides-body-letter-spacing, 0);text-transform:var(--brew-guides-body-text-transform, none)}.brew-guides-section .guides-intro>*:first-child{margin-top:0}.brew-guides-section .guides-intro>*:last-child{margin-bottom:0}.brew-guides-section .guide-header button{-webkit-appearance:none;border:none;border-radius:var(--brew-guides-selector-border-radius, 1000px);cursor:pointer;padding:8px 20px;opacity:.45;transition:opacity .2s ease,color .2s ease,background-color .2s ease;background:var(--brew-guides-selector-bg, color-mix(in srgb, rgba(var(--color-background)) 100% , transparent));color:var(--brew-guides-selector-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent));font-family:var(--brew-guides-selector-font-family, var(--font-body-family));font-size:var(--brew-guides-selector-font-size-mobile, calc(var(--font-body-scale) * 1.4rem));font-style:var(--brew-guides-selector-font-style, var(--font-body-style));font-weight:var(--brew-guides-selector-font-weight, 500);line-height:var(--brew-guides-selector-line-height, 1.2);letter-spacing:var(--brew-guides-selector-letter-spacing, 0);text-transform:var(--brew-guides-selector-text-transform, none)}.brew-guides-section .guide-header button.active{opacity:1;color:var(--brew-guides-selector-active-color, var(--brew-guides-selector-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent)));background:var(--brew-guides-selector-active-bg, var(--brew-guides-selector-bg, color-mix(in srgb, rgba(var(--color-background)) 100% , transparent)))}.brew-guides-section .guide-body,.brew-guides-section .brew-timer-container{display:none}.brew-guides-section .guide-body.active,.brew-guides-section .brew-timer-container.active{display:flex}.brew-guides-section .guide-body{width:100%}.brew-guides-section .guide-video{aspect-ratio:16 / 9;width:calc(100% - 500px);margin-inline-end:18px;flex-shrink:0}.brew-guides-section .guide-video[data-video-id=""]{display:none}.brew-guides-section .guide-video .wistia_embed,.brew-guides-section .guide-video .wistia_embed>div{height:100%!important;width:100%!important}.brew-guides-section .guide-text{background:var(--brew-guides-card-bg, color-mix(in srgb, rgba(var(--color-background)) 100% , transparent));width:100%;padding:30px;display:flex;flex-direction:column}.brew-guides-section .guide-text .top{display:flex;gap:20px}.brew-guides-section .guide-text .top>div{width:50%}.brew-guides-section .guide-text .top p{margin-bottom:0;font-family:var(--brew-guides-body-font-family, var(--font-body-family));font-size:var(--brew-guides-body-font-size-mobile, calc(var(--font-body-scale) * 1.6rem));font-style:var(--brew-guides-body-font-style, var(--font-body-style));font-weight:var(--brew-guides-body-font-weight, 400);color:var(--brew-guides-step-card-text-color, var(--brew-guides-body-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent)));line-height:var(--brew-guides-body-line-height, 1.5);letter-spacing:var(--brew-guides-body-letter-spacing, 0);text-transform:var(--brew-guides-body-text-transform, none)}.brew-guides-section .guide-text .top p strong,.brew-guides-section .guide-text .bottom h4{font-family:var(--brew-guides-label-font-family, var(--font-body-family));font-size:var(--brew-guides-label-font-size-mobile, calc(var(--font-body-scale) * 1.6rem));font-style:var(--brew-guides-label-font-style, var(--font-body-style));font-weight:var(--brew-guides-label-font-weight, 600);color:var(--brew-guides-step-card-heading-color, var(--brew-guides-label-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent)));line-height:var(--brew-guides-label-line-height, 1.3);letter-spacing:var(--brew-guides-label-letter-spacing, 0);text-transform:var(--brew-guides-label-text-transform, uppercase)}.brew-guides-section .guide-text a,.brew-guides-section .grind-calc,.brew-guides-section .launch-brew-timer{text-decoration:underline;font-family:var(--brew-guides-link-font-family, var(--font-body-family));font-size:var(--brew-guides-link-font-size-mobile, calc(var(--font-body-scale) * 1.2rem));font-style:var(--brew-guides-link-font-style, var(--font-body-style));font-weight:var(--brew-guides-link-font-weight, 400);color:var(--brew-guides-step-card-link-color, var(--brew-guides-link-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent)));line-height:var(--brew-guides-link-line-height, 1.3);letter-spacing:var(--brew-guides-link-letter-spacing, 0);text-transform:var(--brew-guides-link-text-transform, none)}.brew-guides-section .guide-text .bottom{margin-top:auto;width:100%;overflow:hidden;position:relative;padding-top:20px}.brew-guides-section .guide-text .bottom h4{margin-bottom:8px}.brew-guides-section .feat-prod-slider .swiper{padding-bottom:10px}.brew-guides-section .feat-prod-slider .swiper-slide{width:auto;background:color-mix(in srgb,rgba(var(--color-background)) 100%,transparent)}.brew-guides-section .feat-prod-slider .swiper-slide img{max-width:100px;display:block}.brew-guides-section .swiper-scrollbar{left:0;width:100%;background:color-mix(in srgb,rgba(var(--color-foreground)) 20%,transparent)}.brew-guides-section .swiper-scrollbar-drag{border-radius:0;background:color-mix(in srgb,rgba(var(--color-foreground)) 100%,transparent);opacity:.4}.brew-guides-section .brew-step-action,.brew-guides-section .desktop-only{display:inline}.brew-guides-section .brew-guides-empty{padding:24px;border:1px dashed color-mix(in srgb,rgba(var(--color-foreground)) 35%,transparent)}.brew-guides-section .brew-timer-container>.container{width:100%;max-width:100%;padding-inline:0}.brew-guides-section .brew-timer{--bt-line-color: var(--brew-guides-timer-border-color, color-mix(in srgb, rgba(var(--color-foreground)) 35% , transparent));--bt-text-color: var(--brew-guides-timer-body-color, color-mix(in srgb, rgba(var(--color-foreground)) 70% , transparent));--bt-highlight-color: var(--brew-guides-timer-highlight-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent));--bt-line-width: var(--brew-guides-timer-border-width, 3px);--bt-transition: all 1s linear;--bt-items-mobile-width: 33vw;background:var(--brew-guides-timer-bg, transparent);padding:0;margin-top:18px}.brew-guides-section .brew-timer .header{text-align:center}.brew-guides-section .brew-timer .details{display:flex;text-transform:uppercase}.brew-guides-section .brew-timer .details .detail{padding:.5rem 1rem;border:1px solid var(--bt-line-color);border-left:0;color:var(--brew-guides-timer-body-color, var(--bt-text-color));background:var(--brew-guides-timer-detail-bg, transparent);flex-grow:1;text-align:center;font-family:var(--brew-guides-timer-body-font-family, "Kapra", var(--font-body-family));font-size:var(--brew-guides-timer-body-font-size-mobile, 1.25rem);font-style:var(--brew-guides-timer-body-font-style, normal);font-weight:var(--brew-guides-timer-body-font-weight, 400);line-height:var(--brew-guides-timer-body-line-height, 1.2);letter-spacing:var(--brew-guides-timer-body-letter-spacing, 0);text-transform:var(--brew-guides-timer-body-text-transform, uppercase)}.brew-guides-section .brew-timer .timer{padding-block:3rem}.brew-guides-section .brew-timer .timer .start{text-align:center}.brew-guides-section .brew-timer .timer .running{display:flex;justify-content:space-between;align-items:center}.brew-guides-section .brew-timer .timer .running h2.step{text-align:center;text-transform:var(--brew-guides-timer-heading-text-transform, uppercase);margin-bottom:.5rem;font-family:var(--brew-guides-timer-heading-font-family, "Kapra", var(--font-body-family));font-size:var(--brew-guides-timer-heading-font-size-mobile, 2.6rem);font-style:var(--brew-guides-timer-heading-font-style, normal);font-weight:var(--brew-guides-timer-heading-font-weight, 400);line-height:var(--brew-guides-timer-heading-line-height, 1.1);letter-spacing:var(--brew-guides-timer-heading-letter-spacing, 0);color:var(--brew-guides-timer-heading-color, var(--bt-highlight-color))}.brew-guides-section .brew-timer .timer .hidden{display:none}.brew-guides-section .brew-timer .timer h3{text-transform:var(--brew-guides-timer-heading-text-transform, uppercase);font-family:var(--brew-guides-timer-heading-font-family, "Kapra", var(--font-body-family));font-size:var(--brew-guides-timer-heading-font-size-mobile, 3rem);font-style:var(--brew-guides-timer-heading-font-style, normal);font-weight:var(--brew-guides-timer-heading-font-weight, 400);line-height:var(--brew-guides-timer-heading-line-height, 1.1);letter-spacing:var(--brew-guides-timer-heading-letter-spacing, 0);text-align:center;color:var(--brew-guides-timer-heading-color, var(--bt-highlight-color))}.brew-guides-section .brew-timer .timer h3 small{color:var(--brew-guides-timer-body-color, var(--bt-text-color));font-family:var(--brew-guides-timer-body-font-family, "Kapra", var(--font-body-family));font-size:var(--brew-guides-timer-body-font-size-mobile, 1.5rem);font-style:var(--brew-guides-timer-body-font-style, normal);font-weight:var(--brew-guides-timer-body-font-weight, 400);line-height:var(--brew-guides-timer-body-line-height, 1.2);letter-spacing:var(--brew-guides-timer-body-letter-spacing, 0);text-transform:var(--brew-guides-timer-body-text-transform, uppercase)}.brew-guides-section .brew-timer .timer button{border:1px solid var(--brew-guides-timer-button-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent));color:var(--brew-guides-timer-button-color, color-mix(in srgb, rgba(var(--color-foreground)) 100% , transparent));padding:.5rem 3rem;background:var(--brew-guides-timer-button-bg, transparent);border-radius:2rem;display:block;font-family:var(--brew-guides-timer-button-font-family, "Andale Mono", var(--font-body-family));font-size:var(--brew-guides-timer-button-font-size-mobile, 1rem);font-style:var(--brew-guides-timer-button-font-style, normal);font-weight:var(--brew-guides-timer-button-font-weight, 400);line-height:var(--brew-guides-timer-button-line-height, 1.2);letter-spacing:var(--brew-guides-timer-button-letter-spacing, 0);text-transform:var(--brew-guides-timer-button-text-transform, none);cursor:pointer;transition:var(--bt-transition)}.brew-guides-section .brew-timer .timer button:hover{border-color:var(--brew-guides-timer-button-hover-color, var(--bt-highlight-color));color:var(--brew-guides-timer-button-hover-color, var(--bt-highlight-color));background:var(--brew-guides-timer-button-hover-bg, var(--brew-guides-timer-button-bg, transparent))}.brew-guides-section .brew-timer .timer button.start{margin-inline:auto;margin-block:1rem 3rem}.brew-guides-section .brew-timer .timer button.pause{padding-inline:1rem;border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;background:var(--brew-guides-timer-button-bg, var(--bt-highlight-color));border:0;color:var(--brew-guides-timer-button-color, color-mix(in srgb, rgba(var(--color-background)) 100% , transparent))}.brew-guides-section .brew-timer .timer button.pause:hover{background:var(--brew-guides-timer-button-hover-bg, var(--text-color, color-mix(in srgb, rgba(var(--color-foreground-2)) 100% , transparent)));color:var(--brew-guides-timer-button-hover-color, color-mix(in srgb, rgba(var(--color-background)) 100% , transparent))}.brew-guides-section .brew-timer .timer button.restart{padding-inline:1rem;border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.brew-guides-section .brew-timer .timeline{position:relative;margin-block-start:3rem;overflow:hidden}.brew-guides-section .brew-timer .timeline .events ul{display:flex;flex-direction:row;justify-content:space-between;gap:1rem;border-top:var(--bt-line-width) solid var(--bt-line-color);padding-block-start:3rem}.brew-guides-section .brew-timer .timeline .events .step.active{color:var(--brew-guides-timer-step-active-color, var(--bt-highlight-color))}.brew-guides-section .brew-timer .timeline .events li{display:flex;position:relative;flex-direction:column;flex:1 1 0;text-align:center;text-transform:uppercase;font-family:var(--brew-guides-timer-body-font-family, "Kapra", var(--font-body-family));font-size:var(--brew-guides-timer-body-font-size-mobile, 1.25rem);font-style:var(--brew-guides-timer-body-font-style, normal);font-weight:var(--brew-guides-timer-body-font-weight, 400);color:var(--brew-guides-timer-body-color, var(--bt-text-color));line-height:var(--brew-guides-timer-body-line-height, 1.2);letter-spacing:var(--brew-guides-timer-body-letter-spacing, 0);text-transform:var(--brew-guides-timer-body-text-transform, uppercase);text-wrap:balance}.brew-guides-section .brew-timer .timeline .events li:before{content:"";position:absolute;z-index:2;width:0;height:0;border-left:1rem solid transparent;border-right:1rem solid transparent;border-top:1.5rem solid var(--bt-line-color);top:calc(-2.85rem - var(--bt-line-width));left:calc(50% - 1rem);transition:var(--bt-transition)}.brew-guides-section .brew-timer .timeline .events li.active:before{border-top-color:var(--bt-highlight-color)}.brew-guides-section .brew-timer .timeline .filling-line{--bt-line-padding: calc((100% - (var(--steps) - 1) * 1rem) / var(--steps) / 2);position:absolute;top:0;right:0;bottom:0;left:0;height:var(--bt-line-width);width:calc(100% - 2 * var(--bt-line-padding));left:calc(var(--bt-line-padding));background-color:var(--bt-highlight-color);transform:scaleX(0);transform-origin:left center;transition:var(--bt-transition)}.brew-guides-section .brew-timer .timeline .pre-line{--bt-line-padding: calc((100% - (var(--steps) - 1) * 1rem) / var(--steps) / 2);position:absolute;top:0;right:0;bottom:0;height:var(--bt-line-width);width:var(--bt-line-padding);left:0;background-color:var(--bt-highlight-color);transform:scaleX(0);transform-origin:left center;transition:all .4s ease}.brew-guides-section .brew-timer .timeline .pre-line.active{transform:scaleX(1)}@media(min-width:40rem){.brew-guides-section .brew-timer .details .detail:last-child{border-right:0}.brew-guides-section .brew-timer .timeline .events li{padding-inline:2rem}}@media(max-width:800px){.brew-guides-section .brew-timer .details .detail{border:1px solid var(--bt-line-color);font-size:.95rem}}@media(max-width:40rem){.brew-guides-section .brew-timer .details{flex-direction:row;flex-wrap:wrap}.brew-guides-section .brew-timer .details .detail{border:1px solid var(--bt-line-color)}.brew-guides-section .brew-timer .timer .running{flex-wrap:wrap}.brew-guides-section .brew-timer .timer .running .info{flex-basis:100%;order:-1;margin-block-end:2rem}.brew-guides-section .brew-timer .timeline{margin-block-start:2rem}.brew-guides-section .brew-timer .timeline .events{overflow:auto hidden;scrollbar-width:none;position:relative;scroll-behavior:smooth}.brew-guides-section .brew-timer .timeline .events ul{width:calc(33vw * (var(--steps) + 1))}.brew-guides-section .brew-timer .timeline .events li{flex-shrink:0;flex-basis:var(--bt-items-mobile-width)}.brew-guides-section .brew-timer .timeline .filling-line{width:calc(var(--bt-items-mobile-width) * var(--steps));left:calc(var(--bt-items-mobile-width) / 2)}.brew-guides-section .brew-timer .timeline .pre-line{width:calc(var(--bt-items-mobile-width) / 2)}}@media(min-width:992px){.brew-guides-section .brew-guides__heading{font-size:var(--brew-guides-heading-font-size-desktop, clamp(4.2rem, 5vw, 7.2rem))}.brew-guides-section .guide-header button{font-size:var(--brew-guides-selector-font-size-desktop, calc(var(--font-body-scale) * 1.4rem))}.brew-guides-section .guide-text .top p,.brew-guides-section .guides-intro{font-size:var(--brew-guides-body-font-size-desktop, calc(var(--font-body-scale) * 1.6rem))}.brew-guides-section .guide-text .top p strong,.brew-guides-section .guide-text .bottom h4{font-size:var(--brew-guides-label-font-size-desktop, calc(var(--font-body-scale) * 1.6rem))}.brew-guides-section .guide-text a,.brew-guides-section .grind-calc,.brew-guides-section .launch-brew-timer{font-size:var(--brew-guides-link-font-size-desktop, calc(var(--font-body-scale) * 1.2rem))}.brew-guides-section .brew-timer .timer h3,.brew-guides-section .brew-timer .timer .running h2.step{font-size:var(--brew-guides-timer-heading-font-size-desktop, var(--brew-guides-timer-heading-font-size-mobile, 3rem))}.brew-guides-section .brew-timer .details .detail,.brew-guides-section .brew-timer .timeline .events li,.brew-guides-section .brew-timer .timer h3 small{font-size:var(--brew-guides-timer-body-font-size-desktop, var(--brew-guides-timer-body-font-size-mobile, 1.25rem))}.brew-guides-section .brew-timer .timer button{font-size:var(--brew-guides-timer-button-font-size-desktop, var(--brew-guides-timer-button-font-size-mobile, 1rem))}}@media screen and (max-width:900px){.brew-guides-section .guide-body{flex-wrap:wrap}.brew-guides-section .guide-video{width:100%;margin-right:0;margin-bottom:12px}.brew-guides-section .guide-header{flex-wrap:wrap;margin-bottom:12px}.brew-guides-section .guide-header .right{text-align:center;width:100%;white-space:nowrap;overflow-x:auto;overflow-y:hidden}.brew-guides-section .guide-header .right button{white-space:nowrap;display:inline-block;margin-inline:4px}.brew-guides-section .guide-header.all-selector .right{white-space:normal;overflow:visible;justify-content:center}.brew-guides-section .brew-guides__heading{width:100%;justify-content:center;margin-bottom:12px;white-space:normal;text-align:center}.brew-guides-section .guide-text{width:100%;padding:18px}.brew-guides-section .guide-text .top{justify-content:space-between;gap:12px}.brew-guides-section .guide-text .top>div{width:calc(50% - 6px)}.brew-guides-section .brew-step-action{display:block;font-size:12px;line-height:1;margin-bottom:10px}.brew-guides-section .desktop-only{display:none}}@media screen and (max-width:640px){.brew-guides-section .brew-guides__container{padding-inline:16px}.brew-guides-section .brew-guides__heading{width:100%;justify-content:center;text-align:center}.brew-guides-section .guide-header.all-selector .right{width:100%;display:flex;justify-content:center;gap:8px}.brew-guides-section .brew-timer{margin-top:14px}.brew-guides-section .brew-timer .timer{padding-block:2rem 1.5rem}.brew-guides-section .brew-timer .timer h3{font-size:2.2rem}.brew-guides-section .brew-timer .timer button.start{margin-block:.75rem 2rem}.brew-guides-section .brew-timer .timeline .events li{font-size:1rem}.brew-guides-section .brew-timer .timeline .events li:before{border-left-width:1.5rem;border-right-width:1.5rem;border-top-width:2rem;top:-3rem;left:calc(50% - 1.5rem)}}@media screen and (max-width:700px){.brew-guides-section .guide-text .top{flex-direction:column}.brew-guides-section .guide-text .top>div{width:100%}}.brew-guides-section .feat-prod-slider .swiper-wrapper{display:flex;gap:12px;overflow-x:auto}.brew-guides-section .feat-prod-slider .swiper-slide{flex-shrink:0}
/*# sourceMappingURL=/cdn/shop/t/3/assets/section-brew-guides.css.map */