:root{--bg:#0b0e0d;--bg2:#151b19;--text:#eeece6;--muted:#9aa19d;--accent:#eeece6;--line:#2a312e;
--serif:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;--sans:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif}
@media(prefers-color-scheme:light){:root{}}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font:400 1rem/1.7 var(--sans);min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:var(--accent)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.15;letter-spacing:-.01em}
h1{font-size:clamp(2.6rem,6vw,4.5rem)}
h2{font-size:clamp(1.8rem,3.5vw,2.6rem);margin-bottom:1rem}
h3{font-size:1.5rem;margin-bottom:.4rem}
p{margin-bottom:1rem;max-width:65ch}
.wrap{max-width:1000px;margin:0 auto;padding:0 1.5rem}
section{padding:3.5rem 0;border-top:1px solid var(--line)}
.page-head{padding:4rem 0 2rem}
.page-head p{color:var(--muted);font-size:1.1rem}
/* header */
header{position:sticky;top:0;z-index:10;background:rgba(23,24,28,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:2rem;max-width:1200px;margin:0 auto;padding:.9rem 1.5rem}
.links{grid-column:2}
.brand{font:500 1.7rem var(--serif);color:var(--text);text-decoration:none;letter-spacing:.02em}
.links{display:flex;gap:1.8rem;list-style:none;padding:0;align-items:center}
.links a,.links summary,.links span{color:var(--text);text-decoration:none;font-size:.95rem;cursor:pointer;list-style:none}
.links a:hover,.links a.on,.links summary:hover{color:var(--accent)}
.drop{position:relative}
.drop ul{display:none;position:absolute;left:0;top:100%;background:var(--bg2);border:1px solid var(--line);padding:.6rem 1.2rem;list-style:none;min-width:12rem;white-space:nowrap}
.drop:hover ul,.drop:focus-within ul{display:block}
.drop li{padding:.35rem 0}
#tog,.burger{display:none}
@media(max-width:800px){
 .nav{display:flex;justify-content:space-between}
 .burger{display:block;cursor:pointer;color:var(--text);font-size:1.6rem}
 .links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg);flex-direction:column;align-items:flex-start;padding:1rem 1.5rem 1.5rem;border-bottom:1px solid var(--line)}
 #tog:checked~.links{display:flex}
 .drop ul{display:block;position:static;border:0;background:none;padding:.2rem 0 0 1rem}
}
/* hero */
.hero{min-height:calc(100vh - 9rem);padding:0;border:0;
background:url(images/hero.jpg) center/cover,linear-gradient(135deg,#2a2b33,#17181c)}
.hero .wrap{padding-bottom:3.5rem;width:100%}
.hero p{color:var(--text);font-size:1.25rem;margin:.5rem 0 0}
/* content */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.embed{aspect-ratio:16/9;background:var(--bg2);border:1px dashed var(--line);display:grid;place-items:center;color:var(--muted);font-size:.9rem;text-align:center;padding:1rem}
.embed iframe{width:100%;height:100%;border:0}
.spot{height:152px;aspect-ratio:auto}
.photo{aspect-ratio:4/3;background:var(--bg2) center/cover;border:1px dashed var(--line);display:grid;place-items:center;color:var(--muted);font-size:.9rem}
.btn{display:inline-block;padding:.75rem 1.6rem;background:var(--accent);color:#17181c;text-decoration:none;font-weight:500;border-radius:2px}
.btn:hover{background:#a3c8e6}
.btn.ghost{background:none;color:var(--accent);border:1px solid var(--accent)}
.jump{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:1.5rem}
.jump a{color:var(--text)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
@media(max-width:800px){.split{grid-template-columns:1fr}}
.list{list-style:none;padding:0}
.list li{padding:.7rem 0;border-bottom:1px solid var(--line)}
.gig{display:grid;grid-template-columns:8.5rem 1fr auto;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line);align-items:baseline}
.gig time{font:600 .95rem var(--serif);color:var(--accent);white-space:nowrap}
.gig small{color:var(--muted);display:block;font-size:.92rem}
@media(max-width:600px){.gig{grid-template-columns:1fr}.gig time{white-space:normal}}
details summary{cursor:pointer;color:var(--accent);margin:1.5rem 0 .5rem}
.steps{padding-left:1.2rem}.steps li{margin-bottom:.6rem}
.cform{display:flex;flex-direction:column;gap:1.2rem;max-width:32rem}
.cform label{display:flex;flex-direction:column;gap:.4rem;font-size:.9rem;color:var(--muted)}
.cform input,.cform select,.cform textarea{font:inherit;font-size:1rem;color:var(--text);background:var(--bg2);border:1px solid var(--line);padding:.7rem .8rem;border-radius:0}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
.cform textarea{resize:vertical}
.cform button{align-self:flex-start;cursor:pointer;border:2px solid var(--text)}
/* footer */
footer{border-top:1px solid var(--line);padding:1.8rem 1.5rem;color:var(--muted);font-size:.9rem}
footer .in{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1rem}
footer .tag{font:500 1.15rem var(--serif);color:var(--text)}
footer a{color:var(--muted);margin-right:1.2rem;text-decoration:none}
footer a:hover{color:var(--accent)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* header v2: light bar, big brand, centered nav, icons + pill on the right */
header{--ht:#16171a;background:#efeee8;color:var(--ht);backdrop-filter:none;border:0}
header a:focus-visible,header label:focus-visible{outline-color:var(--ht)}
h1,h2,h3{font-weight:700;letter-spacing:-.035em}
footer .tag{font:500 1.05rem var(--sans)}
.nav{padding:1.4rem 2.5rem;max-width:none}
.brand{font:700 2.6rem/1 var(--sans);letter-spacing:-.045em;color:var(--ht)}
.links{gap:2.6rem}
.links a{color:var(--ht);font-size:1.05rem}
.links a:hover,.links a.on{color:var(--ht);text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:2px}
.links .drop>span{color:var(--ht);cursor:default}
.links .drop>span.on{text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:2px}
.drop ul{background:#f7f6f1;border:1px solid #d9d7cd}
.right{grid-column:3;justify-self:end;display:flex;align-items:center;gap:1.3rem}
.right svg{width:20px;height:20px;display:block}
.right a{color:var(--ht)}
.right a.pill{background:var(--ht);color:#efeee8;padding:.95rem 1.7rem;border-radius:999px;font-size:1.05rem;text-decoration:none;margin-left:.6rem}
.right a.pill:hover{background:#34353c}
.m-only{display:none}
.hero{min-height:max(420px,calc(100vh - 12rem))}
/* identity v2: light base, outlined rectangular buttons, image tiles, pull quote */
.btn{background:var(--text);color:var(--bg);border:2px solid var(--text);border-radius:0;font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;padding:.9rem 1.8rem}
.btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.ghost{background:none;color:var(--text);border:2px solid var(--text)}
.btn.ghost:hover{background:var(--text);color:var(--bg)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;padding-bottom:4rem}
.tile{aspect-ratio:16/9;display:grid;place-items:center;text-align:center;padding:1rem;color:#fff;text-decoration:none;font:500 1.05rem var(--sans);letter-spacing:.25em;text-transform:uppercase;background:linear-gradient(rgba(22,23,26,.55),rgba(22,23,26,.55)),var(--img) center/cover,#2a2b33}
.tile:hover{background:linear-gradient(rgba(11,14,13,.78),rgba(11,14,13,.78)),var(--img) center/cover,#2a2b33}
.portrait{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.hero{background-position:38% 20%}
.right a.pill{background:none;color:var(--ht);border:2px solid var(--ht);border-radius:0;padding:.55rem 1.2rem;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;margin-left:.4rem}
.right a.pill:hover{background:var(--ht);color:#efeee8}
.cap{font-size:.85rem;color:var(--muted);margin-top:.5rem}
.quote{font:500 clamp(1.6rem,3.2vw,2.4rem)/1.3 var(--sans);letter-spacing:-.02em;max-width:30ch}
.quote cite{display:block;margin-top:1rem;font:400 .95rem var(--sans);font-style:normal;color:var(--muted);letter-spacing:0}
footer{border-top:1px solid var(--line)}
@media(max-width:800px){.nav{padding:1rem 1.25rem}.brand{font-size:2rem}.burger{color:var(--ht)}.right{display:none}.links{background:#efeee8;gap:1rem}.m-only{display:block}.drop ul{background:none;border:0}}
/* dark header + footer, colors taken from the hero photo */
header{--ht:#eeece6;background:#0b0e0d}
.drop ul{background:#131917;border:1px solid #2a312e}
.right a.pill:hover{background:var(--ht);color:#0b0e0d}
footer{background:#0b0e0d;color:#a3a8a4;border:0}
footer .tag{color:#eeece6}
footer a{color:#a3a8a4}
footer a:hover{color:#fff}
@media(max-width:800px){.links{background:#0b0e0d}.drop ul{background:none;border:0}}
/* whole site dark */
header{border-bottom:1px solid #1f2623}
footer{border-top:1px solid #1f2623}
.btn:hover{background:transparent;border-color:var(--text);color:var(--text)}
main:has(>.hero){display:flex;flex-direction:column}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:1.5rem}
.pimg{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.pimg.score{aspect-ratio:auto;object-fit:contain;background:#f7f6f1;padding:.5rem;border:1px solid var(--line)}
.pimg.tall{aspect-ratio:4/5}
/* lightbox */
.lb-trigger{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;text-align:left}
.lb-trigger .pimg{pointer-events:none}
.lightbox{position:fixed;inset:0;background:rgba(6,7,7,.92);display:none;align-items:center;justify-content:center;z-index:100;padding:3rem 1rem}
.lightbox.open{display:flex}
.lightbox img{max-width:min(92vw,1100px);max-height:78vh;object-fit:contain;background:#f7f6f1;padding:.6rem}
.lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:.9rem}
.lightbox figcaption{color:#eeece6;font-size:.95rem;text-align:center}
.lb-close,.lb-prev,.lb-next{position:fixed;background:none;border:0;color:#eeece6;cursor:pointer;font-size:1.6rem;line-height:1;padding:.6rem}
.lb-close{top:1rem;right:1.2rem}
.lb-prev{left:1rem;top:50%;transform:translateY(-50%);font-size:2.2rem}
.lb-next{right:1rem;top:50%;transform:translateY(-50%);font-size:2.2rem}
.lb-close:hover,.lb-prev:hover,.lb-next:hover{color:var(--accent)}
@media(max-width:600px){.lb-prev{left:.2rem}.lb-next{right:.2rem}}
.banner{display:block;width:100%;height:clamp(240px,40vw,540px);object-fit:cover;object-position:40% 30%;filter:brightness(.78) contrast(1.05)}
body.concerts-page .banner{filter:none;object-position:68% 48%}
.light-panel{background:#efeee8;color:#16171a;padding-bottom:1px}
.light-panel .page-head p,.light-panel .muted{color:#4a4943}
.light-panel h1{color:#16171a}
.light-panel a{color:#16171a;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.light-panel a:hover{color:#16171a;text-decoration-thickness:2px}
.legal{max-width:70ch}
.legal h2{margin-top:2.4rem;font-size:1.5rem}
.legal h2:first-child{margin-top:0}
.legal h3{margin-top:1.4rem;font-size:1.15rem}
.legal p{margin-bottom:1rem}
.legal ul{padding-left:1.3rem;margin:0 0 1.2rem}
.legal ul.index{list-style:none;padding-left:0;columns:2;gap:1.5rem}
.legal li{margin-bottom:.4rem}
.legal .seal{font-size:.8rem;color:#4a4943;margin-top:2rem}
@media(max-width:600px){.legal ul.index{columns:1}}
.light-panel .gig{border-color:#d8d6cb}
.light-panel .gig time{color:#16171a;font-weight:700}
.light-panel .gig small{color:#6b6a64}
.light-panel .btn.ghost{border-color:#16171a;color:#16171a}
.light-panel .btn.ghost:hover{background:#16171a;color:#efeee8}
/* concerts page: lighter throughout, smaller banner, caption on the photo, tighter buttons */
body.light-page header{--ht:#16171a;background:#efeee8;border-bottom:1px solid #d8d6cb}
body.light-page .drop ul{background:#f7f6f1;border:1px solid #d8d6cb}
body.light-page .right a.pill:hover{background:#16171a;color:#efeee8}
@media(max-width:800px){body.light-page .links{background:#efeee8}}
.banner-wrap{position:relative}
body.concerts-page .banner{height:clamp(240px,36vw,460px)}
.banner-cap{position:absolute;left:1.5rem;bottom:.6rem;margin:0;font-size:.85rem;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.75)}
.concerts-page .page-head{padding:2.2rem 0 1.6rem}
.concerts-page .light-panel .gig{font-size:.95rem}
.concerts-page .light-panel .btn.ghost{padding:.55rem 1.1rem;font-size:.72rem}
.concerts-page #upcoming{padding-bottom:4.5rem}
body.about-page .wrap{max-width:1300px}
body.about-page .page-head{padding:2.4rem 0 1.8rem}
body.about-page .split{align-items:stretch;gap:3rem}
body.about-page .split>div:first-child{display:flex;flex-direction:column}
body.about-page .split .portrait{flex:1;min-height:560px;aspect-ratio:auto}
@media(max-width:800px){body.about-page .split .portrait{min-height:320px}}
body.contact-page .wrap{max-width:1200px}
body.contact-page .page-head{padding:2.4rem 0 1.8rem}
@media(max-width:800px){.page-head,body.concerts-page .page-head,body.about-page .page-head,body.contact-page .page-head{padding-left:1.5rem;padding-right:1.5rem}}
body.contact-page .page-head p{max-width:52ch}
.light-panel .cform label{color:#6b6a64}
.light-panel .cform input,.light-panel .cform select,.light-panel .cform textarea{background:#fff;border-color:#d8d6cb;color:#16171a}
.light-panel .cform button{border-color:#16171a;color:#16171a;background:#16171a;color:#efeee8}
/* home: transparent header over the photo */
.home header{position:absolute;top:0;left:0;right:0;background:transparent;border:0}
.home .hero{min-height:calc(100vh - 5.5rem);background:url(images/hero.jpg) center/cover,linear-gradient(135deg,#2a2b33,#17181c);background-position:38% 20%}
.banner-cap{position:absolute;left:1.5rem;bottom:.6rem;margin:0;font-size:.85rem;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.75)}
.hero{position:relative}
.hero{flex:1}