﻿/* Header container that grows vertically with content */
.header-container {
    position: relative;
    width: 100vw;
    background-image: linear-gradient(to right, #e6f4ea, #ccf0d8);
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 20px; /* Controls vertical spacing */
}

/* Shimmer layer */
.header-light {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient( 120deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100% );
    animation: lightSweep 3s linear infinite;
    z-index: 1;
    pointer-events: none;
}

/* Text layer */
.header-text {
    position: relative;
    z-index: 2;
    /*color: #2f6f3e;*/
    color: var(--darkgreen);
    text-align: center;
}

@keyframes lightSweep {
    0% {
        left: -100%;
    }

    100% {
        left: 100%;
    }
}
