/* === GLOBAL === */
body {
  font-family: 'Roboto', sans-serif;
  line-height: 1.6;
  background-color: #fff;
  color: #333;
}

h1, h2, h3, h4, h5 {
  font-weight: 700;
  color: #222;
}

p {
  margin-bottom: 1rem;
}

/* === NAVBAR === */
.navbar {
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.navbar-brand {
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.navbar-nav .nav-link {
  font-weight: 500;
  transition: color 0.3s ease;
}

.navbar-nav .nav-link:hover {
  color: #ffc107 !important;
}

/* === HERO === */
header {
  background: linear-gradient(135deg, #EAE2B7, #fff);
  padding: 3rem 1rem;
}

header h1 {
  font-size: 3rem;
}

header img {
  max-width: 280px;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.2));
}

header .btn {
  transition: all 0.3s ease;
}

header .btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

/* === SECTIONS === */
section {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

section h2 {
  margin-bottom: 1.5rem;
  color: #E85D04;
}

.badge {
  font-size: 0.9rem;
  padding: 0.5em 0.8em;
  border-radius: 0.5rem;
}

/* === CARDS === */
.card {
  border-radius: 1rem;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

.card-title {
  font-weight: 600;
}

/* === FORMULAIRE === */
form input, form textarea {
  border-radius: 0.5rem;
  border: 1px solid #ccc;
  transition: border 0.3s ease, box-shadow 0.3s ease;
}

form input:focus, form textarea:focus {
  border-color: #E85D04;
  box-shadow: 0 0 0 0.25rem rgba(232,93,4,0.25);
}

/* === BUTTONS === */
.btn-warning {
  font-weight: 600;
  border-radius: 0.5rem;
  border: none;
}

.btn-warning:hover {
  background-color: #d96a00;
  color: #fff;
}

/* === FOOTER === */
footer {
  background: #222;
  color: #eee;
  font-size: 0.9rem;
}

footer h3 {
  color: #fff;
}

footer a {
  color: #eee;
  text-decoration: none;
}

footer i {
  transition: color 0.3s ease;
}

/* Couleurs officielles au survol */
footer a:hover .fa-facebook {
  color: #1877F2; /* Bleu Facebook */
}

footer a:hover .fa-linkedin {
  color: #0A66C2; /* Bleu LinkedIn */
}

footer a:hover .fa-youtube {
  color: #FF0000; /* Rouge YouTube */
}