/* Container */
.abb-wrap { display:grid; gap:32px; } /* ↑ spacing between ABB blocks */

/* Add vertical rhythm when abb blocks are adjacent to headings/text */
.abb-wrap + .abb-wrap { margin-top: 24px; }
.abb-wrap h2, .abb-wrap h3, .abb-wrap h4 { margin-top: 8px; }

/* Card */
.abb-card {
  position:relative; display:grid; grid-template-columns:140px 1fr; gap:20px; align-items:center;
  padding:24px; border-radius:16px; background:#fff;
  box-shadow:0 2px 0 rgba(20,20,20,.03), 0 0 0 1px rgba(30,30,30,.06) inset;
  margin-bottom:12px; /* ↑ spacing within table lists */
}
@media (max-width:680px){
  .abb-card{ grid-template-columns:1fr; }
}

.abb-badge {
  position:absolute; left:16px; top:-12px; background:#2f7df6; color:#fff; font-weight:700;
  padding:8px 12px; border-radius:8px; box-shadow:0 6px 0 rgba(47,125,246,.25); font-size:13px; line-height:1;
}

.abb-media{
  width:140px; height:140px; border-radius:12px; overflow:hidden; background:#f4f6f8;
  display:flex; align-items:center; justify-content:center;
}
.abb-media img{ max-width:100%; max-height:100%; display:block; }
.abb-fullclick{ position:absolute; inset:0; }

@media (max-width:680px){
  .abb-media{ width:100%; height:auto; }
  .abb-media img{ width:100%; height:auto; }
}

.abb-title{ font-size:22px; line-height:1.25; margin:0 0 8px; font-weight:800; }
.abb-title a{ text-decoration:none; color:#1f4ea8; }
.abb-title a:hover{ text-decoration:underline; }

.abb-desc{ color:#4a5568; margin:0 0 12px; }
.abb-bestfor{ color:#2d3748; margin:0 0 14px; }

.abb-button{
  display:inline-block; padding:14px 18px; border-radius:14px;
  background:linear-gradient(180deg,#ff6d6d 0%,#ff4b4b 60%,#ff6262 100%);
  color:#fff!important; font-weight:800; text-decoration:none; box-shadow:0 10px 0 rgba(255,75,75,.28);
  transition:transform .06s ease, box-shadow .06s ease, opacity .2s ease;
}
.abb-button:hover{ transform:translateY(1px); box-shadow:0 8px 0 rgba(255,75,75,.28); opacity:.95; }
.abb-button:active{ transform:translateY(2px); box-shadow:0 6px 0 rgba(255,75,75,.28); }

@media (max-width:680px){
  .abb-button{ width:100%; text-align:center; }
}

/* Single detail & spacing between blocks */
.abb-single { margin-bottom:24px; } /* ↑ spacing between singles */
.abb-single-details{ margin-top:14px; padding:18px; border:1px solid #e6e7ea; border-radius:12px; background:#fbfbfc; }
.abb-list{ margin:10px 0 16px 20px; }
.abb-pros-cons{ display:grid; gap:18px; grid-template-columns:1fr 1fr; }
@media (max-width:680px){ .abb-pros-cons{ grid-template-columns:1fr; } }
.abb-specs{ width:100%; border-collapse:collapse; }
.abb-specs th,.abb-specs td{ border:1px solid #e6e7ea; padding:8px 10px; text-align:left; }
.abb-meta{ margin:10px 0 0 20px; }

/* Comparison table (A vs B) */
.abb-compare-wrap { margin:10px 0; }
.abb-compare {
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:0;
  border:1px solid #e6e7ea;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}
.abb-compare-head, .abb-compare-row {
  border-bottom:1px solid #e6e7ea;
  padding:12px 14px;
}
.abb-compare-head { background:#f7f9fb; font-weight:700; }
.abb-compare-label { background:#fafbfc; }

@media (max-width:680px){
  .abb-compare {
    grid-template-columns: 1fr;
  }
  .abb-compare-head { display:none; }
  .abb-compare-label { border-top:1px solid #e6e7ea; }
}