body {
  background: var(--offwhite);
}

/* ---------- Hero ---------- */
.res-hero{
  background: var(--primary);
  color:#fff;
  padding: 36px 0 28px;
}
.res-hero__title{ color:#fff; margin:0 0 6px; font-size:40px; line-height:1.2; }
.res-hero__subtitle{ color:#e6ecff; margin:0 0 18px; }

.res-search{
  display:flex; align-items:center; gap:10px;
  background: #fff; border:1px solid var(--stroke);
  border-radius:999px; padding:6px 6px 6px 12px;
  box-shadow: var(--shadow-sm);
  max-width:980px;
}
.res-search__icon{ font-size:20px; color:var(--muted); }
.res-search input{ flex:1; height:48px; border:0; outline:0; font-size:15px; border-radius:999px; padding:0 8px; }
.res-search__btn{ height:40px; padding:0 16px; }

.res-cats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:16px; }
.res-chip{
  display:flex; gap:12px; align-items:center;
  background:#fff; border:1px solid var(--stroke); border-radius:14px;
  padding:14px 16px; box-shadow: var(--shadow-sm);
}
.res-chip__icon{
  width:42px; height:42px; border-radius:12px; display:grid; place-items:center;
  background:rgba(16,33,75,.08); color:#21335f; font-size:18px;
}

.res-catband{
  background: var(--offwhite);
  padding: 36px 0 28px;
}
.cat-row{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:28px;
}

.cat-card{
  background:#fff;
  border:1px solid var(--stroke);
  border-radius:24px;
  box-shadow:var(--shadow-sm);
  min-height:120px;
  padding:18px 22px;
  display:grid; grid-template-columns:70px 1fr; gap:18px; align-items:center;
}
.cat-card__icon{
  width:64px; height:64px; border-radius:50%;
  display:grid; place-items:center; font-size:26px; color:#D7BD88;
  background: #EBE7E1; 
}
.cat-card__text h4{
  margin:0 0 6px; color:var(--primary);
  font:700 24px/1.25 "Poppins",system-ui,-apple-system,Segoe UI,Roboto,Arial;
}
.cat-card__text p{ margin:0; color:var(--muted); font-size:18px; }

/* ===== Responsive ===== */
@media (max-width: 980px){
  .res-hero__title{ font-size:44px; }
  .cat-row{ grid-template-columns:1fr; gap:16px; }
}
@media (max-width: 560px){
  .res-searchbar{ padding:10px; }
  .res-searchbar input{ height:44px; }
  .res-searchbar__btn{ height:44px; }
}

.featured-wrap{ padding: 24px 0; }

.featured__media,
.featured__media * { margin:0; padding:0; }

.featured{
  display:grid;
  grid-template-columns: 1.1fr 1fr;
  gap:0;                            
  border:1px solid var(--stroke);
  border-radius:18px;
  overflow:hidden;              
  background:#fff;
  box-shadow: var(--shadow-sm);
}

.featured__media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.featured__body{
  padding:28px 32px;              
  display:flex; flex-direction:column; justify-content:center;
}
.featured__eyebrow{ color: var(--secondary); font-weight:600; font-size:14px; margin-bottom:8px; }
.featured__title{ color:var(--primary); font-size:28px; line-height:1.3; margin:0 0 12px; }
.featured__excerpt{ color:var(--muted); margin:0 0 18px; }

.featured__author{ display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.featured__author img{ width:56px; height:56px; border-radius:50%; object-fit:cover; }
.featured__author .name{ font-weight:700; color:var(--primary); }
.featured__author .role{ font-size:14px; color:var(--muted); }

.featured__cta{ align-self:start; }

.res-grid{ display:grid; gap:18px; grid-template-columns:repeat(3,1fr); }
.res-card{ background:#fff; border:1px solid var(--stroke); border-radius:16px; overflow:hidden; box-shadow: var(--shadow-sm); display:flex; flex-direction:column; }
.res-card__media img{ width:100%; height:210px; object-fit:cover; display:block; }
.res-card__content{ padding:16px; }
.res-card__title{ font-size:18px; margin:6px 0 6px; }
.res-card__title a{ color: var(--primary); }
.res-card__text{ margin:0 0 10px; }
.res-card__link{ font-weight:600; color: var(--primary); }

.tag{ display:inline-block; font-size:12px; font-weight:700; padding:6px 10px; border-radius:999px; margin-bottom:8px; background:rgba(16,33,75,.08); color:#21335f; }
.tag--career{ background:#FFF3D8; color:#6E4B00; }
.tag--city{ background:#EAF3FF; color:#0E3C83; }
.tag--student{ background:#EAF8F4; color:#13684A; }

.res-pagination{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; margin-top: 18px;
}
.res-pagination .pages{
  display:flex; gap:6px; align-items:center; justify-content:center;
}
.res-pagination button{
  height:36px; padding:0 12px; border-radius:10px; border:1px solid var(--stroke);
  background:#fff; cursor:pointer;
}
.res-pagination .is-current{
  background: var(--primary); color:#fff; border-color: var(--primary);
}
.res-pagination .ellipsis{ color: var(--muted); }


/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .featured{ grid-template-columns:1fr; }
  .res-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px){
  .res-cats{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .res-hero__title{ font-size:32px; }
  .res-grid{ grid-template-columns:1fr; }
}
