:root{--ink:#1d1a17;--paper:#faf6ee;--paper2:#f1eadb;--accent:#e8602c;--blue:#2b8be0;--gold:#f2a81d;--green:#2fa84f;--muted:#6b645b;
--serif:'Fraunces',Georgia,serif;--sans:'Jost',system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.6;font-size:17px}
img{max-width:100%;display:block}
h1,h2,h3{font-family:var(--serif);line-height:1.1;margin:0}
a{color:inherit}
.note{color:var(--muted);font-size:.85rem;font-style:italic}

.nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:.8rem 5vw;background:rgba(250,246,238,.92);backdrop-filter:blur(8px);border-bottom:1px solid #0001}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;font-family:var(--serif);font-weight:700;font-size:1.2rem}
.brand em{font-style:normal;color:var(--accent)}
.dots{display:grid;grid-template-columns:repeat(2,10px);gap:3px}
.dots i{width:10px;height:10px;border-radius:50%;background:var(--c)}
nav{display:flex;gap:1.6rem;align-items:center}
nav a{text-decoration:none;font-weight:500}
nav a:hover{color:var(--accent)}
.pill{background:var(--ink);color:var(--paper);padding:.45rem 1.1rem;border-radius:99px}
.pill:hover{background:var(--accent);color:#fff!important}
.menu-btn{display:none;background:none;border:1px solid var(--ink);border-radius:99px;padding:.3rem .9rem;font:inherit}

.btn{display:inline-block;background:var(--accent);color:#fff;border:2px solid var(--accent);padding:.75rem 1.6rem;border-radius:99px;font:600 1rem var(--sans);text-decoration:none;cursor:pointer;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px);background:#cf4d1c}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.btn.ghost-l{background:transparent;border-color:#fff;color:#fff}
.btn.small{padding:.45rem 1.1rem;font-size:.9rem}
.cta{display:flex;gap:.8rem;flex-wrap:wrap}

.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center;padding:4rem 5vw 3rem;min-height:80vh}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:600;color:var(--accent);margin:0 0 .8rem}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.logo-nav{height:60px;width:auto}
.logo-hero{width:min(100%,460px);height:auto;margin:-1rem 0 0 -.5rem}
.fly{font:italic 500 clamp(2rem,4vw,2.8rem)/1 var(--serif);margin:.5rem 0 0;color:var(--accent)}
.fly em{font-weight:700}
.lede{font-size:1.25rem;max-width:34ch;color:#3b352e;margin:1.2rem 0 2rem}
.hero-art{position:relative;height:min(70vh,560px)}
.hero-art img{position:absolute;object-fit:cover;border:8px solid #fff;box-shadow:0 18px 40px #0003;border-radius:3px}
.h1{width:52%;height:78%;left:0;top:8%;transform:rotate(-3deg)}
.h2{width:48%;height:62%;right:0;top:0;transform:rotate(3deg)}
.h3{width:42%;height:42%;right:10%;bottom:0;transform:rotate(-1.5deg)}

.strip{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 2.5rem;background:var(--ink);color:var(--paper);padding:1rem 5vw;font-family:var(--serif);font-style:italic}
.strip span::before{content:"✦";color:var(--gold);margin-right:.6rem;font-style:normal}

.section{padding:5rem 5vw}
.section.alt{background:var(--paper2)}
.section-head{max-width:640px;margin-bottom:2rem}
.section-head h2{font-size:clamp(2rem,4.5vw,3.2rem)}
.section-head p{color:var(--muted)}

.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.chip{border:1.5px solid var(--ink);background:transparent;padding:.35rem 1rem;border-radius:99px;font:500 .95rem var(--sans);cursor:pointer}
.chip.on,.chip:hover{background:var(--ink);color:var(--paper)}
.chip b{background:var(--accent);color:#fff;border-radius:99px;padding:0 .45rem;margin-left:.3rem;font-size:.8rem}
.grid{columns:3 280px;column-gap:1.4rem}
.card{break-inside:avoid;margin:0 0 1.4rem;position:relative;cursor:pointer;background:#fff;padding:10px 10px 0;box-shadow:0 6px 18px #0002;border-radius:3px;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 28px #0003}
.card img{width:100%;height:auto;border-radius:2px}
.card .cap{padding:.7rem .2rem .9rem}
.card h3{font-size:1.15rem}
.card p{margin:.15rem 0 0;color:var(--muted);font-size:.9rem}
.heart{position:absolute;top:18px;right:18px;width:40px;height:40px;border-radius:50%;border:0;background:#fffe;font-size:1.3rem;cursor:pointer;box-shadow:0 2px 8px #0003;color:var(--accent)}
.heart:hover{transform:scale(1.12)}
.empty{text-align:center;color:var(--muted)}

.artists{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.artist{background:var(--paper);padding:1.2rem;border-radius:6px;display:flex;gap:1.1rem;align-items:flex-start}
.artist img,.ph{width:96px;height:96px;border-radius:50%;object-fit:cover;flex:none}
.ph{display:grid;place-items:center;background:var(--c);color:#fff;font:700 1.6rem var(--serif)}
.artist h3{font-size:1.3rem}
.role{color:var(--accent);font-weight:600;font-size:.9rem;margin:.2rem 0 .5rem}
.artist p:last-child{margin:0;font-size:.95rem}

.events{list-style:none;padding:0;margin:0 0 3rem;max-width:820px}
.events li{display:flex;gap:1.3rem;align-items:center;padding:1.2rem 0;border-bottom:1px solid #0002}
.events time{flex:none;width:68px;text-align:center;background:var(--ink);color:var(--paper);border-radius:6px;padding:.4rem 0;font-size:.75rem;letter-spacing:.1em}
.events time b{display:block;font:700 1.8rem var(--serif);letter-spacing:0;color:var(--gold)}
.events div{flex:1}
.events h3{font-size:1.3rem}
.events p{margin:.2rem 0 0;color:var(--muted)}
.events button.on{background:var(--green);border-color:var(--green)}
.news{max-width:480px}
.news label{font-family:var(--serif);font-size:1.2rem;display:block;margin-bottom:.6rem}
.news div{display:flex;gap:.5rem}
input,select,textarea{font:inherit;width:100%;padding:.7rem .9rem;border:1.5px solid #0004;border-radius:6px;background:#fff}
input:focus,select:focus,textarea:focus{outline:3px solid var(--blue);outline-offset:1px}
.ok{color:var(--green);font-weight:500}

.visit{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.visit h2{font-size:clamp(2rem,4.5vw,3.2rem);margin-bottom:1rem}
.visit img{border-radius:6px;box-shadow:0 14px 30px #0003;max-height:520px;width:100%;object-fit:cover}
.addr{font-size:1.2rem}
dl{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.2rem;margin:1.5rem 0}
dt{font-weight:600}dd{margin:0;color:var(--muted)}

.contact{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;max-width:720px}
.contact label{display:grid;gap:.3rem;font-weight:500}
.contact .full,.contact .btn{grid-column:1/-1}
.contact .btn{justify-self:start}

footer{background:var(--ink);color:var(--paper);text-align:center;padding:2.5rem 5vw}
footer p{margin:.2rem}.small{opacity:.6;font-size:.85rem}

.lightbox{position:fixed;inset:0;background:#000e;z-index:50;display:flex;align-items:center;justify-content:center;gap:1rem;padding:1rem}
.lightbox[hidden]{display:none}
.lightbox figure{margin:0;display:flex;gap:2rem;align-items:center;max-width:1000px;max-height:92vh;color:#fff}
.lightbox img{max-height:86vh;max-width:55vw;object-fit:contain;border-radius:3px}
.lightbox h3{font-size:1.8rem}
.lightbox figcaption p{margin:.5rem 0;color:#ddd}
.lightbox .x,.lightbox .nav-l,.lightbox .nav-r{background:#fff2;border:0;color:#fff;font-size:2rem;width:48px;height:48px;border-radius:50%;cursor:pointer;flex:none}
.lightbox .x{position:absolute;top:1rem;right:1rem}
.lightbox .btn.small{color:#fff}

@media(max-width:800px){
  .menu-btn{display:block}
  nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--paper);padding:1rem 5vw 1.5rem;gap:1rem;border-bottom:1px solid #0002}
  nav.open{display:flex}
  .hero,.visit{grid-template-columns:1fr}
  .hero{min-height:0;padding-top:2.5rem}
  .hero-art{height:380px}
  .contact{grid-template-columns:1fr}
  .events li{flex-wrap:wrap}
  .lightbox figure{flex-direction:column;overflow:auto;gap:1rem}
  .lightbox img{max-width:90vw;max-height:55vh}
  .lightbox .nav-l,.lightbox .nav-r{position:absolute;bottom:1rem}
  .lightbox .nav-l{left:1rem}.lightbox .nav-r{right:1rem}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}