/* 14-project-detail.css
   Pages individuelles de projet (elva/projets/*.html) */

.detail{padding-block:clamp(48px,7vw,84px)}

.detail-back{
  display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);
  margin-bottom:28px;transition:color .18s ease;
}
.detail-back svg{width:15px;height:15px;transition:transform .18s ease}
.detail-back:hover{color:var(--text)}
.detail-back:hover svg{transform:translateX(-3px)}

.detail-head{max-width:70ch}
.detail-kicker{font-family:var(--mono);font-size:12.5px;color:var(--blue);letter-spacing:.04em}
.detail-title{margin-top:12px;font-size:clamp(32px,5vw,52px)}
.detail-lead{margin-top:16px;color:var(--muted);font-size:16.5px;line-height:1.7}

.detail-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:22px}

/* galerie */
.detail-gallery{
  margin-top:40px;display:grid;gap:14px;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.detail-gallery.single{grid-template-columns:1fr;max-width:760px}
.gallery-item{
  border:1px solid var(--line);border-radius:14px;background:#08090d;
  padding:16px;display:flex;align-items:center;justify-content:center;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:14px 14px;
}
.gallery-item img{width:100%;height:auto;max-height:480px;object-fit:contain;display:block;border-radius:6px}

/* placeholder pour projet sans capture pour l'instant */
.detail-placeholder{
  margin-top:40px;border:1px dashed var(--line-2);border-radius:14px;
  min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;background:var(--bg-3);
}
.detail-placeholder span{
  font-family:var(--display);font-size:40px;font-weight:500;letter-spacing:-.03em;color:#23252d;
}
.detail-placeholder p{font-family:var(--mono);font-size:12.5px;color:var(--muted-2)}

/* corps de texte */
.detail-body{margin-top:44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:clamp(28px,5vw,56px)}
.detail-body p{color:var(--muted);font-size:15.5px;line-height:1.75;max-width:62ch}
.detail-body p + p{margin-top:16px}

.detail-meta{align-self:start;border:1px solid var(--line);border-radius:14px;background:var(--card);padding:22px}
.detail-meta dt{font-family:var(--mono);font-size:11.5px;color:var(--muted-2);letter-spacing:.03em}
.detail-meta dd{margin:6px 0 0;font-size:14.5px;font-weight:500}
.detail-meta dd + dt{margin-top:18px}

/* CTA de fin de page */
.detail-cta{
  margin-top:56px;border:1px solid var(--line);border-radius:16px;
  background:linear-gradient(var(--blue-soft),var(--blue-soft)),var(--card);
  padding:clamp(24px,4vw,34px);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;
}
.detail-cta h3{font-size:20px;font-family:var(--sans);font-weight:600;letter-spacing:-.01em}
.detail-cta p{margin-top:6px;color:var(--muted);font-size:14px}

@media (max-width:820px){
  .detail-body{grid-template-columns:1fr}
}