body{
  margin:0;
  font-family:Segoe UI,Roboto,sans-serif;
  background:#0f1115;
  color:#eaeaea
}
a{text-decoration:none;color:inherit}

/* =========================
   CONTAINER
========================= */
.container{
  max-width:1300px;
  margin:auto;
  padding:60px 20px
}
.page-title{
  font-size:40px;
  font-weight:900;
  margin-bottom:40px
}

/* =========================
   BRAND GRID
========================= */
.brand-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:28px
}
.brand-card{
  background:#151822;
  border-radius:18px;
  overflow:hidden;
  transition:.25s
}
.brand-card:hover{
  transform:translateY(-6px);
  background:#1c2030
}
.brand-img{
  height:160px;
  overflow:hidden
}
.brand-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.35s
}
.brand-card:hover img{transform:scale(1.06)}
.brand-body{
  padding:18px 20px;
  display:flex;
  justify-content:space-between;
  align-items:center
}
.brand-name{
  font-size:20px;
  font-weight:800
}
.brand-count{
  font-size:14px;
  opacity:.75
}

/* =========================
   REVIEW GRID
========================= */
.review-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:28px
}
.review-card{
  background:#151822;
  border-radius:18px;
  overflow:hidden;
  transition:.25s
}
.review-card:hover{
  transform:translateY(-6px);
  background:#1c2030
}
.review-card img{
  width:100%;
  height:190px;
  object-fit:cover
}
.review-body{
  padding:18px
}
.review-body h3{
  margin:0 0 8px;
  font-size:18px
}
.review-overview{
  font-size:14px;
  line-height:1.5;
  opacity:.85
}
.review-rating{
  color:#ffcc00;
  font-size:14px;
  margin-top:10px
}

/* =========================
   PAGINATION
========================= */
.pagination{
  display:flex;
  justify-content:center;
  gap:10px;
  margin:70px 0 20px
}
.page-btn{
  padding:10px 16px;
  border-radius:30px;
  background:#151822;
  font-weight:700;
  opacity:.75
}
.page-btn:hover{
  opacity:1;
  background:#1c2030
}
.page-btn.active{
  background:#ff3c38;
  color:#fff;
  opacity:1
}
.page-btn.disabled{
  pointer-events:none;
  opacity:.35
}

/* =========================
   FOOTER
========================= */
footer{
  background:#0b0d12;
  border-top:1px solid #1c1f26;
  padding:30px;
  text-align:left;
  font-size:14px;
  opacity:.7
}
