/* Seasonal homepage: midnight violet, candle gold, and spellbook green. */
.hocus-home {
  --paper: #f8efda;
  --ink: #f8efda;
  --accent: #c7e789;
  --deep: #0e0b16;
  --gold: #efbe76;
  --line: #51415e;
  --muted: #c6b7d1;
  --night: #130f1e;
  --panel: #221a30;
  --violet: #c0a2e4;
  background: var(--night);
  color: var(--ink);
  color-scheme: dark;
}

.hocus-home :is(a, button, summary, .cast-carousel):focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 5px;
}
.hocus-home .skip { background: var(--paper); color: var(--deep); }
.hocus-home .masthead { background: var(--deep); border-color: var(--line); }
.hocus-home .wordmark { color: var(--paper); }
.hocus-home .wordmark small { color: var(--gold); }
.hocus-home .main-nav { background: var(--deep); }
.hocus-home .main-nav > a:not(.button):hover { color: var(--gold); }
.hocus-home .button-wine,
.hocus-home .button-gold {
  background: var(--accent);
  color: var(--deep);
  border-color: var(--accent);
}
.hocus-home .button-wine:hover,
.hocus-home .button-gold:hover { background: #dcf4b0; border-color: #dcf4b0; }
.hocus-home .text-link { color: var(--gold); }
.hocus-home .text-link:hover { color: var(--paper); }

.hocus-home .hero {
  background: radial-gradient(ellipse at 80% 30%, #322448 0, #1d162b 43%, var(--night) 78%);
  border-bottom: 1px solid var(--line);
}
.hocus-home .hero-inner { padding-block: 66px 48px; }
.hocus-home .hero .eyebrow { color: var(--accent); max-width: 36ch; }
.hocus-home .hero h1 {
  font-size: clamp(3.4rem, 6.2vw, 6.2rem);
  line-height: 1.01;
  letter-spacing: -.045em;
}
.hocus-home .hero h1 em { color: var(--gold); }
.hocus-home .hero-copy > p:not(.eyebrow) { color: var(--muted); max-width: 38ch; }
.hocus-home .hero-actions { gap: 18px 26px; }
.hocus-home .hero-dates {
  display: flex;
  gap: 20px 32px;
  flex-wrap: wrap;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  max-width: 410px;
}
.hocus-home .hero-dates a { display: grid; gap: 3px; text-decoration: none; min-height: 44px; }
.hocus-home .hero-dates span { color: var(--muted); font-size: .75rem; letter-spacing: .13em; text-transform: uppercase; }
.hocus-home .hero-dates strong { color: var(--gold); font-family: var(--serif); font-size: 1.45rem; font-weight: 400; }
.hocus-home .hero-dates a:hover strong { text-decoration: underline; text-underline-offset: 5px; }
.hocus-home .gallery-stage {
  background: var(--deep);
  border-color: #8c714f;
  padding: 12px;
  box-shadow: 0 20px 60px #08060f66;
}
.hocus-home .gallery-image { background: var(--deep); }
.hocus-home .cast-slide figcaption { padding-inline: 8px; }
.hocus-home .cast-slide figcaption strong { color: var(--gold); font-family: var(--serif); font-size: 1.5rem; font-weight: 400; }
.hocus-home .cast-slide figcaption span { color: var(--muted); }
.hocus-home .gallery-controls button { border-color: #897098; color: var(--paper); }
.hocus-home .gallery-controls button:hover { background: #3b2c4d; }
.hocus-home .gallery-dot span { border-color: var(--accent); }
.hocus-home .gallery-dot[aria-pressed="true"] span { background: var(--accent); }
.hocus-home .gallery-controls .rotation-toggle { color: var(--accent); }
.cast-carousel.is-enhanced .gallery-stage { display: grid; }
.cast-carousel.is-enhanced .cast-slide {
  grid-area: 1 / 1;
  min-width: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 1200ms ease-in-out, visibility 0s linear 1200ms;
}
.cast-carousel.is-enhanced .cast-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 1200ms ease-in-out, visibility 0s;
}

/* Match the portraits' framing so the performers stay at a similar scale. */
.gallery-image.sanderson-transform {
  --photo-height: 450px;
  position: relative;
  height: var(--photo-height);
  overflow: hidden;
}
.sanderson-layer {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(100%, calc(var(--photo-height) * 1.07001045));
  aspect-ratio: 2048 / 1914;
  transform: translate(-50%, -50%);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 3600ms cubic-bezier(.45, 0, .55, 1);
}
.sanderson-after { opacity: 0; }
.gallery-image .sanderson-after img {
  flex: none;
  max-width: none;
  width: 133.333333%;
  height: auto;
  /* Upright, with the faces and raised-hand pose closer to the first photo. */
  transform: translate(1%, 8%) rotate(90deg);
}
/* Keep the first photo opaque underneath to avoid a dark dip mid-dissolve. */
.sanderson-transform.is-transformed .sanderson-before { opacity: 1; }
.sanderson-transform.is-transformed .sanderson-after { opacity: 1; }
.transformation-toggle:not([hidden]) {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  min-height: 44px;
  padding: 5px 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font-size: .9375rem;
  text-align: left;
  text-decoration: underline;
  text-underline-offset: 5px;
  cursor: pointer;
}
.transformation-toggle:hover { color: var(--paper); }
.transformation-toggle:disabled { cursor: wait; opacity: .75; }
@media (max-width: 1080px) { .gallery-image.sanderson-transform { --photo-height: 395px; } }
@media (max-width: 820px) { .gallery-image.sanderson-transform { --photo-height: 330px; } }
@media (max-width: 680px) { .gallery-image.sanderson-transform { --photo-height: 360px; } }
@media (max-width: 380px) { .gallery-image.sanderson-transform { --photo-height: 310px; } }
@media (prefers-reduced-motion: reduce) {
  .sanderson-layer,
  .cast-carousel.is-enhanced .cast-slide,
  .cast-carousel.is-enhanced .cast-slide.is-active { transition: none; }
}

.hocus-home .season-strip { background: #272033; border-color: var(--line); }
.hocus-home .season-strip b { color: var(--gold); }
.hocus-home .season-strip span { color: var(--muted); }
.hocus-home .section-heading .eyebrow { color: var(--accent); }
.hocus-home .section-heading h2 { color: var(--paper); }
.hocus-home .show-card { background: var(--panel); border-color: var(--line); }
.hocus-home .show-hocus-pocus { border-color: #8c714f; }
.hocus-home .show-topline { color: var(--violet); }
.hocus-home .show-subtitle { color: var(--gold); }
.hocus-home .show-date { border-color: #655071; }
.hocus-home .show-date .month { color: var(--accent); }
.hocus-home .show-ticket { color: var(--accent); border-color: #9caf79; }
.hocus-home .show-ticket:hover { color: var(--deep); background: var(--accent); border-color: var(--accent); }
.hocus-home .show-hocus-pocus .show-ticket { color: var(--deep); background: var(--accent); border-color: var(--accent); }
.hocus-home .show-hocus-pocus .show-ticket:hover { background: #dcf4b0; border-color: #dcf4b0; }
.hocus-home .cast-jump { color: var(--gold); }
.hocus-home .curtain-info .eyebrow { color: var(--gold); }
.hocus-home .guest-date { background: var(--panel); }
.hocus-home .guest-date h3 { color: var(--paper); }

.hocus-home .press-section {
  background: #1c1528;
  border-top: 1px solid var(--line);
}
.press-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  align-items: center;
  gap: 36px;
  margin-bottom: 48px;
  padding: 32px;
  background: var(--deep);
  border: 1px solid #8c714f;
}
.press-feature-art { min-width: 0; margin: 0; }
.press-feature-art img { width: 100%; height: auto; }
.press-feature-art figcaption { margin-top: 10px; color: var(--muted); font-size: .75rem; }
.press-feature-copy { min-width: 0; }
.press-feature-copy .eyebrow { color: var(--accent); margin-bottom: 12px; }
.press-feature-copy h3 {
  font-family: var(--serif);
  font-size: clamp(1.9rem, 3.1vw, 2.8rem);
  line-height: 1.12;
  letter-spacing: -.02em;
  color: var(--paper);
}
.press-feature-copy time { display: block; margin-top: 12px; color: var(--violet); font-size: .875rem; }
.press-feature-description { margin-top: 18px; color: var(--muted); }
.press-feature-copy .press-watch { margin-top: 24px; gap: 12px; }
.press-feature-note { margin-top: 12px; color: var(--muted); font-size: .8rem; }
.press-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 36px;
}
.press-quote {
  min-width: 0;
  margin: 0;
  padding-top: 24px;
  border-top: 1px solid #8c714f;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.press-production {
  color: var(--violet);
  font-size: .875rem;
  line-height: 1.6;
}
.press-quote blockquote {
  margin: 0;
  color: var(--paper);
  font-family: var(--serif);
  font-size: clamp(1.625rem, 2.1vw, 2rem);
  line-height: 1.3;
  overflow-wrap: break-word;
}
.press-quote figcaption {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: auto;
  padding-top: 8px;
}
.press-quote cite {
  font-style: normal;
  font-size: 1rem;
  font-weight: 600;
}
.press-quote figcaption > :is(time, span) {
  color: var(--muted);
  font-size: .875rem;
  margin-top: 3px;
}
.press-quote .text-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 8px;
  font-size: 1rem;
}
@media (max-width: 820px) {
  .press-feature { grid-template-columns: 1fr; gap: 24px; padding: 24px; margin-bottom: 36px; }
  .press-feature-copy h3 { max-width: 22ch; }
  .press-grid { grid-template-columns: 1fr; gap: 32px; }
  .press-quote { gap: 16px; }
  .press-quote blockquote { max-width: 34ch; }
}

.hocus-home .cast-section {
  background: #241b33;
  border-block: 1px solid var(--line);
}
.hocus-home .company-preview { border-color: #927baf; }
.hocus-home .company-preview > .eyebrow { color: var(--violet); }
.hocus-home .company-preview h3 { color: var(--paper); }
.hocus-home .team-section { background: var(--deep); }
.hocus-home .team-person { border-color: var(--line); }
.hocus-home .team-person .eyebrow { color: var(--accent); }
.hocus-home .team-intro > p:last-child,
.hocus-home .team-person > p:last-child { color: var(--muted); }

.hocus-home .merch-section {
  background: linear-gradient(180deg, #251b35, var(--night));
  border-color: var(--line);
}
.hocus-home .merch-preview-note { border-color: #675176; }
.hocus-home .merch-preview-note strong { color: var(--gold); }
.hocus-home .merch-card-heading h3 { color: var(--paper); }
.hocus-home .merch-art { border: 1px solid #987c55; padding: 9px; background: #f5f0e7; }
.hocus-home .merch-enlarge { color: var(--gold); }
.hocus-home .merch-controls { background: var(--deep); border-color: #897098; }
.hocus-home .merch-controls button { color: var(--paper); }
.hocus-home .merch-controls button[aria-pressed="true"] { background: var(--accent); color: var(--deep); }
.hocus-home .merch-controls button[aria-pressed="false"]:hover { background: #3b2c4d; }
.hocus-home .site-footer { background: var(--deep); border-color: var(--line); }
.hocus-home .footer-location { color: var(--muted); }
.hocus-home .sources a { color: var(--gold); }

@media (max-width: 1080px) {
  .hocus-home .hero-inner { gap: 30px; }
  .hocus-home .hero h1 { font-size: clamp(3rem, 6.5vw, 4.7rem); }
  .hocus-home .hero .eyebrow { font-size: .72rem; letter-spacing: .12em; }
}
@media (max-width: 680px) {
  .hocus-home .hero-inner { padding-block: 40px 30px; gap: 36px; }
  .hocus-home .hero h1 { font-size: clamp(3.2rem, 13vw, 5.25rem); }
  .hocus-home .hero .eyebrow { max-width: none; }
  .hocus-home .hero-dates { max-width: none; margin-top: 27px; }
  .hocus-home .gallery-stage { padding: 8px; }
  .hocus-home .cast-slide figcaption { padding-inline: 6px; }
  .hocus-home .merch-art { padding: 6px; }
}

/* Keep the completed Milwaukee run clear beside the upcoming Madison date. */
.hocus-home .show-status { color: var(--muted); font-size: .875rem; margin-top: 8px; }

/* Nomination spotlight: high contrast, with the season's candle gold and green. */
.hocus-home .main-nav > .bom-nav { color: var(--accent); font-weight: 700; }
.bom-banner { background: #c7e789; color: #160f22; }
.bom-banner-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px 30px; padding-block: 18px; }
.bom-banner p { display: grid; gap: 5px; min-width: 0; }
.bom-banner p > span { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; }
.bom-banner strong { font-size: clamp(1.1rem, 2.2vw, 1.45rem); line-height: 1.25; }
.bom-banner a { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 12px 24px; border: 1px solid #160f22; color: #f6fbe9; background: #160f22; font-size: 1rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.bom-banner a:hover { color: #fff; background: #342244; border-color: #342244; }
.hocus-home .bom-banner a:focus-visible { outline-color: #160f22; }
.bom-feature { background: linear-gradient(110deg, #efbe76, #f7dba7); color: #28182f; border-block: 1px solid #efbe76; }
.bom-feature-inner { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); align-items: center; gap: 56px; padding-block: 62px; }
.bom-feature-copy { min-width: 0; }
.bom-feature-copy .eyebrow { color: #513850; margin-bottom: 22px; font-size: .78rem; }
.bom-feature h2 { font-size: clamp(2.6rem, 4.6vw, 4.5rem); line-height: 1.07; letter-spacing: -.035em; }
.bom-feature h2 em { color: #563460; font-weight: 400; }
.bom-feature-copy > p:last-child { max-width: 49ch; margin-top: 24px; color: #493443; line-height: 1.75; }
.bom-action { min-width: 0; border-left: 1px solid #ab7f58; padding-left: 38px; }
.bom-action-intro { font-family: var(--serif); font-size: clamp(1.75rem, 2.8vw, 2.45rem); line-height: 1.15; }
.hocus-home .bom-button { background: #28182f; border-color: #28182f; color: #fff4dc; margin-top: 28px; min-height: 56px; padding-inline: 22px; text-align: center; line-height: 1.4; }
.hocus-home .bom-button:hover { background: #4d3059; border-color: #4d3059; color: #fff4dc; }
.hocus-home .bom-button:focus-visible { outline-color: #28182f; }
.bom-link-note { margin-top: 12px; max-width: 35ch; color: #513850; font-size: .78rem; }

@media (max-width: 900px) {
  .bom-banner p { display: grid; }
  .bom-feature-inner { gap: 32px; }
  .bom-action { padding-left: 24px; }
}
@media (max-width: 680px) {
  .bom-banner-inner { align-items: center; gap: 14px; padding-block: 16px; }
  .bom-banner p > span { font-size: .65rem; letter-spacing: .07em; }
  .bom-banner strong { font-size: 1.02rem; line-height: 1.3; }
  .bom-banner a { font-size: .88rem; padding-inline: 14px; }
  .bom-feature-inner { grid-template-columns: 1fr; gap: 28px; padding-block: 42px; }
  .bom-feature-copy .eyebrow { max-width: 31ch; font-size: .7rem; line-height: 1.7; margin-bottom: 18px; }
  .bom-feature h2 { font-size: clamp(2.5rem, 9.9vw, 3.5rem); }
  .bom-feature-copy > p:last-child { margin-top: 20px; }
  .bom-action { padding: 24px 0 0; border-left: 0; border-top: 1px solid #ab7f58; }
  .bom-action-intro { font-size: 1.4rem; line-height: 1.4; }
  .bom-action-intro br { display: none; }
  .hocus-home .bom-button { margin-top: 20px; width: 100%; }
  .bom-link-note { max-width: none; text-align: center; }
}

/* Keep the October performance visible beneath the featured anniversary show. */
.hocus-home .hero-coming-up { margin-top: 26px; padding-left: 17px; border-left: 2px solid var(--gold); max-width: 42ch; }
.hocus-home .hero-coming-up .eyebrow { margin-bottom: 7px; color: var(--gold); font-size: .7rem; line-height: 1.4; }
.hocus-home .hero-coming-up a { display: inline-grid; gap: 1px; color: var(--paper); text-decoration: none; line-height: 1.35; }
.hocus-home .hero-coming-up a strong { font-family: var(--serif); font-size: 1.4rem; font-weight: 400; }
.hocus-home .hero-coming-up a span { color: var(--gold); font-size: .9rem; }
.hocus-home .hero-coming-up a:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.hocus-home .hero-coming-up > p:last-child { margin-top: 6px; color: var(--muted); font-size: .8rem; }

.hocus-home .hero-coming-up .coming-up-cta { margin-top: 5px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
