/* Ajouts du site statique CREO (menu mobile, FAQ, liste d'attente, vidéos, animations) */

html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; }

/* Apparition au défilement (uniquement si JavaScript est actif) */
html.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
html.js .reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html.js .reveal { opacity: 1; transform: none; transition: none; } }

/* En-tête */
#site-header.is-scrolled, #site-header.menu-open {
  background: rgba(255, 255, 255, .88);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: 0 1px 0 rgba(15, 23, 42, .06), 0 8px 24px rgba(15, 23, 42, .04);
}

/* Menu mobile */
.mobile-menu { border-top: 1px solid #E2E8F0; background: #FFFFFF; padding: 12px 0 24px; max-height: calc(100vh - 80px); overflow-y: auto; }
.mobile-menu[hidden] { display: none; }
@media (min-width: 1024px) { .mobile-menu { display: none !important; } }
.mobile-menu__link { display: block; padding: 14px 0; font-size: 1rem; font-weight: 500; color: #334155; border-bottom: 1px solid #F1F5F9; text-decoration: none; }
.mobile-menu__link:hover { color: #0F172A; }
.mobile-menu__ctas { display: grid; gap: 12px; margin-top: 20px; }
.mobile-menu__login, .mobile-menu__signup { display: flex; align-items: center; justify-content: center; min-height: 48px; border-radius: 9999px; font-weight: 600; font-size: .95rem; text-decoration: none; }
.mobile-menu__login { border: 1px solid #E2E8F0; color: #0F172A; }
.mobile-menu__signup { color: #FFFFFF; background: linear-gradient(90deg, #8B5CF6, #6366F1); box-shadow: 0 10px 24px rgba(139, 92, 246, .3); }

/* FAQ */
[data-faq] svg { transition: transform .2s ease; }
[data-faq][aria-expanded="true"] svg { transform: rotate(180deg); }
.faq-panel[hidden] { display: none; }

/* Vidéos */
.creo-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #0A0B14; }
[data-episode].has-video { cursor: pointer; }
[data-episode].has-video:focus-visible { outline: 3px solid #8B5CF6; outline-offset: 3px; }

/* Fenêtre liste d'attente */
body.modal-open { overflow: hidden; }
.cmodal { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; padding: 16px; }
.cmodal[hidden] { display: none; }
.cmodal__backdrop { position: absolute; inset: 0; background: rgba(10, 11, 20, .55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.cmodal__card { position: relative; width: 100%; max-width: 460px; max-height: calc(100vh - 32px); overflow-y: auto; background: #FFFFFF; border-radius: 24px; padding: 32px 28px 24px; box-shadow: 0 30px 80px rgba(10, 11, 20, .3); font-family: Inter, system-ui, sans-serif; color: #0F172A; }
.cmodal__close { position: absolute; top: 12px; right: 14px; width: 40px; height: 40px; border: 0; background: transparent; font-size: 28px; line-height: 1; color: #64748B; cursor: pointer; border-radius: 9999px; }
.cmodal__close:hover { background: #F1F5F9; color: #0F172A; }
.cmodal__eyebrow { margin: 0 0 8px; font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #7C3AED; }
.cmodal__title { margin: 0 0 8px; font-family: "Space Grotesk", Inter, sans-serif; font-size: 1.6rem; line-height: 1.15; font-weight: 700; }
.cmodal__text { margin: 0 0 20px; color: #475569; font-size: .95rem; line-height: 1.5; }
.cmodal__form { display: grid; gap: 14px; }
.cmodal__form label { display: grid; gap: 6px; font-size: .85rem; font-weight: 600; color: #334155; }
.cmodal__form input, .cmodal__form select { height: 48px; padding: 0 14px; border: 1px solid #E2E8F0; border-radius: 14px; font: inherit; font-weight: 400; font-size: 1rem; color: #0F172A; background: #F8FAFC; }
.cmodal__form input:focus, .cmodal__form select:focus { outline: none; border-color: #8B5CF6; box-shadow: 0 0 0 3px rgba(139, 92, 246, .2); background: #FFFFFF; }
.cmodal__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.cmodal__submit { height: 52px; margin-top: 4px; border: 0; border-radius: 9999px; font: inherit; font-weight: 600; font-size: 1rem; color: #FFFFFF; cursor: pointer; background: linear-gradient(90deg, #8B5CF6, #6366F1); box-shadow: 0 12px 28px rgba(139, 92, 246, .32); }
.cmodal__submit:disabled { opacity: .6; cursor: wait; }
.cmodal__msg { margin: 0; min-height: 1.2em; font-size: .9rem; }
.cmodal__msg.is-ok { color: #047857; }
.cmodal__msg.is-error { color: #B91C1C; }
.cmodal__legal { margin: 0; font-size: .75rem; color: #64748B; line-height: 1.4; }
