/*
Theme Name: Pewarta
Author: Pewarta
Description: Tema portal berita konvensional: hero utama, Pilihan Redaksi, blok kategori pilihan sendiri, dan daftar "Berita Selanjutnya" tanpa batas. Logo ungu, SEO bawaan, auto link, dan dashboard.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: pewarta
*/
:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);--b1:#b726cb;--b2:#551cb9;--grad:linear-gradient(90deg,var(--b1),var(--b2));--on-brand:#fff;--hi:#f2c75c;--gold:#8a6508;--bg:#fff;--surface:#fff;--ink:#1a1325;--muted:#625a70;--line:#e6e0ef;--accent:#761fab;--accent-hover:#4c1578;--hot:#761fab;--chip:#f4eefb;--foot:#1a0b2e;--wrap-w:1092px;--side-w:330px;--hd:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;--bd:'Instrument Sans','Segoe UI',system-ui,sans-serif}
:root[data-theme="dark"]{--bg:#100b19;--surface:#191226;--ink:#f4effb;--muted:#a99fbb;--line:#2c2340;--accent:#db92e5;--accent-hover:#efc4f5;--hot:#db92e5;--chip:#221a33;--gold:#f2c75c}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 80px)}
html{background:var(--foot)}
body{margin:0;overflow-x:clip;background:var(--bg);color:var(--ink);font:16px/1.6 var(--bd);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding-bottom:0!important}
body>main{flex:1 0 auto;width:100%}
::selection{background:var(--b1);color:var(--on-brand)}
a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;color:#000;padding:8px;z-index:99}
.wrap{max-width:calc(var(--wrap-w) + 40px);margin:0 auto;padding:0 20px}
h1,h2,h3,h4{font-family:var(--hd);line-height:1.15;margin:0;letter-spacing:-.015em}
.util{background:var(--foot);color:#d9cfe8;font-size:13px}
.util .wrap{display:flex;justify-content:space-between;gap:12px;padding-top:7px;padding-bottom:7px}
.util button{background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:4px;margin:-4px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s}
.util button:hover{color:var(--hi);background:rgba(255,255,255,.08)}
.util .i-sun{display:none}:root[data-theme="dark"] .util .i-sun{display:block}:root[data-theme="dark"] .util .i-moon{display:none}
header.main{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
header.main .wrap{display:flex;align-items:center;gap:24px;height:64px}
.logo{font-family:var(--hd);font-weight:800;font-size:25px;letter-spacing:-.04em;display:flex;align-items:center;gap:8px;white-space:nowrap}
.logo i{width:26px;height:26px;border-radius:50%;background:conic-gradient(from 200deg,var(--accent),#b726cb,var(--hot),var(--accent));position:relative;display:block}
.logo i::after{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--surface)}
.custom-logo-link{display:flex;align-items:center;flex:none}
.custom-logo{height:46px;max-height:46px;width:auto;display:block}
.nav{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}
.menu{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.menu a{display:block;position:relative;padding:8px 12px;font-weight:600;font-size:15px;border-radius:8px;white-space:nowrap;transition:color .15s}
.menu a::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;border-radius:3px;background:var(--grad);transform:scaleX(0);transform-origin:0 50%;transition:transform .2s}
.menu a:hover,.menu .current-menu-item a,.menu .current-cat a{color:var(--accent)}
.menu a:hover::after,.menu .current-menu-item a::after,.menu .current-cat a::after{transform:scaleX(1)}
input.search:focus{border-color:var(--b1);outline:0;box-shadow:0 0 0 3px rgba(183,38,203,.22)}
input.search{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:8px 16px;font:inherit;font-size:14px;width:190px;color:var(--ink)}
.hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;margin:22px 0 0}
.lead,.card-s,.big{position:relative;overflow:hidden;color:#fff;display:flex;align-items:flex-end;isolation:isolate;border-radius:14px}
.lead{min-height:330px}
.lead .art,.card-s .art,.big .art{position:absolute;inset:0;z-index:-2}
.art img,.art .ph{width:100%;height:100%;object-fit:cover;display:block}
.lead::after,.card-s::after,.big::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(20,8,36,.88),rgba(20,8,36,.05) 66%)}
.lead .txt{padding:22px 24px;max-width:620px}
.lead h1{font-size:clamp(26px,3.6vw,40px);font-weight:800;line-height:1.12;margin:10px 0 0}
.lead p{margin:0;opacity:.88;font-size:15px}
span.tag{display:inline-block;font-size:12px;font-weight:600;padding:3px 9px;border-radius:5px;background:var(--grad);color:var(--on-brand)}
span.tag.alt{background:rgba(255,255,255,.9);color:#1a1325}
.side{display:grid;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:16px}
.card-s{padding:16px 18px;min-height:157px}.card-s h2{font-size:18px;font-weight:700;margin-top:8px}
.ph{display:block;background:linear-gradient(135deg,#1a1325,#6d28d9)}
.ticker{display:flex;gap:14px;align-items:center;margin:16px 0 0;padding:10px 14px;background:var(--surface);border:1px solid var(--line);border-radius:10px;font-size:14px;overflow:hidden}
.ticker b{color:var(--accent);white-space:nowrap}.ticker span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cols{display:grid;grid-template-columns:minmax(0,1fr) var(--side-w);gap:44px;margin:30px 0 40px}
.sec-h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:4px}
.sec-h h1,.sec-h h2{font-size:24px;font-weight:800}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:0;background:var(--chip);color:var(--ink);font:600 13px var(--bd);padding:6px 12px;border-radius:999px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--grad);color:var(--on-brand)}
.desc{color:var(--muted);margin:6px 0 0}
.post{display:grid;grid-template-columns:210px minmax(0,1fr);gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}
.thumb{aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:var(--chip)}
.thumb img,.thumb .ph{width:100%;height:100%;object-fit:cover;display:block}
.post h3{font-size:20px;font-weight:700;margin:6px 0}.post:hover h3{color:var(--accent)}
.post p{margin:0 0 8px;color:var(--muted);font-size:15px}
.meta{font-size:13px;color:var(--muted)}.meta b{color:var(--ink);font-weight:600}
.cat{font-size:13px;font-weight:600;color:var(--accent)}
.hero2{margin:10px 0 6px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hero2 .hh{display:flex;align-items:center;gap:10px;font-family:var(--hd);font-weight:800;font-size:21px;margin-bottom:14px}
.hero2 .hh::before{content:"";width:6px;height:24px;background:linear-gradient(var(--b1),var(--b2));border-radius:3px}
.hero2 .hh .hm{margin-left:auto;font:600 13px var(--bd);color:var(--accent)}.hero2 .hh .hm:hover{color:var(--accent-hover)}.hero2 .hh .hm::after{content:" \2192"}
.h2g{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:20px}
.big{min-height:310px;padding:22px}.big h3{font-size:24px;font-weight:800;margin:8px 0 6px}
.mini{display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;padding:12px 0;border-top:1px solid var(--line);align-items:center}
.mini:first-child{border-top:0;padding-top:0}
.mini i{aspect-ratio:1;border-radius:8px;display:block;overflow:hidden}
.mini i img,.mini i .ph{width:100%;height:100%;object-fit:cover}
.mini h4{margin:3px 0 0;font:600 15px/1.35 var(--bd)}
.mini:hover h4,.big:hover h3{text-decoration:underline}
.sent{text-align:center;color:var(--muted);padding:28px 0;font-size:14px}
.pager{display:flex;gap:10px;justify-content:center;padding:20px 0}
.pager a,.pager span{padding:8px 14px;border:1px solid var(--line);border-radius:8px;font-weight:600}
.pager .current{background:var(--grad);color:var(--on-brand);border-color:transparent}
aside{min-width:0}
.box{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:20px}
.box h2{font-size:19px;font-weight:800;margin-bottom:10px}
.rank{list-style:none;margin:0;padding:0;counter-reset:r}
.rank li{counter-increment:r;display:grid;grid-template-columns:34px minmax(0,1fr);gap:6px;padding:11px 0;border-top:1px solid var(--line);font-weight:600;font-size:15px;line-height:1.35}
.rank li::before{content:counter(r);font-family:var(--hd);font-weight:800;font-size:26px;line-height:1;color:var(--accent)}
.rank a:hover{color:var(--accent)}
.news{background:var(--ink);color:var(--bg);border:0}.news p{margin:0 0 12px;font-size:14px;opacity:.85}
.btn{display:block;text-align:center;padding:10px;border-radius:8px;background:var(--grad);color:var(--on-brand);font-weight:700}
.progress{position:fixed;top:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:0 50%;z-index:50}
.crumbs{font-size:13px;color:var(--muted);margin-bottom:12px}.crumbs a:hover{color:var(--accent)}.crumbs i{margin:0 6px;font-style:normal}
.entry-wrap h1{font-size:clamp(28px,4vw,42px);font-weight:800;margin:8px 0 12px}
.byline{display:flex;gap:6px 14px;flex-wrap:wrap;font-size:14px;color:var(--muted);margin-bottom:18px}.byline b{color:var(--ink)}
.feat{border-radius:14px;overflow:hidden;margin:0 0 20px}.feat img{width:100%;display:block}
.intinya{background:var(--chip);border-left:4px solid var(--accent);border-radius:8px;padding:14px 18px;margin:0 0 22px}
.intinya b{font-family:var(--hd)}.intinya ul{margin:8px 0 0;padding-left:20px}
.entry{font-size:18px;line-height:1.75}.entry p{margin:0 0 1.2em}
.entry h2{font-size:28px;margin:1.6em 0 .6em}.entry h3{font-size:22px;margin:1.4em 0 .5em}
.entry blockquote{margin:1.4em 0;padding:4px 0 4px 18px;border-left:4px solid var(--b1);color:var(--muted)}
.entry figure{margin:1.4em 0}.entry figcaption{font-size:14px;color:var(--muted)}
.entry table{border-collapse:collapse;width:100%;display:block;overflow-x:auto}.entry td,.entry th{border:1px solid var(--line);padding:8px 10px}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin:20px 0}.tags a{background:var(--chip);padding:4px 10px;border-radius:999px;font-size:13px;font-weight:600}
.share{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0;align-items:center;font-size:14px}
.share a,.share button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:7px 12px;font:600 13px var(--bd);cursor:pointer}
.share a:hover,.share button:hover{border-color:var(--accent);color:var(--accent)}
div.author{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:16px;margin:22px 0}
div.author img{border-radius:50%}div.author p{margin:2px 0 0;color:var(--muted);font-size:14px}
.related h2,.comments h2{font-size:22px;margin:30px 0 14px}
.rel-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.rel .thumb{margin-bottom:8px}.rel h4{font:600 16px/1.35 var(--bd)}.rel:hover h4{color:var(--accent)}
.comments ol{list-style:none;padding:0}.comments li{border-top:1px solid var(--line);padding:12px 0}
.comments input[type=text],.comments input[type=email],.comments input[type=url],.comments textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit}
.comments input[type=submit]{background:var(--grad);color:var(--on-brand);border:0;border-radius:8px;padding:10px 18px;font-weight:700;cursor:pointer}
footer.site{background:var(--foot);color:#d9cfe8;padding:40px 0 calc(24px + env(safe-area-inset-bottom,0px));font-size:14px;margin-top:auto;flex:none;border-top:3px solid transparent;border-image:var(--grad) 1}
footer.site .custom-logo{height:46px;max-height:46px}
.f-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:32px}
.f-brand p{margin:14px 0 0;max-width:340px;color:#9fb0c6;line-height:1.55}
.f-soc{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.f-soc a{border:1px solid #3a2c57;border-radius:999px;padding:4px 12px;font-weight:600;font-size:13px;color:#d9cfe8;transition:border-color .15s,color .15s}
.f-soc a:hover{border-color:var(--hi);color:var(--hi)}
.f-col h2{font:800 14px var(--hd);letter-spacing:.06em;text-transform:uppercase;color:#fff;margin:0 0 12px}
.f-col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.f-col a{color:#b9aed0;transition:color .15s}.f-col a:hover{color:var(--hi)}
.f-bar{margin-top:30px;padding-top:18px;border-top:1px solid #34264d;color:#8f84a6;font-size:13px}
ins.adsbygoogle[data-ad-status="unfilled"]{display:none!important}
.widget:has(ins.adsbygoogle[data-ad-status="unfilled"]){display:none}
@media (max-width:900px){.hero{grid-template-columns:minmax(0,1fr)}.side{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto}.cols{grid-template-columns:minmax(0,1fr)}input.search{display:none}aside{position:static}}
@media (max-width:700px){.h2g{grid-template-columns:minmax(0,1fr)}.f-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.f-brand{grid-column:1/-1}}
@media (max-width:600px){footer.site{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}.chips{flex-wrap:nowrap;overflow-x:auto;width:100%;scrollbar-width:none}.chip{white-space:nowrap;flex:none}.side{grid-template-columns:minmax(0,1fr)}.post{grid-template-columns:minmax(0,1fr)}.lead{min-height:300px}.rel-g{grid-template-columns:minmax(0,1fr)}.entry{font-size:17px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.widget:empty,.box:empty{display:none}
.widget_custom_html{border:0;padding:0;background:none}
.wrap.single-wrap{max-width:820px;margin-top:30px;margin-bottom:20px}
.morebtn{display:block;margin:20px auto;padding:12px 28px;border:0;border-radius:999px;background:var(--grad);color:var(--on-brand);font:700 15px var(--bd);cursor:pointer}
.morebtn[hidden]{display:none}


/* ===== Artikel ===== */
.wrap.single-wrap{max-width:calc(var(--art-w,760px) + 40px)}
.entry-wrap .art-head>a.cat{display:inline-block;padding:3px 11px;border-radius:6px;background:var(--chip);font-size:12.5px;letter-spacing:.03em;text-transform:uppercase}
.entry-wrap h1{font-size:clamp(26px,3.6vw,34px);line-height:1.2;letter-spacing:-.02em;margin:12px 0 14px}
.byline{font-size:13.5px;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 20px;gap:4px 16px}
.feat{border-radius:12px;margin:0 0 22px}.feat img{aspect-ratio:16/9;object-fit:cover;width:100%}
.entry{font-size:var(--art-fs,17px);line-height:1.8;color:var(--ink)}
.entry>*:first-child{margin-top:0}
.entry p{margin:0 0 1.35em}
.entry h2{font-size:1.55em;line-height:1.25;margin:2em 0 .65em}
.entry h2::before{content:"";display:block;width:46px;height:4px;border-radius:4px;background:var(--grad);margin-bottom:12px}
.entry h3{font-size:1.2em;margin:1.7em 0 .5em}
.entry h4{font-size:1.05em;margin:1.5em 0 .4em}
.entry strong{font-weight:700}
.entry ul,.entry ol{margin:0 0 1.4em;padding-left:0;list-style:none}
.entry ul li{position:relative;padding-left:26px;margin:.5em 0}
.entry ul li::before{content:"";position:absolute;left:6px;top:.72em;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.entry ol{counter-reset:ol}.entry ol li{counter-increment:ol;position:relative;padding-left:40px;margin:.7em 0}
.entry ol li::before{content:counter(ol);position:absolute;left:0;top:.18em;width:26px;height:26px;border-radius:50%;background:var(--chip);color:var(--accent);font:700 13px/26px var(--hd);text-align:center}
.entry li>ul,.entry li>ol{margin:.5em 0 0}
.entry blockquote{position:relative;margin:1.8em 0;padding:20px 24px 20px 30px;background:var(--chip);border:0;border-radius:12px;font-family:var(--hd);font-size:1.08em;line-height:1.5;color:var(--ink)}
.entry blockquote::before{content:"\201C";position:absolute;left:10px;top:-2px;font:800 60px/1 var(--hd);color:var(--accent);opacity:.35}
.entry blockquote p{margin:0}.entry blockquote cite{display:block;margin-top:10px;font:500 13px var(--bd);color:var(--muted)}
.entry img{border-radius:10px;height:auto}
.entry figure{margin:1.8em 0}.entry figcaption{text-align:center;font-size:13px;color:var(--muted);margin-top:8px}
.entry hr{border:0;height:1px;margin:2.2em 0;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.entry code{background:var(--chip);padding:2px 6px;border-radius:5px;font-size:.88em}
.entry pre{background:#1a1325;color:#e6edf6;padding:16px 18px;border-radius:10px;overflow:auto;font-size:14px;line-height:1.6}
.entry pre code{background:none;padding:0;color:inherit}
.entry table{display:block;overflow-x:auto;border-collapse:collapse;border:1px solid var(--line);border-radius:10px;font-size:.94em;margin:1.6em 0}
.entry th{background:var(--ink);color:var(--bg);text-align:left}
.entry td,.entry th{border:1px solid var(--line);padding:9px 12px}
.entry tbody tr:nth-child(even) td{background:var(--chip)}
.entry iframe,.entry video{max-width:100%;border-radius:10px}
.entry .alignwide,.entry .alignfull{max-width:100%}
.entry .aligncenter{display:block;margin-left:auto;margin-right:auto}
.entry .alignleft{float:left;margin:0 18px 10px 0}.entry .alignright{float:right;margin:0 0 10px 18px}
.entry .callout,.entry .ck-callout{background:var(--chip);border-left:4px solid var(--accent);padding:14px 18px;border-radius:10px;margin:1.6em 0}
.tags a:hover{background:var(--grad);color:var(--on-brand)}
div.author{background:var(--chip);border:0}
@media (max-width:600px){.entry{font-size:calc(var(--art-fs,17px) - 1px)}.entry blockquote{padding:18px 18px 18px 24px}}

/* ===== Tautan di dalam artikel ===== */
.entry a{color:var(--accent);font-weight:600;text-decoration:none;transition:color .18s,background-size .22s,border-color .18s}
/* Internal: garis gradasi tipis yang mengisi menjadi penanda saat disorot */
.entry a.ck-in{background:linear-gradient(90deg,var(--b1),var(--b2)) 0 100%/100% 2px no-repeat;padding:0 2px 1px;margin:0 -2px;border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.entry a.ck-in:hover,.entry a.ck-in:focus-visible{background-size:100% 100%;color:var(--on-brand)}
/* Eksternal: garis putus-putus halus dan panah kecil */
.entry a.ck-ex{border-bottom:1.5px dotted currentColor;border-bottom-color:rgba(127,127,127,.55)}
.entry a.ck-ex::after{content:"\2197";font-size:.72em;margin-left:3px;opacity:.7;display:inline-block;transition:transform .18s}
.entry a.ck-ex:hover{color:var(--accent-hover);border-bottom-color:currentColor}.entry a.ck-ex:hover::after{transform:translate(1px,-1px)}
.entry a:has(img){background:none;padding:0;margin:0;border:0}.entry a:has(img)::after{content:none}
.entry a:not(.ck-in):not(.ck-ex):not(.wp-block-button__link){text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.entry .wp-block-button__link{display:inline-block;text-decoration:none;background:var(--grad);color:var(--on-brand);padding:10px 22px;border-radius:999px;font-weight:700}

/* ===== Terpopuler (sidebar) ===== */
.popbox{position:relative;overflow:hidden;padding:20px 16px 6px}
.popbox::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)}
.popbox h2{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.popbox .pp{font:600 11px var(--bd);letter-spacing:.05em;text-transform:uppercase;background:var(--chip);color:var(--muted);padding:3px 9px;border-radius:999px}
.pop{list-style:none;margin:0;padding:0}
.pop li{border-top:1px dashed var(--line)}.pop li:first-child{border-top:0}
.pop li:nth-child(1){--g1:#08a5eb;--g2:#2def9b}
.pop li:nth-child(2){--g1:#6d4bff;--g2:#08a5eb}
.pop li:nth-child(3){--g1:#0bb48f;--g2:#7be0ff}
.pop li:nth-child(4){--g1:#0bb48f;--g2:#8ee06f}
.pop li:nth-child(5){--g1:#f0a500;--g2:#ff6b35}
.pop li:nth-child(n+6){--g1:#a99fbb;--g2:#cfd6e2}
.pop a{display:grid;grid-template-columns:48px 75px minmax(0,1fr);gap:10px;align-items:center;padding:12px 0}
.pop .pn{display:block;font:800 78px/.9 var(--hd);letter-spacing:-.08em;text-align:center;padding-right:.08em;background:linear-gradient(165deg,var(--g1),var(--g2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.pop li:nth-child(1) .pn{filter:drop-shadow(0 6px 10px rgba(183,38,203,.3))}
.pop .pt{display:block;width:75px;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--chip)}
.pop .pt img,.pop .pt .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.pop a:hover .pt img{transform:scale(1.07)}
.pop .cat{display:block;font-size:11.5px;line-height:1.2;margin-bottom:2px}
.pop strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font:600 14px/1.35 var(--bd)}
.pop a:hover strong{color:var(--accent)}
:root[data-theme="dark"] .cat{filter:brightness(1.4)}
.side-sticky{position:sticky;top:80px}
@media (max-width:900px){.side-sticky{position:static}}

/* ===== Variasi hero tengah ===== */
.hero2.l-r .h2g{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}.hero2.l-r .big{order:2}
.h2t{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.h2q{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.tc{display:block}.tc .thumb{margin-bottom:10px;transition:transform .2s,box-shadow .2s}
.tc:hover .thumb{transform:translateY(-3px);box-shadow:0 10px 22px rgba(3,33,43,.14)}
.tc .cat{display:block;font-size:12px;margin-bottom:2px}
.tc h4{font:700 16px/1.35 var(--bd);margin:0 0 6px}.tc:hover h4{color:var(--accent)}
.tc.sm h4{font-size:14.5px}.tc .meta{font-size:12px}
.hero2.tint{background:var(--chip);border:0;border-radius:16px;padding:20px}
.hero2.tint .thumb{background:var(--surface)}
.h2d{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}.h2d .big{min-height:250px}.h2d .big h3{font-size:21px}
.h2m{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 20px;margin-top:14px}
.h2m .mini{border-top:0;padding:8px 0}.h2m .mini:first-child{padding-top:8px}
@media (max-width:900px){.h2q{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.h2t,.h2d,.h2m{grid-template-columns:minmax(0,1fr)}.hero2.l-r .big{order:0}.hero2.l-r .h2g{grid-template-columns:minmax(0,1fr)}}

/* ===== Perbaikan responsif (HP) ===== */
img,video,iframe,embed,object,svg{max-width:100%}
.sec-h>*,.post>*,.mini>*,.tc,.h2g>*{min-width:0}
.post h3,.mini h4,.tc h4,.big h3,.card-s h2,.lead h1,.pop strong{overflow-wrap:break-word}
.entry{overflow-wrap:break-word}
.entry figure,.entry .wp-caption,.entry .wp-block-image,.entry .wp-block-embed{max-width:100%}
.entry figure[style],.entry .wp-caption{width:auto!important}
.entry img{max-width:100%;height:auto}
.entry pre{max-width:100%}
.entry iframe,.entry video{width:100%;height:auto;aspect-ratio:16/9}
.widget img,.widget iframe,.widget ins{max-width:100%}
@media (max-width:700px){
	.entry .alignleft,.entry .alignright{float:none;display:block;margin:1.2em auto}
	.h2t{grid-template-columns:minmax(0,1fr);gap:14px}
	.h2t .tc{display:grid;grid-template-columns:116px minmax(0,1fr);column-gap:12px;align-items:start}
	.h2t .tc .thumb{grid-row:1/4;margin:0;aspect-ratio:4/3}
	.h2t .tc h4{font-size:15px;margin-bottom:4px}
	.hero2{padding:16px 0}.hero2.tint{padding:16px 14px}
	.hero2 .hh{font-size:19px}
	.big{min-height:240px;padding:18px}.big h3{font-size:21px}
	.h2d .big{min-height:210px}
}
@media (max-width:600px){
	.wrap{padding:0 14px}
	header.main .wrap{gap:12px;height:58px}
	.custom-logo,footer.site .custom-logo{height:40px;max-height:40px}
	.hero{margin-top:14px;gap:12px}.side{gap:12px}
	.lead{min-height:260px}.lead .txt{padding:16px}.lead h1{font-size:22px}
	.card-s{min-height:140px}
	.cols{gap:28px;margin-top:22px}
	/* daftar artikel: foto kecil di kiri, tidak raksasa */
	.post{grid-template-columns:112px minmax(0,1fr);gap:12px;padding:14px 0}
	.post .thumb{aspect-ratio:1;border-radius:8px}
	.post h3{font-size:16px;line-height:1.3;margin:3px 0 6px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
	.post p{display:none}
	.post .meta{font-size:12px}
	/* Terpopuler: nomor lebih kecil agar tidak menimpa foto */
	.pop a{grid-template-columns:34px 68px minmax(0,1fr);gap:10px}
	.pop .pn{font-size:54px}
	.pop .pt{width:68px;border-radius:10px}
	.box{padding:14px}.popbox{padding:18px 12px 4px}
	.rel-g{gap:14px}
	.entry-wrap h1{font-size:25px}
	.share a,.share button{padding:7px 10px}
	div.author{flex-direction:column;align-items:flex-start}
	.f-grid{gap:22px}
}
@media (max-width:360px){
	.post{grid-template-columns:96px minmax(0,1fr)}
	.pop a{grid-template-columns:30px 60px minmax(0,1fr)}.pop .pn{font-size:46px}.pop .pt{width:60px}
	.h2t .tc{grid-template-columns:100px minmax(0,1fr)}
}

/* ===== Halaman Tag (header unik per tag) ===== */
.tagh{--h:200;--c1:hsl(var(--h) 78% 36%);--c2:hsl(calc(var(--h) + 48) 82% 30%);--c3:hsl(calc(var(--h) + 24) 95% 62%);position:relative;overflow:hidden;isolation:isolate;color:#fff;border-radius:18px;padding:30px 32px 26px;margin:0 0 8px;background:linear-gradient(125deg,var(--c1),var(--c2))}
.tagh::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--c3) 55%,transparent),transparent 46%),radial-gradient(circle at 6% 110%,rgba(255,255,255,.16),transparent 40%)}
.tagh::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;background-image:radial-gradient(rgba(255,255,255,.22) 1.2px,transparent 1.3px);background-size:18px 18px;-webkit-mask-image:linear-gradient(100deg,transparent 30%,#000);mask-image:linear-gradient(100deg,transparent 30%,#000)}
.tagh .hash{position:absolute;right:22px;top:-26px;z-index:-1;font:800 190px/1 var(--hd);letter-spacing:-.06em;color:rgba(255,255,255,.13);user-select:none;pointer-events:none}
.tagh .kick{display:inline-flex;align-items:center;gap:8px;font:700 12px var(--bd);letter-spacing:.12em;text-transform:uppercase;background:rgba(255,255,255,.18);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.28);padding:5px 12px;border-radius:999px}
.tagh .kick::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c3);box-shadow:0 0 0 3px rgba(255,255,255,.25)}
.tagh h1{font-size:clamp(30px,5vw,48px);font-weight:800;line-height:1.05;letter-spacing:-.03em;margin:14px 0 10px;overflow-wrap:anywhere}
.tagh h1 i{font-style:normal;opacity:.55;margin-right:2px}
.tagh .tdesc{margin:0;max-width:560px;font-size:15.5px;line-height:1.55;color:rgba(255,255,255,.92)}
.tagh .tdesc p{margin:0}
.tagh .stats{display:flex;gap:8px 10px;flex-wrap:wrap;margin:16px 0 0}
.tagh .stats span{font:600 13px var(--bd);background:rgba(0,0,0,.22);padding:5px 12px;border-radius:999px}
.tagh .stats b{font-weight:800}
.tagh .rel-t{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.22)}
.tagh .rel-t small{font:700 11px var(--bd);letter-spacing:.1em;text-transform:uppercase;opacity:.8;margin-right:2px}
.tagh .rel-t a{font:600 13px var(--bd);color:#fff;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);padding:4px 12px;border-radius:999px;transition:background .18s,color .18s,transform .18s}
.tagh .rel-t a:hover,.tagh .rel-t a:focus-visible{background:#fff;color:#03212b;transform:translateY(-1px)}
.tagh-sub{display:flex;align-items:center;gap:10px;margin:22px 0 0;font:800 18px var(--hd)}
.tagh-sub::before{content:"";width:6px;height:22px;border-radius:3px;background:linear-gradient(var(--b1),var(--b2))}
@media (max-width:600px){.tagh{padding:22px 18px 20px;border-radius:14px}.tagh .hash{font-size:130px;right:10px;top:-14px}.tagh .tdesc{font-size:14.5px}.tagh .rel-t{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.tagh .rel-t a,.tagh .rel-t small{flex:none;white-space:nowrap}}

/* ===== Terpopuler: pilihan tampilan ===== */
.pop.nothumb a{grid-template-columns:40px minmax(0,1fr)}
.pop.nothumb .pn{font-size:52px}
/* ===== Halaman Kategori ===== */
.tagh-sub{--h:200}
.catfeat{--h:200;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(150px,1fr));gap:14px;margin:16px 0 4px}
.cf{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:flex-end;min-height:150px;padding:16px 18px;border-radius:14px;color:#fff;transition:transform .2s,box-shadow .2s}
.cf.main{grid-row:1/3;min-height:320px;padding:22px}
.cf .art{position:absolute;inset:0;z-index:-2}
.cf .art .ph{background:linear-gradient(135deg,hsl(var(--h) 60% 18%),hsl(var(--h) 80% 42%))!important}
.cf::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,hsl(var(--h) 75% 11% / .94),hsl(var(--h) 70% 22% / .35) 58%,hsl(var(--h) 80% 30% / .06))}
.cf:hover,.cf:focus-visible{transform:translateY(-3px);box-shadow:0 14px 28px hsl(var(--h) 70% 28% / .3)}
.cf .art img{transition:transform .35s}.cf:hover .art img{transform:scale(1.04)}
.cf .bd{display:inline-block;font:700 11px var(--bd);letter-spacing:.07em;text-transform:uppercase;background:hsl(var(--h) 92% 64%);color:#06141c;padding:3px 9px;border-radius:5px}
.cf h3{font-size:18px;font-weight:700;line-height:1.25;margin:8px 0 0;overflow-wrap:break-word}
.cf.main h3{font-size:clamp(22px,2.6vw,28px);font-weight:800;margin-top:10px}
.cf .m{margin-top:8px;font-size:14px;opacity:.88}
.catsec .tagh-sub::before{background:linear-gradient(hsl(var(--h) 85% 55%),hsl(calc(var(--h) + 45) 85% 55%))}
.catsec .post{transition:background .2s}
.catsec .post:hover h3{color:hsl(var(--h) 80% 34%)}
:root[data-theme="dark"] .catsec .post:hover h3{color:hsl(var(--h) 90% 68%)}
@media (max-width:700px){.catfeat{grid-template-columns:minmax(0,1fr);grid-template-rows:none}.cf.main{grid-row:auto;min-height:250px}}

/* ===== Navbar: dropdown bertingkat & megamenu ===== */
header.main .wrap{position:relative}
.nav .menu{flex-wrap:nowrap}
.nav .menu li{list-style:none}
.nav .menu-search{display:none}
.nav .current-menu-ancestor>a,.nav .current-menu-parent>a{color:var(--accent)}
.sub-toggle{flex:none;display:grid;place-items:center;width:22px;height:22px;margin:0 0 0 -6px;padding:0;border:0;border-radius:50%;background:none;color:inherit;cursor:pointer;opacity:.7;transition:opacity .15s,background .15s}
.sub-toggle svg{transition:transform .22s ease}
.sub-toggle:hover{opacity:1;background:var(--chip)}
.navbtn{display:none}
.mfc small{display:block;margin-top:3px;font-size:12px;color:var(--muted);font-weight:500}

@media (min-width:901px){
	.nav{overflow:visible;align-self:stretch;display:flex}
	.nav .menu{align-items:stretch;height:100%}
	.nav .menu>li{position:relative;display:flex;align-items:center}
	.nav .menu>li>a{display:flex;align-items:center}
	.nav .menu>li.menu-search{display:none}
	.nav .menu>li.menu-item-has-children>a{padding-right:6px}
	.nav .menu>li:hover>.sub-toggle svg,.nav .menu>li.open>.sub-toggle svg{transform:rotate(180deg)}
	.nav .menu>li:hover>a,.nav .menu>li.open>a{color:var(--accent)}
	.nav .menu>li:hover>a::after,.nav .menu>li.open>a::after{transform:scaleX(1)}
	.nav .sub-menu{position:absolute;left:0;top:100%;z-index:30;min-width:240px;margin:0;padding:8px;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 44px rgba(26,11,46,.18);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .2s ease .12s,transform .22s ease .12s,visibility 0s linear .34s}
	.nav .sub-menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
	.nav li:hover>.sub-menu,.nav li:focus-within>.sub-menu,.nav li.open>.sub-menu{opacity:1;visibility:visible;transform:none;transition-delay:0s}
	.nav .sub-menu li{position:relative;display:flex;align-items:center}
	.nav .sub-menu a{flex:1;min-width:0;display:block;padding:9px 12px;border-radius:9px;font-weight:600;font-size:14.5px;white-space:normal;transition:background .15s,color .15s,padding .15s}
	.nav .sub-menu a::after{display:none}
	.nav .sub-menu a:hover,.nav .sub-menu a:focus-visible{background:var(--chip);color:var(--accent)}
	.nav .sub-menu .sub-toggle{margin:0 4px 0 0}
	.nav .sub-menu .sub-toggle svg{transform:rotate(-90deg)}
	.nav .sub-menu .sub-menu{left:calc(100% + 6px);top:-9px}
	.nav .sub-menu .sub-menu::before{left:-12px;right:auto;top:0;bottom:0;width:12px;height:auto}
	.nav .menu>li:last-of-type .sub-menu,.nav .menu>li:nth-last-of-type(2) .sub-menu{left:auto;right:0}
	.nav .menu>li:last-of-type .sub-menu .sub-menu,.nav .menu>li:nth-last-of-type(2) .sub-menu .sub-menu{left:auto;right:calc(100% + 6px)}
	/* Megamenu */
	.nav .menu>li.mega{position:static}
	.nav .menu>li.mega>.sub-menu{left:20px;right:20px;top:100%;min-width:0;padding:26px 28px 28px;display:flex;flex-wrap:wrap;gap:22px 30px;border-radius:0 0 20px 20px;overflow:hidden;box-shadow:0 28px 50px rgba(26,11,46,.2)}
	.nav .menu>li.mega>.sub-menu::before{display:none}
	.nav .menu>li.mega>.sub-menu::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--grad)}
	.nav .mega>.sub-menu>li{flex:1 1 170px;min-width:0;display:block}
	.nav .mega>.sub-menu>.sub-toggle,.nav .mega>.sub-menu>li>.sub-toggle{display:none}
	.nav .mega>.sub-menu>li>a{padding:7px 0;border-radius:0;font-size:14.5px}
	.nav .mega>.sub-menu>li>a:hover{background:none}
	.nav .mega>.sub-menu>li.menu-item-has-children>a{position:relative;margin-bottom:8px;padding:0 0 12px;font:800 12.5px var(--hd);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);border-bottom:2px solid var(--line)}
	.nav .mega>.sub-menu>li.menu-item-has-children>a::after{display:block;content:"";position:absolute;left:0;bottom:-2px;right:auto;width:36px;height:3px;border-radius:3px;background:var(--grad);transform:none}
	.nav .mega .sub-menu .sub-menu{position:static;display:block;min-width:0;padding:0;border:0;border-radius:0;box-shadow:none;background:none;opacity:1;visibility:visible;transform:none;transition:none}
	.nav .mega .sub-menu .sub-menu::before{display:none}
	.nav .mega .sub-menu .sub-menu li{display:block}
	.nav .mega .sub-menu .sub-menu a{padding:6px 0;font-weight:500;color:var(--muted);background:none}
	.nav .mega .sub-menu .sub-menu a:hover{color:var(--accent);padding-left:6px;background:none}
	.nav .mega-feat{flex:2.4 1 380px!important}
	.nav .mf-h{display:block;margin-bottom:12px;padding-bottom:12px;border-bottom:2px solid var(--line);font:800 12.5px var(--hd);letter-spacing:.08em;text-transform:uppercase}
	.nav .mf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
	.nav .sub-menu .mfc{display:block;flex:none;padding:0;border-radius:0;background:none}
	.nav .sub-menu .mfc:hover{background:none}
	.nav .mfc .mt{display:block;aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:var(--chip);margin-bottom:8px}
	.nav .mfc .mt img,.nav .mfc .mt .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
	.nav .mfc:hover .mt img{transform:scale(1.06)}
	.nav .mfc b{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font:600 14px/1.35 var(--bd);color:var(--ink);transition:color .15s}
	.nav .mfc:hover b{color:var(--accent)}
	/* Efek muncul bertahap untuk kolom megamenu */
	.nav .mega>.sub-menu>li{opacity:0;transform:translateY(8px);transition:opacity .25s ease,transform .3s ease}
	.nav .mega:hover>.sub-menu>li,.nav .mega:focus-within>.sub-menu>li,.nav .mega.open>.sub-menu>li{opacity:1;transform:none}
	.nav .mega>.sub-menu>li:nth-child(2){transition-delay:.04s}.nav .mega>.sub-menu>li:nth-child(3){transition-delay:.08s}.nav .mega>.sub-menu>li:nth-child(4){transition-delay:.12s}.nav .mega>.sub-menu>li:nth-child(n+5){transition-delay:.16s}
}

@media (max-width:900px){
	.navbtn{display:grid;place-items:center;flex:none;width:42px;height:42px;margin-left:auto;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);cursor:pointer;transition:background .15s,border-color .15s}
	.navbtn:hover{border-color:var(--accent)}
	.navbtn .bars{position:relative;display:block;width:18px;height:14px}
	.navbtn .bars i{position:absolute;left:0;right:0;height:2px;border-radius:2px;background:currentColor;transition:transform .25s ease,opacity .2s,top .25s}
	.navbtn .bars i:nth-child(1){top:0}.navbtn .bars i:nth-child(2){top:6px}.navbtn .bars i:nth-child(3){top:12px}
	header.main.open .navbtn .bars i:nth-child(1){top:6px;transform:rotate(45deg)}
	header.main.open .navbtn .bars i:nth-child(2){opacity:0}
	header.main.open .navbtn .bars i:nth-child(3){top:6px;transform:rotate(-45deg)}
	header.main .nav{position:absolute;left:0;right:0;top:100%;display:block;flex:none;max-height:0;overflow:hidden;visibility:hidden;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:0 22px 34px rgba(26,11,46,.16);transition:max-height .35s ease,visibility 0s linear .35s}
	header.main.open .nav{max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px);overflow-y:auto;visibility:visible;transition:max-height .35s ease}
	.nav .menu{flex-direction:column;gap:0;padding:6px 16px 16px}
	.nav .menu li{display:flex;flex-wrap:wrap;align-items:center;border-top:1px solid var(--line)}
	.nav .menu>li:first-child{border-top:0}
	.nav .menu a{flex:1;min-width:0;padding:13px 4px;font-size:16px;white-space:normal}
	.nav .menu a::after{display:none}
	.sub-toggle{width:44px;height:44px;margin:0;opacity:.8}
	.sub-toggle svg{width:14px;height:14px}
	.nav li.open>.sub-toggle svg{transform:rotate(180deg)}
	.nav .sub-menu{flex-basis:100%;width:100%;margin:0;padding:0 0 0 14px;list-style:none;max-height:0;overflow:hidden;transition:max-height .32s ease}
	.nav li.open>.sub-menu{max-height:2400px}
	.nav .sub-menu li{border-top:1px dashed var(--line)}
	.nav .sub-menu a{padding:11px 4px;font-size:15px;font-weight:500}
	.nav .menu li.mega-feat{display:none}
	.nav .menu li.menu-search{display:block;border-top:1px solid var(--line);padding-top:14px;margin-top:4px}
	.nav .menu-search form{width:100%}
	.nav .menu-search input{width:100%;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:999px;padding:11px 16px;font:inherit;font-size:15px}
	.nav .menu-search input:focus{border-color:var(--b1);outline:0;box-shadow:0 0 0 3px rgba(183,38,203,.22)}
}

/* ===== Artikel: tata letak, foto utama lebar ===== */
.wrap.single-wrap.has-side,.wrap.single-wrap.no-side{max-width:calc(var(--wrap-w) + 40px)}
.single-wrap{--txt-w:var(--art-w,720px)}
.single-wrap.has-side{--txt-w:min(var(--art-w,720px),660px)}
.single-wrap .single-cols{margin:0 0 34px;gap:44px}
.entry-wrap{min-width:0}
.txt{max-width:var(--txt-w);margin-left:auto;margin-right:auto}
.has-side .art-head{max-width:none}
.has-side .entry-wrap h1{font-size:clamp(28px,3.4vw,40px);line-height:1.15}
.no-side .entry-wrap h1{font-size:clamp(28px,4vw,44px);line-height:1.12}
.feat{position:relative;margin:4px 0 28px;border-radius:18px;overflow:hidden;box-shadow:0 24px 48px -28px rgba(26,11,46,.55);background:var(--chip)}
.feat img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0}
.no-side.feat-wide .feat img{aspect-ratio:2/1;max-height:560px}
.feat-eq .feat{max-width:var(--txt-w);margin-left:auto;margin-right:auto}
.feat figcaption{padding:9px 16px;font-size:12.5px;color:var(--muted);background:var(--surface);border-top:1px solid var(--line)}
.single-cols aside{padding-top:2px}
@media (max-width:900px){.has-side .art-head,.txt{max-width:none}.no-side.feat-wide .feat img{aspect-ratio:16/9}}
@media (max-width:600px){.feat{border-radius:14px;margin-bottom:22px}}

/* ===== Sidebar artikel: Bacaan terkait ===== */
.relbox{position:relative;overflow:hidden;padding:22px 16px 8px}
.relbox::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)}
.relbox h2{display:flex;align-items:center;gap:9px;margin-bottom:14px;font-size:19px}
.relbox h2::before{content:"";width:5px;height:20px;border-radius:3px;background:linear-gradient(var(--b1),var(--b2))}
.rb-lead,.rn-lead{--h:200;position:relative;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;border-radius:14px;color:#fff;transition:transform .2s,box-shadow .2s}
.rb-lead .art,.rn-lead .art{position:absolute;inset:0;z-index:-2}
.rb-lead .art img,.rb-lead .art .ph,.rn-lead .art img,.rn-lead .art .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.rb-lead .art .ph,.rn-lead .art .ph{background:linear-gradient(135deg,hsl(var(--h) 60% 18%),hsl(var(--h) 80% 42%))!important}
.rb-lead::after,.rn-lead::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,hsl(var(--h) 75% 10% / .94),hsl(var(--h) 70% 20% / .35) 60%,hsl(var(--h) 80% 30% / .04))}
.rb-lead:hover,.rn-lead:hover{transform:translateY(-3px);box-shadow:0 16px 30px hsl(var(--h) 70% 26% / .3)}
.rb-lead:hover .art img,.rn-lead:hover .art img{transform:scale(1.05)}
.rb-lead .bd,.rn-lead .bd{display:inline-block;font:700 11px var(--bd);letter-spacing:.07em;text-transform:uppercase;background:hsl(var(--h) 92% 64%);color:#06141c;padding:3px 9px;border-radius:5px}
.rb-lead{min-height:200px;padding:16px;margin-bottom:4px}
.rb-lead .tx{display:block}
.rb-lead b{display:block;margin-top:8px;font:700 18px/1.28 var(--hd);overflow-wrap:break-word}
.rb-row{display:grid;grid-template-columns:88px minmax(0,1fr);gap:13px;align-items:center;padding:13px 0;border-top:1px dashed var(--line)}
.rb-lead+.rb-row{border-top:0}
.rb-row .mt{display:block;aspect-ratio:7/6;border-radius:11px;overflow:hidden;background:var(--chip)}
.rb-row .mt img,.rb-row .mt .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.rb-row:hover .mt img{transform:scale(1.08)}
.rb-row .cat{display:block;font-size:11.5px;line-height:1.2;margin-bottom:3px}
.rb-row b{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font:600 14px/1.35 var(--bd);transition:color .15s}
.rb-row:hover b{color:var(--accent)}
.rb-row small{display:block;margin-top:4px;font-size:12px;color:var(--muted)}

/* ===== Baca selanjutnya ===== */
.readnext{margin:10px 0 24px;padding:28px;border-radius:24px;background:var(--chip);position:relative;overflow:hidden}
.readnext::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)}
.rn-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.rn-head h2{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:-.03em}
.rn-kick{font:700 11.5px var(--bd);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.rn-top{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px}
.rn-lead{min-height:340px;padding:24px}
.rn-lead .tx{display:block;max-width:560px}
.rn-lead b{display:block;margin:10px 0 8px;font:800 clamp(22px,2.6vw,30px)/1.15 var(--hd);letter-spacing:-.02em;overflow-wrap:break-word}
.rn-lead .m{display:block;font-size:13px;opacity:.85}
.rn-list{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px}
.rn-mini,.rn-card{background:var(--surface);border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.rn-mini:hover,.rn-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(26,11,46,.12)}
.rn-mini{position:relative;display:grid;grid-template-columns:116px minmax(0,1fr);gap:14px;align-items:center;padding:10px 14px 10px 10px}
.rn-mini .mt{display:block;aspect-ratio:4/3;border-radius:11px;overflow:hidden;background:var(--chip)}
.rn-mini .no{position:absolute;right:12px;top:6px;font:800 30px/1 var(--hd);letter-spacing:-.06em;color:var(--chip)}
.rn-mini .mx{min-width:0;position:relative}
.rn-mini b,.rn-card b{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font:700 15px/1.3 var(--bd);transition:color .15s}
.rn-mini:hover b,.rn-card:hover b{color:var(--accent)}
.rn-mini .cat,.rn-card .cat{display:block;font-size:11.5px;line-height:1.2;margin-bottom:3px}
.rn-mini small,.rn-card small{display:block;margin-top:5px;font-size:12px;color:var(--muted)}
.rn-mini .mt img,.rn-mini .mt .ph,.rn-card .mt img,.rn-card .mt .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.rn-mini:hover .mt img,.rn-card:hover .mt img{transform:scale(1.07)}
.rn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.rn-card{display:block}
.rn-card .mt{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--bg)}
.rn-card .mx{display:block;padding:12px 14px 14px}
:root[data-theme="dark"] .rn-mini .no{color:var(--line)}
@media (max-width:900px){.rn-top{grid-template-columns:minmax(0,1fr)}.rn-list{grid-template-rows:none}.rn-lead{min-height:300px}}
@media (max-width:700px){.readnext{padding:20px 14px;border-radius:18px}.rn-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.rn-lead{min-height:250px;padding:18px}.rn-card .mx{padding:10px 11px 12px}.rn-card b{font-size:14px}.rn-mini{grid-template-columns:96px minmax(0,1fr)}}

/* ===== Hero Spotlight (v1.5.7) ===== */
.spot{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px;margin:22px 0 0}
.sp-lead{--h:200;position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:80px;min-height:440px;padding:22px;border-radius:24px;overflow:hidden;isolation:isolate;color:#fff;animation:spIn .6s cubic-bezier(.2,.7,.2,1) both}
.sp-art{position:absolute;inset:0;z-index:-2}
.sp-art img,.sp-art .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.sp-lead:hover .sp-art img{transform:scale(1.05)}
.sp-lead::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,hsl(var(--h) 70% 8% / .96) 0,hsl(var(--h) 65% 14% / .62) 40%,transparent 72%),linear-gradient(125deg,hsl(var(--h) 90% 50% / .24),transparent 42%)}
.sp-lead::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);z-index:1;pointer-events:none}
.sp-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sp-live,.sp-cat{display:inline-flex;align-items:center;gap:8px;font:700 11.5px var(--bd);letter-spacing:.09em;text-transform:uppercase;padding:6px 12px;border-radius:999px}
.sp-live{background:rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}
.sp-live i{width:8px;height:8px;border-radius:50%;background:var(--hi);animation:spPulse 1.8s infinite}
.sp-cat{background:hsl(var(--h) 92% 64%);color:#06141c}
.sp-tx{display:block;max-width:700px}
.sp-tx h1{font-size:clamp(28px,4vw,46px);font-weight:800;line-height:1.07;letter-spacing:-.035em;text-wrap:balance;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:break-word}
.sp-ex{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:12px 0 16px;font-size:16px;line-height:1.5;opacity:.88;max-width:600px}
.sp-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 16px;font-size:13px}
.sp-meta>span:not(.sp-go){opacity:.85}
.sp-meta>span:not(.sp-go)+span:not(.sp-go)::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.6;margin:0 14px 2px 0;vertical-align:middle}
.sp-go{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#1a1325;font-weight:700;font-size:13.5px;padding:9px 16px;border-radius:999px;transition:background .2s,transform .2s}
.sp-go b{display:inline-block;transition:transform .2s}
.sp-lead:hover .sp-go{background:var(--grad)}
.sp-lead:hover .sp-go b{transform:translateX(4px)}
.sp-rail{position:relative;display:flex;flex-direction:column;overflow:hidden;background:var(--foot);color:#eef2f8;border-radius:24px;padding:6px 18px 14px;animation:spIn .6s .12s cubic-bezier(.2,.7,.2,1) both}
.sp-rail::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)}
:root[data-theme="dark"] .sp-rail{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.sp-rh{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:20px 0 12px}
.sp-rh b{font:800 19px var(--hd);letter-spacing:-.02em}
.sp-rh span{font:700 11px var(--bd);letter-spacing:.12em;text-transform:uppercase;color:var(--hi)}
.sp-it{--h:200;position:relative;flex:1;display:grid;grid-template-columns:minmax(0,1fr) 92px;gap:14px;align-items:center;padding:14px 0 14px 14px;border-top:1px solid rgba(255,255,255,.1)}
.sp-it::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:3px;background:hsl(var(--h) 90% 62%);transform:scaleY(.35);transition:transform .25s}
.sp-it:hover::before{transform:scaleY(1)}
.sp-itx{min-width:0}
.sp-c{display:block;font:700 11.5px/1.2 var(--bd);letter-spacing:.07em;text-transform:uppercase;color:hsl(var(--h) 90% 72%)}
.sp-it h2{font:700 16px/1.32 var(--bd);letter-spacing:0;margin:4px 0 5px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:break-word;transition:color .15s}
.sp-it:hover h2{color:var(--hi)}
.sp-it small{display:block;font-size:12px;color:#a99fbb}
.sp-th{display:block;aspect-ratio:1;border-radius:16px;overflow:hidden;background:#2a2040;transform:rotate(2.5deg);transition:transform .3s}
.sp-it:hover .sp-th{transform:rotate(0) scale(1.04)}
.sp-th img,.sp-th .ph{width:100%;height:100%;object-fit:cover;display:block}
.sp-more{margin-top:auto;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);font:600 13px var(--bd);color:var(--hi)}
.sp-more b{display:inline-block;transition:transform .2s}.sp-more:hover b{transform:translateY(3px)}
@keyframes spIn{from{opacity:0;transform:translateY(14px)}}
@keyframes spPulse{0%{box-shadow:0 0 0 0 rgba(242,199,92,.6)}70%,100%{box-shadow:0 0 0 8px rgba(242,199,92,0)}}
@media (max-width:900px){.spot{grid-template-columns:minmax(0,1fr)}.sp-lead{min-height:400px}}
@media (max-width:600px){.spot{margin-top:14px;gap:12px}.sp-lead{min-height:360px;padding:16px;gap:60px;border-radius:20px}.sp-tx h1{font-size:26px}.sp-ex{font-size:15px}.sp-rail{border-radius:20px;padding:4px 14px 12px}.sp-it{grid-template-columns:minmax(0,1fr) 78px}}
@media (prefers-reduced-motion:reduce){.sp-lead,.sp-rail,.sp-live i{animation:none}.sp-art img,.sp-th{transition:none}}

/* ===== v1.5.8: navbar center, sosmed di bar atas, bagikan di byline ===== */
.util .wrap{align-items:center}
.util-r{display:flex;align-items:center;gap:14px;margin-left:auto}
.u-soc{display:flex;align-items:center;gap:2px;padding-right:14px;border-right:1px solid rgba(255,255,255,.16)}
.u-soc a{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:#d9cfe8;transition:color .15s,background .15s,transform .15s}
.u-soc a:hover{color:var(--hi);background:rgba(255,255,255,.08);transform:translateY(-1px)}
@media (min-width:1101px){
	header.main .wrap{display:grid;grid-template-columns:1fr auto 1fr;gap:24px}
	header.main .wrap>.custom-logo-link{justify-self:start}
	header.main .wrap>.nav{justify-self:center}
	header.main .wrap>form{justify-self:end}
	.nav .menu{justify-content:center}
}
.byline{align-items:center}
.bshare{margin-left:auto;display:flex;align-items:center;gap:6px}
.bs-l{display:none;font:700 11.5px var(--bd);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.bshare a,.bshare button{display:grid;place-items:center;width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--muted);cursor:pointer;transition:background .15s,color .15s,border-color .15s,transform .15s}
.bshare a:hover,.bshare button:hover{transform:translateY(-2px);color:#fff;border-color:transparent}
.bs-wa:hover{background:#25d366}.bs-fb:hover{background:#1877f2}.bs-tw:hover{background:#1a1325}.bs-tg:hover{background:#229ed9}.bs-cp:hover{background:var(--accent)}
:root[data-theme="dark"] .bs-tw:hover{background:#3b4658}
.bshare .bs-cp.ok{background:var(--grad);color:var(--on-brand);border-color:transparent}
@media (max-width:600px){
	.bshare{flex:1 0 100%;margin:4px 0 0;padding-top:12px;border-top:1px dashed var(--line);gap:8px}
	.bs-l{display:block;margin-right:auto}
	.bshare a,.bshare button{width:40px;height:40px}
}
@media (max-width:480px){
	.util .u-date{display:none}
	.util-r{width:100%;justify-content:space-between}
	.u-soc{border-right:0;padding-right:0}
	.util-r>button{margin-left:auto}
}

/* ===== Pewarta 2.0: logo, Pilihan Redaksi, blok kategori, Berita Selanjutnya ===== */
.ck-brand{display:flex;align-items:center;gap:10px;flex:none}
.ck-mark{display:block;height:44px;width:auto}
.ck-word{font:800 24px/1 var(--hd);letter-spacing:-.035em;color:var(--ink);white-space:nowrap}
footer.site .ck-word{color:#fff}
.pick{margin:26px 0 0;padding:22px 22px 24px;border-radius:24px;background:var(--chip);position:relative;overflow:hidden}
.pick::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#b8860b,#f2c75c,#b8860b)}
.pk-head{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;margin-bottom:16px}
.pk-head h2{display:flex;align-items:center;gap:10px;font-size:clamp(22px,2.6vw,28px);font-weight:800;letter-spacing:-.03em}
.pk-ico{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--grad);color:#fff}
.pk-sub{font:700 11.5px var(--bd);letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.pk-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.pk-grid.pk-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pk-card{--h:280;position:relative;display:flex;flex-direction:column;background:var(--surface);border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.pk-card:hover{transform:translateY(-4px);box-shadow:0 16px 30px rgba(26,11,46,.16)}
.pk-th{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--chip)}
.pk-th img,.pk-th .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.pk-card:hover .pk-th img{transform:scale(1.06)}
.pk-no{position:absolute;left:10px;bottom:10px;min-width:30px;height:30px;padding:0 8px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(135deg,#f2c75c,#c8911a);color:#2a1a00;font:800 15px var(--hd);box-shadow:0 4px 10px rgba(0,0,0,.25)}
.pk-tx{display:block;padding:12px 14px 14px}
.pk-cat{display:block;margin-bottom:5px;font:700 11.5px/1.2 var(--bd);letter-spacing:.07em;text-transform:uppercase;color:hsl(var(--h) 70% 36%)}
:root[data-theme="dark"] .pk-cat{color:hsl(var(--h) 90% 72%)}
.pk-tx b{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font:700 16px/1.32 var(--bd);transition:color .15s;overflow-wrap:break-word}
.pk-card:hover .pk-tx b{color:var(--accent)}
.pk-tx small{display:block;margin-top:6px;font-size:12px;color:var(--muted)}
.catblocks{margin-bottom:6px}
.catblocks .hero2{margin:0 0 6px;border-top:0}
.catblocks .hero2:first-child{padding-top:4px}
.catblocks .hero2.tint{margin:14px 0}
.nextfeed{margin:34px 0 28px}
.nf-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding-bottom:12px;margin-bottom:4px;border-bottom:3px solid transparent;border-image:var(--grad) 1}
.nf-head h2{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:-.03em}
.nf-kick{font:700 11.5px var(--bd);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.nf-list .post:first-child{padding-top:20px}
@media (max-width:900px){
	.ck-mark{height:38px}.ck-word{font-size:22px}
	.pk-grid,.pk-grid.pk-3{grid-template-columns:repeat(2,minmax(0,1fr))}
	.pk-grid>.pk-card:last-child:nth-child(odd){grid-column:1/-1}
}
@media (max-width:600px){
	.pick{margin-top:18px;padding:16px 12px 18px;border-radius:18px}
	.pk-grid{gap:12px}.pk-tx{padding:10px 11px 12px}.pk-tx b{font-size:14.5px}
}

@media (min-width:1101px) and (max-width:1200px){header.main input.search{width:150px}.ck-word{font-size:22px}}
@media (min-width:901px) and (max-width:1100px){header.main .wrap{gap:14px}.nav{flex:1;min-width:0;justify-content:center}.nav .menu{justify-content:center;gap:2px}.menu a{padding:8px 8px;font-size:14px}.menu a::after{left:8px;right:8px}header.main input.search{width:130px}.ck-word{font-size:21px}.ck-mark{height:38px}}
@media (min-width:901px) and (max-width:1000px){.menu a{padding:8px 6px;font-size:13.5px}.menu a::after{left:6px;right:6px}header.main input.search{width:110px}.ck-word{font-size:19px}.ck-mark{height:34px}}