:root {
  --ss-bg: #020202;
  --ss-bg-soft: #070707;
  --ss-panel: #0b0b0c;
  --ss-panel-2: #111114;
  --ss-gold: #c99735;
  --ss-gold-light: #e6be67;
  --ss-text: #f4f4f4;
  --ss-soft: #d2d2d2;
  --ss-muted: #a7a7a7;
  --ss-line: rgba(201,151,53,.35);
  --ss-line-strong: rgba(201,151,53,.75);
  --ss-radius: 18px;
  --ss-shadow: 0 24px 80px rgba(0,0,0,.55);
}

.ss-card-shell {
  border: 1px solid var(--ss-line);
  border-radius: var(--ss-radius);
  background:
    radial-gradient(circle at 80% 0%, rgba(201,151,53,.12), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  box-shadow: var(--ss-shadow);
}

.ss-brand-lockup {
  display: flex;
  align-items: center;
  gap: 14px;
}

.ss-brand-lockup img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  flex: 0 0 auto;
}

.ss-brand-name {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 34px;
  line-height: 1;
  letter-spacing: .03em;
  color: var(--ss-text);
  text-transform: uppercase;
}

.ss-brand-name span {
  color: var(--ss-gold-light);
}

.ss-brand-tagline {
  margin-top: 6px;
  color: var(--ss-gold-light);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
}

.ss-kicker {
  color: var(--ss-gold-light);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.ss-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--ss-line-strong), transparent);
}

.ss-button {
  border: 1px solid rgba(201,151,53,.55);
  background: linear-gradient(180deg, #e1bc60, #9d681d);
  color: #050505;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
