:root {
	--bi-container-width: 1240px;

	--bi-font-body: 'Jost', sans-serif;
	--bi-font-heading: 'Oswald', sans-serif;

	--bi-text-primary: #111111;
	--bi-text-secondary: #6b7280;

	--bi-green: #16a34a;
}

a:hover {
	text-decoration: none;
}


/* =================================
   NEWS DETAIL PAGE
================================= */

.bi-news-detail {
	padding: 50px 0;
}


/* main layout */

.bi-news-detail-layout {
	display: grid;
	grid-template-columns: 1fr 340px;
	gap: 40px;
}


/* =================================
   LEFT ARTICLE
================================= */

.bi-news-article {
	max-width: 100%;
}


/* =================================
   SIDEBAR
================================= */

.bi-news-sidebar {
	width: 100%;
}


/* =================================
   RESPONSIVE
================================= */

@media (max-width:992px) {

	.bi-news-detail-layout {
		grid-template-columns: 1fr;
	}

}


/* =================================
   NEWS DETAIL HEADER
================================= */

.bi-news-detail-header {
	margin-bottom: 40px;
}


/* CATEGORY */

.bi-news-detail-category {

	font-size: 12px;
	font-weight: 700;

	letter-spacing: 1px;

	margin-bottom: 10px;

}


/* TITLE */

.bi-news-detail-title {

	font-size: 42px;
	font-weight: 800;

	line-height: 1.2;

	margin-bottom: 15px;

}


/* INTRO */

.bi-news-detail-intro {

	font-size: 16px;
	color: #444;

	line-height: 1.7;

	margin-bottom: 20px;

}


/* SHARE ICONS */

.bi-news-detail-share {

	display: flex;
	gap: 15px;

	margin-bottom: 15px;

}

.bi-news-detail-share a {

	color: #000;
	font-size: 14px;

	text-decoration: none;

}


/* META */

.bi-news-detail-meta {

	font-size: 13px;
	color: #666;

	margin-bottom: 25px;

	display: flex;
	flex-wrap: wrap;
	align-items: center;

}

.bi-news-dot {
	margin: 0 10px;
}


/* IMAGE */

.bi-news-detail-image img {

	width: 100%;
	border-radius: 4px;

}


/* STATS */

.bi-news-detail-stats {

	display: flex;
	justify-content: space-between;

	font-size: 13px;
	color: #555;

	margin-top: 10px;

}

.bi-news-stats-left {

	display: flex;
	gap: 20px;

}

.bi-news-stats-right {

	display: flex;
	gap: 15px;

}

.bi-news-stats-right a {

	text-decoration: none;
	color: #555;

}


/* =================================
   RESPONSIVE
================================= */

@media (max-width:992px) {

	.bi-news-detail-title {
		font-size: 34px;
	}

}

@media (max-width:768px) {

	.bi-news-detail-title {
		font-size: 26px;
	}

	.bi-news-detail-stats {
		flex-direction: column;
		gap: 10px;
	}

}


/* =================================
   NEWS ARTICLE CONTENT
================================= */

.bi-news-article-content {

	margin-top: 30px;

	font-size: 16px;
	line-height: 1.8;
	color: #333;

}


/* paragraphs */

.bi-news-article-content p {

	margin-bottom: 18px;

	

}

.bi-news-article-content p img {
	padding-left: 20px;
	padding-right: 20px;
}


/* red quote */

.bi-news-highlight-quote {

	color: #e50914;

	font-size: 18px;
	font-weight: 700;

	line-height: 1.8;

	margin: 25px 0;

}


/* subtitle */

.bi-news-subtitle {

	font-size: 28px;
	font-weight: 800;

	margin: 30px 0 10px;

}


/* =================================
   RESPONSIVE
================================= */

@media (max-width:768px) {

	.bi-news-highlight-quote {

		font-size: 16px;

	}

	.bi-news-subtitle {

		font-size: 22px;

	}

}

/* =================================
   NEWS ARTICLE BODY
================================= */

.bi-news-article-body {

	font-size: 16px;
	line-height: 1.8;
	color: #333;

}


/* paragraph */

.bi-news-article-body p {
	margin-bottom: 18px;
}


/* section title */

.bi-news-section-title {

	font-size: 30px;
	font-weight: 800;

	margin: 35px 0 15px;

}


/* article images */

.bi-news-article-image {

	margin: 30px 0;
	text-align: center;

}

.bi-news-article-image img {

	width: 100%;
	max-width: 850px;

	border-radius: 4px;

}


/* bold paragraph */

.bi-news-bold-text {

	font-weight: 700;

}


/* red quote */

.bi-news-highlight-quote {

	color: #e50914;

	font-size: 18px;
	font-weight: 700;

	margin: 25px 0;

}


/* box item */

.bi-news-box-item {

	margin-top: 30px;

}

.bi-news-box-item h3 {

	font-size: 26px;
	font-weight: 800;

	margin-bottom: 10px;

}


/* caption */

.bi-news-caption {

	margin-top: 25px;

}

.bi-news-caption h3 {

	font-size: 24px;
	font-weight: 800;

	margin-bottom: 10px;

}


/* =================================
   RESPONSIVE
================================= */

@media (max-width:992px) {

	.bi-news-section-title {
		font-size: 24px;
	}

}


@media (max-width:768px) {

	.bi-news-article-body {
		font-size: 15px;
	}

	.bi-news-highlight-quote {
		font-size: 16px;
	}

}

/* =================================
   COMMENT FORM
================================= */

.bi-news-comment-wrapper {

	margin-top: 40px;

}


.bi-news-comment-card {

	background: #fff;

	padding: 40px;

	border-radius: 10px;

	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);

}


/* title */

.bi-news-comment-title {

	font-size: 28px;

	font-weight: 800;

	margin-bottom: 10px;

}


.bi-news-comment-note {

	font-size: 14px;

	color: #666;

	margin-bottom: 30px;

}


/* form row */

.bi-news-form-row {

	display: flex;

	gap: 40px;

	margin-bottom: 25px;

}


/* form group */

.bi-news-form-group {

	flex: 1;

	display: flex;

	flex-direction: column;

}


/* labels */

.bi-news-form-group label {

	font-size: 14px;

	margin-bottom: 8px;

}


/* inputs */

.bi-news-form-group input,
.bi-news-form-group textarea {

	border: none;

	border-bottom: 1px solid #ddd;

	background: transparent;

	padding: 8px 0;

	font-size: 15px;

	outline: none;

}


/* textarea */

.bi-news-message {

	margin-bottom: 30px;

}


/* button */

.bi-news-comment-btn {

	background: #e50914;

	color: #fff;

	border: none;

	padding: 14px 28px;

	border-radius: 6px;

	font-weight: 600;

	cursor: pointer;

}


.bi-news-comment-btn:hover {

	background: #c80710;

}


/* =================================
   RESPONSIVE
================================= */

@media (max-width:768px) {

	.bi-news-form-row {

		flex-direction: column;

		gap: 20px;

	}

	.bi-news-comment-card {

		padding: 25px;

	}

}


@media (max-width:480px) {

	.bi-news-comment-title {

		font-size: 22px;

	}

}


/* =================================
   TIME + SHARE (inline inside .bi-news-detail-meta; homepage card pattern)
================================= */

/* .bi-news-detail-time-share { ... } — old full-width row; merged into meta line */

.bi-news-detail-meta-time-share {

	display: inline-flex;
	align-items: center;
	gap: 10px;

	white-space: nowrap;

}

.bi-news-detail-reltime {

	display: inline-flex;
	align-items: center;
	gap: 6px;

}

.bi-news-detail-meta .bi-news-detail-share-trigger img {

	display: block;

}


/* Share popup (same as homepage Real People Real Stories / event detail) */

.bi-share-popup {

	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 9999;

}

.bi-share-popup.active {

	display: flex;

}

.bi-share-box {

	background: #fff;
	padding: 24px;
	border-radius: 14px;
	width: 280px;
	text-align: center;
	animation: biNewsDetailPopupIn 0.25s ease;

}

@keyframes biNewsDetailPopupIn {

	from {
		transform: scale(0.8);
		opacity: 0;
	}

	to {
		transform: scale(1);
		opacity: 1;
	}

}

.bi-share-box h4 {

	margin-bottom: 18px;
	font-family: 'Oswald', sans-serif;

}

.bi-share-options {

	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;

}

.bi-share-options a {

	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: #f3f4f6;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #111;
	font-size: 18px;
	transition: 0.3s;
	text-decoration: none;

}

.bi-share-options a:hover {

	background: #ff0000;
	color: #fff;
	transform: translateY(-3px);

}

.bi-share-close {

	border: none;
	background: #111;
	color: #fff;
	padding: 8px 16px;
	border-radius: 8px;
	cursor: pointer;

}

.bi-share {

	cursor: pointer;

}