/* ════════════════════════════════════════════════════════════════════════
   Refonte du 18/10/2026 (demande de Paul : « usine à gaz », surtout sur téléphone).
   Chargée APRÈS main.css : elle surcharge sans toucher à l'existant.
   Pour revenir en arrière : retirer l'enqueue « kerbone-v2-refonte » dans functions.php.
   1. Fonds bleus (hero, prise de RDV) : plus d'aquarelle floue, la charte de la bannière
      Melyo (blanc, arcs épais #003DD5) et un bleu marine net.
   2. Header : pilule blanche nette au défilement (plus de verre gris).
   3. Menu mobile : bleu marine, aéré, bouton détaché.
   4. Équipe : trois portraits ronds (photos LinkedIn).
   5. Cas client : version courte.
   6. Démo vidéo : bouton lecture, plein écran.
   7. FAQ : IA en une ligne.
   8. Téléphone : textes plus grands, sections resserrées, décor retiré.
   ════════════════════════════════════════════════════════════════════════ */

/* ── 1a. Hero : blanc, halo bleu léger, deux arcs dans les angles ── */
.kv2-hero__card,
.kv2-hero__card::before { background: #fff; animation: none; }
.kv2-hero__card::before {
  background:
    radial-gradient(60% 70% at 50% 0%, rgba(231, 237, 252, 0.95), rgba(255, 255, 255, 0) 70%),
    #fff;
}
.kv2-hero__card::after {
  /* arcs façon bannière Melyo : anneaux épais coupés par les bords */
  background:
    radial-gradient(circle at 100% 0%, transparent 0 150px, var(--c-sage) 151px 196px, transparent 197px),
    radial-gradient(circle at 0% 100%, transparent 0 120px, var(--c-sage) 121px 160px, transparent 161px);
  opacity: 1;
  animation: none;
}
.kv2-hero__overlay,
.kv2-hero__fade { display: none; }
.kv2-hero__pill { background: var(--c-mist); border-color: rgba(0, 61, 213, 0.18); }
.kv2-hero__pill::before { background: var(--c-sage); }
.kv2-hero__content h1 em { color: var(--c-sage) !important; }

/* ── 1b. Prise de RDV : bleu marine net, arcs, textes blancs ── */
.kv2-rdv {
  background-image:
    radial-gradient(circle at 100% 0%, transparent 0 190px, rgba(0, 61, 213, 0.55) 191px 240px, transparent 241px),
    radial-gradient(circle at 0% 100%, transparent 0 160px, rgba(0, 61, 213, 0.45) 161px 205px, transparent 206px),
    linear-gradient(180deg, #0b1d52 0%, #07133a 100%) !important;
  background-size: auto !important;
}
.kv2-rdv__eyebrow { color: var(--c-sage-light); }
.kv2-rdv__title { color: #fff; }
.kv2-rdv__desc { color: var(--c-text-dark-default); }
.kv2-rdv__avatar { border-color: #0b1d52; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3); }

/* ── 2. Header : bleu marine net en haut de page, pilule blanche au défilement ── */
.kv2-nav { background: rgba(11, 29, 82, 0.96); border-color: rgba(255, 255, 255, 0.06); }
.kv2-nav.scrolled {
  background: rgba(255, 255, 255, 0.94);
  border-color: var(--c-bg-border);
  box-shadow: 0 10px 30px -12px rgba(11, 29, 82, 0.28);
}
.kv2-nav.scrolled .kv2-nav__logo-white { display: none !important; }
.kv2-nav.scrolled .kv2-nav__logo-dark { display: block !important; }
.kv2-nav.scrolled .kv2-nav__links a,
.kv2-nav.scrolled .kv2-nav__tools-toggle { color: #0b1d52; }
.kv2-nav.scrolled .kv2-nav__links a:hover,
.kv2-nav.scrolled .kv2-nav__tools:hover .kv2-nav__tools-toggle { background: var(--c-mist); color: #0b1d52; }
.kv2-nav.scrolled .kv2-nav__cta { background: var(--c-sage); color: #fff !important; }
.kv2-nav.scrolled .kv2-nav__cta .kv2-cta-phone { color: #fff; }
.kv2-nav.scrolled .kv2-nav__hamburger span { background: #0b1d52; }
/* menu ouvert : on garde le header sombre par-dessus le menu */
body.kv2-menu-open .kv2-nav { background: transparent; border-color: transparent; box-shadow: none; }
body.kv2-menu-open .kv2-nav .kv2-nav__logo-white { display: block !important; }
body.kv2-menu-open .kv2-nav .kv2-nav__logo-dark { display: none !important; }
body.kv2-menu-open .kv2-nav .kv2-nav__hamburger span { background: #fff; }

/* ── 3. Menu mobile ── */
.kv2-mobile-menu {
  background: linear-gradient(180deg, #0b1d52 0%, #07133a 100%);
  padding: 124px 24px 32px;
  gap: 0;
  overflow-y: auto;
}
.kv2-mobile-menu > a:not(.kv2-btn) {
  font-size: 22px; font-weight: 600; letter-spacing: -0.01em;
  padding: 16px 4px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.kv2-mobile-menu .kv2-mobile-tools {
  margin: 20px 0 8px; padding: 16px; border-radius: 16px;
  background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1);
}
.kv2-mobile-menu .kv2-mobile-tools__head { color: var(--c-sage-light); margin: 0 0 6px; }
.kv2-mobile-menu .kv2-mobile-tools a { padding: 10px 4px; font-size: 17px; font-weight: 600; }
.kv2-mobile-menu .kv2-mobile-tools a small { font-size: 14px; font-weight: 400; color: var(--c-text-dark-default); }
.kv2-mobile-menu .kv2-btn {
  margin-top: 24px; justify-content: center; text-align: center;
  font-size: 17px; font-weight: 600; padding: 16px 20px; border-radius: 12px;
  background: var(--c-sage); color: #fff;
}
/* les 3 barres deviennent une croix quand le menu est ouvert */
body.kv2-menu-open .kv2-nav__hamburger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.kv2-menu-open .kv2-nav__hamburger span:nth-child(2) { opacity: 0; }
body.kv2-menu-open .kv2-nav__hamburger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── 4. Équipe ── */
.kv2-team { padding: 88px 24px; background: var(--c-bg-white); }
.kv2-team__inner { max-width: 880px; margin: 0 auto; text-align: center; display: flex; flex-direction: column; align-items: center; }
.kv2-team__eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-sage); margin: 0 0 12px; }
.kv2-team__title { font-size: clamp(28px, 3.4vw, 42px); font-weight: 500; letter-spacing: -0.02em; margin: 0 0 12px; text-wrap: balance; }
.kv2-team__desc { font-size: 17px; line-height: 1.55; color: var(--c-text-default); margin: 0 0 40px; max-width: 520px; }
.kv2-team__list { list-style: none; margin: 0 0 40px; padding: 0; display: flex; justify-content: center; gap: clamp(20px, 5vw, 56px); }
.kv2-team__link { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: inherit; }
.kv2-team__photo { position: relative; width: 160px; height: 160px; border-radius: 50%; margin-bottom: 16px; box-shadow: 0 18px 40px -18px rgba(11, 29, 82, 0.55); transition: transform 0.25s var(--ease); }
.kv2-team__photo img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.kv2-team__in { position: absolute; right: 6px; bottom: 6px; width: 30px; height: 30px; border-radius: 8px; background: #0a66c2; color: #fff; font: 700 15px/30px Arial, sans-serif; text-align: center; border: 2px solid #fff; }
.kv2-team__link:hover .kv2-team__photo { transform: translateY(-4px); }
.kv2-team__nom { font-size: 18px; font-weight: 600; color: var(--c-text-title); }
.kv2-team__role { font-size: 15px; color: var(--c-text-default); margin-top: 2px; }

/* ── 5. Cas client court ── */
.kv2-cas__title { margin-bottom: 0.5rem; }
.kv2-cas__context { font-size: 1rem; margin-bottom: 1.5rem; }
.kv2-cas__chiffres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 1.5rem; }
.kv2-cas__chiffres > div { background: #fff; border: 1px solid var(--c-bg-border); border-radius: var(--r-card); padding: 16px 18px; display: flex; flex-direction: column; gap: 2px; }
.kv2-cas__chiffres b { font-size: clamp(24px, 2.6vw, 32px); font-weight: 700; color: var(--c-sage); line-height: 1.1; }
.kv2-cas__chiffres span { font-size: 14px; color: var(--c-text-default); }
.kv2-cas__lignes { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.kv2-cas__ligne { background: #fff; border: 1px solid var(--c-bg-border); border-radius: var(--r-card); padding: 16px 18px; }
.kv2-cas__ligne-tete { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.kv2-cas__ligne-tete h3 { margin: 0; font-size: 17px; font-weight: 600; }
.kv2-cas__ligne p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--c-text-default); }
.kv2-cas__text { margin: 0; font-weight: 500; color: var(--c-text-title); }

/* ── 6. Démo vidéo ── */
.plateforme-demo__cadre { position: relative; }
.plateforme-demo__video { cursor: zoom-in; }
.plateforme-demo__play {
  position: absolute; right: 16px; bottom: 16px;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px 10px 12px; border: 0; border-radius: 999px;
  background: var(--c-sage); color: #fff; font: 600 15px/1 var(--font); cursor: pointer;
  box-shadow: 0 10px 24px -10px rgba(0, 61, 213, 0.8);
}
.plateforme-demo__play svg { width: 20px; height: 20px; }
/* vidéo bloquée (iPhone en économie d'énergie) : gros bouton au centre */
.plateforme-demo.is-paused .plateforme-demo__play {
  right: 50%; bottom: 50%; transform: translate(50%, 50%);
  padding: 16px 24px 16px 18px; font-size: 17px;
}

/* Schéma à filaments sous la démo : rendu vide, retiré partout */
.plateforme-diagramme { display: none !important; }

/* ── 7. FAQ : IA en une ligne ── */
.kv2-ia.kv2-ia--compact {
  margin: 1.5rem auto 0; padding: 0; background: none; border: 0;
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 14px;
}
.kv2-ia--compact .kv2-ia__titre { font-size: 15px; font-weight: 600; color: var(--c-text-default); }
.kv2-ia--compact .kv2-ia__liens { flex-direction: row !important; gap: 8px; }
.kv2-ia--compact .kv2-ia__lien { height: 40px; padding: 0 14px 0 10px; font-size: 14px; gap: 8px; box-shadow: none; }
.kv2-ia--compact .kv2-ia__lien img { width: 20px; height: 20px; }

/* ════════════════════════════════════════════════════════════════════════
   8. Téléphone
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* règles générales limitées à l'accueil : les autres pages gardent leurs propres tailles */
  body.home { font-size: 16px; }
  body.home .kv2-section { padding: 56px 0; }
  body.home .kv2-container { padding-left: 20px; padding-right: 20px; }
  body.home .kv2-page h2, .kv2-faq-title, .reconnaissance-titre, .kv2-construit-title {
    font-size: 28px !important; line-height: 1.15; white-space: normal !important; text-wrap: balance;
  }
  body.home .kv2-section__sub { font-size: 17px !important; }

  /* Hero : plus grand, plus serré */
  .kv2-hero__card::after { display: none; }
  .kv2-hero__content { padding: 104px 20px 32px !important; }
  .kv2-hero__pill { font-size: 10.5px !important; margin-bottom: 18px !important; }
  .kv2-hero__content h1 { font-size: 31px !important; line-height: 1.12 !important; margin-bottom: 4px !important; }
  .kv2-hero__ctas .kv2-btn--chevron { padding-right: 56px; }
  .kv2-hero__ctas .btn-chevron { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); }
  .kv2-hero__ctas { width: 100%; flex-direction: column; gap: 10px; margin-top: 24px; }
  .kv2-hero__ctas .kv2-btn { width: 100%; justify-content: center; font-size: 16px; padding: 15px 18px; }
  .kv2-hero__ctas .kv2-btn--chevron { position: relative; }
  .kv2-logos img { height: 30px; }

  /* « Vous vous reconnaissez ? » : 4 cartes qui glissent à l'horizontale */
  .section-reconnaissance { padding-top: 48px !important; padding-bottom: 48px !important; }
  .reconnaissance-inner { padding-left: 0 !important; padding-right: 0 !important; }
  .reconnaissance-titre { padding: 0 20px; margin-bottom: 20px !important; }
  .douleur-grille {
    display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px;
    padding: 4px 20px 16px; border: 0 !important; border-radius: 0 !important; background: none !important;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .douleur-grille::-webkit-scrollbar { display: none; }
  .douleur-cellule {
    flex: 0 0 82%; scroll-snap-align: center; opacity: 1 !important; transform: none !important;
    border: 1px solid var(--c-bg-border) !important; border-radius: 18px; background: #fff;
    padding: 14px 14px 18px !important;
  }
  .douleur-scene { height: 168px !important; }
  .douleur-phrase { font-size: 17px !important; line-height: 1.35; }
  .douleur-suite { font-size: 15px !important; }
  .reconnaissance-cloture { margin-top: 28px !important; padding: 0 20px; }
  .cloture-phrase { font-size: 20px !important; }

  /* Plateforme : on garde les 6 piliers et la démo, on retire le décor */
  .circ-gallery-wrap, .kv2-plateforme__visual, .plateforme-diagramme,
  .section-piliers__phrase--bottom { display: none !important; }
  .section-piliers__phrase--top { margin: 1.25rem 0 1rem !important; font-size: 17px; }
  /* 6 piliers : pastilles icône + nom, 2 par ligne (le détail est dans la démo) */
  .modules-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .module-card { opacity: 1 !important; transform: none !important; display: flex !important; flex-direction: row !important; align-items: center; gap: 10px; padding: 14px 12px !important; min-height: 0 !important; border-radius: 14px !important; }
  .module-card__icon { margin: 0 !important; flex: none; }
  .module-card__title { margin: 0 !important; font-size: 15.5px !important; line-height: 1.2 !important; }
  .module-card__text { display: none !important; }
  .plateforme-diff { margin-top: 48px !important; }
  .plateforme-diff__title { font-size: 24px !important; }
  .plateforme-diff__punch { font-size: 22px !important; }
  .plateforme-demo { width: 100% !important; left: 0 !important; transform: none !important; margin: 1rem 0 1.5rem !important; }
  .plateforme-demo__video { border-radius: 14px !important; }
  .plateforme-demo__play { right: 10px; bottom: 10px; padding: 8px 14px 8px 10px; font-size: 14px; }
  .plateforme-ia { margin: 0 0 0.5rem !important; }
  .plateforme-ia__titre { font-size: 20px !important; }
  .plateforme-ia__liste li { font-size: 16px !important; }

  /* Cas client */
  .kv2-cas__card { padding: 22px 18px !important; border-radius: 20px !important; }
  .kv2-cas__title { font-size: 26px !important; }
  .kv2-cas__chiffres { gap: 8px; }
  .kv2-cas__chiffres > div { padding: 12px 10px; }
  .kv2-cas__chiffres b { font-size: 20px; }
  .kv2-cas__chiffres span { font-size: 12.5px; line-height: 1.3; }
  .kv2-cas__lignes { grid-template-columns: 1fr; gap: 8px; }
  .kv2-cas__ligne:nth-child(n+4) { display: none; } /* téléphone : les 3 sujets les plus parlants */
  .kv2-cas__ligne { padding: 14px 16px; }

  /* Équipe */
  .kv2-team { padding: 56px 20px; }
  .kv2-team__title { font-size: 28px; }
  .kv2-team__desc { font-size: 16px; margin-bottom: 28px; }
  .kv2-team__list { gap: 14px; margin-bottom: 28px; width: 100%; }
  .kv2-team__person { flex: 1 1 0; min-width: 0; }
  .kv2-team__photo { width: 96px; height: 96px; margin-bottom: 10px; }
  .kv2-team__in { width: 22px; height: 22px; font-size: 12px; line-height: 22px; right: 0; bottom: 0; border-radius: 6px; }
  .kv2-team__nom { font-size: 15px; }
  .kv2-team__role { font-size: 13px; }

  /* Bpifrance : une seule série de logos */
  .kv2-refbpi-outside { display: none !important; }

  /* 4 étapes : cartes simples, sans frise animée */
  .kv2-collab__line-track, .kv2-collab__marker { display: none !important; }
  .kv2-collab__timeline { display: grid; gap: 10px; }
  .kv2-collab__step, .kv2-collab__step--left, .kv2-collab__step--right {
    position: static !important; width: auto !important; left: auto !important; padding: 18px !important; margin: 0 !important;
    opacity: 1 !important; transform: none !important;
    display: grid !important; grid-template-columns: 44px 1fr; column-gap: 12px; align-items: start;
    border: 1px solid var(--c-bg-border); border-radius: 16px; background: #fff;
  }
  .kv2-collab__num { font-size: 30px !important; line-height: 1 !important; margin: 0 !important; opacity: 1 !important; color: var(--c-sage) !important; }
  .kv2-collab__card h3 { font-size: 17px !important; margin-bottom: 4px !important; }
  .kv2-collab__card p { font-size: 15px !important; line-height: 1.5 !important; }

  /* FAQ */
  .kv2-faq-item__q { font-size: 17px !important; }
  .kv2-faq-item__a { font-size: 16px !important; }
  .kv2-ia--compact .kv2-ia__titre { width: 100%; text-align: center; }

  /* RDV */
  .kv2-rdv { padding: 56px 0 48px !important; background-image:
    radial-gradient(circle at 100% 0%, transparent 0 90px, rgba(0, 61, 213, 0.55) 91px 118px, transparent 119px),
    linear-gradient(180deg, #0b1d52 0%, #07133a 100%) !important; }
  .kv2-rdv__inner { padding: 0 16px; }
  .kv2-rdv__title { font-size: 28px !important; }
  .kv2-rdv__desc { font-size: 16px !important; }
}