/* E3BAT — Modales d'etude de cas + galerie */
/* ============ CASE STUDY DIALOG ============ */
dialog.case{
  border:0;padding:0;max-width:min(52rem,92vw);width:100%;
  max-height:92vh;max-height:92dvh;background:var(--paper);color:var(--ink);
}
dialog.case::backdrop{background:rgba(29,29,27,.82)}
.case-head{background:var(--ink);color:#fff;padding:1rem clamp(1.2rem,3vw,1.8rem) 1.1rem;position:relative}
.case-head .eyebrow{margin-bottom:.4rem;font-size:.66rem}
.case-head h3{font-size:clamp(1.25rem,2.4vw,1.75rem);font-weight:800;font-variation-settings:"wdth" 70;text-transform:uppercase;line-height:1;padding-right:3rem}
.case-close{
  position:absolute;top:.85rem;right:.9rem;background:none;border:1px solid rgba(167,168,169,.4);
  color:#fff;width:2.1rem;height:2.1rem;display:grid;place-items:center;
}
.case-close:hover{background:var(--orange);border-color:var(--orange)}
.case-specs{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(7.5rem,1fr));
  border-bottom:1px solid var(--hair);
}
.case-specs div{padding:.6rem 1rem;border-right:1px solid var(--hair)}
.case-specs span{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--chrome);display:block;margin-bottom:.1rem}
.case-specs b{font-weight:700;font-size:.85rem;white-space:nowrap}
.case-body{padding:clamp(1.3rem,3vw,2rem);display:grid;gap:1.4rem}
.case-body h4{
  font-family:var(--font-mono);font-size:.75rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--orange);margin-bottom:.6rem;
}
.case-body p{color:#4b4b48;max-width:60ch}

/* Galerie d'étude de cas */
.case-gallery{border-bottom:1px solid var(--hair)}
.g-main{position:relative;aspect-ratio:16/9;max-height:44vh;max-height:44dvh;width:100%;background:var(--ink)}
.g-slide{position:absolute;inset:0;opacity:0;transition:opacity .3s ease}
.g-slide.on{opacity:1}
.g-slide svg,.g-slide img{width:100%;height:100%}
.g-slide img{object-fit:cover}
.g-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:2.5rem;height:2.5rem;display:grid;place-items:center;
  background:rgba(29,29,27,.72);border:1px solid rgba(167,168,169,.45);color:#fff;
  transition:background .15s,border-color .15s;
}
.g-nav:hover{background:var(--orange);border-color:var(--orange)}
.g-nav svg{width:1.1rem;height:1.1rem}
.g-prev{left:.7rem}
.g-next{right:.7rem}
.g-count{
  position:absolute;top:.7rem;right:.7rem;z-index:2;
  font-family:var(--font-mono);font-size:.66rem;letter-spacing:.14em;
  color:#fff;background:rgba(29,29,27,.72);padding:.3rem .6rem;
}
.g-caption{
  position:absolute;left:0;bottom:0;
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;background:rgba(29,29,27,.85);
  padding:.5rem .9rem;
}
.g-thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(4.2rem,1fr));gap:1px;background:var(--hair)}
.g-thumb{
  position:relative;background:var(--ink);border:0;padding:0;
  aspect-ratio:16/9;overflow:hidden;cursor:pointer;
}
.g-thumb svg,.g-thumb img{width:100%;height:100%;opacity:.45;transition:opacity .2s}
.g-thumb img{object-fit:cover}
.g-thumb:hover svg,.g-thumb:hover img{opacity:.75}
.g-thumb.on svg,.g-thumb.on img{opacity:1}
.g-thumb.on::after{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:var(--orange)}
.project:has([data-case]) .proj-media{cursor:pointer}