/* Archives */

body.page-archives,
#archives,
.archives-page{
  background:#0a0908;
}

.archives-hero{
  position:relative;
  background:#0a0908;
  overflow:hidden;
}

.archives-hero-desktop,
.archives-hero-mobile{
  position:relative;
  width:100%;
  background:#0a0908;
}

.archives-hero-desktop img,
.archives-hero-mobile img{
  display:block;
  width:100%;
  height:auto;
}

.archives-hero-mobile{
  display:none;
}

.archives-hero-overlay,
.archives-hero-inner{
  display:none;
}

.archives-content{
  position:relative;
  z-index:2;
  background:transparent;
  margin-top:-64px;
  padding-top:34px;
  padding-bottom:80px;
}

.archives-list{
  display:grid;
  gap:18px;
}

.archive-year{
  background:transparent;
  border:none;
  box-shadow:none;
  border-radius:0;
  overflow:visible;
}

.archive-year > summary{
  list-style:none;
}

.archive-year > summary::-webkit-details-marker{
  display:none;
}

.archive-year-content{
  padding-top:18px;
  display:grid;
  gap:24px;
}

.archive-group{
  background:transparent;
  border:none;
  box-shadow:none;
  border-radius:0;
  overflow:visible;
}

.archive-group-summary{
  list-style:none;
  cursor:pointer;
  display:inline-block;
  position:relative;
  padding-right:30px;
}

.archive-group-summary::-webkit-details-marker,
.archive-group-summary::marker{
  display:none;
  content:"";
}

.archive-year-label{
  display:inline-block;
  font-family:"Cormorant Garamond", serif;
  font-weight:700;
  color:rgba(248,239,228,0.96);
  line-height:0.92;
  letter-spacing:-0.035em;
}

.archive-group-chevron{
  position:absolute;
  right:4px;
  top:50%;
  width:10px;
  height:10px;
  margin-top:-8px;
  border-right:1.4px solid rgba(248,239,228,0.64);
  border-bottom:1.4px solid rgba(248,239,228,0.64);
  transform:rotate(45deg);
  transition:transform 280ms ease, opacity 280ms ease;
  opacity:0.72;
}

.archive-group[open] .archive-group-chevron{
  transform:rotate(225deg);
  margin-top:-2px;
}

.archive-group-content{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transition:grid-template-rows 700ms cubic-bezier(.19,1,.22,1), opacity 380ms ease, padding-top 420ms ease;
  padding-top:0;
}

.archive-group[open] .archive-group-content{
  grid-template-rows:1fr;
  opacity:1;
}

.archive-group-inner{
  overflow:hidden;
  min-height:0;
  display:grid;
  gap:24px;
}

.archive-item{
  margin:0;
}

#archives .concert-item,
.archives-page .concert-item{
  background:rgba(255,248,241,0.95);
}

#archives .concert-summary,
.archives-page .concert-summary{
  cursor:pointer;
}

#archives .concert-static .concert-summary,
#archives .no-toggle,
.archives-page .concert-static .concert-summary,
.archives-page .no-toggle{
  cursor:default;
}

#archives .concert-place,
.archives-page .concert-place{
  max-width:44ch;
}

#archives .concert-details,
.archives-page .concert-details{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transition:grid-template-rows 620ms cubic-bezier(.19,1,.22,1), opacity 340ms ease, padding-top 380ms ease;
  padding-top:0;
}

#archives .concert-item[open] .concert-details,
.archives-page .concert-item[open] .concert-details{
  grid-template-rows:1fr;
  opacity:1;
}

#archives .concert-details-inner,
.archives-page .concert-details-inner{
  overflow:hidden;
  min-height:0;
}

#archives .details-grid,
.archives-page .details-grid{
  grid-template-columns:minmax(0, 1.08fr) minmax(0, 0.92fr);
}

#archives .details-grid > div:only-child,
#archives .details-grid > .detail-column:only-child,
.archives-page .details-grid > div:only-child,
.archives-page .details-grid > .detail-column:only-child{
  max-width:46rem;
}

#archives .archive-subline,
.archives-page .archive-subline{
  margin:-0.2rem 0 0.9rem 0;
  color:rgba(94,73,62,0.88);
  font-size:1.02rem;
}

.archives-layout{
  display:grid;
  grid-template-columns:minmax(120px, 170px) minmax(0, 1fr);
  gap:28px;
  align-items:start;
}

.archives-index{
  padding-top:92px;
}

.archives-index-title,
.archives-index-year{
  margin:0;
  font-family:"Cormorant Garamond", serif;
  color:rgba(248,239,228,0.96);
}

.archives-index-title{
  font-size:clamp(2.15rem, 3vw, 3.1rem);
  font-weight:500;
  line-height:0.98;
}

.archives-index-title::after{
  content:"";
  display:block;
  width:100%;
  max-width:180px;
  margin-top:14px;
  border-top:1px solid rgba(232,220,208,0.18);
}

.archives-index-year{
  margin-top:22px;
  font-size:clamp(2.3rem, 3.2vw, 3.6rem);
  font-weight:600;
  line-height:0.94;
  letter-spacing:-0.03em;
}

.archive-group--current{
  background:transparent;
  border:none;
  box-shadow:none;
}

.archive-group-content--static{
  display:block;
  opacity:1;
  padding-top:0;
}

@media (min-width:761px){
  body.page-archives,
  .page-archives main#top{
    background:#0a0908;
  }

  .page-archives #archives{
    position:relative;
    isolation:isolate;
  }

  .page-archives #archives::before{
    content:"";
    position:fixed;
    inset:0;
    background:url("../images/hero-archive.jpg") center top / cover no-repeat;
    z-index:-2;
    pointer-events:none;
  }

  .page-archives .archives-hero{
    min-height:500px;
    background:transparent;
    overflow:visible;
  }

  .page-archives .archives-hero-desktop{
    display:none;
  }

  .page-archives .archives-content{
    margin-top:-138px;
    padding-top:0;
    padding-bottom:78px;
    background:transparent;
  }

  .page-archives .archives-layout{
    grid-template-columns:260px minmax(0, 1fr);
    gap:46px;
  }

  .page-archives .archives-index{
    position:fixed;
    top:300px;
    left:max(42px, calc((100vw - 1720px) / 2 + 42px));
    width:240px;
    padding-top:0;
    z-index:20;
  }

  .page-archives .archives-index-title{
    font-size:clamp(2.7rem, 3vw, 3.5rem);
  }

  .page-archives .archives-index-year{
    font-size:clamp(1.7rem, 1.95vw, 2.2rem);
    margin-top:16px;
  }

  .page-archives .archives-list{
    display:grid;
    gap:24px;
    justify-items:end;
    width:100%;
    padding-top:12px;
    padding-left:430px;
  }

  .page-archives .archive-group--current,
  .page-archives .archive-group-content--static,
  .page-archives .archive-group-inner{
    width:min(58vw, 1120px);
    margin-left:auto;
    margin-right:0.25vw;
  }

  .page-archives .archive-group-inner{
    gap:24px;
  }

  .page-archives .archive-year-label{
    font-size:clamp(3.3rem, 4.9vw, 5rem);
    margin:0;
    text-shadow:0 2px 10px rgba(0,0,0,0.10);
  }

  .page-archives .details-grid{
    grid-template-columns:minmax(0, 0.72fr) minmax(0, 1.28fr);
  }

  .page-archives .detail-column--info,
  .page-archives .detail-item--info{
    max-width:none;
  }

  .page-archives .archive-group[open] .archive-group-content{
    padding-top:86px;
  }

  .page-archives .concert-item{
    background:rgba(8,7,7,0.60) !important;
    border:1px solid rgba(232,220,208,0.10);
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  .page-archives .concert-item[open]{
    background:rgba(8,7,7,0.66) !important;
  }

  .page-archives .concert-item:hover,
  .page-archives .concert-item:focus-within{
    transform:none;
    box-shadow:none !important;
    background:rgba(10,8,8,0.66) !important;
    border-color:rgba(232,220,208,0.13);
  }

  .page-archives .concert-summary h3{
    color:rgba(248,239,228,0.98);
  }

  .page-archives .concert-place,
  .page-archives .concert-program-inline,
  .page-archives .concert-cta{
    color:rgba(232,220,208,0.78);
  }

  .page-archives .concert-date{
    color:#d9ad96;
  }

  .page-archives .concert-tag{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:auto;
    min-width:max-content;
    max-width:none;
    box-sizing:border-box;
    padding:0.5rem 1.25rem;
    border-radius:999px;
    background:rgba(255,248,241,0.06);
    color:rgba(244,236,223,0.80);
    white-space:nowrap;
    line-height:1;
  }

  .page-archives .concert-item:hover .concert-cta,
  .page-archives .concert-item:focus-within .concert-cta{
    color:rgba(248,239,228,0.96);
    transform:none;
  }

  .page-archives .concert-details{
    color:rgba(244,236,223,0.78);
    border-top:1px solid rgba(232,220,208,0.08);
  }

  .page-archives .concert-details h4{
    color:#e8c7b2;
  }

  .page-archives .detail-item--program,
  .page-archives .detail-item--info,
  .page-archives .archive-subline,
  .page-archives .detail-link a{
    color:rgba(244,236,223,0.76);
  }

  .page-archives .detail-program-composer{
    color:rgba(248,239,228,0.96);
  }

  .page-archives .detail-program-sep{
    color:rgba(244,236,223,0.38);
  }
}

@media (max-width:1100px){
  #archives .details-grid,
  .archives-page .details-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:900px){
  .archive-year-label{
    font-size:1.65rem;
  }
}

@media (max-width:760px){
  .archives-hero-desktop{
    display:none;
  }

  .archives-hero-mobile{
    display:block;
  }

  .archives-content{
    margin-top:-32px;
    padding-top:12px;
    padding-bottom:56px;
    background:#0a0908;
  }

  .archives-layout{
    grid-template-columns:1fr;
    gap:18px;
  }

  .archives-index{
    padding-top:0;
    position:static;
    width:auto;
  }

  .archives-index-title{
    font-size:2rem;
  }

  .archives-index-title::after{
    max-width:124px;
    margin-top:12px;
  }

  .archives-index-year{
    margin-top:16px;
    font-size:2.25rem;
  }

  .archive-year-label{
    font-size:1.55rem;
  }

  .archive-group[open] .archive-group-content{
    padding-top:18px;
  }

  #archives .archive-subline,
  .archives-page .archive-subline{
    margin:-0.14rem 0 0.82rem 0;
    font-size:0.95rem;
    line-height:1.36;
  }
}