ME CONTACTER
/* Animation autonome — aucun JavaScript ni dépendance externe */ .anim-femme { transform-box: fill-box; transform-origin: 48% 100%; animation: womanBalance 9.5s cubic-bezier(.45,0,.55,1) infinite; will-change: transform; } .anim-hair { transform-box: fill-box; transform-origin: 52% 8%; animation: hairWave 5.8s ease-in-out infinite; will-change: transform; } .anim-chat { transform-box: fill-box; transform-origin: 50% 72%; animation: catStretch 6.2s ease-in-out infinite; will-change: transform; } .anim-fish { will-change: transform; } .fish-1 { animation: fishFloat1 6.8s ease-in-out infinite; } .fish-3 { animation: fishFloat2 7.6s ease-in-out -1.9s infinite; } .fish-2 { animation: fishFloat3 6.4s ease-in-out -3.1s infinite; } .fish-4 { animation: fishFloat4 7.2s ease-in-out -4.2s infinite; } .anim-star { transform-box: fill-box; transform-origin: center; will-change: transform; } .star-1 { animation: starSpin 11s linear infinite; } .star-2 { animation: starSpin 13s linear -3s infinite reverse; } .star-3 { animation: starSpin 10s linear -1.5s infinite; } .star-4 { animation: starSpin 14s linear -5s infinite reverse; } .star-5 { animation: starSpin 12s linear -2s infinite; } .star-6 { animation: starSpin 15s linear -7s infinite reverse; } .star-7 { animation: starSpin 11.5s linear -4s infinite; } .star-8 { animation: starSpin 13.5s linear -6s infinite reverse; } .star-9 { animation: starSpin 12.5s linear -1s infinite; } .star-10 { animation: starSpin 14.5s linear -8s infinite reverse; } .star-11 { animation: starSpin 10.5s linear -2.5s infinite; } .star-12 { animation: starSpin 16s linear -9s infinite reverse; } .star-13 { animation: starSpin 12s linear -5.5s infinite; } .star-14 { animation: starSpin 13s linear -10s infinite reverse; } .star-15 { animation: starSpin 11s linear -7.5s infinite; } .star-16 { animation: starSpin 15.5s linear -11s infinite reverse; } .anim-leaf { transform-box: fill-box; transform-origin: center; will-change: transform; } .leaf-1 { animation: leafSway 7.5s ease-in-out infinite; } .leaf-2 { animation: leafSway 8.2s ease-in-out -2.2s infinite reverse; } .leaf-3 { animation: leafSway 7.8s ease-in-out -4.1s infinite; } .leaf-4 { animation: leafSway 8.6s ease-in-out -1.1s infinite reverse; } .leaf-5 { animation: leafSway 7.2s ease-in-out -3.6s infinite; } .leaf-6 { animation: leafSway 8.8s ease-in-out -5.3s infinite reverse; } .leaf-7 { animation: leafSway 7.9s ease-in-out -6.2s infinite; } @keyframes womanBalance { 0%,100% { transform: rotate(-1.15deg) translateY(0); } 18% { transform: rotate(-0.65deg) translateY(-1px); } 36% { transform: rotate(0.45deg) translateY(-3px); } 50% { transform: rotate(1.15deg) translateY(-4px); } 64% { transform: rotate(0.55deg) translateY(-2px); } 82% { transform: rotate(-0.55deg) translateY(-1px); } } @keyframes hairWave { 0%,100% { transform: rotate(-1.8deg) translate(0,0); } 20% { transform: rotate(1.5deg) translate(3px,1px); } 40% { transform: rotate(3.2deg) translate(5px,0); } 60% { transform: rotate(0.5deg) translate(2px,-1px); } 80% { transform: rotate(-3deg) translate(-3px,1px); } } @keyframes catStretch { 0%,100% { transform: translateX(0) scaleX(1) scaleY(1); } 20% { transform: translateX(-3px) scaleX(1.015) scaleY(.995); } 45% { transform: translateX(-8px) scaleX(1.055) scaleY(.985); } 58% { transform: translateX(-10px) scaleX(1.075) scaleY(.98); } 72% { transform: translateX(-5px) scaleX(1.035) scaleY(.99); } } @keyframes fishFloat1 { 0%,100% { transform: translateY(0); } 18% { transform: translateY(-18px); } 50% { transform: translateY(-58px); } 82% { transform: translateY(-14px); } } @keyframes fishFloat2 { 0%,100% { transform: translateY(0); } 20% { transform: translateY(16px); } 50% { transform: translateY(52px); } 80% { transform: translateY(12px); } } @keyframes fishFloat3 { 0%,100% { transform: translateY(0); } 16% { transform: translateY(-14px); } 50% { transform: translateY(-48px); } 84% { transform: translateY(-10px); } } @keyframes fishFloat4 { 0%,100% { transform: translateY(0); } 22% { transform: translateY(19px); } 50% { transform: translateY(60px); } 78% { transform: translateY(15px); } } @keyframes starSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes leafSway { 0%,100% { transform: rotate(-2deg) translate(0,0); } 50% { transform: rotate(2.5deg) translate(2px,-2px); } } @media (prefers-reduced-motion: reduce) { .anim-femme,.anim-hair,.cat-tail-motion,.anim-fish,.anim-star,.anim-leaf { animation: none !important; } } /* Le chat reste fixe ; seule sa queue est animée. */ .cat-static { animation: none !important; } .cat-tail-motion { transform-box: fill-box; transform-origin: 84% 38%; animation: catTailWave 4.8s ease-in-out infinite; will-change: transform; } @keyframes catTailWave { 0%,100% { transform: rotate(0deg) translateY(0); } 22% { transform: rotate(5deg) translateY(-2px); } 48% { transform: rotate(9deg) translateY(1px); } 72% { transform: rotate(-5deg) translateY(0); } }

Site en cours de conception.
Merci de revenir ultérieurement...

Powered by CookieAdmin