/* /start: "new to the show, start here" (the TikTok/Instagram/YouTube short-link target). Reuses
 * /listen's look (deco rules hold: no border-radius, gold is always a gradient) and its
 * .listen-where / .listen-btn classes for the "where to listen" row — see listen.css. This sheet
 * only adds the title/pitch block and the three starter-case buttons, which listen.css has no
 * equivalent for. Phone-first: most visitors arrive from a short-video app's in-app browser. */

.start {
  position: relative;
  overflow: hidden;
  max-width: 560px;
  margin: 0 auto;
  padding: 40px 16px 56px;
  text-align: center;
}
.start .rays { width: 1400px; height: 1400px; left: 50%; top: -420px; margin-left: -700px; z-index: 0; }
.start > :not(.rays) { position: relative; z-index: 1; }

.start-title {
  font: 400 clamp(40px, 11vw, 64px)/1.05 "Limelight", var(--serif);
  background: var(--grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin: 8px 0 12px;
}
.start-tag {
  font: italic 500 clamp(22px, 6vw, 30px)/1.25 var(--serif);
  color: var(--cream);
  margin: 0 0 18px;
}
.start-pitch {
  font: 400 17px/1.55 var(--serif);
  color: var(--text-muted);
  margin: 0 auto 28px;
  max-width: 30em;
}

.start-starters { display: flex; flex-direction: column; gap: 12px; margin-bottom: 8px; }
.start-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid rgba(201, 162, 74, .55);
  background: rgba(8, 7, 10, .78);
  text-decoration: none;
}
.start-btn:hover, .start-btn:focus-visible { border-color: var(--gold-bright); outline: none; }
.start-slot {
  font: 500 13px/1 var(--cond);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold-bright);
}
.start-case-title {
  font: 700 20px/1.2 var(--serif);
  color: var(--cream);
}
.start-minutes {
  font: italic 500 14px/1.2 var(--serif);
  color: var(--text-muted);
}

.start-browse-wrap { margin: 0 0 40px; }
.start-browse {
  font: 500 15px/1 var(--cond);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--nav);
  text-decoration: underline;
}
.start-browse:hover, .start-browse:focus-visible { color: var(--gold-bright); }

.start-where-h {
  font: 500 15px/1 var(--cond);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--nav);
  margin: 0 0 14px;
}
