/*
==================================================
HEADER
==================================================
*/

.bbw-header{
    background:
        url("../img/Background.png") repeat,
        var(--bbw-paper);

    background-size:512px 512px;

    border-top:5px solid var(--bbw-ink);

}

/*
==================================================
MASTHEAD
==================================================
*/

.bbw-masthead{

    padding:.45rem 0 0;

    text-align:center;

}

.bbw-publication-bar{

    display:grid;

    grid-template-columns:300px 1fr 220px;

    align-items:start;

    gap:1rem;

}

.bbw-publication-tagline{

    margin:0;
    padding-top:.35rem;

    color:var(--bbw-teal-dark);

    font-family:
        "Arial Narrow",
        "Franklin Gothic Condensed",
        Arial,
        sans-serif;

    font-size:clamp(.72rem,1.05vw,.88rem);

    font-weight:800;

    letter-spacing:.09em;

    line-height:1.3;

    text-align:left;

    text-transform:uppercase;
    justify-self:start;
    white-space:nowrap;

}

.bbw-issue-block{

    display:grid;

    justify-self:end;

    justify-items:end;

    width:220px;

    color:var(--bbw-teal-dark);

    font-family:
        "Arial Narrow",
        "Franklin Gothic Condensed",
        Arial,
        sans-serif;

    font-size:.72rem;

    font-weight:900;

    letter-spacing:.08em;

    line-height:1.35;

    text-transform:uppercase;

}

.bbw-cover-price{

    display:flex;

    align-items:center;

    justify-content:center;

    width:2.1rem;

    height:2.1rem;

    margin-top:.3rem;

    padding:0;

    color:var(--bbw-paper-light);

    background:var(--bbw-red);

    border:2px solid var(--bbw-red-dark);

    border-radius:50%;

    font-size:.68rem;

    text-align:center;

}

/*
==================================================
DECORATIVE RULE
==================================================
*/

.bbw-masthead-rule{

    display:grid;

    grid-template-columns:1fr repeat(5,auto) 1fr;

    align-items:center;

    gap:.5rem;

    margin:.4rem 0;

    color:var(--bbw-teal);

    font-size:.58rem;

}

.bbw-masthead-rule::before,
.bbw-masthead-rule::after{

    content:"";

    display:block;

    height:4px;

    background:var(--bbw-teal);

    box-shadow:
        0 4px 0 var(--bbw-yellow);

}

/*
==================================================
BRAND
==================================================
*/

.bbw-brand-lockup{

    display:grid;

    justify-items:center;

}

/*
==================================================
UPLOADED MASTHEAD LOGO
==================================================
*/

.bbw-brand-logo{

    width:100%;

    max-width:1100px;

}

.bbw-brand-logo .custom-logo-link{

    display:block;

}

.bbw-brand-logo img{

    display:block;

    width:100%;

    height:auto;

}

/*
==================================================
BUNDLED HEADER ARTWORK
==================================================
*/

.bbw-brand-image{

    display:block;

    width:100%;

    max-width:580px;

    height:auto;

    margin:0 auto;

}

.bbw-subtitle-image{

    display:block;

    width:100%;

    max-width:250px;

    height:auto;

    margin:.2rem auto 0;

}

/*
==================================================
CURVED BRAND NAME (per-letter rotation, no SVG)
==================================================
*/

.bbw-brand-name{

    margin:0;

}

.bbw-arc-text{

    display:flex;

    justify-content:center;

    align-items:flex-end;

}

.bbw-arc-letter{

    display:inline-block;

    transform-origin:bottom center;

    color:var(--bbw-teal);

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

    font-size:clamp(4.6rem,11vw,9rem);

    font-weight:400;

    letter-spacing:.01em;

    line-height:.84;

    text-transform:uppercase;

    text-shadow:
        2px 2px 0 var(--bbw-yellow),
        4px 4px 6px rgba(16,41,45,.3);

}

.bbw-arc-space{

    width:.3em;

    letter-spacing:normal;

}

/*
==================================================
PUBLICATION NAME (ITALIC SUBTITLE)
==================================================
*/

.bbw-publication-name{

    margin:0;

    padding:0;

    color:#a6261a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:clamp(2rem,2.8vw,3rem);

    font-style:italic;

    font-weight:700;

    line-height:1;

    letter-spacing:.01em;

}

.bbw-publication-name-row{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:1rem;

    margin-top:.35rem;

}

/*
==================================================
NAME ORNAMENT (short / long / short)
==================================================
*/

.bbw-name-ornament{

    display:flex;

    flex-direction:column;

    gap:7px;

}

.bbw-name-ornament-left{

    align-items:flex-end;

}

.bbw-name-ornament-right{

    align-items:flex-start;

}

.bbw-name-line{

    display:block;

    height:4px;

    background:var(--bbw-teal);

}

.bbw-name-line-sm{

    width:16px;

}

.bbw-name-line-lg{

    width:68px;

}

/*
==================================================
RIBBON (3-piece artwork: left cap / center / right cap)
==================================================
*/

.bbw-ribbon-banner{

    display:flex;

    align-items:stretch;

    justify-content:center;

    height:clamp(46px,6vw,70px);

    max-width:900px;

    margin:.5rem auto .15rem;

}

.bbw-ribbon-cap{

    flex:0 0 auto;

    aspect-ratio:301 / 256;

    height:100%;

    background-image:url("../img/LeftRibbon.png");

    background-repeat:no-repeat;

    background-size:100% 100%;

}

.bbw-ribbon-cap-right{

    background-image:url("../img/RightRibbon.png");

}

.bbw-ribbon-center{

    position:relative;

    z-index:3;

    flex:1 1 auto;

    display:flex;

    align-items:center;

    justify-content:center;

    height:100%;

    padding:0 1.5rem;

    background-image:url("../img/CenterRibbon.png");

    background-repeat:no-repeat;

    background-size:100% 100%;

}

.bbw-ribbon-banner-text{

    color:#fffdf4;

    font-family:
        "Brush Script MT",
        "Segoe Script",
        cursive;

    font-size:clamp(1rem,1.7vw,1.4rem);

    font-weight:400;

    line-height:1.2;

    letter-spacing:.01em;

    text-shadow:
        1px 1px 0 rgba(0,0,0,.18);

    white-space:nowrap;

}

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

@media (max-width:760px){

    .bbw-publication-bar{

        grid-template-columns:1fr;

        gap:.6rem;

        text-align:center;

    }

    .bbw-publication-tagline{

        white-space:normal;

        text-align:center;

    }

    .bbw-issue-block{

        grid-template-columns:repeat(3,auto);

        justify-content:center;

        gap:.8rem;

    }

    .bbw-arc-letter{

        font-size:clamp(4rem,10vw,7rem);

    }

    .bbw-publication-name-row{

        gap:.5rem;

    }

    .bbw-name-line-sm{

        width:10px;

    }

    .bbw-name-line-lg{

        width:36px;

    }

    .bbw-ribbon-banner{

        max-width:100%;

    }

    .bbw-ribbon-cap{

        display:none;

    }

    .bbw-ribbon-center{

        width:100%;

        padding:0 1.25rem;

    }

    .bbw-ribbon-banner-text{

        white-space:normal;

        text-align:center;

        font-size:1.1rem;

    }

}