:root {
  --night: #14283C;
  --night-deep: #1E3A52;
  --gold: #C9A84C;
  --gold-light: #E3C87F;
  --off-white: #FAF9F6;
  --whatsapp: #25D366;
  --whatsapp-dark: #1DA851;
  --font-title: "Fraunces", Georgia, serif;
  --font-body: "Nunito Sans", -apple-system, Segoe UI, sans-serif;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(120% 140% at 80% -10%, var(--night-deep) 0%, var(--night) 55%, #0e1e2c 100%);
  font-family: var(--font-body);
  color: var(--off-white);
}

.card {
  width: 100%;
  max-width: 390px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 32px;
  text-align: center;
}

.logo {
  width: 78px;
  height: auto;
  margin-bottom: 16px;
  filter: drop-shadow(0 6px 16px rgba(201, 168, 76, 0.4));
}

.avatar {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--gold);
  margin-bottom: 22px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}

h1 {
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 28px;
  color: var(--off-white);
  margin: 0 0 10px;
}

.subtitle {
  font-size: 12px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin: 0 0 42px;
}

.links {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  max-width: 300px;
}

.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 20px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
  transition: transform 0.15s ease, background 0.2s ease;
}
.btn:hover { transform: translateY(-1px); }

.btn-whatsapp {
  background: var(--whatsapp);
  color: #ffffff;
  box-shadow: 0 12px 26px rgba(37, 211, 102, 0.35);
}
.btn-whatsapp:hover { background: var(--whatsapp-dark); }

.btn-site {
  background: transparent;
  border: 1.5px solid var(--gold);
  color: var(--gold-light);
}
.btn-site:hover { background: rgba(201, 168, 76, 0.1); }