/* Les Ateliers Télécom — vidéos des parcours (28 octobre 2026)
   Boutons distincts des liens de programme ; lecture sur action de l'utilisateur. */
.at-video-slot{position:relative;display:block;flex:0 0 auto;min-width:0;isolation:isolate}
.hero-workshop-row .at-video-slot--6{width:83px}
.hero-workshop-row .at-video-slot--9{width:99px}
.at-video-slot > a.preview-duration{display:flex!important}
.at-video-mini{
  display:inline-flex;align-items:center;justify-content:center;position:absolute;
  right:3px;top:3px;z-index:10;width:22px;height:22px;padding:0;border:1.5px solid #fff;
  border-radius:50%;background:#084a83;color:white;font-size:11px;line-height:1;
  box-shadow:0 2px 7px #001b3860;cursor:pointer;transition:transform .18s,background .18s,box-shadow .18s;
}
.at-video-slot--6 .at-video-mini{background:#087e51}
.at-video-mini:hover,.at-video-mini:focus-visible{transform:scale(1.12);background:#0872ce;box-shadow:0 0 0 3px #9aeaff,0 3px 9px #001d4860}
.at-video-slot--6 .at-video-mini:hover,.at-video-slot--6 .at-video-mini:focus-visible{background:#009b66}
.at-video-mini:focus-visible,.at-card-video:focus-visible,.at-detail-video:focus-visible,.at-video-close:focus-visible{outline:3px solid #ffcd56;outline-offset:3px}
/* Le survol éclaire le logo, sans changer sa fonction principale (ouvrir la fiche). */
.at-video-slot:hover .preview-duration,.at-video-slot:focus-within .preview-duration{filter:brightness(1.065)}
.at-video-slot .preview-duration small{padding-right:10px}
.card .c-head .at-card-video{
  position:absolute;top:7px;right:9px;z-index:18;
  display:flex;gap:4px;align-items:center;padding:5px 8px;
  border-radius:17px;border:1px solid #b3f8f5;background:#033e5a;color:#fff;
  font:800 10px/1.1 system-ui,sans-serif;cursor:pointer;
  box-shadow:0 2px 8px #001c354c;transition:background .18s,transform .18s;
}
.card.pro .c-head .at-card-video{background:#064c9b;border-color:#bbddff}
.card .c-head .at-card-video:hover{background:#0783ba;transform:translateY(-1px)}
.card .c-head:hover{filter:brightness(1.075)}
/* Dans les fiches détaillées : coin supérieur droit du bandeau d'introduction. */
.hero .at-detail-video{
  position:absolute;right:14px;top:13px;z-index:8;
  display:inline-flex;align-items:center;gap:7px;
  padding:9px 12px;border-radius:18px;border:1px solid #8fe0ff;
  background:#073d73;color:#fff;font:800 12px/1.2 system-ui,sans-serif;
  box-shadow:0 4px 12px #071b3c4d;cursor:pointer;
  transition:background .2s,transform .2s;
}
.hero .at-detail-video:hover{background:#076eab;transform:translateY(-1px)}
/* Lecteur partagé : visible seulement sur clic, jamais sur chargement de page. */
dialog.at-video-dialog{
  position:fixed;inset:0;margin:auto;width:min(760px,calc(100vw - 24px));max-width:none;
  max-height:min(92dvh,850px);padding:0;overflow:hidden;
  border:1px solid #71c9eb;border-radius:16px;
  background:#061c35;color:#fff;box-shadow:0 20px 70px #00172b9c;
}
dialog.at-video-dialog::backdrop{background:rgba(1,13,34,.78);backdrop-filter:blur(3px)}
.at-video-dialog-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 15px 13px 18px;background:linear-gradient(110deg,#053466,#086b96);
}
.at-video-dialog-head strong{display:block;font:800 15px/1.3 system-ui,sans-serif;letter-spacing:.1px}
.at-video-dialog-head small{display:block;margin-top:4px;color:#c6f2ff;font:500 11px/1.3 system-ui,sans-serif}
.at-video-close{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;padding:0;
  border:1px solid #a3dff6;border-radius:50%;background:#ffffff1d;color:#fff;font-size:25px;cursor:pointer}
.at-video-dialog video{display:block;width:100%;height:auto;max-height:65dvh;aspect-ratio:16/9;object-fit:contain;background:#000}
.at-video-dialog-foot{padding:10px 16px;color:#cee7f8;font:500 11px/1.35 system-ui,sans-serif;background:#092744}
@media screen and (max-width:820px){
  .hero-workshop-row .at-video-slot--6,.hero-workshop-row .at-video-slot--9{width:100%;min-width:0}
  .hero-workshop-row .at-video-slot .preview-duration{width:100%!important;max-width:100%!important}
  .hero-workshop-row .at-video-slot .at-video-mini{width:27px;height:27px;right:4px;top:4px;font-size:13px}
  .hero .at-detail-video{right:10px;top:10px;font-size:11px;padding:7px 10px}
  .at-video-dialog-head strong{font-size:13px}
  .at-video-dialog video{max-height:53dvh}
}
@media print{
 .at-video-mini,.at-card-video,.at-detail-video,.at-video-dialog{display:none!important}
}
@media(prefers-reduced-motion:reduce){.at-video-mini,.at-card-video,.at-detail-video{transition:none!important}}
/* Boutons dans les fenêtres de programme détaillé de la page d'accueil. */
.dialog-head{position:relative}
.dialog-head .at-card-video{
 display:inline-flex;align-items:center;gap:5px;margin:8px 0 0;
 border:1px solid #8bd8fa;border-radius:19px;padding:7px 11px;
 background:#075c90;color:#fff;font:800 11px/1.2 system-ui,sans-serif;cursor:pointer;
}
.dialog-head .at-card-video:hover{background:#087cba}
@media print{.dialog-head .at-card-video{display:none!important}}

/* Mise à jour : « Intro » sur la page d'accueil ; vignette commune dans les fiches. */
.at-video-mini{
  min-width:44px;width:auto;height:23px;right:2px;top:2px;
  border-radius:12px;padding:0 6px;font:850 9px/1 system-ui,sans-serif;
  white-space:nowrap;
}
.card .c-head .at-card-video{
  min-width:49px;justify-content:center;
  font:850 10px/1 system-ui,sans-serif;
}
.at-dialog-thumb,.hero .at-detail-thumb{
  display:block;padding:0;overflow:hidden;position:relative;
  width:151px;aspect-ratio:16/9;
  border:2px solid #b6ecff;border-radius:12px;
  background:#082c54;color:white;
  box-shadow:0 5px 14px #00142e5c;
  cursor:pointer;
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
.at-dialog-thumb img,.at-detail-thumb img{
  display:block;width:100%;height:100%;object-fit:cover;
}
.at-thumb-caption{
  position:absolute;right:0;bottom:0;left:0;
  padding:5px 7px 6px;text-align:center;
  color:#fff;background:linear-gradient(0deg,rgba(1,17,36,.88),rgba(3,34,68,.55));
  font:850 11px/1 system-ui,sans-serif;
}
.at-dialog-thumb{float:right;margin:0 0 12px 16px;z-index:2}
.hero .at-detail-thumb{position:absolute;top:14px;right:14px;z-index:8;width:151px}
.at-dialog-thumb:hover,.hero .at-detail-thumb:hover,
.at-dialog-thumb:focus-visible,.hero .at-detail-thumb:focus-visible{
  transform:translateY(-2px);border-color:#fff;
  box-shadow:0 0 0 3px #4cdfff,0 8px 19px #00142e66;
}
.at-dialog-thumb:focus-visible,.hero .at-detail-thumb:focus-visible{outline:3px solid #ffcd56;outline-offset:3px}
@media screen and (max-width:820px){
 .hero-workshop-row .at-video-slot .at-video-mini{min-width:49px;width:auto;height:26px;padding:0 7px;font-size:10px}
 .hero .at-detail-thumb{top:10px;right:10px;width:118px}
 .at-dialog-thumb{width:124px;margin-left:12px}
}
@media print{.at-dialog-thumb,.hero .at-detail-thumb{display:none!important}}
@media(prefers-reduced-motion:reduce){.at-dialog-thumb,.hero .at-detail-thumb{transition:none!important}}

/* EN-TÊTE RÉSEAUX MOBILES : boutons Intro visibles sans désactiver les liens vers les fiches. */
.hero-workshop-row .at-video-mini{display:inline-flex!important;pointer-events:auto}
.hero-workshop-row .at-video-slot{position:relative;display:block;min-width:0}
@media screen and (min-width:821px){
  .hero-workshop-row .at-video-slot--6{width:83px}
  .hero-workshop-row .at-video-slot--9{width:99px}
}
@media screen and (max-width:820px){
  .hero-workshop-row .at-video-slot{width:100%!important}
  .hero-workshop-row .at-video-slot .preview-duration{width:100%!important}
}
/* Le clic Intro est volontaire ; la carte ouvre toujours le programme. */