/* Scope doux pour éviter les conflits globaux */
.bis-wrap,
.bis-wrap * { box-sizing: border-box; }

/* Panneau texte à gauche */
.info-panel{
  --sep-w:29vw;
  position:absolute; top:50%; left:10vw;
  transform:translateY(-50%) translateX(-12px);
  max-width:30%; border-radius:18px; opacity:0; pointer-events:none;
  transition:opacity .3s ease, transform .35s ease;
}

@media screen and (max-width: 768px) {
  .info-panel{
    top: 80%;
    max-width:100%;
  }
}
.info-panel.visible{ opacity:1; transform:translateY(-50%) translateX(0); pointer-events:auto; }
.info-title{color: white; font-size:clamp(18px,2.2vw,28px)!important; font-weight:700; line-height:1.25; margin:0 0 12px 0; letter-spacing:.2px; padding-right:30px; }
.info-sep{ height:2px; width:0; background:rgba(255,255,255,.7); box-shadow:0 0 6px rgba(255,255,255,.25); transform-origin:left center; transition:width .3s cubic-bezier(.2,.7,.2,1); margin:10px 0 14px 0; }
.info-sep.open{ width:var(--sep-w); }
.info-text{ color: white; font-size:clamp(14px,1.2vw,16px)!important; line-height:1.2; opacity:.9; margin:0; white-space:pre-line; max-width:60ch; padding-right:30px; }

canvas{ cursor:default; margin: 6rem 0; }
canvas.hover{ cursor:pointer; }


button{ background-color:#fff; color:#000; border:none; padding:10px 20px; border-radius:5px; cursor:pointer; margin-top:20px; }
.info-panel button {color: black !important; background-color: #fff!important; padding: 0.2em 0.8em;}

.canva-container{ position:relative; }

/* Contact centre */
.contact-content{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  z-index:5; text-align:center; padding:40px 60px; border-radius:20px;
  opacity:0; visibility:hidden; transition:opacity .5s ease, visibility .5s ease, transform .5s ease;
  max-width:500px; pointer-events:none;
}
.contact-content.visible{ opacity:1; visibility:visible; pointer-events:none; }
.contact-content a {
  padding: 0.5em;
  background-color: white;
  border-radius: 5px;
  color: black;
  margin-top: 2em;
  pointer-events: auto;
}
.contact-title{ font-size:2.5rem; font-weight:700; color:#fff; margin:0 0 20px 0; line-height:1.2; }
.contact-description{ font-size:1.2rem; color:#fff; margin:0 0 1em; line-height:1.2; }