/*
 * Sorot Energi — Artikel Perdana 2026
 * All selectors are scoped so the active WordPress theme remains untouched.
 */
.se-first-article {
	--se-navy: #071126;
	--se-panel: #0a1730;
	--se-line: rgba(93, 168, 221, 0.24);
	--se-text: #dce8f8;
	--se-muted: #8fa3bd;
	--se-cyan: #58dcff;
	--se-blue: #2276ff;
	color: inherit;
	line-height: 1.72;
}

.se-first-article > * {
	max-width: 780px;
	margin-left: auto;
	margin-right: auto;
}

.se-first-article .se-article-kicker {
	display: inline-block;
	margin-bottom: 16px;
	padding: 7px 12px;
	border: 1px solid rgba(57, 213, 255, 0.34);
	border-radius: 999px;
	color: #159dc4;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.se-first-article .se-article-dek {
	margin-top: 0;
	font-size: clamp(19px, 2.2vw, 24px);
	line-height: 1.55;
	font-weight: 500;
}

.se-first-article .se-article-meta {
	margin-bottom: 40px;
	color: #7387a2;
	font-size: 13px;
}

.se-first-article .se-article-metrics {
	max-width: 1120px;
	gap: 0;
	margin-top: 34px;
	margin-bottom: 54px;
	border: 1px solid var(--se-line);
	border-radius: 18px;
	overflow: hidden;
	background: linear-gradient(145deg, #0b1d3a, var(--se-navy));
	color: var(--se-text);
}

.se-first-article .se-article-metrics > .wp-block-column {
	min-width: 0;
	padding: 22px;
	border-right: 1px solid var(--se-line);
}

.se-first-article .se-article-metrics > .wp-block-column:last-child {
	border-right: 0;
}

.se-first-article .se-metric-label,
.se-first-article .se-metric-value,
.se-first-article .se-metric-note {
	margin: 0;
}

.se-first-article .se-metric-label {
	color: var(--se-muted);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.1em;
}

.se-first-article .se-metric-value {
	margin-top: 8px;
	color: #f2f7ff;
	font-size: clamp(20px, 2vw, 27px);
	font-weight: 800;
	line-height: 1.15;
}

.se-first-article .se-metric-note {
	margin-top: 8px;
	color: var(--se-muted);
	font-size: 12px;
	line-height: 1.5;
}

.se-first-article .se-article-lead {
	font-size: clamp(20px, 2vw, 24px);
	font-weight: 600;
	line-height: 1.55;
}

.se-first-article .se-article-callout {
	margin-top: 36px;
	margin-bottom: 36px;
	padding: 26px 28px;
	border: 1px solid var(--se-line);
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(34, 118, 255, 0.13), rgba(57, 213, 255, 0.06));
}

.se-first-article .se-callout-label,
.se-first-article .se-callout-text {
	margin: 0;
}

.se-first-article .se-callout-label,
.se-first-article .se-bottom-label {
	color: #159dc4;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.14em;
}

.se-first-article .se-callout-text {
	margin-top: 8px;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.5;
}

.se-first-article .se-section-title {
	margin-top: 58px;
	margin-bottom: 20px;
	font-size: clamp(27px, 3.3vw, 36px);
	line-height: 1.22;
}

.se-first-article .se-section-title span {
	display: block;
	margin-bottom: 8px;
	color: #159dc4;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.1em;
}

.se-first-article .se-article-quote {
	margin-top: 42px;
	margin-bottom: 42px;
	padding-left: 24px;
	border-left: 3px solid var(--se-cyan);
	font-size: clamp(22px, 2.8vw, 29px);
	font-weight: 650;
	line-height: 1.45;
}

.se-first-article .se-article-quote p {
	margin: 0;
}

.se-first-article .se-article-bottom-line {
	margin-top: 54px;
	margin-bottom: 56px;
	padding: 32px;
	border: 1px solid rgba(82, 170, 255, 0.38);
	border-radius: 20px;
	background: linear-gradient(135deg, #123a80, #0a224d 58%, #07142a);
	color: #dce8f8;
}

.se-first-article .se-article-bottom-line h2 {
	margin-top: 10px;
	margin-bottom: 14px;
	color: #fff;
	font-size: clamp(25px, 3vw, 32px);
	line-height: 1.25;
}

.se-first-article .se-article-bottom-line p:last-child,
.se-first-article .se-bottom-label {
	margin-bottom: 0;
}

.se-first-article .se-sources-title {
	margin-top: 60px;
	padding-top: 28px;
	border-top: 1px solid rgba(124, 148, 180, 0.23);
}

.se-first-article .se-article-sources {
	padding-left: 22px;
}

.se-first-article .se-article-sources li {
	margin: 10px 0;
	font-size: 14px;
}

.se-first-article .se-editor-note {
	padding-top: 18px;
	border-top: 1px dashed rgba(124, 148, 180, 0.28);
	color: #71839c;
	font-size: 12px;
}

@media (max-width: 900px) {
	.se-first-article .se-article-metrics {
		flex-wrap: wrap !important;
	}

	.se-first-article .se-article-metrics > .wp-block-column {
		flex-basis: 50% !important;
		border-bottom: 1px solid var(--se-line);
	}
}

@media (max-width: 600px) {
	.se-first-article .se-article-metrics > .wp-block-column {
		flex-basis: 100% !important;
		border-right: 0;
	}

	.se-first-article .se-article-metrics > .wp-block-column:last-child {
		border-bottom: 0;
	}

	.se-first-article .se-article-callout,
	.se-first-article .se-article-bottom-line {
		padding: 22px;
	}
}

