/* Have A Nice Life — official site
   Stark, editorial system using the permanent "void" palette.
   Legacy aesthetic blocks remain for draft comparison only:
     - "death"  — aged paper, devotional, faded sepia tones in B/W
     - "void"   — pure black, fine serif, near-zero ornament
     - "press"  — newsprint / monospace ledger
*/

/* ---- Reset + base ------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

/* ---- Typography variables ----------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=EB+Garamond:ital,wght@0,400;0,500;1,400&family=JetBrains+Mono:wght@400;500&display=swap");

:root {
  --serif-display: "Cormorant Garamond", "EB Garamond", Georgia, serif;
  --serif-body: "EB Garamond", Georgia, "Times New Roman", serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --measure: 62ch;
  --rule: 1px solid currentColor;

  --pad-x: clamp(20px, 4vw, 56px);
  --pad-y: clamp(28px, 5vw, 64px);
}

/* ---- Aesthetic: death (legacy draft palette) --------------------------- */
html[data-aesthetic="death"] {
  --bg: #ebe5d8;          /* aged paper */
  --bg-deep: #d8d1c0;
  --ink: #15140f;          /* near-black ink */
  --ink-soft: #4a4738;
  --ink-faint: #847e6b;
  --rule-color: #15140f;

  --font-display: var(--serif-display);
  --font-body: var(--serif-body);
  --font-meta: var(--mono);
  --display-tracking: -0.01em;
  --display-weight: 500;
}
html[data-aesthetic="death"] body { background: var(--bg); color: var(--ink); }
html[data-aesthetic="death"] body::before {
  /* paper grain — restrained */
  content: "";
  position: fixed; inset: 0;
  pointer-events: none;
  background:
    radial-gradient(1200px 800px at 20% 10%, rgba(0,0,0,0.03), transparent 60%),
    radial-gradient(900px 600px at 80% 90%, rgba(0,0,0,0.04), transparent 60%);
  mix-blend-mode: multiply;
  z-index: 1;
}

/* ---- Aesthetic: void ---------------------------------------------------- */
html[data-aesthetic="void"] {
  --bg: #050505;
  --bg-deep: #000;
  --ink: #ece8df;
  --ink-soft: #b8b3a6;
  --ink-faint: #6f6a5d;
  --rule-color: #2a2825;

  --font-display: var(--serif-display);
  --font-body: var(--serif-body);
  --font-meta: var(--mono);
  --display-tracking: -0.005em;
  --display-weight: 400;
}
html[data-aesthetic="void"] body { background: var(--bg); color: var(--ink); }

/* ---- Aesthetic: press --------------------------------------------------- */
html[data-aesthetic="press"] {
  --bg: #f3f1ec;
  --bg-deep: #e3e0d7;
  --ink: #0a0a0a;
  --ink-soft: #3a3a38;
  --ink-faint: #7a7a76;
  --rule-color: #0a0a0a;

  --font-display: var(--mono);
  --font-body: var(--mono);
  --font-meta: var(--mono);
  --display-tracking: -0.02em;
  --display-weight: 500;
}
html[data-aesthetic="press"] body { background: var(--bg); color: var(--ink); }

/* ---- Body type ---------------------------------------------------------- */
body {
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "kern", "liga", "onum";
}
.page { position: relative; z-index: 2; }

/* ---- Layout primitives -------------------------------------------------- */
.wrap {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 var(--pad-x);
}
.wrap--narrow { max-width: 760px; }
.wrap--reading { max-width: 680px; }

.section { padding: var(--pad-y) 0; }
.section + .section { border-top: 1px solid var(--rule-color); }

hr.rule { border: 0; border-top: 1px solid var(--rule-color); margin: 0; }

/* ---- Site header / nav -------------------------------------------------- */
.site-head {
  border-bottom: 1px solid var(--rule-color);
  position: sticky; top: 0;
  background: var(--bg);
  z-index: 50;
}
.site-head__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px;
  padding: 14px var(--pad-x);
  max-width: 1240px; margin: 0 auto;
}
.site-head__brand {
  font-family: var(--font-display);
  font-weight: var(--display-weight);
  font-size: clamp(15px, 1.4vw, 18px);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}
.site-head__brand .brand-mark { font-style: italic; letter-spacing: 0; text-transform: none; font-size: 1.05em; }

.site-nav {
  display: flex; gap: clamp(14px, 2vw, 28px);
  align-items: center;
  font-family: var(--font-meta);
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.site-nav a,
.site-nav summary {
  text-decoration: none;
  padding: 6px 0;
  border-bottom: 1px solid transparent;
  color: var(--ink-soft);
  transition: color .15s, border-color .15s;
}
.site-nav a:hover,
.site-nav summary:hover,
.site-nav__dropdown[open] summary { color: var(--ink); border-bottom-color: var(--ink); }
.site-nav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--ink); }
.site-nav__dropdown { position: relative; display: inline-flex; align-items: center; }
.site-nav__dropdown summary { cursor: pointer; list-style: none; display: inline-flex; align-items: center; line-height: 1; }
.site-nav__dropdown summary::marker { content: ""; }
.site-nav__dropdown summary::-webkit-details-marker { display: none; }
.site-nav__dropdown summary::after { content: "↓"; margin-left: 0.35em; font-size: 0.9em; line-height: 1; letter-spacing: 0; transform: translateY(-0.04em); }
.site-nav__dropdown-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 20;
  min-width: 190px;
  padding: 10px 12px;
  background: var(--bg-deep);
  background-clip: padding-box;
  border: 1px solid var(--rule-color);
  outline: 1px solid rgba(236,232,223,.12);
  box-shadow: 0 18px 40px rgba(0,0,0,.65);
  display: grid;
  gap: 6px;
}
.site-nav__dropdown-menu a { display: block; padding: 6px 0; white-space: nowrap; }

@media (max-width: 640px) {
  .site-head__inner { flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px var(--pad-x); }
  .site-nav { width: 100%; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
}

/* ---- Site footer -------------------------------------------------------- */
.site-foot {
  border-top: 1px solid var(--rule-color);
  margin-top: 0;
  padding: 48px var(--pad-x) 56px;
  font-family: var(--font-meta);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}
.site-foot__inner { max-width: 1240px; margin: 0 auto; display: grid; gap: 24px; grid-template-columns: 1fr 1fr; }
.site-foot__col h4 { font-family: var(--font-meta); font-weight: 500; text-transform: uppercase; letter-spacing: 0.18em; font-size: 11px; margin: 0 0 10px; color: var(--ink); }
.site-foot__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.site-foot__col a { text-decoration: none; }
.site-foot__col a:hover { text-decoration: underline; text-underline-offset: 3px; }
.site-foot__official { grid-column: 1 / -1; padding-top: 18px; border-top: 1px solid var(--rule-color); display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.site-foot__official em { font-style: italic; color: var(--ink); }

@media (max-width: 640px) {
  .site-foot__inner { grid-template-columns: 1fr; }
}

/* ---- Display type ------------------------------------------------------- */
.display {
  font-family: var(--font-display);
  font-weight: var(--display-weight);
  letter-spacing: var(--display-tracking);
  line-height: 0.92;
  margin: 0;
}
.display--xxl { font-size: clamp(56px, 11vw, 168px); }
.display--xl  { font-size: clamp(44px, 7.5vw, 104px); }
.display--lg  { font-size: clamp(32px, 5vw, 64px); }
.display--md  { font-size: clamp(24px, 3.4vw, 40px); }

.eyebrow {
  font-family: var(--font-meta);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0;
}

.dek {
  font-family: var(--font-body);
  font-style: italic;
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.45;
  color: var(--ink-soft);
  max-width: 56ch;
}

.lede { font-size: 1.18em; line-height: 1.5; max-width: var(--measure); }
.prose p { max-width: var(--measure); margin: 0 0 1em; }
.prose p + p { text-indent: 1.4em; margin-top: -0.4em; }
.prose p:first-child { text-indent: 0; }
.prose h2 { font-family: var(--font-display); font-size: clamp(24px, 3vw, 34px); font-weight: var(--display-weight); margin: 2em 0 0.5em; letter-spacing: var(--display-tracking); }
.prose h3 { font-family: var(--font-display); font-size: clamp(20px, 2.4vw, 26px); font-weight: var(--display-weight); margin: 1.6em 0 0.4em; }
.prose a { text-underline-offset: 3px; }

/* ---- Buttons / links ---------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 18px;
  border: 1px solid var(--ink);
  background: transparent;
  color: var(--ink);
  font-family: var(--font-meta);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background .15s, color .15s;
}
.btn:hover { background: var(--ink); color: var(--bg); }
.btn--solid { background: var(--ink); color: var(--bg); }
.btn--solid:hover { background: transparent; color: var(--ink); }

.link-arrow {
  font-family: var(--font-meta);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}

/* ---- Image plates ------------------------------------------------------- */
.plate {
  position: relative;
  background: var(--bg-deep);
  border: 1px solid var(--rule-color);
  overflow: hidden;
  aspect-ratio: 4 / 5;
}
.plate--wide { aspect-ratio: 16 / 10; }
.plate--square { aspect-ratio: 1 / 1; }
.plate__caption {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 10px 14px;
  font-family: var(--font-meta);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink);
  background: linear-gradient(to top, rgba(0,0,0,0.0), rgba(0,0,0,0));
  border-top: 1px solid var(--rule-color);
  background-color: var(--bg);
  display: flex; justify-content: space-between; gap: 10px;
}
html[data-aesthetic="void"] .plate { background: #0d0d0d; }
html[data-aesthetic="void"] .plate__caption { background-color: #050505; color: var(--ink-soft); }

/* ---- Catalog ------------------------------------------------------------ */
.catalog-intro {
  display: grid;
  grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
  gap: clamp(20px, 4vw, 56px);
  padding: 0 0 clamp(28px, 5vw, 56px);
}
.catalog-intro p:last-child { max-width: 68ch; margin: 0; color: var(--ink-soft); }
.catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: clamp(28px, 4vw, 48px) clamp(22px, 3vw, 36px);
}
.catalog-card { display: grid; gap: 14px; align-content: start; }
.catalog-card__image {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: #090909;
}
.catalog-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: grayscale(1) contrast(1.06);
  transition: filter .18s ease, transform .18s ease;
}
.catalog-card__image:hover img { filter: grayscale(.25) contrast(1.04); transform: scale(1.01); }
.catalog-card__body { display: grid; gap: 8px; }
.catalog-card__meta { margin-top: 2px; }
.catalog-card__title { margin: 0; line-height: .96; }
.catalog-card__label { margin: 0; color: var(--ink-soft); font-style: italic; }
.catalog-card__facts {
  display: grid;
  gap: 7px;
  margin: 6px 0 0;
  font-size: 14px;
}
.catalog-card__facts div { display: grid; gap: 2px; }
.catalog-card__facts dt {
  font-family: var(--font-meta);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-faint);
}
.catalog-card__facts dd { margin: 0; color: var(--ink-soft); }
.catalog-card__link {
  margin: 8px 0 0;
  font-family: var(--font-meta);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.catalog-card__link a { text-decoration: none; border-bottom: 1px solid currentColor; }
@media (max-width: 760px) { .catalog-intro { grid-template-columns: 1fr; } }

/* ---- Tour ledger -------------------------------------------------------- */
.ledger { width: 100%; border-collapse: collapse; }
.ledger th, .ledger td {
  text-align: left;
  padding: 18px 12px;
  border-bottom: 1px solid var(--rule-color);
  vertical-align: baseline;
}
.ledger thead th {
  font-family: var(--font-meta);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink-soft);
  border-bottom: 1px solid var(--rule-color);
  padding-top: 0;
}
.ledger .col-date { white-space: nowrap; width: 1%; font-family: var(--font-meta); font-size: 13px; letter-spacing: 0.04em; }
.ledger .col-city { font-family: var(--font-display); font-size: clamp(20px, 2.6vw, 28px); letter-spacing: var(--display-tracking); }
.ledger .col-venue { color: var(--ink-soft); font-style: italic; }
.ledger .col-support { color: var(--ink-soft); font-size: 14px; font-family: var(--font-meta); letter-spacing: 0.04em; }
.ledger .col-tickets { text-align: right; white-space: nowrap; width: 1%; }
.ledger tr:hover td { background: rgba(0,0,0,0.025); }
html[data-aesthetic="void"] .ledger tr:hover td { background: rgba(255,255,255,0.03); }

@media (max-width: 720px) {
  .ledger thead { display: none; }
  .ledger, .ledger tbody, .ledger tr, .ledger td { display: block; width: 100%; }
  .ledger tr { border-bottom: 1px solid var(--rule-color); padding: 18px 0; }
  .ledger td { border: 0; padding: 2px 0; }
  .ledger .col-date { font-size: 12px; color: var(--ink-soft); }
  .ledger .col-tickets { text-align: left; padding-top: 12px; }
}

/* ---- FAQ ---------------------------------------------------------------- */
.faq details {
  border-top: 1px solid var(--rule-color);
  padding: 18px 0;
}
.faq details:last-child { border-bottom: 1px solid var(--rule-color); }
.faq summary {
  list-style: none;
  cursor: pointer;
  display: flex; justify-content: space-between; gap: 24px; align-items: baseline;
  font-family: var(--font-display);
  font-size: clamp(20px, 2.4vw, 26px);
  letter-spacing: var(--display-tracking);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+";
  font-family: var(--font-meta);
  font-size: 18px;
  color: var(--ink-soft);
}
.faq details[open] summary::after { content: "—"; }
.faq .faq-answer { padding-top: 14px; max-width: var(--measure); color: var(--ink-soft); }

/* ---- Index list (announcements) ---------------------------------------- */
.index-list { list-style: none; padding: 0; margin: 0; }
.index-list > li { border-top: 1px solid var(--rule-color); }
.index-list > li:last-child { border-bottom: 1px solid var(--rule-color); }
.index-list a {
  display: grid; grid-template-columns: 140px 1fr auto; gap: 24px; align-items: baseline;
  padding: 22px 0;
  text-decoration: none;
}
.index-list a:hover .index-list__title { text-decoration: underline; text-underline-offset: 4px; }
.index-list__date { font-family: var(--font-meta); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); }
.index-list__title { font-family: var(--font-display); font-size: clamp(22px, 2.6vw, 30px); letter-spacing: var(--display-tracking); }
.index-list__more { font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-soft); }
@media (max-width: 640px) {
  .index-list a { grid-template-columns: 1fr; gap: 6px; }
  .index-list__more { display: none; }
}

/* ---- Marquee strip ------------------------------------------------------ */
.marquee {
  border-top: 1px solid var(--rule-color);
  border-bottom: 1px solid var(--rule-color);
  overflow: hidden;
  background: var(--bg);
}
.marquee__track {
  display: flex; gap: 64px;
  white-space: nowrap;
  padding: 14px 0;
  font-family: var(--font-meta);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  animation: marquee 60s linear infinite;
  color: var(--ink-soft);
}
.marquee__track > span { display: inline-flex; align-items: center; gap: 64px; }
.marquee__track strong { color: var(--ink); font-weight: 500; }
.marquee:hover .marquee__track { animation-play-state: paused; }
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .marquee__track { animation: none; }
}

/* ---- Hero plate (homepage) --------------------------------------------- */
.hero {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(24px, 4vw, 56px);
  align-items: stretch;
  padding: clamp(36px, 6vw, 72px) 0 clamp(36px, 5vw, 56px);
}
.hero__type { display: flex; flex-direction: column; justify-content: space-between; gap: 32px; min-height: 56vh; }
.hero__art { position: relative; }
.hero__art .plate { height: 100%; min-height: 56vh; }
.hero__meta { display: flex; gap: 24px; flex-wrap: wrap; align-items: baseline; font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-soft); }
.hero__meta strong { color: var(--ink); font-weight: 500; }
@media (max-width: 820px) {
  .hero { grid-template-columns: 1fr; }
  .hero__type { min-height: auto; }
  .hero__art .plate { min-height: 320px; }
}

/* ---- Two-up layout ------------------------------------------------------ */
.two-up { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 56px); }
@media (max-width: 760px) { .two-up { grid-template-columns: 1fr; } }

/* ---- Aside band --------------------------------------------------------- */
.band {
  display: grid; grid-template-columns: minmax(0, 240px) 1fr; gap: clamp(20px, 4vw, 56px);
  padding: clamp(28px, 5vw, 56px) 0;
}
.band > .eyebrow { padding-top: 6px; }
@media (max-width: 760px) { .band { grid-template-columns: 1fr; } }

/* ---- Bandsintown widget styling fallback -------------------------------- */
.bit-widget-shell {
  border: 1px solid var(--rule-color);
  background: var(--bg);
  padding: clamp(16px, 2vw, 24px);
}
.bit-widget-shell__head {
  display: flex; justify-content: space-between; gap: 18px; align-items: baseline;
  border-bottom: 1px solid var(--rule-color);
  padding-bottom: 12px; margin-bottom: 16px;
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-soft);
}
.bit-widget-shell__head strong { color: var(--ink); font-weight: 500; }

/* ---- Skip link ---------------------------------------------------------- */
.skip-link {
  position: absolute; left: -9999px; top: 0;
  background: var(--ink); color: var(--bg);
  padding: 10px 14px;
  font-family: var(--font-meta); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  z-index: 100;
}
.skip-link:focus { left: 16px; top: 12px; }

/* ---- Tweaks panel ------------------------------------------------------- */
.tweaks-toggle,
.tweaks-panel {
  display: none !important;
}

.tweaks-toggle {
  position: fixed; right: 16px; bottom: 16px; z-index: 60;
  border: 1px solid var(--ink); background: var(--bg); color: var(--ink);
  padding: 10px 14px;
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
}
.tweaks-panel {
  position: fixed; right: 16px; bottom: 16px; z-index: 70;
  width: min(320px, calc(100vw - 32px));
  background: var(--bg); color: var(--ink);
  border: 1px solid var(--ink);
  font-family: var(--font-meta);
  font-size: 12px;
}
.tweaks-panel__head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid var(--ink);
  letter-spacing: 0.2em; text-transform: uppercase; font-size: 11px;
}
.tweaks-panel__body { padding: 14px; display: grid; gap: 16px; }
.tweaks-panel__group h5 { margin: 0 0 8px; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-soft); font-weight: 500; }
.tweaks-panel__opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.tweaks-panel__opts button {
  border: 1px solid var(--rule-color); padding: 8px 6px;
  font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  background: transparent; color: var(--ink); cursor: pointer;
}
.tweaks-panel__opts button[aria-pressed="true"] { background: var(--ink); color: var(--bg); }
.tweaks-panel__close { background: none; border: 0; cursor: pointer; padding: 0; font: inherit; color: inherit; }

/* ---- Selection ---------------------------------------------------------- */
::selection { background: var(--ink); color: var(--bg); }

/* ---- Print -------------------------------------------------------------- */
@media print {
  .site-head, .site-foot, .tweaks-toggle, .tweaks-panel, .marquee { display: none; }
  body { background: #fff; color: #000; }
}