/*
Theme Name: NewsPro Lite
Theme URI: https://example.com/newspro-lite
Author: OpenAI
Description: Tema berita WordPress responsif, ringan, dan aman dengan hero slider, grid berita, sidebar, dan tampilan mobile-first.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: newspro-lite
Tags: news, magazine, blog, two-columns, custom-logo, featured-images, responsive-layout
*/

:root{
  --np-blue:#1769ff;
  --np-blue-dark:#0f4dd4;
  --np-red:#ef3d3d;
  --np-dark:#111827;
  --np-text:#20242b;
  --np-muted:#6b7280;
  --np-line:#e7ebf1;
  --np-soft:#f5f7fb;
  --np-white:#fff;
  --np-radius:14px;
  --np-shadow:0 10px 35px rgba(15,23,42,.07);
  --np-container:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--np-text);background:#fff;line-height:1.65}
a{color:inherit;text-decoration:none}
a:hover{color:var(--np-blue)}
img{max-width:100%;height:auto;display:block}
.container{width:min(calc(100% - 32px),var(--np-container));margin-inline:auto}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.topbar{background:#11151c;color:#e5e7eb;font-size:13px}
.topbar-inner{min-height:38px;display:flex;align-items:center;gap:16px;overflow:hidden}
.breaking-label{background:var(--np-red);color:#fff;border-radius:4px;padding:5px 9px;font-weight:700;white-space:nowrap}
.breaking-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-header{background:#fff;border-bottom:1px solid var(--np-line);position:sticky;top:0;z-index:50}
.header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.branding{display:flex;align-items:center;gap:12px;min-width:180px}
.custom-logo{max-height:50px;width:auto}
.site-title{margin:0;font-size:30px;font-weight:800;letter-spacing:-.8px;line-height:1}.site-title a span{color:var(--np-blue)}
.site-tagline{margin:5px 0 0;color:var(--np-muted);font-size:12px}
.main-nav{display:flex;align-items:center;gap:18px}
.main-nav ul{display:flex;align-items:center;gap:23px;list-style:none;margin:0;padding:0}
.main-nav li{margin:0}.main-nav a{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.01em}
.search-toggle,.menu-toggle{border:0;background:transparent;cursor:pointer;font-size:21px;padding:8px;color:var(--np-dark)}
.menu-toggle{display:none}

.hero{padding:22px 0 18px}
.slider{position:relative;border-radius:var(--np-radius);overflow:hidden;background:#0f172a;box-shadow:var(--np-shadow)}
.slider-track{display:grid;grid-auto-flow:column;grid-auto-columns:100%;transition:transform .45s ease}
.slide{position:relative;min-height:430px;isolation:isolate}
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.03) 10%,rgba(0,0,0,.82) 100%);z-index:0}
.slide-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.slide-content{position:absolute;left:36px;right:36px;bottom:34px;z-index:2;color:white;max-width:760px}
.badge{display:inline-flex;background:var(--np-blue);color:#fff;border-radius:4px;padding:4px 8px;font-size:11px;line-height:1.2;font-weight:800;text-transform:uppercase}
.slide h2{font-size:38px;line-height:1.12;margin:10px 0 12px;letter-spacing:-.7px}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;color:#dbe1ea;font-size:12px}.meta-dark{color:var(--np-muted)}
.slider-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:4;border:0;background:rgba(255,255,255,.94);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;cursor:pointer;font-size:25px;box-shadow:0 4px 20px rgba(0,0,0,.15)}
.slider-btn:hover{background:#fff;color:var(--np-blue)}.slider-prev{left:16px}.slider-next{right:16px}
.slider-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:7px;z-index:4}.slider-dot{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.55);cursor:pointer}.slider-dot.is-active{background:var(--np-blue);transform:scale(1.2)}

.content-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:34px;padding:12px 0 45px}
.section-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 18px;padding-left:12px;border-left:4px solid var(--np-blue)}
.section-head h2,.widget-title{margin:0;font-size:21px;line-height:1.3}
.news-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.card{border:1px solid var(--np-line);border-radius:12px;overflow:hidden;background:#fff;transition:.2s ease}.card:hover{transform:translateY(-2px);box-shadow:var(--np-shadow)}
.card-thumb{aspect-ratio:16/9;overflow:hidden;background:#e9edf4}.card-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.card:hover .card-thumb img{transform:scale(1.03)}
.card-body{padding:15px 16px 18px}.card-title{font-size:19px;line-height:1.32;margin:9px 0 8px}.card-excerpt{color:var(--np-muted);font-size:14px;margin:10px 0 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-list{display:grid;gap:18px}.post-row{display:grid;grid-template-columns:180px 1fr;gap:18px;padding-bottom:18px;border-bottom:1px solid var(--np-line)}.post-row-thumb{aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:#eef2f7}.post-row-thumb img{width:100%;height:100%;object-fit:cover}.post-row h3{font-size:20px;line-height:1.3;margin:7px 0}

.sidebar{display:grid;align-content:start;gap:24px}.widget{background:#fff;border:1px solid var(--np-line);border-radius:12px;padding:18px}.widget-title{padding-left:10px;border-left:4px solid var(--np-blue);margin-bottom:15px}.search-form{display:flex;gap:8px}.search-form label{flex:1}.search-field{width:100%;height:42px;border:1px solid var(--np-line);border-radius:7px;padding:0 12px;font:inherit}.search-submit{border:0;border-radius:7px;background:var(--np-blue);color:#fff;padding:0 16px;font-weight:700;cursor:pointer}
.popular-list{counter-reset:pop;display:grid;gap:14px}.popular-item{counter-increment:pop;display:grid;grid-template-columns:30px 74px 1fr;gap:10px;align-items:center}.popular-item::before{content:counter(pop);width:27px;height:27px;border-radius:6px;background:var(--np-blue);color:white;font-weight:800;display:grid;place-items:center;font-size:12px}.popular-item img{width:74px;height:56px;object-fit:cover;border-radius:7px}.popular-item h4{font-size:13px;line-height:1.35;margin:0}.popular-item time{font-size:11px;color:var(--np-muted)}
.category-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}.category-list li{display:flex;justify-content:space-between;border-bottom:1px dashed var(--np-line);padding-bottom:8px}.category-list a{font-weight:650}

.article-header{padding:28px 0 12px}.article-header h1{font-size:42px;line-height:1.15;letter-spacing:-.8px;margin:10px 0}.article-cover{margin:18px 0 26px;border-radius:14px;overflow:hidden}.article-content{font-size:17px}.article-content p{margin:0 0 1.2em}.article-content h2,.article-content h3{line-height:1.25;margin-top:1.6em}.article-content a{text-decoration:underline;color:var(--np-blue)}.article-content img{border-radius:10px}
.pagination,.nav-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.page-numbers{border:1px solid var(--np-line);border-radius:7px;min-width:38px;height:38px;padding:0 11px;display:grid;place-items:center}.page-numbers.current{background:var(--np-blue);color:#fff;border-color:var(--np-blue)}

.features{background:var(--np-soft);border-top:1px solid var(--np-line);padding:25px 0}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.feature{display:flex;gap:12px;align-items:flex-start}.feature-icon{width:42px;height:42px;border-radius:50%;background:#e8f0ff;color:var(--np-blue);display:grid;place-items:center;flex:0 0 42px;font-weight:900}.feature h4{margin:0 0 3px;font-size:14px}.feature p{margin:0;color:var(--np-muted);font-size:12px}
.site-footer{background:#111827;color:#cbd5e1;padding:40px 0 0}.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr 1.2fr;gap:30px}.site-footer h3,.site-footer h4{color:#fff;margin-top:0}.site-footer p,.site-footer a{font-size:13px;color:#cbd5e1}.footer-links{list-style:none;margin:0;padding:0;display:grid;gap:8px}.copyright{border-top:1px solid #273244;margin-top:32px;padding:15px 0;font-size:12px;color:#94a3b8}

@media (max-width:980px){
  .menu-toggle{display:inline-grid;place-items:center}.main-nav{position:fixed;inset:120px 16px auto 16px;background:#fff;border:1px solid var(--np-line);border-radius:12px;box-shadow:var(--np-shadow);padding:18px;display:none}.main-nav.is-open{display:block}.main-nav ul{display:grid;gap:0}.main-nav li{border-bottom:1px solid var(--np-line)}.main-nav li:last-child{border:0}.main-nav a{display:block;padding:12px 0}.content-wrap{grid-template-columns:1fr}.sidebar{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:700px){
  .container{width:min(calc(100% - 22px),var(--np-container))}.topbar-inner{gap:8px}.header-inner{min-height:68px}.site-title{font-size:25px}.site-tagline{display:none}.main-nav{inset:104px 11px auto 11px}.hero{padding-top:12px}.slide{min-height:390px}.slide-content{left:20px;right:20px;bottom:30px}.slide h2{font-size:28px}.slider-btn{width:38px;height:38px}.news-grid{grid-template-columns:1fr}.sidebar{grid-template-columns:1fr}.post-row{grid-template-columns:120px 1fr}.post-row h3{font-size:17px}.feature-grid,.footer-grid{grid-template-columns:1fr}.article-header h1{font-size:32px}.content-wrap{gap:28px}.card-excerpt{font-size:13px}
}