/* Editorial additions follow the incumbent charcoal, cream and Urbanist world. */
.official-links, .home-discovery, .visual-archive, .covers-section, .photo-material {
  padding: 90px max(20px, 4.5vw);
}
.official-links, .home-discovery { border-top: 1px solid rgba(245, 231, 211, .24); }
.official-links h2, .home-discovery h2, .visual-archive > h2, .covers-section h2, .photo-material h2 {
  margin: 0 0 42px;
  max-width: 16ch;
  font-size: clamp(40px, 5.8vw, 82px);
  line-height: 1.04;
  font-weight: 600;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.official-links nav { display: flex; flex-wrap: wrap; gap: 12px 40px; }
.official-links nav a { padding: 12px 0; font-size: 19px; border-bottom: 1px solid rgba(245, 231, 211, .32); }
.official-links a:hover, .editorial-link:hover, .visual-chapter nav a:hover { color: #ddbd92; }
.home-discovery { display: grid; grid-template-columns: 1.4fr 1fr; gap: 7vw; align-items: center; }
.home-discovery nav { display: grid; }
.home-discovery nav a { padding: 23px 0; border-bottom: 1px solid rgba(245, 231, 211, .24); font-size: 14px; }
.home-discovery nav a:hover { padding-left: 10px; }
.editorial-link { display: inline-block; margin-top: 26px; padding: 9px 0; border-bottom: 1px solid currentColor; font-size: 13px; line-height: 1.6; letter-spacing: .025em; }
.home-text-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 32px;
  margin: 28px 0 0;
  font-size: 14px;
  line-height: 1.6;
}
.home-text-links a {
  padding: 5px 0;
  border-bottom: 1px solid rgba(245, 231, 211, .28);
  transition: border-color 180ms ease, color 180ms ease;
}
.home-text-links a:hover,
.home-text-links a:focus-visible { color: #ddbd92; border-color: currentColor; }
.project__left > .home-text-links { justify-content: flex-end; padding: 0 max(20px, 4.5vw); }
@media (prefers-reduced-motion: reduce) {
  .home-text-links a { transition: none; }
}
.artist-introduction { padding: 64px 4.5vw 0; }
.artist-introduction p { max-width: 70ch; margin: 0; font-size: 22px; line-height: 1.7; }
.world-note p + p { margin-top: 18px; }
.world-note p { line-height: 1.65; }
.world-note:last-child { grid-column: 1 / -1; max-width: 880px; }
.world-note:last-child p { max-width: 70ch; }
.world-feature img { object-position: center 38%; }
.world-feature--second img { object-position: center 35%; }
.world-gallery figure { aspect-ratio: .9; }
.world-gallery img { object-position: center 32%; }
.song-card__copy h3 small { display: block; font-size: .55em; margin-top: 8px; }
.visual-archive { padding-top: 0; }
.visual-archive > h2 { margin-bottom: 90px; }
.visual-chapter { padding: 44px 0 90px; border-top: 1px solid rgba(245, 231, 211, .24); }
.visual-chapter header { display: grid; grid-template-columns: 1.7fr 1fr; gap: 14px 6vw; margin-bottom: 34px; align-items: start; }
.visual-chapter h3 { grid-row: span 2; margin: 0; max-width: 19ch; font-size: clamp(32px, 4.2vw, 58px); line-height: 1.07; font-weight: 500; letter-spacing: -.03em; text-wrap: balance; }
.visual-chapter header p { margin: 0; font-size: 16px; }
.visual-chapter nav { display: flex; flex-wrap: wrap; gap: 18px; font-size: 12px; }
.visual-chapter nav a { padding: 8px 0; border-bottom: 1px solid currentColor; }
.chapter-gallery { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 16px; align-items: stretch; }
.chapter-gallery figure { margin: 0; min-width: 0; }
.chapter-gallery img { width: 100%; height: 100%; aspect-ratio: .82; object-fit: cover; object-position: center 32%; }
.chapter-gallery figure:first-child img { aspect-ratio: 1.15; }
.chapter-more { margin-top: 22px; }
.chapter-more summary { width: fit-content; padding: 14px 0; cursor: pointer; font-size: 15px; text-underline-offset: 6px; }
.chapter-more summary:hover { text-decoration: underline; }
.chapter-more[open] summary { margin-bottom: 22px; }
.chapter-gallery--expanded { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.chapter-gallery--expanded img, .chapter-gallery--expanded figure:first-child img { aspect-ratio: .9; }
.archive-closing { margin: 10px auto 0; max-width: 1100px; }
.archive-closing img { width: 100%; display: block; }
.archive-closing figcaption { margin-top: 14px; font-size: 13px; }
.covers-section { background: #252221; }
.covers-section header, .photo-material header { display: grid; grid-template-columns: 1.5fr 1fr; gap: 6vw; align-items: end; margin-bottom: 48px; }
.covers-section header h2, .photo-material h2 { margin-bottom: 0; }
.covers-section header p, .photo-material header p { max-width: 42ch; font-size: 18px; line-height: 1.6; margin: 0; }
.covers-duet { display: grid; grid-template-columns: 1fr 1fr; gap: 7vw; max-width: 920px; margin: 60px auto 0; align-items: start; }
.covers-duet figure { margin: 0; }
.covers-duet figure:nth-child(2) { padding-top: 100px; }
.covers-duet video { display: block; width: 100%; aspect-ratio: 9 / 16; background: #141414; object-fit: contain; }
.covers-duet figcaption { padding-top: 18px; font-size: 17px; }
.photo-material { background: #252221; }
.photo-material .chapter-gallery img { aspect-ratio: 1; transition: filter 250ms; }
.journey-item > span { font-size: 13px; letter-spacing: .04em; }
:target { scroll-margin-top: 95px; }
@media (max-width: 700px) {
  .official-links, .home-discovery, .visual-archive, .covers-section, .photo-material { padding: 72px 18px; }
  .visual-archive { padding-top: 0; }
  .official-links h2, .home-discovery h2, .visual-archive > h2, .covers-section h2, .photo-material h2 { font-size: clamp(36px, 11.5vw, 42px); margin-bottom: 34px; }
  .official-links nav { gap: 8px 28px; }
  .official-links nav a { font-size: 17px; }
  .home-discovery { grid-template-columns: 1fr; gap: 10px; }
  .artist-introduction { padding: 38px 18px 0; }
  .artist-introduction p { font-size: 18px; line-height: 1.72; }
  .world-note:last-child { grid-column: auto; }
  .visual-chapter { padding: 28px 0 60px; }
  .visual-chapter header { grid-template-columns: 1fr; gap: 18px; }
  .visual-chapter h3 { grid-row: auto; font-size: 35px; }
  .chapter-gallery { grid-template-columns: 1fr 1fr; gap: 10px; }
  .chapter-gallery figure:first-child { grid-column: 1 / -1; }
  .chapter-gallery figure:first-child img { aspect-ratio: 1.25; max-height: 370px; }
  .chapter-gallery img { aspect-ratio: .8; }
  .chapter-gallery--expanded figure:first-child { grid-column: auto; }
  .chapter-gallery--expanded figure:first-child img { aspect-ratio: .8; }
  .covers-section header, .photo-material header { grid-template-columns: 1fr; gap: 0; }
  .covers-duet { grid-template-columns: 1fr; gap: 40px; max-width: 380px; margin-top: 32px; }
  .covers-duet figure:nth-child(2) { padding-top: 0; }
  .photo-material .chapter-gallery figure:first-child { grid-column: 1 / -1; }
  .photo-material .chapter-gallery figure:first-child img { aspect-ratio: 1.2; }
}
@media (prefers-reduced-motion: reduce) {
  .photo-material .chapter-gallery img { transition: none; }
}
/* Accurate archive labels override the homepage's two-track labels. */
.music-page .song-card:nth-child(2)::before { content: "02 / SINGLE"; }
.music-page .song-card:nth-child(3)::before { content: "03 / LIVE MEDLEY"; }
/* The portrait heroes share a restrained stage-light wash and a readable lower scrim. */
.world-feature::before,
.world-feature::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
}
.world-feature::before {
  z-index: 1;
  background:
    radial-gradient(circle at 72% 30%, rgba(235, 203, 160, .2), transparent 38%),
    linear-gradient(102deg, rgba(9, 10, 11, .32), transparent 44%, rgba(9, 10, 11, .1));
  mix-blend-mode: soft-light;
}
.world-feature::after {
  z-index: 2;
  background:
    linear-gradient(180deg, rgba(8, 9, 10, .14), transparent 38%, rgba(8, 9, 10, .08) 58%, rgba(8, 9, 10, .64)),
    linear-gradient(90deg, rgba(8, 9, 10, .16), transparent 42%, rgba(8, 9, 10, .08));
}
.world-feature h1, .world-feature h2 { top: auto; bottom: 40px; z-index: 1; transform: none; mix-blend-mode: normal; color: var(--ink); }
@media (max-width: 700px) {
  .world-feature:not(.world-feature--second) img { object-position: 71% center; }
  .world-feature h1, .world-feature h2 { bottom: 32px; }
}

/* Inner-page captions share the Now Playing glass material. */
.hero-caption {
  position: absolute;
  left: max(24px, 4.5vw);
  bottom: 40px;
  z-index: 3;
  width: min(620px, calc(100% - max(48px, 9vw)));
  padding: 28px 32px 30px;
  color: var(--ink);
  background: rgba(14, 17, 19, .60);
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 24px;
  box-shadow: 0 16px 44px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .08);
  backdrop-filter: blur(18px) saturate(1.22);
  -webkit-backdrop-filter: blur(18px) saturate(1.22);
}
.hero-caption h1,
.world-feature .hero-caption h1,
.world-feature .hero-caption h2 {
  position: static;
  margin: 0;
  color: var(--ink);
  font-size: clamp(36px, 4.2vw, 60px);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.025em;
  text-align: left;
  text-wrap: balance;
  transform: none;
  mix-blend-mode: normal;
}
.hero-caption p {
  max-width: 48ch;
  margin: 16px 0 0;
  font-size: 17px;
  line-height: 1.55;
  text-wrap: pretty;
}
.world-feature > img { object-position: center 38%; }
.world-feature--second > img { object-position: center 34%; }
@media (max-width: 700px) {
  .hero-caption { left: 16px; bottom: 18px; width: calc(100% - 32px); padding: 20px 18px 22px; }
  .world-feature .hero-caption { left: 10px; bottom: 10px; width: calc(100% - 20px); }
  .hero-caption h1, .world-feature .hero-caption h1, .world-feature .hero-caption h2 { font-size: clamp(31px, 10.5vw, 35px); }
  .hero-caption p { margin-top: 11px; font-size: 14px; line-height: 1.55; }
  .world-feature:not(.world-feature--second) > img { object-position: center 38%; }
}
