/* ============================================================
   CHARTE GRAPHIQUE WEB v2 — style éditorial (référence : hbs.edu),
   dégradés de bleu et couleurs de la RDC (DEC-036, remplace la
   typographie et la palette de DEC-034).
   Référence : docs/uxui/12_CHARTE_GRAPHIQUE_WEB.md
   Chargée en dernier sur les pages publiques : redéfinit les variables
   (tout le site suit) puis les composants. Sélecteurs préfixés
   « html body » quand la page déclare ses propres styles en ligne
   (accueil) : ils passent devant sans !important.
   ============================================================ */

:root {
    /* Drapeau de la RDC : bleu ciel, rouge, jaune ; bleu nuit pour la profondeur */
    --ck-navy: #0b1f4d;        /* en-têtes sombres, pied de page : 15,9:1 avec le blanc */
    --ck-blue: #0062cc;        /* liens et boutons : 5,8:1 sur blanc (AA) */
    --ck-blue-700: #0050a8;
    --ck-sky: #007fff;         /* bleu ciel du drapeau : aplats, dégradés, grands titres seulement (3,8:1) */
    --ck-sky-50: #eaf3ff;
    --ck-sky-200: #9ccbff;     /* accents sur fond sombre */
    --ck-red: #ce1021;         /* rouge du drapeau : 5,6:1 sur blanc */
    --ck-yellow: #f7d618;      /* jaune du drapeau : action principale (S'inscrire), texte bleu nuit dessus : 11:1 */
    --ck-yellow-600: #e6c400;
    --ck-ink: #101828;         /* texte : 16,4:1 sur le fond de page */
    --ck-muted: #4a5568;       /* texte secondaire : 7:1 sur le fond de page */
    --ck-line: #d9dee8;
    --ck-bg: #f4f6fa;          /* fond de page légèrement teinté */
    --ck-white: #ffffff;

    --ck-grad: linear-gradient(135deg, #0b1f4d 0%, #0050a8 58%, #007fff 100%);
    --ck-grad-deep: linear-gradient(160deg, #0b1f4d 0%, #0a2f73 100%);

    --ck-display: 'Inter Tight', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    --ck-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    --ck-header-h: 96px;
    --ck-radius: 2px;

    /* Anciennes variables du site → charte */
    --uckim-blue: var(--ck-blue);
    --uckim-blue-hover: var(--ck-blue-700);
    --uckim-blue-light: var(--ck-sky-50);
    --uckim-blue-dark: var(--ck-navy);
    --uckim-blue-deeper: var(--ck-navy);
    --uckim-gold: var(--ck-red);
    --uckim-gold-light: var(--ck-red);
    --uckim-gold-dim: rgba(206, 16, 33, .10);
    --uckim-charcoal: var(--ck-ink);
    --uckim-red: var(--ck-red);
    --uckim-border: var(--ck-line);
    --uckim-header-h: var(--ck-header-h);
    --uckim-radius: var(--ck-radius);
    --uckim-radius-sm: var(--ck-radius);
    --uckim-radius-md: var(--ck-radius);
    --uckim-radius-lg: var(--ck-radius);
    --uckim-shadow: none;
    --uckim-shadow-sm: none;
    --uckim-shadow-lg: 0 12px 32px rgba(11, 31, 77, .12);
    --uckim-glass-bg: var(--ck-white);
    --uckim-glass-border: var(--ck-line);
    --uckim-text-secondary: var(--ck-ink);
    --uckim-text-primary: var(--ck-ink);
    --font-primary: var(--ck-sans);
    --font-secondary: var(--ck-sans);
    --uckim-font-serif: var(--ck-display);
    --uckim-font-sans: var(--ck-sans);
    --ms-gray-60: var(--ck-muted);
}

/* ---------- Typographie ---------- */
html body {
    font-family: var(--ck-sans);
    font-size: 1.03rem;
    line-height: 1.6;
    color: var(--ck-ink);
    background: var(--ck-bg);
    -webkit-font-smoothing: antialiased;
}
html body h1, html body h2, html body h3, html body h4,
html body .ms-section-title, html body .ms-hero-title, html body .ms-page-hero h1 {
    font-family: var(--ck-display);
    font-weight: 700;
    letter-spacing: -0.025em;
    text-transform: none;
    color: inherit;
}
html body p { line-height: 1.6; }
html body a { color: var(--ck-blue); text-underline-offset: 4px; }
html body a:hover { color: var(--ck-navy); }
html body :focus-visible { outline: 3px solid var(--ck-yellow); outline-offset: 2px; box-shadow: 0 0 0 5px var(--ck-navy); }

/* Titres de section : grands, serrés, sans ornement (style éditorial) */
html body .ms-section { padding: 96px 0; }
html body .ms-section-title {
    font-size: clamp(2rem, 1.3rem + 2.2vw, 3rem);
    line-height: 1.05;
    letter-spacing: -0.035em;
    color: var(--ck-ink);
    margin-bottom: 14px;
    text-wrap: balance;
}
html body .ms-section-title::after { display: none; }
html body .ms-section-title-light, html body .hm-head-light .ms-section-title { color: #fff; }
html body .ms-section-subtitle { font-size: 1.08rem; color: var(--ck-muted); max-width: 64ch; }
html body .hm-head { margin-bottom: 44px; align-items: flex-end; }
html body .hm-more, html body .uk-card-more { color: var(--ck-ink); font-weight: 600; font-size: 1rem; text-decoration: none; }
html body .hm-more:hover, html body .uk-card-more:hover { color: var(--ck-blue); text-decoration: underline; }

/* Casse normale partout (le style ne met plus de capitales) */
html body .ms-formation-title, html body .hm-kicker, html body .hm-stat span, html body .uk-etat,
html body .uk-subnav-label, html body .hm-live-side h3, html body .ms-footer-title, html body .uckim-footer-brand-sub,
html body .uckim-live-pill, html body .dir-live-badge, html body .ms-contact-info-label, html body .hm-une-kicker, html body .ms-footer-partenaires-label {
    text-transform: none;
    letter-spacing: 0;
}

/* Pas d'apparitions animées section par section */
html body [data-aos] { opacity: 1 !important; transform: none !important; transition: none !important; }

/* ---------- En-tête blanc, blason et nom sur plusieurs lignes ---------- */
html body .uckim-header {
    background: var(--ck-white);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: 1px solid var(--ck-line);
    box-shadow: none;
    height: auto;
}
/* Pas de filet aux couleurs du drapeau (DEC-037) : institution académique privée, pas un site de l'État */
html body .uckim-header::before, html body .uckim-header::after, html body .ms-footer::before { display: none; }
html body .uckim-header.scrolled { background: var(--ck-white); box-shadow: 0 6px 20px rgba(11, 31, 77, .10); }
html body .uckim-header-inner { height: var(--ck-header-h); gap: 24px; }
html body .uckim-header-brand { gap: 16px; }
html body .uckim-header-logo { height: 80px; max-height: 80px; width: auto; background: none; padding: 0; border-radius: 0; }
html body .uckim-header-name {
    font-family: var(--ck-display);
    font-size: 1.12rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.12;
    color: var(--ck-ink);
    max-width: 230px;
    padding-left: 16px;
    border-left: 1.5px solid var(--ck-ink);
}
html body .uckim-nav-link {
    font-family: var(--ck-sans);
    font-size: .98rem;
    font-weight: 500;
    color: var(--ck-ink);
    padding: 10px 12px;
    border-radius: 0;
}
html body .uckim-nav-link:hover { color: var(--ck-blue); background: transparent; }
html body .uckim-nav-link.active { color: var(--ck-ink); font-weight: 600; }
html body .uckim-nav-link.active::before { background: var(--ck-sky); height: 3px; bottom: -2px; left: 12px; right: 12px; }
html body .uckim-nav-link i.chevron { opacity: .6; }
html body .uckim-dropdown { background: #fff; border: 1px solid var(--ck-line); box-shadow: 0 16px 40px rgba(11, 31, 77, .14); border-radius: 0; backdrop-filter: none; }
html body .uckim-dropdown::before { background: #fff; border-color: var(--ck-line); }
html body .uckim-dropdown-link { color: var(--ck-ink); font-size: .96rem; border-radius: 0; }
html body .uckim-dropdown-link:hover, html body .uckim-dropdown-link.active { background: var(--ck-sky-50); color: var(--ck-blue); }

/* « Portail » en dégradé bleu ; « Installer » réduit à son icône */
html body .uckim-nav-btn, html body .uckim-header-action-btn {
    font-family: var(--ck-sans);
    font-weight: 600;
    font-size: .95rem;
    border-radius: var(--ck-radius);
    padding: 11px 18px;
    min-height: 44px;
}
html body .uckim-nav-btn-outline, html body .uckim-header-action-btn:not(.uckim-header-action-btn-gold) {
    background: var(--ck-grad);
    border: 0;
    color: #fff;
}
html body .uckim-nav-btn-outline:hover, html body .uckim-header-action-btn:not(.uckim-header-action-btn-gold):hover { filter: brightness(1.12); color: #fff; }
html body .uckim-nav-btn-apply, html body .uckim-header-action-btn-gold { background: transparent; border: 1px solid var(--ck-line); color: var(--ck-ink); }
html body .uckim-nav-btn-apply:hover, html body .uckim-header-action-btn-gold:hover { border-color: var(--ck-ink); color: var(--ck-ink); background: transparent; }
html body .uckim-nav-ctas .uckim-nav-btn-apply { font-size: 0; gap: 0; padding: 11px 14px; }
html body .uckim-nav-ctas .uckim-nav-btn-apply i { font-size: 1rem; margin: 0; }
html body .uckim-live-pill { background: var(--ck-red); font-size: .85rem; border-radius: var(--ck-radius); }
html body .uckim-header .container { max-width: 1480px; }
@media (min-width: 1025px) and (max-width: 1599.98px) {
    html body .uckim-header-inner { gap: 14px; }
    html body .uckim-header-brand { gap: 12px; }
    html body .uckim-header-logo { height: 70px; max-height: 70px; }
    html body .uckim-header-name { font-size: .98rem; max-width: 175px; padding-left: 12px; }
    html body .uckim-nav-link { padding: 10px 7px; font-size: .9rem; }
    html body .uckim-nav-btn { padding: 10px 13px; font-size: .9rem; }
}
@media (min-width: 1025px) and (max-width: 1339.98px) {
    html body .uckim-header-name { display: none; }
}

/* ---------- Accueil : grand titre au-dessus d'une photo encadrée ---------- */
html body .ms-hero-section { height: auto; min-height: 0; background: var(--ck-bg); padding: 56px 0 0; overflow: visible; }
html body .ms-hero-section .carousel, html body .ms-hero-section .carousel-inner { height: auto; }
html body .ms-hero-section .carousel-item { height: auto; }
html body .ms-hero-section .carousel-item.active,
html body .ms-hero-section .carousel-item-next,
html body .ms-hero-section .carousel-item-prev { display: flex; flex-direction: column; }
html body .ms-hero-overlay { position: relative; inset: auto; background: none; display: block; order: -1; z-index: 2; }
html body .ms-hero-panel { padding: 0 0 36px; max-width: none; color: var(--ck-ink); }
html body .ms-hero-panel .ms-hero-title {
    color: var(--ck-ink);
    font-size: clamp(2.4rem, 1rem + 5vw, 5.4rem);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.035em;
    margin-bottom: 20px;
    max-width: 18ch;
    text-wrap: balance;
    text-decoration: underline;
    text-decoration-color: rgba(0, 127, 255, .28);
    text-decoration-thickness: .1em;
    text-underline-offset: .14em;
    text-decoration-skip-ink: none;
}
html body .ms-hero-panel .ms-hero-subtitle { color: var(--ck-muted); font-size: clamp(1.05rem, .95rem + .4vw, 1.3rem); max-width: 60ch; margin-bottom: 26px; }
html body .ms-hero-bg-wrapper {
    position: relative;
    width: min(1296px, calc(100% - 24px));
    margin: 0 auto;
    aspect-ratio: 16 / 7;
    height: auto;
    overflow: hidden;
    background: var(--ck-navy);
}
html body .ms-hero-bg-img { position: absolute; inset: 0; transform: none; }
html body .ms-btn-hero, html body .hm-btn-gold, html body .dlx-btn {
    background: var(--ck-yellow);
    color: var(--ck-navy);
    border: 0;
    border-radius: var(--ck-radius);
    font-weight: 700;
    font-size: 1rem;
    padding: 14px 26px;
    min-height: 48px;
    box-shadow: none;
}
html body .ms-btn-hero:hover, html body .hm-btn-gold:hover, html body .dlx-btn:hover { background: var(--ck-yellow-600); color: var(--ck-navy); transform: none; }
html body .ms-hero-controls { bottom: 20px; }
html body .ms-hero-indicators { padding-left: 0; justify-content: flex-end; }
html body .ms-hero-dot { background-color: rgba(255, 255, 255, .55); border-radius: 0; height: 4px; width: 22px; }
html body .ms-hero-dot.active { background-color: #fff; width: 44px; border-radius: 0; }
/* Témoignages : superposés, hauteur du plus long, fondu (DEC-044) */
html body .ms-testi-carousel { display: grid; min-height: 0; }
html body .ms-testi-slide { grid-area: 1 / 1; display: block; animation: none; opacity: 0; visibility: hidden; transform: translateY(6px);
    transition: opacity .6s cubic-bezier(.22, .61, .36, 1), transform .6s cubic-bezier(.22, .61, .36, 1), visibility 0s linear .6s; }
html body .ms-testi-slide.active { opacity: 1; visibility: visible; transform: none; transition-delay: .15s, .15s, 0s; }
@media (prefers-reduced-motion: reduce) { html body .ms-testi-slide { transition: none; transform: none; } }

/* Fondu enchaîné (assets/js/hero.js, DEC-044) : diapositives superposées, hauteur fixe,
   la nouvelle photo apparaît pendant que l'ancienne s'efface ; zoom lent sur la photo active. */
html body .ms-hero-section { --hero-ease: cubic-bezier(.22, .61, .36, 1); }
html body .ms-hero-section [data-hero] .carousel-inner { display: grid; overflow: visible; }
html body .ms-hero-section [data-hero] .carousel-item {
    grid-area: 1 / 1;
    display: flex; flex-direction: column;
    float: none; margin: 0; transform: none; backface-visibility: hidden;
    opacity: 0; visibility: hidden; z-index: 0;
    transition: opacity .9s var(--hero-ease), visibility 0s linear .9s;
}
html body .ms-hero-section [data-hero] .carousel-item.active { opacity: 1; visibility: visible; z-index: 2; transition: opacity .9s var(--hero-ease), visibility 0s; }
html body .ms-hero-section [data-hero] .carousel-item.is-sortant { visibility: visible; z-index: 1; }
html body .ms-hero-section [data-hero] .ms-hero-bg-img { transform: scale(1); transition: none; will-change: transform; }
html body .ms-hero-section [data-hero] .is-zoom .ms-hero-bg-img { transform: scale(1.05); transition: transform calc(var(--hero-intervalle, 7000ms) + 1200ms) linear; }
/* Texte : apparition douce et décalée, seulement à l'arrivée d'une diapositive */
html body .ms-hero-section [data-hero-pret] [data-animate] { opacity: 0; transform: translateY(12px); transition: opacity .7s var(--hero-ease), transform .7s var(--hero-ease); }
html body .ms-hero-section [data-hero-pret] .active [data-animate] { opacity: 1; transform: none; }
html body .ms-hero-section [data-hero-pret] .is-sortant [data-animate] { opacity: 0; transform: none; transition: opacity .25s ease-out; } /* l'ancien texte s'efface avant l'arrivée du nouveau */
html body .ms-hero-section [data-hero-pret] .active [data-animate]:nth-child(1) { transition-delay: .25s; }
html body .ms-hero-section [data-hero-pret] .active [data-animate]:nth-child(2) { transition-delay: .37s; }
html body .ms-hero-section [data-hero-pret] .active [data-animate]:nth-child(3) { transition-delay: .49s; }
/* Indicateurs : la barre active se remplit pendant la durée d'affichage */
html body .ms-hero-dot { position: relative; overflow: hidden; transition: width .4s var(--hero-ease), background-color .4s var(--hero-ease); }
html body .ms-hero-dot.active { background-color: rgba(255, 255, 255, .55); }
html body .ms-hero-dot > span { position: absolute; inset: 0; background: #fff; transform: scaleX(0); transform-origin: left center; }
html body .ms-hero-dot.active > span { animation: heroBarre var(--hero-intervalle, 7000ms) linear forwards; }
html body .ms-hero-section.is-pause .ms-hero-dot.active > span { animation-play-state: paused; }
@keyframes heroBarre { to { transform: scaleX(1); } }
html body .ms-hero-dot::before { content: ""; position: absolute; inset: -10px -2px; } /* zone de clic agrandie */
html body .ms-hero-arrow { transition: opacity .3s var(--hero-ease); z-index: 5; } /* au-dessus des diapositives superposées */
@media (prefers-reduced-motion: reduce) {
    html body .ms-hero-section [data-hero] .carousel-item, html body .ms-hero-section [data-hero] .carousel-item.active { transition: none; }
    html body .ms-hero-section [data-hero] .is-zoom .ms-hero-bg-img { transform: none; transition: none; }
    html body .ms-hero-section [data-hero-pret] [data-animate] { opacity: 1; transform: none; transition: none; }
    html body .ms-hero-dot.active > span { animation: none; transform: scaleX(1); }
}
@media (max-width: 767.98px) {
    html body .ms-hero-section { padding-top: 32px; }
    html body .ms-hero-bg-wrapper { aspect-ratio: 4 / 3; }
    html body .ms-hero-panel { padding: 0 0 24px; }
    html body .ms-hero-actions { align-items: flex-start; }
}

/* ---------- Accès principaux : tuiles en dégradé bleu ---------- */
html body .hm-adm { background: var(--ck-bg); color: var(--ck-ink); padding: 72px 0 24px; }
html body .hm-adm-in { padding: 0 0 28px; align-items: flex-end; }
html body .hm-adm-state strong { font-family: var(--ck-display); font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.4rem); letter-spacing: -0.03em; line-height: 1.1; }
html body .hm-adm-state span { font-size: 1.02rem; color: var(--ck-muted); opacity: 1; }
html body .hm-adm-dot { margin-top: 10px; align-self: flex-start; }
.hm-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.hm-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 220px;
    padding: 24px 24px 22px;
    background: var(--ck-grad);
    color: #fff;
    text-decoration: none;
    overflow: hidden;
}
.hm-tile:nth-child(2) { background: linear-gradient(135deg, #0a2f73 0%, #0062cc 60%, #2e95ff 100%); }
.hm-tile:nth-child(3) { background: linear-gradient(135deg, #0b1f4d 0%, #0a3d8f 100%); }
.hm-tile:nth-child(4) { background: linear-gradient(135deg, #003c8a 0%, #007fff 100%); }
.hm-tile strong { font-family: var(--ck-display); font-size: 1.4rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; }
.hm-tile span { font-size: .95rem; line-height: 1.5; color: rgba(255, 255, 255, .9); }
.hm-tile i { margin-top: auto; font-size: 1.15rem; color: #fff; transition: transform .2s ease; }
html body .hm-tile:hover { color: #fff; }
.hm-tile:hover i { transform: translateX(6px); }
.hm-tile:hover strong { text-decoration: underline; text-underline-offset: 5px; }
@media (max-width: 991.98px) { .hm-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .hm-tiles { grid-template-columns: 1fr; } .hm-tile { min-height: 0; } .hm-tile i { margin-top: 6px; } }
@media (prefers-reduced-motion: reduce) { .hm-tile i { transition: none; } }

/* ---------- Actualités : section sombre en dégradé ---------- */
html body .hm-news { background: var(--ck-grad-deep); color: #fff; }
html body .hm-news .ms-section-title { color: #fff; font-size: clamp(2.4rem, 1.4rem + 3vw, 4rem); }
html body .hm-news .ms-section-subtitle { color: rgba(255, 255, 255, .8); }
html body .hm-news .hm-more { color: #fff; }
html body .hm-une { border-radius: 0; background: var(--ck-grad) center/cover; min-height: 460px; }
html body .hm-une::before { background: linear-gradient(180deg, rgba(11, 31, 77, 0) 30%, rgba(11, 31, 77, .92)); }
html body .hm-une h3 { font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2.2rem); line-height: 1.12; }
html body .hm-une-kicker { background: var(--ck-red); color: #fff; border-radius: 0; font-size: .82rem; }
html body .hm-news .hm-mag-list { gap: 0; }
html body .hm-news .hm-pub { background: transparent; border: 0; border-top: 1px solid rgba(255, 255, 255, .18); border-radius: 0; padding: 18px 0; color: #fff; box-shadow: none; }
html body .hm-news .hm-pub:hover { box-shadow: none; }
html body .hm-news .hm-pub h3 { color: #fff; font-size: 1.15rem; }
html body .hm-news .hm-pub:hover h3 { color: #fff; text-decoration: underline; }
html body .hm-news .hm-kicker { color: var(--ck-sky-200) !important; }
html body .hm-news .hm-meta, html body .hm-news .hm-empty { color: rgba(255, 255, 255, .72); }
html body .hm-news .hm-pub-img { border-radius: 0; }
html body .hm-news .hm-col-head { border-bottom-color: rgba(255, 255, 255, .5); }
html body .hm-news .hm-col-head h3, html body .hm-news .hm-col-head a { color: #fff; }
html body .hm-pub { border-radius: 0; border-color: var(--ck-line); box-shadow: none; }
html body .hm-pub h3 { color: var(--ck-ink); }
html body .hm-pub-img { border-radius: 0; background-color: var(--ck-sky-50); color: var(--ck-blue); }
html body .hm-kicker { color: var(--ck-red); font-size: .82rem; }
html body .hm-meta { color: var(--ck-muted); }
html body .hm-alt { background: var(--ck-white); }

/* ---------- Chiffres clés (pages Université et Formations ; retirés de l'accueil, DEC-038) ----------
   Présentation éditoriale : fond blanc, titre visible, grands chiffres, pas de bande colorée ni d'icônes. */
html body .hm-stats { background: var(--ck-white); color: var(--ck-ink); padding: 96px 0; border-top: 1px solid var(--ck-line); }
html body .hm-stats .ms-section-title { margin-bottom: 40px; }
html body .hm-stats-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 32px; text-align: left; }
html body .hm-stat { border-top: 3px solid var(--ck-navy); padding-top: 18px; }
html body .hm-stat i { display: none; }
html body .hm-stat b { display: block; font-family: var(--ck-display); font-weight: 800; letter-spacing: -0.04em; line-height: 1; color: var(--ck-navy); font-size: clamp(2.8rem, 2rem + 2.4vw, 4.4rem); margin: 0 0 10px; }
html body .hm-stat span { font-size: 1.02rem; color: var(--ck-muted); opacity: 1; }

/* ---------- Cartes : angles droits, pas d'ombre ---------- */
html body .ms-formation-card, html body .fel-card, html body .uk-gov-card, html body .uk-logo, html body .uk-figures figure, html body .ms-card, html body .card {
    border: 1px solid var(--ck-line);
    border-radius: 0;
    box-shadow: none;
    background: #fff;
}
html body .ms-formation-card:hover, html body .fel-card:hover, html body a.uk-logo:hover { box-shadow: 0 14px 34px rgba(11, 31, 77, .12); transform: none; border-color: var(--ck-line); }
html body .ms-formation-card-img, html body .ms-formation-card-img img { border-radius: 0; }
html body .ms-formation-title, html body .ms-formation-card h3 { font-family: var(--ck-display); font-size: 1.35rem; line-height: 1.15; letter-spacing: -0.02em; color: var(--ck-ink); }
html body .ms-formation-card .ms-btn-outline {
    border: 0;
    padding: 0;
    background: none;
    color: var(--ck-ink);
    font-weight: 600;
    justify-content: flex-start;
    width: auto;
}
html body .ms-formation-card .ms-btn-outline:hover { background: none; color: var(--ck-blue); text-decoration: underline; }
html body .fel-body h3, html body .uk-gov-body h3 { font-family: var(--ck-display); font-size: 1.25rem; letter-spacing: -0.02em; color: var(--ck-ink); }
html body .fel-body p, html body .uk-gov-bio { color: var(--ck-muted); font-size: 1rem; }

/* Blocs « ce qui nous distingue » : un court filet rouge, pas de boîte */
html body .uk-card { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
html body .uk-card::before { content: ""; display: block; width: 44px; height: 3px; background: var(--ck-red); margin-bottom: 16px; }
html body a.uk-card:hover { box-shadow: none; transform: none; }
html body a.uk-card:hover h3 { color: var(--ck-blue); text-decoration: underline; }
html body .uk-card-ico { width: auto; height: auto; background: none; border: 0; color: var(--ck-blue); font-size: 1.3rem; justify-content: flex-start; margin-bottom: 10px; }
html body .uk-card h3 { font-family: var(--ck-display); font-size: 1.3rem; letter-spacing: -0.02em; color: var(--ck-ink); }
html body .uk-card p, html body .uk-card li { color: var(--ck-muted); font-size: 1rem; }
html body .uk-card li::before { color: var(--ck-red); }
html body .uk-cards { gap: 40px 32px; }

/* Dirigeants et mot du Recteur */
html body .uk-gov-body { border-top: 4px solid var(--ck-sky); text-align: left; }
html body .uk-gov-role { color: var(--ck-blue); font-size: .95rem; }
html body .uk-gov-photo { height: 300px; background: var(--ck-grad); }
html body .uk-rector-photo { width: 300px; height: 300px; border-radius: 0; border: 0; box-shadow: 12px 12px 0 var(--ck-sky); }
html body .uk-quote { border-left: 4px solid var(--ck-red); font-style: normal; font-size: 1.12rem; line-height: 1.75; color: var(--ck-ink); max-width: 68ch; }
html body .uk-timeline { border-left-color: var(--ck-line); }
html body .uk-timeline li::before { border-color: var(--ck-sky); border-radius: 0; }
html body .uk-timeline b { color: var(--ck-navy); }
html body .uk-prose, html body .uk-lead { color: var(--ck-ink); max-width: 72ch; }
html body .uk-lead { font-size: 1.2rem; }

/* ---------- En-tête des pages intérieures : dégradé bleu ---------- */
html body .ms-page-hero, html body .ms-hero-blue { background: var(--ck-grad); padding: 88px 0 80px; text-align: left; }
html body .ms-page-hero::before { display: none; }
html body .ms-page-hero .text-center { text-align: left !important; }
html body .ms-page-hero .container > * { margin-left: 0; margin-right: 0; }
html body .ms-page-hero h1, html body .ms-hero-blue h1 { color: #fff; font-size: clamp(2.4rem, 1.2rem + 4vw, 4.6rem); font-weight: 800; line-height: 1.02; letter-spacing: -0.035em; max-width: 18ch; }
html body .ms-page-hero p, html body .ms-hero-blue p { color: rgba(255, 255, 255, .9); font-size: 1.15rem; max-width: 60ch; }
html body .ms-hero-badge { display: inline-flex; margin-bottom: 20px; background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .5); border-radius: 0; text-transform: none; letter-spacing: 0; }

/* Fil d'Ariane, sous-menu, encadrés */
html body .uk-crumbs { font-size: .9rem; background: var(--ck-white); padding-top: 5px; }
html body .uk-subnav { top: calc(var(--ck-header-h) + 1px); background: var(--ck-white); }
html body .uk-subnav a { color: var(--ck-ink); font-size: .95rem; border-radius: 0; }
html body .uk-subnav a:hover, html body .uk-subnav a.active { background: transparent; color: var(--ck-blue); box-shadow: inset 0 -3px 0 var(--ck-sky); }
html body .uk-subnav-label { color: var(--ck-muted); font-size: .85rem; }
html body .uk-info { background: var(--ck-white); border: 1px solid var(--ck-line); border-left: 4px solid var(--ck-sky); border-radius: 0; }

/* ---------- Boutons ---------- */
html body .hm-btn, html body .ms-btn { border-radius: var(--ck-radius); font-weight: 600; min-height: 44px; }
html body .ms-btn-primary, html body .btn-primary { background: var(--ck-blue); border-color: var(--ck-blue); }
html body .ms-btn-primary:hover, html body .btn-primary:hover { background: var(--ck-navy); border-color: var(--ck-navy); }
html body .ms-btn-outline, html body .btn-outline-primary { color: var(--ck-blue); border-color: var(--ck-blue); }
html body .ms-btn-outline:hover, html body .btn-outline-primary:hover { background: var(--ck-blue); color: #fff; }
html body .hm-btn-ghost { border-color: rgba(255, 255, 255, .6); }

/* ---------- Direct ---------- */
html body .hm-live, html body .dlx-scene { background: var(--ck-grad-deep); }
html body .hm-ev-date { background: var(--ck-sky); border-radius: 0; }
html body .dlx-player, html body .hm-ratio { border-radius: 0; }
html body .dlx-attente { background: var(--ck-grad); }
html body .dlx-attente i, html body .dlx-vide > i { color: rgba(255, 255, 255, .8); }
html body .dlx-primary { background: var(--ck-yellow); border-color: var(--ck-yellow); color: var(--ck-navy); border-radius: var(--ck-radius); }
html body .dlx-primary:hover { background: var(--ck-yellow-600); color: var(--ck-navy); }
html body .dlx-rebours b { font-family: var(--ck-display); color: #fff; }
html body .dir-thumb, html body .dir-thumb-home { background-color: var(--ck-navy); border-radius: 0; }

/* ---------- Contact ---------- */
html body .ms-contact-info-title { font-family: var(--ck-display); color: var(--ck-ink); }
html body .ms-contact-info-label { font-size: .95rem; color: var(--ck-muted); }

/* ---------- Bandeau d'appel final et pied de page ---------- */
html body .hm-cta { background: var(--ck-grad); border-top: 0; padding: 72px 0; }
html body .hm-cta h2 { font-size: clamp(2rem, 1.3rem + 2.2vw, 3.2rem); letter-spacing: -0.035em; }
html body .hm-cta p { color: rgba(255, 255, 255, .9); font-size: 1.1rem; }
html body .ms-footer { background: var(--ck-navy); color: rgba(255, 255, 255, .82); padding-top: 72px; position: relative; }
html body .ms-footer-title { font-family: var(--ck-display); font-size: 1.1rem; color: #fff; font-weight: 700; }
html body .ms-footer-title::after { background: var(--ck-sky); border-radius: 0; }
html body .ms-footer-links a, html body .ms-footer-text, html body .ms-contact-line,
html body .ms-footer-brand + .ms-footer-text, html body .uckim-footer-brand-sub { color: rgba(255, 255, 255, .82); font-size: .98rem; }
html body .ms-footer-links a:hover { color: #fff; text-decoration: underline; }
html body .ms-footer-links a i { color: rgba(255, 255, 255, .5); }
html body .uckim-footer-logo { height: 120px; max-height: 120px; filter: none; opacity: 1; }
html body .uckim-footer-brand-name { font-family: var(--ck-display); font-size: 1.7rem; color: #fff; letter-spacing: -0.03em; text-transform: none; }  /* « UCKim » tel quel, jamais en capitales */
html body .uckim-footer-brand-motto { color: var(--ck-yellow); font-style: normal; }
html body .ms-footer-bottom { border-top-color: rgba(255, 255, 255, .14); }
html body .ms-footer-bottom-inner p, html body .uk-dev-line { color: rgba(255, 255, 255, .75); opacity: 1; }
html body .ms-footer-legal a { color: rgba(255, 255, 255, .8); }
html body .ms-social-icon { border-radius: 0; }

/* ---------- Page Admissions : en-tête aligné sur les autres pages ---------- */
html body .uckim-adm-hero { background: var(--ck-grad); padding: 88px 0 80px; }
html body .uckim-adm-hero-bg { display: none; }
html body .uckim-adm-hero-content { text-align: left; max-width: none; margin: 0; }
html body .uckim-adm-hero-badge { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .5); border-radius: 0; text-transform: none; letter-spacing: 0; font-size: .9rem; }
html body .uckim-adm-hero-content h1 { font-family: var(--ck-display); font-size: clamp(2.4rem, 1.2rem + 4vw, 4.6rem); font-weight: 800; line-height: 1.02; letter-spacing: -0.035em; max-width: 18ch; }
html body .uckim-adm-hero-content p { color: rgba(255, 255, 255, .9); font-size: 1.15rem; max-width: 60ch; }
html body .uckim-adm-status { display: flex; width: fit-content; margin: 0 0 24px; border-radius: 0; }
html body .uckim-adm-closed { border-radius: 0; box-shadow: none; border-color: var(--ck-line); border-top: 3px solid var(--ck-navy); }
html body .uckim-adm-closed h2 { font-family: var(--ck-display); letter-spacing: -0.02em; }
html body .uckim-adm-level-go { background: var(--ck-blue); border-radius: var(--ck-radius); }
html body .uckim-adm-level-go:hover { background: var(--ck-navy); }
html body .uckim-adm-hero-btn { background: var(--ck-yellow); color: var(--ck-navy); border-radius: var(--ck-radius); box-shadow: none; }
html body .uckim-adm-hero-btn:hover { background: var(--ck-yellow-600); color: var(--ck-navy); transform: none; box-shadow: none; }

/* Page Admissions : sections alignées à gauche, catalogue, frise de la procédure, paiement et aide (DEC-040) */
html body .uckim-adm-section { padding: 88px 0; }
html body .uckim-adm-section-gray { background: var(--ck-white); border-top: 1px solid var(--ck-line); border-bottom: 1px solid var(--ck-line); }
html body .uckim-adm-section-header { text-align: left; max-width: none; margin: 0 0 40px; }
html body .uckim-adm-section-header h2 { font-family: var(--ck-display); font-size: clamp(2rem, 1.3rem + 2.2vw, 3rem); font-weight: 700; letter-spacing: -0.035em; line-height: 1.05; color: var(--ck-ink); }
html body .uckim-adm-section-header h2::after { display: none; }
html body .uckim-adm-section-header p { color: var(--ck-muted); font-size: 1.08rem; max-width: 64ch; margin: 12px 0 0; }

html body .uckim-adm-session { margin-bottom: 48px; }
html body .uckim-adm-session:last-child { margin-bottom: 0; }
html body .uckim-adm-session-head { margin-bottom: 18px; }
html body .uckim-adm-session-type { display: inline-flex; gap: 8px; align-items: center; font-size: .9rem; font-weight: 600; color: var(--ck-blue); text-transform: none; letter-spacing: 0; background: none; padding: 0; }
html body .uckim-adm-session-head h3 { font-family: var(--ck-display); font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); font-weight: 700; letter-spacing: -0.025em; margin: 6px 0 0; color: var(--ck-navy); }
html body .uckim-adm-session-head p { color: var(--ck-muted); margin: 8px 0 0; max-width: 70ch; }
html body .uckim-adm-levels { grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 16px; }
html body .uckim-adm-level { border-radius: 0; border-color: var(--ck-line); border-top-width: 4px; box-shadow: none; padding: 24px; gap: 14px; }
html body .uckim-adm-level h4 { font-family: var(--ck-display); font-size: 1.3rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; margin: 0; color: var(--ck-ink); }
html body .uckim-adm-level-state { border-radius: 0; background: transparent; border: 1px solid var(--lvl-color); }
html body .uckim-adm-level-cond, html body .uckim-adm-level-desc { font-size: .95rem; }
html body .uckim-adm-level li { font-size: .95rem; border-bottom-style: solid; border-color: var(--ck-line); }
html body .uckim-adm-level li strong { color: var(--ck-ink); }
html body .uckim-adm-level-msg { border-radius: 0; font-size: .95rem; background: var(--ck-bg); }

/* Procédure : frise de 5 étapes (une vraie suite) */
html body .uckim-adm-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; max-width: none; margin: 0; }
html body .uckim-adm-steps::before { display: none; }
html body .uckim-adm-step { display: block; margin: 0; padding: 0; }
html body .uckim-adm-step-number { position: static; display: block; width: auto; height: auto; background: none; border: 0; box-shadow: none; font-family: var(--ck-display); font-size: 2.6rem; font-weight: 800; letter-spacing: -0.04em; line-height: 1; color: var(--ck-sky); opacity: 1; margin: 0 0 12px; text-align: left; }
html body .uckim-adm-step-content { background: transparent; border: 0; border-top: 3px solid var(--ck-navy); border-radius: 0; box-shadow: none; padding: 16px 0 0; margin: 0; transform: none; }
html body .uckim-adm-step:hover .uckim-adm-step-content { box-shadow: none; transform: none; }
html body .uckim-adm-step-icon { display: none; }
html body .uckim-adm-step-header { margin: 0 0 8px; }
html body .uckim-adm-step-header h3 { font-family: var(--ck-display); font-size: 1.15rem; font-weight: 700; letter-spacing: -0.015em; color: var(--ck-ink); margin: 0; }
html body .uckim-adm-step-content > p { font-size: .95rem; color: var(--ck-muted); }
html body .uckim-adm-doc-tag { border-radius: 0; background: var(--ck-bg); border: 1px solid var(--ck-line); color: var(--ck-ink); font-size: .8rem; }
@media (max-width: 1099.98px) { html body .uckim-adm-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { html body .uckim-adm-steps { grid-template-columns: 1fr; } html body .uckim-adm-section { padding: 60px 0; } }

/* Paiement et aide */
.uckim-adm-aide { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; }
.uckim-adm-aide > div { border-top: 3px solid var(--ck-navy); padding-top: 18px; }
.uckim-adm-aide h2 { font-family: var(--ck-display); font-size: 1.6rem; font-weight: 700; letter-spacing: -0.025em; margin: 0 0 10px; color: var(--ck-ink); }
.uckim-adm-aide p { color: var(--ck-muted); max-width: 60ch; }
.uckim-adm-aide a { margin: 4px 16px 0 0; }
.uckim-adm-lien { display: inline-flex; gap: 8px; align-items: center; font-weight: 600; color: var(--ck-blue); text-decoration: none; }
.uckim-adm-lien:hover { text-decoration: underline; }
html body .uckim-adm-whatsapp-link { border-radius: var(--ck-radius); }
@media (max-width: 767.98px) { .uckim-adm-aide { grid-template-columns: 1fr; gap: 32px; } }

/* Formulaire d'inscription */
html body #formInscription, html body .form-container { border-radius: 0; box-shadow: none; border-color: var(--ck-line); }
html body .form-container h2 { font-family: var(--ck-display); letter-spacing: -0.025em; color: var(--ck-ink); }
html body .form-container fieldset { border-radius: 0; border-color: var(--ck-line); }
html body .form-container legend { font-family: var(--ck-display); font-weight: 700; color: var(--ck-navy); }
html body .form-container legend i { color: var(--ck-blue); }
html body .form-container input, html body .form-container select, html body .form-container textarea { border-radius: var(--ck-radius); }

/* ---------- Inscriptions en cours et à venir (accueil, Formations) ---------- */
.uk-sessions { margin: 40px 0 8px; }
.hm-adm .uk-sessions { margin-bottom: 0; }
.uk-sessions-titre { font-family: var(--ck-display); font-size: clamp(1.4rem, 1.1rem + .9vw, 1.9rem); letter-spacing: -0.025em; margin: 0 0 18px; color: var(--ck-ink); }
.uk-session { background: var(--ck-white); border: 1px solid var(--ck-line); border-top: 3px solid var(--ck-navy); margin-bottom: 16px; }
.uk-session-nom { margin: 0; padding: 14px 20px; font-weight: 600; color: var(--ck-navy); border-bottom: 1px solid var(--ck-line); }
.uk-session-nom i { color: var(--ck-blue); margin-right: 6px; }
.uk-offre { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; border-bottom: 1px solid var(--ck-line); }
.uk-offre:last-child { border-bottom: 0; }
.uk-offre-txt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; min-width: 0; }
.uk-offre-txt strong { font-family: var(--ck-display); font-size: 1.1rem; color: var(--ck-ink); }
.uk-offre-etat { font-size: .82rem; font-weight: 600; color: var(--etat); border: 1px solid var(--etat); padding: 1px 8px; }
.uk-offre-info { flex-basis: 100%; font-size: .95rem; color: var(--ck-muted); }
.uk-offre-bientot { font-weight: 600; color: var(--ck-blue); white-space: nowrap; }
.uk-offre .hm-btn { white-space: nowrap; flex-shrink: 0; }
@media (max-width: 575.98px) { .uk-offre { flex-direction: column; align-items: flex-start; } }

/* ---------- Espaces des comptes (étudiant, enseignant) : même langage ---------- */
html body .esp { background: var(--ck-bg); }
html body .esp-hero { background: var(--ck-grad); border-radius: 0; padding: 36px 32px; }
html body .esp-hero h1 { font-family: var(--ck-display); font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.6rem); font-weight: 800; letter-spacing: -0.03em; }
html body .esp-kicker { text-transform: none; letter-spacing: 0; color: var(--ck-sky-200); font-size: .9rem; font-weight: 600; }
html body .esp-nav a { border-radius: var(--ck-radius); }
html body .esp-nav a.active { color: var(--ck-navy); }
html body .esp-card { border-radius: 0; border-color: var(--ck-line); box-shadow: none; padding: 24px; }
html body .esp-card h2 { font-family: var(--ck-display); font-size: 1.2rem; font-weight: 700; letter-spacing: -0.015em; color: var(--ck-ink); }
html body .esp-card h2 i { color: var(--ck-blue); }
html body .esp-btn { background: var(--ck-blue); border-radius: var(--ck-radius); }
html body .esp-btn:hover { background: var(--ck-navy); }
html body .esp-link { color: var(--ck-blue); }
html body .esp-table th { text-transform: none; font-size: .85rem; color: var(--ck-muted); }
html body .esp-steps li.done span { background: var(--ck-blue); }
html body .esp-steps li.done { color: var(--ck-blue); }
html body .esp-form input, html body .esp-ok, html body .esp-ko, html body .esp-alert { border-radius: var(--ck-radius); }
html body .acx-btn-ghost { color: var(--ck-blue) !important; border-color: var(--ck-blue); }
html body .acx-statut { border-radius: var(--ck-radius); }

/* ---------- Tablette et téléphone ---------- */
@media (max-width: 1024px) {
    :root { --ck-header-h: 72px; }
    html body .uckim-header-inner { height: var(--ck-header-h); }
    html body .uckim-header-logo { height: 58px; max-height: 58px; }
    html body .uckim-header-name { font-size: .98rem; max-width: 200px; -webkit-line-clamp: 2; padding-left: 12px; }
    html body .uckim-mobile-link { color: var(--ck-ink); font-size: .92rem; padding: 8px 12px; min-height: 40px; border-radius: 0; }
    html body .uckim-mobile-link:hover { color: var(--ck-blue); background: transparent; }
    html body .uckim-mobile-link.active { color: var(--ck-ink); background: transparent; box-shadow: inset 0 -3px 0 var(--ck-sky); font-weight: 600; }
    html body .uckim-mobile-link-connexion, html body .uckim-mobile-link-portail { background: var(--ck-grad); color: #fff; }
    html body .uckim-header-action-btn { padding: 8px 12px; min-height: 40px; }
}
@media (max-width: 575.98px) {
    :root { --ck-header-h: 64px; }
    html body .uckim-bubble { display: none !important; }   /* la bulle d'accueil de l'assistant couvrait le contenu */
    html body { font-size: 1rem; }
    html body .ms-section { padding: 60px 0; }
    html body .uckim-header-logo { height: 50px; max-height: 50px; }
    html body .uckim-header-name { font-size: .84rem; max-width: 150px; }
    html body .uckim-header-action-btn { width: auto; min-width: 40px; height: 40px; padding: 0 10px; }
    html body .uckim-header-action-btn span { display: none; }
    html body .ms-page-hero { padding: 56px 0 48px; }
    html body .uk-rector-photo { width: 220px; height: 220px; }
    html body .hm-adm { padding-top: 48px; }
}
@media (prefers-reduced-motion: reduce) {
    html body .ms-hero-bg-img { transition: none; transform: none; }
}