/* ===== TW Micronics Academy — Plugin styles ===== */

/* ---------- Moodle overrides ---------- */
nav.navbar.fixed-top { display: none !important; }
#page-login-index { min-height: auto !important; height: auto !important; }
.pagelayout-login #page-wrapper { min-height: auto !important; height: auto !important; }
.pagelayout-login #page { min-height: auto !important; }
.pagelayout-login .login-container { min-height: auto !important; }
.pagelayout-login .login-wrapper { min-height: auto !important; }
.min-vh-100 { min-height: auto !important; }
body { padding-top: 64px !important; }
#page { margin-top: 0 !important; }
#page-footer { display: none !important; }

/* Standalone page overrides */
.path-local-twmicronics .drawer { display: none !important; }
.path-local-twmicronics .secondary-navigation { display: none !important; }
.path-local-twmicronics #page-header { display: none !important; }
.path-local-twmicronics .breadcrumb { display: none !important; }
.path-local-twmicronics #page-content { padding: 0 !important; margin: 0 !important; }
.path-local-twmicronics #region-main { padding: 0 !important; border: none !important; }
.path-local-twmicronics #page { margin-top: 0 !important; }

/* ---------- Utility classes ---------- */
.twm-hidden { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* ---------- TWM Navbar ---------- */
.twm-nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
    background: linear-gradient(135deg, #1A54A9 0%, #0A2D5C 100%);
    border-bottom: 3px solid #FF6B35;
    box-shadow: 0 2px 20px rgba(26,84,169,0.3);
    height: 64px; padding: 0 1.5rem;
    display: flex; align-items: center; justify-content: space-between;
    font-family: "Montserrat", sans-serif;
}
.twm-nav-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.twm-nav-logo img { height: 40px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.9); box-shadow: 0 0 8px rgba(0,0,0,0.2); }
.twm-nav-logo span { color: #fff; font-weight: 700; font-size: 1.1rem; white-space: nowrap; }
.twm-nav-links { display: flex; align-items: center; gap: 0.3rem; list-style: none; margin: 0; padding: 0; }
.twm-nav-links a {
    color: rgba(255,255,255,0.85); text-decoration: none; font-size: 0.85rem;
    font-weight: 500; padding: 7px 12px; border-radius: 6px; transition: all 0.2s;
}
.twm-nav-links a:hover { color: #fff; background: rgba(255,255,255,0.1); }
.twm-nav-links a.twm-active { color: #fff; background: rgba(255,255,255,0.15); }
.twm-nav-cta {
    background: linear-gradient(135deg, #FF6B35, #00B2A9) !important;
    color: #fff !important; font-weight: 600 !important; padding: 8px 20px !important;
    border-radius: 25px !important; font-size: 0.85rem !important;
    box-shadow: 0 3px 12px rgba(255,107,53,0.3); transition: all 0.3s !important;
}
.twm-nav-cta:hover { transform: translateY(-1px); box-shadow: 0 5px 18px rgba(255,107,53,0.4); }

/* User dropdown */
.twm-nav-user { position: relative; display: flex; align-items: center; }
.twm-nav-avatar {
    width: 36px; height: 36px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.5);
    cursor: pointer; transition: border-color 0.2s;
}
.twm-nav-avatar:hover { border-color: #FF6B35; }
.twm-nav-dropdown {
    display: none; position: absolute; top: 50px; right: 0; background: #fff;
    border-radius: 10px; box-shadow: 0 10px 40px rgba(0,0,0,0.15); min-width: 220px;
    padding: 0.5rem 0; z-index: 10000;
}
.twm-nav-dropdown.open { display: block; }
.twm-nav-dropdown a {
    display: block; padding: 10px 18px; color: #333; text-decoration: none;
    font-size: 0.85rem; transition: background 0.2s;
}
.twm-nav-dropdown a:hover { background: #f0f7ff; color: #1A54A9; }
.twm-nav-dropdown hr { border: none; border-top: 1px solid #eee; margin: 0.3rem 0; }
.twm-nav-dropdown .twm-logout-link { color: #dc3545; }
.twm-nav-dropdown .twm-logout-link:hover { background: #fff5f5; color: #dc3545; }
.twm-nav-uname { color: rgba(255,255,255,0.9); font-size: 0.8rem; margin-right: 8px; display: none; }

/* Hamburger */
.twm-hamburger { display: none; cursor: pointer; background: none; border: none; padding: 6px; }
.twm-hamburger span { display: block; width: 22px; height: 2px; background: #fff; margin: 4px 0; border-radius: 2px; }

@media (max-width: 900px) {
    .twm-nav-links {
        display: none; position: absolute; top: 64px; left: 0; right: 0;
        background: #0A2D5C; flex-direction: column; padding: 0.8rem;
        border-bottom: 3px solid #FF6B35; box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    }
    .twm-nav-links.twm-open { display: flex; }
    .twm-nav-links a { padding: 10px 14px; width: 100%; }
    .twm-hamburger { display: block; }
    .twm-nav-uname { display: none !important; }
}
@media (min-width: 1100px) { .twm-nav-uname { display: inline; } }

/* ---------- TWM Footer ---------- */
.twm-page-content .twm-footer { margin-top: 3rem; }
.twm-footer {
    background: linear-gradient(135deg, #051E43 0%, #1A54A9 100%);
    color: rgba(255,255,255,0.8); padding: 3rem 2rem 1.5rem;
    border-top: 3px solid #FF6B35;
    width: 100%; margin: 0; box-sizing: border-box;
}
.twm-footer-logo { height: 50px; margin-bottom: 12px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.7); box-shadow: 0 0 8px rgba(0,0,0,0.3); }
.twm-footer p { margin: 0; }
.twm-footer-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem;
    max-width: 1200px; margin: 0 auto;
}
.twm-footer h4 { color: #fff; font-family: "Montserrat", sans-serif; font-size: 1rem; margin-bottom: 1rem; }
.twm-footer p { font-size: 0.85rem; line-height: 1.6; }
.twm-footer ul { list-style: none; padding: 0; margin: 0; }
.twm-footer li { margin-bottom: 0.5rem; font-size: 0.85rem; }
.twm-footer a { color: #00B2A9; text-decoration: none; transition: color 0.2s; }
.twm-footer a:hover { color: #FF6B35; }
.twm-footer-bottom {
    text-align: center; margin-top: 2rem; padding-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.1); font-size: 0.8rem;
}
@media (max-width: 768px) { .twm-footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .twm-footer-grid { grid-template-columns: 1fr; } }

/* ---------- TWM Chatbot — charte editoriale (cream / ink / blue) ---------- */
/* Tokens TWM utilises avec fallback : --twm-cream, --twm-ink, --twm-blue,
   --twm-orange, --twm-paper, --twm-cream-2, --twm-text, --twm-mute,
   --twm-line-cream, --twm-fdisplay (Fraunces), --twm-fsans (Inter),
   --twm-fmono (JetBrains Mono). */

/* Toggle = carre ink 56x56 avec glyphe typographique "«M»" en Fraunces italic. */
.twm-chat-toggle {
    position: fixed; bottom: 28px; right: 28px; z-index: 9998;
    width: 56px; height: 56px;
    padding: 0;
    border: 1px solid var(--twm-ink, #0e0e10);
    border-radius: 2px;
    background: var(--twm-ink, #0e0e10);
    color: var(--twm-cream, #f3efe7);
    cursor: pointer;
    box-shadow: 0 14px 36px rgba(14, 14, 16, 0.22);
    transition: background 0.3s, border-color 0.3s, box-shadow 0.3s, transform 0.3s;
    display: inline-flex; align-items: center; justify-content: center;
    overflow: visible;
}
.twm-chat-toggle:hover {
    background: var(--twm-orange, #ff5c1a);
    border-color: var(--twm-orange, #ff5c1a);
    transform: translateY(-2px);
    box-shadow: 0 18px 44px rgba(14, 14, 16, 0.28);
}
/* Nœud neural SVG : node central + 3 satellites + lignes de connexion.
   Rotation continue tres lente (16s) ; au hover, rotation acceleree + satellites pulsent en cascade. */
svg.twm-chat-toggle-mark {
    color: var(--twm-cream, #f3efe7);
    display: block;
    transform-origin: 50% 50%;
    animation: twmChatRotate 16s linear infinite;
    will-change: transform;
}
.twm-chat-toggle:hover svg.twm-chat-toggle-mark {
    animation-duration: 6s;
}
.twm-chat-toggle-sats .twm-chat-sat {
    transform-origin: 16px 16px;
    transform-box: fill-box;
    animation: twmChatSatPulse 2.4s ease-in-out infinite;
}
.twm-chat-sat-1 { animation-delay: 0s; }
.twm-chat-sat-2 { animation-delay: 0.8s; }
.twm-chat-sat-3 { animation-delay: 1.6s; }
.twm-chat-toggle-node {
    transform-origin: 16px 16px;
    animation: twmChatNodePulse 2.4s ease-in-out infinite;
}
.twm-chat-toggle:hover .twm-chat-toggle-lines { opacity: 0.85; transition: opacity 0.35s; }

@keyframes twmChatRotate {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
@keyframes twmChatSatPulse {
    0%, 100% { opacity: 0.65; }
    50%      { opacity: 1; }
}
@keyframes twmChatNodePulse {
    0%, 100% { opacity: 0.92; }
    50%      { opacity: 1; }
}

/* Label "— Maya" qui glisse depuis la gauche au hover */
.twm-chat-toggle-label {
    position: absolute;
    right: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%) translateX(8px);
    padding: 0.55rem 0.9rem;
    background: var(--twm-cream, #f3efe7);
    color: var(--twm-ink, #0e0e10);
    border: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    border-radius: 2px;
    font-family: var(--twm-fmono, "JetBrains Mono", monospace);
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    font-weight: 500;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.25s, transform 0.25s;
    box-shadow: 0 8px 22px rgba(14,14,16,0.12);
}
.twm-chat-toggle:hover .twm-chat-toggle-label,
.twm-chat-toggle:focus-visible .twm-chat-toggle-label {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

.twm-chat-badge {
    position: absolute; top: -5px; right: -5px;
    width: 10px; height: 10px;
    background: var(--twm-orange, #ff5c1a);
    border-radius: 50%;
    border: 2px solid var(--twm-cream, #f3efe7);
    animation: twmChatPulse 2s infinite;
    pointer-events: none;
}
@keyframes twmChatPulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.25); opacity: 0.75; }
}

/* Fenetre de chat = colonne editoriale (cream, 2px) */
#twm-chat-window {
    position: fixed; bottom: 100px; right: 28px; z-index: 9999;
    width: 420px; height: 600px; max-height: calc(100vh - 140px);
    background: var(--twm-cream, #f3efe7);
    border: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    border-radius: 2px;
    box-shadow: 0 28px 80px rgba(14, 14, 16, 0.2);
    display: flex; flex-direction: column; overflow: hidden;
    opacity: 0; visibility: hidden;
    transform: translateY(14px);
    transition: opacity 0.35s, transform 0.35s, visibility 0.35s;
    color: var(--twm-ink, #0e0e10);
}
#twm-chat-window.twm-chat-open {
    opacity: 1; visibility: visible; transform: translateY(0);
}
@media (max-width: 520px) {
    #twm-chat-window { right: 12px; left: 12px; width: auto; bottom: 96px; max-height: calc(100vh - 130px); }
}

/* Header compact : eyebrow + headline Fraunces italic */
.twm-chat-header {
    position: relative;
    padding: 1rem 1.2rem 0.9rem;
    background: var(--twm-cream, #f3efe7);
    color: var(--twm-ink, #0e0e10);
    border-bottom: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    flex-shrink: 0;
}
.twm-chat-header-content {
    padding-right: 2.5rem; /* place pour la croix */
}
.twm-chat-header-eyebrow {
    display: inline-flex; align-items: center; gap: 0.55rem;
    font-family: var(--twm-fmono, "JetBrains Mono", monospace);
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--twm-mute, rgba(14,14,16,0.42));
    font-weight: 500;
    margin-bottom: 0.3rem;
}
.twm-chat-header-eyebrow-rule {
    width: 22px;
    height: 1px;
    background: currentColor;
    display: inline-block;
}
.twm-chat-header-title {
    font-family: var(--twm-fdisplay, "Fraunces", serif);
    font-weight: 400;
    font-size: 1.5rem;
    line-height: 1;
    letter-spacing: -0.025em;
    color: var(--twm-ink, #0e0e10);
    margin: 0;
}
.twm-chat-header-title em {
    font-style: italic;
    font-weight: 300;
    color: var(--twm-blue, #1a54a9);
}
#twm-chat-close {
    position: absolute;
    top: 0.85rem; right: 1rem;
    width: 28px; height: 28px;
    display: inline-flex; align-items: center; justify-content: center;
    background: transparent;
    border: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    color: var(--twm-text, rgba(14,14,16,0.72));
    font-size: 1.05rem;
    line-height: 1;
    cursor: pointer;
    border-radius: 2px;
    transition: color 0.2s, border-color 0.2s, background 0.2s;
}
#twm-chat-close:hover {
    color: var(--twm-cream, #f3efe7);
    background: var(--twm-ink, #0e0e10);
    border-color: var(--twm-ink, #0e0e10);
}

/* Quick action chips — pills line ink, comme les CTAs du site */
.twm-chat-quick {
    display: flex; flex-wrap: wrap; gap: 0.45rem;
    padding: 0.9rem 1.5rem 1rem;
    background: var(--twm-cream, #f3efe7);
    border-bottom: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    flex-shrink: 0;
    transition: max-height 0.35s ease, padding 0.35s ease, opacity 0.25s ease;
    overflow: hidden;
}
.twm-chat-quick-hidden {
    max-height: 0;
    padding-top: 0; padding-bottom: 0;
    opacity: 0;
    border-bottom-color: transparent;
}
.twm-chat-quick-chip {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.5rem 0.9rem;
    background: transparent;
    color: var(--twm-ink, #0e0e10);
    border: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    border-radius: 999px;
    font-family: var(--twm-fmono, "JetBrains Mono", monospace);
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.twm-chat-quick-chip:hover {
    background: var(--twm-ink, #0e0e10);
    color: var(--twm-cream, #f3efe7);
    border-color: var(--twm-ink, #0e0e10);
}
.twm-chat-quick-chip > span:last-child { transition: transform 0.2s; }
.twm-chat-quick-chip:hover > span:last-child { transform: translateX(3px); }

/* Zone messages : cream, espace genereux */
#twm-chat-messages {
    flex: 1; overflow-y: auto;
    padding: 1.1rem 1.2rem;
    display: flex; flex-direction: column; gap: 0.6rem;
    background: var(--twm-cream, #f3efe7);
    font-family: var(--twm-fsans, "Inter", sans-serif);
}
#twm-chat-messages::-webkit-scrollbar { width: 4px; }
#twm-chat-messages::-webkit-scrollbar-thumb { background: rgba(14,14,16,0.18); border-radius: 2px; }

.twm-chat-msg {
    max-width: 86%;
    padding: 0.7rem 0.95rem;
    border-radius: 2px;
    font-size: 0.9rem;
    line-height: 1.55;
    word-wrap: break-word;
    font-family: var(--twm-fsans, "Inter", sans-serif);
}
.twm-chat-msg-user {
    align-self: flex-end;
    background: var(--twm-ink, #0e0e10);
    color: var(--twm-cream, #f3efe7);
}
.twm-chat-msg-bot {
    align-self: flex-start;
    background: var(--twm-paper, #fbf9f4);
    color: var(--twm-ink, #0e0e10);
    border: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
}
.twm-chat-msg-error {
    align-self: center;
    background: transparent;
    color: var(--twm-orange, #ff5c1a);
    border: 1px solid var(--twm-orange, #ff5c1a);
    font-size: 0.78rem;
    font-family: var(--twm-fmono, monospace);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    padding: 0.45rem 0.8rem;
    border-radius: 2px;
}

/* Typing indicator — 3 dots ink */
.twm-chat-typing {
    display: flex; gap: 4px; align-items: center;
    padding: 0.7rem 0.95rem;
    align-self: flex-start;
}
.twm-typing-dot {
    width: 6px; height: 6px;
    background: var(--twm-mute, rgba(14,14,16,0.42));
    border-radius: 50%;
    animation: twmChatTyping 1.4s infinite ease-in-out;
}
.twm-typing-dot:nth-child(2) { animation-delay: 0.2s; }
.twm-typing-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes twmChatTyping {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
    40% { transform: scale(1); opacity: 1; }
}

/* Code dans messages bot */
.twm-chat-code {
    background: var(--twm-ink, #0e0e10);
    color: var(--twm-cream, #f3efe7);
    padding: 0.65rem 0.85rem;
    border-radius: 2px;
    font-size: 0.78rem;
    overflow-x: auto;
    margin: 0.5rem 0;
    font-family: var(--twm-fmono, "JetBrains Mono", monospace);
    line-height: 1.5;
}
.twm-chat-inline-code {
    background: var(--twm-cream-2, #eae5db);
    color: var(--twm-ink, #0e0e10);
    padding: 1px 6px;
    border-radius: 2px;
    font-size: 0.82rem;
    font-family: var(--twm-fmono, "JetBrains Mono", monospace);
}
.twm-chat-link {
    color: var(--twm-blue, #1a54a9);
    text-decoration: none;
    border-bottom: 1px solid var(--twm-blue, #1a54a9);
    transition: color 0.2s, border-color 0.2s;
}
.twm-chat-link:hover { color: var(--twm-orange, #ff5c1a); border-bottom-color: var(--twm-orange, #ff5c1a); }

/* Zone input : separateur hairline, fond paper */
/* Grid layout : input prend l espace restant (1fr), bouton garde sa taille (auto).
   Plus deterministe que flex contre les overrides Bootstrap/Moodle. */
.twm-chat-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    background: var(--twm-paper, #fbf9f4);
    flex-shrink: 0;
    box-sizing: border-box;
    width: 100%;
}
#twm-chat-input {
    width: 100%;            /* prend toute la cellule grid */
    min-width: 0;
    background: var(--twm-cream, #f3efe7);
    border: 1px solid var(--twm-line-cream, rgba(14,14,16,0.12));
    border-radius: 2px;
    padding: 0.6rem 0.85rem;
    font-size: 0.88rem;
    font-family: var(--twm-fsans, "Inter", sans-serif);
    color: var(--twm-ink, #0e0e10);
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.2s, background 0.2s;
}
#twm-chat-input:focus {
    border-color: var(--twm-ink, #0e0e10);
    background: var(--twm-paper, #fbf9f4);
}
#twm-chat-input::placeholder { color: var(--twm-mute, rgba(14,14,16,0.42)); }

/* Send button = carre ink fixe 40x40 avec fleche SVG centree. Impossible a couper. */
.twm-chat-send {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-width: 40px;
    flex-shrink: 0;
    padding: 0;
    margin: 0;
    background: var(--twm-ink, #0e0e10);
    color: var(--twm-cream, #f3efe7);
    border: 1px solid var(--twm-ink, #0e0e10);
    border-radius: 2px;
    cursor: pointer;
    box-sizing: border-box;
    line-height: 0;
    transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.twm-chat-send:hover {
    background: var(--twm-orange, #ff5c1a);
    border-color: var(--twm-orange, #ff5c1a);
}
.twm-chat-send:hover svg { transform: translateX(2px); }
.twm-chat-send svg { transition: transform 0.2s; display: block; }

@media (prefers-reduced-motion: reduce) {
    .twm-chat-toggle, #twm-chat-window, .twm-chat-send, #twm-chat-close,
    .twm-chat-link, .twm-typing-dot, .twm-chat-badge,
    .twm-chat-toggle-label, .twm-chat-quick, .twm-chat-quick-chip,
    svg.twm-chat-toggle-mark, .twm-chat-toggle-sats .twm-chat-sat,
    .twm-chat-toggle-node {
        animation: none !important;
        transition: none !important;
    }
}

/* (Bloc mobile orphelin + scrollbar dupliquee supprimes le 2026-05-23 :
    ils overridaient le nouveau design TWM avec border-radius: 12px,
    width: calc(100% - 16px) et toggle 52x52. Le responsive est gere par
    le media (max-width: 520px) du bloc #twm-chat-window principal.) */

/* ---------- Dashboard ---------- */
.twm-dash { max-width: 1200px; margin: 0 auto; padding: 1.5rem; }
.twm-dash-welcome {
    background: linear-gradient(135deg, #1A54A9 0%, #00B2A9 100%);
    color: #fff; padding: 2rem; border-radius: 16px; margin-bottom: 1.5rem;
    box-shadow: 0 8px 30px rgba(26,84,169,0.25);
}
.twm-dash-welcome h2 { font-family: "Montserrat", sans-serif; font-size: 1.5rem; margin-bottom: 0.5rem; }
.twm-dash-welcome p { opacity: 0.9; font-size: 0.95rem; }
.twm-dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.2rem; margin-bottom: 1.5rem; }
.twm-dash-card {
    background: #fff; border-radius: 12px; padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.06);
    transition: box-shadow 0.3s, transform 0.3s;
}
.twm-dash-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,0.1); transform: translateY(-2px); }
.twm-dash-card h3 {
    font-family: "Montserrat", sans-serif; font-size: 1rem;
    color: #1A54A9; margin-bottom: 0.8rem; display: flex; align-items: center; gap: 8px;
}
.twm-dash-card .twm-icon { font-size: 1.3rem; }
.twm-dash-stat { font-size: 2rem; font-weight: 700; color: #1A54A9; font-family: "Montserrat", sans-serif; }
.twm-dash-stat-label { font-size: 0.8rem; color: #666; margin-top: 0.2rem; }
.twm-dash-progress-bar { background: #e9ecef; border-radius: 6px; height: 8px; margin-top: 10px; overflow: hidden; }
.twm-dash-progress-fill { background: linear-gradient(90deg, #1A54A9, #00B2A9); height: 100%; border-radius: 6px; transition: width 1s ease; }
.twm-dash-link {
    display: inline-flex; align-items: center; gap: 6px;
    color: #1A54A9; text-decoration: none; font-weight: 600; font-size: 0.9rem;
    margin-top: 0.8rem; transition: color 0.2s;
}
.twm-dash-link:hover { color: #00B2A9; }
.twm-dash-quicklinks { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
.twm-dash-qlink {
    display: flex; align-items: center; gap: 12px; padding: 1rem 1.2rem;
    background: #fff; border-radius: 10px; text-decoration: none; color: var(--twm-text, #333);
    box-shadow: 0 2px 8px rgba(0,0,0,0.05); border: 1px solid rgba(0,0,0,0.06);
    transition: all 0.2s;
}
.twm-dash-qlink:hover { box-shadow: 0 4px 16px rgba(26,84,169,0.15); border-color: #1A54A9; transform: translateY(-1px); }
.twm-dash-qlink .twm-ql-icon {
    width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center;
    justify-content: center; font-size: 1.3rem; flex-shrink: 0;
}
.twm-dash-qlink .twm-ql-text { font-weight: 600; font-size: 0.9rem; font-family: "Montserrat", sans-serif; }
.twm-dash-qlink .twm-ql-sub { font-size: 0.75rem; color: #888; margin-top: 2px; }

/* ---------- Homepage ---------- */
.twm-home-wrap { padding-top: 0 !important; }
.twm-home-wrap #page-wrapper,
.twm-home-wrap #page,
.twm-home-wrap #page-content,
.twm-home-wrap #region-main-box,
.twm-home-wrap #region-main,
.twm-home-wrap [role="main"],
.twm-home-wrap .course-content,
.twm-home-wrap #topofscroll,
.twm-home-wrap .container-fluid {
    padding: 0 !important; margin: 0 !important; max-width: 100% !important;
    width: 100% !important; border: none !important; background: transparent !important;
    min-height: auto !important; height: auto !important;
}
.twm-home-wrap .secondary-navigation,
.twm-home-wrap #page-header,
.twm-home-wrap .breadcrumb,
.twm-home-wrap .activity-navigation,
.twm-home-wrap .drawer,
.twm-home-wrap #nav-drawer,
.twm-home-wrap [data-region="drawer"],
.twm-home-wrap .btn-footer-popover,
.twm-home-wrap #course-header,
.twm-home-wrap #page-footer { display: none !important; }
.twm-home-wrap .main-inner { max-width: 100% !important; padding: 0 !important; margin: 0 !important; }
.twm-home-wrap .min-vh-100 { min-height: auto !important; }

/* Hero */
.twm-hero {
    min-height: 100vh; margin-top: -64px; padding-top: 64px;
    background: linear-gradient(135deg, #1A54A9 0%, #0A2D5C 50%, #00B2A9 100%);
    color: #fff; display: flex; align-items: center; justify-content: center;
    text-align: center; padding-left: 1.5rem; padding-right: 1.5rem; padding-bottom: 2rem;
    position: relative; overflow: hidden; box-sizing: border-box;
}
.twm-hero::before {
    content: ""; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
    background: radial-gradient(circle at 30% 50%, rgba(0,178,169,0.15) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(255,107,53,0.1) 0%, transparent 40%);
    animation: twmHeroGlow 8s ease-in-out infinite alternate;
}
@keyframes twmHeroGlow {
    0% { transform: translate(0, 0) rotate(0deg); }
    100% { transform: translate(-3%, 3%) rotate(3deg); }
}
.twm-hero-content { position: relative; z-index: 2; max-width: 850px; }
.twm-hero-badge {
    display: inline-block; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.25);
    padding: 6px 18px; border-radius: 50px; font-size: 0.85rem; font-weight: 600;
    margin-bottom: 1.2rem; backdrop-filter: blur(4px);
    font-family: "Montserrat", sans-serif;
}
.twm-hero h1 {
    font-family: "Montserrat", sans-serif; font-size: 3.2rem; font-weight: 800;
    line-height: 1.15; margin: 0 0 1rem;
    animation: twmFadeUp 1s ease;
}
.twm-hero h1 .twm-accent { color: #FF6B35; }
.twm-hero-sub {
    font-size: 1.25rem; opacity: 0.9; margin: 0 0 2rem; line-height: 1.6;
    animation: twmFadeUp 1s ease 0.2s both;
}
.twm-hero-btns {
    display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;
    animation: twmFadeUp 1s ease 0.4s both;
}
.twm-btn {
    display: inline-block; padding: 1rem 2.5rem; border-radius: 50px; text-decoration: none;
    font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 1rem;
    transition: all 0.3s; border: 2px solid transparent; cursor: pointer;
}
.twm-btn-orange {
    background: linear-gradient(135deg, #FF6B35, #ff8c5a); color: #fff;
    box-shadow: 0 4px 20px rgba(255,107,53,0.4);
}
.twm-btn-orange:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(255,107,53,0.5); }
.twm-btn-white { background: #fff; color: #1A54A9; }
.twm-btn-white:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(255,255,255,0.3); }

/* Stats bar in hero */
.twm-hero-stats {
    display: flex; justify-content: center; gap: 3rem; margin-top: 2.5rem; flex-wrap: wrap;
    animation: twmFadeUp 1s ease 0.6s both;
}
.twm-hero-stat { text-align: center; }
.twm-hero-stat-num {
    font-size: 3rem; font-weight: 800; font-family: "Montserrat", sans-serif; color: #FF6B35;
}
.twm-hero-stat-label { font-size: 0.85rem; opacity: 0.8; margin-top: 2px; }

@keyframes twmFadeUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Sections */
.twm-section { padding: 6rem 0; }
.twm-section-inner { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }
.twm-section-title {
    font-family: "Montserrat", sans-serif; font-size: 2.5rem; font-weight: 800;
    text-align: center; margin: 0 0 0.5rem; color: #0A2D5C;
}
.twm-section-sub {
    text-align: center; color: #666; font-size: 1.05rem; max-width: 650px;
    margin: 0 auto 2.5rem; line-height: 1.6;
}

/* Programmes */
.twm-section-alt { background: #f8fafc; }
.twm-prog-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem;
}
.twm-prog-card {
    background: #fff; border-radius: 20px; padding: 2rem; text-align: center;
    box-shadow: 0 5px 30px rgba(0,0,0,0.08); border: 1px solid rgba(0,0,0,0.04);
    transition: all 0.4s; position: relative; overflow: hidden;
}
.twm-prog-card:hover { transform: translateY(-10px); box-shadow: 0 20px 50px rgba(15,71,173,0.15); }
.twm-prog-card.twm-featured { border: 2px solid #FF6B35; }
.twm-prog-card.twm-featured::after {
    content: "Populaire"; position: absolute; top: 16px; right: -28px;
    background: #FF6B35; color: #fff; font-size: 0.7rem; font-weight: 700;
    padding: 4px 32px; transform: rotate(45deg);
    font-family: "Montserrat", sans-serif;
}
.twm-prog-icon { font-size: 3rem; margin-bottom: 0.8rem; }
.twm-prog-card h3 {
    font-family: "Montserrat", sans-serif; font-size: 1.3rem; color: #0A2D5C;
    margin: 0 0 0.6rem;
}
.twm-prog-card p { font-size: 0.9rem; color: #666; line-height: 1.6; margin: 0; }
.twm-prog-link {
    display: inline-block; margin-top: 1rem; color: #1A54A9; font-weight: 600;
    text-decoration: none; font-size: 0.9rem; transition: color 0.2s;
}
.twm-prog-link:hover { color: #FF6B35; }

/* Advantages */
.twm-adv-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem;
}
.twm-adv-card {
    background: #fff; border-radius: 16px; padding: 2rem; text-align: center;
    transition: all 0.3s;
}
.twm-adv-card:hover { background: #f0f7ff; transform: translateY(-5px); }
.twm-adv-icon {
    width: 64px; height: 64px; border-radius: 16px; display: flex; align-items: center;
    justify-content: center; font-size: 1.8rem; margin: 0 auto 1rem;
}
.twm-adv-card h3 {
    font-family: "Montserrat", sans-serif; font-size: 1.1rem; color: #0A2D5C; margin: 0 0 0.4rem;
}
.twm-adv-card p { font-size: 0.88rem; color: #666; line-height: 1.6; margin: 0; }

/* Partners */
.twm-partners-title { font-size: 1.3rem; color: #999; font-weight: 600; margin-bottom: 1.5rem; }
.twm-partners-section { padding: 3rem 0; }
.twm-partners {
    display: flex; justify-content: center; align-items: center; gap: 3rem;
    flex-wrap: wrap; max-width: 1200px; margin: 0 auto; padding: 0 1.5rem;
}
.twm-partners span {
    font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 1.1rem;
    color: #999; letter-spacing: 1px;
}

/* CTA */
.twm-cta {
    background: linear-gradient(135deg, #0A2D5C 0%, #1A54A9 100%);
    color: #fff; padding: 5rem 1.5rem; text-align: center;
}
.twm-cta h2 {
    font-family: "Montserrat", sans-serif; font-size: 2.5rem; font-weight: 800; margin: 0 0 1rem;
}
.twm-cta p { font-size: 1.1rem; opacity: 0.9; max-width: 600px; margin: 0 auto 2rem; line-height: 1.6; }
.twm-cta-btns { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

/* FAQ */
.twm-faq-list { max-width: 750px; margin: 0 auto; }
.twm-faq-item {
    background: #fff; border-radius: 12px; margin-bottom: 1rem;
    box-shadow: 0 2px 15px rgba(0,0,0,0.05); overflow: hidden;
}
.twm-faq-q {
    display: flex; justify-content: space-between; align-items: center;
    padding: 1.2rem 1.5rem; cursor: pointer; font-weight: 600; font-size: 0.95rem;
    color: #0A2D5C; background: none; border: none; width: 100%; text-align: left;
    font-family: "Montserrat", sans-serif; transition: background 0.2s;
}
.twm-faq-q:hover { background: #f0f5ff; }
.twm-faq-q .twm-faq-icon {
    font-size: 1.3rem; transition: transform 0.3s; flex-shrink: 0; color: #1A54A9;
}
.twm-faq-item.twm-faq-open .twm-faq-icon { transform: rotate(45deg); }
.twm-faq-item.twm-faq-open .twm-faq-q { background: #E9F0F9; }
.twm-faq-a {
    max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.3s;
    padding: 0 1.5rem; font-size: 0.9rem; color: #555; line-height: 1.7;
}
.twm-faq-item.twm-faq-open .twm-faq-a { max-height: 300px; padding: 0 1.5rem 1.2rem; }

/* Homepage responsive */
@media (max-width: 992px) {
    .twm-prog-grid { grid-template-columns: repeat(2, 1fr); }
    .twm-adv-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .twm-hero h1 { font-size: 2rem; }
    .twm-hero-sub { font-size: 1rem; }
    .twm-hero-stats { gap: 1.5rem; }
    .twm-hero-stat-num { font-size: 2rem; }
    .twm-section { padding: 4rem 0; }
    .twm-section-title { font-size: 1.8rem; }
    .twm-cta h2 { font-size: 1.8rem; }
    .twm-cta { padding: 4rem 1.5rem; }
}
@media (max-width: 576px) {
    .twm-hero { min-height: auto; padding-top: 80px; padding-bottom: 2rem; }
    .twm-hero h1 { font-size: 1.5rem; }
    .twm-hero-sub { font-size: 0.95rem; }
    .twm-hero-btns { flex-direction: column; }
    .twm-btn { width: 100%; text-align: center; padding: 0.9rem 1.5rem; }
    .twm-prog-grid { grid-template-columns: 1fr; }
    .twm-adv-grid { grid-template-columns: 1fr; }
    .twm-section { padding: 3rem 0; }
    .twm-section-inner { padding: 0 1rem; }
    .twm-cta h2 { font-size: 1.4rem; }
    .twm-cta { padding: 3rem 1rem; }
    .twm-cta-btns { flex-direction: column; align-items: center; }
    .twm-partners { gap: 1.5rem; }
    .twm-footer-grid { grid-template-columns: 1fr; }
}

/* ---------- Catalogue page ---------- */
.cat-hero {
    background: linear-gradient(135deg, #1A54A9 0%, #0A2D5C 60%, #00B2A9 100%);
    color: #fff; padding: 5rem 2rem 3.5rem; text-align: center;
}
.cat-hero h1 { font-size: 2.6rem; margin-bottom: 0.8rem; }
.cat-hero p { font-size: 1.15rem; opacity: 0.9; max-width: 700px; margin: 0 auto 1.2rem; }
.cat-hero-partners {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem;
    margin-top: 1.5rem; max-width: 800px; margin-left: auto; margin-right: auto;
}
.cat-hero-partners span {
    background: rgba(255,255,255,0.15); padding: 4px 12px; border-radius: 20px;
    font-size: 0.75rem; font-weight: 600; letter-spacing: 0.3px;
}
.cat-stats {
    background: linear-gradient(135deg, #00B2A9, #1A54A9);
    color: #fff; padding: 2.5rem 2rem; text-align: center;
}
.cat-stats-grid { display: flex; justify-content: center; gap: 4rem; flex-wrap: wrap; }
.cat-stats-grid .si h3 { font-size: 2.5rem; font-family: 'Montserrat', sans-serif; }
.cat-stats-grid .si p { font-size: 0.9rem; opacity: 0.85; margin-top: 0.2rem; }
.cat-dnav {
    background: #fff; border-bottom: 1px solid #e5e5e5;
    padding: 1.2rem 2rem; position: sticky; top: 64px; z-index: 100;
    overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch;
}
.cat-dnav-inner {
    display: flex; gap: 0.5rem; max-width: 1200px; margin: 0 auto;
    justify-content: flex-start;
}
.cat-dnav a {
    display: inline-block; padding: 6px 14px; border-radius: 20px;
    font-size: 0.8rem; font-weight: 600; color: #555; text-decoration: none;
    border: 1px solid #ddd; transition: all 0.2s; white-space: nowrap;
    font-family: 'Montserrat', sans-serif;
}
.cat-dnav a:hover, .cat-dnav a.active {
    background: #1A54A9; color: #fff; border-color: #1A54A9;
}
.cat-search {
    max-width: 1200px; margin: 2rem auto 0; padding: 0 2rem;
}
.cat-search-box {
    display: flex; align-items: center; background: #fff;
    border: 2px solid #e0e0e0; border-radius: 12px; overflow: hidden;
    transition: border-color 0.2s;
}
.cat-search-box:focus-within { border-color: #1A54A9; }
.cat-search-box input {
    flex: 1; border: none; padding: 14px 18px; font-size: 1rem;
    font-family: 'Open Sans', sans-serif; outline: none; background: transparent;
}
.cat-search-box button {
    background: none; border: none; padding: 14px 18px; cursor: pointer;
    color: #888; font-size: 1.2rem;
}
.cat-domain {
    max-width: 1200px; margin: 0 auto; padding: 3rem 2rem 1rem;
}
.cat-domain:first-of-type { padding-top: 2rem; }
.cat-domain-header {
    display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem;
    padding-bottom: 1rem; border-bottom: 3px solid #1A54A9;
}
.cat-domain-icon {
    width: 52px; height: 52px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem; flex-shrink: 0;
    background: linear-gradient(135deg, #1A54A9, #00B2A9);
    color: #fff;
}
.cat-domain-header h2 { font-size: 1.5rem; color: #1A54A9; margin: 0; }
.cat-domain-header .cat-count {
    background: #E9F0F9; color: #1A54A9; padding: 4px 12px; border-radius: 20px;
    font-size: 0.8rem; font-weight: 700; white-space: nowrap;
}
.cat-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1rem; margin-bottom: 2rem;
}
.cat-card {
    background: #fff; border-radius: 12px; padding: 1.4rem;
    border: 1px solid #e8e8e8; transition: all 0.25s;
    display: flex; flex-direction: column; cursor: pointer;
    text-decoration: none; color: inherit;
}
.cat-card:hover, .cat-card:focus-visible {
    border-color: #1A54A9; box-shadow: 0 6px 24px rgba(26,84,169,0.1);
    transform: translateY(-2px); outline: none;
}
.cat-card-top { display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.6rem; }
.cat-card h3 {
    font-size: 0.95rem; color: #1a1a2e; margin: 0;
    font-weight: 700; line-height: 1.35; flex: 1;
}
.cat-badge {
    display: inline-block; padding: 2px 8px; border-radius: 4px;
    font-size: 0.65rem; font-weight: 800; letter-spacing: 0.5px;
    text-transform: uppercase; white-space: nowrap; flex-shrink: 0;
}
.cat-badge-new { background: #FF6B35; color: #fff; }
.cat-badge-upd { background: #00B2A9; color: #fff; }
.cat-card p {
    font-size: 0.85rem; color: #666; line-height: 1.55;
    margin: 0 0 0.8rem; flex: 1;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
    overflow: hidden;
}
.cat-card-meta {
    display: flex; gap: 1rem; margin-bottom: 0.8rem;
    font-size: 0.78rem; color: #555;
}
.cat-card-meta span {
    display: inline-flex; align-items: center; gap: 0.3rem;
}
.cat-card-footer {
    display: flex; align-items: center; gap: 0.5rem;
    padding-top: 0.6rem; border-top: 1px solid #f0f0f0;
}
.cat-cert-logo {
    width: 20px; height: 20px; border-radius: 4px;
    background: #E9F0F9; display: flex; align-items: center; justify-content: center;
    font-size: 0.6rem; font-weight: 800; color: #1A54A9;
}
.cat-cert-name { font-size: 0.78rem; color: #888; font-weight: 600; }
.cat-cta {
    background: linear-gradient(135deg, #FF6B35, #1A54A9); color: #fff;
    padding: 4rem 2rem; text-align: center; margin-top: 2rem;
}
.cat-cta h2 { font-size: 2rem; margin-bottom: 0.8rem; }
.cat-cta p { font-size: 1.1rem; opacity: 0.9; margin-bottom: 2rem; max-width: 600px; margin-left: auto; margin-right: auto; }
.cat-cta .twm-btn {
    display: inline-block; padding: 14px 32px; border-radius: 30px; text-decoration: none;
    font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1rem; transition: all 0.3s;
}
.cat-btn-white { background: #fff; color: #1A54A9; }
.cat-btn-white:hover { background: #E9F0F9; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.15); }
.cat-btn-orange { background: #FF6B35; color: #fff; margin-left: 1rem; border: 2px solid rgba(255,255,255,0.4); }
.cat-btn-orange:hover { background: #CE3400; transform: translateY(-2px); }
@media (max-width: 768px) {
    .cat-hero h1 { font-size: 1.8rem; }
    .cat-hero { padding: 4rem 1.2rem 2.5rem; }
    .cat-stats-grid { gap: 2rem; }
    .cat-stats-grid .si h3 { font-size: 2rem; }
    .cat-grid { grid-template-columns: 1fr; }
    .cat-domain { padding: 2rem 1.2rem 0.5rem; }
    .cat-domain-header { flex-wrap: wrap; }
    .cat-cta .twm-btn { display: block; margin: 0.5rem auto; max-width: 280px; }
    .cat-btn-orange { margin-left: 0; }
}

/* Catalogue extras */
#cat-no-results {
    display: none; text-align: center; padding: 4rem 2rem;
    color: #888; font-size: 1.1rem; max-width: 1200px; margin: 0 auto;
}
#cat-no-results .cat-nr-icon { font-size: 3rem; margin-bottom: 1rem; }
#cat-result-count {
    font-size: 0.85rem; color: #888; font-weight: 600;
    margin-left: 1rem; white-space: nowrap;
}

/* ---------- Formation detail page ---------- */
.fmt-hero {
    background: linear-gradient(135deg, #1A54A9 0%, #0A2D5C 60%, #00B2A9 100%);
    color: #fff; padding: 4rem 2rem 3rem;
}
.fmt-hero-inner { max-width: 1200px; margin: 0 auto; }
.fmt-hero-breadcrumb {
    display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap;
    font-size: 0.85rem; opacity: 0.8; margin-bottom: 1.2rem;
}
.fmt-hero-breadcrumb a { color: rgba(255,255,255,0.85); text-decoration: none; }
.fmt-hero-breadcrumb a:hover { color: #fff; text-decoration: underline; }
.fmt-hero-breadcrumb span { color: rgba(255,255,255,0.6); }
.fmt-hero-breadcrumb span:last-child { color: #fff; opacity: 1; font-weight: 600; }
.fmt-hero-title { display: flex; align-items: flex-start; gap: 0.8rem; flex-wrap: wrap; margin-bottom: 1rem; }
.fmt-hero-title h1 { font-size: 2.2rem; margin: 0; line-height: 1.2; }
.fmt-hero-title .cat-badge { margin-top: 0.5rem; }
.fmt-hero-desc { font-size: 1.1rem; opacity: 0.9; max-width: 800px; line-height: 1.7; }

.fmt-stats {
    background: #fff; border-bottom: 1px solid #e5e5e5;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.fmt-stats-inner {
    max-width: 1200px; margin: 0 auto; padding: 1.5rem 2rem;
    display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
}
.fmt-stat-item {
    display: flex; align-items: center; gap: 0.8rem; flex: 1; min-width: 180px;
}
.fmt-stat-icon {
    width: 44px; height: 44px; border-radius: 10px; background: #E9F0F9;
    display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0;
}
.fmt-stat-label { font-size: 0.75rem; color: #888; text-transform: uppercase; letter-spacing: 0.5px; font-weight: 600; }
.fmt-stat-value { font-size: 0.9rem; font-weight: 700; color: #1A54A9; }

.fmt-layout {
    display: grid; grid-template-columns: 1fr 380px; gap: 3rem;
    max-width: 1200px; margin: 0 auto; padding: 3rem 2rem;
}

.fmt-section { margin-bottom: 2.5rem; }
.fmt-section h2 {
    font-size: 1.4rem; color: #0A2D5C; margin-bottom: 1.2rem;
    padding-bottom: 0.6rem; border-bottom: 3px solid #1A54A9;
}

.fmt-objectives { list-style: none; padding: 0; }
.fmt-objectives li {
    position: relative; padding: 0.6rem 0 0.6rem 2rem; font-size: 0.92rem;
    line-height: 1.6; color: #444; border-bottom: 1px solid #f0f0f0;
}
.fmt-objectives li::before {
    content: "\2713"; position: absolute; left: 0; top: 0.6rem;
    color: #00B2A9; font-weight: 700; font-size: 1.1rem;
}
.fmt-objectives li:last-child { border-bottom: none; }

.fmt-program { display: flex; flex-direction: column; gap: 0.6rem; }
.fmt-module {
    background: #fff; border: 1px solid #e5e5e5; border-radius: 10px;
    overflow: hidden; transition: box-shadow 0.2s;
}
.fmt-module:hover { box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
.fmt-module-header {
    display: flex; align-items: center; gap: 0.8rem; padding: 1rem 1.2rem;
    background: none; border: none; width: 100%; text-align: left;
    cursor: pointer; font-family: 'Montserrat', sans-serif; transition: background 0.2s;
}
.fmt-module-header:hover { background: #f8fafc; }
.fmt-module-num {
    background: #1A54A9; color: #fff; padding: 3px 10px; border-radius: 6px;
    font-size: 0.72rem; font-weight: 700; white-space: nowrap;
}
.fmt-module-title { flex: 1; font-size: 0.92rem; font-weight: 600; color: #0A2D5C; }
.fmt-module-icon {
    font-size: 1.3rem; color: #1A54A9; transition: transform 0.3s; flex-shrink: 0;
}
.fmt-module-open .fmt-module-icon { transform: rotate(45deg); }
.fmt-module-open .fmt-module-header { background: #E9F0F9; }
.fmt-module-body {
    max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.3s;
    padding: 0 1.2rem;
}
.fmt-module-open .fmt-module-body { max-height: 500px; padding: 0.8rem 1.2rem 1.2rem; }
.fmt-module-body ul { list-style: none; padding: 0; margin: 0; }
.fmt-module-body li {
    position: relative; padding: 0.4rem 0 0.4rem 1.4rem;
    font-size: 0.88rem; color: #555; line-height: 1.5;
}
.fmt-module-body li::before {
    content: "\25B8"; position: absolute; left: 0; top: 0.4rem; color: #00B2A9;
}

.fmt-text { font-size: 0.95rem; color: #555; line-height: 1.8; }

/* Sidebar */
.fmt-sidebar { display: flex; flex-direction: column; gap: 1.5rem; }
.fmt-sidebar-card {
    background: #fff; border: 1px solid #e5e5e5; border-radius: 14px;
    padding: 1.5rem; box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    position: sticky; top: 80px;
}
.fmt-sidebar-header {
    display: flex; align-items: center; gap: 0.6rem;
    padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid #f0f0f0;
}
.fmt-sidebar-icon {
    width: 40px; height: 40px; border-radius: 10px;
    background: linear-gradient(135deg, #1A54A9, #00B2A9); color: #fff;
    display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
}
.fmt-sidebar-domain { font-size: 0.85rem; font-weight: 600; color: #1A54A9; }
.fmt-sidebar-info { margin-bottom: 1.2rem; }
.fmt-sidebar-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.5rem 0; border-bottom: 1px solid #f5f5f5; font-size: 0.85rem;
}
.fmt-sidebar-row span { color: #888; }
.fmt-sidebar-row strong { color: #333; font-size: 0.82rem; text-align: right; max-width: 60%; }
.fmt-sidebar-cta {
    display: block; width: 100%; text-align: center; padding: 14px !important;
    border-radius: 10px !important; font-size: 0.95rem !important; margin-bottom: 0.6rem;
}
.fmt-sidebar-back {
    display: block; text-align: center; color: #1A54A9; font-size: 0.85rem;
    font-weight: 600; text-decoration: none; padding: 8px;
}
.fmt-sidebar-back:hover { color: #00B2A9; }

.fmt-sidebar-block {
    background: #f8fafc; border-radius: 10px; padding: 1.2rem;
}
.fmt-sidebar-block h3 {
    font-size: 0.95rem; color: #0A2D5C; margin-bottom: 0.6rem;
}
.fmt-sidebar-block p {
    font-size: 0.85rem; color: #666; line-height: 1.6; margin: 0;
}

/* Formation responsive */
@media (max-width: 992px) {
    .fmt-layout { grid-template-columns: 1fr; }
    .fmt-sidebar-card { position: static; }
}
@media (max-width: 768px) {
    .fmt-hero { padding: 3rem 1.2rem 2rem; }
    .fmt-hero-title h1 { font-size: 1.6rem; }
    .fmt-hero-desc { font-size: 0.95rem; }
    .fmt-stats-inner { flex-direction: column; gap: 1rem; padding: 1.2rem; }
    .fmt-layout { padding: 2rem 1.2rem; gap: 2rem; }
}

/* ---------- Contact page ---------- */
.twm-contact-hero {
    background: linear-gradient(135deg, #1A54A9 0%, #0A2D5C 100%);
    color: #fff; padding: 4rem 2rem 3rem; text-align: center;
}
.twm-contact-hero h1 { font-size: 2.2rem; margin-bottom: 0.5rem; }
.twm-contact-hero p { opacity: 0.9; font-size: 1.05rem; }
.twm-contact-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 3rem;
    max-width: 1000px; margin: 0 auto; padding: 3rem 2rem;
}
@media (max-width: 768px) { .twm-contact-grid { grid-template-columns: 1fr; } }
.twm-contact-info h3 { color: #1A54A9; font-size: 1.3rem; margin-bottom: 1.5rem; }
.twm-contact-item {
    display: flex; align-items: flex-start; gap: 12px; margin-bottom: 1.5rem;
}
.twm-contact-item .twm-ci-icon {
    width: 44px; height: 44px; border-radius: 10px; background: #E9F0F9;
    display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0;
}
.twm-contact-item h4 { font-size: 0.95rem; color: #1A54A9; margin-bottom: 3px; }
.twm-contact-item p { font-size: 0.85rem; color: #666; margin: 0; }
.twm-contact-item a { color: #00B2A9; text-decoration: none; }
.twm-contact-item a:hover { color: #1A54A9; }
.twm-form h3 { color: #1A54A9; font-size: 1.3rem; margin-bottom: 1.5rem; }
.twm-form-group { margin-bottom: 1.2rem; }
.twm-form-group label {
    display: block; font-weight: 600; font-size: 0.85rem; color: #333;
    margin-bottom: 0.4rem; font-family: 'Montserrat', sans-serif;
}
.twm-form-group input,
.twm-form-group textarea {
    width: 100%; padding: 12px 16px; border: 2px solid #e0e0e0; border-radius: 8px;
    font-family: 'Open Sans', sans-serif; font-size: 0.9rem; transition: border-color 0.2s;
    background: #fff;
}
.twm-form-group input:focus,
.twm-form-group textarea:focus {
    outline: none; border-color: #1A54A9; box-shadow: 0 0 0 3px rgba(26,84,169,0.1);
}
.twm-form-group textarea { min-height: 140px; resize: vertical; }
.twm-form-submit {
    background: linear-gradient(135deg, #1A54A9, #00B2A9); color: #fff; border: none;
    padding: 14px 32px; border-radius: 8px; font-family: 'Montserrat', sans-serif;
    font-weight: 600; font-size: 1rem; cursor: pointer; transition: all 0.3s; width: 100%;
}
.twm-form-submit:hover { box-shadow: 0 6px 20px rgba(26,84,169,0.3); transform: translateY(-1px); }
.twm-alert-success {
    background: #d1f5e0; color: #155724; padding: 1rem 1.5rem; border-radius: 8px;
    margin-bottom: 1.5rem; border: 1px solid #c3e6cb;
}
.twm-alert-error {
    background: #f8d7da; color: #721c24; padding: 1rem 1.5rem; border-radius: 8px;
    margin-bottom: 1.5rem; border: 1px solid #f5c6cb;
}

/* ===== ABOUT PAGE ===== */
.twm-about-hero {
    background: linear-gradient(135deg, #1A54A9 0%, #0A2D5C 60%, #00B2A9 100%);
    color: #fff; padding: 5rem 2rem 4rem; text-align: center;
}
.twm-about-hero h1 { font-size: 2.5rem; margin-bottom: 1rem; }
.twm-about-hero p { font-size: 1.15rem; opacity: 0.9; max-width: 700px; margin: 0 auto; }
.twm-about-section { padding: 4rem 2rem; max-width: 1000px; margin: 0 auto; }
.twm-about-section h2 { color: #1A54A9; font-size: 1.8rem; margin-bottom: 1.5rem; text-align: center; }
.twm-about-section p { font-size: 1rem; line-height: 1.8; color: #555; }
.twm-about-section p + p { margin-top: 1rem; }
.twm-about-section.twm-section-alt { max-width: 100%; padding: 4rem 2rem; }
.twm-values-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem; margin-top: 2rem; max-width: 1000px; margin-left: auto; margin-right: auto;
}
.twm-value-card {
    background: #fff; border-radius: 12px; padding: 2rem; text-align: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.05);
    transition: transform 0.3s, box-shadow 0.3s;
}
.twm-value-card:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(26,84,169,0.12); }
.twm-value-icon { font-size: 2.5rem; margin-bottom: 1rem; }
.twm-value-card h3 { color: #1A54A9; font-size: 1.1rem; margin-bottom: 0.5rem; }
.twm-value-card p { font-size: 0.9rem; color: #666; }
.twm-about-stats {
    background: linear-gradient(135deg, #00B2A9 0%, #1A54A9 100%);
    color: #fff; padding: 3rem 2rem; text-align: center;
}
.twm-about-stats .twm-stats-grid { display: flex; justify-content: center; gap: 4rem; flex-wrap: wrap; }
.twm-about-stats .twm-stat-item h3 { font-size: 2.5rem; font-family: 'Montserrat', sans-serif; }
.twm-about-stats .twm-stat-item p { font-size: 0.9rem; opacity: 0.85; }
.twm-about-cta {
    background: linear-gradient(135deg, #FF6B35, #1A54A9); color: #fff;
    padding: 4rem 2rem; text-align: center;
}
.twm-about-cta h2 { font-size: 2rem; margin-bottom: 1rem; }
.twm-about-cta p { font-size: 1.1rem; opacity: 0.9; margin-bottom: 2rem; }

/* ===== ABOUT PAGE - RESPONSIVE ===== */
@media (max-width: 768px) {
    .twm-about-hero { padding: 4rem 1.2rem 3rem; }
    .twm-about-hero h1 { font-size: 1.8rem; }
    .twm-about-section { padding: 3rem 1.2rem; }
    .twm-about-stats .twm-stats-grid { gap: 2rem; }
    .twm-about-stats .twm-stat-item h3 { font-size: 2rem; }
    .twm-about-cta h2 { font-size: 1.5rem; }
    .twm-about-cta .twm-btn { display: block; margin: 0.5rem auto; max-width: 280px; }
    .twm-about-cta .twm-btn-orange { margin-left: 0; }
}

/* ===== SOLUTIONS PAGE (tech tags in card footer) ===== */
.sol-tech-tag {
    background: #f0f4ff; color: #1A54A9; padding: 2px 8px; border-radius: 4px;
    font-size: 0.65rem; font-weight: 700; letter-spacing: 0.3px;
    font-family: 'Montserrat', sans-serif;
}
#sol-result-count {
    font-size: 0.85rem; color: #888; font-weight: 600;
    margin-left: 1rem; white-space: nowrap;
}

/* ===== UPLOAD PAGE ===== */
.twm-existing { margin-top: 3rem; }