/* ============================================================================
   EDM / STAGE-MODE SKIN — Concerts & Festivals industry page only.
   Scoped entirely to .edm so the neon treatment cannot leak into the
   dark-cinematic base system. Carries the energy of the original
   bigskyfpv.com (neon glow type, laser gradients, colorful reel cards)
   rebuilt on the 2.0 design tokens.
   ========================================================================== */

.edm {
  --edm-a: #2fd4ff;   /* stage cyan   */
  --edm-b: #7a5cff;   /* laser violet */
  --edm-c: #ff3d81;   /* pyro magenta */
  --edm-glow-a: color-mix(in srgb, var(--edm-a) 55%, transparent);
  --edm-glow-b: color-mix(in srgb, var(--edm-b) 45%, transparent);
}

/* ---- Neon headline treatment ------------------------------------------- */
.edm .edm-neon {
  color: #fff;
  text-shadow:
    0 0 10px var(--edm-glow-a),
    0 0 26px var(--edm-glow-b),
    0 0 58px var(--edm-glow-a),
    0 2px 5px rgba(0, 0, 0, 0.9),
    0 4px 26px rgba(0, 0, 0, 0.7);
}
.edm .edm-gradient-text {
  background: linear-gradient(92deg, var(--edm-a) 0%, var(--edm-b) 55%, var(--edm-c) 110%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---- Full-bleed photo hero ---------------------------------------------- */
.edm-hero {
  position: relative;
  min-height: 86vh;
  display: flex;
  align-items: flex-end;
  padding: 9rem 0 var(--space-6);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--ink-950) 55%, transparent) 0%, transparent 30%),
    linear-gradient(180deg, transparent 20%, color-mix(in srgb, var(--ink-950) 74%, transparent) 60%, var(--ink-950) 100%),
    var(--edm-hero-img, none) center 30% / cover no-repeat,
    var(--ink-950);
}
.edm-hero .hero__sub { color: var(--text-primary); opacity: 0.92; }

/* Trust strip — homage to the old "LICENSED. INSURED. CROWD-SAFE." line */
.edm-trust {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin-top: var(--space-3);
  padding: 12px 18px;
  background: color-mix(in srgb, var(--ink-950) 55%, transparent);
  border: 1px solid color-mix(in srgb, #fff 14%, transparent);
  border-radius: var(--radius);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.edm-trust span {
  font-family: var(--font-mono);
  font-size: var(--mono-label);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-primary);
}
.edm-trust span::before { content: "✓ "; color: var(--edm-a); }

/* ---- Neon CTA ------------------------------------------------------------ */
.edm .btn--neon {
  background: linear-gradient(92deg, var(--edm-a), var(--edm-b));
  color: var(--ink-950);
  border: 1px solid transparent;
  box-shadow: 0 0 16px var(--edm-glow-b), 0 4px 16px rgba(0, 0, 0, 0.4);
  transition: box-shadow var(--t-micro) var(--ease), transform var(--t-micro) var(--ease);
}
.edm .btn--neon:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 28px var(--edm-glow-a), 0 6px 20px rgba(0, 0, 0, 0.5);
}

/* ---- Full-bleed laser / crowd photo bands ------------------------------- */
.edm-band {
  position: relative;
  background:
    linear-gradient(180deg, var(--ink-950) 0%, color-mix(in srgb, var(--ink-950) 78%, transparent) 20%,
                    color-mix(in srgb, var(--ink-950) 78%, transparent) 80%, var(--ink-950) 100%),
    linear-gradient(180deg, color-mix(in srgb, var(--edm-b) 16%, transparent), color-mix(in srgb, var(--ink-950) 42%, transparent)),
    var(--edm-band-img, none) center / cover no-repeat fixed,
    var(--ink-950);
}
@media (max-width: 900px) { .edm-band { background-attachment: scroll; } }

.edm-band .card {
  background: color-mix(in srgb, var(--ink-900) 72%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid color-mix(in srgb, #fff 12%, transparent);
  transition: border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease),
              transform var(--t-micro) var(--ease);
}
.edm-band .card:hover {
  transform: translateY(-4px);
  border-color: var(--edm-glow-a);
  box-shadow: 0 0 34px var(--edm-glow-b);
}

/* ---- Lineup poster (Flown over) ------------------------------------------ */
.edm-lineup { text-align: center; }
.edm-lineup__names {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 0.6em;
  row-gap: 0.15em;
  margin: var(--space-3) auto;
  max-width: 1000px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(1.6rem, 4.2vw, 3.4rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}
.edm-lineup__names b { color: var(--text-primary); font-weight: 700; }
.edm-lineup__names i {
  font-style: normal;
  color: transparent;
  -webkit-text-stroke: 1.2px color-mix(in srgb, #fff 78%, transparent);
}
.edm-lineup__names b, .edm-lineup__names i {
  transition: text-shadow var(--t-micro) var(--ease), color var(--t-micro) var(--ease),
              -webkit-text-stroke-color var(--t-micro) var(--ease);
}
.edm-lineup__names b:hover { text-shadow: 0 0 18px var(--edm-glow-a), 0 0 44px var(--edm-glow-b); }
.edm-lineup__names i:hover { -webkit-text-stroke-color: var(--edm-a); text-shadow: 0 0 26px var(--edm-glow-a); }
.edm-lineup__venues {
  font-family: var(--font-mono);
  font-size: var(--mono-label);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-secondary);
}
.edm-lineup__stat {
  margin-top: var(--space-2);
  font-family: var(--font-mono);
  font-size: var(--mono-label);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--edm-a);
}

/* ---- Reel cards (colored caption bars, like the old site) ---------------- */
.edm-reels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-3);
}
.edm-reel {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--ink-900);
  transition: transform var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease),
              border-color var(--t-micro) var(--ease);
}
.edm-reel:hover { transform: translateY(-4px); border-color: transparent; }
.edm-reel:nth-child(4n+1):hover { box-shadow: 0 0 34px var(--edm-glow-a); }
.edm-reel:nth-child(4n+2):hover { box-shadow: 0 0 34px var(--edm-glow-b); }
.edm-reel:nth-child(4n+3):hover { box-shadow: 0 0 34px color-mix(in srgb, var(--edm-c) 45%, transparent); }
.edm-reel:nth-child(4n+4):hover { box-shadow: 0 0 34px color-mix(in srgb, #ffb224 45%, transparent); }
.edm-reel__caption {
  position: relative;
  padding: 14px 16px;
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.edm-reel__caption::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
}
.edm-reel:nth-child(4n+1) .edm-reel__caption::before { background: var(--edm-a); }
.edm-reel:nth-child(4n+2) .edm-reel__caption::before { background: var(--edm-b); }
.edm-reel:nth-child(4n+3) .edm-reel__caption::before { background: var(--edm-c); }
.edm-reel:nth-child(4n+4) .edm-reel__caption::before { background: #ffb224; }
.edm-reel__caption small {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--mono-label);
  font-weight: 400;
  letter-spacing: var(--tracking-label);
  color: var(--text-tertiary);
  margin-top: 2px;
}

/* ---- Motion discipline ---------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .edm .edm-neon { text-shadow: 0 2px 24px rgba(0, 0, 0, 0.6); }
  .edm-band { background-attachment: scroll; }
}

/* ---- EDM contact band ---------------------------------------------------- */
.edm .contact-band { border-block: 0; }
.edm-form {
  background: color-mix(in srgb, var(--ink-950) 72%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--accent);
  border-radius: 0 0 var(--radius) var(--radius);
  padding: var(--space-3);
}

/* audio-visualizer strip — dances above the form */
.edm-eq { display: flex; align-items: flex-end; gap: 3px; height: 24px; margin-bottom: var(--space-3); }
.edm-eq i {
  flex: 1 1 0; height: 100%;
  background: linear-gradient(180deg, var(--edm-a), var(--edm-b));
  border-radius: 2px;
  transform: scaleY(0.3); transform-origin: bottom;
  animation: bsf-eq 900ms ease-in-out infinite alternate;
}
.edm-eq i:nth-child(2n)  { animation-duration: 700ms;  animation-delay: 120ms; background: linear-gradient(180deg, var(--edm-b), var(--edm-c)); }
.edm-eq i:nth-child(3n)  { animation-duration: 1100ms; animation-delay: 260ms; }
.edm-eq i:nth-child(4n)  { animation-duration: 800ms;  animation-delay: 60ms;  background: linear-gradient(180deg, var(--edm-c), var(--edm-b)); }
.edm-eq i:nth-child(5n)  { animation-duration: 1000ms; animation-delay: 320ms; }
.edm-eq i:nth-child(7n)  { animation-duration: 650ms;  animation-delay: 200ms; }
@keyframes bsf-eq { from { transform: scaleY(0.15); } to { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) { .edm-eq i { animation: none; transform: scaleY(0.35); } }

/* form controls pick up the stage palette */
.edm .fluentform .ff-el-form-control:focus {
  border-color: var(--edm-a);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--edm-a) 18%, transparent);
}
.edm .fluentform .ff-btn-submit {
  background: linear-gradient(92deg, var(--edm-a), var(--edm-b));
  color: var(--ink-950);
  box-shadow: 0 8px 26px -10px var(--edm-glow-b);
}
.edm .fluentform .ff-btn-submit:hover {
  box-shadow: 0 12px 34px -10px var(--edm-glow-a);
  transform: translateY(-1px);
}

/* Center the lineup sub-text under the centered artist names */
.edm-lineup__venues, .edm-lineup__stat { margin-inline: auto; }

/* ---- Aircraft tiles: even strip, static drone image + caption (mirrors reels) */
.edm-craft-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-3); }
.edm-craft {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--ink-900);
  transition: transform var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease);
}
.edm-craft:hover { transform: translateY(-4px); border-color: var(--edm-a); box-shadow: 0 0 26px var(--edm-glow-a); }
.edm-craft__media { aspect-ratio: 16 / 10; background: var(--ink-950); display: flex; align-items: center; justify-content: center; }
.edm-craft__media img { width: 92%; height: 92%; object-fit: contain; }
.edm-craft__caption {
  position: relative;
  padding: 14px 16px;
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-primary);
}
.edm-craft__caption::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--edm-a); }
.edm-craft:nth-child(4n+2) .edm-craft__caption::before { background: var(--edm-b); }
.edm-craft:nth-child(4n+3) .edm-craft__caption::before { background: var(--edm-c); }
.edm-craft:nth-child(4n+4) .edm-craft__caption::before { background: #ffb224; }
.edm-craft__caption small {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--mono-label);
  font-weight: 400;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin-top: 4px;
}

/* Concerts hero — centered content, higher contrast, more stage energy */
.edm-hero .container { text-align: center; }
.edm-hero h1 { margin-inline: auto; font-size: clamp(2.6rem, 5.6vw, 3.9rem); line-height: 1.05; }
.edm-hero .hero__sub { margin-inline: auto; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.8); }
.edm-hero .hero__ctas { justify-content: center; }
