/* 
   This file provides CSS styles to create a stripes background 
   for the tokenomics section as an alternative to using an image.
   
   Include this in the main HTML by adding:
   <link rel="stylesheet" href="stripes-background.css">
*/

.tokenomics {
    background: linear-gradient(to right, var(--dark-red), var(--navy-blue));
    position: relative;
    overflow: hidden;
}

.tokenomics::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 10px,
        rgba(0, 0, 0, 0.1) 10px,
        rgba(0, 0, 0, 0.1) 20px
    );
    z-index: 1;
}

.tokenomics::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
}

/* Ensure content is above the overlays */
.tokenomics > * {
    position: relative;
    z-index: 3;
}

@keyframes moveStripes {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 100px 100px;
    }
}