/* Feuille éditoriale commune du blog — GÉNÉRÉE, ne pas éditer à la main.
 *
 * Extraite des <style> que chaque article embarquait : 44 articles portaient leur propre
 * copie du MÊME CSS (312 Ko au total, 16 % du poids du blog). Une correction demandait
 * donc 44 éditions — c est pour cela que les dérives de charte ont pu s installer.
 *
 * ⛔ Ne sont ici que les règles STRICTEMENT identiques dans tous les articles qui les
 *    portent. Ce qui diffère d un article à l autre (les :root, les héros personnalisés,
 *    les @media) reste dans l article et surcharge cette feuille — elle est chargée dans
 *    le <head>, le <style> résiduel arrive après : la cascade joue dans le bon sens.
 */

.la { color:var(--black); font-family:var(--font-body); line-height:1.7; margin:0 auto; max-width:820px; padding:0 16px 60px; }
.la-header { align-items:center; display:flex; flex-wrap:wrap; gap:12px; margin-bottom:28px; }
.la-badge { background:var(--accent); border-radius:20px; color:#fff; display:inline-block; font-size:0.6875rem; font-weight:700; letter-spacing:1.5px; padding:4px 12px; text-transform:uppercase; }
.la-note-chip { align-items:center; background:var(--gray-100); border-radius:var(--radius-sm); border:1.5px solid var(--gray-200); display:flex; gap:10px; padding:8px 14px; }
.la-note-chip .stars { color:#f5c842; font-size:1rem; letter-spacing:2px; }
.la-note-chip .score { font-size:1.125rem; font-weight:800; }
.la-note-chip .lbl { color:var(--gray-500); font-size:0.8125rem; }
.la-meta { color:var(--gray-500); font-size:0.8125rem; margin:0; width:100%; }
.la-toc li { font-size:0.875rem; }
.la-toc a { color:var(--accent); font-weight:500; text-decoration:none; }
.la-s { margin-bottom:48px; }
.la-s .si { color:var(--gray-700); font-size:1rem; margin:0 0 24px; }
.la-div { background:linear-gradient(to right,var(--black),transparent); border:none; height:2px; margin:10px 0 20px; width:60px; }
.la-ct th { background:var(--black); color:#fff; font-size:0.75rem; font-weight:700; padding:12px 14px; text-align:left; }
.la-ct td { border-bottom:1px solid var(--gray-200); padding:11px 14px; vertical-align:middle; }
.la-ct tr:nth-child(even) td { background:var(--gray-100); }
.la-ct td.ok { color:var(--green); font-weight:700; }
.la-ct td.partial { color:var(--orange); font-weight:600; }
.la-recon { background:linear-gradient(135deg,#0a0a0a,#1a1a2e); border-radius:var(--radius); color:#fff; margin-bottom:40px; padding:36px 32px; }
.la-recon h2 { color:#fff; font-size:1.375rem; margin:0 0 8px; }
.la-recon p { color:rgba(255,255,255,.7); font-size:0.9375rem; margin:0 0 24px; }
.la-rstats { display:grid; gap:12px; grid-template-columns:repeat(3,1fr); margin-bottom:28px; }
.la-rstat { background:rgba(255,255,255,.08); border-radius:var(--radius-sm); border:1px solid rgba(255,255,255,.12); padding:16px 14px; text-align:center; }
.la-rstat .lbl { color:rgba(255,255,255,.55); font-size:0.6875rem; letter-spacing:.8px; text-transform:uppercase; }
.la-rcta { align-items:center; background:#fff; border-radius:var(--radius-sm); color:var(--black); display:inline-flex; font-size:0.9375rem; font-weight:800; gap:8px; padding:14px 28px; text-decoration:none; }
.la-fi { border-radius:var(--radius); border:1.5px solid var(--gray-200); overflow:hidden; }
.la-fq { align-items:center; background:var(--gray-100); border:none; color:var(--black); cursor:pointer; display:flex; font-family:var(--font-body); font-size:0.9375rem; font-weight:700; gap:16px; justify-content:space-between; padding:16px 20px; text-align:left; transition:background .2s; width:100%; }
.la-fq:hover { background:#eaeaea; }
.la-fq.open { background:var(--accent); color:#fff; }
.la-fq .fn { align-items:center; background:rgba(184,92,44,.12); border-radius:50%; color:var(--accent); display:inline-flex; flex-shrink:0; font-size:0.6875rem; font-weight:800; height:24px; justify-content:center; width:24px; }
.la-fq.open .fn { background:rgba(255,255,255,.2); color:#fff; }
.la-fq-t { flex:1; }
.la-fq .fi { align-items:center; background:rgba(184,92,44,.1); border-radius:50%; color:var(--accent); display:flex; flex-shrink:0; font-size:1.125rem; height:28px; justify-content:center; transition:transform .25s; width:28px; }
.la-fq.open .fi { background:rgba(255,255,255,.2); color:#fff; transform:rotate(45deg); }
.la-fa { background:#fff; border-top:1px solid var(--gray-200); color:var(--gray-700); display:none; font-size:0.875rem; line-height:1.75; padding:18px 20px 20px; }
.la-fa.open { display:block; }
.la-fa a { color:var(--accent); font-weight:600; }
.la h3 { font-size:1.125rem; font-weight:800; margin:28px 0 10px; }
.la p { font-size:0.9375rem; margin:0 0 16px; }
.la ul { margin:0 0 16px; padding-left:20px; }
.la ul li { font-size:0.9375rem; margin-bottom:6px; }
.la-hero-stats { display: flex; flex-wrap: wrap; gap: 24px; }
.la-hero-stat { backdrop-filter: blur(6px); background: rgba(255,255,255,0.08); border-radius: var(--radius-sm); border: 1px solid rgba(255,255,255,0.15); padding: 12px 18px; }
.la-hero-stat .val { color: #fff; font-size: 1.375rem; font-weight: 900; line-height: 1; }
.la-hero-stat .lbl { color: rgba(255,255,255,0.55); font-size: 0.6875rem; letter-spacing: 0.8px; text-transform: uppercase; }
.la-toc ol li { font-size: 0.875rem; }
.la-toc ol li a { color: var(--accent); font-weight: 500; text-decoration: none; }
.la-toc ol li a:hover { text-decoration: underline; }
.la-podium { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); margin-bottom: 32px; }
.la-podium-card { border-radius: var(--radius); border: 2px solid transparent; overflow: hidden; padding: 22px 20px; position: relative; }
.la-podium-card.gold { background: linear-gradient(135deg, #1d1d1d, #2a2a2a); border-color: #c9820a; }
.la-podium-rank { font-size: 1.75rem; margin-bottom: 6px; }
.la-podium-link:hover { opacity: 0.85; }
.la-paa-block { background: #f0fdf4; border-radius: var(--radius); border: 2px solid #16a34a; margin: 0 0 40px; padding: 24px 26px; }
.la-recon-pillars { display: grid; gap: 12px; grid-template-columns: repeat(2, 1fr); margin-bottom: 28px; }
.la-recon-pillar { align-items: flex-start; background: rgba(255,255,255,0.08); border-radius: var(--radius-sm); border: 1px solid rgba(255,255,255,0.12); display: flex; gap: 12px; padding: 16px 18px; }
.la-recon-pillar .pillar-icon { flex-shrink: 0; font-size: 1.375rem; margin-top: 2px; }
.la-recon-pillar .pillar-title { color: #fff; font-size: 0.875rem; font-weight: 800; margin-bottom: 3px; }
.la-recon-pillar .pillar-desc { color: rgba(255,255,255,0.55); font-size: 0.75rem; line-height: 1.5; }
.la-recon-cta:hover { opacity: 0.88; }
.la-faq-item:has(.la-faq-q.open) { border-color: var(--accent); box-shadow: 0 2px 12px rgba(184,92,44,0.08); }
.la-faq-q { align-items: center; background: var(--gray-100); border: none; color: var(--black); cursor: pointer; display: flex; font-family: var(--font-body); font-size: 0.9375rem; font-weight: 700; gap: 16px; justify-content: space-between; padding: 16px 20px; text-align: left; transition: background 0.2s; width: 100%; }
.la-faq-q:hover { background: #eaeaea; }
.la-faq-q.open { background: var(--accent); color: #fff; }
.la-faq-q.open .faq-num { background: rgba(255,255,255,0.2); color: #fff; }
.la-faq-q-text { flex: 1; }
.la-faq-q.open .faq-icon { background: rgba(255,255,255,0.2); color: #fff; transform: rotate(45deg); }
.la-faq-a { background: #fff; border-top: 1px solid var(--gray-200); color: var(--gray-700); display: none; font-size: 0.875rem; line-height: 1.75; padding: 18px 20px 20px; }
.la-faq-a.open { display: block; }
.la-faq-a a { color: var(--accent); font-weight: 600; }
.lifone-article p { font-size: 0.9375rem; margin: 0 0 16px; }
.lifone-article ul { margin: 0 0 16px; padding-left: 20px; }
.la-inline-tip { background: var(--gold-light); border-left: 4px solid var(--gold); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: #5a3a00; font-size: 0.875rem; line-height: 1.6; margin: 20px 0; padding: 14px 18px; }
.la-inline-tip strong { color: var(--gold); }
.lifone-faq h2 { margin-bottom: 20px; }
.faq-item:hover { box-shadow: 0 2px 12px rgba(0,0,0,0.08); }
.qia-cta-card { background:linear-gradient(135deg,#1a2332,#2d3e50); border-radius:16px; color:#fff; margin:40px 0; padding:32px; text-align:center; }
.qia-cta-card h3 { color:#fff; font-size:1.375rem; margin:0 0 12px; }
.qia-cta-card p { color:#d1d5db; font-size:0.9375rem; margin:0 0 20px; }
.qia-cta-btn { background:#c9a961; border-radius:10px; color:#1a2332; display:inline-block; font-size:0.9375rem; font-weight:700; padding:14px 32px; text-decoration:none; transition:transform 0.2s; }
.qia-cta-btn:hover { color:#1a2332; transform:translateY(-2px); }
.la-piege-card { background: var(--orange-light); border-left: 4px solid var(--orange); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin-bottom: 14px; padding: 18px 22px; }
.la-compare-table th.hl { background: var(--accent); }
.la-compare-table tr:last-child td { border-bottom: none; }
.la-compare-table tr:nth-child(even) td { background: var(--gray-100); }
.la-compare-table td.hl { background: var(--accent-light) !important; color: var(--accent); font-weight: 700; }
.la-article-header { align-items: center; display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 28px; }
.la-specs-grid { border-radius: var(--radius); border: 2px solid var(--gray-200); display: grid; gap: 2px; grid-template-columns: 1fr 1fr; overflow: hidden; }
.la-specs-label { background: var(--gray-100); border-bottom: 1px solid var(--gray-200); color: var(--gray-700); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.5px; padding: 12px 16px; text-transform: uppercase; }
.la-specs-value { background: #fff; border-bottom: 1px solid var(--gray-200); color: var(--black); font-size: 0.875rem; padding: 12px 16px; }
.la-pros ul, .la-cons ul { list-style: none; margin: 0; padding: 0; }
.la-pros ul li::before { color: var(--green); content: '✓'; font-weight: 700; left: 0; position: absolute; }
.la-cons ul li::before { color: var(--orange); content: '✗'; font-weight: 700; left: 0; position: absolute; }
.la-note-card { align-items: center; background: var(--gray-100); border-radius: var(--radius); display: grid; gap: 24px; grid-template-columns: auto 1fr; margin-top: 24px; padding: 24px; }
.la-note-big { color: var(--black); font-size: 3.5rem; font-weight: 900; line-height: 1; }
.la-note-big span { color: var(--gray-500); font-size: 1.375rem; font-weight: 400; }
.la-note-details { display: flex; flex-direction: column; gap: 8px; }
.la-note-bar-label { color: var(--gray-700); font-size: 0.75rem; font-weight: 600; }
.la-note-bar-track { background: var(--gray-200); border-radius: 10px; height: 6px; overflow: hidden; }
.la-note-bar-fill { background: var(--black); border-radius: 10px; height: 100%; }
.la-note-bar-score { font-size: 0.75rem; font-weight: 700; text-align: right; }
.la-recon-stats { display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); margin-bottom: 28px; }
.la-recon-stat { background: rgba(255,255,255,0.08); border-radius: var(--radius-sm); border: 1px solid rgba(255,255,255,0.12); padding: 16px 14px; text-align: center; }
.la-recon-stat .val { color: #fff; font-size: 1.75rem; font-weight: 900; line-height: 1; margin-bottom: 4px; }
.la-recon-stat .val em { color: rgba(255,255,255,0.6); font-size: 0.875rem; font-style: normal; }
.la-recon-stat .lbl { color: rgba(255,255,255,0.55); font-size: 0.6875rem; letter-spacing: 0.8px; text-transform: uppercase; }
.la-pro-grid { display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); margin: 20px 0; }
.la-pro-card .pc-icon { font-size: 1.75rem; margin-bottom: 8px; }
.la-pro-card .pc-desc { color: var(--gray-700); font-size: 0.75rem; line-height: 1.5; }
.la-compare-table th.highlight { background: var(--accent); }
.la-compare-table td.highlight { background: var(--accent-light) !important; color: var(--accent); font-weight: 700; }
.la-compare-table .badge { background: #f5c842; border-radius: 10px; color: #000; display: inline-block; font-size: 0.625rem; font-weight: 700; margin-left: 6px; padding: 2px 7px; vertical-align: middle; }
.la-recon-cta .arrow { font-size: 1.125rem; }
.la-popular-banner { align-items: center; background: #fff8e1; border-radius: var(--radius-sm); border: 1.5px solid #f5c842; color: #6b4f00; display: flex; font-size: 0.875rem; gap: 10px; margin-bottom: 28px; padding: 12px 16px; }
.la-popular-banner strong { font-weight: 800; }
.la-di-block { align-items: center; background: var(--black); border-radius: var(--radius); color: #fff; display: grid; gap: 20px; grid-template-columns: auto 1fr; margin: 24px 0; padding: 24px 28px; }
.la-di-icon { flex-shrink: 0; font-size: 3rem; }
.la-specs { border-radius:var(--radius); border:2px solid var(--gray-200); display:grid; gap:2px; grid-template-columns:1fr 1fr; overflow:hidden; }
.la-specs .k { background:var(--gray-100); border-bottom:1px solid var(--gray-200); color:var(--gray-700); font-size:0.8125rem; font-weight:700; letter-spacing:.5px; padding:12px 16px; text-transform:uppercase; }
.la-specs .v { background:#fff; border-bottom:1px solid var(--gray-200); font-size:0.875rem; padding:12px 16px; }
.la-pg { display:grid; gap:12px; grid-template-columns:repeat(3,1fr); margin:20px 0; }
.la-pc { background:var(--gray-100); border-radius:var(--radius); border:1.5px solid var(--gray-200); padding:16px 14px; text-align:center; }
.la-pc .i { font-size:1.75rem; margin-bottom:8px; }
.la-pc .t { font-size:0.8125rem; font-weight:800; margin-bottom:4px; }
.la-pc .d { color:var(--gray-700); font-size:0.75rem; line-height:1.5; }
.la-pros h3,.la-cons h3 { font-size:0.875rem; font-weight:800; letter-spacing:1px; margin:0 0 14px; text-transform:uppercase; }
.la-pros ul,.la-cons ul { list-style:none; margin:0; padding:0; }
.la-pros li,.la-cons li { font-size:0.875rem; line-height:1.6; padding:5px 0 5px 22px; position:relative; }
.la-pros li::before { color:var(--green); content:'✓'; font-weight:700; left:0; position:absolute; }
.la-cons li::before { color:var(--orange); content:'✗'; font-weight:700; left:0; position:absolute; }
.la-bars { align-items:center; background:var(--gray-100); border-radius:var(--radius); display:grid; gap:24px; grid-template-columns:auto 1fr; margin-top:24px; padding:24px; }
.la-big { font-size:3.5rem; font-weight:900; line-height:1; }
.la-big span { color:var(--gray-500); font-size:1.375rem; font-weight:400; }
.la-bar-rows { display:flex; flex-direction:column; gap:8px; }
.la-br { align-items:center; display:grid; gap:10px; grid-template-columns:120px 1fr 36px; }
.la-br-lbl { color:var(--gray-700); font-size:0.75rem; font-weight:600; }
.la-track { background:var(--gray-200); border-radius:10px; height:6px; overflow:hidden; }
.la-fill { background:var(--black); border-radius:10px; height:100%; }
.la-br-score { font-size:0.75rem; font-weight:700; text-align:right; }
.la-ct th.hl { background:var(--accent); }
.la-ct td.hl { background:var(--accent-light)!important; color:var(--accent); font-weight:700; }
.la-ct .ok { color:var(--green); font-weight:700; }
.la-ct .no { color:#ccc; }
