/* BRICKS — Home of Rock N Roll */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#0b0806}
::selection{background:rgba(255,150,60,.35);color:#fff}
a{color:#ffb648;text-decoration:none}
a:hover{color:#ffd08a}
:focus-visible{outline:2px solid #ffb648;outline-offset:3px}
button{font:inherit}

@keyframes bxFlick{0%,100%{opacity:1}92%{opacity:1}93%{opacity:.35}94%{opacity:1}96%{opacity:.6}97%{opacity:1}}
@keyframes bxRipple{to{width:340px;height:340px;opacity:0}}
@keyframes bxLoad{0%{width:0}100%{width:100%}}
@keyframes bxBob{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(7px);opacity:1}}
@keyframes bxShim{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes bxRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes bxNeon{0%,100%{opacity:1}43%{opacity:1}45%{opacity:.35}47%{opacity:1}52%{opacity:.72}54%{opacity:1}83%{opacity:1}85%{opacity:.4}87%{opacity:1}}

.site{position:relative;min-height:100vh;background:#0b0806;color:#e8ddd4;font-family:'Barlow',system-ui,sans-serif;overflow-x:hidden}

/* fixed background layers */
.bg-wall{position:fixed;inset:0;z-index:-4;background-color:#0b0806;background-image:url(assets/brick-wall.jpg);background-size:cover;background-position:center}
.bg-tint{position:fixed;inset:0;z-index:-3;pointer-events:none;background:linear-gradient(180deg,rgba(8,6,5,.62),rgba(8,6,5,.4) 38%,rgba(8,6,5,.86))}
#bx-embers{position:fixed;inset:0;width:100%;height:100%;z-index:-2;display:block;pointer-events:none}
.bg-vignette{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 90% 70% at 50% 40%,transparent 28%,rgba(0,0,0,.8) 100%)}

/* chrome */
#bx-prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:60;background:linear-gradient(90deg,#ff7a2a,#ffc266);box-shadow:0 0 10px rgba(255,150,60,.8)}
#bx-cursor{position:fixed;top:0;left:0;width:30px;height:30px;border:1.5px solid rgba(255,180,90,.9);border-radius:50%;z-index:70;pointer-events:none;display:none;mix-blend-mode:screen;box-shadow:0 0 14px rgba(255,150,60,.6)}

/* loader */
#bx-load{position:fixed;inset:0;z-index:90;background:#0a0807;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px}
#bx-bootword{will-change:transform,opacity}
.load-track{width:min(280px,70vw);height:2px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
.load-fill{height:100%;background:linear-gradient(90deg,#ff7a2a,#ffc266);animation:bxLoad 1.5s ease forwards;box-shadow:0 0 10px rgba(255,150,60,.8)}
.load-caption{font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:6px;color:rgba(255,180,120,.6)}

/* brick-textured display word (loader + hero) */
.brick-word{margin:0;font-family:'Bebas Neue',sans-serif;font-size:clamp(64px,14vw,190px);line-height:.8;letter-spacing:6px;background-image:linear-gradient(rgba(255,190,100,.3),rgba(255,138,58,.12)),url(assets/brick-1.jpg);background-size:cover;background-position:center;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;-webkit-text-stroke:1px rgba(24,12,7,.4);filter:drop-shadow(0 2px 2px rgba(0,0,0,.7)) drop-shadow(0 0 8px rgba(255,150,60,.45)) drop-shadow(0 0 30px rgba(255,110,40,.35))}
.flicker{animation:bxFlick 7s infinite}

/* sticky header */
#bx-head{position:fixed;top:0;left:0;right:0;z-index:55;display:flex;align-items:center;justify-content:space-between;padding:12px clamp(16px,4vw,42px);background:rgba(10,7,5,.88);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,160,90,.14);opacity:0;pointer-events:none;transform:translateY(-8px);transition:opacity .4s ease,transform .4s ease}
.wordmark{border:none;background:none;cursor:pointer;padding:0;font-family:'Bebas Neue',sans-serif;font-size:26px;letter-spacing:4px;color:#ffcf8f;text-shadow:0 0 12px rgba(255,150,60,.5)}
#bx-head nav{display:flex;gap:clamp(10px,2.4vw,26px);font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:2.5px;font-weight:600}
.head-link{border:none;background:none;cursor:pointer;padding:6px 2px;color:rgba(232,221,212,.75);transition:color .25s,text-shadow .25s;font-family:inherit;font-size:inherit;letter-spacing:inherit;font-weight:inherit}
.head-link:hover{color:#ffcf8f;text-shadow:0 0 12px rgba(255,150,60,.6)}
@media (max-width:640px){#bx-head nav{flex-wrap:wrap;justify-content:flex-end}}

/* hero */
.hero{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:90px 20px 60px}
.hero-stack{display:flex;flex-direction:column;align-items:center;gap:clamp(6px,1.4vw,12px);margin:4px 0 16px}
.tagline{font-family:'Bebas Neue',sans-serif;font-size:clamp(16px,3vw,30px);letter-spacing:clamp(3px,1vw,7px);color:#ffcf8f;text-shadow:0 0 10px rgba(255,150,60,.4)}

/* brick wall nav */
#bx-nav{width:min(880px,94vw);margin-top:24px;display:grid;grid-template-columns:repeat(20,1fr);grid-auto-rows:clamp(58px,7.4vw,82px);gap:3px;background-image:linear-gradient(rgba(7,5,4,.24),rgba(7,5,4,.42)),url(assets/behind-wall.jpg);background-size:cover;background-position:center;background-attachment:fixed}
.cell{position:relative;opacity:0}
.brick-btn{position:relative;overflow:hidden;width:100%;height:100%;border:none;border-radius:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background-image:linear-gradient(158deg,rgba(10,7,5,.42),rgba(6,4,3,.66)),url(assets/brick-1.jpg);background-size:cover;background-position:center;box-shadow:inset 0 1px 0 rgba(255,200,140,.18),inset 0 -3px 8px rgba(0,0,0,.62),inset 0 0 0 1px rgba(255,160,90,.1),0 6px 16px rgba(0,0,0,.5);transition:transform .3s cubic-bezier(.2,.85,.25,1),box-shadow .3s,filter .3s}
.brick-btn:hover{transform:translateY(-4px);filter:brightness(1.18) saturate(1.1);box-shadow:inset 0 1px 0 rgba(255,215,160,.34),inset 0 0 0 1px rgba(255,180,110,.3),0 14px 30px rgba(255,130,50,.45),0 0 26px rgba(255,150,60,.45)}
.brick-sub{font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:2px;color:rgba(255,180,120,.55);pointer-events:none}
.brick-label{font-family:'Bebas Neue',sans-serif;font-size:clamp(17px,3.4vw,28px);letter-spacing:2px;line-height:.9;color:#ecd9c3;text-shadow:0 -1px 1px rgba(0,0,0,.8),0 1px 0 rgba(255,190,140,.2),0 2px 4px rgba(0,0,0,.6);pointer-events:none}
.brick{width:100%;height:100%;background-size:cover;box-shadow:inset 0 1px 0 rgba(255,200,150,.1),inset 0 -3px 8px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.45)}
.gap{width:100%;height:100%;box-shadow:inset 0 0 16px rgba(0,0,0,.7),inset 0 4px 10px rgba(0,0,0,.78),inset 0 0 24px rgba(255,120,50,.1)}

.scroll-hint{margin-top:44px;display:flex;flex-direction:column;align-items:center;gap:6px;font-family:'Barlow Condensed',sans-serif;letter-spacing:4px;font-size:11px;color:rgba(232,221,212,.5)}
.scroll-line{width:1px;height:26px;background:linear-gradient(rgba(255,180,120,.7),transparent);animation:bxBob 1.8s ease-in-out infinite}

/* sections */
.sec{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:50px clamp(20px,5vw,48px)}
.sec-first{padding-top:70px}
.sec-last{padding-bottom:70px}
.shim{height:1px;width:100%;background:linear-gradient(90deg,transparent,rgba(255,150,60,.7),transparent);background-size:200% 100%;animation:bxShim 4s linear infinite;box-shadow:0 0 12px rgba(255,150,60,.4);margin-bottom:52px}
.kicker{font-family:'Barlow Condensed',sans-serif;letter-spacing:6px;font-size:13px;color:rgba(255,180,120,.7)}
.sec-title{margin:6px 0 0;font-family:'Bebas Neue',sans-serif;font-size:clamp(44px,7vw,84px);letter-spacing:3px;line-height:.9;color:#f2e7d9}
.sec-desc{margin:14px 0 0;max-width:560px;font-size:16px;line-height:1.55;color:rgba(232,221,212,.65)}

/* scroll reveal */
.rv{opacity:0;transform:translateY(34px);transition:opacity .8s ease var(--d,0s),transform .8s ease var(--d,0s)}
.rv.on{opacity:1;transform:none}

/* menu */
.menu-flex{display:flex;flex-wrap:wrap;gap:clamp(28px,5vw,60px);margin-top:40px;align-items:stretch}
.feature{flex:1 1 380px;position:relative;min-height:340px;border-radius:6px;overflow:hidden}
.feature>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.05)}
.feature-fade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(8,5,4,.9))}
#bx-whiskey{position:absolute;left:0;right:0;bottom:0;padding:26px;text-align:left;transition:opacity .3s ease}
.w-kicker{font-family:'Barlow Condensed',sans-serif;letter-spacing:4px;font-size:12px;color:#ffc266}
.w-name{font-family:'Bebas Neue',sans-serif;font-size:clamp(34px,5vw,52px);letter-spacing:1.5px;line-height:.95;color:#f6ede1;text-shadow:0 0 18px rgba(255,150,60,.35);margin-top:6px}
.w-notes{font-size:15px;color:rgba(232,221,212,.78);margin-top:6px}
.w-abv{display:inline-block;margin-top:12px;padding:4px 11px;border:1px solid rgba(255,180,120,.4);border-radius:999px;font-family:'Barlow Condensed',sans-serif;letter-spacing:2px;font-size:12px;color:#ffc266}
.menu-lists{flex:1 1 340px;display:flex;flex-direction:column;gap:34px;text-align:left}
.list-head{font-family:'Barlow Condensed',sans-serif;letter-spacing:5px;font-size:12px;color:rgba(255,180,120,.7);margin-bottom:14px}
.mi{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.mi-name{font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:18px;letter-spacing:1px;color:#eee0d0}
.mi-desc{font-size:13px;color:rgba(232,221,212,.55)}
.mi-price{font-family:'Bebas Neue',sans-serif;font-size:20px;color:#ffc266;white-space:nowrap}

/* acts */
.acts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(20px,3.5vw,38px);margin-top:46px}
.poster{position:relative;opacity:0;transform:rotate(var(--rot,0deg)) translateY(34px);transition:opacity .8s ease var(--d,0s),transform .5s cubic-bezier(.2,.85,.25,1);cursor:pointer}
.poster.on{opacity:1;transform:rotate(var(--rot,0deg))}
.poster.on:hover{transform:rotate(0deg) translateY(-8px);z-index:2}
.poster-inner{background:#17100b;padding:10px 10px 16px;box-shadow:0 18px 40px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,180,120,.08)}
.tape{position:absolute;top:-8px;left:50%;width:74px;height:20px;background:rgba(214,196,160,.28);backdrop-filter:blur(1px);box-shadow:0 1px 3px rgba(0,0,0,.4)}
.poster-photo{overflow:hidden}
.poster-photo img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;filter:saturate(1.02)}
.poster-meta{padding:14px 6px 2px;text-align:left}
.p-name{font-family:'Bebas Neue',sans-serif;font-size:28px;letter-spacing:2px;color:#f2e7d9;line-height:1}
.p-row{display:flex;justify-content:space-between;align-items:baseline;margin-top:5px}
.p-genre{font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:2px;color:rgba(255,180,120,.7)}
.p-day{font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:2px;color:rgba(232,221,212,.5)}

/* events */
.ev{display:flex;align-items:center;gap:clamp(16px,4vw,42px);padding:20px clamp(12px,2.5vw,26px);border-bottom:1px solid rgba(255,255,255,.07);transition:background .3s,box-shadow .3s;text-align:left}
.ev:hover{background:rgba(255,150,60,.06);box-shadow:inset 3px 0 0 #ff9a3d}
.ev-when{min-width:74px}
.ev-day{font-family:'Bebas Neue',sans-serif;font-size:30px;letter-spacing:2px;color:#ffc266;line-height:1}
.ev-time{font-family:'Barlow Condensed',sans-serif;font-size:12px;letter-spacing:2px;color:rgba(232,221,212,.5)}
.ev-main{flex:1}
.ev-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(22px,3.4vw,32px);letter-spacing:1.5px;color:#f2e7d9;line-height:1}
.ev-desc{font-size:14px;color:rgba(232,221,212,.6);margin-top:4px}
.ev-tag{font-family:'Barlow Condensed',sans-serif;font-size:12px;letter-spacing:2.5px;color:rgba(255,180,120,.75);border:1px solid rgba(255,180,120,.35);border-radius:999px;padding:6px 13px;white-space:nowrap}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:clamp(120px,16vw,210px);gap:10px;margin-top:40px}
.gal-item{overflow:hidden;border-radius:4px}
.gal-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.gal-item img:hover{transform:scale(1.05)}
.c4r2{grid-column:span 4;grid-row:span 2}
.c2{grid-column:span 2;grid-row:span 1}
.c3{grid-column:span 3;grid-row:span 1}

/* location */
.loc-flex{display:flex;flex-wrap:wrap;gap:clamp(28px,5vw,60px);align-items:stretch}
.loc-photo{flex:1 1 380px;position:relative;min-height:320px;border-radius:6px;overflow:hidden}
.loc-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.loc-fade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,5,4,.85),transparent 55%)}
.loc-caption{position:absolute;left:0;bottom:0;padding:24px;text-align:left}
.neon{font-family:'Monoton',cursive;font-size:clamp(15px,2.4vw,22px);letter-spacing:2px;color:#ffe3b6;text-shadow:0 0 8px rgba(255,150,60,.9),0 0 20px rgba(255,110,40,.6)}
.loc-info{flex:1 1 340px;text-align:left}
.loc-title{margin:6px 0 0;font-family:'Bebas Neue',sans-serif;font-size:clamp(38px,5.5vw,64px);letter-spacing:2px;line-height:.92;color:#f2e7d9}
.loc-city{font-size:17px;color:rgba(232,221,212,.7);margin-top:10px}
.hours{margin-top:30px}
.hours-head{font-family:'Barlow Condensed',sans-serif;letter-spacing:5px;font-size:12px;color:rgba(255,180,120,.7);margin-bottom:10px}
.hr{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:15px}
.hr-last{border-bottom:none}
.hr>span:first-child{color:rgba(232,221,212,.6)}
.hr-time{font-variant-numeric:tabular-nums}

/* contact */
.contact{text-align:center}
.tels{display:flex;gap:clamp(14px,4vw,34px);flex-wrap:wrap;justify-content:center;margin-top:26px}
.tel{display:inline-block;font-family:'Bebas Neue',sans-serif;font-size:clamp(30px,5.5vw,54px);letter-spacing:2px;color:#ffc266;text-shadow:0 0 16px rgba(255,150,60,.35);transition:text-shadow .3s,transform .3s}
.tel:hover{text-shadow:0 0 28px rgba(255,150,60,.8);transform:translateY(-3px)}
.tel-sep{font-family:'Bebas Neue',sans-serif;font-size:clamp(30px,5.5vw,54px);color:rgba(255,180,120,.3)}
.socials{display:flex;gap:10px;justify-content:center;margin-top:30px}
.pill{padding:9px 17px;border:1px solid rgba(255,180,120,.35);border-radius:999px;font-family:'Barlow Condensed',sans-serif;letter-spacing:2px;font-size:12px;transition:box-shadow .3s,border-color .3s}
.pill:hover{box-shadow:0 0 16px rgba(255,150,60,.4);border-color:rgba(255,180,120,.8)}
.copyright{margin-top:44px;font-family:'Barlow Condensed',sans-serif;letter-spacing:1.5px;font-size:13px;color:rgba(232,221,212,.45)}

/* back to top */
#bx-top{position:fixed;right:22px;bottom:22px;z-index:55;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,180,120,.4);background:rgba(24,16,12,.8);color:#ffc266;font-size:20px;cursor:pointer;opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .35s,transform .35s,box-shadow .3s;backdrop-filter:blur(4px)}
#bx-top:hover{box-shadow:0 0 20px rgba(255,150,60,.5)}
