/*
Theme Name:   Portal Berita Theme
Theme URI:    https://example.com
Author:       Your Name
Description:  Tema portal berita dengan Market Data Ticker, Hero Carousel, Latest Topics, Sidebar, 5 zona iklan, ACF JSON auto-load.
Version:      1.1.0
Requires at least: 6.0
Tested up to:      6.7
Requires PHP:      8.0
License:           GNU General Public License v2 or later
Text Domain:       your-theme
*/

/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Inter:wght@400;500;600;700;800&family=Playfair+Display:wght@700&family=Source+Sans+3:wght@400;600;700&display=swap');

/* ═══════════════════════════════════════════════
   DESIGN TOKENS
   ═══════════════════════════════════════════════ */
:root {
    --font-display : 'Playfair Display', Georgia, serif;
    --font-body    : 'Source Sans 3', 'Trebuchet MS', sans-serif;
    --font-mono    : 'IBM Plex Mono', 'Courier New', monospace;
    --font-ui      : 'Inter', 'Segoe UI', sans-serif;

    --color-primary   : #1a56db;
    --color-blue      : #1a56db;
    --color-blue-light: #eff6ff;
    --color-positive  : #3fb950;
    --color-negative  : #f85149;
    --color-text-dark : #111827;
    --color-text-body : #374151;
    --color-text-muted: #6b7280;
    --color-border    : #e5e7eb;
    --color-bg        : #ffffff;
    --color-bg-alt    : #f8fafc;

    --footer-bg       : #0f172a;
    --footer-text     : #94a3b8;
    --footer-border   : rgba(255,255,255,0.08);

    --mdb-bg          : #0d1117;
    --mdb-positive    : #3fb950;
    --mdb-negative    : #f85149;

    --hero-height     : 520px;

    --radius-sm : 4px;
    --radius-md : 6px;
    --radius-lg : 12px;

    --content-max : 1280px;
    --content-pad : 24px;
}

/* ═══════════════════════════════════════════════
   RESET & BASE
   ═══════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }
html   { scroll-behavior: smooth; }
body   { font-family: var(--font-body); font-size: 1rem; line-height: 1.7; color: var(--color-text-body); background: var(--color-bg); margin: 0; }
img, video, iframe { max-width: 100%; height: auto; display: block; }
a  { color: var(--color-blue); text-decoration: none; }
a:hover { text-decoration: underline; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-display); color: var(--color-text-dark); margin: 0 0 1rem; line-height: 1.3; }
p  { margin: 0 0 1rem; }
ul,ol { margin: 0; padding: 0; list-style: none; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }

/* ═══════════════════════════════════════════════
   LAYOUT
   ═══════════════════════════════════════════════ */
.site-container  { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--content-pad); }
.homepage-body   { display: grid; grid-template-columns: 1fr 300px; gap: 32px; padding: 32px 0; }
.site-main       { min-width: 0; }
.section-header  { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; padding-bottom: 11px; border-bottom: 2.5px solid var(--color-blue); }
.section-title   { font-family: var(--font-display); font-size: 17px; font-weight: 700; color: var(--color-text-dark); margin: 0; display: flex; align-items: center; gap: 9px; }
.section-title__bar { display: inline-block; width: 4px; height: 20px; background: var(--color-blue); border-radius: 2px; flex-shrink: 0; }
.section-see-all { display: flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--color-blue); transition: gap .18s; }
.section-see-all:hover { gap: 8px; text-decoration: none; }

@media (max-width: 1024px) { .homepage-body { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════
   HERO CAROUSEL
   ═══════════════════════════════════════════════ */
.hero-section { padding: 20px 0 0; }

.hero-carousel {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    height: var(--hero-height);
    background: #1e293b;
}

.hero-carousel__track { position: relative; height: 100%; }

.hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .6s ease;
    pointer-events: none;
}
.hero-slide.is-active { opacity: 1; pointer-events: auto; z-index: 1; }

.hero-slide__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 8s ease;
}
.hero-slide.is-active .hero-slide__bg { transform: scale(1.04); }

.hero-slide__bg-placeholder { width: 100%; height: 100%; background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%); }

.hero-slide__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.85) 0%, rgba(0,0,0,.35) 50%, rgba(0,0,0,.05) 100%);
}

.hero-slide__content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 32px 36px;
    z-index: 2;
}

.hero-slide__cat {
    display: inline-block;
    font-family: var(--font-ui);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #ffffff;
    background: var(--color-blue);
    padding: 3px 10px;
    border-radius: 3px;
    margin-bottom: 10px;
    text-decoration: none;
}
.hero-slide__cat:hover { background: #1345b8; text-decoration: none; }

.hero-slide__title {
    font-family: var(--font-display);
    font-size: clamp(1.2rem, 2.8vw, 2rem);
    font-weight: 700;
    line-height: 1.3;
    color: #ffffff;
    margin: 0 0 12px;
    text-shadow: 0 1px 4px rgba(0,0,0,.5);
}
.hero-slide__title a { color: inherit; text-decoration: none; }
.hero-slide__title a:hover { text-decoration: underline; }

.hero-slide__meta { display: flex; align-items: center; gap: 12px; }
.hero-slide__meta time { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: rgba(255,255,255,.8); }
.hero-slide__badge { display: flex; align-items: center; gap: 4px; font-size: 11px; color: rgba(255,255,255,.85); background: rgba(255,255,255,.15); padding: 2px 8px; border-radius: 3px; backdrop-filter: blur(4px); }

/* Controls */
.hero-carousel__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.15);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    transition: background .2s;
}
.hero-carousel__btn:hover { background: rgba(255,255,255,.3); }
.hero-carousel__btn--prev { left: 16px; }
.hero-carousel__btn--next { right: 16px; }

/* Dots */
.hero-carousel__dots {
    position: absolute;
    bottom: 18px;
    right: 24px;
    z-index: 10;
    display: flex;
    gap: 7px;
}
.hero-carousel__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255,255,255,.4);
    border: none;
    cursor: pointer;
    padding: 0;
    transition: background .2s, transform .2s;
}
.hero-carousel__dot.is-active { background: #fff; transform: scale(1.3); }

@media (max-width: 768px) {
    .hero-carousel { height: 280px; }
    .hero-slide__content { padding: 20px 18px; }
    .hero-slide__title { font-size: 1.1rem; }
    .hero-carousel__btn { width: 34px; height: 34px; }
}

/* ═══════════════════════════════════════════════
   LATEST TOPICS
   ═══════════════════════════════════════════════ */
.topics-section { padding: 28px 0 0; }

.topics-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
}

.topic-card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    text-decoration: none;
    display: block;
    aspect-ratio: 3/2;
    background: #1e293b;
}

.topic-card__img { position: absolute; inset: 0; }
.topic-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.topic-card:hover .topic-card__img img { transform: scale(1.06); }
.topic-card__placeholder { width: 100%; height: 100%; background: linear-gradient(135deg,#1e3a5f,#0f172a); }
.topic-card__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.75) 0%, rgba(0,0,0,.1) 100%); }

.topic-card__body {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px;
    z-index: 1;
}
.topic-card__count {
    display: block;
    font-family: var(--font-ui);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255,255,255,.7);
    margin-bottom: 4px;
}
.topic-card__name {
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    margin: 0;
    text-shadow: 0 1px 4px rgba(0,0,0,.5);
}

@media (max-width: 640px) {
    .topics-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .topic-card__name { font-size: 14px; }
}

/* ═══════════════════════════════════════════════
   LATEST NEWS (template-parts/latest-news.php)
   ═══════════════════════════════════════════════ */
:root {
    --ln-blue       : var(--color-blue);
    --ln-blue-bg    : var(--color-blue-light);
    --ln-thumb-w    : 108px;
    --ln-thumb-h    : 76px;
}
.ln-section          { width: 100%; font-family: var(--font-body); }
.ln-section__header  { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; padding-bottom: 11px; border-bottom: 2.5px solid var(--color-blue); }
.ln-section__title   { font-family: var(--font-display); font-size: 17px; font-weight: 700; color: var(--color-text-dark); margin: 0; display: flex; align-items: center; gap: 9px; }
.ln-section__title-bar { display: inline-block; width: 4px; height: 20px; background: var(--color-blue); border-radius: 2px; flex-shrink: 0; }
.ln-section__see-all { display: flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: var(--color-blue); transition: gap .18s; cursor:pointer; border:none; background:none; padding:0; }
.ln-section__see-all:hover { gap: 7px; }
.ln-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
.ln-item { border-bottom: 1px solid var(--color-border); opacity: 0; transform: translateY(10px); animation: ln-fadeup .4s ease forwards; }
.ln-item:last-child { border-bottom: none; }
.ln-item:nth-child(1){animation-delay:40ms} .ln-item:nth-child(2){animation-delay:90ms}
.ln-item:nth-child(3){animation-delay:140ms} .ln-item:nth-child(4){animation-delay:190ms}
.ln-item:nth-child(5){animation-delay:240ms}
@keyframes ln-fadeup { to { opacity:1; transform:translateY(0); } }
.ln-card { display: flex; align-items: flex-start; gap: 12px; padding: 13px 0; text-decoration: none; color: inherit; transition: background .15s; border-radius: var(--radius-md); }
.ln-card:hover { background: var(--color-bg-alt); padding-left: 6px; padding-right: 6px; margin-left: -6px; margin-right: -6px; }
.ln-card__thumb-wrap { flex-shrink: 0; width: var(--ln-thumb-w); height: var(--ln-thumb-h); border-radius: var(--radius-md); overflow: hidden; background: #f3f4f6; }
.ln-card__thumb { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; display: block; }
.ln-card:hover .ln-card__thumb { transform: scale(1.06); }
.ln-card__thumb--placeholder { display: flex; align-items: center; justify-content: center; }
.ln-card__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.ln-card__category { font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--color-blue); background: var(--color-blue-light); padding: 2px 7px; border-radius: 3px; border-left: 2px solid var(--color-blue); align-self: flex-start; line-height: 1.6; }
.ln-card__title { font-family: var(--font-display); font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--color-text-dark); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; letter-spacing: -.01em; transition: color .15s; }
.ln-card:hover .ln-card__title { color: var(--color-blue); }
.ln-card__time { display: flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--color-text-muted); margin-top: 2px; }
.ln-card__time-icon { width: 13px; height: 13px; flex-shrink: 0; }
.ln-widget__empty { font-size: 13px; color: var(--color-text-muted); padding: 8px 0; }

/* ═══════════════════════════════════════════════
   SIDEBAR WIDGETS
   ═══════════════════════════════════════════════ */
:root {
    --sw-blue       : var(--color-blue);
    --sw-blue-bg    : var(--color-blue-light);
    --sw-thumb      : 64px;
    --sw-rank       : 34px;
}
.sidebar { display: flex; flex-direction: column; gap: 32px; width: 100%; }
.sw-widget { width: 100%; }
.sw-widget__header { display: flex; align-items: center; padding-bottom: 10px; border-bottom: 2px solid var(--color-blue); margin-bottom: 12px; }
.sw-widget__title { font-family: var(--font-display); font-size: 16px; font-weight: 700; color: var(--color-text-dark); margin: 0; display: flex; align-items: center; gap: 9px; }
.sw-widget__title-accent { display: inline-block; width: 4px; height: 18px; background: var(--color-blue); border-radius: 2px; flex-shrink: 0; }
.sw-widget__empty { font-size: 13px; color: var(--color-text-muted); padding: 8px 0; }

/* Top Articles */
.sw-article-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.sw-article-item { border-bottom: 1px solid var(--color-border); opacity: 0; transform: translateX(-8px); animation: sw-slidein .35s ease forwards; }
.sw-article-item:last-child { border-bottom: none; }
.sw-article-item:nth-child(1){animation-delay:40ms} .sw-article-item:nth-child(2){animation-delay:90ms}
.sw-article-item:nth-child(3){animation-delay:140ms} .sw-article-item:nth-child(4){animation-delay:190ms}
.sw-article-item:nth-child(5){animation-delay:240ms}
@keyframes sw-slidein { to { opacity:1; transform:translateX(0); } }
.sw-article-card { display: flex; align-items: flex-start; gap: 10px; padding: 11px 0; text-decoration: none; color: inherit; transition: background .15s; border-radius: var(--radius-md); }
.sw-article-card:hover { background: var(--color-bg-alt); padding-left: 5px; padding-right: 5px; margin-left: -5px; margin-right: -5px; }
.sw-article-card__thumb { flex-shrink: 0; width: var(--sw-thumb); height: var(--sw-thumb); border-radius: var(--radius-md); overflow: hidden; background: #f3f4f6; }
.sw-article-card__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.sw-article-card:hover .sw-article-card__img { transform: scale(1.08); }
.sw-article-card__img--placeholder { display: flex; align-items: center; justify-content: center; }
.sw-article-card__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.sw-article-card__cat { font-size: 9.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--color-blue); background: var(--color-blue-light); border-left: 2px solid var(--color-blue); padding: 1px 6px; border-radius: 2px; align-self: flex-start; line-height: 1.7; }
.sw-article-card__title { font-family: var(--font-display); font-size: 13.5px; font-weight: 700; line-height: 1.4; color: var(--color-text-dark); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color .15s; }
.sw-article-card:hover .sw-article-card__title { color: var(--color-blue); }
.sw-article-card__meta { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.sw-article-card__time, .sw-article-card__comments { font-size: 11px; color: var(--color-text-muted); display: flex; align-items: center; gap: 3px; }

/* Most Popular */
.sw-popular-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.sw-popular-item { border-bottom: 1px solid var(--color-border); opacity: 0; transform: translateX(-8px); animation: sw-slidein .35s ease forwards; }
.sw-popular-item:last-child { border-bottom: none; }
.sw-popular-item:nth-child(1){animation-delay:60ms} .sw-popular-item:nth-child(2){animation-delay:110ms}
.sw-popular-item:nth-child(3){animation-delay:160ms} .sw-popular-item:nth-child(4){animation-delay:210ms}
.sw-popular-item:nth-child(5){animation-delay:260ms}
.sw-popular-card { display: flex; align-items: flex-start; gap: 12px; padding: 11px 0; text-decoration: none; color: inherit; transition: background .15s; border-radius: var(--radius-md); }
.sw-popular-card:hover { background: var(--color-bg-alt); padding-left: 5px; padding-right: 5px; margin-left: -5px; margin-right: -5px; }
.sw-popular-card__rank { flex-shrink: 0; width: var(--sw-rank); height: var(--sw-rank); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 18px; font-weight: 700; color: var(--color-text-muted); background: var(--color-border); border-radius: var(--radius-md); transition: color .15s, background .15s; }
.sw-popular-card__rank--top { color: var(--color-blue); background: var(--color-blue-light); }
.sw-popular-card:hover .sw-popular-card__rank { color: var(--color-blue); background: var(--color-blue-light); }
.sw-popular-card__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; padding-top: 2px; }
.sw-popular-card__cat { font-size: 9.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--color-blue); background: var(--color-blue-light); border-left: 2px solid var(--color-blue); padding: 1px 6px; border-radius: 2px; align-self: flex-start; line-height: 1.7; }
.sw-popular-card__title { font-family: var(--font-display); font-size: 13.5px; font-weight: 700; line-height: 1.4; color: var(--color-text-dark); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color .15s; }
.sw-popular-card:hover .sw-popular-card__title { color: var(--color-blue); }
.sw-popular-card__views { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; color: var(--color-text-muted); margin-top: 2px; }

/* ═══════════════════════════════════════════════
   MARKET DATA TICKER
   ═══════════════════════════════════════════════ */
.market-data-bar { width:100%; height:40px; background:var(--mdb-bg); border-bottom:1px solid rgba(255,255,255,.08); display:flex; align-items:center; overflow:hidden; position:relative; z-index:1000; }
.market-data-bar__label { flex-shrink:0; padding:0 14px 0 16px; font-family:var(--font-ui); font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:#58a6ff; border-right:1px solid rgba(255,255,255,.08); height:100%; display:flex; align-items:center; white-space:nowrap; background:#161b22; }
.market-data-bar__list { display:flex; align-items:center; flex:1; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; }
.market-data-bar__list::-webkit-scrollbar { display:none; }
.market-index-item { display:flex; align-items:center; gap:8px; padding:0 18px; height:40px; border-right:1px solid rgba(255,255,255,.08); white-space:nowrap; transition:background .2s; cursor:default; flex-shrink:0; }
.market-index-item:hover { background:#161b22; }
.market-index-item__name { font-family:var(--font-ui); font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:#8b949e; }
.market-index-item__value { font-family:var(--font-mono); font-size:12.5px; font-weight:600; color:#e6edf3; }
.market-index-item__change { font-family:var(--font-mono); font-size:11.5px; font-weight:500; padding:2px 6px; border-radius:3px; }
.market-index-item__change.is-positive { color:var(--mdb-positive); background:rgba(63,185,80,.1); }
.market-index-item__change.is-negative { color:var(--mdb-negative); background:rgba(248,81,73,.1); }
.market-index-item__change.is-neutral  { color:#8b949e; background:rgba(139,148,158,.1); }
.market-index-item__change.is-positive::before { content:'▲ '; font-size:8px; }
.market-index-item__change.is-negative::before { content:'▼ '; font-size:8px; }
.market-data-bar__time { flex-shrink:0; padding:0 14px; font-family:var(--font-mono); font-size:10px; color:#8b949e; border-left:1px solid rgba(255,255,255,.08); height:100%; display:flex; align-items:center; background:#161b22; }

/* ═══════════════════════════════════════════════
   SITE HEADER
   ═══════════════════════════════════════════════ */
.site-header { width:100%; background:var(--color-bg); border-bottom:1px solid var(--color-border); position:sticky; top:0; z-index:999; box-shadow:0 1px 8px rgba(0,0,0,.06); }
.site-header__inner { max-width:var(--content-max); margin:0 auto; padding:0 var(--content-pad); height:64px; display:flex; align-items:center; justify-content:space-between; }
.site-header__logo { font-family:var(--font-ui); font-size:22px; font-weight:800; color:var(--color-text-dark); text-decoration:none; }
.site-header__logo span { color:var(--color-blue); }
.site-header__nav ul { display:flex; align-items:center; list-style:none; margin:0; padding:0; gap:6px; }
.site-header__nav ul li a { font-family:var(--font-ui); font-size:14px; font-weight:500; color:var(--color-text-body); text-decoration:none; padding:6px 12px; border-radius:6px; transition:background .15s, color .15s; }
.site-header__nav ul li a:hover, .site-header__nav ul li.current-menu-item a { background:#f3f4f6; color:var(--color-text-dark); }

/* ═══════════════════════════════════════════════
   FOOTER — 4 kolom + bottom bar
   ═══════════════════════════════════════════════ */
.site-footer { background: var(--footer-bg); color: var(--footer-text); }

/* Top */
.footer-top { padding: 56px 0 40px; }

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.6fr;
    gap: 40px;
}

@media (max-width: 1024px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; } }
@media (max-width: 640px)  { .footer-grid { grid-template-columns: 1fr; gap: 28px; } }

.footer-col {}

/* Brand col */
.footer-logo { display: inline-block; margin-bottom: 16px; text-decoration: none; }
.footer-logo__text { font-family: var(--font-ui); font-size: 22px; font-weight: 800; color: #ffffff; }
.footer-logo img { max-height: 50px; width: auto; }

.footer-desc { font-size: 13.5px; line-height: 1.7; color: var(--footer-text); margin: 0 0 20px; max-width: 280px; }

.footer-contact { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-contact li { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--footer-text); }
.footer-contact li svg { flex-shrink: 0; margin-top: 2px; color: var(--footer-text); opacity: .7; }
.footer-contact li a { color: var(--footer-text); text-decoration: none; transition: color .15s; }
.footer-contact li a:hover { color: #ffffff; }

/* Headings */
.footer-col__title {
    font-family: var(--font-ui);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #ffffff;
    margin: 0 0 18px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--footer-border);
}

/* Links */
.footer-links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-links li { display: flex; align-items: center; gap: 6px; font-size: 13.5px; }
.footer-links li svg { flex-shrink: 0; color: var(--color-blue); opacity: .8; }
.footer-links li a { color: var(--footer-text); text-decoration: none; transition: color .15s, padding-left .15s; }
.footer-links li:hover a { color: #ffffff; padding-left: 4px; }

/* Social icons */
.footer-social-icons { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.social-icon { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--footer-border); color: var(--footer-text); transition: background .2s, color .2s, border-color .2s; text-decoration: none; }
.social-icon svg { width: 18px; height: 18px; }
.social-icon:hover { border-color: transparent; color: #fff; text-decoration: none; }
.social-icon--facebook:hover  { background: #1877f2; }
.social-icon--twitter:hover   { background: #000000; }
.social-icon--instagram:hover { background: linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); }
.social-icon--youtube:hover   { background: #ff0000; }
.social-icon--telegram:hover  { background: #0088cc; }

/* Newsletter */
.footer-newsletter__title { font-family: var(--font-ui); font-size: 13px; font-weight: 600; color: #fff; margin: 0 0 4px; }
.footer-newsletter__sub   { font-size: 12px; color: var(--footer-text); margin: 0 0 12px; }
.footer-newsletter__row   { display: flex; gap: 0; border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--footer-border); }
.footer-newsletter__row input { flex: 1; background: rgba(255,255,255,.06); border: none; padding: 9px 12px; font-size: 13px; color: #fff; outline: none; }
.footer-newsletter__row input::placeholder { color: var(--footer-text); }
.footer-newsletter__row button { background: var(--color-blue); border: none; padding: 9px 16px; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .15s; white-space: nowrap; }
.footer-newsletter__row button:hover { background: #1345b8; }

/* Bottom bar */
.footer-bottom { border-top: 1px solid var(--footer-border); padding: 16px 0; }
.footer-bottom__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.footer-bottom__copy { font-size: 13px; color: var(--footer-text); margin: 0; }
.footer-bottom__copy a { color: var(--footer-text); transition: color .15s; }
.footer-bottom__copy a:hover { color: #fff; }

.footer-legal-links { display: flex; gap: 20px; }
.footer-legal-links li a { font-size: 12.5px; color: var(--footer-text); text-decoration: none; transition: color .15s; }
.footer-legal-links li a:hover { color: #fff; }

@media (max-width: 640px) {
    .footer-top { padding: 36px 0 28px; }
    .footer-bottom__inner { flex-direction: column; align-items: flex-start; gap: 10px; }
    .footer-legal-links { flex-wrap: wrap; gap: 12px; }
}

/* ═══════════════════════════════════════════════
   WP CORE
   ═══════════════════════════════════════════════ */
.alignleft  { float: left; margin: 0 24px 16px 0; }
.alignright { float: right; margin: 0 0 16px 24px; }
.aligncenter { display: block; margin: 0 auto 16px; }
.alignwide  { margin-left: calc(-1 * var(--content-pad)); margin-right: calc(-1 * var(--content-pad)); }
.entry-content h2 { font-size: 1.75rem; }
.entry-content h3 { font-size: 1.375rem; }
.entry-content blockquote { border-left: 4px solid var(--color-blue); margin: 24px 0; padding: 8px 24px; color: var(--color-text-muted); font-style: italic; }
.entry-content pre { background: #1e1e2e; color: #cdd6f4; border-radius: var(--radius-md); padding: 16px; overflow-x: auto; font-family: var(--font-mono); font-size: 0.875rem; }

/* ═══════════════════════════════════════════════
   PRO NEWSROOM COLOR UPGRADE — v1.2
   Portal berita lebih powerful, modern, dan berwarna
   ═══════════════════════════════════════════════ */
:root {
    --color-primary: #e11d48;
    --color-blue: #2563eb;
    --color-blue-light: #eff6ff;
    --color-red: #e11d48;
    --color-red-dark: #be123c;
    --color-orange: #f97316;
    --color-yellow: #facc15;
    --color-purple: #7c3aed;
    --color-cyan: #06b6d4;
    --color-green: #16a34a;
    --color-ink: #0f172a;
    --color-paper: #ffffff;
    --color-bg: #f3f6fb;
    --color-bg-alt: #eef2ff;
    --color-border: rgba(15,23,42,.10);
    --shadow-soft: 0 12px 34px rgba(15,23,42,.08);
    --shadow-strong: 0 26px 70px rgba(15,23,42,.18);
    --radius-md: 10px;
    --radius-lg: 22px;
    --hero-height: 560px;
}

body {
    background:
        radial-gradient(circle at top left, rgba(37,99,235,.14), transparent 32rem),
        radial-gradient(circle at top right, rgba(225,29,72,.12), transparent 30rem),
        linear-gradient(180deg, #f8fbff 0%, #f3f6fb 42%, #eef2f7 100%);
    color: #334155;
}

a { color: var(--color-red); }
a:hover { color: var(--color-red-dark); }

.site-container { max-width: 1320px; }
.homepage-wrap { position: relative; overflow: hidden; }
.homepage-wrap::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 330px;
    background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 48%, #e11d48 100%);
    clip-path: polygon(0 0, 100% 0, 100% 70%, 0 100%);
    opacity: .96;
    z-index: -1;
}

/* Market ticker */
.market-data-bar {
    height: 44px !important;
    background: #050816 !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.06);
}
.market-data-bar__label {
    color: #fff !important;
    background: linear-gradient(135deg, #e11d48, #f97316) !important;
    font-weight: 900 !important;
    text-shadow: 0 1px 12px rgba(0,0,0,.35);
}
.market-index-item:hover { background: rgba(37,99,235,.22) !important; }
.market-index-item__value { color: #fff !important; }
.market-data-bar__time { background: rgba(255,255,255,.06) !important; color: #cbd5e1 !important; }

/* Header */
.site-header {
    background: rgba(255,255,255,.88) !important;
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(15,23,42,.08) !important;
    box-shadow: 0 14px 38px rgba(15,23,42,.08) !important;
}
.site-header__inner { height: 78px !important; }
.site-header__logo,
.footer-logo__text {
    letter-spacing: -.04em;
    font-size: 28px !important;
    background: linear-gradient(135deg, #0f172a 0%, #2563eb 42%, #e11d48 82%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
}
.site-header__logo span { color: inherit !important; }
.site-header__nav ul { gap: 4px !important; }
.site-header__nav ul li a {
    border-radius: 999px !important;
    color: #0f172a !important;
    font-weight: 800 !important;
    padding: 10px 14px !important;
}
.site-header__nav ul li a:hover,
.site-header__nav ul li.current-menu-item a {
    color: #fff !important;
    background: linear-gradient(135deg, #2563eb, #e11d48) !important;
    box-shadow: 0 12px 26px rgba(37,99,235,.20);
}

/* Section header */
.section-header,
.sw-widget__header {
    border-bottom: 0 !important;
    padding: 0 !important;
    margin-bottom: 18px !important;
}
.section-title,
.sw-widget__title {
    font-family: var(--font-ui) !important;
    color: #0f172a !important;
    font-size: 20px !important;
    font-weight: 900 !important;
    letter-spacing: -.03em;
}
.section-title__bar,
.sw-widget__title-accent {
    width: 12px !important;
    height: 28px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #e11d48, #f97316) !important;
    box-shadow: 0 8px 20px rgba(225,29,72,.28);
}
.section-see-all {
    color: #fff !important;
    background: #0f172a;
    border-radius: 999px;
    padding: 8px 13px;
    font-weight: 800;
}

/* Hero */
.hero-section { padding: 28px 0 0 !important; }
.hero-carousel {
    border-radius: 30px !important;
    border: 1px solid rgba(255,255,255,.30);
    box-shadow: var(--shadow-strong), inset 0 0 0 1px rgba(255,255,255,.12);
    background: #0f172a !important;
}
.hero-slide__overlay {
    background:
        radial-gradient(circle at 16% 18%, rgba(249,115,22,.42), transparent 24rem),
        linear-gradient(90deg, rgba(2,6,23,.92) 0%, rgba(15,23,42,.62) 48%, rgba(15,23,42,.20) 100%),
        linear-gradient(to top, rgba(0,0,0,.88), rgba(0,0,0,.06)) !important;
}
.hero-slide__content { max-width: 780px; padding: 54px 58px !important; }
.hero-slide__cat,
.ln-card__category,
.sw-article-card__cat,
.sw-popular-card__cat {
    color: #fff !important;
    border-left: 0 !important;
    background: linear-gradient(135deg, #e11d48, #f97316) !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 24px rgba(225,29,72,.20);
}
.hero-slide__title {
    font-family: var(--font-ui) !important;
    font-size: clamp(2rem, 5.2vw, 4.6rem) !important;
    line-height: .98 !important;
    letter-spacing: -.07em;
    text-shadow: 0 6px 34px rgba(0,0,0,.55) !important;
}
.hero-slide__meta time,
.hero-slide__badge {
    color: #f8fafc !important;
    font-weight: 700;
}
.hero-carousel__btn {
    background: rgba(255,255,255,.20) !important;
    border-color: rgba(255,255,255,.36) !important;
    box-shadow: 0 14px 32px rgba(0,0,0,.22);
}
.hero-carousel__dot {
    width: 26px !important;
    height: 6px !important;
    border-radius: 999px !important;
}
.hero-carousel__dot.is-active { background: #f97316 !important; transform: scale(1) !important; }

/* Topic cards */
.topics-section { padding-top: 34px !important; }
.topics-grid { gap: 20px !important; }
.topic-card {
    border-radius: 24px !important;
    overflow: hidden;
    box-shadow: var(--shadow-soft);
    transform: translateY(0);
    transition: transform .25s ease, box-shadow .25s ease;
}
.topic-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 24px 54px rgba(15,23,42,.18);
    text-decoration: none;
}
.topic-card__overlay {
    background: linear-gradient(180deg, rgba(15,23,42,.05), rgba(15,23,42,.86)) !important;
}
.topic-card__name { font-family: var(--font-ui) !important; font-weight: 900 !important; letter-spacing: -.04em; }
.topic-card__count {
    color: #fff !important;
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    padding: 4px 9px;
    backdrop-filter: blur(8px);
}

/* Content cards */
.homepage-body {
    grid-template-columns: minmax(0,1fr) 340px !important;
    gap: 34px !important;
    padding: 38px 0 48px !important;
}
.site-main,
.sidebar .sw-widget,
.ln-widget {
    background: rgba(255,255,255,.86);
    border: 1px solid rgba(15,23,42,.08);
    border-radius: 26px;
    box-shadow: var(--shadow-soft);
}
.site-main { padding: 24px; }
.sidebar .sw-widget { padding: 20px; }
.ln-widget { padding: 22px; }
.ln-card,
.sw-article-card,
.sw-popular-card {
    border-radius: 18px !important;
    padding: 14px !important;
    margin: 0 !important;
}
.ln-card:hover,
.sw-article-card:hover,
.sw-popular-card:hover {
    background: linear-gradient(135deg, rgba(37,99,235,.08), rgba(225,29,72,.07)) !important;
    transform: translateX(4px);
    text-decoration: none;
}
.ln-card__thumb-wrap,
.sw-article-card__thumb {
    border-radius: 18px !important;
    box-shadow: 0 10px 24px rgba(15,23,42,.10);
}
.ln-card__title,
.sw-article-card__title,
.sw-popular-card__title {
    font-family: var(--font-ui) !important;
    font-weight: 900 !important;
    letter-spacing: -.035em;
    color: #0f172a !important;
}
.ln-card:hover .ln-card__title,
.sw-article-card:hover .sw-article-card__title,
.sw-popular-card:hover .sw-popular-card__title { color: #e11d48 !important; }
.sw-popular-card__rank,
.sw-popular-card__rank--top {
    color: #fff !important;
    background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
    box-shadow: 0 10px 24px rgba(37,99,235,.22);
    border-radius: 14px !important;
}

/* Footer */
.site-footer {
    background:
        radial-gradient(circle at 12% 0%, rgba(37,99,235,.38), transparent 26rem),
        radial-gradient(circle at 90% 10%, rgba(225,29,72,.32), transparent 26rem),
        #050816 !important;
}
.footer-top { padding-top: 66px !important; }
.footer-col__title { border-color: rgba(255,255,255,.12) !important; }
.footer-newsletter__row { border-radius: 999px !important; }
.footer-newsletter__row button { background: linear-gradient(135deg, #e11d48, #f97316) !important; font-weight: 900; }

/* Ads / embeds: terlihat premium */
.ad-zone,
[class*="ad-"] {
    border-radius: 20px;
}

@media (max-width: 1024px) {
    .homepage-body { grid-template-columns: 1fr !important; }
    .site-header__inner { height: auto !important; min-height: 72px; flex-wrap: wrap; gap: 12px; padding-top: 12px !important; padding-bottom: 12px !important; }
    .site-header__nav ul { flex-wrap: wrap; }
}
@media (max-width: 768px) {
    :root { --hero-height: 390px; }
    .homepage-wrap::before { height: 270px; }
    .hero-slide__content { padding: 32px 24px !important; }
    .hero-slide__title { font-size: clamp(1.7rem, 9vw, 2.6rem) !important; }
    .site-main,
    .ln-widget,
    .sidebar .sw-widget { padding: 16px; border-radius: 20px; }
}
@media (max-width: 520px) {
    .site-container { padding-left: 16px; padding-right: 16px; }
    .hero-carousel { border-radius: 22px !important; }
    .hero-slide__content { padding: 26px 18px !important; }
    .section-title, .sw-widget__title { font-size: 17px !important; }
    .section-see-all { display: none; }
}