/* Power Festival 2027 — BLIND BIRD theme.
   Loaded AFTER pf-styles.css on the 2027 pages only. Same brand foundation
   (ink + purple + Poppins), accent rotated from 2026 yellow to sunset
   coral — "same festival, new year". Most components pick this up via the
   CSS variables; the rules below cover yellow literals and contrast fixes
   on surfaces the 2027 page actually mounts. */

:root {
  --c-yellow:      #FF4D7D;   /* sunset coral — 2027 accent */
  --c-yellow-deep: #E23B69;
  /* Raw channels: every glow, halo and hairline border in pf-styles.css
     goes through rgba(var(--c-yellow-rgb), …), so this single line recolors
     all of them — logo pulse, button shadows, card borders, focus rings. */
  --c-yellow-rgb:  255, 77, 125;
  --c-border:      rgba(var(--c-yellow-rgb), 0.20);
  /* Power Festival yellow, kept as the secondary/typographic accent. */
  --c-gold:        #FECC18;
}

/* Accent surfaces carry ink text (coral + purple lacks contrast). */
.pf-btn--primary,
.pf-nav__cta,
.pf-drawer__cta,
.pf-tier__btn--aurora .pf-tier__btn-text {
  color: #0B0518;
}
.pf-hero__ctas .pf-btn--primary:hover { color: #0B0518; }

/* ── Two-accent system ──
   Coral (--c-yellow) carries the UI: buttons, borders, glows, eyebrows,
   chips. Power Festival yellow returns as the TYPOGRAPHIC contrast — every
   italic emphasis word in a headline — so the brand's signature colour
   stays present and the two accents never compete for the same job. */
.pf-hero__tag-em,
.pf-h2 em,
.pf-venue__title em,
.pf-about__title em,
.pf-about__body .pf-about__accent,
.pf-contact__title em,
.pf-newsletter h3 em,
.pf-legal-title em,
.pf-legal__body em {
  color: var(--c-gold);
}

/* Yellow-literal glows → coral (only 2027-mounted components). */
.pf-tier--hot { border-color: rgba(255, 77, 125, 0.55); }
.pf-tier__badge { background: var(--c-yellow); color: #0B0518; }

/* ── Hero vertical balance ──
   The base hero uses `justify-content: space-between` to push the content
   to the top and the countdown to the bottom. The blind-bird hero has no
   countdown (PF_COUNTDOWN returns null until dates are ticketed), so that
   empty slot left ~400px of dead video below the CTA on a phone. Drop the
   empty slot and centre the block instead. */
@media (max-width: 768px) {
  .pf-hero__bottom:empty { display: none; }
  .pf-hero__inner { justify-content: center; }
}

/* Single blind-bird tier: center the lone card instead of leaving it in
   the corner of the 2026 four-column grid. */
.pf-tickets__grid {
  grid-template-columns: min(420px, 100%);
  justify-content: center;
}

/* ── Lineup teaser strip ── */
.pf-teaser {
  padding: 96px 0;
  background: var(--c-bg-alt);
}
.pf-teaser__sub {
  margin-top: 14px; max-width: 520px;
  color: var(--c-text-mute); font-size: 16px; line-height: 1.6;
}
.pf-teaser__grid {
  margin-top: 40px;
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px;
}
.pf-teaser__card {
  aspect-ratio: 4 / 5;
  border-radius: 14px;
  background:
    linear-gradient(160deg, rgba(255, 77, 125, 0.10), rgba(103, 7, 186, 0.22)),
    var(--c-card);
  border: 1px solid var(--c-border);
  display: flex; align-items: center; justify-content: center;
  animation: pf-teaser-breathe 3s ease-in-out infinite;
}
.pf-teaser__mark {
  font-family: var(--f-display); font-weight: 800; font-size: 56px;
  color: rgba(255, 77, 125, 0.55);
  text-shadow: 0 0 24px rgba(255, 77, 125, 0.35);
}
@keyframes pf-teaser-breathe {
  0%, 100% { opacity: 0.55; transform: translateY(0); }
  50%      { opacity: 1;    transform: translateY(-4px); }
}
@media (max-width: 900px) {
  .pf-teaser__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 520px) {
  .pf-teaser { padding: 64px 0; }
  .pf-teaser__grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .pf-teaser__mark { font-size: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  .pf-teaser__card { animation: none; }
}