* {
    font-family: 'Poppins', sans-serif;
    scroll-behavior: smooth;
}

.hero-light {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
}

.orange-gradient {
    background: linear-gradient(135deg, #FF6B35 0%, #FF8E53 100%);
}

.green-gradient {
    background: linear-gradient(135deg, #28A745 0%, #5CD85A 100%);
}

.float {
    animation: float 6s ease-in-out infinite;
}

@keyframes float {

    0%,
    100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-20px);
    }
}

.pulse {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

.gradient-text {
    background: linear-gradient(90deg, #FF6B35, #FFD166);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
}

.accordion-content.open {
    max-height: 1000px;
    transition: max-height 1s ease-in-out;
}

.feature-card {
    transition: all 0.3s ease;
}

.feature-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.1);
}

/* Animated Stripes */
.orange-stripes {
    background: repeating-linear-gradient(45deg,
            transparent,
            transparent 10px,
            rgba(255, 107, 53, 0.1) 10px,
            rgba(255, 107, 53, 0.1) 20px);
    animation: slideStripes 20s linear infinite;
}

.green-stripes {
    background: repeating-linear-gradient(45deg,
            transparent,
            transparent 10px,
            rgba(40, 167, 69, 0.1) 10px,
            rgba(40, 167, 69, 0.1) 20px);
    animation: slideStripes 20s linear infinite;
}

@keyframes slideStripes {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 100px 100px;
    }
}

/* Canadian Flag Animation */
.flag-animation {
    animation: waveFlag 3s ease-in-out infinite alternate;
}

@keyframes waveFlag {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(5deg);
    }
}

/* Colorful Header */
.colorful-header {
    background: linear-gradient(90deg, #FF6B35, #28A745);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}