/*
   Dearden2007 Mental Health Resource Center
   Built to match the Fathers' Rights page architecture
*/

.mental-health-page{
    background:#03050a;
    color:#fff;
}

.mh-crisis-strip{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    padding:14px max(22px,calc((100vw - 1450px)/2));
    background:linear-gradient(90deg,#750000,#d61c1c);
    border-bottom:2px solid #ff6f79;
}

.mh-crisis-strip>div:first-child{
    display:grid;
    gap:3px;
}

.mh-crisis-strip strong{
    letter-spacing:.12em;
}

.mh-crisis-actions{
    display:flex;
    gap:8px;
}

.mh-crisis-actions a{
    padding:9px 14px;
    border:1px solid #fff;
    border-radius:8px;
    background:rgba(0,0,0,.25);
    color:#fff;
    text-decoration:none;
    font-weight:900;
}

.mh-resource-hero{
    max-width:1450px;
    margin:20px auto;
    padding:70px 55px;
    text-align:left;
    border:1px solid rgba(30,76,255,.65);
    border-left:8px solid #d61c1c;
    background:
        radial-gradient(circle at left,rgba(30,76,255,.25),transparent 45%),
        radial-gradient(circle at right,rgba(214,28,28,.20),transparent 42%),
        #05070d;
}

.mh-kicker{
    color:#78a8ff;
    font-weight:900;
    letter-spacing:.18em;
}

.mh-resource-hero h1{
    max-width:1150px;
    margin:18px 0;
    color:#fff;
    font-size:clamp(50px,7vw,100px);
    line-height:.95;
    text-transform:uppercase;
    text-shadow:
        0 0 18px rgba(30,76,255,.45),
        0 0 18px rgba(214,28,28,.35);
}

.mh-resource-hero p{
    max-width:1000px;
    font-size:22px;
    line-height:1.7;
    color:#d5deed;
}

.mh-banner{
    display:grid;
    grid-template-columns:1fr 330px;
    gap:35px;
    align-items:center;
    max-width:1300px;
    margin:50px auto;
    padding:35px;
    border:2px solid #1e4cff;
    border-radius:25px;
    background:linear-gradient(135deg,rgba(30,76,255,.10),rgba(214,28,28,.10));
}

.mh-banner-copy>span{
    color:#ff6e78;
    font-weight:900;
    letter-spacing:.14em;
}

.mh-banner h2{
    margin:14px 0;
    font-size:clamp(40px,5vw,70px);
    line-height:1.05;
}

.mh-banner p{
    color:#ddd;
    font-size:20px;
    line-height:1.75;
}

.mh-source-note{
    color:#9fb0c8!important;
    font-size:14px!important;
}

.mh-banner-logo{
    text-align:center;
}

.mh-banner-logo img{
    width:220px;
    max-width:100%;
    border:4px solid #d61c1c;
    border-radius:50%;
    box-shadow:
        0 0 25px rgba(30,76,255,.4),
        0 0 25px rgba(214,28,28,.35);
}

.mh-banner-logo strong{
    display:block;
    margin-top:18px;
    line-height:1.6;
}

.mh-resource-section{
    max-width:1300px;
}

.mh-resource-intro{
    max-width:1000px;
    margin:0 auto 35px;
    color:#d4dceb;
    font-size:21px;
    line-height:1.75;
    text-align:center;
}

.mh-challenge-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.mh-card{
    min-height:330px;
    padding:0;
    text-decoration:none;
}

.mh-card-red{
    border-color:#d61c1c;
}

.mh-card-blue{
    border-color:#1e4cff;
}

.mh-card-split{
    border-color:#1e4cff;
    box-shadow:
        inset 5px 0 0 #d61c1c,
        inset -5px 0 0 #1e4cff;
}

.mh-card::after{
    content:"OPEN FULL RESOURCE PAGE";
}

.mh-card-number{
    position:absolute;
    top:18px;
    right:20px;
    z-index:3;
    color:rgba(255,255,255,.20);
    font-size:72px;
    font-weight:900;
}

.mh-card-overlay{
    position:absolute;
    inset:0;
    z-index:2;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:30px;
    background:
        linear-gradient(to top,rgba(0,0,0,.98),rgba(0,0,0,.45),rgba(0,0,0,.18));
}

.mh-card-overlay span{
    color:#78a8ff;
    font-size:12px;
    font-weight:900;
    letter-spacing:.15em;
}

.mh-card-overlay h3{
    position:static;
    width:auto;
    margin:12px 0;
    padding:0;
    background:none;
    color:#fff;
    font-size:30px;
    text-align:left;
    text-shadow:
        0 0 10px #000,
        0 0 20px #000;
}

.mh-card-overlay p{
    margin:0 0 32px;
    color:#d1d8e5;
    font-size:17px;
    line-height:1.55;
    text-align:left;
}

.mh-pillars .pillar-card span{
    color:#78a8ff;
    font-size:26px;
    font-weight:900;
}

@media(max-width:950px){
    .mh-challenge-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .mh-banner{
        grid-template-columns:1fr;
    }
}

@media(max-width:620px){
    .mh-crisis-strip{
        flex-direction:column;
        align-items:stretch;
    }

    .mh-crisis-actions a{
        flex:1;
        text-align:center;
    }

    .mh-resource-hero{
        margin:16px;
        padding:35px 22px;
    }

    .mh-resource-hero h1{
        font-size:clamp(42px,13vw,70px);
    }

    .mh-banner,
    .mh-resource-section{
        width:calc(100% - 32px);
        margin-left:16px;
        margin-right:16px;
    }

    .mh-challenge-grid{
        grid-template-columns:1fr;
    }

    .mh-card{
        min-height:350px;
    }
}