/* Homepage Barski section (web/homepage-preview.html #barski), linked right after
   homepage-preview.css. Its own file so a deploy reaches returning visitors at once: unhashed
   stylesheets are cached for five minutes with a day of stale-while-revalidate, and a new URL is
   never stale. Every rule is at least as specific as the older Barski rules it replaces. */
/* One grid. Brand lockup (Barski logo, Thai Fury logo), one headline, then the
   food photos and the visit column on shared column lines. Desktop: three columns, the photos fill
   two and the visit column the third, with their top and bottom edges aligned. Tablet and phone:
   two columns, the buttons and details sit under the photo columns. The taproom photo stays full
   bleed on wide screens (an explicit width stops aspect-ratio and max-height from narrowing it) and
   its caption starts on the content edge. */
.barski-editorial .barski-photo{width:100%}
.barski-editorial .photo-caption{left:max(5%,calc((100% - 1530px)/2))}
.barski-editorial .barski-intro{--bk-gap:clamp(10px,2.6vw,40px);--bk-logo:clamp(40px,5.2vw,58px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"head head" "deck deck" "copy copy" "food food" "visit visit";column-gap:var(--bk-gap);row-gap:0;align-items:start;padding-top:clamp(48px,5.6vw,84px)}
.barski-editorial .barski-heading{grid-area:head;min-width:0;margin:0 0 clamp(24px,2.8vw,40px)}
.barski-editorial .barski-heading .eyebrow{margin:0 0 clamp(14px,1.6vw,22px)}
.barski-editorial .barski-brands{display:flex;align-items:flex-end}
.barski-editorial .barski-brands h2{margin:0;font-size:0;line-height:0;letter-spacing:0}
.barski-editorial .barski-brands h2 img{display:block;width:auto;height:var(--bk-logo);max-width:none}
.barski-editorial .barski-brands .thai-fury-logo{display:block;flex:none;width:auto;height:calc(var(--bk-logo)*1.18);max-width:none;margin:0 0 0 clamp(16px,2vw,30px);padding-left:clamp(16px,2vw,30px);border-left:1px solid #bdb19f}
.barski-editorial .barski-deck{grid-area:deck;align-self:start;min-width:0;margin:0;font-size:clamp(26px,5vw,46px);font-weight:700;line-height:1.02;letter-spacing:-.04em;color:#1a1815}
.barski-editorial .barski-copy{grid-area:copy;align-self:start;min-width:0;margin:clamp(14px,2.2vw,22px) 0 0;padding:0}
.barski-editorial .barski-copy>p{margin:0;max-width:52ch;font-size:clamp(15px,1.25vw,18px);line-height:1.6;letter-spacing:-.01em;color:#4a443a;text-wrap:pretty}
.barski-editorial .barski-food{grid-area:food;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--bk-gap);align-self:stretch;max-width:none;margin:clamp(28px,4vw,56px) 0 0}
.barski-editorial .barski-food img{display:block;width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;border-radius:6px;background:#d9d1c3}
.barski-editorial .barski-visit{grid-area:visit;display:flex;flex-direction:column;align-self:stretch;min-width:0;margin:var(--bk-gap) 0 0;padding:0}
.barski-editorial .barski-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--bk-gap);align-items:stretch}
.barski-editorial .venue-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px var(--bk-gap);margin:clamp(20px,3vw,28px) 0 0;padding:20px 0 0;border-top:1px solid #c9c0b0}
.barski-editorial .venue-details>div{min-width:0}
.barski-editorial .venue-details h3{margin:0 0 8px;font-size:10px;line-height:1.5;letter-spacing:.06em}
.barski-editorial .venue-details p{font-size:13px;line-height:1.75}
.barski-editorial .venue-details a[href^="mailto:"]{display:inline-block;position:relative;min-height:0;min-width:0}
.barski-editorial .venue-details a[href^="mailto:"]::after{content:"";position:absolute;inset:-12px -6px}
.barski-editorial .taplist-preview{margin-top:clamp(36px,4vw,56px)}
@media(min-width:1200px){
 .barski-editorial .barski-intro{--bk-logo:clamp(52px,4.6vw,68px);grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr);grid-template-areas:"head head head" "deck deck copy" "food food visit"}
 .barski-editorial .barski-deck{align-self:baseline;font-size:clamp(40px,3.6vw,56px)}
 .barski-editorial .barski-copy{align-self:baseline;margin:0}
 .barski-editorial .barski-copy>p{max-width:36ch}
 .barski-editorial .barski-visit{gap:24px;margin-top:clamp(28px,4vw,56px)}
 .barski-editorial .barski-actions{gap:10px}
 .barski-editorial .venue-details{gap:18px 10px;margin-top:auto}
 .barski-editorial .venue-details p{font-size:12.5px}
}
@media(min-width:1440px){.barski-editorial .venue-details p{font-size:13px}}
@media(max-width:600px){
 .barski-editorial .photo-caption{left:6%}
 .barski-editorial .barski-intro{--bk-gap:10px;--bk-logo:clamp(30px,9.4vw,40px)}
 .barski-editorial .barski-heading .eyebrow{font-size:10px}
 .barski-editorial .barski-deck{font-size:clamp(24px,7.6vw,30px)}
 .barski-editorial .venue-details{gap:16px 10px;padding-top:18px}
 .barski-editorial .venue-details p{font-size:11.5px}
}
@media(max-width:388px){
 .barski-editorial .venue-details{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:340px){
 .barski-editorial .barski-actions{grid-template-columns:minmax(0,1fr)}
}