/* ===========================================================
   QUANTAPS • LinkedIn Connections Page — Soft Glass Blue UI
=========================================================== */

.li-wrap{
  max-width:900px;
  margin:0 auto;
  padding:28px 18px 70px;
  font-family:Inter, system-ui, sans-serif;
  color:#0f172a;
}

/* HERO */
.li-hero{
  background:rgba(10,102,194,.12);
  border:1px solid rgba(10,102,194,.30);
  padding:32px 26px;
  border-radius:24px;
  text-align:center;
  backdrop-filter:blur(16px);
  box-shadow:0 12px 42px rgba(0,0,0,0.10);
}

.li-hero-icon{
  font-size:55px;
  margin-bottom:12px;
}

.li-title{
  font-size:30px;
  color:#0a66c2;
  font-weight:900;
}

.li-desc{
  margin-top:12px;
  font-size:16px;
  line-height:1.7;
}


/* BOX */
.li-box{
  background:#ffffff;
  border-radius:20px;
  padding:26px;
  margin-top:28px;
  border:1px solid rgba(10,102,194,0.15);
  box-shadow:0 8px 24px rgba(0,0,0,0.06);
}

.li-box h2{
  font-size:20px;
  font-weight:800;
  color:#0a66c2;
  margin-bottom:14px;
}

.li-list{
  list-style:none;
  padding:0;
  margin:14px 0;
}

.li-list li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
}

.li-list span{
  color:#0a66c2;
  font-weight:700;
}

/* EXAMPLE BOX */
.li-example{
  background:#f0f7ff;
  padding:14px 18px;
  border-radius:12px;
  border:1px solid rgba(10,102,194,.25);
  font-family:monospace;
  font-size:15px;
  margin:12px 0;
  color:#084f9e;
}

/* CTA */
.li-cta{
  margin-top:40px;
  background:linear-gradient(135deg,#0a66c2,#3ea4ff);
  padding:36px 26px;
  text-align:center;
  border-radius:26px;
  color:#fff;
  box-shadow:0 14px 40px rgba(0,0,0,0.14);
}

.li-btn{
  display:inline-block;
  margin-top:18px;
  background:#fff;
  color:#0a66c2;
  padding:14px 32px;
  border-radius:14px;
  font-weight:700;
  text-decoration:none;
  transition:.25s;
}

.li-btn:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 30px rgba(255,255,255,.55);
}