/*  Comparison Table */
:root{
  --brand:var(--e-global-color-text);        /* headings */
  --border:#e5e7eb;
  --bg:#ffffff;
  --stripe:var(--e-global-color-cf379c6);
  --accent:var(--e-global-color-52aa4fb);       /* ticks / highlights */
  --popular:#fde68a;      /* ribbon colour */
}

.vc-icon-list ul {
  list-style: none;
  margin: 0 !important;
  padding-left: 0 !important;
}  

.vc-icon-list .elementor-icon-list-item {
  align-items: flex-start !important;
  display: flex !important;
  font-size: inherit !important;
}

.vc-icon-list .elementor-icon-list-icon {
  padding-inline-end: 4px;
}

.vc-icon-list .elementor-icon-list-icon svg {
  height: 16px !important;
  width: 16px !important;
}

.compare-wrap { 
  margin:0 auto;
}

.compare-title {
  font-weight:700;
  font-size:1.5rem;
  margin:0 0 .75rem;
  color:var(--brand);
}

table, td, th {
  border: 1px solid var(--border);
}

.compare-table {
  width:100%;
  border-collapse:collapse;
}

.compare-table caption {
  position:absolute;
  left:-9999px;
}

.compare-table th,
.compare-table td {
  border:1px solid var(--border);
  padding:.9rem .8rem;
  text-align:center;
  vertical-align:middle;
  background:var(--bg);
}

.compare-table thead th {
  background:#eef2ff;
  color:#1f2937;
  font-weight:700;
  font-size:16px;
}

.compare-table tbody {
  font-size:14px;
}

.compare-table tbody span {
  font-weight:400;
  font-size:13px;
}

.compare-table tbody th[scope="row"] {
  text-align:left;
  background:#fff;
  font-weight:600;
}

.compare-table tbody tr:nth-child(even) th[scope="row"] {
  background:#f2f5f9;
}

.compare-table .tick {
  font-weight: 700;
  font-size: 20px;
  color: var(--e-global-color-52aa4fb);
}

.compare-table .muted {
  opacity:.6;
}

/* pricing table */
.vc-price {
  font-size: 48px;
}

.vc-period {
  color: var(--e-global-color-c435c6d);
}

.most-popular {
  position: relative;
}

.most-popular .badge {
  position: absolute;
  top: -25px;
  left: -21px;
  right: -21px;
  background: #E52615; 
  color: #fff;
  font-weight: 400;
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  text-align: center;
  padding: 0.2rem 0.6rem;
  border-radius: 8px 8px 0 0;
  z-index: 10;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}


/* cookie policy table */
.cookie-table {
  width:100%;
  border-collapse:collapse;
}

.cookie-table th,
.cookie-table td {
  border:1px solid var(--border);
  padding:.9rem .8rem;
}

.cookie-table tbody {
  font-size:14px;
}

/* Sticky first column only from 821px up (tablet & desktop) */
@media (min-width: 821px){
  .vc-price {
    font-size: 48px;
  }

  .compare-wrap{ 
    overflow-x:auto; 
  }   
 
  .compare-table{ 
    border-collapse:separate; 
    border-spacing:0; 
  }

  /* First column header + feature labels */
  .compare-table thead th:first-child,
  .compare-table tbody th[scope="row"]{
    position: sticky;
    left: 0;
    z-index: 2;                              
    background: #f8fafc;                  
    box-shadow: 2px 0 6px rgba(0,0,0,.06); 
    background-clip: padding-box;
  }

  .compare-table thead th:first-child{
    z-index: 3;
    background: #eef2ff;
  }
}


  /* Mobile: stack rows as cards */
  @media (max-width: 820px){
    .vc-price {
      font-size: 48px;
    }

    .compare-table thead{
      display:none;
    }

    table, td, th {
      border: none;
    }

    .compare-table, 
    .compare-table tbody, 
    .compare-table tr, 
    .compare-table td, 
    .compare-table th[scope="row"]{
      display:block;
      width:100%;
    }

    .compare-table tr {
      margin:0 0 1rem;
      border:1px solid var(--border);
      border-radius:10px;
      overflow:hidden;
    }

    .compare-table th[scope="row"]{
      background:#eef2ff !important;
    }

    /* Make each cell a 2‑column grid: [label | value] */
    .compare-table td {
      display: grid;
      grid-template-columns: 12.5rem 1fr; 
      align-items: start;
      gap: .5rem;
      padding: .8rem;        
      text-align: left;
      word-break: break-word;  
    }

    .compare-table td::before {
      position: static; 
      transform: none;
      content: attr(data-label);
      font-weight: 600;
      line-height: 1.2;
      white-space: normal; 
    }

    .compare-table tr { 
      border-radius:10px; 
      overflow:hidden; 
    }

    .compare-table td { 
      min-height: 44px; 
    }

    .compare-table thead th.popular::after{
      display:none;
    }
  }