@layer sections{.wc-brew{position:relative;display:block}.wc-brew__track{height:calc(var(--beats, 4) * var(--beat-vh, 100) * 1svh)}.wc-brew__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:clip;background:var(--wc-cream);isolation:isolate}.wc-brew__canvas,.wc-brew__poster{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.wc-brew__canvas{z-index:1;opacity:0;transition:opacity .4s ease}.wc-brew.is-ready .wc-brew__canvas{opacity:1}.wc-brew__poster{z-index:0}.wc-brew__veil{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;background:linear-gradient(to bottom,#2a181057,#2a181000 32%),linear-gradient(to top,#2a181080,#2a181000 46%)}.wc-brew__ui{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:grid;grid-template-rows:auto 1fr auto;align-items:start;padding-top:calc(var(--header-height, 0px) + clamp(var(--space-6),4vh,var(--space-12)));padding-bottom:calc(clamp(var(--space-6),4vh,var(--space-12)) + var(--hero-overhang, 0px));color:var(--wc-cream)}.wc-brew__ui>*{grid-column:1}.wc-brew__eyebrow{color:color-mix(in srgb,var(--wc-cream) 82%,transparent)}.wc-brew__words{position:relative;display:grid;grid-template-areas:"word";place-items:center;align-self:center;width:100%;pointer-events:none}.wc-brew__word{grid-area:word;max-width:100%;font-size:clamp(3.25rem,15vw,11rem);line-height:.88;text-align:center;text-wrap:balance;color:var(--wc-cream);text-shadow:0 10px 40px rgba(42,24,16,.45);opacity:0;translate:0 .22em;transition:opacity .5s var(--ease-out),translate .6s var(--ease-out)}.wc-brew__word.is-on{opacity:1;translate:0 0}.wc-brew__word-sub{display:block;margin-top:var(--space-3);font:italic 400 clamp(1rem,2.2vw,1.5rem)/1.3 var(--font-serif);letter-spacing:0;text-transform:none;color:color-mix(in srgb,var(--wc-cream) 88%,transparent);text-shadow:0 4px 18px rgba(42,24,16,.5)}.wc-brew__foot{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--space-4) var(--space-8);align-self:end}.wc-brew__intro{display:grid;gap:var(--space-4);justify-items:start}.wc-brew__aside{display:grid;justify-items:end;gap:var(--space-4)}@media(max-width:767px){.wc-brew__aside{justify-items:start}}.wc-brew__lead{max-width:30rem;font-size:1rem;color:color-mix(in srgb,var(--wc-cream) 88%,transparent);text-shadow:0 2px 14px rgba(42,24,16,.55)}.wc-brew__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4) var(--space-6)}.wc-brew__ctas .wc-btn{--btn-bg: var(--wc-cream);--btn-fg: var(--wc-espresso);--btn-hover: var(--wc-gold-soft);min-height:2.75rem;padding-inline:1.375rem 1.25rem;font-size:.9375rem}.wc-brew__ctas .wc-link-arrow{font-size:.9375rem}.wc-brew__ctas .wc-link-arrow{color:var(--wc-cream)}.wc-brew__steps{display:flex;gap:var(--space-2);list-style:none;padding:0;margin:0}.wc-brew__step{width:2.25rem;height:3px;border-radius:var(--radius-pill);background:color-mix(in srgb,var(--wc-cream) 32%,transparent);overflow:hidden}.wc-brew__step span{display:block;height:100%;width:0;background:var(--wc-cream)}.wc-brew__step.is-done span{width:100%}.wc-brew__step.is-on span{width:calc(var(--beat-progress, 0) * 100%)}.wc-brew__hint{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--wc-cream) 72%,transparent);transition:opacity .4s ease}.wc-brew:not(.is-start) .wc-brew__hint{opacity:0}.wc-brew__hint:after{content:"";width:1px;height:1.5rem;background:currentColor;transform-origin:top}@media(prefers-reduced-motion:no-preference){.wc-brew__hint:after{animation:wc-brew-hint 1.8s ease-in-out infinite}}@keyframes wc-brew-hint{0%,to{scale:1 .4;opacity:.4}50%{scale:1 1;opacity:1}}@media(max-width:767px){.wc-brew__foot{flex-direction:column;align-items:flex-start}.wc-brew__lead{font-size:.875rem}.wc-brew__ctas .wc-btn{min-height:2.5rem;padding-inline:1.125rem 1rem;font-size:.875rem}.wc-brew__ctas .wc-link-arrow{font-size:.875rem}}.wc-brew.is-static .wc-brew__track{height:auto}.wc-brew.is-static .wc-brew__stage{position:relative;height:auto;min-height:min(100svh,46rem)}.wc-brew.is-static .wc-brew__canvas{display:none}.wc-brew.is-static .wc-brew__ui{position:relative;min-height:inherit}.wc-brew.is-static .wc-brew__word{position:static;opacity:1;translate:none}.wc-brew.is-static .wc-brew__word:not(:first-child){display:none}.wc-brew.is-static .wc-brew__steps,.wc-brew.is-static .wc-brew__hint{display:none}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/section-hero-brew.css.map */
