/* The Christmas host's guide (/christmas-murder-mystery-party): the site's dark bands and gold, set as a plan the host
   reads top to bottom on a phone. Only that page loads this file. */
.host-hero { padding-top: clamp(4rem, 10vw, 7.5rem); text-align: left; }
.host-hero .display { max-width: 15ch; }
/* Children narrower than the measure (the 15ch headline, the 36rem phone line) would centre themselves under
   `.band > *`; they start at the measure's left edge instead, under the kicker. */
.host-hero > * { margin-left: max(0px, calc((100% - var(--measure)) / 2)); margin-right: auto; }
.host-hero__go { margin-top: 2rem; }
.host-hero__how { margin-top: 1.1rem; max-width: 36rem; color: var(--mist); }
.host-hero__how span { display: block; margin-top: 0.35rem; font-family: var(--label); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold); }

.host-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0; margin-top: 1.6rem; border-top: 1px solid var(--plum-line); }
.host-facts > div { padding: 1.1rem 1.2rem 1.2rem 0; border-bottom: 1px solid var(--plum-line); }
.host-facts dt { font-family: var(--label); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
.host-facts dd { margin: 0.45rem 0 0; color: var(--snow); line-height: 1.5; }
.host-facts + .sub { margin-top: 1.4rem; }

.host-cast { list-style: none; margin: 1.8rem auto 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 0.9rem; }
.host-cast li { display: grid; gap: 0.3rem; padding: 1.1rem 1.2rem; border: 1px solid var(--plum-line); border-radius: 10px; background: rgba(13, 10, 16, 0.45); }
.host-cast strong { font-family: var(--display); font-size: 1.2rem; font-weight: 600; color: var(--snow); }
.host-cast span { color: var(--mist); line-height: 1.45; }
.host-cast em { font-style: normal; font-family: var(--label); font-size: 0.85rem; color: var(--gold-light); }
.host-note { margin-top: 1.4rem; color: var(--mist); max-width: 40rem; }
.host-note a { color: var(--gold-light); }

.host-rounds { list-style: none; margin: 1.8rem auto 0; padding: 0; border-left: 2px solid var(--plum-line); }
.host-rounds li { position: relative; padding: 0 0 1.6rem 1.6rem; }
.host-rounds li::before { content: ""; position: absolute; left: -7px; top: 0.35rem; width: 12px; height: 12px; border-radius: 50%; background: var(--gold); }
.host-rounds h3 { margin: 0.2rem 0 0.35rem; font-size: 1.3rem; color: var(--snow); }
.host-rounds p { color: var(--mist); line-height: 1.5; max-width: 38rem; }
.host-rounds__time { font-family: var(--label); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold); }
.host-rounds .host-rounds__table { margin-top: 0.5rem; display: inline-block; padding: 0.3rem 0.7rem; border-radius: 999px; border: 1px solid var(--gold-deep); font-family: var(--label); font-size: 0.85rem; color: var(--gold-light); }

.host-game .lede { font-style: italic; }