.pack{width:100%;height:auto;display:block}.pack.-ph .ph-body{fill:var(--pack-white);stroke:var(--line);stroke-width:.6px}.pack.-ph .ph-line,.pack.-ph .ph-zip{fill:var(--line)}.pack.-ph .ph-label{fill:var(--bg)}.price{font-weight:600;font-size:var(--fs-title);letter-spacing:0;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2}.price.-lg{font-size:var(--fs-h3)}.price .per{font-weight:400;font-size:var(--fs-caption);color:var(--muted);letter-spacing:var(--ls-caption);line-height:1.4;display:block}.roast{color:var(--muted);font-size:var(--fs-caption);letter-spacing:var(--ls-caption);align-items:center;gap:10px;line-height:1.4;display:flex}.roast .dots{gap:4px;display:inline-flex}.roast .dots i{background:var(--tint-3);border-radius:50%;width:8px;height:8px}.roast .dots i.on{background:var(--brand)}.notes{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.notes.-inline{color:var(--text);font-size:var(--fs-small);line-height:1.4;display:block}.grid{grid-template-columns:repeat(auto-fill,minmax(min(280px, calc(50% - var(--grid-gap) / 2)),1fr));gap:var(--grid-gap);display:grid}@media (width<=479px){.grid{grid-template-columns:1fr}}.card{border-radius:var(--r-card);background:0 0;flex-direction:column;display:flex;position:relative}.card[hidden]{display:none!important}.card__media{aspect-ratio:1;justify-content:center;align-items:center;min-height:0;padding:6%;display:flex;position:relative}.card__media .pack{object-fit:contain;object-position:center;width:100%;height:100%;max-height:100%;transition:transform var(--t-base) var(--ease);filter:drop-shadow(var(--shadow-pack-sm))}.card__media .pack.-ph{width:58%}.card__media .card__note{opacity:0;width:100%;height:100%;transition:opacity .6s var(--ease) 60ms;pointer-events:none;position:absolute;inset:0}.card__note-slice{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}@media (hover:hover) and (pointer:fine){html:not([data-notes="0"]) .card:hover .card__note,html:not([data-notes="0"]) .card:focus-within .card__note{opacity:1}}@media (prefers-reduced-motion:reduce){.card__media .card__note{transition:opacity var(--t-fast) var(--ease);transform:none}}.card__media .pack{z-index:1;position:relative}.card__media .card__mv{z-index:2;--poster-color:transparent;--progress-bar-height:0px;--progress-bar-color:transparent;pointer-events:none;opacity:0;width:88%;height:88%;transition:opacity .35s var(--ease);background:0 0;outline:none;position:absolute;inset:6%}.card__media .card__mv.-in{opacity:1}.card__media.-live-ready .pack{visibility:hidden}.card__media:focus-visible,.card:has(.card__title a:focus-visible) .card__media{box-shadow:inset 0 0 0 3px var(--ring)}.card__media:active .pack{transition-duration:.1s;transform:scale(.97)}.card__flags{z-index:1;pointer-events:none;gap:6px;display:flex;position:absolute;top:12px;left:12px}.card__body{flex-direction:column;flex:1;gap:8px;padding:14px 2px 4px;display:flex}.card__title{font-family:var(--font-body),sans-serif;font-size:var(--fs-title);letter-spacing:0;color:var(--text);text-wrap:balance;overflow-wrap:anywhere;hyphens:auto;font-weight:600;line-height:1.25}.card__title a:focus-visible{border-radius:var(--r-ctl)}.card__origin{color:var(--muted);font-size:var(--fs-small);overflow-wrap:anywhere;line-height:1.4}.card__buy{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 12px;display:flex}.card__more .btn.-block{white-space:normal;height:auto}.card__more{flex-direction:column;gap:10px;padding:10px 2px 4px;display:flex}@media (hover:hover) and (pointer:fine){.card{--sheet:12px}.card:before{content:"";inset:calc(var(--sheet) * -1);z-index:-1;border-radius:calc(var(--r-card) + var(--sheet));background:var(--bg);box-shadow:var(--shadow-sheet);opacity:0;transition:opacity var(--t-fast) var(--ease);position:absolute}.card__more{left:calc(var(--sheet) * -1);right:calc(var(--sheet) * -1);z-index:2;padding:2px calc(var(--sheet) + 2px) var(--sheet);border-radius:0 0 calc(var(--r-card) + var(--sheet)) calc(var(--r-card) + var(--sheet));background:var(--bg);box-shadow:var(--shadow-sheet-below);opacity:0;visibility:hidden;transition:opacity var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), visibility 0s var(--t-fast);margin:0;position:absolute;top:100%;transform:translateY(-6px)}.card:hover,.card:focus-within{z-index:5}.card:hover:before,.card:focus-within:before{opacity:1}.card:hover .card__more,.card:focus-within .card__more{opacity:1;visibility:visible;transition:opacity var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), visibility 0s;transform:none}.card:hover:before{clip-path:inset(-80px -80px 0)}.card__more{clip-path:inset(0 -80px -80px)}.card__more .btn.-buy:hover{background:var(--cta);color:var(--cream);animation:.45s cubic-bezier(.2,.7,.2,1) forwards btn-rings}}html[data-card=tile] .card{background:var(--media-bg);border-radius:var(--r-card);overflow:hidden}html[data-card=tile] .card__media{aspect-ratio:auto;background:0 0;border-radius:0;flex:auto;order:1;min-height:240px;padding:8px 12% 0}html[data-card=tile] .card__media .pack{max-height:260px}html[data-card=tile] .card__body{order:2;gap:6px;padding:16px 18px 18px}html[data-card=tile] .card__title{order:-2}html[data-card=tile] .card__origin{color:var(--text);opacity:.8;order:-1}html[data-card=tile] .notes.-inline,html[data-card=tile] .roast{color:var(--text)}html[data-card=tile] .roast .dots i{background:var(--bg-75)}html[data-card=tile] .roast .dots i.on{background:var(--brand)}html[data-card=tile] .price .per{color:var(--text);opacity:.75}html[data-card=tile] .seg{background:var(--bg-75)}html[data-card=tile] .card__more .btn.-secondary{background:var(--cream)}html[data-card=tile] .card__more{order:3;padding:0 18px 18px}html[data-card=tile] .card__flags{top:16px;left:auto;right:16px}html[data-card=tile] .card__flags .chip.-tag{background:var(--cream)}.card.-soon .card__media .pack{opacity:.7}