:root{
  --brand-1:#7ac7b7; /* menthe */
  --brand-2:#f7c8d0; /* rose doux */
  --ink:#1f2937;
  --muted:#6b7280;
  --bg:#f7faf9;
  --card:#ffffff;
}

html, body { height: 100%; }
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  color: var(--ink);
  background: radial-gradient(1200px 600px at 10% 0%, rgba(122,199,183,.22), transparent 60%),
              radial-gradient(900px 500px at 90% 10%, rgba(247,200,208,.25), transparent 55%),
              var(--bg);
}

.navbar{
  backdrop-filter: blur(10px);
  background: rgba(255,255,255,.72) !important;
  border-bottom: 1px solid rgba(17,24,39,.06);
}

.brand-badge{
  width: 38px; height: 38px; border-radius: 12px;
  background: linear-gradient(135deg, var(--brand-1), var(--brand-2));
  box-shadow: 0 10px 25px rgba(16,24,40,.10);
}

.hero{
  padding-top: 5.5rem;
  padding-bottom: 3.5rem;
}

.hero-card{
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(17,24,39,.06);
  box-shadow: 0 18px 60px rgba(16,24,40,.10);
  border-radius: 24px;
}

.kicker{
  display:inline-flex;
  gap:.5rem;
  align-items:center;
  padding:.35rem .65rem;
  border-radius: 999px;
  border: 1px solid rgba(17,24,39,.08);
  background: rgba(255,255,255,.65);
  color: var(--muted);
  font-size: .9rem;
}

.gradient-text{
  background: linear-gradient(135deg, var(--brand-1), #3b82f6 45%, var(--brand-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.section{
  padding: 4rem 0;
}

.card-soft{
  border-radius: 20px;
  border: 1px solid rgba(17,24,39,.08);
  box-shadow: 0 12px 40px rgba(16,24,40,.06);
}

.icon-pill{
  width: 44px; height: 44px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(122,199,183,.20);
  border: 1px solid rgba(122,199,183,.30);
}

.btn-primary{
  border: none;
  background: linear-gradient(135deg, var(--brand-1), #3b82f6);
  box-shadow: 0 12px 30px rgba(59,130,246,.18);
}
.btn-primary:hover{ filter: brightness(0.98); }
.btn-outline-primary{
  border-color: rgba(59,130,246,.45);
}

.badge-price{
  background: rgba(247,200,208,.45);
  color: #7a2a3a;
  border: 1px solid rgba(122,42,58,.15);
  border-radius: 999px;
  padding: .35rem .65rem;
  font-weight: 600;
}

.footer{
  border-top: 1px solid rgba(17,24,39,.08);
  background: rgba(255,255,255,.6);
}

.small-muted{ color: var(--muted); }

.form-card{
  border-radius: 22px;
  border: 1px solid rgba(17,24,39,.08);
  background: rgba(255,255,255,.75);
  box-shadow: 0 18px 60px rgba(16,24,40,.10);
}

.pay-option{
  border: 1px solid rgba(17,24,39,.10);
  border-radius: 16px;
  background: rgba(255,255,255,.65);
  padding: 1rem;
  transition: transform .12s ease, box-shadow .12s ease;
}
.pay-option:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 40px rgba(16,24,40,.08);
}

hr.soft{ border-top: 1px solid rgba(17,24,39,.10); opacity: 1; }

.notice{
  border-left: 4px solid rgba(59,130,246,.45);
  background: rgba(59,130,246,.07);
  padding: .85rem 1rem;
  border-radius: 14px;
}