/*
 * C2i info — socle v8 (thème enfant 5.0.0, 22/09/2026)
 * Source de référence : maquette v8.2 validée par Sylvain le 21/09
 * (assets/maquettes-design/C2i-V6-handoff/v6-c2i-info-net/project/v8.2.html).
 *
 * Cohabitation avec le v4 (pages pas encore migrées, phase 5) :
 *  - tokens préfixés --c8-* : les --c2i-* du v4 (blue, ink, green, bg, line, display, mono)
 *    ont le même nom mais d'autres valeurs, on ne les redéfinit pas ;
 *  - classes préfixées c8- : .btn / .sec / .container de la maquette entrent en collision
 *    avec Divi (.container) et le v4 ;
 *  - la base typographique ne s'applique qu'aux pages v8 (body.c2i-v8, posée par
 *    functions.php) et aux blocs header/footer v8 (.c8-scope).
 * Les composants (header, footer, slider, cartes…) s'ajoutent en dessous, lot par lot.
 */

/* ============ Tokens v8 ============ */
:root{
  --c8-blue:#009fe0;--c8-blue-hover:#0088c2;--c8-blue-deep:#0a4d78;--c8-blue-deep-2:#073a5c;
  --c8-green:#3aaa35;--c8-green-hover:#329e2e;--c8-on-green:#fff;
  --c8-ink:#0b2540;--c8-ink-2:#4a5b6d;--c8-line:#e0e8ee;--c8-bg:#fff;--c8-bg-soft:#f4f8fb;
  --c8-on-blue-2:#cfe6f5;--c8-sky:#7fd0f2;--c8-tint:#e6f5fc;
  /* Funnel Sans (OFL, auto-hébergée) : remplace Aptos, accord Sylvain 21/09 */
  --c8-display:'Funnel Sans',system-ui,sans-serif;
  --c8-body:'Funnel Sans',system-ui,sans-serif;
  --c8-mono:'JetBrains Mono',ui-monospace,monospace;
  --c8-wrap:1240px;
  --c8-ease:cubic-bezier(.2,.7,.2,1);
}

/* Flèche Divi par défaut des boutons (ETmodules « 5 » au survol) : masquée partout. Reprise de c2i-v3.css §13,
   qui n'est plus chargé que sur la page 254 (5.0.25, 23/09/2026). */
.et_pb_button:not(.c2i-keep-icon)::after{content:none!important}

/* ============ Base (pages v8 seulement) ============ */
body.c2i-v8{font-family:var(--c8-body);color:var(--c8-ink);background:var(--c8-bg);font-size:16px;line-height:1.6;overflow-x:clip}
body.c2i-v8 #page-container,body.c2i-v8 #main-content{background:var(--c8-bg)}
.c2i-v8 h1,.c2i-v8 h2,.c2i-v8 h3,.c2i-v8 h4,.c2i-v8 h5,
.c8-scope h1,.c8-scope h2,.c8-scope h3,.c8-scope h4,.c8-scope h5{font-family:var(--c8-display);line-height:1.15;color:inherit;padding-bottom:0}
.c2i-v8 h1,.c2i-v8 h2,.c2i-v8 h3,.c8-scope h2,.c8-scope h3,.c8-eyebrow{text-wrap:balance}
.c2i-v8 a,.c8-scope a{color:var(--c8-blue);text-decoration:none}
.c2i-v8 :focus-visible,.c8-scope :focus-visible{outline:3px solid var(--c8-blue);outline-offset:2px}
.c8-scope{font-family:var(--c8-body);line-height:1.6}

/* groupes de sens des titres : un groupe par ligne (pas de <br>) */
.c8-l{display:inline-block;text-wrap:balance}

/* ============ Mise en page ============ */
.c8-wrap{max-width:var(--c8-wrap);margin:0 auto;padding:0 32px}
@media(max-width:600px){.c8-wrap{padding:0 20px}}

.c8-eyebrow{font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--c8-blue);font-family:var(--c8-body)}
.c8-sec-blue .c8-eyebrow{color:var(--c8-sky)}

/* sections : alternance blanc / bleu profond */
.c8-sec{padding:92px 0;overflow:clip}
.c8-sec-white{background:#fff;color:var(--c8-ink)}
.c8-sec-blue{background:var(--c8-blue-deep);color:#fff}
.c8-sec-blue h2,.c8-sec-blue h3{color:#fff}
.c8-sec-blue p,.c8-sec-blue li{color:var(--c8-on-blue-2)}
@media(max-width:900px){.c8-sec{padding:64px 0}}

.c8-sec-head{text-align:center;max-width:780px;margin:0 auto 50px}
.c8-sec-head h2{font-size:38px;margin-top:10px}
.c8-sec-head p{font-size:17px;color:var(--c8-ink-2);margin-top:14px}
.c8-sec-blue .c8-sec-head p{color:var(--c8-on-blue-2)}
@media(max-width:600px){.c8-sec-head h2{font-size:30px}}

/* conteneur de carte Leaflet : ses z-index (400/1000) ne doivent pas passer sur le menu */
.c8-map{isolation:isolate}

/* ============ Boutons ============ */
.c8-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:8px;font-weight:700;font-size:15px;line-height:1.2;border:2px solid transparent;cursor:pointer;font-family:var(--c8-body);white-space:nowrap;
  transition:background-color .2s,color .2s,border-color .2s,transform .25s var(--c8-ease),box-shadow .25s}
.c8-btn i{transition:transform .3s var(--c8-ease)}
.c8-btn:hover,.c8-btn:focus-visible{transform:translateY(-2px);box-shadow:0 14px 26px -14px rgba(0,0,0,.55)}
.c8-btn:hover i,.c8-btn:focus-visible i{transform:scale(1.15) rotate(-8deg)}
a.c8-btn-primary,.c8-btn-primary{background:var(--c8-blue);color:#fff}
a.c8-btn-primary:hover,.c8-btn-primary:hover{background:var(--c8-blue-hover);color:#fff}
/* vert charte, texte blanc (décision Sylvain 18/09) */
a.c8-btn-green,.c8-btn-green{background:var(--c8-green);color:var(--c8-on-green)}
a.c8-btn-green:hover,.c8-btn-green:hover{background:var(--c8-green-hover);color:var(--c8-on-green)}
a.c8-btn-outline,.c8-btn-outline{border-color:var(--c8-blue-deep);color:var(--c8-blue-deep);background:transparent}
a.c8-btn-outline:hover,.c8-btn-outline:hover{background:var(--c8-blue-deep);color:#fff}
a.c8-btn-light,.c8-btn-light{background:#fff;color:var(--c8-blue-deep)}
a.c8-btn-light:hover,.c8-btn-light:hover{background:#cdeefc;color:var(--c8-blue-deep)}
@media(max-width:600px){.c8-btn{white-space:normal}}

/* lien « … → » : la flèche glisse */
.c8-ilink{font-weight:700;display:inline-flex;align-items:center;gap:8px}
.c8-ilink i{transition:transform .25s var(--c8-ease)}
.c8-ilink:hover i,.c8-ilink:focus-visible i{transform:translateX(4px)}

/* ============ Garde-fous ============ */
@media(prefers-reduced-motion:reduce){
  .c8-btn,.c8-btn i,.c8-ilink i{transition:none}
  .c8-btn:hover,.c8-btn:hover i,.c8-btn:focus-visible,.c8-btn:focus-visible i,.c8-ilink:hover i{transform:none}
}
/* tactile : pas de survol « collant » après un tap */
@media(hover:none){.c8-btn:hover{transform:none;box-shadow:none}.c8-btn:hover i{transform:none}}

/* Header collant (TB 68), tout le site — 22/09/2026, child 5.0.5.
 * La règle vivait dans c2i-header.css (v4), retiré des enqueues en 5.0.2 : le header ne collait plus nulle part.
 * overflow:clip des ancêtres et top:0 = c2i-v8-chrome.css. Barre d'admin WordPress (connecté) : décalage de sa hauteur. */
.et-l.et-l--header{position:sticky!important;z-index:100}
@media (min-width:601px) and (max-width:782px){.admin-bar .et-l.et-l--header{top:46px!important}}
@media (min-width:783px){.admin-bar .et-l.et-l--header{top:32px!important}}

/* ============ Recherche (gabarit TB 98 « Résultats de recherche », layout 87 — 23/09/2026, child 5.0.26) ============
 * Modules Divi natifs (divi/search + divi/blog sur la requête courante, generate_search_v8.js) ; leurs presets par défaut
 * sont encore v4 (bouton corail, textes crème) : habillage ici, préfixé #page-container pour passer devant. */
#page-container .c8-search-hero .c8-search-box{max-width:640px;border:0;background:transparent}
#page-container .c8-search-hero .c8-search-box .et_pb_searchform>div{display:flex;gap:10px;position:static}
#page-container .c8-search-hero .c8-search-box input.et_pb_s{flex:1;min-width:0;height:auto;margin:0;padding:14px 18px!important;border:0!important;border-radius:8px!important;
  background:#fff!important;color:var(--c8-ink)!important;font:400 16px/1.3 var(--c8-body)!important;max-width:none}
#page-container .c8-search-hero .c8-search-box input.et_pb_s::placeholder{color:#5f7285;opacity:1}
#page-container .c8-search-hero .c8-search-box input.et_pb_searchsubmit{position:static!important;flex:none;height:auto!important;margin:0;padding:14px 24px!important;border:0!important;border-radius:8px!important;
  background:var(--c8-green)!important;color:#fff!important;font:700 15px/1.3 var(--c8-body)!important;text-transform:none!important;letter-spacing:0!important;cursor:pointer;transition:background-color .2s}
#page-container .c8-search-hero .c8-search-box input.et_pb_searchsubmit:hover{background:var(--c8-green-hover)!important}
#page-container .c8-search-hero .c8-search-box input:focus-visible{outline:3px solid var(--c8-sky);outline-offset:2px}
@media(max-width:600px){#page-container .c8-search-hero .c8-search-box .et_pb_searchform>div{flex-direction:column}}

#page-container .c8-search-results .et_pb_post{margin:0 0 16px;padding:22px 24px;background:var(--c8-bg-soft);border:1px solid var(--c8-line);border-radius:12px;
  transition:border-color .2s,transform .25s var(--c8-ease),box-shadow .25s}
#page-container .c8-search-results .et_pb_post:hover{border-color:var(--c8-blue);transform:translateY(-2px);box-shadow:0 14px 26px -18px rgba(10,77,120,.45)}
#page-container .c8-search-results .entry-title{margin:0 0 6px;padding:0;font:800 20px/1.3 var(--c8-display)}
#page-container .c8-search-results .entry-title a{color:var(--c8-blue-deep)!important}
#page-container .c8-search-results .entry-title a:hover{color:var(--c8-blue)!important}
#page-container .c8-search-results .post-meta{display:none}
#page-container .c8-search-results .post-content p{margin:0 0 8px;padding:0;color:var(--c8-ink-2);font:400 15.5px/1.65 var(--c8-body)}
#page-container .c8-search-results .more-link{color:var(--c8-blue)!important;font:700 15px/1.4 var(--c8-body);text-transform:none;letter-spacing:0}
#page-container .c8-search-results .pagination{display:flex;justify-content:space-between;gap:12px;margin:24px 0 0;padding:0}
#page-container .c8-search-results .pagination .alignleft{order:2;float:none}
#page-container .c8-search-results .pagination .alignright{order:1;float:none}
#page-container .c8-search-results .pagination a{display:inline-block;padding:12px 22px;border:2px solid var(--c8-blue-deep);border-radius:8px;color:var(--c8-blue-deep);
  font:700 15px/1.2 var(--c8-body);transition:background-color .2s,color .2s}
#page-container .c8-search-results .pagination a:hover{background:var(--c8-blue-deep);color:#fff}
/* aucun résultat : gabarit « no-results » de Divi */
#page-container .c8-search-results .entry h1,#page-container .c8-search-results .not-found-title{color:var(--c8-ink);font:800 24px/1.3 var(--c8-display);padding:0;margin:0 0 8px}
#page-container .c8-search-results .entry p{color:var(--c8-ink-2);font:400 16px/1.65 var(--c8-body)}
@media(prefers-reduced-motion:reduce){#page-container .c8-search-results .et_pb_post{transition:none}#page-container .c8-search-results .et_pb_post:hover{transform:none}}