body.page { display: block; height: auto; }
.page-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 24px; max-width: 1040px; margin: 0 auto; }
.page-main { max-width: 1040px; margin: 0 auto; padding: 8px 24px 80px; }
.page-main section { margin: 0 0 56px; }
.page-main h1 { font-size: clamp(30px, 4.4vw, 46px); line-height: 1.08; letter-spacing: -.03em; margin: 6px 0 16px; max-width: 18ch; }
.page-main h2 { font-size: 24px; letter-spacing: -.02em; margin: 0 0 14px; }
.kicker { font-family: "Caveat Brush", cursive; font-size: 22px; color: var(--muted); }
.lede { font-size: 18px; line-height: 1.55; max-width: 60ch; color: color-mix(in srgb, var(--ink) 85%, var(--muted)); }
.stats { list-style: none; padding: 0; margin: 24px 0 0; display: flex; gap: 12px; flex-wrap: wrap; }
.stats li { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 14px 18px; min-width: 170px; }
.stats b { display: block; font-size: 26px; letter-spacing: -.02em; }
.stats span { color: var(--muted); font-size: 13px; }
.note { color: var(--muted); margin: -6px 0 16px; }
.packages { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.pkg { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; display: flex; flex-direction: column; }
.pkg h3 { margin: 0 0 6px; font-size: 18px; }
.price { font-size: 30px; font-weight: 700; letter-spacing: -.02em; }
.price small { font-size: 14px; font-weight: 500; color: var(--muted); }
.pkg ul { padding-left: 18px; margin: 12px 0 16px; color: color-mix(in srgb, var(--ink) 85%, var(--muted)); line-height: 1.5; font-size: 14px; flex: 1; }
.pkg .btn { align-self: flex-start; text-decoration: none; }
.small { font-size: 13px; color: var(--muted); }
.rules ul { line-height: 1.6; max-width: 70ch; padding-left: 18px; }
.inq { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; max-width: 720px; }
.inq .row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.inq label { display: block; font-size: 13px; font-weight: 600; color: var(--muted); margin-bottom: 14px; }
.inq label span { font-weight: 500; }
.inq input, .inq select, .inq textarea { display: block; width: 100%; margin-top: 6px; border: 1px solid var(--line-strong); border-radius: var(--r-md); padding: 10px 12px; font: inherit; font-size: 15px; color: var(--ink); background: var(--bg); outline: none; }
.inq input:focus, .inq select:focus, .inq textarea:focus { border-color: var(--ink); }
.inq [aria-invalid="true"] { border-color: var(--i-nightlife); }
.inq .hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.inq button { min-width: 140px; height: 44px; }
.inq button[disabled] { opacity: .6; }
.inq-status { min-height: 1.2em; margin: 10px 0 4px; }
.inq-status.ok { color: var(--i-sports); font-weight: 600; }
.inq-status.err { color: var(--i-nightlife); }
@media (max-width: 640px) {
  .page-top, .page-main { padding-left: 16px; padding-right: 16px; }
  .inq .row { grid-template-columns: 1fr; gap: 0; }
}
/* Shared with /submit/ (the "List your event" form). */
.sub-h { font-size: 16px !important; margin: 18px 0 12px !important; }
.sub-h span { font-weight: 500; color: var(--muted); font-size: 13px; }
.inq .check { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; color: var(--ink); line-height: 1.45; }
.inq .check input { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: var(--ink); }
/* Field errors: the box turns red, its label turns red, and a plain-words note sits right under it. */
.inq label.has-err { color: var(--i-nightlife); }
.inq [aria-invalid="true"] { border-color: var(--i-nightlife); border-width: 2px; padding: 9px 11px; background: color-mix(in srgb, var(--i-nightlife) 6%, var(--bg)); }
.inq .check [aria-invalid="true"] { outline: 2px solid var(--i-nightlife); outline-offset: 2px; }
.field-err { display: block; margin-top: 6px; font-size: 13px; font-weight: 600; line-height: 1.4; color: var(--i-nightlife); }
.field-err::before { content: "⚠ "; }
.inq .check .field-err { flex-basis: 100%; }
.inq .check.has-err { flex-wrap: wrap; }