/* /live/<slug>/: one funnel per live event. Standalone: no site nav, one offer, one CTA.
   Built on site.css tokens. Stage surface for the pitch, paper-ink panel for the seat. */

.page-live { background: var(--stage); }
.lv-bar .logo { cursor: default; }
.lv-bar__when { font: 500 12.5px/1 var(--mono); color: var(--dim-2); white-space: nowrap; }
.lv-bar .bar__cta { margin-left: auto; }
.page-live--thanks .lv-bar__when { margin-left: auto; }

.lv-k { font: 500 11.5px/1 var(--mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--dim); }
.lv-amber { color: var(--amber); }
.lv-fine { font-size: 13.5px; line-height: 1.5; color: var(--dim-2); }
.lv-fine a { color: inherit; text-underline-offset: 3px; }
.lv-state { display: inline-flex; align-items: center; gap: 10px; font: 500 12.5px/1 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--dim-2); }

/* ---------------------------------------------------------------- hero ---- */
.lv-hero { max-width: var(--maxw); margin: 0 auto; padding: calc(var(--bar-h) + clamp(3rem, 8vw, 6.5rem)) var(--pad) clamp(3rem, 6vw, 5rem); display: grid; gap: clamp(18px, 2.4vw, 28px); }
.lv-hero h1 { font: 900 clamp(2.9rem, 1rem + 7.4vw, 7.6rem)/0.9 var(--display); font-stretch: 125%; letter-spacing: -0.05em; max-width: 13ch; }
.lv-lede { font-size: clamp(1.1rem, 1rem + 0.55vw, 1.42rem); line-height: 1.45; color: var(--dim-2); max-width: 46ch; }
.lv-lede b { color: var(--chalk); font-weight: 600; }
.lv-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 6px 0 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); max-width: 64rem; }
.lv-facts > div { padding: 16px 18px 16px 0; }
.lv-facts > div + div { padding-left: 18px; border-left: 1px solid var(--rule); }
.lv-facts dt { font: 500 11.5px/1 var(--mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--dim); margin-bottom: 8px; }
.lv-facts dd { margin: 0; font-weight: 500; line-height: 1.4; }
.lv-facts__price { font: 900 1.9rem/1 var(--display) !important; font-stretch: 125%; color: var(--amber); }
.lv-local { display: block; font: 500 12.5px/1.4 var(--mono); color: var(--dim); margin-top: 4px; }
.lv-hero__go { display: flex; align-items: center; gap: 12px 20px; flex-wrap: wrap; }

/* ------------------------------------------------------------ sections ---- */
.lv-sec { max-width: var(--maxw); margin: 0 auto; padding: clamp(3.5rem, 7vw, 6rem) var(--pad) 0; display: grid; gap: 14px; }
.lv-sec > h2 { font: 900 clamp(2.1rem, 1.2rem + 3.4vw, 3.6rem)/0.95 var(--display); font-stretch: 112%; letter-spacing: -0.035em; margin-bottom: 10px; }
.lv-sec h3 { font: 800 1.12rem/1.2 var(--display); font-stretch: 112%; letter-spacing: -0.01em; }
.lv-sec p, .lv-sec li { color: var(--dim-2); }

.lv-list, .lv-rd { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.lv-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lv-list li { display: grid; grid-template-columns: 2.6em minmax(0, 1fr); gap: 12px; padding: 18px; border-radius: var(--r-panel); background: var(--booth); border: 1px solid var(--rule); }
.lv-list li h3 { margin-bottom: 6px; color: var(--chalk); }
.lv-q { font: 600 13px/1.4 var(--mono); color: var(--amber); }

.lv-rd li { display: grid; grid-template-columns: 4.2em minmax(0, 1fr); gap: 14px; padding: 16px 0; border-top: 1px solid var(--rule); }
.lv-rd li:last-child { border-bottom: 1px solid var(--rule); }
.lv-rd__t { font: 600 14px/1.4 var(--mono); color: var(--amber); font-variant-numeric: tabular-nums; }
.lv-rd h3 { margin-bottom: 4px; color: var(--chalk); }

.lv-fit__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.lv-fit__cols > div { padding: 20px; border-radius: var(--r-panel); border: 1px solid var(--rule); }
.lv-fit__cols h3 { margin-bottom: 12px; color: var(--chalk); }
.lv-yes, .lv-no { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.lv-yes li, .lv-no li { position: relative; padding-left: 22px; line-height: 1.5; }
.lv-yes li::before, .lv-no li::before { content: ""; position: absolute; left: 0; top: 0.5em; width: 9px; height: 9px; border-radius: 50%; }
.lv-yes li::before { background: var(--go); }
.lv-no li::before { background: var(--rule-2); }

.lv-host p { max-width: 58ch; font-size: clamp(1.04rem, 1rem + 0.2vw, 1.14rem); line-height: 1.65; }

/* ---------------------------------------------------------------- seat ---- */
.lv-seat { max-width: var(--maxw); margin: 0 auto; padding: clamp(3.5rem, 7vw, 6rem) var(--pad) 0; scroll-margin-top: calc(var(--bar-h) + 8px); }
.lv-seat__panel { max-width: 40rem; background: var(--paper-ink); border: 1px solid var(--rule-2); border-radius: 18px; padding: clamp(22px, 3.4vw, 40px); display: grid; gap: 20px; color-scheme: dark; }
.lv-seat__head { display: grid; gap: 8px; }
.lv-seat__head h2 { font: 900 clamp(2rem, 1.2rem + 2.6vw, 3rem)/0.95 var(--display); font-stretch: 125%; letter-spacing: -0.04em; }
.lv-seat__price { color: var(--dim-2); }
.lv-seat__price b { color: var(--amber); font: 800 1.2rem/1 var(--display); font-stretch: 112%; }
.lv-steps { list-style: none; margin: 0; padding: 0; display: flex; gap: 18px; font: 500 12.5px/1 var(--mono); color: var(--dim); }
.lv-steps li { display: inline-flex; align-items: center; gap: 8px; }
.lv-steps i { width: 9px; height: 9px; border-radius: 50%; background: var(--rule-2); }
.lv-steps .is-on { color: var(--chalk); }
.lv-steps .is-on i { background: var(--amber); }
.lv-steps .is-done i { background: var(--go); }

.lv-form { display: grid; gap: 16px; }
.lv-opt { font: 500 11.5px/1 var(--mono); color: var(--dim); margin-left: 6px; }
.lv-hint { font-size: 13px; color: var(--dim); }
.lv-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lv-form__go { justify-self: start; }
.lv-form__go[aria-busy="true"] { opacity: 0.7; cursor: progress; }
.lv-pay { display: grid; gap: 14px; }
.lv-form[hidden], .lv-pay[hidden], .btn[hidden] { display: none; }
.lv-pay__who { font-size: 14.5px; color: var(--dim-2); }
.lv-pay__frame { min-height: 420px; border-radius: var(--r-panel); overflow: hidden; background: var(--paper); }
.lv-back { all: unset; justify-self: start; cursor: pointer; font: 600 13.5px/1 var(--text); color: var(--dim-2); text-decoration: underline; text-underline-offset: 3px; min-height: 44px; display: inline-flex; align-items: center; }
.lv-back:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }

/* ----------------------------------------------------------------- faq ---- */
.lv-faq { padding-bottom: clamp(3.5rem, 7vw, 6rem); max-width: 56rem; margin-left: 0; }
@media (min-width: 761px) { .lv-faq { margin-left: max(0px, calc((100vw - var(--maxw)) / 2)); } }
.lv-faq__i { border-top: 1px solid var(--rule); }
.lv-faq__i:last-child { border-bottom: 1px solid var(--rule); }
.lv-faq__i summary { list-style: none; cursor: pointer; min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; font: 700 1.05rem/1.3 var(--display); font-stretch: 112%; color: var(--chalk); }
.lv-faq__i summary::-webkit-details-marker { display: none; }
.lv-faq__i summary::after { content: "+"; font: 500 20px/1 var(--mono); color: var(--amber); }
.lv-faq__i[open] summary::after { content: "\2212"; }
.lv-faq__i p { padding: 0 0 18px; max-width: 60ch; }

/* -------------------------------------------------------------- footer ---- */
.lv-foot { padding-top: clamp(2rem, 4vw, 3rem); border-top: 1px solid var(--rule); }
.lv-foot__seller { font-size: 13.5px; color: var(--dim); }

/* -------------------------------------------------------------- thanks ---- */
.lv-done { min-height: 70svh; display: grid; align-items: center; padding: calc(var(--bar-h) + 3rem) var(--pad) 3rem; max-width: var(--maxw); margin: 0 auto; }
.lv-done__card > div { display: grid; gap: 18px; justify-items: start; }
.lv-done__card > div[hidden] { display: none; }
.lv-done h1 { font: 900 clamp(2.6rem, 1rem + 6vw, 6rem)/0.92 var(--display); font-stretch: 125%; letter-spacing: -0.05em; }
.lv-done__join { display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; }
.lv-done__join[hidden] { display: none; }
.lv-done__cal { display: flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 860px) {
  .lv-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lv-facts > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .lv-facts > div:nth-child(n+3) { border-top: 1px solid var(--rule); }
  .lv-list, .lv-fit__cols { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .lv-bar__when { display: none; }
  .lv-hero__go .btn { width: 100%; }
  .lv-form__go { justify-self: stretch; }
}

/* ---------------------------------------------------------------- next ---- */
/* /next/: the list for the next live session. One field that matters, then a thank-you in place. */
.nx { width: 100%; }
.nx > div:focus { outline: none; }
.nx .lv-lede { max-width: 40ch; }
.nx-form { width: 100%; max-width: 40rem; margin-top: 6px; }
.lv-done__card.nx > div[hidden] { display: none; }
@media (max-width: 560px) {
  .nx-form .row2 { grid-template-columns: minmax(0, 1fr); }
  .nx-form .lv-form__go { justify-self: stretch; }
}