/* ====== Vahia – Bienestar 5D ====== */
:root{
  --violet-700:#6B2E9B; --violet-500:#8E44AD; --violet-200:#E9D7F7;
  --teal-500:#0EA5A4; --ink-900:#23222B; --ink-600:#4A4A57; --canvas:#F7F5FA;
  --radius-2xl: 22px; --shadow-1: 0 10px 28px rgba(23,16,41,.12);
}
*{box-sizing:border-box}
html,body{background:var(--canvas); color:var(--ink-900);}
body{font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; line-height:1.55;}
.h1, h1, .h2, h2, .h3, h3{font-family: Poppins, Inter, sans-serif; letter-spacing:-.02em}

.hero{
  background: radial-gradient(1200px 600px at 10% -10%, var(--violet-200) 0, transparent 40%),
              linear-gradient(180deg, #ffffff 0%, var(--canvas) 100%);
  border-radius: var(--radius-2xl);
  padding: 36px 28px;
  box-shadow: var(--shadow-1);
}
.badge{
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--violet-200); color:var(--violet-700);
  padding:.35rem .7rem; border-radius:999px; font-weight:600; font-size:.85rem;
}

.day-card{
  border:0; border-radius: var(--radius-2xl);
  box-shadow: var(--shadow-1);
  background:#fff; transition: transform .18s ease, box-shadow .18s ease;
  height:100%;
}
.day-card:hover{ transform: translateY(-2px); box-shadow: 0 14px 34px rgba(23,16,41,.16); }
.day-card .title{ font-weight:800; color:var(--violet-700); }
.day-card .cta{
  background:var(--teal-500); color:#fff; border-radius:999px; padding:.45rem .85rem;
  font-weight:700; font-size:.9rem; display:inline-flex; align-items:center; gap:.4rem;
}

.btn-brand{
  background: linear-gradient(90deg, var(--violet-700), var(--violet-500));
  border:0; color:#fff; font-weight:700; border-radius:999px; padding:.7rem 1.1rem;
  box-shadow: 0 8px 18px rgba(107,46,155,.28);
}
.btn-brand:hover{ filter:brightness(1.05); }

.form-card{
  border:0; border-radius: var(--radius-2xl); box-shadow: var(--shadow-1); background:#fff;
}
.form-label{ font-weight:700; color:var(--ink-900); }
.section-hint{ color:var(--ink-600); font-size:.92rem; }

.check-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap:.35rem .9rem; }
.check-grid label{ display:flex; align-items:center; gap:.55rem; padding:.35rem .4rem; border-radius:12px; }
.check-grid input[type="checkbox"]{ width:18px; height:18px; accent-color: var(--violet-700); }

input[type="number"], input[type="date"]{ border-radius:14px !important; }
.footer{ color:var(--ink-600); font-size:.9rem }
