/* Styles spécifiques à presentationisabelle.html (page « en préparation »).
   À remplacer par la structure de presentationeric.html une fois le contenu prêt. */
body {
  padding-top: var(--header-height);
}

.hero-profil {
  padding: 80px 20px 60px;
  text-align: center;
  color: #fff;
  border-bottom: 4px solid var(--color-primary);
  background: linear-gradient(135deg, rgba(18, 62, 117, 0.97) 0%, rgba(30, 90, 168, 0.95) 100%);
  background-color: #164a8a; /* couleur de secours (sous le dégradé) */
}

.hero-profil h1 {
  font-size: 3.5rem;
  color: #fff;
  margin-bottom: 10px;
}

.hero-profil .profile-role {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.breadcrumb {
  padding: 15px 0 30px;
  font-size: 0.9rem;
  color: var(--color-text-muted);
}

.breadcrumb a {
  color: var(--color-secondary);
}

.breadcrumb a:hover {
  color: var(--color-text);
}

.breadcrumb span {
  color: var(--color-text);
  font-weight: 600;
}

.wip-section {
  padding: 40px 0 90px;
  background: var(--color-bg-alt);
}

.wip-card {
  max-width: 760px;
  margin: 0 auto;
  padding: 40px 30px 50px;
  text-align: center;
  background: #fff;
  border: 1px solid var(--color-border);
  border-top: 4px solid var(--color-primary);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-md);
}

.wip-illu {
  display: block;
  width: 100%;
  max-width: 440px;
  height: auto;
  margin: 0 auto 20px;
}

.wip-card h2 {
  font-size: 2.6rem;
  color: var(--color-secondary);
  margin-bottom: 14px;
}

.wip-card p {
  max-width: 520px;
  margin: 0 auto;
  font-size: 1.1rem;
  color: var(--color-text-muted);
}

.wip-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 32px;
}

/* Le marteau tape doucement (désactivé si l'utilisateur réduit les animations,
   voir la règle prefers-reduced-motion de style.css) */
.wip-hammer {
  transform-origin: 292px 170px;
  animation: wip-tap 1.4s ease-in-out infinite;
}

@keyframes wip-tap {
  0%, 100% { transform: rotate(-6deg); }
  50%      { transform: rotate(14deg); }
}

@media (max-width: 768px) {
  .hero-profil h1 { font-size: 2.4rem; }
  .wip-card h2 { font-size: 2rem; }
}
