/*
==================================================
GLOBAL
==================================================
*/

.sw-posts-grid{
display:grid;
gap:24px;
}

.sw-post-card{
position:relative;
overflow:hidden;
transition:.3s;
}

.sw-post-thumb{
display:block;
overflow:hidden;
position:relative;
border-radius:22px;
}

.sw-post-thumb img{
width:100%;
height:100%;
display:block;
object-fit:cover;
transition:.4s;
}

.sw-post-card:hover .sw-post-thumb img{
transform:scale(1.05);
}

.sw-post-content{
padding-top:14px;
}

.sw-post-title{
font-size:20px;
line-height:1.8;
font-weight:800;
margin:0;
}

.sw-post-title a{
color:#111827;
text-decoration:none;
}

.sw-post-meta{
display:flex;
align-items:center;
gap:14px;
margin-top:10px;
font-size:13px;
color:#6b7280;
flex-wrap:wrap;
}

/*
/*
==================================================
STYLE 1 — NEWS HORIZONTAL
==================================================
*/

.sw-posts-grid.style1{
display:flex;
flex-direction:column;
gap:18px;
}

.sw-posts-grid.style1 .sw-post-card{
display:grid;
grid-template-columns:220px 1fr;
gap:16px;
align-items:center;
padding:0 0 18px;
border-bottom:1px solid #ececec;
}

/*
=========================
IMAGE
=========================
*/

.sw-posts-grid.style1 .sw-post-thumb{
display:block;
overflow:hidden;
border-radius:12px;
height:140px;
background:#f3f4f6;
}

.sw-posts-grid.style1 .sw-post-thumb img{
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:.3s;
}

.sw-posts-grid.style1 .sw-post-card:hover .sw-post-thumb img{
transform:scale(1.04);
}

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

.sw-posts-grid.style1 .sw-post-content{
display:flex;
flex-direction:column;
justify-content:center;
min-width:0;
}

/*
=========================
CATEGORY
=========================
*/

.sw-posts-grid.style1 .sw-meta-taxonomy{
margin-bottom:8px;
display:flex;
}

.sw-posts-grid.style1 .sw-meta-taxonomy a{
font-size:12px;
font-weight:700;
text-decoration:none;
color:var(--main-color);
}

/*
=========================
TITLE
=========================
*/

.sw-posts-grid.style1 .sw-post-title{
margin:0 0 10px;
font-size:20px;
line-height:1.7;
font-weight:800;
}

.sw-posts-grid.style1 .sw-post-title a{
color:#111827;
text-decoration:none;

display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
}

.sw-posts-grid.style1 .sw-post-title a:hover{
color:var(--main-color);
}

/*
=========================
META
=========================
*/

.sw-posts-grid.style1 .sw-post-meta{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap;
font-size:13px;
color:#6b7280;
}

.sw-posts-grid.style1 .sw-meta-author a{
font-weight:700;
color:#111827;
text-decoration:none;
}

/*
==================================================
MOBILE
==================================================
*/

@media(max-width:767px){

.sw-posts-grid.style1 .sw-post-card{
grid-template-columns:110px 1fr;
gap:12px;
padding-bottom:14px;
}

.sw-posts-grid.style1 .sw-post-thumb{
height:85px;
border-radius:10px;
}

.sw-posts-grid.style1 .sw-post-title{
font-size:15px;
line-height:1.6;
margin-bottom:6px;
}

.sw-posts-grid.style1 .sw-post-meta{
font-size:11px;
gap:8px;
}

}
/*
==================================================
STYLE 2
CARD VERTICAL
==================================================
*/

.sw-post-style2{
background:#fff;
border-radius:26px;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.sw-post-style2 .sw-post-content{
padding:18px;
}

/*
==================================================
STYLE 3
DARK OVERLAY
==================================================
*/

.sw-post-style3{
min-height:420px;
display:flex;
align-items:flex-end;
border-radius:28px;
}

.sw-post-style3 .sw-post-thumb{
position:absolute;
inset:0;
height:100%;
border-radius:28px;
}

.sw-post-style3 .sw-post-thumb::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(to top,rgba(0,0,0,.9),rgba(0,0,0,.2));
}

.sw-post-style3 .sw-post-content{
position:relative;
z-index:2;
padding:28px;
}

.sw-post-style3 .sw-post-title a,
.sw-post-style3 .sw-post-meta{
color:#fff;
}

/*
==================================================
STYLE 4
MINIMAL GRID
==================================================
*/

.sw-post-style4{
border-bottom:1px solid #eee;
padding-bottom:20px;
}

.sw-post-style4 .sw-post-thumb img{
aspect-ratio:16/10;
}

/*
==================================================
STYLE 5
NEWS BLOCK
==================================================
*/

.sw-post-style5{
display:grid;
grid-template-columns:140px 1fr;
gap:18px;
background:#f9fafb;
padding:14px;
border-radius:20px;
}

.sw-post-style5 .sw-post-thumb img{
aspect-ratio:1/1;
}

/*
==================================================
STYLE 6
WHITE HERO
==================================================
*/

.sw-post-style6{
background:#fff;
border-radius:32px;
padding:20px;
box-shadow:0 15px 40px rgba(0,0,0,.06);
}

.sw-post-style6 .sw-post-thumb img{
aspect-ratio:16/9;
}

/*
/*
========================================
STYLE 7 FIXED
========================================
*/

.sw-posts-grid.style7{
display:grid;
grid-template-columns:1.7fr .9fr;
gap:24px;
align-items:start;
}

.sw-hero-side{
display:flex;
flex-direction:column;
gap:18px;
}

/*
MAIN HERO
*/

.sw-hero-main .sw-post-style7{
position:relative;
overflow:hidden;
border-radius:28px;
min-height:620px;
display:flex;
align-items:flex-end;
background:#000;
}

.sw-hero-main .sw-post-thumb{
position:absolute;
inset:0;
height:100%;
}

.sw-hero-main .sw-post-thumb img{
width:100%;
height:100%;
object-fit:cover;
}

.sw-hero-main .sw-post-thumb::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(
to top,
rgba(0,0,0,.9),
rgba(0,0,0,.15)
);
}

.sw-hero-main .sw-post-content{
position:relative;
z-index:5;
padding:34px;
}

.sw-hero-main .sw-post-title{
font-size:44px;
line-height:1.5;
font-weight:900;
}

.sw-hero-main .sw-post-title a{
color:#fff;
}

/*
SIDE POSTS
*/

.sw-hero-side .sw-post-style7{
display:flex;
align-items:center;
gap:14px;
background:#fff;
padding:12px;
border-radius:20px;
box-shadow:0 8px 24px rgba(0,0,0,.04);
}

.sw-hero-side .sw-post-thumb{
width:110px;
min-width:110px;
}

.sw-hero-side .sw-post-thumb img{
aspect-ratio:1/1;
object-fit:cover;
}

.sw-hero-side .sw-post-content{
padding:0;
}

.sw-hero-side .sw-post-title{
font-size:17px;
line-height:1.7;
}

/*
MOBILE
*/

@media(max-width:991px){

.sw-posts-grid.style7{
grid-template-columns:1fr;
}

.sw-hero-main .sw-post-style7{
min-height:420px;
}

}

==================================================
STYLE 8
MAGAZINE
==================================================
*/

.sw-post-style8 .sw-post-thumb img{
aspect-ratio:4/3;
border-radius:26px;
}

.sw-post-style8 .sw-post-title{
font-size:24px;
margin-top:16px;
}

/*
==================================================
STYLE 9
SMALL LIST
==================================================
*/

.sw-post-style9{
display:flex;
gap:12px;
align-items:center;
}

.sw-post-style9 .sw-post-thumb{
width:85px;
min-width:85px;
}

.sw-post-style9 .sw-post-thumb img{
aspect-ratio:1/1;
border-radius:14px;
}

.sw-post-style9 .sw-post-title{
font-size:15px;
}

/*
==================================================
STYLE 10
TRANSPARENT
==================================================
*/

.sw-post-style10{
background:transparent;
}

.sw-post-style10 .sw-post-thumb img{
border-radius:30px;
aspect-ratio:16/9;
}

/*
==================================================
LINKS NO THUMB
==================================================
*/

.sw-post-links_no_thumb{
padding:16px 0;
border-bottom:1px solid #eee;
}

.sw-post-links_no_thumb .sw-post-thumb{
display:none;
}

.sw-post-links_no_thumb .sw-post-title{
font-size:18px;
}

/*
==================================================
DARK MODE
==================================================
*/

body.dark-mode .sw-post-title a{
color:#fff;
}

body.dark-mode .sw-post-style1,
body.dark-mode .sw-post-style2,
body.dark-mode .sw-post-style5,
body.dark-mode .sw-post-style6,
body.dark-mode .sw-post-style7:not(:first-child){
background:#111827;
}

/*
==================================================
MOBILE
==================================================
*/

@media(max-width:991px){

.sw-posts-grid.style7{
grid-template-columns:1fr;
}

.sw-post-style7:first-child{
min-height:420px;
}

.sw-post-style7:first-child .sw-post-title{
font-size:30px;
}

}

@media(max-width:767px){

.sw-post-style1,
.sw-post-style5,
.sw-post-style7:not(:first-child){
flex-direction:column;
}

.sw-post-style1 .sw-post-thumb,
.sw-post-style5 .sw-post-thumb,
.sw-post-style7:not(:first-child) .sw-post-thumb{
width:100%;
}

.sw-post-title{
font-size:18px;
}

}