
/* Modern news list (header preserved) */
:root{
  --accent-rgb: 255,156,47;
  --bg: var(--page-bg);
  --bg2: var(--page-surface);
  --text: var(--text-main);
  --muted: var(--text-muted);
  --card: var(--page-surface);
  --accent: var(--accent-main);
  --ring: rgba(var(--accent-rgb), 0.35);
  --radius:16px;
  --shadow: 0 12px 28px rgba(2,6,23,.12);
}
html[data-theme="dark"]{
  --shadow: 0 16px 40px rgba(0,0,0,.5);
}
*{box-sizing:border-box}
body{background:var(--bg); color:var(--text);}
.main-wrap{max-width:1200px;margin:40px auto;padding:0 20px}
.h1{font-size:clamp(28px,4vw,44px); letter-spacing:-.02em; margin:8px 0 6px;}
.desc{color:var(--muted); margin: 0 0 18px}
.controls{display:flex; gap:10px; align-items:center; margin: 16px 0 22px;}
.search{flex:1; background:var(--bg2); color:var(--text); border:1px solid var(--page-border-subtle);
  padding:12px 14px; border-radius:12px}
.filter{border:1px solid var(--page-border-subtle); background:var(--bg2); color:var(--text);
  padding:12px 14px; border-radius:12px; min-width:140px}
.grid{display:grid; grid-template-columns:repeat(12,1fr); gap:18px}
.card{grid-column:span 12; background:var(--card); border:1px solid var(--page-border-subtle);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;}
.card:hover{transform:translateY(-2px); box-shadow:0 16px 40px rgba(0,0,0,.34); border-color:var(--ring)}
@media (min-width:640px){.card{grid-column:span 6}}
@media (min-width:980px){.card{grid-column:span 4}}
.thumb{position:relative; aspect-ratio:16/10; overflow:hidden}
.thumb img{width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.03);
  transition: transform .5s ease}
.card:hover .thumb img{transform:scale(1.06)}
.body{padding:16px 16px 18px}
.badge{display:inline-block; font-size:12px; letter-spacing:.02em; padding:4px 10px; border-radius:999px;
  background: linear-gradient(90deg,var(--accent),#22d3ee); color:white; font-weight:600}
.title{font-size: clamp(18px, 2vw, 22px); margin:10px 0 6px}
.text{color:var(--muted); margin:0 0 14px}
.actions{display:flex; align-items:center; justify-content:space-between}
.readmore{display:inline-flex; gap:8px; align-items:center; text-decoration:none; font-weight:600; color:var(--accent)}
.readmore:focus{outline:2px solid var(--ring); outline-offset:2px; border-radius:8px}
.u-backlink{ display:none !important; }
.footer-spacer{height:30px}
