/* NYC Concert Calendar — MTA subway-inspired. Helvetica, black/white, line colors. */
*{box-sizing:border-box}
:root{--ink:#111;--bg:#fff;--black:#000;--line:#111;--grey:#6b6b6b;--paper:#f4f4f4}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:#0039A6;text-decoration:none}
a:hover{text-decoration:underline}
main{max-width:1000px;margin:0 auto;padding:22px 18px 40px}
h1{font-size:2.2rem;font-weight:800;letter-spacing:-.02em;margin:.2em 0 .3em;line-height:1.05}
h2{font-weight:800;letter-spacing:-.01em}
.lede{font-size:1.15rem;color:#333;max-width:66ch}

/* top bar = black subway header */
.topbar{background:#000;color:#fff;display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:8px 18px;padding:12px 18px;border-bottom:4px solid #FCCC0A}
.brand{color:#fff;font-weight:800;font-size:1.3rem;letter-spacing:-.01em;display:flex;align-items:center;gap:10px}
.brand:hover{text-decoration:none}
.roundel{background:#EE352E;color:#fff;font-weight:800;border-radius:50%;
  width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;font-size:.82rem;border:2px solid #fff}
.topbar nav{display:flex;flex-wrap:wrap;gap:2px}
.topbar nav a{color:#fff;text-transform:uppercase;font-weight:700;font-size:.82rem;letter-spacing:.04em;
  padding:8px 12px;border-radius:2px}
.topbar nav a:hover{background:#222;text-decoration:none}
.topbar nav a.on{background:#FCCC0A;color:#000}

/* subway bullets */
.bullet{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding:0 6px;
  font-weight:800;font-size:.86rem;margin:0 3px 3px 0;vertical-align:middle}
.lineset .bullet{min-width:22px;height:22px;font-size:.75rem}

/* buttons */
.btn{display:inline-block;background:#000;color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  font-size:.82rem;padding:11px 18px;border:2px solid #000;border-radius:2px}
.btn:hover{background:#EE352E;border-color:#EE352E;color:#fff;text-decoration:none}
.btn.ghost{background:#fff;color:#000}
.btn.ghost:hover{background:#000;color:#fff}
.btn.big{font-size:.95rem;padding:14px 24px}
.herobtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}

/* hero */
.hero{border-bottom:4px solid #000;padding-bottom:22px;margin-bottom:26px}
.hero h1{font-size:2.9rem}

/* section headers */
.sech{font-size:1.5rem;border-top:3px solid #000;padding-top:10px;margin:30px 0 14px}

/* featured / venue cards */
.fgrid,.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.fcard,.vcard{border:2px solid #000;border-radius:3px;padding:14px;background:#fff;color:var(--ink);display:block}
.fcard:hover,.vcard:hover{background:#f4f4f4;text-decoration:none;box-shadow:4px 4px 0 #000}
.fcard h3,.vcard h3{margin:8px 0 4px;font-size:1.12rem;font-weight:800}
.fcard p,.vc-blurb{color:#333;font-size:.92rem;margin:4px 0 8px}
.vc-cap{color:var(--grey);font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;margin:0 0 4px;font-weight:700}
.btag{display:inline-block;color:#fff;font-weight:800;text-transform:uppercase;font-size:.68rem;letter-spacing:.05em;padding:3px 8px;border-radius:2px}

/* borough sections */
.boro{margin:26px 0}
.boroh{display:flex;align-items:center;gap:10px;font-size:1.6rem;border-top:5px solid;padding-top:10px}
.dot{width:20px;height:20px;border-radius:50%;display:inline-block}
.bcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:16px}
.bcard{display:flex;flex-direction:column;justify-content:center;color:#fff;border-radius:4px;padding:26px 18px;min-height:120px;font-weight:800;font-size:1.4rem}
.bcard:hover{text-decoration:none;filter:brightness(1.08)}
.bcard small{font-weight:600;font-size:.85rem;opacity:.9;margin-top:4px}

/* venue page */
.crumbs{font-size:.85rem;color:var(--grey);text-transform:uppercase;letter-spacing:.04em;font-weight:700;margin-bottom:6px}
.vmeta{color:#333;font-weight:600;margin:.2em 0}
.vlines{margin:.4em 0 .6em}
.vblurb{font-size:1.1rem;color:#222;max-width:66ch}
.special{background:#111;color:#fff;padding:12px 16px;border-radius:3px;margin:16px 0;max-width:70ch}
.special b{color:#FCCC0A;text-transform:uppercase;font-size:.78rem;letter-spacing:.05em}
.insider{border:2px solid #000;border-radius:3px;padding:12px 18px 14px;margin:0 0 18px;max-width:70ch}
.insider h2{font-size:1.05rem;margin:0 0 6px;text-transform:uppercase;letter-spacing:.03em}
.insider ul{margin:0;padding-left:18px}
.insider li{margin:5px 0;color:#333}
.vactions{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 20px}

/* shows */
.show{display:grid;grid-template-columns:96px 1fr auto;gap:10px;align-items:baseline;
  padding:11px 4px;border-bottom:1px solid #ddd}
.show .sd{font-weight:800;text-transform:uppercase;font-size:.82rem;letter-spacing:.02em}
.show .sa{font-weight:700;font-size:1.02rem}
.show .sv{grid-column:2;color:var(--grey);font-size:.88rem}
.show .tix{grid-row:1;grid-column:3;font-weight:700;text-transform:uppercase;font-size:.76rem}
.empty{background:#f4f4f4;border:2px dashed #999;border-radius:3px;padding:16px 18px;margin-top:10px}

/* prose + footer */
.prose{max-width:70ch}
.prose p{margin:.8em 0}
footer{border-top:4px solid #000;margin-top:40px;padding:24px 18px;max-width:1000px;margin-left:auto;margin-right:auto}
.fbig{font-weight:800;font-size:1.1rem;letter-spacing:.02em;margin:0 0 6px}
footer p{color:#444;margin:.3em 0;max-width:70ch}
footer .small{color:#888;font-size:.85rem}

@media(max-width:560px){
  .hero h1{font-size:2.1rem}h1{font-size:1.8rem}
  .show{grid-template-columns:70px 1fr;gap:4px 10px}
  .show .tix{grid-row:auto;grid-column:2}
}