
/* === JM – Présentation v2.0.0‑LTS === */
.jm-pres{
  --jm-gap: 2rem;
  --jm-photo-w: 44%;
  --jm-body-w: 56%;
  --jm-radius: 18px;
  --jm-title-color: currentColor;
  --jm-maxw: 1100px;
  --jm-bg: transparent;
}
.jm-pres{ position:relative; background: var(--jm-bg); }
.jm-pres.__narrow{ max-width: var(--jm-maxw); margin-inline:auto; }
.jm-pres.__hide-desktop{ display:none; }
@media (max-width: 1024px){ .jm-pres.__hide-desktop{ display:block; } .jm-pres.__hide-tablet{ display:none; } }
@media (max-width: 680px){ .jm-pres.__hide-tablet{ display:block; } .jm-pres.__hide-mobile{ display:none; } }

.jm-pres__inner{ display:flex; gap:var(--jm-gap); align-items:center; width:100%; padding: clamp(1.25rem, 2vw, 2rem); }
.jm-pres__photo{ flex:0 0 var(--jm-photo-w); display:flex; align-items:center; justify-content:center; }
.jm-pres__photo-box{
  width: var(--jm-photo-w-pct, 100%);
  min-width: 220px; max-width: 560px;
  aspect-ratio: var(--ar, 4/5);
  border-radius: var(--jm-radius);
  overflow:hidden; position:relative;
  box-shadow: 0 18px 50px rgba(0,0,0,.12);
}
.jm-pres.__square .jm-pres__photo-box{ --ar: 1/1 }
.jm-pres__img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit: cover;
  object-position: var(--jm-fx,50%) var(--jm-fy,50%);
  border-radius: inherit;
}

.jm-pres__body{ flex:1 1 var(--jm-body-w); color:#0f172a; max-width:70ch; }
.jm-pres__title{ margin:0 0 .5rem 0; color: var(--jm-title-color); text-align: var(--jm-title-align-d, left); }
@media (max-width: 860px){
  .jm-pres__title{ text-align: var(--jm-title-align-m, left); }
}
.jm-pres__text{
  margin:0 0 1rem 0;
  font-family: var(--jm-body-ff, inherit);
  font-size: var(--jm-body-fs, inherit);
  line-height: var(--jm-body-lh, inherit);
  font-weight: var(--jm-body-fw, inherit);
  letter-spacing: var(--jm-body-ls, normal);
  text-transform: var(--jm-body-tt, none);
  text-align: var(--jm-text-align-d, left);
  text-wrap: pretty;
}
@media (max-width: 860px){
  .jm-pres__text{ text-align: var(--jm-text-align-m, left) !important; }
}

.jm-btns{
  --jm-gap:.66rem;
  --jm-justify:flex-start;
  --jm-wrap:wrap;
  --jm-font:'', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, 'Apple Color Emoji','Segoe UI Emoji';
  --jm-fsize:1rem; --jm-lh:1.2; --jm-weight:600; --jm-ls:0; --jm-transform:none;
}
.jm-btns__row{ display:flex; gap:var(--jm-gap); justify-content:var(--jm-justify); flex-wrap:var(--jm-wrap); align-items:center; width:100%; }
.jm-btn{
  font-family:var(--_ff, var(--jm-font));
  font-size:var(--_fs, var(--jm-fsize));
  line-height:var(--_lh, var(--jm-lh));
  font-weight:var(--_fw, var(--jm-weight));
  letter-spacing:var(--_ls, var(--jm-ls));
  text-transform:var(--_tt, var(--jm-transform));
  text-decoration:var(--_td, none);
  font-style:var(--_it, normal);
  display:inline-flex; align-items:center; justify-content:center;
  padding:var(--_py, .66rem) var(--_px, 1.1rem);
  border-radius:var(--_radius, 9999px);
  border:var(--_bw, 1px) solid var(--_bc, transparent);
  color:var(--_color, #111);
  background:var(--_bg, transparent);
  box-shadow:var(--_shadow, none);
  transition:transform .14s ease, opacity .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
  text-decoration:none !important;
}
.jm-btn:hover{ color: var(--_color, #111) !important; transform: translateY(-2px); box-shadow:0 10px 28px rgba(0,0,0,.12); }
.jm-btn.is-primary{ --_bg: var(--wp--preset--color--primary, #0f172a); --_color:#fff; --_bc: var(--_bg); --_bw: 1px; }
.jm-btn.is-secondary{ --_bg: transparent; --_bc: var(--_color, currentColor); }
.jm-btn.is-primary:hover{ background: var(--_bg_hover, var(--_bg)); color:#fff !important; border-color: var(--_bc, var(--_bg)); }
.jm-btn.is-secondary.__invert-hover:hover{ background: var(--_color, currentColor); color:#fff !important; border-color: transparent; }
.jm-btn.is-secondary.__no-border{ border-width:0 }
.jm-btn.size-sm{ --_py:.5rem; --_px:.9rem; font-size:calc(var(--_fs,var(--jm-fsize)) * .92) }
.jm-btn.size-lg{ --_py:.85rem; --_px:1.25rem; font-size:calc(var(--_fs,var(--jm-fsize)) * 1.05) }
.jm-btn.size-xl{ --_py:1rem; --_px:1.5rem; font-size:calc(var(--_fs,var(--jm-fsize)) * 1.16) }
.jm-btn.shape-pill{ --_radius:9999px } .jm-btn.shape-rounded{ --_radius:12px } .jm-btn.shape-square{ --_radius:4px }
.jm-btn.__equal{ width: var(--jm-equal-w, auto) }

@media (max-width: 860px){
  .jm-pres__inner{ flex-direction:column; align-items:flex-start; }
  .jm-pres__photo, .jm-pres__body{ width:100%; flex-basis:auto; }
  .jm-pres.__narrow{ max-width:100%; }
  .jm-pres__photo-box{ width: clamp(220px, 75%, 560px); }
}
