/* Lot E — landings « Besoin » (Figma section 04). Classes pks-e-*. Valeurs relevées bureau 1440 / mobile 390. */

/* ---------- héros : carte claire + plan aux camions, titre fixe ---------- */
.pks-e-hero{padding:16px 16px 0!important;}
.pks-e-carte{background:var(--pks-clair);}
.pks-e-fond{position:absolute!important;inset:0;width:100%!important;height:100%;z-index:0;margin:0;}
.pks-e-fond img{width:100%;height:100%!important;object-fit:cover;object-position:50% 100%;display:block;}
.pks-e-contenu{max-width:995px;gap:80px;}
.pks-e-titre .elementor-heading-title{text-align:center;}
.pks-e-marqueur{position:absolute!important;width:0!important;height:0;z-index:1;pointer-events:none;}
.pks-e-marqueur--gauche{left:82px;bottom:186px;}
.pks-e-marqueur--droite{right:138px;bottom:74px;}
.pks-e-marqueur .pks-camion{width:40px!important;height:40px;margin:-20px 0 0 -20px;}
.pks-e-marqueur .pks-camion-ico svg{width:24px;height:24px;}

/* ---------- « Comment ça fonctionne ? » : 4 étapes numérotées sur pointillé ---------- */
.pks-e-fonctionnement > .pks-interne{gap:56px;}
.pks-e-sous{font-size:16px;line-height:24px;font-weight:600;color:rgba(9,9,11,.8);}
.pks-e-parcours{position:relative;gap:32px;padding-right:62px!important;}
.pks-e-parcours::before{content:"";position:absolute;left:24px;right:auto;width:calc(100% - 48px);height:0;top:23px;border-top:2px dashed #93C5FD;}
.pks-e-parcours::after{content:"";position:absolute;right:0;top:19px;width:10px;height:10px;border-radius:50%;background:var(--pks-bleu);box-shadow:0 0 0 2px #fff;}
.elementor-element.pks-e-etape{width:270px!important;flex:0 0 270px!important;gap:20px;position:relative;z-index:1;}
.pks-e-numero{width:auto;}
.pks-e-numero .elementor-heading-title{width:48px;height:48px;border-radius:24px;background:var(--pks-clair);display:flex;align-items:center;justify-content:center;
  font-size:16px;line-height:24px;font-weight:500;color:var(--pks-bleu);}
.pks-e-etape .pks-h6 .elementor-heading-title{max-width:260px;}

/* ---------- bento Packler Now des landings ---------- */
.pks-e-now .pks-bento-visuel{min-height:609px;}
.pks-e-etiquettes{flex-wrap:wrap!important;gap:9px;}
.pks-e-etiquette{width:auto;}
.pks-e-etiquette .elementor-heading-title{display:inline-block;padding:8px;border-radius:100px;background:#fff;font-size:14px;line-height:20px;font-weight:500;
  text-transform:uppercase;color:var(--pks-encre);}
.pks-e-bento-texte .pks-bento-texte-haut{gap:38px;}
.pks-e-pastille-photo{position:absolute!important;top:32px;left:32px;z-index:3;}
/* bénéfices : 3 colonnes centrées sur un pointillé */
.pks-e-benefices{position:relative;justify-content:space-between;}
.pks-e-benefices::before{content:"";position:absolute;left:24px;right:auto;width:calc(100% - 30px);height:0;top:23px;border-top:2px dashed #93C5FD;}
.pks-e-benefices::after{content:"";position:absolute;right:0;top:19px;width:10px;height:10px;border-radius:50%;background:var(--pks-bleu);box-shadow:0 0 0 2px #fff;}
.elementor-element.pks-e-benefice{flex:1 1 0!important;width:auto!important;align-items:center;gap:20px;position:relative;z-index:1;}
.pks-e-benefice .pks-ico .elementor-icon{color:var(--pks-bleu);}
.pks-e-benefice .pks-h5 .elementor-heading-title{text-align:center;}

/* ---------- réassurance avec carte de note ---------- */
.pks-e-carte-note{flex:1 1 0;justify-content:center;gap:6px;padding:24px 28px!important;border-radius:16px;background:var(--pks-clair);min-height:118px;}
.pks-e-note .elementor-heading-title{font-size:32px;line-height:36px;font-weight:600;letter-spacing:-.32px;color:var(--pks-encre);}
.pks-e-etoiles{gap:6px;width:auto!important;}
.pks-e-etoile{width:auto;}
.pks-e-etoile .elementor-icon{display:flex;color:var(--pks-bleu);}
.pks-e-etoile svg{width:16px;height:16px;fill:currentColor!important;stroke:currentColor;}
.pks-e-reassurance .pks-ico .elementor-icon{color:var(--pks-bleu);}

/* ---------- calcul du volume : visuel de 496 px ---------- */
.pks-e-calculez .pks-immersif{min-height:496px;}

@media (max-width:767px){
  .pks-e-hero{padding:84px 20px 0!important;}
  .pks-e-carte{padding:20px 20px 40px!important;}
  .pks-e-contenu{gap:48px;}
  /* camions en mouvement (variantes « Camion sur route — Mobile ») : le calque couvre la carte, trajets de site.css */
  .pks-e-marqueur{display:block;left:0!important;right:auto!important;top:0!important;bottom:auto!important;width:100%!important;height:100%!important;}
  .pks-e-marqueur .pks-camion{width:32px!important;height:32px;margin:-16px 0 0 -16px;}
  .pks-e-marqueur .pks-camion-ico svg{width:18px;height:18px;}
  .pks-e-marqueur--gauche{animation:pks-trajet-m-gauche 13.51s linear infinite;}
  .pks-e-marqueur--droite{animation:pks-trajet-m-droite 13.5s linear infinite;}
  .pks-e-fond img{object-position:50% 100%;}

  .pks-e-fonctionnement > .pks-interne{gap:32px;}
  .pks-e-fonctionnement .pks-e-sous{font-weight:500;margin-top:0;}
  .pks-e-parcours{gap:16px;padding-right:var(--pks-marge)!important;}
  .pks-e-parcours::before{width:620px;}
  .pks-e-parcours::after{display:none;}
  .elementor-element.pks-e-etape{width:168px!important;flex:0 0 168px!important;}

  .pks-e-now .pks-bento-visuel{min-height:300px;}
  .pks-e-etiquette .elementor-heading-title{font-size:12px;line-height:16px;padding:6px 8px;}
  .pks-e-etiquettes{flex-direction:column!important;align-items:flex-start;gap:8px;}
  .pks-e-pastille-photo{top:16px;left:16px;}
  .pks-e-benefices{flex-direction:column!important;gap:32px;}
  .pks-e-benefices::before{left:23px;width:0;height:auto;top:24px;bottom:24px;border-top:0;border-left:2px dashed #93C5FD;}
  .pks-e-benefices::after{display:none;}
  .elementor-element.pks-e-benefice{flex-direction:row!important;flex:none!important;width:100%!important;gap:16px;}
  .pks-e-benefice .pks-h5 .elementor-heading-title{text-align:left;font-size:18px;font-weight:500;}

  .pks-e-reassurance{flex-direction:column!important;gap:12px;overflow:visible!important;margin:0!important;padding:0!important;width:100%!important;}
  .pks-e-reassurance > .elementor-element{width:100%!important;min-height:0;}
  .pks-e-carte-note{padding:24px!important;border-radius:24px;}
  .pks-e-note .elementor-heading-title{font-size:22px;line-height:28px;}
  .pks-e-reassurance .pks-garantie{flex-direction:row!important;align-items:center;padding:24px!important;border-radius:24px;}

  /* calcul du volume : visuel en premier avec son titre, puis les étapes, puis le bouton (à droite) */
  .pks-e-calculez .pks-immersif .pks-h2{display:block;}
  .pks-e-calculez > .pks-interne > .pks-h2{display:none;}
  .pks-e-calculez .pks-calculez > .pks-immersif{order:0;min-height:260px;}
  .pks-e-calculez .pks-etapes > .pks-carrousel{order:1;}
  .pks-e-calculez .pks-etapes-actions{order:2;align-items:flex-end;}
  .pks-e-calculez .pks-calculez{gap:48px;}
}
@media (min-width:768px){
  .elementor-element.pks-e-bento-texte{flex:0 0 49.2%!important;}
  .pks-e-bento-visuel{min-width:0;}
  .pks-e-reassurance > .elementor-element{width:calc((100% - 64px) / 3)!important;flex:0 0 calc((100% - 64px) / 3)!important;}
}
@media (max-width:767px){
  .pks-e-reassurance > .elementor-element{flex:none!important;}
}
/* points des carrousels : le style de bouton du kit leur ajoute du rembourrage (défaut partagé, signalé au fil principal) */
.pks-e-page .pks-points button{padding:0!important;min-width:0!important;min-height:0!important;line-height:0;border:0!important;}