/* Ce que le constructeur ne sait pas produire.
   Chaque règle est appliquée par une classe posée sur un conteneur Elementor. */

/* Accent manuscrit dans un titre : <span class="sdh-script">mot</span> */
.sdh-script{
  font-family:var(--sdh-script);
  /* L'or de marque tombe à 2,90:1 sur le sable. L'or foncé passe l'AA partout
     sur fond clair ; sur fond sombre, c'est l'or clair qui prend le relais. */
  color:var(--sdh-or-texte);
  font-size:1.26em;
  line-height:1;
  font-weight:400;
}

/* Arche : bord gauche en ellipse, impossible avec le champ de rayon d'Elementor */
.sdh-arche-gauche{
  border-top-left-radius:200px 380px;
  border-bottom-left-radius:200px 380px;
  overflow:hidden;
}
.sdh-arche-gauche-haute{
  border-top-left-radius:200px 420px;
  border-bottom-left-radius:200px 420px;
  overflow:hidden;
}

/* Voile du hero : quatre points d'arrêt, la superposition d'Elementor n'en gère que deux.
   Le voile doit passer SOUS le texte, d'où l'empilement explicite. */
.sdh-voile-hero{position:relative;isolation:isolate}
.sdh-voile-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:linear-gradient(90deg,
    var(--sdh-creme) 0%,
    var(--sdh-creme) 32%,
    rgba(253,250,245,.88) 46%,
    rgba(253,250,245,0) 74%);
}
.sdh-voile-hero > *{position:relative;z-index:1}
@media (max-width:1060px){
  .sdh-voile-hero::after{
    background:linear-gradient(180deg,
      var(--sdh-creme) 0%, var(--sdh-creme) 30%,
      rgba(253,250,245,.9) 50%, rgba(253,250,245,.5) 100%);
  }
}

/* Texture de vagues du bandeau bleu nuit */
.sdh-vagues::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:
    radial-gradient(120% 70% at 12% 0%, rgba(90,150,200,.22), transparent 60%),
    radial-gradient(90% 60% at 88% 100%, rgba(184,130,47,.14), transparent 62%),
    repeating-linear-gradient(103deg, rgba(255,255,255,.035) 0 1px, transparent 1px 92px);
}
.sdh-vagues::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 400' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.08' stroke-width='1.5'%3E%3Cpath d='M0 300 C 280 230 520 360 800 290 C 1080 220 1320 340 1600 270'/%3E%3Cpath d='M0 330 C 300 260 540 390 820 320 C 1100 250 1340 370 1600 300'/%3E%3Cpath d='M0 180 C 260 120 500 250 780 180 C 1060 110 1320 230 1600 160'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat;
}

/* Trait qui relie les quatre étapes */
.sdh-etapes{position:relative}
.sdh-etapes::before{
  content:"";position:absolute;top:30px;left:12.5%;right:12.5%;height:1px;
  background:rgba(220,176,107,.35);
}
@media (max-width:1060px){ .sdh-etapes::before{display:none} }

/* Grand chiffre en filigrane des blocs Solutions */
.sdh-filigrane{
  position:absolute;left:var(--sdh-e6);bottom:var(--sdh-e4);z-index:2;
  font-family:var(--sdh-serif);font-size:5.5rem;line-height:.8;font-weight:500;
  color:var(--sdh-encre);opacity:.1;pointer-events:none;
}
@media (max-width:1060px){ .sdh-filigrane{font-size:4rem;left:var(--sdh-e5)} }

/* Note manuscrite posée sur la photo du hero */
.sdh-note{
  font-family:var(--sdh-script);
  transform:rotate(-7deg);
  text-shadow:0 0 18px rgba(253,250,245,.95),0 0 36px rgba(253,250,245,.75);
}
@media (max-width:1060px){ .sdh-note{transform:rotate(-3deg)} }

/* Grilles. Le flex d'Elementor en pourcentage déborde dès qu'il y a un écart ;
   une vraie grille CSS répartit l'espace restant toute seule.
   Le sélecteur double .e-con.x passe devant .e-con sans !important. */
.e-con.sdh-grille-2,.e-con.sdh-grille-3,.e-con.sdh-grille-4{display:grid;align-items:start}
.e-con.sdh-grille-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.e-con.sdh-grille-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.e-con.sdh-grille-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1060px){
  .e-con.sdh-grille-3,.e-con.sdh-grille-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .e-con.sdh-grille-2,.e-con.sdh-grille-3,.e-con.sdh-grille-4{grid-template-columns:minmax(0,1fr)}
}

/* Séparateurs verticaux de la bande de services.
   Les quatre blocs sont des widgets icon-box, pas des conteneurs. */
.sdh-services > .elementor-widget + .elementor-widget{
  border-left:1px solid var(--sdh-ligne);
  padding-left:var(--sdh-e6);
}
.sdh-services > .elementor-widget{ padding-right:var(--sdh-e6) }
.sdh-services > .elementor-widget:last-child{ padding-right:0 }
@media (max-width:1060px){
  .sdh-services > .elementor-widget{padding:0 var(--sdh-e5)}
  .sdh-services > .elementor-widget:nth-child(odd){border-left:0;padding-left:0}
}
@media (max-width:620px){
  .sdh-services > .elementor-widget{border-left:0!important;padding:0!important}
}

/* Bloc visuel des solutions : le filigrane se place par rapport à lui */
.sdh-bloc-visuel{position:relative;overflow:hidden}

/* Respect du réglage système de réduction du mouvement */
@media (prefers-reduced-motion:reduce){
  .elementor *{transition-duration:1ms!important;animation-duration:1ms!important}
}

/* Fiches d'œuvres : format d'image uniforme et étiquette posée sur la toile */
.sdh-carte-oeuvre{position:relative}
.sdh-carte-oeuvre .elementor-widget-image img{
  aspect-ratio:4/5;object-fit:cover;width:100%;display:block;
  border-radius:var(--sdh-r-sm);
}
.sdh-carte-oeuvre .sdh-etiq{
  position:absolute;top:var(--sdh-e5);left:var(--sdh-e5);z-index:2;
  width:auto;align-self:flex-start;
}
.sdh-carte-oeuvre .sdh-etiq .elementor-heading-title{display:inline-block}

/* Hero dont l'image est le sujet : le texte se pose dans un cartouche plutôt
   que d'assombrir toute l'image. Les toiles restent entièrement visibles. */
.sdh-cartouche{
  background:rgba(10,34,54,.66);
  -webkit-backdrop-filter:blur(14px) saturate(115%);
  backdrop-filter:blur(14px) saturate(115%);
  border:1px solid rgba(220,176,107,.38);
  border-radius:var(--sdh-r-lg);
  box-shadow:0 24px 70px rgba(10,34,54,.4);
  max-width:900px;
  margin-inline:auto;
}
.e-con.sdh-cartouche{padding:var(--sdh-e7) var(--sdh-e9)}
@media (max-width:620px){
  .e-con.sdh-cartouche{padding:var(--sdh-e6) var(--sdh-e5)}
}

/* Colonne de lecture : les textes du client se lisent, ils ne se survolent pas. */
.sdh-lecture{max-width:760px;margin-inline:auto}
.sdh-lecture .elementor-widget-text-editor{margin-bottom:0}
.sdh-lecture p{margin-bottom:var(--sdh-e4)}

/* Une seule largeur de lecture sur tout le site : 68 caractères environ. */
.sdh-lecture{max-width:68ch;margin-inline:auto;width:100%}
.sdh-valeur:last-child{border-bottom:0!important}
.sdh-valeur .elementor-widget-heading{margin-bottom:0}

/* ---------------------------------------------------------------- audit 20 oct. 2026 */

/* Le piège à pourriels. Masqué à l'œil et au lecteur d'écran, présent pour les robots. */
/* Elementor ne reporte pas la classe d'un champ sur son groupe : on vise le
   nom du champ, qui lui est toujours rendu. */
.elementor-field-group-site_web{position:absolute!important;left:-9999px!important;
  width:1px!important;height:1px!important;overflow:hidden!important}
.elementor-field-group-site_web input{pointer-events:none}

/* Les défauts d'Elementor suffisent rarement : un focus visible partout, au contraste AA. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible,.elementor-button:focus-visible{
  outline:3px solid var(--sdh-or-texte);
  outline-offset:3px;
  border-radius:4px}
.e-con-inner :focus:not(:focus-visible){outline:none}

/* La case de consentement : lisible, cliquable, et le lien se distingue du texte. */
.elementor-field-type-acceptance .elementor-field-option{display:flex;gap:10px;
  align-items:flex-start;line-height:1.5}
.elementor-field-type-acceptance label{font-weight:400;font-size:16px;
  color:var(--sdh-texte)}
.elementor-field-type-acceptance input[type=checkbox]{width:20px;height:20px;
  margin-top:2px;flex:0 0 20px;accent-color:var(--sdh-encre)}
.elementor-field-type-acceptance a{color:var(--sdh-or-texte);text-decoration:underline}

/* Le message de retour du formulaire, au ton du site. */
.elementor-message{font-size:17px;line-height:1.5;padding:14px 0}
.elementor-message.elementor-message-success{color:var(--sdh-encre)}

/* Pied de page : la ligne légale. */
.sdh-legal a{color:var(--sdh-sur-sombre);text-decoration:none}
.sdh-legal a:hover{color:var(--sdh-or-clair);text-decoration:underline}

/* Un titre présent pour la structure, absent de l'écran. */
.sdh-lu-seulement{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Elementor impose sa couleur de lien dans le pied : on la reprend, fond sombre oblige. */
.elementor-location-footer .elementor-widget-text-editor a,
.elementor-location-footer .sdh-legal a{color:var(--sdh-sur-sombre)!important;
  text-decoration:underline;text-underline-offset:3px}
.elementor-location-footer .elementor-widget-text-editor a:hover,
.elementor-location-footer .sdh-legal a:hover{color:var(--sdh-or-clair)!important}

/* Sur une bande sombre, l'accent manuscrit reprend l'or clair. */
.sdh-sombre .sdh-script,.sdh-voile-sombre .sdh-script{color:var(--sdh-or-clair)}

/* Mur de galerie : les toiles n'ont pas toutes le même format. Plutôt que de
   les rogner ou de laisser la grille en dents de scie, chaque toile est posée
   entière et centrée dans un cadre de même format. */
.e-con.sdh-mur{align-items:stretch}
.sdh-carte-oeuvre{height:100%;position:relative}
.sdh-carte-oeuvre .elementor-widget-image,
.sdh-carte-oeuvre .elementor-widget-image .elementor-widget-container{height:100%}
.sdh-carte-oeuvre img{
  width:100%;height:100%;aspect-ratio:4/5;
  object-fit:contain;object-position:center;
  background:var(--sdh-sable);
  border-radius:2px}
@media (max-width:767px){.sdh-carte-oeuvre img{aspect-ratio:1/1}}

/* L'étiquette de statut : posée sur la toile, en haut à droite, assez discrète
   pour ne pas voler la vedette à l'œuvre. */
.sdh-carte-oeuvre .sdh-etiq{position:absolute!important;top:22px;right:22px;left:auto!important;
  width:auto!important;max-width:none;z-index:2;
  backdrop-filter:blur(2px);box-shadow:0 2px 8px rgba(16,47,74,.18)}
.sdh-carte-oeuvre .sdh-etiq .elementor-widget-container{width:auto}
.sdh-carte-oeuvre .sdh-etiq .elementor-heading-title{white-space:nowrap}
/* Une toile vendue reste visible, mais se retire d'un cran. */
.sdh-carte-oeuvre.sdh-vendue img{opacity:.88}
.sdh-carte-oeuvre.sdh-vendue:hover img{opacity:1}
.sdh-carte-oeuvre img{transition:opacity .3s ease}