/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Dec 23 2025 | 13:05:10 */
.compare-cards{
  width:100%;
  padding:18px 0 10px;
}

.compare-grid{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.compare-card{
  position:relative;
  width:100%;
  border-radius:16px;
  overflow:hidden;
  background:
    radial-gradient(120% 140% at 18% 30%, rgba(24,226,255,.10) 0%, rgba(24,226,255,.04) 26%, rgba(0,0,0,0) 58%),
    linear-gradient(180deg, rgba(9,12,14,.78), rgba(6,9,10,.90));
  border:1px solid rgba(255,255,255,.10);
  box-shadow: 0 16px 48px rgba(0,0,0,.45);
  padding:16px 16px 14px;
}

.compare-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,0));
  opacity:.12;
}

.compare-card.is-featured{
  background:
    radial-gradient(140% 160% at 12% 40%, rgba(30,215,96,.22) 0%, rgba(30,215,96,.10) 30%, rgba(0,0,0,0) 62%),
    radial-gradient(120% 140% at 78% 22%, rgba(24,226,255,.10) 0%, rgba(24,226,255,.04) 28%, rgba(0,0,0,0) 58%),
    linear-gradient(180deg, rgba(6,10,8,.70), rgba(4,8,6,.90));
  border-color: rgba(30,215,96,.22);
}

.compare-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.compare-platform{
  min-width:0;
}

.compare-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:22px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(30,215,96,.16);
  border:1px solid rgba(30,215,96,.28);
  color:rgba(210,255,232,.95);
  font-weight:900;
  letter-spacing:.12em;
  font-size:11px;
  text-transform:uppercase;
  margin-bottom:8px;
}

.compare-name{
  margin:0;
  font-weight:950;
  letter-spacing:.02em;
  font-size:18px;
  color:#f4f7ff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.compare-rating{
  text-align:right;
  display:flex;
  flex-direction:column;
  gap:4px;
  flex-shrink:0;
}

.compare-rating-label{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(234,240,255,.62);
  font-weight:800;
}

.compare-rating-value{
  font-weight:950;
  font-size:18px;
  letter-spacing:.02em;
  color:#ffffff;
}

.compare-list{
  margin:12px 0 0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.compare-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.compare-row dt{
  margin:0;
  font-size:13px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(234,240,255,.70);
}

.compare-row dd{
  margin:0;
  min-width:0;
  display:flex;
  justify-content:flex-end;
}

.compare-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  color:rgba(255,255,255,.88);
  font-weight:900;
  letter-spacing:.03em;
  font-size:13px;
  white-space:nowrap;
}

.compare-pill.is-good{
  background:rgba(30,215,96,.14);
  border-color:rgba(30,215,96,.22);
  color:rgba(210,255,232,.96);
}

.compare-pill.is-mid{
  background:rgba(24,226,255,.10);
  border-color:rgba(24,226,255,.18);
  color:rgba(220,250,255,.95);
}

.compare-pill.is-low{
  background:rgba(255,120,120,.10);
  border-color:rgba(255,120,120,.18);
  color:rgba(255,225,225,.95);
}

@media (max-width:520px){
  .compare-card{padding:14px 14px 12px}
  .compare-name{font-size:17px}
  .compare-rating-value{font-size:17px}
  .compare-row{align-items:flex-start}
  .compare-row dt{font-size:12px}
  .compare-pill{font-size:12.5px;padding:7px 10px}
}