/* Scoped light fallback: the original Helvetica Neue wordmark is unchanged. */
@font-face {
  font-family: "CWTD Editorial Light";
  src: url("/assets/fonts/open-sans-light.woff") format("woff");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}
body.section-page.bio-page {
  background: #000;
}
.bio-page .section-stage::after {
  background: linear-gradient(
    0deg,
    #000,
    rgba(0, 0, 0, 0.38) 20%,
    rgba(0, 0, 0, 0.35)
  );
  height: auto;
  bottom: 0;
}
.bio-page .section-environment {
  height: auto;
  bottom: 0;
}
.bio-page .bio-main {
  padding: calc(max(16px, env(safe-area-inset-top)) + 100px)
    max(44px, env(safe-area-inset-right)) 40px
    max(60px, env(safe-area-inset-left));
  max-width: 1536px;
  font-family:
    "Helvetica Neue", "CWTD Editorial Light", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-synthesis: none;
}
.bio-intro,
.bio-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.bio-editorial {
  display: grid;
  grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.13fr) minmax(0, 1.08fr);
  align-items: start;
  padding: 16px 0 24px;
  background: rgba(0, 0, 0, 0.95);
}
.bio-editorial > section {
  min-width: 0;
  padding: 0 22px;
}
.bio-editorial > section + section {
  border-left: 1px solid #30373a;
}
.bio-page .bio-column-title {
  font-size: clamp(14px, 1.3vw, 20px);
  font-weight: 300;
  line-height: 1.55;
  letter-spacing: 0.25em;
  border-bottom: 1px solid #788084;
  padding-bottom: 6px;
  margin: 0 0 20px;
}
.bio-main h3 {
  font-size: 13px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  line-height: 1.7;
  margin: 0 0 14px;
  color: #e5e8eb;
}
.bio-main p {
  font-size: 14px;
  font-weight: 300;
  line-height: 1.5;
  color: #d0d4d8;
  overflow-wrap: anywhere;
  margin: 0 0 16px;
}
.bio-portrait {
  margin: 0 auto 18px;
  max-width: 400px;
}
.bio-portrait img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.bio-page .bio-artist-name {
  color: #f4f4f4;
  font-size: clamp(14px, 1.25vw, 20px);
  letter-spacing: 0.23em;
  line-height: 1.7;
  margin-bottom: 6px;
}
.bio-page .bio-manifesto {
  font-size: 13px;
  letter-spacing: 0.27em;
  line-height: 1.5;
  border-top: 1px solid #a5e3ee;
  padding: 20px 6px 0;
  margin: 20px 0 24px;
}
.bio-symbols {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  gap: 16px;
  font-size: 38px;
  line-height: 1.4;
  margin: 0 0 16px;
}
.bio-glyph {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-variant-emoji: text;
}
.bio-shield {
  color: #00e5ff;
}
.bio-star {
  color: #ffe600;
}
.bio-wheel {
  color: #ff00d4;
}
.bio-crescent {
  color: #fff;
}
.bio-passage {
  margin: 0 0 22px;
}
.bio-story .bio-passage h3::after,
.bio-sound > .bio-passage:first-of-type h3::after {
  content: "";
  display: block;
  width: 34px;
  height: 1px;
  background: #d3dde1;
  margin-top: 10px;
}
.bio-story .bio-passage:last-of-type h3::after,
.bio-sound > .bio-passage:first-of-type h3::after {
  background: #82d6e1;
}
.bio-warehouse {
  margin: 22px 0 0;
  padding-top: 14px;
  border-top: 1px solid #788084;
}
.bio-warehouse img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.bio-symbolism {
  border: 1px solid #20272c;
  padding: 8px 10px 6px;
  margin: 16px 0;
  background: rgba(16, 21, 25, 0.34);
}
.bio-symbolism h3 {
  margin-bottom: 8px;
}
.bio-symbolism blockquote {
  margin: 0;
}
.bio-symbol-meaning {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}
.bio-symbol-meaning .bio-glyph {
  font-size: 29px;
  line-height: 1.25;
  text-align: center;
}
.bio-symbol-meaning p {
  font-size: 12px;
  margin: 0;
  line-height: 1.5;
}
.bio-button {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  min-height: 44px;
  max-width: 100%;
  padding: 8px 18px;
  border: 1px solid #bcc7cc;
  color: #f0f2f4;
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-decoration: none;
}
.bio-button svg {
  flex-shrink: 0;
}
.bio-listen {
  min-width: min(250px, 100%);
  margin-top: 8px;
}
.bio-contact {
  min-width: 158px;
}
.bio-button:hover {
  border-color: #82d6e1;
  color: #b5e5ed;
}
.bio-main :focus-visible {
  outline: 2px solid #00e5ff;
  outline-offset: 4px;
}
.bio-press,
.bio-assets {
  border-top: 1px solid #788084;
  padding-top: 14px;
  margin-top: 16px;
}
.bio-press h3,
.bio-assets h3,
.bio-follow h3 {
  margin-bottom: 8px;
}
.bio-press p {
  margin-bottom: 12px;
}
.bio-downloads {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.bio-downloads li {
  min-width: 0;
}
.bio-asset-download {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid #87939a;
  min-height: 36px;
  padding: 6px 9px;
  font-size: 9px;
  line-height: 1.5;
  letter-spacing: 0.12em;
  color: #d5dce0;
  cursor: pointer;
  text-decoration: none;
}
.bio-assets .bio-pending {
  font-size: 11px;
  color: #b3bdc3;
  margin: 8px 0 0;
}
.bio-follow {
  margin-top: 22px;
}
.bio-follow-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.bio-follow-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: #dce2e6;
  text-decoration: none;
}
.bio-follow-links a:hover {
  color: #fff;
}
.bio-follow-links svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}
@media (min-width: 701px) and (max-width: 1100px) {
  .bio-editorial {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 32px;
  }
  .bio-editorial > .bio-sound {
    grid-column: 1 / -1;
    border-left: 0;
    max-width: 760px;
  }
}
@media (max-width: 700px) {
  .bio-page .bio-main {
    padding-left: max(24px, env(safe-area-inset-left));
    padding-right: max(24px, env(safe-area-inset-right));
  }
  .bio-editorial {
    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
    padding-top: 12px;
  }
  .bio-editorial > section {
    padding: 0 8px;
  }
  .bio-editorial > section + section {
    border-left: 0;
  }
  .bio-portrait {
    max-width: min(280px, 100%);
  }
  .bio-page .bio-column-title {
    font-size: 17px;
  }
  .bio-main p {
    font-size: 16px;
    line-height: 1.65;
  }
  .bio-main h3 {
    font-size: 14px;
  }
  .bio-page .bio-artist-name {
    font-size: 17px;
  }
  .bio-page .bio-manifesto {
    font-size: 13px;
  }
  .bio-symbol-meaning p {
    font-size: 13px;
  }
  .bio-assets .bio-pending {
    font-size: 12px;
  }
  .bio-follow-links {
    gap: 6px;
  }
}
@media (max-width: 360px) {
  .bio-follow-links {
    display: grid;
    grid-template-columns: repeat(3, 44px);
    gap: 6px 16px;
  }
}
