/* ════════════════ PAGE DE RECHERCHE REFAITE (mph-recherche.php) ════════════════
   Elle s'ajoute à la feuille des catégories (categorie-vN.css), dont elle reprend tout : couleurs (.mph-cat), haut
   (.c-haut), rangées de produits (.c-rang), boutons, bannière de fin. Ici, seulement ce que la recherche a de plus :
   le champ, les sauts vers chaque section, les catégories trouvées, les cartes des pages et des articles. */

.mph-rech .rech-haut{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.mph-rech .rech-haut.sans-photos{grid-template-columns:minmax(0,1fr)}
.mph-rech .rech-haut.sans-photos .tx{max-width:760px}
.mph-rech .rech-haut h1{font-size:54px;overflow-wrap:anywhere}

/* Le champ : la même pilule que la recherche de l'en-tête */
.mph-rech .rech-form{display:flex;align-items:center;gap:10px;height:60px;margin-top:22px;padding:0 6px 0 20px;border-radius:999px;background:#fff;border:1px solid var(--l2);box-shadow:0 10px 26px rgba(15,47,95,.08);transition:border-color .15s,box-shadow .15s}
.mph-rech .rech-form:focus-within{border-color:var(--b);box-shadow:0 0 0 4px rgba(29,111,232,.14)}
.mph-rech .rech-form>.ic{width:20px;height:20px;color:var(--g)}
.mph-rech .rech-form input[type=search]{flex:1;width:0;min-width:0;height:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;outline:0;-webkit-appearance:none;appearance:none;font:inherit;font-size:16px;color:var(--n)}
.mph-rech .rech-form input[type=search]::placeholder{color:#7a879b;opacity:1}
.mph-rech .rech-form input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.mph-rech .rech-form .btn{flex:none;min-height:48px;padding:0 24px;border-radius:999px;box-shadow:none}

/* Sauter à une section, avec son nombre */
.mph-rech .rech-sauts{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.mph-rech .rech-saut{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 8px 0 15px;border-radius:999px;background:#fff;font-size:13.5px;font-weight:600;color:#25406b}
.mph-rech .rech-saut span{min-width:24px;padding:2px 8px;border-radius:999px;background:var(--bp);color:var(--b);font-size:12.5px;font-weight:700;text-align:center}
.mph-rech .rech-saut:hover{color:var(--b)}

/* Les catégories qui portent le mot cherché : la page la plus utile, d'un clic */
.mph-rech .rech-cats{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}
.mph-rech .rech-cats-k{margin-right:4px;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--g)}
.mph-rech .rech-pastille{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 15px;border-radius:999px;background:#fff;border:1px solid var(--l2);font-size:14px;font-weight:600;color:var(--n)}
.mph-rech a.rech-pastille{color:var(--n)}
.mph-rech .rech-pastille:hover{border-color:var(--b);color:var(--b)}
.mph-rech .rech-pastille .ic{width:16px;height:16px;color:var(--b)}

/* Titres de section et leur nombre */
.mph-rech h2.s .rech-n{display:inline-block;margin-left:6px;padding:3px 12px;border-radius:999px;background:var(--bp);color:var(--b);font-size:16px;font-weight:700;letter-spacing:0;vertical-align:.35em;line-height:1.4}
.mph-rech .rech-liste{scroll-margin-top:110px}
/* Un numéro de modèle plus large que sa colonne (« (TH2320WF4010) » à 320 px) passe à la ligne au lieu de sortir de la carte */
.mph-rech .c-rang h2,.mph-rech .c-rang .pts li{overflow-wrap:break-word}
.mph-rech .rech-resume{margin-top:4px;font-size:14.5px;line-height:1.6;color:var(--tx)}
.mph-rech .rech-note{margin:8px 0 0;font-size:14px;color:var(--g);text-align:center}

/* Pages et articles : des cartes */
.mph-rech .rech-section{margin-top:52px;scroll-margin-top:110px}
.mph-rech .rech-section h2.s{margin-bottom:18px}
.mph-rech .rech-cartes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:16px}
.mph-rech a.rech-carte{display:flex;flex-direction:column;overflow:hidden;border-radius:24px;background:#fff;border:1px solid var(--l);color:var(--t);transition:border-color .15s,box-shadow .2s,transform .2s}
.mph-rech a.rech-carte:hover{border-color:var(--l2);box-shadow:0 18px 40px -18px rgba(15,47,95,.35);transform:translateY(-2px)}
.mph-rech .rech-carte-img{display:block;aspect-ratio:16/9;background:linear-gradient(160deg,#e9f1fe,#f6f9fe);overflow:hidden}
.mph-rech .rech-carte-img img{display:block;width:100%;height:100%;object-fit:cover}
.mph-rech .rech-carte-tx{flex:1;display:flex;flex-direction:column;gap:6px;padding:18px 20px 20px}
.mph-rech .rech-carte.sans-image .rech-carte-tx{padding-top:22px;border-top:4px solid var(--b)}
.mph-rech .rech-carte-tx b{font-size:18px;font-weight:800;line-height:1.3;color:var(--n)}
.mph-rech .rech-carte-desc{font-size:14px;line-height:1.6;color:var(--tx)}
.mph-rech .rech-carte-lien{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:8px;font-size:14.5px;font-weight:700;color:var(--b)}
.mph-rech .rech-carte-lien .ic{width:16px;height:16px;transition:transform .2s}
.mph-rech a.rech-carte:hover .rech-carte-lien .ic{transform:translateX(3px)}

/* Aucun résultat : des raccourcis et un conseiller */
.mph-rech .rech-pastilles{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.mph-rech .rech-vide .btns{max-width:560px}

@media (max-width:900px){
  .mph-rech .rech-haut,.mph-rech .rech-haut.sans-photos{grid-template-columns:minmax(0,1fr)}
  .mph-rech .rech-haut h1{font-size:36px}
  .mph-rech .rech-haut .trio{max-width:420px}
  .mph-rech .rech-form{height:54px;padding:0 5px 0 14px;gap:8px;margin-top:16px}
  .mph-rech .rech-form .btn{min-height:44px;padding:0 16px;font-size:14.5px}
  .mph-rech .rech-section{margin-top:36px}
  .mph-rech h2.s .rech-n{font-size:14px;padding:2px 10px}
  .mph-rech .rech-carte-tx b{font-size:17px}
  .mph-rech .c-rang .rech-resume{grid-column:1 / -1;margin-top:10px}
  /* « Sur estimation » sur sa ligne, les deux boutons côte à côte (sinon le bouton bleu s'écrasait à côté du prix
     et « Voir la fiche » restait seul dessous) */
  .mph-rech .achat:has(> .estim) .prix{grid-column:1 / -1}
}
@media (max-width:360px){
  .mph-rech .rech-form .btn{padding:0 12px}
  .mph-rech .achat .btn{padding-inline:10px}
}