/* Animation Keyframes */

@keyframes fadeUpBlur {
  0% {
    opacity: 0;
    transform: translate3d(0, 40px, 0) scale(0.98);
    filter: blur(12px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 80px, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes scaleUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 80px, 0) scale(0.94);
    filter: blur(8px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

@keyframes slideUpLine {
  0% {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes scrollFadeIn {
  0% {
    opacity: 0;
    transform: translate3d(0, 60px, 0) scale(0.98);
    filter: blur(4px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

@keyframes float {
  0%, 100% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
  50% {
    transform: translate3d(0, -6px, 0) rotate(2deg);
  }
}

@keyframes floatSlow {
  0%, 100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes smoothSlideUp {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Animation Classes */

/* Hero Section Animations */
.hero__headline {
  animation: fadeUpBlur 1.4s var(--ease-primary) forwards;
  animation-delay: 0ms;
}

.hero__line-1 {
  display: block;
}

.hero__line-2 {
  display: block;
}

.hero__intro {
  animation: fadeUp 1.2s var(--ease-primary) forwards;
  animation-delay: 180ms;
}

.hero__cta {
  animation: fadeUp 1.2s var(--ease-primary) forwards;
  animation-delay: 360ms;
}

.hero__socials {
  animation: fadeUp 1.2s var(--ease-primary) forwards;
  animation-delay: 540ms;
}

.social-pill {
  animation: fadeUp 1s var(--ease-primary) forwards;
  opacity: 0;
}

.social-pill:nth-child(1) {
  animation-delay: 600ms;
}

.social-pill:nth-child(2) {
  animation-delay: 720ms;
}

.social-pill:nth-child(3) {
  animation-delay: 840ms;
}

.social-pill:nth-child(4) {
  animation-delay: 960ms;
}

.social-pill:nth-child(5) {
  animation-delay: 1080ms;
}

/* Carousel Animations */
.article-card {
  animation: scaleUp 1s var(--ease-primary) forwards;
  opacity: 0;
}

.carousel__card:nth-child(1) .article-card {
  animation-delay: 300ms;
}

.carousel__card:nth-child(2) .article-card {
  animation-delay: 450ms;
}

.carousel__card:nth-child(3) .article-card {
  animation-delay: 600ms;
}

/* Floating Elements */
.floating {
  animation: floatSlow 10s ease-in-out infinite;
}

.floating.delay-1 {
  animation-delay: 0s;
}

.floating.delay-2 {
  animation-delay: 3s;
}

.floating.delay-3 {
  animation-delay: 6s;
}

/* Skill Cards Animation - Initially Hidden */
.skill-card {
  opacity: 0;
  transform: translate3d(0, 80px, 0) scale(0.94);
  filter: blur(8px);
  transition: all 0.8s var(--ease-primary);
}

.skill-card:nth-child(1) {
  transition-delay: 0ms;
}

.skill-card:nth-child(2) {
  transition-delay: 100ms;
}

.skill-card:nth-child(3) {
  transition-delay: 200ms;
}

.skill-card:nth-child(4) {
  transition-delay: 300ms;
}

/* Skill Cards Animation - On Scroll Into View */
.skills-section.in-view .skill-card {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  filter: blur(0);
}

.portrait__image {
  animation: fadeUp 1.2s var(--ease-primary) forwards;
  animation-delay: 200ms;
  opacity: 0;
}

/* Scroll Fade Up - On Scroll Into View */
.scroll-fade-up {
  opacity: 0;
  transform: translate3d(0, 60px, 0);
  filter: blur(8px);
  transition: all 1s var(--ease-primary);
}

.scroll-fade-up.in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

/* Scroll Scale - On Scroll Into View */
.scroll-scale {
  opacity: 0;
  transform: translate3d(0, 60px, 0) scale(0.96);
  filter: blur(8px);
  transition: all 1s var(--ease-primary);
}

.scroll-scale.in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  filter: blur(0);
}

/* Work Table Animations */
.work-row {
  animation: fadeUp 1s var(--ease-primary) forwards;
  opacity: 0;
}

.work-row:nth-child(1) {
  animation-delay: 100ms;
}

.work-row:nth-child(2) {
  animation-delay: 200ms;
}

.work-row:nth-child(3) {
  animation-delay: 300ms;
}

.work-row:nth-child(4) {
  animation-delay: 400ms;
}

/* Project Cards Animations */
.project-card {
  animation: scaleUp 1s var(--ease-primary) forwards;
  opacity: 0;
}

.projects-grid .project-card:nth-child(1) {
  animation-delay: 100ms;
}

.projects-grid .project-card:nth-child(2) {
  animation-delay: 200ms;
}

.projects-grid .project-card:nth-child(3) {
  animation-delay: 300ms;
}

.projects-grid .project-card:nth-child(4) {
  animation-delay: 400ms;
}

.projects-grid .project-card:nth-child(5) {
  animation-delay: 500ms;
}

.projects-grid .project-card:nth-child(6) {
  animation-delay: 600ms;
}

/* Scroll-based Animations */
.scroll-fade-up {
  opacity: 0;
  transform: translate3d(0, 80px, 0);
  transition: all 0.8s var(--ease-primary);
}

.scroll-fade-up.in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.scroll-scale {
  opacity: 0;
  transform: translate3d(0, 80px, 0) scale(0.97);
  filter: blur(10px);
  transition: all 0.8s var(--ease-primary);
}

.scroll-scale.in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  filter: blur(0);
}

/* Scroll Fade In - Elements fade in on scroll */
.scroll-fade-in {
  opacity: 0;
  transform: translate3d(0, 60px, 0);
  filter: blur(4px);
  transition: all 1.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.scroll-fade-in.in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}