:root {
  --teal: #124d5c;
  --coral: #dd7256;
  --bg: #fbf8f4;
  --text: #2b3a40;
}
* { box-sizing: border-box; margin: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--text);
  background:
    radial-gradient(60rem 30rem at 50% -10%, rgba(221,114,86,.12), transparent 70%),
    radial-gradient(50rem 30rem at 50% 110%, rgba(18,77,92,.10), transparent 70%),
    var(--bg);
}
.hero {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2.5rem 1rem 1rem;
}
.logo { width: min(340px, 72vw); height: auto; }
.tagline {
  margin-top: -1.2rem;
  font-size: clamp(1.2rem, 3.2vw, 1.7rem);
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--teal);
}
.badge {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin-top: 2rem;
  padding: .55rem 1.1rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(18,77,92,.15);
  color: var(--teal);
  font-weight: 600;
  font-size: .95rem;
  box-shadow: 0 2px 10px rgba(18,77,92,.08);
}
.dot {
  width: .6rem; height: .6rem; border-radius: 50%;
  background: var(--coral);
  animation: pulse 1.8s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(221,114,86,.55); }
  50% { box-shadow: 0 0 0 .5rem rgba(221,114,86,0); }
}
.lead {
  max-width: 34rem;
  margin-top: 1.4rem;
  font-size: 1.05rem;
  line-height: 1.65;
}
.chips {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem;
  list-style: none; padding: 0; margin-top: 1.6rem;
}
.chips li {
  padding: .35rem .9rem;
  border-radius: 999px;
  background: rgba(18,77,92,.08);
  color: var(--teal);
  font-size: .9rem;
}
.chips li:last-child { background: rgba(221,114,86,.14); color: #a8452b; }
footer {
  padding: 1.5rem 1rem;
  text-align: center;
  font-size: .85rem;
  color: #6b7a80;
}
@media (prefers-reduced-motion: reduce) { .dot { animation: none; } }