Portfolio photo avec galerie plein ecran et lightbox.
Les elements du hero (titre, sous-titre, boutons) apparaissent en cascade avec des delais croissants. Cela guide le regard du visiteur du haut vers le bas et cree un effet cinematographique.
animation: fadeUp 1s ease forwards + animation-delay Explorer Scroll & Parallax →Au survol, l'image zoome legerement et s'assombrit tandis qu'un overlay avec titre et categorie glisse depuis le bas. Invite l'utilisateur a explorer sans masquer la photo par defaut.
transform: scale(1.08) + filter: brightness(0.7) au :hover Explorer Hover & Interactions →L'image s'ouvre en plein ecran avec un scale de 0.9 a 1 et un fond qui apparait en fondu. Permet d'apprecier le detail des photos sans quitter la page.
opacity + transform: scale(0.9 → 1) transition 0.4s Explorer Galerie & Media →Au scroll, la barre de navigation passe de transparente a un fond flou semi-opaque. Garde la nav lisible sur n'importe quel contenu sans masquer la photo en arriere-plan.
backdrop-filter: blur(20px) + background: rgba() Explorer Glass & Morphism →Les cartes s'elevent au survol avec une barre doree qui se deploie en haut. Double feedback visuel : l'elevation confirme l'interactivite, la barre identifie la section active.
transform: translateY(-10px) + ::before scaleX(0 → 1) Explorer Hover & Interactions →La grille CSS a 3 colonnes avec certaines images en span 2 rangees cree un layout dynamique inspire des magazines photo. S'adapte automatiquement au mobile.
grid-template-columns: repeat(3, 1fr) + grid-row: span 2 Explorer Cartes & Layouts →