/* Tokens uit je landing */
.container-nice { max-width: 1120px; }
.shadow-soft { box-shadow: 0 10px 30px rgba(2, 132, 199, .12); }

/* Radial achtergrond voor hero/dash headers */
.radial {
  background:
    radial-gradient(60rem 60rem at 10% -10%, rgba(14,165,233,.18), transparent 55%),
    radial-gradient(60rem 60rem at 90% -20%, rgba(99,102,241,.12), transparent 55%);
}

/* Subtiele float animatie zoals op de landing */
@media (prefers-reduced-motion:no-preference) {
  @keyframes float { 0%{transform:translateY(0)} 50%{transform:translateY(-6px)} 100%{transform:translateY(0)} }
  .float { animation: float 6s ease-in-out infinite; }

  /* Global reset used across multiple pages */
  * { margin: 0; padding: 0; box-sizing: border-box; }

  /* Common components shared by multiple pages */
  .logo { font-size: 1.8rem; font-weight: 700; color: #667eea; text-decoration: none; }
  .btn { background: #6d5ef1; color: white; border: none; padding: 0.5rem 1rem; border-radius: 8px; cursor: pointer; font-weight: 500; text-decoration: none; display: inline-block; transition: all 0.3s; }
  .btn:hover { background: #5a46e6; transform: translateY(-1px); }
  .btn-danger { background: #dc3545; }
  .btn-danger:hover { background: #c82333; }
  .container { max-width: 1200px; margin: 0 auto; padding: 2rem; }
  .card { background: #ffffff; border: 1px solid #e5e7eb; border-radius: 16px; padding: 2rem; box-shadow: 0 8px 24px rgba(2,6,23,0.06); }
  .plan-name { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem; }
  .plan-price { font-size: 3rem; font-weight: 800; color: #6d5ef1; margin-bottom: 0.5rem; }
  .shadow-soft { box-shadow: 0 10px 30px rgba(2,132,199,.12); }
}
