.app-shell {
  width: min(920px, 92vw);
  margin: 2rem auto;
  display: grid;
  gap: 1rem;
}

.hero {
  background: linear-gradient(140deg, #0b3557, #0f4a78);
  color: #fff;
  border-radius: 1rem;
  padding: 1.5rem;
}

.eyebrow {
  margin: 0;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.85;
}

.hero h1,
.hero p,
.card h2,
.card p {
  margin: 0;
}

.subtitle {
  margin-top: 0.6rem;
}

.card {
  background: #fff;
  border-radius: 0.8rem;
  padding: 1.2rem;
  box-shadow: 0 6px 20px rgb(28 39 51 / 8%);
  display: grid;
  gap: 0.7rem;
}

.button {
  border: 0;
  border-radius: 0.6rem;
  padding: 0.7rem 1rem;
  color: #fff;
  background: linear-gradient(120deg, #1ea3c6, #127bb7);
  width: fit-content;
}

.muted {
  color: #536174;
  font-size: 0.95rem;
}