/* Unipop — direction visuelle : encre froide, papier, cyan du logo,
   Familjen Grotesk (titrage) / Source Serif 4 (lecture) / IBM Plex Mono (données). */

:root{
  --encre:#101418;
  --cyan:#3FC0EB;
  --cyan-deep:#0B4A63;
  --papier:#F1F2F0;
  --molasse:#A39B8C;
  --molasse-pale:#DDD8CE;
  --display:'Familjen Grotesk','Helvetica Neue',Arial,sans-serif;
  --body:'Source Serif 4',Georgia,serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --gut:clamp(18px,4vw,56px);
}

*{box-sizing:border-box}
body{margin:0;background:var(--papier);color:var(--encre);
  font-family:var(--body);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2.5px solid var(--cyan);outline-offset:3px}

.unipop-wrap{max-width:1240px;margin:0 auto;padding:0 var(--gut)}
.unipop-mono{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}

/* ---- en-tête ---- */
.unipop-top{position:sticky;top:0;z-index:60;background:rgba(241,242,240,.88);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--molasse-pale)}
.unipop-top__in{max-width:1240px;margin:0 auto;padding:10px var(--gut);
  display:flex;align-items:center;gap:22px}
.unipop-top__logo img{height:52px;width:auto}
.unipop-nav{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
.unipop-nav ul{display:flex;gap:2px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.unipop-nav a{font-family:var(--display);font-weight:600;font-size:15px;text-decoration:none;
  padding:8px 13px;border-radius:100px;transition:.18s}
.unipop-nav a:hover,.unipop-nav .current-menu-item a{background:var(--encre);color:var(--papier)}

/* ---- bandeau d'archive ---- */
.unipop-archhead{padding:clamp(34px,5vw,64px) 0 clamp(20px,3vw,34px)}
.unipop-archhead h1{font-family:var(--display);font-weight:700;letter-spacing:-.025em;
  font-size:clamp(32px,5.4vw,58px);line-height:1.02;margin:12px 0 10px}
.unipop-archhead .unipop-mono{color:var(--cyan-deep)}
.unipop-archhead p{max-width:52ch;color:#31383e;margin:0}

/* ---- filtres ---- */
.unipop-filters{position:sticky;top:73px;z-index:50;background:var(--papier);
  border-top:1px solid var(--encre);border-bottom:1px solid var(--molasse-pale)}
.unipop-filters__in{max-width:1240px;margin:0 auto;padding:11px var(--gut);
  display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.unipop-chip{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;text-decoration:none;padding:7px 13px;border:1px solid var(--molasse);
  border-radius:100px;color:#4a5158;transition:.18s}
.unipop-chip:hover{border-color:var(--encre);color:var(--encre)}
.unipop-chip--on{background:var(--encre);border-color:var(--encre);color:var(--papier)}
.unipop-filters__count{margin-left:auto;font-family:var(--mono);font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--molasse)}

/* ---- grille ---- */
.unipop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(288px,1fr));
  gap:1px;background:var(--molasse-pale);border-bottom:1px solid var(--molasse-pale)}
.unipop-card{background:var(--papier);text-decoration:none;display:flex;flex-direction:column;
  padding-bottom:22px;transition:background .2s}
.unipop-card:hover{background:#fff}
.unipop-card__media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--molasse-pale)}
.unipop-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.unipop-card:hover .unipop-card__media img{transform:scale(1.045)}
.unipop-card__placeholder{display:grid;place-items:center;width:100%;height:100%;
  font-family:var(--display);font-weight:700;font-size:64px;color:var(--molasse)}
.unipop-card__badge{position:absolute;left:0;bottom:0;background:var(--cyan);color:var(--encre);
  font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;padding:5px 10px}
.unipop-card__badge--demand{background:var(--encre);color:var(--papier)}
.unipop-card__body{padding:16px 18px 0;display:flex;flex-direction:column;flex:1}
.unipop-card__dom{color:var(--cyan-deep);font-family:var(--mono);font-size:10px;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;margin:0 0 9px}
.unipop-card__body h2{font-family:var(--display);font-weight:700;font-size:21px;line-height:1.16;
  letter-spacing:-.012em;margin:0 0 14px}
.unipop-card__meta{margin-top:auto;padding-top:13px;border-top:1px solid var(--molasse-pale);
  display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.unipop-card__when{font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:#4a5158}
.unipop-card__price{font-family:var(--display);font-weight:700;font-size:17px;white-space:nowrap}

.unipop-empty{padding:70px 0;text-align:center;color:var(--molasse);
  font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase}

.unipop-pagination{padding:26px 0 40px;display:flex;gap:8px;justify-content:center}
.unipop-pagination .page-numbers{font-family:var(--mono);font-size:12px;text-decoration:none;
  padding:8px 13px;border:1px solid var(--molasse);border-radius:100px}
.unipop-pagination .current{background:var(--encre);border-color:var(--encre);color:var(--papier)}

/* ---- fiche de cours ---- */
.unipop-single{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);
  padding:clamp(28px,4vw,52px) 0}
.unipop-single__code{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  color:var(--molasse);margin:0 0 12px}
.unipop-single h1{font-family:var(--display);font-weight:700;letter-spacing:-.024em;
  font-size:clamp(30px,4.6vw,46px);line-height:1.05;margin:0 0 22px}
.unipop-single__media{aspect-ratio:16/10;overflow:hidden;background:var(--molasse-pale);position:relative}
.unipop-single__media img{width:100%;height:100%;object-fit:cover}

.unipop-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--molasse-pale);border:1px solid var(--molasse-pale);margin:0 0 28px}
.unipop-fact{background:var(--papier);padding:13px 15px}
.unipop-fact span{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--molasse);margin-bottom:4px}
.unipop-fact b{font-family:var(--display);font-weight:600;font-size:15px;line-height:1.3}

.unipop-single h2.unipop-sect{font-family:var(--mono);font-size:10.5px;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--cyan-deep);
  margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--encre)}
.unipop-desc p{margin:0 0 15px}

.unipop-demand-note{font-family:var(--mono);font-size:11px;letter-spacing:.06em;
  color:var(--cyan-deep);margin:-12px 0 24px}

.unipop-teacher{display:flex;align-items:center;gap:14px;margin-top:26px;
  padding:16px;background:rgba(255,255,255,.65);border-left:3px solid var(--cyan)}
.unipop-teacher img{width:58px;height:58px;object-fit:cover;border-radius:50%}
.unipop-teacher b{font-family:var(--display)}
.unipop-teacher span{display:block;font-family:var(--mono);font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--molasse)}

/* ---- inscription ---- */
.unipop-register{margin-top:30px;border-top:1px solid var(--encre);padding-top:22px}
.unipop-register__bar{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.unipop-register__price b{display:block;font-family:var(--display);font-size:26px;font-weight:700;line-height:1.1}
.unipop-register__price span{font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--molasse)}
a.welante-course-book{margin-left:auto;background:var(--encre);color:var(--papier);
  font-family:var(--display);font-weight:700;font-size:16px;text-decoration:none;
  padding:14px 30px;border-radius:100px;transition:.2s;white-space:nowrap}
a.welante-course-book:hover{background:var(--cyan);color:var(--encre)}
.unipop-places-note{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:#4a5158}
.unipop-places-note--full{color:#B3261E}

/* formulaire injecté par le JS Welante */
#d--form-course{margin-top:8px}
#d--form-course .custom-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:4px}
#d--form-course .custom-row > div{flex:1;min-width:220px}
#d--form-course h5{font-family:var(--display);font-size:18px;font-weight:700;margin:20px 0 10px}
#d--form-course label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--molasse);margin:10px 0 4px}
#d--form-course input[type=text],#d--form-course input[type=email],
#d--form-course input[type=tel],#d--form-course input[type=number],
#d--form-course select,#d--form-course textarea{
  width:100%;font-family:var(--body);font-size:16px;padding:11px 13px;background:#fff;
  border:1px solid var(--molasse-pale);border-radius:4px;color:var(--encre)}
#d--form-course input:focus,#d--form-course select:focus{border-color:var(--cyan);outline:none;
  box-shadow:0 0 0 3px rgba(63,192,235,.28)}
#d--form-course .btn,#d--form-course button,#d--form-course input[type=submit]{
  background:var(--encre);color:var(--papier);font-family:var(--display);font-weight:700;
  font-size:15px;border:0;cursor:pointer;padding:12px 26px;border-radius:100px;margin-top:14px}
#d--form-course .btn:hover{background:var(--cyan);color:var(--encre)}
#d--form-course .alert,#d--form-course .has-error .help-block{color:#B3261E;
  font-family:var(--mono);font-size:11px}
#d--form-course .hidden{display:none}

/* ---- pied ---- */
.unipop-foot{margin-top:40px;padding:36px 0 52px;border-top:1px solid var(--molasse-pale)}
.unipop-foot .unipop-mono{color:var(--molasse);line-height:1.9}

@media (max-width:860px){
  .unipop-single{grid-template-columns:1fr}
  .unipop-facts{grid-template-columns:repeat(2,1fr)}
  .unipop-filters{top:69px}
  .unipop-top__logo img{height:42px}
}