/* Site illustré (version A « chaleureux ») — chargé en dernier sur toutes les pages publiques.
   v2 (29/10) : sur ordinateur, le personnage du haut de l'accueil est calé à droite et la carte « Ce que je fais pour vous »
   flotte juste sous sa main tendue (main à 34 % de la hauteur de l'image, image 514×1000), avec un léger balancement.
   Le fond du site prend la couleur exacte du fond des illustrations (#E3E9F7) : posées dessus, elles n'ont aucun bord.
   Sur une bande sombre, elles sont posées (version détourée) au cœur d'un halo de lumière progressif.
   Accent ambre (repris de l'illustration) pour les boutons d'appel des bandes sombres. */
:root{--illu-fond:#E3E9F7;--ambre:#F2A93B;--ambre-txt:#2A1600}
html body{background:#E3E9F7!important;background-image:none!important}

/* ── Haut de page avec illustration ── */
.hero .hero-visual.illu-hero-zone::before,.hero .hero-visual.illu-hero-zone::after{display:none!important}
.hero .hero-visual.illu-hero-zone{background:none!important;border:0!important;box-shadow:none!important;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;position:relative;min-height:clamp(360px,42vw,560px)}
.illu-hero{display:block;width:auto;height:clamp(340px,40vw,540px);max-width:100%;object-fit:contain}
.hero .hero-visual.illu-hero-zone .hero-card{position:absolute;left:0;bottom:clamp(16px,3vw,40px);width:min(300px,58%);padding:18px 20px;border:1px solid rgba(255,255,255,.7)!important;border-radius:22px!important;background:rgba(255,255,255,.78)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 18px 44px rgba(14,29,58,.14)!important;color:var(--dark,#0e1d3a)!important}
.hero .hero-visual.illu-hero-zone .hero-card-icon{display:none}
.hero .hero-visual.illu-hero-zone .hero-card-title{font-size:16px;margin-bottom:4px;color:var(--dark,#0e1d3a)}
.hero .hero-visual.illu-hero-zone .service-mini{border-color:rgba(27,63,143,.1)!important;padding:6px 0!important}
.hero .hero-visual.illu-hero-zone .service-mini span{opacity:1!important;color:#33415c}
.hero .hero-visual.illu-hero-zone .service-mini-dot{background:var(--ambre)!important}

/* ── Ma mission ── */
.illu-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.illu-mission{display:block;width:100%;max-width:420px;height:auto;margin:0 auto}

/* ── Bande « Un accompagnement adapté à chacun » ── */
.illu-bande{max-width:1120px;margin:clamp(18px,3vw,30px) auto;padding:clamp(28px,4vw,52px);border-radius:clamp(24px,3vw,36px);background:#0e1d3a;color:#fff;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:clamp(20px,4vw,44px);align-items:center;box-sizing:border-box}
.illu-bande h2{margin:0 0 14px;color:#fff;font-size:clamp(28px,3.6vw,44px);line-height:1.06}
.illu-bande p{margin:0;color:#C9D6EE;font-size:clamp(16px,1.6vw,18px);line-height:1.6}
.illu-bande-image{margin:0}
.illu-decor{display:block;width:100%;height:auto;border-radius:clamp(18px,2.4vw,28px);box-shadow:0 26px 60px rgba(0,0,0,.35)}
.illu-bande-halo{background:radial-gradient(ellipse 36% 120% at 76% 55%,#E3E9F7 0%,#E3E9F7 44%,rgba(227,233,247,.8) 57%,rgba(170,190,228,.45) 71%,rgba(80,105,160,.18) 86%,rgba(14,29,58,0) 100%),#0e1d3a}

/* ── Image fondue dans un halo (bandes sombres) ── */
.illu-halo{display:block;width:auto;max-width:100%;height:clamp(240px,26vw,340px);margin:0 auto}

/* ── Bloc « Appelez-moi » ── */
.cta-band.illu-cta{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.8fr);align-items:end;gap:10px;text-align:left;padding-bottom:0!important;overflow:hidden;background:radial-gradient(ellipse 34% 130% at 78% 58%,#E3E9F7 0%,#E3E9F7 44%,rgba(227,233,247,.8) 57%,rgba(170,190,228,.45) 71%,rgba(60,95,170,.18) 86%,rgba(27,63,143,0) 100%),var(--p,#1B3F8F)!important}
.cta-band.illu-cta .illu-cta-texte{align-self:center;padding-bottom:clamp(28px,4vw,40px);max-width:520px}
.cta-band.illu-cta .cta-band-btns{justify-content:flex-start}
.cta-band.illu-cta .illu-cta-image{margin:0;display:flex;justify-content:center}
.cta-band .cta-band-btn-main{background:var(--ambre)!important;color:var(--ambre-txt)!important;border-color:var(--ambre)!important}

/* ── Cartes de services illustrées ── */
.svc-card.a-illu{padding-top:0!important;overflow:hidden;border-top:0!important}
.svc-card.a-illu .svc-icon{display:none}
.svc-illu{margin:0 calc(-1 * clamp(18px,2.5vw,26px)) 16px;height:clamp(150px,14vw,180px);background:#E3E9F7;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.svc-illu img{display:block;height:92%;width:auto;max-width:96%;object-fit:contain}

@media (max-width:760px){
  .hero .hero-visual.illu-hero-zone::before,.hero .hero-visual.illu-hero-zone::after{display:none!important}
.hero .hero-visual.illu-hero-zone{background:none!important;border:0!important;box-shadow:none!important;min-height:0}
  .hero .hero-visual.illu-hero-zone .hero-card{position:static;width:100%;margin-top:-30px}
  .illu-hero{height:clamp(300px,80vw,420px)}
  .cta-band.illu-cta{grid-template-columns:1fr;text-align:center;background:radial-gradient(ellipse 100% 62% at 50% 86%,#E3E9F7 0%,#E3E9F7 52%,rgba(227,233,247,.8) 57%,rgba(170,190,228,.45) 71%,rgba(60,95,170,.18) 86%,rgba(27,63,143,0) 100%),var(--p,#1B3F8F)!important}
  .cta-band.illu-cta .illu-cta-texte{padding-bottom:0;max-width:none}
  .cta-band.illu-cta .illu-halo{height:250px}
  .cta-band.illu-cta .illu-cta-image{margin-top:28px}
  .cta-band.illu-cta .cta-band-btn-sec{background:#0e1d3a!important;color:#fff!important;border-color:#0e1d3a!important}
  .cta-band.illu-cta .cta-band-btns{justify-content:center}
  .illu-bande-halo{background:radial-gradient(ellipse 85% 40% at 50% 82%,#E3E9F7 0%,#E3E9F7 44%,rgba(227,233,247,.8) 57%,rgba(170,190,228,.45) 71%,rgba(80,105,160,.18) 86%,rgba(14,29,58,0) 100%),#0e1d3a}
}

/* v2 : carte qui flotte sous la main (ordinateur et tablette en largeur). --illu-h = hauteur de l'image. */
@media (min-width:761px){
  .hero .hero-visual.illu-hero-zone{--illu-h:clamp(340px,40vw,540px);align-items:flex-end}
  .hero .hero-visual.illu-hero-zone .illu-hero{position:relative;z-index:2;margin-right:clamp(0px,2vw,24px)}
  .hero .hero-visual.illu-hero-zone .hero-card{z-index:1;left:auto;top:auto;right:calc(var(--illu-h) * .514 + clamp(0px,2vw,24px) - 30px);bottom:calc(var(--illu-h) * .652);transform:translateY(100%);animation:illu-flotte 5s ease-in-out infinite}
}
@keyframes illu-flotte{0%,100%{transform:translateY(100%)}50%{transform:translateY(calc(100% - 9px))}}
@media (prefers-reduced-motion:reduce){.hero .hero-visual.illu-hero-zone .hero-card{animation:none}}
