/* Integral reste réservée aux cartes de projets et aux noms d'outils. */
.works-item .title,.projet-card .pt,.tech-stack-item .title{font-family:'Integral CF','Rajdhani',sans-serif;font-weight:700;letter-spacing:0;line-height:1.25}
.works-item .title{font-size:clamp(22px,2.3vw,30px)}
.projet-card .pt{font-size:clamp(20px,2.1vw,28px)}
.tech-stack-item .title{font-size:clamp(17px,1.5vw,22px)}

/* L'intro ne bloque ni le défilement ni le chargement des médias. */
.cobra-intro{position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:#0b0a0e;pointer-events:none;animation:cobraIntroOut .3s .65s forwards}
.cobra-intro img{width:64px;animation:cobraMark .55s ease-out both}
.cobra-intro span{font:700 14px/1.3 'Rajdhani',sans-serif;letter-spacing:.25em;text-transform:uppercase;color:#fff}
@keyframes cobraMark{from{opacity:0;transform:translateY(12px) scale(.9)}to{opacity:1;transform:none}}
@keyframes cobraIntroOut{to{opacity:0;visibility:hidden}}

/* Viewers dans la couche supérieure du navigateur : aucun parent ne les découpe. */
.media-viewer{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(9,8,13,.91);color:#fff;overflow:hidden;font:500 16px/1.4 'Rajdhani',sans-serif}
.media-viewer::backdrop{background:rgba(0,0,0,.6);backdrop-filter:blur(16px)}
.media-content{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;padding:20px 24px 24px;gap:16px;background:transparent}
.media-content:fullscreen{background:#09080d}
.media-toolbar{display:flex;align-items:center;gap:10px;width:100%;flex:none;z-index:2}
.media-caption{margin-right:auto;min-width:0;max-width:55%;color:rgba(255,255,255,.85)}
.media-caption span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.media-count{font-size:13px;color:rgba(255,255,255,.5)}
.media-viewer button,.media-original{display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:44px;height:44px;padding:0 12px;border-radius:50px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;font:600 16px/1 'Rajdhani',sans-serif;cursor:pointer;text-decoration:none;transition:background .2s}
.media-viewer button:hover,.media-original:hover{background:rgba(179,102,242,.3);color:#fff}
.media-viewer button:focus-visible,.media-original:focus-visible,.media-viewer input:focus-visible{outline:2px solid #d9b0ff;outline-offset:4px}
.media-viewer button:disabled{opacity:.3;cursor:default}
.media-viewer [hidden]{display:none!important}
.media-stage{position:relative;flex:1;min-height:0;min-width:0;width:100%;display:flex;align-items:center;justify-content:center;overflow:auto;border-radius:12px}
.media-image,.media-video{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:10px;box-shadow:0 16px 60px rgba(0,0,0,.35)}
.media-video{background:#050505}
.media-stage.is-zoomed{display:block;text-align:center}
.media-stage.is-zoomed .media-image{max-width:none;max-height:none;margin:auto;cursor:zoom-out}
.media-image{cursor:zoom-in}
.media-rail{display:flex;align-items:center;gap:14px;flex:none;width:min(680px,100%);padding:12px 16px;border:1px solid rgba(255,255,255,.24);border-radius:28px;background:linear-gradient(130deg,rgba(255,255,255,.14),rgba(110,95,130,.15));backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);box-shadow:0 12px 40px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.15);z-index:2}
.media-rail button{border:0;background:rgba(255,255,255,.08);padding:0 10px}
.media-seek{flex:1;min-width:30px;accent-color:#c48bf7;height:32px;cursor:pointer}
.media-time{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:14px}
.media-status{flex:none;min-height:20px;font-size:14px;color:rgba(255,255,255,.65);text-align:center}
.video-tile:focus-visible{outline:2px solid #c48bf7;outline-offset:5px}
@media(max-width:600px){.media-content{padding:12px 12px max(12px,env(safe-area-inset-bottom));gap:12px}.media-toolbar{gap:6px;flex-wrap:wrap}.media-caption{max-width:none;flex:1}.media-toolbar button,.media-original{padding:0 10px;min-width:40px;height:40px}.media-rail{gap:8px;padding:10px;border-radius:24px;flex-wrap:wrap}.media-time{font-size:12px}.media-seek{order:5;flex-basis:100%;width:100%}.media-fullscreen{margin-left:auto}.media-original{font-size:13px}.media-status{font-size:12px}}
@media(prefers-reduced-motion:reduce){.cobra-intro{display:none}.media-viewer button{transition:none}}
