/* ================================================================
INEUF — Extensions dev du Design System v2
(élements laissés "au développeur" + fidélité maquette homepage)
Chargé APRÈS ineuf-design-system-v2.css
================================================================ */
/* ---- HEADER PHOTO PLEIN-ZONE (homepage) -------------------------
La maquette superpose topbar + nav + hero sur une photo avec overlay.
.hero-full--home porte la photo (background-image inline). */
.hero-full--home { position: relative; background-size: cover; background-position: center 42%; }
.hero-full--home .hero { background: transparent !important; }
/* Placeholders image (dev) + zones image en lien cliquable */
.ph { background: #d5d9dc; }
a.program-img, a.news-img { display: block; }
.hero-full--home::before {
content: ''; position: absolute; inset: 0;
/* 03/07 : voile uniforme conforme maquette (index.html : rgba(43,55,66,.55)) —
le degrade laissait le bas de la photo delave, le client ne retrouvait pas le filtre */
background: rgba(43,55,66,.55);
z-index: 0;
}
.hero-full--home > * { position: relative; z-index: 1; }
.footer-brand .logo img { height: 92px; }
/* ---- HERO : alignement gauche + conteneur ----------------------- */
.hero { text-align: left; padding-top: 76px; padding-bottom: 60px; }
.hero-inner { max-width: var(--inner); margin: 0 auto; width: 100%; }
/* 03/07 : retour maquette (PDF designer) — titre et recherche CENTRES */
.hero h1 { margin-inline: auto; max-width: 900px; text-align: center; }
.hero .search-box { margin-inline: auto; max-width: var(--hero-w); width: 100%; border-radius: var(--radius-sm); }
/* ---- SELECTS de recherche (laissés "au développeur") ------------ */
.search-filters select {
flex: 1; min-width: 150px; padding: 14px 38px 14px 18px;
font-family: var(--font); font-size: 13px; font-weight: 500; color: #56646d;
background-color: #fff; border: 1px solid #d0d8dc; border-radius: var(--radius-full);
appearance: none; -webkit-appearance: none; -moz-appearance: none; cursor: pointer;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat; background-position: right 16px center; background-size: 12px;
}
.search-box .btn-search { border-radius: var(--radius-full); }
/* ---- SIDE-ICONS rondes (maquette) ------------------------------- */
.side-icons { right: 18px; gap: 14px; }
.side-icon {
width: 58px; height: 58px; border-radius: 50% !important;
border: 1px solid var(--border-mid); border-right: 1px solid var(--border-mid);
box-shadow: 0 6px 16px rgba(0,0,0,.14);
}
.side-icon img { width: 30px; height: 30px; }
/* ---- STATS : pictos orange sans cercle -------------------------- */
.stat-icon { border: none; width: auto; height: 56px; }
.stat-icon img { width: 56px; height: 56px; }
/* ---- POURQUOI ACHETER : bulles auto-portées --------------------- */
.why-icon { border: none; width: auto; height: 72px; }
.why-icon img { width: 72px; height: 72px; }
/* ---- Pictos cartes / partagés ---- */
.share-btn img { width:14px; height:14px; }
.scroll-top img, .chat-bubble img { width:20px; height:20px; }
/* ================================================================
POLISH v2 — fidélité maquette (round 2)
================================================================ */
/* Hero un peu plus haut pour révéler la photo */
.hero-full--home .hero { padding-top: 88px; padding-bottom: 92px; }
/* Bloc conseillers : photo placeholder un peu plus grande */
.advisors-img { min-height: 360px; }
/* Programmes : bouton "Voir tous" orange + points carrousel */
.programs-section .btn-all { display:inline-flex; align-items:center; justify-content:center;
background: var(--orange); color:#fff; font-weight:700; font-size:14px; letter-spacing:.3px;
padding:13px 30px; border-radius: var(--radius-full); border:2px solid var(--orange); }
.programs-section .btn-all:hover { background: var(--orange-dk); border-color: var(--orange-dk); }
.carousel-dots { display:flex; gap:8px; justify-content:center; margin:26px 0 22px; }
.carousel-dots .dot { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.45); }
.carousel-dots .dot.active { background:#fff; }
/* petit picto building+heart bas-droite des cartes */
.program-footer { display:flex; align-items:flex-end; justify-content:space-between; }
/* 04/07 : icones en LIGNE (la colonne creusait un grand blanc au-dessus du prix) */
.program-actions { display:flex; flex-direction:row; gap:8px; flex-shrink:0; align-items:center; }
.program-mini-ico { width:46px; height:46px; flex-shrink:0; }
.program-mini-ico img { width:28px; height:28px; }
/* Pourquoi acheter : cartes grises centrées (maquette) */
.why-card { background:#eef1f3; border:none; text-align:center; }
.why-card .why-icon { margin-left:auto; margin-right:auto; }
.why-card h3 { text-align:center; }
.why-card p { text-align:center; }
.why-card .link-arrow { display:inline-block; }
/* Partenaires : logos nus, plus grands (sans cadre) */
.partners-logos { gap:48px; align-items:center; justify-content:center; flex-wrap:wrap; }
.partner-logo { background:transparent; border:none; box-shadow:none; padding:0; min-width:0; }
.partner-logo img { max-height:62px; max-width:170px; filter:grayscale(1); opacity:.9; }
/* Actualités : carte image hauteur fixe pour les exemples */
.news-img { height:190px; display:block; }
/* ================================================================
FIX round 3 — retours client (overlay, tailles, couleurs)
================================================================ */
/* 03/07 : voile uniforme rgba(43,55,66,.55) conforme maquette index.html —
les degrades successifs delavaient la photo ET creaient un reflet bleu/vert sur les lettres */
.hero-full--home { background-position: center 82%; min-height: 680px; }
/* 03/07 : effet lettres du PDF designer = ombre portee douce et marquee */
.hero-full--home .hero h1 { text-shadow: 0 4px 10px rgba(0,0,0,.65), 0 14px 38px rgba(0,0,0,.50); max-width: 1000px; font-size: 52px; }
/* Contenu plus large (proportions maquette 1400px) */
:root { --inner: 1200px; --hero-w: 1000px; }
/* Side-icons : pictos plus grands */
.side-icon { width: 64px; height: 64px; }
.side-icon img { width: 40px; height: 40px; }
/* Stats : plus large + pictos & chiffres plus grands + séparateurs */
.stats-grid { max-width: 1120px !important; }
.stat-icon { border: none; width: auto; height: 70px; }
.stat-icon img { width: 70px; height: 70px; }
.stat-number { font-size: 42px; }
.stat-desc { font-size: 13px; }
.stat-item + .stat-item { border-left: 1px solid var(--border-mid); }
.stats-section .section-title { font-size: 32px; }
/* Titres de section en teal (ton maquette) */
.section-title:not(.section-title--white) { color: var(--teal); }
/* Pourquoi acheter : section BLANCHE, cartes grises (contraste maquette) */
.why-section { background: #ffffff; }
.why-card { background: #eef1f3; border: none; text-align: center; padding: 34px 26px; }
.why-icon { border: none; width: auto; height: 88px; }
.why-icon img { width: 88px; height: 88px; }
.why-card h3 { font-size: 18px; }
/* ================================================================
FIX round 4 — retours client 2 (hero plus haut, pictos, flottants)
================================================================ */
/* Hero : plus haut, photo cadree sur le chemin/cycliste, barre en bas */
.hero-full--home .hero { padding-top: 150px; padding-bottom: 64px; }
/* Side-icons : pictos encore plus grands (remplissent le cercle) */
.side-icon { width: 66px; height: 66px; }
.side-icon img { width: 46px; height: 46px; }
/* Partenaires : logos grands, section-title plus grand */
.partners-section .section-title { font-size: 30px; }
.partners-logos { gap: 56px !important; max-width: var(--inner) !important; }
.partner-logo { width: auto !important; height: auto !important; border: none !important; }
.partner-logo img { max-height: 84px !important; max-width: 210px !important; filter: grayscale(1); opacity: .9; }
/* Flottants bas-droite : remontes + chat conforme (orange, plus grand) */
/* 03/07 : a GAUCHE — sous la colonne d'icones il passait pour un surlignage errant */
.scroll-top { bottom: 28px !important; right: auto !important; left: 24px !important; width: 46px; height: 46px; }
.chat-bubble { bottom: 38px !important; right: 28px !important; width: 56px; height: 56px; }
.chat-bubble img { width: 26px; height: 26px; }
.scroll-top img { width: 20px; height: 20px; }
/* FIX round 4b — partenaires : logos plus grands + EN COULEUR (maquette) */
.partner-logo img {
height: 56px !important; width: auto !important;
max-height: none !important; max-width: 240px !important;
filter: none !important; opacity: 1 !important;
}
.partners-logos { gap: 60px !important; }
/* ================================================================
HEADER v3 — reconstruction propre (grille : logo sur 2 rangées)
Remplace les rustines round 5. Markup =