@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&family=Noto+Serif:wght@500;600;700&display=swap');
    body{
      margin:0;
      font-family:"Be Vietnam Pro","Segoe UI",Tahoma,Arial,sans-serif;
      color:#e8e1d2;
      background-image:
    linear-gradient(180deg, rgba(11,13,18,.15), rgba(11,13,18,.92)),
    url('/img/bg-news.jpg');
    }
    .wrap{max-width:1120px;margin:0 auto;padding:96px 28px 28px}
    .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
    h1{
      margin:0;
      font-family:"Noto Serif",Georgia,"Times New Roman",serif;
      font-size:36px;
      color:#ebd7ae;
      font-weight:500;
      letter-spacing:.6px;
    }
    a{color:#dcbf86;text-decoration:none}
    a:hover{color:#f1dfb2}
    .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
    .card{
      background:linear-gradient(180deg,rgba(23,26,35,.86),rgba(17,19,26,.92));
      border:1px solid rgba(214,178,119,.2);
      border-radius:12px;overflow:hidden;
      transition:transform .2s ease, box-shadow .2s ease;
    }
    .card:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.26)}
    .card img{width:100%;height:190px;object-fit:cover;display:block}
    .card .body{padding:14px}
    .title{
      font-family:"Noto Serif",Georgia,"Times New Roman",serif;
      font-size:20px;
      font-weight:500;
      margin:0 0 8px;
      line-height:1.35;
    }
    .meta{font-size:12px;color:#a9a18f;margin-bottom:8px}
    .sum{font-size:14px;color:#d6d0c2;line-height:1.55}
    .pager{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:20px;flex-wrap:wrap}
    .pager button{
      padding:8px 12px;border-radius:2px;
      border:1px solid rgba(214,178,119,.32);
      background:rgba(22,24,32,.95);
      color:#e7d7b8;cursor:pointer
    }
    .pager button:hover{background:rgba(214,178,119,.14)}
    .pager button:disabled{opacity:.45;cursor:not-allowed}
    .pages{display:flex;gap:6px;align-items:center}
    .page-btn{
      min-width:34px;padding:7px 10px;border-radius:2px;
      border:1px solid rgba(214,178,119,.3);background:rgba(15,17,24,.95);
      color:#e5d8bf;cursor:pointer
    }
    .page-btn.active{
      background:linear-gradient(180deg,#7f6742,#c3a171 55%,#8b7049);
      border-color:#d8ba88;color:#fff8e6
    }