/*=================================================
HOME LAYOUT
=================================================*/

.ok-home{
	width:100%;
	padding:24px 0 48px;
}

.ok-home-inner{
	width:100%;
	max-width:1280px;
	margin-inline:auto;
	padding-inline:24px;
	box-sizing:border-box;
}

.ok-fp-section{
	position:relative;
	margin:0 0 52px;
}

/*=================================================
SECTION HEADER
=================================================*/

.ok-fp-head{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:20px;
	margin-bottom:24px;
	padding-bottom:14px;
	border-bottom:2px solid #ececec;
}

.ok-fp-head::after{
	content:"";
	position:absolute;
	left:0;
	bottom:-2px;
	width:74px;
	height:3px;
	border-radius:999px;
	background:var(--ok-primary,#e10600);
}

.ok-fp-title{
	display:flex;
	align-items:center;
	gap:12px;
	margin:0;
	font-size:28px;
	font-weight:800;
	line-height:1.3;
	letter-spacing:-.02em;
	color:#111827;
}

.ok-fp-icon{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:26px;
	height:26px;
	flex-shrink:0;
	color:var(--ok-primary,#e10600);
}

.ok-fp-icon svg{
	display:block;
	width:100%;
	height:100%;
	fill:none;
	stroke:currentColor;
	stroke-width:2;
	stroke-linecap:round;
	stroke-linejoin:round;
}

.ok-fp-more{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:15px;
	font-weight:700;
	line-height:1;
	color:var(--ok-primary,#e10600);
	text-decoration:none;
	transition:color .25s ease,gap .25s ease;
}

.ok-fp-more svg{
	width:18px;
	height:18px;
	flex-shrink:0;
	transition:transform .25s ease;
}

.ok-fp-more:hover{
	color:#c70000;
	gap:10px;
	text-decoration:none;
}

.ok-fp-more:hover svg{
	transform:translateX(4px);
}

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

.ok-home a{
	text-decoration:none;
	transition:color .25s ease,background .25s ease,border-color .25s ease,transform .25s ease;
}

.ok-home a:hover{
	text-decoration:none;
}

.ok-home h2 a,
.ok-home h3 a,
.ok-home h4 a{
	color:inherit;
	text-decoration:none;
	transition:color .25s ease,text-decoration-color .25s ease;
}

.ok-home h2 a:hover,
.ok-home h3 a:hover,
.ok-home h4 a:hover{
	color:var(--ok-primary,#e10600);
	text-decoration:underline;
	text-decoration-thickness:2px;
	text-underline-offset:3px;
}

.ok-home a:focus-visible{
	outline:2px solid var(--ok-primary,#e10600);
	outline-offset:3px;
	border-radius:6px;
}

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

.ok-home img{
	display:block;
	width:100%;
	max-width:100%;
	height:auto;
	object-fit:cover;
	user-select:none;
	-webkit-user-drag:none;
	backface-visibility:hidden;
	transform:translateZ(0);
}

/*=================================================
COMMON CARD EFFECT
=================================================*/

.ok-breaking-item,
.ok-latest-card,
.ok-home-card,
.ok-scroll-card,
.ok-card,
.ok-list-item{
	backface-visibility:hidden;
	transform:translateZ(0);
	will-change:transform;
	transition:
	transform .25s ease,
	box-shadow .25s ease,
	border-color .25s ease,
	background .25s ease;
}

/*=================================================
COMMON IMAGE HOVER
=================================================*/

.ok-featured-thumb,
.ok-home-thumb,
.ok-scroll-card,
.ok-card,
.ok-list-item{
	overflow:hidden;
}

.ok-featured-thumb img,
.ok-home-thumb img,
.ok-scroll-card img,
.ok-card img,
.ok-list-item img{
	transition:transform .45s ease,filter .3s ease;
}

.ok-latest-card:hover img,
.ok-home-card:hover img,
.ok-scroll-card:hover img,
.ok-card:hover img,
.ok-list-item:hover img{
	transform:scale(1.05);
	filter:brightness(.97);
}

/*=================================================
BREAKING NEWS
=================================================*/

.ok-breaking-list{
	display:flex;
	flex-direction:column;
	gap:12px;
}

.ok-breaking-item{
	background:#fff;
	border:1px solid #ececec;
	border-left:4px solid var(--ok-primary,#e10600);
	border-radius:14px;
	box-shadow:0 3px 12px rgba(0,0,0,.04);
}

.ok-breaking-item:hover{
	transform:translateX(4px);
	box-shadow:0 10px 22px rgba(0,0,0,.08);
}

.ok-breaking-item a{
	display:flex;
	align-items:center;
	gap:12px;
	padding:14px 16px;
	color:#181818;
	font-size:16px;
	font-weight:600;
	line-height:1.5;
}

.ok-breaking-item svg{
	flex-shrink:0;
	width:18px;
	height:18px;
	color:var(--ok-primary,#e10600);
}

.ok-breaking-item span{
	flex:1;
	min-width:0;
	transition:color .25s ease,text-decoration-color .25s ease;
}

.ok-breaking-item:hover span{
	color:var(--ok-primary,#e10600);
	text-decoration:underline;
	text-decoration-thickness:2px;
	text-underline-offset:3px;
}

/*=================================================
PART 1B : LATEST NEWS
FEATURED ARTICLE • SMALL CARDS
=================================================*/

/*=================================================
LATEST GRID
=================================================*/

.ok-latest-grid{
	grid-template-columns:minmax(0,1.65fr) minmax(320px,.95fr);
	gap:28px;
	align-items:start;
}

.ok-latest-grid > article:not(:first-child){
	margin-bottom:18px;
}

/*=================================================
FEATURED CARD
=================================================*/

.ok-latest-card{
	background:#fff;
	border:1px solid #e9e9e9;
	border-radius:22px;
	overflow:hidden;
	box-shadow:0 6px 22px rgba(0,0,0,.05);
}

.ok-latest-card:hover{
	transform:translateY(-3px);
	box-shadow:0 16px 38px rgba(0,0,0,.10);
}

.ok-latest-card>a{
	display:block;
	color:inherit;
}

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

.ok-featured-thumb{
	position:relative;
	background:#f5f5f5;
}

.ok-featured-thumb img{
	display:block;
	width:100%;
	aspect-ratio:16/9;
	object-fit:cover;
}

.ok-latest-card:hover .ok-featured-thumb img{
	transform:scale(1.05);
}

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

.ok-featured-content{
	padding:24px;
}

.ok-featured-title{
	margin:0 0 14px;
	font-size:31px;
	font-weight:800;
	line-height:1.28;
	letter-spacing:-.02em;
	color:#171717;
	transition:color .25s ease;
}

.ok-latest-card:hover .ok-featured-title{
	color:var(--ok-primary,#e10600);
	text-decoration:underline;
	text-decoration-thickness:2px;
	text-underline-offset:4px;
}

.ok-featured-excerpt{
	margin:0 0 18px;
	font-size:15px;
	line-height:1.8;
	color:#555;
}

.ok-featured-meta{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:10px;
	font-size:13px;
	color:#6b7280;
}

.ok-featured-meta span{
	display:inline-flex;
	align-items:center;
}

.ok-meta-cat{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:5px 12px;
	border-radius:999px;
	background:var(--ok-primary,#e10600);
	color:#fff;
	font-size:12px;
	font-weight:700;
	letter-spacing:.02em;
}

.ok-read{
	display:none;
}

/*=================================================
LATEST SMALL CARDS
=================================================*/

.ok-home-card{
	display:flex;
	align-items:flex-start;
	gap:14px;
	padding:10px;
	background:#fff;
	border:1px solid #e9e9e9;
	border-radius:18px;
	box-shadow:0 4px 16px rgba(0,0,0,.05);
}

.ok-home-card:hover{
	transform:translateY(-2px);
	box-shadow:0 12px 30px rgba(0,0,0,.08);
}

/*=================================================
THUMBNAIL
=================================================*/

.ok-home-thumb{
	position:relative;
	flex:0 0 40%;
	border-radius:14px;
	background:#f5f5f5;
	overflow:hidden;
}

.ok-home-thumb img{
	display:block;
	width:100%;
	aspect-ratio:16/9;
	object-fit:cover;
}

.ok-home-card:hover .ok-home-thumb img{
	transform:scale(1.05);
}

.ok-home-badge{
	position:absolute;
	top:10px;
	left:10px;
	z-index:2;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:5px 12px;
	border-radius:999px;
	background:var(--ok-primary,#e10600);
	color:#fff;
	font-size:12px;
	font-weight:700;
	line-height:1;
}

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

.ok-home-content{
	flex:1;
	min-width:0;
}

.ok-home-title{
	margin:0 0 8px;
	font-size:18px;
	font-weight:700;
	line-height:1.45;
}

.ok-home-title a{
	color:#181818;
	text-decoration:none;
}

.ok-home-title a:hover{
	color:var(--ok-primary,#e10600);
	text-decoration:underline;
	text-decoration-thickness:2px;
	text-underline-offset:3px;
}

.ok-home-meta{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:8px;
	margin-bottom:10px;
	font-size:13px;
	color:#6b7280;
}

.ok-home-excerpt{
	margin:0;
	font-size:14px;
	line-height:1.75;
	color:#555;
}

.ok-home-readmore{
	display:none;
}

/*=================================================
PART 2 : HORIZONTAL SLIDER
GRID CARDS • ENTERTAINMENT
=================================================*/

/*=================================================
HORIZONTAL SLIDER
=================================================*/

.ok-scroll-wrapper{
	position:relative;
}

.ok-scroll{
	display:flex;
	gap:22px;
	overflow-x:auto;
	padding:2px 2px 12px;
	scroll-behavior:smooth;
	scroll-snap-type:x proximity;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:none;
}

.ok-scroll::-webkit-scrollbar{
	display:none;
}

/*=================================================
SLIDER CARD
=================================================*/

.ok-scroll-card{
	flex:0 0 clamp(240px,22vw,290px);
	position:relative;
	border-radius:20px;
	background:#111827;
	overflow:hidden;
	scroll-snap-align:start;
	box-shadow:0 6px 22px rgba(0,0,0,.08);
}

.ok-scroll-card:hover{
	transform:translateY(-4px);
	box-shadow:0 16px 38px rgba(0,0,0,.14);
}

.ok-scroll-card>a{
	display:block;
	position:relative;
	color:#fff;
}

.ok-scroll-card img{
	display:block;
	width:100%;
	height:350px;
	object-fit:cover;
}

.ok-scroll-card h4{
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	margin:0;
	padding:42px 18px 18px;
	font-size:17px;
	font-weight:700;
	line-height:1.45;
	color:#fff;
	background:linear-gradient(to top,rgba(0,0,0,.95),rgba(0,0,0,.45),transparent);
	transition:color .25s ease,text-decoration-color .25s ease;
}

.ok-scroll-card:hover h4{
	color:#fff;
	text-decoration:underline;
	text-decoration-thickness:2px;
	text-underline-offset:3px;
}

/*=================================================
SLIDER BUTTONS
=================================================*/

.ok-scroll-btn{
	position:absolute;
	top:50%;
	width:46px;
	height:46px;
	display:flex;
	align-items:center;
	justify-content:center;
	border:0;
	border-radius:50%;
	background:#fff;
	color:#181818;
	cursor:pointer;
	box-shadow:0 8px 24px rgba(0,0,0,.18);
	transform:translateY(-50%);
	z-index:5;
	opacity:0;
	visibility:hidden;
	transition:all .25s ease;
}

.ok-scroll-wrapper:hover .ok-scroll-btn{
	opacity:1;
	visibility:visible;
}

.ok-scroll-btn:hover{
	background:var(--ok-primary,#e10600);
	color:#fff;
}

.ok-scroll-btn.prev{
	left:-22px;
}

.ok-scroll-btn.next{
	right:-22px;
}

.ok-scroll-btn svg{
	width:20px;
	height:20px;
}

/*=================================================
GRID LAYOUT
=================================================*/

.ok-grid{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(290px,1fr));
	gap:24px;
	align-items:start;
}

/*=================================================
GRID CARD
=================================================*/

.ok-card{
	background:#fff;
	border:1px solid #e9e9e9;
	border-radius:18px;
	overflow:hidden;
	box-shadow:0 4px 16px rgba(0,0,0,.05);
}

.ok-card:hover{
	transform:translateY(-3px);
	box-shadow:0 14px 34px rgba(0,0,0,.09);
}

.ok-card>a{
	display:block;
	color:inherit;
}

.ok-card img{
	display:block;
	width:100%;
	aspect-ratio:16/9;
	object-fit:cover;
}

.ok-card h4{
	margin:0;
	padding:16px;
	font-size:18px;
	font-weight:700;
	line-height:1.5;
	color:#181818;
	transition:color .25s ease,text-decoration-color .25s ease;
}

.ok-card:hover h4{
	color:var(--ok-primary,#e10600);
	text-decoration:underline;
	text-decoration-thickness:2px;
	text-underline-offset:3px;
}

/*=================================================
ENTERTAINMENT LIST
=================================================*/

.ok-list{
	display:flex;
	flex-direction:column;
	gap:16px;
}

.ok-list-item{
	background:rgba(255,255,255,.05);
	border:1px solid rgba(255,255,255,.08);
	border-radius:18px;
	overflow:hidden;
}

.ok-list-item:hover{
	transform:translateY(-2px);
	background:rgba(255,255,255,.08);
	border-color:rgba(255,255,255,.14);
}

.ok-list-item>a{
	display:flex;
	align-items:flex-start;
	gap:16px;
	padding:10px;
	color:#161616;
}

.ok-list-item img{
	flex-shrink:0;
	width:130px;
	height:82px;
	border-radius:12px;
	object-fit:cover;
}

.ok-list-item h4{
	margin:0;
	font-size:17px;
	font-weight:700;
	line-height:1.45;
	color:#161616;
	transition:color .25s ease,text-decoration-color .25s ease;
}

.ok-list-item:hover h4{
	color:#e10600;
	text-decoration:underline;
	text-decoration-thickness:2px;
	text-underline-offset:3px;
}

/*=================================================
RESPONSIVE PART 1
LARGE DESKTOP • DESKTOP OPTIMIZATION
(1200px and Above)
=================================================*/

@media (min-width:1200px){

	.ok-home-inner{
		max-width:1280px;
		padding-inline:24px;
	}

	/*=========================================
	SECTION SPACING
	=========================================*/

	.ok-fp-section{
		margin-bottom:clamp(52px,4vw,72px);
	}

	.ok-fp-head{
		margin-bottom:28px;
		padding-bottom:15px;
	}

	.ok-fp-head::after{
		width:84px;
	}

	/*=========================================
	TYPOGRAPHY
	=========================================*/

	.ok-fp-title{
		font-size:clamp(28px,1.9vw,34px);
	}

	.ok-fp-more{
		font-size:15px;
	}

	.ok-featured-title{
		font-size:clamp(30px,2vw,38px);
		line-height:1.28;
	}

	.ok-featured-excerpt{
		font-size:16px;
		line-height:1.85;
	}

	.ok-home-title{
		font-size:19px;
		line-height:1.5;
	}

	.ok-card h4{
		font-size:18px;
		line-height:1.55;
	}

	.ok-scroll-card h4{
		font-size:18px;
		line-height:1.5;
	}

	.ok-list-item h4{
		font-size:18px;
		line-height:1.55;
	}

	/*=========================================
	LATEST SECTION
	=========================================*/

	.ok-latest-grid{
		grid-template-columns:1.7fr 1fr;
		gap:32px;
	}

	/*=========================================
	AUTO GRID
	=========================================*/

	.ok-grid{
		grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
		gap:28px;
	}

	/*=========================================
	HORIZONTAL SLIDER
	=========================================*/

	.ok-scroll{
		gap:24px;
	}

	.ok-scroll-card{
		flex:0 0 285px;
	}

	.ok-scroll-card img{
		height:370px;
	}

	/*=========================================
	ENTERTAINMENT LIST
	=========================================*/

	.ok-list{
		gap:18px;
	}

	.ok-list-item a{
		padding:12px;
		gap:18px;
	}

	.ok-list-item img{
		width:145px;
		height:92px;
	}

}

/*=================================================
RESPONSIVE PART 2
LAPTOP • TABLET
(992px – 1199px)
=================================================*/

@media (min-width:992px) and (max-width:1199px){

	/*=========================================
	CONTAINER
	=========================================*/

	.ok-home-inner{
	padding-inline:22px;
    }

	.ok-fp-section{
		margin-bottom:56px;
	}

	/*=========================================
	SECTION HEADER
	=========================================*/

	.ok-fp-head{
		margin-bottom:24px;
		padding-bottom:14px;
	}

	.ok-fp-title{
		font-size:30px;
	}

	.ok-fp-more{
		font-size:15px;
	}

	/*=========================================
	LATEST NEWS
	=========================================*/

	.ok-latest-grid{
		grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);
		gap:24px;
		align-items:start;
	}

	.ok-featured-content{
		padding:20px;
	}

	.ok-featured-title{
		font-size:29px;
		line-height:1.35;
	}

	.ok-featured-excerpt{
		font-size:15px;
		line-height:1.8;
	}

	.ok-home-card{
		padding:10px;
		gap:12px;
	}

	.ok-home-title{
		font-size:18px;
	}

	.ok-home-excerpt{
		font-size:14px;
	}

	/*=========================================
	AUTO GRID
	=========================================*/

	.ok-grid{
		grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
		gap:22px;
	}

	.ok-card h4{
		padding:15px;
		font-size:17px;
	}

	/*=========================================
	HORIZONTAL SCROLL
	=========================================*/

	.ok-scroll{
		gap:20px;
	}

	.ok-scroll-card{
		flex:0 0 255px;
	}

	.ok-scroll-card img{
		height:335px;
	}

	.ok-scroll-card h4{
		padding:30px 15px 15px;
		font-size:17px;
	}

	/*=========================================
	SCROLL BUTTONS
	=========================================*/

	.ok-scroll-btn{
		width:42px;
		height:42px;
	}

	.ok-scroll-btn.prev{
		left:-18px;
	}

	.ok-scroll-btn.next{
		right:-18px;
	}

	/*=========================================
	ENTERTAINMENT
	=========================================*/

	.ok-list{
		gap:16px;
	}

	.ok-list-item a{
		padding:10px;
		gap:16px;
	}

	.ok-list-item img{
		width:125px;
		height:82px;
	}

	.ok-list-item h4{
		font-size:17px;
	}

}

/*=================================================
RESPONSIVE PART 3
TABLET
(768px – 991px)
=================================================*/

@media (min-width:768px) and (max-width:991px){

	/*=========================================
	CONTAINER
	=========================================*/

	.ok-home-inner{
	padding-inline:18px;
    }

	.ok-fp-section{
		margin-bottom:48px;
	}

	/*=========================================
	SECTION HEADER
	=========================================*/

	.ok-fp-head{
		margin-bottom:22px;
		padding-bottom:14px;
	}

	.ok-fp-title{
		font-size:26px;
	}

	.ok-fp-more{
		font-size:14px;
	}

	/*=========================================
	LATEST NEWS
	=========================================*/

	.ok-latest-grid{
		grid-template-columns:1fr;
		gap:24px;
	}

	.ok-featured-content{
		padding:20px;
	}

	.ok-featured-title{
		font-size:28px;
		line-height:1.35;
	}

	.ok-featured-excerpt{
		font-size:15px;
		line-height:1.8;
	}

	.ok-home-card{
		padding:10px;
		gap:14px;
	}

	.ok-home-thumb{
		flex:0 0 36%;
	}

	.ok-home-title{
		font-size:18px;
		line-height:1.45;
	}

	.ok-home-meta{
		font-size:13px;
	}

	/*=========================================
	AUTO GRID
	=========================================*/

	.ok-grid{
		grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
		gap:20px;
	}

	.ok-card h4{
		padding:15px;
		font-size:17px;
	}

	/*=========================================
	HORIZONTAL SCROLL
	=========================================*/

	.ok-scroll{
		gap:18px;
	}

	.ok-scroll-card{
		flex:0 0 240px;
	}

	.ok-scroll-card img{
		height:320px;
	}

	.ok-scroll-card h4{
		padding:28px 14px 14px;
		font-size:16px;
	}

	.ok-scroll-btn{
		display:none;
	}

	/*=========================================
	ENTERTAINMENT
	=========================================*/

	.ok-list{
		gap:14px;
	}

	.ok-list-item a{
		padding:10px;
		gap:14px;
	}

	.ok-list-item img{
		width:118px;
		height:78px;
	}

	.ok-list-item h4{
		font-size:16px;
		line-height:1.5;
	}

}

/*=================================================
RESPONSIVE PART 4
MOBILE
(481px – 767px)
=================================================*/

@media (min-width:481px) and (max-width:767px){

	/*=========================================
	CONTAINER
	=========================================*/

	.ok-home{
		padding:20px 0 40px;
	}

	.ok-home-inner{
	padding-inline:16px;
    }

	.ok-fp-section{
		margin-bottom:40px;
	}

	/*=========================================
	SECTION HEADER
	=========================================*/

	.ok-fp-head{
		gap:14px;
		margin-bottom:18px;
		padding-bottom:12px;
		flex-wrap:wrap;
	}

	.ok-fp-head::after{
		width:64px;
	}

	.ok-fp-title{
		font-size:24px;
		line-height:1.35;
	}

	.ok-fp-icon{
		width:22px;
		height:22px;
	}

	.ok-fp-more{
		font-size:14px;
	}

	/*=========================================
	LATEST SECTION
	=========================================*/

	.ok-latest-grid{
		grid-template-columns:1fr;
		gap:20px;
	}

	.ok-featured-content{
		padding:18px;
	}

	.ok-featured-title{
		font-size:24px;
		line-height:1.4;
	}

	.ok-featured-excerpt{
		margin-bottom:14px;
		font-size:14px;
		line-height:1.75;
	}

	.ok-featured-meta{
		gap:8px;
		font-size:12px;
	}

	/*=========================================
	SMALL LATEST CARDS
	=========================================*/

	.ok-home-card{
		gap:12px;
		padding:10px;
	}

	.ok-home-thumb{
		flex:0 0 38%;
	}

	.ok-home-title{
		font-size:16px;
		line-height:1.45;
	}

	.ok-home-meta{
		gap:6px;
		margin-bottom:8px;
		font-size:12px;
	}

	.ok-home-excerpt{
		display:none;
	}

	/*=========================================
	AUTO GRID
	=========================================*/

	.ok-grid{
		grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
		gap:18px;
	}

	.ok-card h4{
		padding:14px;
		font-size:16px;
	}

	/*=========================================
	HORIZONTAL CARDS
	=========================================*/

	.ok-scroll{
		gap:16px;
		padding-bottom:10px;
	}

	.ok-scroll-card{
		flex:0 0 220px;
	}

	.ok-scroll-card img{
		height:285px;
	}

	.ok-scroll-card h4{
		padding:24px 14px 14px;
		font-size:15px;
	}

	.ok-scroll-btn{
		display:none;
	}

	/*=========================================
	ENTERTAINMENT
	=========================================*/

	.ok-list{
		gap:12px;
	}

	.ok-list-item a{
		gap:12px;
		padding:10px;
	}

	.ok-list-item img{
		width:105px;
		height:72px;
	}

	.ok-list-item h4{
		font-size:15px;
		line-height:1.45;
	}

}

/*=================================================
RESPONSIVE PART 5
SMALL MOBILE
(320px – 480px)
=================================================*/

@media (max-width:480px){

	/*=========================================
	CONTAINER
	=========================================*/

	.ok-home{
		padding:16px 0 32px;
	}

	.ok-home-inner{
	padding-inline:12px;
    }

	.ok-fp-section{
		margin-bottom:34px;
	}

	/*=========================================
	SECTION HEADER
	=========================================*/

	.ok-fp-head{
		flex-wrap:wrap;
		align-items:flex-start;
		gap:10px;
		margin-bottom:16px;
		padding-bottom:10px;
	}

	.ok-fp-head::after{
		width:56px;
		height:3px;
	}

	.ok-fp-title{
		font-size:22px;
		line-height:1.35;
	}

	.ok-fp-icon{
		width:20px;
		height:20px;
	}

	.ok-fp-more{
		font-size:13px;
		gap:6px;
	}

	.ok-fp-more svg{
		width:16px;
		height:16px;
	}

	/*=========================================
	LATEST SECTION
	=========================================*/

	.ok-latest-grid{
		grid-template-columns:1fr;
		gap:18px;
	}

	.ok-latest-card{
		border-radius:18px;
	}

	.ok-featured-content{
		padding:16px;
	}

	.ok-featured-title{
		font-size:21px;
		line-height:1.4;
	}

	.ok-featured-excerpt{
		margin-bottom:12px;
		font-size:14px;
		line-height:1.7;
	}

	.ok-featured-meta{
		gap:6px;
		font-size:11px;
	}

	.ok-meta-cat{
		padding:4px 10px;
		font-size:11px;
	}

	/*=========================================
	HOME CARDS
	=========================================*/

	.ok-home-card{
		gap:10px;
		padding:8px;
		border-radius:16px;
	}

	.ok-home-thumb{
		flex:0 0 36%;
		border-radius:12px;
	}

	.ok-home-badge{
		top:8px;
		left:8px;
		padding:4px 9px;
		font-size:10px;
	}

	.ok-home-title{
		font-size:15px;
		line-height:1.4;
		margin-bottom:6px;
	}

	.ok-home-meta{
		gap:5px;
		margin-bottom:0;
		font-size:11px;
	}

	.ok-home-excerpt,
	.ok-home-readmore{
		display:none;
	}

	/*=========================================
	AUTO GRID
	=========================================*/

	.ok-grid{
		grid-template-columns:repeat(auto-fit,minmax(100%,1fr));
		gap:16px;
	}

	.ok-card{
		border-radius:16px;
	}

	.ok-card h4{
		padding:13px;
		font-size:15px;
		line-height:1.45;
	}

	/*=========================================
	HORIZONTAL SCROLL
	=========================================*/

	.ok-scroll{
		gap:14px;
		padding-bottom:8px;
		scroll-padding-inline:12px;
	}

	.ok-scroll-card{
		flex:0 0 200px;
		border-radius:16px;
	}

	.ok-scroll-card img{
		height:260px;
	}

	.ok-scroll-card h4{
		padding:20px 12px 12px;
		font-size:14px;
		line-height:1.45;
	}

	.ok-scroll-btn{
		display:none;
	}

	/*=========================================
	ENTERTAINMENT
	=========================================*/

	.ok-list{
		gap:10px;
	}

	.ok-list-item{
		border-radius:14px;
	}

	.ok-list-item a{
		gap:10px;
		padding:8px;
	}

	.ok-list-item img{
		width:92px;
		height:64px;
		border-radius:10px;
	}

	.ok-list-item h4{
		font-size:14px;
		line-height:1.4;
	}

	/*=========================================
	TOUCH OPTIMIZATION
	=========================================*/

	.ok-fp-more,
	.ok-home-title a,
	.ok-card a,
	.ok-list-item a,
	.ok-scroll-card a{
		-webkit-tap-highlight-color:transparent;
	}

	.ok-home a,
	.ok-scroll-card a,
	.ok-card a,
	.ok-list-item a{
		touch-action:manipulation;
	}

}