/* Compléments au CSS compilé (site.css) : boutons, champs de formulaire,
   section Tarifs et classes utilitaires absentes du build d'origine. */

/* ---------- Boutons (équivalent du composant Button) ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  white-space: nowrap;
  border-radius: .5rem;
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.25rem;
  height: 2.5rem;
  padding: .5rem 1.25rem;
  border: 0;
  cursor: pointer;
  font-family: Inter, sans-serif;
  transition: color .2s, background-color .2s, border-color .2s, box-shadow .2s, transform .2s;
}
.btn:focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 2px; }
.btn:disabled { pointer-events: none; opacity: .5; }
.btn-sm { height: 2.25rem; padding-left: 1rem; padding-right: 1rem; }
.btn-lg { height: 3rem; padding-left: 2rem; padding-right: 2rem; font-size: 1rem; }

.btn-hero {
  background-color: #fffffff2;
  color: hsl(var(--foreground));
  box-shadow: var(--shadow-lg);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.btn-hero:hover { background-color: #fff; box-shadow: var(--shadow-xl); }

.btn-cta {
  background-image: linear-gradient(to right, hsl(var(--accent)), hsl(12, 90%, 58%));
  color: hsl(var(--accent-foreground));
  box-shadow: var(--shadow-lg);
}
.btn-cta:hover {
  background-image: linear-gradient(to right, hsl(var(--orange-solar-hover)), hsl(12, 85%, 52%));
  box-shadow: var(--shadow-xl);
  transform: scale(1.02);
}
.btn-cta:active { transform: scale(.98); }

/* ---------- Champs de formulaire (équivalent Input / Textarea) ---------- */
.form-input,
.form-textarea {
  display: flex;
  width: 100%;
  border: 1px solid hsl(var(--input));
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  padding: .5rem .75rem;
  font-size: 1rem;
  font-family: inherit;
  line-height: 1.5rem;
}
.form-input { height: 2.5rem; }
.form-textarea { min-height: 80px; font-size: .875rem; }
.form-input::placeholder,
.form-textarea::placeholder { color: hsl(var(--muted-foreground)); }
.form-input:focus-visible,
.form-textarea:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring));
}
@media (min-width: 768px) { .form-input { font-size: .875rem; } }

/* ---------- Section Tarifs ---------- */
.tranche-active {
  border: 2px solid hsl(var(--accent) / .6);
  box-shadow: 0 8px 40px hsl(var(--accent) / .18);
}
.tranche-badge {
  display: inline-block;
  padding: .3rem .8rem;
  border-radius: 9999px;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: hsl(var(--accent-foreground));
  background-image: linear-gradient(to right, hsl(var(--accent)), hsl(12, 90%, 58%));
}
.tranche-badge-muted {
  color: hsl(var(--muted-foreground));
  background-image: none;
  background-color: hsl(var(--primary) / .08);
}

/* ---------- Utilitaires absents du build d'origine ---------- */
.divide-primary\/10 > :not([hidden]) ~ :not([hidden]) { border-color: hsl(var(--primary) / .1); }
.text-destructive { color: hsl(var(--destructive)); }
.lg\:col-span-3 { }
.lg\:col-span-2 { }
@media (min-width: 1024px) {
  .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .lg\:col-span-3 { grid-column: span 3 / span 3; }
  .lg\:col-span-2 { grid-column: span 2 / span 2; }
  .lg\:h-\[440px\] { height: 440px; }
}
@media (min-width: 768px) {
  .md\:h-\[380px\] { height: 380px; }
}
.h-\[280px\] { height: 280px; }
.bg-white\/20 { background-color: #fff3; }
.mt-14 { margin-top: 3.5rem; }
.mt-8 { margin-top: 2rem; }
.mt-10 { margin-top: 2.5rem; }
.divide-y > :not([hidden]) ~ :not([hidden]) { border-top-width: 1px; border-bottom-width: 0; border-style: solid; }