/* ------------------------------------------------------------------
   Legal Testa — page d'accueil issue de la maquette Figma
   Fichier B0LUcqMkbtbtC66TfoAk5o, node 2002:1473 « Home - 1 »
   Chargée uniquement sur cette page (voir functions.php du thème enfant)
   ------------------------------------------------------------------ */

/* --- fin de titre en dégradé --- */
/* Bornes de dégradé relevées titre par titre dans la maquette. Le dégradé porte
   sur toute la boîte du titre, comme dans Figma, et le début de phrase est
   ramené en navy plein. */
.lt-gradbox .elementor-heading-title,
.lt-gradbox.elementor-widget-heading .elementor-heading-title{
  background-image:linear-gradient(90deg,#023653 37.5%,#847563 60.577%,#8EB2B4 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.lt-gradbox--a .elementor-heading-title{background-image:linear-gradient(90deg,#023653 0%,#847563 22.596%,#8EB2B4 57.692%);}
.lt-gradbox--b .elementor-heading-title{background-image:linear-gradient(90deg,#023653 0%,#847563 26.923%,#8EB2B4 55.288%);}
.lt-gradbox--c .elementor-heading-title{background-image:linear-gradient(90deg,#023653 0%,#847563 22.596%,#8EB2B4 55.769%);}
.lt-gradbox--d .elementor-heading-title{background-image:linear-gradient(90deg,#023653 0%,#847563 19.712%,#8EB2B4 38.462%);}
.lt-gradbox .lt-plain{-webkit-text-fill-color:#023653;}

/* le hero et la carte d'appel à l'action gardent la forme en span isolé */
.lt-grad{
  background-image:linear-gradient(90deg,#023653 37.5%,#847563 60.577%,#8EB2B4 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

/* calque de décor calé sur les 1440 px de la maquette, centré */
.lt-decor-layer{left:50%!important;transform:translateX(-50%);pointer-events:none;}
.lt-equipe-fenetre{overflow:hidden;}
.lt-caps{text-transform:uppercase;font-weight:500;}

/* Dans la maquette, l'espacement vient des gaps de flex, pas des marges de
   paragraphe. La marge par défaut de l'éditeur de texte gonflait toutes les
   hauteurs (la boîte des questions passait de 431 à 559 px). */
.elementor-34492 .elementor-widget-text-editor p{margin-top:0;}
.elementor-34492 .elementor-widget-text-editor p:last-child{margin-bottom:0;}
.elementor-34492 .elementor-widget-text-editor p + p{margin-top:14px;}

/* --- pastille tarifaire du hero --- */
.lt-badge{width:242px;transform:rotate(9deg);}
.lt-badge svg{display:block;width:100%;height:auto;}
.lt-badge-ring{font-family:"Geist",system-ui,sans-serif;font-size:12.5px;letter-spacing:.2em;}
.lt-badge-price{font-family:"Outfit",sans-serif;font-size:41px;font-weight:500;letter-spacing:-.01em;}
.lt-badge-sub{font-family:"Geist",system-ui,sans-serif;font-size:14px;}

/* --- décors du hero --- */
.lt-hero-blob img{transform:rotate(-157.54deg) scaleY(-1);}
.lt-hero-cut img{border-radius:48px 48px 0 0;}
.lt-sparkle img{transform:translateY(-4px);}

/* --- traits décoratifs récurrents --- */
.lt-doodle img{transform:rotate(61.67deg);opacity:.9;}
/* Plusieurs décors sont volontairement plus larges que leur conteneur (halos flous,
   anneaux, formes derrière les photos). Le max-width:100% du thème les rabotait,
   ce qui décalait leur centre et faisait disparaître l'effet. */
.lt-deco img{max-width:none;}

/* halos flous de la carte « bilan » : l'opacité est déjà dans le SVG (0.5 et 0.31),
   ne pas l'assombrir une seconde fois ici */
.lt-halo{pointer-events:none;}
.lt-bilan-carte{overflow:hidden;}
.lt-bilan-col-g{align-self:stretch;}
.lt-op65 img{opacity:.65;}
.lt-bande-sep img{opacity:.9;}
.lt-bande .lt-bande-sep:nth-of-type(1) img{transform:rotate(-178.74deg) scaleY(-1);}

/* --- listes cochées --- */
.lt-checklist ul.lt-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.lt-checks li{position:relative;padding-left:38px;font-size:14px;line-height:1.45;color:rgba(2,54,83,.75);}
.lt-checks li::before{content:"";position:absolute;left:0;top:0;width:24px;height:24px;border-radius:8px;background:#8EB2B4;}
.lt-checks li::after{content:"";position:absolute;left:8.5px;top:5.5px;width:6px;height:11px;
  border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);}
.lt-checks--clair li{font-size:16px;color:#F6F5F1;padding-left:50px;}
.lt-checks--clair li::before{width:26px;height:26px;}
.lt-checks--clair li::after{left:9.5px;top:6.5px;}

/* --- mockup « Mon dossier famille » --- */
.lt-dossier-carte{overflow:hidden;}
.lt-pill-check{flex:0 0 24px;}
.lt-curve img{opacity:.55;}
.lt-fade{background-image:linear-gradient(180deg,rgba(255,255,255,0) 0%,#fff 100%);pointer-events:none;}
.lt-qr-carte{overflow:hidden;}
.lt-qr-ring{opacity:.35;}
.lt-qr-wrap{position:relative;}

/* --- section « l'essentiel » --- */
/* Les cercles concentriques sont un seul SVG (dégradés radiaux + traits), pas des
   bordures CSS : il est centré et remonte de 759 px au-dessus de la section. */
.lt-essentiel{overflow:hidden;}
.lt-grid-lines{left:50%!important;transform:translateX(-50%);opacity:.72;pointer-events:none;}
.lt-offres-panneau{overflow:hidden;}
.lt-offres-vector{pointer-events:none;}
.lt-offre-cta .elementor-button{display:flex;align-items:center;justify-content:space-between;width:100%;}
.lt-offre-cta .elementor-button-icon{width:56px;display:flex;justify-content:center;align-items:center;}
/* le chevron fait 6x12 px dans la maquette */
.lt-offre-cta .elementor-button-icon svg,
.lt-offre-cta .elementor-button-icon img{width:6px!important;height:12px!important;}

/* --- cartes « l'essentiel » --- */
.lt-carte-icone img{transform:rotate(10.77deg);}

/* --- carte tarifaire --- */
.lt-offre-ruban{background-image:linear-gradient(97deg,#8EB2B4 0%,rgba(142,178,180,.1) 100%);}
.lt-prix{display:flex;flex-wrap:wrap;align-items:center;gap:4px;color:#F6F5F1;line-height:1;}
.lt-prix-montant{font-family:"Outfit",sans-serif;font-size:56px;font-weight:500;letter-spacing:-.03em;}
.lt-prix-unite{font-family:"Outfit",sans-serif;font-size:13px;color:#F8FAFC;}
.lt-prix-pers{flex-basis:100%;font-family:"Outfit",sans-serif;font-size:16px;letter-spacing:-.03em;line-height:1.33;}
.lt-offre .elementor-button{width:100%;justify-content:center;}

/* --- orbite du réseau d'experts --- */
.lt-ring img{opacity:.85;}
/* les pastilles sont positionnées en absolu : sans largeur explicite Elementor
   les étire sur 100 % du parent, on les laisse épouser leur contenu */
.lt-orbite .lt-expert-pill{width:max-content;max-width:none;box-shadow:0 6px 18px rgba(2,54,83,.08);}
.lt-expert-av img{object-fit:cover;}

/* --- photos de l'équipe --- */
.lt-equipe-carte{overflow:hidden;}
.lt-equipe-carte--pale{opacity:.58;}
.lt-equipe-blob img{transform:rotate(-171.6deg);}

/* --- FAQ --- */
.lt-accordeon .elementor-accordion-item{background:#fff;border:1px solid #EDEDF8;border-radius:24px;margin-bottom:16px;overflow:hidden;}
.lt-accordeon .elementor-tab-title{padding:16px 20px 16px 32px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.lt-accordeon .elementor-tab-title.elementor-active{background:#F8FAFC;}
.lt-accordeon .elementor-accordion-icon{width:32px;flex:0 0 32px;order:2;}
.lt-accordeon .elementor-accordion-icon{font-size:32px;}
.lt-accordeon .elementor-accordion-icon svg,
.lt-accordeon .elementor-accordion-icon img{width:32px!important;height:32px!important;}
.lt-accordeon .elementor-tab-content{padding:0 32px 20px;border:0;background:#F8FAFC;}
.lt-accordeon .lt-a-rediger{opacity:.55;font-style:italic;}

/* --- appel à l'action final --- */
.lt-cta-carte{overflow:hidden;}
.lt-cta-photo::after{content:"";position:absolute;inset:0;
  background-image:linear-gradient(101deg,rgba(2,54,83,0) 44%,#023653 90%);}
.lt-cta-photo{position:absolute;}
.lt-cta-vector img{opacity:.18;}
.lt-cta-ligne{display:flex;flex-wrap:wrap;align-items:center;gap:18px;
  font-family:"Geist",system-ui,sans-serif;font-size:20px;color:#F6F5F1;}
.lt-cta-pastille{font-family:"Outfit",sans-serif;font-size:20px;font-weight:500;color:#F6F5F1;
  background:rgba(246,245,241,.12);border:1px solid #F6F5F1;border-radius:87px;padding:6px 10px;}

/* ==================================================================
   ÉTATS INTERACTIFS
   La maquette ne décrit aucun survol : ces états sont ajoutés pour
   l'usage réel. Elementor pose déjà transition:.3s sur les boutons.
   Les effets de survol sont réservés aux appareils à pointeur, sinon
   l'état reste « collé » après un appui sur mobile.
   ================================================================== */
@media (hover:hover) and (pointer:fine){
  /* Elementor génère des sélecteurs à 4 classes pour la couleur de fond :
     sans !important, le survol serait ignoré sans rien signaler. */
  .elementor-34492 .lt-btn .elementor-button:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 34px rgba(55,113,146,.28)!important;
  }
  .elementor-34492 .lt-btn--plein .elementor-button:hover{background-color:#01283D!important;}
  /* le bouton clair passe au blanc : le texte navy reste lisible */
  .elementor-34492 .lt-btn--clair .elementor-button:hover{background-color:#FFFFFF!important;}
  .elementor-34492 .lt-btn .elementor-button:active{
    transform:translateY(0);
    box-shadow:0 8px 16px rgba(55,113,146,.22)!important;
  }
  /* FAQ : la ligne réagit au survol, elle est cliquable */
  .elementor-34492 .lt-accordeon .elementor-tab-title:hover{background-color:#F8FAFC!important;}
  .elementor-34492 .lt-accordeon .elementor-tab-title:hover .elementor-accordion-icon{opacity:.75;}
}
.elementor-34492 .lt-accordeon .elementor-tab-title{transition:background-color .25s ease;}
.elementor-34492 .lt-accordeon .elementor-accordion-icon{transition:opacity .25s ease;}

/* Focus clavier : anneau turquoise, lisible sur crème comme sur navy */
.elementor-34492 .elementor-button:focus-visible,
.elementor-34492 .lt-accordeon .elementor-tab-title:focus-visible{
  outline:3px solid #8EB2B4!important;
  outline-color:#8EB2B4!important;
  outline-offset:3px;
}
/* on ne montre pas l'anneau au simple clic souris */
.elementor-34492 .elementor-button:focus:not(:focus-visible){outline:none;}

@media (prefers-reduced-motion:reduce){
  .elementor-34492 .lt-btn .elementor-button:hover,
  .elementor-34492 .lt-btn .elementor-button:active{transform:none;}
  .elementor-34492 *{transition-duration:.01ms!important;animation-duration:.01ms!important;}
}

/* ==================================================================
   VERSION MOBILE — d'après la planche Figma « Responsive - Home 1 »
   (node 2050:265, 440 x 13688 px).
   Parti pris du designer : les compositions desktop sont conservées et
   réduites, pas remises en flux. La mise en page est construite sur la
   largeur de référence 440 px, puis ramenée à l'échelle de l'écran.
   ================================================================== */

/* --- portables : réduction par paliers plutôt que rognage --- */
@media (min-width:1380px) and (max-width:1439px){ .elementor-34492{zoom:.96;} }
@media (min-width:1320px) and (max-width:1379px){ .elementor-34492{zoom:.92;} }
@media (min-width:1260px) and (max-width:1319px){ .elementor-34492{zoom:.88;} }
@media (min-width:1200px) and (max-width:1259px){ .elementor-34492{zoom:.84;} }

/* --- sous 1200 px : tout passe en colonne --- */
@media (max-width:1199px){
  .elementor-34492{overflow-x:hidden;}
  .elementor-34492 .e-con,
  .elementor-34492 .e-con>.e-con-inner,
  .elementor-34492 .elementor-widget{max-width:100%!important;}
  .elementor-34492 img{max-width:100%!important;height:auto!important;}
  .elementor-34492 .lt-deco img{max-width:none!important;}

  .lt-section{padding-left:25px!important;padding-right:25px!important;}
  .lt-row{flex-direction:column!important;align-items:center!important;gap:56px!important;}
  .lt-row > .e-con{width:100%!important;max-width:440px;}
  .lt-decor-layer{display:none!important;}

  .lt-bande{flex-wrap:wrap!important;gap:12px 28px!important;padding:16px 24px!important;}
  .lt-bande .lt-bande-sep{display:none!important;}

  .lt-bilan{padding-top:72px!important;padding-bottom:72px!important;}
  .lt-bilan-inner{flex-direction:column!important;align-items:center;gap:0!important;}
  .lt-bilan-col-g,.lt-bilan-carte{width:100%!important;max-width:440px;}
  .lt-bilan-col-g{padding:20px 0 0!important;}
  .lt-bilan-questions{border-radius:16px 16px 0 0!important;border-width:1px 1px 0 1px!important;min-height:0!important;}
  .lt-bilan-carte{border-radius:0 0 16px 16px!important;min-height:0!important;}
  .lt-equipe-photos{justify-content:center;}
}

/* ------------------------------------------------------------------
   Téléphone : la mise en page de la planche mobile, référence 440 px
   ------------------------------------------------------------------ */
@media (max-width:767px){
  .lt-section{padding-top:60px!important;padding-bottom:60px!important;}
  .lt-row{gap:56px!important;}

  /* ---- hero : texte centré, titre conservé à 54 px ---- */
  /* creux repris plus bas, bloc MOBILE du 23/09 */
  .lt-hero{padding-bottom:256px!important;}
  .lt-hero .lt-hero-inner{flex-direction:column;justify-content:flex-start;
    align-items:center;gap:0;min-height:0;padding:40px 0 0;}
  .lt-hero .lt-hero-inner > .e-con{align-items:center!important;gap:34px!important;}
  .lt-hero h1{font-size:54px!important;line-height:1.05!important;text-align:center;}
  /* les blocs de titre de la planche mobile font 132 px de haut pour 3 lignes,
     soit ~42 px et non les 48 px du desktop */
  .lt-section h2{font-size:42px!important;line-height:1.05!important;}
  .lt-hero .elementor-widget-text-editor,
  .lt-hero .elementor-widget-text-editor p{font-size:20px!important;text-align:center;}
  .lt-hero .lt-hero-inner > .e-con > .e-con{flex-direction:row!important;
    justify-content:center!important;flex-wrap:wrap;gap:10px!important;}
  .elementor-34492 .elementor-button{padding:18px 12px!important;}

  .lt-hero-photo{position:static!important;margin:129px auto 0;width:100%!important;max-width:390px;}
  .lt-hero-photo img{width:100%!important;border-radius:36px!important;}
  .lt-hero-cut,.lt-sparkle{display:none!important;}
  /* la virgule reste visible, au-dessus du coin haut droit de la photo */
  .lt-hero-blob{display:block!important;position:absolute!important;
    left:auto!important;right:8%!important;top:auto!important;bottom:458px!important;
    width:96px!important;z-index:3!important;}
  .lt-hero-blob img{width:96px!important;}
  /* pastille tarifaire : pleine taille, à cheval sur le bas de la photo */
  .lt-badge-wrap{position:absolute!important;left:50%!important;right:auto!important;
    top:auto!important;bottom:-146px!important;width:242px!important;
    margin-left:-83px!important;z-index:7!important;}
  .lt-badge{width:242px;}

  /* ---- bandeau ---- */
  .lt-bande{display:grid!important;grid-template-columns:1fr 1fr;gap:10px 16px!important;
            padding:18px 20px!important;justify-items:center;}
  .lt-bande .elementor-heading-title{font-size:14px!important;text-align:center;line-height:1.3;}

  /* ---- maquettes au pixel : réduites en bloc, pas démontées ----
     Sélecteurs préfixés par .elementor-34492 : sans cela la règle générique
     .elementor-34492 .e-con{max-width:100%} l'emporte et rogne le bloc
     avant sa réduction. */
  .elementor-34492 .e-con.lt-dossier-carte{width:586px!important;max-width:none!important;flex:0 0 auto!important;
    transform:scale(.657);transform-origin:top left;margin-bottom:-145px!important;}
  .elementor-34492 .e-con.lt-qr-wrap{width:524px!important;max-width:none!important;flex:0 0 auto!important;
    transform:scale(.62);transform-origin:top left;margin:0 0 -161px 46px!important;}
  /* Le schema des experts debordait sa propre boite. Mesure au navigateur :
     son contenu s'etend sur 652 px de mise en page, parce que la pastille
     « Estimation immobiliere » sort du canevas de 587 px. A l'echelle .7915 il
     rendait 455 px de large dans une fenetre de 390, donc rogne des deux cotes.
     Largeur portee a l'etendue reelle du contenu, echelle recalculee pour tenir
     dans la planche de 440 px comme dans les paliers de zoom en dessous.
     Verifie de 320 a 500 px : marges symetriques, jamais moins de 10 px, aucun
     debordement de page. Marge basse = -563 x (1 - 0.62) = -214, pour que la
     boite n'occupe que sa hauteur reduite. */
  .elementor-34492 .e-con.lt-orbite{width:652px!important;max-width:none!important;flex:0 0 auto!important;
    transform:scale(.62);transform-origin:top center;margin-bottom:-214px!important;align-self:center;}
  .elementor-34492 .e-con.lt-equipe-photos{width:678px!important;max-width:none!important;flex:0 0 auto!important;
    flex-wrap:nowrap!important;transform:scale(.569);transform-origin:top left;
    margin-bottom:-197px!important;}
  .elementor-34492 .lt-equipe-photos > .e-con{max-width:none!important;}

  /* le décalage haut des colonnes de texte vient du desktop */
  .lt-dossier .lt-row > .e-con-inner > .e-con:not(.lt-dossier-carte):not(.lt-qr-wrap){padding-top:0!important;}
  .lt-dossier{--row-gap:56px!important;--gap:0px 56px!important;}

  /* ---- l'essentiel ---- */
  .lt-carte{width:100%!important;}
  .elementor-34492 .lt-grid-lines{width:1520px!important;max-width:none!important;}
  .lt-offres-panneau{padding:40px 24px 60px!important;border-radius:24px!important;}
  .lt-offre{width:100%!important;max-width:392px;}

  /* ---- appel à l'action : la photo saute, les boutons s'empilent ---- */
  .lt-cta{padding-left:11px!important;padding-right:11px!important;}
  .lt-cta-carte{padding:78px 32px!important;border-radius:24px!important;justify-content:center;}
  .lt-cta-photo{display:none!important;}
  .lt-cta-carte h2{font-size:42px!important;line-height:1.05!important;}
  .lt-cta-carte > .e-con{align-items:center!important;}
  .lt-cta-ligne{justify-content:center;text-align:center;}
  .lt-cta-carte > .e-con > .e-con{flex-direction:column!important;
    align-items:center!important;gap:24px!important;}

  /* ---- FAQ ---- */
  .lt-accordeon .elementor-accordion-item{border-radius:20px;margin-bottom:16px;}
  .lt-accordeon .elementor-tab-title{padding:16px 20px 16px 32px;}
}

/* Sous 440 px, la planche est simplement mise à l'échelle de l'écran :
   la mise en page reste celle du design, seule la taille change. */
@media (max-width:439px){ .elementor-34492{zoom:.96;} }
@media (max-width:419px){ .elementor-34492{zoom:.92;} }
@media (max-width:399px){ .elementor-34492{zoom:.88;} }
@media (max-width:379px){ .elementor-34492{zoom:.84;} }
@media (max-width:359px){ .elementor-34492{zoom:.79;} }
@media (max-width:339px){ .elementor-34492{zoom:.74;} }

/* ==================================================================
   BLOC NEWSLETTER
   Le formulaire vient de l'extension Brevo (#1 « News-footer-website »,
   liste 46). Brevo injecte ses propres styles en ligne avec un sélecteur
   d'identifiant : il faut donc au moins autant de poids pour l'habiller.
   ================================================================== */
.lt-newsletter .lt-nl-form{width:100%;}
.elementor-34492 .lt-nl-form form#sib_signup_form_1{
  padding:0!important;display:flex;flex-wrap:wrap;gap:12px;
  align-items:center;justify-content:center;
}
.elementor-34492 .lt-nl-form form#sib_signup_form_1 .sib_signup_box_inside_1{
  display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;width:100%;
}
.elementor-34492 .lt-nl-form form#sib_signup_form_1 p{margin:0;}
.elementor-34492 .lt-nl-form form#sib_signup_form_1 p.sib-email-area{flex:1 1 300px;max-width:360px;}
.elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=email]{
  width:100%!important;margin:0!important;
  font-family:"Geist",system-ui,sans-serif;font-size:16px;color:#023653;
  background:#FFFFFF;border:1px solid #D5E7E8!important;border-radius:12px;
  padding:17px 20px;height:auto;box-sizing:border-box;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=email]::placeholder{color:rgba(2,54,83,.45);}
.elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=submit]{
  font-family:"Geist",system-ui,sans-serif;font-size:16px;font-weight:500;text-transform:uppercase;
  color:#FFFFFF!important;background-color:#023653!important;
  border:0;border-radius:12px!important;padding:18px 28px!important;
  cursor:pointer;line-height:1.2;
  box-shadow:0 14px 30px rgba(55,113,146,.2);
  transition:background-color .3s ease, transform .3s ease, box-shadow .3s ease;
}
/* le reCAPTCHA du formulaire prend toute la ligne et se centre */
.elementor-34492 .lt-nl-form #sib_captcha{flex-basis:100%;display:flex;justify-content:center;}
.elementor-34492 .lt-nl-form .sib_msg_disp{flex-basis:100%;text-align:center;}

@media (hover:hover) and (pointer:fine){
  .elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=submit]:hover{
    background-color:#01283D!important;transform:translateY(-2px);
    box-shadow:0 18px 34px rgba(55,113,146,.28);
  }
  .elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=email]:hover{border-color:#8EB2B4!important;}
}
.elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=email]:focus-visible,
.elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=submit]:focus-visible{
  outline:3px solid #8EB2B4!important;outline-offset:3px;
}

@media (max-width:767px){
  .lt-newsletter{padding-top:64px!important;padding-bottom:64px!important;}
  .lt-newsletter h2{font-size:30px!important;}
  .elementor-34492 .lt-nl-form form#sib_signup_form_1 .sib_signup_box_inside_1{flex-direction:column;}
  .elementor-34492 .lt-nl-form form#sib_signup_form_1 p.sib-email-area{flex:1 1 auto;width:100%;max-width:none;}
  .elementor-34492 .lt-nl-form form#sib_signup_form_1 input[type=submit]{width:100%;}
}

/* ------------------------------------------------------------------
   PHOTOS DE FOND DES CARTES DOSSIER — ajouté le 23/09/2026
   ------------------------------------------------------------------
   Les maquettes Figma « Mon dossier famille » ont été remplacées par de
   vraies photos, posées en image de fond de conteneur dans Elementor sans
   renseigner Taille ni Répétition. Elementor n'émet alors ni background-size
   ni background-repeat, et les valeurs CSS par défaut s'appliquent :
   background-repeat:repeat et background-size:auto.
     - « Vos personnes de confiance » : vignette de 300 x 195 dans une boîte
       de 609 x 391, donc la photo se répétait en mosaïque 2 x 2.
     - « Votre dossier papier » et la carte du bloc « Sans organisation » :
       photos de 768 px dans des boîtes de 586, donc seul le coin haut gauche
       était visible.
   Correctif de surface : le geste durable est dans Elementor (Fond > Taille :
   Couvrir, Répétition : Pas de répétition, Position : Centre centre), à faire
   quand l'éditeur n'est plus ouvert, puis à retirer ce bloc. */
.elementor-34492 .e-con.lt-dossier-carte{
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
}
/* La carte « Vos personnes de confiance » pointe la vignette medium (300 x 195)
   alors que le fichier d'origine fait 608 x 396, soit très exactement la taille
   de sa boîte. Sans cela, « cover » agrandirait la vignette deux fois et la
   photo serait floue. Règle accrochée à un identifiant Elementor : à retirer en
   même temps que le bloc ci-dessus. */
.elementor-34492 .elementor-element-4a2ec2c{
  background-image:url("https://legal-testa.ch/wp-content/uploads/2026/09/carte-personne-de-confiance.png")!important;
}

/* ------------------------------------------------------------------
   MOBILE : VISUEL DU HERO ET BANDEAU DÉFILANT — ajouté le 23/09/2026
   ------------------------------------------------------------------ */

/* --- 1. le visuel du hero revient sur téléphone ---
   La photo portait « Masquer sur mobile » et « Masquer sur tablette » dans
   Elementor, réglages posés lors de la passe d'allègement du mobile qui a
   masqué 24 éléments. Elementor applique alors
   @media (max-width:767px){.elementor .elementor-hidden-mobile{display:none}}
   qu'aucune règle de position ne pouvait contourner. On ne rouvre que le
   téléphone : sur tablette la photo reprendrait son calage absolu de bureau
   (744 px de décalage pour une largeur de 524) et déborderait. */
@media (max-width:767px){
  .elementor-34492 .lt-hero-photo.elementor-hidden-mobile{display:block!important;}
  /* l'écart de 129 px et le creux de 256 px sous le hero avaient été calculés
     pour la pastille tarifaire, qui reste masquée sur mobile : sans eux la
     photo se recolle au bas du bloc */
  .elementor-34492 .lt-hero-photo{margin-top:56px!important;}
  .elementor-34492 .lt-hero{padding-bottom:60px!important;}
}

/* --- 2. le bandeau devient une ligne qui défile, sur téléphone seulement ---
   Les trois glyphes turquoise lt-bande-sep étaient masqués sous 1200 px et les
   quatre promesses repliées en grille 2 x 2. Sur téléphone elles reprennent
   une seule ligne, séparateurs compris, qui défile en continu. Le défilement
   sans raccord suppose deux pistes identiques côte à côte, chacune translatée
   de sa propre largeur : la duplication est faite en JavaScript dans
   functions.php, car Elementor ne permet pas d'envelopper les widgets. */
@media (min-width:768px){
  /* hors téléphone, la piste s'efface et les widgets redeviennent enfants
     directs du conteneur : la mise en page de bureau est inchangée */
  .lt-bande-piste{display:contents;}
  .lt-bande-piste[aria-hidden="true"]{display:none;}
}
@media (max-width:767px){
  .elementor-34492 .lt-bande{
    display:flex!important;
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    align-items:center!important;
    gap:0!important;
    overflow:hidden!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .lt-bande-piste{
    display:flex;
    flex:0 0 auto;
    align-items:center;
    gap:26px;
    padding-right:26px;
    animation:lt-bande-defile 18s linear infinite;
    will-change:transform;
  }
  /* un séparateur ferme chaque piste, sinon « Assistance pour vos proches »
     toucherait « Dossier Famille » au raccord */
  .lt-bande-piste::after{
    content:"";flex:0 0 27px;width:27px;height:27px;
    background:url("https://legal-testa.ch/wp-content/uploads/2022/08/lt-bande-sep-2.svg") center/contain no-repeat;
  }
  .elementor-34492 .lt-bande .lt-bande-sep{display:block!important;flex:0 0 auto;}
  .elementor-34492 .lt-bande > .lt-bande-piste > .elementor-widget{flex:0 0 auto;}
  .elementor-34492 .lt-bande .elementor-heading-title{white-space:nowrap;}
}
@keyframes lt-bande-defile{
  from{transform:translateX(0);}
  to{transform:translateX(-100%);}
}
/* mouvement réduit : la ligne ne défile plus toute seule, elle se fait glisser */
@media (prefers-reduced-motion:reduce) and (max-width:767px){
  .lt-bande-piste{animation:none;}
  .elementor-34492 .lt-bande{overflow-x:auto!important;}
  .lt-bande-piste[aria-hidden="true"]{display:none;}
}

/* ------------------------------------------------------------------
   MOBILE : L'ILLUSTRATION PASSE SOUS LE TITRE — ajouté le 23/09/2026
   ------------------------------------------------------------------
   Dans quatre blocs, l'illustration est première dans l'ordre du document et
   se retrouvait donc au-dessus du titre une fois la rangée empilée :
   « Sans organisation », « Votre dossier papier », « Vos personnes de
   confiance » et « Vous prenez rendez-vous avec vos experts ». L'ordre voulu
   est titre, illustration, texte.

   L'illustration et le texte sont deux conteneurs frères, le titre étant
   enfermé dans le second. Pour glisser l'illustration entre le titre et le
   paragraphe, la colonne de texte passe en display:contents : elle cesse de
   produire une boîte, ses widgets deviennent frères de l'illustration, et
   l'ordre se règle alors widget par widget. Les quatre colonnes ne contiennent
   que des widgets, aucun conteneur imbriqué, l'opération est donc sans effet
   de bord. Le hero n'est pas touché : sa photo reste après les deux boutons,
   pour ne pas les repousser hors du premier écran. */
@media (max-width:767px){
  /* la rangée reprend la main sur son empilement plutôt que de dépendre des
     propriétés personnalisées d'Elementor (--flex-direction, --row-gap) */
  .lt-dossier .lt-row > .e-con-inner,
  .lt-expert  .lt-row > .e-con-inner{
    display:flex!important;
    flex-direction:column!important;
    flex-wrap:nowrap!important;
    /* flex-start et non center : les visuels sont mis à l'échelle avec
       transform-origin:top left et doivent partir de leur bord gauche */
    align-items:flex-start!important;
    gap:29px!important;
  }
  .lt-dossier .lt-row > .e-con-inner > .e-con:not(.lt-dossier-carte):not(.lt-qr-wrap),
  .lt-expert  .lt-row > .e-con-inner > .e-con:not(.lt-orbite){
    display:contents!important;
  }
  /* Les sélecteurs suivants descendent d'un cran, jusqu'à la colonne de texte.
     display:contents change la participation à la mise en page, pas l'arbre du
     document : le titre reste enfant de la colonne, pas de .e-con-inner. Un
     sélecteur .e-con-inner > .elementor-widget-heading ne correspond donc à
     rien, et les widgets gardaient order:0, ce qui renvoyait l'illustration
     après le texte au lieu de l'intercaler. */
  /* par défaut, tout ce qui remonte se place après l'illustration */
  .lt-dossier .lt-row > .e-con-inner > .e-con:not(.lt-dossier-carte):not(.lt-qr-wrap) > .elementor-widget,
  .lt-expert  .lt-row > .e-con-inner > .e-con:not(.lt-orbite) > .elementor-widget{
    order:3;width:100%!important;max-width:440px;
  }
  /* le titre passe en tête */
  .lt-dossier .lt-row > .e-con-inner > .e-con:not(.lt-dossier-carte):not(.lt-qr-wrap) > .elementor-widget-heading,
  .lt-expert  .lt-row > .e-con-inner > .e-con:not(.lt-orbite) > .elementor-widget-heading{order:1;}
  /* l'illustration se glisse juste dessous */
  .lt-dossier .lt-row > .e-con-inner > .lt-dossier-carte,
  .lt-expert  .lt-row > .e-con-inner > .lt-orbite{order:2;}
}


/* ------------------------------------------------------------------
   MOBILE : TITRE DE L'APPEL A L'ACTION CENTRE — ajoute le 23/09/2026
   ------------------------------------------------------------------
   Dans la carte finale, la phrase d'accroche, la pastille tarifaire et les deux
   boutons sont centres, mais le titre restait ferre a gauche. Selecteur accroche
   aux classes de la carte plutot qu'a un identifiant Elementor, pour survivre a
   une reconstruction du bloc. */
@media (max-width:767px){
  .lt-cta .lt-cta-carte .elementor-widget-heading .elementor-heading-title{text-align:center;}
}
