
/* ===== style.css ===== */
:root{--bg:#ffffff;--bg2:#f7f8fa;--card:#ffffff;--ink:#14171c;--text:#2b3038;--muted:#6b7280;--line:#e8eaed;--accent:#d4202c;--accent-dark:#a8151f;--head:"Archivo","Inter",system-ui,sans-serif;--body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;}[data-theme="dark"]{--bg:#0e1116;--bg2:#151a22;--card:#151a22;--ink:#eef1f6;--text:#c9d0da;--muted:#8b94a1;--line:#232a35;--accent:#e5323e;--accent-dark:#ff525c;}[data-theme="dark"] .mainnav{background:rgba(14,17,22,.92);}[data-theme="dark"] img{filter:brightness(.92);}*{box-sizing:border-box;margin:0;padding:0;}body{background:var(--bg);color:var(--text);font-family:var(--body);line-height:1.7;-webkit-font-smoothing:antialiased;}.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}a{color:inherit;}img{display:block;max-width:100%;}h1,h2,h3{font-family:var(--head);line-height:1.28;color:var(--ink);}.topbar{background:var(--bg);border-bottom:1px solid var(--line);font-size:.78rem;color:var(--muted);}.topbar-inner{display:flex;justify-content:space-between;align-items:center;height:36px;}.topbar-right{letter-spacing:1.5px;text-transform:uppercase;font-size:.68rem;}.lang-switch{margin-left:12px;color:var(--ink);font-weight:700;text-decoration:none;font-size:.75rem;letter-spacing:1px;border-bottom:2px solid var(--accent);padding-bottom:1px;}.ticker{background:var(--bg2);border-bottom:1px solid var(--line);}.ticker-inner{display:flex;align-items:stretch;height:38px;}.ticker-label{display:flex;align-items:center;flex-shrink:0;color:var(--accent);font-family:var(--head);font-weight:800;font-size:.72rem;letter-spacing:2px;padding:0 16px 0 0;}.ticker-label::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:10px;flex-shrink:0;animation:pulse-dot 1.6s ease-in-out infinite;}@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1);box-shadow:0 0 0 0 rgba(212,32,44,.5);}50%{opacity:.65;transform:scale(.8);box-shadow:0 0 0 6px rgba(212,32,44,0);}}@media (prefers-reduced-motion:reduce){.ticker-label::before{animation:none;}}.ticker-viewport{overflow:hidden;flex:1;display:flex;align-items:center;}.ticker-move{display:inline-block;white-space:nowrap;animation:tick 50s linear infinite;}.ticker-viewport:hover .ticker-move{animation-play-state:paused;}.tick-item{display:inline-block;margin-right:48px;font-size:.84rem;color:var(--text);}.tick-item a{text-decoration:none;}.tick-item a:hover{color:var(--accent);}.tick-item::before{content:"●";color:var(--accent);margin-right:10px;font-size:.55rem;vertical-align:middle;}@keyframes tick{to{transform:translateX(-50%);}}@media (prefers-reduced-motion:reduce){.ticker-move{animation:none;}}.site-header{background:var(--bg);border-bottom:1px solid var(--line);}.masthead{display:flex;align-items:baseline;justify-content:space-between;padding:22px 24px 16px;max-width:1120px;margin:0 auto;}.brand{text-decoration:none;font-family:var(--head);font-weight:900;letter-spacing:2px;font-size:1.7rem;color:var(--ink);}.brand-logo{height:46px;width:auto;display:block;}.brand-stateline{color:var(--ink);}.brand-media{color:var(--accent);}.masthead-tag{color:var(--muted);font-size:.72rem;letter-spacing:3px;text-transform:uppercase;}.mainnav{background:rgba(255,255,255,.92);backdrop-filter:blur(8px);position:sticky;top:0;z-index:50;border-bottom:1px solid var(--line);}.mainnav::after{content:"";position:absolute;right:0;top:0;bottom:0;width:46px;background:linear-gradient(to right,rgba(255,255,255,0),rgba(255,255,255,.96));pointer-events:none;}.nav-inner{display:flex;gap:2px;overflow-x:auto;}.nav-inner a{color:var(--muted);text-decoration:none;font-family:var(--head);font-weight:600;font-size:.82rem;letter-spacing:1px;text-transform:uppercase;padding:14px 14px 12px;white-space:nowrap;border-bottom:2px solid transparent;}.nav-inner a:hover{color:var(--ink);}.nav-inner a.active{color:var(--accent);border-bottom-color:var(--accent);}.nav-inner a.lang-link{margin-left:auto;color:var(--ink);font-weight:800;}.section{padding:36px 0 8px;}.section-title{font-size:.95rem;font-weight:800;margin-bottom:20px;text-transform:uppercase;letter-spacing:2px;color:var(--ink);padding-bottom:10px;border-bottom:1px solid var(--line);position:relative;}.section-title::after{content:"";position:absolute;left:0;bottom:-1px;width:56px;height:2px;background:var(--accent);}.hero-grid{display:grid;grid-template-columns:1.9fr 1fr;gap:20px;}.hero-main{position:relative;border-radius:12px;overflow:hidden;min-height:400px;display:block;text-decoration:none;background:var(--bg2);}.hero-main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}.hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,14,.88) 0%,rgba(10,10,14,.35) 55%,transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:26px;}.hero-main h2,.hero-main .excerpt{color:#fff;}.hero-main h2{font-size:1.75rem;font-weight:800;margin:12px 0 8px;}.hero-main .excerpt{color:rgba(255,255,255,.82);font-size:.95rem;}.hero-side{display:flex;flex-direction:column;gap:14px;}.hero-item{display:flex;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;}.hero-item img{width:128px;height:92px;object-fit:cover;flex-shrink:0;}.hero-item .hi-body{padding:12px 14px 12px 0;}.hero-item h3{font-size:.95rem;font-weight:700;}.hero-item .meta{font-size:.76rem;color:var(--muted);margin-top:6px;display:block;}.hero-item:hover h3{color:var(--accent);}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:22px;}.card{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:box-shadow .18s ease,transform .18s ease;}.card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(20,23,28,.10);}.card img.cover{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;}.card-body{padding:18px 20px 20px;}.card h3{font-size:1.05rem;font-weight:700;margin:10px 0 8px;}.card .excerpt{color:var(--muted);font-size:.9rem;}.meta{display:block;margin-top:12px;font-size:.78rem;color:var(--muted);}.badge{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:#fff;background:var(--accent);padding:5px 12px;border-radius:6px;}.empty{color:var(--muted);padding:60px 0;text-align:center;}.index-row{display:flex;gap:18px;padding:18px 0;border-bottom:1px solid var(--line);text-decoration:none;align-items:center;}.index-row img{width:172px;height:100px;object-fit:cover;border-radius:8px;flex-shrink:0;}.index-row h3{font-size:1.02rem;}.index-row:hover h3{color:var(--accent);}.article-wrap{max-width:740px;margin:0 auto;padding:32px 24px 10px;}.breadcrumb{margin-bottom:14px;font-size:.82rem;color:var(--muted);}.breadcrumb a{color:var(--muted);text-decoration:none;}.breadcrumb a:hover{color:var(--accent);}.article-title{font-size:2.15rem;font-weight:800;margin:14px 0 10px;letter-spacing:-.01em;}.article-meta{color:var(--muted);font-size:.86rem;margin-bottom:22px;}.article-meta .dot{margin:0 8px;}.cover-figure{margin:0 0 26px;}.cover-figure img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px;}.cover-figure figcaption{font-size:.8rem;color:var(--muted);margin-top:8px;}.cover-figure .credit a{color:var(--accent);}.article-body h2{font-size:1.28rem;margin:32px 0 12px;letter-spacing:-.01em;}.article-body p{margin-bottom:16px;color:var(--text);}.article-body .cover-figure{margin:24px 0;}.factbox{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:20px 24px;margin:0 0 8px;}.factbox h2{font-size:.95rem;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px;color:var(--ink);}.sources{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:20px 24px;margin-top:30px;}.sources h2{font-size:.95rem;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px;}.sources ul{margin-left:20px;}.sources li{margin-bottom:6px;}.sources a{color:var(--accent);}.lead{font-size:1.12rem;color:var(--text);margin:6px 0 24px;border-left:3px solid var(--accent);padding-left:18px;}.facts{margin:0 0 28px 22px;}.facts li{margin-bottom:10px;}.facts li::marker{color:var(--accent);font-weight:800;}.embeds h2,.share h2,.related h2{font-size:1.05rem;margin:34px 0 16px;text-transform:uppercase;letter-spacing:1.5px;}.article-body,.sources,.factbox{overflow-wrap:break-word;}.embed-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),340px));gap:18px;justify-content:start;}.embed iframe{width:100%;border:1px solid var(--line);border-radius:12px;background:#000;}.embed-alt{margin-top:10px;color:var(--muted);font-size:.9rem;}.tags{margin:28px 0 6px;}.tag{display:inline-block;margin:0 8px 10px 0;padding:9px 18px;border:1px solid var(--line);border-radius:999px;font-size:.84rem;color:var(--text);background:var(--bg2);text-decoration:none;transition:border-color .15s,color .15s;}a.tag:hover{border-color:var(--accent);color:var(--accent);}.share-row{display:flex;flex-wrap:wrap;gap:10px;}.share-btn{display:inline-block;padding:12px 20px;border-radius:8px;text-decoration:none;font-weight:600;font-size:.86rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);cursor:pointer;font-family:var(--body);}.share-btn:hover{border-color:var(--ink);}.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:18px;padding-bottom:44px;}.site-footer{border-top:1px solid var(--line);margin-top:60px;padding:44px 0 28px;background:var(--bg2);}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;}.footer-brand{font-family:var(--head);font-weight:900;letter-spacing:2px;font-size:1.15rem;color:var(--ink);}.tagline{color:var(--muted);margin-top:10px;font-size:.9rem;}.site-footer h4{font-size:.78rem;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;color:var(--ink);}.footer-links a{display:block;color:var(--muted);text-decoration:none;padding:7px 0;margin-bottom:2px;font-size:.9rem;}.footer-links a:hover{color:var(--accent);}.socials a{display:inline-block;margin:0 8px 10px 0;padding:11px 18px;border:1px solid var(--line);background:var(--bg);color:var(--ink);text-decoration:none;font-weight:600;border-radius:8px;font-size:.84rem;}.socials a:hover{border-color:var(--ink);}.socials a i,.share-btn i,.nav-inner a i{margin-right:8px;}.socials a svg,.share-btn svg,.nav-inner a svg{margin-right:8px;}.svg-ic{width:1em;height:1em;vertical-align:-0.125em;display:inline-block;}.svg-at{font-weight:900;font-size:1.1em;line-height:1;font-family:var(--head);}.theme-toggle .svg-ic,.to-top .svg-ic{width:1.1em;height:1.1em;margin:0;vertical-align:middle;}.view-all .svg-ic{width:.9em;height:.9em;}.nav-inner a i{margin-right:6px;font-size:.85em;}.copy{color:var(--muted);font-size:.78rem;margin-top:28px;border-top:1px solid var(--line);padding-top:18px;}.newsletter{margin-top:18px;}.newsletter h4{font-size:.78rem;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px;color:var(--ink);}.newsletter form{display:flex;gap:8px;max-width:320px;}.newsletter input[type="email"]{flex:1;padding:10px 14px;font-size:.88rem;font-family:var(--body);border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);}.newsletter button{padding:10px 18px;font-size:.86rem;font-weight:700;font-family:var(--body);background:var(--accent);color:#fff;border:0;border-radius:8px;cursor:pointer;}.newsletter button:hover{background:var(--accent-dark);}.pushsub{margin-top:18px;}.pushsub h4{font-size:.9rem;margin-bottom:8px;color:var(--ink);}.pushsub button{padding:10px 18px;font-size:.86rem;font-weight:700;font-family:var(--body);background:transparent;color:var(--ink);border:1.5px solid var(--line);border-radius:8px;cursor:pointer;}.pushsub button:hover:not(:disabled){border-color:var(--accent);color:var(--accent);}.pushsub button:disabled{opacity:.75;cursor:default;border-color:var(--accent);color:var(--accent);}.pushsub button i,.newsletter button i{margin-right:6px;}.view-all{display:inline-block;margin-top:14px;padding:12px 24px;background:var(--accent);color:#fff;text-decoration:none;font-weight:700;font-size:.88rem;border-radius:8px;}.view-all:hover{background:var(--accent-dark);}.view-all i{margin-left:6px;font-size:.8em;}.push-note{font-size:.78rem;color:var(--muted);margin-top:6px;min-height:1em;}@media (max-width:860px){.hero-grid{grid-template-columns:1fr;}.hero-main{min-height:300px;}.hero-main h2{font-size:1.4rem;}.article-title{font-size:1.65rem;}.brand{font-size:1.35rem;}.masthead{flex-direction:column;align-items:flex-start;gap:4px;}.footer-grid{grid-template-columns:1fr;}.index-row img{width:118px;height:74px;}.brand-logo{height:36px;}.topbar-inner{height:34px;gap:10px;}.topbar-inner #today{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.topbar-right{display:none;}.ticker-label{padding-right:10px;letter-spacing:1.5px;}}.read-progress{position:fixed;top:0;left:0;height:3px;width:0%;background:var(--accent);z-index:100;transition:width .1s linear;}.to-top{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:1rem;cursor:pointer;z-index:90;opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .25s,transform .25s;box-shadow:0 4px 14px rgba(0,0,0,.12);}.to-top.show{opacity:1;pointer-events:auto;transform:translateY(0);}.to-top:hover{border-color:var(--accent);color:var(--accent);}.theme-toggle{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.95rem;margin-left:12px;padding:4px;}.theme-toggle:hover{color:var(--accent);}.font-ctrl{display:inline-flex;gap:6px;align-items:center;margin-left:12px;}.font-ctrl button{width:30px;height:30px;border-radius:6px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font-weight:700;font-size:.78rem;cursor:pointer;font-family:var(--body);}.font-ctrl button:hover{border-color:var(--accent);color:var(--accent);}#focusbtn{font-weight:600;}body.focus-mode .topbar,body.focus-mode .ticker,body.focus-mode .mainnav,body.focus-mode .site-footer,body.focus-mode .breadcrumb,body.focus-mode .share,body.focus-mode .related,body.focus-mode .tags,body.focus-mode .to-top,body.focus-mode .read-progress{display:none !important;}body.focus-mode .article-wrap{max-width:740px;margin:0 auto;}body.focus-mode .masthead{padding-top:18px;padding-bottom:6px;}body.focus-mode .masthead-tag{display:none;}.focus-exit{position:fixed;bottom:24px;right:24px;z-index:999;display:none;padding:12px 22px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);color:var(--text);font-weight:700;font-size:.88rem;cursor:pointer;box-shadow:0 4px 18px rgba(0,0,0,.25);font-family:var(--body);}body.focus-mode .focus-exit{display:block;}.focus-exit:hover{border-color:var(--accent);color:var(--accent);}.picks-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}@media (max-width:720px){.picks-grid{grid-template-columns:1fr;}}.pick-card{display:block;text-decoration:none;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--card);}.pick-card img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;}.pick-card .pick-body{padding:14px 16px;}.pick-card h3{font-size:1rem;margin:6px 0;}.pick-card:hover{border-color:var(--accent);}.pick-badge{display:inline-block;background:var(--accent);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:1.5px;padding:3px 10px;border-radius:999px;text-transform:uppercase;}body.focus-mode .focus-exit{display:block !important;z-index:9999 !important;position:fixed !important;bottom:24px !important;right:24px !important;}@media (max-width:860px){.cover-figure img{aspect-ratio:16/9 !important;object-fit:cover !important;max-height:280px !important;width:100% !important;height:auto !important;}.card img.cover{aspect-ratio:16/9 !important;object-fit:cover !important;max-height:200px !important;}.hero-main img{max-height:300px !important;object-fit:cover !important;}}.lang-dropdown{position:relative;display:inline-block;margin-left:12px;}.lang-btn{background:none;border:none;color:var(--ink);font-weight:700;font-size:.75rem;letter-spacing:1px;cursor:pointer;padding:2px 0;border-bottom:2px solid var(--accent);font-family:inherit;}.lang-menu{display:none;position:absolute;right:0;top:100%;z-index:200;background:var(--card,#fff);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.18);min-width:150px;padding:6px;}.lang-dropdown:hover .lang-menu,.lang-dropdown:focus-within .lang-menu{display:block;}.lang-menu a{display:block;padding:8px 12px;border-radius:6px;color:var(--ink);text-decoration:none;font-size:.85rem;font-weight:600;}.lang-menu a:hover{background:var(--line);}.lang-menu a.cur{color:var(--accent);pointer-events:none;}.comments{margin:2.5rem 0;padding:1.5rem;background:var(--card,#fff);border:1px solid var(--line);border-radius:12px;}.comments h2{margin:0 0 1rem;font-size:1.25rem;}.comment-list{margin-bottom:1.25rem;}.comments-empty{color:var(--muted,#666);font-style:italic;}.comment{padding:.75rem 0;border-bottom:1px solid var(--line);}.comment:last-child{border-bottom:none;}.comment .c-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.3rem;}.comment .c-head b{color:var(--accent);}.comment .c-head span{font-size:.75rem;color:var(--muted,#888);}.comment p{margin:0;line-height:1.5;}.comment-form{display:flex;flex-direction:column;gap:.6rem;}.comment-form input,.comment-form textarea{padding:.7rem .9rem;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:.95rem;background:var(--bg,#fff);color:var(--ink);}.comment-form textarea{min-height:90px;resize:vertical;}.comment-form button{align-self:flex-start;padding:.6rem 1.5rem;background:var(--accent);color:#fff;border:none;border-radius:8px;font-weight:700;cursor:pointer;font-family:inherit;}.comment-form button:hover{background:var(--accent-dark);}.comment-msg{font-size:.85rem;min-height:1.2em;margin:0;}.video-embed{margin:2rem 0;}.video-embed h2{margin:0 0 .8rem;font-size:1.25rem;}.video-wrap{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px;background:#000;}.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}.read-also{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:20px 24px;margin-top:30px;}.read-also h2{font-size:.95rem;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px;color:var(--ink);}.read-also ul{margin-left:20px;}.read-also li{margin-bottom:8px;}.read-also a{color:var(--accent);text-decoration:none;font-weight:600;}.read-also a:hover{text-decoration:underline;}

/* Screen reader only - untuk H1 SEO yang disembunyikan visual */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* === PERBAIKAN AKSESIBILITAS & UX (2026-10-16) === */

/* Focus styles yang jelas untuk navigasi keyboard */
a:focus, button:focus, input:focus, select:focus, textarea:focus {
  outline: 3px solid #D4AF37;
  outline-offset: 2px;
  border-radius: 4px;
}

/* Tablet breakpoint */
@media (max-width: 768px) {
  .hero-grid {
    grid-template-columns: 1fr;
  }
  .hero-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
}

/* Print stylesheet */
@media print {
  .topbar, .ticker, .nav, .theme-toggle, .to-top,
  .share-row, .newsletter-box, .pushsub, .footer,
  .read-progress, #cookie-banner {
    display: none !important;
  }
  body {
    font-size: 12pt;
    color: #000;
    background: #fff;
  }
  .article-body {
    max-width: 100%;
  }
  a {
    text-decoration: none;
    color: #000;
  }
  a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    color: #666;
  }
}

/* Z-index terstandarisasi */
.topbar { z-index: 30; }
.ticker { z-index: 20; }
.nav { z-index: 40; }
.to-top { z-index: 50; }
.lang-dropdown { z-index: 60; }
.modal, .overlay { z-index: 100; }
.tooltip { z-index: 110; }
.notification { z-index: 120; }
/* === Hamburger menu mobile (<=768px) - ditambah 2026-10-17 === */
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:12px 4px;position:absolute;right:16px;top:50%;transform:translateY(-50%);z-index:60;}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;transition:transform .25s,opacity .25s;}
.mainnav{position:sticky;}
@media (max-width:768px){
.nav-toggle{display:block;}
.mainnav .nav-inner{display:none;position:absolute;top:100%;left:0;right:0;background:var(--card);border-bottom:1px solid var(--line);box-shadow:0 12px 28px rgba(0,0,0,.14);flex-direction:column;overflow:visible;z-index:55;max-height:70vh;overflow-y:auto;}
.mainnav.open .nav-inner{display:flex;}
.mainnav .nav-inner a{padding:13px 24px;border-bottom:1px solid var(--line);white-space:normal;}
.mainnav .nav-inner a:last-child{border-bottom:none;}
.mainnav.open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.mainnav.open .nav-toggle span:nth-child(2){opacity:0;}
.mainnav.open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mainnav::after{display:none;}
}
/* === Judul rapi maks 2 baris di listing - ditambah 2026-10-17 === */
.card h3,.hero-item h3,.index-row h3,.pick-card h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
/* === P2-3: cookie banner compact di mobile - ditambah 2026-10-18 === */
@media (max-width:768px){
#cookie-banner{padding:10px 14px !important;font-size:13px !important;line-height:1.4 !important;}
#cookie-banner>div{gap:8px !important;}
#cookie-ok{padding:6px 16px !important;font-size:13px !important;}
}

/* ===== feature-eeat.css ===== */
/* ============================================================
   feature-eeat.css — gaya untuk FITUR 2 (E-E-A-T redaksi) +
   FITUR 5 ("Baca juga" visual). File terpisah agar style.css
   tidak disentuh. Dimuat setelah style.css di <head>.
   ============================================================ */

/* --- Byline: link ke halaman profil redaksi (E-E-A-T) --- */
.article-meta a.byline {
    color: var(--ink);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px dotted var(--muted);
}
.article-meta a.byline:hover {
    color: var(--accent);
    border-bottom-color: var(--accent);
}

/* --- "Baca juga": kartu mini bergambar (FITUR 5) ---
   Visual berbeda dari .related-grid (kartu besar "Berita Terkait"):
   format horizontal kompak yang cocok di dalam body artikel. */
.read-also-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 14px;
}
.read-also-card {
    display: flex;
    gap: 14px;
    align-items: center;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 10px;
    text-decoration: none;
    transition: border-color .15s ease, transform .15s ease;
}
.read-also-card:hover {
    border-color: var(--accent);
    transform: translateY(-2px);
}
.read-also-card img {
    width: 120px;
    height: 84px;
    object-fit: cover;
    border-radius: 8px;
    flex-shrink: 0;
}
.read-also-body {
    min-width: 0;
}
.read-also-card h3 {
    font-size: .98rem;
    font-weight: 700;
    margin: 0 0 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.read-also-card:hover h3 {
    color: var(--accent);
}
.read-also-meta {
    font-size: .76rem;
    color: var(--muted);
}
@media (max-width: 600px) {
    .read-also-card img {
        width: 96px;
        height: 70px;
    }
    .read-also-card h3 {
        font-size: .9rem;
    }
}

/* --- Halaman profil redaksi --- */
.newsroom-contact {
    margin: 22px 0;
    padding: 16px 20px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 12px;
}
.newsroom-contact a {
    color: var(--accent);
    font-weight: 700;
    text-decoration: none;
}
.newsroom-contact a:hover {
    text-decoration: underline;
}

/* ===== feature-tags.css ===== */
/* FITUR 3 — Halaman topik/tag (/topik/, /topik/<tag>/)
   Gabungkan ke static/style.css (append di akhir) atau muat sebagai stylesheet tambahan.
   Mengikuti variabel tema yang sudah ada: --accent, --line, --bg2, --muted, --ink. */

/* Deskripsi di bawah judul halaman indeks topik */
.topics-sub{color:var(--muted);margin:-8px 0 22px;font-size:.95rem;}

/* Cloud tag di halaman indeks */
.tag-cloud{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.tag-cloud .tag{margin:0;}               /* .tag bawaan punya margin; di cloud pakai gap */
.tag-md{font-size:.84rem;}
.tag-lg{font-size:.95rem;font-weight:600;}
.tag-xl{font-size:1.08rem;font-weight:700;border-color:var(--accent);}

/* Angka jumlah artikel pada chip cloud & judul halaman tag */
.tag-count{display:inline-block;margin-left:8px;font-size:.75em;color:var(--muted);
  background:var(--bg2);border:1px solid var(--line);border-radius:999px;
  padding:1px 9px;font-weight:700;white-space:nowrap;}
h1 .tag-count{vertical-align:middle;}

/* FITUR 4 — "Sorotan Terkini": memakai ulang .grid/.card/.section-title yang
   sudah ada, tanpa CSS baru. (File ini sengaja tidak menambah gaya sorotan
   agar konsisten dengan kartu beranda lainnya.) */

/* ===== feature-newsletter.css ===== */
/* FITUR 6 — Newsletter via Pages Function /api/newsletter (KV).
   Tempel/append ke static/style.css (dekat blok .newsletter yang sudah ada). */

/* Form newsletter: input + pesan status di bawah tombol */
.newsletter .nl-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.newsletter .nl-form input[type="email"] {
    flex: 1 1 10rem;
    min-width: 0;
}

/* Pesan status: sukses (hijau) / error (merah) */
.newsletter .nl-msg {
    flex: 1 1 100%;
    margin: 0.25rem 0 0;
    font-size: 0.85rem;
    line-height: 1.4;
    min-height: 1.2em; /* cegah layout shift saat pesan muncul */
}

.newsletter .nl-msg.ok {
    color: #16a34a;
}

.newsletter .nl-msg.err {
    color: #dc2626;
}

/* Mode gelap (bila ada .dark di body/html) */
.dark .newsletter .nl-msg.ok,
body.dark .newsletter .nl-msg.ok {
    color: #4ade80;
}

.dark .newsletter .nl-msg.err,
body.dark .newsletter .nl-msg.err {
    color: #f87171;
}
