/* Path: user/themes/quark-wmv/css/modular/team.css */
/* --- TEAM MODULE STYLES (SCOPED) --- */

:root {
    --bg-body-color: rgba(255, 253, 246, 0.8);
    --bg-header-color: rgba(255, 253, 246, 0.5);
 /*   --bg-blend-mode: soft-light; /* soft-light */
    --bg-blend-mode: normal; 
}

.modular-team .parallax-bg-blend {
    position: relative;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    /* This creates the parallax scrolling effect */
    background-attachment: fixed;
    background-blend-mode: var(--bg-blend-mode);}
/*
.modular-team .frame-box {  
    padding: 0;
}
*/
.modular-team .columns {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.4rem;
    margin-right: -0.4rem;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    background-color: var(--bg-body-color);
    background-blend-mode: var(--bg-blend-mode);
}

.modular-team .top-section:empty {
    content:'';
    min-height: 2.4rem;
}

.modular-team .top-section{
    background-color: var(--bg-body-color); 
    background-blend-mode: var(--bg-blend-mode);
    padding-top:3rem;
}

.modular-team .column {
    box-sizing: border-box;
    text-align: left;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
}

/* --- Responsive Column Definitions (Scoped) --- */

.modular-team .header-wrapper {
    padding: 0.8rem 0;
    display: flow-root;
    background-color: var(--bg-header-color); 
    background-blend-mode: var(--bg-blend-mode);
}

/* Mobile Fallback: All columns become full width on small screens */
@media (max-width: 768px) {
    .modular-team .col-sm-12 {
        width: 100%;
        margin-bottom: 1rem; /* Add spacing between stacked members */
    }

    /* Fix image size on small screens */
    .modular-team img {
        max-width: 160px;
    }
}



/* --- Image Utility Classes (Scoped) --- */

/* Float and Margins for Image inside the description text */
.modular-team .float-right {
    float: right;
}

/* Margin Left (ml-3) and Margin Bottom (mb-2) */
.modular-team .ml-3 {
    margin-left: 1rem;
}

.modular-team .mb-2 {
    margin-bottom: 0.5rem;
}

.modular-team h1,
.modular-team h2, 
.modular-team h3,
.modular-team h4,
.modular-team h5 {
    margin: 0;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

/*
.modular-team h2 {
    text-align: center;
}
*/
.modular-team .subheader {
    padding-top: 0;
}