
@import 'pages.css';

.release-bg{	 
    background-image:none;
	background:none;
}

body{	 
    background:
linear-gradient(
    90deg,
    rgba(5,6,9,.92) 50%,
    rgba(5,6,9,.75) 70%,
    rgba(5,6,9,.60) 90%
),

linear-gradient(
    180deg,
    rgba(5,6,9,.35) 0%,
    rgba(5,6,9,.35) 45%,
    rgba(5,6,9,.60) 90%
),
var(--page-image);
  background-size:100% auto;
  background-attachment:fixed;
  background-repeat:no-repeat;
}



.release-detail-shell{
	position: relative;
	overflow: hidden;
	margin:2rem auto 0;
	border: 1px solid var(--border-color);
	border-radius: clamp(26px, 4vw, 38px);
	background:
    radial-gradient(circle at 50% -8%, rgba(215, 182, 106, .072), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, .042), rgba(255, 255, 255, .018) 42%, rgba(255, 255, 255, .011));
	box-shadow:var(--boxshadow-less);
  	backdrop-filter: blur(12px);
}

.release-detail-card{
  overflow:hidden;
  display:grid;
  grid-template-columns:var(--2-grids);
  gap:1rem;
  padding:2rem;
}

.release-detail{}

.release-title{
  margin: 0 0 clamp(1rem, 2.4vw, 1.35rem);
  font-size: clamp(2.2rem, 4.5vw, 3.2rem);
  line-height:1;
  letter-spacing: -.025em;
  text-align:center;
}


.release-meta{
	margin-bottom:1rem;
    display:flex;
    flex-wrap:wrap;
    gap:0.7rem;
    color:var(--gold-color);
    font-size:.8rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
	justify-content:center;
}

.release-meta > * + *::before{
    content:'•';
    margin-right:1rem;
    opacity:.6;
	color:var(--muted-text-color);
}

.release-excerpt{
	color:var(--short-text-color);
	font-size:1.1rem;
}

.release-links{
  display: flex;
  flex-direction: column;	
}

.release-links .eyebrow{
	text-align:center;
	font-size:0.8rem;
	margin-bottom:0;
}

.listen-links{
	 justify-content:center;
}

.listen-links a {
  width:4.5rem;
  height:4.5rem;
}

.listen-links svg {
    width:3rem;
    height:3rem;
}


.release-art-large{
	position: relative;
	overflow: hidden;
	display:block;
	border-top: 1px solid var(--border-color);
	border-bottom: 1px solid var(--border-color);
}

.release-art-large img{
	width:100%;
	aspect-ratio:1/1;
    object-fit:cover;	
}


.tracks-section{
	padding:0 0 1rem;
	background:var(--panel-color);
	overflow:hidden;
	border-top:1px solid var(--border-color);
}

.tracks-section-head{
	padding:3rem 0;
	text-align:center;
}


.track-list{
	position:relative;
    padding:0;
	margin:0;
	list-style:none;
}

.track-item{
	margin:1rem;
	padding:2rem;
    background:var(--map-bg-color);
	border-radius:1rem;
	border: var(--lyrics-border);
	background:
        radial-gradient(
            ellipse at top,
            rgba(255,255,255,.015),
            transparent 50%
        ),
        rgba(0,0,0,.28);
	box-shadow:
        inset 0 2px 4px rgba(0,0,0,.45),
        inset 0 0 50px rgba(0,0,0,.45);
}


.tracks-section-title{}
.track-head{
	text-align:center;
}

.track-number{}

.track-duration{
	color:var(--gold-color);
    font-size:1rem;
    font-weight:700;
}

.track-excerpt{
	color:var(--short-text-color);
}


.lyrics-section{
	padding:1.5rem;
	margin-top:1rem;
}

.lyrics-section h4{
	font-size:1.2rem;	
}

.lyrics-body{
    white-space:pre-wrap;
    margin:0;
    padding:1rem 1.5rem 0;
	color:var(--short-text-color);
    font-family:inherit;
    line-height:1.75;
    overflow:auto;
}


