/* ── HERO ── */
.hero { position:relative; z-index:10; padding:10rem 3rem 4rem; max-width:900px; margin:0 auto; }
.hero-title { font-size:clamp(3.5rem,9vw,7rem); font-weight:800; line-height:0.9; letter-spacing:-0.04em; opacity:0; transform:translateY(24px); animation:fadeUp 0.9s cubic-bezier(0.16,1,0.3,1) forwards 0.5s; }
.hero-intro { margin-top:2rem; font-family:'DM Mono',monospace; font-size:clamp(0.75rem,1.6vw,0.95rem); color:var(--muted2); line-height:1.8; opacity:0; transform:translateY(12px); animation:fadeUp 0.7s ease forwards 0.8s; }

/* ── COUNTER ── */
.faq-counter { display:flex; align-items:center; gap:1.5rem; margin-top:2rem; flex-wrap:wrap; }
.fc-item { display:flex; flex-direction:column; gap:2px; }
.fc-val { font-size:2rem; font-weight:800; color:var(--accent); line-height:1; letter-spacing:-0.03em; }
.fc-label { font-family:'DM Mono',monospace; font-size:10px; color:var(--muted2); letter-spacing:0.1em; }
.fc-sep { font-size:1.5rem; color:var(--muted); }

/* ── SECTION ── */
.section { position:relative; z-index:10; max-width:900px; margin:0 auto; padding:3rem 3rem 4rem; border-top:1px solid var(--border2); }
.section-tag { font-family:'DM Mono',monospace; font-size:11px; color:var(--accent); letter-spacing:0.1em; }
.section-title { font-size:clamp(1.5rem,3vw,2rem); font-weight:800; letter-spacing:-0.02em; }

/* ── PROGRESS ── */
.progress-wrap { margin-bottom:2rem; }
.progress-header { display:flex; justify-content:space-between; margin-bottom:8px; }
.progress-label { font-family:'DM Mono',monospace; font-size:11px; color:var(--muted2); letter-spacing:0.08em; }
.progress-pct { font-family:'DM Mono',monospace; font-size:11px; color:var(--accent); }
.progress-bar { height:2px; background:var(--muted); }
.progress-fill { height:100%; background:var(--accent); width:0; transition:width 0.5s ease; }

/* ── CONTROLS ── */
.faq-controls { display:flex; gap:1rem; margin-bottom:1.5rem; flex-wrap:wrap; align-items:center; }
.search-wrap { display:flex; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--border2); padding:8px 14px; flex:1; min-width:200px; transition:border-color 0.2s; }
.search-wrap:focus-within { border-color:var(--accent); }
.search-wrap svg { color:var(--muted2); flex-shrink:0; }
.search-input { background:transparent; border:none; outline:none; color:var(--text); font-family:'DM Mono',monospace; font-size:12px; width:100%; }
.search-input::placeholder { color:var(--muted); }
.faq-actions { display:flex; gap:8px; flex-wrap:wrap; }
.action-btn { font-family:'DM Mono',monospace; font-size:11px; color:var(--muted2); background:transparent; border:1px solid var(--border2); padding:8px 14px; cursor:pointer; letter-spacing:0.06em; transition:border-color 0.2s,color 0.2s; white-space:nowrap; }
.action-btn:hover { border-color:var(--accent); color:var(--accent); }

/* ── CATEGORY FILTERS ── */
.cat-filters { display:flex; gap:8px; flex-wrap:wrap; }
.cat-btn { font-family:'DM Mono',monospace; font-size:10px; color:var(--muted2); background:transparent; border:1px solid var(--border2); padding:6px 14px; cursor:pointer; letter-spacing:0.08em; text-transform:uppercase; transition:all 0.2s; }
.cat-btn:hover { border-color:var(--cat-color,var(--accent)); color:var(--cat-color,var(--accent)); }
.cat-btn.active { border-color:var(--cat-color,var(--accent)); color:var(--cat-color,var(--accent)); background:rgba(255,255,255,0.03); }

/* ── FAQ ITEMS ── */
.faq-list { display:flex; flex-direction:column; gap:0; margin-bottom:3rem; }
.faq-item { border:1px solid var(--border2); margin-bottom:4px; transition:border-color 0.2s; }
.faq-item.hidden { display:none; }
.faq-item:hover { border-color:rgba(255,255,255,0.12); }
.faq-item.open { border-color:rgba(0,245,160,0.2); }
.faq-item .pulse { animation:pulse 2s ease-in-out infinite; }
.faq-q { width:100%; display:flex; align-items:center; gap:1rem; padding:1.1rem 1.4rem; background:transparent; border:none; cursor:pointer; text-align:left; transition:background 0.2s; }
.faq-q:hover { background:rgba(255,255,255,0.02); }
.faq-num { font-family:'DM Mono',monospace; font-size:10px; color:var(--accent); letter-spacing:0.1em; min-width:20px; flex-shrink:0; }
.faq-text { font-size:14px; font-weight:700; color:var(--text); flex:1; text-align:left; }
.faq-cat-tag { font-family:'DM Mono',monospace; font-size:9px; color:var(--c,var(--accent)); border:1px solid var(--c,var(--accent)); padding:2px 8px; letter-spacing:0.08em; opacity:0.7; flex-shrink:0; }
.faq-secret-tag { font-family:'DM Mono',monospace; font-size:9px; color:#f5a000; border:1px solid rgba(245,160,0,0.4); padding:2px 8px; letter-spacing:0.08em; flex-shrink:0; }
.faq-arrow { color:var(--muted2); flex-shrink:0; transition:transform 0.3s ease; }
.faq-item.open .faq-arrow { transform:rotate(180deg); }
.faq-a { max-height:0; overflow:hidden; transition:max-height 0.4s cubic-bezier(0.4,0,0.2,1); }
.faq-item.open .faq-a { max-height:400px; }
.faq-a-inner { padding:1rem 1.4rem 1.4rem; display:flex; flex-direction:column; gap:8px; border-top:1px solid var(--border2); }
.faq-prompt { font-family:'DM Mono',monospace; font-size:11px; color:var(--accent); }
.faq-a-inner p { font-size:14px; color:var(--muted2); line-height:1.8; }

/* ── NOT SECTION ── */
.not-section { margin-bottom:3rem; }
.not-header { display:flex; align-items:baseline; gap:1rem; margin-bottom:1.5rem; }
.not-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:8px; }
.not-item { display:flex; align-items:center; gap:10px; background:var(--surface); border:1px solid var(--border2); padding:0.9rem 1.2rem; font-size:13px; color:var(--muted2); }
.not-x { color:#f54040; font-family:'DM Mono',monospace; font-size:14px; flex-shrink:0; }

/* ── MYTHS ── */
.myths-section { margin-bottom:3rem; }
.myths-header { display:flex; align-items:baseline; gap:1rem; margin-bottom:1.5rem; }
.myths-list { display:flex; flex-direction:column; gap:1px; }
.myth-item { display:grid; grid-template-columns:1fr auto 1fr; gap:1rem; align-items:center; background:var(--surface); border:1px solid var(--border2); padding:1.2rem 1.4rem; }
.myth-col { display:flex; flex-direction:column; gap:6px; }
.myth-tag { font-family:'DM Mono',monospace; font-size:9px; padding:2px 8px; letter-spacing:0.1em; text-transform:uppercase; width:fit-content; }
.myth .myth-tag { color:#f54040; border:1px solid rgba(245,64,64,0.3); }
.reality .myth-tag { color:var(--accent); border:1px solid rgba(0,245,160,0.3); }
.myth-col p { font-size:13px; line-height:1.6; }
.myth p { color:var(--muted2); }
.reality p { color:var(--text); }
.myth-sep { font-family:'DM Mono',monospace; font-size:18px; color:var(--accent); font-weight:700; }

/* ── INTERVIEW OVERLAY ── */
.interview-overlay { position:fixed; inset:0; background:rgba(8,11,15,0.95); z-index:1000; display:flex; align-items:center; justify-content:center; padding:2rem; opacity:0; pointer-events:none; transition:opacity 0.3s ease; }
.interview-overlay.active { opacity:1; pointer-events:all; }
.interview-box { width:100%; max-width:600px; background:#0d1117; border:1px solid var(--border2); transform:scale(0.95); transition:transform 0.3s ease; }
.interview-overlay.active .interview-box { transform:scale(1); }
.interview-bar { display:flex; align-items:center; gap:8px; padding:10px 14px; background:rgba(255,255,255,0.02); border-bottom:1px solid var(--border2); }
.ft-dot { width:10px; height:10px; border-radius:50%; }
.interview-close { margin-left:auto; font-family:'DM Mono',monospace; font-size:10px; color:var(--muted2); background:transparent; border:1px solid var(--border2); padding:3px 10px; cursor:pointer; letter-spacing:0.1em; transition:color 0.2s; }
.interview-close:hover { color:var(--accent); }
.interview-body { padding:2rem; min-height:200px; display:flex; flex-direction:column; gap:12px; }
.iv-question { font-family:'DM Mono',monospace; font-size:12px; color:var(--accent); }
.iv-text { font-size:14px; font-weight:700; color:var(--text); }
.iv-answer { font-size:13px; color:var(--muted2); line-height:1.8; margin-top:8px; }
.interview-controls { display:flex; gap:8px; padding:1rem 1.4rem; border-top:1px solid var(--border2); }
.iv-btn { font-family:'DM Mono',monospace; font-size:11px; background:transparent; border:1px solid var(--border2); color:var(--muted2); padding:8px 16px; cursor:pointer; letter-spacing:0.06em; transition:all 0.2s; }
.iv-btn:hover { border-color:var(--accent); color:var(--accent); }
.iv-exit { margin-left:auto; }
.iv-exit:hover { border-color:#f54040; color:#f54040; }

/* ── ANIMATIONS SPÉCIFIQUES ── */
@keyframes pulse { 0%,100% { box-shadow:0 0 0 0 rgba(0,245,160,0.2); } 50% { box-shadow:0 0 0 4px rgba(0,245,160,0); } }

/* ── RESPONSIVE ── */
@media (max-width:700px) {
    .myth-item { grid-template-columns:1fr; }
    .myth-sep { display:none; }
    .faq-controls { flex-direction:column; }
    .hero { padding:8rem 1.5rem 3rem; }
    .section { padding:2rem 1.5rem 3rem; }
}