/* First Crack: a roaster's bag label, in slab type on crema and dark roast. */
body { --bg: #24120a; --fg: #ecd5ad; --display: "Alfa Slab One", serif; --body: Bitter, Georgia, serif; --strip-bg: #24120a; --strip-fg: #b98a57; --why-bg: #ecd5ad; --why-fg: #24120a; }
.buy { background: #d9381e; border: 0; color: #fff; font-family: "Alfa Slab One", serif; padding: 0.7rem 1.2rem; }
.ctl { background: none; border: 3px solid; color: inherit; font-weight: 700; padding: 0.5rem 0.9rem; }
.r-hero { display: grid; grid-template-rows: auto auto minmax(0, 1fr); height: calc(100svh - 1.8rem); min-height: 40rem; overflow: clip; padding: 0.5rem var(--gutter) 1rem; }
.r-top { display: flex; justify-content: space-between; }
.shopname { font-family: "Alfa Slab One", serif; font-size: 1.3rem; }
.cartline { font-size: 0.85rem; }
.r-hero h1 { font-family: "Alfa Slab One", serif; font-size: clamp(2.1rem, 6.4vw, 7.2rem); font-weight: 400; line-height: 0.95; margin: 0.25rem 0 1rem; }
.r-label { background: #ecd5ad; border: 6px double #24120a; color: #24120a; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(16rem, 1fr); min-height: 0; outline: 6px solid #ecd5ad; }
.r-cup { min-height: 0; position: relative; }
.r-info { align-self: end; border-inline-start: 6px double #24120a; height: 100%; padding: 1rem 1.25rem; display: flex; flex-direction: column; justify-content: flex-end; }
.r-name { font-family: "Alfa Slab One", serif; font-size: clamp(1.5rem, 2.8vw, 2.8rem); line-height: 1.05; margin: 0; }
.r-price { font-size: 2.2rem; font-weight: 700; margin: 0.25rem 0 0.75rem; }
.r-ctl { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-block-start: 0.6rem; }
.r-marble { background: #d9381e; color: #fff; padding: clamp(3rem, 7vw, 6rem) var(--gutter); }
.r-marble h2 { font-family: "Alfa Slab One", serif; font-size: clamp(2.4rem, 7vw, 7rem); font-weight: 400; line-height: 0.95; margin: 0 0 0.5rem; }
.r-marble p { margin: 0 0 1.25rem; max-width: 34rem; }
.r-marble > .gs { height: clamp(18rem, 55vh, 36rem); }
.r-marble .r-ctl { margin-block-start: 0.75rem; }
@media (max-width: 760px) { .r-hero { height: auto; } .r-label { grid-template-columns: minmax(0, 1fr); } .r-cup { height: 50vh; } .r-info { border-inline-start: 0; border-block-start: 6px double #24120a; } }
.r-hero { height: auto; min-height: calc(100svh - 1.8rem); }
.r-hero h1 { font-size: clamp(2rem, 4.6vw, 5.2rem); }
.r-label { grid-template-columns: auto minmax(16rem, 1fr); }
.r-cup { --sq: min(100svh - 12rem, 56vw); height: var(--sq); width: var(--sq); }
.r-pour { align-items: end; display: grid; gap: var(--gutter); grid-template-columns: min(34rem, 55vw) minmax(14rem, 1fr); }
.r-pour .gs { aspect-ratio: 1; height: auto; }
.r-marble .r-name { font-family: "Alfa Slab One", serif; }
.r-marble .buy { background: #24120a; }
@media (max-width: 760px) { .r-label, .r-pour { grid-template-columns: minmax(0, 1fr); } .r-cup { aspect-ratio: 1; height: auto; width: 100%; } }