/*
Theme Name: 192 Brewing Keg Room Beta
Version: 23.0
Description: Mobile-first brewery brand site using cropped keg artwork from approved prototype.
*/
:root{--gold:#f6c600}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#090909;color:#fff;font-family:Arial,Helvetica,sans-serif}body:before{content:"";position:fixed;inset:0;background:linear-gradient(#000b,#000b),url('assets/prototype.webp') center center/cover no-repeat;z-index:-1;pointer-events:none}.wrap{max-width:1080px;margin:auto;padding:18px 16px 55px}.hero{text-align:center}.brand{display:block;width:min(100%,620px);height:auto;margin:12px auto 5px;box-shadow:0 8px 35px #0009}.tag{color:var(--gold);font-weight:900;letter-spacing:2px;font-size:13px;margin:14px 0 22px}.nav{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-bottom:30px}.nav a,.cta{display:block;text-decoration:none;background:var(--gold);color:#090909;padding:16px 8px;border-radius:8px;text-align:center;font-weight:900;font-size:13px}.nav a:focus-visible,.keg:focus-visible{outline:4px solid #fff}h2{text-align:center;color:var(--gold);font-size:25px;letter-spacing:1px;text-transform:uppercase}.kegs{display:grid;grid-template-columns:1fr;gap:22px;max-width:430px;margin:auto}.keg{background:transparent;border:0;color:var(--gold);padding:0;cursor:pointer;width:100%;font:inherit;text-align:center}.keg img{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 10px #000b)}.keg span{display:block;font-weight:900;letter-spacing:1px;margin:4px 0 0}.info{margin:32px 0;padding:22px;background:#090909d9;border:1px solid #bd9b17;border-radius:12px;line-height:1.6}.info h2{text-align:left;margin-top:0}.story{font-size:22px;color:var(--gold);font-weight:900}.fine{color:#ccc;font-size:13px}.modal{border:2px solid var(--gold);border-radius:12px;background:#111;color:white;max-width:460px;width:calc(100% - 28px);padding:24px}.modal::backdrop{background:#000c}.modal button{background:var(--gold);border:0;padding:10px 20px;font-weight:bold;cursor:pointer}footer{text-align:center;color:#bbb;padding:30px 0}@media(min-width:600px){.nav{grid-template-columns:repeat(4,1fr)}.kegs{max-width:none;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:900px){.kegs{grid-template-columns:repeat(4,minmax(0,1fr))}.tag{font-size:16px}}
/* Wholesale request actions */
.order-actions{display:grid;grid-template-columns:1fr;gap:14px;margin:22px auto;max-width:660px}.order-action{display:flex;justify-content:center;align-items:center;min-height:64px;padding:14px 18px;border-radius:9px;text-align:center;text-decoration:none;font-weight:900;letter-spacing:.04em;line-height:1.3}.order-action.primary{background:#f5c400;color:#111}.order-action.secondary{border:2px solid #f5c400;color:#f5c400;background:#161616}.order-action:focus-visible{outline:3px solid white;outline-offset:4px}.order-note{font-size:.85rem;opacity:.83;line-height:1.6}@media(min-width:760px){.order-actions{grid-template-columns:1fr 1fr}}

/* V4 rotating tap locations */
.tap-intro{font-weight:900;letter-spacing:.1em;color:#f5c400;text-align:center}.tap-locations{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin:22px 0}.tap-location{border:1px solid rgba(245,196,0,.55);background:rgba(0,0,0,.68);border-radius:12px;padding:18px 14px;display:flex;flex-direction:column;gap:8px;text-align:center}.tap-location strong{font-size:1.13rem;color:#fff}.tap-location span{color:#f5c400;font-weight:700}.tap-note{font-size:.95rem;line-height:1.5;text-align:center}@media(max-width:600px){.tap-locations{grid-template-columns:1fr}.tap-location{padding:16px}}

/* V5: entire rotating tap location card opens mobile-friendly Google Maps directions */
a.tap-location{text-decoration:none;cursor:pointer;min-height:132px;justify-content:center;transition:border-color .2s,transform .2s,background .2s}a.tap-location:hover{border-color:#f5c400;background:rgba(20,20,20,.95);transform:translateY(-2px)}a.tap-location:focus-visible{outline:3px solid #fff;outline-offset:3px}.tap-location .tap-directions{display:inline-block;align-self:center;color:#111;background:#f5c400;border-radius:7px;padding:10px 14px;font-size:.83rem;font-weight:900;letter-spacing:.04em;min-height:42px}

/* Beta V6 — approved chrome tap wall */
.tap-finder{margin:28px 0 34px;padding:0 0 20px;border:2px solid #d8ac13;border-radius:18px;background:linear-gradient(180deg,#13110c,#080808);overflow:hidden;color:#fff}
.tap-finder-hint{text-align:center;color:#ffcc12;font-size:.88rem;font-weight:900;letter-spacing:.12em;margin:15px 8px 10px}
.tap-wall-scroll{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-color:#e1b90d #202020;scrollbar-width:thin}
.tap-wall{position:relative;min-width:730px;width:100%;line-height:0}
.tap-wall img{display:block;width:100%;height:auto}
.tap-hit{position:absolute;top:29%;height:70%;width:15%;border:0;background:transparent;cursor:pointer;transform-origin:50% 25%;transition:filter .2s,transform .25s;border-radius:15px;z-index:1}
.tap-hit-0{left:8.7%}.tap-hit-1{left:25.5%}.tap-hit-2{left:41.9%}.tap-hit-3{left:58.7%}.tap-hit-4{left:75.5%}
.tap-hit:hover{background:rgba(255,210,15,.11)}.tap-hit.is-selected{background:linear-gradient(180deg,rgba(255,208,0,.10),rgba(255,208,0,.02));filter:drop-shadow(0 0 7px #ffce1b)}
.tap-hit:focus-visible{outline:4px solid #fff;outline-offset:-5px}.tap-hit.tap-pull{transform:rotate(2deg) translateY(5px)}
.tap-details{margin:8px 18px 0;padding:22px;border:2px solid #ffcb0a;border-radius:16px;background:rgba(0,0,0,.93);display:grid;gap:15px}
.tap-selected-label{font-weight:900;letter-spacing:.12em;color:#d5d5d5;font-size:.75rem}.tap-details h3{margin:5px 0 3px;color:#ffd018;font-size:clamp(1.3rem,3vw,2rem);line-height:1.2}.tap-details p{margin:4px 0;line-height:1.5}.tap-details-heading>p{color:#fff}.tap-contact{color:#e5e5e5}.tap-detail-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.tap-action{display:flex;align-items:center;justify-content:center;min-height:52px;border:2px solid #aaa;border-radius:10px;background:#2c2c2c;color:#fff!important;font-weight:900;text-decoration:none!important;text-align:center;padding:10px 8px}.tap-action:hover,.tap-action:focus-visible{border-color:#ffd018;background:#49402a}.tap-action-primary{background:#ffd018;color:#111!important;border-color:#ffd018}.tap-action-primary:hover{background:#ffe271;color:#111!important}.tap-finder-footer{text-align:center;color:#ffcf16;font-size:clamp(1rem,2vw,1.5rem);font-weight:800;margin:24px 12px 6px}.tap-finder .tap-note{margin:0 14px 6px;color:#e1e1e1}
@media(max-width:680px){.tap-wall{width:790px;min-width:790px}.tap-details{margin:8px 10px 0;padding:15px}.tap-detail-actions{grid-template-columns:1fr}.tap-action{min-height:48px}.tap-finder-hint{font-size:.74rem}}
@media(prefers-reduced-motion:reduce){.tap-hit{transition:none}}

/* V7: all chrome faucets retain the same appearance. Gold glow is confined to the selected handle. */
.tap-hit{top:34%;height:65%;width:13%;transform:none!important;filter:none!important;border-radius:0;background:transparent!important}
.tap-hit-0{left:10.5%}.tap-hit-1{left:27.0%}.tap-hit-2{left:43.5%}.tap-hit-3{left:60.0%}.tap-hit-4{left:76.5%}
.tap-hit::before{content:"";position:absolute;top:0;left:0;right:0;height:30%;border-radius:12px;pointer-events:none;transition:box-shadow .2s,background .2s}
.tap-hit.is-selected::before{box-shadow:0 0 19px 5px rgba(255,199,0,.75);background:rgba(255,200,0,.08)}
.tap-hit:hover::before{box-shadow:0 0 12px rgba(255,204,0,.65)}
.tap-hit.tap-pull{transform:none!important}

/* V8: accessibility-only labels must not render over the chrome tower. */
.screen-reader-text{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;clip-path:inset(50%)!important}
.tap-hit.is-selected{filter:none!important}

/* V9: matching five-faucet artwork. Interactive targets align to sign + faucet. */
.tap-wall{min-width:760px}
.tap-hit{top:32%;height:67%;width:12%;transform:none!important;background:transparent!important;filter:none!important}
.tap-hit-0{left:12.4%}.tap-hit-1{left:27.6%}.tap-hit-2{left:43.3%}.tap-hit-3{left:58.4%}.tap-hit-4{left:73.7%}
.tap-hit::before{top:0;height:33%;border-radius:14px}
.tap-hit.is-selected::before{box-shadow:0 0 15px 4px rgba(255,204,0,.62);background:rgba(255,209,0,.05)}
@media(max-width:680px){.tap-wall{width:850px;min-width:850px}}

/* V10: signup UI, consistent with approved black + Kenmore Gold design */
.mailing{border-color:#f6c600}.mail-form{display:grid;gap:16px;max-width:700px;margin:18px auto 0}.mail-form fieldset{border:1px solid #9b801c;border-radius:10px;padding:16px;display:grid;gap:12px}.mail-form legend{color:#f6c600;font-weight:900;padding:0 8px}.mail-form label{display:block;font-weight:700}.mail-form input[type=radio],.mail-form input[type=checkbox]{accent-color:#f6c600;margin-right:8px}.mail-fields{display:grid;grid-template-columns:1fr;gap:14px}.mail-fields input{display:block;width:100%;background:#171717;color:#fff;border:1px solid #a88a26;border-radius:8px;min-height:48px;padding:12px;margin-top:6px;font:inherit}.mail-fields label[hidden]{display:none!important}.mail-submit{background:#f6c600;color:#111;font:900 1rem Arial,sans-serif;min-height:54px;padding:12px 18px;border:0;border-radius:8px;cursor:pointer}.mail-submit:hover{background:#ffdc36}.mail-submit:focus-visible{outline:3px solid white;outline-offset:3px}.mail-consent{font-weight:400!important;font-size:.93rem}.mail-fine{color:#ccc;font-size:.84rem}.mail-fine a{color:#f6c600}.mail-message{background:#26210d;border:1px solid #f6c600;border-radius:8px;padding:12px}.mail-honeypot{position:absolute!important;left:-9999px!important;opacity:0!important}@media(min-width:700px){.mail-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.mail-fields label:first-child{grid-column:1/-1}}

/* V11: Muzeek events embed */
.muzeek-events{scroll-margin-top:2rem}.muzeek-embed-wrap{width:100%;overflow:hidden;border:1px solid rgba(234,185,46,.45);border-radius:14px;background:#141414;box-shadow:0 12px 35px rgba(0,0,0,.25)}.muzeek-embed-wrap iframe{display:block;width:100%;min-height:660px;border:0;background:#141414}.muzeek-embed-note a{color:#f5c543;text-decoration:underline;text-underline-offset:3px}@media(max-width:650px){.muzeek-embed-wrap iframe{min-height:760px}}

/* V12 — simple outbound social follow links */
.social-follow{text-align:center;background:linear-gradient(150deg,#171717,#080808);padding:32px 22px}.social-follow h2{text-align:center;font-size:clamp(1.7rem,4vw,2.6rem);margin:5px 0 12px}.social-eyebrow,.social-signoff{color:var(--gold);font-weight:800;letter-spacing:.13em;font-size:.75rem}.social-lead{font-size:1.17rem;font-weight:800;color:#fff}.social-follow>p:not(.social-eyebrow):not(.social-lead):not(.social-signoff){color:#ddd}.social-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:580px;margin:24px auto}.social-links a{display:flex;align-items:center;justify-content:center;gap:13px;padding:17px 10px;background:#282828;border:1px solid #635521;border-radius:12px;color:#fff;text-decoration:none;font-weight:800;min-height:86px;transition:background .15s,border-color .15s}.social-links a:hover{background:#383838;border-color:var(--gold)}.social-links a:focus-visible{outline:3px solid #fff;outline-offset:3px}.social-links small{display:block;font-size:.76rem;color:#ddd;font-weight:400;overflow-wrap:anywhere}.social-symbol{color:var(--gold);font-size:2.3rem;font-weight:900;line-height:1}.instagram-symbol{font-size:2.6rem}.social-signoff{margin-top:23px}@media(max-width:470px){.social-links{grid-template-columns:1fr}}

/* V13 beer tasting notes */
.beer-stats{color:#f6c600;font-weight:900;letter-spacing:.04em}.modal #beer-description{line-height:1.65}.seasonal-beer{text-align:center;margin:24px auto 0}.seasonal-beer-button{background:#f6c600;color:#111;border:0;border-radius:9px;padding:16px 24px;font-weight:900;font-size:1rem;cursor:pointer}.seasonal-beer-button:focus-visible{outline:3px solid white;outline-offset:3px}

/* V15: keep anti-spam honeypot functional but entirely invisible to visitors */
.mail-honeypot,.mail-honeypot[hidden]{display:none!important;visibility:hidden!important}
/* Give the third-party Muzeek embed more room; its internal layout and scrollbars are controlled by Muzeek. */
.muzeek-events{min-width:0}
.muzeek-embed-wrap{width:100%;max-width:none;min-width:0;overflow:hidden}
.muzeek-embed-wrap iframe{display:block;width:100%;height:920px;min-height:920px;max-width:100%;border:0}
.muzeek-embed-note a{display:inline-block;background:var(--gold);color:#111;font-weight:900;text-decoration:none;padding:13px 18px;border-radius:9px}
.muzeek-embed-note a:focus-visible{outline:3px solid white;outline-offset:3px}
@media(max-width:650px){.muzeek-events{padding:16px 12px}.muzeek-embed-wrap iframe{height:900px;min-height:900px}}

/* V16: Muzeek official responsive list embed, full available site width */
.muzeek-events{width:100%;min-width:0}
.muzeek-embed-wrap{display:block;width:100%;max-width:100%;min-width:0;overflow:hidden}
.muzeek-embed-wrap iframe{display:block;width:100%!important;max-width:100%;height:700px!important;min-height:700px!important;border:0}
@media(max-width:650px){.muzeek-embed-wrap iframe{height:760px!important;min-height:760px!important}}

/* V17: consistent eight-keg gallery */
.keg{min-width:0}.keg img{aspect-ratio:225/229;object-fit:contain}.modal #beer-description{display:block;min-height:1.5em;color:#fff}.modal #beer-stats{display:block;color:var(--gold)}

/* V21: responsive single-row, swipeable original photo-real keg gallery. */
.beer-carousel{display:flex;align-items:center;gap:8px;min-width:0;max-width:100%;position:relative}
.beer-carousel .kegs{display:flex!important;flex-wrap:nowrap!important;gap:14px;max-width:none!important;width:100%;margin:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:4px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--gold) #222;padding:8px 4px 15px}
.beer-carousel .keg{flex:0 0 clamp(180px,67vw,275px);width:auto;max-width:none;scroll-snap-align:start;min-width:0}
.beer-carousel .keg img{width:100%;height:auto;aspect-ratio:225/229;object-fit:contain}
.beer-scroll-arrow{display:none;flex:0 0 38px;border:1px solid var(--gold);border-radius:50%;background:#111;color:var(--gold);font-size:24px;min-height:44px;cursor:pointer}
.beer-scroll-arrow:focus-visible{outline:3px solid white;outline-offset:2px}
.beer-swipe-hint{text-align:center;color:var(--gold);font-size:12px;font-weight:900;letter-spacing:1px;margin:5px 0 15px}
@media(min-width:700px){.beer-scroll-arrow{display:block}.beer-carousel .keg{flex-basis:clamp(210px,26vw,270px)}.beer-swipe-hint{display:none}}
@media(prefers-reduced-motion:reduce){.beer-carousel .kegs{scroll-behavior:auto}}

/* V22: force a single swipeable rail on narrow mobile viewports. */
@media (max-width:699px) {
  #beers, #beers .beer-carousel { min-width:0!important; max-width:100%!important; }
  #beers .beer-carousel { display:block!important; overflow:hidden!important; }
  #beers .beer-carousel > .kegs {
    display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
    grid-template-columns:none!important; align-items:flex-start!important;
    width:100%!important; max-width:100%!important; min-width:0!important;
    gap:12px!important; margin:0!important; padding:8px 3px 16px!important;
    overflow-x:scroll!important; overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch; touch-action:pan-x pan-y;
    scroll-snap-type:x proximity;
  }
  #beers .beer-carousel > .kegs > .keg {
    display:block!important; flex:0 0 76%!important; width:76%!important;
    min-width:0!important; max-width:76%!important; margin:0!important;
    scroll-snap-align:start;
  }
  #beers .keg img { display:block!important; width:100%!important; height:auto!important; max-width:100%!important; }
  #beers .beer-scroll-arrow { display:none!important; }
}

/* V23: use an explicit horizontal grid track, not flex, on every viewport.
   The scroll container itself owns the overflow; cards never wrap. */
#beers .beer-carousel{display:flex!important;align-items:stretch!important;width:100%!important;max-width:100%!important;min-width:0!important;overflow:visible!important}
#beers .beer-carousel > .kegs{
 display:grid!important;grid-auto-flow:column!important;
 grid-template-columns:none!important;grid-template-rows:1fr!important;
 grid-auto-columns:clamp(190px,72vw,280px)!important;
 align-items:start!important;justify-content:start!important;
 width:100%!important;max-width:100%!important;min-width:0!important;
 overflow-x:auto!important;overflow-y:hidden!important;
 gap:14px!important;margin:0!important;padding:8px 8px 18px!important;
 scroll-snap-type:x proximity;overscroll-behavior-x:contain;
 -webkit-overflow-scrolling:touch;touch-action:pan-x;
}
#beers .beer-carousel > .kegs > .keg{
 display:block!important;grid-row:1!important;
 width:100%!important;min-width:0!important;max-width:100%!important;
 flex:none!important;margin:0!important;scroll-snap-align:start;
}
#beers .beer-carousel > .kegs > .keg img{width:100%!important;max-width:100%!important;height:auto!important;object-fit:contain!important}
@media(max-width:699px){#beers .beer-carousel{display:block!important}#beers .beer-carousel > .kegs{grid-auto-columns:76%!important}}
@media(min-width:700px){#beers .beer-carousel > .kegs{grid-auto-columns:clamp(210px,26vw,270px)!important}}
