.hero--page { padding-bottom: clamp(40px, 6vw, 72px); }
.hero--page .fine { margin-top: 16px; font-size: 15px; color: var(--text-3); }
.hero--page .fine a { color: #ff7300; text-underline-offset: 3px; }

.press { padding-bottom: 120px; display: grid; gap: 72px; }

.kits { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.kit {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 32px; border-radius: 28px; min-height: 320px;
  color: var(--text); text-decoration: none;
  background-repeat: no-repeat; background-origin: border-box;
  transition: transform .2s ease-out, border-color .2s;
}
.kit-icon { width: 88px; height: 88px; margin: -8px 0 20px -8px; }
.kit h2 { font-family: var(--display); font-weight: normal; font-size: 44px; line-height: 1; }
.kit-sub { margin-top: 10px; font-size: 17px; }
.kit-link, .kit-soon { margin-top: auto; padding-top: 32px; font-weight: 700; font-size: 17px; }

.kit--hermes {
  background:
    radial-gradient(60% 80% at 100% 0%, rgba(91, 51, 240, 0.55), transparent 70%),
    radial-gradient(50% 70% at 0% 100%, rgba(76, 141, 255, 0.35), transparent 70%),
    #13112a;
  border: 1px solid rgba(140, 150, 255, 0.18);
}
.kit--hermes h2 { font-family: "Inter Tight", Inter, sans-serif; font-weight: 800; letter-spacing: -0.035em; }
.kit--hermes .kit-sub, .kit--hermes .kit-link { color: #949eff; }
.kit--hermes:hover { transform: translateY(-3px); border-color: rgba(148, 158, 255, 0.45); }

.kit--mnemos {
  background:
    radial-gradient(70% 60% at 75% 0%, rgba(232, 104, 74, 0.95), transparent 70%),
    linear-gradient(180deg, #c9573c 0%, #6a2a37 40%, #050a28 80%);
  background-color: #050a28;
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.kit--mnemos h2 { color: #f9d2ad; }
.kit--mnemos .kit-sub { color: rgba(255, 220, 200, 0.75); }
.kit-soon { color: var(--text-3); }
/* The background shorthands above reset these, so restate them: no tile repeats into the edges */
.kit--hermes, .kit--mnemos { background-repeat: no-repeat; background-origin: border-box; }

.about { max-width: 720px; }
.about h2 { font-family: "Prospectus Bold", Georgia, serif; font-weight: normal; font-size: clamp(28px, 4vw, 36px); line-height: 1.15; margin-bottom: 16px; }
.about p { font-size: 18px; line-height: 1.6; }
.about .fine { color: var(--text-3); font-size: 15px; margin-top: 14px; }
.about a { color: #ff7300; text-underline-offset: 3px; }