<!-- E5® Product Comparison — Centered, Narrow, With Breathing Room -->
<style>
.e5-matrix-wrap {
  --bg:#0b0f14;
  --panel:#0f151d;
  --panel-2:#101822;
  --text:#e6eef7;
  --muted:#98a6b8;
  --brand:#15d1c1;
  --brand-2:#7a5cff;
  --line:#1e2a37;
  --radius:16px;
  --shadow:0 10px 30px rgba(0,0,0,.35), 0 0 0 1px rgba(21,209,193,.08) inset;
  --glow:0 0 0 1px rgba(21,209,193,.3), 0 10px 30px rgba(21,209,193,.12);

  /* Contained & centered like a pricing table */
  max-width: 780px;          /* narrower overall width */
  margin: 100px auto;        /* generous outer whitespace */
  padding: 56px 72px;        /* inner space inside container */
  background: radial-gradient(1200px 600px at 10% -10%, rgba(122,92,255,.12), transparent 60%),
              radial-gradient(1000px 700px at 90% 0%, rgba(21,209,193,.12), transparent 60%),
              var(--bg);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  color: var(--text);
  overflow: hidden;
  text-align: center;
}

/* Header */
.e5-matrix-head { text-align:center; margin-bottom:28px; }
.e5-matrix-title{
  font-size:clamp(22px,2.5vw,30px);
  font-weight:700;
  letter-spacing:.2px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:var(--text);
}
.e5-matrix-title .dot{
  width:10px; height:10px; border-radius:50%;
  background:linear-gradient(180deg,var(--brand),var(--brand-2));
  box-shadow:0 0 18px var(--brand);
}

/* Table */
.product-comparison-matrix{
  border:1px solid var(--line);
  border-radius: calc(var(--radius) - 4px);
  background: linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.00));
  overflow:hidden;
  text-align:left;
  box-shadow: inset 0 0 20px rgba(0,0,0,.2);
}
.product-comparison-matrix .table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.product-comparison-matrix thead th{
  position:sticky; top:0; z-index:3;
  background:linear-gradient(180deg,rgba(21,209,193,.10),rgba(21,209,193,.04));
  color:var(--text);
  border-bottom:1px solid var(--line);
  padding:14px 22px;
  font-weight:700;
  letter-spacing:.3px;
  backdrop-filter: blur(6px);
}
.product-comparison-matrix tbody tr{
  background:var(--panel);
  transition:background .18s ease, box-shadow .18s ease;
}
.product-comparison-matrix tbody tr:nth-child(2n){ background:var(--panel-2); }
.product-comparison-matrix tbody tr:hover{
  background:rgba(21,209,193,.06);
  box-shadow: var(--glow);
}
.product-comparison-matrix td{
  border-bottom:1px solid var(--line);
  padding:18px 22px;
  vertical-align:top;
  color:var(--text);
}

/* Columns + badges */
.col-product{ min-width:200px; }
.product-cell{ display:flex; align-items:flex-start; gap:12px; }
.prod-name{ font-weight:800; font-size:1.05rem; line-height:1.25; color: var(--text); }
.muted{ color:var(--muted); }

.badge{
  font-size:.72rem;
  padding:6px 10px;
  border-radius:999px;
  font-weight:700;
  line-height:1;
  letter-spacing:.2px;
  white-space:nowrap;
  box-shadow:none;
  border:2px solid transparent;
}
.badge--integral{ background:transparent; border-color:#2ea8ff; color:#2ea8ff; }
.badge--topical { background:#10b981; border-color:#10b981; color:#03140f; }

/* Pills */
.pill{
  display:inline-block;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:4px 10px;
  margin:4px 6px 0 0;
  font-size:.9rem;
  color:var(--text);
  background:rgba(255,255,255,.03);
}

/* Bold text = black for readability */
.key b, .key strong, .product-comparison-matrix strong {
  color:#000 !important;
  font-weight:700;
}

/* Unify font size for these columns */
.product-comparison-matrix .col-application,
.product-comparison-matrix .col-primary-function {
  font-size: 1rem;
  line-height: 1.5;
}
.product-comparison-matrix .col-application .pill,
.product-comparison-matrix .col-primary-function .pill {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Mobile */
@media (max-width: 900px){
  .e5-matrix-wrap{ max-width: 90%; padding: 28px; }
  .product-comparison-matrix thead{ display:none; }
  .product-comparison-matrix .table,
  .product-comparison-matrix tbody,
  .product-comparison-matrix tr,
  .product-comparison-matrix td{ display:block;width:100%; }
  .product-comparison-matrix tbody tr{
    border:1px solid var(--line);
    border-radius:14px;
    margin:14px 12px;
    padding:8px;
  }
  .product-comparison-matrix td{
    border:none;
    border-bottom:1px dashed var(--line);
    padding:12px 14px;
    position:relative;
  }
  .product-comparison-matrix td:last-child{ border-bottom:none; }
  .product-comparison-matrix td::before{
    content:attr(data-label);
    display:block;
    color:var(--muted);
    font-size:.76rem;
    margin-bottom:6px;
    text-transform:uppercase;
    letter-spacing:.08em;
  }
  .col-product{ min-width:auto; }
}

/* Bottom fade */
.e5-matrix-fade{
  height:12px;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.25));
  border-radius:0 0 var(--radius) var(--radius);
}
</style>