/* =====================================================================
   NexEuro · COMPARISON SECTION  ("Pourquoi NexEuro ?")
   ---------------------------------------------------------------------
   A sales-oriented comparison vs Visa/Mastercard, PayPal and the classic
   bank transfer. Desktop = highlighted comparison table with NexEuro
   column promoted; mobile = stacked cards. Non-destructive layer.
   ===================================================================== */
.nx-cmp {
  --c-navy:#0B2545; --c-blue:#1769C4; --c-blue2:#4A9EFF; --c-green:#00B87A;
  --c-ink:#0B1F35; --c-mut:#4A5C72; --c-line:#E6ECF5; --c-soft:#F5F7FB;
  max-width: 1180px; margin: 0 auto; padding: clamp(56px,8vw,110px) 5%;
}
.nx-cmp-head { text-align:center; max-width: 720px; margin: 0 auto clamp(34px,5vw,56px); }
.nx-cmp-head .htag { color: var(--c-blue); }
.nx-cmp-head h2 {
  font-family:'Bricolage Grotesque',sans-serif; font-weight:900;
  font-size: clamp(30px,4.6vw,54px); letter-spacing:-1.8px; line-height:1.04;
  color: var(--c-ink); margin: 12px 0 14px;
}
.nx-cmp-head p { color: var(--c-mut); font-size: clamp(16px,1.8vw,19px); line-height:1.65; }

/* ---- Table (desktop) ---------------------------------------------- */
.nx-cmp-table { width:100%; border-collapse:separate; border-spacing:0; }
.nx-cmp-table th, .nx-cmp-table td { padding: 16px 14px; text-align:center; }
.nx-cmp-table thead th {
  font-family:'Bricolage Grotesque',sans-serif; font-weight:800;
  font-size:15px; color: var(--c-mut); vertical-align:bottom;
}
.nx-cmp-table tbody th {
  text-align:left; font-weight:700; color: var(--c-ink); font-size:15px;
  white-space:nowrap;
}
.nx-cmp-table tbody tr:not(:last-child) td,
.nx-cmp-table tbody tr:not(:last-child) th { border-bottom:1px solid var(--c-line); }
.nx-cmp-feat { display:flex; flex-direction:column; gap:2px; }
.nx-cmp-feat small { font-weight:600; color: var(--c-mut); font-size:12.5px; }

/* the promoted NexEuro column */
.nx-cmp-col-us { position:relative; }
.nx-cmp-table thead .nx-cmp-col-us {
  color:#fff;
}
.nx-cmp-us-badge {
  display:inline-flex; align-items:center; gap:6px;
  background: var(--c-green); color:#fff; font-size:11px; font-weight:800;
  padding:5px 12px; border-radius:999px; margin-bottom:10px; letter-spacing:.3px;
}
.nx-cmp-us-logo {
  font-family:'Bricolage Grotesque',sans-serif; font-weight:900; font-size:20px;
}
/* Highlight the NexEuro column by giving its cells a navy background.
   Round the top of the header cell and the bottom of the last body cell. */
.nx-cmp-col-us {
  background: linear-gradient(180deg,#10498f 0%, #0B2545 100%);
  color:#eaf2ff !important;
}
.nx-cmp-table thead .nx-cmp-col-us {
  border-radius: 18px 18px 0 0;
  padding-top: 22px;
  box-shadow: 0 -30px 60px -30px rgba(11,37,69,.5);
}
.nx-cmp-table tbody tr:last-child .nx-cmp-col-us { border-radius: 0 0 18px 18px; }
.nx-cmp-table tbody tr .nx-cmp-col-us { border-bottom-color: rgba(255,255,255,.12) !important; }

/* cell marks */
.nx-yes, .nx-no, .nx-mid { display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%; }
.nx-yes { background: rgba(0,184,122,.15); color:#00B87A; }
.nx-cmp-col-us .nx-yes { background: rgba(255,255,255,.16); color:#5DE8B5; }
.nx-no  { background: rgba(229,6,19,.10); color:#E0556B; }
.nx-mid { background: rgba(168,116,25,.14); color:#C9A24B; }
.nx-cell-txt { font-weight:800; font-size:14px; color: var(--c-ink); }
.nx-cmp-col-us .nx-cell-txt { color:#fff; }
.nx-cell-sub { display:block; font-weight:600; font-size:11.5px; color:var(--c-mut); margin-top:2px; }
.nx-cmp-col-us .nx-cell-sub { color: rgba(234,242,255,.7); }

.nx-cmp-cta { text-align:center; margin-top: clamp(30px,4vw,46px); }
.nx-cmp-cta .bp { display:inline-flex; }
.nx-cmp-foot { text-align:center; color:var(--c-mut); font-size:12.5px; margin-top:16px; }

/* ---- Mobile: stacked cards ---------------------------------------- */
.nx-cmp-cards { display:none; }

@media (prefers-color-scheme: dark) {
  .nx-cmp-head h2 { color:#e6edf3; }
  .nx-cmp-head p, .nx-cmp-table thead th, .nx-cmp-feat small, .nx-cell-sub { color:#9aa4b2; }
  .nx-cmp-table tbody th, .nx-cell-txt { color:#e6edf3; }
  .nx-cmp-table tbody tr:not(:last-child) td,
  .nx-cmp-table tbody tr:not(:last-child) th { border-color:#21262d; }
}

@media (max-width: 860px) {
  .nx-cmp-table-wrap { display:none; }
  .nx-cmp-cards { display:grid; gap:16px; }
  .nx-cmp-card {
    border:1px solid var(--c-line); border-radius:18px; padding:20px; background:#fff;
  }
  .nx-cmp-card.us {
    background: linear-gradient(180deg,#10498f,#0B2545); border:none; color:#fff;
    box-shadow: 0 26px 60px -30px rgba(11,37,69,.6);
  }
  .nx-cmp-card-h { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
  .nx-cmp-card-name { font-family:'Bricolage Grotesque',sans-serif; font-weight:900; font-size:20px; color:var(--c-ink); }
  .nx-cmp-card.us .nx-cmp-card-name { color:#fff; }
  .nx-cmp-card-tag { font-size:11px; font-weight:800; padding:4px 10px; border-radius:999px; background:var(--c-soft); color:var(--c-mut); }
  .nx-cmp-card.us .nx-cmp-card-tag { background: var(--c-green); color:#fff; }
  .nx-cmp-row { display:flex; align-items:flex-start; gap:10px; padding:9px 0; border-bottom:1px solid var(--c-line); font-size:14px; }
  .nx-cmp-card.us .nx-cmp-row { border-color: rgba(255,255,255,.12); }
  .nx-cmp-row:last-child { border-bottom:none; }
  .nx-cmp-row-l { color:var(--c-mut); flex:1; }
  .nx-cmp-card.us .nx-cmp-row-l { color: rgba(234,242,255,.72); }
  .nx-cmp-row-v { font-weight:800; color:var(--c-ink); text-align:right; }
  .nx-cmp-card.us .nx-cmp-row-v { color:#fff; }
  @media (prefers-color-scheme: dark) {
    .nx-cmp-card { background:#0d1117; border-color:#21262d; }
    .nx-cmp-card-name, .nx-cmp-row-v { color:#e6edf3; }
  }
}