.docs-page{--docs-radius:22px}
.docs-page .docs-hero{padding:34px 0 76px;background:linear-gradient(135deg,var(--bg),var(--bg2) 68%,color-mix(in srgb,var(--accent2) 58%,var(--bg)))}
.docs-page .docs-breadcrumb{margin-bottom:46px}
.docs-page .docs-breadcrumb a,.docs-page .docs-breadcrumb span{font-size:13px}
.docs-page .docs-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.7fr);gap:clamp(34px,7vw,100px);align-items:end}
.docs-page .docs-hero h1{max-width:760px;font-size:clamp(46px,7vw,92px);letter-spacing:-.065em;line-height:.96}
.docs-page .docs-hero .sub{max-width:620px;margin:24px 0 0;font-size:20px}
.docs-page .docs-search{display:flex;align-items:center;gap:12px;max-width:650px;margin-top:34px;padding:9px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.docs-page .docs-search-label{color:var(--muted);font-size:13px;white-space:nowrap}
.docs-page .docs-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:16px;padding:8px 2px}
.docs-page .docs-search input:focus{outline:2px solid color-mix(in srgb,var(--accent) 38%,transparent);outline-offset:3px;border-radius:5px}
.docs-page .docs-hero-note{padding:25px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:var(--docs-radius);background:color-mix(in srgb,var(--card) 84%,transparent)}
.docs-page .docs-hero-note .docs-index{display:block;color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.docs-page .docs-hero-note strong{display:block;margin-top:14px;font-size:22px;letter-spacing:-.025em}
.docs-page .docs-hero-note p{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.55}
.docs-page .docs-main{padding:70px 0 90px;border-top:1px solid var(--line)}
.docs-page .docs-intro{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:34px}
.docs-page .docs-intro h2{font-size:clamp(30px,4vw,48px);letter-spacing:-.045em}
.docs-page .docs-intro p{max-width:48ch;margin:0;color:var(--muted);font-size:16px;line-height:1.5}
.docs-page .docs-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:clamp(28px,5vw,70px);align-items:start}
.docs-page .docs-sidebar{position:sticky;top:110px}
.docs-page .docs-sidebar-title{margin-bottom:12px;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.docs-page .docs-filters{display:grid;gap:5px}
.docs-page .docs-filters button{width:100%;padding:10px 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--muted);cursor:pointer;text-align:left;font:inherit;font-size:14px}
.docs-page .docs-filters button:hover,.docs-page .docs-filters button.active{border-color:var(--line);background:var(--card);color:var(--ink)}
.docs-page .docs-filters button.active{font-weight:700}
.docs-page .docs-contact{margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.docs-page .docs-contact strong{display:block;font-size:15px}
.docs-page .docs-contact p{margin:8px 0 14px;color:var(--muted);font-size:13px;line-height:1.45}
.docs-page .docs-contact a{font-size:13px;font-weight:700;color:var(--accent)}
.docs-page .docs-results{min-width:0}
.docs-page .docs-feature{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;margin-bottom:18px;padding:28px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));border-radius:var(--docs-radius);background:color-mix(in srgb,var(--accent2) 62%,var(--card))}
.docs-page .docs-type{color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.docs-page .docs-feature h2{margin-top:10px;font-size:clamp(25px,3vw,36px);letter-spacing:-.04em}
.docs-page .docs-feature p{max-width:58ch;margin-top:10px;color:var(--muted);font-size:15px;line-height:1.5}
.docs-page .docs-feature .btn{white-space:nowrap}
.docs-page .docs-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.docs-page .docs-card{display:flex;min-height:188px;flex-direction:column;padding:22px;border:1px solid var(--line);border-radius:var(--docs-radius);background:var(--card);color:var(--ink);text-decoration:none;transition:border-color .2s ease,transform .2s ease}
.docs-page .docs-card:hover{border-color:color-mix(in srgb,var(--accent) 52%,var(--line));transform:translateY(-2px)}
.docs-page .docs-card[hidden]{display:none}
.docs-page .docs-card .docs-type{font-size:11px}
.docs-page .docs-card h3{margin-top:12px;font-size:21px;letter-spacing:-.025em}
.docs-page .docs-card p{margin-top:8px;color:var(--muted);font-size:14px;line-height:1.5}
.docs-page .docs-card .docs-link{margin-top:auto;padding-top:18px;color:var(--accent);font-size:13px;font-weight:700}
.docs-page .docs-empty{display:none;padding:28px;border:1px dashed var(--line);border-radius:var(--docs-radius);color:var(--muted);text-align:center}
.docs-page .docs-empty.visible{display:block}
.docs-page .docs-resources{margin-top:84px;padding-top:52px;border-top:1px solid var(--line)}
.docs-page .docs-resources-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:24px}
.docs-page .docs-resources h2{font-size:clamp(28px,3.5vw,42px);letter-spacing:-.04em}
.docs-page .docs-resources-head p{max-width:48ch;margin:0;color:var(--muted);font-size:15px;line-height:1.5}
.docs-page .docs-articles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.docs-page .docs-article{display:block;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);text-decoration:none}
.docs-page .docs-article:hover{border-color:color-mix(in srgb,var(--accent) 52%,var(--line))}
.docs-page .docs-article small{color:var(--accent);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.docs-page .docs-article strong{display:block;margin-top:9px;font-size:15px;line-height:1.25}
.docs-page .docs-article span{display:block;margin-top:9px;color:var(--muted);font-size:12px;line-height:1.4}
@media(max-width:900px){.docs-page .docs-hero-grid{grid-template-columns:1fr}.docs-page .docs-hero-note{max-width:560px}.docs-page .docs-layout{grid-template-columns:1fr}.docs-page .docs-sidebar{position:static}.docs-page .docs-filters{display:flex;flex-wrap:wrap;gap:7px}.docs-page .docs-filters button{width:auto}.docs-page .docs-contact{display:none}.docs-page .docs-articles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.docs-page .docs-hero{padding-bottom:54px}.docs-page .docs-breadcrumb{margin-bottom:34px}.docs-page .docs-hero h1{font-size:clamp(42px,13vw,68px)}.docs-page .docs-hero .sub{font-size:18px}.docs-page .docs-intro,.docs-page .docs-resources-head{display:block}.docs-page .docs-intro p,.docs-page .docs-resources-head p{margin-top:12px}.docs-page .docs-feature{display:block}.docs-page .docs-feature .btn{display:inline-flex;margin-top:20px}.docs-page .docs-list,.docs-page .docs-articles{grid-template-columns:1fr}}
.docs-page .docs-hero{padding:84px 0 58px;background:linear-gradient(135deg,var(--bg),var(--bg2) 72%,color-mix(in srgb,var(--accent2) 45%,var(--bg)))}
.docs-page .docs-hero h1{max-width:none;font-size:clamp(48px,7vw,86px);letter-spacing:-.065em;line-height:.96}
.docs-page .docs-search-engine{position:relative;max-width:760px;margin-top:32px}
.docs-page .docs-search-engine .docs-search{max-width:none;margin:0;padding:7px 10px 7px 18px;border-radius:16px;box-shadow:0 18px 48px color-mix(in srgb,var(--ink) 6%,transparent)}
.docs-page .docs-search-engine .docs-search-label{padding-right:4px;color:var(--muted);font-size:13px;font-weight:700}
.docs-page .docs-search-engine .docs-search input{padding:12px 4px;font-size:17px}
.docs-page #docs-search-clear{width:34px;height:34px;border:0;border-radius:10px;background:var(--bg2);color:var(--muted);font:inherit;font-size:24px;line-height:1;cursor:pointer}
.docs-page #docs-search-clear:hover{color:var(--ink)}
.docs-page .docs-search-results{position:absolute;z-index:12;top:calc(100% + 9px);right:0;left:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:0 24px 60px color-mix(in srgb,var(--ink) 14%,transparent)}
.docs-page .docs-search-result{display:block;padding:15px 18px;border-top:1px solid var(--line);color:var(--ink);text-decoration:none}
.docs-page .docs-search-result:first-child{border-top:0}.docs-page .docs-search-result:hover{background:var(--bg2)}
.docs-page .docs-search-result small{display:block;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.docs-page .docs-search-result strong{display:block;margin-top:4px;font-size:16px}.docs-page .docs-search-result span{display:block;margin-top:3px;color:var(--muted);font-size:13px;line-height:1.4}
.docs-page .docs-search-empty{padding:18px;color:var(--muted);font-size:14px}
.mentor-hint{position:fixed;z-index:49;right:132px;bottom:31px;display:flex;align-items:center;gap:8px;max-width:195px;color:var(--accent);font-size:13px;font-weight:700;line-height:1.25;pointer-events:none;opacity:1;transform:translateY(0);transition:opacity .24s ease,transform .24s ease}
.mentor-hint svg{width:68px;height:36px;overflow:visible;transform:rotate(8deg)}.mentor-hint path{stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.mentor-hint.is-hidden{opacity:0;transform:translateY(8px);visibility:hidden}
@media(max-width:900px){.docs-page .docs-hero{padding:62px 0 46px}.docs-page .docs-hero h1{font-size:clamp(46px,10vw,70px)}}
@media(max-width:620px){.docs-page .docs-hero{padding:46px 0 38px}.docs-page .docs-search-engine{margin-top:24px}.docs-page .docs-search-engine .docs-search{align-items:flex-start;flex-wrap:wrap;padding:12px}.docs-page .docs-search-engine .docs-search-label{width:100%;padding:0;font-size:12px}.docs-page .docs-search-engine .docs-search input{width:calc(100% - 42px);padding:7px 0}.mentor-hint{right:94px;bottom:87px;max-width:144px;font-size:11px}.mentor-hint svg{width:43px;height:28px}}
@media(prefers-reduced-motion:reduce){.mentor-hint{transition:none}}
.docs-support-promo{padding:0 0 76px;border-top:0}.docs-support-promo-inner{display:flex;align-items:center;justify-content:space-between;gap:34px;padding:34px 38px;border-radius:22px;background:var(--bg2)}.docs-support-promo-inner span{display:block;color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.docs-support-promo-inner h2{margin-top:9px;font-size:clamp(25px,3vw,36px);letter-spacing:-.045em}.docs-support-promo-inner p{max-width:670px;margin-top:10px;color:var(--muted);font-size:16px;line-height:1.55}.docs-support-promo-inner .btn{flex:0 0 auto}@media(max-width:680px){.docs-support-promo{padding-bottom:52px}.docs-support-promo-inner{display:block;padding:27px 24px}.docs-support-promo-inner .btn{margin-top:22px;width:100%;justify-content:center}}</style>
</div></section>
<aside id="mentor-hint" class="mentor-hint" aria-hidden="true"><span data-fr="Une question ? Demandez à Mentor" data-en="Need help? Ask Mentor">Une question ? Demandez à Mentor</span><svg viewBox="0 0 104 52" aria-hidden="true"><path d="M3 6c25 3 38 14 56 29 10 8 19 10 35 9" fill="none" pathLength="1"/><path d="M83 33l12 11-15 4" fill="none"/></svg></aside>
</main>
<footer id="site-footer"></footer>
<script>
(() => {
  const input = document.getElementById('docs-search');
  const cards = [...document.querySelectorAll('[data-doc-card]')];
  const buttons = [...document.querySelectorAll('[data-filter]')];
  const empty = document.getElementById('docs-empty');
  let active = 'all';
  const normalize = value => (value || '').toLocaleLowerCase('fr').normalize('NFD').replace(/[\u0300-\u036f]/g, '');
  const update = () => {
    const query = normalize(input ? input.value : '');
    let visible = 0;
    cards.forEach(card => {
      const categoryMatch = active === 'all' || card.dataset.category === active;
      const queryMatch = !query || normalize(card.textContent).includes(query);
      const show = categoryMatch && queryMatch;
      card.hidden = !show;
      if(show) visible += 1;
    });
    if(empty) empty.classList.toggle('visible', visible === 0);
  };
  buttons.forEach(button => button.addEventListener('click', () => {
    active = button.dataset.filter || 'all';
    buttons.forEach(item => item.classList.toggle('active', item === button));
    update();
  }));
  if(input) input.addEventListener('input', update);
})();
</script>
<script id="aide-search-engine">
(() => {
  const input = document.getElementById('docs-search');
  const clear = document.getElementById('docs-search-clear');
  const panel = document.getElementById('docs-search-results');
  const mentorHint = document.getElementById('mentor-hint');
  const items = [
    {href:'#tutoriel-interactif',fr:{tag:'Tutoriel interactif',title:'Découvrir les huit guides de l’app',desc:'Avancer étape par étape dans une reproduction HTML du Centre d’apprentissage.'},en:{tag:'Interactive tutorial',title:'Discover the eight in-app guides',desc:'Move step by step through an HTML version of the Learning Center.'}},
    {href:'aide-connexion.html',fr:{tag:'Connexion et réseau',title:'Tester une connexion',desc:'Vérifier le Mac, le QR code et le parcours d’une réponse.'},en:{tag:'Connection and network',title:'Test a connection',desc:'Check the Mac, QR code and answer flow.'}},
    {href:'aide-demarrer-seance.html',fr:{tag:'Premiers pas',title:'Démarrer une séance',desc:'Lancer la régie, afficher le QR et projeter.'},en:{tag:'Getting started',title:'Start a session',desc:'Launch the live console, show the QR code and project.'}},
    {href:'aide-importer-support.html',fr:{tag:'Premiers pas',title:'Importer un support',desc:'Ajouter un PDF ou un PowerPoint .pptx.'},en:{tag:'Getting started',title:'Import material',desc:'Add a PDF or PowerPoint .pptx.'}},
    {href:'aide-choisir-activite.html',fr:{tag:'Séance et activités',title:'Choisir une activité',desc:'Choisir le format à partir de la réponse attendue.'},en:{tag:'Sessions and activities',title:'Choose an activity',desc:'Choose a format from the response you need.'}},
    {href:'aide-telecommande.html',fr:{tag:'Séance et activités',title:'Connecter la télécommande',desc:'Appairer l’iPhone et utiliser l’Apple Watch.'},en:{tag:'Sessions and activities',title:'Connect the remote',desc:'Pair the iPhone and use Apple Watch.'}},
    {href:'account.html',fr:{tag:'Compte',title:'Gérer son espace',desc:'Retrouver ses demandes, son profil et ses préférences.'},en:{tag:'Account',title:'Manage your account',desc:'Find requests, profile and preferences.'}},
    {href:'support.html',fr:{tag:'Support',title:'Contacter le support',desc:'Préparer une demande avec les éléments utiles.'},en:{tag:'Support',title:'Contact support',desc:'Prepare a request with useful details.'}}
  ];
  const normalize = value => String(value || '').toLocaleLowerCase('fr').normalize('NFD').replace(/[\u0300-\u036f]/g, '');
  const locale = () => document.documentElement.lang && document.documentElement.lang.startsWith('en') ? 'en' : 'fr';
  const render = () => {
    const query = normalize(input.value).trim();
    clear.hidden = !query;
    if (!query) { panel.hidden = true; input.setAttribute('aria-expanded', 'false'); return; }
    const lang = locale();
    const matches = items.filter(item => normalize([item[lang].tag,item[lang].title,item[lang].desc].join(' ')).includes(query)).slice(0, 6);
    panel.innerHTML = matches.length ? matches.map(function(item) { return '<a class="docs-search-result" role="option" href="' + item.href + '"><small>' + item[lang].tag + '</small><strong>' + item[lang].title + '</strong><span>' + item[lang].desc + '</span></a>'; }).join('') : '<p class="docs-search-empty">' + (lang === 'en' ? 'No guide matches this search.' : 'Aucun guide ne correspond à cette recherche.') + '</p>';
    panel.hidden = false; input.setAttribute('aria-expanded', 'true');
  };
  if (input) {
    input.addEventListener('input', render);
    input.addEventListener('keydown', event => { if (event.key === 'Enter') { const first = panel.querySelector('a'); if (first) { event.preventDefault(); first.click(); } } if (event.key === 'Escape') { input.value=''; render(); input.blur(); } });
    input.addEventListener('focus', render);
  }
  if (clear) clear.addEventListener('click', () => { input.value=''; render(); input.focus(); });
  document.addEventListener('click', event => { if (!event.target.closest('.docs-search-engine')) { panel.hidden=true; input.setAttribute('aria-expanded','false'); } });
  const updateMentorHint = () => { if (mentorHint) mentorHint.classList.toggle('is-hidden', window.scrollY > 36); };
  window.addEventListener('scroll', updateMentorHint, {passive:true});
  updateMentorHint();
})();
</script>
<script src="aide-tutorial.js?v=20260728-enframes1" defer></script>
<script src="app.js?v=20260727-release2" defer></script>
</body>
</html>