/* ── Inspiration page ── */

.inspo-header {
  background: #2a2520;
  padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 6vw, 5rem);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.inspo-issue {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #E8A830;
}

.inspo-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(4rem, 10vw, 9rem);
  color: #f2f2f0;
  letter-spacing: 0.04em;
  line-height: 0.9;
  margin: 0;
}

.inspo-sub {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.75rem, 1.2vw, 0.9rem);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(242,242,240,0.45);
  margin-top: 0.5rem;
}

/* ── Zine section ── */
.zine-section {
  background: #f2f2f0;
  padding: clamp(2rem, 5vw, 4rem) clamp(1.5rem, 6vw, 5rem);
}

.zine-label {
  margin-bottom: 1.5rem;
}

.zine-preview {
  max-width: 500px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(0,0,0,0.15);
}

.zine-preview img {
  width: 100%;
  display: block;
  filter: brightness(0.92);
}

.zine-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: 1.5rem;
  background: linear-gradient(to top, rgba(0,0,0,0.5) 0%, transparent 50%);
}

.zine-overlay span {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(1rem, 2vw, 1.3rem);
  letter-spacing: 0.2em;
  color: #f2f2f0;
}

.zine-download-row {
  text-align: center;
  margin-top: 1.5rem;
}

.zine-download-btn {
  display: inline-block;
  background: #1a1a1a;
  color: #f2f2f0;
  text-decoration: none;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  letter-spacing: 0.2em;
  padding: 0.75rem 2.5rem;
  transition: background 0.2s ease;
}

.zine-download-btn:hover {
  background: #E8A830;
  color: #1a1a1a;
}

/* ── Inspiration Gallery ── */
.inspo-gallery {
  background: #f2f2f0;
  padding: clamp(2rem, 5vw, 4rem) clamp(1.5rem, 6vw, 5rem);
}

.inspo-grid {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 700px;
  margin: 0 auto;
}

.inspo-item img {
  width: 100%;
  display: block;
}

.inspo-hidden {
  display: none;
}

.inspo-more-row {
  text-align: center;
  margin-top: 2rem;
}

.inspo-more-btn {
  display: inline-block;
  background: #1a1a1a;
  color: #f2f2f0;
  border: none;
  cursor: pointer;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  letter-spacing: 0.2em;
  padding: 0.75rem 2.5rem;
  transition: background 0.2s ease;
}

.inspo-more-btn:hover {
  background: #E8A830;
  color: #1a1a1a;
}

/* ── Mini radio player ── */
.mini-player {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 200;
  background: #0a0a0a;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 50px;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 0.5rem 1rem 0.5rem 0.5rem;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}

.mini-art {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.mini-player-left {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.mini-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  flex-shrink: 0;
  transition: background 0.3s;
}

.mini-dot.active {
  background: #e84040;
  box-shadow: 0 0 5px #e84040;
  animation: pulse-dot 1.8s ease-in-out infinite;
}

.mini-info {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.mini-station {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.15em;
  color: #fff;
}

.mini-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.55rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
}

.mini-bars {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 14px;
}

.mini-bars span {
  display: block;
  width: 3px;
  border-radius: 2px;
  background: rgba(255,255,255,0.15);
  height: 3px;
}

.mini-bars.active span {
  background: #E8A830;
  animation: bar-bounce 1s ease-in-out infinite;
}

.mini-bars.active span:nth-child(1) { animation-delay: 0s;    animation-duration: 0.9s; }
.mini-bars.active span:nth-child(2) { animation-delay: 0.15s; animation-duration: 1.1s; }
.mini-bars.active span:nth-child(3) { animation-delay: 0.05s; animation-duration: 0.8s; }
.mini-bars.active span:nth-child(4) { animation-delay: 0.2s;  animation-duration: 1.0s; }

.mini-btn {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.2s;
}

.mini-btn:hover {
  background: rgba(255,255,255,0.18);
}

@media (max-width: 700px) {
  .zine-embed {
    aspect-ratio: 2/3;
  }
}