:root{
  --mlab-orange:#DA5300;
  --mlab-violet:#5D2DE6;
  --mlab-beige:#F1E6D4;
  --mlab-noir:#1d1d1f;
  --mlab-gris:#6b6b6d;
  --mlab-blanc:#ffffff;
  --mlab-rayon:18px;
  --mlab-max:1200px;
  --mlab-max-achact:1340px;
  --mlab-anim-dur:360ms;
  --mlab-anim-ease:cubic-bezier(.22,.61,.36,1);
}

@font-face{font-family:'Silka';src:url('../font/Silka-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Silka SemiBold';src:url('../font/Silka-SemiBold.otf') format('opentype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Silka Bold';src:url('../font/Silka-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Silka';src:url('../font/Silka-RegularItalic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Silka,system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,'Apple Color Emoji','Segoe UI Emoji';color:var(--mlab-noir);background:#fff;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:inherit}

.mlab-conteneur{width:min(100% - 32px, var(--mlab-max));margin-inline:auto;margin-top:60px}
.mlab-conteneur-achact{width:min(100% - 32px, var(--mlab-max));margin-inline:auto}
@media (min-width:768px){.mlab-conteneur-achact{width:min(100% - 32px, var(--mlab-max-achact))}}

.mt-70{margin-top:70px}

.mlab-hero{position:relative;overflow:hidden}
.mlab-hero .mlab-conteneur{position:relative;z-index:1}
.mlab-entete-hero{display:flex;align-items:center;gap:12px;padding-top:25px}
@media (min-width:768px){.mlab-entete-hero{padding-top:70px}}
.mlab-logo{width:100px}
@media (min-width:768px){.mlab-logo{width:163px}}
.mlab-hero::before{content:'';position:absolute;inset:0 0 auto auto;height:100%;width:58%;background:var(--mlab-beige);border-radius:0 0 0 120px;z-index:0}
.mlab-titre,.mlab-sous-titre{font-family:'Silka Bold',system-ui,-apple-system,'Segoe UI',Roboto;font-size:clamp(35px,4.5vw,60px);line-height:1.08;font-weight:900;color:var(--mlab-orange);letter-spacing:-.4px;margin:8px 0}
.mlab-intro{max-width:720px;font-size:24px;margin:25px 0}
@media (min-width:768px){.mlab-intro{font-size:30px;margin:35px 0 30px}}

.mlab-section-cartes{position:relative;padding-block:16px 56px}
.mlab-section-cartes .mlab-conteneur{position:relative;z-index:1}
.mlab-section-cartes{
  --mlab-orange-top:0px;--mlab-orange-left:0px;--mlab-orange-height:0px;
  --mlab-purple-top:0px;--mlab-purple-height:0px;--mlab-purple-right:0px;
}
.mlab-section-cartes::before{
  content:"";position:absolute;top:var(--mlab-orange-top);left:var(--mlab-orange-left);right:0;
  height:var(--mlab-orange-height);background:var(--mlab-orange);border-radius:20px 0 0 20px;z-index:0;pointer-events:none;opacity:.95
}
.mlab-section-cartes::after{
  content:"";position:absolute;top:var(--mlab-purple-top);left:0;right:var(--mlab-purple-right);
  height:var(--mlab-purple-height);background:var(--mlab-violet);z-index:0;pointer-events:none;border-radius:0 40px 0 0
}

.mlab-liste-accordeon{display:grid;grid-template-columns:1fr;gap:20px;margin-top:16px}

.mlab-carte{
  position:relative;
  display:grid;
  grid-template-columns:104px minmax(0,1fr) 56px;
  grid-template-areas:
    "img   title   btn"
    "img   content btn";
  align-items:center;
  gap:28px;
  background:#FCF9F3;
  border-radius:10px;
  padding:13px 27px 12px 13px;
  box-shadow:0 1px 0 rgba(0,0,0,.05),0 8px 20px rgba(0,0,0,.05);
  width:100%;max-width:100%;
}
.mlab-carte h4{color:var(--mlab-orange);font-family:'Silka SemiBold';font-weight:600;font-size:24px}

.mlab-carte{
  position:relative;
  display:grid;
  grid-template-columns:104px minmax(0,1fr) 56px;
  grid-template-areas:
    "img   title   btn"
    "img   content btn";
  align-items:center;
  gap:28px;
  background:#FCF9F3;
  border-radius:10px;
  padding:13px 27px 12px 13px;
  box-shadow:0 1px 0 rgba(0,0,0,.05),0 8px 20px rgba(0,0,0,.05);
  width:100%;max-width:100%;
}

.mlab-carte:hover .mlab-bouton-plus{background:var(--mlab-orange);color:#fff;outline:auto;outline-color:#000;outline-offset:3px;margin-top:25px}

.mlab-vignette{grid-area:img;width:88px;height:88px;border-radius:12px;overflow:hidden;background:#FCF9F3}

.mlab-texte-carte{
  grid-area:title;
  align-self:center;
  min-width:0;
  font-weight:700;
}
.mlab-titre-carte{
  font-family:'Silka Bold',system-ui,-apple-system,'Segoe UI',Roboto;
  font-weight:700;margin:0;font-size:30px;line-height:130%;color:var(--mlab-violet);
  max-width:none;
  padding-top:18px;

}

.mlab-bouton-plus{
  align-self:start;
  grid-area:btn;justify-self:end;
  display:inline-grid;place-items:center;width:40px;height:40px;border:none;border-radius:999px;
  background:var(--mlab-violet);color:#fff;cursor:pointer;box-shadow:0 2px 10px rgba(93,45,230,.25);
  transition:transform .15s ease, box-shadow .2s ease;
  margin-top:25px;
}
.mlab-bouton-plus:hover{background:var(--mlab-orange);color:#fff;margin-top:25px}
.mlab-bouton-plus:focus-visible{background:var(--mlab-orange);color:#fff;outline:auto;outline-color:#000;outline-offset:3px;margin-top:25px}
.mlab-icone{width:20px;height:20px;display:block}

.mlab-carte[aria-expanded="true"]{
  grid-template-columns:clamp(160px,22vw,240px) minmax(0,1fr) 56px;
  grid-template-areas:
    "img   title   btn"
    "img   content btn";
  align-items:start;
}
.mlab-carte[aria-expanded="true"] .mlab-texte-carte{align-self:start}

.mlab-carte[aria-expanded="true"] .mlab-vignette{
  width:clamp(144px,20vw,240px);height:clamp(144px,20vw,240px);
  transition:width .2s ease,height .2s ease,transform .2s ease
}
.mlab-carte[aria-expanded="true"] .mlab-vignette img{transform:scale(1.01);transition:transform .2s ease}
.mlab-carte[aria-expanded="true"] .mlab-bouton-plus{margin-top:25px}

.mlab-contenu{
  grid-area:content;display:block;overflow:hidden;height:0;opacity:0;visibility:hidden;
  margin-top:0;padding-top:0;padding-bottom:0;
  transition:
    height var(--mlab-anim-dur) var(--mlab-anim-ease),
    opacity 220ms ease,
    margin-top var(--mlab-anim-dur) ease,
    padding-top var(--mlab-anim-dur) ease,
    padding-bottom var(--mlab-anim-dur) ease;
  will-change:height,opacity
}
.mlab-carte[aria-expanded="true"] .mlab-contenu{visibility:visible;margin-top:10px;padding-top:16px;padding-bottom:16px}
.mlab-contenu .mlab-texte-contenu{max-width:68ch;color:var(--mlab-noir)}
.mlab-contenu .action{font-family:'Silka SemiBold',system-ui,-apple-system,'Segoe UI',Roboto;font-weight:600;color:#000}

@media (prefers-reduced-motion:reduce){.mlab-contenu{transition:none !important}}

@media (max-width:600px){
  .mlab-carte,
  .mlab-carte[aria-expanded="true"]{
    grid-template-columns:minmax(160px,1fr) 56px;
    grid-template-areas:
      "img btn"
      "title btn"
      "content content";
    align-items:center;gap:12px;padding:12px
  }
  .mlab-vignette,
  .mlab-carte[aria-expanded="true"] .mlab-vignette{grid-area:img;width:max-content;height:auto;aspect-ratio:1/1;border-radius:10px}
  .mlab-texte-carte{grid-area:title;align-self:center}
  .mlab-bouton-plus{grid-area:btn;align-self:start;justify-self:end;z-index:999}
  .mlab-contenu{grid-area:content;margin-top:6px;padding:12px}
  .mlab-titre-carte{font-size:18px;line-height:24px;}
  .mlab-carte[aria-expanded="true"]{grid-template-columns:minmax(200px,1fr) 56px}
}

.mlab-pied{padding:48px 0 80px;text-align:center;color:#fff;background:linear-gradient(0deg,var(--mlab-violet),#6d51ff)}

.mlab-section-cartes > .mlab-conteneur{
  width:min(100% - 32px, var(--mlab-max));
  max-width:var(--mlab-max);
  margin-inline:auto;
  padding-inline:0;
}

.mlab-carte{cursor:pointer}
.mlab-contenu,
.mlab-contenu *{cursor:auto}
.mlab-contenu a,
.mlab-contenu a *{cursor:pointer}
