/* =============================================================
   Scaling By AI — shared site stylesheet
   Host at: scalingby.ai/css/style.css
   Pairs with: Tailwind CDN (script src="https://cdn.tailwindcss.com")
               + Google Fonts Inter + IBM Plex Mono
   Every page should link this file rather than embed its own
   <style> block, so brand updates only happen in one place.
   ============================================================= */

:root{
  --brand-primary:#00f2ff;
  --brand-secondary:#7000ff;
  --bg-dark:#0a0a0c;
  --card-bg:#16161a;
  --loss-red:#ff4d5e;
  --good:#22e2a0;
  --warn:#ffb020;
}

/* ---------- Base ---------- */
body{
  font-family:'Inter',sans-serif;
  background-color:var(--bg-dark);
  color:#ffffff;
  scroll-behavior:smooth;
}
.mono{font-family:'IBM Plex Mono',monospace;}

/* ---------- Brand text + buttons ---------- */
.text-gradient{
  background:linear-gradient(to right,var(--brand-primary),var(--brand-secondary));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.btn-primary{
  background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary));
  transition:transform .2s ease,box-shadow .2s ease;
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,242,255,.3);}
.btn-secondary{
  transition:background-color .2s ease;
}
.btn-secondary:hover{background:rgba(255,255,255,.05);}

/* ---------- Cards + glow ---------- */
.glass-card{
  background:var(--card-bg);
  border:1px solid rgba(255,255,255,.05);
  backdrop-filter:blur(10px);
}
.hero-glow{
  position:absolute;top:-10%;left:50%;transform:translateX(-50%);
  width:80%;height:400px;
  background:radial-gradient(circle,rgba(112,0,255,.15) 0%,transparent 70%);
  z-index:-1;
}

/* ---------- Ledger (dashed-row lists — missed-call tickers etc.) ---------- */
.ledger{border:1px solid rgba(255,77,94,.25);background:rgba(255,77,94,.05);}
.ledger-row{border-bottom:1px dashed rgba(255,255,255,.08);}
.ledger-row:last-child{border-bottom:none;}

/* ---------- Motion ---------- */
@keyframes pulse-ring{
  0%{box-shadow:0 0 0 0 rgba(0,242,255,.45);}
  70%{box-shadow:0 0 0 14px rgba(0,242,255,0);}
  100%{box-shadow:0 0 0 0 rgba(0,242,255,0);}
}
.pulse-cta{animation:pulse-ring 2.2s infinite;}
@media (prefers-reduced-motion: reduce){
  .pulse-cta{animation:none;}
}

/* ---------- Floating widget nudge (chat widget callouts etc.) ---------- */
.widget-nudge{
  position:fixed;bottom:96px;right:20px;z-index:60;
  max-width:230px;
}
@media (max-width:640px){
  .widget-nudge{bottom:88px;right:12px;max-width:180px;}
}

/* =============================================================
   Score Card module
   Used on Local Trust Score / Review Accelerator pages, and any
   future "here's your number" diagnostic-style landing page.
   ============================================================= */
.score-card{
  position:relative;
  background:var(--card-bg);
  border:1px solid rgba(255,255,255,.08);
  border-radius:1.5rem;
  padding:1.75rem 1.5rem 1.5rem;
}
.score-card::before{
  content:"";
  position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(to right,var(--brand-primary),var(--brand-secondary));
  border-radius:1.5rem 1.5rem 0 0;
}
.score-top{
  display:flex;
  align-items:baseline;
  gap:.6rem;
  border-bottom:1px solid rgba(255,255,255,.08);
  padding-bottom:1.1rem;
  margin-bottom:1.1rem;
  flex-wrap:wrap;
}
.score-num{font-size:3.2rem;font-weight:800;line-height:1;}
.score-num.is-bad{color:var(--loss-red);}
.score-num.is-mid{color:var(--warn);}
.score-num.is-good{color:var(--good);}
.score-max{color:#9ca3af;font-size:1.1rem;}

.metric{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  padding:.55rem 0;
  border-bottom:1px solid rgba(255,255,255,.06);
  font-size:.9rem;
  color:#d1d5db;
}
.metric:last-child{border-bottom:none;}

.tag{
  font-size:.7rem;
  font-weight:700;
  padding:.15rem .55rem;
  border-radius:999px;
  white-space:nowrap;
}
.tag.bad{background:rgba(255,77,94,.14);color:var(--loss-red);}
.tag.mid{background:rgba(255,176,32,.14);color:var(--warn);}
.tag.good{background:rgba(34,226,160,.14);color:var(--good);}

.score-note{
  font-size:.78rem;
  color:#9ca3af;
  margin-top:1rem;
  padding-top:.9rem;
  border-top:1px solid rgba(255,255,255,.08);
}