/* ============================================================
   am-modeles-remplacement.css — outil « Modèles de remplacement »
   Intégré DANS le corps de page, sous le hero am-hero2 (conteneur 1320).
   Charte site : anthracite #1a1a1a / blanc, hairline #ececec, radius 14/18/22.
   Namespace strict .am-mr* -> aucune fuite sur le reste de la page.
   Badges de statut : vert (successeur direct) / ambre (avertissement) = accents
   PORTEURS DE SENS uniquement (repris de la maquette validée). CTA = monochrome.
   ============================================================ */

.am-mr{--mr-ink:#1a1a1a;--mr-ink2:#0e0f11;--mr-text:#16181c;--mr-muted:#5f646b;
  --mr-line:#ececec;--mr-alt:#f6f6f7;--mr-green:#2f855a;--mr-green-bg:#e9f5ee;
  --mr-amber:#b7791f;--mr-amber-bg:#fbf3e2;--mr-r:14px;
  font-family:'Inter',system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color:var(--mr-text);max-width:1320px;margin:0 auto}
.am-mr *{box-sizing:border-box}
.am-mr svg{display:block}

/* ---- carte outil ---- */
.am-mr-card{background:#fff;border:1px solid var(--mr-line);border-radius:22px;overflow:hidden;
  box-shadow:0 24px 60px -40px rgba(0,0,0,.28)}
.am-mr-top{background:var(--mr-ink2);color:#fff;padding:28px 34px;display:flex;align-items:center;gap:16px}
.am-mr-badge{width:46px;height:46px;border-radius:13px;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.am-mr-badge svg{width:24px;height:24px;stroke:#fff}
.am-mr-top h3{margin:0;font-size:20px;font-weight:700;letter-spacing:-.3px;color:#fff}
.am-mr-top p{margin:3px 0 0;font-size:13.5px;color:#b8bcc2;letter-spacing:.2px}

.am-mr-body{padding:30px 34px 34px}

/* ---- formulaire ---- */
.am-mr-form{display:grid;grid-template-columns:1.5fr 1fr 1fr auto;gap:14px;align-items:end}
.am-mr-field label{display:block;font-weight:600;font-size:12.5px;letter-spacing:.4px;
  text-transform:uppercase;color:var(--mr-muted);margin:0 0 8px}
.am-mr-optional label::after{content:" (optionnel)";font-weight:500;text-transform:none;letter-spacing:0;color:#a9adb3}
.am-mr-field input,.am-mr-field select{width:100%;height:52px;border:1.5px solid var(--mr-line);
  border-radius:13px;padding:0 16px;font-family:inherit;font-size:15.5px;color:var(--mr-text);background:#fff;
  transition:border-color .2s,box-shadow .2s}
.am-mr-field input:focus,.am-mr-field select:focus{outline:none;border-color:var(--mr-ink);
  box-shadow:0 0 0 4px rgba(14,15,17,.06)}
.am-mr-field input::placeholder{color:#a9adb3}
.am-mr-field select{appearance:none;padding-right:42px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235f646b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center}
.am-mr-field select option:disabled{color:#b0b4ba}
.am-mr-find{height:52px;padding:0 26px;background:var(--mr-ink);color:#fff;border:none;border-radius:13px;
  font-family:inherit;font-weight:600;font-size:15px;cursor:pointer;white-space:nowrap;
  display:inline-flex;align-items:center;gap:10px;transition:background .2s,transform .2s}
.am-mr-find:hover{background:#000;transform:translateY(-1px)}
.am-mr-arw{transition:transform .2s}
.am-mr-find:hover .am-mr-arw{transform:translateX(3px)}

/* ---- chips exemples ---- */
.am-mr-hint{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:16px;font-size:13px;color:var(--mr-muted)}
.am-mr-hint-lbl{font-weight:600}
.am-mr-chip{border:1px solid var(--mr-line);background:var(--mr-alt);border-radius:8px;padding:6px 12px;
  font-family:inherit;font-size:12.5px;font-weight:600;color:#2a2d31;cursor:pointer;transition:border-color .2s,background .2s}
.am-mr-chip:hover{border-color:#c9ccd1;background:#fff}
.am-mr-chip--ghost{background:#fff}

/* ---- bandeau avertissement ---- */
.am-mr-disclaimer{display:flex;align-items:flex-start;gap:11px;margin-top:22px;padding:14px 18px;
  background:var(--mr-amber-bg);border:1px solid #f0e2c4;border-radius:12px;font-size:13.5px;color:#6b5417;line-height:1.5}
.am-mr-disclaimer svg{width:18px;height:18px;flex:0 0 auto;stroke:var(--mr-amber);margin-top:1px}
.am-mr-disclaimer b{color:#5a460f}

/* ---- résultats ---- */
.am-mr-results{margin-top:0}
.am-mr-results:not(:empty){margin-top:30px;padding-top:30px;border-top:1px dashed var(--mr-line)}
.am-mr-rhead{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.am-mr-rhead .q{font-size:14px;color:var(--mr-muted)}
.am-mr-rhead .q b{color:var(--mr-ink);font-weight:700}
.am-mr-rhead .count{font-size:13px;font-weight:600;color:var(--mr-muted);letter-spacing:.3px}

.am-mr-old{display:flex;align-items:center;gap:16px;padding:16px 20px;background:var(--mr-alt);
  border:1px solid var(--mr-line);border-radius:14px;margin-bottom:22px}
.am-mr-old .tag{font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--mr-muted)}
.am-mr-old .ref{font-size:18px;font-weight:700;letter-spacing:-.2px;margin-top:2px}
.am-mr-old .meta{font-size:13.5px;color:var(--mr-muted);margin-top:2px}

/* ---- carte candidat ---- */
.am-mr-cand{border:1px solid var(--mr-line);border-radius:16px;overflow:hidden;margin-bottom:16px;
  transition:box-shadow .3s,transform .3s}
.am-mr-cand:hover{box-shadow:0 14px 40px -24px rgba(0,0,0,.28);transform:translateY(-2px)}
.am-mr-chead{display:flex;align-items:center;gap:16px;padding:20px 22px 18px}
.am-mr-thumb{width:58px;height:58px;border-radius:13px;background:var(--mr-alt);border:1px solid var(--mr-line);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.am-mr-thumb svg{width:28px;height:28px;stroke:var(--mr-ink)}
.am-mr-ctitle{flex:1 1 auto;min-width:0}
.am-mr-ctitle .brand{font-size:11.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--mr-muted)}
.am-mr-ctitle .name{font-size:20px;font-weight:800;letter-spacing:-.4px;margin-top:2px;color:var(--mr-ink)}
.am-mr-mbadge{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:10px;
  font-size:12.5px;font-weight:700;letter-spacing:.2px}
.am-mr-mbadge svg{width:15px;height:15px;stroke-width:2}
.am-mr-mbadge.direct{background:var(--mr-green-bg);color:var(--mr-green)}
.am-mr-mbadge.direct svg{stroke:var(--mr-green)}
.am-mr-mbadge.variant{background:var(--mr-alt);color:#3a3d42}
.am-mr-mbadge.variant svg{stroke:#3a3d42}

.am-mr-specs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--mr-line);background:#fdfdfd}
.am-mr-spec{padding:16px 22px;border-right:1px solid var(--mr-line)}
.am-mr-spec:last-child{border-right:none}
.am-mr-spec .k{font-size:11px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--mr-muted);
  margin-bottom:5px;display:flex;align-items:center;gap:6px}
.am-mr-spec .k svg{width:13px;height:13px;stroke:var(--mr-muted)}
.am-mr-spec .v{font-size:15px;font-weight:700;letter-spacing:-.2px;color:var(--mr-ink)}
.am-mr-spec .v small{font-weight:500;color:var(--mr-muted);font-size:12.5px}

.am-mr-why{padding:16px 22px;border-top:1px solid var(--mr-line);background:var(--mr-alt);
  display:flex;align-items:flex-start;gap:11px;font-size:14px;color:#3a3d42;line-height:1.55}
.am-mr-why svg{width:17px;height:17px;flex:0 0 auto;stroke:var(--mr-ink);margin-top:1px}
.am-mr-why b{color:var(--mr-ink)}

.am-mr-cfoot{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 22px;
  border-top:1px solid var(--mr-line);flex-wrap:wrap}
.am-mr-confirm{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--mr-amber);letter-spacing:.2px}
.am-mr-confirm svg{width:15px;height:15px;stroke:var(--mr-amber)}
.am-mr-actions{display:flex;gap:10px;flex-wrap:wrap}
.am-mr-btn{display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-size:13.5px;font-weight:600;
  padding:11px 18px;border-radius:11px;cursor:pointer;text-decoration:none!important;border:1.5px solid transparent;
  transition:background .2s,border-color .2s,transform .2s}
.am-mr-btn .am-mr-arw{font-size:14px}
/* !important : neutralise la couleur de lien du thème/am-refonte sur les <a> */
.am-mr a.am-mr-btn--primary{background:var(--mr-ink)!important;color:#fff!important}
.am-mr a.am-mr-btn--primary:hover{background:#000!important;transform:translateY(-1px)}
.am-mr a.am-mr-btn--ghost{background:#fff!important;border-color:var(--mr-line);color:var(--mr-ink)!important}
.am-mr a.am-mr-btn--ghost:hover{border-color:#c9ccd1}

/* ---- état sans successeur / pas de correspondance ---- */
.am-mr-note{border:1px solid var(--mr-line);border-radius:16px;padding:34px;text-align:center;background:#fff}
.am-mr-note .ic{width:56px;height:56px;border-radius:15px;background:var(--mr-alt);border:1px solid var(--mr-line);
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.am-mr-note .ic svg{width:28px;height:28px;stroke:var(--mr-muted)}
.am-mr-note h4{margin:0 0 8px;font-size:19px;font-weight:800;letter-spacing:-.3px;color:var(--mr-ink)}
.am-mr-note p{margin:0 auto 20px;color:var(--mr-muted);font-size:15px;max-width:52ch;line-height:1.6}
.am-mr-note .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---- chargement ---- */
.am-mr-loading{display:flex;align-items:center;gap:12px;color:var(--mr-muted);font-size:14px;font-weight:500}
.am-mr-spin{width:20px;height:20px;border:2.4px solid var(--mr-line);border-top-color:var(--mr-ink);
  border-radius:50%;animation:am-mr-rot .7s linear infinite}
@keyframes am-mr-rot{to{transform:rotate(360deg)}}

/* ---- responsive ---- */
@media(max-width:1100px){
  .am-mr-form{grid-template-columns:1fr 1fr}
  .am-mr-find{grid-column:1/-1}
  .am-mr-specs{grid-template-columns:repeat(2,1fr)}
  .am-mr-spec:nth-child(2){border-right:none}
  .am-mr-spec:nth-child(1),.am-mr-spec:nth-child(2){border-bottom:1px solid var(--mr-line)}
}
@media(max-width:600px){
  .am-mr-top,.am-mr-body{padding-left:22px;padding-right:22px}
  .am-mr-form{grid-template-columns:1fr}
  .am-mr-chead{flex-wrap:wrap}
  .am-mr-mbadge{order:3}
}
@media(prefers-reduced-motion:reduce){.am-mr *{transition:none!important;animation:none!important}}
