/* ══════════════════════════════════════════
   V2 — Additions structure "AdsbyJer"
   (chargé en plus de style.css, ne remplace rien)
══════════════════════════════════════════ */

.eyebrow-num{font-family:'Inter',sans-serif;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#FF6B35;margin-bottom:16px;display:block}

/* V2 : titres de section moins imposants que le style par défaut */
.title-h2{font-size:clamp(28px,2.6vw,42px)}

/* V2 : vrais logos clients dans les cartes Preuve, pas des placeholders texte */
.story-thumb img{max-width:88%;max-height:114px;object-fit:contain;border-radius:10px}
/* Boite de 240x150. On plafonne a 88% de large (211px) et 114px de haut :
   les logos larges butent sur la largeur, les carres sur la hauteur, et il
   reste ~15px de marge sur chaque axe. Ne pas monter davantage sans elargir
   la colonne .story-block (240px). */

/* V2 : test — navbar remplacée par 2 éléments flottants indépendants au scroll */
.floating-fade{position:fixed;top:0;left:0;right:0;height:100px;z-index:90;pointer-events:none;background:linear-gradient(to bottom, #F8F9FB 0%, #F8F9FB 40%, rgba(248,249,251,0) 100%)}
/* Pousse le tout premier contenu (label de la hero) sous la zone du degrade,
   pour qu'il ne soit jamais partiellement recouvert au chargement de la page. */
.hero-section{padding-top:120px}
.floating-name{position:fixed;top:22px;left:24px;z-index:100;font-family:'Roboto',Helvetica,sans-serif;font-weight:900;font-size:17px;color:#004AAD;letter-spacing:-.01em}
.floating-cta{position:fixed;top:18px;right:20px;z-index:100;padding:12px 24px;font-size:13px;box-shadow:0 4px 20px rgba(0,74,173,.12)}

@media(max-width:640px){
  .floating-fade{height:90px}
  .hero-section{padding-top:100px}
  .floating-name{top:16px;left:16px;font-size:15px}
  .floating-cta{top:14px;right:14px;padding:9px 16px;font-size:12px}
}

/* V2 : CTA hero avec lien secondaire */
.hero-cta-row{display:flex;align-items:center;gap:24px;flex-wrap:wrap;justify-content:center}
.hero-secondary-link{font-family:'Inter',sans-serif;font-size:15px;font-weight:600;color:#1A1A2E;text-decoration:underline;text-decoration-color:#D6E4F7;text-underline-offset:4px;transition:text-decoration-color .2s}
.hero-secondary-link:hover{text-decoration-color:#1A1A2E}

/* ── 01 · PROBLEM ── */
.problem-section{padding:80px 0;background:#F8F9FB}
.problem-header{max-width:700px;margin:0 auto 48px;text-align:center}
.problem-list{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1000px;margin:0 auto}
.problem-item{display:flex;flex-direction:column;gap:16px;padding:32px 28px;background:#fff;border:1px solid #D6E4F7;border-radius:16px}
.problem-num{font-family:'Roboto',Helvetica,sans-serif;font-size:28px;font-weight:900;color:#D6E4F7;line-height:1}
.problem-item h3{font-family:'Roboto',Helvetica,sans-serif;font-size:20px;font-weight:700;margin-bottom:8px;color:#1A1A2E}
.problem-item p{font-size:16px;color:#4A4F70;line-height:1.6}

/* ── 02 · WHAT YOU GET ── */
.getlist{display:flex;flex-direction:column;gap:24px;max-width:800px;margin:48px auto 0}
.get-item{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid #EEF3FB;border-radius:14px;padding:24px 28px}
.get-check{width:24px;height:24px;border-radius:50%;background:#004AAD;flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-top:2px}
.get-check svg{width:12px;height:12px}
.get-item h3{font-family:'Roboto',Helvetica,sans-serif;font-size:17px;font-weight:700;margin-bottom:6px;color:#1A1A2E}
.get-item p{font-size:15px;color:#4A4F70;line-height:1.6}

/* ── 03 · HOW IT WORKS (timeline chronologique) ── */
.timeline-3{position:relative;max-width:700px;margin:56px auto 0;padding-left:48px}
.timeline-3::before{content:"";position:absolute;left:15px;top:4px;bottom:4px;width:2px;background:#D6E4F7}
.timeline-3-item{position:relative;padding-bottom:44px}
.timeline-3-item:last-child{padding-bottom:0}
.timeline-3-dot{position:absolute;left:-48px;top:0;width:32px;height:32px;border-radius:50%;background:#004AAD;color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Roboto',Helvetica,sans-serif;font-size:14px;font-weight:900;z-index:1}
.timeline-3-when{font-family:'Roboto',Helvetica,sans-serif;font-size:13px;font-weight:700;color:#004AAD;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;padding-top:6px}
.timeline-3-item h3{font-family:'Roboto',Helvetica,sans-serif;font-size:19px;font-weight:700;margin-bottom:8px;color:#1A1A2E}
.timeline-3-item p{font-size:15px;color:#4A4F70;line-height:1.6}

/* ── 05 · DIFFERENCE (table) ── */
.diff-table-wrap{max-width:900px;margin:48px auto 0;background:#fff;border:1px solid #D6E4F7;border-radius:16px;overflow:hidden}
.diff-row{display:grid;grid-template-columns:0.7fr 1fr 1fr;border-bottom:1px solid #EEF3FB}
.diff-row:last-child{border-bottom:none}
.diff-row.diff-head{background:#1A1A2E}
.diff-row.diff-head div{color:#fff;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.04em}
.diff-cell{padding:20px 24px;font-size:15px;line-height:1.5}
.diff-cell.diff-label{font-weight:700;color:#1A1A2E;background:#F8F9FB}
.diff-cell.diff-typical{color:#6B7A99}
.diff-cell.diff-us{color:#004AAD;font-weight:600;background:#EEF3FB}

/* ── 06 · FIT ── */
.fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:900px;margin:48px auto 0}
.fit-box{border-radius:20px;padding:36px}
.fit-box.fit-yes{background:#fff;border:2px solid #004AAD}
.fit-box.fit-no{background:#1A1A2E}
.fit-box h3{font-family:'Roboto',Helvetica,sans-serif;font-size:19px;font-weight:700;margin-bottom:20px}
.fit-box.fit-yes h3{color:#1A1A2E}
.fit-box.fit-no h3{color:#fff}
.fit-box ul{display:flex;flex-direction:column;gap:14px}
.fit-box li{font-size:15px;line-height:1.5;padding-left:20px;position:relative}
.fit-box.fit-yes li{color:#1A1A2E}
.fit-box.fit-no li{color:#A0AEC0}
.fit-box.fit-yes li::before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;border-radius:50%;background:#004AAD}
.fit-box.fit-no li::before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;border-radius:50%;background:#FF6B35}

/* ── 07 · START HERE ── */
.starthere-section{padding:88px 0;background:#1A1A2E;text-align:center}
.starthere-section .title-h2{color:#fff}
.starthere-section .title-h2 em{color:#FFE500;font-style:italic}
.starthere-text{max-width:640px;margin:20px auto 36px;color:#A0AEC0;font-size:17px;line-height:1.7}

@media(max-width:768px){
  .problem-list{grid-template-columns:1fr}
  .timeline-3{padding-left:36px}
  .timeline-3-dot{left:-36px;width:26px;height:26px;font-size:12px}
  .timeline-3::before{left:12px}
  /* Vrai tableau scrollable horizontalement : colonne des critères fixe,
     "Agence classique" visible par défaut, swipe pour révéler "Erwan Chatelet". */
  .diff-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .diff-row{display:grid;grid-template-columns:130px 170px 170px;min-width:470px}
  .diff-row.diff-head{display:grid}
  .diff-cell{padding:16px 16px;font-size:14px}
  .diff-cell.diff-label{position:sticky;left:0;z-index:2;font-weight:700;box-shadow:4px 0 8px -4px rgba(0,0,0,.12)}
  .fit-grid{grid-template-columns:1fr}
}

/* ── TEMOIGNAGES (recommandations LinkedIn publiques) ──
   Les verbatims sont reproduits mot pour mot, ponctuation d'origine comprise.
   Ne jamais les reecrire ni les lisser. */
/* Deux colonnes reelles, remplies a la main : le placement des cartes est
   voulu, pas laisse a l'equilibrage automatique de `columns`. */
.testi-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start;max-width:920px;margin:48px auto 0}
.testi-col{display:flex;flex-direction:column;gap:22px}
.testi-card{position:relative;background:#fff;border:1px solid #D6E4F7;border-radius:18px;padding:30px 30px 24px;box-shadow:0 4px 24px rgba(0,74,173,.07);transition:box-shadow .25s,transform .25s}
.testi-card:hover{box-shadow:0 10px 34px rgba(0,74,173,.12);transform:translateY(-2px)}

/* guillemet decoratif */
.testi-card::before{content:"\201C";position:absolute;top:2px;right:20px;font-family:Georgia,'Times New Roman',serif;font-size:78px;line-height:1;color:#004AAD;opacity:.10;pointer-events:none}

/* logo de l'entreprise, en haut a gauche */
.testi-logo{height:44px;width:auto;max-width:124px;object-fit:contain;border-radius:8px;display:block;margin-left:auto;flex-shrink:0}
/* Comet est un logo-mot, tres large : sans plafond propre il ecrase les trois autres. */
.testi-logo[src$="comet.webp"]{max-width:75px}
/* Mention discrete sous un verbatim traduit. */
.testi-trad{font-size:12px;font-style:italic;color:#8A93A8;margin:-8px 0 18px}
.testi-logo-txt{font-family:'Roboto',Helvetica,sans-serif;font-size:13px;font-weight:700;color:#6B7A99;letter-spacing:.02em;margin-left:auto;flex-shrink:0}

.testi-quote{font-size:15px;line-height:1.68;color:#1A1A2E;margin:0 0 20px;position:relative;z-index:1}
.testi-quote p{margin:0 0 11px}
.testi-quote p:last-child{margin-bottom:0}

.testi-author{display:flex;align-items:center;gap:13px;border-top:1px solid #EEF3FB;padding-top:18px}
.testi-who{min-width:0}
.testi-avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;flex-shrink:0;background:#EEF3FB;display:block}
.testi-initials{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,#004AAD,#0063E6);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Roboto',Helvetica,sans-serif;font-size:15px;font-weight:900;flex-shrink:0;letter-spacing:.02em}
.testi-name{font-family:'Roboto',Helvetica,sans-serif;font-size:15px;font-weight:700;color:#1A1A2E;line-height:1.3}
.testi-role{font-size:13px;color:#6B7A99;line-height:1.45;margin-top:3px}

.testi-source{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:30px;font-size:13px;color:#6B7A99}
.testi-source svg{width:15px;height:15px;flex-shrink:0}

@media(max-width:860px){
  .testi-grid{grid-template-columns:1fr;max-width:620px}
  .testi-card{padding:26px 24px 22px}
  .testi-card::before{font-size:66px;right:16px}
}

/* ══════════════════════════════════════════
   CONTENU EDITE DANS WORDPRESS
   Applique l'identite du theme a tout ce qui est cree depuis l'admin
   (pages, articles, blocs Gutenberg). Sans ca, une page WordPress
   sort en styles navigateur par defaut.
══════════════════════════════════════════ */
.page-content-wrap{max-width:760px;margin:0 auto}
.page-content-wrap > h1:first-child{margin-bottom:32px}

.page-content-wrap h1{font-family:'Roboto',Helvetica,sans-serif;font-size:clamp(32px,4vw,48px);font-weight:900;line-height:1.12;color:#1A1A2E;letter-spacing:-.01em}
.page-content-wrap h2{font-family:'Roboto',Helvetica,sans-serif;font-size:clamp(24px,2.6vw,34px);font-weight:900;line-height:1.2;color:#1A1A2E;margin:52px 0 18px}
.page-content-wrap h3{font-family:'Roboto',Helvetica,sans-serif;font-size:20px;font-weight:700;line-height:1.3;color:#1A1A2E;margin:36px 0 12px}
.page-content-wrap h4{font-family:'Roboto',Helvetica,sans-serif;font-size:17px;font-weight:700;color:#1A1A2E;margin:28px 0 10px}

.page-content-wrap p{font-size:17px;line-height:1.7;color:#4A4F70;margin:0 0 20px}
.page-content-wrap strong{color:#1A1A2E;font-weight:700}
.page-content-wrap a{color:#004AAD;text-decoration:underline;text-decoration-color:#B9D2F5;text-underline-offset:3px;transition:text-decoration-color .2s}
.page-content-wrap a:hover{text-decoration-color:#004AAD}

.page-content-wrap ul,.page-content-wrap ol{margin:0 0 22px;padding-left:0}
.page-content-wrap ol{padding-left:22px;list-style:decimal}
.page-content-wrap ol li{padding-left:6px}
.page-content-wrap ul li{position:relative;padding-left:26px;list-style:none}
.page-content-wrap ul li::before{content:"";position:absolute;left:2px;top:11px;width:8px;height:8px;border-radius:50%;background:#FF6B35}
.page-content-wrap li{font-size:17px;line-height:1.7;color:#4A4F70;margin-bottom:10px}

.page-content-wrap blockquote{margin:32px 0;padding:22px 26px;background:#fff;border:1px solid #D6E4F7;border-left:3px solid #004AAD;border-radius:12px}
.page-content-wrap blockquote p{font-size:17px;color:#1A1A2E;margin-bottom:0}
.page-content-wrap blockquote cite{display:block;margin-top:12px;font-size:14px;font-style:normal;color:#6B7A99}

.page-content-wrap img,.page-content-wrap figure img{border-radius:14px;height:auto}
.page-content-wrap figure{margin:32px 0}
.page-content-wrap figcaption{margin-top:10px;font-size:13px;color:#6B7A99;text-align:center}

.page-content-wrap hr{border:0;height:1px;background:#D6E4F7;margin:48px 0}
.page-content-wrap code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;background:#EEF3FB;padding:2px 6px;border-radius:5px;color:#1A1A2E}

.page-content-wrap table{width:100%;border-collapse:collapse;margin:28px 0;font-size:15px}
.page-content-wrap th,.page-content-wrap td{text-align:left;padding:12px 14px;border-bottom:1px solid #D6E4F7}
.page-content-wrap th{font-family:'Roboto',Helvetica,sans-serif;font-weight:700;color:#1A1A2E;background:#F8F9FB}
.page-content-wrap td{color:#4A4F70}

/* Blocs Gutenberg qui debordent volontairement de la colonne de lecture */
.page-content-wrap .alignwide{max-width:1000px;margin-left:calc((760px - 1000px)/2);margin-right:calc((760px - 1000px)/2)}
.page-content-wrap .aligncenter{margin-left:auto;margin-right:auto;text-align:center}
.page-content-wrap .wp-block-button__link{display:inline-block;background:#004AAD;color:#fff;font-family:'Inter',sans-serif;font-weight:700;font-size:15px;padding:14px 28px;border-radius:10px;text-decoration:none}

@media(max-width:1060px){
  .page-content-wrap .alignwide{max-width:100%;margin-left:0;margin-right:0}
}
@media(max-width:640px){
  .page-content-wrap p,.page-content-wrap li{font-size:16px}
}

/* Grille de case studies utilisable dans une page WordPress via [case_study] */
.cs-list{max-width:900px;margin:40px auto 0;display:flex;flex-direction:column;gap:20px}

/* Bloc "RV Corp : Comparaison 2 colonnes" (inc/block-patterns.php) */
.rvc-compare{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:32px 0}
.rvc-compare-col{border-radius:16px;padding:28px;border:1px solid #D6E4F7}
.rvc-compare-col.is-them{background:#F8F9FB}
.rvc-compare-col.is-them,.rvc-compare-col.is-them p{color:#6B7A99}
.rvc-compare-col.is-you{background:#EEF3FB;border-color:#004AAD}
.rvc-compare-col h3{font-family:'Roboto',Helvetica,sans-serif;font-weight:700;font-size:18px;margin-bottom:14px;color:#1A1A2E}
.rvc-compare-col ul{margin:0}
.rvc-compare-col li{list-style:none;padding-left:0;margin-bottom:10px;font-size:15px}
.rvc-compare-col li::before{content:none}
@media(max-width:640px){.rvc-compare{grid-template-columns:1fr}}

/* Bloc "RV Corp : Bandeau CTA" — carte plutot que pleine largeur, car il vit
   dans la colonne de lecture (page-content-wrap) et non dans une section dediee. */
.page-content-wrap .starthere-section{border-radius:20px;padding:64px 40px}