/* ---------- BASE ---------- */

body{
    background:#F8F6F2;
    color:#222;
    margin:0;
    font-family:Georgia,"Times New Roman",serif;
}

#progress{
    position:fixed;
    top:0;
    left:0;
    height:3px;
    width:0;
    background:#C8350A;
    z-index:9999;
}

/* ---------- HEADER ---------- */

.story-header{

    width:min(1180px,92%);
    margin:36px auto;

}

.story-back{

    text-decoration:none;

    color:#666;

    font-size:.95rem;

    transition:.25s;

}

.story-back:hover{

    color:#C8350A;

}

.story-divider{

    width:min(1180px,92%);
    margin:0 auto;
    border-top:1px solid #ddd;

}

/* ---------- ARTICLE ---------- */

.story-container{
    width:min(1280px,94%);
    margin:0 auto;
}

.story-page{

    padding:90px 0 140px;

}

.story-meta{

    font-family:"Instrument Sans",sans-serif;

    font-size:.75rem;

    letter-spacing:.22em;

    font-weight:600;

    color:#C8350A;

    margin-bottom:22px;

}

.story-page h1{

    max-width:900px;

    font-family:"DM Serif Display",serif;

    font-size:clamp(3.8rem,6vw,5.8rem);

    line-height:.98;

    letter-spacing:-.03em;

    font-weight:400;

    margin:0 0 28px;

}

.story-summary{

    max-width:720px;

    font-size:1.7rem;

    line-height:1.5;

    color:#666;

    margin:0 0 56px;

}

.story-date{

    font-family:Arial,sans-serif;

    color:#888;

    font-size:.9rem;

    margin-bottom:36px;

}

.story-body{

    max-width:690px;

    margin:0 auto;

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

    font-size:1.42rem;

    line-height:1.82;

    color:#2b2b2b;

}
.story-body p{

    margin:0 0 2.5rem;

}
.story-body p:first-child{

    font-size:1.65rem;

    line-height:1.55;

    color:#1d1d1d;

    margin-bottom:3rem;

}
.story-body h2{

    font-family:"DM Serif Display",serif;

    font-size:2.7rem;

    margin:100px 0 30px;

    line-height:1.08;

}

.story-body blockquote{

    max-width:760px;

    margin:120px auto;

    font-family:"DM Serif Display",serif;

    font-size:2.2rem;

    line-height:1.45;

    text-align:center;

    color:#222;

    font-style:italic;

}

.story-body img{

    display:block;

    width:100%;

    margin:80px 0;

}
.story-end{

    text-align:center;

    margin:140px auto 90px;

}

.story-line{

    width:120px;

    height:1px;

    background:#ddd;

    margin:0 auto 40px;

}

.story-end p{

    font-size:1.5rem;

    margin-bottom:20px;

}

.story-end a{

    text-decoration:none;

    color:#666;

}

.story-end a:hover{

    color:#C8350A;

}