/* ============================================================ Nav statique — reproduit Nav.jsx au pixel près (ADR-033 2026-05-15) ============================================================ */ .qllm-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 50; background: rgba(7,9,12,0.82); backdrop-filter: blur(20px) saturate(140%); -webkit-backdrop-filter: blur(20px) saturate(140%); border-bottom: 1px solid var(--border); } .qllm-nav-spacer { height: 108px; } .qllm-nav-container { max-width: 1280px; margin: 0 auto; padding: 0 32px; } .qllm-nav-grid { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 40px; height: 76px; } .qllm-nav-ticker { border-bottom: 1px solid var(--border); background: rgba(7,9,12,0.4); height: 32px; overflow: hidden; } .qllm-nav-ticker .qllm-nav-container { display: flex; align-items: center; justify-content: space-between; height: 32px; font-family: var(--font-mono); font-size: 10px; color: var(--text-mute); letter-spacing: 0.08em; text-transform: uppercase; } .qllm-ticker-left { display: flex; align-items: center; gap: 18px; } .qllm-ticker-right { display: flex; align-items: center; gap: 14px; } .qllm-live { display: inline-flex; align-items: center; gap: 6px; } .qllm-live-txt { color: var(--neon); } .qllm-pulse { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--neon); animation: qllmNavPulse 2s ease-in-out infinite; } @keyframes qllmNavPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(74,222,128,0.5); } 50% { box-shadow: 0 0 0 5px rgba(74,222,128,0); } } .qllm-lockup { display: flex; align-items: center; gap: 12px; text-decoration: none; } .qllm-logo { display: block; color: var(--text); } .qllm-brand { display: flex; flex-direction: column; line-height: 1; } .qllm-brand-title { display: inline-flex; align-items: center; gap: 6px; font-family: 'Archivo', sans-serif; font-size: 19px; font-weight: 700; letter-spacing: -0.03em; color: var(--text); } .qllm-brand-fr { font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 2px 5px 1px; border-radius: 3px; border: 1px solid rgba(255,255,255,0.18); color: var(--text-dim); transform: translateY(-1px); } .qllm-brand-tag { font-family: 'Inter Tight', sans-serif; font-size: 10.5px; font-weight: 400; color: var(--text-dim); margin-top: 4px; letter-spacing: -0.002em; } .qllm-nav-links { display: flex; align-items: center; justify-content: center; gap: 28px; } .qllm-nav-links > a { position: relative; padding: 8px 0; font-size: 14px; font-weight: 400; letter-spacing: -0.005em; color: var(--text-dim); text-decoration: none; transition: color 0.18s; display: inline-flex; align-items: baseline; gap: 8px; } .qllm-nav-links > a:hover { color: var(--text); } .qllm-nav-num { font-family: var(--font-mono); font-size: 10px; color: var(--text-mute); letter-spacing: 0.05em; } .qllm-nav-cta { display: flex; align-items: center; gap: 10px; } .qllm-cta { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; height: 38px; background: var(--neon); color: #0A0F0A; border: 1px solid var(--neon); border-radius: 10px; font-size: 13px; font-weight: 500; text-decoration: none; box-shadow: 0 0 24px -8px var(--neon-glow); transition: opacity 0.15s; white-space: nowrap; box-sizing: border-box; } .qllm-cta:hover { opacity: 0.88; } /* Dropdowns Outils + Projet (statique, JS vanilla) — reproduit NavDropdown de Nav.jsx */ .qllm-nav-dropdown { position: relative; } .qllm-nav-trigger { background: transparent; border: 0; cursor: pointer; padding: 8px 0; font-family: inherit; font-size: 14px; font-weight: 400; letter-spacing: -0.005em; color: var(--text-dim); display: inline-flex; align-items: baseline; gap: 8px; transition: color 0.18s; } .qllm-nav-trigger:hover, .qllm-nav-trigger[aria-expanded="true"] { color: var(--text); } .qllm-chev { transform: translateY(2px); transition: transform 0.2s; opacity: 0.7; } .qllm-nav-trigger[aria-expanded="true"] .qllm-chev { transform: translateY(2px) rotate(180deg); opacity: 1; } .qllm-dropdown-panel { position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%); min-width: 280px; padding: 8px; background: rgba(13,17,23,0.96); backdrop-filter: blur(20px) saturate(140%); -webkit-backdrop-filter: blur(20px) saturate(140%); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 18px 48px -12px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.02); z-index: 51; } .qllm-dropdown-panel[hidden] { display: none; } .qllm-dropdown-panel a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 8px; text-decoration: none; color: var(--text); transition: background 0.15s; } .qllm-dropdown-panel a:hover { background: var(--bg-elev); } .qllm-dd-icon { width: 32px; height: 32px; flex: 0 0 32px; display: inline-flex; align-items: center; justify-content: center; background: var(--bg-elev); border: 1px solid var(--border); border-radius: 8px; color: var(--neon); font-size: 14px; font-family: var(--font-mono); } .qllm-dd-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .qllm-dd-label { font-size: 13px; font-weight: 500; color: var(--text); line-height: 1.2; } .qllm-dd-desc { font-size: 11px; color: var(--text-mute); line-height: 1.3; } @media (max-width: 1200px) { .qllm-ticker-hide { display: none !important; } } @media (max-width: 1000px) { .qllm-nav-links { display: none !important; } .qllm-nav-grid { grid-template-columns: auto 1fr auto; gap: 16px; } .qllm-nav-ticker { display: none !important; } .qllm-nav-spacer { height: 76px; } } @media (max-width: 720px) { .qllm-nav-container { padding: 0 18px !important; } .qllm-nav-grid { gap: 12px !important; height: 64px; } .qllm-nav-spacer { height: 64px; } .qllm-brand-tag { display: none; } .qllm-cta { font-size: 12px; padding: 8px 12px; height: 34px; } } @media (max-width: 480px) { .qllm-nav-container { padding: 0 14px !important; } .qllm-nav-grid { height: 60px; gap: 10px !important; } .qllm-nav-spacer { height: 60px; } .qllm-cta > span { display: none; } .qllm-cta { padding: 8px 10px; } } /* ============================================================ Seo-footer dense — identique à generate-pages.mjs::renderSeoFooter() (lignes 433-454) pour cohérence visuelle avec les pages SPA. ============================================================ */ .seo-footer .seo-row { display:grid;grid-template-columns:minmax(220px, 1fr) 2fr;gap:20px;margin-bottom:14px } .seo-footer .seo-block { margin-bottom:14px } .seo-footer .seo-row .seo-block, .seo-footer .seo-block:last-of-type { margin-bottom:0 } .seo-footer h2 { color:#6b7280;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;margin:0 0 6px } .seo-footer .seo-pills { display:flex;flex-wrap:wrap;gap:4px } .seo-footer .seo-pills a { display:inline-flex;align-items:center; padding:3px 9px;font-size:11.5px;line-height:1.35; color:#9aa3af;text-decoration:none; background:#0f141b;border:1px solid #1a1f27;border-radius:999px; white-space:nowrap;transition:border-color .15s,color .15s } .seo-footer .seo-pills a.wide { white-space:normal;max-width:100% } .seo-footer .seo-pills a:hover { border-color:#4ade80;color:#e5e7eb } .seo-footer .seo-bottom { margin-top:16px;padding-top:12px;border-top:1px solid #1a1f27;font-size:11px;color:#6b7280 } .seo-footer .seo-bottom p { margin:0 } @media (max-width:720px){ .seo-footer .seo-row { grid-template-columns:1fr;gap:14px } }

Contact

Dernière mise à jour : 09/06/2026

Une question, une correction à signaler sur une fiche modèle, une demande presse ou partenariat, ou l'exercice de vos droits RGPD : écrivez-nous.

Par courriel

[email protected] — réponse sous 72 h ouvrées en général.

Demandes fréquentes