*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
   --bg: #0a0e1f; --bg2: #1b2240;
   --blue: #2563eb; --blue-light: #60a5fa;
   --gold: #ffe5a5; --white: #ffffff;
   --muted: rgba(255,255,255,0.72);
   --card-bg: rgba(27,34,64,0.65);
   --border: rgba(96,165,250,0.14);
   --green: #4ade80; --purple: #60a5fa; --red: #f87171;
  }
  html { scroll-behavior: smooth; }
  body { font-family:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,sans-serif; background:var(--bg); color:var(--white); overflow-x:hidden; line-height:1.6; }

  /* ===== NAV ===== */
  nav { position:fixed; top:0; left:0; right:0; z-index:200; display:flex; align-items:center; justify-content:space-between; padding:22px 48px; transition:all .35s ease; }
  nav.scrolled { background:rgba(10,14,31,.9); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); border-bottom:1px solid var(--border); padding:14px 48px; }
  .logo { display:flex; align-items:center; gap:10px; text-decoration:none; user-select:none; }
  .logo-wordmark { font-family:'Outfit','IBM Plex Sans',sans-serif; font-weight:900; font-size:22px; color:var(--gold); letter-spacing:-.5px; line-height:1; }
  nav ul { display:flex; align-items:center; gap:28px; list-style:none; }
  nav ul a { color:var(--muted); text-decoration:none; font-size:14px; font-weight:500; transition:color .2s; }
  nav ul a:hover { color:var(--white); }
  nav ul a.active { color:var(--gold); font-weight:600; }
  .nav-cta { background:var(--blue)!important; color:var(--white)!important; padding:10px 22px; border-radius:10px; font-weight:600!important; transition:all .2s!important; }
  .nav-cta:hover { background:#1d4ed8!important; transform:translateY(-1px)!important; box-shadow:0 8px 24px rgba(37,99,235,.45)!important; }
  .hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; background:none; border:none; }
  .hamburger span { display:block; width:22px; height:2px; background:var(--white); border-radius:2px; }
  .nav-mobile { display:none; position:fixed; inset:0; background:rgba(10,14,31,.98); z-index:199; flex-direction:column; align-items:center; justify-content:center; gap:28px; }
  .nav-mobile.open { display:flex; }
  .nav-mobile a { color:var(--white); text-decoration:none; font-size:22px; font-weight:700; }
  .nav-mobile-close { position:absolute; top:20px; right:24px; background:none; border:none; color:var(--white); font-size:36px; cursor:pointer; }

  /* ===== HERO ===== */
  .hero { min-height:48vh; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; padding:130px 48px 72px; text-align:center; }
  .hero-bg { position:absolute; inset:0; background:var(--bg); }
  .orb { position:absolute; border-radius:50%; filter:blur(90px); }
  .orb-1 { width:600px; height:600px; background:radial-gradient(circle,rgba(37,99,235,.6) 0%,transparent 65%); top:-150px; right:-100px; animation:drift1 9s ease-in-out infinite; }
  .orb-2 { width:450px; height:450px; background:radial-gradient(circle,rgba(37,99,235,.4) 0%,transparent 65%); bottom:-60px; left:-60px; animation:drift2 11s ease-in-out infinite; }
  @keyframes drift1 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-50px,30px)} }
  @keyframes drift2 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(40px,-50px)} }
  .hero-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(96,165,250,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(96,165,250,.04) 1px,transparent 1px); background-size:64px 64px; mask-image:radial-gradient(ellipse 80% 70% at 50% 50%,black 40%,transparent 100%); }
  .hero-inner { position:relative; z-index:2; max-width:720px; }
  .s-badge { display:inline-flex; align-items:center; gap:7px; background:rgba(37,99,235,.09); border:1px solid rgba(37,99,235,.2); border-radius:100px; padding:5px 14px; font-size:11.5px; font-weight:700; color:var(--blue-light); text-transform:uppercase; letter-spacing:.6px; margin-bottom:20px; }
  .hero h1 { font-size:clamp(36px,5.5vw,62px); font-weight:900; letter-spacing:-2px; line-height:1.06; margin-bottom:20px; }
  .hero h1 em { font-style:normal; background:linear-gradient(120deg,#ffe9bd,#ffce5e 48%,#ffe9bd);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent; }
  .hero p { font-size:17px; color:var(--muted); line-height:1.75; max-width:580px; margin:0 auto; }

  /* ===== LAYOUT ===== */
  .section { padding:80px 48px; }
  .container { max-width:1100px; margin:0 auto; }
  .s-title { font-size:clamp(28px,3.5vw,42px); font-weight:900; letter-spacing:-1.2px; line-height:1.1; margin-bottom:14px; }
  .s-sub { font-size:16px; color:var(--muted); line-height:1.75; }

  /* ===== BLOG LISTING ===== */
  .blog-filters { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:48px; }
  .filter-btn { padding:8px 18px; border-radius:100px; border:1px solid var(--border); background:transparent; color:var(--muted); font-size:13px; font-weight:600; cursor:pointer; transition:all .2s; font-family:inherit; }
  .filter-btn:hover, .filter-btn.active { background:var(--blue); border-color:var(--blue); color:var(--white); }

  .blog-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
  .blog-card { background:var(--card-bg); border:1px solid var(--border); border-radius:24px; overflow:hidden; cursor:pointer; transition:transform .3s, box-shadow .3s, border-color .3s; backdrop-filter:blur(20px); display:flex; flex-direction:column; }
  .blog-card:hover { transform:translateY(-6px); box-shadow:0 24px 48px rgba(0,0,0,.4); border-color:rgba(96,165,250,.28); }
  .blog-card-cover { height:220px; display:flex; align-items:flex-end; padding:28px; position:relative; overflow:hidden; }
  .blog-card-cover::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(10,14,31,.85) 0%,transparent 60%); }
  .cover-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
  /* ── BLOG COVERS, gradient + SVG illustration ── */
  .cover-epargne {
   background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 220'%3E%3Crect x='30' y='150' width='38' height='70' fill='white' fill-opacity='.08' rx='4'/%3E%3Crect x='88' y='120' width='38' height='100' fill='white' fill-opacity='.1' rx='4'/%3E%3Crect x='146' y='88' width='38' height='132' fill='white' fill-opacity='.12' rx='4'/%3E%3Crect x='204' y='56' width='38' height='164' fill='white' fill-opacity='.14' rx='4'/%3E%3Crect x='262' y='30' width='38' height='190' fill='white' fill-opacity='.16' rx='4'/%3E%3Cpolyline points='49,148 107,118 165,86 223,54 281,28' fill='none' stroke='%23ffe5a5' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' stroke-opacity='.7'/%3E%3Ccircle cx='340' cy='60' r='55' fill='none' stroke='white' stroke-opacity='.07' stroke-width='34'/%3E%3Ctext x='326' y='68' font-family='sans-serif' font-size='26' font-weight='900' fill='white' fill-opacity='.18'%3E€%3C/text%3E%3C/svg%3E") center/cover no-repeat,
    linear-gradient(135deg,#0a1628 0%,#1e3a8a 50%,#2563eb 100%);
  }
  .cover-fiscalite {
   background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 220'%3E%3Cpath d='M290 20 L330 20 L350 55 L330 90 L290 90 L270 55 Z' fill='white' fill-opacity='.07' stroke='white' stroke-opacity='.12' stroke-width='1.5'/%3E%3Ctext x='285' y='65' font-family='sans-serif' font-size='32' font-weight='900' fill='%23fbbf24' fill-opacity='.5'%3E%%3C/text%3E%3Crect x='30' y='60' width='160' height='2' fill='white' fill-opacity='.1' rx='1'/%3E%3Crect x='30' y='80' width='120' height='2' fill='white' fill-opacity='.08' rx='1'/%3E%3Crect x='30' y='100' width='140' height='2' fill='white' fill-opacity='.07' rx='1'/%3E%3Crect x='30' y='120' width='100' height='2' fill='white' fill-opacity='.06' rx='1'/%3E%3Crect x='30' y='140' width='130' height='2' fill='white' fill-opacity='.07' rx='1'/%3E%3Ccircle cx='60' cy='170' r='30' fill='none' stroke='%23fbbf24' stroke-opacity='.15' stroke-width='14'/%3E%3C/svg%3E") center/cover no-repeat,
    linear-gradient(135deg,#1a0d00 0%,#78350f 50%,#d97706 100%);
  }
  .cover-retraite {
   background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 220'%3E%3Cellipse cx='310' cy='60' rx='28' ry='48' fill='none' stroke='white' stroke-opacity='.14' stroke-width='2'/%3E%3Cline x1='282' y1='60' x2='338' y2='60' stroke='white' stroke-opacity='.1' stroke-width='1.5'/%3E%3Cellipse cx='310' cy='60' rx='18' ry='30' fill='white' fill-opacity='.04'/%3E%3Ccircle cx='310' cy='60' r='5' fill='%23a78bfa' fill-opacity='.5'/%3E%3Cline x1='40' y1='110' x2='240' y2='110' stroke='white' stroke-opacity='.15' stroke-width='1.5'/%3E%3Ccircle cx='60' cy='110' r='6' fill='%23a78bfa' fill-opacity='.55'/%3E%3Ccircle cx='110' cy='110' r='5' fill='white' fill-opacity='.22'/%3E%3Ccircle cx='160' cy='110' r='5' fill='white' fill-opacity='.18'/%3E%3Ccircle cx='210' cy='110' r='5' fill='white' fill-opacity='.14'/%3E%3Crect x='40' y='130' width='60' height='1.5' fill='white' fill-opacity='.1' rx='1'/%3E%3Crect x='40' y='145' width='80' height='1.5' fill='white' fill-opacity='.08' rx='1'/%3E%3C/svg%3E") center/cover no-repeat,
    linear-gradient(135deg,#0d0820 0%,#2d1b69 50%,#4c1d95 100%);
  }
  .cover-banque {
   background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 220'%3E%3Crect x='260' y='70' width='110' height='90' fill='white' fill-opacity='.05' rx='4'/%3E%3Crect x='275' y='90' width='10' height='55' fill='white' fill-opacity='.1' rx='2'/%3E%3Crect x='297' y='90' width='10' height='55' fill='white' fill-opacity='.1' rx='2'/%3E%3Crect x='319' y='90' width='10' height='55' fill='white' fill-opacity='.1' rx='2'/%3E%3Crect x='341' y='90' width='10' height='55' fill='white' fill-opacity='.1' rx='2'/%3E%3Crect x='260' y='160' width='110' height='6' fill='white' fill-opacity='.12' rx='2'/%3E%3Cpolygon points='315,60 260,75 370,75' fill='white' fill-opacity='.1'/%3E%3Cpath d='M80 120 Q100 100 120 120 Q100 140 80 120Z' fill='none' stroke='%2334d399' stroke-opacity='.35' stroke-width='2'/%3E%3Cpath d='M100 120 Q120 100 140 120 Q120 140 100 120Z' fill='none' stroke='%2334d399' stroke-opacity='.25' stroke-width='2'/%3E%3C/svg%3E") center/cover no-repeat,
    linear-gradient(135deg,#001a0d 0%,#065f46 50%,#059669 100%);
  }
  .cover-immobilier {
   background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 220'%3E%3Crect x='30' y='110' width='50' height='110' fill='white' fill-opacity='.07' rx='2'/%3E%3Crect x='95' y='80' width='65' height='140' fill='white' fill-opacity='.09' rx='2'/%3E%3Crect x='175' y='60' width='55' height='160' fill='white' fill-opacity='.11' rx='2'/%3E%3Crect x='245' y='90' width='45' height='130' fill='white' fill-opacity='.08' rx='2'/%3E%3Crect x='305' y='70' width='70' height='150' fill='white' fill-opacity='.1' rx='2'/%3E%3Crect x='48' y='128' width='8' height='10' fill='white' fill-opacity='.18' rx='1'/%3E%3Crect x='64' y='128' width='8' height='10' fill='white' fill-opacity='.18' rx='1'/%3E%3Crect x='113' y='100' width='10' height='12' fill='white' fill-opacity='.18' rx='1'/%3E%3Crect x='133' y='100' width='10' height='12' fill='white' fill-opacity='.18' rx='1'/%3E%3Crect x='193' y='82' width='9' height='11' fill='%23c4b5fd' fill-opacity='.35' rx='1'/%3E%3C/svg%3E") center/cover no-repeat,
    linear-gradient(135deg,#1a0a2e 0%,#4c1d95 50%,#2563eb 100%);
  }
  .cover-expat {
   background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 220'%3E%3Ccircle cx='300' cy='80' r='75' fill='none' stroke='white' stroke-opacity='.1' stroke-width='1.5'/%3E%3Cellipse cx='300' cy='80' rx='32' ry='75' fill='none' stroke='white' stroke-opacity='.08' stroke-width='1.5'/%3E%3Cline x1='225' y1='80' x2='375' y2='80' stroke='white' stroke-opacity='.08' stroke-width='1.5'/%3E%3Cellipse cx='300' cy='80' rx='75' ry='28' fill='none' stroke='white' stroke-opacity='.07' stroke-width='1.5'/%3E%3Ccircle cx='300' cy='80' r='5' fill='%2367e8f9' fill-opacity='.5'/%3E%3Cpath d='M80 150 L95 140 L90 155 L105 145 L100 160' fill='none' stroke='%2367e8f9' stroke-opacity='.4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/cover no-repeat,
    linear-gradient(135deg,#001a1f 0%,#0d4f5f 50%,#2563eb 100%);
  }
  .cover-guide {
   background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 220'%3E%3Ccircle cx='310' cy='75' r='62' fill='none' stroke='white' stroke-opacity='.09' stroke-width='38'/%3E%3Ccircle cx='310' cy='75' r='42' fill='none' stroke='white' stroke-opacity='.12' stroke-width='1.5' stroke-dasharray='4 3'/%3E%3Ccircle cx='310' cy='75' r='8' fill='none' stroke='white' stroke-opacity='.2' stroke-width='1.5'/%3E%3Cline x1='310' y1='33' x2='310' y2='53' stroke='%23ffe5a5' stroke-width='3' stroke-linecap='round' stroke-opacity='.7'/%3E%3Cline x1='310' y1='97' x2='310' y2='117' stroke='white' stroke-width='2' stroke-opacity='.25' stroke-linecap='round'/%3E%3Cline x1='268' y1='75' x2='288' y2='75' stroke='white' stroke-width='2' stroke-opacity='.25' stroke-linecap='round'/%3E%3Cline x1='332' y1='75' x2='352' y2='75' stroke='%23ffe5a5' stroke-width='2' stroke-opacity='.4' stroke-linecap='round'/%3E%3Crect x='30' y='55' width='160' height='1.5' fill='white' fill-opacity='.08' rx='1'/%3E%3Crect x='30' y='75' width='130' height='1.5' fill='white' fill-opacity='.06' rx='1'/%3E%3Crect x='30' y='95' width='150' height='1.5' fill='white' fill-opacity='.07' rx='1'/%3E%3C/svg%3E") center/cover no-repeat,
    linear-gradient(135deg,#050d24 0%,#1e2060 50%,#312e81 100%);
  }
  .cover-tag { position:absolute; top:20px; left:20px; z-index:2; padding:5px 12px; border-radius:100px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; }
  .tag-epargne { background:rgba(37,99,235,.25); border:1px solid rgba(96,165,250,.35); color:var(--blue-light); }
  .tag-fiscalite { background:rgba(217,119,6,.25); border:1px solid rgba(251,191,36,.35); color:#fbbf24; }
  .tag-retraite { background:rgba(37,99,235,.25); border:1px solid rgba(167,139,250,.35); color:var(--purple); }
  .tag-banque { background:rgba(5,150,105,.25); border:1px solid rgba(74,222,128,.35); color:var(--green); }
  .tag-immobilier { background:rgba(37,99,235,.25); border:1px solid rgba(167,139,250,.35); color:#93c5fd; }
  .tag-expat { background:rgba(37,99,235,.25); border:1px solid rgba(103,232,249,.35); color:#60a5fa; }
  .cover-icon { font-size:56px; position:absolute; right:28px; bottom:20px; z-index:2; opacity:.7; }
  .blog-card-body { padding:28px 28px 24px; flex:1; display:flex; flex-direction:column; }
  .blog-card-meta { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
  .meta-date { font-size:12px; color:var(--muted); font-weight:500; }
  .meta-sep { width:3px; height:3px; border-radius:50%; background:rgba(255,255,255,.2); }
  .meta-read { font-size:12px; color:var(--muted); font-weight:500; }
  .blog-card h2 { font-size:20px; font-weight:800; line-height:1.25; margin-bottom:12px; }
  .blog-card p { font-size:14px; color:var(--muted); line-height:1.75; flex:1; margin-bottom:20px; }
  .card-read-btn { display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:700; color:var(--blue-light); transition:gap .2s; cursor:pointer; background:none; border:none; font-family:inherit; padding:0; }
  .blog-card:hover .card-read-btn { gap:13px; }
  .blog-card:hover .card-read-btn svg { transform:translateX(3px); }
  .card-read-btn svg { transition:transform .2s; }

  /* ===== ARTICLE VIEW ===== */
  .article-view { display:none; }
  .article-back { display:inline-flex; align-items:center; gap:9px; color:var(--muted); text-decoration:none; font-size:14px; font-weight:600; cursor:pointer; background:none; border:none; font-family:inherit; margin-bottom:40px; padding:0; transition:color .2s; }
  .article-back:hover { color:var(--white); }
  .article-header { max-width:760px; margin:0 auto 56px; }
  .article-header .cover-tag { position:static; display:inline-flex; margin-bottom:20px; }
  .article-header h1 { font-size:clamp(28px,4.5vw,48px); font-weight:900; letter-spacing:-1.5px; line-height:1.1; margin-bottom:18px; }
  .article-header .lead { font-size:18px; color:var(--muted); line-height:1.8; margin-bottom:28px; }
  .article-byline { display:flex; align-items:center; gap:14px; padding-top:20px; border-top:1px solid var(--border); }
  .byline-avatar { width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,var(--blue),var(--blue-light)); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex-shrink:0; }
  .byline-name { font-size:14px; font-weight:700; }
  .byline-role { font-size:12px; color:var(--muted); }
  .byline-sep { margin-left:auto; display:flex; align-items:center; gap:16px; }
  .byline-sep span { font-size:12px; color:var(--muted); }

  /* Article content */
  .article-body { max-width:760px; margin:0 auto; }
  .article-body h2 { font-size:24px; font-weight:800; letter-spacing:-.5px; margin:48px 0 16px; line-height:1.2; }
  .article-body h3 { font-size:18px; font-weight:700; margin:32px 0 12px; }
  .article-body p { font-size:16px; color:rgba(255,255,255,.82); line-height:1.9; margin-bottom:20px; }
  .article-body strong { color:var(--white); font-weight:700; }
  .article-body em { font-style:italic; }
  /* Lead/hero image per article */
  .article-figure { margin:0 0 40px; }
  .article-figure img { display:block; width:100%; max-width:100%; height:auto; border-radius:20px; border:1px solid var(--border); box-shadow:0 24px 60px -28px rgba(0,0,0,.75); }
  .article-figure figcaption { margin-top:10px; font-size:11.5px; color:var(--muted); letter-spacing:.3px; text-align:right; }
  .article-body ul, .article-body ol { margin:20px 0 24px 0; display:flex; flex-direction:column; gap:10px; list-style:none; padding:0; }
  .article-body ul li, .article-body ol li { font-size:15.5px; color:rgba(255,255,255,.8); line-height:1.7; display:flex; align-items:flex-start; gap:12px; }
  .article-body ul li::before { content:'→'; color:var(--blue-light); font-weight:700; flex-shrink:0; margin-top:2px; }
  .article-body ol { counter-reset:ol; }
  .article-body ol li::before { counter-increment:ol; content:counter(ol); width:24px; height:24px; border-radius:50%; background:var(--blue); color:var(--white); font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:1px; }

  /* Stat boxes */
  .stat-box { background:var(--card-bg); border:1px solid var(--border); border-radius:18px; padding:28px 32px; margin:32px 0; backdrop-filter:blur(20px); }
  .stat-box-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  .stat-box-item { text-align:center; }
  .stat-box-val { font-size:38px; font-weight:900; color:var(--gold); letter-spacing:-1.5px; line-height:1; margin-bottom:8px; }
  .stat-box-lbl { font-size:12.5px; color:var(--muted); line-height:1.4; }
  .stat-box-2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }

  /* Quote / callout */
  .callout { border-left:3px solid var(--blue-light); padding:20px 28px; background:rgba(37,99,235,.06); border-radius:0 14px 14px 0; margin:32px 0; }
  .callout p { font-size:17px; color:var(--white); font-style:italic; line-height:1.75; margin:0; }
  .callout-gold { border-left-color:var(--gold); background:rgba(255,229,165,.05); }
  .callout-green { border-left-color:var(--green); background:rgba(74,222,128,.05); }

  /* Comparison table */
  .compare-table { width:100%; border-collapse:collapse; margin:28px 0; }
  .compare-table th { padding:12px 16px; text-align:left; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; color:var(--muted); border-bottom:1px solid var(--border); }
  .compare-table td { padding:14px 16px; font-size:14px; border-bottom:1px solid rgba(96,165,250,.07); }
  .compare-table tr:hover td { background:rgba(96,165,250,.04); }
  .compare-table td:first-child { font-weight:600; color:var(--white); }
  .t-good { color:var(--green); font-weight:700; }
  .t-bad { color:#f87171; font-weight:700; }
  .t-muted { color:var(--muted); }

  /* Article CTA */
  .article-cta { margin:64px 0 0; background:linear-gradient(135deg,rgba(37,99,235,.1),rgba(96,165,250,.05)); border:1px solid rgba(37,99,235,.25); border-radius:20px; padding:44px 48px; text-align:center; }
  .article-cta h3 { font-size:26px; font-weight:900; letter-spacing:-.5px; margin-bottom:12px; }
  .article-cta h3 em { font-style:normal; background:linear-gradient(120deg,#ffe9bd,#ffce5e 48%,#ffe9bd);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent; }
  .article-cta p { font-size:16px; color:var(--muted); margin-bottom:28px; line-height:1.7; }
  .btn-primary { display:inline-flex; align-items:center; gap:8px; background:var(--blue); color:var(--white); padding:15px 30px; border-radius:12px; font-size:15.5px; font-weight:700; text-decoration:none; transition:all .22s; box-shadow:0 4px 20px rgba(37,99,235,.35); }
  .btn-primary:hover { background:#1d4ed8; transform:translateY(-2px); box-shadow:0 12px 32px rgba(37,99,235,.5); }
  .btn-secondary { display:inline-flex; align-items:center; gap:8px; background:transparent; color:var(--white); padding:15px 30px; border-radius:12px; font-size:15.5px; font-weight:600; text-decoration:none; border:1px solid rgba(255,255,255,.18); transition:all .22s; }
  .btn-secondary:hover { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.35); }
  .article-cta-btns { display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }

  /* Comments section */
  .comments-section { max-width:760px; margin:64px auto 0; padding-top:48px; border-top:1px solid var(--border); }
  .comments-section h3 { font-size:20px; font-weight:800; margin-bottom:28px; }
  .comment-item { background:rgba(27,34,64,.5); border:1px solid var(--border); border-radius:14px; padding:20px 22px; margin-bottom:14px; }
  .comment-meta { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
  .comment-avatar { width:34px; height:34px; border-radius:50%; background:linear-gradient(135deg,#2563eb,#60a5fa); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex-shrink:0; }
  .comment-author { font-size:14px; font-weight:700; }
  .comment-date { font-size:12px; color:var(--muted); }
  .comment-text { font-size:14.5px; color:rgba(255,255,255,.8); line-height:1.7; }
  .comment-form { background:rgba(27,34,64,.4); border:1px solid var(--border); border-radius:16px; padding:28px; margin-top:32px; }
  .comment-form h4 { font-size:16px; font-weight:800; margin-bottom:18px; }
  .cf-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
  .cf-field { display:flex; flex-direction:column; gap:6px; }
  .cf-field label { font-size:11.5px; font-weight:700; color:rgba(255,255,255,.5); letter-spacing:.4px; text-transform:uppercase; }
  .cf-field input,.cf-field textarea { background:rgba(10,14,31,.6); border:1px solid rgba(96,165,250,.2); border-radius:10px; color:#fff; font-family:inherit; font-size:14px; padding:10px 13px; outline:none; resize:vertical; transition:border-color .2s; }
  .cf-field input:focus,.cf-field textarea:focus { border-color:rgba(96,165,250,.55); }
  .cf-err { color:#f87171; font-size:13px; display:none; margin-bottom:8px; }
  .cf-btn { padding:12px 28px; background:linear-gradient(120deg,#2f6bff,#6ea8ff 55%,#60a5fa); color:#fff; border:none; border-radius:11px; font-size:14px; font-weight:700; font-family:inherit; cursor:pointer; transition:all .2s; }
  .cf-btn:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(37,99,235,.4); }
  .cf-btn:disabled { opacity:.5; cursor:default; transform:none; }
  .cf-pending { background:rgba(74,222,128,.08); border:1px solid rgba(74,222,128,.2); border-radius:10px; padding:12px 16px; font-size:13px; color:#4ade80; display:none; margin-top:12px; }
  @media(max-width:600px){ .cf-row { grid-template-columns:1fr; } }

  /* Related articles */
  .related { margin-top:72px; padding-top:48px; border-top:1px solid var(--border); }
  .related h3 { font-size:20px; font-weight:800; margin-bottom:28px; }
  .related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .related-card { background:var(--card-bg); border:1px solid var(--border); border-radius:16px; padding:22px; cursor:pointer; transition:all .25s; backdrop-filter:blur(20px); }
  .related-card:hover { border-color:rgba(96,165,250,.3); transform:translateY(-3px); }
  .related-card .cover-tag { position:static; display:inline-flex; margin-bottom:12px; font-size:10px; }
  .related-card h4 { font-size:14.5px; font-weight:700; line-height:1.35; margin-bottom:8px; }
  .related-card p { font-size:12.5px; color:var(--muted); line-height:1.55; }

  /* ===== FOOTER ===== */
  footer { background:var(--bg2); border-top:1px solid var(--border); padding:64px 48px 40px; }
  .footer-grid { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; margin-bottom:48px; }
  .footer-brand p { font-size:13.5px; color:var(--muted); line-height:1.7; max-width:270px; margin-top:14px; }
  .footer-socials { display:flex; gap:10px; margin-top:20px; flex-wrap:wrap; }
  .footer-socials a { color:var(--muted); text-decoration:none; font-size:13px; font-weight:500; transition:color .2s; }
  .footer-socials a:hover { color:var(--white); }
  .footer-sep { color:rgba(255,255,255,.15); }
  .footer-col h4 { font-size:12px; font-weight:700; color:var(--white); text-transform:uppercase; letter-spacing:.7px; margin-bottom:18px; }
  .footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
  .footer-col ul a { color:var(--muted); text-decoration:none; font-size:13.5px; transition:color .2s; }
  .footer-col ul a:hover { color:var(--white); }
  .footer-bottom { max-width:1100px; margin:0 auto; border-top:1px solid var(--border); padding-top:24px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; }
  .footer-bottom p { font-size:12.5px; color:var(--muted); }
  .footer-badges { display:flex; gap:8px; flex-wrap:wrap; }
  .f-badge { background:rgba(37,99,235,.1); border:1px solid rgba(37,99,235,.2); border-radius:7px; padding:5px 11px; font-size:10.5px; font-weight:700; color:var(--blue-light); }
  .footer-legal { max-width:1100px; margin:16px auto 0; font-size:11px; color:rgba(255,255,255,.25); line-height:1.6; }

  /* ===== GUIDE COVER ===== */
  .cover-guide { background:linear-gradient(135deg,#0a1628 0%,#0c4a6e 50%,#0284c7 100%); }
  .tag-guide { background:rgba(2,132,199,.25); border:1px solid rgba(125,211,252,.35); color:#7dd3fc; }

  /* ===== FEATURED CARD ===== */
  .blog-card.featured { grid-column:span 2; flex-direction:row; }
  .blog-card.featured .blog-card-cover { width:44%; flex-shrink:0; height:auto; min-height:260px; }
  .blog-card.featured .blog-card-body { padding:36px 44px; justify-content:center; }
  .blog-card.featured h2 { font-size:24px; }
  @media (max-width:1024px) {
   .blog-card.featured { grid-column:span 1 !important; flex-direction:column; }
   .blog-card.featured .blog-card-cover { width:100%; height:200px; }
   .blog-card.featured .blog-card-body { padding:28px; }
  }

  /* ===== REVEAL ===== */
  .reveal { opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
  .reveal.visible { opacity:1; transform:translateY(0); }
  .d1{transition-delay:.1s!important} .d2{transition-delay:.2s!important} .d3{transition-delay:.3s!important} .d4{transition-delay:.4s!important}

  /* ===== RESPONSIVE ===== */
  @media (max-width:1024px) { .blog-grid { grid-template-columns:1fr; } .stat-box-grid { grid-template-columns:1fr 1fr; } .related-grid { grid-template-columns:1fr 1fr; } .footer-grid { grid-template-columns:1fr 1fr; gap:36px; } }
  @media (max-width:768px) {
   nav { padding:16px 20px; } nav.scrolled { padding:12px 20px; }
   nav ul { display:none; } .hamburger { display:flex; }
   .section { padding:60px 20px; } .hero { padding:110px 20px 56px; }
   .stat-box-grid, .stat-box-2 { grid-template-columns:1fr 1fr; }
   .related-grid { grid-template-columns:1fr; }
   .article-cta { padding:32px 24px; }
   .article-cta-btns { flex-direction:column; align-items:stretch; }
   .article-cta-btns a { justify-content:center; }
   footer { padding:48px 20px 32px; }
   .footer-grid { grid-template-columns:1fr; gap:28px; }
   .footer-bottom { flex-direction:column; align-items:flex-start; }
  }

  /* ── MODERN + THEME ── */
  :root{--ease:cubic-bezier(.22,1,.36,1);--grad-brand:linear-gradient(120deg,#2563eb,#60a5fa);--border-hover:rgba(96,165,250,.38);--glow:0 0 40px -8px rgba(96,165,250,.35)}
  html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
  .btn-primary{background:var(--grad-brand);background-size:160% auto;border-radius:14px;box-shadow:0 8px 24px -6px rgba(47,107,255,.55);transition:background-position .5s var(--ease),transform .22s var(--ease),box-shadow .22s var(--ease)}
  .btn-primary:hover{background-position:right center;transform:translateY(-2px)}
  .nav-cta{background:var(--grad-brand)!important;background-size:160% auto!important;border-radius:11px}
  .filter-btn.active,.filter-btn:hover{background:var(--grad-brand)!important;border-color:transparent!important}
  .blog-card{border-radius:24px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
  .blog-card:hover{border-color:var(--border-hover)!important;box-shadow:0 36px 70px -30px rgba(0,0,0,.8),var(--glow)!important}
  nav.scrolled{background:rgba(10,14,31,.62);backdrop-filter:blur(28px) saturate(160%);-webkit-backdrop-filter:blur(28px) saturate(160%)}
  .theme-toggle{width:40px;height:40px;border-radius:50%;border:1px solid var(--border);background:var(--card-bg);color:var(--white);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s var(--ease);backdrop-filter:blur(10px)}
  .theme-toggle:hover{border-color:var(--border-hover);box-shadow:var(--glow)}
  .theme-toggle svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .theme-toggle .ico-moon{display:none}
  .nav-mobile .theme-toggle{width:auto;height:auto;border-radius:14px;padding:12px 22px;gap:10px;font-size:16px;font-weight:700}
  .lang-switch{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 11px;border:1px solid var(--border);border-radius:100px;font-size:12px;font-weight:800;letter-spacing:.5px;color:var(--muted);text-decoration:none;transition:all .25s var(--ease)}
  .lang-switch:hover{color:var(--white);border-color:var(--border-hover);box-shadow:var(--glow)}
  .nav-mobile .lang-switch{height:auto;border-radius:14px;padding:12px 22px;font-size:16px}
  .footer-controls{display:inline-flex;align-items:center;gap:10px;font-family:'IBM Plex Sans',sans-serif}

  /* ── LIGHT THEME ── */
  [data-theme="light"]{--gold:#ffe5a5;--blue-light:#2563eb;--bg:#d2e4fc;--bg2:#dceafd;--white:#0b1124;--muted:rgba(11,17,36,.62);--card-bg:rgba(255,255,255,.78);--border:rgba(11,17,36,.10);--border-hover:rgba(47,107,255,.4);--glow:0 0 40px -10px rgba(47,107,255,.28)}
  [data-theme="light"] body{color:var(--white)}
  [data-theme="light"] nav.scrolled{background:rgba(255,255,255,.7);border-bottom-color:var(--border)}
  [data-theme="light"] .nav-mobile{background:rgba(245,248,254,.97)}
  [data-theme="light"] .btn-primary,[data-theme="light"] .nav-cta{color:#fff!important}
  [data-theme="light"] .filter-btn.active,[data-theme="light"] .filter-btn:hover{color:#fff!important}
  [data-theme="light"] .meta-sep{background:rgba(11,17,36,.2)}
  [data-theme="light"] .theme-toggle .ico-sun{display:none}
  [data-theme="light"] .theme-toggle .ico-moon{display:block}
  [data-theme="light"] .article-body p{color:rgba(11,17,36,.78)}
  [data-theme="light"] .article-body ul li,[data-theme="light"] .article-body ol li{color:rgba(11,17,36,.72)}
  [data-theme="light"] .article-body h2,[data-theme="light"] .article-body h3{color:rgba(11,17,36,.95)}
  /* ── YOUTUBE SECTION ── */
  .blog-yt-section{padding:72px 48px;position:relative;overflow:hidden}
  .blog-yt-section::before{content:'';position:absolute;top:-60px;left:50%;transform:translateX(-50%);width:800px;height:280px;background:radial-gradient(ellipse,rgba(255,0,0,.07) 0%,transparent 68%);pointer-events:none}
  .blog-yt-wrap{max-width:1100px;margin:0 auto}
  .blog-yt-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:30px}
  .blog-yt-title-group{display:flex;align-items:center;gap:12px}
  .blog-yt-logo{width:44px;height:31px;background:#ff0000;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 16px rgba(255,0,0,.4)}
  .blog-yt-logo svg{width:20px;height:20px}
  .blog-yt-title{font-size:20px;font-weight:800;letter-spacing:-.4px}
  .blog-yt-sub{font-size:12px;color:var(--muted);margin-top:2px}
  .blog-yt-cta{display:inline-flex;align-items:center;gap:7px;background:#ff0000;color:#fff;text-decoration:none;padding:10px 20px;border-radius:9px;font-size:13px;font-weight:700;transition:all .2s;box-shadow:0 4px 16px rgba(255,0,0,.25)}
  .blog-yt-cta:hover{background:#cc0000;transform:translateY(-1px);box-shadow:0 8px 24px rgba(255,0,0,.42)}
  .blog-yt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .byc{border-radius:14px;overflow:hidden;background:rgba(20,5,5,.8);border:1px solid rgba(255,0,0,.11);cursor:pointer;transition:transform .3s,box-shadow .3s,border-color .3s;position:relative}
  .byc:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 16px 44px rgba(255,0,0,.24);border-color:rgba(255,0,0,.34)}
  .byc-thumb{position:relative;aspect-ratio:9/16;overflow:hidden;background:#0f0000}
  .byc-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s,opacity .3s;opacity:.88}
  .byc:hover .byc-thumb img{transform:scale(1.06);opacity:1}
  .byc-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.22);transition:background .25s}
  .byc:hover .byc-play{background:rgba(0,0,0,.06)}
  .byc-play-btn{width:50px;height:50px;background:rgba(255,0,0,.92);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .25s,box-shadow .25s;box-shadow:0 4px 20px rgba(0,0,0,.5),0 0 0 4px rgba(255,255,255,.12)}
  .byc:hover .byc-play-btn{transform:scale(1.14);box-shadow:0 8px 32px rgba(255,0,0,.62),0 0 0 5px rgba(255,255,255,.18)}
  .byc-shorts-badge{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.7);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);color:#fff;font-size:9px;font-weight:800;letter-spacing:.6px;padding:4px 8px;border-radius:20px;text-transform:uppercase;z-index:2;border:1px solid rgba(255,255,255,.16)}
  .byc-info{padding:10px 12px 12px}
  .byc-title{font-size:12.5px;font-weight:700;line-height:1.4;color:var(--white);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .byc-shimmer{animation:byc-shimmer 1.5s infinite linear;background:linear-gradient(90deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.09) 50%,rgba(255,255,255,.04) 100%);background-size:200% 100%}
  @keyframes byc-shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
  .blog-yt-rgpd{text-align:center;font-size:11.5px;color:var(--muted);margin-top:12px}
  @media(max-width:768px){.blog-yt-section{padding:52px 20px}}
  @media(max-width:640px){.blog-yt-grid{grid-template-columns:repeat(2,1fr)}}

  /* ════════ LIGHT MODE REFONTE, cartes navy + texte fonce sur fond clair ════════ */
  /* 1. Boutons primaires DORES + lueur (nuit ET jour) */
  .btn-primary,.cf-btn{background:linear-gradient(135deg,#ffe9bd,#ffce5e)!important;background-size:160% auto!important;color:#0a0e1f!important;border:none!important;box-shadow:0 6px 26px rgba(255,185,50,.5),inset 0 1px 0 rgba(255,255,255,.4)!important;font-weight:800!important}
  [data-theme="light"] .btn-primary,[data-theme="light"] .cf-btn{color:#0a0e1f!important}
  @media(hover:hover){
   .btn-primary:hover,.cf-btn:hover{background:linear-gradient(135deg,#fff2d0,#ffda7a)!important;background-position:right center!important;box-shadow:0 8px 30px rgba(255,190,60,.7),0 0 22px rgba(255,206,94,.55),inset 0 1px 0 rgba(255,255,255,.35)!important;transform:translateY(-2px)!important}
  }

  /* 2. Texte de section directement sur le fond clair → fonce */
  [data-theme="light"] .hero h1{color:#0b1124}
  [data-theme="light"] .hero h1 em{background:linear-gradient(120deg,#ffe9bd,#ffce5e 48%,#ffe9bd);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  [data-theme="light"] .hero p,[data-theme="light"] .s-sub,[data-theme="light"] .blog-yt-sub,[data-theme="light"] .blog-yt-rgpd{color:rgba(11,17,36,.66)}
  [data-theme="light"] .s-title,[data-theme="light"] .blog-yt-title{color:#0b1124}

  /* 3. CARTES / ZONES navy + texte blanc */
  [data-theme="light"] .blog-card,
  [data-theme="light"] .related-card,
  [data-theme="light"] .stat-box,
  [data-theme="light"] .comment-item,
  [data-theme="light"] .comment-form,
  [data-theme="light"] .article-cta{
   --white:#ffffff;--muted:rgba(255,255,255,.62);--card-bg:#151c3a;--border:rgba(96,165,250,.18);
   background:linear-gradient(150deg,#161d3c,#10162e)!important;
   border:1px solid rgba(96,165,250,.18)!important;
   color:#fff!important;
  }
  [data-theme="light"] .blog-card :where(h1,h2,h3,h4,p,span,li,div,strong),
  [data-theme="light"] .related-card :where(h1,h2,h3,h4,p,span,li,div,strong),
  [data-theme="light"] .stat-box :where(h1,h2,h3,h4,p,span,li,div,strong),
  [data-theme="light"] .comment-item :where(h1,h2,h3,h4,p,span,li,div,strong),
  [data-theme="light"] .comment-form :where(h1,h2,h3,h4,label,p,span,li,div,strong),
  [data-theme="light"] .article-cta :where(h1,h2,h3,h4,p,span,li,div,strong){color:#fff}
  /* libelles attenues + accents preserves */
  [data-theme="light"] .blog-card .meta-date,
  [data-theme="light"] .blog-card .meta-read,
  [data-theme="light"] .blog-card p,
  [data-theme="light"] .related-card p,
  [data-theme="light"] .comment-date,
  [data-theme="light"] .comment-text,
  [data-theme="light"] .stat-box-lbl,
  [data-theme="light"] .article-cta p{color:rgba(255,255,255,.6)!important}
  [data-theme="light"] .stat-box-val{color:#ffe5a5!important}
  [data-theme="light"] .article-cta h3 em{background:linear-gradient(120deg,#ffe9bd,#ffce5e 48%,#ffe9bd)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
  [data-theme="light"] .card-read-btn{color:#60a5fa!important}
  [data-theme="light"] .comment-form .cf-field label{color:rgba(255,255,255,.5)!important}
  [data-theme="light"] .comment-form .cf-field input,
  [data-theme="light"] .comment-form .cf-field textarea{background:rgba(10,14,31,.55);border-color:rgba(96,165,250,.25);color:#fff}

  /* callout / encart : reste sur fond bleute fonce, texte clair */
  [data-theme="light"] .callout{background:rgba(37,99,235,.12);border-left-color:#60a5fa}
  [data-theme="light"] .callout p{color:#0b1124}
  /* table comparative sur fond clair : texte fonce lisible */
  [data-theme="light"] .compare-table th{color:rgba(11,17,36,.6)}
  [data-theme="light"] .compare-table td{color:rgba(11,17,36,.8)}
  [data-theme="light"] .compare-table td:first-child{color:#0b1124}

  /* YouTube cards (.byc) restent navy/rouge sombre dans les deux modes : titre blanc */
  [data-theme="light"] .byc-title{color:#fff}
  /* ════════ FIN LIGHT MODE REFONTE ════════ */
 
.vc-ico{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:linear-gradient(145deg,rgba(96,165,250,.34),rgba(37,99,235,.2));border:1px solid rgba(125,185,255,.5);color:#aed4ff;box-shadow:0 6px 16px -6px rgba(37,99,235,.55),inset 0 1px 0 rgba(255,255,255,.14);flex-shrink:0;margin-bottom:14px}
.vc-ico svg{width:22px;height:22px}
.vc-ico.gold{background:linear-gradient(145deg,rgba(255,229,165,.32),rgba(255,193,80,.16));border-color:rgba(255,229,165,.55);color:#ffe1a0;box-shadow:0 6px 16px -6px rgba(255,190,70,.5),inset 0 1px 0 rgba(255,255,255,.16)}
.vc-ico.deep{background:linear-gradient(145deg,rgba(37,99,235,.2),rgba(37,99,235,.1));border-color:rgba(37,99,235,.5);color:#2563eb;box-shadow:0 6px 16px -6px rgba(37,99,235,.4)}
.vc-ico.sm{width:36px;height:36px;border-radius:10px;margin-bottom:10px}
.vc-ico.sm svg{width:18px;height:18px}
.vc-ico.inline{margin-bottom:0;align-self:flex-start}
/* SYSTEME D'ICONES CHARTEES */