/* Tasting catalogue */
#beers .section-heading{align-items:center;margin-bottom:22px}
#beers h2{font-size:clamp(40px,5vw,76px);letter-spacing:-.045em;line-height:1.08;margin:0}
#beers .collection-count{font-size:15px;color:#526252;margin:9px 0 0}
.pdf-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;border-bottom:1px solid;padding:4px 0;white-space:nowrap}
.catalog-bar{border-block:1px solid #c4c4ac;margin-bottom:20px}
#category-tabs{display:flex;align-items:stretch;gap:clamp(14px,1.65vw,26px);overflow-x:auto;scrollbar-width:thin}
#category-tabs button{border:0;border-bottom:2px solid transparent;background:none;padding:12px 0;color:#536453;white-space:nowrap;font:inherit;font-size:14px;cursor:pointer}
.upcoming-category {display:inline-flex;align-items:center;gap:5px;flex:none;color:#586554;font-size:14px;white-space:nowrap}
.upcoming-category small {font-size:10px;line-height:1.5;padding:1px 6px;color:#755321;background:#eae1cb;border-radius:10px}
#category-tabs button[aria-pressed=true]{border-color:#a17632;color:var(--forest);font-weight:600}
.stage {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 55% 45%;
  align-items: center;
  background: #10241d;
  color: #fff7e6;
  border-radius: 10px;
  overflow: hidden;
  touch-action: pan-y;
}
.scene-art {position:relative;align-self:center;min-width:0}
#scene-images {position:relative;width:106%;aspect-ratio:4/3;mask-image:linear-gradient(90deg,#000 64%,rgba(0,0,0,.91) 77%,transparent 100%)}
#scene-images .drink-frame,#scene-images img,#scene-images video,#scene-images canvas {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
#scene-images video{opacity:0}#scene-images video.playing{opacity:1}
.tasting-notes {position:relative;padding:clamp(22px,3vw,46px) clamp(22px,3.5vw,54px) clamp(22px,3vw,46px) clamp(12px,1.5vw,24px);min-width:0}
.variety,.measures dt,.pack-title {font-size:10px;font-weight:600;line-height:1.45;letter-spacing:.13em;text-transform:uppercase}
.variety{color:#efce8f}
#drink-name{font:700 clamp(40px,4.3vw,68px)/1.06 var(--display);letter-spacing:-.038em;margin:9px 0 16px;overflow-wrap:anywhere;color:#fff8e9}
.flavour{font-size:clamp(14px,1.12vw,17px);line-height:1.58;margin:0;color:#efeadd}
.measures{display:flex;flex-wrap:wrap;gap:10px 25px;margin:21px 0 0}
.measures dt,.pack-title{color:#bdc8b9}
.measures dd{margin:2px 0 0;font:700 30px/1.1 var(--display);color:#efcb85}
.supply{border-top:1px solid #b9c6aa45;padding-top:13px;margin-top:17px}.pack-title{margin:0}
.pack-list{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:5px 0 0;font-size:13px;line-height:1.55}
.pack-list li:not(:last-child)::after{content:'·';color:#d7b57c;margin:0 7px}
.order-link{display:inline-flex;gap:12px;align-items:center;color:#f5d18b;margin-top:20px;border-bottom:1px solid #be9a58;padding-bottom:3px;font-size:13px;font-weight:600}
.scene-controls {position:absolute;left:clamp(12px,1.6vw,25px);bottom:12px;display:flex;align-items:center;gap:2px;background:#102018df;border:1px solid #fff5;border-radius:24px;padding:2px 5px;color:#fffaee}
.scene-controls>div{display:flex}.scene-controls button{background:transparent;border:0;color:inherit;width:40px;height:38px;line-height:1;font-size:21px;cursor:pointer;border-radius:50%}.scene-controls button:hover{background:#ffffff22}
#position{padding:0 10px 0 7px;border-right:1px solid #ffffff4a;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.drink-rail {display:flex;overflow-x:auto;gap:8px;scrollbar-width:thin;min-width:0;margin-top:12px;padding-block:3px 8px}
.drink-choice {display:flex;align-items:center;gap:8px;flex:0 0 auto;border:1px solid #bdc1ad;border-radius:6px;padding:4px 12px 4px 4px;background:transparent;font:inherit;font-size:13px;color:var(--forest);cursor:pointer}
.drink-choice[aria-pressed=true]{background:var(--forest);color:#fff7e5;border-color:var(--forest)}
.drink-choice img{width:39px;height:39px;border-radius:3px;object-fit:cover}
.result-status{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;margin:0}
@media(max-width:760px){
 #beers .section-heading{align-items:flex-start;gap:8px}.pdf-link{font-size:12px}
 #category-tabs{gap:18px}.stage{grid-template-columns:1fr}
 #scene-images{width:100%;mask-image:linear-gradient(#000 77%,transparent)}
 .scene-art{position:static}
 .tasting-notes{padding:8px 22px 90px}
 .scene-controls{left:auto;right:16px;bottom:16px;z-index:3}
 .scene-controls button{width:44px;height:44px;touch-action:manipulation}
}
@media(prefers-reduced-motion:no-preference){
 .hero-copy{animation:intro-in .65s cubic-bezier(.2,.7,.2,1) backwards}.hero-art{animation:hero-in .85s cubic-bezier(.2,.7,.2,1) backwards}.hero-art img{animation:hero-zoom 1.4s ease-out both}
 .drink-choice:active{transform:scale(.97)}.belt .belt-track{display:flex;flex:none;width:max-content;gap:0;animation:belt-loop 58s linear infinite}.belt .belt-unit{display:flex;align-items:center;gap:clamp(24px,3.2vw,52px);padding-right:clamp(24px,3.2vw,52px)}
 .belt{justify-content:flex-start}.belt:hover .belt-track{animation-play-state:paused}
 @keyframes belt-loop{to{transform:translateX(-50%)}}@keyframes intro-in{from{opacity:0;transform:translateY(16px)}}@keyframes hero-in{from{opacity:0;transform:translateY(14px)}}@keyframes hero-zoom{from{transform:scale(1.055)}to{transform:scale(1)}}
}
@media(prefers-reduced-motion:reduce){.belt .belt-unit{display:flex;align-items:center;gap:32px}.belt .belt-unit+.belt-unit{display:none}}

/* The featured beer is photographed in its landscape. */
.field-cover {
  position: relative;
  isolation: isolate;
  color: #fff9e8;
  background: #384634;
  overflow: hidden;
}
.field-image, .field-cover::after {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.field-image {
  z-index: -2;
  object-fit: cover;
  object-position: center;
}
.field-motion { pointer-events: none; }
.field-cover::after {
  content: "";
  z-index: -1;
  background: linear-gradient(90deg, rgba(12,32,22,.72), rgba(17,34,24,.48) 33%, transparent 62%);
}
.field-inner {
  min-height: max(490px, 45.5vw);
  display: flex;
  align-items: center;
  padding-block: 44px;
}
.field-copy { width: min(43%,590px); }
.field-label {
  font-size: 11px;
  letter-spacing: .2em;
  font-weight: 600;
  margin: 0 0 17px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.field-label::before { content: ""; width: 33px; height: 2px; background: #f1c664; }
#featured-name {
  font: 700 clamp(48px, 5.3vw, 88px)/1.06 var(--display);
  text-transform: uppercase;
  letter-spacing: -.045em;
  margin: 0;
}
.field-style { font-weight: 600; font-size: clamp(16px,1.45vw,22px); margin: 17px 0 7px; }
.field-flavour { font-size: 15px; max-width: 340px; line-height: 1.5; margin: 20px 0 0; color: #f7f3e3; }
.field-button { background: #f0bf55; color: #153a2c; margin-top: 25px; }
@media (max-width:900px) {
  .field-inner { min-height: calc(75vw + 285px); align-items: flex-end; padding-block: 27px; }
  .field-image { object-fit: cover; object-position: right top; height: 75vw; mask-image: linear-gradient(#000 85%,transparent); }
  .field-cover::after { background: linear-gradient(0deg,#273c2f 6%,#273c2ffa 22%,#273c2fb0 40%,transparent 62%); }
  .field-copy { width: 100%; }
  #featured-name { font-size: clamp(40px,10.5vw,66px); }
  .field-label { font-size: 9px; margin-bottom: 8px; }
  .field-style { margin-top: 8px; }
  .field-flavour { font-size: 14px; margin-top: 12px; }
  .field-button { margin-top: 14px; }
}
@media (prefers-reduced-motion:no-preference) {
  .field-copy > * { animation: field-entry .62s cubic-bezier(.18,.77,.24,1) backwards; }
  .field-copy h1 { animation-delay: .06s; }
  .field-style, .field-flavour { animation-delay: .12s; }
  .field-button { animation-delay: .19s; }
  @keyframes field-entry { from { opacity:0; transform:translateY(14px); } }

}

#about .about-grid {
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: clamp(30px, 5vw, 88px);
}
.brewery-history h2 {margin: 12px 0 22px}
.brewery-history .history-lead {font-size: clamp(22px, 2vw, 32px); line-height: 1.2; margin: 0 0 12px}
.brewery-history p, .other-awards li {font-size: 16px; line-height: 1.65; color: #e2e4d5}
.brewery-history p {margin: 0; text-wrap: pretty}
.brewery-history p:not(.history-lead) + p {margin-top: 12px}
.brewery-history h3 {font: 700 clamp(25px, 2.3vw, 35px)/1.2 var(--display); margin: 26px 0 10px}
.other-awards {border-top: 1px solid #ffffff38; margin-top: 20px}
.other-awards summary {cursor: pointer; padding: 12px 0; color: #f0d399; font-weight: 600}
.other-awards ul {padding: 0; margin: 0; list-style: none}
.other-awards li {margin: 0 0 8px}
.other-awards strong {color: #f0d399; margin-right: .4em}
.award-gallery {align-self: center; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(12px,1.8vw,28px)}
.award-gallery figure {margin: 0}
.award-gallery a {display: block; padding: clamp(6px,.9vw,14px); background: #25483b; border: 1px solid #e7cc903b; cursor: zoom-in}
.award-gallery img {display: block; width: 100%; height: auto; aspect-ratio: 2/3; object-fit: contain}
.award-gallery figcaption {margin-top: 13px; font: 700 clamp(20px,2vw,30px)/1.25 var(--display)}
.award-gallery small {display: block; font: 600 12px/1.5 var(--body, sans-serif); color: #edcd90; margin-bottom: 4px}
@media (max-width: 760px) {
  #about .about-grid {grid-template-columns: 1fr; gap: 24px}
  .brewery-history h2 {margin-bottom: 16px}
}


.field-image:not(.field-motion) {filter: saturate(.976) brightness(.995)}
.city-weather {position:relative; flex:none; margin-left:-14px; color:var(--forest)}
.city-weather summary {display:flex; align-items:center; gap:8px; cursor:pointer; list-style:none; padding:7px 0 7px 18px; border-left:1px solid #d5ccb5}
.city-weather summary::-webkit-details-marker {display:none}
.city-weather summary:focus-visible {outline:2px solid #ae8137; outline-offset:5px; border-radius:3px}
.weather-icon {font-size:26px; line-height:1; width:29px; text-align:center}
.weather-reading {display:grid; gap:3px}
.weather-reading small {font-size:10px; white-space:nowrap; color:#607163}
.weather-reading strong {font-size:17px; line-height:1; font-weight:600}
.weather-popover {position:absolute; top:calc(100% + 12px); right:0; width:265px; z-index:10; padding:18px; border:1px solid #d6ccb5; border-radius:10px; background:#fffbef; box-shadow:0 10px 30px #183d3226; font-size:13px; line-height:1.5}
.weather-popover p {margin:8px 0}
.weather-popover a {display:inline-block; margin:4px 0 8px; text-decoration:underline; text-underline-offset:3px; font-size:11px}
.weather-popover small {display:block; color:#607163; font-size:11px}
@media(max-width:1050px) {
  .head-inner {gap:18px}
  .city-weather {margin-left:0}
  .weather-reading small {font-size:9px}
  .city-weather summary {padding-left:12px}
}
@media(max-width:700px) {
  .head-inner {height:auto; min-height:60px; flex-wrap:wrap; gap:7px; padding-block:10px}
  .head-inner .brand {order:0}
  .head-inner #menu-toggle {order:1; margin-left:4px; margin-right:auto}
  .city-weather {order:2}
  .head-inner > .btn {order:3; flex-basis:100%; margin:3px 0 0; min-height:33px}
  .city-weather summary {padding:0 0 0 10px; gap:6px}
  .weather-icon {font-size:22px; width:25px}
  .weather-reading strong {font-size:15px}
  .weather-popover {top:calc(100% + 10px); width:min(265px,85vw)}
}

/* The partner entry is temporarily unavailable. */
.head-inner .partner-soon {min-width:180px; cursor:default; opacity:.72}
.head-inner .partner-soon:hover, .head-inner .partner-soon:hover svg {transform:none}
/* The full-resolution product photograph never passes through the water canvas. */
.hero-products{position:absolute;z-index:-1;left:59.2%;top:17.1%;width:25.8%;pointer-events:none;line-height:0;isolation:isolate}
.hero-products img{display:block;width:100%;height:auto;filter:none}

.field-copy{position:relative;z-index:1}
.weather-reading .weather-observed{font-size:9px;line-height:1.2;color:#607163}
@media(prefers-reduced-motion:reduce){.hero-products img{animation:none}}

/* Contact shadows use the same source coordinates as the untouched HD bottles. */
.hero-grounding{position:absolute;left:0;top:0;width:100%;height:auto;overflow:visible;z-index:0;mix-blend-mode:multiply;pointer-events:none}
.hero-bottle-light{position:relative;z-index:1;isolation:isolate}
.hero-bottle-light::before{content:"";position:absolute;inset:0;pointer-events:none;-webkit-mask:url("assets/hero-bottles-hd.webp") center/100% 100% no-repeat;mask:url("assets/hero-bottles-hd.webp") center/100% 100% no-repeat}
/* Only a subtle shoulder reflection; preserve the original bottle and label brightness. */
.hero-bottle-light::before{z-index:2;background:radial-gradient(ellipse 6% 18% at 10% 34%,#ffd3a2a3,transparent),radial-gradient(ellipse 5% 22% at 39% 24%,#ffd3a280,transparent),radial-gradient(ellipse 5% 18% at 75% 33%,#ffd3a266,transparent);mix-blend-mode:soft-light;opacity:.32;animation:bottle-rim 11s ease-in-out infinite}
@keyframes bottle-rim{0%,100%{opacity:.24}50%{opacity:.42}}
@media(prefers-reduced-motion:reduce){.hero-bottle-light::before{animation:none}}

/* Reuse the exact underlying stone texture to gently occlude the bottle heels. */
.hero-rock-contact{position:absolute;inset:0;width:100%;height:auto;z-index:3;pointer-events:none;overflow:visible;filter:brightness(.72);-webkit-mask:url("assets/hero-bottles-hd.webp") center/100% 100% no-repeat;mask:url("assets/hero-bottles-hd.webp") center/100% 100% no-repeat}

/* Distribution has its own section; future items do not enter the brewery count. */
.distribution{padding-bottom:64px}
.distribution-inner{border-top:1px solid #bdc1ad;padding-top:38px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px}
.distribution h2{margin:0;font-size:clamp(40px,5vw,76px);line-height:1.08;letter-spacing:-.045em}
.distribution h2 span{color:#c89627}
.distribution-status{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;border:1px solid #cbb993;border-radius:999px;color:#816029;font-size:12px;font-weight:600}
.distribution-status::before{content:"";width:5px;height:5px;background:#b88734;border-radius:50%}
.distribution-intro p{max-width:460px;margin:14px 0 0;color:#536453;font-size:16px;line-height:1.65}
@media(max-width:760px){.distribution{padding-bottom:40px}.distribution-inner{grid-template-columns:1fr;gap:20px;padding-top:28px}.distribution-intro p{font-size:15px;margin-top:12px}}