/* =========================================================================
   VIGIE — Design system (effractions.com)
   DA « vigilance nocturne » : navy profond + signal ambré.
   Préfixe composants : .vg-   |   Contenu d'article : .prose
   ========================================================================= */

/* ----- 1. Tokens ----- */
:root{
  --ink:#0A0E1A; --ink-2:#0E1426; --ink-3:#16213D; --steel:#1E2A47;
  --line-dark:rgba(255,255,255,.10); --line-dark-2:rgba(255,255,255,.06);
  --paper:#F6F8FB; --white:#FFFFFF; --text:#10151F; --muted:#5A6573;
  --line:#E6E9EE; --signal:#FFB020; --signal-deep:#F59E0B; --signal-soft:#FFF3DA;
  --safe:#12B886; --safe-soft:#E7F8F1; --danger:#E5484D; --danger-soft:#FCEBEC;
  --radius:16px; --radius-lg:22px;
  --shadow:0 18px 50px -20px rgba(8,15,35,.30);
  --shadow-soft:0 10px 30px -16px rgba(8,15,35,.20);
  --font-display:'Archivo',sans-serif; --font-body:'Hanken Grotesk',sans-serif;
}

/* ----- 2. Base ----- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-body);color:var(--text);background:var(--white);
  line-height:1.7;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:clip}
h1,h2,h3,h4,h5{font-family:var(--font-display);line-height:1.1;letter-spacing:-.02em;margin:0 0 .6em}
h1{font-weight:900}h2,h3{font-weight:800}
img{max-width:100%;height:auto;display:block}
a{color:var(--signal-deep)}
.vg-wrap{width:min(1180px,92%);margin-left:auto;margin-right:auto}
.vg-eyebrow{font-family:var(--font-display);font-weight:700;font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--signal-deep)}
.vg-tick{display:inline-flex;align-items:center;gap:.5rem;font-weight:500;font-size:.94rem}
.vg-tick::before{content:"";flex:none;width:18px;height:18px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2312B886' stroke-width='2.6'%3E%3Cpath d='m5 13 4 4L19 7'/%3E%3C/svg%3E") center/contain no-repeat}

/* ----- 3. Boutons ----- */
.vg-btn,.wp-block-button__link{display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-display);font-weight:700;border:none;cursor:pointer;
  border-radius:12px;padding:.95rem 1.4rem;font-size:.98rem;text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.vg-btn-signal,.wp-block-button__link{background:linear-gradient(135deg,#F7950D,#E06A00);color:#fff;
  text-shadow:0 1px 1px rgba(70,28,0,.28);box-shadow:0 10px 24px -8px rgba(224,106,0,.55)}
.vg-btn-signal:hover,.wp-block-button__link:hover{transform:translateY(-2px);
  box-shadow:0 16px 30px -10px rgba(224,106,0,.7);color:#fff}
.vg-btn-ghost-dark,.is-style-ghost-dark .wp-block-button__link{background:transparent;
  color:#fff;border:1px solid var(--line-dark);box-shadow:none}
.vg-btn-ghost-dark:hover,.is-style-ghost-dark .wp-block-button__link:hover{background:rgba(255,255,255,.07)}
.vg-btn-ghost-light,.is-style-ghost-light .wp-block-button__link{background:transparent;
  color:var(--text);border:1.5px solid var(--line);box-shadow:none}
.vg-btn-ghost-light:hover,.is-style-ghost-light .wp-block-button__link:hover{border-color:var(--signal-deep);color:var(--signal-deep)}
.vg-btn-navy,.is-style-navy .wp-block-button__link{background:var(--ink-3);color:#fff;box-shadow:var(--shadow-soft)}
.vg-btn-navy:hover,.is-style-navy .wp-block-button__link:hover{background:var(--steel);color:#fff}

/* ----- 4. Header ----- */
.vg-topbar{background:var(--ink);color:#9FAAC0;font-size:.76rem;border-bottom:1px solid var(--line-dark-2)}
.vg-topbar .vg-wrap{display:flex;justify-content:space-between;align-items:center;padding:.4rem 0;gap:1rem}
.vg-topbar a{color:#C7CFDE;text-decoration:none}
.vg-header{position:sticky;top:0;z-index:60;background:rgba(10,14,26,.88);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line-dark)}
.vg-nav{display:flex;align-items:center;justify-content:space-between;padding:.85rem 0;color:#fff;gap:1.4rem}
.vg-brand{display:flex;align-items:center;gap:.65rem;font-family:var(--font-display);
  font-weight:900;font-size:1.18rem;letter-spacing:-.01em;color:#fff;text-decoration:none}
.vg-brand small{display:block;font-family:var(--font-body);font-weight:500;font-size:.62rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--signal);margin-top:1px}
.vg-menu{display:flex;align-items:center;gap:1.5rem;list-style:none;margin:0;padding:0}
.vg-menu a{color:#C7CFDE;text-decoration:none;font-weight:600;font-size:.92rem;transition:color .15s}
.vg-menu a:hover,.vg-menu .current-menu-item a{color:#fff}
.vg-nav-cta{flex:none}
.vg-progress{position:absolute;left:0;bottom:-1px;height:3px;width:0;
  background:linear-gradient(90deg,var(--signal),var(--signal-deep));transition:width .1s linear}
.vg-burger{display:none;width:42px;height:42px;border:1px solid var(--line-dark);border-radius:10px;
  background:transparent;cursor:pointer;padding:0;flex:none;place-items:center}
.vg-burger span{display:block;width:18px;height:2px;background:#fff;border-radius:2px;margin:2.5px auto;transition:.25s}
.vg-nav-open .vg-burger span:nth-child(1){transform:translateY(4.5px) rotate(45deg)}
.vg-nav-open .vg-burger span:nth-child(2){opacity:0}
.vg-nav-open .vg-burger span:nth-child(3){transform:translateY(-4.5px) rotate(-45deg)}
@media(max-width:860px){
  .vg-burger{display:grid}
  .vg-menu{display:none;position:fixed;top:0;left:0;right:0;margin-top:var(--vg-header-h,64px);
    background:var(--ink);border-bottom:1px solid var(--line-dark);flex-direction:column;
    gap:0;padding:.6rem 4%;z-index:55;max-height:calc(100vh - 64px);overflow:auto}
  .vg-nav-open .vg-menu{display:flex}
  .vg-menu li{border-bottom:1px solid var(--line-dark-2)}
  .vg-menu li:last-child{border-bottom:none}
  .vg-menu a{display:block;padding:.9rem .2rem;font-size:1rem}
}

/* ----- 5. Hero (fond sombre, radar, grille) ----- */
.vg-dark{position:relative;color:#fff;background:
  radial-gradient(900px 480px at 88% -8%, rgba(255,176,32,.22), transparent 60%),
  radial-gradient(700px 500px at 6% 110%, rgba(30,103,255,.14), transparent 55%),
  linear-gradient(180deg,var(--ink) 0%, var(--ink-2) 60%, #0C1426 100%);overflow:hidden}
.vg-dark::before{content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:linear-gradient(var(--line-dark-2) 1px,transparent 1px),
                   linear-gradient(90deg,var(--line-dark-2) 1px,transparent 1px);
  background-size:54px 54px;mask-image:radial-gradient(circle at 70% 30%,#000,transparent 75%)}
.vg-dark::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E")}
.vg-dark>*{position:relative;z-index:2}
.vg-radar{position:absolute;top:-160px;right:-160px;width:560px;height:560px;pointer-events:none;opacity:.45;z-index:1}
.vg-radar span{position:absolute;inset:0;margin:auto;border-radius:50%;border:1px solid rgba(255,176,32,.18)}
.vg-radar span:nth-child(1){width:100%;height:100%}
.vg-radar span:nth-child(2){width:70%;height:70%}
.vg-radar span:nth-child(3){width:40%;height:40%;border-color:rgba(255,176,32,.35)}
.vg-radar i{position:absolute;top:50%;left:50%;width:10px;height:10px;border-radius:50%;
  background:var(--signal);transform:translate(-50%,-50%);
  box-shadow:0 0 0 0 rgba(255,176,32,.55);animation:vg-pulse 2.6s infinite}
@keyframes vg-pulse{0%{box-shadow:0 0 0 0 rgba(255,176,32,.5)}70%{box-shadow:0 0 0 38px rgba(255,176,32,0)}100%{box-shadow:0 0 0 0 rgba(255,176,32,0)}}
.vg-hero{padding:4rem 0 4.4rem}
.vg-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.vg-badge{display:inline-flex;align-items:center;gap:.55rem;background:rgba(255,255,255,.06);
  border:1px solid var(--line-dark);padding:.45rem .85rem;border-radius:999px;
  font-weight:600;font-size:.82rem;color:#D7DEEC}
.vg-badge b{color:var(--signal)}
.vg-hero h1{font-size:clamp(2.3rem,5vw,3.7rem);margin:1.1rem 0 0}
.vg-hero .vg-hl{color:var(--signal)}
.vg-hero .vg-sub{margin-top:1.1rem;font-size:1.12rem;color:#C7CFDE;max-width:34rem}
.vg-hero-ticks{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1.4rem;margin-top:1.6rem;max-width:34rem}
.vg-hero-ticks .vg-tick{color:#E7ECF5}
.vg-hero-actions{display:flex;gap:.8rem;margin-top:1.8rem;flex-wrap:wrap}

/* ----- 6. Trust bar ----- */
.vg-trustbar{background:var(--ink-3);color:#fff;border-top:1px solid var(--line-dark)}
.vg-trustbar .vg-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;padding:1.5rem 0}
.vg-tb{display:flex;align-items:center;gap:.8rem}
.vg-tb .vg-ic{width:42px;height:42px;flex:none;display:grid;place-items:center;border-radius:11px;
  background:rgba(255,176,32,.12);color:var(--signal);font-size:1.1rem}
.vg-tb b{font-family:var(--font-display);font-weight:800;font-size:.96rem;display:block}
.vg-tb small{font-size:.8rem;color:#9FAAC0}

/* ----- 7. Sections ----- */
.vg-block{padding:5rem 0}
.vg-paper{background:var(--paper)}
.vg-sec-head{max-width:42rem;margin-bottom:2.4rem}
.vg-sec-head.vg-center{margin-left:auto;margin-right:auto;text-align:center}
.vg-sec-head h2{font-size:clamp(1.9rem,3.6vw,2.7rem);margin:.6rem 0 .7rem}
.vg-sec-head p{color:var(--muted);font-size:1.05rem;margin:0}
.vg-dark .vg-sec-head p{color:#A9B4C8}
.vg-dark .vg-eyebrow{color:var(--signal)}

/* ----- 8. Ranking cards (affiliation) ----- */
.vg-rank-list{display:grid;gap:1.4rem;counter-reset:vg-rank;container-type:inline-size;container-name:vgrank}
.vg-rcard{position:relative;display:grid;grid-template-columns:200px 1fr 230px;gap:1.6rem;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1.7rem;box-shadow:var(--shadow-soft);transition:transform .2s,box-shadow .2s}
.vg-rcard:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.vg-rcard::before{counter-increment:vg-rank;content:counter(vg-rank);position:absolute;
  top:-16px;left:1.6rem;width:40px;height:40px;border-radius:12px;background:var(--ink);
  color:var(--signal);display:grid;place-items:center;font-family:var(--font-display);
  font-weight:900;font-size:1.15rem;box-shadow:var(--shadow-soft)}
.vg-rcard.vg-top{border:2px solid var(--signal);background:linear-gradient(180deg,#FFFDF7,#fff)}
.vg-rcard.vg-top::before{background:var(--signal);color:#1B1303}
.vg-rflag{position:absolute;top:-13px;right:1.6rem;background:var(--signal);color:#1B1303;
  font-family:var(--font-display);font-weight:800;font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;padding:.32rem .8rem;border-radius:999px}
.vg-rbrand{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.6rem;min-width:0}
.vg-rlogo{width:120px;height:54px;display:grid;place-items:center;background:var(--paper);
  border:1px solid var(--line);border-radius:12px;font-family:var(--font-display);
  font-weight:800;font-size:.9rem;color:var(--ink-3);padding:.4rem .7rem;text-align:center}
.vg-rscore{display:flex;align-items:baseline;gap:.3rem;font-family:var(--font-display)}
.vg-rscore b{font-size:2rem;font-weight:900;color:var(--text)}
.vg-rscore span{font-size:.85rem;color:var(--muted);font-weight:600}
.vg-rstars{color:var(--signal-deep);letter-spacing:1px;font-size:.95rem}
.vg-rbody{min-width:0}
.vg-rbody h3{font-size:1.25rem;margin:0 0 .4rem}
.vg-rbest{display:inline-flex;align-items:center;gap:.4rem;background:var(--safe-soft);color:#0B7B61;
  font-weight:700;font-size:.78rem;padding:.3rem .7rem;border-radius:999px;margin-bottom:.6rem}
.vg-rpoints{list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.4rem}
.vg-rpoints li{position:relative;padding-left:1.55rem;font-size:.92rem;color:#39414F}
.vg-rpoints li::before{content:"";position:absolute;left:0;top:.32em;width:15px;height:15px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2312B886' stroke-width='2.6'%3E%3Cpath d='m5 13 4 4L19 7'/%3E%3C/svg%3E") center/contain no-repeat}
.vg-subscores{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1.1rem;margin-top:.9rem}
.vg-subscore{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:.5rem;font-size:.78rem;color:var(--muted)}
.vg-subscore b{color:var(--text);font-weight:700}
.vg-bar{grid-column:1 / -1;display:block;width:100%;height:7px;background:#EEF1F6;border-radius:999px;overflow:hidden;margin-top:.15rem}
.vg-bar i{display:block;height:7px;width:var(--w,80%);border-radius:999px;
  background:linear-gradient(90deg,var(--signal),var(--signal-deep))}
.vg-roffer{display:flex;flex-direction:column;justify-content:center;gap:.7rem;
  border-left:1px dashed var(--line);padding-left:1.6rem;min-width:0}
.vg-rprice small{display:block;font-size:.74rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.vg-rprice b{font-family:var(--font-display);font-weight:900;font-size:1.5rem}
.vg-rprice b span{font-size:.85rem;font-weight:600;color:var(--muted)}
.vg-roffer .vg-btn{justify-content:center}
.vg-rnote{font-size:.72rem;color:var(--muted);text-align:center}

/* Section texte SEO (home) */
.vg-home-seo .prose{max-width:46rem;margin:0 auto}
.vg-home-seo .prose>h2:first-child{margin-top:0}
.vg-rlabel{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:600}

/* ----- 9. Tableau comparatif ----- */
.vg-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-soft);background:#fff}
.vg-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:640px}
.vg-table th{background:var(--ink);color:#fff;font-family:var(--font-display);font-weight:700;
  font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;padding:.9rem 1rem;text-align:left}
.vg-table th:first-child{border-radius:0}
.vg-table td{padding:.85rem 1rem;border-top:1px solid var(--line);vertical-align:middle}
.vg-table tr:nth-child(even) td{background:#FAFBFD}
.vg-table .vg-col-top{background:var(--signal-soft)!important}
.vg-table .vg-yes{color:var(--safe);font-weight:700}
.vg-table .vg-no{color:var(--danger);font-weight:700}

/* ----- 10. CTA : bandeau, stripe, inline, box, verdict ----- */
.vg-cta-band{color:#fff;background:
  radial-gradient(700px 360px at 85% 120%, rgba(255,176,32,.2), transparent 60%),
  linear-gradient(135deg,var(--ink),#13203B)}
.vg-cta-band .vg-wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:3.2rem 0;flex-wrap:wrap}
.vg-cta-band h2{font-size:clamp(1.7rem,3vw,2.3rem);font-weight:900;max-width:30rem;margin:0}
.vg-cta-band p{color:#C7CFDE;margin:.6rem 0 0}

.vg-cta-stripe{display:flex;align-items:center;justify-content:space-between;gap:1.4rem;
  background:linear-gradient(135deg,var(--ink-2),var(--ink-3));color:#fff;
  border-radius:var(--radius);padding:1.4rem 1.7rem;margin:2.2rem 0;box-shadow:var(--shadow);flex-wrap:wrap}
.vg-cta-stripe .vg-cta-txt b{font-family:var(--font-display);font-weight:800;font-size:1.08rem;display:block}
.vg-cta-stripe .vg-cta-txt span{font-size:.86rem;color:#A9B4C8}
.vg-cta-stripe .vg-btn{flex:none}

.vg-cta-inline{display:inline-flex;align-items:center;gap:.45rem;font-weight:700;
  color:var(--signal-deep);text-decoration:none;border-bottom:2px solid rgba(245,158,11,.35);
  transition:border-color .15s}
.vg-cta-inline:hover{border-color:var(--signal-deep)}
.vg-cta-inline::after{content:"→"}

.vg-cta-box{display:grid;grid-template-columns:1fr auto;gap:1.4rem;align-items:center;
  background:var(--signal-soft);border:1.5px solid rgba(245,158,11,.4);
  border-radius:var(--radius);padding:1.5rem 1.7rem;margin:2.2rem 0}
.vg-cta-box h4{margin:0 0 .3rem;font-size:1.08rem}
.vg-cta-box p{margin:0;font-size:.92rem;color:#6B5A2E}

.vg-verdict{background:linear-gradient(150deg,var(--ink),var(--ink-2));color:#fff;
  border-radius:var(--radius-lg);padding:2.2rem;margin:2.6rem 0;box-shadow:var(--shadow);position:relative;overflow:hidden}
.vg-verdict::before{content:"";position:absolute;inset:0;opacity:.4;pointer-events:none;
  background-image:linear-gradient(var(--line-dark-2) 1px,transparent 1px),
  linear-gradient(90deg,var(--line-dark-2) 1px,transparent 1px);background-size:42px 42px}
.vg-verdict>*{position:relative}
.vg-verdict .vg-eyebrow{color:var(--signal)}
.vg-verdict h3{color:#fff;font-size:1.45rem;margin:.5rem 0 .6rem}
.vg-verdict p{color:#C7CFDE;margin:0 0 1.2rem}
.vg-verdict .vg-vscore{position:absolute;top:1.8rem;right:1.8rem;width:74px;height:74px;
  border-radius:50%;background:var(--signal);color:#1B1303;display:grid;place-items:center;
  font-family:var(--font-display);font-weight:900;font-size:1.3rem;
  box-shadow:0 0 0 6px rgba(255,176,32,.2)}

/* ----- 11. Shell d'embed formulaire ----- */
.vg-quote{width:100%;max-width:560px;margin:0 auto;background:#fff;border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.55);color:var(--text)}
.vg-quote .vg-accent{height:4px;background:linear-gradient(90deg,var(--signal),var(--signal-deep))}
.vg-quote .vg-qhead{position:relative;padding:1.35rem 1.5rem 1.15rem;
  background:linear-gradient(180deg,#fff,#FBFCFE);border-bottom:1px solid var(--line)}
.vg-quote .vg-qeyebrow{display:inline-flex;align-items:center;gap:.45rem;
  font-family:var(--font-display);font-weight:800;font-size:.74rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--signal-deep);margin-bottom:.55rem}
.vg-quote .vg-qtitle{font-size:1.3rem;margin:0 0 .3rem}
.vg-quote .vg-qsub{margin:0;font-size:.9rem;color:var(--muted);line-height:1.5}
.vg-quote .vg-qpulse{position:absolute;top:1.5rem;right:1.5rem;width:11px;height:11px;border-radius:50%;
  background:var(--signal);box-shadow:0 0 0 0 rgba(255,176,32,.5);animation:vg-pulse 2.6s infinite}
.vg-quote .vg-qembed{position:relative;min-height:440px;padding:.5rem .6rem}
.vg-quote .vg-qembed::before{content:"Chargement du formulaire sécurisé…";position:absolute;inset:0;
  z-index:0;display:grid;place-items:center;color:#9AA6BC;font-size:.88rem}
.vg-quote .vg-qembed>div{position:relative;z-index:1;width:100%}
.vg-quote .vg-qembed iframe{width:100%!important;display:block;border:0}
.vg-quote .vg-qfoot{display:flex;align-items:center;gap:.45rem;justify-content:center;
  padding:.85rem 1.5rem 1.1rem;border-top:1px solid var(--line);font-size:.76rem;
  color:var(--muted);font-weight:500;background:#fff}

/* ----- 12. Article ----- */
.vg-breadcrumb{font-size:.8rem;color:#9FAAC0;display:flex;gap:.45rem;flex-wrap:wrap;padding:1.1rem 0 0}
.vg-breadcrumb a{color:#C7CFDE;text-decoration:none}
.vg-article-head{padding:1.6rem 0 2.4rem}
.vg-article-head h1{font-size:clamp(1.9rem,4vw,2.9rem);max-width:48rem}
.vg-article-meta{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;color:#9FAAC0;font-size:.84rem;margin-top:1rem}
.vg-article-meta .vg-dot{width:4px;height:4px;border-radius:50%;background:#3A4564}
.vg-alayout{display:grid;grid-template-columns:230px minmax(0,1fr) 300px;gap:2.8rem;padding:2.8rem 0 4.5rem;align-items:start}
.vg-alayout.vg-no-toc{grid-template-columns:minmax(0,1fr) 300px}
.vg-alayout .prose{max-width:none}
.vg-asidebar{position:sticky;top:90px;align-self:start}
.vg-asticky{display:grid;gap:1.3rem}
.vg-tocside{position:sticky;top:90px;align-self:start;font-size:.86rem;padding-top:.2rem}
.vg-tocside .vg-eyebrow{display:block;margin-bottom:.8rem;color:var(--muted);letter-spacing:.18em}

.prose{font-size:1.04rem;color:#1C232E;max-width:46rem}
.prose>*+*{margin-top:1.15em}
.prose h2{font-size:1.7rem;margin-top:2.2em;scroll-margin-top:90px}
.prose h3{font-size:1.25rem;margin-top:1.8em}
.prose strong{color:var(--text)}
.prose a{color:var(--signal-deep);text-decoration:underline;text-decoration-color:rgba(245,158,11,.35);text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--signal-deep)}
.prose img{border-radius:var(--radius)}
.prose figure{margin:2rem 0}
.prose figcaption{font-size:.82rem;color:var(--muted);margin-top:.6rem;text-align:center}
.prose blockquote{margin:2.2rem 0;padding:1.4rem 1.7rem;border-left:4px solid var(--signal);
  background:var(--paper);border-radius:0 var(--radius) var(--radius) 0;
  font-family:var(--font-display);font-weight:600;font-size:1.15rem;color:var(--ink-3);font-style:normal}
.prose blockquote cite{display:block;margin-top:.6rem;font-family:var(--font-body);
  font-weight:500;font-size:.82rem;color:var(--muted);font-style:normal}
.prose table{width:100%;border-collapse:collapse;font-size:.92rem}
.prose table th{background:var(--ink);color:#fff;padding:.7rem .9rem;text-align:left;
  font-family:var(--font-display);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}
.prose table td{padding:.7rem .9rem;border-top:1px solid var(--line)}
.prose table tr:nth-child(even) td{background:#FAFBFD}

/* Boutons placés dans le contenu d'article : neutraliser le style des liens .prose a */
.prose a.vg-btn,.prose .wp-block-button__link{text-decoration:none}
.prose a.vg-btn-signal,.prose .wp-block-button__link,.prose a.vg-btn-navy{color:#fff}
.prose a.vg-btn-ghost-light{color:var(--text)}
.prose a.vg-btn-ghost-dark{color:#fff}

/* TL;DR */
.vg-tldr{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--signal);
  border-radius:var(--radius);padding:1.4rem 1.6rem;margin:2rem 0}
.vg-tldr h4{display:flex;align-items:center;gap:.5rem;margin:0 0 .8rem;font-size:.92rem;
  text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3)}
.vg-tldr ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.vg-tldr li{position:relative;padding-left:1.55rem;font-size:.95rem}
.vg-tldr li::before{content:"";position:absolute;left:0;top:.34em;width:14px;height:14px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F59E0B' stroke-width='3'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat}

/* Chiffres clés */
.vg-keyfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin:2.2rem 0}
.vg-kf{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.2rem 1.3rem;box-shadow:var(--shadow-soft)}
.vg-kf .vg-kf-num{font-family:var(--font-display);font-weight:900;font-size:1.9rem;line-height:1;color:var(--text)}
.vg-kf .vg-kf-num .vg-u{color:var(--signal-deep);font-size:1.1rem}
.vg-kf p{margin:.45rem 0 0;font-size:.82rem;color:var(--muted)}
.vg-kf.vg-kf-dark{background:linear-gradient(150deg,#181F33,#0F1626);border:none;color:#fff}
.vg-kf.vg-kf-dark .vg-kf-num{color:var(--signal)}
.vg-kf.vg-kf-dark p{color:#A9B4C8}

/* Callouts */
.vg-callout{display:grid;grid-template-columns:auto 1fr;gap:.9rem;border-radius:var(--radius);
  padding:1.2rem 1.4rem;margin:2rem 0;font-size:.97rem}
.vg-callout .vg-co-ic{width:36px;height:36px;flex:none;display:grid;place-items:center;
  border-radius:10px;font-size:1.05rem}
.vg-callout h5{margin:0 0 .25rem;font-size:.95rem}
.vg-callout p{margin:0;font-size:.93rem}
.vg-callout-info{background:#EEF4FF;border:1px solid #C9D9F8;color:#1F3A6E}
.vg-callout-info .vg-co-ic{background:#fff;color:#2D5BD1}
.vg-callout-alert{background:var(--danger-soft);border:1px solid #F3C2C4;color:#7C2629}
.vg-callout-alert .vg-co-ic{background:#fff;color:var(--danger)}
.vg-callout-tip{background:var(--safe-soft);border:1px solid #BCE7D7;color:#0B5C49}
.vg-callout-tip .vg-co-ic{background:#fff;color:var(--safe)}
.vg-callout-signal{background:var(--signal-soft);border:1px solid #F2DBA6;color:#6B4E0E}
.vg-callout-signal .vg-co-ic{background:#fff;color:var(--signal-deep)}

/* Définition */
.vg-def{border:1.5px dashed var(--line);border-radius:var(--radius);padding:1.3rem 1.5rem;margin:2rem 0;background:#FBFCFE}
.vg-def dt{font-family:var(--font-display);font-weight:800;color:var(--ink-3);margin-bottom:.3rem}
.vg-def dd{margin:0;font-size:.95rem;color:#39414F}

/* Étapes */
.vg-steps{counter-reset:vg-step;display:grid;gap:0;margin:2.2rem 0;list-style:none;padding:0}
.vg-steps li{position:relative;padding:0 0 1.6rem 3.4rem}
.vg-steps li::before{counter-increment:vg-step;content:counter(vg-step);position:absolute;left:0;top:0;
  width:38px;height:38px;border-radius:11px;background:var(--ink);color:var(--signal);
  display:grid;place-items:center;font-family:var(--font-display);font-weight:900;font-size:1.05rem}
.vg-steps li::after{content:"";position:absolute;left:18.5px;top:42px;bottom:4px;width:1.5px;
  background:var(--line)}
.vg-steps li:last-child{padding-bottom:0}
.vg-steps li:last-child::after{display:none}
.vg-steps b{font-family:var(--font-display);font-weight:800;display:block;margin-bottom:.2rem}
.vg-steps p{margin:0;font-size:.95rem;color:#39414F}

/* Check-list */
.vg-checklist{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.4rem 1.6rem;margin:2.2rem 0;box-shadow:var(--shadow-soft);list-style:none}
.vg-checklist li{position:relative;padding:.55rem 0 .55rem 2rem;
  border-bottom:1px dashed var(--line);font-size:.96rem;cursor:pointer}
.vg-checklist li:last-child{border-bottom:none}
.vg-checklist li::before{content:"";position:absolute;left:0;top:.5rem;width:20px;height:20px;
  border:2px solid var(--signal-deep);border-radius:6px;transition:.15s;
  background:#fff center/12px no-repeat}
.vg-checklist li.vg-done{color:var(--muted);text-decoration:line-through}
.vg-checklist li.vg-done::before{background-color:var(--signal);border-color:var(--signal);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B1303' stroke-width='3.2'%3E%3Cpath d='m5 13 4 4L19 7'/%3E%3C/svg%3E")}

/* FAQ */
.vg-faq-list{display:grid;gap:.7rem;margin:2.2rem 0}
.vg-faq{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.vg-faq summary{cursor:pointer;list-style:none;padding:1.1rem 1.3rem;font-family:var(--font-display);
  font-weight:700;font-size:1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.vg-faq summary::-webkit-details-marker{display:none}
.vg-faq summary .vg-pm{flex:none;width:26px;height:26px;border-radius:8px;background:var(--signal-soft);
  color:var(--signal-deep);display:grid;place-items:center;font-size:1.3rem;transition:.2s;line-height:1}
.vg-faq[open] summary .vg-pm{transform:rotate(45deg)}
.vg-faq .vg-ans{padding:0 1.3rem 1.2rem;color:var(--muted);font-size:.95rem}

/* Auteur */
.vg-author{display:flex;gap:1.1rem;align-items:center;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem 1.5rem;margin:2.6rem 0 0}
.vg-author .vg-av{width:56px;height:56px;border-radius:50%;background:var(--ink-3);color:var(--signal);
  display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:1.1rem;flex:none}
.vg-author b{font-family:var(--font-display);display:block}
.vg-author p{margin:.15rem 0 0;font-size:.86rem;color:var(--muted)}

/* ----- 13. Sidebar ----- */
.vg-side-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1.5rem;box-shadow:var(--shadow-soft)}
.vg-side-card.vg-side-top{border:2px solid var(--signal);background:linear-gradient(180deg,#FFFDF7,#fff)}
.vg-side-card .vg-eyebrow{display:block;margin-bottom:.7rem}
.vg-side-card h4{margin:0 0 .5rem;font-size:1.1rem}
.vg-side-card p{font-size:.88rem;color:var(--muted);margin:0 0 1rem}
.vg-side-card .vg-btn{width:100%;justify-content:center}
.vg-toc ol{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
.vg-toc a{color:var(--muted);text-decoration:none;display:block;line-height:1.45;
  padding:.42rem 0 .42rem .9rem;border-left:2px solid var(--line);transition:.15s}
.vg-toc a:hover{color:var(--text)}
.vg-toc a.vg-toc-active{border-left-color:var(--signal-deep);color:var(--text);font-weight:600}
.vg-toc-mobile{display:none;margin:0 0 1.6rem;border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.vg-toc-mobile summary{cursor:pointer;list-style:none;padding:1rem 1.2rem;font-family:var(--font-display);
  font-weight:700;font-size:.95rem;display:flex;justify-content:space-between;align-items:center}
.vg-toc-mobile summary::-webkit-details-marker{display:none}
.vg-toc-mobile .vg-toc{padding:0 1.2rem 1rem}

/* Carte promo sidebar (style partenaire) */
.vg-side-ticks{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.45rem}
.vg-side-ticks li{position:relative;padding-left:1.45rem;font-size:.85rem;color:#39414F}
.vg-side-ticks li::before{content:"";position:absolute;left:0;top:.34em;width:14px;height:14px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2312B886' stroke-width='2.8'%3E%3Cpath d='m5 13 4 4L19 7'/%3E%3C/svg%3E") center/contain no-repeat}
.vg-promo{border:1.5px dashed var(--signal-deep);border-radius:12px;background:var(--signal-soft);
  text-align:center;padding:.85rem 1rem;margin:0 0 1rem}
.vg-promo small{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#8a6a1c;font-weight:700}
.vg-promo b{display:block;font-family:var(--font-display);font-weight:900;font-size:1.15rem;letter-spacing:.14em;margin:.25rem 0}
.vg-promo span{display:block;font-size:.76rem;color:#6B5A2E;font-weight:600}

/* ----- 14. Grille blog ----- */
.vg-post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding:2.4rem 0 4rem}
.vg-pcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow-soft);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.vg-pcard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.vg-pcard .vg-pthumb{aspect-ratio:16/9;background:linear-gradient(150deg,var(--ink-2),var(--ink-3));overflow:hidden}
.vg-pcard .vg-pthumb img{width:100%;height:100%;object-fit:cover}
.vg-pcard .vg-pbody{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.vg-pcard h3{font-size:1.1rem;margin:0}
.vg-pcard h3 a{color:var(--text);text-decoration:none}
.vg-pcard h3 a:hover{color:var(--signal-deep)}
.vg-pcard .vg-pmeta{font-size:.76rem;color:var(--muted);margin-top:auto}

/* ----- 15. Footer + barre mobile ----- */
.vg-footer{background:var(--ink);color:#9FAAC0;padding:3rem 0 2rem;font-size:.88rem}
.vg-foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem;padding-bottom:2rem;
  border-bottom:1px solid var(--line-dark)}
.vg-footer .vg-brand{color:#fff;margin-bottom:.8rem}
.vg-footer h4{color:#fff;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;margin:0 0 .9rem}
.vg-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.vg-footer a{color:#9FAAC0;text-decoration:none}
.vg-footer a:hover{color:var(--signal)}
.vg-foot-bot{display:flex;align-items:center;justify-content:space-between;padding-top:1.4rem;
  flex-wrap:wrap;gap:.6rem;font-size:.78rem;color:#6B768C}
.vg-disclosure{background:#0C1120;border-top:1px solid var(--line-dark);color:#5A6379;
  font-size:.72rem;padding:.9rem 0;text-align:center;line-height:1.6}
.vg-mbar{position:fixed;bottom:0;left:0;right:0;z-index:70;display:none;gap:.6rem;
  background:rgba(10,14,26,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line-dark);
  padding:.6rem .8rem}
.vg-mbar .vg-btn{flex:1;justify-content:center;padding:.85rem;font-size:.95rem}

/* ----- 16. Reveal / count-up ----- */
.vg-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.vg-reveal.vg-in{opacity:1;transform:none}

/* ----- 16b. Container query : la carte de classement s'adapte à la largeur de SON emplacement
   (pleine largeur sur l'accueil = 3 colonnes ; colonne d'article étroite = empilée). ----- */
@container vgrank (max-width:640px){
  .vg-rcard{grid-template-columns:1fr}
  .vg-rbrand{flex-direction:row;align-items:center;justify-content:space-between;width:100%}
  .vg-roffer{border-left:none;border-top:1px dashed var(--line);padding-left:0;padding-top:1.2rem}
}
@container vgrank (max-width:380px){
  .vg-subscores{grid-template-columns:1fr}
}

/* ----- 17. Responsive ----- */
@media(max-width:980px){
  .vg-hero-grid{grid-template-columns:1fr;gap:2.2rem}
  .vg-trustbar .vg-wrap{grid-template-columns:1fr 1fr;gap:1.2rem}
  .vg-alayout{grid-template-columns:minmax(0,1fr) 300px}
  .vg-tocside{display:none}
  .vg-toc-mobile{display:block}
  .vg-post-grid{grid-template-columns:1fr 1fr}
  .vg-foot-top{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .vg-block{padding:3.4rem 0}
  .vg-hero{padding:2.6rem 0 3rem}
  .vg-hero-ticks{grid-template-columns:1fr}
  .vg-trustbar .vg-wrap,.vg-post-grid,.vg-foot-top,.vg-keyfacts{grid-template-columns:1fr}
  .vg-subscores{grid-template-columns:1fr}
  .vg-cta-box{grid-template-columns:1fr}
  .vg-alayout{grid-template-columns:1fr}
  .vg-asidebar{position:static}
  .vg-mbar{display:flex}
  body{padding-bottom:74px}
  .vg-verdict .vg-vscore{position:static;margin-bottom:1rem}
}

/* ----- 18. Compat éditeur Gutenberg ----- */
.editor-styles-wrapper .vg-dark{padding:1rem}
.editor-styles-wrapper .vg-reveal{opacity:1;transform:none}