:root{--bg:#f2f4f7;--card:#fff;--ink:#17212e;--muted:#667284;--line:#dfe4ea;--navy:#1c3253;--navy-soft:#e8edf5;--red:#b2383c;--radius:16px;
--serif:"Newsreader",Georgia,serif;--sans:"Instrument Sans",system-ui,sans-serif;--shadow:0 1px 2px rgba(23,33,46,.05),0 8px 24px -12px rgba(23,33,46,.12);--lh:44px;--lhm:34px}
@media(prefers-color-scheme:dark){:root{--bg:#10151c;--card:#171e27;--ink:#e6e9ee;--muted:#98a3b3;--line:#273140;--navy:#8fb0e0;--navy-soft:#1d2837;--red:#e5787c;--shadow:0 8px 24px -12px rgba(0,0,0,.6)}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;overflow-x:hidden}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--navy);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--wrapw,1180px);margin:0 auto;padding:0 20px}
.pt{padding-top:28px}

/* ---------- header ---------- */
.mast{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.mast::before{content:"";display:block;height:3px;background:linear-gradient(90deg,var(--red) 0 22%,var(--navy) 22% 100%)}
.mast .wrap{display:flex;align-items:center;gap:14px 24px;min-height:68px;flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
.brand{display:flex;align-items:center;gap:12px;line-height:1.1;flex:none;max-width:100%}
.brand img{height:var(--lh);width:auto;max-width:70vw;object-fit:contain}
.brand .bt{display:flex;flex-direction:column;min-width:0}
.brand b{font:700 1.55rem var(--serif);letter-spacing:-.02em;color:var(--navy)}
.brand small{color:var(--muted);font-size:.78rem;margin-top:3px}
@media(prefers-color-scheme:dark){.brand.lbg img{background:#fff;padding:4px 10px;border-radius:10px}}
.mast.ctr .brand{flex-basis:100%;justify-content:center}
.mast.ctr .bt{text-align:center}
.nav{display:flex;align-items:center;gap:4px;flex:1;min-width:0}
.navs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;min-width:0}
.nav a{padding:8px 13px;border-radius:99px;font-size:.92rem;font-weight:500;color:var(--muted);white-space:nowrap;transition:.2s}
.nav a:hover,.nav a.on{background:var(--navy-soft);color:var(--navy)}
.dd{position:relative}
.ddb{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--navy-soft);color:var(--navy);padding:8px 16px;border-radius:99px;font:600 .92rem var(--sans);cursor:pointer;min-height:40px}
.ddb svg{width:14px;height:14px;transition:transform .2s}
.ddb[aria-expanded=true] svg{transform:rotate(180deg)}
.ddb.on{border-color:var(--navy)}
.ddp{position:absolute;left:0;top:calc(100% + 8px);min-width:320px;max-width:min(580px,92vw);background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 40px -12px rgba(0,0,0,.3);padding:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;max-height:70vh;overflow:auto;z-index:40}
.ddp a{padding:10px 14px;border-radius:10px;font-weight:500;font-size:.93rem;white-space:normal;color:var(--ink)}
.ddp a:hover,.ddp a.on{background:var(--navy-soft);color:var(--navy)}
.search{display:flex}.search input{border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:99px;padding:8px 16px;font:inherit;font-size:.9rem;width:170px;min-height:40px}

/* ---------- slider atas ---------- */
.hero{position:relative;margin:24px auto;border-radius:22px;overflow:hidden;aspect-ratio:var(--hr,3/1);max-width:var(--hmax,none);background:var(--navy-soft);box-shadow:var(--shadow)}
.hero .htrack{display:flex;height:100%;transition:transform .75s cubic-bezier(.65,0,.25,1);will-change:transform}
.hero .slide{flex:0 0 100%;height:100%;min-width:0}
.hnav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:38px;height:38px;border:0;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;font:400 24px/1 var(--sans);cursor:pointer;opacity:0;transition:opacity .2s}
.hprev{left:12px}.hnext{right:12px}.hero:hover .hnav,.hnav:focus-visible{opacity:1}
@media(hover:none){.hnav{display:none}}@media(prefers-reduced-motion:reduce){.hero .htrack{transition:none}}
.hero .slide a{display:block;width:100%;height:100%}
.hero img{width:100%;height:100%;object-fit:var(--fit,cover)}
.dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px}
.dots button{width:8px;height:8px;border-radius:9px;border:0;background:#fff9;cursor:pointer;padding:0;transition:.3s}.dots button.on{width:24px;background:#fff}

/* ---------- iklan & kolase (ukuran diatur dari admin) ---------- */
.adgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap,16px);max-width:var(--maxw,none);margin-inline:auto;width:100%}
.ad{flex:0 0 calc((100% - (var(--cols,1) - 1)*var(--gap,16px) - .5px)/var(--cols,1));min-width:0;border-radius:14px;overflow:hidden;box-shadow:var(--shadow);background:var(--navy-soft)}
.ad a,.ad img{display:block;width:100%}
.ad img{height:auto}
.ad.fix{aspect-ratio:var(--r,4/3)}
.ad.fix a,.ad.fix img{height:100%}
.ad.fix img{object-fit:var(--fit,cover)}
@media(max-width:640px){.ad{flex-basis:calc((100% - (var(--mcols,1) - 1)*var(--gap,16px) - .5px)/var(--mcols,1))}}

.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start;padding-bottom:40px}
h2.sec{font:600 1.5rem var(--serif);margin:8px 0 18px;display:flex;align-items:center;gap:12px;color:var(--navy)}
h2.sec::after{content:"";flex:1;height:1px;background:var(--line)}
.lead{display:grid;grid-template-columns:1.25fr 1fr;background:var(--card);border-radius:22px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:28px}
.lead .img{min-height:300px;background:var(--navy-soft)}.lead .img img{width:100%;height:100%;object-fit:cover}
.lead .txt{padding:32px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.lead h3{font:600 1.85rem/1.2 var(--serif);margin:0;letter-spacing:-.01em}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px}
.card{background:var(--card);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:transform .25s}
.card:hover{transform:translateY(-3px)}.card .ph{aspect-ratio:16/10;background:var(--navy-soft);overflow:hidden}.card .ph img{width:100%;height:100%;object-fit:cover}
.card .bd{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.card h3{font:600 1.12rem/1.35 var(--serif);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.tag{color:var(--red);font-weight:600;font-size:.82rem}
.meta{display:flex;gap:4px 14px;flex-wrap:wrap;color:var(--muted);font-size:.82rem;margin-top:auto;align-items:center}
.meta svg{width:15px;height:15px;vertical-align:-3px;margin-right:4px;display:inline}
.btn{display:inline-block;border:0;background:var(--navy);color:var(--card);padding:10px 22px;border-radius:99px;font:600 .92rem var(--sans);cursor:pointer}
.btn:hover{opacity:.9}.more{text-align:center;margin:30px 0}
.side{display:flex;flex-direction:column;gap:18px}
.inline{margin:26px 0}
.greetwrap{margin:12px 0 40px}

/* ---------- halaman berita ---------- */
.art{background:var(--card);border-radius:22px;padding:clamp(20px,4vw,48px);box-shadow:var(--shadow);min-width:0}
.art h1{font:700 clamp(1.6rem,3.6vw,2.5rem)/1.2 var(--serif);letter-spacing:-.015em;margin:8px 0 14px;color:var(--navy);overflow-wrap:anywhere}
.art .meta{margin:0 0 22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.art .cover{border-radius:16px;width:100%;height:auto;margin-bottom:8px}
.body{font:1.12rem/1.85 var(--serif);max-width:68ch;overflow-wrap:anywhere;word-break:break-word}
.body p{margin:0 0 1em}
.body img,.body video{max-width:100%;height:auto;border-radius:12px;margin:20px 0}
.body iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:12px;margin:20px 0}
.body table{display:table;width:100%;max-width:100%;border-collapse:collapse;margin:1em 0;table-layout:auto}
.body td,.body th{border:1px solid var(--line);padding:6px 10px}
.body pre{max-width:100%;overflow-x:auto;white-space:pre-wrap}
.body h2{font:600 1.5rem var(--serif);margin:32px 0 8px}
.body blockquote{margin:24px 0;padding:4px 0 4px 20px;border-left:3px solid var(--red);color:var(--muted);font-style:italic}
.body a{color:var(--navy);text-decoration:underline}
.body ul,.body ol{margin:0 0 1em;padding-left:1.6em}.body li{margin:.25em 0}.body li>ul,.body li>ol{margin:.25em 0 .25em}
.body ul{list-style:disc}.body ul ul{list-style:circle}.body ol{list-style:decimal}.body ol ol{list-style:lower-alpha}
.body h3{font:600 1.25rem var(--serif);margin:26px 0 6px}.body h4{font:600 1.08rem var(--serif);margin:20px 0 4px}
.body hr{border:0;border-top:1px solid var(--line);margin:28px 0}
.body th{background:var(--navy-soft);text-align:left}.body [style*="background-color"]{color:#111;border-radius:3px;padding:0 .15em}.body mark{background:#fff3a3;color:inherit;padding:0 .15em;border-radius:3px}
.share{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}.share a,.share button{border:1px solid var(--line);background:none;color:var(--ink);padding:9px 16px;border-radius:99px;font:500 .88rem var(--sans);cursor:pointer;min-height:40px}

/* ---------- footer ---------- */
.foot{background:var(--navy);color:#dbe4f2;padding:40px 0 28px;margin-top:20px}
@media(prefers-color-scheme:dark){.foot{background:#0b1016}}
.foot .cols{display:grid;grid-template-columns:1fr 1.4fr;gap:40px}.foot h4{font:600 1.2rem var(--serif);margin:0 0 10px;color:#fff}
.foot p{margin:4px 0;font-size:.88rem;opacity:.85}.foot .copy{border-top:1px solid #ffffff22;margin-top:26px;padding-top:16px;font-size:.82rem;opacity:.7}
.empty{padding:50px;text-align:center;color:var(--muted)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
[hidden]{display:none!important}
.grid .empty{grid-column:1/-1}

/* ---------- ticker ---------- */
.tick{background:var(--navy);color:#fff}.tick .wrap{display:flex;align-items:center;gap:14px;height:40px}
@media(prefers-color-scheme:dark){.tick{background:#0b1016}}
.tl{background:var(--red);color:#fff;font-weight:600;font-size:.8rem;padding:3px 14px;border-radius:99px;flex:none}
.tw{overflow:hidden;flex:1;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.tt{display:flex;gap:44px;width:max-content;animation:tk 70s linear infinite;font-size:.88rem}.tt:hover{animation-play-state:paused}.tt a{white-space:nowrap;opacity:.92}.tt a:hover{opacity:1;text-decoration:underline}
@keyframes tk{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.tt{animation:none}.tw{overflow-x:auto}}

/* ---------- berita utama ---------- */
.feat{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(0,1.2fr);gap:20px;margin:8px 0 34px}.feat.solo{grid-template-columns:minmax(0,1fr)}
.big{position:relative;border-radius:22px;overflow:hidden;min-height:400px;background:var(--navy);box-shadow:var(--shadow);display:flex;align-items:flex-end}
.big>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s}.big:hover>img{transform:scale(1.03)}
.big .ov{position:relative;padding:80px 24px 24px;width:100%;color:#fff;background:linear-gradient(to top,rgba(10,18,32,.92),rgba(10,18,32,.55) 55%,transparent)}
.big h2{font:700 clamp(1.3rem,2.2vw,1.8rem)/1.25 var(--serif);margin:8px 0 10px;letter-spacing:-.015em;overflow-wrap:anywhere}
.big .tag{background:var(--red);color:#fff;padding:3px 12px;border-radius:99px;font-size:.78rem}.big .meta{color:#ffffffcc}
.minis{display:flex;flex-direction:column;gap:14px}
.mini{display:grid;grid-template-columns:92px 1fr;gap:14px;background:var(--card);padding:12px;border-radius:16px;box-shadow:var(--shadow);transition:transform .25s;flex:1}
.mini:hover{transform:translateX(-3px)}.mini .mi{border-radius:11px;overflow:hidden;background:var(--navy-soft);min-height:80px}.mini .mi img{width:100%;height:100%;object-fit:cover}
.mini h4{font:600 .98rem/1.35 var(--serif);margin:3px 0 6px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.mini .meta{flex-wrap:wrap;gap:4px 12px;font-size:.76rem}

/* ---------- terpopuler ---------- */
.pop{background:var(--card);border-radius:20px;padding:20px 20px 8px;box-shadow:var(--shadow)}
.pop h3{font:600 1.25rem var(--serif);margin:0 0 6px;color:var(--navy)}
.pop a{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:13px 0;border-top:1px solid var(--line)}
.pop a:first-of-type{border-top:0}.pop b{font:700 1.7rem/1 var(--serif);color:var(--red);opacity:.85}
.pop span.t{font:600 .95rem/1.35 var(--serif);display:block;overflow-wrap:anywhere}.pop small{color:var(--muted);font-size:.78rem}

/* ---------- per kategori ---------- */
.catsec{margin:40px 0 0}.catsec h2.sec a{font:500 .85rem var(--sans);color:var(--muted);margin-left:auto;order:3}
.catsec h2.sec::after{order:2}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

/* ---------- tampilan tablet & HP (otomatis) ---------- */
@media(max-width:900px){
  .layout{grid-template-columns:1fr}
  .side{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .side .adgrid{max-width:var(--maxw,420px)}
  .lead{grid-template-columns:1fr}.lead .img{min-height:220px}
  .foot .cols{grid-template-columns:1fr}
  .feat{grid-template-columns:1fr}.big{min-height:340px}
  .grid3{grid-template-columns:1fr 1fr}
  .tl{display:none}
}
@media(max-width:700px){
  .mast .wrap{gap:10px 12px;min-height:0;padding-top:10px;padding-bottom:10px}
  .brand{flex:1 1 auto;min-width:0}
  .brand img{height:var(--lhm,34px);max-width:100%}
  .brand b{font-size:1.25rem}
  .search{order:2;flex:0 1 150px}.search input{width:100%}
  .nav{order:3;flex:1 0 100%}
  .mast.ctr .brand{flex-basis:100%;justify-content:center}
  .mast.ctr .search{flex:1 1 auto}
  .dd{position:static}
  .ddp{left:12px;right:12px;top:100%;min-width:0;max-width:none;margin-top:0;border-top-left-radius:0;border-top-right-radius:0}
}
@media(max-width:560px){
  .wrap{padding:0 14px}.pt{padding-top:16px}
  .grid3{grid-template-columns:1fr}
  .big{min-height:300px;border-radius:18px}.big .ov{padding:70px 18px 20px}
  .mini{grid-template-columns:92px 1fr;gap:12px}
  h2.sec{font-size:1.3rem}
  .art{padding:18px 16px;border-radius:18px}
  .body{font-size:1.05rem;line-height:1.75}
  .share a,.share button{flex:1 1 auto;text-align:center}
  .hero{border-radius:14px;margin:14px auto}
  .side{grid-template-columns:1fr}
  .ddp{grid-template-columns:1fr}
  .foot{padding:30px 0 22px}
}

/* ===== v4: menu geser, header, footer, rata teks ===== */
.mast .wrap{padding-top:var(--hpad,6px);padding-bottom:var(--hpad,6px)}
.nav{position:relative;display:flex;align-items:center;gap:6px;flex:1;min-width:0}
.navs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;min-width:0;flex:1;scroll-behavior:smooth;cursor:grab;overscroll-behavior-x:contain}
.navs::-webkit-scrollbar{display:none}.navs.drag{cursor:grabbing;scroll-behavior:auto;user-select:none}
.na-center .navs{justify-content:safe center}.na-right .navs{justify-content:flex-end}
.nb{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--navy);cursor:pointer;font-size:1.2rem;line-height:1;display:grid;place-items:center;padding:0 0 3px}
@media(pointer:coarse){.nb{display:none!important}}
.ns-underline .nav a{border-radius:0;padding:10px 12px;background:none!important;border-bottom:2px solid transparent}
.ns-underline .nav a.on,.ns-underline .nav a:hover{border-bottom-color:var(--red);color:var(--navy)}
.ns-plain .nav a{background:none!important}.ns-plain .nav a.on{color:var(--red);font-weight:600}
.body{text-align:var(--ba,left)}
.foot .wrap{display:flex;flex-direction:column}
.fmid{order:1;display:grid;grid-template-columns:1fr 1fr;gap:28px 48px;align-items:start;padding-bottom:26px}
.fr{justify-self:end;min-width:min(100%,300px)}
.flogo{width:auto;max-width:100%;object-fit:contain;margin:4px 0 10px;border-radius:8px}
.fl p,.fr p{margin:4px 0;font-size:.9rem}.cl{opacity:.65;margin-right:8px}.cl::after{content:":"}
.fr a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.chips a{text-decoration:none;border:1px solid #ffffff44;padding:6px 14px;border-radius:99px;font-size:.84rem}.chips a:hover{background:#ffffff1a}
.frd{order:2}.rdtop .frd{order:0;padding-bottom:24px}.rdtop .fmid{padding-top:4px}
.rdg{display:block}.rdg p{margin:0 0 6px}
.foot .copy{order:3}
@media(max-width:700px){.fmid{grid-template-columns:1fr}.fr{justify-self:start}}

/* ===== v5: layout yang diatur admin ===== */
#home,.pagecol{display:flex;flex-direction:column}#home>*,.pagecol>*{width:100%;min-width:0}.pagecol{min-width:0}
.mcol{display:flex;flex-direction:column;min-width:0}.mcol>*{min-width:0}
.off{display:none!important}
@media(min-width:901px){
 .layout{grid-template-columns:minmax(0,1fr) var(--sw,300px)}
 .layout.sbl{grid-template-columns:var(--sw,300px) minmax(0,1fr)}.layout.sbl .side{grid-column:1;grid-row:1}.layout.sbl .pagecol{grid-column:2;grid-row:1}
 .layout.sbn{grid-template-columns:minmax(0,1fr)}.sbn .side{display:none}
}
@media(min-width:701px){.grid.gc2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.gc3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.gc4{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ===== v6: iklan di kolom kanan setinggi halaman ===== */
@media(min-width:901px){#side.stick{position:sticky;top:16px;align-self:start}}
@media(max-width:900px){.feat{grid-template-columns:1fr}.feat .minis{order:2}.feat .big{order:1}.feat.solo{grid-template-columns:1fr}}
@media(min-width:901px){
  .layout>.side{align-self:stretch;padding-top:8px}
  .feat .minis{gap:12px}
  .feat .mini{grid-template-columns:78px 1fr;gap:12px;padding:10px}
  .feat .mini .mi{min-height:72px}
  .feat .mini h4{-webkit-line-clamp:2;font-size:.95rem;margin:2px 0 5px}
  .feat .big{min-height:420px}
}

/* ===== v10: garis ucapan, kolase video ===== */
.secline{height:1px;background:var(--line);margin:10px 0 18px}
#vblock{margin:14px 0 6px}
.vgrid{display:grid;grid-template-columns:repeat(var(--vc,3),minmax(0,1fr));gap:var(--vg,16px);margin-bottom:18px}
.vid{margin:0;min-width:0}
.vplay,.vfr{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:14px;overflow:hidden;background:#000}
.vplay{position:relative;padding:0;cursor:pointer;box-shadow:var(--shadow)}
.vplay img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s,opacity .3s}
.vplay:hover img{transform:scale(1.03);opacity:.92}
.vpb{position:absolute;left:50%;top:50%;width:62px;height:44px;margin:-22px 0 0 -31px;border-radius:12px;background:rgba(210,30,30,.92);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.vpb::after{content:"";position:absolute;left:25px;top:12px;border-style:solid;border-width:10px 0 10px 17px;border-color:transparent transparent transparent #fff}
.vplay:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.vid figcaption{font:600 .92rem/1.4 var(--serif);margin:8px 2px 0;color:var(--ink);overflow-wrap:anywhere}
@media(max-width:640px){.vgrid{grid-template-columns:repeat(var(--vm,1),minmax(0,1fr))}}

.tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:22px 0 4px;font-size:.82rem;color:var(--muted)}
.tags a{padding:3px 11px;border-radius:99px;background:var(--navy-soft);color:var(--navy);font-weight:500;text-decoration:none}
.tags a:hover{background:var(--navy);color:var(--card)}

.body a[href*="lihat-pdf.html"],.ed a[href*="lihat-pdf.html"]{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:12px;background:var(--navy-soft);color:var(--navy);text-decoration:none;font-weight:600;border:1px solid var(--line)}
.body a[href*="lihat-pdf.html"]::before,.ed a[href*="lihat-pdf.html"]::before{content:"PDF";font:700 .72rem var(--sans);background:var(--red);color:#fff;border-radius:6px;padding:3px 7px}
.body a[href*="lihat-pdf.html"]:hover{background:var(--navy);color:var(--card)}

/* ===== v12: perbaikan tampilan HP (komputer tidak berubah) ===== */
.minirow{display:contents}
.mini.mx{display:none}
.mobonly{display:none}
@media(max-width:640px){
  .deskonly{display:none!important}
  .mini.mx{display:grid}
  .hm #sec-latest{display:none}
  .feat #moreM{order:3}.hm #moreM:not([hidden]){display:block;text-align:center;margin:4px 0 8px}
  .mobonly{display:grid}.inline.mobonly{display:block}
  .minirow{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;align-items:start}
  .minirow.hasads{grid-template-columns:minmax(0,1fr) 35%}
  .feat .minirow{order:2}
  .minirow .minis{gap:8px;min-width:0;order:0}
  .minirow>#side,.minirow>.side{order:1!important}
  .minirow .mini{grid-template-columns:54px minmax(0,1fr);gap:9px;padding:8px;border-radius:12px;flex:none}
  .minirow .mini:hover{transform:none}
  .minirow .mini .mi{min-height:0;height:54px;border-radius:8px;align-self:start}
  .minirow .mini .tag{display:none}
  .minirow .mini h4{font-size:.82rem;line-height:1.3;margin:0 0 4px;-webkit-line-clamp:3}
  .minirow .mini .meta{font-size:.65rem;gap:1px 8px;flex-wrap:wrap}
  .minirow .mini .meta svg{width:10px;height:10px;vertical-align:-1px}
  .minirow>#side,.minirow>.side{min-width:0;display:block;padding:0;margin:0}
  .minirow .adgrid{gap:8px;max-width:none}
  .minirow .ad{border-radius:10px}
  .side.docked:not(:has(#pop:not([hidden]))){display:none}
}
@media(max-width:640px){
  .search,.mast.ctr .search{flex:0 0 112px}
  .search input{padding:5px 12px;font-size:.78rem;min-height:34px}
}

/* ===== v15: halaman profil (Tentang Kami, Hubungi Kami, Ketentuan Media) & tautan footer ===== */
.flinks{display:flex;flex-wrap:wrap;gap:8px 30px;margin:0 0 22px;padding:0 0 18px;border-bottom:1px solid #ffffff26}
.flinks a{font-weight:600;font-size:.93rem;opacity:.9;color:#fff}.flinks a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.pg{max-width:900px;margin:0 auto 48px}
.pgh{text-align:center;padding:10px 0 28px}
.pgk{display:inline-block;font:600 .76rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
.pgh h1{font:700 clamp(1.9rem,4.4vw,2.9rem)/1.15 var(--serif);color:var(--navy);margin:0;letter-spacing:-.02em;overflow-wrap:anywhere}
.pgh h1::after{content:"";display:block;width:56px;height:3px;border-radius:3px;background:var(--red);margin:18px auto 0}
.pgi{max-width:58ch;margin:18px auto 0;color:var(--muted);font-size:1.06rem;line-height:1.7}
.pgimgs{display:grid;gap:16px;margin-bottom:22px}.pgimgs.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pgimgs figure{margin:0;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);background:var(--navy-soft);aspect-ratio:16/10}
.pgimgs.n1 figure{aspect-ratio:21/9}
.pgimgs img{width:100%;height:100%;object-fit:cover}
.pgbody .body{max-width:70ch;margin:0 auto}
.pgbody .body h2{font:700 1.45rem/1.3 var(--serif);color:var(--navy);margin:1.6em 0 .6em}
.pgbody .body h2:first-child{margin-top:0}
.cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:22px}
.cgrid.one{grid-template-columns:minmax(0,440px);justify-content:center}
.ccard{background:var(--card);border-radius:20px;padding:30px 24px 26px;box-shadow:var(--shadow);text-align:center;display:flex;flex-direction:column;align-items:center;min-width:0}
.ccard .ic{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--navy-soft);color:var(--navy);margin-bottom:12px}
.ccard.wa .ic{background:#e3f6ea;color:#128c4a}
.ccard h2{font:600 1.3rem var(--serif);margin:0 0 4px;color:var(--navy)}
.ccard .cv{color:var(--muted);font-size:.96rem;overflow-wrap:anywhere;margin-bottom:18px}
.cbtn{display:inline-flex;align-items:center;justify-content:center;padding:13px 28px;border-radius:99px;background:var(--navy);color:var(--card);font:600 .96rem var(--sans);transition:transform .2s,box-shadow .2s;box-shadow:0 6px 16px -8px rgba(28,50,83,.6)}
.cbtn:hover{transform:translateY(-2px)}
.ccard.wa .cbtn{background:#1f9d57;color:#fff;box-shadow:0 6px 16px -8px rgba(31,157,87,.7)}
.csub{font-size:.8rem;color:var(--muted);margin-top:12px}.csub a{text-decoration:underline;text-underline-offset:2px}
@media(max-width:640px){.pgimgs.n2{grid-template-columns:1fr}.cgrid{grid-template-columns:1fr}.cgrid.one{grid-template-columns:1fr}.pgh{padding-bottom:20px}.pgimgs.n1 figure{aspect-ratio:16/10}.flinks{gap:8px 22px}}
.pgbody.ctr .body{text-align:center;max-width:56ch}

/* ===== v16: footer di HP lebih ringkas ===== */
@media(max-width:640px){
  .flinks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 6px;padding-bottom:14px;margin-bottom:16px}
  .flinks a{font-size:clamp(.7rem,3.5vw,.86rem);white-space:nowrap;text-align:center}
  .flinks a:first-child{text-align:left}.flinks a:last-child{text-align:right}
  .foot h4{font-size:1.05rem;margin-bottom:8px}
  .rdg p{font-size:.78rem;line-height:1.5;margin:2px 0;hyphens:auto}
  .foot .copy{font-size:clamp(.56rem,2.8vw,.78rem);white-space:nowrap;margin-top:18px;padding-top:12px}
}

/* ringkasan di kartu berita */
.card p.sum{margin:6px 0 4px;color:var(--muted);font-size:.9rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:var(--sumn,3);-webkit-box-orient:vertical;overflow:hidden}
/* kotak ajakan */
.cta{margin:48px 0 8px;border-radius:22px;padding:34px 38px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;color:#fff;background:var(--ctab,var(--navy));box-shadow:var(--shadow)}
.cta small{display:block;font:700 .7rem var(--sans);letter-spacing:.16em;opacity:.8;margin-bottom:6px}
.cta h2{font:700 clamp(1.3rem,2.4vw,1.8rem)/1.25 var(--serif);margin:0 0 6px}.cta p{margin:0;opacity:.88;max-width:56ch}
.cta a{background:var(--ctak,#fff);color:var(--ctat,#111);font:700 .95rem var(--sans);padding:13px 26px;border-radius:99px;white-space:nowrap}
@media(max-width:640px){.cta{padding:24px 22px}.cta a{width:100%;text-align:center}}

/* ===== pengaturan dari editor: geser teks, jenis daftar, lebar gambar, tampilan HP ===== */
.body li>p{margin:0}.body td>p,.body th>p{margin:0}
.body .in1{margin-left:2em}.body .in2{margin-left:4em}.body .in3{margin-left:6em}.body .in4{margin-left:8em}
.body ol.in1,.body ul.in1{margin-left:1.6em}.body ol.in2,.body ul.in2{margin-left:3.2em}.body ol.in3,.body ul.in3{margin-left:4.8em}.body ol.in4,.body ul.in4{margin-left:6.4em}
.body ol.lt-1{list-style-type:decimal}.body ol.lt-a{list-style-type:lower-alpha}.body ol.lt-A{list-style-type:upper-alpha}.body ol.lt-i{list-style-type:lower-roman}.body ol.lt-I{list-style-type:upper-roman}
.body ul.lt-disc{list-style-type:disc}.body ul.lt-circle{list-style-type:circle}.body ul.lt-square{list-style-type:square}
.body img.w25,.body img.w50,.body img.w75,.body img.w100{display:block;margin-left:auto;margin-right:auto}
.body img.w25{width:25%}.body img.w50{width:50%}.body img.w75{width:75%}.body img.w100{width:100%}
@media(max-width:600px){
 /* OTOMATIS di HP: huruf besar ikut mengecil (huruf kecil tetap), gambar kecil diperlebar, geseran dikurangi */
 .body span[style*="--fs"]{font-size:calc(min(var(--fs), 18 + (var(--fs) - 18) * .7) * 1px)!important}
 .body img.w25{width:50%}.body img.w50{width:80%}.body img.w75{width:100%}
 .body .in1{margin-left:1.2em}.body .in2{margin-left:2.4em}.body .in3{margin-left:3.6em}.body .in4{margin-left:4.8em}
 .body ol.in1,.body ul.in1{margin-left:1.2em}.body ol.in2,.body ul.in2{margin-left:2.4em}.body ol.in3,.body ul.in3{margin-left:3.6em}.body ol.in4,.body ul.in4{margin-left:4.8em}
 /* MANUAL "Khusus di HP" (menang dari otomatis) */
 .body span[style*="--hp"]{font-size:var(--hp)!important}
 .body img.m25,.body img.m50,.body img.m75,.body img.m100{display:block;margin-left:auto;margin-right:auto}
 .body img.m25{width:25%!important}.body img.m50{width:50%!important}.body img.m75{width:75%!important}.body img.m100{width:100%!important}
 .body .ha-l{text-align:left!important}.body .ha-c{text-align:center!important}.body .ha-r{text-align:right!important}.body .ha-j{text-align:justify!important}
}

/* ===== MODE GELAP: perbaikan tambahan ===== */
@media (prefers-color-scheme: dark){
:root{color-scheme:dark}
.tl,.big .tag{color:#10151c}
.body a{color:#9dbbea}
.body blockquote{background:var(--navy-soft);color:var(--ink)}
.body td,.body th{border-color:var(--line)}
img{filter:brightness(.92)}
.brand img,.foot img{filter:none}
/* tulisan berwarna dari editor (mis. hitam dari Word) dibalik supaya terbaca di latar gelap */
.body span[style*="color"]:not([style*="background"]),.body font[color]{filter:invert(1) hue-rotate(180deg)}
.body p[style*="color"],.body div[style*="color"],.body li[style*="color"],.body h2[style*="color"],.body h3[style*="color"],.body h4[style*="color"],.body td[style*="color"],.body th[style*="color"],.body blockquote[style*="color"]{color:var(--ink)!important}
.body td[style*="background"],.body th[style*="background"],.body p[style*="background"],.body div[style*="background"]{background-color:transparent!important}
.body span[style*="background"]{color:#111}
}