/*
Theme Name: Berita Lite
Theme URI: https://example.com/berita-lite
Author: You
Description: Tema berita ringan. Navbar: logo | title(2-row) | menu | search.
Version: 1.1.2
Text Domain: berita-lite
*/
:root{--container:1200px;--gap:.75rem;--bg:#fff;--fg:#111827;--muted:#6b7280;--brand:#0ea5e9}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--fg);line-height:1.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{max-width:var(--container);margin-inline:auto;padding-inline:1rem}

/* === Navbar grid: logo | title(2 rows) | menu | search === */
.nav{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid #e5e7eb}
.nav__row{
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  grid-auto-rows:auto;
  gap:1rem;
  align-items:center;
  padding:.75rem 0;
}
.nav__logo a{display:inline-flex;align-items:center}
.custom-logo{max-height:48px;width:auto;height:auto;border-radius:6px;object-fit:contain}
.nav__title{font-weight:800;font-size:1.15rem;line-height:1.2}
/* span 2 rows for title on desktop */
@media(min-width:901px){
  .nav__title{grid-row:1 / span 2;align-self:center}
}
.navmenu{justify-self:start}
.navmenu .menu{display:flex;align-items:center;gap:1rem;list-style:none}
.navmenu .menu li{position:relative}
.navmenu .menu a{display:block;padding:.5rem .75rem;border-radius:6px;font-weight:500;color:#111827}
.navmenu .menu a:hover,.navmenu .menu a:focus{background:#f3f4f6;color:var(--brand)}
/* Dropdown */
.navmenu .menu li ul{position:absolute;top:100%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:.5rem;padding:.5rem 0;min-width:200px;list-style:none;display:none;z-index:999}
.navmenu .menu li:hover>ul,.navmenu .menu li:focus-within>ul{display:block}
.navmenu .menu li ul li a{padding:.5rem 1rem;white-space:nowrap}
/* Search */
.search{width:100%;max-width:460px;justify-self:end}
.search form{display:flex;width:100%}
.search input[type="search"]{flex:1;border:1px solid #e5e7eb;border-right:0;border-radius:6px 0 0 6px;padding:.55rem .75rem}
.search button{border:1px solid #e5e7eb;border-radius:0 6px 6px 0;background:#f9fafb;cursor:pointer;padding:.55rem .75rem}
/* Mobile */
.nav__toggle{display:none;border:1px solid #e5e7eb;border-radius:6px;background:#fff;padding:.4rem .6rem;cursor:pointer}
@media(max-width:900px){
  .nav__row{grid-template-columns:auto 1fr auto;gap:.75rem}
  .nav__toggle{display:block;justify-self:end}
  .navmenu{display:none;grid-column:1/-1}
  .search{grid-column:1/-1;max-width:none}
  html.menu-open .navmenu{display:block}
  .navmenu .menu{flex-direction:column;align-items:flex-start;padding:1rem 0;border-top:1px solid #e5e7eb;margin-top:.5rem}
}

/* Slider */
.slider{position:relative;overflow:hidden;border-radius:1rem;margin:1rem 0}
.slide{display:none;position:relative}
.slide.active{display:block}
.slide__img{aspect-ratio:16/9;object-fit:cover;width:100%}
.slide__meta{position:absolute;bottom:0;left:0;right:0;padding:1rem;background:linear-gradient(to top,rgba(0,0,0,.55),transparent 60%)}
.slide__title{color:#fff;font-size:clamp(1.1rem,2vw,1.6rem);font-weight:700;margin:0 0 .25rem}
.slide__desc{color:#f3f4f6;margin:0;font-size:.9rem}
.slider__nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 .5rem}
.slider__btn{background:rgba(255,255,255,.85);border:0;border-radius:.5rem;padding:.4rem .6rem;cursor:pointer}
.slider__dots{position:absolute;left:50%;transform:translateX(-50%);bottom:.5rem;display:flex;gap:.35rem}
.slider__dot{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.6)}
.slider__dot.active{background:#fff}

/* Grid cards */
.grid{display:grid;gap:var(--gap);grid-template-columns:repeat(12,1fr)}
.card{grid-column:span 12;border:1px solid #e5e7eb;border-radius:.75rem;overflow:hidden;background:#fff}
.card__thumb{aspect-ratio:16/9;object-fit:cover;width:100%}
.card__body{padding:.75rem}
.card__title{font-weight:700;margin:0 0 .25rem;font-size:1rem}
.card__meta{color:var(--muted);font-size:.85rem;margin-bottom:.25rem}
.card__excerpt{color:#374151;font-size:.95rem}
@media(min-width:640px){.card{grid-column:span 6}}
@media(min-width:1024px){.card{grid-column:span 4}}

/* Load more */
.loadmore-wrap{display:flex;justify-content:center;margin:1rem 0 2rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;border:1px solid #e5e7eb;border-radius:.6rem;padding:.6rem 1rem;background:#fff;cursor:pointer}
.btn:hover{background:#f9fafb}

/* Footer */
.footer{background:#0f172a;color:#e2e8f0;margin-top:2rem}
.footer .container{padding:2rem 1rem}
.fgrid{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:768px){.fgrid{grid-template-columns:repeat(3,1fr)}}
.footer a{color:#e2e8f0}
.footer small{color:#94a3b8}