/* ESP Companion console — upgrade layer (additive, removable) */

.container.maincol{max-width:1180px}
.card{border-radius:16px;box-shadow:0 1px 3px rgba(16,24,40,.06),0 1px 2px rgba(16,24,40,.04);
  transition:box-shadow .25s ease,transform .25s ease}
.card:hover{box-shadow:0 10px 30px rgba(16,24,40,.10);transform:translateY(-2px)}

/* hero depth */
.esp-hero{position:relative}
.esp-hero-main{background:linear-gradient(135deg,#ffffff,#f7f9fc);border:1px solid #e6ebf2;
  border-radius:18px;box-shadow:0 6px 24px rgba(20,40,90,.08);padding:30px 34px}
.esp-hero-eyebrow{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:.7rem;
  letter-spacing:1.5px;color:#ff8c00;background:rgba(255,140,0,.10);border:1px solid rgba(255,140,0,.3);
  padding:4px 12px;border-radius:999px;margin-bottom:14px}
.esp-hero h1{font-size:clamp(26px,3.4vw,40px);font-weight:800;letter-spacing:-1px;line-height:1.12;color:#0f172a}
.esp-hero h1 em,.esp-hero h1 .accent{font-style:normal;background:linear-gradient(90deg,#00adff,#ff8c00);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.esp-hero-sub{margin-top:14px;color:#5a6478;font-size:1.02rem;line-height:1.6;max-width:640px}
.esp-hero-ctas{margin-top:20px;display:flex;gap:12px;flex-wrap:wrap}
.esp-hero-ctas .btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;
  padding:12px 22px;border-radius:11px;text-decoration:none;transition:transform .2s,box-shadow .2s}
.esp-hero-ctas .btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,0,0,.14)}
.esp-hero-ctas .btn.primary{background:linear-gradient(135deg,#ff8c00,#ff6a00);color:#fff}
.esp-hero-ctas .btn.outline{background:#fff;color:#0f172a;border:1px solid #d4dbe6}

/* live stat box */
.esp-hero-ai{margin-top:18px;background:#0f172a;border-radius:14px;padding:14px 18px;
  border:1px solid rgba(0,173,255,.25);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.esp-hero-ai-head{font-size:.7rem;letter-spacing:1.5px;text-transform:uppercase;color:#34d399;
  display:flex;align-items:center;gap:8px;font-weight:700}
.esp-hero-ai-head .live{width:8px;height:8px;border-radius:50%;background:#34d399;
  box-shadow:0 0 0 3px rgba(52,211,153,.22);animation:eu-pulse 2s infinite}
.esp-hero-ai-msg{color:#cbd5e1;font-size:.92rem;margin-top:6px;font-family:'JetBrains Mono',monospace}
.esp-hero-ai-msg b{color:#00adff}
.esp-hero-ai-cursor{display:inline-block;width:7px;height:14px;background:#00adff;margin-left:4px;
  vertical-align:-2px;animation:eu-blink 1s steps(2) infinite}
@keyframes eu-pulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes eu-blink{50%{opacity:0}}

/* sidebar + tabs lift */
.sidebar .nav a,.sidebar .bottom a{border-radius:10px;transition:background .2s,transform .15s}
.sidebar .nav a:hover{transform:translateX(2px)}
.hero-card{border-radius:14px;transition:transform .2s,box-shadow .2s}
.hero-card:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(16,24,40,.12)}

@media (prefers-reduced-motion:no-preference){
  .card{animation:eu-in .4s ease both}
  .esp-hero-main{animation:eu-in .5s ease both}
}
@keyframes eu-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* keep it clean in dark mode */
body.dark .esp-hero-main{background:linear-gradient(135deg,#171c2b,#11151f);border-color:#262d3d;
  box-shadow:0 6px 24px rgba(0,0,0,.4)}
body.dark .esp-hero-sub{color:#9aa6bd}
body.dark .esp-hero-ctas .btn.outline{background:#1b2231;color:#e6ebf2;border-color:#2c3445}
