/**
 * Sounds of Timor — public site styles.
 * Token set mirrors the SOT family (sot-sites-website / stot-main tokens.css)
 * with the FOREST anchor (the theme's 'sounds' role anchor): forest-green
 * heroes, Fraunces headings, Inter Tight body, warm paper background.
 * Everything is scoped under .sotsounds so the theme is never affected.
 */

:root {
  --sotsounds-ink: #0F1F24;
  --sotsounds-ink-2: #2B3D44;
  --sotsounds-ink-3: #546870;
  --sotsounds-paper: #FBF8F2;
  --sotsounds-line: #DDD3BE;
  --sotsounds-forest: #1F5A36;
  --sotsounds-forest-deep: #133A22;
  --sotsounds-forest-soft: #DCE8DE;
  --sotsounds-ocean: #0A4D6E;
  --sotsounds-sunset: #D86B3C;
  --sotsounds-serif: "Fraunces", "DM Serif Display", Georgia, serif;
  --sotsounds-sans: "Inter Tight", "Inter", ui-sans-serif, system-ui, sans-serif;
  --sotsounds-r-md: 10px;
  --sotsounds-r-lg: 16px;
  --sotsounds-shadow: 0 1px 2px rgba(15,31,36,.04), 0 8px 24px -12px rgba(15,31,36,.12);
}

.sotsounds { font-family: var(--sotsounds-sans); color: var(--sotsounds-ink); }
.sotsounds a { text-decoration: none; }

/* ── Pills ─────────────────────────────────────────────────────────── */
.sotsounds-pill {
  display: inline-block;
  padding: .25rem .7rem;
  border-radius: 999px;
  background: var(--sotsounds-sunset);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin: 0 0 .8rem;
}
.sotsounds-pill--light { background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.45); }

/* ── Hero ──────────────────────────────────────────────────────────── */
.sotsounds-hero {
  background: linear-gradient(135deg, var(--sotsounds-forest-deep) 0%, var(--sotsounds-forest) 60%, #2E7A4A 100%);
  color: #fff;
  border-radius: var(--sotsounds-r-lg);
  padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.25rem, 4vw, 3rem);
  margin: 1rem 0 2rem;
  position: relative;
  overflow: hidden;
}
.sotsounds-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at top right, rgba(255,255,255,0.12) 0%, transparent 50%);
  pointer-events: none;
}
.sotsounds-hero__content { position: relative; max-width: 760px; }
.sotsounds-hero__eyebrow {
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: .72rem;
  font-weight: 600;
  opacity: .95;
  margin: 0 0 .75rem;
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: wrap;
}
.sotsounds-hero__eyebrow .sotsounds-pill { margin: 0; }
.sotsounds-hero__title {
  font-family: var(--sotsounds-serif);
  font-weight: 400;
  letter-spacing: -0.01em;
  font-size: clamp(2rem, 5vw, 3.4rem);
  line-height: 1.1;
  margin: 0 0 1rem;
  color: #fff;
}
.sotsounds-hero__lead {
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  line-height: 1.55;
  opacity: .94;
  margin: 0 0 1.75rem;
  max-width: 620px;
}
.sotsounds-hero__form {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr auto;
  gap: .5rem;
  background: rgba(255, 255, 255, 0.96);
  padding: .65rem;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
  max-width: 780px;
}
.sotsounds-hero__form input[type="text"],
.sotsounds-hero__form select {
  background: #fff;
  border: 1px solid var(--sotsounds-line);
  border-radius: 6px;
  padding: .65rem .75rem;
  font-size: .95rem;
  color: var(--sotsounds-ink);
  font-family: inherit;
  min-width: 0;
}
.sotsounds-hero__form input[type="text"]:focus,
.sotsounds-hero__form select:focus {
  outline: none;
  border-color: var(--sotsounds-forest);
  box-shadow: 0 0 0 3px rgba(31,90,54,0.15);
}
.sotsounds-hero__form button {
  background: var(--sotsounds-forest);
  color: #fff;
  border: 0;
  border-radius: 6px;
  padding: .65rem 1.4rem;
  font-weight: 700;
  font-size: .95rem;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s;
  white-space: nowrap;
}
.sotsounds-hero__form button:hover { background: var(--sotsounds-forest-deep); }
.sotsounds-hero__note { margin: 1rem 0 0; font-size: .85rem; opacity: .85; }
@media (max-width: 740px) {
  .sotsounds-hero__form { grid-template-columns: 1fr; }
}

/* Hero art: photo column when shipped, decorative equalizer until then. */
.sotsounds-hero--split { display: grid; grid-template-columns: 7fr 5fr; gap: 2rem; align-items: stretch; }
.sotsounds-hero--split .sotsounds-hero__art { position: relative; display: flex; align-items: center; justify-content: center; min-height: 180px; }
/* No image yet → the equalizer lives in the hero's bottom-right corner. */
.sotsounds-hero:not(.sotsounds-hero--split) .sotsounds-hero__art {
  position: absolute;
  right: clamp(1.25rem, 4vw, 3rem);
  bottom: 0;
  pointer-events: none;
}
.sotsounds-hero__art img {
  width: 100%;
  height: 100%;
  max-height: 460px;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
}
.sotsounds-eq {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 130px;
  opacity: .5;
  padding-bottom: .5rem;
}
.sotsounds-eq span {
  width: 12px;
  border-radius: 6px 6px 0 0;
  background: linear-gradient(180deg, #A7E3BE 0%, rgba(167,227,190,.25) 100%);
  animation: sotsounds-eq-bounce 1.6s ease-in-out infinite;
  height: 30%;
}
.sotsounds-eq span:nth-child(2)  { animation-delay: .15s; height: 55%; }
.sotsounds-eq span:nth-child(3)  { animation-delay: .30s; height: 80%; }
.sotsounds-eq span:nth-child(4)  { animation-delay: .45s; height: 45%; }
.sotsounds-eq span:nth-child(5)  { animation-delay: .60s; height: 95%; }
.sotsounds-eq span:nth-child(6)  { animation-delay: .75s; height: 60%; }
.sotsounds-eq span:nth-child(7)  { animation-delay: .90s; height: 85%; }
.sotsounds-eq span:nth-child(8)  { animation-delay: .35s; height: 40%; }
.sotsounds-eq span:nth-child(9)  { animation-delay: .50s; height: 70%; }
.sotsounds-eq span:nth-child(10) { animation-delay: .20s; height: 50%; }
.sotsounds-eq span:nth-child(11) { animation-delay: .65s; height: 88%; }
.sotsounds-eq span:nth-child(12) { animation-delay: .05s; height: 35%; }
@keyframes sotsounds-eq-bounce {
  0%, 100% { transform: scaleY(.55); }
  50%      { transform: scaleY(1); }
}
@media (prefers-reduced-motion: reduce) {
  .sotsounds-eq span { animation: none; }
}
@media (max-width: 900px) {
  .sotsounds-hero--split { grid-template-columns: 1fr; }
  .sotsounds-hero--split .sotsounds-hero__art { min-height: 220px; }
  .sotsounds-hero:not(.sotsounds-hero--split) .sotsounds-hero__art { display: none; }
}

/* ── Section headings ──────────────────────────────────────────────── */
.sotsounds-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 2.5rem 0 1rem;
}
.sotsounds-head h2 {
  font-family: var(--sotsounds-serif);
  font-weight: 400;
  letter-spacing: -0.01em;
  font-size: clamp(1.4rem, 2.8vw, 2rem);
  margin: 0;
  color: var(--sotsounds-forest-deep);
}
.sotsounds-head__link { font-weight: 600; color: var(--sotsounds-forest); font-size: .9rem; }
.sotsounds-head__link:hover { text-decoration: underline; }

/* ── Genre tiles ───────────────────────────────────────────────────── */
.sotsounds-genres {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: .7rem;
  margin: 1rem 0 0;
}
.sotsounds-genre {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .85rem 1rem;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--sotsounds-line);
  color: inherit;
  transition: transform .12s, box-shadow .12s, border-color .12s;
}
.sotsounds-genre:hover {
  transform: translateY(-2px);
  box-shadow: var(--sotsounds-shadow);
  border-color: var(--sotsounds-forest);
}
.sotsounds-genre__emoji { font-size: 1.4rem; line-height: 1; }
.sotsounds-genre__label { font-weight: 600; font-size: .9rem; color: var(--sotsounds-ink-2); line-height: 1.25; }
/* Genre tile with shipped artwork (assets/img/genre-*.jpg) */
.sotsounds-genre--img {
  min-height: 96px;
  align-items: flex-end;
  background-size: cover;
  background-position: center;
  position: relative;
  border: 0;
  overflow: hidden;
}
.sotsounds-genre--img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(15,31,36,.78) 0%, rgba(15,31,36,.1) 55%, transparent 100%);
}
.sotsounds-genre--img .sotsounds-genre__label { position: relative; z-index: 1; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.4); }

/* ── Founding-artists spotlight ────────────────────────────────────── */
.sotsounds-featured {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .85rem;
  margin: 1rem 0 0;
}
.sotsounds-featured__card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  aspect-ratio: 4 / 5;
  border-radius: 14px;
  overflow: hidden;
  color: #fff;
  padding: 1.1rem;
  transition: transform .12s, box-shadow .12s;
}
.sotsounds-featured__card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(19,58,34,.25); }
.sotsounds-featured__card--1 { background: linear-gradient(160deg, #1F5A36 0%, #0F3D57 100%); }
.sotsounds-featured__card--2 { background: linear-gradient(160deg, #7A3B14 0%, #133A22 100%); }
.sotsounds-featured__card--3 { background: linear-gradient(160deg, #14504F 0%, #1F5A36 100%); }
.sotsounds-featured__card--4 { background: linear-gradient(160deg, #3F2A56 0%, #133A22 100%); }
.sotsounds-featured__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sotsounds-featured__emoji {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -70%);
  font-size: 3.2rem;
  opacity: .55;
}
.sotsounds-featured__meta {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: .3rem;
  padding-top: 2.5rem;
  background: linear-gradient(to top, rgba(15,31,36,.55) 40%, transparent 100%);
  margin: 0 -1.1rem -1.1rem;
  padding: 2.5rem 1.1rem 1.1rem;
}
.sotsounds-featured__pill {
  align-self: flex-start;
  padding: .18rem .6rem;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.4);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.sotsounds-featured__title { font-family: var(--sotsounds-serif); font-weight: 500; font-size: 1.15rem; letter-spacing: -0.01em; line-height: 1.2; }
.sotsounds-featured__genre { font-size: .78rem; opacity: .85; }
.sotsounds-featured__note { font-size: .85rem; color: var(--sotsounds-ink-3); margin: .8rem 0 0; }

/* ── "From the scene" band ─────────────────────────────────────────── */
.sotsounds-scene {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: .85rem;
  margin: 1rem 0;
}
.sotsounds-scene__card {
  background: #fff;
  border: 1px solid var(--sotsounds-line);
  border-radius: 12px;
  overflow: hidden;
  padding: 1.1rem 1.2rem;
}
.sotsounds-scene__img {
  width: calc(100% + 2.4rem);
  margin: -1.1rem -1.2rem .8rem;
  height: 130px;
  object-fit: cover;
  display: block;
}
.sotsounds-scene__emoji { font-size: 1.7rem; display: block; margin-bottom: .5rem; }
.sotsounds-scene__card h3 {
  font-family: var(--sotsounds-serif);
  font-weight: 500;
  font-size: 1.05rem;
  margin: 0 0 .4rem;
  color: var(--sotsounds-forest-deep);
}
.sotsounds-scene__card p { font-size: .86rem; color: var(--sotsounds-ink-2); margin: 0; line-height: 1.5; }

/* ── Category (section) tiles ──────────────────────────────────────── */
.sotsounds-cats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: .85rem;
  margin: 1rem 0 0;
}
.sotsounds-cat {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  padding: 1.1rem 1.2rem 1rem;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--sotsounds-line);
  color: inherit;
  transition: transform .12s, box-shadow .12s, border-color .12s;
  position: relative;
  overflow: hidden;
}
.sotsounds-cat::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--sotsounds-forest), var(--sotsounds-sunset));
}
.sotsounds-cat:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(19,58,34,0.12);
  border-color: var(--sotsounds-forest);
}
.sotsounds-cat__emoji { font-size: 1.7rem; line-height: 1; margin-top: .15rem; }
.sotsounds-cat--img { padding-top: 0; }
.sotsounds-cat__img {
  width: calc(100% + 2.4rem);
  margin: 0 -1.2rem .4rem;
  height: 120px;
  object-fit: cover;
  display: block;
}
.sotsounds-cat__title { font-weight: 700; font-size: 1rem; color: var(--sotsounds-forest-deep); margin: 0; letter-spacing: -0.01em; }
.sotsounds-cat__sample { font-size: .8rem; color: var(--sotsounds-ink-2); margin: 0; line-height: 1.45; }
.sotsounds-cat__cta { margin-top: auto; padding-top: .35rem; font-size: .82rem; font-weight: 700; color: var(--sotsounds-forest); }

/* ── How-it-works / feature steps ──────────────────────────────────── */
.sotsounds-how {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.25rem;
  margin: 1.5rem 0;
}
.sotsounds-how__step {
  background: #fff;
  border: 1px solid var(--sotsounds-line);
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.sotsounds-how__num {
  display: inline-flex;
  min-width: 40px;
  height: 40px;
  padding: 0 .5rem;
  border-radius: 999px;
  background: var(--sotsounds-forest);
  color: #fff;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.05rem;
  font-family: var(--sotsounds-serif);
  margin-bottom: .75rem;
}
.sotsounds-how__step h3 {
  font-family: var(--sotsounds-serif);
  font-weight: 500;
  font-size: 1.1rem;
  margin: 0 0 .5rem;
  color: var(--sotsounds-forest-deep);
  letter-spacing: -0.01em;
}
.sotsounds-how__step p { font-size: .92rem; color: var(--sotsounds-ink-3); margin: 0; line-height: 1.55; }

/* ── Trust strip ───────────────────────────────────────────────────── */
.sotsounds-trust {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 1rem;
  margin: 1.25rem 0;
}
.sotsounds-trust__item {
  background: linear-gradient(180deg, #F3F8F4 0%, #E9F1EB 100%);
  border: 1px solid var(--sotsounds-forest-soft);
  border-radius: 12px;
  padding: 1.25rem;
}
.sotsounds-trust__emoji { font-size: 1.6rem; display: block; margin-bottom: .5rem; }
.sotsounds-trust__item h3 {
  font-family: var(--sotsounds-serif);
  font-weight: 500;
  font-size: 1.05rem;
  margin: 0 0 .4rem;
  color: var(--sotsounds-forest-deep);
}
.sotsounds-trust__item p { font-size: .88rem; color: var(--sotsounds-ink-2); margin: 0; line-height: 1.5; }

/* ── Artist CTA band ───────────────────────────────────────────────── */
.sotsounds-cta {
  background: linear-gradient(135deg, var(--sotsounds-forest-deep) 0%, var(--sotsounds-forest) 100%);
  color: #fff;
  border-radius: var(--sotsounds-r-lg);
  padding: clamp(2rem, 5vw, 3rem);
  margin: 3rem 0 1rem;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1.5rem;
  align-items: center;
}
.sotsounds-cta h2 {
  font-family: var(--sotsounds-serif);
  font-weight: 400;
  color: #fff;
  margin: 0 0 .5rem;
  font-size: clamp(1.4rem, 2.5vw, 1.9rem);
  letter-spacing: -0.01em;
}
.sotsounds-cta p { margin: 0; color: rgba(255,255,255,0.92); max-width: 62ch; line-height: 1.55; }
.sotsounds-cta a {
  background: var(--sotsounds-sunset);
  color: #fff;
  padding: .85rem 1.6rem;
  border-radius: 8px;
  font-weight: 700;
  white-space: nowrap;
  transition: transform .12s, background .12s;
  align-self: center;
}
.sotsounds-cta a:hover { transform: translateY(-2px); background: #c05a2e; }
@media (max-width: 700px) {
  .sotsounds-cta { grid-template-columns: 1fr; }
  .sotsounds-cta a { justify-self: start; }
}

/* ── Guides cards ──────────────────────────────────────────────────── */
.sotsounds-guides {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .85rem;
  margin: 1rem 0;
}
.sotsounds-guide-card {
  background: #fff;
  border: 1px solid var(--sotsounds-line);
  border-radius: 12px;
  padding: 1.1rem 1.2rem;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  transition: transform .12s, box-shadow .12s, border-color .12s;
}
.sotsounds-guide-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sotsounds-shadow);
  border-color: var(--sotsounds-forest);
}
.sotsounds-guide-card h3 {
  font-family: var(--sotsounds-serif);
  font-weight: 500;
  font-size: 1.02rem;
  margin: 0;
  color: var(--sotsounds-forest-deep);
  line-height: 1.3;
}
.sotsounds-guide-card span { margin-top: auto; font-size: .82rem; font-weight: 700; color: var(--sotsounds-forest); }

/* ── Coming-soon surface ───────────────────────────────────────────── */
.sotsounds-soon {
  background: linear-gradient(135deg, var(--sotsounds-forest-deep) 0%, var(--sotsounds-forest) 100%);
  color: #fff;
  border-radius: var(--sotsounds-r-lg);
  padding: clamp(2.5rem, 6vw, 4rem) clamp(1.25rem, 4vw, 3rem);
  margin: 1rem 0 2rem;
  text-align: left;
}
.sotsounds-soon--img {
  background-size: cover;
  background-position: center;
  position: relative;
  overflow: hidden;
}
.sotsounds-soon--img::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(19,58,34,.92) 0%, rgba(19,58,34,.72) 55%, rgba(19,58,34,.35) 100%);
}
.sotsounds-soon--img > * { position: relative; }
.sotsounds-soon__emoji { font-size: 2.4rem; display: block; margin-bottom: .75rem; }
.sotsounds-soon h1 {
  font-family: var(--sotsounds-serif);
  font-weight: 400;
  letter-spacing: -0.01em;
  font-size: clamp(1.8rem, 4.5vw, 3rem);
  line-height: 1.12;
  margin: 0 0 .9rem;
  color: #fff;
}
.sotsounds-soon__lead { font-size: clamp(1rem, 1.6vw, 1.15rem); line-height: 1.55; opacity: .94; margin: 0; max-width: 640px; }
.sotsounds-soon__audience { margin: 1rem 0 0; font-size: .9rem; opacity: .85; font-style: italic; }

/* ── Checklist ─────────────────────────────────────────────────────── */
.sotsounds-checklist {
  list-style: none;
  margin: 1rem 0 2rem;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: .6rem;
}
.sotsounds-checklist li {
  background: #fff;
  border: 1px solid var(--sotsounds-line);
  border-radius: 10px;
  padding: .85rem 1rem .85rem 2.4rem;
  position: relative;
  font-size: .93rem;
  line-height: 1.5;
  color: var(--sotsounds-ink-2);
}
.sotsounds-checklist li::before {
  content: "♪";
  position: absolute;
  left: .9rem;
  top: .8rem;
  color: var(--sotsounds-forest);
  font-weight: 700;
}

/* ── Interest form ─────────────────────────────────────────────────── */
.sotsounds-interest {
  background: linear-gradient(180deg, #F3F8F4 0%, #E9F1EB 100%);
  border: 1px solid var(--sotsounds-forest-soft);
  border-radius: var(--sotsounds-r-lg);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  margin: 2.5rem 0;
}
.sotsounds-interest h2 {
  font-family: var(--sotsounds-serif);
  font-weight: 400;
  font-size: clamp(1.3rem, 2.5vw, 1.7rem);
  margin: 0 0 1rem;
  color: var(--sotsounds-forest-deep);
}
.sotsounds-interest__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .85rem;
  margin-bottom: .85rem;
}
.sotsounds-interest__form label { display: flex; flex-direction: column; gap: .3rem; font-size: .85rem; font-weight: 600; color: var(--sotsounds-ink-2); }
.sotsounds-interest__form input,
.sotsounds-interest__form select,
.sotsounds-interest__form textarea {
  border: 1px solid var(--sotsounds-line);
  border-radius: 8px;
  padding: .6rem .75rem;
  font-size: .95rem;
  font-family: inherit;
  background: #fff;
  color: var(--sotsounds-ink);
}
.sotsounds-interest__form input:focus,
.sotsounds-interest__form select:focus,
.sotsounds-interest__form textarea:focus {
  outline: none;
  border-color: var(--sotsounds-forest);
  box-shadow: 0 0 0 3px rgba(31,90,54,0.12);
}
.sotsounds-interest__msg { margin-bottom: 1rem; }
.sotsounds-interest__form button {
  background: var(--sotsounds-forest);
  color: #fff;
  border: 0;
  border-radius: 8px;
  padding: .75rem 1.6rem;
  font-weight: 700;
  font-size: .95rem;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s;
}
.sotsounds-interest__form button:hover { background: var(--sotsounds-forest-deep); }
.sotsounds-interest__privacy { font-size: .78rem; color: var(--sotsounds-ink-3); margin: .6rem 0 0; }
.sotsounds-interest__thanks { font-size: 1rem; color: var(--sotsounds-forest); font-weight: 600; }
.sotsounds-interest__error { color: #A8311F; font-weight: 600; }
.sotsounds-hp { position: absolute !important; left: -9999px !important; height: 1px; width: 1px; overflow: hidden; }

/* ── Prose (guides, about, legal) ──────────────────────────────────── */
.sotsounds-prose { max-width: 72ch; font-size: 1.02rem; line-height: 1.65; color: var(--sotsounds-ink-2); }
.sotsounds-prose h2 {
  font-family: var(--sotsounds-serif);
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--sotsounds-forest-deep);
  font-size: clamp(1.25rem, 2.4vw, 1.6rem);
  margin: 1.8em 0 .6em;
}
.sotsounds-prose ul, .sotsounds-prose ol { padding-left: 1.4rem; }
.sotsounds-prose li { margin-bottom: .45rem; }
.sotsounds-disclaimer {
  font-size: .82rem;
  color: var(--sotsounds-ink-3);
  border-left: 3px solid var(--sotsounds-sunset);
  padding: .5rem .9rem;
  background: #fff;
  border-radius: 0 8px 8px 0;
  margin: 1.5rem 0;
  max-width: 72ch;
}

/* ── Artist bridge: directory cards ────────────────────────────────── */
.sotsounds-artistcard { position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  aspect-ratio: 4/5; border-radius: 14px; overflow: hidden; color: #fff; text-decoration: none;
  background: linear-gradient(160deg, var(--sotsounds-forest) 0%, var(--sotsounds-forest-deep) 100%);
  transition: transform .12s, box-shadow .12s; }
.sotsounds-artistcard:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(19,58,34,.25); }
.sotsounds-artistcard__img { position: absolute; inset: 0; background-size: cover; background-position: center; }
.sotsounds-artistcard__meta { position: relative; z-index: 1; padding: 2.4rem 1rem .95rem;
  background: linear-gradient(to top, rgba(15,31,36,.82) 45%, transparent 100%); display: flex; flex-direction: column; gap: .15rem; }
.sotsounds-artistcard__name { font-family: var(--sotsounds-serif); font-weight: 500; font-size: 1.12rem; letter-spacing: -0.01em; }
.sotsounds-artistcard__genre { font-size: .78rem; opacity: .88; }

/* ── Artist profile ────────────────────────────────────────────────── */
.sotsounds-artist__hero { position: relative; border-radius: var(--sotsounds-r-lg); overflow: hidden;
  background: linear-gradient(135deg, var(--sotsounds-forest-deep) 0%, var(--sotsounds-forest) 60%, #2E7A4A 100%);
  background-size: cover; background-position: center; color: #fff; margin: 1rem 0 1.5rem; min-height: 260px; display: flex; align-items: flex-end; }
.sotsounds-artist__hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(19,58,34,.9) 0%, rgba(19,58,34,.55) 60%, rgba(19,58,34,.25) 100%); }
.sotsounds-artist__heroinner { position: relative; padding: clamp(1.5rem, 4vw, 3rem); }
.sotsounds-artist__hero h1 { font-family: var(--sotsounds-serif); font-weight: 400; font-size: clamp(1.9rem, 5vw, 3.2rem); line-height: 1.08; margin: .3rem 0; color: #fff; }
.sotsounds-artist__tags { opacity: .92; margin: .2rem 0; }
.sotsounds-artist__followers { font-size: .85rem; opacity: .8; margin: .2rem 0 0; }
.sotsounds-artist__cols { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 900px) { .sotsounds-artist__cols { grid-template-columns: 1fr 340px; align-items: start; } }
.sotsounds-artist__rail { position: sticky; top: 1rem; }
.sotsounds-artist__members, .sotsounds-artist__gigs { list-style: none; margin: .5rem 0 1rem; padding: 0; }
.sotsounds-artist__members li, .sotsounds-artist__gigs li { padding: .5rem .2rem; border-bottom: 1px solid var(--sotsounds-line); font-size: .95rem; }
.sotsounds-artist__gigdate { display: inline-block; min-width: 8.5em; font-weight: 600; color: var(--sotsounds-forest); }

/* ── Data-light player ─────────────────────────────────────────────── */
.sotsounds-player { list-style: none; margin: .75rem 0; padding: 0; border: 1px solid var(--sotsounds-line); border-radius: 12px; overflow: hidden; background: #fff; }
.sotsounds-player__row { display: flex; align-items: center; gap: .8rem; padding: .6rem .9rem; border-bottom: 1px solid var(--sotsounds-line); }
.sotsounds-player__row:last-child { border-bottom: 0; }
.sotsounds-player__play { flex: none; width: 38px; height: 38px; border-radius: 999px; border: 0; cursor: pointer;
  background: var(--sotsounds-forest); color: #fff; font-size: .9rem; line-height: 1; transition: background .15s; }
.sotsounds-player__play:hover { background: var(--sotsounds-forest-deep); }
.sotsounds-player__play:disabled { background: var(--sotsounds-line); cursor: default; }
.sotsounds-player__title { flex: 1 1 auto; font-weight: 500; color: var(--sotsounds-ink); }
.sotsounds-player__title a { color: var(--sotsounds-ink-3); font-weight: 400; }
.sotsounds-player__e { font-size: .62rem; background: var(--sotsounds-ink-3); color: #fff; border-radius: 3px; padding: 0 .25rem; vertical-align: middle; }
.sotsounds-player__plays { flex: none; font-size: .8rem; color: var(--sotsounds-ink-3); }
.sotsounds-player__note { font-size: .8rem; color: var(--sotsounds-ink-3); margin: .3rem 0 1rem; }

/* ── Sticky booking widget ─────────────────────────────────────────── */
.sotsounds-book { background: linear-gradient(180deg, #F3F8F4 0%, #E9F1EB 100%); border: 1px solid var(--sotsounds-forest-soft); border-radius: var(--sotsounds-r-lg); padding: 1.25rem; }
.sotsounds-book h3 { font-family: var(--sotsounds-serif); font-weight: 500; margin: 0 0 .6rem; color: var(--sotsounds-forest-deep); }
.sotsounds-book__offers { list-style: none; margin: 0 0 .8rem; padding: 0; }
.sotsounds-book__offers li { display: flex; justify-content: space-between; gap: .5rem; padding: .3rem 0; border-bottom: 1px dashed var(--sotsounds-line); font-size: .9rem; }
.sotsounds-book__form label { display: flex; flex-direction: column; gap: .25rem; font-size: .8rem; font-weight: 600; color: var(--sotsounds-ink-2); margin-bottom: .55rem; }
.sotsounds-book__form input, .sotsounds-book__form select, .sotsounds-book__form textarea { border: 1px solid var(--sotsounds-line); border-radius: 8px; padding: .55rem .7rem; font: inherit; background: #fff; color: var(--sotsounds-ink); }
.sotsounds-book__form button { width: 100%; background: var(--sotsounds-forest); color: #fff; border: 0; border-radius: 8px; padding: .75rem 1rem; font-weight: 700; cursor: pointer; margin-top: .3rem; }
.sotsounds-book__form button:hover { background: var(--sotsounds-forest-deep); }
.sotsounds-book__pay { font-size: .76rem; color: var(--sotsounds-ink-3); margin: .5rem 0 0; }
.sotsounds-book__wa { display: inline-block; margin-top: .5rem; font-size: .82rem; font-weight: 600; color: var(--sotsounds-forest); }
.sotsounds-book__msg { font-size: .85rem; color: var(--sotsounds-forest); font-weight: 600; margin: .5rem 0 0; }

/* ════════════════════════════════════════════════════════════════════
   ARTIST PROFILE 2030 — "band stage" redesign (scoped under .sotsx).
   Full-bleed dark stage, generative gradient hero, cover-art-forward
   track cards, sticky play bar, polaroid empty gallery, cinema block.
   Pure CSS — no external assets, cheap on 3G.
   ════════════════════════════════════════════════════════════════════ */
.sotsx {
  --sx-bg: #0B0E13;
  --sx-bg-2: #12161F;
  --sx-card: #161B26;
  --sx-card-2: #1C2230;
  --sx-line: rgba(255,255,255,.09);
  --sx-ink: #F4F2EC;
  --sx-ink-2: #C4C9D4;
  --sx-ink-3: #8B93A3;
  --sx-amber: #FFB454;
  --sx-coral: #FF5D73;
  --sx-teal: #35D0BA;
  --sx-glow: 0 0 18px rgba(255,180,84,.45);
  --sx-pad: clamp(1rem, 4vw, 2.5rem);
  /* Full-bleed: exact offsets are measured + applied by the inline JS
     (the theme column is off-centre, so pure-CSS 50vw tricks clip). */
  margin: 0 0 -2rem;
  background:
    radial-gradient(1200px 500px at 85% -5%, rgba(53,208,186,.06), transparent 60%),
    radial-gradient(900px 480px at 0% 30%, rgba(255,93,115,.05), transparent 55%),
    var(--sx-bg);
  color: var(--sx-ink);
  padding: 0 var(--sx-pad) clamp(4rem, 7vw, 6rem);
  box-sizing: border-box;
}
.sotsx > * { max-width: 1120px; margin-left: auto; margin-right: auto; }

/* When the theme's page card hosts the stage, the card dissolves —
   the stage IS the page. (Graceful: without :has() support the profile
   simply stays inside the card.) */
article.stot-card:has(.sotsx) {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  border-radius: 0;
}
article.stot-card:has(.sotsx) > .stot-page-article__title {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
article.stot-card:has(.sotsx) .stot-prose { max-width: none; }

/* ── Hero: generative stage lights + festival-poster type ─────────── */
.sotsx-hero {
  position: relative;
  overflow: hidden;
  border-radius: 0 0 24px 24px;
  min-height: clamp(400px, 58vh, 560px);
  display: flex;
  align-items: flex-end;
  background-color: #0D1117;
  background-size: cover;
  background-position: center 30%;
  max-width: none;
  margin: 0 calc(-1 * var(--sx-pad));
}
.sotsx-hero__lights { position: absolute; inset: 0; pointer-events: none; }
.sotsx-hero__lights i {
  content: "";
  position: absolute;
  width: 60vmax; height: 60vmax;
  border-radius: 50%;
  filter: blur(60px);
  opacity: .5;
  mix-blend-mode: screen;
  animation: sotsx-drift 16s ease-in-out infinite alternate;
}
.sotsx-hero__lights i:nth-child(1) { background: radial-gradient(circle, rgba(255,180,84,.55) 0%, transparent 60%); top: -28vmax; left: -12vmax; }
.sotsx-hero__lights i:nth-child(2) { background: radial-gradient(circle, rgba(255,93,115,.42) 0%, transparent 60%); top: -20vmax; right: -18vmax; animation-delay: -6s; }
.sotsx-hero__lights i:nth-child(3) { background: radial-gradient(circle, rgba(53,208,186,.32) 0%, transparent 62%); bottom: -34vmax; left: 28%; animation-delay: -11s; }
@keyframes sotsx-drift {
  0%   { transform: translate3d(0,0,0) scale(1); }
  100% { transform: translate3d(6vmax, 4vmax, 0) scale(1.15); }
}
/* faux film grain: two crossed repeating gradients, basically free */
.sotsx-hero__noise {
  position: absolute; inset: 0; pointer-events: none; opacity: .35;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.022) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.05) 0 1px, transparent 1px 4px);
}
/* readability scrim when a real hero photo ships */
.sotsx-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(7,9,13,.92) 0%, rgba(7,9,13,.45) 45%, rgba(7,9,13,.15) 100%);
}
.sotsx-hero__inner {
  position: relative; z-index: 2;
  width: 100%; max-width: 1120px;
  margin: 0 auto;
  padding: clamp(4.5rem, 10vw, 7rem) clamp(1rem, 4vw, 2.5rem) clamp(1.6rem, 4vw, 2.6rem);
}
.sotsx-hero__name {
  margin: .35em 0 .25em;
  font-family: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  font-weight: 900;
  font-stretch: condensed;
  text-transform: uppercase;
  letter-spacing: -.015em;
  line-height: .95;
  font-size: clamp(2.6rem, 8.5vw, 6rem);
  color: var(--sx-ink);
  text-wrap: balance;
  text-shadow: 0 2px 24px rgba(0,0,0,.55);
}
.sotsx-chips { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0; }
.sotsx-chip {
  display: inline-block;
  padding: .3rem .8rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(13,17,23,.45);
  backdrop-filter: blur(4px);
  color: var(--sx-ink);
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.sotsx-chip--type { background: var(--sx-amber); border-color: var(--sx-amber); color: #201404; box-shadow: var(--sx-glow); }
.sotsx-hero__actions { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.1rem 0 .8rem; }
.sotsx-btn {
  display: inline-flex; align-items: center; gap: .55rem;
  border-radius: 999px;
  padding: .72rem 1.5rem;
  font-weight: 800; font-size: .95rem;
  cursor: pointer; border: 0;
  font-family: inherit; text-decoration: none;
  transition: transform .15s, box-shadow .15s, background .15s;
}
.sotsx-btn:active { transform: scale(.97); }
.sotsx-btn--play { background: var(--sx-ink); color: #10131A; }
.sotsx-btn--play:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(0,0,0,.5); }
.sotsx-btn--follow {
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  box-shadow: 0 0 22px rgba(255,93,115,.45);
}
.sotsx-btn--follow:hover { transform: translateY(-2px); box-shadow: 0 0 30px rgba(255,93,115,.65); }
.sotsx-btn--ghost { background: transparent; color: var(--sx-ink); border: 1px solid rgba(255,255,255,.35); }
.sotsx-btn--ghost:hover { border-color: var(--sx-ink); transform: translateY(-2px); }
.sotsx-tri {
  width: 0; height: 0; display: inline-block;
  border-style: solid;
  border-width: .42em 0 .42em .7em;
  border-color: transparent transparent transparent currentColor;
}
.sotsx-hero__sub { position: relative; z-index: 2; margin: 0; font-size: .88rem; color: var(--sx-ink-2); }
.sotsx-hero__sub .sotsounds-follow__msg { margin-left: .6rem; color: var(--sx-amber); font-weight: 600; }

/* demo corner ribbon — honest, but part of the design */
.sotsx-ribbon {
  position: absolute; z-index: 3;
  top: 26px; right: -44px;
  transform: rotate(35deg);
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  font-size: .7rem; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase;
  padding: .38rem 3.2rem;
  box-shadow: 0 4px 14px rgba(0,0,0,.35);
  cursor: help;
}
.sotsx-demoline {
  font-size: .8rem; color: var(--sx-ink-3);
  margin: .9rem auto 0;
  padding: 0 .2rem;
}
.sotsx-demoline strong { color: var(--sx-ink-2); }

/* ── Section headings ──────────────────────────────────────────────── */
.sotsx-sechead {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: .4rem 1rem;
  margin: clamp(2.4rem, 6vw, 3.6rem) auto .9rem;
}
.sotsx-sechead h2 {
  margin: 0;
  font-family: inherit;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: clamp(1.15rem, 2.6vw, 1.55rem);
  color: var(--sx-ink);
}
.sotsx-sechead h2::after {
  content: "";
  display: inline-block;
  width: 2.2em; height: .28em;
  margin-left: .55em;
  vertical-align: .12em;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--sx-amber), var(--sx-coral));
}
.sotsx-sechead__meta { font-size: .8rem; color: var(--sx-ink-3); letter-spacing: .05em; text-transform: uppercase; font-weight: 600; }
.sotsx-note { font-size: .82rem; color: var(--sx-ink-3); margin: .7rem auto 0; max-width: 1120px; }

/* ── Track cards (cover-art-forward, generative art) ───────────────── */
.sotsx-tracks {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
  gap: .9rem;
}
.sotsx-track { position: relative; }
.sotsx-track__art {
  position: relative;
  aspect-ratio: 1 / 1;
  border-radius: 14px;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 12% 8%, hsl(var(--ta) 75% 62% / .95) 0%, transparent 55%),
    radial-gradient(130% 110% at 92% 92%, hsl(var(--tb) 70% 45% / .9) 0%, transparent 60%),
    linear-gradient(160deg, #232A3A 0%, #10141D 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), 0 4px 14px rgba(0,0,0,.35);
  transition: transform .16s, box-shadow .16s;
}
.sotsx-track:hover .sotsx-track__art { transform: translateY(-4px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14), 0 14px 30px rgba(0,0,0,.5); }
.sotsx-track.is-playing .sotsx-track__art { box-shadow: inset 0 0 0 2px var(--sx-amber), 0 0 24px rgba(255,180,84,.35); }
.sotsx-track__grooves {
  position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background: repeating-radial-gradient(circle at 85% 20%, transparent 0 7px, rgba(255,255,255,.05) 7px 8px);
}
.sotsx-track__no {
  position: absolute; top: .5rem; left: .65rem;
  font-size: 1.55rem; font-weight: 900;
  color: rgba(255,255,255,.5);
  letter-spacing: -.02em;
  text-shadow: 0 1px 6px rgba(0,0,0,.4);
}
.sotsx-track__play {
  position: absolute; inset: 0; margin: auto;
  width: 54px; height: 54px;
  border-radius: 999px; border: 0; cursor: pointer;
  background: rgba(10,12,17,.72);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(3px);
  box-shadow: 0 0 0 1px rgba(255,255,255,.22);
  transition: transform .15s, background .15s, box-shadow .15s;
}
.sotsx-track__play .sotsx-tri { margin-left: .18em; border-width: .5em 0 .5em .85em; }
.sotsx-track:hover .sotsx-track__play { transform: scale(1.1); background: var(--sx-amber); color: #201404; box-shadow: var(--sx-glow); }
.sotsx-track.is-playing .sotsx-track__play { background: var(--sx-amber); color: #201404; }
.sotsx-track__lock {
  position: absolute; inset: 0; margin: auto;
  width: 54px; height: 54px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 999px;
  background: rgba(10,12,17,.6);
  color: rgba(255,255,255,.85);
  box-shadow: 0 0 0 1px rgba(255,255,255,.15);
}
.sotsx-track--locked .sotsx-track__art { filter: saturate(.35) brightness(.6); }
.sotsx-track--locked:hover .sotsx-track__art { filter: saturate(.55) brightness(.75); transform: none; }
.sotsx-track__meta { display: flex; flex-direction: column; gap: .22rem; padding: .55rem .15rem 0; }
.sotsx-track__title { font-weight: 700; font-size: .9rem; color: var(--sx-ink); line-height: 1.25; }
.sotsx-track--locked .sotsx-track__title { color: var(--sx-ink-2); }
.sotsx-track__tags { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; }
.sotsx-track__plays { font-size: .72rem; color: var(--sx-ink-3); }
.sotsx-badge {
  display: inline-block;
  font-size: .6rem; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase;
  border-radius: 999px;
  padding: .18rem .55rem;
}
.sotsx-badge--free {
  color: var(--sx-teal);
  border: 1px solid rgba(53,208,186,.55);
  box-shadow: 0 0 10px rgba(53,208,186,.35), inset 0 0 8px rgba(53,208,186,.12);
}
.sotsx-badge--locked { color: var(--sx-ink-3); border: 1px solid var(--sx-line); }

/* animated equalizer on the playing card */
.sotsx-eq {
  position: absolute; left: .6rem; bottom: .55rem;
  display: none; align-items: flex-end; gap: 3px; height: 18px;
}
.sotsx-track.is-playing .sotsx-eq { display: flex; }
.sotsx-eq i {
  width: 4px; border-radius: 2px 2px 0 0;
  background: var(--sx-amber);
  box-shadow: 0 0 8px rgba(255,180,84,.7);
  animation: sotsx-eqb .9s ease-in-out infinite;
  height: 100%;
  transform-origin: bottom;
}
.sotsx-eq i:nth-child(2) { animation-delay: .18s; }
.sotsx-eq i:nth-child(3) { animation-delay: .36s; }
.sotsx-eq i:nth-child(4) { animation-delay: .54s; }
@keyframes sotsx-eqb { 0%,100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } }

/* ── Cinema (Watch) ────────────────────────────────────────────────── */
.sotsx-cinema { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 1rem; }
.sotsx-cinema__item { margin: 0; }
.sotsx-cinema__frame {
  position: relative;
  padding-top: 56.25%;
  border-radius: 16px;
  overflow: hidden;
  background: #05070B;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 10px 30px rgba(0,0,0,.45);
}
.sotsx-cinema__frame iframe, .sotsx-cinema__frame video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sotsx-cinema__item figcaption { font-size: .85rem; color: var(--sx-ink-2); margin-top: .5rem; }
.sotsx-cinema--empty { grid-template-columns: 1fr; }
.sotsx-cinema__frame--dark {
  background:
    radial-gradient(90% 130% at 50% 115%, rgba(255,180,84,.16) 0%, transparent 55%),
    linear-gradient(180deg, #0A0D13 0%, #05070B 100%);
}
.sotsx-cinema__marquee {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 1rem;
}
.sotsx-cinema__reel { font-size: 2rem; margin-bottom: .6rem; filter: grayscale(.3); }
.sotsx-cinema__label {
  margin: 0;
  font-weight: 900; text-transform: uppercase; letter-spacing: .35em;
  color: var(--sx-amber);
  text-shadow: 0 0 18px rgba(255,180,84,.5);
  font-size: clamp(.9rem, 2.4vw, 1.2rem);
}
.sotsx-cinema__sub { margin: .5rem 0 0; font-size: .82rem; color: var(--sx-ink-3); max-width: 46ch; }

/* ── Gallery + polaroid empty state ────────────────────────────────── */
.sotsx-gallery { columns: 3 240px; column-gap: .9rem; }
.sotsx-gallery__item { break-inside: avoid; margin: 0 0 .9rem; }
.sotsx-gallery__item img { width: 100%; display: block; border-radius: 12px; box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.sotsx-gallery__item figcaption { font-size: .78rem; color: var(--sx-ink-3); margin-top: .35rem; }
.sotsx-polaroids {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 1.1rem .9rem;
  padding-top: .4rem;
}
.sotsx-polaroid {
  background: #F5F1E6;
  border-radius: 6px;
  padding: .55rem .55rem .8rem;
  box-shadow: 0 8px 20px rgba(0,0,0,.45);
  transform: rotate(-2.2deg);
  position: relative;
  transition: transform .18s;
}
.sotsx-polaroid:nth-child(2n) { transform: rotate(1.8deg); }
.sotsx-polaroid:nth-child(3n) { transform: rotate(-1deg) translateY(6px); }
.sotsx-polaroid:hover { transform: rotate(0) scale(1.04); z-index: 2; }
.sotsx-polaroid__tape {
  position: absolute; top: -9px; left: 50%;
  width: 58px; height: 18px;
  transform: translateX(-50%) rotate(-3deg);
  background: rgba(255,255,255,.28);
  border-left: 1px dashed rgba(255,255,255,.35);
  border-right: 1px dashed rgba(255,255,255,.35);
}
.sotsx-polaroid__win {
  display: flex; align-items: center; justify-content: center;
  aspect-ratio: 1 / 1;
  border-radius: 3px;
  background:
    radial-gradient(80% 80% at 30% 20%, rgba(255,180,84,.14) 0%, transparent 60%),
    linear-gradient(160deg, #232A3A 0%, #10141D 100%);
}
.sotsx-polaroid__shotno {
  font-size: 1.7rem; font-weight: 900;
  color: rgba(255,255,255,.28);
  letter-spacing: .02em;
}
.sotsx-polaroid__cap {
  display: block; text-align: center;
  margin-top: .5rem;
  font-size: .62rem; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase;
  color: #6B6455;
}

/* ── Fan-wall timeline ─────────────────────────────────────────────── */
.sotsx-feed { display: grid; gap: .9rem; }
.sotsx-post {
  background: var(--sx-card);
  border: 1px solid var(--sx-line);
  border-radius: 16px;
  padding: 1.1rem 1.25rem 1.05rem;
  transition: transform .15s, border-color .15s, box-shadow .15s;
}
.sotsx-post:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.18); box-shadow: 0 10px 26px rgba(0,0,0,.35); }
.sotsx-post--pinned { border-color: rgba(255,180,84,.4); }
.sotsx-post__head { display: flex; align-items: center; gap: .7rem; margin-bottom: .55rem; }
.sotsx-post__avatar {
  flex: none;
  width: 40px; height: 40px;
  border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: .95rem; color: #201404;
  background: linear-gradient(135deg, var(--sx-amber), var(--sx-coral));
}
.sotsx-post__who { display: flex; flex-direction: column; gap: .05rem; min-width: 0; }
.sotsx-post__author { font-weight: 800; font-size: .92rem; color: var(--sx-ink); }
.sotsx-post__when { font-size: .74rem; color: var(--sx-ink-3); letter-spacing: .04em; }
.sotsx-post__pin { margin-left: auto; font-size: .72rem; font-weight: 700; color: var(--sx-amber); white-space: nowrap; }
.sotsx-post__title { margin: 0 0 .35rem; font-size: 1.08rem; font-weight: 800; color: var(--sx-ink); }
.sotsx-post__body { font-size: .93rem; line-height: 1.6; color: var(--sx-ink-2); }
.sotsx-post__body p { margin: 0 0 .6em; }
.sotsx-post__body p:last-child { margin-bottom: 0; }

/* ── About / members / gigs on the dark stage ──────────────────────── */
.sotsx-prose { max-width: 68ch; font-size: 1rem; line-height: 1.7; color: var(--sx-ink-2); }
.sotsx-prose strong { color: var(--sx-ink); }
.sotsx-members { list-style: none; margin: .3rem 0 0; padding: 0; display: grid; gap: .55rem; }
.sotsx-members li { display: flex; align-items: center; gap: .7rem; font-size: .95rem; color: var(--sx-ink-2); }
.sotsx-members li strong { color: var(--sx-ink); display: block; }
.sotsx-members li em { font-style: normal; font-size: .82rem; color: var(--sx-ink-3); }
.sotsx-members__avatar {
  flex: none; width: 34px; height: 34px; border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .8rem; color: var(--sx-ink);
  background: var(--sx-card-2);
  box-shadow: inset 0 0 0 1px var(--sx-line);
}
.sotsx-gigs { list-style: none; margin: .3rem 0 0; padding: 0; display: grid; gap: .6rem; }
.sotsx-gigs li {
  display: flex; align-items: center; gap: .9rem;
  background: var(--sx-card);
  border: 1px solid var(--sx-line);
  border-radius: 14px;
  padding: .7rem .9rem;
}
.sotsx-gigs__date {
  flex: none; width: 52px; height: 52px;
  border-radius: 12px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: linear-gradient(160deg, var(--sx-card-2), #232A3A);
  box-shadow: inset 0 0 0 1px var(--sx-line);
}
.sotsx-gigs__date strong { font-size: 1.15rem; font-weight: 900; color: var(--sx-amber); line-height: 1; }
.sotsx-gigs__date em { font-style: normal; font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--sx-ink-3); }
.sotsx-gigs__what strong { display: block; color: var(--sx-ink); font-size: .95rem; }
.sotsx-gigs__what em { font-style: normal; font-size: .78rem; color: var(--sx-ink-3); }

/* ── Booking card on the stage ─────────────────────────────────────── */
.sotsx-cols { margin-top: 1rem; }
.sotsx .sotsounds-book {
  background: var(--sx-card);
  border: 1px solid var(--sx-line);
  border-radius: 18px;
  position: relative;
  overflow: hidden;
}
.sotsx .sotsounds-book::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--sx-amber), var(--sx-coral), var(--sx-teal));
}
.sotsx .sotsounds-book h3 { color: var(--sx-ink); font-family: inherit; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; font-size: 1rem; }
.sotsx .sotsounds-book__offers li { border-bottom: 1px dashed var(--sx-line); color: var(--sx-ink-2); }
.sotsx .sotsounds-book__offers strong { color: var(--sx-amber); }
.sotsx .sotsounds-book__form label { color: var(--sx-ink-3); }
.sotsx .sotsounds-book__form input,
.sotsx .sotsounds-book__form select,
.sotsx .sotsounds-book__form textarea {
  background: var(--sx-bg-2);
  border: 1px solid var(--sx-line);
  color: var(--sx-ink);
  color-scheme: dark;
}
.sotsx .sotsounds-book__form input:focus,
.sotsx .sotsounds-book__form select:focus,
.sotsx .sotsounds-book__form textarea:focus { outline: none; border-color: var(--sx-amber); box-shadow: 0 0 0 3px rgba(255,180,84,.18); }
.sotsx .sotsounds-book__form button {
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  font-weight: 800;
  box-shadow: 0 0 18px rgba(255,93,115,.35);
  transition: transform .15s, box-shadow .15s;
}
.sotsx .sotsounds-book__form button:hover { transform: translateY(-2px); box-shadow: 0 0 26px rgba(255,93,115,.55); }
.sotsx .sotsounds-book__pay { color: var(--sx-ink-3); }
.sotsx .sotsounds-book__wa { color: var(--sx-teal); }
.sotsx .sotsounds-book__msg { color: var(--sx-teal); }

/* ── Sticky play bar ───────────────────────────────────────────────── */
.sotsx-bar[hidden] { display: none !important; }
.sotsx-bar {
  position: fixed;
  left: 50%; transform: translateX(-50%);
  bottom: max(.8rem, env(safe-area-inset-bottom));
  width: min(720px, calc(100vw - 1.4rem));
  z-index: 9999;
  display: flex; align-items: center; gap: .8rem;
  background: rgba(16,20,29,.88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  padding: .55rem .9rem .55rem .55rem;
  box-shadow: 0 18px 40px rgba(0,0,0,.55), 0 0 24px rgba(255,180,84,.12);
  animation: sotsx-barin .35s cubic-bezier(.2,.9,.3,1.2);
  max-width: none; margin: 0;
}
@keyframes sotsx-barin { from { transform: translate(-50%, 120%); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }
.sotsx-bar__toggle {
  flex: none;
  width: 44px; height: 44px;
  border-radius: 999px; border: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(120deg, var(--sx-amber), #FF8E53);
  color: #201404;
  box-shadow: var(--sx-glow);
}
.sotsx-bar__toggle .sotsx-tri { margin-left: .15em; }
/* playing state → pause glyph via two bars */
.sotsx-bar:not(.is-paused) .sotsx-bar__toggle .sotsx-tri {
  border: 0; width: 12px; height: 14px;
  background: linear-gradient(90deg, currentColor 0 4px, transparent 4px 8px, currentColor 8px 12px);
}
.sotsx-bar__mid { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .3rem; }
.sotsx-bar__title {
  display: flex; align-items: baseline; gap: .5rem; min-width: 0;
  font-size: .85rem; font-weight: 700; color: #F4F2EC;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sotsx-bar__title em { font-style: normal; font-weight: 500; font-size: .74rem; color: #8B93A3; }
.sotsx-bar__progress {
  height: 5px; border-radius: 999px;
  background: rgba(255,255,255,.16);
  cursor: pointer; overflow: hidden;
}
.sotsx-bar__fill {
  display: block; height: 100%; width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, #FFB454, #FF5D73);
  box-shadow: 0 0 10px rgba(255,180,84,.6);
  transition: width .25s linear;
}
.sotsx-bar__time { flex: none; font-size: .72rem; color: #8B93A3; font-variant-numeric: tabular-nums; }
.sotsx-bar__close {
  flex: none; width: 30px; height: 30px;
  border-radius: 999px; border: 0; cursor: pointer;
  background: rgba(255,255,255,.1); color: #C4C9D4;
  font-size: .8rem; line-height: 1;
}
.sotsx-bar__close:hover { background: rgba(255,255,255,.2); }
body.sotsx-has-bar { padding-bottom: 90px; }

/* ── Motion & mobile care ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .sotsx-hero__lights i, .sotsx-eq i { animation: none; }
  .sotsx-bar { animation: none; }
}
@media (max-width: 720px) {
  .sotsx { margin-top: -.5rem; }
  .sotsx-hero { min-height: 66vw; border-radius: 0 0 18px 18px; }
  .sotsx-hero__inner { padding-top: 5.5rem; }
  .sotsx-hero__name { font-size: clamp(2.3rem, 12vw, 3.4rem); }
  .sotsx-btn { padding: .65rem 1.15rem; font-size: .88rem; }
  .sotsx-tracks { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
  .sotsx-polaroids { grid-template-columns: repeat(2, 1fr); }
  .sotsx-bar { gap: .55rem; }
  .sotsx-bar__time { display: none; }
}

/* ── Specificity armour: the theme's .stot-prose h1/h2/h3 rules (serif,
   forest ink, prose sizes) must never restyle the stage. ─────────────── */
.sotsx .sotsx-hero__name {
  font-family: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  font-weight: 900;
  font-stretch: condensed;
  text-transform: uppercase;
  letter-spacing: -.015em;
  line-height: .95;
  font-size: clamp(2.6rem, 8.5vw, 6rem);
  color: var(--sx-ink);
  margin: .35em 0 .25em;
  max-width: 18ch;
}
.sotsx .sotsx-sechead h2 {
  font-family: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: clamp(1.15rem, 2.6vw, 1.55rem);
  color: var(--sx-ink);
  margin: 0;
}
.sotsx .sotsx-post__title {
  font-family: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  font-weight: 800;
  font-size: 1.08rem;
  color: var(--sx-ink);
  margin: 0 0 .35rem;
  letter-spacing: 0;
}
.sotsx .sotsx-post__body, .sotsx .sotsx-post__body p { color: var(--sx-ink-2); }
.sotsx .sotsx-post__body a, .sotsx .sotsx-prose a { color: var(--sx-teal); }
.sotsx .sotsx-prose, .sotsx .sotsx-prose p, .sotsx .sotsx-prose li { color: var(--sx-ink-2); }
.sotsx .sotsx-prose h2, .sotsx .sotsx-prose h3 {
  font-family: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  font-weight: 800;
  color: var(--sx-ink);
  font-size: 1.15rem;
}
.sotsx .sotsounds-book h3 {
  font-family: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  color: var(--sx-ink);
}
.sotsx .sotsx-cinema__label { font-family: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif; }

/* demo line: quiet centred caption, not a floor-wide whisper */
.sotsx .sotsx-demoline {
  max-width: 72ch;
  margin: 1rem auto 0;
  text-align: center;
  font-size: .8rem;
  line-height: 1.5;
  color: var(--sx-ink-3);
}
/* breathing room under the polaroids before the caption note */
.sotsx .sotsx-polaroids { padding-bottom: .6rem; }
.sotsx .sotsx-polaroids + .sotsx-note { margin-top: 1.1rem; text-align: center; }

/* hero sub-line: lift contrast a touch */
.sotsx .sotsx-hero__sub { color: var(--sx-ink-2); font-size: .9rem; }

/* ── polish pass 3 ─────────────────────────────────────────────────── */
/* theme link styles must not repaint the ghost CTA */
.sotsx a.sotsx-btn--ghost,
.sotsx a.sotsx-btn--ghost:hover,
.sotsx a.sotsx-btn--ghost:visited {
  color: var(--sx-ink);
  text-decoration: none;
  border-bottom: 0;
  border: 1px solid rgba(255,255,255,.35);
}
.sotsx a.sotsx-btn--ghost:hover { border-color: var(--sx-ink); }
/* explainer notes: a touch more presence */
.sotsx .sotsx-note { color: var(--sx-ink-2); opacity: .8; font-size: .84rem; }
/* the sticky bar must float clear of the theme's mobile bottom nav */
@media (max-width: 900px) {
  .sotsx-bar { bottom: calc(86px + env(safe-area-inset-bottom)); }
  body.sotsx-has-bar { padding-bottom: 150px; }
}

/* ════════════════════════════════════════════════════════════════════
   SITE-WIDE DARK STAGE (v0.6.0) — the v0.5.3 profile design language
   extended to the directory (/artists/), /listen/, the home page and
   every Coming-Soon section. ONE system: same .sotsx tokens, same
   full-bleed JS breakout, same amber/coral/teal stage accents.
   ════════════════════════════════════════════════════════════════════ */
.sotsx { --sx-display: ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif; }

/* ── Hero variants ─────────────────────────────────────────────────── */
.sotsx-hero--page { min-height: clamp(260px, 36vh, 400px); }
.sotsx-hero--soon { min-height: clamp(320px, 46vh, 480px); }
.sotsx-hero--home { min-height: clamp(430px, 62vh, 640px); }
.sotsx-hero--photo { background-size: cover; background-position: center 30%; }
.sotsx .sotsx-hero--page .sotsx-hero__inner,
.sotsx .sotsx-hero--soon .sotsx-hero__inner { padding-top: clamp(3.4rem, 7vw, 5rem); }
.sotsx .sotsx-hero--page .sotsx-hero__name,
.sotsx .sotsx-hero--soon .sotsx-hero__name { font-size: clamp(2.4rem, 7vw, 5rem); }
.sotsx .sotsx-hero--home .sotsx-hero__name { font-size: clamp(2rem, 5.2vw, 4.2rem); max-width: 22ch; }
.sotsx .sotsx-hero__lead {
  position: relative; z-index: 2;
  margin: .2rem 0 0;
  font-size: clamp(.98rem, 1.7vw, 1.18rem);
  line-height: 1.6;
  color: var(--sx-ink-2);
  max-width: 58ch;
}
.sotsx .sotsx-hero__note { position: relative; z-index: 2; margin: .9rem 0 0; font-size: .82rem; color: var(--sx-ink-3); }

/* "Opening soon" as event-poster marquee — anticipation, not apology */
.sotsx-marquee {
  position: relative; z-index: 2;
  margin: 1rem 0 0;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .35em;
  color: var(--sx-amber);
  text-shadow: 0 0 18px rgba(255,180,84,.5);
  font-size: clamp(.78rem, 1.8vw, .95rem);
}

/* Home hero: dark glass search bar */
.sotsx-search {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr auto;
  gap: .5rem;
  margin-top: 1.25rem;
  padding: .6rem;
  border-radius: 16px;
  background: rgba(13,17,23,.55);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  max-width: 800px;
}
.sotsx-search input[type="text"],
.sotsx-search select {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 10px;
  padding: .7rem .8rem;
  font-size: .95rem;
  color: var(--sx-ink);
  font-family: inherit;
  min-width: 0;
  color-scheme: dark;
}
.sotsx-search input[type="text"]::placeholder { color: var(--sx-ink-3); }
.sotsx-search input[type="text"]:focus,
.sotsx-search select:focus {
  outline: none;
  border-color: var(--sx-amber);
  box-shadow: 0 0 0 3px rgba(255,180,84,.18);
}
.sotsx-search button {
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  border: 0;
  border-radius: 10px;
  padding: .7rem 1.5rem;
  font-weight: 800;
  font-size: .95rem;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  box-shadow: 0 0 18px rgba(255,93,115,.3);
  transition: transform .15s, box-shadow .15s;
}
.sotsx-search button:hover { transform: translateY(-2px); box-shadow: 0 0 26px rgba(255,93,115,.5); }
@media (max-width: 740px) {
  .sotsx-search { grid-template-columns: 1fr; }
}

/* Home hero: amber equalizer in the stage corner */
.sotsx-hero__eqwrap {
  position: absolute; z-index: 1;
  right: clamp(1rem, 4vw, 3rem); bottom: 0;
  pointer-events: none;
}
.sotsx-hero__eqwrap .sotsounds-eq { opacity: .55; }
.sotsx-hero__eqwrap .sotsounds-eq span {
  background: linear-gradient(180deg, var(--sx-amber) 0%, rgba(255,180,84,.12) 100%);
  box-shadow: 0 0 12px rgba(255,180,84,.35);
}
@media (max-width: 900px) { .sotsx-hero__eqwrap { display: none; } }

/* ── Poster wall (directory) ───────────────────────────────────────── */
.sotsx-wall {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 1rem;
}
.sotsx-poster {
  position: relative;
  display: flex; flex-direction: column; justify-content: flex-end;
  aspect-ratio: 3 / 4;
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  background:
    radial-gradient(120% 90% at 15% 8%, hsl(var(--ta) 72% 58% / .92) 0%, transparent 55%),
    radial-gradient(130% 110% at 90% 92%, hsl(var(--tb) 70% 42% / .85) 0%, transparent 60%),
    linear-gradient(160deg, #232A3A 0%, #10141D 100%);
  background-size: cover;
  background-position: center 25%;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), 0 6px 18px rgba(0,0,0,.4);
  transition: transform .16s, box-shadow .16s;
}
.sotsx-poster::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(7,9,13,.88) 0%, rgba(7,9,13,.25) 52%, transparent 100%);
}
.sotsx-poster:hover {
  transform: translateY(-5px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.16), 0 18px 40px rgba(0,0,0,.6), 0 0 26px rgba(255,180,84,.2);
}
.sotsx-poster__grooves {
  position: absolute; inset: 0; pointer-events: none; opacity: .45;
  background: repeating-radial-gradient(circle at 85% 15%, transparent 0 9px, rgba(255,255,255,.05) 9px 10px);
}
.sotsx-poster--photo .sotsx-poster__grooves { display: none; }
.sotsx-poster__meta {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; gap: .5rem;
  padding: 0 1rem 1rem;
}
.sotsx-poster__name {
  font-family: var(--sx-display);
  font-weight: 900;
  font-stretch: condensed;
  text-transform: uppercase;
  letter-spacing: -.01em;
  line-height: 1;
  font-size: clamp(1.25rem, 2.6vw, 1.6rem);
  color: var(--sx-ink);
  text-shadow: 0 2px 14px rgba(0,0,0,.6);
  text-wrap: balance;
}
.sotsx-poster__chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.sotsx-poster__chip {
  font-size: .6rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.28);
  color: var(--sx-ink-2);
  background: rgba(13,17,23,.45);
}
.sotsx-poster__chip--type { border-color: rgba(255,180,84,.6); color: var(--sx-amber); }
.sotsx-poster__ribbon {
  position: absolute; z-index: 2;
  top: 14px; right: -34px;
  transform: rotate(35deg);
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  font-size: .6rem; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase;
  padding: .3rem 2.6rem;
  box-shadow: 0 4px 12px rgba(0,0,0,.35);
  cursor: help;
}
@media (max-width: 720px) {
  .sotsx-wall { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
  .sotsx-poster__name { font-size: 1.1rem; }
}

/* ── Listen: artist credit on track cards ──────────────────────────── */
.sotsx-track__artist { font-size: .74rem; color: var(--sx-ink-3); line-height: 1.3; }
.sotsx-track__artist a { color: var(--sx-teal); font-weight: 600; text-decoration: none; }
.sotsx-track__artist a:hover { text-decoration: underline; }
.sotsx-tracks--listen { grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); }

/* ── .sotsx-site: the home/Coming-Soon components on the dark stage ── */
.sotsx .sotsounds-head { margin: clamp(2.4rem, 6vw, 3.4rem) auto .9rem; }
.sotsx .sotsounds-head h2 {
  font-family: var(--sx-display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: clamp(1.15rem, 2.6vw, 1.55rem);
  color: var(--sx-ink);
  margin: 0;
}
.sotsx .sotsounds-head h2::after {
  content: "";
  display: inline-block;
  width: 2.2em; height: .28em;
  margin-left: .55em;
  vertical-align: .12em;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--sx-amber), var(--sx-coral));
}
.sotsx .sotsounds-head__link { color: var(--sx-teal); font-weight: 700; }

/* genre tiles */
.sotsx .sotsounds-genre { background: var(--sx-card); border: 1px solid var(--sx-line); }
.sotsx .sotsounds-genre:hover {
  border-color: rgba(255,180,84,.5);
  box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 18px rgba(255,180,84,.15);
  transform: translateY(-3px);
}
.sotsx .sotsounds-genre__label { color: var(--sx-ink); }
.sotsx .sotsounds-genre--img { border: 0; }
.sotsx .sotsounds-genre--img::after {
  background: linear-gradient(to top, rgba(7,9,13,.85) 0%, rgba(7,9,13,.15) 60%, transparent 100%);
}

/* founding-artist cards */
.sotsx .sotsounds-featured__card { box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.sotsx .sotsounds-featured__card:hover {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14), 0 16px 36px rgba(0,0,0,.55), 0 0 22px rgba(255,93,115,.25);
}
.sotsx .sotsounds-featured__pill {
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  border: 0;
  color: #23100A;
}
.sotsx .sotsounds-featured__title { font-family: var(--sx-display); font-weight: 800; }
.sotsx .sotsounds-featured__note { color: var(--sx-ink-3); }

/* scene cards */
.sotsx .sotsounds-scene__card { background: var(--sx-card); border-color: var(--sx-line); }
.sotsx .sotsounds-scene__card h3 { font-family: var(--sx-display); font-weight: 800; color: var(--sx-ink); }
.sotsx .sotsounds-scene__card p { color: var(--sx-ink-3); }

/* section (cats) tiles */
.sotsx .sotsounds-cat { background: var(--sx-card); border-color: var(--sx-line); }
.sotsx .sotsounds-cat::before { background: linear-gradient(90deg, var(--sx-amber), var(--sx-coral), var(--sx-teal)); }
.sotsx .sotsounds-cat:hover { border-color: rgba(255,180,84,.5); box-shadow: 0 14px 30px rgba(0,0,0,.5); }
.sotsx .sotsounds-cat__title { color: var(--sx-ink); font-weight: 800; }
.sotsx .sotsounds-cat__sample { color: var(--sx-ink-3); }
.sotsx .sotsounds-cat__cta { color: var(--sx-teal); }

/* how-it-works */
.sotsx .sotsounds-how__step { background: var(--sx-card); border-color: var(--sx-line); box-shadow: none; }
.sotsx .sotsounds-how__step h3 { font-family: var(--sx-display); font-weight: 800; color: var(--sx-ink); }
.sotsx .sotsounds-how__step p { color: var(--sx-ink-3); }
.sotsx .sotsounds-how__num {
  background: linear-gradient(135deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  font-family: var(--sx-display);
  font-weight: 900;
}

/* trust strip — teal tint */
.sotsx .sotsounds-trust__item {
  background: linear-gradient(180deg, rgba(53,208,186,.08), rgba(53,208,186,.02)), var(--sx-card);
  border: 1px solid rgba(53,208,186,.28);
}
.sotsx .sotsounds-trust__item h3 { font-family: var(--sx-display); font-weight: 800; color: var(--sx-ink); }
.sotsx .sotsounds-trust__item p { color: var(--sx-ink-2); }

/* artist CTA band */
.sotsx .sotsounds-cta {
  background:
    radial-gradient(120% 160% at 85% 0%, rgba(255,93,115,.18), transparent 55%),
    radial-gradient(120% 160% at 0% 100%, rgba(53,208,186,.14), transparent 55%),
    var(--sx-card);
  border: 1px solid var(--sx-line);
}
.sotsx .sotsounds-cta h2 {
  font-family: var(--sx-display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--sx-ink);
}
.sotsx .sotsounds-cta p { color: var(--sx-ink-2); }
.sotsx .sotsounds-cta a {
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  font-weight: 800;
  border-radius: 999px;
  box-shadow: 0 0 22px rgba(255,93,115,.4);
}
.sotsx .sotsounds-cta a:hover { background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral)); box-shadow: 0 0 30px rgba(255,93,115,.6); }

/* guides cards */
.sotsx .sotsounds-guide-card { background: var(--sx-card); border-color: var(--sx-line); }
.sotsx .sotsounds-guide-card:hover { border-color: rgba(255,180,84,.5); box-shadow: 0 10px 26px rgba(0,0,0,.45); }
.sotsx .sotsounds-guide-card h3 { font-family: var(--sx-display); font-weight: 800; color: var(--sx-ink); }
.sotsx .sotsounds-guide-card span { color: var(--sx-teal); }

/* checklist ("what's launching here") */
.sotsx .sotsounds-checklist li { background: var(--sx-card); border-color: var(--sx-line); color: var(--sx-ink-2); }
.sotsx .sotsounds-checklist li::before { color: var(--sx-amber); }

/* interest form — dark glass card with gradient hairline */
.sotsx .sotsounds-interest {
  background: var(--sx-card);
  border: 1px solid var(--sx-line);
  position: relative;
  overflow: hidden;
}
.sotsx .sotsounds-interest::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--sx-amber), var(--sx-coral), var(--sx-teal));
}
.sotsx .sotsounds-interest h2 {
  font-family: var(--sx-display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: clamp(1rem, 2.2vw, 1.25rem);
  color: var(--sx-ink);
}
.sotsx .sotsounds-interest__form label { color: var(--sx-ink-3); }
.sotsx .sotsounds-interest__form input,
.sotsx .sotsounds-interest__form select,
.sotsx .sotsounds-interest__form textarea {
  background: var(--sx-bg-2);
  border: 1px solid var(--sx-line);
  color: var(--sx-ink);
  color-scheme: dark;
}
.sotsx .sotsounds-interest__form input:focus,
.sotsx .sotsounds-interest__form select:focus,
.sotsx .sotsounds-interest__form textarea:focus {
  outline: none;
  border-color: var(--sx-amber);
  box-shadow: 0 0 0 3px rgba(255,180,84,.18);
}
.sotsx .sotsounds-interest__form button {
  background: linear-gradient(120deg, var(--sx-amber), var(--sx-coral));
  color: #23100A;
  font-weight: 800;
  box-shadow: 0 0 18px rgba(255,93,115,.35);
  transition: transform .15s, box-shadow .15s;
}
.sotsx .sotsounds-interest__form button:hover { transform: translateY(-2px); box-shadow: 0 0 26px rgba(255,93,115,.55); }
.sotsx .sotsounds-interest__privacy { color: var(--sx-ink-3); }
.sotsx .sotsounds-interest__thanks { color: var(--sx-teal); }
.sotsx .sotsounds-interest__error { color: var(--sx-coral); }

/* ── Specificity armour vs theme prose typography (as on the profile) ─ */
.sotsx .sotsounds-head h2,
.sotsx .sotsounds-cta h2,
.sotsx .sotsounds-interest h2 { font-family: var(--sx-display); }
.sotsx .sotsx-hero--home .sotsx-hero__name {
  font-family: var(--sx-display);
  font-size: clamp(2rem, 5.2vw, 4.2rem);
  max-width: 22ch;
}
.sotsx .sotsx-hero--page .sotsx-hero__name,
.sotsx .sotsx-hero--soon .sotsx-hero__name { font-size: clamp(2.4rem, 7vw, 5rem); }

/* ── Mobile care ───────────────────────────────────────────────────── */
@media (max-width: 720px) {
  .sotsx-hero--home { min-height: 0; }
  .sotsx .sotsx-hero--home .sotsx-hero__inner,
  .sotsx .sotsx-hero--page .sotsx-hero__inner,
  .sotsx .sotsx-hero--soon .sotsx-hero__inner { padding-top: 3.2rem; }
  .sotsx .sotsx-hero--home .sotsx-hero__name { font-size: clamp(1.7rem, 8.4vw, 2.4rem); }
  .sotsx .sotsx-hero--page .sotsx-hero__name,
  .sotsx .sotsx-hero--soon .sotsx-hero__name { font-size: clamp(2.1rem, 11vw, 3rem); }
}

/* ── round 2: armour + polish ──────────────────────────────────────── */
/* Theme prose typography must never leak onto ANY stage heading:
   no serif, no border-bottom underline, anywhere under .sotsx. */
div.sotsx h1, div.sotsx h2, div.sotsx h3 {
  font-family: var(--sx-display);
  border-bottom: 0;
}
/* "Opening soon" marquee: theme prose p color must not dim the neon */
.sotsx .sotsx-marquee {
  color: var(--sx-amber);
  text-shadow: 0 0 18px rgba(255,180,84,.55);
  font-size: clamp(.82rem, 1.9vw, 1rem);
}
/* genre photo tiles: stronger scrim so pale photos never wash the label */
.sotsx .sotsounds-genre--img::after {
  background: linear-gradient(to top, rgba(7,9,13,.86) 0%, rgba(7,9,13,.38) 55%, rgba(7,9,13,.16) 100%);
}
/* cat tiles: the section title is an h3 — bold condensed, never serif */
.sotsx .sotsounds-cat__title {
  font-family: var(--sx-display);
  font-weight: 800;
  font-size: 1.02rem;
  letter-spacing: 0;
}

/* ── round 3: listen wall keeps two columns on phones ─────────────── */
@media (max-width: 720px) {
  .sotsx-tracks.sotsx-tracks--listen { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
}

/* ── Fan: charts / hitlist ─────────────────────────────────────────── */
.sotsx-chart { list-style: none; margin: .5rem 0 1.5rem; padding: 0; border: 1px solid var(--sotsounds-line); border-radius: 14px; overflow: hidden; background: #fff; }
.sotsx-chart__row { display: flex; align-items: center; gap: .7rem; padding: .55rem .8rem; border-bottom: 1px solid var(--sotsounds-line); }
.sotsx-chart__row:last-child { border-bottom: 0; }
.sotsx-chart__rank { flex: none; width: 1.6em; text-align: center; font-family: var(--sotsounds-serif); font-weight: 600; color: var(--sotsounds-ink-3); }
.sotsx-chart__play { flex: none; width: 36px; height: 36px; border-radius: 999px; border: 0; cursor: pointer; background: var(--sotsounds-forest); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.sotsx-chart__play:disabled { background: var(--sotsounds-line); cursor: default; }
.sotsx-chart__play.is-playing { background: var(--sotsounds-sunset); }
.sotsx-chart__play .sotsx-tri { width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 10px; border-color: transparent transparent transparent #fff; margin-left: 2px; }
.sotsx-chart__meta { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.sotsx-chart__title { font-weight: 600; color: var(--sotsounds-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sotsx-chart__artist { font-size: .8rem; color: var(--sotsounds-ink-3); }
.sotsx-chart__plays { flex: none; font-size: .8rem; color: var(--sotsounds-ink-3); }
.sotsx-chart__fav, .sotsx-fanctl__fav, .sotsx-fanctl__pl { flex: none; cursor: pointer; color: var(--sotsounds-ink-3); font-size: 1.1rem; line-height: 1; padding: .2rem .35rem; border-radius: 6px; user-select: none; }
.sotsx-chart__fav.is-saved, .sotsx-fanctl__fav.is-saved { color: var(--sotsounds-sunset); }
.sotsx-chart__fav:hover, .sotsx-fanctl__fav:hover, .sotsx-fanctl__pl:hover { background: var(--sotsounds-forest-soft); }

/* Track-row fan controls (injected onto .sotsx-track) */
.sotsx-fanctl { display: inline-flex; align-items: center; gap: .1rem; margin-left: auto; }

/* Add-to-playlist floating menu */
.sotsx-plmenu { position: absolute; z-index: 9999; background: #fff; border: 1px solid var(--sotsounds-line); border-radius: 10px; box-shadow: var(--sotsounds-shadow); padding: .3rem; min-width: 180px; display: flex; flex-direction: column; }
.sotsx-plmenu button { text-align: left; background: none; border: 0; padding: .5rem .6rem; border-radius: 6px; cursor: pointer; font: inherit; color: var(--sotsounds-ink); }
.sotsx-plmenu button:hover { background: var(--sotsounds-forest-soft); }
.sotsx-plmenu__new { border-top: 1px solid var(--sotsounds-line) !important; color: var(--sotsounds-forest) !important; font-weight: 600; }

/* My Music playlists */
.sotsx-playlists { display: flex; flex-direction: column; gap: .5rem; margin: .5rem 0 1.5rem; }
.sotsx-plcard { border: 1px solid var(--sotsounds-line); border-radius: 12px; background: #fff; overflow: hidden; }
.sotsx-plcard__head { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .85rem 1rem; background: none; border: 0; cursor: pointer; font: inherit; }
.sotsx-plcard__title { font-family: var(--sotsounds-serif); font-weight: 500; color: var(--sotsounds-forest-deep); }
.sotsx-plcard__n { font-size: .8rem; color: var(--sotsounds-ink-3); }
.sotsx-plcard__body { padding: 0 .6rem .4rem; }
.sotsx-mymusic .sotsx-wall { margin-top: .5rem; }

/* ── Home "alive" band (featured music + side block) ───────────────── */
.sotsx-alive { margin: 1.25rem 0 2rem; }
.sotsx-alive__grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 900px) { .sotsx-alive__grid { grid-template-columns: 1.7fr 1fr; align-items: start; } }
.sotsx-alive__side { display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 900px) { .sotsx-alive__side { position: sticky; top: 1rem; } }

.sotsx-sidecard { background: #fff; border: 1px solid var(--sotsounds-line); border-radius: 14px; padding: .9rem 1rem 1rem; }
.sotsx-sidecard__head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .4rem; }
.sotsx-sidecard__head h3 { font-family: var(--sotsounds-serif); font-weight: 500; font-size: 1.05rem; margin: 0; color: var(--sotsounds-forest-deep); }
.sotsx-sidecard__head a { font-size: .78rem; font-weight: 600; color: var(--sotsounds-forest); }

.sotsx-chart--mini { border: 0; }
.sotsx-chart--mini .sotsx-chart__row { padding: .4rem .1rem; }
.sotsx-chart--mini .sotsx-chart__play { width: 30px; height: 30px; }
.sotsx-chart--mini .sotsx-chart__title { font-size: .9rem; }
.sotsx-chart--compact { border: 0; margin: .5rem 0; }
.sotsx-chart--compact .sotsx-chart__row { padding: .35rem .1rem; border-color: rgba(0,0,0,.06); }

/* Featured artist card (real merchant content on the home) */
.sotsx-featured-card { display: grid; grid-template-columns: 1fr; background: linear-gradient(135deg, var(--sotsounds-forest-deep) 0%, var(--sotsounds-forest) 100%); border-radius: 16px; overflow: hidden; color: #fff; }
@media (min-width: 620px) { .sotsx-featured-card { grid-template-columns: 42% 1fr; } }
.sotsx-featured-card__art { position: relative; min-height: 200px; background-size: cover; background-position: center; background-color: rgba(0,0,0,.25); }
.sotsx-featured-card__badge { position: absolute; top: .8rem; left: .8rem; background: var(--sotsounds-sunset); color: #fff; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: .25rem .6rem; border-radius: 999px; }
.sotsx-featured-card__body { padding: 1.1rem 1.2rem 1.2rem; display: flex; flex-direction: column; }
.sotsx-featured-card__name { font-family: var(--sotsounds-serif); font-weight: 500; font-size: clamp(1.3rem, 3vw, 1.8rem); margin: 0; color: #fff; }
.sotsx-featured-card__tags { opacity: .85; font-size: .85rem; margin: .2rem 0 .5rem; }
.sotsx-featured-card .sotsx-chart { background: rgba(255,255,255,.06); border: 0; }
.sotsx-featured-card .sotsx-chart__row { border-color: rgba(255,255,255,.12); }
.sotsx-featured-card .sotsx-chart__title { color: #fff; }
.sotsx-featured-card .sotsx-btn--play { align-self: flex-start; margin-top: .3rem; }

/* Public playlists list */
.sotsx-pubpl { list-style: none; margin: 0; padding: 0; }
.sotsx-pubpl__row { border-bottom: 1px solid var(--sotsounds-line); }
.sotsx-pubpl__row:last-child { border-bottom: 0; }
.sotsx-pubpl__head { width: 100%; display: flex; align-items: center; gap: .6rem; background: none; border: 0; cursor: pointer; padding: .55rem .1rem; font: inherit; text-align: left; }
.sotsx-pubpl__ico { flex: none; width: 34px; height: 34px; border-radius: 8px; background: var(--sotsounds-forest-soft); color: var(--sotsounds-forest-deep); display: inline-flex; align-items: center; justify-content: center; }
.sotsx-pubpl__meta { display: flex; flex-direction: column; min-width: 0; }
.sotsx-pubpl__title { font-weight: 600; color: var(--sotsounds-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sotsx-pubpl__by { font-size: .76rem; color: var(--sotsounds-ink-3); }
.sotsx-pubpl__body { padding: 0 0 .4rem; }

/* Make-public toggle on My Music playlist cards */
.sotsx-plcard { position: relative; }
.sotsx-plcard__public { position: absolute; top: .7rem; right: 1rem; background: none; border: 1px solid var(--sotsounds-line); color: var(--sotsounds-ink-3); border-radius: 999px; padding: .2rem .7rem; font-size: .74rem; font-weight: 600; cursor: pointer; }
.sotsx-plcard__public.is-on { background: var(--sotsounds-forest); color: #fff; border-color: var(--sotsounds-forest); }

/* ── FAQ / Help ────────────────────────────────────────────────────── */
.sotsx-faq { max-width: 720px; margin: 1rem 0 1.5rem; }
.sotsx-faq__item { background: #fff; border: 1px solid var(--sotsounds-line); border-radius: 12px; margin-bottom: .55rem; overflow: hidden; }
.sotsx-faq__item > summary { cursor: pointer; list-style: none; padding: .85rem 1.1rem; font-weight: 600; color: var(--sotsounds-forest-deep); font-family: var(--sotsounds-serif); }
.sotsx-faq__item > summary::-webkit-details-marker { display: none; }
.sotsx-faq__item > summary::after { content: '＋'; float: right; color: var(--sotsounds-forest); font-weight: 400; }
.sotsx-faq__item[open] > summary::after { content: '−'; }
.sotsx-faq__a { padding: 0 1.1rem 1rem; color: var(--sotsounds-ink-2); font-size: .95rem; line-height: 1.6; }