/*
==================================================
PAGE HERO
==================================================
*/

.bbw-page-hero{

    padding:1.75rem 0 2.25rem;

    text-align:center;

    background:
        radial-gradient(
            circle at 1px 1px,
            rgba(23,63,64,.11) 1px,
            transparent 1.35px
        ),
        var(--bbw-paper);

    background-size:7px 7px;

    border-bottom:4px solid var(--bbw-teal);

}

.bbw-page-hero-image{

    display:block;

    width:100%;

    height:auto;

    margin:0;

    border:3px solid var(--bbw-teal);

    box-shadow:4px 4px 0 rgba(0,0,0,.14);

}

.bbw-page-hero-title{

    margin:.75rem 0;

    color:var(--bbw-teal);

    font-family:"Anton",sans-serif;

    font-size:clamp(2rem,4.5vw,3.2rem);

    font-weight:400;

    letter-spacing:.04em;

    line-height:1;

    text-shadow:
        2px 2px 0 var(--bbw-paper-light),
        4px 4px 0 var(--bbw-yellow),
        6px 6px 0 var(--bbw-teal-dark);

}

/*
==================================================
RESPONSIVE
==================================================
*/

@media (max-width:640px){

    .bbw-page-hero{

        padding:1.25rem 0 1.75rem;

    }

}