/* main.css — White premium theme (global) */
* { box-sizing: border-box; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
html,body { height:100%; margin:0; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; background:#ffffff; color:#222; }
a { color:inherit; text-decoration:none; }

/* Layout containers */
.site-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:20px 28px;
  background:#ffffff;
  border-bottom:1px solid #f2f2f2;
  position:sticky;
  top:0;
  z-index:50;
}
.site-brand { display:flex; flex-direction:column; }
.logo { font-size:26px; font-weight:800; color:#111; line-height:1; }
.subtitle { font-size:13px; color:#6b7280; margin-top:4px; }

/* Search area */
.search-area { display:flex; gap:12px; align-items:center; }
.search-area input, .search-area select {
  padding:10px 14px;
  border-radius:10px;
  border:1px solid #e6e6e6;
  background:#fff;
  font-size:15px;
  min-width:220px;
  transition: box-shadow .16s ease, transform .12s ease;
}
.search-area input:focus, .search-area select:focus {
  box-shadow:0 8px 22px rgba(2,122,255,0.08);
  transform:translateY(-1px);
  outline:none;
}

/* Content wrapper */
.content { max-width:1280px; margin:18px auto; padding:0 18px 40px; }

/* Featured section container spacing */
.featured-section { margin-bottom:20px; }
.featured-inner { display:flex; align-items:center; gap:12px; position:relative; }
.feat-track { display:flex; gap:16px; width:100%; overflow:hidden; align-items:stretch; padding:6px 0; }
.feat-nav { border:0; background:#fff; padding:10px; border-radius:10px; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,0.06); }

/* Dots */
.feat-dots { display:flex; justify-content:center; gap:8px; margin-top:10px; }
.feat-dots button { width:10px; height:10px; border-radius:999px; border:0; background:#e6eefc; cursor:pointer; }
.feat-dots button.active { background:#007aff; }

/* Grid root */
.grid-root { margin-top:6px; }

/* Pagination (shared) */
.pagination { margin-top:18px; display:flex; justify-content:center; align-items:center; gap:14px; }
.pg-btn { padding:10px 14px; border-radius:8px; border:0; background:#f6f6f6; cursor:pointer; }
.pg-btn:disabled { opacity:0.45; cursor:not-allowed; }

/* Footer */
.footer { margin-top:22px; padding:28px; text-align:center; color:#8a8a8a; border-top:1px solid #f6f6f6; }

/* Small screens */
@media (max-width:900px) {
  .search-area input { min-width:120px; }
  .logo { font-size:20px; }
  .featured-inner { gap:8px; }
  .feat-nav { padding:8px; }
}