.relatifs4e-shell{width:min(1160px,calc(100% - 2rem))}
.relatifs4e-hero{grid-template-columns:minmax(0,1fr) 300px}
.relatifs4e-hero h1{font-size:clamp(2.55rem,6vw,4.6rem)}
.relative-hero-visual{display:grid;gap:1.1rem;align-content:center;min-height:215px;padding:1.4rem;border-radius:22px;background:linear-gradient(145deg,#f3edf6,#eef7f5)}
.relative-axis{position:relative;display:flex;justify-content:space-between;align-items:flex-end;padding:1.7rem .35rem .2rem;border-top:4px solid #795b88;color:#5b4770;font-weight:850}
.relative-axis:before{content:"";position:absolute;left:50%;top:-10px;width:4px;height:20px;border-radius:4px;background:#16786f;transform:translateX(-50%)}
.relative-axis span,.relative-axis strong{position:relative}
.relative-axis span:before,.relative-axis strong:before{content:"";position:absolute;left:50%;top:-1.9rem;width:2px;height:12px;background:#795b88;transform:translateX(-50%)}
.relative-sign-rule{display:flex;align-items:center;justify-content:center;gap:.8rem;padding:1rem;border:1px solid #d5e1df;border-radius:16px;background:#fff;color:#18364c;font-size:1.22rem}
.relative-sign-rule b{color:#795b88}.relative-sign-rule strong{display:grid;width:42px;height:42px;place-items:center;border-radius:12px;background:#e3f4ef;color:#0f655e;font-size:1.45rem}
.progression-note{margin-top:1rem;padding:.9rem 1rem;border-left:4px solid #795b88;border-radius:0 12px 12px 0;background:rgba(241,235,244,.86);color:#425966;line-height:1.55}
.targeted-rule{margin:-.35rem 0 .9rem;color:#5b707d;font-size:.92rem}
.targeted-label{display:flex;min-width:0;flex-direction:column;gap:.16rem}.targeted-label small{color:#795b88;font-size:.72rem;font-weight:850;text-transform:uppercase;letter-spacing:.06em}
.targeted-grid button.review-step{background:linear-gradient(135deg,#fbf8fc,#fff)}
.relatifs4e-card{overflow:visible}
.rel-step-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.25rem 1.4rem 1rem;border-bottom:1px solid #d7e3e1}
.rel-step-head h1{margin:.15rem 0 0;color:#18364c;font-size:clamp(1.75rem,4vw,2.35rem);letter-spacing:-.035em}.rel-step-head p{margin:.45rem 0 0;color:#5b707d}
.rel-step-number{display:grid;flex:0 0 auto;width:48px;height:48px;place-items:center;border-radius:15px;background:#f1ebf4;color:#6f4f7f;font-weight:950}
.rel-body{padding:1.35rem 1.4rem 1.45rem}.rel-prompt{margin:0 0 1rem;font-size:1.06rem;line-height:1.55}.rel-math{font-family:"Cambria Math","STIX Two Math",serif;font-size:1.25em;font-weight:650;letter-spacing:.01em}.rel-expression{margin:1rem 0;padding:1rem 1.1rem;border:1px solid #d7e3e1;border-radius:14px;background:#f8fbfa;color:#14364d;font-family:"Cambria Math","STIX Two Math",serif;font-size:1.35rem;font-weight:700;text-align:center}
.rel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin:1rem 0}.rel-field{display:grid;gap:.4rem;padding:.85rem;border:1px solid #d7e3e1;border-radius:13px;background:#fff}.rel-field label,.rel-field>span{font-size:.86rem;font-weight:850;color:#47606e}.rel-field input,.rel-field select{width:100%;min-height:46px;padding:.65rem .75rem;border:1px solid #b9cbd0;border-radius:9px;background:#fff;color:#18364c;font-size:1rem}
.rel-qcm{display:grid;gap:.65rem;margin:1rem 0}.rel-qcm label{display:flex;align-items:center;gap:.75rem;min-height:52px;padding:.75rem .85rem;border:1px solid #d0dddf;border-radius:12px;background:#fff}.rel-qcm input{width:18px;height:18px}.rel-qcm span{line-height:1.45}
.rel-sign-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid #d7e3e1;border-radius:14px;margin:1rem 0}.rel-sign-table th,.rel-sign-table td{padding:.7rem .8rem;border-bottom:1px solid #e1e8e8;text-align:left}.rel-sign-table tr:last-child td{border-bottom:0}.rel-sign-table th{background:#f5f0f7;color:#60466d;font-size:.86rem}.rel-sign-table select,.rel-sign-table input{min-width:110px;max-width:160px;padding:.48rem;border:1px solid #bccdd1;border-radius:8px;background:white;color:#18364c;font:inherit}
.numberline-wrap{margin:1rem 0;padding:1rem;border:1px solid #d7e3e1;border-radius:14px;background:#fbfcfb}.numberline-wrap svg{display:block;width:100%;height:auto}.numberline-label{font-size:14px;fill:#314e60}.numberline-point{fill:#16786f}.numberline-axis{stroke:#795b88;stroke-width:3}.numberline-tick{stroke:#795b88;stroke-width:2}
.rel-feedback{margin-top:.8rem;padding:.75rem .85rem;border-radius:10px;font-weight:750}.rel-feedback.ok{background:#e7f5ed;color:#216141}.rel-feedback.no{background:#f9ebec;color:#8c343b}
.rel-actions{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem;margin-top:1.1rem}.rel-help{display:flex;flex-wrap:wrap;gap:.6rem}.rel-help button,.rel-submit{min-height:44px;padding:.68rem .95rem;border-radius:10px;font-weight:850}.rel-help button{border:1px solid #c8d7db;background:#fff;color:#18364c}.rel-submit{border:0;background:#16786f;color:#fff}
.rel-method{margin:.85rem 0;padding:.85rem 1rem;border-left:4px solid #2d6fa9;border-radius:0 11px 11px 0;background:#eef5fa;color:#314e60;line-height:1.55}.rel-review-badge{display:inline-flex;margin-bottom:.55rem;padding:.3rem .55rem;border-radius:999px;background:#f1ebf4;color:#6c4e7a;font-size:.72rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
@media(max-width:800px){.relatifs4e-hero{grid-template-columns:1fr}.relative-hero-visual{min-height:160px}.rel-grid{grid-template-columns:1fr}}
@media(max-width:560px){.rel-step-head{padding:1rem}.rel-body{padding:1rem}.rel-sign-table th,.rel-sign-table td{padding:.6rem .45rem}.rel-sign-table select,.rel-sign-table input{min-width:88px;max-width:120px}.rel-actions{align-items:stretch}.rel-help{width:100%}.rel-help button{flex:1}.rel-submit{width:100%}}

/* 0.28.1 — cartes d’activités plus lisibles */
.relatifs4e-targeted-grid{gap:.8rem}
.relatifs4e-targeted-grid button{
  position:relative;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) 24px;
  align-items:center;
  column-gap:.9rem;
  min-height:78px;
  padding:.85rem 1rem;
  overflow:hidden;
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 22px rgba(24,54,76,.045);
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease,background .15s ease;
}
.relatifs4e-targeted-grid button:hover{
  transform:translateY(-1px);
  border-color:#7fb8af;
  background:#f8fcfb;
  box-shadow:0 10px 24px rgba(24,54,76,.075);
}
.relatifs4e-targeted-grid button::after{
  content:"→";
  justify-self:end;
  color:#7a929c;
  font-size:1.05rem;
  font-weight:900;
}
.relatifs4e-targeted-grid button>span:first-child{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:12px;
  background:#e3f4ef;
  color:#0f655e;
  font-size:.92rem;
  font-weight:950;
}
.relatifs4e-targeted-grid button .targeted-label{
  display:flex;
  flex:1 1 auto;
  min-width:0;
  width:auto;
  height:auto;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:.32rem;
  border-radius:0;
  background:transparent;
  color:#17384e;
  font-size:.98rem;
  font-weight:850;
  line-height:1.28;
}
.relatifs4e-targeted-grid button .targeted-label small{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  padding:.22rem .48rem;
  border-radius:999px;
  background:#f1ebf4;
  color:#6d4f7c;
  font-size:.66rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.relatifs4e-targeted-grid button.review-step{
  border-left:4px solid #8a6a98;
  background:linear-gradient(135deg,#fcf9fd,#fff 72%);
}
.relatifs4e-targeted-grid button.review-step>span:first-child{
  background:#f1ebf4;
  color:#6d4f7c;
}
@media(max-width:640px){
  .relatifs4e-targeted-grid button{grid-template-columns:38px minmax(0,1fr) 20px;min-height:70px;padding:.72rem .8rem;column-gap:.7rem}
  .relatifs4e-targeted-grid button>span:first-child{width:38px;height:38px}
  .relatifs4e-targeted-grid button .targeted-label{font-size:.94rem}
}
