/* =========================================================
   Desafio Bumbum Invejado — Design System
   Paleta feminina fitness premium (dark + rosa/magenta)
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

:root{
  --bg:        #140d18;
  --bg-2:      #1d1322;
  --surface:   #241a2c;
  --surface-2: #2e2238;
  --line:      rgba(255,255,255,.08);
  --line-strong: rgba(255,255,255,.14);
  --text:      #f6eef9;
  --muted:     #b9a6c6;
  --pink:      #ff2e93;
  --pink-2:    #ff7eb3;
  --peach:     #ffb38a;
  --green:     #2ecc71;
  --grad:      linear-gradient(135deg,#ff2e93 0%,#ff7eb3 100%);
  --grad-cta:  linear-gradient(135deg,#ff2e93 0%,#ff9a5a 100%);
  --radius:    18px;
  --radius-sm: 12px;
  --shadow:    0 12px 34px rgba(0,0,0,.45);
  --shadow-pink: 0 10px 28px rgba(255,46,147,.35);
}

*{ margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }

body{
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(255,46,147,.14), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(255,179,138,.10), transparent 60%),
    var(--bg);
  color:var(--text);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}

::-webkit-scrollbar{ width:9px; height:9px; }
::-webkit-scrollbar-thumb{ background:var(--surface-2); border-radius:20px; }
::-webkit-scrollbar-track{ background:transparent; }

/* ---------- Tipografia utilitária ---------- */
.gradient-text{
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* ---------- Botões ---------- */
.btn{
  font-family:inherit;
  font-weight:700;
  border:none;
  border-radius:50px;
  padding:14px 26px;
  cursor:pointer;
  font-size:15px;
  color:#fff;
  background:var(--grad);
  box-shadow:var(--shadow-pink);
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); opacity:.92; }
.btn-cta{ background:var(--grad-cta); }
.btn-ghost{
  background:transparent;
  border:1px solid var(--line-strong);
  box-shadow:none;
  color:var(--text);
}

/* ---------- Inputs ---------- */
.field{
  width:100%;
  padding:14px 16px;
  border-radius:var(--radius-sm);
  border:1px solid var(--line-strong);
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-size:16px;
  font-family:inherit;
  outline:none;
  transition:border-color .18s ease, background .18s ease;
}
.field::placeholder{ color:var(--muted); }
.field:focus{ border-color:var(--pink); background:rgba(255,46,147,.06); }

/* ---------- Reveal animação ---------- */
@keyframes rise{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:none;} }
.rise{ animation:rise .5s ease both; }
