@charset "UTF-8";


/* ---------- head ---------- */
.mk-cmp .mk-airy-hero-in{padding-bottom:40px} /* top padding as on the business home */
.mk-cmp .mk-airy-h1{max-width:17em}
.mk-cmp-note{display:inline-flex;align-items:flex-start;gap:8px;margin-top:18px;max-width:62ch;font-size:13.5px;line-height:1.5;color:var(--muted);text-align:left}
.mk-cmp-note svg{flex:none;width:16px;height:16px;margin-top:2px;color:var(--teal-ink)}
/* « Tout compris, sans modules payants », right under the price answer. */
.mk-cmp-incl{display:flex;align-items:flex-start;justify-content:center;gap:8px;max-width:64ch;margin:14px auto 0;font-size:15px;font-weight:600;line-height:1.5;color:var(--text);text-align:left}
.mk-cmp-incl svg{flex:none;width:18px;height:18px;margin-top:2px;color:var(--teal-ink)}

/* The example team at a glance: same numbers as the highlighted row of the cost table. */
.mk-cmp .mk-cmp-glance{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0 28px;align-items:center;justify-self:auto;
  width:min(100%,640px);margin:36px auto 0;padding:24px 28px;text-align:left;background:var(--surface);border:1px solid var(--line); /* width-ok: the callout card under the centred head */
  border-radius:var(--r-card);box-shadow:var(--mk-airy-shadow)}
.mk-cmp-glance .mk-glance-row::after{background:var(--line-strong)}
.mk-cmp-glance .mk-glance-us::after{background:var(--teal)}
.mk-cmp-glance .mk-glance-row dd{font-size:20px}
.mk-cmp-glance .mk-glance-saved{margin:0;padding:4px 0 4px 28px;border-top:0;border-left:1px solid var(--line2)}

/* ---------- promise (GOrendezvous) ---------- */
.mk-cmp-promise{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.mk-cmp-promise .mk-h2{font-size:clamp(28px,2.8vw,34px)}
.mk-cmp-promise .mk-lead{margin-top:16px}
.mk-cmp-promise p + p{margin-top:12px;color:var(--soft);font-size:15.5px;line-height:1.6}
.mk-cmp-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.mk-cmp-trio span{display:block;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r-card);border:1px solid var(--line);box-shadow:var(--mk-airy-shadow)}
.mk-cmp-trio span:nth-child(2){transform:translateY(18px)}
.mk-cmp-trio img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.25);mix-blend-mode:multiply}

/* ---------- tables ---------- */
.mk-cmp .mk-table-wrap{margin-top:0;box-shadow:var(--mk-airy-shadow)}
.mk-cmp .mk-table thead th{background:var(--tint-hero)}
/* Cost table: the team-size column stays in place while the prices scroll sideways on a phone. */
.mk-cmp .mk-table:not(.mk-table-stack) :is(thead th:first-child,tbody th){position:sticky;left:0;z-index:1;background:var(--surface);box-shadow:1px 0 0 var(--line2)}
.mk-cmp .mk-table:not(.mk-table-stack) thead th:first-child{background:var(--tint-hero)}
.mk-cmp .mk-table:not(.mk-table-stack) tbody .mk-table-hl th:first-child{background:var(--teal-dim);box-shadow:inset 3px 0 0 var(--teal),1px 0 0 var(--line2)}
.mk-cmp .mk-source{margin:16px auto 0;max-width:80ch;text-align:center;font-size:13px;line-height:1.55;color:var(--muted)}
.mk-cmp .mk-swipe{text-align:center}

/* ---------- their published plans (sky band) ---------- */
.mk-cmp .mk-facts{margin-top:0}
.mk-cmp .mk-fact{padding:26px 28px;border-radius:var(--r-card);box-shadow:var(--mk-airy-shadow)}
.mk-cmp .mk-fact h3{font-size:19px;line-height:1.25;margin-bottom:10px}
.mk-cmp .mk-fact ul{margin:0;padding:0;list-style:none}
.mk-cmp .mk-fact li{font-size:15px;line-height:1.55;padding:10px 0}

/* ---------- why ---------- */
.mk-cmp .mk-why{margin-top:0;gap:20px}
.mk-cmp .mk-why-item{padding:24px;border:1px solid var(--line);box-shadow:var(--mk-airy-shadow)}
.mk-cmp .mk-why-item h3{font-size:18px;line-height:1.3;margin:4px 0 6px}
.mk-cmp .mk-why-item p{font-size:15.5px;line-height:1.6}

/* ---------- section rhythm ---------- */
.mk-cmp-sec + .mk-cmp-sec{padding-top:0}
.mk-cmp .mk-airy-pair{margin-top:0}
.mk-cmp .mk-airy-switch .mk-airy-steps{margin-top:26px}
/* The peach switch band flows straight into the mint final band. */
.mk-cmp-wave-peach{background:var(--tint-peach)}
.mk-cmp .mk-airy-final .mk-ctas{margin-top:28px}

/* ---------- responsive ---------- */
@media (max-width:860px){
  .mk-cmp .mk-airy-hero-in{padding-bottom:28px}
  .mk-cmp-promise{grid-template-columns:1fr;gap:32px}
  .mk-cmp-promise .mk-h2{font-size:28px}
}
@media (max-width:640px){
  .mk-cmp .mk-cmp-glance{grid-template-columns:1fr;margin-top:28px;padding:20px}
  .mk-cmp-glance .mk-glance-saved{margin-top:18px;padding:16px 0 0;border-left:0;border-top:1px solid var(--line2)}
  .mk-cmp-note{font-size:13px}
  .mk-cmp-trio{gap:10px}
  .mk-cmp-trio span:nth-child(2){transform:none}
  .mk-cmp .mk-source{text-align:left}
  .mk-cmp .mk-table th,.mk-cmp .mk-table td{padding:13px 14px}
  .mk-cmp .mk-table-stack tr{padding:14px 16px}
  .mk-cmp .mk-table-stack th,.mk-cmp .mk-table-stack td{padding:4px 0}
  .mk-cmp .mk-table-wrap:has(.mk-table-stack){background:var(--surface)} /* stacked rows never scroll: no swipe shade on the right */
  .mk-cmp .mk-airy-final .mk-ctas{align-self:stretch;flex-direction:column}
  .mk-cmp .mk-airy-final .mk-ctas .ui-btn{width:100%}
}
/* « À lire aussi » under the questions: the other comparison and the price article. */
.mk-cmp-more{margin-top:40px}
.mk-cmp-more-title{margin:0 0 12px;font-family:var(--display);font-weight:var(--fw-display-sub);font-size:19px;color:var(--text)}
.mk-cmp-more ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.mk-cmp-more li{display:flex;align-items:center;min-height:44px}
.mk-cmp-core{list-style:none;margin:0;padding:0;display:grid;gap:8px;grid-template-columns:minmax(0,1fr)}
@media(min-width:860px){.mk-cmp-core{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mk-cmp-core li{display:flex;gap:9px;align-items:flex-start;font-size:15px;line-height:1.5;color:var(--soft)}
.mk-cmp-core svg{flex:none;margin-top:4px;color:var(--teal-ink)}

/* The businesses' questions page (marketing/questions): the group links under the title, the group headings. */
.mk-qs-toc{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:22px}
.mk-qs-toc a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:var(--r-btn);background:#fff;border:1px solid var(--line);color:var(--teal-ink);font-weight:600;font-size:14.5px;text-decoration:none}
.mk-qs-toc a:hover{border-color:var(--teal)}
.mk-qs-group{scroll-margin-top:96px}
.mk-qs-group + .mk-qs-group{margin-top:48px}
.mk-qs-title{max-width:var(--mk-text);margin:0 auto 14px;text-align:left}