/* CompanyFetch — mobile-first styles layered over Bootstrap 5.3 */
:root{
  --cf-primary:#0b5cff; --cf-dark:#0c1733; --cf-ink:#1b2433; --cf-muted:#5b6b86;
  --cf-bg:#f5f7fb; --cf-card:#fff; --cf-line:#e6ebf3; --cf-radius:14px;
}
*{box-sizing:border-box}
body{background:var(--cf-bg);color:var(--cf-ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--cf-primary);text-decoration:none}
a:hover{text-decoration:underline}
.btn-primary{--bs-btn-bg:var(--cf-primary);--bs-btn-border-color:var(--cf-primary);--bs-btn-hover-bg:#0a4fdb;--bs-btn-hover-border-color:#0a4fdb}

/* Nav */
.site-nav{background:#fff;border-bottom:1px solid var(--cf-line)}
.brand-mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--cf-primary);color:#fff;font-weight:800;font-size:.8rem;margin-right:.15rem}
.navbar-brand{color:var(--cf-dark)}

.site-main{min-height:60vh}

/* Hero + search */
.hero{background:linear-gradient(180deg,#eaf0ff 0%,var(--cf-bg) 100%);padding:2.2rem 0 1.6rem}
.hero-title{font-size:1.55rem;font-weight:800;line-height:1.2;color:var(--cf-dark);max-width:18ch}
.hero-sub{color:var(--cf-muted);max-width:48ch;margin:.5rem 0 1.1rem}
.search-card{background:var(--cf-card);border:1px solid var(--cf-line);border-radius:var(--cf-radius);padding:1rem;box-shadow:0 8px 30px rgba(12,23,51,.06)}
.search-card .form-label{font-size:.82rem;font-weight:600;color:var(--cf-muted);margin-bottom:.2rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Content blocks */
.content-block{padding:1.6rem 0}
.feature-list{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.feature-list li{background:#fff;border:1px solid var(--cf-line);border-radius:10px;padding:.7rem .9rem}

/* Profile */
.profile-wrap{padding:1.2rem 0 2rem}
.back-link{display:inline-block;margin-bottom:.6rem;color:var(--cf-muted)}
.profile{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-radius);padding:1.1rem;box-shadow:0 8px 30px rgba(12,23,51,.05)}
.profile-head{display:flex;gap:.8rem;align-items:center}
.profile-logo{width:56px;height:56px;border-radius:12px;object-fit:contain;background:#fff;border:1px solid var(--cf-line)}
.placeholder-logo{display:grid;place-items:center;background:var(--cf-primary);color:#fff;font-weight:800;font-size:1.4rem}
.profile-name{font-size:1.3rem;font-weight:800;margin:0;color:var(--cf-dark)}
.profile-badges{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.profile-summary{margin:.9rem 0;color:#33405a;line-height:1.55}
.profile-section{border-top:1px solid var(--cf-line);padding-top:.9rem;margin-top:.9rem}
.profile-section h2{font-size:1.05rem;font-weight:700;color:var(--cf-dark);margin-bottom:.5rem}
.kv{display:grid;grid-template-columns:9rem 1fr;gap:.35rem .8rem;margin:0}
.kv dt{color:var(--cf-muted);font-weight:600;font-size:.9rem}
.kv dd{margin:0;word-break:break-word}
.social-row{display:flex;flex-wrap:wrap;gap:.4rem}
.social-pill{border:1px solid var(--cf-line);border-radius:999px;padding:.25rem .7rem;font-size:.85rem;background:#fff}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{background:#eef3ff;color:#27408b;border-radius:8px;padding:.25rem .6rem;font-size:.82rem;font-weight:600}
.people-grid{display:grid;gap:.6rem;grid-template-columns:1fr}
.person-card{border:1px solid var(--cf-line);border-radius:10px;padding:.7rem}
.person-name{font-weight:700}
.person-title{color:var(--cf-muted);font-size:.88rem}
.upsell{background:#fff8e6;border-radius:10px;border:1px dashed #e9c46a;padding:.9rem}
.attributions{margin-top:1rem}

/* Ads */
.ad-slot{display:grid;place-items:center;background:#eef1f6;border:1px dashed #cdd6e4;border-radius:10px;margin:1rem 0;color:#9aa7bd}
.ad-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}

/* Footer */
.site-footer{background:var(--cf-dark);color:#c7d2e6;padding:1.6rem 0;margin-top:2rem}
.site-footer a{display:block;color:#c7d2e6;padding:.15rem 0}
.site-footer .footer-h{font-weight:700;color:#fff;margin-bottom:.3rem}
.site-footer .brand-mark{background:#fff;color:var(--cf-dark)}

/* Tablet+ */
@media (min-width:768px){
  .hero{padding:3.2rem 0 2.2rem}
  .hero-title{font-size:2.3rem}
  .search-card{padding:1.4rem}
  .people-grid{grid-template-columns:1fr 1fr}
  .profile{padding:1.6rem}
}
@media (min-width:992px){
  .hero-title{font-size:2.7rem}
}
