/* QUALiBOX — Direction artistique v2 (partagée) — extraite de la page storyline */
/* ── V2 overrides ── */

/* Hero 2 colonnes */
.v2 .hero{ text-align:left; padding-bottom:0; }
.v2 .hero-inner{
  display:grid; grid-template-columns:1fr 1.06fr; gap:32px; align-items:center;
  max-width:1280px; text-align:left;
}
.v2 .hero-actions{ justify-content:flex-start; }
.v2 .hero-trust{ justify-content:flex-start; }
.v2 .hero-transition{ align-items:flex-start; padding-left:0; margin-top:50px; padding-bottom:32px; }

/* Hero visual right */
.v2 .hero-visual{
  position:relative; display:grid; place-items:center;
}
.v2 .hero-visual .halo{
  position:absolute; width:120%; height:108%; border-radius:50%;
  background:radial-gradient(circle at 50% 46%, rgba(250,252,255,.5), rgba(250,252,255,0) 64%);
  filter:blur(20px);
}
.v2 .qualiometre{
  position:relative; z-index:1; width:min(380px, 90%);
  filter:drop-shadow(0 36px 56px rgba(63,111,224,.30));
  animation:floatY 7s ease-in-out infinite;
}
.v2 .hero-chip{
  position:absolute; z-index:2; display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.92); border:1px solid var(--border); box-shadow:var(--shadow-md);
  border-radius:14px; padding:10px 14px; font-size:13px; font-weight:700; color:var(--navy);
  backdrop-filter:blur(6px);
}
.v2 .chip-a{ top:8%; left:-6%; animation:floatY 6s ease-in-out infinite .4s; }
.v2 .chip-b{ top:50%; right:-7%; animation:floatY 6.6s ease-in-out infinite .9s; }
.v2 .chip-ico{ width:24px; height:24px; border-radius:8px; display:grid; place-items:center; color:#fff; }
.v2 .chip-sub{ font-size:11px; color:var(--muted); font-weight:600; display:block; }
.v2 .hero h1{ font-size:clamp(38px, 5.4vw, 72px); max-width:none; }
.v2 .eyebrow{ margin-bottom:22px; }

/* Visuel panneau : halo doux, plus de disque */
.v2 .visual-disc{
  background:radial-gradient(circle at 50% 46%, color-mix(in srgb, var(--step,#5C8DFF) 20%, transparent) 0%, transparent 62%);
  border:none; box-shadow:none; filter:blur(10px); border-radius:50%;
}
.v2 .visual-ring{ display:none; }
.v2 .visual-img{ width:84%; position:relative; z-index:1; }

/* ─── Panneau Qualiomètre CSS ─── */
.qm-panel{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.qm-gauge-wrap{ display:flex; flex-direction:column; align-items:center; gap:12px; }
.qm-svg{ width:min(300px,80%); display:block; }
.qm-center{ text-align:center; }
.qm-score-big{ font-size:clamp(52px,7vw,88px); font-weight:800; letter-spacing:-.04em; color:var(--navy); }
.qm-over{ font-size:14px; font-weight:600; color:var(--muted); }
.qm-label{ font-size:clamp(15px,1.8vw,20px); font-weight:800; color:var(--green); margin-top:8px; }
.qm-caption{ font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#9AA3B2; margin-top:4px; }
.qm-text h3{ font-size:clamp(24px,2.8vw,36px); margin-bottom:14px; }
.qm-text p{ font-size:clamp(15px,1.3vw,17.5px); color:#4a5468; margin-bottom:22px; }
.qm-chips{ display:flex; flex-wrap:wrap; gap:10px; }
.qm-chip-item{ display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:700;
  padding:8px 14px; border-radius:999px; background:var(--blue-100); color:var(--blue-hover); }
.qm-chip-item.green{ background:#E7F8EF; color:#16A34A; }
.qm-chip-item.amber{ background:#FEF3DC; color:#B7791F; }
@media(max-width:760px){ .qm-panel{ grid-template-columns:1fr; } }

/* ─── Panneau 02 : visuel tableau de bord ─── */
.v2 .visual-img--dash{ width:104%; }

/* ─── Qualiomètre : texte à gauche, image à droite ─── */
.qm-panel .qm-img-wrap{ order:2; }
.qm-panel .qm-text{ order:1; }
@media(max-width:760px){ .qm-panel .qm-img-wrap{ order:0; } .qm-panel .qm-text{ order:1; } }

/* ─── Footer clair, aligné sur le menu ─── */
.site-footer{ background:#fff; color:var(--muted); border-top:1px solid var(--border); margin-top:0; }
.footer-inner{ grid-template-columns:1.5fr 1fr 1fr 1fr 1fr; }
.footer-brand img{ height:26px; }
.footer-meta{ margin-top:10px; font-size:12.5px; color:#9AA3B8; }
.footer-col h4{ color:var(--navy); }
.footer-col a{ color:var(--muted); }
.footer-col a:hover{ color:var(--blue-hover); }
.footer-bottom{ border-top:1px solid var(--border); color:#9AA3B8; }
.footer-bottom a{ color:inherit; text-decoration:underline; }
@media(max-width:880px){ .footer-inner{ grid-template-columns:1fr 1fr; } }

/* ─── Section offre v2 ─── */
.offer-v2{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.offer-pillar{
  border-radius:28px; padding:36px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-md); border:1px solid var(--border);
}
.offer-pillar.light{ background:#fff; }
.offer-pillar.dark{
  background:linear-gradient(165deg,#1E2A4A,#1B2541);
  color:#cdd6ee; border-color:transparent;
}
.offer-pillar .tag{ display:inline-flex; align-items:center; gap:7px; margin-bottom:20px;
  font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.offer-pillar.light .tag{ color:var(--blue-hover); }
.offer-pillar.dark  .tag{ color:#9fc0ff; }
.offer-pillar h3{ font-size:clamp(22px,2.2vw,28px); margin-bottom:12px; }
.offer-pillar.dark h3{ color:#fff; }
.offer-pillar p{ font-size:15px; margin-bottom:22px; }
.offer-feat-list{ list-style:none; display:flex; flex-direction:column; gap:11px; }
.offer-feat-list li{ display:flex; align-items:flex-start; gap:10px; font-size:14.5px; font-weight:600; }
.offer-pillar.dark .offer-feat-list li{ color:#aeb9d6; }
.offer-feat-list li::before{ content:""; flex-shrink:0; width:18px; height:18px; margin-top:2px; border-radius:50%;
  background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center/11px no-repeat; }
.offer-ia-badge{
  display:inline-flex; align-items:center; gap:8px; margin-top:20px;
  font-size:13px; font-weight:700; color:#fff;
  background:linear-gradient(120deg,rgba(92,141,255,.35),rgba(255,159,67,.22));
  border:1px solid rgba(255,255,255,.15); border-radius:999px; padding:8px 16px;
}
@media(max-width:860px){ .offer-v2{ grid-template-columns:1fr; } }

/* ─── Hero : fond blanc (sobre) ─── */
.v2 .hero{ background:#fff; }

/* ─── Notre approche : deux cartes (Logiciel + Accompagnement) ─── */
.approach-grid{ display:grid; grid-template-columns:1fr 1fr; gap:28px; max-width:1040px; margin:8px auto 0; }
.approach-card{ position:relative; display:flex; flex-direction:column; background:#fff;
  border:1px solid var(--border); border-radius:24px; padding:40px 36px 36px;
  box-shadow:var(--shadow-md); overflow:hidden; transition:transform .28s ease, box-shadow .28s ease; }
.approach-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); }
.approach-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:5px; }
.approach-card.saas::before{ background:linear-gradient(90deg,var(--blue),var(--blue-hover)); }
.approach-card.human::before{ background:linear-gradient(90deg,var(--orange),#F37B19); }
.approach-icon{ width:86px; height:86px; margin-bottom:22px; }
.approach-icon img{ width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 14px 22px rgba(63,111,224,.22)); }
.approach-card.human .approach-icon img{ filter:drop-shadow(0 14px 22px rgba(255,159,67,.26)); }
.approach-tag{ display:inline-flex; align-self:flex-start; align-items:center; font-size:11.5px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; padding:6px 13px; border-radius:999px; margin-bottom:16px; }
.approach-card.saas .approach-tag{ background:var(--blue-100); color:var(--blue-hover); }
.approach-card.human .approach-tag{ background:#FFF1E0; color:#C2691A; }
.approach-card h3{ font-size:clamp(20px,1.9vw,24px); letter-spacing:-.01em; margin-bottom:14px; color:var(--navy); }
.approach-card p{ font-size:15px; color:#4a5468; margin-bottom:24px; }
.approach-list{ list-style:none; display:flex; flex-direction:column; gap:12px; margin-bottom:30px; }
.approach-list li{ display:flex; align-items:flex-start; gap:11px; font-size:14.5px; font-weight:600; color:var(--navy); }
.approach-list .chk{ flex-shrink:0; width:20px; height:20px; border-radius:6px; display:grid; place-items:center; margin-top:1px; }
.approach-card.saas .approach-list .chk{ background:var(--blue-100); color:var(--blue-hover); }
.approach-card.human .approach-list .chk{ background:#FFF1E0; color:#D97A1A; }
.approach-list .chk svg{ width:13px; height:13px; }
.approach-btn{ display:inline-flex; align-items:center; gap:9px; align-self:flex-start; margin-top:auto;
  font-family:inherit; font-size:15px; font-weight:700; color:#fff; text-decoration:none;
  padding:13px 24px; border-radius:13px; transition:transform .2s ease, box-shadow .2s ease; }
.approach-card.saas .approach-btn{ background:linear-gradient(122deg,var(--blue),var(--blue-hover)); box-shadow:0 8px 20px rgba(92,141,255,.34); }
.approach-card.human .approach-btn{ background:linear-gradient(122deg,var(--orange),#F37B19); box-shadow:0 8px 20px rgba(255,159,67,.36); }
.approach-btn:hover{ transform:translateY(-2px); }
.approach-btn svg{ width:16px; height:16px; transition:transform .2s ease; }
.approach-btn:hover svg{ transform:translateX(3px); }
@media(max-width:860px){ .approach-grid{ grid-template-columns:1fr; } }

/* ─── Tarifs : design fidèle page 21-tarifs ─── */
#tarifs{ max-width:1280px; }
.billing-row{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; margin-top:26px; }
.billing-note{ font-size:13px; color:var(--muted); margin:0; }
.billing-toggle{ display:inline-flex; align-items:center; gap:4px; padding:5px;
  background:#fff; border:1px solid var(--border); border-radius:999px; box-shadow:var(--shadow-sm); }
.billing-toggle button{ padding:9px 22px; font-size:14px; font-weight:600; border:none; border-radius:999px;
  background:transparent; color:var(--muted); cursor:pointer; transition:all .2s; font-family:inherit; white-space:nowrap; }
.billing-toggle button.active{ background:var(--blue); color:#fff; box-shadow:0 2px 8px rgba(92,141,255,.3); }
.save-badge{ display:inline-block; margin-left:6px; font-size:11px; font-weight:700; padding:2px 7px;
  border-radius:999px; background:rgba(34,197,94,.15); color:#16A34A; vertical-align:middle; }
.billing-toggle button.active .save-badge{ background:rgba(255,255,255,.25); color:#fff; }

/* ── Filtres par fonctionnalité clé (chips interactifs) ── */
.filter-bar{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:14px;
  margin:28px auto 0; padding:14px 20px; background:#fff; border:1px solid var(--border);
  border-radius:16px; box-shadow:var(--shadow-sm); max-width:760px; }
.filter-label{ font-size:13px; font-weight:600; color:var(--ink); white-space:nowrap; }
.filter-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.filter-chip{ display:inline-flex; align-items:center; gap:6px; padding:7px 14px; font-size:13px;
  font-weight:600; background:var(--blue-100); color:var(--blue-hover); border:1.5px solid transparent;
  border-radius:999px; cursor:pointer; transition:all .2s ease; font-family:inherit; }
.filter-chip:hover{ background:var(--blue-200); transform:translateY(-1px); }
.filter-chip.active{ background:var(--blue); color:#fff; border-color:var(--blue-hover);
  box-shadow:0 4px 12px rgba(92,141,255,.35); }
.filter-chip svg{ flex-shrink:0; }
/* État fadé quand un filtre est appliqué et que la carte ne matche pas */
.plan.plan-faded{ opacity:.35 !important; filter:grayscale(.4); pointer-events:none; }
.plan{ transition:transform .3s ease, box-shadow .3s ease, opacity .3s ease, filter .3s ease; }
@media(max-width:680px){ .filter-label{ text-align:center; } .filter-chips{ justify-content:center; }
  .filter-chip{ padding:6px 11px; font-size:12.5px; } }

.pricing-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; align-items:stretch; max-width:none; margin:32px auto 0; }
.plan{ background:#fff; border:1px solid #EFF2F8; border-radius:24px; padding:32px 28px;
  position:relative; display:flex; flex-direction:column; transition:all .3s ease; box-shadow:var(--shadow-sm); }
.plan:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.plan-featured{ background:linear-gradient(180deg,#1E2A4A 0%,#1B2541 100%); color:#fff; border:none;
  box-shadow:0 30px 60px rgba(28,40,80,.18); transform:translateY(-12px); }
.plan-featured:hover{ transform:translateY(-16px); box-shadow:0 36px 70px rgba(28,40,80,.24); }
.plan-featured::before{ content:''; position:absolute; inset:0; border-radius:24px;
  background:radial-gradient(80% 60% at 50% 0%, rgba(92,141,255,.30) 0%, transparent 60%); pointer-events:none; }
.plan-badge{ position:absolute; top:-14px; left:24px; background:#fff; color:var(--muted);
  font-size:12px; font-weight:700; letter-spacing:.4px; text-transform:uppercase;
  padding:7px 14px; border-radius:999px; border:1px solid var(--border); box-shadow:var(--shadow-sm); }
.plan-badge-recommended{ background:var(--blue); color:#fff; }
.plan-featured .plan-badge{ background:var(--orange); color:#fff; border:none; box-shadow:0 6px 20px rgba(255,159,67,.42); }
.plan-header{ margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid #EFF2F8; position:relative; }
.plan-featured .plan-header{ border-bottom-color:rgba(255,255,255,.10); }
.plan-name{ font-size:22px; font-weight:800; color:var(--blue); letter-spacing:.8px; text-transform:uppercase; margin-bottom:4px; }
.plan-featured .plan-name{ color:#8FB1FF; }
.plan-tagline{ font-size:15px; font-weight:600; margin-top:6px; letter-spacing:-.01em; margin-bottom:12px; color:var(--ink); }
.plan-featured .plan-tagline{ color:#fff; }
.plan-desc{ font-size:14.5px; color:var(--muted); line-height:1.55; min-height:64px; }
.plan-featured .plan-desc{ color:rgba(255,255,255,.72); }
.plan-price{ display:flex; align-items:baseline; gap:6px; margin:24px 0 6px; }
.plan-price .amount{ font-size:48px; font-weight:800; letter-spacing:-.025em; line-height:1; }
.plan-price .currency{ font-size:28px; font-weight:700; }
.plan-price .period{ font-size:15px; color:var(--muted); }
.plan-featured .plan-price .period{ color:rgba(255,255,255,.65); }
.plan-launch{ position:absolute; top:-14px; right:18px; z-index:2; display:inline-flex; align-items:center; gap:6px;
  font-size:11.5px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; padding:7px 14px; border-radius:999px;
  background:linear-gradient(135deg,#FFE7CE 0%,#FFD7A5 100%); color:#B45309;
  border:1px solid rgba(255,159,67,.3); box-shadow:0 4px 12px rgba(255,159,67,.25); }
.plan-launch::before{ content:"🚀"; font-size:12px; }
.plan-featured .plan-launch{ background:linear-gradient(135deg,var(--orange) 0%,#FFB976 100%); color:#fff;
  border-color:transparent; box-shadow:0 4px 14px rgba(255,159,67,.45); }
.plan-strike{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:12px 0 -4px; font-size:14px; }
.plan-strike .strike-label{ font-size:12px; color:var(--muted); font-weight:500; }
.plan-strike .strike-amount{ text-decoration:line-through; color:var(--muted); font-weight:600; }
.plan-strike .strike-saving{ color:#16A34A; background:rgba(34,197,94,.12); padding:2px 8px; border-radius:6px; font-size:12px; font-weight:700; }
.plan-featured .plan-strike .strike-label, .plan-featured .plan-strike .strike-amount{ color:rgba(255,255,255,.6); }
.plan-featured .plan-strike .strike-saving{ background:rgba(34,197,94,.25); color:#86EFAC; }
.plan-pricenote{ font-size:13px; color:var(--muted); margin-bottom:24px; }
.plan-featured .plan-pricenote{ color:rgba(255,255,255,.55); }
.plan-cta{ margin-bottom:28px; position:relative; z-index:1; }
.btn-plan{ display:flex; align-items:center; justify-content:center; width:100%; font-family:inherit;
  font-size:16px; font-weight:600; padding:14px 26px; border-radius:12px; cursor:pointer; transition:all .2s ease; border:none; text-decoration:none; }
.btn-plan.soft{ background:var(--blue-100); color:var(--blue-hover); }
.btn-plan.soft:hover{ background:var(--blue-200); }
.btn-plan.primary{ background:var(--blue); color:#fff; box-shadow:0 4px 14px rgba(92,141,255,.32); }
.btn-plan.primary:hover{ background:var(--blue-hover); transform:translateY(-1px); box-shadow:0 6px 22px rgba(92,141,255,.5); }
.plan-feat-title{ font-size:12.5px; font-weight:700; letter-spacing:.8px; text-transform:uppercase; color:var(--muted); margin-bottom:14px; }
.plan-featured .plan-feat-title{ color:rgba(255,255,255,.55); }
.plan-features{ list-style:none; display:flex; flex-direction:column; gap:11px; margin-bottom:22px; }
.plan-features li{ display:flex; align-items:flex-start; gap:10px; font-size:14.5px; line-height:1.5; }
.plan-features .check{ flex-shrink:0; width:18px; height:18px; margin-top:2px; color:var(--blue); }
.plan-featured .plan-features .check{ color:#8FB1FF; }
.plan-features .check svg{ width:100%; height:100%; }
.plan-limits{ margin-top:auto; padding-top:20px; border-top:1px dashed var(--border); }
.plan-featured .plan-limits{ border-top-color:rgba(255,255,255,.10); }
.plan-limits-title{ font-size:12px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
.plan-featured .plan-limits-title{ color:rgba(255,255,255,.55); }
.plan-limits-list{ list-style:none; display:flex; flex-direction:column; gap:6px; font-size:13.5px; color:var(--muted); }
.plan-featured .plan-limits-list{ color:rgba(255,255,255,.65); }
.plan-limits-list li::before{ content:'·'; color:var(--blue); font-weight:700; margin-right:8px; }
@media(max-width:1024px){ .pricing-grid{ grid-template-columns:1fr; gap:20px; max-width:480px; margin:32px auto 0; }
  .plan-featured{ transform:none; } .plan-featured:hover{ transform:translateY(-4px); } }

/* ─── Menu : aligné avec le reste du site (mais transparent sur le hero) ─── */
.v2 .header-inner{ gap:0; }
.v2 .brand{ flex-shrink:0; }
.v2 .brand-logo{ height:30px; }
.v2 .site-header.compact .brand-logo{ height:26px; }
.v2 .header-cta{ gap:12px; flex-shrink:0; }
.v2 .nav{ flex:1; justify-content:center; gap:16px; margin:0 clamp(18px,2.6vw,46px); }
.nav .nav-item{ position:relative; display:inline-flex; align-items:center; gap:5px; line-height:1.18;
  font-size:14px; font-weight:500; color:#475068; cursor:pointer; padding:8px 0; transition:color .2s; }
.nav .nav-item:hover{ color:var(--blue); }
.nav .nav-item.active{ color:var(--navy); font-weight:700; }
.nav-chevron{ width:11px; height:11px; transition:transform .25s ease; flex-shrink:0; }
.nav-item:hover .nav-chevron{ transform:rotate(180deg); }
.submenu{ position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(10px);
  min-width:320px; background:rgba(255,255,255,.96);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid var(--border); border-radius:16px; box-shadow:0 24px 60px rgba(27,37,65,.16);
  padding:10px; opacity:0; visibility:hidden; transition:opacity .22s ease, transform .22s ease, visibility .22s; z-index:60; }
.nav-item:hover .submenu{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(4px); }
.submenu a{ display:flex; flex-direction:column; gap:2px; padding:10px 12px; border-radius:10px; transition:background .15s; }
.submenu a:hover{ background:var(--blue-50); }
.submenu a strong{ font-size:13.5px; color:var(--navy); font-weight:700; }
.submenu a span{ font-size:12px; color:var(--muted); font-weight:500; }
.submenu a.featured strong{ color:var(--blue-hover); }

/* ─── Hero : fusée vidéo (fond détouré en direct, décollage réel) ─── */
.gauge-host{ position:relative; width:min(600px,116%); aspect-ratio:740/1080; z-index:5; justify-self:center; }
.gauge-host video{ display:none; }
.gauge-host canvas{ position:absolute; left:50%; bottom:0; width:100%; height:100%;
  transform:translateX(-50%); will-change:transform; pointer-events:none; }
.gauge-readout{ position:absolute; left:50%; top:47%; transform:translate(-50%,-50%); text-align:center; pointer-events:none; z-index:2; }
.g-score{ font-size:clamp(46px,6vw,74px); font-weight:800; letter-spacing:-.04em; color:var(--navy); line-height:.95; }
.g-over{ font-size:13px; font-weight:600; color:#8A93A6; margin-top:2px; }
.g-level{ margin-top:8px; font-size:16px; font-weight:800; color:var(--green); }
.g-sub{ margin-top:4px; font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#9AA3B2; }
.gauge-hint{ position:absolute; bottom:-4px; left:50%; transform:translateX(-50%); z-index:3;
  font-size:12px; font-weight:600; color:var(--muted); white-space:nowrap;
  background:rgba(255,255,255,.88); border:1px solid var(--border); border-radius:999px; padding:6px 14px; }

/* ─── Mini-app fictive (panneau Logiciel) ─── */
.mini-app{ width:100%; background:#fff; border:1px solid var(--border); border-radius:18px; box-shadow:var(--shadow-lg); overflow:hidden; }
.mini-bar{ display:flex; align-items:center; gap:6px; padding:10px 14px; background:#F5F8FF; border-bottom:1px solid var(--border); }
.mini-bar .mtl{ width:9px; height:9px; border-radius:50%; }
.mini-url{ margin-left:10px; font-size:11px; color:var(--muted); font-weight:600; background:#fff; border:1px solid var(--border); padding:3px 10px; border-radius:7px; }
.mini-nav{ display:flex; gap:6px; padding:12px 14px 0; }
.mini-nav button{ font-family:inherit; font-size:12px; font-weight:700; padding:7px 12px; border-radius:9px;
  border:1px solid transparent; background:none; color:var(--muted); cursor:pointer; transition:.18s; }
.mini-nav button:hover{ color:var(--blue-hover); background:var(--blue-50); }
.mini-nav button.active{ background:var(--blue-100); color:var(--blue-hover); border-color:var(--blue-200); }
.mini-views{ position:relative; padding:14px; min-height:188px; }
.mini-view{ display:none; animation:miniIn .35s ease; }
.mini-view.active{ display:block; }
@keyframes miniIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.mini-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:12px; }
.mini-stat{ background:#F8FAFF; border:1px solid #EFF2F8; border-radius:10px; padding:9px 10px; }
.mini-stat .n{ font-size:16px; font-weight:800; color:var(--navy); }
.mini-stat .l{ font-size:9.5px; font-weight:600; color:var(--muted); }
.mini-bars{ display:flex; align-items:flex-end; gap:7px; height:72px; padding:0 4px; }
.mini-bars span{ flex:1; border-radius:5px 5px 2px 2px; background:linear-gradient(180deg,#5C8DFF,#8FB1FF); }
.mini-row{ display:flex; align-items:center; gap:10px; padding:9px 10px; border:1px solid #EFF2F8; border-radius:10px; margin-bottom:7px; background:#fff; }
.mini-av{ width:24px; height:24px; border-radius:50%; background:var(--blue-100); color:var(--blue-hover); display:grid; place-items:center; font-size:10px; font-weight:800; flex-shrink:0; }
.mini-row .rn{ flex:1; font-size:12px; font-weight:700; color:var(--navy); }
.mini-pill{ font-size:10px; font-weight:700; padding:3px 8px; border-radius:99px; }
.mini-pill.b{ background:var(--blue-100); color:var(--blue-hover); }
.mini-pill.g{ background:#E7F8EF; color:#16A34A; }
.mini-pill.a{ background:#FEF3DC; color:#B7791F; }
.mini-crit{ display:flex; align-items:center; gap:8px; margin-bottom:7px; }
.mini-crit .cl{ width:22px; font-size:10px; font-weight:800; color:var(--muted); }
.mini-crit .track{ flex:1; height:7px; border-radius:99px; background:#EFF2F8; overflow:hidden; }
.mini-crit .fill{ display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,#22C55E,#4ade80); }
.mini-ia{ display:flex; align-items:center; gap:8px; padding:10px 14px;
  background:linear-gradient(120deg,#F5F8FF,#EAF1FF); border-top:1px solid var(--border);
  font-size:11.5px; font-weight:600; color:var(--blue-deep); }
.ia-dot{ width:8px; height:8px; border-radius:50%; background:var(--blue); box-shadow:0 0 8px var(--blue); animation:pulse 2s ease-in-out infinite; flex-shrink:0; }

/* ─── Panneau 5 : Qualiomètre 3D (image) ─── */
.qm-img-wrap{ position:relative; display:grid; place-items:center; }
.qm-halo{ position:absolute; width:105%; height:105%; border-radius:50%;
  background:radial-gradient(circle at 50% 45%, rgba(34,197,94,.16), transparent 60%); filter:blur(18px); }
.qm-3d{ width:min(360px,85%); position:relative; z-index:1;
  filter:drop-shadow(0 32px 48px rgba(34,197,94,.25)); animation:floatY 7s ease-in-out infinite; }

/* ════════ MEGA-MENU (fidèle au site QUALiBOX) ════════ */
.v2{ --white:#fff; --text:#1B2541; --text-soft:#5b6478; --border-soft:#E8ECF3;
  --radius:14px; --blue-soft:#EAF1FF; --blue-dark:#3F6FE0; }

/* Boutons header */
.hdr-btn{ display:inline-flex; align-items:center; justify-content:center; font-family:inherit;
  font-size:14px; font-weight:700; padding:10px 16px; border-radius:11px; text-decoration:none;
  transition:all .2s ease; white-space:nowrap; cursor:pointer; }
.hdr-ghost{ background:#fff; color:var(--navy); border:1px solid var(--border); }
.hdr-ghost:hover{ border-color:var(--blue); color:var(--blue); }
.hdr-primary{ background:linear-gradient(122deg, var(--blue), var(--blue-hover)); color:#fff; border:none;
  box-shadow:0 4px 14px rgba(92,141,255,.32); }
.hdr-primary:hover{ transform:translateY(-1px); box-shadow:0 8px 22px rgba(92,141,255,.42); }
.v2 .header-cta{ display:flex; gap:12px; align-items:center; }

.nav-item.has-megamenu{ cursor:default; }

/* Panneau méga-menu */
.megamenu{ position:fixed; top:72px; left:50%; transform:translateX(-50%) translateY(10px);
  width:820px; max-width:calc(100vw - 40px); background:#fff; border:1px solid var(--border-soft);
  border-radius:20px; box-shadow:0 28px 60px rgba(35,50,90,.14), 0 8px 24px rgba(35,50,90,.06);
  padding:16px; opacity:0; visibility:hidden;
  transition:opacity .25s, transform .25s, visibility .25s; z-index:110; }
.site-header.compact .megamenu{ top:62px; }
/* pont invisible pour garder le hover entre l'item et le panneau */
.megamenu::before{ content:""; position:absolute; left:0; right:0; top:-26px; height:26px; }
.nav-item.has-megamenu:hover .megamenu{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(2px); }
.megamenu-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:6px; margin-bottom:14px; }
.megamenu-item{ display:flex; align-items:flex-start; gap:14px; padding:14px; border-radius:14px;
  transition:all .2s ease; text-decoration:none; position:relative; }
.megamenu-item:hover{ background:var(--blue-soft); }
.megamenu-item-icon{ flex-shrink:0; width:48px; height:48px; display:flex; align-items:center; justify-content:center;
  border-radius:12px; background:transparent;
  transition:all .3s ease; overflow:visible; }
.megamenu-item-icon img{ width:44px; height:44px; object-fit:contain; }
.megamenu-item:hover .megamenu-item-icon{ transform:scale(1.06); }
.megamenu-item.featured{ grid-column:1 / -1;
  background:linear-gradient(135deg, rgba(92,141,255,.06) 0%, rgba(255,159,67,.04) 100%);
  border:1px solid rgba(92,141,255,.15); }
.megamenu-item.featured:hover{ background:linear-gradient(135deg, rgba(92,141,255,.10) 0%, rgba(255,159,67,.06) 100%);
  border-color:rgba(92,141,255,.25); }
.megamenu-item.featured .megamenu-item-icon{ background:transparent; }
.megamenu-item-text h4{ font-size:14.5px; font-weight:700; color:var(--text); margin-bottom:3px; letter-spacing:-.005em;
  display:flex; align-items:center; gap:8px; }
.megamenu-item-text p{ font-size:12.5px; color:var(--text-soft); line-height:1.4; margin:0; }
.badge-free{ background:var(--orange); color:#fff; font-size:10px; font-weight:700; letter-spacing:.4px;
  text-transform:uppercase; padding:2px 8px; border-radius:999px; }
.megamenu-foot{ margin-top:8px; border-top:1px solid var(--border-soft); padding:15px 16px; display:flex;
  align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  background:linear-gradient(120deg, rgba(92,141,255,.08), rgba(255,159,67,.08)); border-radius:0 0 14px 14px; }
.megamenu-foot-info{ font-size:12.5px; color:var(--text-soft); display:flex; align-items:center; gap:8px; font-weight:500; }
.megamenu-foot-info svg{ color:var(--blue); flex-shrink:0; }
.megamenu-foot-cta{ display:inline-flex; align-items:center; gap:7px; padding:10px 20px;
  background:linear-gradient(135deg, #4F7BEF 0%, #2A4BC4 100%); color:#fff; font-size:14px; font-weight:700;
  border-radius:11px; text-decoration:none; box-shadow:0 8px 20px rgba(42,75,196,.35); transition:all .2s ease; }
.megamenu-foot-cta:hover{ background:linear-gradient(135deg, #5C8DFF 0%, #3F6FE0 100%); transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(42,75,196,.5); }
.megamenu-foot-cta svg{ width:13px; height:13px; }
/* CTA d'action (orange) pour le menu Tarifs */
.megamenu-pricing .megamenu-foot-cta{ background:linear-gradient(135deg, #FF9F43 0%, #F37B19 100%); box-shadow:0 8px 20px rgba(243,123,25,.4); }
.megamenu-pricing .megamenu-foot-cta:hover{ background:linear-gradient(135deg, #FFB15E 0%, #FF8A2A 100%); box-shadow:0 12px 26px rgba(243,123,25,.55); }

/* Méga-menu Tarifs (Solution SaaS) */
.megamenu-pricing{ width:760px; }
.megamenu-discover{ display:flex; align-items:center; gap:14px; padding:14px 16px; margin-bottom:14px;
  border-radius:14px; text-decoration:none;
  background:linear-gradient(120deg, rgba(92,141,255,.12) 0%, rgba(255,159,67,.10) 100%);
  border:1px solid rgba(92,141,255,.22); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.megamenu-discover:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(92,141,255,.20); border-color:rgba(92,141,255,.45); }
.megamenu-discover-icon{ flex-shrink:0; width:46px; height:46px; border-radius:12px; background:#fff;
  box-shadow:0 4px 12px rgba(60,90,160,.12); display:flex; align-items:center; justify-content:center; }
.megamenu-discover-icon img{ width:30px; height:30px; object-fit:contain; }
.megamenu-discover-text{ display:flex; flex-direction:column; gap:2px; flex:1; }
.megamenu-discover-text strong{ font-size:15px; font-weight:800; color:var(--text); letter-spacing:-.01em; }
.megamenu-discover-text span{ font-size:12.5px; color:var(--text-soft); line-height:1.35; }
.megamenu-discover-arrow{ width:18px; height:18px; color:var(--blue); flex-shrink:0; transition:transform .18s ease; }
.megamenu-discover:hover .megamenu-discover-arrow{ transform:translateX(4px); }
.megamenu-pricing-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:0 6px 12px; }
.pricing-card-mini{ background:#fff; border:1px solid var(--border-soft); border-radius:14px; padding:18px 16px 14px;
  text-decoration:none; position:relative; transition:all .25s ease; display:flex; flex-direction:column; gap:4px; }
.pricing-card-mini:hover{ transform:translateY(-3px); box-shadow:0 10px 24px rgba(35,50,90,.08); border-color:rgba(92,141,255,.3); }
.pricing-card-mini.featured{ background:linear-gradient(180deg, #1E2A4A 0%, #1B2541 100%); color:#fff; border:none;
  box-shadow:0 12px 28px rgba(28,40,80,.18); }
.pricing-card-mini-badge{ position:absolute; top:-10px; right:12px; background:var(--orange); color:#fff;
  font-size:10px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; padding:4px 10px; border-radius:999px;
  box-shadow:0 4px 10px rgba(255,159,67,.35); }
.pricing-card-mini-name{ font-size:11px; font-weight:800; color:var(--blue); letter-spacing:.8px; text-transform:uppercase; }
.pricing-card-mini.featured .pricing-card-mini-name{ color:#8FB1FF; }
.pricing-card-mini-amount{ display:flex; align-items:baseline; gap:3px; margin:2px 0 4px; }
.pricing-card-mini-amount .num{ font-size:28px; font-weight:800; letter-spacing:-.02em; }
.pricing-card-mini-amount .cur{ font-size:16px; font-weight:700; }
.pricing-card-mini-amount .per{ font-size:11.5px; color:var(--text-soft); }
.pricing-card-mini.featured .pricing-card-mini-amount .per{ color:rgba(255,255,255,.6); }
.pricing-card-mini-strike{ display:inline-flex; align-items:center; gap:6px; margin-top:2px; font-size:11.5px; }
.pricing-card-mini-strike .strike{ text-decoration:line-through; color:var(--text-soft); font-weight:600; }
.pricing-card-mini-strike .save{ background:rgba(34,197,94,.16); color:#16A34A; font-weight:700; padding:2px 7px; border-radius:5px; }
.pricing-card-mini.featured .pricing-card-mini-strike .strike{ color:rgba(255,255,255,.55); }
.pricing-card-mini.featured .pricing-card-mini-strike .save{ background:rgba(34,197,94,.28); color:#86EFAC; }
.pricing-card-mini-desc{ font-size:12px; color:var(--text-soft); line-height:1.4; margin:0; }
.pricing-card-mini.featured .pricing-card-mini-desc{ color:rgba(255,255,255,.7); }
.megamenu-pricing-links{ display:flex; gap:8px; padding:0 6px 8px; flex-wrap:wrap; }
.megamenu-pricing-link{ font-size:13px; color:var(--text-soft); padding:6px 12px; border-radius:8px;
  text-decoration:none; transition:all .15s; font-weight:500; }
.megamenu-pricing-link:hover{ background:var(--blue-soft); color:var(--blue-dark); }
.megamenu-pricing-link-all{ display:inline-flex; align-items:center; gap:6px; color:var(--blue-dark); font-weight:700; }
.megamenu-pricing-link-all svg{ width:14px; height:14px; }
.megamenu-pricing-link-all:hover svg{ transform:translateX(3px); transition:transform .18s ease; }
@media(max-width:1080px){ .megamenu{ display:none; } }


/* ════════ Barre de progression de scroll (haut de page) ════════ */
.scroll-progress{ position:fixed; top:0; left:0; right:0; height:3px; z-index:9999; background:transparent; pointer-events:none; }
.scroll-progress i{ display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:0 50%; background:linear-gradient(90deg, var(--orange,#FF9F43) 0%, #FFB36B 24%, var(--blue,#5C8DFF) 72%, var(--blue-hover,#3F6FE0) 100%); will-change:transform; }
