@font-face {
    font-family:'Taproom Barlow';
    font-style:normal;
    font-weight:600;
    font-display:swap;
    src:url('taproom-fonts/barlow.font')
}

@font-face {
    font-family:'Taproom Source';
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url('taproom-fonts/source.font')
}

body.taproom-page {
    margin:0;
    background:#202321;
    color:#f5eddc
}
#taproom,#taproom * {
    box-sizing:border-box
}
#taproom {
    --tr-bg:#202321;
    --tr-text:#f5eddc;
    --tr-heading:#f5eddc;
    --tr-accent:#dda66e;
    --tr-heading-font:'Taproom Barlow';
    --tr-body-font:'Taproom Source';
    --tr-gap:32px;
    --tr-padding:16px;
    --tr-size:34px;
    --tr-columns:2;
    background:radial-gradient(ellipse at 100% 0,#3b3a2d55,transparent 65%),var(--tr-bg);
    color:var(--tr-text);
    font-family:var(--tr-body-font),sans-serif;
    font-size:16px;
    line-height:1.15;
    min-height:100vh;
    padding:32px 40px
}
#taproom h1,#taproom h2 {
    font-family:var(--tr-heading-font),sans-serif;
    font-weight:600;
    color:var(--tr-heading);
    margin:0;
    line-height:1.08;
    overflow-wrap:anywhere
}
#taproom p {
    margin:0
}
#taproom .tr-header {
    display:flex;
    gap:32px;
    align-items:center;
    padding-bottom:24px;
    border-bottom:1px solid #81887866;
    margin-bottom:8px
}
#taproom .tr-brand img {
    width:160px;
    height:70px;
    object-fit:contain
}
#taproom .tr-brand span {
    font-family:var(--tr-heading-font),sans-serif;
    font-size:30px
}
#taproom .tr-eyebrow,#taproom .tr-label {
    display:block;
    font-size:11px;
    letter-spacing:1.8px;
    text-transform:uppercase;
    opacity:.8
}
#taproom h1 {
    font-size:52px;
    margin-top:4px
}
#taproom .tr-list {
    display:grid;
    grid-template-columns:repeat(var(--tr-columns),minmax(0,1fr));
    column-gap:var(--tr-gap);
    align-items:stretch
}
#taproom .tr-entry {
    display:grid;
    grid-template-columns:minmax(44px,max-content) 112px minmax(0,1fr);
    gap:16px;
    align-items:start;
    padding:var(--tr-padding) var(--tr-entry-inset,0px);
    border-bottom:1px solid #81887866;
    min-width:0
}
#taproom .tr-entry[hidden] {
    display:none
}
#taproom .tr-no-visual {
    grid-template-columns:minmax(44px,max-content) minmax(0,1fr)
}
#taproom .tr-number {
    font-family:var(--tr-body-font),sans-serif;
    font-size:38px;
    color:var(--tr-accent);
    line-height:1.1;
    overflow-wrap:anywhere
}
#taproom .tr-label {
    font-family:var(--tr-body-font),sans-serif;
    font-size:10px;
    margin-bottom:8px;
    color:var(--tr-text)
}
#taproom .tr-text-number {
    white-space:nowrap;
    font-size:20px
}
#taproom .tr-visual {
    position:relative;
    display:flex;
    align-items:start;
    justify-content:center;
    min-height:138px
}
#taproom .tr-artwork {
    width:100%;
    height:110px;
    object-fit:contain
}
#taproom .tr-vessel {
    display:block;
    width:90px;
    height:132px
}
#taproom .tr-vessel svg {
    width:100%;
    height:100%;
    display:block
}
#taproom .tr-combined .tr-vessel {
    position:absolute;
    width:47px;
    height:78px;
    right:-6px;
    top:66px;
    filter:drop-shadow(0 4px 5px #0008)
}
#taproom .tr-copy {
    min-width:0
}
#taproom h2 {
    font-size:var(--tr-size);
    line-height:1
}
#taproom .tr-copy > h2 + .tr-style {
    margin-top:2px
}
#taproom .tr-style {
    color:var(--tr-accent);
    font-size:17px;
    margin-top:4px
}
#taproom .tr-brewer,#taproom .tr-description {
    margin-top:4px;
    font-size:16px;
    line-height:1.2
}
#taproom .tr-description p+p {
    margin-top:4px
}
#taproom .tr-metrics {
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:16px;
    margin-top:6px;
    font-size:14px
}
#taproom .tr-metrics > span {
    white-space:nowrap
}
#taproom .tr-metrics strong {
    font-size:24px;
    font-weight:400
}
#taproom .tr-status {
    margin-top:2px
}
#taproom .package {
    display:inline-block;
    float:none;
    margin:0;
    padding:4px 7px;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:1px;
    background:var(--tr-accent);
    color:var(--tr-bg)
}
#taproom .tr-prices {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px 16px;
    margin:6px 0 0;
    padding-top:10px;
    border-top:1px solid #81887866
}
#taproom .tr-price {
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:6px;
    min-width:0
}
#taproom dt {
    font-weight:400;
    font-size:12px;
    overflow-wrap:anywhere
}
#taproom dd {
    font-size:20px;
    margin:0;
    line-height:1.2;
    white-space:nowrap;
    font-variant-numeric:tabular-nums
}
#taproom .tr-details {
    margin-top:6px;
    font-size:14px
}
#taproom summary {
    cursor:pointer;
    min-height:44px;
    display:flex;
    align-items:center;
    gap:9px
}
#taproom summary:before {
    content:'+';
    color:var(--tr-accent);
    font-size:20px
}
#taproom details[open] summary:before {
    content:'−'
}
#taproom .tr-details p {
    margin-bottom:7px
}
#taproom .tr-footer {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding-top:18px;
    font-size:12px
}
#taproom a {
    color:inherit;
    text-underline-offset:3px
}
#taproom :focus-visible {
    outline:3px solid var(--tr-accent);
    outline-offset:4px
}
#taproom .tr-empty {
    padding:40px 0
}
/* Use saved columns, capped on narrower screens for readable content. */
#taproom[data-columns="1"] { --tr-columns:1 }
#taproom[data-columns="2"] { --tr-columns:2 }
#taproom[data-columns="3"] { --tr-columns:3 }
#taproom[data-columns="4"] { --tr-columns:4 }
@media(min-width:1001px) and (max-width:1449px) {
    #taproom[data-columns="3"],#taproom[data-columns="4"] { --tr-columns:2 }
}
@media(min-width:1450px) and (max-width:1999px) {
    #taproom[data-columns="4"] { --tr-columns:3 }
}
@media(min-width:1450px) {
    #taproom { --tr-padding:16px; --tr-gap:28px }
}
@media(max-width:1000px) {
    #taproom[data-columns] { --tr-columns:1 }
}
@media(min-width:1001px) and (max-height:800px) {
    #taproom { --tr-padding:14px; --tr-size:30px; padding:20px 28px }
    #taproom .tr-header { padding-bottom:14px }
    #taproom h1 { font-size:42px }
    #taproom .tr-entry { grid-template-columns:minmax(34px,max-content) 76px minmax(0,1fr); gap:12px }
    #taproom .tr-no-visual { grid-template-columns:minmax(34px,max-content) minmax(0,1fr) }
    #taproom .tr-visual { min-height:104px }
    #taproom .tr-artwork { height:76px }
    #taproom .tr-vessel { width:68px; height:100px }
    #taproom .tr-combined .tr-vessel { width:35px; height:60px; top:48px; right:-4px }
    #taproom .tr-brewer,#taproom .tr-description { margin-top:4px }
    #taproom .tr-metrics,#taproom .tr-prices { margin-top:6px }
}

@media(max-width:700px) {
    #taproom {
    padding:24px 20px;
    --tr-columns:1;
    --tr-size:29px;
    --tr-padding:16px
}
#taproom .tr-header {
    gap:18px;
    flex-wrap:wrap
}
#taproom .tr-brand img {
    width:122px;
    height:50px
}
#taproom .tr-heading {
    flex-basis:100%
}
#taproom h1 {
    font-size:46px
}
#taproom .tr-entry {
    grid-template-columns:minmax(30px,max-content) 70px minmax(0,1fr);
    gap:12px
}
#taproom .tr-no-visual {
    grid-template-columns:minmax(30px,max-content) minmax(0,1fr)
}
#taproom .tr-number {
    font-size:30px
}
#taproom .tr-text-number {
    font-size:18px
}
#taproom .tr-label {
    font-size:9px
}
#taproom .tr-visual {
    min-height:105px
}
#taproom .tr-artwork {
    height:75px
}
#taproom .tr-vessel {
    width:68px;
    height:100px
}
#taproom .tr-combined .tr-vessel {
    width:35px;
    height:60px;
    top:48px;
    right:-4px
}
#taproom .tr-style {
    font-size:15px
}
#taproom .tr-brewer,#taproom .tr-description {
    font-size:15px;
    line-height:1.2
}
#taproom .tr-metrics {
    gap:12px
}
#taproom .tr-metrics strong {
    font-size:20px
}
#taproom .tr-prices {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px 14px
}
#taproom .tr-price {
    gap:4px
}
#taproom dd {
    font-size:18px
}
#taproom .tr-footer {
    flex-wrap:wrap
}

}

#taproom [hidden] {
    display:none!important
}

#taproom {
    background-image:var(--tr-background-image,radial-gradient(ellipse at 100% 0,#3b3a2d55,transparent 65%));
    background-size:cover;
    background-attachment:fixed
}
#taproom .tr-entry {
    background:var(--tr-panel,transparent)
}
#taproom .tr-socials {
    margin-left:auto;
    flex-shrink:0
}
#taproom .tr-socials:empty {
    display:none
}
#taproom .socials {
    position:static!important;
    margin:8px 0;
    text-align:right
}
#taproom .socials ul {
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    gap:12px;
    justify-content:flex-end
}
#taproom .socials a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:44px;
    min-height:44px
}
#taproom .socials i {
    font-size:22px
}

#taproom .socials a,#taproom .socials a:hover,#taproom .socials a:focus {
    text-decoration:none
}
