:root { --primary: #f97316; --primary-dark: #ea580c; --primary-light: #ffedd5; --secondary: #fb923c; --accent: #f59e0b; --success: #059669; --warning: #d97706; --error: #dc2626; --info: #0891b2; --white: #ffffff; --card-bg: #ffffff; --gray-50: #f9fafb; --gray-100: #f3f4f6; --gray-200: #e5e7eb; --gray-300: #d1d5db; --gray-400: #9ca3af; --gray-500: #6b7280; --gray-600: #4b5563; --gray-700: #374151; --gray-800: #1f2937; --gray-900: #111827; --gradient-primary: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%); --gradient-hero: linear-gradient(135deg, #1e293b 0%, #0f172a 100%); --gradient-card: linear-gradient(145deg, var(--white) 0%, var(--gray-50) 100%); --gradient-warning: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); --font-primary: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; --space-xs: 0.25rem; --space-sm: 0.5rem; --space-md: 1rem; --space-lg: 1.5rem; --space-xl: 2rem; --space-2xl: 3rem; --space-3xl: 4rem; --radius-sm: 0.375rem; --radius-md: 0.5rem; --radius-lg: 0.75rem; --radius-xl: 1rem; --radius-2xl: 1.5rem; --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05); --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); --shadow-focus: 0 0 0 3px rgba(249, 115, 22, 0.4); --transition-fast: 0.15s ease-out; --transition-base: 0.3s ease-out; --transition-slow: 0.5s ease-out; }
    .lh-skip-link { position: absolute; top: -40px; left: 0; background: var(--primary); color: var(--white); padding: var(--space-md) var(--space-lg); text-decoration: none; font-weight: 700; z-index: 10000; border-radius: 0 0 var(--radius-md) 0; } .lh-skip-link:focus { top: 0; outline: 3px solid var(--accent); outline-offset: 2px; }
    .lh-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; }
    .lh-form-error { color: var(--error); font-size: 0.875rem; margin-top: var(--space-xs); display: none; font-weight: 600; } .lh-form-error.show { display: block; }
    .lh-loading-spinner { display: inline-block; width: 1rem; height: 1rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin 0.6s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } }
    /* v20 : filet anti-FOUC — couleurs sombres par défaut tant que data-theme n'est pas posé */
    :root:not([data-theme]) {
        --gray-50: #0f172a; --gray-100: #1e293b; --gray-200: #334155;
        --gray-300: #64748b; --gray-400: #94a3b8; --gray-500: #b6c2d4;
        --gray-600: #cbd5e1; --gray-700: #e2e8f0; --gray-800: #f1f5f9; --gray-900: #f8fafc;
        --white: #ffffff; --card-bg: #1e293b;
    }

    [data-theme="dark"] {
        --white: #ffffff; --card-bg: #1e293b;   /* texte clair reste blanc ; cartes = card-bg */
        --gray-50: #0f172a;      /* fond */
        --gray-100: #1e293b;
        --gray-200: #334155;     /* bordures */
        --gray-300: #64748b;     /* v20 : +contraste (détails) */
        --gray-400: #94a3b8;     /* v20 : meta/légendes lisibles AA (7:1) */
        --gray-500: #b6c2d4;     /* v20 : texte secondaire AA renforcé */
        --gray-600: #cbd5e1;     /* texte courant */
        --gray-700: #e2e8f0;
        --gray-800: #f1f5f9;
        --gray-900: #ffffff;     /* titres */
        --primary-light: rgba(249, 115, 22, 0.15);
        --gradient-card: linear-gradient(145deg, #1e293b 0%, #16213a 100%);
        --shadow-md: 0 4px 6px -1px rgba(0,0,0,.45), 0 2px 4px -1px rgba(0,0,0,.35);
        --shadow-lg: 0 10px 15px -3px rgba(0,0,0,.5), 0 4px 6px -2px rgba(0,0,0,.4);
        --shadow-xl: 0 20px 25px -5px rgba(0,0,0,.55), 0 10px 10px -5px rgba(0,0,0,.45);
        color-scheme: dark;
    }
    html { scroll-behavior: smooth; }

    /* Masquer les boutons scroll-to-top des thèmes pour éviter les doublons */
    /* SAUF notre bouton .lh-scroll-top qui doit rester visible */
    .scroll-to-top:not(.lh-scroll-top),
    .back-to-top:not(.lh-scroll-top),
    .scrollup:not(.lh-scroll-top),
    .totop:not(.lh-scroll-top),
    #scroll-top:not(#lh-scroll-top),
    #back-to-top:not(#lh-scroll-top),
    .ast-scroll-to-top,
    .generate-back-to-top,
    .scrolltop:not(.lh-scroll-top),
    .scroll-top-wrapper,
    .elementor-widget-back-to-top,
    .site-scroll-top,
    .wp-scroll-to-top,
    #scrollUp,
    .scrollToTop:not(.lh-scroll-top),
    .back-to-top-wrapper,
    [class*="scroll-top"]:not(.lh-scroll-top):not([class*="lh-scroll"]),
    [id*="scroll-top"]:not(#lh-scroll-top):not([id*="lh-scroll"]),
    [class*="back-to-top"]:not(.lh-scroll-top):not([class*="lh-"]),
    [id*="back-to-top"]:not(#lh-scroll-top):not([id*="lh-"]) {
        display: none !important;
    }

    .lhusser-newsletter-landing { font-family: var(--font-primary); line-height: 1.6; color: var(--gray-800); background: var(--gray-50); min-height: 100vh; transition: all var(--transition-base); width: 100vw; max-width: none !important; margin-left: calc(50% - 50vw); margin-right: 0; overflow-x: hidden; } .lhusser-newsletter-landing * { box-sizing: border-box; }
    @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .lhusser-newsletter-landing *, .lh-article, .lh-theme-card, .lh-stat-card, .lh-notification { animation: none !important; transition: none !important; } }
    .lh-hero { background: var(--gradient-hero); color: var(--white); padding: var(--space-3xl) var(--space-md); text-align: center; position: relative; overflow: hidden; }
    .lh-hero::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,255,255,0.1)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>'); opacity: 0.1; }
    .lh-hero-content { max-width: 800px; margin: 0 auto; position: relative; z-index: 1; }
    .lh-hero-badge { display: inline-block; background: rgba(255, 255, 255, 0.2); backdrop-filter: blur(10px); padding: var(--space-sm) var(--space-lg); border-radius: var(--radius-2xl); font-size: 0.875rem; font-weight: 600; margin-bottom: var(--space-lg); border: 1px solid rgba(255, 255, 255, 0.3); }
    .lh-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 var(--space-lg) 0; line-height: 1.2; letter-spacing: -0.025em; }
    .lh-hero-subtitle { font-size: clamp(1.1rem, 2.5vw, 1.25rem); margin: 0 0 var(--space-2xl) 0; opacity: 0.9; max-width: 600px; margin-left: auto; margin-right: auto; }
    .lh-newsletter-signup { background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(15px); border-radius: var(--radius-xl); padding: var(--space-2xl); margin: var(--space-2xl) 0; border: 1px solid rgba(255, 255, 255, 0.2); }
    .lh-newsletter-signup h3 { margin: 0 0 var(--space-lg) 0; font-size: 1.5rem; font-weight: 700; }
    .lh-newsletter-form { max-width: 500px; margin: 0 auto; }
    .lh-form-group { display: flex; gap: var(--space-sm); margin-bottom: var(--space-md); }
    .lh-newsletter-form input { flex: 1; padding: var(--space-md) var(--space-lg); border: 2px solid rgba(255, 255, 255, 0.3); border-radius: var(--radius-lg); background: rgba(255, 255, 255, 0.1); color: var(--white); font-size: 1rem; backdrop-filter: blur(10px); transition: all var(--transition-base); }
    .lh-newsletter-form input::placeholder { color: rgba(255, 255, 255, 0.7); }
    .lh-newsletter-form input:focus { outline: none; border-color: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.2); }
    .lh-newsletter-btn { background: var(--card-bg); color: var(--primary); border: none; padding: var(--space-md) var(--space-xl); border-radius: var(--radius-lg); font-weight: 700; font-size: 1rem; cursor: pointer; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); display: flex; align-items: center; gap: var(--space-sm); white-space: nowrap; position: relative; overflow: hidden; }
    .lh-newsletter-btn::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(135deg, rgba(249, 115, 22, 0.1) 0%, rgba(124, 58, 237, 0.1) 100%); transform: translateX(-100%); transition: transform 0.3s ease; }
    .lh-newsletter-btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); background: var(--gray-50); }
    .lh-newsletter-btn:hover::before { transform: translateX(0); }
    .lh-newsletter-btn:active { transform: translateY(0); }
    .lh-newsletter-note { font-size: 0.875rem; opacity: 0.8; margin: 0; }
    .lh-header-controls { display: flex; justify-content: center; align-items: center; gap: var(--space-lg); margin-top: var(--space-2xl); flex-wrap: wrap; }
    .lh-search-container { width: 100%; max-width: 500px; }
    .lh-search-wrapper { position: relative; display: flex; align-items: center; background: rgba(255, 255, 255, 0.1); border: 2px solid rgba(255, 255, 255, 0.3); border-radius: var(--radius-2xl); backdrop-filter: blur(10px); transition: all var(--transition-base); }
    .lh-search-wrapper:focus-within { border-color: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.2); box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.2); }
    .lh-search-label { position: absolute; left: -9999px; }
    .lh-search-icon { display: flex; align-items: center; justify-content: center; padding: 0 var(--space-md) 0 var(--space-lg); font-size: 1.2rem; opacity: 0.8; pointer-events: none; flex-shrink: 0; }
    .lh-search-input { flex: 1; padding: var(--space-md) var(--space-md) var(--space-md) 0; border: none; background: transparent; color: var(--white); font-size: 1rem; outline: none; min-width: 0; }
    .lh-search-input::placeholder { color: rgba(255, 255, 255, 0.6); }
    .lh-search-input::-webkit-search-cancel-button { display: none; }
    .lh-search-clear { display: none; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; margin-right: var(--space-xs); background: rgba(255, 255, 255, 0.2); border: none; border-radius: 50%; color: var(--white); font-size: 1rem; cursor: pointer; transition: all var(--transition-fast); flex-shrink: 0; }
    .lh-search-clear:hover { background: rgba(255, 255, 255, 0.3); transform: scale(1.1); }
    .lh-search-clear:not([hidden]) { display: flex; }
    .lh-search-loading { display: none; align-items: center; justify-content: center; padding: 0 var(--space-md); }
    .lh-search-loading:not([hidden]) { display: flex; }
    .lh-search-loading .lh-loading-spinner { width: 1.2rem; height: 1.2rem; }
    .lh-search-results-summary { margin-top: var(--space-sm); font-size: 0.875rem; color: rgba(255, 255, 255, 0.9); text-align: center; font-weight: 500; min-height: 1.5rem; }
    .lh-theme-toggle { background: rgba(255, 255, 255, 0.1); border: 2px solid rgba(255, 255, 255, 0.3); color: var(--white); border-radius: var(--radius-xl); padding: var(--space-md); cursor: pointer; font-size: 1.5rem; transition: all var(--transition-base); backdrop-filter: blur(10px); }
    .lh-theme-toggle:hover { background: rgba(255, 255, 255, 0.2); transform: scale(1.1); }
    .lh-main { max-width: 1200px; margin: 0 auto; padding: var(--space-2xl) var(--space-md); }
    .lh-about { background: var(--card-bg); border-radius: var(--radius-2xl); padding: var(--space-2xl); margin-bottom: var(--space-2xl); box-shadow: var(--shadow-lg); border: 1px solid var(--gray-200); }
    .lh-about-content { display: grid; grid-template-columns: auto 1fr; gap: var(--space-2xl); align-items: start; }
    .lh-about-avatar { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-md); }
    .lh-avatar-circle { width: 100px; height: 100px; border-radius: 50%; background: var(--gradient-primary); display: flex; align-items: center; justify-content: center; font-size: 2.5rem; box-shadow: var(--shadow-lg); margin-bottom: var(--space-sm); }
    .lh-author-info { display: flex; flex-direction: column; gap: var(--space-xs); }
    .lh-author-info strong { font-size: 1.1rem; font-weight: 700; color: var(--gray-900); }
    .lh-author-role { font-size: 0.875rem; color: var(--gray-500); font-weight: 500; }
    .lh-about-text h2 { margin: 0 0 var(--space-lg) 0; font-size: 1.75rem; font-weight: 700; color: var(--gray-900); }
    .lh-about-text p { margin: 0 0 var(--space-xl) 0; color: var(--gray-600); font-size: 1.05rem; line-height: 1.7; }
    .lh-expertise-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-md); }
    .lh-expertise-card { background: var(--gradient-card); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: var(--space-lg); display: flex; align-items: center; gap: var(--space-md); transition: all var(--transition-base); }
    .lh-expertise-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--primary-light); }
    .lh-expertise-icon { font-size: 1.5rem; }
    .lh-expertise-label { font-weight: 600; color: var(--gray-700); font-size: 0.9rem; }
    .lh-stats { margin-bottom: var(--space-2xl); text-align: center; }
    .lh-stats-title { font-size: 2rem; font-weight: 800; margin: 0 0 var(--space-sm) 0; color: var(--gray-900); }
    .lh-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-lg); margin-top: var(--space-xl); }
    .lh-stat-card { background: var(--card-bg); border-radius: var(--radius-xl); padding: var(--space-xl); text-align: center; box-shadow: var(--shadow-md); border: 1px solid var(--gray-200); transition: all var(--transition-base); }
    .lh-stat-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-xl); border-color: var(--primary-light); }
    .lh-stat-number { font-size: 2.5rem; font-weight: 900; color: var(--primary); margin-bottom: var(--space-sm); line-height: 1; }
    .lh-stat-label { font-size: 1.1rem; font-weight: 700; color: var(--gray-800); margin-bottom: var(--space-xs); }
    .lh-stat-desc { font-size: 0.875rem; color: var(--gray-500); }
    /* v20.1 : barre de filtres compacte (remplace les grandes cartes de thèmes) */
    .lh-filters { margin: var(--space-xl) 0 var(--space-lg); }
    .lh-filter-bar { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-sm); }
    .lh-filter-chip {
        display: inline-flex; align-items: center; gap: var(--space-xs);
        background: var(--card-bg); border: 1px solid var(--gray-200);
        color: var(--gray-700); padding: 0.55rem 1rem; border-radius: 999px;
        font-size: 0.95rem; font-weight: 600; cursor: pointer;
        transition: all var(--transition-base); line-height: 1;
    }
    .lh-filter-chip:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-2px); }
    .lh-filter-chip:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
    .lh-filter-chip.active { background: var(--gradient-primary); border-color: transparent; color: #fff; box-shadow: 0 4px 14px rgba(249,115,22,0.3); }
    .lh-chip-count {
        display: inline-flex; align-items: center; justify-content: center;
        min-width: 1.4em; height: 1.4em; padding: 0 0.35em; border-radius: 999px;
        background: rgba(0,0,0,0.08); font-size: 0.78rem; font-weight: 700;
    }
    .lh-filter-chip.active .lh-chip-count { background: rgba(255,255,255,0.25); color: #fff; }
    [data-theme="dark"] .lh-chip-count { background: rgba(255,255,255,0.1); }

    .lh-themes { margin-bottom: var(--space-2xl); text-align: center; }
    .lh-section-title { font-size: 2rem; font-weight: 800; margin: 0 0 var(--space-sm) 0; color: var(--gray-900); }
    .lh-section-subtitle { font-size: 1.1rem; color: var(--gray-600); margin: 0 0 var(--space-2xl) 0; }
    .lh-theme-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--space-lg); }
    .lh-theme-card { background: var(--card-bg); border: 2px solid var(--gray-200); border-radius: var(--radius-xl); padding: var(--space-xl); cursor: pointer; transition: all var(--transition-base); text-align: left; position: relative; overflow: hidden; }
    .lh-theme-card::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: var(--gradient-primary); transform: translateX(-100%); transition: transform var(--transition-base); }
    .lh-theme-card:hover::before, .lh-theme-card.active::before { transform: translateX(0); }
    .lh-theme-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-xl); border-color: var(--primary-light); }
    .lh-theme-card.active { border-color: var(--primary); background: var(--primary-light); transform: translateY(-2px); box-shadow: var(--shadow-lg); }
    .lh-theme-icon { width: 64px; height: 64px; margin-bottom: var(--space-md); display: flex; align-items: center; justify-content: center; }
    .lh-theme-icon svg { width: 100%; height: 100%; color: var(--primary); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
    .lh-theme-card:hover .lh-theme-icon svg { color: var(--secondary); transform: scale(1.1) rotate(5deg); }
    .lh-theme-card.active .lh-theme-icon svg { color: var(--primary-dark); }
    .lh-theme-content h3 { font-size: 1.25rem; font-weight: 700; color: var(--gray-900); margin: 0 0 var(--space-sm) 0; }
    .lh-theme-desc { color: var(--gray-600); font-size: 0.95rem; margin: 0; line-height: 1.5; }
    .lh-theme-count { position: absolute; top: var(--space-lg); right: var(--space-lg); background: var(--primary); color: var(--white); font-size: 0.75rem; font-weight: 700; padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-2xl); min-width: 24px; text-align: center; }
    .lh-theme-card.active .lh-theme-count { background: var(--card-bg); color: var(--primary); }
    .lh-content-controls { background: var(--card-bg); border-radius: var(--radius-xl); padding: var(--space-xl); margin-bottom: var(--space-xl); box-shadow: var(--shadow-md); border: 1px solid var(--gray-200); }
    .lh-controls-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-lg); margin-bottom: var(--space-lg); }
    .lh-active-filter { font-size: 1.1rem; color: var(--gray-700); }
    .lh-filter-label { font-weight: 500; }
    .lh-active-filter strong { color: var(--primary); font-weight: 700; }
    .lh-sort-controls { display: flex; align-items: center; gap: var(--space-md); flex-wrap: wrap; }
    .lh-sort-label { font-weight: 600; color: var(--gray-700); font-size: 0.95rem; }
    .lh-sort-buttons { display: flex; gap: var(--space-sm); flex-wrap: wrap; }
    .lh-sort-btn { background: var(--gray-100); border: 1px solid var(--gray-300); color: var(--gray-700); padding: var(--space-sm) var(--space-md); border-radius: var(--radius-lg); font-size: 0.875rem; font-weight: 600; cursor: pointer; transition: all var(--transition-base); display: flex; align-items: center; gap: var(--space-xs); }
    .lh-sort-btn:hover { background: var(--gray-200); transform: translateY(-1px); }
    .lh-sort-btn.active { background: var(--primary); color: var(--white); border-color: var(--primary); }
    .lh-sort-icon { font-size: 1rem; }
    .lh-sort-text { display: none; }
    .lh-results-info { display: flex; justify-content: space-between; align-items: center; font-size: 0.875rem; color: var(--gray-600); padding-top: var(--space-lg); border-top: 1px solid var(--gray-200); }
    .lh-content-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); gap: var(--space-xl); margin-bottom: var(--space-2xl); }
    .lh-article { background: var(--card-bg); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-md); border: 1px solid var(--gray-200); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); display: flex; flex-direction: column; position: relative; }
    .lh-article::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--gradient-primary); transform: scaleX(0); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transform-origin: left; z-index: 1; }
    .lh-article:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); border-color: var(--primary-light); }
    .lh-article:hover::before { transform: scaleX(1); }
    .lh-article.hidden { display: none !important; }

    /* Image à la une */
    .lh-article-thumbnail { width: 100%; height: 200px; overflow: hidden; position: relative; background: linear-gradient(135deg, var(--gray-100) 0%, var(--gray-200) 100%); }
    .lh-article-thumbnail a { display: block; width: 100%; height: 100%; }
    .lh-article-thumbnail img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        display: block;
    }
    .lh-article:hover .lh-article-thumbnail img { transform: scale(1.08); }
    .lh-article-thumbnail::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 50%;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.2), transparent);
        pointer-events: none;
    }

    /* Mode sombre - Image */
    [data-theme="dark"] .lh-article-thumbnail {
        background: linear-gradient(135deg, rgba(31, 41, 55, 0.5) 0%, rgba(17, 24, 39, 0.5) 100%);
    }
    [data-theme="dark"] .lh-article-thumbnail::after {
        background: linear-gradient(to top, rgba(0, 0, 0, 0.4), transparent);
    }


    /* Placeholder par défaut pour articles sans image */
    .lh-thumbnail-placeholder {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    .lh-thumbnail-placeholder::after { display: none; }
    .lh-placeholder-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: var(--space-md);
        text-align: center;
        width: 100%;
        height: 100%;
        transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .lh-article:hover .lh-placeholder-content { transform: scale(1.05); }
    .lh-placeholder-icon {
        font-size: 4rem;
        line-height: 1;
        filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.1));
    }
    .lh-placeholder-label {
        font-size: 1.1rem;
        font-weight: 700;
        color: rgba(255, 255, 255, 0.95);
        text-transform: uppercase;
        letter-spacing: 0.1em;
        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
        padding: 0 var(--space-lg);
    }

    /* Gradients par catégorie */
    .lh-thumbnail-placeholder[data-category="ia"] {
        background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    }
    .lh-thumbnail-placeholder[data-category="geobiologie"] {
        background: linear-gradient(135deg, #00b09b 0%, #96c93d 100%);
    }
    .lh-thumbnail-placeholder[data-category="surnaturel"] {
        background: linear-gradient(135deg, #a855f7 0%, #6366f1 100%);
    }
    .lh-thumbnail-placeholder[data-category="dev-perso"] {
        background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    }
    .lh-thumbnail-placeholder[data-category="mac"] {
        background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    }
    .lh-thumbnail-placeholder[data-category="application"] {
        background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
    }

    /* Mode sombre - Placeholders plus foncés */
    [data-theme="dark"] .lh-thumbnail-placeholder[data-category="ia"] {
        background: linear-gradient(135deg, #4a5cc5 0%, #5a3a7a 100%);
    }
    [data-theme="dark"] .lh-thumbnail-placeholder[data-category="geobiologie"] {
        background: linear-gradient(135deg, #008c78 0%, #7aa72f 100%);
    }
    [data-theme="dark"] .lh-thumbnail-placeholder[data-category="surnaturel"] {
        background: linear-gradient(135deg, #fb923c 0%, #4f46e5 100%);
    }
    [data-theme="dark"] .lh-thumbnail-placeholder[data-category="dev-perso"] {
        background: linear-gradient(135deg, #c771d0 0%, #c4384a 100%);
    }
    [data-theme="dark"] .lh-thumbnail-placeholder[data-category="mac"] {
        background: linear-gradient(135deg, #3a8ad1 0%, #00c4cc 100%);
    }
    [data-theme="dark"] .lh-thumbnail-placeholder[data-category="application"] {
        background: linear-gradient(135deg, #c85678 0%, #d4b830 100%);
    }

    .lh-article-content { display: flex; flex-direction: column; flex: 1; }
    .lh-article-header { padding: var(--space-lg) var(--space-lg) 0; display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-md); }
    .lh-article-category { background: var(--primary-light); color: var(--primary-dark); padding: var(--space-xs) var(--space-md); border-radius: var(--radius-2xl); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; white-space: nowrap; }
    .lh-article-badges { display: flex; gap: var(--space-xs); flex-wrap: wrap; }
    .lh-badge { padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-md); font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
    .lh-badge-new { background: var(--success); color: var(--white); }
    .lh-badge-popular { background: var(--accent); color: var(--white); }
    .lh-badge-quick { background: var(--info); color: var(--white); }
    .lh-article-title { padding: var(--space-md) var(--space-lg) 0; margin: 0; font-size: 1.25rem; font-weight: 700; line-height: 1.4; }
    .lh-article-title a { color: var(--gray-900); text-decoration: none; transition: color var(--transition-base); }
    .lh-article-title a:hover { color: var(--primary); }
    .lh-article-excerpt { padding: var(--space-md) var(--space-lg); color: var(--gray-600); line-height: 1.6; flex-grow: 1; }
    .lh-article-footer { padding: 0 var(--space-lg) var(--space-lg); border-top: 1px solid var(--gray-100); margin-top: auto; }
    .lh-article-meta { display: flex; gap: var(--space-md); margin-bottom: var(--space-md); font-size: 0.875rem; color: var(--gray-500); padding-top: var(--space-md); }
    .lh-article-meta span { display: flex; align-items: center; gap: var(--space-xs); }
    .lh-article-actions { display: flex; justify-content: space-between; align-items: center; gap: var(--space-md); }
    .lh-read-more { background: var(--primary); color: var(--white); padding: var(--space-sm) var(--space-lg); border-radius: var(--radius-lg); text-decoration: none; font-weight: 600; font-size: 0.875rem; transition: all var(--transition-base); white-space: nowrap; }
    .lh-read-more:hover { background: var(--primary-dark); transform: translateY(-1px); }
    /* Boutons de partage social */
    .lh-social-share { display: flex; align-items: center; gap: var(--space-xs); flex-wrap: wrap; }
    .lh-share-btn {
        background: var(--card-bg);
        border: 1px solid var(--gray-300);
        border-radius: var(--radius-md);
        padding: var(--space-xs);
        cursor: pointer;
        transition: all var(--transition-fast);
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        overflow: hidden;
    }
    .lh-share-btn svg { position: relative; z-index: 1; transition: all var(--transition-fast); }
    .lh-share-btn::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: opacity var(--transition-fast);
        z-index: 0;
    }
    .lh-share-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
        border-color: transparent;
    }
    .lh-share-btn:hover::before { opacity: 1; }
    .lh-share-btn:hover svg { color: var(--white) !important; }
    .lh-share-btn:active { transform: translateY(0); }

    /* Bouton Like */
    .lh-like-btn {
        background: var(--card-bg);
        border: 2px solid var(--gray-300);
        border-radius: var(--radius-md);
        padding: var(--space-sm) var(--space-md);
        cursor: pointer;
        transition: all var(--transition-fast);
        min-width: 56px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        position: relative;
        overflow: visible;
    }
    .lh-like-btn svg {
        color: #e11d48;
        position: relative;
        z-index: 1;
        transition: all var(--transition-fast);
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }
    .lh-like-btn .lh-like-count {
        font-size: 0.875rem;
        font-weight: 700;
        color: var(--gray-700);
        position: relative;
        z-index: 1;
        line-height: 1;
    }
    .lh-like-btn::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #e11d48;
        opacity: 0;
        transition: opacity var(--transition-fast);
        z-index: 0;
        border-radius: var(--radius-md);
    }
    .lh-like-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(225, 29, 72, 0.4);
        border-color: transparent;
    }
    .lh-like-btn:hover::before {
        opacity: 1;
    }
    .lh-like-btn:hover svg,
    .lh-like-btn:hover .lh-like-count {
        color: var(--white) !important;
    }
    /* État liké - BEAUCOUP plus visible */
    .lh-like-btn.liked {
        background: linear-gradient(135deg, #dc2626 0%, #e11d48 100%);
        border-color: #dc2626;
        box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.2), 0 4px 12px rgba(225, 29, 72, 0.4);
        transform: scale(1.05);
    }
    .lh-like-btn.liked svg {
        fill: var(--white);
        stroke: var(--white);
        filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.5));
    }
    .lh-like-btn.liked .lh-like-count {
        color: var(--white);
        font-weight: 800;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    }
    .lh-like-btn:active {
        transform: scale(0.95);
    }
    @keyframes likeAnimation {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.3); }
    }
    @keyframes likePulse {
        0% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.7); }
        70% { box-shadow: 0 0 0 8px rgba(225, 29, 72, 0); }
        100% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0); }
    }
    .lh-like-btn.animate svg {
        animation: likeAnimation 0.5s ease-in-out;
    }
    .lh-like-btn.liked.animate {
        animation: likePulse 0.6s ease-out;
    }

    /* Mode sombre - Like */
    [data-theme="dark"] .lh-like-btn {
        background: rgba(31, 41, 55, 0.5);
        border-color: rgba(107, 114, 128, 0.3);
    }
    [data-theme="dark"] .lh-like-btn .lh-like-count {
        color: var(--gray-300);
    }
    [data-theme="dark"] .lh-like-btn.liked {
        background: linear-gradient(135deg, #dc2626 0%, #e11d48 100%);
        border-color: #dc2626;
        box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.3), 0 4px 16px rgba(225, 29, 72, 0.5);
    }
    [data-theme="dark"] .lh-like-btn.liked svg,
    [data-theme="dark"] .lh-like-btn.liked .lh-like-count {
        color: var(--white);
    }

    /* Couleurs spécifiques par réseau social - Mode clair */
    .lh-share-facebook svg { color: #1877f2; }
    .lh-share-facebook::before { background: #1877f2; }
    .lh-share-facebook:hover { box-shadow: 0 4px 12px rgba(24, 119, 242, 0.3); }

    .lh-share-twitter svg { color: #000000; }
    .lh-share-twitter::before { background: #000000; }
    .lh-share-twitter:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); }

    .lh-share-linkedin svg { color: #0a66c2; }
    .lh-share-linkedin::before { background: #0a66c2; }
    .lh-share-linkedin:hover { box-shadow: 0 4px 12px rgba(10, 102, 194, 0.3); }

    .lh-share-whatsapp svg { color: #25d366; }
    .lh-share-whatsapp::before { background: #25d366; }
    .lh-share-whatsapp:hover { box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3); }

    .lh-share-email svg { color: #ea4335; }
    .lh-share-email::before { background: #ea4335; }
    .lh-share-email:hover { box-shadow: 0 4px 12px rgba(234, 67, 53, 0.3); }

    .lh-share-copy svg { color: #6b7280; }
    .lh-share-copy::before { background: #6b7280; }
    .lh-share-copy:hover { box-shadow: 0 4px 12px rgba(107, 114, 128, 0.3); }

    /* Mode sombre - Partage social */
    [data-theme="dark"] .lh-share-btn {
        background: rgba(31, 41, 55, 0.5);
        border-color: rgba(75, 85, 99, 0.5);
    }
    [data-theme="dark"] .lh-share-btn:hover {
        background: transparent;
    }

    /* Couleurs mode sombre - Versions plus vives pour meilleur contraste */
    [data-theme="dark"] .lh-share-facebook svg { color: #4a9eff; }
    [data-theme="dark"] .lh-share-facebook::before { background: #1877f2; }

    [data-theme="dark"] .lh-share-twitter svg { color: #e7e9ea; }
    [data-theme="dark"] .lh-share-twitter::before { background: #000000; }

    [data-theme="dark"] .lh-share-linkedin svg { color: #4a9eff; }
    [data-theme="dark"] .lh-share-linkedin::before { background: #0a66c2; }

    [data-theme="dark"] .lh-share-whatsapp svg { color: #5fe884; }
    [data-theme="dark"] .lh-share-whatsapp::before { background: #25d366; }

    [data-theme="dark"] .lh-share-email svg { color: #f87171; }
    [data-theme="dark"] .lh-share-email::before { background: #ea4335; }

    [data-theme="dark"] .lh-share-copy svg { color: #9ca3af; }
    [data-theme="dark"] .lh-share-copy::before { background: #6b7280; }

    /* Pagination styles */
    .lh-pagination { margin-top: var(--space-2xl); padding: var(--space-xl); background: var(--card-bg); border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); border: 1px solid var(--gray-200); }
    .lh-pagination.hidden { display: none; }
    .lh-pagination-info { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-lg); flex-wrap: wrap; gap: var(--space-md); }
    #lh-pagination-range { font-size: 0.9rem; color: var(--gray-600); font-weight: 500; }
    .lh-items-per-page { display: flex; align-items: center; gap: var(--space-sm); }
    .lh-items-label { font-size: 0.875rem; color: var(--gray-700); font-weight: 500; }
    .lh-items-select { padding: var(--space-xs) var(--space-md); border: 1px solid var(--gray-300); border-radius: var(--radius-md); background: var(--card-bg); color: var(--gray-900); font-size: 0.875rem; cursor: pointer; transition: all var(--transition-base); }
    .lh-items-select:hover { border-color: var(--primary); }
    .lh-items-select:focus { outline: 2px solid var(--primary); outline-offset: 2px; border-color: var(--primary); }
    .lh-pagination-controls { display: flex; justify-content: center; align-items: center; gap: var(--space-sm); flex-wrap: wrap; }
    .lh-pagination-btn { padding: var(--space-sm) var(--space-md); border: 1px solid var(--gray-300); border-radius: var(--radius-md); background: var(--card-bg); color: var(--gray-700); font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all var(--transition-base); display: flex; align-items: center; gap: var(--space-xs); }
    .lh-pagination-btn:hover:not(:disabled) { background: var(--primary-light); border-color: var(--primary); color: var(--primary); transform: translateY(-1px); }
    .lh-pagination-btn:disabled { opacity: 0.4; cursor: not-allowed; }
    .lh-pagination-pages { display: flex; gap: var(--space-xs); }
    .lh-pagination-page { min-width: 40px; height: 40px; padding: var(--space-xs); border: 1px solid var(--gray-300); border-radius: var(--radius-md); background: var(--card-bg); color: var(--gray-700); font-size: 0.875rem; font-weight: 600; cursor: pointer; transition: all var(--transition-base); }
    .lh-pagination-page:hover { background: var(--primary-light); border-color: var(--primary); color: var(--primary); }
    .lh-pagination-page.active { background: var(--primary); border-color: var(--primary); color: var(--white); cursor: default; }
    .lh-pagination-ellipsis { padding: var(--space-xs) var(--space-sm); color: var(--gray-500); font-weight: 600; }
    @media (max-width: 768px) {
        .lh-pagination { padding: var(--space-lg); }
        .lh-pagination-info { flex-direction: column; align-items: flex-start; }
        .lh-pagination-btn span:not([aria-hidden]) { display: none; }
        .lh-pagination-pages { flex-wrap: wrap; }
    }

    /* Scroll to top button */
    .lh-scroll-top { position: fixed; bottom: 30px; right: 30px; width: 58px; height: 58px; border-radius: 50%; background: linear-gradient(135deg, #ea580c, #c2410c); color: #fff; border: 2px solid rgba(255,255,255,0.85); cursor: pointer; box-shadow: 0 6px 18px rgba(234, 88, 12, 0.45), 0 0 0 0 rgba(249, 115, 22, 0.45); transition: opacity .35s ease, transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease, background .3s ease; z-index: 999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; opacity: 0; visibility: hidden; transform: translateY(80px) scale(.6); }
    .lh-scroll-top.visible { opacity: 1; visibility: visible; transform: translateY(0) scale(1); animation: lhScrollPop .5s cubic-bezier(.34,1.56,.64,1); }
    @keyframes lhScrollPop { 0% { transform: translateY(0) scale(.6); } 60% { transform: translateY(0) scale(1.12); } 100% { transform: translateY(0) scale(1); } }
    .lh-scroll-top::before { content: ""; position: absolute; inset: -4px; border-radius: 50%; background: rgba(249, 115, 22, 0.35); z-index: -1; animation: lhScrollHalo 2.4s ease-in-out infinite; }
    @keyframes lhScrollHalo { 0%, 100% { transform: scale(1); opacity: .6; } 50% { transform: scale(1.3); opacity: 0; } }
    .lh-scroll-top:hover { background: linear-gradient(135deg, #f97316, #ea580c); transform: translateY(-4px) scale(1.08); box-shadow: 0 10px 26px rgba(249, 115, 22, 0.55); }
    .lh-scroll-top:active { transform: translateY(-1px) scale(0.97); }
    .lh-scroll-top svg { width: 22px; height: 22px; display: block; margin-top: -2px; }
    .lh-scroll-top-label { font-size: .62rem; font-weight: 700; letter-spacing: .04em; line-height: 1; margin-top: 1px; text-transform: uppercase; color: #fff; }
    @media (prefers-reduced-motion: reduce) { .lh-scroll-top, .lh-scroll-top.visible { animation: none; } .lh-scroll-top::before { animation: none; } }
    @media (prefers-reduced-motion: reduce) { .lh-scroll-top, .lh-scroll-top.visible { animation: none; } .lh-scroll-top::before { animation: none; } }
    @media (max-width: 768px) {
        .lh-scroll-top { width: 50px; height: 50px; bottom: 20px; right: 20px; background: linear-gradient(135deg, #ea580c, #c2410c); }
        .lh-scroll-top svg { width: 19px; height: 19px; }
        .lh-scroll-top-label { font-size: .55rem; }
    }

    /* Modal d'aide */
    .lh-modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: all 0.3s ease; }
    .lh-modal:not([hidden]) { opacity: 1; visibility: visible; }
    .lh-modal-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.7); backdrop-filter: blur(4px); }
    .lh-modal-content { position: relative; background: var(--card-bg); border-radius: var(--radius-2xl); max-width: 700px; width: 90%; max-height: 85vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); animation: modalSlideIn 0.3s ease-out; }
    @keyframes modalSlideIn { from { transform: translateY(-50px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
    .lh-modal-header { display: flex; justify-content: space-between; align-items: center; padding: var(--space-xl); border-bottom: 1px solid var(--gray-200); background: linear-gradient(135deg, var(--primary-light), var(--card-bg)); }
    .lh-modal-header h2 { margin: 0; font-size: 1.5rem; color: var(--gray-900); }
    .lh-modal-close { background: none; border: none; font-size: 1.5rem; cursor: pointer; color: var(--gray-600); width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all var(--transition-base); }
    .lh-modal-close:hover { background: var(--gray-200); color: var(--gray-900); transform: rotate(90deg); }
    .lh-modal-body { padding: var(--space-xl); }
    .lh-shortcuts-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: var(--space-xl); }
    .lh-shortcut-group h3 { font-size: 1rem; margin: 0 0 var(--space-md) 0; color: var(--gray-800); }
    .lh-shortcut-item { display: flex; justify-content: space-between; align-items: center; padding: var(--space-sm) 0; gap: var(--space-md); }
    .lh-shortcut-item kbd { background: var(--gray-100); border: 1px solid var(--gray-300); border-radius: var(--radius-md); padding: var(--space-xs) var(--space-sm); font-family: monospace; font-size: 0.875rem; box-shadow: 0 2px 0 var(--gray-300); min-width: 32px; text-align: center; }
    .lh-shortcut-item span { color: var(--gray-600); font-size: 0.875rem; }
    @media (max-width: 768px) {
        .lh-modal-content { width: 95%; max-height: 90vh; }
        .lh-shortcuts-grid { grid-template-columns: 1fr; gap: var(--space-lg); }
    }

    .lh-no-results { text-align: center; padding: var(--space-3xl); background: var(--card-bg); border-radius: var(--radius-xl); box-shadow: var(--shadow-md); display: none; }
    .lh-no-results.show { display: block; }
    .lh-no-results-icon { font-size: 4rem; margin-bottom: var(--space-lg); opacity: 0.5; }
    .lh-no-results h3 { font-size: 1.5rem; color: var(--gray-800); margin: 0 0 var(--space-md) 0; }
    .lh-no-results p { color: var(--gray-600); margin: 0 0 var(--space-lg) 0; }
    .lh-reset-filters { background: var(--primary); color: var(--white); border: none; padding: var(--space-md) var(--space-xl); border-radius: var(--radius-lg); font-weight: 600; cursor: pointer; transition: all var(--transition-base); }
    .lh-reset-filters:hover { background: var(--primary-dark); transform: translateY(-2px); }
    .lh-cta-newsletter { background: var(--gradient-primary); color: var(--white); border-radius: var(--radius-2xl); padding: var(--space-3xl); text-align: center; margin: var(--space-3xl) 0; position: relative; overflow: hidden; }
    .lh-cta-newsletter::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="dots" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="10" cy="10" r="2" fill="rgba(255,255,255,0.1)"/></pattern></defs><rect width="100" height="100" fill="url(%23dots)"/></svg>'); }
    .lh-cta-content { position: relative; z-index: 1; max-width: 600px; margin: 0 auto; }
    .lh-cta-newsletter h2 { font-size: 2.5rem; font-weight: 800; margin: 0 0 var(--space-lg) 0; line-height: 1.2; }
    .lh-cta-newsletter p { font-size: 1.2rem; margin: 0 0 var(--space-2xl) 0; opacity: 0.9; }
    .lh-cta-form { display: flex; gap: var(--space-md); max-width: 500px; margin: 0 auto var(--space-xl); }
    .lh-cta-form input { flex: 1; padding: var(--space-lg); border: 2px solid rgba(255, 255, 255, 0.3); border-radius: var(--radius-lg); background: rgba(255, 255, 255, 0.1); color: var(--white); font-size: 1rem; backdrop-filter: blur(10px); }
    .lh-cta-form input::placeholder { color: rgba(255, 255, 255, 0.7); }
    .lh-cta-form button { background: var(--card-bg); color: var(--primary); border: none; padding: var(--space-lg) var(--space-xl); border-radius: var(--radius-lg); font-weight: 700; cursor: pointer; transition: all var(--transition-base); white-space: nowrap; }
    .lh-cta-form button:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
    .lh-cta-benefits { display: flex; justify-content: center; gap: var(--space-xl); flex-wrap: wrap; font-size: 0.9rem; opacity: 0.9; }
    .lh-unsubscribe-section { background: var(--gradient-warning); color: var(--gray-800); border-radius: var(--radius-2xl); padding: var(--space-2xl); margin: var(--space-2xl) 0; border: 2px solid #fbbf24; position: relative; overflow: hidden; }
    .lh-unsubscribe-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="warning-pattern" width="15" height="15" patternUnits="userSpaceOnUse"><path d="M 15 0 L 0 0 0 15" fill="none" stroke="rgba(0,0,0,0.05)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23warning-pattern)"/></svg>'); opacity: 0.1; }
    .lh-unsubscribe-content { position: relative; z-index: 1; max-width: 600px; margin: 0 auto; text-align: center; }
    .lh-unsubscribe-header h3 { font-size: 1.75rem; font-weight: 700; margin: 0 0 var(--space-md) 0; color: var(--gray-900); }
    .lh-unsubscribe-header p { font-size: 1.1rem; margin: 0 0 var(--space-xl) 0; color: var(--gray-700); line-height: 1.6; }
    .lh-unsubscribe-form { margin-bottom: var(--space-xl); }
    .lh-unsubscribe-form-group { display: flex; gap: var(--space-md); max-width: 500px; margin: 0 auto var(--space-md); }
    .lh-unsubscribe-form input { flex: 1; padding: var(--space-md) var(--space-lg); border: 2px solid rgba(0, 0, 0, 0.2); border-radius: var(--radius-lg); background: rgba(255, 255, 255, 0.9); color: var(--gray-800); font-size: 1rem; transition: all var(--transition-base); }
    .lh-unsubscribe-form input::placeholder { color: var(--gray-500); }
    .lh-unsubscribe-form input:focus { outline: none; border-color: var(--error); background: var(--card-bg); box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1); }
    .lh-unsubscribe-btn { background: var(--error); color: var(--white); border: none; padding: var(--space-md) var(--space-xl); border-radius: var(--radius-lg); font-weight: 700; font-size: 1rem; cursor: pointer; transition: all var(--transition-base); display: flex; align-items: center; gap: var(--space-sm); white-space: nowrap; }
    .lh-unsubscribe-btn:hover { background: #b91c1c; transform: translateY(-2px); box-shadow: var(--shadow-lg); }
    .lh-unsubscribe-btn:disabled { background: var(--gray-400); cursor: not-allowed; transform: none; }
    .lh-unsubscribe-note { font-size: 0.875rem; color: var(--gray-600); margin: 0; font-style: italic; }
    .lh-unsubscribe-alternatives { background: rgba(255, 255, 255, 0.9); border-radius: var(--radius-lg); padding: var(--space-lg); border: 1px solid rgba(0, 0, 0, 0.1); }
    .lh-unsubscribe-alternatives h4 { font-size: 1.1rem; font-weight: 600; margin: 0 0 var(--space-md) 0; color: var(--gray-800); }
    .lh-contact-link { display: inline-flex; align-items: center; gap: var(--space-sm); color: var(--primary); text-decoration: none; font-weight: 600; padding: var(--space-sm) var(--space-lg); border-radius: var(--radius-lg); background: rgba(249, 115, 22, 0.1); transition: all var(--transition-base); }
    .lh-contact-link:hover { background: rgba(249, 115, 22, 0.2); transform: translateY(-1px); }
    .lh-footer { background: #0f172a; color: #f8fafc; padding: var(--space-3xl) var(--space-md) var(--space-xl); margin-top: var(--space-3xl); }
    .lh-footer-content { max-width: 1200px; margin: 0 auto; text-align: center; }
    .lh-footer-main h3 { font-size: 1.5rem; font-weight: 700; margin: 0 0 var(--space-xl) 0; }
    .lh-social-links { display: flex; justify-content: center; gap: var(--space-lg); margin-bottom: var(--space-2xl); flex-wrap: wrap; }
    .lh-social-link { display: flex; align-items: center; gap: var(--space-sm); color: #f8fafc; text-decoration: none; padding: var(--space-md) var(--space-lg); border-radius: var(--radius-lg); background: rgba(255, 255, 255, 0.1); transition: all var(--transition-base); backdrop-filter: blur(10px); }
    .lh-social-link:hover { background: rgba(255, 255, 255, 0.2); transform: translateY(-2px); }
    .lh-footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.2); padding-top: var(--space-xl); opacity: 0.8; font-size: 0.9rem; }
    @media (max-width: 768px) { :root { --space-3xl: 2rem; --space-2xl: 1.5rem; } .lh-hero { padding: var(--space-2xl) var(--space-md); } .lh-hero-title { font-size: 2rem; } .lh-about-content { grid-template-columns: 1fr; text-align: center; } .lh-expertise-grid { grid-template-columns: 1fr; } .lh-stats-grid { grid-template-columns: repeat(2, 1fr); } .lh-theme-grid { grid-template-columns: 1fr; } .lh-filter-bar { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; padding-bottom: var(--space-xs); -webkit-overflow-scrolling: touch; } .lh-filter-bar::-webkit-scrollbar { display: none; } .lh-filter-chip { flex: 0 0 auto; } .lh-content-grid { grid-template-columns: 1fr; } .lh-controls-header { flex-direction: column; align-items: stretch; } .lh-sort-controls { justify-content: center; } .lh-sort-text { display: inline; } .lh-form-group, .lh-unsubscribe-form-group { flex-direction: column; } .lh-cta-form { flex-direction: column; } .lh-header-controls { flex-direction: column; gap: var(--space-md); } .lh-search-container { max-width: 100%; } .lh-article-actions { flex-direction: column; gap: var(--space-md); } .lh-social-share { justify-content: center; } .lh-cta-benefits { flex-direction: column; gap: var(--space-sm); } }
    @media (max-width: 480px) { .lh-main { padding: var(--space-lg) var(--space-sm); } .lh-about, .lh-content-controls, .lh-unsubscribe-section { padding: var(--space-lg); } .lh-newsletter-signup, .lh-cta-newsletter { padding: var(--space-xl); } .lh-stats-grid { grid-template-columns: 1fr; } .lh-article-meta { flex-direction: column; gap: var(--space-sm); text-align: center; } .lh-unsubscribe-section { margin: var(--space-lg) 0; } .lh-unsubscribe-header h3 { font-size: 1.5rem; } }
    @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .lh-article { animation: fadeInUp 0.6s ease-out; } .lh-article:nth-child(1) { animation-delay: 0.1s; } .lh-article:nth-child(2) { animation-delay: 0.2s; } .lh-article:nth-child(3) { animation-delay: 0.3s; } .lh-article:nth-child(4) { animation-delay: 0.4s; } .lh-loading { opacity: 0.6; pointer-events: none; } .lh-loading .lh-content-grid { filter: blur(2px); }
    .lh-theme-card:focus, .lh-sort-btn:focus, .lh-newsletter-btn:focus, .lh-read-more:focus, .lh-unsubscribe-btn:focus, .lh-search-input:focus, .lh-theme-toggle:focus { outline: 3px solid var(--accent); outline-offset: 3px; box-shadow: var(--shadow-focus); } .lh-unsubscribe-btn:focus { outline-color: var(--error); box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.4); } .lh-theme-card:focus-visible, .lh-sort-btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; } input:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; box-shadow: var(--shadow-focus); }
    /* === Pleine largeur : override thème WordPress === */
    .ast-separate-container .lhusser-newsletter-landing, .ast-plain-container .lhusser-newsletter-landing { margin: 0; padding: 0; } .site-content .lhusser-newsletter-landing { max-width: none; }
    body.lhusser-full-width-page { overflow-x: hidden; background: var(--gray-50) !important; }
    body.lhusser-full-width-page .site-content,
    body.lhusser-full-width-page #content,
    body.lhusser-full-width-page .content-area,
    body.lhusser-full-width-page #primary,
    body.lhusser-full-width-page .entry-content,
    body.lhusser-full-width-page .post-inner,
    body.lhusser-full-width-page .entry,
    body.lhusser-full-width-page article.page,
    body.lhusser-full-width-page .hentry { max-width: none !important; padding: 0 !important; margin: 0 !important; width: 100% !important; }
    body.lhusser-full-width-page .ast-container,
    body.lhusser-full-width-page .container,
    body.lhusser-full-width-page .wp-block-group,
    body.lhusser-full-width-page .ast-grid-right-inner-wrap { max-width: none !important; padding: 0 !important; width: 100% !important; }
    body.lhusser-full-width-page .wp-block-post-content,
    body.lhusser-full-width-page .wp-block-group__inner-container { max-width: none !important; padding: 0 !important; }
    body.lhusser-full-width-page aside.widget-area,
    body.lhusser-full-width-page #secondary,
    body.lhusser-full-width-page .sidebar { display: none !important; }
    .lh-notification { position: fixed; top: 20px; right: 20px; background: var(--card-bg); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: var(--space-md) var(--space-lg); box-shadow: var(--shadow-xl); display: flex; align-items: center; gap: var(--space-md); z-index: 9999; max-width: 400px; transform: translateX(calc(100% + 40px)); transition: transform var(--transition-base); backdrop-filter: blur(10px); } .lh-notification.show { transform: translateX(0); } .lh-notification-success { border-left: 4px solid var(--success); } .lh-notification-error { border-left: 4px solid var(--error); } .lh-notification-icon { font-size: 1.2rem; flex-shrink: 0; } .lh-notification-message { color: var(--gray-800); font-weight: 500; font-size: 0.9rem; }
    @media (max-width: 480px) { .lh-notification { top: 10px; right: 10px; left: 10px; max-width: none; transform: translateY(-100px); } .lh-notification.show { transform: translateY(0); } } @media print { .lh-header-controls, .lh-social-share, .lh-newsletter-signup, .lh-cta-newsletter, .lh-unsubscribe-section, .lh-notification { display: none; } }

    /* Sticky Navigation Menu */
    .lh-sticky-nav { position: sticky; top: 0; left: 0; right: 0; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); border-bottom: 1px solid var(--gray-200); z-index: 1000; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); transition: all var(--transition-base); }
    .lh-sticky-nav.scrolled { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); }
    .lh-nav-container { max-width: 1200px; margin: 0 auto; padding: var(--space-md) var(--space-lg); display: flex; align-items: center; justify-content: space-between; gap: var(--space-xl); }
    .lh-nav-brand { display: flex; align-items: center; }
    .lh-brand-link { display: flex; align-items: center; gap: var(--space-sm); text-decoration: none; color: var(--gray-900); font-weight: 700; font-size: 1.1rem; transition: all var(--transition-base); }
    .lh-brand-link:hover { color: var(--primary); }
    .lh-brand-icon { font-size: 1.5rem; }
    .lh-nav-toggle { display: none; background: none; border: none; cursor: pointer; padding: var(--space-sm); }
    .lh-hamburger { display: block; width: 24px; height: 2px; background: var(--gray-900); position: relative; transition: all var(--transition-base); }
    .lh-hamburger::before, .lh-hamburger::after { content: ''; position: absolute; width: 24px; height: 2px; background: var(--gray-900); transition: all var(--transition-base); }
    .lh-hamburger::before { top: -8px; }
    .lh-hamburger::after { bottom: -8px; }
    .lh-nav-toggle[aria-expanded="true"] .lh-hamburger { background: transparent; }
    .lh-nav-toggle[aria-expanded="true"] .lh-hamburger::before { top: 0; transform: rotate(45deg); }
    .lh-nav-toggle[aria-expanded="true"] .lh-hamburger::after { bottom: 0; transform: rotate(-45deg); }
    .lh-nav-menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: var(--space-xs); }
    .lh-nav-link { display: block; padding: var(--space-sm) var(--space-lg); text-decoration: none; color: var(--gray-700); font-weight: 500; font-size: 0.95rem; border-radius: var(--radius-lg); transition: all var(--transition-base); position: relative; }
    .lh-nav-link:hover { background: var(--primary-light); color: var(--primary); }
    .lh-nav-link.active { background: var(--primary); color: var(--white); }
    .lh-nav-link.active::after { content: ''; position: absolute; bottom: -12px; left: 50%; transform: translateX(-50%); width: 6px; height: 6px; background: var(--primary); border-radius: 50%; }

    /* Quick Links Flottants */
    .lh-quick-links { position: fixed; right: 30px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: var(--space-sm); z-index: 998; }
    .lh-quick-link { width: 48px; height: 48px; border-radius: 50%; background: rgba(255, 255, 255, 0.9); border: 2px solid var(--gray-200); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all var(--transition-base); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); backdrop-filter: blur(10px); }
    .lh-quick-link:hover { background: var(--primary-light); border-color: var(--primary); transform: scale(1.1); box-shadow: 0 4px 12px rgba(249, 115, 22, 0.2); }
    .lh-quick-link.active { background: var(--primary); border-color: var(--primary); }
    .lh-quick-link.active span { filter: grayscale(1) brightness(2); }
    .lh-quick-link span { font-size: 1.2rem; transition: all var(--transition-base); }

    /* Mode sombre - Navigation */
    [data-theme="dark"] .lh-sticky-nav {
        background: rgba(17, 24, 39, 0.98) !important;
        border-bottom: 2px solid rgba(59, 130, 246, 0.3) !important;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(59, 130, 246, 0.1) !important;
    }
    [data-theme="dark"] .lh-sticky-nav.scrolled {
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(59, 130, 246, 0.2) !important;
    }
    [data-theme="dark"] .lh-brand-link {
        color: #ffffff !important;
    }
    [data-theme="dark"] .lh-brand-link:hover {
        color: #93c5fd !important;
    }
    [data-theme="dark"] .lh-hamburger,
    [data-theme="dark"] .lh-hamburger::before,
    [data-theme="dark"] .lh-hamburger::after {
        background: #ffffff !important;
    }
    [data-theme="dark"] .lh-nav-link {
        color: #e5e7eb !important;
        opacity: 1 !important;
    }
    [data-theme="dark"] .lh-nav-link:hover {
        background: rgba(249, 115, 22, 0.3) !important;
        color: #ffffff !important;
    }
    [data-theme="dark"] .lh-nav-link.active {
        background: #3b82f6 !important;
        color: #ffffff !important;
        box-shadow: 0 2px 8px rgba(249, 115, 22, 0.4) !important;
    }
    [data-theme="dark"] .lh-quick-link {
        background: rgba(17, 24, 39, 0.95) !important;
        border-color: rgba(59, 130, 246, 0.4) !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
    }
    [data-theme="dark"] .lh-quick-link:hover {
        background: rgba(249, 115, 22, 0.4) !important;
        border-color: #3b82f6 !important;
    }
    [data-theme="dark"] .lh-nav-menu {
        background: rgba(17, 24, 39, 0.98) !important;
        border-bottom: 2px solid rgba(59, 130, 246, 0.3) !important;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
    }

    /* Responsive */
    @media (max-width: 992px), (max-width: 1024px) and (orientation: portrait) {
        .lh-nav-toggle { display: block !important; }
        .lh-nav-menu { position: absolute; top: 100%; left: 0; right: 0; background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(15px); flex-direction: column; align-items: stretch; padding: var(--space-lg); gap: var(--space-sm); border-bottom: 1px solid var(--gray-200); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); max-height: 0; overflow: hidden; opacity: 0; transition: all var(--transition-base); }
        .lh-nav-menu.open { max-height: 500px; opacity: 1; }
        .lh-nav-link { padding: var(--space-md); text-align: center; }
        .lh-nav-link.active::after { display: none; }
        .lh-quick-links { display: none !important; }
    }

    @media (max-width: 1024px) and (orientation: landscape) {
        .lh-quick-links { right: 15px; }
        .lh-quick-link { width: 40px; height: 40px; }
        .lh-quick-link span { font-size: 1rem; }
    }

    /* v21 : désinscription repliée (discrète) + stats fusionnées dans À propos */
    .lh-unsubscribe-section { background: var(--card, #1e293b); color: var(--text, #cbd5e1); border: 1px solid var(--border, #334155); border-radius: var(--radius-lg, 12px); padding: 0; margin: var(--space-lg) 0; }
    .lh-unsubscribe-section::before { display: none; }
    .lh-unsub-details { padding: 0; }
    .lh-unsub-summary { list-style: none; cursor: pointer; padding: var(--space-md, 16px) var(--space-lg, 24px); font-weight: 600; color: var(--text, #cbd5e1); display: flex; align-items: center; gap: 8px; transition: color .3s ease; user-select: none; }
    .lh-unsub-summary::-webkit-details-marker { display: none; }
    .lh-unsub-summary::after { content: "▾"; margin-left: auto; transition: transform .3s ease; opacity: .6; }
    .lh-unsub-details[open] .lh-unsub-summary::after { transform: rotate(180deg); }
    .lh-unsub-summary:hover { color: #f97316; }
    .lh-unsub-body { padding: 0 var(--space-lg, 24px) var(--space-lg, 24px); }
    .force-light-mode .lh-unsubscribe-section { background: #fff; color: #334155; border-color: #e2e8f0; }
    .force-light-mode .lh-unsub-summary { color: #334155; }
    /* Bande stats fusionnée sous À propos */
    .lh-about-stats { margin-top: var(--space-xl, 32px); padding-top: var(--space-lg, 24px); border-top: 1px solid var(--border, #334155); }
    .force-light-mode .lh-about-stats { border-top-color: #e2e8f0; }

    /* v21.3 : barre de filtres rapides + favoris + au hasard */
    .lh-quick-bar { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-sm, 8px); margin-top: var(--space-md, 16px); }
    .lh-quick-chip { display: inline-flex; align-items: center; gap: 5px; padding: 7px 15px; border-radius: 999px; border: 1px solid var(--border, #334155); background: transparent; color: var(--text, #cbd5e1); font-size: .9rem; font-weight: 600; cursor: pointer; transition: all .3s ease; }
    .lh-quick-chip:hover { border-color: #f97316; color: #f97316; transform: translateY(-2px); }
    .lh-quick-chip:focus-visible { outline: none; box-shadow: var(--shadow-focus, 0 0 0 3px rgba(249,115,22,.4)); }
    .lh-quick-chip.active { background: linear-gradient(135deg, #f97316, #ea580c); border-color: transparent; color: #fff; }
    .lh-quick-random { border-style: dashed; }
    .lh-quick-random:hover { border-style: solid; }
    .lh-quick-fav-count { font-size: .8rem; opacity: .85; }
    /* Bouton favori sur les cartes */
    .lh-fav-btn { background: transparent; border: none; color: var(--text-muted, #94a3b8); cursor: pointer; padding: 6px; border-radius: 8px; display: inline-flex; align-items: center; transition: color .25s ease, transform .25s ease; }
    .lh-fav-btn:hover { color: #f97316; transform: translateY(-2px); }
    .lh-fav-btn.is-fav { color: #f97316; }
    .lh-fav-btn.is-fav svg { fill: #f97316; stroke: #f97316; }
    .lh-fav-btn:focus-visible { outline: none; box-shadow: var(--shadow-focus, 0 0 0 3px rgba(249,115,22,.4)); }
    .force-light-mode .lh-quick-chip { color: #475569; border-color: #e2e8f0; }
    .force-light-mode .lh-quick-chip.active { color: #fff; }
    @media (prefers-reduced-motion: reduce) { .lh-quick-chip, .lh-fav-btn { transition: none; } }