* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #2a1b22;
  background: #faf5f7;
  display: flex; flex-direction: column; min-height: 100vh;
}
.top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 32px; border-bottom: 1px solid #f0e0e5; background: #fff;
}
.brand {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none; color: inherit;
  font-weight: 600; font-size: 17px;
}
.logo { width: 28px; height: 28px; }
.top nav { display: flex; gap: 22px; align-items: center; }
.top nav a { text-decoration: none; color: #5a4b52; font-size: 14px; }
.top nav a:hover { color: #e94f7c; }
.btn {
  background: #e94f7c; color: #fff !important;
  padding: 8px 16px; border-radius: 6px; font-weight: 500;
}
.btn:hover { background: #d33d6a; }
main { flex: 1; padding: 60px 32px; text-align: center; }
.hero h1 { font-size: 36px; font-weight: 600; margin: 0 0 20px; color: #2a1b22; }
.hero p { font-size: 16px; color: #6b5a62; margin: 0 0 32px; line-height: 1.6; }
.cta {
  display: inline-block; background: #e94f7c; color: #fff;
  text-decoration: none; padding: 12px 28px; border-radius: 8px;
  font-weight: 500; font-size: 15px;
}
.cta:hover { background: #d33d6a; }
footer {
  padding: 24px 32px; text-align: center;
  color: #8b7a82; font-size: 13px;
  border-top: 1px solid #f0e0e5; background: #fff;
}
footer p { margin: 4px 0; }
