.lhp{position:relative;padding:12px 24px 0;font-family:'Lomed Jakarta','Lomed repli A','Lomed repli R',sans-serif}
.lhp *{box-sizing:border-box}
.lhp-carte{position:relative;max-width:1400px;margin:0 auto;border-radius:28px;overflow:hidden;isolation:isolate;
  background:radial-gradient(ellipse at 75% 50%,#1b1840 0%,#0b0c18 62%);box-shadow:0 30px 80px -30px rgba(40,30,80,.45)}
.lhp-grille{max-width:1260px;margin:0 auto;padding:62px 60px 18px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);
  grid-template-areas:"texte vis" "boutons cap";column-gap:40px;row-gap:32px;align-items:center}
.lhp-texte{grid-area:texte}.lhp-boutons{grid-area:boutons}.lhp-vis{grid-area:vis}.lhp-cap{grid-area:cap}
.lhp .lhp-h1{font-family:'Lomed Jakarta','Lomed repli A','Lomed repli R',sans-serif!important;font-size:clamp(34px,3.6vw,52px)!important;line-height:1.08!important;letter-spacing:-.035em!important;
  font-weight:800!important;margin:0 0 22px!important;max-width:9.8em;color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important}
.lhp .lhp-accent{background:linear-gradient(100deg,#ff7a59 10%,#c2607a 52%,#9b6bcc 92%)!important;-webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important}
.lhp .lhp-sous,.lhp .lhp-sous p{font-family:'Lomed Jakarta','Lomed repli A','Lomed repli R',sans-serif!important;font-size:17px!important;line-height:1.7!important;color:#b4b7cf!important;margin:0!important;max-width:38em}
.lhp .lhp-sous strong,.lhp .lhp-sous b{color:#fff!important;-webkit-text-fill-color:#fff!important;font-weight:700!important}
.lhp-boutons{display:flex;gap:12px;flex-wrap:wrap}
.lhp a.lhp-b1,.lhp a.lhp-b2{font-family:'Lomed Jakarta','Lomed repli A','Lomed repli R',sans-serif!important;display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:12px;font-weight:700;font-size:15px;text-decoration:none!important;
  white-space:nowrap;transition:transform .25s cubic-bezier(.16,1,.3,1),background .2s,border-color .2s}
.lhp a.lhp-b1{background:#ff7a59;color:#fff!important;-webkit-text-fill-color:#fff!important;box-shadow:0 12px 30px -10px rgba(255,122,89,.75)}
.lhp a.lhp-b2{border:1.5px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff!important;-webkit-text-fill-color:#fff!important}
.lhp a.lhp-b1:hover,.lhp a.lhp-b2:hover{transform:translateY(-2px)}.lhp a.lhp-b2:hover{border-color:#ff7a59}
.lhp a.lhp-b1:focus-visible,.lhp a.lhp-b2:focus-visible{outline:2px solid #fff;outline-offset:3px}
.lhp-boutons svg{width:16px;height:16px;flex:none}
.lhp-vis{position:relative;height:380px}
/* le canvas déborde de 50 px en haut et en bas : le nuage qui tourne n'est pas coupé net */
.lhp-vis canvas{position:absolute;top:-50px;bottom:-50px;left:0;width:100%;height:calc(100% + 100px);display:block;pointer-events:none}
.lhp-cap{position:relative;min-height:1.2em;text-align:center;font-family:'Lomed Jakarta','Lomed repli A','Lomed repli R',sans-serif;font-size:clamp(26px,2.7vw,42px);font-weight:800;letter-spacing:-.04em;line-height:1.15;
  pointer-events:none;filter:drop-shadow(0 0 28px rgba(155,107,204,.5));white-space:nowrap}
.lhp-cap .lhp-w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .02em .1em 0}
.lhp-cap .lhp-w span{display:inline-block;transform:translateY(115%);transition:transform .9s cubic-bezier(.16,1,.3,1);
  background:linear-gradient(180deg,#fff 35%,#cbbdf4 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.lhp-cap.lhp-in .lhp-w span{transform:none}
.lhp-cap.lhp-out .lhp-w span{transform:translateY(-115%);transition-duration:.34s;transition-delay:0s!important;transition-timing-function:cubic-bezier(.7,0,.84,0)}
@media (max-width:900px){
  .lhp{padding:8px 12px 0}.lhp-carte{border-radius:22px}
  .lhp-grille{grid-template-columns:1fr;grid-template-areas:"texte" "boutons" "vis" "cap";padding:40px 22px 24px;row-gap:24px;min-height:0}
  .lhp-vis{height:330px}.lhp-cap{white-space:normal;text-wrap:balance;font-size:26px;min-height:2.4em}}
/* Un seul fond sombre, pleine largeur, pour le header et les bandeaux de logos posés dans la même section ;
   passage au bloc blanc par une ligne lumineuse (choix de Max, 22/10/2026). Sans :has(), la carte arrondie reste sur le header seul. */
@supports selector(:has(*)){
  .dnd-column:has(.lhp){position:relative;float:none!important;width:auto!important;margin:0!important;padding:0 0 192px!important;overflow:hidden;isolation:isolate;
    background:radial-gradient(ellipse 60% 70% at 75% 38%,#1b1840 0%,#0b0c18 70%)!important}
  .dnd-column:has(.lhp)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:140px;pointer-events:none;
    background:linear-gradient(90deg,transparent 4%,#ff7a59 25%,#e9656a 50%,#9b6bcc 75%,transparent 96%) bottom/100% 3px no-repeat,
      radial-gradient(ellipse 50% 100% at 50% 100%,rgba(233,101,106,.55),rgba(155,107,204,.2) 50%,transparent 78%)}
  .dnd-column:has(.lhp) .lhp{padding:0}
  .dnd-column:has(.lhp) .lhp-carte{background:none;box-shadow:none;border-radius:0;overflow:visible}
  .dnd-column:has(.lhp) .logo-slider-custom .logos__item{border-color:rgba(255,255,255,.1)}
  /* le décalage d'apparition « fade-top » du thème ferait passer les logos sur la légende : neutralisé dans le bloc */
  .dnd-column:has(.lhp) .logo-slider-custom.fade-top{transform:none!important;opacity:1!important}
  /* de l'air sous le header : la première frise se cale en bas du premier écran, la seconde arrive au défilement.
     ponytail: 698 px = haut de la grille (94) + 44 + visuel 380 + 32 + boutons 54 + frise 94 ; à revoir si le menu ou le visuel change de hauteur */
  .dnd-column:has(.lhp) .lhp-grille{padding-top:44px;padding-bottom:103px;padding-bottom:clamp(24px,calc(100svh - 698px),170px)}
  .dnd-column:has(.lhp) .row-fluid-wrapper:has(.logo-slider-custom) + .row-fluid-wrapper .logo-slider-custom{margin-top:14px}
  /* avant l'initialisation de slick (retardée par Rocket Loader), les logos s'affichaient en 480 px les uns sous les autres :
     on les pose déjà en une ligne à leur taille finale */
  .dnd-column:has(.lhp) .logo-slider-custom:not(.slick-initialized){display:flex;overflow:hidden}
  .dnd-column:has(.lhp) .logo-slider-custom:not(.slick-initialized) .logos__item{flex:none}
  .dnd-column:has(.lhp) .logo-slider-custom:not(.slick-initialized) img{display:block;height:40px!important;width:auto!important;max-width:120px!important;object-fit:contain}
}
@media (max-width:900px){@supports selector(:has(*)){.dnd-column:has(.lhp){padding-bottom:156px!important}
  .dnd-column:has(.lhp) .lhp-grille{padding-top:48px;padding-bottom:24px}
  .dnd-column:has(.lhp) .logo-slider-custom:not(.slick-initialized) img{height:30px!important;max-width:90px!important}}}
/* Chiffres clés : bandeau de trois chiffres sous la seconde frise de logos (choix de Max, 22/10/2026).
   Hauteurs fixes : les trois libellés tombent sur la même ligne, et la place réservée en bas du bloc est exacte. */
.lhp-chiffres{font-family:'Lomed Jakarta','Lomed repli A','Lomed repli R',sans-serif;color:#b4b7cf;position:relative;z-index:1;box-sizing:border-box;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  max-width:960px;margin:40px auto 0;padding:0 24px;text-align:center}
.lhp-chiffres *{box-sizing:border-box}
.lhp-chiffres .lhp-c{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 16px}
.lhp-chiffres .lhp-c + .lhp-c{border-left:1px solid rgba(255,255,255,.12)}
.lhp-chiffres .lhp-n{display:block;height:48px;line-height:48px;font-weight:800;font-size:40px;letter-spacing:-.03em;white-space:nowrap;
  background:linear-gradient(100deg,#fff 20%,#ffd8cc 60%,#c9b4ef);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.lhp-chiffres .lhp-etoiles{font-size:30px;letter-spacing:.08em;background:linear-gradient(135deg,#ff7a59 0%,#c2607a 45%,#9b6bcc 100%);-webkit-background-clip:text;background-clip:text}
.lhp-chiffres .lhp-l{display:block;height:18px;font-size:14px;line-height:18px;white-space:nowrap}
@supports selector(:has(*)){
  /* dans le bloc pleine largeur, le bandeau se place tout en bas, sous les deux frises. Le bas du bloc (192 px, 156 en mobile)
     = 72 px jusqu'au bord + 80 px de bandeau + 40 px d'écart avec la frise */
  .dnd-column:has(.lhp) .lhp,.dnd-column:has(.lhp) .lhp-carte{position:static}
  .dnd-column:has(.lhp) .lhp-chiffres{position:absolute;left:0;right:0;bottom:72px;margin:0 auto}
}
@media (max-width:900px){
  .lhp-chiffres{margin-top:28px;padding:0 8px}.lhp-chiffres .lhp-c{padding:4px 6px}
  .lhp-chiffres .lhp-n{height:34px;line-height:34px;font-size:26px}.lhp-chiffres .lhp-etoiles{font-size:18px}
  /* libellés sur deux lignes au plus, place réservée pour deux : ils restent alignés */
  .lhp-chiffres .lhp-l{height:32px;font-size:12px;line-height:16px;white-space:normal}
  @supports selector(:has(*)){.dnd-column:has(.lhp) .lhp-chiffres{bottom:48px}}}
@media (prefers-reduced-motion:reduce){.lhp-cap .lhp-w span{transition:none}.lhp a.lhp-b1,.lhp a.lhp-b2{transition:none}}