.coffee-carousel{--slide-inset:clamp(24px,7vw,112px);--slide-gap:24px;margin:48px calc(-1 * var(--gutter)) 0;color:var(--ink)}
.coffee-carousel .coffee-viewport{width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:var(--slide-inset);overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--muted) var(--paper);outline-offset:-4px}
.coffee-carousel .coffee-viewport:focus-visible{outline:3px solid var(--focus)}
.coffee-carousel.is-ready .coffee-viewport{scrollbar-width:none}
.coffee-carousel.is-ready .coffee-viewport::-webkit-scrollbar{display:none}
.coffee-carousel .coffee-track{display:flex;gap:var(--slide-gap);width:100%;padding:4px var(--slide-inset);align-items:stretch}
.coffee-carousel .coffee-track::after{content:"";flex:0 0 max(0px,calc(var(--slide-inset) - var(--slide-gap)))}
.coffee-carousel .coffee-slide{flex:0 0 100%;min-width:0;display:grid;grid-template-columns:1.04fr 1fr;min-height:480px;scroll-snap-align:center;scroll-snap-stop:always;background:color-mix(in srgb,var(--ink) 5%,var(--paper));transition:opacity 160ms ease}
.coffee-carousel.is-ready .coffee-slide:not(.is-active){opacity:.55}
.coffee-carousel .coffee-slide-image{position:relative;display:flex;flex-direction:column;align-self:stretch;min-width:0;min-height:0;width:auto;height:auto;margin:0;padding:0}
.coffee-carousel .coffee-slide-image>img{position:absolute;inset:0;display:block;width:100%;height:100%;min-height:0;max-width:100%;object-fit:cover;aspect-ratio:auto}
.coffee-carousel .coffee-slide-image>figcaption{position:relative;z-index:1;display:block;margin:auto 0 0;padding:10px 18px;font:400 11px/1.6 Manrope,sans-serif;color:var(--muted);background:var(--paper);max-width:none}
.coffee-carousel .coffee-slide-image figcaption a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;margin:0;padding:0;color:inherit}
.coffee-carousel .coffee-slide-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:clamp(28px,3.3vw,48px);text-align:left}
.coffee-carousel .coffee-slide-copy h3{font:400 clamp(32px,3.3vw,48px)/1.13 Literata,serif;letter-spacing:-.03em;text-wrap:balance;max-width:18ch;margin:0;color:var(--ink)}
.coffee-carousel .coffee-place{font:400 13px/1.6 Manrope,sans-serif;color:var(--muted);margin:12px 0 0;max-width:44ch}
.coffee-carousel .cup-notes{font:400 clamp(18px,1.6vw,22px)/1.55 Manrope,sans-serif;color:var(--ink);margin:24px 0 0;max-width:30ch}
.coffee-carousel .coffee-slide-copy dl{font:400 14px/1.65 Manrope,sans-serif;align-self:stretch;margin:25px 0 20px}
.coffee-carousel .coffee-slide-copy dl>div{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;margin-top:10px}
.coffee-carousel .coffee-slide-copy dt{color:var(--muted)}
.coffee-carousel .coffee-slide-copy dd{margin:0;min-width:0;color:var(--ink)}
.coffee-carousel .coffee-slide-copy .profile-source{display:inline-flex;align-items:center;min-height:44px;font:400 13px/1.6 Manrope,sans-serif;margin-top:auto;padding:10px 0;color:var(--ink)}
.coffee-carousel .coffee-carousel-controls{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;margin:20px var(--gutter) 0;min-height:48px}
.coffee-carousel .coffee-counter{font:400 12px/1.5 Manrope,sans-serif;font-variant-numeric:tabular-nums;color:var(--muted);margin:0}
.coffee-carousel .coffee-dots{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:0}
.coffee-carousel .coffee-dots button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0;border:0;border-radius:0;background:transparent;color:var(--ink);cursor:pointer}
.coffee-carousel .coffee-dots button span{display:block;width:7px;height:7px;border-radius:999px;background:var(--muted);transition:background-color 150ms ease,transform 150ms ease}
.coffee-carousel .coffee-dots button[aria-current="true"] span{background:var(--ink);transform:scaleX(2.6)}
.coffee-carousel .coffee-dots button:hover span{background:var(--ink)}
.coffee-carousel .coffee-arrows{display:flex;justify-content:flex-end;gap:10px}
.coffee-carousel .coffee-arrows button{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:0;border-radius:50%;background:color-mix(in srgb,var(--ink) 10%,var(--paper));color:var(--ink);cursor:pointer}
.coffee-carousel .coffee-arrows button:hover{background:var(--ink);color:var(--paper)}
.coffee-carousel .coffee-arrows svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.coffee-carousel .coffee-dots button:focus-visible,.coffee-carousel .coffee-arrows button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.coffee-carousel .coffee-slide-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:1000px){
 .coffee-carousel .coffee-slide{grid-template-columns:.92fr 1fr;min-height:480px}
 .coffee-carousel .coffee-slide-copy{padding:28px}
 .coffee-carousel .coffee-slide-copy h3{font-size:34px}
 .coffee-carousel .coffee-slide-copy dl>div{grid-template-columns:66px minmax(0,1fr);gap:10px}
}
@media(max-width:700px){
 .coffee-carousel{--slide-inset:24px;--slide-gap:12px;margin-top:30px}
 .coffee-carousel .coffee-slide{grid-template-columns:1fr;grid-template-rows:auto 1fr;min-height:0}
 .coffee-carousel .coffee-slide-image{display:block}
 .coffee-carousel .coffee-slide-image>img{position:static;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
 .coffee-carousel .coffee-slide-image>figcaption{margin:0;padding:8px 18px;font-size:11px;line-height:1.6}
 .coffee-carousel .coffee-slide-copy{padding:25px 24px 22px}
 .coffee-carousel .coffee-slide-copy h3{font-size:32px;max-width:18ch}
 .coffee-carousel .coffee-place{margin-top:9px;font-size:12px}
 .coffee-carousel .cup-notes{margin-top:18px;font-size:18px;max-width:30ch}
 .coffee-carousel .coffee-slide-copy dl{margin:20px 0 16px;font-size:13px}
 .coffee-carousel .coffee-slide-copy dl>div{grid-template-columns:66px minmax(0,1fr);gap:10px;margin-top:8px}
 .coffee-carousel .coffee-carousel-controls{grid-template-columns:1fr auto;gap:8px 16px;margin-top:12px}
 .coffee-carousel .coffee-dots{grid-column:1/-1;grid-row:1}
 .coffee-carousel .coffee-counter{grid-column:1;grid-row:2}
 .coffee-carousel .coffee-arrows{grid-column:2;grid-row:2}
}
@media(max-width:380px){
 .coffee-carousel .coffee-slide-copy{padding:23px 20px 20px}
 .coffee-carousel .coffee-slide-copy h3{font-size:29px}
 .coffee-carousel .coffee-slide-image>figcaption{padding-left:16px;padding-right:16px}
 .coffee-carousel .coffee-slide-copy dl>div{grid-template-columns:61px minmax(0,1fr);gap:9px}
}
@media(prefers-reduced-motion:reduce){
 .coffee-carousel .coffee-viewport{scroll-behavior:auto}
 .coffee-carousel .coffee-slide,.coffee-carousel .coffee-dots button span{transition:none}
}