/* =========================================================================
   WebSteve — JM Motors thème léger : pages catégorie
   (reprend le modèle Creative Elements « Page_categorie » de jmmotors.fr)
   ========================================================================= */

/* ---------- Mise en page pleine largeur ---------- */
body#category #wrapper{padding-top:0;background:#fff}
body#category #wrapper>.container{max-width:none;width:100%;padding:0}
body#category #wrapper>.container>.row{margin:0}
body#category #content-wrapper{padding:0;width:100%;max-width:100%;flex:0 0 100%}
body#category #main{margin:0}
body#category #main .page-footer{display:none}
body#category #notifications .container{max-width:var(--wsjm-w,1500px)}

/* Fil d'Ariane */
body#category .breadcrumb{max-width:var(--wsjm-w,1500px);margin:0 auto;padding:28px 20px 0;background:none;font:400 14px/1.5 Arial,Helvetica,sans-serif;color:#7A7A7A}
body#category .breadcrumb ol{margin:0;padding:0}
body#category .breadcrumb li{color:#7A7A7A}
body#category .breadcrumb li a{color:#000}
body#category .breadcrumb li a:hover{color:#960E0F}
body#category .breadcrumb li::after{content:"/";color:#0F172A;margin:0 .45em}
body#category .breadcrumb li:last-child::after{content:none}

/* ---------- Titre & descriptions ---------- */
.wsjm-cat-header{margin:0}
.wsjm-cat-title{max-width:var(--wsjm-w,1500px);margin:0 auto;padding:22px 20px 6px}
.wsjm-cat-title .h1{margin:0;font:700 34px/1.15 Arial,Helvetica,sans-serif;color:#000;text-transform:none;letter-spacing:-.02em}
.wsjm-cat-desc,.wsjm-cat-add{
  --jm-black:#17191d;--jm-dark:#22252b;--jm-grey:#666b73;--jm-light:#f5f5f5;--jm-border:#e4e5e7;
  --jm-white:#fff;--jm-red:#e30613;--jm-red-dark:#bc0711;--red:#e11d2e;
  color:#17191d;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65;
}
.wsjm-cat-desc{position:relative;margin:0 auto 10px}
.wsjm-cat-desc,.wsjm-cat-add{max-width:var(--wsjm-w,1500px);margin-left:auto;margin-right:auto;padding:10px 20px}
.wsjm-cat-desc.is-rich,.wsjm-cat-add.is-rich{padding-top:0;padding-bottom:0}
body#category #wrapper{overflow-x:clip}
/* Bandeaux pleine largeur des contenus (fonds gris / sombres) */
.wsjm-cat-desc .jm50-section,.wsjm-cat-desc .jm50-hero,.wsjm-cat-add .jm50-section,.wsjm-cat-desc .jm-home-section,.wsjm-cat-add .jm-home-section,.wsjm-cat-desc>.wsjm-ce-section[style],.wsjm-cat-add>.wsjm-ce-section[style]{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-left:max(20px,calc(50vw - 780px));padding-right:max(20px,calc(50vw - 780px))}
.wsjm-cat-desc .jm50-section .jm50-container,.wsjm-cat-desc .jm50-hero .jm50-container,.wsjm-cat-add .jm50-section .jm50-container{width:min(1180px,100%)}
.wsjm-cat-desc img,.wsjm-cat-add img{max-width:100%;height:auto}
.wsjm-cat-desc *,.wsjm-cat-add *{box-sizing:border-box}
.wsjm-cat-desc a,.wsjm-cat-add a{text-decoration:none}
.wsjm-cat-cover{max-width:var(--wsjm-w,1500px);margin:0 auto 20px;padding:0 20px}
.wsjm-cat-cover img{display:block;max-width:100%;height:auto;border-radius:12px}
.wsjm-cat-add{margin:40px auto}
.wsjm-cat-add.is-rich{margin-top:40px}

/* Visuel de fond de la description « Scooter 50cc » (section CE d'origine) */
body.category-id-4 .wsjm-cat-desc.is-rich::before{content:"";position:absolute;inset:0;background:url("/img/cms/image-fond-accueil-jmmotors.jpg") top center/2200px auto no-repeat;opacity:.17;pointer-events:none}
body.category-id-4 .wsjm-cat-desc.is-rich>*{position:relative}

/* ---------- Barre « Il y a X produits » + tri ---------- */
body#category #products{max-width:var(--wsjm-w,1500px);margin:30px auto 0;padding:0 20px}
body#category #js-product-list-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:0 0 10px;padding:0}
body#category #js-product-list-top>div{width:auto;max-width:none;flex:0 1 auto;padding:0;float:none}
body#category #js-product-list-top .total-products{display:block!important;flex:1 1 auto}
body#category #js-product-list-top .total-products p{margin:0;padding:0;font:400 16px/1.5 Arial,Helvetica,sans-serif;color:#000}
body#category #js-product-list-top .showing{display:none!important}
body#category .sort-by-row{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:0}
body#category .sort-by-row .sort-by{display:none}
body#category .products-sort-order{width:auto;max-width:none;flex:0 0 auto;padding:0;min-width:220px}
body#category .products-sort-order .select-title{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;padding:0 12px;background:#F8F8F8;border:0;border-radius:0;box-shadow:none;color:#000;font:500 15px/2.4 "Nunito Sans",Inter,Arial,sans-serif}
body#category .products-sort-order .dropdown-menu{width:100%;border:0;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);background:#fff}
body#category .products-sort-order .select-list{padding:8px 14px;font-size:14px;color:#000}
body#category .products-sort-order .select-list:hover,body#category .products-sort-order .select-list.current{background:#F8F8F8;color:#960E0F}
body#category .filter-button{display:none}

/* ---------- Grille de produits ---------- */
body#category #js-product-list .products{display:flex;flex-wrap:wrap;margin:0 -5px}
body#category #js-product-list .products>.product{float:none;width:auto;padding:0 5px;margin:0 0 10px;flex:0 0 25%;max-width:25%}

/* ---------- Pagination ---------- */
body#category #js-product-list .pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:20px 0 0;padding:0;font-size:14px;color:#7A7A7A}
body#category #js-product-list .pagination>div{width:auto;max-width:none;flex:0 1 auto;padding:0;margin:0}
body#category #js-product-list .pagination .page-list{display:flex;gap:6px;margin:0;padding:0;background:none;box-shadow:none}
body#category #js-product-list .pagination .page-list li{list-style:none}
body#category #js-product-list .pagination a,body#category #js-product-list .pagination .spacer{display:inline-flex;align-items:center;padding:12px 15px;background:#F3F3F3;color:#2C2C2C;font-weight:600;text-decoration:none}
body#category #js-product-list .pagination .current a{background:#960E0F;color:#fff;opacity:1}
body#category #js-product-list .pagination li:not(.current) a.disabled{opacity:.4}
body#category #js-product-list .pagination a.disabled{pointer-events:none}
body#category #js-product-list .up{display:none}
body#category #js-product-list-bottom{margin:0}

/* ---------- Classes de contenu « jm50- » (styles des documents CE) ---------- */
.jm50-container{width:min(1180px,calc(100% - 32px));margin:0 auto}
.jm50-section{padding:68px 0}
.jm50-section-light{background:var(--jm-light,#f5f5f5)}
.jm50-section-dark{background:var(--jm-black,#17191d);color:#fff}
.jm50-section-dark h2,.jm50-section-dark h3{color:#fff}
.jm50-section-dark .jm50-card h3{color:#17191d}
.wsjm-cat-desc .jm50-section h1,.wsjm-cat-desc .jm50-hero h1,.wsjm-cat-desc h2,.wsjm-cat-add h2,.wsjm-cat-desc h3,.wsjm-cat-add h3{margin-top:0;line-height:1.15;letter-spacing:-.025em;font-family:Arial,Helvetica,sans-serif;text-transform:none}
.jm50-hero h1,.jm50-section h1{font-size:clamp(34px,5vw,62px);margin-bottom:20px;color:#000}
.jm50-section h2,.jm50-hero h2{font-size:clamp(28px,3.7vw,42px);margin-bottom:18px}
.jm50-section h3,.jm50-hero h3{font-size:21px;margin-bottom:10px}
.jm50-section p,.jm50-hero p{margin-top:0}
.jm50-lead{font-size:19px;max-width:800px;color:#555a62}
.jm50-section-dark .jm50-lead,.jm50-section-dark p{color:#d8d9dc}
.jm50-section-dark .jm50-card p{color:#555a62}
.jm50-eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--jm-red,#e30613);margin-bottom:14px}
.jm50-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.jm50-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:8px;font-weight:700;transition:.2s ease}
.jm50-btn-primary{background:var(--jm-red,#e30613);color:#fff!important}
.jm50-btn-primary:hover{background:var(--jm-red-dark,#bc0711);transform:translateY(-1px)}
.jm50-btn-secondary{background:#fff;color:var(--jm-black,#17191d)!important;border:1px solid var(--jm-border,#e4e5e7)}
.jm50-hero{padding:70px 0 54px;background:radial-gradient(circle at 85% 20%,rgba(227,6,19,.10),transparent 30%),linear-gradient(180deg,rgba(255,255,255,.75) 0%,rgba(247,247,248,.9) 100%)}
.jm50-hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);align-items:center;gap:45px}
.jm50-hero-box{background:#fff;border:1px solid var(--jm-border,#e4e5e7);border-radius:18px;padding:28px;box-shadow:0 12px 35px rgba(0,0,0,.06)}
.jm50-price{font-size:36px;font-weight:800;line-height:1;margin:4px 0 8px}
.jm50-small{color:var(--jm-grey,#666b73);font-size:14px}
.jm50-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:35px}
.jm50-trust-item{background:#fff;border:1px solid var(--jm-border,#e4e5e7);border-radius:12px;padding:17px}
.jm50-trust-item strong{display:block;margin-bottom:3px}
.jm50-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.jm50-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.jm50-card{background:#fff;border:1px solid var(--jm-border,#e4e5e7);border-radius:16px;padding:24px;height:100%;color:#17191d}
.jm50-card p:last-child{margin-bottom:0}
.jm50-product-card{display:flex;flex-direction:column}
.jm50-product-card .jm50-model-price{font-size:25px;font-weight:800;margin-top:auto;padding-top:12px}
.jm50-tag{display:inline-flex;width:max-content;padding:5px 10px;border-radius:999px;background:#fbeaec;color:#b10812;font-size:12px;font-weight:700;margin-bottom:15px}
.jm50-product-link{display:inline-block;margin-top:10px;color:var(--jm-red,#e30613)!important;font-weight:700}
.jm50-table-wrap{overflow-x:auto;border:1px solid var(--jm-border,#e4e5e7);border-radius:14px;background:#fff}
.jm50-table{width:100%;border-collapse:collapse;min-width:700px}
.jm50-table th,.jm50-table td{padding:17px 18px;text-align:left;border-bottom:1px solid var(--jm-border,#e4e5e7)}
.jm50-table th{background:#f1f2f3;font-size:14px}
.jm50-table tr:last-child td{border-bottom:0}
.jm50-checks{list-style:none;margin:24px 0 0;padding:0}
.jm50-checks li{position:relative;padding-left:28px;margin-bottom:11px;list-style:none}
.jm50-checks li:before{content:"✓";position:absolute;left:0;top:0;color:var(--jm-red,#e30613);font-weight:800}
.jm50-two-col{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:start}
.jm50-callout{border-left:4px solid var(--jm-red,#e30613);background:#fff;border-radius:0 12px 12px 0;padding:22px 24px;margin-top:24px;color:#17191d}
.jm50-section-dark .jm50-callout{background:#282b31;color:#fff}
.jm50-faq{max-width:900px}
.jm50-faq details{background:#fff;border:1px solid var(--jm-border,#e4e5e7);border-radius:12px;margin-bottom:12px;overflow:hidden}
.jm50-faq summary{cursor:pointer;padding:20px 50px 20px 20px;font-weight:700;position:relative;list-style:none}
.jm50-faq summary::-webkit-details-marker{display:none}
.jm50-faq summary:after{content:"+";position:absolute;right:20px;top:15px;font-size:28px;font-weight:400}
.jm50-faq details[open] summary:after{content:"−"}
.jm50-faq-answer{padding:0 20px 20px;color:#555a62}
.jm50-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.jm50-links a{padding:10px 14px;background:#fff;border:1px solid var(--jm-border,#e4e5e7);border-radius:8px;color:var(--jm-black,#17191d);font-weight:600}
.jm50-links a:hover{border-color:var(--jm-red,#e30613);color:var(--jm-red,#e30613)}
.jm50-note{font-size:13px;color:#777c84;margin-top:15px}

/* ---------- Ajustements repris des documents CE par catégorie ---------- */
body.category-id-38 .about-section,body.category-id-39 .about-section{max-width:var(--wsjm-w,1500px);margin:0 auto 36px}
body.category-id-38 .about-hero,body.category-id-39 .about-hero{max-width:1000px;margin:0 auto 36px;background:#f8fafc;border:1px solid #e8ebef;border-radius:24px;padding:48px 40px;box-shadow:0 10px 30px rgba(15,23,42,.05)}
body.category-id-38 .about-hero__subtitle,body.category-id-39 .about-hero__subtitle{font-size:20px;font-weight:600;color:#334155;margin:0 0 18px}
body.category-id-38 .about-hero>img,body.category-id-39 .about-hero>img{display:block;width:calc(100% + 80px);max-width:calc(100% + 80px);height:auto;margin:32px -40px -48px;border-radius:0 0 22px 22px}
body.category-id-38 .about-hero .stats-block,body.category-id-39 .about-hero .stats-block{display:none!important}
body.category-id-38 .stats-block{overflow:hidden}
body.category-id-29 .banner{padding:30px;background:radial-gradient(circle at top right,rgba(255,255,255,.16),transparent 24%),linear-gradient(135deg,#111318 0%,#1c2030 46%,#e11d2e 180%);color:#fff}
body.category-id-29 .banner h2{margin:0 0 12px;font-size:46px;line-height:1.02;color:#fff}
body.category-id-29 .banner p{margin:0 0 20px;max-width:900px;font-size:18px;line-height:1.8;color:rgba(255,255,255,.86)}
.wsjm-cat-desc .about-section,.wsjm-cat-add .about-section{max-width:var(--wsjm-w,1500px);margin-left:auto;margin-right:auto}

/* ---------- Responsive ---------- */
@media (max-width:1199px){
  body#category #js-product-list .products>.product{flex-basis:33.333%;max-width:33.333%}
}
@media (max-width:900px){
  .jm50-hero-grid,.jm50-two-col{grid-template-columns:1fr}
  .jm50-grid-4,.jm50-trust{grid-template-columns:repeat(2,1fr)}
  .jm50-grid-3{grid-template-columns:1fr}
}
@media (max-width:767px){
  body#category .breadcrumb{padding:16px 16px 0}
  .wsjm-cat-title{padding:16px 16px 4px}
  .wsjm-cat-title .h1{font-size:28px}
  .wsjm-cat-desc:not(.is-rich),.wsjm-cat-add:not(.is-rich){padding:10px 16px}
  body#category #products{padding:0 8px;margin-top:20px}
  body#category #js-product-list-top .total-products{flex-basis:100%;margin-bottom:10px}
  body#category .products-sort-order{min-width:0;width:100%}
  body#category .sort-by-row{width:100%}
  body#category #js-product-list-top>div.col-lg-7{width:100%}
  body#category #js-product-list .products>.product{flex-basis:50%;max-width:50%}
  body#category #js-product-list .pagination{justify-content:center;gap:10px}
  body.category-id-38 .about-hero,body.category-id-39 .about-hero{padding:32px 20px}
  body.category-id-38 .about-hero>img,body.category-id-39 .about-hero>img{width:calc(100% + 40px);max-width:calc(100% + 40px);margin:24px -20px -32px}
}
@media (max-width:600px){
  .jm50-section{padding:48px 0}
  .jm50-hero{padding:45px 0 38px}
  .jm50-container{width:min(100% - 22px,1180px)}
  .jm50-grid-4,.jm50-trust{grid-template-columns:1fr}
  .jm50-card,.jm50-hero-box{padding:20px}
  .jm50-btn{width:100%}
  body.category-id-29 .banner h2{font-size:32px}
}

/* Chargement progressif des produits */
body#category #js-product-list.wsjm-infinite .pagination{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wsjm-more{display:flex;flex-direction:column;align-items:center;gap:14px;margin:26px 0 10px;text-align:center}
.wsjm-more__info{margin:0;font:400 14px/1.4 Arial,Helvetica,sans-serif;color:#7A7A7A}
.wsjm-more__info:empty{display:none}
.wsjm-more__btn{min-height:48px;padding:0 28px;border:2px solid #960E0F;border-radius:999px;background:#fff;color:#960E0F;font:700 15px/1 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.02em;cursor:pointer;transition:background .2s,color .2s}
.wsjm-more__btn:hover,.wsjm-more__btn:focus-visible{background:#960E0F;color:#fff}
.wsjm-more__btn[hidden]{display:none}
.wsjm-more__spinner{display:none;width:34px;height:34px;border:3px solid #eee;border-top-color:#E11D2E;border-radius:50%;animation:wsjm-spin .8s linear infinite}
.wsjm-more.is-loading .wsjm-more__spinner{display:block}
@keyframes wsjm-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.wsjm-more__spinner{animation-duration:2s}}
