/* =================================
MAGAZINE SINGLE ARTICLE
================================= */

.magazine-single{
max-width:820px;
margin:0 auto;
padding:40px 20px;
}

.magazine-title{
font-size:38px;
line-height:1.2;
margin-bottom:10px;
}

.magazine-meta{
font-size:13px;
letter-spacing:1px;
text-transform:uppercase;
color:#777;
margin-bottom:30px;
}

.magazine-featured-image{
margin-bottom:35px;
}

.magazine-featured-image img{
width:100%;
height:auto;
}

.magazine-content{
font-size:18px;
line-height:1.75;
}

.magazine-content h2{
margin-top:40px;
margin-bottom:15px;
}

.magazine-content p{
margin-bottom:20px;
}

.magazine-categories{
margin-top:40px;
font-size:13px;
letter-spacing:1px;
text-transform:uppercase;
}

.magazine-categories a{
margin-right:12px;
}

/* ----------------------------------
Breadcrumbs
---------------------------------- */

.agency-breadcrumbs{
margin-bottom:20px;
font-size:16px;
color:#777;
}

.agency-breadcrumbs a{
text-decoration:none;
}

.breadcrumb-sep{
margin:0 6px;
}

/* ================================
MAGAZINE ARTICLE
================================ */

.magazine-single{
max-width:820px;
margin:0 auto;
padding:40px 20px;
}

.magazine-title{
font-size:38px;
line-height:1.2;
margin-bottom:10px;
}

.magazine-meta{
font-size:13px;
color:#777;
margin-bottom:30px;
letter-spacing:1px;
text-transform:uppercase;
}

.magazine-featured-image{
margin-bottom:35px;
}

.magazine-featured-image img{
width:100%;
height:auto;
}

.magazine-content{
font-size:18px;
line-height:1.75;
}

.magazine-content p{
margin-bottom:20px;
}

.magazine-categories{
margin-top:40px;
font-size:13px;
text-transform:uppercase;
letter-spacing:1px;
}

.magazine-categories a{
margin-right:12px;
}


/* ================================
RELATED ARTICLES
================================ */

.related-articles{
margin-top:60px;
padding-top:40px;
border-top:1px solid #eee;
}

.related-title{
font-size:20px;
margin-bottom:25px;
}

.related-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;
}

.related-card a{
text-decoration:none;
display:block;
}

.related-image img{
width:100%;
height:auto;
}

.related-card-title{
font-size:16px;
line-height:1.4;
margin-top:10px;
color: #000;
}


@media(max-width:768px){

.related-grid{
grid-template-columns:1fr;
}

}

@media(max-width:640px){

.magazine-title{
font-size:28px;
}

}