@charset "UTF-8";
:root{color-scheme:dark;--bg:#171615;--ink:#f7f2ea;--muted:#c4baad;--gold:#f3ba56;--border:#403830;--panel:#221e1a;--display:Bahnschrift,"Arial Narrow","Segoe UI",sans-serif;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:6rem}
body{margin:0;background:var(--bg);color:var(--ink);line-height:1.55}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.5}
:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
img{display:block;max-width:100%}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--display);line-height:1.05}
h2{font-size:clamp(2.1rem,4.5vw,4rem);letter-spacing:-.045em}
h3{letter-spacing:-.025em}
.wrap{width:min(100% - 5rem,1250px);margin-inline:auto}
.section{padding-block:5.5rem}
.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip:focus{position:fixed;z-index:10;background:var(--gold);color:#171615;padding:1rem}
.header{position:sticky;top:0;z-index:3;background:#161514;border-bottom:1px solid var(--border)}
.header-inner{height:76px;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.brand{display:inline-flex;gap:.65rem;align-items:center;flex-shrink:0;font:800 1rem/1.05 var(--display);letter-spacing:.065em}
.brand small{display:block;margin-top:.35rem;font:700 .57rem/1 system-ui,sans-serif;letter-spacing:.2em;color:var(--gold)}
.header nav{display:flex;gap:clamp(1rem,3vw,2.5rem);font-size:.875rem;font-weight:650;color:var(--muted)}
.header nav a:hover,.text-link:hover,.footer a:hover{color:var(--gold)}
.cart-button,.button{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;min-height:46px;padding:.65rem .95rem;border:1px solid var(--border);border-radius:4px;background:transparent;color:var(--ink);font-size:.875rem;font-weight:750}
.button:hover,.cart-button:hover{border-color:var(--gold)}
.cart-button svg,.search svg{width:19px;fill:none;stroke:currentColor;stroke-width:1.6}
.cart-button span{display:grid;place-items:center;min-width:23px;height:23px;border-radius:100px;background:var(--gold);color:#20170d;padding-inline:4px;font-size:.75rem}
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:560px;display:flex;align-items:center;background:#1d1814}
.hero-image{position:absolute;inset:0 0 0 38%;z-index:-1}
.hero-image img{width:100%;height:100%;object-fit:cover;object-position:50% 57%;filter:brightness(.82)}
.hero-image::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#1d1814 1%,rgba(29,24,20,.85) 18%,transparent 57%),linear-gradient(0deg,#1d1814 1%,transparent 27%)}
.hero-inner{padding-block:5.3rem 6rem}
.eyebrow{display:flex;gap:.6rem;align-items:center;font-weight:800;font-size:.69rem;letter-spacing:.16em;color:var(--gold);margin-bottom:1rem}
.line{width:22px;height:1px;background:currentColor}
.hero h1{max-width:700px;font-size:clamp(3.2rem,7.5vw,7.1rem);font-weight:850;letter-spacing:-.065em;line-height:.93}
.hero em{display:block;color:var(--gold);font-style:normal}
.hero-copy{font-size:clamp(1rem,1.8vw,1.16rem);max-width:445px;color:var(--muted);margin-top:1.4rem}
.actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.65rem}
.primary{color:#211709;background:var(--gold);border-color:var(--gold)}
.primary:hover{background:#ffd183}
.primary:focus-visible,.dark:focus-visible{outline-color:var(--ink)}
.secondary{background:#171615bb;border-color:#78664e}
.hero-caption{position:absolute;right:max(2.5rem,calc((100% - 1250px)/2));bottom:1.1rem;color:#f3dbb5;font-size:.7rem;letter-spacing:.08em}
.hero-caption span{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold);margin-right:.4rem}
.quick{border-block:1px solid var(--border);background:#211d19}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--border)}
.quick a{min-width:0;padding:1.12rem 1.15rem;border-right:1px solid var(--border)}
.quick a:hover{background:#31271d}
.quick small{color:var(--gold);font-size:.61rem;font-weight:800;letter-spacing:.12em}
.quick strong{display:flex;justify-content:space-between;align-items:center;gap:.25rem;font-family:var(--display);font-size:clamp(.95rem,1.8vw,1.25rem);margin-top:.3rem}
.quick strong span{color:var(--gold)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:1.8rem}
.section-heading>p{color:var(--muted);max-width:315px}
.catalog-controls{display:flex;justify-content:space-between;align-items:start;gap:1rem;border-top:1px solid var(--border);padding-top:1rem}
.filters{display:flex;flex-wrap:wrap;gap:.45rem}
.filters button{color:var(--muted);background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:.55rem .7rem;min-height:42px;font-size:.82rem;font-weight:700}
.filters button[aria-pressed=true]{color:#20170d;background:var(--gold);border-color:var(--gold)}
.filters button:hover{border-color:var(--gold)}
.search{display:flex;align-items:center;gap:.5rem;border:1px solid var(--border);background:var(--panel);color:var(--muted);border-radius:4px;padding:0 .6rem;min-width:215px}
.search input{background:none;border:0;min-width:0;width:100%;color:var(--ink);height:40px;font-size:.875rem}
.result-count{min-height:1.3rem;color:var(--muted);font-size:.85rem;margin-block:1rem .65rem}
.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.product{display:flex;flex-direction:column;min-height:158px;padding:1rem;background:var(--panel);border:1px solid var(--border);border-radius:5px}
.product small{color:var(--gold);font-size:.62rem;letter-spacing:.105em;text-transform:uppercase;font-weight:800}
.product h3{font-size:1.16rem;margin:.55rem 0 .3rem}
.product p{color:var(--muted);font-size:.83rem}
.product-foot{display:flex;align-items:center;justify-content:space-between;gap:.4rem;margin-top:auto;padding-top:.9rem}
.product-foot strong{font-size:1.02rem;font-variant-numeric:tabular-nums}
.add{min-height:38px;border:1px solid #9d7748;border-radius:4px;background:#332719;color:#ffd690;font-size:.77rem;font-weight:760;padding:.35rem .55rem}
.add:hover{background:var(--gold);color:#211709}
.more{margin:1.15rem auto 0;display:flex;width:fit-content}
.hop-guide{border:1px solid var(--border);border-radius:4px;margin-top:1.5rem;padding:.85rem 1rem;color:var(--muted)}
.hop-guide summary{cursor:pointer;font-weight:700;color:var(--ink)}
.hop-guide p{max-width:830px;margin-top:.65rem}
.hop-guide .sources{font-size:.78rem}
.hop-guide a,.text-link{color:#ffd082;text-decoration:underline;text-underline-offset:.2em}
.service-section{background:#24201c;border-block:1px solid var(--border)}
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.service{display:flex;flex-direction:column;padding:1.3rem;border:1px solid var(--border);border-top-color:#a17a4a;border-radius:4px;background:#1b1815}
.service-index{font:800 1.35rem var(--display);color:var(--gold);margin-bottom:1.2rem}
.service h3{font-size:1.45rem}
.service p{color:var(--muted);margin:.65rem 0 1rem}
.text-link{margin-top:auto;font-size:.875rem;font-weight:750}
.rentals{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.25rem,5vw,5rem);align-items:center}
.rental-photo{height:clamp(290px,35vw,425px);overflow:hidden;background:#271b11;border:1px solid var(--border);border-radius:4px}
.rental-photo img{height:100%;width:100%;object-fit:cover;object-position:center 67%}
.rental-text>p:not(.eyebrow){color:var(--muted);margin:1rem 0}
.rental-price strong{color:var(--gold);font-size:1.65rem}
.contact{background:var(--gold);color:#24190e}
.contact-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:2.7rem}
.contact .eyebrow{color:#503719}
.contact h2{font-size:clamp(2rem,4vw,3.5rem)}
.contact p:last-child{margin-top:.55rem}
.dark{background:#211910;border-color:#211910;color:#fff3dc;white-space:nowrap}
.footer{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;padding-block:1.45rem;font-size:.8rem;color:var(--muted)}
dialog{position:fixed;inset:0 0 0 auto;margin:0;width:min(100%,470px);max-width:100%;height:100dvh;max-height:100dvh;padding:1.25rem;background:#1d1a17;border:0;border-left:1px solid var(--border);color:var(--ink)}
dialog::backdrop{background:#100d0bc2}
body:has(dialog[open]){overflow:hidden}
.cart-header,.cart-total{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.cart-header h2{font-size:2.55rem}
.cart-header .eyebrow{margin-bottom:.4rem}
.close,.qty button{border:1px solid var(--border);background:var(--panel);color:var(--ink);border-radius:4px;min-width:38px;min-height:38px}
.close{font-size:1.5rem}
#cart-empty{margin-block:1.2rem;color:var(--muted)}
#cart-lines{list-style:none;margin:1rem 0;padding:0}
.cart-item{display:grid;grid-template-columns:1fr auto;gap:.55rem;padding:.8rem 0;border-top:1px solid var(--border)}
.cart-item p{color:var(--muted);font-size:.82rem}
.qty{display:flex;align-items:center;gap:.5rem}
.cart-total{border-top:1px solid var(--border);padding-top:1rem}
.cart-total strong{color:var(--gold);font-size:1.35rem}
.cart-notice{color:var(--muted);font-size:.84rem;margin:.5rem 0 1rem}
#checkout label{font-weight:650;font-size:.9rem}
#order-note{display:block;width:100%;resize:vertical;border:1px solid var(--border);border-radius:4px;padding:.6rem;background:var(--bg);color:var(--ink);margin:.4rem 0 .8rem}
#send-order,#continue-shopping{width:100%;margin-bottom:.65rem}
.toast{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);z-index:4;width:max-content;max-width:calc(100% - 2rem);padding:.65rem 1rem;background:var(--gold);color:#211709;border-radius:4px;font-size:.87rem;font-weight:700;box-shadow:0 4px 24px #0008}
.toast:empty{display:none}
@media(max-width:1050px){.catalog-controls{flex-wrap:wrap}.hero h1{max-width:650px}}
@media(max-width:800px){
  .wrap{width:calc(100% - 2rem)}.section{padding-block:3.5rem}
  .header-inner{height:auto;min-height:66px;flex-wrap:wrap;gap:0;padding-block:.4rem}
  .header nav{order:3;justify-content:space-between;width:100%;padding:.4rem 0 .2rem;gap:.6rem}
  .hero{min-height:520px}.hero-inner{padding-block:4rem}.hero-caption{right:1rem}
  .products{grid-template-columns:repeat(3,minmax(0,1fr))}
  .section-heading{align-items:start;flex-direction:column;gap:.8rem}
  .rental-photo{height:320px}
}
@media(max-width:570px){
  html{scroll-padding-top:7rem}
  .hero{min-height:0;display:block}.hero-inner{padding:2.3rem 0 1.55rem}.hero h1{font-size:clamp(2.8rem,12.1vw,4rem)}
  .hero-image{position:relative;inset:auto;height:225px;float:none;display:block;margin-bottom:-.75rem}
  .hero-image img{object-position:50% 66%}
  .hero-image::after{background:linear-gradient(0deg,#1d1814 0%,transparent 40%)}
  .hero-caption{top:11.8rem;bottom:auto;font-size:.61rem}
  .actions{gap:.5rem}.actions .button{font-size:.79rem;gap:.4rem}
  .quick-grid,.products{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quick a{padding:.65rem .65rem}.quick a:nth-child(-n+2){border-bottom:1px solid var(--border)}
  .catalog-controls,.search{width:100%}
  .product{padding:.7rem;min-height:147px}.product h3{font-size:1.04rem}.product-foot strong{font-size:.92rem}
  .add{padding-inline:.4rem}
  .service-grid,.rentals{grid-template-columns:1fr}
  .rental-photo{height:230px}
  .contact-inner,.footer{align-items:start;flex-direction:column}
}
@media(max-width:355px){.product-foot{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}#message-copy{display:block;width:100%;margin:.4rem 0 .8rem;padding:.6rem;background:var(--bg);color:var(--ink);border:1px solid var(--border);border-radius:4px}

.brew-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-bottom:4rem}
.brew-card{display:grid;grid-template-columns:30% 1fr;overflow:hidden;border:1px solid var(--border);border-radius:4px;background:#201c18}
.brew-card img{height:100%;width:100%;min-height:180px;object-fit:cover;object-position:50% 65%}
.brew-card>div{padding:1.15rem}
.brew-card .eyebrow{margin-bottom:.55rem}
.brew-card h3{font-size:clamp(1.15rem,2vw,1.6rem)}
.brew-card p:not(.eyebrow){font-size:.88rem;color:var(--muted);margin:.6rem 0}
.rental-photo img{object-position:50% 50%}
@media(max-width:800px){.brew-pair{grid-template-columns:1fr;margin-bottom:3.5rem}}
@media(max-width:355px){.brew-card{grid-template-columns:1fr}.brew-card img{height:155px;min-height:0}}
