section.journal_summary,
section.journal_summary * {
    color: Black !important;
    font-size: 36px !important;      /* Bigger text */
    font-weight: 600 !important;     /* Strong bold */
    text-align: left!important;
    line-height: 1.6 !important;

}

.lower-header {
    background-color: #B7C6DD;   /* your chosen color */
    
}


.header.container-fluid {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;          /* Stay above all content */
    box-shadow: 0 2px 6px rgba(0,0,0,0.15); /* Subtle shadow for separation */
    background-color: #B7C6DD; /* Add background so text doesn’t overlap */
    padding-top: 0px !important;  /* reduce top padding */
    padding-bottom: 0px !important; /* reduce bottom padding */
    margin-bottom: 0 !important;  /* remove extra gap below */
}

/* Add padding so content doesn’t hide behind the header */
body {
    padding-top: 100px; /* Adjust based on your header’s height */
}

.site-footer {
    background-color: #B7C6DD; /* Replace with your desired color */
    color: #ffffff; /* Optional: text color for contrast */
}



/* Combined Parallax + Gradient Shine */
.homepage_image {
    height: 630px !important;
    width: 100% !important;
    object-fit: cover;
    position: relative;
    background-attachment: fixed;   /* Parallax effect */
    background-position: center;
    background-size: cover;
    overflow: hidden;
}

/* Shiny gradient overlay */
.homepage_image::after {
    content: "";
    position: absolute;
    top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(
        120deg, 
        rgba(255,255,255,0.15) 0%, 
        rgba(255,255,255,0.4) 50%, 
        rgba(255,255,255,0) 100%
    );
    transform: skewX(-25deg);
    animation: shine 4s infinite;
}

/* Shine animation */
@keyframes shine {
    100% { left: 125%; }
}

.container-fluid.container-page.container-narrow {
    margin-top: 40px !important;   /* Push the whole block down */
    padding-top: 25px !important;  /* Add inner space at the top */
}

.thumb {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 10px;
}

.thumb img {
    width: 200px;
    height: auto;
    display: block;
    transition: transform 0.5s ease;
}

.thumb::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        120deg,
        rgba(255,255,255,0.2) 0%,
        rgba(255,255,255,0.6) 50%,
        rgba(255,255,255,0.2) 100%
    );
    transform: skewX(-20deg);
}

.thumb:hover img {
    transform: scale(1.1);
}

.thumb:hover::after {
    animation: shine 0.8s forwards;
}

@keyframes shine {
    0% { left: -100%; }
    100% { left: 120%; }
}