/* ============================================================
   ANIMATIONS & EXPAND/COLLAPSE SYSTEM - CASTAGNE
   ============================================================ */

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* === EXPAND/COLLAPSE SYSTEM === */
/* Hover effect sur les sections - SANS background, juste le bouton */
.section-block {
  position: relative;
  cursor: pointer;
}

.read-more-btn {
  opacity: 0;
  transition: opacity 0.2s ease;
  cursor: pointer;
  z-index: var(--z-read-more);
}

.section-block:hover .read-more-btn {
  opacity: 1;
}

/* Sur mobile: masquer boutons individuels, utiliser bouton global */
@media (max-width: 1023px) {
  .read-more-btn {
    display: none !important; /* Masquer tous les boutons individuels */
  }
  
  .section-block {
    cursor: default;
  }
  
  .section-content {
    padding-right: 0 !important;
  }
}

/* Supprimer TOUS les effets hover après expansion */
.section-block.expanded {
  cursor: default;
  pointer-events: none;
}

.section-block.expanded:hover {
  background-color: transparent !important;
}

/* Éviter la contraction en hauteur pendant l'expand */
.section-content {
  min-height: fit-content;
  transition: min-height 0.3s ease;
}

/* Curseur de typing animation */
@keyframes blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}

.typing-cursor {
  border-right: 2px solid #000;
  animation: blink 0.7s infinite;
}

@keyframes slideUp {
  from { 
    opacity: 0; 
    transform: translateY(30px); 
  }
  to { 
    opacity: 1; 
    transform: translateY(0); 
  }
}

@keyframes skeleton-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
}

/* Skeleton loading styles */
.skeleton-loading {
  animation: fadeIn 0.3s ease-in-out;
}

.skeleton-box {
  --skeleton-color-light: #f0f0f0;
  --skeleton-color-dark: #e0e0e0;
  background: linear-gradient(
    90deg,
    var(--skeleton-color-light) 0%,
    var(--skeleton-color-dark) 50%,
    var(--skeleton-color-light) 100%
  );
  background-size: 200% 100%;
  animation: skeleton-pulse 1.5s ease-in-out infinite;
  transition: --skeleton-color-light 0.6s ease-in-out, --skeleton-color-dark 0.6s ease-in-out;
}

/* Skeleton avec thème appliqué */
.skeleton-box.themed {
  transition: background 0.6s ease-in-out;
}

/* Fonts moved to theme-base.css */