/* COPIE de la visu validée (b.css, sha256 6a11ced48d2accd2) — importer-maquette.mjs ; ne pas éditer. */
/* DIRECTION B — « Catalogue technique » : pensée pour l'acheteur professionnel
   (recherche par référence, commande rapide, filtres techniques, tableau comparatif).
   Révision 27/10 : catégories UNIQUEMENT dans la colonne verticale (pv.css) — plus de barre horizontale. */
body[data-direction="B"]{background:var(--p-blanc)}
.b-top{background:var(--p-encre);color:var(--p-blanc);font-size:13px}
.b-top .wrap{display:flex;align-items:center;gap:22px;min-height:36px}
.b-top span,.b-top a{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.b-top .grow{flex:1}
.b-head{border-bottom:1px solid var(--p-bord)}
.b-head .wrap{display:flex;align-items:center;gap:28px;min-height:84px}
.b-logo img{height:46px;width:auto}
.b-search{flex:1;display:flex;align-items:stretch;height:48px;border:2px solid var(--p-grisbleu-fonce);border-radius:6px;overflow:hidden;max-width:720px}
.b-seg{display:flex;background:var(--p-grisbleu-pale);border-right:1px solid var(--p-grisbleu-voile)}
.b-seg span{display:grid;place-items:center;padding:0 14px;font-size:13px;font-weight:600;color:var(--p-texte)}
.b-seg span.on{background:var(--p-grisbleu-fonce);color:var(--p-blanc)}
.b-search input{flex:1;border:0;border-radius:0;padding:0 14px;min-width:0}
.b-search button{border:0;border-radius:0;width:56px;background:var(--p-sarcelle-fonce);color:var(--p-blanc);display:grid;place-items:center}
.b-acts{display:flex;align-items:center;gap:18px;margin-left:auto}
.b-acts .btn{min-height:42px;padding:0 14px;font-size:14px}
.b-acts>a:not(.btn){display:inline-flex;flex-direction:column;align-items:center;font-size:12px;font-weight:500;color:var(--p-encre);gap:2px;position:relative}
.b-burger{border:0;background:var(--p-blanc);color:var(--p-encre);min-width:44px;height:48px;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:0 4px;font-size:11px;font-weight:600}

/* Accueil */
.b-une{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;padding:0 0 24px}
.b-banniere{border-radius:6px;overflow:hidden;border:1px solid var(--p-bord);display:flex;flex-direction:column}
.b-banniere img{height:250px;width:100%;object-fit:cover}
.b-banniere>div{padding:20px 22px;display:flex;flex-direction:column;align-items:flex-start;gap:16px;background:var(--p-blanc);flex:1}
.b-banniere h1{font-size:25px}
.b-banniere p{color:var(--p-texte-2);margin-top:6px}
.b-banniere .btns{display:flex;gap:10px;flex-wrap:wrap}
.b-rapide{border:1px solid var(--p-bord-2);border-radius:6px;padding:22px;background:var(--p-creme)}
.b-rapide h2{font-size:20px;display:flex;align-items:center;gap:10px}
.b-rapide h2 .ico{color:var(--p-grisbleu-fonce)}
.b-rapide p{font-size:14px;color:var(--p-texte-2);margin:6px 0 16px}
.b-rapide .ligne{display:grid;grid-template-columns:minmax(0,1fr) 72px;gap:8px;margin-bottom:8px}
.b-rapide input{height:42px;padding:0 12px;width:100%;min-width:0}
.b-rapide .ok{border-color:var(--p-sarcelle-fonce);background:var(--p-blanc)}
.b-rapide .trouve{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--p-vert-fonce);font-weight:500;margin:-2px 0 10px}
.b-rapide .btn{width:100%;margin-top:6px}
.b-rapide .coller{display:block;text-align:center;margin-top:12px;font-size:14px;color:var(--p-indigo);font-weight:500}
.b-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:36px}
.b-services a{display:flex;gap:14px;align-items:center;padding:18px;border-radius:6px;background:var(--p-grisbleu-pale);border:1px solid var(--p-grisbleu-voile)}
.b-services .ico{width:30px;height:30px;color:var(--p-grisbleu-fonce)}
.b-services b{display:block;color:var(--p-encre);font-weight:600}
.b-services span{font-size:13px;color:var(--p-texte-2)}
.b-h2{font-size:22px;margin-bottom:18px;display:flex;align-items:center;gap:12px}
.b-h2 small{font-size:14px;font-weight:500;color:var(--p-texte-2)}

/* Liste compacte (accueil) */
.catalog-list.b-ligne{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:32px}
.b-passerelle{display:flex;align-items:center;gap:16px;padding:18px 20px;border:1px dashed var(--p-grisbleu-fonce);border-radius:6px;background:var(--p-grisbleu-pale)}
.b-passerelle>.ico{width:28px;height:28px;color:var(--p-grisbleu-fonce)}
.b-passerelle div{flex:1;display:flex;flex-direction:column;gap:2px}
.b-passerelle b{color:var(--p-encre)}
.b-passerelle span{font-size:14px;color:var(--p-texte)}
.b-passerelle .btn{background:var(--p-blanc)}
.b-carte{display:grid;grid-template-columns:88px 1fr;gap:12px;border:1px solid var(--p-bord-2);border-radius:6px;padding:12px}
.b-carte-img img{width:88px;height:88px;object-fit:contain}
.b-carte-corps{display:flex;flex-direction:column;gap:3px;min-width:0}
.b-carte-nom{font-weight:600;color:var(--p-encre);font-size:14px;line-height:1.35}
.b-carte-ref{font-size:12px;color:var(--p-texte-3);font-family:ui-monospace,Menlo,monospace}
.b-carte-prix{font-size:15px}

/* Catégorie */
.b-ariane{font-size:13px;color:var(--p-texte-2);padding:0;display:flex;gap:6px;flex-wrap:wrap}
.b-ariane b{color:var(--p-encre);font-weight:500}
.b-titre{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;padding:10px 0 18px}
.b-titre h1{font-size:30px}
.b-titre span{color:var(--p-texte-2)}
.b-filtres{border:1px solid var(--p-bord-2);border-radius:6px;background:var(--p-blanc)}
.b-filtre{padding:16px 18px;border-bottom:1px solid var(--p-bord)}
.b-filtre:last-child{border-bottom:0}
.b-filtre h3{font-size:14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--p-encre)}
.b-coche{display:flex;align-items:center;gap:10px;padding:5px 0;font-size:14px}
.b-coche i{width:18px;height:18px;border:1.5px solid var(--p-texte-3);border-radius:3px;display:grid;place-items:center;flex:none}
.b-coche.on i{background:var(--p-grisbleu-fonce);border-color:var(--p-grisbleu-fonce);color:var(--p-blanc)}
.b-coche i .ico{width:12px;height:12px;stroke-width:3}
.b-coche span{margin-left:auto;color:var(--p-texte-2);font-size:13px}
.b-puces{display:flex;flex-wrap:wrap;gap:6px}
.b-puces span{border:1px solid var(--p-bord-3);border-radius:4px;padding:5px 10px;font-size:13px;color:var(--p-texte)}
.b-puces span.on{border-color:var(--p-indigo);color:var(--p-indigo);background:var(--p-sarcelle-pale);font-weight:600}
.b-filtre .voir{font-size:13px;color:var(--p-indigo);font-weight:600;display:inline-block;margin-top:8px}
.b-prix{display:grid;grid-template-columns:1fr auto 1fr;gap:6px;align-items:center;font-size:14px}
.b-prix input{height:38px;padding:0 10px;width:100%}
.b-barre{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.b-barre .actif{display:inline-flex;align-items:center;gap:6px;background:var(--p-grisbleu-pale);border:1px solid var(--p-grisbleu-voile);border-radius:4px;padding:4px 8px 4px 10px;font-size:13px;font-weight:500;color:var(--p-encre)}
.b-barre .effacer{font-size:13px;color:var(--p-indigo);font-weight:600}
.b-barre .grow{flex:1}
.b-barre select{height:38px;padding:0 10px;font-size:14px}
.b-bascule{display:flex;border:1px solid var(--p-bord-3);border-radius:4px;overflow:hidden}
.b-bascule span{display:inline-flex;align-items:center;gap:6px;padding:0 12px;height:36px;font-size:13px;font-weight:600;color:var(--p-texte)}
.b-bascule span.on{background:var(--p-grisbleu-fonce);color:var(--p-blanc)}
table.b-table{width:100%;border-collapse:collapse;font-size:14px}
.b-table th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--p-texte-2);font-weight:600;padding:10px 12px;background:var(--p-grisbleu-pale);border-bottom:1px solid var(--p-grisbleu-voile)}
.b-table td{padding:12px;border-bottom:1px solid var(--p-bord);vertical-align:middle}
.b-table .prod{display:flex;align-items:center;gap:12px}
.b-table .prod img{width:56px;height:56px;object-fit:contain;border:1px solid var(--p-bord);border-radius:4px;background:var(--p-blanc)}
.b-table .prod b{display:block;color:var(--p-encre);font-weight:600}
.b-table .prod code{font-size:12px;color:var(--p-texte-3)}
.b-table .opts{color:var(--p-texte-2);font-size:13px}
.b-table td.num{white-space:nowrap}
.b-table .btn{min-height:38px;padding:0 12px;font-size:13px}
.b-suite{display:flex;align-items:center;justify-content:space-between;margin-top:18px;font-size:14px;color:var(--p-texte-2)}

/* Fiche */
.b-fiche{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px 28px;padding:12px 0 36px}
.b-fiche-tete{grid-column:1/-1}
.b-fiche-tete h1{font-size:26px;line-height:1.25}
.b-fiche-tete .ref{display:inline-block;margin-top:8px;font-size:13px;color:var(--p-texte-2);background:var(--p-grisbleu-pale);border:1px solid var(--p-grisbleu-voile);border-radius:4px;padding:2px 8px;font-family:ui-monospace,Menlo,monospace}
.b-fiche .b-achat{grid-row:2/4;grid-column:2}
.b-galerie{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;align-self:start}
.b-galerie .vign{display:flex;flex-direction:column;gap:8px}
.b-galerie .vign img{width:64px;height:64px;object-fit:contain;border:1px solid var(--p-bord-2);border-radius:4px;padding:4px}
.b-galerie .vign img.on{border:2px solid var(--p-indigo)}
.b-galerie .grande{border:1px solid var(--p-bord-2);border-radius:6px;padding:20px}
.b-galerie .grande img{aspect-ratio:1/1;object-fit:contain;width:100%;max-height:380px}
.b-info p{margin:0 0 14px}
.b-cles{display:grid;gap:8px;margin:16px 0}
.b-cles li{display:flex;gap:10px;align-items:flex-start;font-size:14px}
.b-cles .ico{color:var(--p-sarcelle-fonce);width:18px;height:18px;margin-top:2px}
.b-docs{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.b-docs a{display:flex;align-items:center;gap:10px;border:1px solid var(--p-bord-2);border-radius:6px;padding:10px 12px;font-size:14px;font-weight:500;color:var(--p-encre)}
.b-docs a .ico{color:var(--p-indigo)}
.b-docs a span{margin-left:auto;font-size:12px;color:var(--p-texte-2);font-weight:400}
.b-achat{border:1px solid var(--p-bord-2);border-radius:6px;padding:20px;align-self:start;background:var(--p-blanc);box-shadow:0 4px 14px rgba(35,35,35,.08)}
.b-achat .prix{font-size:24px;display:block}
.b-achat .ht{font-size:13px;color:var(--p-texte-2);margin:2px 0 14px}
.b-achat h3{font-size:14px;margin:14px 0 8px}
.b-achat .b-seg2{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--p-bord-3);border-radius:4px;overflow:hidden}
.b-achat .b-seg2 span{display:grid;place-items:center;height:40px;font-weight:600;font-size:14px}
.b-achat .b-seg2 span.on{background:var(--p-grisbleu-fonce);color:var(--p-blanc)}
.b-achat .b-puces{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.b-achat .b-puces span{text-align:center;padding:7px 2px;font-size:12px}
.b-achat .version{font-size:13px;color:var(--p-texte-2);margin:14px 0 4px;padding:8px 10px;background:var(--p-creme);border-radius:4px}
.b-achat .version b{color:var(--p-encre);font-family:ui-monospace,Menlo,monospace;font-weight:600}
.b-achat .qte{display:grid;grid-template-columns:110px 1fr;gap:8px;margin-top:12px}
.b-achat .qte input{height:46px;text-align:center;font-weight:600}
.b-achat .btn{width:100%;min-height:46px}
.b-achat .btn-contour{margin-top:8px}
.b-achat ul{margin-top:14px;display:grid;gap:6px;font-size:13px;color:var(--p-texte-2)}
.b-achat ul li{display:flex;gap:8px;align-items:center}
.b-achat ul .ico{width:16px;height:16px;color:var(--p-grisbleu-fonce)}
.b-ancres{display:flex;gap:4px;border-bottom:2px solid var(--p-bord-2);margin-bottom:24px}
.b-ancres a{padding:12px 16px;font-weight:600;color:var(--p-texte-2);margin-bottom:-2px;border-bottom:2px solid transparent}
.b-ancres a.on{color:var(--p-encre);border-bottom-color:var(--p-indigo)}
.b-carac{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:32px;padding-bottom:8px}
table.b-specs{width:100%;border-collapse:collapse;font-size:14px}
.b-specs th{text-align:left;width:42%;padding:11px 14px;color:var(--p-encre);font-weight:600;background:var(--p-grisbleu-pale);border-bottom:1px solid var(--p-blanc)}
.b-specs td{padding:11px 14px;border-bottom:1px solid var(--p-bord)}
.b-carac h2{font-size:20px;margin-bottom:14px}
.b-carac p{margin-bottom:10px}

/* Pied */
.b-pied{background:var(--p-noir);color:var(--p-blanc)}
.b-pied .haut{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding:40px 0}
.b-pied h4{color:var(--p-blanc);font-size:15px;margin-bottom:12px}
.b-pied li{font-size:14px;margin:6px 0}
.b-pied .bas{border-top:1px solid var(--p-texte);padding:14px 0;font-size:13px;color:var(--p-bord-3);display:flex;gap:20px;flex-wrap:wrap}
.b-pied .contact p{display:flex;align-items:center;gap:8px;font-size:14px;margin:6px 0}

@media (max-width:900px){
  .b-top .wrap{gap:14px}
  .b-head .wrap{flex-wrap:wrap;gap:8px;min-height:0;padding-top:10px;padding-bottom:12px}
  .b-burger{display:flex}
  .b-logo img{height:34px}
  .b-search{order:5;flex-basis:100%;height:46px;max-width:none}
  .b-seg span{padding:0 10px;font-size:12px}
  .b-acts{gap:4px}
  .b-acts .btn{display:none}
  .b-acts>a:not(.btn){width:44px;height:44px;justify-content:center}
  .b-acts>a:not(.btn) span.lib{display:none}
  .b-une{grid-template-columns:minmax(0,1fr);padding:0 0 16px;gap:16px}
  .b-banniere img{height:170px}
  .b-banniere>div{gap:14px;padding:16px}
  .b-banniere h1{font-size:22px}
  .b-banniere .btns{margin-left:0;flex-wrap:wrap}
  .b-services{grid-template-columns:1fr;gap:10px;margin-bottom:28px}
  .catalog-list.b-ligne{grid-template-columns:minmax(0,1fr);gap:10px}
  .b-passerelle{flex-wrap:wrap}
  .b-passerelle .btn{width:100%}
  .b-titre h1{font-size:24px}
  .b-barre .seul-bureau{display:none}
  table.b-table thead{display:none}
  .b-table,.b-table tbody,.b-table tr,.b-table td{display:block;width:100%}
  .b-table tr{border:1px solid var(--p-bord-2);border-radius:6px;margin-bottom:10px;padding:10px}
  .b-table td{border:0;padding:4px 0}
  .b-table td.act .btn{width:100%;margin-top:6px}
  .b-fiche{grid-template-columns:minmax(0,1fr);gap:16px}
  .b-fiche .b-achat{grid-row:auto;grid-column:auto}
  .b-fiche-tete h1{font-size:22px}
  .b-galerie{grid-template-columns:minmax(0,1fr)}
  .b-galerie .vign{flex-direction:row;order:2}
  .b-carac{grid-template-columns:1fr;gap:24px}
  .b-ancres{overflow-x:auto;scrollbar-width:none}
  .b-ancres a{padding:10px;white-space:nowrap;font-size:14px}
  .b-pied .haut{grid-template-columns:repeat(2,minmax(0,1fr))}
  .b-pied .contact{grid-column:1/-1}
  .b-pied li,.b-pied p{overflow-wrap:anywhere}
}