/**
 * WDHC kit pages · prize-rules, sponsor-kit, press/share kit shared chrome
 * Load after tokens + secondary + cinematic hero.
 */
.kit-page {
  background: #050505;
  color: #f2f2f2;
  font-family: var(--wdhc-font-body, 'Source Sans 3', system-ui, sans-serif);
  line-height: 1.65;
  margin: 0;
}

.kit-main {
  max-width: 880px;
  margin: 0 auto;
  padding: 8px 20px 88px;
}

.kit-card {
  background:
    radial-gradient(ellipse 120% 80% at 0% 0%, rgba(212, 175, 55, 0.07) 0%, transparent 55%),
    linear-gradient(165deg, #0f0f0f 0%, #0a0a0a 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: clamp(22px, 4vw, 32px);
  margin-bottom: 18px;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
}

.kit-card h2 {
  font-family: var(--wdhc-font-head, 'Oswald', sans-serif);
  color: var(--wdhc-gold, #d4af37);
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-size: 1.12rem;
  font-weight: 700;
  margin: 0 0 12px;
}

.kit-card h2 + h2,
.kit-card h2:not(:first-child) {
  margin-top: 26px;
}

.kit-card p,
.kit-card li {
  color: #c8c8c8;
  margin: 0 0 10px;
  font-size: 1.02rem;
}

.kit-card ul {
  margin: 0 0 8px;
  padding-left: 1.2rem;
}

.kit-card strong {
  color: #fff;
}

.kit-card a {
  color: var(--wdhc-gold, #d4af37);
  text-decoration: none;
  border-bottom: 1px solid rgba(212, 175, 55, 0.35);
}

.kit-card a:hover {
  border-bottom-color: #d4af37;
}

.kit-notice {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.12), rgba(205, 127, 50, 0.06));
  border: 1px solid rgba(212, 175, 55, 0.32);
  border-radius: 12px;
  padding: 14px 16px;
  margin: 0 0 20px;
  color: #e8e8e8;
}

.kit-notice strong {
  color: #d4af37;
}

.kit-tiers {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

@media (min-width: 760px) {
  .kit-tiers {
    grid-template-columns: repeat(3, 1fr);
  }
}

.kit-tier {
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  padding: 18px 16px;
  background: linear-gradient(180deg, #121212 0%, #0c0c0c 100%);
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.kit-tier--featured {
  border-color: rgba(212, 175, 55, 0.55);
  box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.15), 0 16px 40px rgba(0, 0, 0, 0.35);
}

.kit-tier__badge {
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 0.65rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #0a0a0a;
  background: linear-gradient(90deg, #d4af37, #cd7f32);
  padding: 4px 8px;
  border-radius: 999px;
  font-weight: 700;
}

.kit-tier h3 {
  margin: 0 0 8px;
  font-family: var(--wdhc-font-head, 'Oswald', sans-serif);
  color: #d4af37;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 1rem;
}

.kit-tier__price {
  font-family: var(--wdhc-font-ui, 'Rajdhani', sans-serif);
  font-size: 1.55rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 12px;
  letter-spacing: 0.02em;
}

.kit-tier ul {
  margin: 0;
  padding-left: 1.1rem;
  flex: 1;
}

.kit-tier li {
  font-size: 0.95rem;
  margin-bottom: 8px;
  color: #c0c0c0;
}

.kit-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

.kit-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 18px;
  border-radius: 10px;
  font-weight: 700;
  text-decoration: none !important;
  border: none;
  font-family: var(--wdhc-font-ui, 'Rajdhani', sans-serif);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.kit-cta--gold {
  background: linear-gradient(180deg, #d4af37, #a88b2a);
  color: #111 !important;
  border-bottom: none !important;
}

.kit-cta--ghost {
  border: 1px solid rgba(212, 175, 55, 0.45) !important;
  color: #d4af37 !important;
  background: transparent;
}

.kit-meta {
  color: #888;
  font-size: 0.85rem;
  margin-top: 8px;
}

.kit-list-check {
  list-style: none;
  padding-left: 0;
}

.kit-list-check li {
  position: relative;
  padding-left: 1.4rem;
}

.kit-list-check li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: #d4af37;
  box-shadow: 0 0 8px rgba(212, 175, 55, 0.45);
}
