/* Nashville Days — Pioneers page.
   A quiet, single-column thank-you page. Deliberately calmer than the
   main site: this is a private page for people who are already sold. */

.nd-pio-body { background: hsl(var(--navy)); min-height: 100vh; }

.nd-pio { padding: clamp(2.5rem, 7vw, 5rem) 1.25rem clamp(3rem, 8vw, 6rem); }
.nd-pio__inner { max-width: 40rem; margin: 0 auto; }

.nd-pio__brand { display: block; width: 190px; margin: 0 auto 2.4rem; }
.nd-pio__brand img { width: 100%; height: auto; display: block; }

.nd-pio__kicker {
  text-align: center; margin: 0 0 .8rem;
  font-family: Inter, sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .32em; text-transform: uppercase; color: hsl(var(--tan));
}
.nd-pio__title {
  text-align: center; margin: 0 0 1.6rem;
  font-family: "DM Serif Display", Georgia, serif; font-weight: 400;
  font-size: clamp(1.9rem, 5.2vw, 3rem); line-height: 1.12;
  color: hsl(var(--cream-ink));
}
.nd-pio__title em { font-style: italic; color: hsl(var(--tan)); }

.nd-pio__lead {
  margin: 0 0 1.1rem; font-weight: 300; font-size: 1.02rem; line-height: 1.75;
  color: hsl(var(--cream-ink) / .84);
}
.nd-pio__lead strong { color: hsl(var(--cream-ink)); font-weight: 600; }

/* ---- the price cut, front and centre ---- */
.nd-pio__pricecut {
  margin: 2.2rem 0; padding: 1.7rem 1.5rem; border-radius: 14px; text-align: center;
  border: 1px solid hsl(var(--tan) / .35); background: hsl(var(--navy-deep) / .5);
}
.nd-pio__pricecut-head {
  margin: 0 0 .9rem; font-family: Inter, sans-serif; font-size: 10.5px; font-weight: 600;
  letter-spacing: .26em; text-transform: uppercase; color: hsl(var(--tan));
}
.nd-pio__pricecut-row {
  display: flex; align-items: center; justify-content: center; gap: .9rem; margin: 0 0 1rem;
}
.nd-pio__was {
  font-family: "DM Serif Display", Georgia, serif; font-size: 1.8rem;
  color: hsl(var(--cream-ink) / .45); text-decoration: line-through;
}
.nd-pio__arrow { color: hsl(var(--tan)); }
.nd-pio__now {
  font-family: "DM Serif Display", Georgia, serif; font-size: 3rem; line-height: 1;
  color: hsl(var(--cream-ink));
}
.nd-pio__pricecut-note {
  margin: 0; font-size: .88rem; line-height: 1.65; font-weight: 300;
  color: hsl(var(--cream-ink) / .74);
}

.nd-pio__h2 {
  margin: 0 0 .5rem; font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.45rem; color: hsl(var(--cream-ink)); font-weight: 400;
}
.nd-pio__hint { margin: 0 0 1.1rem; font-size: .9rem; color: hsl(var(--cream-ink) / .7); font-weight: 300; }

/* ---- access gate ---- */
.nd-pio__gate { margin-top: 2.4rem; }
.nd-pio__codeform { display: flex; gap: .7rem; }
.nd-pio__codeform input {
  flex: 1; min-width: 0; font-family: Inter, sans-serif; font-size: 16px;
  letter-spacing: .06em; color: hsl(var(--cream-ink));
  padding: .9rem 1.1rem; border-radius: 10px;
  border: 1px solid hsl(var(--cream-ink) / .28); background: hsl(var(--navy-deep) / .55);
}
.nd-pio__codeform input::placeholder { color: hsl(var(--cream-ink) / .38); }
.nd-pio__codeform input:focus { outline: none; border-color: hsl(var(--tan)); }
.nd-pio__codeform button {
  flex: none; min-height: 48px; cursor: pointer; border: none; border-radius: 999px;
  padding: .9rem 1.7rem; font-family: Inter, sans-serif; font-size: 12px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  transition: filter .25s ease;
}
.nd-pio__codeform button:hover { filter: brightness(1.08); }

.nd-pio__status { margin: .8rem 0 0; font-size: .88rem; min-height: 1.2em; }
.nd-pio__status[data-state="err"]  { color: #ffb4ad; }
.nd-pio__status[data-state="ok"]   { color: hsl(var(--tan)); }
.nd-pio__status[data-state="busy"] { color: hsl(var(--cream-ink) / .7); }

/* ---- basket ---- */
.nd-pio__shop { margin-top: 2.6rem; }
.nd-pio__lines { display: flex; flex-direction: column; gap: .7rem; margin-bottom: 1.8rem; }
.nd-pio__line {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1rem 1.2rem; border-radius: 12px;
  border: 1px solid hsl(var(--cream-ink) / .16); background: hsl(var(--navy-deep) / .45);
}
.nd-pio__linename {
  margin: 0 0 .2rem; font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.12rem; color: hsl(var(--cream-ink));
}
.nd-pio__linesub { margin: 0; font-size: .78rem; color: hsl(var(--cream-ink) / .65); font-weight: 300; }

.nd-pio__qty { display: flex; align-items: center; gap: .5rem; flex: none; }
.nd-pio__qty button {
  width: 40px; height: 40px; border-radius: 999px; cursor: pointer;
  font-size: 1.2rem; line-height: 1;
  border: 1px solid hsl(var(--cream-ink) / .3); background: none;
  color: hsl(var(--cream-ink)); transition: all .2s ease;
}
.nd-pio__qty button:hover { background: hsl(var(--tan)); border-color: hsl(var(--tan)); color: hsl(var(--navy)); }
.nd-pio__qty output {
  min-width: 2ch; text-align: center; font-variant-numeric: tabular-nums;
  font-family: "DM Serif Display", Georgia, serif; font-size: 1.3rem; color: hsl(var(--cream-ink));
}

/* ---- supporter contribution ---- */
.nd-pio__chip {
  padding: 1.4rem 1.4rem 1.5rem; border-radius: 12px; margin-bottom: 1.6rem;
  border: 1px dashed hsl(var(--tan) / .45); background: hsl(var(--tan) / .07);
}
.nd-pio__chiphead {
  margin: 0 0 .5rem; font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.2rem; color: hsl(var(--cream-ink));
}
.nd-pio__chipnote { margin: 0 0 1rem; font-size: .85rem; line-height: 1.6; color: hsl(var(--cream-ink) / .74); font-weight: 300; }
.nd-pio__chipbtns { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 1rem; }
.nd-pio__chipbtns button {
  min-height: 44px; padding: .6rem 1.2rem; border-radius: 999px; cursor: pointer;
  font-family: Inter, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .1em;
  border: 1px solid hsl(var(--cream-ink) / .3); background: none;
  color: hsl(var(--cream-ink) / .82); transition: all .2s ease;
}
.nd-pio__chipbtns button:hover { border-color: hsl(var(--tan)); color: hsl(var(--cream-ink)); }
.nd-pio__chipbtns button.is-on {
  background: hsl(var(--tan)); border-color: hsl(var(--tan)); color: hsl(var(--navy)); font-weight: 700;
}
.nd-pio__chipother { display: block; }
.nd-pio__chipother > span {
  display: block; margin-bottom: .45rem; font-family: Inter, sans-serif; font-size: 10.5px;
  font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: hsl(var(--cream-ink) / .6);
}
.nd-pio__chipother > div {
  display: flex; align-items: center; gap: .4rem; max-width: 11rem;
  padding: .1rem .9rem; border-radius: 10px;
  border: 1px solid hsl(var(--cream-ink) / .26); background: hsl(var(--navy-deep) / .5);
}
.nd-pio__chipother span[aria-hidden] { color: hsl(var(--cream-ink) / .7); font-size: 1rem; }
.nd-pio__chipother input {
  flex: 1; min-width: 0; background: none; border: none; color: hsl(var(--cream-ink));
  font-family: Inter, sans-serif; font-size: 16px; padding: .75rem 0;
}
.nd-pio__chipother input:focus { outline: none; }

/* ---- email + total + pay ---- */
.nd-pio__email { display: block; margin-bottom: 1.5rem; }
.nd-pio__email > span {
  display: block; margin-bottom: .45rem; font-family: Inter, sans-serif; font-size: 10.5px;
  font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: hsl(var(--cream-ink) / .6);
}
.nd-pio__email input {
  width: 100%; font-family: Inter, sans-serif; font-size: 16px; color: hsl(var(--cream-ink));
  padding: .85rem 1.1rem; border-radius: 10px;
  border: 1px solid hsl(var(--cream-ink) / .26); background: hsl(var(--navy-deep) / .5);
}
.nd-pio__email input::placeholder { color: hsl(var(--cream-ink) / .38); }
.nd-pio__email input:focus { outline: none; border-color: hsl(var(--tan)); }

.nd-pio__total {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: 1.1rem 0; margin-bottom: 1.3rem;
  border-top: 1px solid hsl(var(--cream-ink) / .2);
  border-bottom: 1px solid hsl(var(--cream-ink) / .2);
}
.nd-pio__total span {
  font-family: Inter, sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .24em; text-transform: uppercase; color: hsl(var(--cream-ink) / .7);
}
.nd-pio__total strong {
  font-family: "DM Serif Display", Georgia, serif; font-size: 2.1rem;
  font-weight: 400; color: hsl(var(--cream-ink));
}

.nd-pio__pay {
  width: 100%; min-height: 54px; cursor: pointer; border: none; border-radius: 999px;
  padding: 1.05rem 2rem; font-family: Inter, sans-serif; font-size: 13px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  box-shadow: 0 16px 40px -18px hsl(var(--primary) / .9);
  transition: filter .25s ease, transform .25s ease;
}
.nd-pio__pay:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
.nd-pio__pay:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }

.nd-pio__small {
  margin: 1.2rem 0 0; font-size: .8rem; line-height: 1.65;
  color: hsl(var(--cream-ink) / .58); font-weight: 300;
}

.nd-pio__foot {
  margin: 3rem 0 0; padding-top: 1.8rem; text-align: center;
  border-top: 1px solid hsl(var(--cream-ink) / .14);
  font-size: .85rem; line-height: 1.8; color: hsl(var(--cream-ink) / .6); font-weight: 300;
}
.nd-pio__foot a { color: hsl(var(--tan)); }

/* ---------------- WHAT'S CONFIRMED FOR 2027 ----------------
   Kept lightweight and text-first (no big photo cards) so this page stays
   fast to scan and quick to buy from — reassurance for anyone scrolling
   before or after starting a basket, not a second homepage. */
.nd-pio__whats { margin-top: 3.2rem; padding-top: 2.4rem; border-top: 1px solid hsl(var(--cream-ink) / .14); }
.nd-pio__whats-sub {
  margin: 1.8rem 0 .8rem; font-family: Inter, sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: hsl(var(--tan));
}
.nd-pio__whats-sub:first-of-type { margin-top: 1.4rem; }

.nd-pio__lineup, .nd-pio__vendors {
  list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column;
}
.nd-pio__lineup li, .nd-pio__vendors li {
  display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
  padding: .55rem 0; border-top: 1px solid hsl(var(--cream-ink) / .1);
  font-size: .92rem; color: hsl(var(--cream-ink) / .92);
}
.nd-pio__lineup li:last-child, .nd-pio__vendors li:last-child { border-bottom: 1px solid hsl(var(--cream-ink) / .1); }
.nd-pio__lineup li em, .nd-pio__vendors li em {
  font-style: normal; font-size: .74rem; letter-spacing: .04em;
  color: hsl(var(--cream-ink) / .5); white-space: nowrap;
}
.nd-pio__lineup li.is-headline span {
  font-family: "DM Serif Display", Georgia, serif; font-size: 1.15rem; color: hsl(var(--tan));
}
.nd-pio__lineup li.is-headline em { color: hsl(var(--tan) / .8); }

.nd-pio__farm { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.nd-pio__farm figure { margin: 0; }
.nd-pio__farm img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 10px; display: block; }
.nd-pio__farm figcaption {
  margin-top: .4rem; font-size: .72rem; line-height: 1.35;
  color: hsl(var(--cream-ink) / .65); text-align: center;
}

.nd-pio__whats-note { margin: 1rem 0 0; font-size: .82rem; font-style: italic; color: hsl(var(--cream-ink) / .5); }

@media (max-width: 520px) {
  .nd-pio__farm { grid-template-columns: 1fr; max-width: 16rem; margin: 0 auto; }
  .nd-pio__codeform { flex-direction: column; }
  .nd-pio__line { flex-direction: column; align-items: flex-start; gap: .8rem; }
  .nd-pio__qty { align-self: flex-end; }
}

/* ---------------- FAILURE MODAL ----------------
   Only ever shown when something breaks on our side or the connection to
   Stripe. Stripe's own hosted page handles declines and card errors, so
   this never duplicates that. Styled to sit inside the same navy/tan world
   as the rest of the page so it feels part of it, not a browser alert. */
html.nd-pio-modal-open { overflow: hidden; }

.nd-pio-modal {
  position: fixed; inset: 0; z-index: 120;
  display: flex; align-items: center; justify-content: center;
  padding: clamp(1rem, 5vw, 2.5rem);
  background: hsl(var(--navy-deep) / .72);
  backdrop-filter: blur(6px);
  opacity: 0; transition: opacity .22s ease;
}
.nd-pio-modal.is-open { opacity: 1; }

.nd-pio-modal__card {
  width: 100%; max-width: 30rem;
  background: hsl(var(--navy));
  border: 1px solid hsl(var(--tan) / .38);
  border-radius: 16px;
  padding: clamp(1.6rem, 5vw, 2.2rem);
  box-shadow: 0 40px 90px -30px rgba(0,0,0,.8);
  transform: translateY(10px) scale(.98);
  transition: transform .26s cubic-bezier(.16,.84,.44,1);
  text-align: center;
}
.nd-pio-modal.is-open .nd-pio-modal__card { transform: none; }

.nd-pio-modal__title {
  margin: 0 0 .7rem;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(1.35rem, 4vw, 1.7rem); line-height: 1.25;
  color: hsl(var(--cream-ink));
}
.nd-pio-modal__msg {
  margin: 0 0 1.6rem; font-size: .95rem; line-height: 1.65;
  color: hsl(var(--cream-ink) / .78); font-weight: 300;
}

.nd-pio-modal__actions { display: flex; flex-direction: column; gap: .6rem; }
.nd-pio-modal__retry {
  min-height: 48px; padding: .9rem 1.6rem; border: none; border-radius: 999px;
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  font-family: Inter, sans-serif; font-size: 13px; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; cursor: pointer;
  box-shadow: 0 14px 34px -16px hsl(var(--primary) / .8);
  transition: filter .2s ease, transform .2s ease;
}
.nd-pio-modal__retry:hover { filter: brightness(1.08); transform: translateY(-1px); }
.nd-pio-modal__close {
  min-height: 44px; padding: .7rem 1.4rem; border-radius: 999px; cursor: pointer;
  background: none; border: 1px solid hsl(var(--cream-ink) / .3);
  color: hsl(var(--cream-ink) / .82);
  font-family: Inter, sans-serif; font-size: 12px; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase;
  transition: border-color .2s ease, color .2s ease;
}
.nd-pio-modal__close:hover { border-color: hsl(var(--tan)); color: hsl(var(--tan)); }

.nd-pio-modal__help {
  margin: 1.3rem 0 0; font-size: .8rem; line-height: 1.6;
  color: hsl(var(--cream-ink) / .55); font-weight: 300;
}
.nd-pio-modal__help a { color: hsl(var(--tan)); }

@media (prefers-reduced-motion: reduce) {
  .nd-pio-modal, .nd-pio-modal__card { transition: none; }
  .nd-pio-modal__card { transform: none; }
}

/* ---------------- THE CURTAIN ----------------
   The 2027 bill sits behind a soft blur until the code is accepted, so
   entering it feels like being let in rather than passing a checkpoint.
   This is presentation only: the markup is all present and the same
   line-up is public on the main site. It is theatre, not security. */
.nd-pio__curtain { position: relative; }

.nd-pio__reveal {
  transition: filter 1.1s cubic-bezier(.16,.84,.44,1),
              opacity 1.1s ease,
              max-height 1.3s cubic-bezier(.16,.84,.44,1);
}
.nd-pio__reveal.is-locked {
  filter: blur(10px) saturate(.55);
  opacity: .5;
  max-height: 460px;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}
/* Softens the hard cut where the locked block is clipped. */
.nd-pio__curtain::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 190px;
  background: linear-gradient(to bottom, hsl(var(--navy) / 0), hsl(var(--navy)) 78%);
  pointer-events: none; opacity: 1; transition: opacity .9s ease;
}
.nd-pio__curtain.is-open::after { opacity: 0; }

/* ---- the invitation sitting over the blur ---- */
.nd-pio__lockmsg {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  z-index: 2; width: min(24rem, 92%); text-align: center;
  padding: 1.9rem 1.6rem 1.7rem; border-radius: 16px;
  background: hsl(var(--navy-deep) / .93);
  border: 1px solid hsl(var(--tan) / .45);
  box-shadow: 0 34px 70px -28px rgba(0,0,0,.85);
  transition: opacity .5s ease, transform .5s ease;
}
.nd-pio__lockicon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; margin-bottom: .9rem; border-radius: 999px;
  border: 1px solid hsl(var(--tan) / .5); color: hsl(var(--tan));
}
.nd-pio__lockicon svg { width: 21px; height: 21px; }
.nd-pio__locktitle {
  margin: 0 0 .6rem; font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.3rem; line-height: 1.25; color: hsl(var(--cream-ink));
}
.nd-pio__locknote {
  margin: 0 0 1.3rem; font-size: .88rem; line-height: 1.6;
  color: hsl(var(--cream-ink) / .74); font-weight: 300;
}
.nd-pio__lockcta {
  min-height: 46px; padding: .8rem 1.6rem; border: none; border-radius: 999px;
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  font-family: Inter, sans-serif; font-size: 12px; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; cursor: pointer;
  transition: filter .2s ease, transform .2s ease;
}
.nd-pio__lockcta:hover { filter: brightness(1.08); transform: translateY(-1px); }

.nd-pio__lockmsg.is-gone {
  opacity: 0; transform: translate(-50%, calc(-50% - 12px)); pointer-events: none;
}

/* ---- the welcome line, revealed with the bill ---- */
.nd-pio__welcome {
  margin: 0 0 1.6rem; text-align: center;
  font-family: "DM Serif Display", Georgia, serif; font-style: italic;
  font-size: 1.08rem; color: hsl(var(--tan));
  opacity: 0; transform: translateY(8px);
  transition: opacity .8s ease .35s, transform .8s ease .35s;
}
.nd-pio__welcome.is-in { opacity: 1; transform: none; }
.nd-pio__welcome-star { color: hsl(var(--tan) / .7); margin: 0 .5rem; font-size: .8em; }

/* A single warm sweep across the bill as it opens. Purely a flourish. */
.nd-pio__curtain.is-opening .nd-pio__reveal { position: relative; }
.nd-pio__curtain.is-opening .nd-pio__reveal::after {
  content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: linear-gradient(105deg, hsl(var(--tan) / 0) 35%, hsl(var(--tan) / .16) 50%, hsl(var(--tan) / 0) 65%);
  animation: ndPioSweep 1.5s ease-out 1 both;
}
@keyframes ndPioSweep {
  from { transform: translateX(-100%); }
  to   { transform: translateX(100%); }
}

@media (max-width: 520px) {
  .nd-pio__lockmsg { padding: 1.6rem 1.2rem 1.4rem; }
  .nd-pio__reveal.is-locked { max-height: 440px; }
}

@media (prefers-reduced-motion: reduce) {
  .nd-pio__reveal, .nd-pio__welcome, .nd-pio__lockmsg, .nd-pio__curtain::after { transition: none; }
  .nd-pio__curtain.is-opening .nd-pio__reveal::after { animation: none; display: none; }
}

/* ---- Date and venue, sitting under the logo ----
   The most important fact on a ticket page is when it is, so it leads
   rather than being left to the footer. Hairlines either side echo the
   framed date treatment used in the main site hero. */
.nd-pio__date {
  display: flex; align-items: center; justify-content: center; gap: 1rem;
  max-width: 24rem; margin: 0 auto .55rem;
}
.nd-pio__date i {
  flex: 1; height: 1px; background: hsl(var(--tan) / .45);
}
.nd-pio__date span {
  flex: none; font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(1.35rem, 4.2vw, 1.75rem); line-height: 1.15;
  color: hsl(var(--cream-ink)); white-space: nowrap;
}
.nd-pio__venue {
  margin: 0 0 2.2rem; text-align: center;
  font-family: Inter, sans-serif; font-size: 10.5px; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase;
  color: hsl(var(--tan) / .9);
}

@media (max-width: 480px) {
  .nd-pio__date { gap: .7rem; }
  .nd-pio__venue { font-size: 9.5px; letter-spacing: .16em; line-height: 1.6; }
}
