/*
Theme Name: Jabar Istimewa
Theme URI: https://jabar.pojoksatu.id/
Author: Inova.id
Description: Tema editorial ringan untuk Jabar Istimewa, dengan layout berita responsif, slot iklan Google Publisher Tags, dan dukungan Gutenberg.
Version: 1.1.0
Requires at least: 6.3
Requires PHP: 8.0
Tested up to: 7.1
Text Domain: jabaristimewa
*/

:root {
	--jt-ink: #17202a;
	--jt-muted: #667085;
	--jt-line: #e6e9ee;
	--jt-paper: #ffffff;
	--jt-soft: #f5f7fa;
	--jt-brand: #b3261e;
	--jt-brand-dark: #7f1713;
	--jt-max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--jt-soft);
	color: var(--jt-ink);
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 16px;
	line-height: 1.65;
}
img { display: block; height: auto; max-width: 100%; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--jt-brand); }
.jt-container { margin: 0 auto; max-width: var(--jt-max); padding: 0 20px; }
.jt-screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	white-space: nowrap;
	width: 1px;
}
.jt-screen-reader-text:focus {
	background: #fff;
	clip: auto !important;
	clip-path: none;
	height: auto;
	left: 12px;
	padding: 12px 16px;
	top: 12px;
	width: auto;
	z-index: 100000;
}

.jt-site-header { background: var(--jt-paper); border-bottom: 1px solid var(--jt-line); }
.jt-header-top { align-items: center; display: flex; gap: 24px; justify-content: space-between; min-height: 88px; }
.jt-brand { align-items: center; display: inline-flex; flex: 0 0 auto; }
.jt-brand img { height: auto; max-height: 58px; width: 210px; }
.jt-header-top .custom-logo-link { align-items: center; display: inline-flex; }
.jt-brand .custom-logo { max-height: 58px; width: auto; }
.jt-header-top .custom-logo { max-height: 58px; width: auto; }
.jt-header-meta { align-items: center; color: var(--jt-muted); display: flex; font-size: .88rem; gap: 18px; margin-left: auto; }
.jt-header-meta a { color: var(--jt-muted); }
.jt-header-search { max-width: 230px; }
.jt-header-search .search-form { display: flex; }
.jt-header-search input[type="search"] { border: 1px solid var(--jt-line); border-radius: 999px 0 0 999px; min-width: 0; padding: 9px 13px; width: 165px; }
.jt-header-search .search-submit { background: var(--jt-ink); border: 0; border-radius: 0 999px 999px 0; color: #fff; padding: 0 15px; }
.jt-menu-toggle { background: transparent; border: 1px solid var(--jt-line); border-radius: 8px; display: none; padding: 9px 12px; }
.jt-primary-nav { border-top: 1px solid var(--jt-line); }
.jt-primary-nav ul { align-items: center; display: flex; flex-wrap: wrap; gap: 0; list-style: none; margin: 0; padding: 0; }
.jt-primary-nav li { position: relative; }
.jt-primary-nav a { display: block; font-size: .87rem; font-weight: 750; letter-spacing: .01em; padding: 13px 15px; text-transform: uppercase; }
.jt-primary-nav > div > ul > li:first-child > a, .jt-primary-nav > ul > li:first-child > a { padding-left: 0; }
.jt-primary-nav .sub-menu { background: var(--jt-paper); border: 1px solid var(--jt-line); box-shadow: 0 12px 28px rgba(16, 24, 40, .12); display: none; min-width: 210px; position: absolute; top: 100%; z-index: 30; }
.jt-primary-nav li:hover > .sub-menu, .jt-primary-nav li:focus-within > .sub-menu { display: block; }
.jt-primary-nav .sub-menu a { padding: 10px 14px; text-transform: none; }

.jt-main { padding: 28px 0 54px; }
.jt-layout { align-items: start; display: grid; gap: 30px; grid-template-columns: minmax(0, 1fr) 320px; }
.jt-content { min-width: 0; }
.jt-panel { background: var(--jt-paper); border: 1px solid var(--jt-line); border-radius: 16px; }
.jt-section-heading { align-items: end; border-bottom: 2px solid var(--jt-ink); display: flex; justify-content: space-between; margin: 0 0 18px; padding-bottom: 10px; }
.jt-section-heading h2 { font-size: 1.35rem; letter-spacing: -.02em; margin: 0; }
.jt-section-heading a { color: var(--jt-brand); font-size: .82rem; font-weight: 750; text-transform: uppercase; }
.jt-archive-description { color: var(--jt-muted); font-size: .95rem; margin: -7px 0 18px; }

.jt-ad { clear: both; margin: 0 auto 24px; min-height: 1px; overflow: hidden; text-align: center; }
.jt-ad > div { margin: 0 auto; }
.jt-ad--top { min-height: 90px; }
.jt-ad--inline { margin: 25px auto; }
.jt-ad--sidebar { margin-bottom: 24px; }
.jt-ad-label { color: #98a2b3; display: block; font-size: 10px; letter-spacing: .12em; margin-bottom: 4px; text-transform: uppercase; }

.jt-lead-grid { display: grid; gap: 14px; grid-template-columns: minmax(0, 1.45fr) repeat(2, minmax(0, 1fr)); margin-bottom: 24px; }
.jt-lead-card { background: var(--jt-ink); border-radius: 14px; min-height: 205px; overflow: hidden; position: relative; }
.jt-lead-card:first-child { grid-row: span 2; min-height: 425px; }
.jt-lead-card img { height: 100%; object-fit: cover; position: absolute; width: 100%; }
.jt-lead-card::after { background: linear-gradient(180deg, transparent 25%, rgba(0, 0, 0, .82) 100%); content: ""; inset: 0; position: absolute; }
.jt-lead-card__body { bottom: 0; color: #fff; padding: 20px; position: absolute; z-index: 1; }
.jt-lead-card__body h2, .jt-lead-card__body h3 { font-size: clamp(1.2rem, 2.2vw, 2rem); letter-spacing: -.025em; line-height: 1.15; margin: 7px 0 0; }
.jt-lead-card:not(:first-child) .jt-lead-card__body h3 { font-size: 1.13rem; }
.jt-kicker { color: var(--jt-brand); font-size: .72rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.jt-lead-card .jt-kicker { color: #ffb7b1; }

.jt-feed-list { display: grid; gap: 0; }
.jt-card { border-bottom: 1px solid var(--jt-line); display: grid; gap: 18px; grid-template-columns: 220px minmax(0, 1fr); padding: 18px 0; }
.jt-card:first-child { padding-top: 0; }
.jt-card:last-child { border-bottom: 0; }
.jt-card__media { aspect-ratio: 16 / 9; background: #e9edf2; border-radius: 10px; display: block; overflow: hidden; }
.jt-card__media img { height: 100%; object-fit: cover; width: 100%; }
.jt-card__placeholder { align-items: center; color: #98a2b3; display: flex; font-weight: 800; height: 100%; justify-content: center; letter-spacing: .1em; }
.jt-card__body h2 { font-size: 1.23rem; letter-spacing: -.02em; line-height: 1.28; margin: 5px 0 7px; }
.jt-card__body p { color: var(--jt-muted); margin: 0; }
.jt-meta { color: var(--jt-muted); font-size: .78rem; }
.jt-meta a { color: var(--jt-brand); font-weight: 700; }
.jt-pagination { border-top: 1px solid var(--jt-line); clear: both; margin-top: 16px; padding-top: 20px; }
.jt-pagination .nav-links,
.jt-pagination ul.page-numbers { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; list-style: none; margin: 0; padding: 0; width: 100%; }
.jt-pagination ul.page-numbers li { display: block; margin: 0; padding: 0; }
.jt-pagination a.page-numbers,
.jt-pagination span.page-numbers,
.jt-pagination > a,
.jt-pagination > span { align-items: center; border: 1px solid var(--jt-line); border-radius: 8px; display: inline-flex; justify-content: center; min-height: 42px; min-width: 42px; padding: 8px 12px; white-space: nowrap; }
.jt-pagination a.page-numbers:hover { background: var(--jt-soft); border-color: var(--jt-brand); color: var(--jt-brand); }
.jt-pagination .current { background: var(--jt-ink); border-color: var(--jt-ink); color: #fff; }
.jt-pagination .dots { border-color: transparent; }

.jt-sidebar { position: sticky; top: 22px; }
.jt-widget { background: var(--jt-paper); border: 1px solid var(--jt-line); border-radius: 14px; margin-bottom: 20px; padding: 18px; }
.jt-widget h2 { border-bottom: 2px solid var(--jt-ink); font-size: 1rem; margin: 0 0 13px; padding-bottom: 8px; text-transform: uppercase; }
.jt-widget ul { list-style: none; margin: 0; padding: 0; }
.jt-widget li { border-bottom: 1px solid var(--jt-line); padding: 8px 0; }
.jt-widget li:last-child { border-bottom: 0; }
.jt-widget p { color: var(--jt-muted); }

.jt-article { background: var(--jt-paper); border: 1px solid var(--jt-line); border-radius: 16px; padding: clamp(22px, 4vw, 52px); }
.jt-breadcrumbs { align-items: center; color: var(--jt-muted); display: flex; flex-wrap: wrap; font-size: .76rem; gap: 6px; margin-bottom: 18px; }
.jt-breadcrumbs a { color: var(--jt-brand); }
.jt-breadcrumbs span:last-child { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jt-article__header h1 { font-size: clamp(2rem, 4.1vw, 3.55rem); letter-spacing: -.045em; line-height: 1.08; margin: 10px 0 15px; }
.jt-article__dek { color: var(--jt-muted); font-size: 1.12rem; margin: 0 0 18px; }
.jt-article-category { color: var(--jt-brand); font-weight: 750; }
.jt-article__hero { margin: 25px 0 30px; }
.jt-article__hero img { border-radius: 12px; margin: 0 auto; width: 100%; }
.jt-article__hero figcaption { color: var(--jt-muted); font-size: .76rem; margin-top: 7px; text-align: center; }
.jt-entry-content { font-family: Georgia, "Times New Roman", serif; font-size: 1.12rem; line-height: 1.8; }
.jt-entry-content h2, .jt-entry-content h3, .jt-entry-content h4 { font-family: Inter, ui-sans-serif, system-ui, sans-serif; line-height: 1.25; }
.jt-entry-content a { color: var(--jt-brand-dark); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.jt-entry-content blockquote { border-left: 4px solid var(--jt-brand); color: #475467; margin: 25px 0; padding: 8px 20px; }
.jt-entry-content iframe, .jt-entry-content video { max-width: 100%; }
.jt-read-next { background: #fff8f7; border-left: 4px solid var(--jt-brand); border-radius: 0 10px 10px 0; font-family: Inter, ui-sans-serif, system-ui, sans-serif; margin: 28px 0; padding: 13px 17px; }
.jt-read-next strong { color: var(--jt-brand-dark); display: block; font-size: .76rem; letter-spacing: .08em; margin-bottom: 4px; text-transform: uppercase; }
.jt-read-next a { color: var(--jt-ink); display: block; font-size: 1rem; font-weight: 750; line-height: 1.35; text-decoration: none; }
.jt-author { border-top: 1px solid var(--jt-line); color: var(--jt-muted); font-family: Inter, ui-sans-serif, system-ui, sans-serif; margin-top: 35px; padding-top: 18px; }
.jt-article-tags { border-top: 1px solid var(--jt-line); color: var(--jt-muted); font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: .82rem; line-height: 1.8; margin-top: 18px; padding-top: 14px; }
.jt-article-tags a { color: var(--jt-brand); }
.jt-related { border-top: 1px solid var(--jt-line); margin-top: 38px; padding-top: 28px; }
.jt-related > h2 { font-size: 1.35rem; letter-spacing: -.02em; margin: 0 0 16px; }
.jt-related-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.jt-related-card { background: var(--jt-soft); border: 1px solid var(--jt-line); border-radius: 12px; overflow: hidden; }
.jt-related-card__media { aspect-ratio: 16 / 9; background: #e9edf2; display: block; overflow: hidden; }
.jt-related-card__media img { height: 100%; object-fit: cover; width: 100%; }
.jt-related-card__body { padding: 12px; }
.jt-related-card__body h3 { font-size: .98rem; line-height: 1.35; margin: 5px 0 0; }
.jt-related-card__body h3 a:hover { color: var(--jt-brand); }
.jt-tag-cloud { display: flex; flex-wrap: wrap; gap: 7px; }
.jt-tag-cloud a { background: var(--jt-soft); border: 1px solid var(--jt-line); border-radius: 999px; color: var(--jt-muted); font-size: .76rem; padding: 5px 9px; }
.jt-tag-cloud a:hover { border-color: var(--jt-brand); color: var(--jt-brand); }

.jt-sticky-mobile, .jt-sticky-desktop, .jt-skin { pointer-events: none; position: fixed; z-index: 50; }
.jt-sticky-mobile { background: rgba(255, 255, 255, .96); bottom: 0; display: none; left: 0; padding: 4px; right: 0; }
.jt-sticky-desktop { bottom: 0; display: none; left: 50%; transform: translateX(-50%); }
.jt-skin { display: none; left: 0; top: 180px; }
.jt-sticky-mobile > div, .jt-sticky-desktop > div, .jt-skin > div { pointer-events: auto; }

.jt-footer { background: var(--jt-ink); color: #d0d5dd; margin-top: 20px; }
.jt-footer__inner { min-height: 88px; padding-bottom: 24px; padding-top: 30px; }
.jt-footer__top { align-items: start; display: grid; gap: 36px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.jt-footer__contact { grid-column: 2; grid-row: 1; max-width: 680px; }
.jt-footer__contact h2 { color: #fff; font-size: 1.05rem; margin: 0 0 8px; }
.jt-footer__contact address { color: #d0d5dd; font-size: .84rem; font-style: normal; line-height: 1.7; }
.jt-footer__contact address a { color: #fff; }
.jt-footer__verification { color: #d0d5dd; font-size: .78rem; grid-column: 1; grid-row: 1; line-height: 1.6; margin: 0; padding-top: 2px; }
.jt-footer__verification strong { color: #fff; }
.jt-footer__bottom { align-items: center; border-top: 1px solid rgba(255, 255, 255, .16); display: flex; flex-wrap: nowrap; gap: 22px; justify-content: space-between; margin-top: 24px; padding-top: 16px; width: 100%; }
.jt-footer__bottom small { white-space: nowrap; }
.jt-footer__bottom .jt-footer-nav { flex: 0 0 auto; }
.jt-footer__bottom .jt-footer-nav ul { flex-wrap: nowrap; }
.jt-footer a { color: #fff; }
.jt-footer small { color: #98a2b3; }
.jt-footer-nav ul { display: flex; flex-wrap: wrap; gap: 14px; list-style: none; margin: 0; padding: 0; }
.jt-footer-nav a { font-size: .82rem; }

.jt-empty { background: var(--jt-paper); border: 1px solid var(--jt-line); border-radius: 14px; padding: 34px; text-align: center; }
.jt-error-title { font-size: clamp(2rem, 6vw, 4rem); margin: 0 0 8px; }

@media (min-width: 1680px) {
	.jt-skin { display: block; }
}
@media (min-width: 768px) {
	.jt-sticky-desktop { display: block; }
}
@media (max-width: 900px) {
	.jt-header-meta { gap: 10px; }
	.jt-header-search { display: none; }
	.jt-layout { grid-template-columns: minmax(0, 1fr) 280px; }
}
@media (max-width: 767px) {
	.jt-container { padding: 0 14px; }
	.jt-header-top { min-height: 72px; }
	.jt-brand img { max-width: 175px; }
	.jt-header-meta { font-size: .75rem; }
	.jt-header-meta .jt-date { display: none; }
	.jt-menu-toggle { display: block; }
	.jt-primary-nav { display: none; }
	.jt-primary-nav.is-open { display: block; }
	.jt-primary-nav ul { align-items: stretch; display: block; padding: 8px 0; }
	.jt-primary-nav a, .jt-primary-nav > div > ul > li:first-child > a, .jt-primary-nav > ul > li:first-child > a { padding: 10px 0; }
	.jt-primary-nav .sub-menu { border: 0; box-shadow: none; display: block; position: static; }
	.jt-primary-nav .sub-menu a { padding-left: 14px; }
	.jt-main { padding-top: 18px; }
	.jt-layout { display: block; }
	.jt-sidebar { margin-top: 28px; position: static; }
	.jt-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.jt-lead-grid { grid-template-columns: 1fr 1fr; }
	.jt-lead-card:first-child { grid-column: span 2; grid-row: auto; min-height: 300px; }
	.jt-lead-card { min-height: 170px; }
	.jt-lead-card__body { padding: 14px; }
	.jt-lead-card__body h2 { font-size: 1.35rem; }
	.jt-lead-card:not(:first-child) .jt-lead-card__body h3 { font-size: .95rem; }
	.jt-card { gap: 12px; grid-template-columns: 120px minmax(0, 1fr); }
	.jt-card__body h2 { font-size: 1rem; margin-top: 2px; }
	.jt-card__body p { display: none; }
	.jt-article { border-radius: 12px; padding: 20px 16px; }
	.jt-article__header h1 { font-size: 2rem; }
	.jt-entry-content { font-size: 1.05rem; }
	.jt-related-card__body h3 { font-size: .9rem; }
	.jt-sticky-mobile { display: block; }
	.jt-sticky-desktop, .jt-skin { display: none; }
	.jt-footer__inner { padding: 24px 0; }
	.jt-footer__top { display: flex; flex-direction: column; gap: 20px; }
	.jt-footer__contact { order: 1; }
	.jt-footer__verification { order: 2; }
	.jt-footer__bottom { align-items: flex-start; flex-direction: column; gap: 12px; }
	.jt-footer__bottom .jt-footer-nav { max-width: 100%; }
	.jt-footer__bottom .jt-footer-nav ul { flex-wrap: wrap; }
}