/* ====================================
BLOG HERO
==================================== */

.blog-hero{

padding:220px 0 120px;

background:#070707;

text-align:center;

}

.blog-title{

font-size:88px;

line-height:.95;

margin:25px 0;

}

.blog-description{

max-width:750px;

margin:0 auto;

color:#bdbdbd;

font-size:20px;

line-height:1.9;

}

/* ====================================
BLOG GRID
==================================== */

.blog-grid-section{

padding:0 0 120px;

background:#070707;

}

.blog-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.blog-card{

background:#111111;

border:1px solid rgba(255,255,255,.05);

border-radius:28px;

overflow:hidden;

transition:.3s ease;

}

.blog-card:hover{

transform:translateY(-8px);

border-color:rgba(212,168,95,.25);

}

.blog-card-image img{

width:100%;

height:260px;

object-fit:cover;

display:block;

}

.blog-card-content{

padding:30px;

}

.blog-meta{

color:var(--primary);

font-size:13px;

margin-bottom:15px;

}

.blog-card h2{

font-size:28px;

line-height:1.3;

margin-bottom:15px;

}

.blog-card h2 a{

color:#fff;

}

.blog-card p{

color:#bdbdbd;

line-height:1.8;

margin-bottom:20px;

}

.blog-read-more{

color:var(--primary);

font-weight:600;

}

@media(max-width:991px){

.blog-grid{

    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:767px){

.blog-title{

    font-size:48px;
}

.blog-grid{

    grid-template-columns:1fr;
}

}

/* ====================================
FEATURED POST
==================================== */

.featured-post{

padding:0 0 120px;

background:#070707;

}

.featured-post-card{

display:grid;

grid-template-columns:1.2fr 1fr;

gap:50px;

align-items:center;

background:#111111;

border:1px solid rgba(255,255,255,.05);

border-radius:36px;

overflow:hidden;

}

.featured-post-image img{

width:100%;

height:100%;

min-height:500px;

object-fit:cover;

display:block;

}

.featured-post-content{

padding:50px;

}

.featured-label{

color:var(--primary);

font-weight:600;

display:block;

margin-bottom:20px;

}

.featured-post-content h2{

font-size:52px;

line-height:1.1;

margin-bottom:25px;

}

.featured-post-content h2 a{

color:#fff;

}

.featured-post-content p{

color:#bdbdbd;

line-height:1.9;

margin-bottom:35px;

}

@media(max-width:991px){

.featured-post-card{

    grid-template-columns:1fr;
}

.featured-post-image img{

    min-height:350px;
}

.featured-post-content h2{

    font-size:38px;
}

}

/* ====================================
SINGLE POST
==================================== */

.single-post-hero{

padding:220px 0 80px;

background:#070707;

}

.single-post-header{

max-width:900px;

margin:0 auto;

text-align:center;

}

.single-post-meta{

color:var(--primary);

margin-bottom:20px;

}

.single-post-title{

font-size:72px;

line-height:1;

margin:0;

}

.single-post-cover{

background:#070707;

padding-bottom:80px;

}

.single-post-cover img{

    width:100%;

    height:auto;

    display:block;

    border-radius:32px;
}

.single-post-content-section{

padding:0 0 120px;

background:#070707;

}

.single-post-content{

max-width:850px;

margin:0 auto;

font-size:20px;

line-height:2;

}

.single-post-content h2{

margin-top:60px;

margin-bottom:25px;

font-size:42px;

}

.single-post-content h3{

margin-top:40px;

margin-bottom:20px;

}

.single-post-content p{

margin-bottom:30px;

}

.single-post-content ul{

margin-bottom:30px;

padding-left:25px;

}

.single-author{

padding:0 0 120px;

background:#070707;

}

.single-author-box{

max-width:850px;

margin:0 auto;

background:#111111;

border:1px solid rgba(255,255,255,.05);

border-radius:28px;

padding:40px;

}

.single-author-box h3{

margin-bottom:15px;

}

.single-author-box p{

color:#bdbdbd;

line-height:1.8;

}

.single-cta{

padding:0 0 140px;

background:#070707;

}

.single-cta-box{

text-align:center;

padding:80px 50px;

border-radius:36px;

background:linear-gradient(
    135deg,
    rgba(212,168,95,.18),
    rgba(212,168,95,.05)
);

border:1px solid rgba(212,168,95,.15);

}

.single-cta-box h2{

font-size:58px;

margin:20px 0;

}

.single-cta-box p{

max-width:700px;

margin:0 auto 35px;

color:#d0d0d0;

line-height:1.9;

}

@media(max-width:767px){

.single-post-title{

    font-size:42px;
}

.single-post-content{

    font-size:18px;
}

.single-post-content h2{

    font-size:30px;
}

.single-cta-box{

    padding:50px 25px;
}

.single-cta-box h2{

    font-size:38px;
}

}

/* ====================================
RELATED POSTS
==================================== */

.related-posts{

padding:0 0 120px;

background:#070707;

}

.related-posts-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

margin-top:60px;

}

.related-post-card{

background:#111111;

border:1px solid rgba(255,255,255,.05);

border-radius:28px;

overflow:hidden;

transition:.3s ease;

}

.related-post-card:hover{

transform:translateY(-8px);

border-color:rgba(212,168,95,.25);

}

.related-post-image img{

width:100%;

height:240px;

object-fit:cover;

display:block;

}

.related-post-content{

padding:30px;

}

.related-post-content h3{

font-size:24px;

line-height:1.3;

margin-bottom:15px;

}

.related-post-content h3 a{

color:#fff;

}

.related-post-content p{

color:#bdbdbd;

line-height:1.8;

margin-bottom:20px;

}

@media(max-width:991px){

.related-posts-grid{

    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:767px){

.related-posts-grid{

    grid-template-columns:1fr;
}

}

/* ====================================
BLOG PAGINATION
==================================== */

.blog-pagination{

display:flex;

justify-content:center;

margin-top:70px;

}

.blog-pagination .page-numbers{

display:flex;

align-items:center;

justify-content:center;

width:50px;
height:50px;

margin:0 6px;

border-radius:12px;

background:#111111;

border:1px solid rgba(255,255,255,.05);

color:#ffffff;

transition:.3s ease;

}

.blog-pagination .page-numbers:hover{

border-color:rgba(212,168,95,.25);

color:var(--primary);

}

.blog-pagination .current{

background:var(--primary);

color:#000;

font-weight:700;

}

.blog-meta{

display:flex;

align-items:center;

gap:10px;

flex-wrap:wrap;

color:var(--primary);

font-size:13px;

margin-bottom:15px;

}
