/* ===================== FLOATING AUDIO ===================== */
.audio-dock {
  position: fixed;
  right: 28px;
  bottom: 28px;
  z-index: 140;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px 10px 10px;
  border-radius: 18px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(21,18,16,0.96) 0%, rgba(11,9,9,0.98) 52%, rgba(6,5,6,0.99) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -1px 0 rgba(0,0,0,0.72),
    inset 0 -8px 18px rgba(0,0,0,0.24),
    0 16px 30px rgba(0,0,0,0.22),
    0 2px 10px rgba(0,0,0,0.16);
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
}
.audio-dock::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.03) 0px,
      rgba(255,255,255,0.03) 1px,
      rgba(255,255,255,0.012) 2px,
      rgba(0,0,0,0) 4px,
      rgba(0,0,0,0) 9px
    );
  opacity: 0.7;
  pointer-events: none;
}
.audio-dock::after {
  content: '';
  position: absolute;
  inset: 1px;
  border-radius: 17px;
  box-shadow:
    inset 0 1px 0 rgba(255,240,218,0.08),
    inset 0 -1px 0 rgba(255,255,255,0.02);
  pointer-events: none;
}
.audio-button {
  --mx: 50%;
  position: relative;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  border: 2px solid rgba(232,217,168,0.88);
  background:
    linear-gradient(180deg, rgba(21,18,16,0.96) 0%, rgba(11,9,9,0.98) 52%, rgba(6,5,6,0.99) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
  box-shadow:
    inset 0 -1px 0 rgba(0,0,0,0.70),
    inset 0 -8px 18px rgba(0,0,0,0.24),
    0 10px 20px rgba(0,0,0,0.22),
    0 0 0 1px rgba(212,180,106,0.44),
    0 0 12px rgba(212,180,106,0.12);
}
.audio-button::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.032) 0px, rgba(255,255,255,0.032) 1px, rgba(255,255,255,0.012) 2px, rgba(0,0,0,0) 4px, rgba(0,0,0,0) 9px);
  opacity: 0.72;
  pointer-events: none;
}
.audio-button::after {
  content: '';
  position: absolute;
  inset: 1px;
  border-radius: 17px;
  box-shadow:
    inset 0 -1px 0 rgba(255,255,255,0.02);
  pointer-events: none;
}
.audio-button:hover {
  transform: translateY(-1px);
  border-color: rgba(255,236,181,0.96);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 2px 6px rgba(255,255,255,0.07),
    inset 0 -1px 0 rgba(0,0,0,0.72),
    inset 0 -8px 18px rgba(0,0,0,0.26),
    0 12px 22px rgba(0,0,0,0.24),
    0 0 18px rgba(212,175,55,0.08);
}
.audio-icon-stack {
  position: relative;
  z-index: 2;
  width: 23px;
  height: 23px;
}
.audio-icon {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.audio-icon path,
.audio-icon polygon,
.audio-icon rect {
  fill: none;
  stroke: url(#audioGoldGradient);
  stroke-width: 1.9;
  stroke-linejoin: round;
  stroke-linecap: round;
  filter: drop-shadow(0 0 4px rgba(201,169,110,0.32));
}
.audio-dock.is-paused .audio-icon-play,
.audio-dock.is-playing .audio-icon-pause {
  opacity: 1;
  transform: scale(1);
}
.audio-visualizer {
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 34px;
  min-width: 37px;
  padding-right: 0;
}
.audio-track-title {
  font-family: var(--ff-sans);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-light);
  white-space: nowrap;
  text-shadow: 0 0 10px rgba(201,169,110,0.18);
}
.audio-controls {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 180px;
}
.audio-volume-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.audio-volume-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  color: var(--gold);
  opacity: 0.95;
  filter:
    drop-shadow(0 0 6px rgba(232,212,160,0.35))
    drop-shadow(0 0 12px rgba(201,169,110,0.24));
}
.audio-volume-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(244,229,188,0.28), rgba(201,169,110,0.14));
  outline: none;
  border: 1px solid rgba(201,169,110,0.28);
  box-shadow:
    inset 0 0 14px rgba(232,212,160,0.08),
    0 0 14px rgba(201,169,110,0.10);
  cursor: pointer;
}
.audio-volume-slider::-webkit-slider-runnable-track {
  height: 8px;
  border-radius: 999px;
  background: transparent;
}
.audio-volume-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  margin-top: -6px;
  border-radius: 50%;
  border: 1px solid rgba(255,244,211,0.92);
  background:
    radial-gradient(circle at 35% 30%, rgba(255,248,224,0.98) 0%, rgba(232,212,160,0.96) 42%, rgba(201,169,110,0.94) 72%, rgba(122,90,40,0.96) 100%);
  box-shadow:
    0 0 12px rgba(232,212,160,0.52),
    0 0 24px rgba(201,169,110,0.30),
    inset 0 0 8px rgba(255,250,236,0.42);
}
.audio-volume-slider::-moz-range-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(128,128,128,0.18);
  border: 1px solid rgba(201,169,110,0.28);
}
.audio-volume-slider::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border: 1px solid rgba(255,244,211,0.92);
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 30%, rgba(255,248,224,0.98) 0%, rgba(232,212,160,0.96) 42%, rgba(201,169,110,0.94) 72%, rgba(122,90,40,0.96) 100%);
  box-shadow:
    0 0 12px rgba(232,212,160,0.52),
    0 0 24px rgba(201,169,110,0.30),
    inset 0 0 8px rgba(255,250,236,0.42);
}
.audio-volume-slider:hover::-webkit-slider-thumb,
.audio-volume-slider:focus-visible::-webkit-slider-thumb,
.audio-volume-slider:hover::-moz-range-thumb,
.audio-volume-slider:focus-visible::-moz-range-thumb {
  box-shadow:
    0 0 14px rgba(255,244,211,0.7),
    0 0 28px rgba(232,212,160,0.42),
    inset 0 0 8px rgba(255,250,236,0.46);
}
.audio-volume-value {
  min-width: 34px;
  text-align: right;
  font-family: var(--ff-sans);
  font-size: 9px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold-light);
  text-shadow: 0 0 8px rgba(201,169,110,0.18);
}
.audio-bar {
  width: 2px;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(244,229,188,1) 0%, rgba(232,212,160,0.95) 18%, rgba(201,169,110,0.76) 60%, rgba(122,90,40,0.18) 100%);
  box-shadow:
    0 0 10px rgba(201,169,110,0.34),
    0 0 20px rgba(201,169,110,0.16);
  transform-origin: bottom;
  animation: visualPulse 1.25s cubic-bezier(.4,0,.2,1) infinite;
  animation-play-state: paused;
  position: relative;
}
.audio-bar::after {
  content: '';
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 8px;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,244,211,0.95), rgba(232,212,160,0));
  filter: blur(1px);
}
.audio-dock.is-playing .audio-bar {
  animation-play-state: running;
}
.audio-dock.is-playing .audio-button {
  border-color: rgba(232,217,168,0.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 2px 8px rgba(255,255,255,0.06),
    inset 0 -1px 0 rgba(0,0,0,0.72),
    inset 0 -8px 18px rgba(0,0,0,0.24),
    0 10px 24px rgba(0,0,0,0.22),
    0 0 20px rgba(212,175,55,0.10);
}
.audio-dock.is-paused .audio-bar {
  opacity: 0.55;
}
.audio-bar:nth-child(1) { height: 22%; animation-delay: -0.12s; }
.audio-bar:nth-child(2) { height: 52%; animation-delay: -0.42s; }
.audio-bar:nth-child(3) { height: 32%; animation-delay: -0.18s; }
.audio-bar:nth-child(4) { height: 68%; animation-delay: -0.6s; }
.audio-bar:nth-child(5) { height: 46%; animation-delay: -0.26s; }
.audio-bar:nth-child(6) { height: 26%; animation-delay: -0.48s; }
.audio-bar:nth-child(7) { height: 58%; animation-delay: -0.22s; }
.audio-bar:nth-child(8) { height: 34%; animation-delay: -0.54s; }
.audio-status {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 96px;
}
.audio-status-label {
  font-family: var(--ff-sans);
  font-size: 8px;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--gold-light);
}
.audio-status-sub {
  font-family: var(--ff-sans);
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-dim);
}
.audio-dock.is-playing .audio-status-sub {
  color: var(--gold);
}
@keyframes goldBorderChaosA {
  0% { background-position: 18% 30%, 80% 22%, 30% 80%, 84% 78%, 12% 52%; }
  20% { background-position: 26% 16%, 66% 34%, 42% 64%, 74% 84%, 30% 44%; }
  45% { background-position: 10% 44%, 82% 16%, 24% 74%, 88% 62%, 58% 54%; }
  70% { background-position: 30% 20%, 60% 28%, 38% 86%, 72% 72%, 22% 48%; }
  100% { background-position: 18% 34%, 86% 22%, 28% 78%, 82% 82%, 46% 58%; }
}
@keyframes goldBorderChaosB {
  0% { transform: scale(1); opacity: 0.92; }
  30% { transform: scale(1.015); opacity: 1; }
  55% { transform: scale(0.992); opacity: 0.94; }
  80% { transform: scale(1.018); opacity: 1; }
  100% { transform: scale(1); opacity: 0.96; }
}
@keyframes goldBorderChaosC {
  0%, 100% { filter: drop-shadow(0 0 11px rgba(201,169,110,0.5)) drop-shadow(0 0 22px rgba(201,169,110,0.22)); }
  35% { filter: drop-shadow(0 0 13px rgba(232,212,160,0.62)) drop-shadow(0 0 26px rgba(201,169,110,0.28)); }
  68% { filter: drop-shadow(0 0 10px rgba(201,169,110,0.44)) drop-shadow(0 0 20px rgba(201,169,110,0.2)); }
}
@keyframes goldGlowPulse {
  0%, 100% {
    opacity: 0.96;
    filter: brightness(1.08) saturate(1.12);
  }
  50% {
    opacity: 1;
    filter: brightness(1.28) saturate(1.24);
  }
}
@keyframes navGoldRingFlow {
  0% {
    background-position: 14% 30%, 80% 20%, 30% 82%, 84% 78%, 0% 50%;
    filter: brightness(1.12) saturate(1.18);
  }
  20% {
    background-position: 26% 20%, 68% 32%, 40% 68%, 88% 66%, 110% 50%;
    filter: brightness(1.22) saturate(1.24);
  }
  45% {
    background-position: 10% 40%, 86% 16%, 22% 86%, 76% 86%, 220% 50%;
    filter: brightness(1.3) saturate(1.28);
  }
  70% {
    background-position: 28% 22%, 64% 28%, 38% 88%, 72% 72%, 120% 50%;
    filter: brightness(1.2) saturate(1.22);
  }
  100% {
    background-position: 14% 30%, 80% 20%, 30% 82%, 84% 78%, 0% 50%;
    filter: brightness(1.12) saturate(1.18);
  }
}
@keyframes navMagicSparkle {
  0% {
    background-position: 18% 52%, 32% 28%, 56% 70%, 78% 32%, 0 0;
    filter: brightness(0.98) saturate(1);
  }
  25% {
    background-position: 30% 34%, 46% 58%, 62% 38%, 84% 64%, 0 0;
    filter: brightness(1.06) saturate(1.06);
  }
  50% {
    background-position: 52% 48%, 28% 70%, 72% 28%, 68% 54%, 0 0;
    filter: brightness(1.12) saturate(1.1);
  }
  75% {
    background-position: 68% 30%, 56% 24%, 42% 68%, 24% 44%, 0 0;
    filter: brightness(1.04) saturate(1.04);
  }
  100% {
    background-position: 82% 50%, 34% 36%, 58% 74%, 18% 30%, 0 0;
    filter: brightness(0.98) saturate(1);
  }
}
@keyframes visualPulse {
  0%, 100% { transform: scaleY(0.34); opacity: 0.58; }
  50% { transform: scaleY(1); opacity: 1; }
}
/* Premium luminous text treatment */
.excerpt-text span,
.nav-logo-name,
.where-platform,
.where-price,
.hero-stat-num,
.subscribe-icon,
.cs-label {
  color: var(--gold);
  text-shadow: 0 0 12px rgba(212,175,55,0.10), 0 0 24px rgba(196,138,94,0.08);
}
.btn-primary, .btn-secondary, .btn-ghost, .nav-cta, .where-btn, .author-social {
  transition: all 0.25s ease, box-shadow 0.25s ease;
}
.btn-primary:hover, .btn-secondary:hover, .btn-ghost:hover, .where-btn:hover, .author-social:hover:hover {
  box-shadow: 0 0 24px rgba(196,138,94,0.10);
}
.hero-title,
.about-heading,
.author-heading,
.subscribe-title,
.cs-title {
  color: var(--gold);
  text-shadow:
    0 0 8px rgba(232, 217, 168, 0.10),
    0 0 22px rgba(212, 175, 55, 0.12),
    0 0 38px rgba(212, 180, 106, 0.08);
}
.hero-title em,
.about-heading em em,
.author-heading em,
.subscribe-title em,
.cs-title em {
  color: #D4AF37;
  text-shadow:
    0 0 10px rgba(212, 175, 55, 0.15),
    0 0 26px rgba(232, 217, 168, 0.10);
}
.hero-tagline,
.about-body,
.author-body,
.excerpt-text,
.subscribe-sub {
  color: var(--text-muted);
}
.hero-badge-dot,
.ct-dot {
  background: var(--accent-red);
  box-shadow: 0 0 10px rgba(156, 47, 47, 0.32);
}
@media (max-width: 980px) {
  .nav-shell {
    top: 8px;
    left: 10px;
    right: 10px;
    gap: 10px;
    align-items: stretch;
    flex-wrap: wrap;
  }
  nav {
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 54px;
    padding: 10px 14px 16px;
  }
  .nav-cta-standalone {
    margin-left: auto;
  }
  .nav-left {
    gap: 10px;
    flex-wrap: wrap;
  }
  .system-status {
    display: none;
  }
  .nav-links {
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}