/* Variables */
:root {
  --navy: #1a4a8e;
  --orange: #ff5a00;
}

/* Header */
.about-header {
  background:
    linear-gradient(rgba(26, 74, 142, 0.85), rgba(26, 74, 142, 0.85)),
    url("../img/about-banner.jpg") no-repeat center center/cover;
  height: 350px;
}

/* Badge Expérience */
.experience-badge {
  position: absolute;
  bottom: -20px;
  right: -20px;
  background: var(--orange);
  color: white;
  padding: 20px;
  border-radius: 15px;
  text-align: center;
  box-shadow: 0 10px 20px rgba(255, 90, 0, 0.3);
  z-index: 2;
}

/* Valeurs */
.underline {
  width: 60px;
  height: 4px;
  background: var(--orange);
  margin-top: 15px;
  border-radius: 2px;
}

.valeur-icon {
  font-size: 2.5rem;
  color: var(--orange);
}

.card {
  transition: transform 0.3s ease;
}

.card:hover {
  transform: translateY(-5px);
}

/* Responsivité */
@media (max-width: 768px) {
  .experience-badge {
    position: static;
    margin-top: 20px;
  }
}