.post {

    width:min(760px,92%);
    margin-inline:auto;
    padding:5rem 0 8rem;

}

.post-header{

    margin-bottom:3rem;

}

.post-category{

    margin:0 0 .75rem;
    color:var(--color-accent);
    font-size:.9rem;
    font-family:var(--font-body);

}

.post-title{

    margin:0;
    font-family:var(--font-heading);
    font-size:clamp(3rem,6vw,5rem);
    line-height:1.05;

}

.post-intro{

    margin-top:2rem;
    font-size:1.35rem;
    line-height:1.8;
    color:#555;

}

.post-image{

    margin:4rem 0;

}

.post-image img{

    width:100%;
    display:block;
    border-radius:var(--radius-lg);

}

.post-content{

    font-size:1.15rem;
    line-height:1.95;

}

.post-content p{

    margin-bottom:1.8rem;

}

.post-content p:first-of-type::first-letter{

    float:left;
    font-family:var(--font-heading);
    font-size:5rem;
    line-height:.8;
    padding-right:.2rem;
    color:var(--color-accent);

}

/* ==========================================
   POST CONTENT
========================================== */

.post-content{

    font-family:var(--font-body);

    font-size:1.15rem;

    line-height:1.95;

}

.post-content h2{

    margin:5rem 0 1.5rem;

}

.post-content h3{

    margin:4rem 0 1rem;

}

.post-content p{

    margin-bottom:1.8rem;

}

.post-content ul,
.post-content ol{

    margin:2rem 0;
    padding-left:1.5rem;

}

.post-content li{

    margin-bottom:.75rem;

}

.post-content img{

    display:block;

    width:100%;

    margin:3rem auto;

    border-radius:var(--radius-md);

}

.post-content figure{

    margin:3rem 0;

}

.post-content figcaption{

    margin-top:.75rem;

    text-align:center;

    font-size:.9rem;

    color:#777;

}

.post-content blockquote{

    margin:4rem 0;

    padding-left:2rem;

    border-left:4px solid var(--color-accent);

    font-family:var(--font-heading);

    font-size:1.8rem;

    line-height:1.5;

    color:#444;

}

.post-content hr{

    margin:5rem 0;

    border:none;

    border-top:1px solid var(--color-border);

}

.post-content a{

    color:var(--color-accent);

    text-decoration:none;

    border-bottom:1px solid transparent;

}

.post-content a:hover{

    border-bottom-color:currentColor;

}