/* Sets the global font for the body to Inter */
body {
    font-family: 'Inter', sans-serif;
    scroll-behavior: smooth;
    /* This makes the page 'glide' when clicking nav links */
}

/* Custom overlay for the Hero section to ensure white text stays readable */
.hero-overlay {
    background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.8));
}

/* A custom animation for the scroll indicator */
@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-10px);
    }

    60% {
        transform: translateY(-5px);
    }
}

/* Class to apply the slow bounce animation */
.animate-bounce-slow {
    animation: bounce 2s infinite;
}

/* Ensures images in the portfolio fill their containers without stretching */
img {
    display: block;
    max-width: 100%;
}