:root {
  color-scheme: dark;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  background: #0a1113;
  color: #f2f7f6;
}
* { box-sizing: border-box; }
body { margin: 0; }
.page {
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: clamp(3rem, 9vw, 7rem);
  padding: clamp(1.5rem, 6vw, 5rem);
  background:
    radial-gradient(ellipse at 82% 30%, #174c45 0, transparent 52%),
    radial-gradient(ellipse at 6% 95%, #162a2a 0, transparent 48%),
    #0a1113;
}
.brand {
  margin: 0;
  display: flex;
  align-items: center;
  gap: .7rem;
  font-size: .94rem;
  font-weight: 800;
  letter-spacing: .22em;
}
.mark { width: 1.2rem; height: 1.2rem; border: 2px solid #8de7cb; border-radius: .32rem; transform: rotate(-12deg); }
section { align-self: center; max-width: 62rem; }
.badge {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 1.2rem;
  padding: .45rem .7rem;
  border: 1px solid #4c776d;
  border-radius: 100px;
  color: #b8f8e4;
  font-size: .8rem;
  font-weight: 650;
  letter-spacing: .06em;
}
.badge span { width: .4rem; height: .4rem; border-radius: 50%; background: #8de7cb; }
h1 { margin: 0; font-size: clamp(2.45rem, 8.2vw, 6.2rem); line-height: 1.03; letter-spacing: -.06em; }
h1 em { color: #a4efd6; font-style: normal; }
.description { max-width: 34rem; margin: 1.5rem 0 0; font-size: clamp(1rem, 2.2vw, 1.32rem); line-height: 1.65; color: #d2e3df; }
footer { font-size: .9rem; color: #a6beba; }
