@font-face { font-family: "Roastery"; src: url("./fonts/anton.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
:root {
  --rst-bg: #fdfbf6;
  --rst-surface: #ffffff;
  --rst-surface-2: #f2e8d8;
  --rst-text: #30160c;
  --rst-text-muted: #6c4c39;
  --rst-text-faint: #73543f;
  --rst-line: #e4d8c8;
  --rst-line-strong: #927b67;
  --rst-accent: #a44821;
  --rst-accent-strong: #833818;
  --rst-accent-soft: #f6e6d9;
  --rst-on-accent: #ffffff;
  --rst-radius: .3rem;
}
[shop-header] { min-height: 6rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 0 max(3rem, calc((100% - 88rem) / 2 + 3rem)); box-sizing: border-box; position: sticky; top: 0; z-index: 10; background: color-mix(in srgb, var(--rst-bg) 92%, transparent); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid color-mix(in srgb, var(--rst-text) 8%, transparent); }
[shop-basket][data-bump] [shop-basket-label] { animation: shop-bump 420ms cubic-bezier(.16, 1, .3, 1); }
@keyframes shop-bump { 30% { transform: scale(1.14); } }
[shop-basket-label] { display: inline-block; }
[shop-brand] { font-family: "Roastery", sans-serif; font-size: 2.25rem; text-transform: uppercase; color: var(--rst-text); text-decoration: none; letter-spacing: -.02em; }
[shop-basket] { display: flex; gap: .6rem; align-items: center; color: var(--rst-text); text-decoration: none; font-weight: 600; min-height: 2.75rem; }
[shop-page] { max-width: 88rem; margin: auto; }
[shop-hero] { display: grid; grid-template-columns: 1fr 1fr; background: #f2e7d7; }
[shop-hero-copy] { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 3.5rem; }
[shop-hero] h1 { font-family: "Roastery", sans-serif; font-size: clamp(3rem, 5.8vw, 6rem); font-weight: 400; line-height: 1.12; letter-spacing: -.025em; max-width: 12ch; margin: 0; text-wrap: balance; }
[shop-hero] img { display: block; width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; }
[shop-hero] a { margin-top: 2rem; }
[shop-products] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; margin: 0; padding: 3rem; list-style: none; }
[shop-product] { min-width: 0; }
[shop-product] img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: .3rem; background: #ece0ce; }
[shop-page] [rst-btn] { font-size: 1rem; padding: .75rem 1.25rem; }
[shop-product] h2 { margin: 1rem 0 .45rem; font-size: 1.125rem; line-height: 1.4; }
[shop-product] p { margin: .45rem 0; }
[shop-product] [shop-description] { color: var(--rst-text-muted); min-height: 2.75rem; font-size: .875rem; }
[shop-product] form { margin-top: 1rem; }
[shop-product] button { width: 100%; }
[shop-footer] { border-top: 1px solid var(--rst-line); margin: 0 3rem; padding: 2rem 0; color: var(--rst-text-muted); font-size: .875rem; }
[shop-cart] { padding: 3rem; }
[shop-cart] h1, [shop-return] h1 { font-family: "Roastery", sans-serif; font-size: 3rem; font-weight: 400; margin: 0 0 2rem; }
[shop-cart-layout] { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(18rem, 1fr); gap: 4rem; align-items: start; }
[shop-lines] { list-style: none; padding: 0; margin: 0; }
[shop-lines] li { display: grid; grid-template-columns: 6rem 1fr auto; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--rst-line); align-items: center; }
[shop-lines] img { width: 6rem; height: 6rem; object-fit: cover; border-radius: .25rem; }
[shop-lines] h2 { font-size: 1.125rem; margin: 0 0 .5rem; }
[shop-lines] p { margin: .5rem 0; }
[shop-summary] { padding: 2rem; background: var(--rst-surface-2); border-radius: .4rem; }
[shop-summary] [shop-total] { display: flex; justify-content: space-between; font-size: 1.3rem; gap: 1rem; margin: 0 0 2rem; }
[shop-summary] button { width: 100%; }
[shop-summary] p { font-size: .9rem; }
[shop-return] { max-width: 32rem; padding: 5rem 2rem; margin: auto; }
@media (max-width: 900px) {
  [shop-header] { padding: 0 max(1.5rem, calc((100% - 88rem) / 2 + 1.5rem)); }
  [shop-hero-copy] { padding: 2rem; }
  [shop-products] { padding: 2rem 1.5rem; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  [shop-footer] { margin: 0 1.5rem; }
  [shop-cart] { padding: 2rem 1.5rem; }
  [shop-cart-layout] { gap: 2rem; grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  [shop-header] { min-height: 5rem; gap: 1rem; }
  [shop-brand] { font-size: 1.75rem; }
  [shop-hero] { grid-template-columns: 1fr; }
  [shop-hero] h1 { max-width: 14ch; font-size: 2.8rem; }
  [shop-hero] img { aspect-ratio: 4 / 3; }
  [shop-lines] li { grid-template-columns: 4rem 1fr; gap: 1rem; }
  [shop-lines] img { width: 4rem; height: 4rem; }
  [shop-lines] li > strong { grid-column: 2; }
}
@media (prefers-reduced-motion: reduce) { [shop-basket][data-bump] [shop-basket-label] { animation: none; } }