:root{
  --inf-gap: 1rem;
  --inf-border: #e7e3da;
  --inf-bg: #fff;
}
.influencers-page .inf-hero,
.social-view .sv-hero{ margin: .5rem 0 1rem; }
.inf-sub, .sv-sub { color:#555; }

.inf-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(220px,1fr));
  gap: var(--inf-gap);
}
.inf-card{
  border:1px solid var(--inf-border);
  border-radius:14px; background: var(--inf-bg);
  padding:.75rem; display:flex; flex-direction:column; gap:.5rem;
}
.inf-head{ display:flex; align-items:center; gap:.75rem; }
.inf-avatar{ width:56px; height:56px; border-radius:50%; overflow:hidden; background:#f3f2ed; display:grid; place-items:center; font-weight:700; }
.inf-name{ font-weight:800; font-size:1.05rem; }
.inf-bio{ font-size:.9rem; color:#555; }
.inf-links{ display:flex; gap:.5rem; flex-wrap:wrap; }
.inf-links a{ display:inline-flex; align-items:center; gap:.35rem; padding:.35rem .55rem; border:1px solid var(--inf-border); border-radius:999px; text-decoration:none; color:inherit; }
.inf-actions{ display:flex; justify-content:space-between; align-items:center; gap:.5rem; margin-top:.35rem; }
.inf-actions .btn{ padding:.45rem .75rem; border-radius:10px; border:1px solid var(--inf-border); background:#faf9f6; cursor:pointer; text-decoration:none; }
.inf-actions .btn.primary{ background:var(--accent, #1E3985); color:#fff; border-color:transparent; }

.inf-loading{ text-align:center; color:#555; padding:1rem; }

/* Social View */
.sv-form{ display:flex; gap:.5rem; flex-wrap:wrap; margin: .75rem 0 1rem; }
.sv-form input{ padding:.5rem .6rem; border:1px solid var(--inf-border); border-radius:10px; }
.sv-form button{ padding:.5rem .85rem; border-radius:10px; border:1px solid var(--inf-border); background:#faf9f6; cursor:pointer; }
.sv-grid{ display:grid; grid-template-columns: 1fr; gap: var(--inf-gap); }
.sv-card{ border:1px solid var(--inf-border); border-radius:12px; padding:.75rem; background:#fff; }
.sv-list{ display:grid; gap:.5rem; }
.sv-item{ border:1px solid var(--inf-border); border-radius:12px; padding:.75rem; background:#fff; }
.sv-item time{ color:#666; font-size:.85rem; display:block; margin-bottom:.25rem; }

@media (min-width: 900px){
  .sv-grid{ grid-template-columns: 1fr 1fr; }
}
