/* Étape 9 · MB Académie · Couche visuelle réversible. Voir docs/ETAPE-9-UI-UX.md. */
.ui-polish {
  --primary: #2454ce;
  --primary-dark: #1b42a6;
  --text-muted: #5b6b80;
  --gradient-primary: linear-gradient(135deg, #2454ce, #1e48b5);
  --gradient-hero: radial-gradient(ellipse at 95% 100%, #7a421e 0, transparent 34%), radial-gradient(ellipse at 90% 30%, #234d94 0, transparent 60%), linear-gradient(120deg, #101c32, #182d4b);
  --shadow-sm: 0 2px 8px #101c3206;
  --shadow-lg: 0 16px 40px #101c320a;
  background: #f7f8fa;
  color: var(--text-body);
}
[data-theme="dark"] .ui-polish, .ui-polish[data-theme="dark"] {
  --primary: #93b8ff;
  --primary-dark: #bfdbfe;
  --text-muted: #a2afc2;
  background: #0f172a;
}
.ui-polish h1, .ui-polish h2, .ui-polish h3 { text-wrap: balance; }
/* Center section introductions and keep balanced, readable title lines. */
body.ui-polish main .section-header { text-align:center !important; margin-inline:auto !important; }
body.ui-polish main .section-header :is(h2,.section-title) { max-width:28ch; margin-inline:auto; line-height:1.2; text-wrap:balance; }
body.ui-polish main .section-header :is(p,.section-description) { margin-inline:auto; }
.ui-polish :is(h1,h2) { letter-spacing: -.035em; }
.ui-polish .section-padding { padding: clamp(56px,7vw,96px) 0; }
.ui-polish .section-title { font-size: clamp(29px,3.1vw,42px); line-height: 1.18; }
.ui-polish .section-description { max-width: 65ch; line-height: 1.8; }
.ui-polish .section-header { max-width: 780px; margin-bottom: 44px; }
.ui-polish .section-tag { background: transparent; border: 0; padding: 0; border-radius: 0; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--primary); }
.ui-polish .section-tag::before { content: ''; display: inline-block; width: 20px; height: 2px; background: #f97316; vertical-align: middle; margin-right: 10px; }
.ui-polish .section-title .gradient-text { background: none; color: var(--primary); -webkit-text-fill-color: currentColor; }
.ui-polish :is(a,button,input,textarea,select,summary):focus-visible { outline: 3px solid #b45309; outline-offset: 4px; }
.ui-polish :is(.hero,.header:not(.scrolled),.footer) :is(a,button):focus-visible { outline-color: #fdba74; }
.ui-polish .btn { min-height: 48px; border-radius: 12px; font-weight: 600; line-height: 1.4; transition: transform .2s ease; text-align: center; }
.ui-polish .btn-primary { background: #2454ce; color: #fff; box-shadow: 0 4px 12px #2454ce20; }
.ui-polish .btn-primary:hover { background: #1b42a6; box-shadow: 0 6px 18px #2454ce28; transform: translateY(-2px); }
.ui-polish .btn-outline { background: transparent; border: 1px solid var(--gray-300); color: var(--gray-900); box-shadow: none; }
.ui-polish .btn-outline:hover { background: var(--gray-100); border-color: var(--gray-500); transform: translateY(-2px); }
.ui-polish .btn:disabled, .ui-polish button[disabled] { cursor: not-allowed; transform: none; }
.ui-polish .btn-lg { padding: 15px 26px; font-size: 15px; min-height: 52px; }
.ui-polish .btn-sm { min-height: 44px; }
.ui-polish .header { border-bottom: 1px solid #ffffff15; }
.ui-polish .nav-container { gap: 12px; }
.ui-polish .logo { width: auto; gap: 9px; margin: 0; }
.ui-polish .logo img { width: 40px; height: 40px; }
.ui-polish .logo-text { display: block; font-size: 17px; }
.ui-polish .nav-menu { margin: 0; gap: 2px; }
.ui-polish .nav-link { min-height: 44px; font-size: 12px; padding: 9px 7px; }
.ui-polish .btn-header { min-height: 44px; padding: 10px 12px; font-size: 12px; border-radius: 9px; }
.ui-polish .theme-toggle { width: 44px; height: 44px; flex-shrink: 0; }
.ui-polish .header:not(.scrolled) .btn-outline { color: #e3ebf8; border-color: #ffffff42; background: transparent; }
.ui-polish .header:not(.scrolled) .btn-outline:hover { background: #ffffff12; }
[data-theme="dark"] .ui-polish .header.scrolled .logo img { filter: none; }
.ui-polish .mobile-menu { justify-content: flex-start; padding-top: 90px; background: var(--white); }
.ui-polish .mobile-nav-list { width: 100%; gap: 3px; margin-bottom: 12px; }
.ui-polish .mobile-nav-link { display: block; text-align: left; padding: 12px 18px; font-size: 18px; min-height: 48px; }
.ui-polish .mobile-cta { background: #2454ce !important; color:#fff; border-radius: 12px; max-width: none; }
.ui-polish .button.secondary { color:var(--primary); border-color:var(--gray-300); background:var(--white); }
.ui-polish .team-tier-label--pedagogy { color:var(--accent-text); }
.ui-polish .rdv-cal-hint,.ui-polish #rdvForm>p { color:var(--text-secondary)!important; }
.ui-polish .account-type-btn.is-active { background:#2454ce; color:#fff; }
.ui-polish .button.primary { color:#fff; }
.ui-polish :is(input,textarea)::placeholder { color:var(--text-secondary); opacity:1; }
[data-theme="dark"] .ui-polish .legal-info-label { color:var(--text-secondary); }
.ui-polish :is(.page-hero,.page-hero-formations,.page-hero-about,.page-hero-contact,.page-hero-legal) { background: var(--gradient-hero); }
.ui-polish :is(.hero,.page-hero,.page-hero-formations,.page-hero-about,.page-hero-contact,.page-hero-legal) :is(h1,.hero-title) {
  display: block; max-width: 23ch; margin-left: auto; margin-right: auto; font-size: clamp(34px,4.7vw,64px); line-height: 1.12; color: #fff;
}
.ui-polish :is(.hero,.page-hero,.page-hero-formations,.page-hero-about,.page-hero-contact,.page-hero-legal) .gradient-text { background: none; -webkit-text-fill-color: #bfdbfe; color: #bfdbfe; }
.ui-polish :is(.page-hero,.page-hero-formations,.page-hero-about,.page-hero-contact,.page-hero-legal) p { color: #d0dced; max-width: 65ch; line-height: 1.75; margin-left: auto; margin-right: auto; }
.home-page .hero { min-height: 560px; padding: 136px 0 68px; }
.home-page .hero-container { flex: none; }
.home-page .hero-content { max-width: 980px; margin: auto; }
.home-page .hero-eyebrow { color: #d0dced; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 24px; }
.home-page .hero-title { margin-bottom: 24px; }
.home-page .hero-subtitle { max-width: 65ch; font-size: clamp(16px,1.5vw,18px); line-height: 1.75; color: #d0dced; margin: 0 auto 28px; }
.home-page .hero-actions { margin: 0; gap: 12px; width: 100%; }
.home-page .hero .btn-primary { background: #fff; color: #163b84; box-shadow: 0 8px 24px #0002; }
.home-page .hero .btn-primary:hover { background: #eaf1ff; }
.home-page .hero .btn-outline { border-color: #ffffff60; color: #fff; }
.home-page .hero .btn-outline:hover { background: #ffffff12; }
.home-page .hero-gradient::after { display: none; }
.ui-polish .hero-extras { padding: 32px 0; border-bottom: 1px solid var(--gray-200); background: var(--white); }
.home-page .hero-extras { padding: 26px 0; }
.home-page .hero-stats { margin: 0; justify-content: space-evenly; gap: 24px; }
.home-page .hero-extras .stat-item { display: flex; align-items: center; gap: 14px; text-align: left; }
.home-page .hero-extras .stat-number { font-size: 19px; font-weight: 600; color: var(--gray-900); }
.home-page .hero-extras .stat-label { font-size: 12px; max-width: 17ch; color: var(--text-secondary); }
.home-page .hero-extras .stat-divider { height: 30px; }
.ui-polish :is(.expertise-card,.secteur-card,.sidebar-card,.course-facts,.offer-comparison article,.course-related-card) { border-radius: 16px; border-color: var(--gray-200); box-shadow: var(--shadow-sm); }
.ui-polish :is(.expertise-card,.secteur-card) { padding: 28px; transition: transform .2s ease; }
.ui-polish :is(.expertise-card,.secteur-card):hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--gray-300); }
.ui-polish :is(.expertise-card,.secteur-card) :is(.card-icon,.secteur-card-icon) { background: var(--gray-100); color: var(--primary); border-radius: 12px; transform: none; box-shadow: none; }
.ui-polish .expertise-card:nth-child(even) .card-link { color: var(--primary); }
.ui-polish .card-link { min-height: 44px; border-radius: 8px; margin-left: 0; padding: 8px 0; }
.ui-polish .card-link:hover { gap: 8px; background: transparent; text-decoration: underline; text-underline-offset: 5px; }
.ui-polish .card-glow { display: none; }
.ui-polish .secteur-card .secteur-btn { margin-top: auto; border-radius: 10px; }
.home-page .why-us>.container { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 80px; align-items: start; }
.home-page .why-us .section-header { text-align: left; margin: 0; }
.home-page .why-us .section-title { max-width: 16ch; }
.home-page .why-us .features-grid { grid-template-columns: 1fr; gap: 0; }
.home-page .why-us .feature-card { border: 0; border-top: 1px solid var(--gray-300); background: transparent; border-radius: 0; padding: 25px 0; gap: 24px; }
.home-page .why-us .feature-card:hover { transform: none; box-shadow: none; }
.home-page .why-us .feature-number { background: none; -webkit-text-fill-color: currentColor; color: var(--primary); font-size: 15px; padding-top: 3px; }
.ui-polish .feature-title { font-size: 20px; }
.ui-polish .faq-item { border-radius: 12px; box-shadow: none; }
.ui-polish .faq-question { min-height: 64px; line-height: 1.5; gap: 20px; }
.ui-polish .faq-item:hover { transform: none; }
.ui-polish .faq-item.active .faq-answer { max-height: none; }
.ui-polish .google-reviews { border-block: 1px solid var(--gray-200); background: var(--white); }
.ui-polish .google-reviews-heading { margin-bottom: 0; }
.ui-polish .google-reviews-policy { text-align: center; color: var(--text-secondary); }
.ui-polish .cta-card-v2 { box-shadow: var(--shadow-lg); border-radius: 24px; }
.ui-polish .cta-v2-visual { background: var(--gradient-hero); }
.ui-polish .footer { background: #101c32; }
.ui-polish .footer-content { padding-bottom: 40px; gap: 48px; }
.ui-polish .footer-logo img { width: 88px; height: 88px; }
.ui-polish .footer-brand-row { gap: 22px; }
.ui-polish .footer-description { max-width: 32ch; color: #bdcadd; }
.ui-polish .footer-list { gap: 2px; }
.ui-polish .footer-list a { display: inline-flex; align-items: center; min-height: 36px; color: #bdcadd; }
.ui-polish .footer-list a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.ui-polish .footer-bottom { color: #bdcadd; border-top-color: #ffffff1a; }
.ui-polish .offer-jump { gap: 8px; }
.ui-polish .offer-jump a { border-radius: 8px; min-height: 44px; font-size: 14px; }
.ui-polish .offer-jump a:hover { background: var(--gray-100); border-color: var(--primary); }
.ui-polish .contact-choice { padding-top: 24px; margin-top: 0; }
.ui-polish .quote-layout { gap: 64px; }
.ui-polish .quote-form { padding: 32px; box-shadow: 0 12px 40px #101c3208; border-radius: 20px; }
.ui-polish .quote-form legend { font-family: var(--font-heading); font-size: 23px; letter-spacing: -.025em; }
.ui-polish .quote-grid { gap: 22px 18px; margin-top: 26px; }
.ui-polish .quote-field :is(input,textarea,select) { min-height: 48px; border-color: #7d8b9f; font-size: 16px; border-radius: 10px; }
.ui-polish .quote-intro ol { list-style: none; padding-left: 0; counter-reset: quote-step; margin-block: 28px; }
.ui-polish .quote-intro li { counter-increment: quote-step; position: relative; padding-left: 44px; margin-bottom: 24px; }
.ui-polish .quote-intro li::before { content: '0' counter(quote-step); position: absolute; top: 0; left: 0; font-family: var(--font-heading); color: var(--primary); font-weight: 600; }
.ui-polish .quote-intro a { text-decoration: underline; text-underline-offset: 4px; overflow-wrap: anywhere; }
.ui-polish .quote-form .btn { width: 100%; }
.ui-polish #rdv { border-top: 1px solid var(--gray-200); background: var(--white); }
.ui-polish .course-button-primary { background: #2454ce; color: #fff; border-radius: 12px; }
.ui-polish .course-nav a { min-height: 44px; display: inline-flex; align-items: center; }
.ui-polish .course-intro { padding-top: 116px; padding-bottom: 56px; }
.ui-polish .course-download { min-height: 44px; }
.ui-polish .auth-page { background: radial-gradient(ellipse at 10% 0%, #2454ce10, transparent 60%), var(--gray-50); padding: 40px 24px; }
.ui-polish .auth-card { border-radius: 24px; border-top: 3px solid #2454ce; box-shadow: 0 20px 60px #101c3210; }
.ui-polish .auth-title { font-size: 32px; }
.ui-polish .auth-field :is(input,select), .ui-polish .auth-select { min-height: 48px; font-size: 16px; border-radius: 10px; }
.ui-polish .auth-field:not(.has-error) :is(input,select,textarea) { border-color: #7d8b9f; }
[data-theme="dark"] .ui-polish .quote-field :is(input,textarea,select), [data-theme="dark"] .ui-polish .auth-field:not(.has-error) :is(input,select,textarea) { border-color: #8292a9; }
.ui-polish :is(.auth-submit,.auth-oauth,.password-toggle) { min-height: 48px; border-radius: 10px; }
.ui-polish .password-toggle { min-width: 44px; }
.ui-polish .auth-submit { background: #2454ce; color: #fff; }
.ui-polish .auth-links { gap: 10px; }
.ui-polish .auth-links a { min-height: 44px; display: inline-flex; align-items: center; }
.ui-polish :is(.scroll-to-top,.video-modal-close,.formation-modal-close,.rdv-cal-nav) { min-width: 44px; min-height: 44px; }
.ui-polish :is(.rdv-cal-day,.rdv-slot-btn,.account-type-btn) { min-height: 44px; }
.ui-polish .auth-field .field-error, .ui-polish .auth-alert.error { color: #b91c1c; }
[data-theme="dark"] .ui-polish .auth-field .field-error, [data-theme="dark"] .ui-polish .auth-alert.error { color: #fca5a5; }
@media (max-width: 1199px) {
  .ui-polish .nav-menu, .ui-polish .nav-actions .btn { display: none; }
  .ui-polish .nav-actions { display: flex; margin-left: auto; }
  .ui-polish .menu-toggle { display: flex; width: 44px; height: 44px; }
  .ui-polish .nav-container { padding-inline: 24px; }
}
@media (min-width: 1200px) and (max-width: 1399px) {
  .ui-polish .logo-text { display: none; }
}
@media (max-width: 900px) {
  .home-page .why-us>.container { grid-template-columns: 1fr; gap: 30px; }
  .home-page .why-us .section-title { max-width: 25ch; }
  .ui-polish .quote-layout { gap: 32px; }
  .home-page .hero-extras .stat-item { flex-direction: column; gap: 4px; text-align: center; }
}
@media (max-width: 600px) {
  .ui-polish .nav-container { padding-inline: 16px; gap: 8px; }
  .ui-polish .logo-text { font-size: 15px; }
  .ui-polish .logo img { width: 32px; height: 32px; }
  .ui-polish .section-header { margin-bottom: 30px; }
  .ui-polish .section-description { font-size: 16px; }
  .home-page .hero { padding: 108px 0 40px; min-height: 0; }
  .home-page .hero-eyebrow { font-size: 10px; letter-spacing: .1em; max-width: 30ch; margin: 0 auto 20px; line-height: 1.8; }
  .home-page .hero-title { font-size: clamp(32px,8.8vw,44px); }
  .home-page .hero-subtitle { font-size: 15px; line-height: 1.75; margin-bottom: 24px; }
  .home-page .hero-actions { gap: 10px; max-width: 400px; }
  .ui-polish .hero-actions .btn { white-space: normal; }
  .home-page .hero-extras .stat-label { font-size: 11px; }
  .home-page .hero-extras .stat-number { font-size: 16px; }
  .home-page .hero-stats { flex-wrap: nowrap; gap: 10px; }
  .home-page .hero-stats .stat-divider { display: none; }
  .ui-polish .expertises-grid { grid-template-columns: 1fr; }
  .ui-polish :is(.expertise-card,.secteur-card) { padding: 24px; }
  .ui-polish .contact-choice { padding-inline: 24px; }
  .ui-polish .quote-form { padding: 24px 18px; }
  .ui-polish .quote-form legend { font-size: 21px; }
  .ui-polish .footer-brand-row { align-items: center; }
  .ui-polish .footer-content { gap: 32px; }
  .ui-polish .footer-list a { min-height: 44px; }
  .ui-polish .auth-page { padding: 24px 16px; }
  .ui-polish .auth-card { padding: 28px 22px; }
  .ui-polish .auth-links { flex-wrap: wrap; }
}
/* Keep text visible during fast scrolling and before animation initialization. */
.ui-polish [data-aos] { opacity: 1 !important; }
/* Neutralise l'animation d'entrée AOS sans bloquer le mouvement au survol. */
@media (hover: hover) and (pointer: fine) { .ui-polish [data-aos]:not(:hover) { transform: none !important; } }
@media (hover: none), (pointer: coarse) { .ui-polish [data-aos] { transform: none !important; } }
.ui-polish [data-aos] { transition: transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s ease, border-color .3s ease !important; }

/* Shared finishing details — September 2026. */
.ui-polish.layout-refresh .story-intro .section-header {position:static;}
.ui-polish.layout-refresh .story-quality {margin-top:64px;padding-top:32px;border-top:1px solid var(--gray-200);}
.ui-polish.layout-refresh .story-quality h2 {font-size:clamp(26px,2.5vw,34px);}
.ui-polish .faq-accordion {width:100%;max-width:800px;margin-inline:auto;}
.ui-polish .faq-accordion .faq-item {padding:0;margin:0 0 12px;border-radius:12px;background:var(--white);}
.ui-polish .faq-accordion .faq-question {padding:20px 24px;min-height:64px;}
.ui-polish .faq-accordion .faq-answer p {margin:0;padding:0 24px 20px;}
.ui-polish .faq-answer:not([hidden]) {animation:answer-reveal .35s ease both;}
@keyframes answer-reveal {from{opacity:.3;translate:0 -6px}to{opacity:1;translate:0 0}}
.ui-polish .section-arrived {animation:section-entrance .7s cubic-bezier(.2,.7,.2,1) both;}
@keyframes section-entrance {from{translate:0 24px}to{translate:0 0}}
.ui-polish .btn {transition:translate .25s,box-shadow .25s,background-color .25s;}
.ui-polish .btn:hover {translate:0 -3px;}
@media(max-width:767px){.ui-polish.layout-refresh .story-quality{margin-top:32px;}}

/* Survol vivant — 17/09/2026, demandé par Jimmy. Mouvement et ombres seulement : aucune couleur modifiée.
   Souris uniquement : sur écran tactile, rien ne reste « collé » après un toucher. */
@media (hover: hover) and (pointer: fine) {
  .ui-polish.layout-refresh .secteur-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 30px 60px rgba(37,99,235,0.16), 0 10px 20px rgba(0,0,0,0.06);
    border-color: rgba(37,99,235,0.25);
  }
  .ui-polish.layout-refresh .secteur-card:hover .secteur-card-icon {
    transform: scale(1.1) rotate(-6deg);
    box-shadow: 0 12px 24px rgba(37,99,235,0.18);
  }
  .ui-polish.layout-refresh .secteur-card:hover .secteur-btn { transform: translateY(-2px); }
  .ui-polish.layout-refresh .secteur-banner:hover { transform: translateY(-6px); }
  .ui-polish.layout-refresh .format-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(20,45,84,0.14);
  }
  .ui-polish.layout-refresh #programmes .programme-link:hover {
    translate: 0 -8px;
    box-shadow: 0 24px 44px rgba(23,48,92,0.12);
  }
  .ui-polish.layout-refresh .expertise-card:hover { transform: translateY(-4px); }
  .ui-polish.layout-refresh .expertise-card:hover .card-icon { transform: scale(1.1) rotate(5deg); }
  .ui-polish.layout-refresh .benefice-card:hover { transform: translateY(-4px); }
  .ui-polish.layout-refresh .benefice-card:hover .benefice-icon { transform: scale(1.12); }
  .ui-polish.layout-refresh .methode-card:hover { transform: translateY(-4px); }
  .ui-polish.layout-refresh .training-card:hover { transform: translateY(-4px); }
  .ui-polish .resource-card, .ui-polish .project-guide { transition: transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s ease, border-color .3s ease; }
  .ui-polish .resource-card:hover, .ui-polish .project-guide:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(20,45,84,0.12);
    border-color: rgba(37,99,235,0.25);
  }
  .ui-polish .benefice-icon, .ui-polish .card-icon, .ui-polish .secteur-card-icon { transition: transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease; }
}
@media (prefers-reduced-motion: reduce) {
  .ui-polish [data-aos], .ui-polish .resource-card, .ui-polish .project-guide { transition: none !important; }
}