/*
 * Release 254 · Legends Live photography depth grade
 *
 * Keep the black/red cinematic identity, but protect the mid-tones, stage
 * colour and human detail that make live photography feel real. Text remains
 * legible through localised lower-third shading instead of a full black veil.
 */

:root {
  --ll1-photo-filter: saturate(1.16) contrast(1.075) brightness(1.13);
  --ll1-photo-filter-hover: saturate(1.22) contrast(1.085) brightness(1.17);
  --ll1-depth-shadow: 0 28px 72px rgba(0, 0, 0, .46), 0 0 0 1px rgba(255, 255, 255, .055) inset;
  --ll1-depth-shadow-hover: 0 38px 92px rgba(0, 0, 0, .56), 0 0 34px rgba(229, 27, 43, .13), 0 0 0 1px rgba(255, 234, 181, .16) inset;
}

/* Homepage: make every destination feel like a lit window into the show. */
.hero-routes {
  border-color: rgba(255, 255, 255, .24) !important;
  background: rgba(4, 4, 5, .76) !important;
  box-shadow: 0 42px 110px rgba(0, 0, 0, .58), 0 0 0 1px rgba(255, 255, 255, .05) inset !important;
}

.hero-routes a {
  border-color: rgba(255, 255, 255, .22) !important;
  background-size: cover !important;
  box-shadow: var(--ll1-depth-shadow), 0 1px 0 rgba(255, 255, 255, .12) inset;
  transform: translateZ(0);
  transition: transform .38s cubic-bezier(.2,.75,.22,1), border-color .3s ease, box-shadow .3s ease, background-size .7s ease !important;
}

.hero-routes a::before {
  background: linear-gradient(180deg, rgba(2, 2, 3, 0) 0%, rgba(2, 2, 3, .05) 46%, rgba(2, 2, 3, .68) 100%) !important;
}

.hero-routes a::after {
  opacity: .5;
  background: radial-gradient(circle at 22% 16%, rgba(255, 200, 117, .12), transparent 31%), linear-gradient(180deg, transparent 54%, rgba(158, 12, 25, .18)) !important;
}

.hero-routes a:hover,
.hero-routes a:focus-visible {
  z-index: 2;
  transform: translateY(-5px) scale(1.012);
  border-color: rgba(255, 218, 137, .58) !important;
  box-shadow: var(--ll1-depth-shadow-hover);
  background-size: 106% !important;
}

.hero-routes a:hover::before,
.hero-routes a:focus-visible::before {
  background: linear-gradient(180deg, transparent 0%, rgba(2, 2, 3, .025) 52%, rgba(2, 2, 3, .58) 100%) !important;
}

.hero-routes .route-watch {
  background-image: linear-gradient(180deg, transparent 0 55%, rgba(0,0,0,.56) 100%), url("../artists/reckless-live.jpg") !important;
}
.hero-routes .route-broadcast {
  background-image: linear-gradient(180deg, transparent 0 54%, rgba(0,0,0,.58) 100%), url("assets/broadcast-stage-types-v2.webp") !important;
}
.hero-routes .route-gig {
  background-image: linear-gradient(180deg, transparent 0 54%, rgba(0,0,0,.58) 100%), url("assets/home-championship-journey-v1.webp") !important;
}
.hero-routes .route-network {
  background-image: linear-gradient(180deg, transparent 0 54%, rgba(0,0,0,.59) 100%), url("assets/home-artist-venue-pages-global-v1.webp") !important;
}
.hero-routes .route-musicians {
  background-image: linear-gradient(180deg, transparent 0 54%, rgba(0,0,0,.58) 100%), url("../artists/new-heroes.webp") !important;
}
.hero-routes .route-radio {
  background-image: linear-gradient(180deg, transparent 0 54%, rgba(0,0,0,.58) 100%), url("assets/home-wiz-audio-v1.webp") !important;
}

.hero-routes b,
.hero-routes i {
  text-shadow: 0 2px 8px #000, 0 8px 24px rgba(0, 0, 0, .92);
}

.visual-studio-card,
.live-source-card,
.home-product,
.connected-flow > article,
.home-act-wave-track a {
  border-color: rgba(255, 255, 255, .2) !important;
  box-shadow: var(--ll1-depth-shadow) !important;
}

.visual-studio-card::before,
.live-source-card::before,
.home-product::before,
.connected-flow > article::before,
.home-act-wave-track a::before {
  background: linear-gradient(180deg, rgba(0,0,0,.015) 0%, rgba(0,0,0,.08) 46%, rgba(3,3,3,.72) 100%) !important;
}

.visual-studio-card:hover,
.live-source-card:hover,
.home-product:hover,
.connected-flow > article:hover,
.home-act-wave-track a:hover {
  border-color: rgba(255, 218, 137, .54) !important;
  box-shadow: var(--ll1-depth-shadow-hover) !important;
}

.live-card-media {
  box-shadow: 0 18px 48px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.08) inset;
}

/* Gig guide: protect artwork and future event imagery from black crush. */
.gig-hero-image {
  filter: saturate(1.18) contrast(1.07) brightness(1.14) !important;
}

.gig-hero-shade {
  background: linear-gradient(90deg, rgba(2,2,2,.68), rgba(2,2,2,.38) 48%, rgba(2,2,2,.04)), linear-gradient(180deg, transparent 58%, #050505 99%) !important;
}

.gig-card {
  border-color: rgba(255,255,255,.18) !important;
  box-shadow: 0 22px 62px rgba(0,0,0,.34), 0 1px 0 rgba(255,255,255,.04) inset;
}

.gig-card:hover {
  border-color: rgba(213,169,85,.58) !important;
  box-shadow: 0 32px 82px rgba(0,0,0,.46), 0 0 30px rgba(229,27,43,.1);
}

.gig-card-image::after {
  background: linear-gradient(180deg, transparent 0 54%, rgba(3,3,3,.58) 100%) !important;
}

.provider-event-image::before {
  filter: blur(15px) saturate(1.08) contrast(1.04) brightness(1.06) !important;
  opacity: .64 !important;
}

.provider-event-image > img {
  filter: var(--ll1-photo-filter);
}

/* Artist directories and profile photography. */
.artists-hero-bg {
  filter: saturate(1.2) contrast(1.07) brightness(1.15) !important;
}

.network-artist-card,
.founder-grid a,
.event-artist-plan-grid > article {
  border-color: rgba(255,255,255,.18) !important;
  box-shadow: var(--ll1-depth-shadow) !important;
}

.network-artist-card img,
.event-artist-plan-grid figure > img {
  filter: var(--ll1-photo-filter) !important;
}

.network-artist-card:hover img,
.network-artist-card:focus-within img,
.event-artist-plan-grid > article:hover figure > img {
  filter: var(--ll1-photo-filter-hover) !important;
}

.network-artist-card > div:first-child::after {
  background: linear-gradient(180deg, transparent 0 62%, rgba(0,0,0,.58) 100%) !important;
}

.cover-photo {
  filter: saturate(1.16) contrast(1.065) brightness(1.14) !important;
}

.cover-photo.is-premium-remaster,
.cover-photo[data-asset-mode="original"] {
  filter: saturate(1.19) contrast(1.07) brightness(1.17) !important;
}

.cover-grade {
  background: linear-gradient(90deg, rgba(3,3,3,.55) 0%, rgba(3,3,3,.06) 58%, rgba(3,3,3,.22)), linear-gradient(0deg, #050505 0%, transparent 34%), radial-gradient(circle at 70% 30%, transparent, var(--accent-soft)) !important;
}

.track-art,
.post-firelines,
.discovery-image {
  box-shadow: var(--ll1-depth-shadow);
}

/* Venue pages: richer stage light, clearer interiors and dimensional cards. */
.venue-hero-media {
  filter: saturate(1.2) contrast(1.07) brightness(1.12) !important;
}

.venue-hero-shade {
  background: linear-gradient(90deg, rgba(0,0,0,.67), rgba(0,0,0,.32) 65%, rgba(0,0,0,.16)), linear-gradient(0deg,#050505,transparent 34%) !important;
}

.venue-card,
.venue-feed-card,
.venue-directory-card {
  border-color: rgba(255,255,255,.18) !important;
  box-shadow: var(--ll1-depth-shadow) !important;
}

.venue-card > img,
.venue-feed-card > img,
.venue-directory-card > img {
  filter: var(--ll1-photo-filter) !important;
}

.venue-card::before,
.venue-feed-card::before {
  background: linear-gradient(180deg, transparent 0 52%, rgba(0,0,0,.62) 100%) !important;
}

.venue-card:hover > img,
.venue-feed-card:hover > img,
.venue-directory-card:hover > img {
  filter: var(--ll1-photo-filter-hover) !important;
}

/* Open mics: the hero and listing photography should feel welcoming and live. */
.mic-hero-shade {
  background: linear-gradient(90deg, rgba(2,2,2,.68) 0%, rgba(2,2,2,.4) 42%, rgba(2,2,2,.06) 72%), linear-gradient(0deg,rgba(2,2,2,.52),transparent 52%) !important;
}

.mic-card,
.mic-detail-media {
  border-color: rgba(255,255,255,.19) !important;
  box-shadow: var(--ll1-depth-shadow) !important;
}

.mic-card-media img,
.mic-detail-media img {
  filter: var(--ll1-photo-filter) !important;
}

.mic-card:hover .mic-card-media img {
  filter: var(--ll1-photo-filter-hover) !important;
}

.mic-card-media::after,
.mic-detail-media::after {
  inset: 55% 0 0 !important;
  background: linear-gradient(transparent, rgba(5,4,3,.62)) !important;
}

.mic-card-media::before,
.mic-detail-media::before {
  filter: blur(18px) saturate(1.04) contrast(1.04) brightness(.78) !important;
}

/* Watch Live and newsroom photography. */
.watch-hero > video {
  filter: saturate(1.25) contrast(1.075) brightness(1.12) !important;
}

.watch-hero-shade {
  background: linear-gradient(90deg, rgba(3,3,3,.69), rgba(3,3,3,.42) 52%, rgba(3,3,3,.08)), linear-gradient(180deg, transparent 58%, #050505 100%) !important;
}

.verified-live-card,
.news-card,
.news-cta {
  border-color: rgba(255,255,255,.18) !important;
  box-shadow: var(--ll1-depth-shadow);
}

.verified-live-card img,
.news-card-media img,
.news-cta > img {
  filter: var(--ll1-photo-filter) !important;
}

.news-card-media span {
  background: linear-gradient(0deg, rgba(10,10,10,.64), transparent 58%) !important;
}

.news-cta::after {
  background: linear-gradient(90deg, rgba(5,5,5,.68) 0%, rgba(5,5,5,.4) 55%, rgba(5,5,5,.06)) !important;
}

/* Broadcast: stage imagery carries the excitement while copy retains contrast. */
.broadcast-flagship-visual {
  filter: saturate(1.18) contrast(1.07) brightness(1.12);
}

.broadcast-flagship-shade {
  background: linear-gradient(90deg,rgba(3,3,3,.68) 0%,rgba(3,3,3,.42) 34%,rgba(3,3,3,.04) 68%),linear-gradient(180deg,transparent 58%,#050505 100%) !important;
}

.broadcast-page .broadcast-hero::before {
  filter: saturate(1.18) contrast(1.07) brightness(1.1) !important;
}

.broadcast-page .broadcast-hero::after {
  background: linear-gradient(90deg,rgba(2,2,2,.68),rgba(2,2,2,.4) 42%,rgba(2,2,2,.03) 74%),linear-gradient(180deg,transparent 60%,#050505 98%) !important;
}

.broadcast-route article,
.broadcast-stage-types article,
.broadcast-device,
.broadcast-application-copy,
.broadcast-visual-choice label {
  filter: saturate(1.14) contrast(1.055) brightness(1.08);
}

.broadcast-route article::after,
.broadcast-stage-types article::after {
  background: linear-gradient(180deg,transparent 0 50%,rgba(3,3,3,.62) 100%) !important;
}

.broadcast-device {
  background-image: linear-gradient(180deg, transparent 0 58%, rgba(0,0,0,.58) 100%), url("assets/legends-live-broadcast-world-stage-v1.webp") !important;
}

.broadcast-visual-choice label::after {
  background: linear-gradient(180deg,transparent 0 52%,rgba(0,0,0,.62) 100%) !important;
}

/* Shared physical depth, without sacrificing keyboard accessibility. */
:is(.gig-card,.network-artist-card,.venue-card,.venue-feed-card,.venue-directory-card,.mic-card,.verified-live-card,.news-card):focus-within {
  outline: 3px solid rgba(240,191,88,.9);
  outline-offset: 3px;
}

@media (max-width: 720px) {
  :root {
    --ll1-photo-filter: saturate(1.12) contrast(1.055) brightness(1.09);
    --ll1-photo-filter-hover: saturate(1.16) contrast(1.065) brightness(1.12);
  }

  .hero-routes a::before,
  .gig-card-image::after,
  .network-artist-card > div:first-child::after {
    background: linear-gradient(180deg, transparent 0 48%, rgba(2,2,3,.68) 100%) !important;
  }

  .mic-hero-shade,
  .gig-hero-shade,
  .venue-hero-shade,
  .watch-hero-shade,
  .broadcast-page .broadcast-hero::after {
    background: linear-gradient(180deg,rgba(3,3,3,.2),rgba(3,3,3,.2) 52%,#050505 98%) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-routes a,
  .visual-studio-card,
  .live-source-card,
  .network-artist-card img,
  .venue-card > img,
  .venue-feed-card > img,
  .mic-card-media img {
    transition: none !important;
  }
}