/* Adaptations IWS, section par section. Chargé après les CSS du template : ce fichier a le dernier mot. */

/* ---------- Bannière (Accueil) ----------
   Fond : photo IWS (poste de travail, ambiance bleue) à la place du fond du template.
   Le voile orange et noir du template (90 % d'opacité) masquerait la photo : il est remplacé par un dégradé sombre
   à gauche, sous le texte, qui s'efface vers la droite pour laisser voir l'image. */
.banner-section-h1 .bg-image img {
  object-fit: cover;
  object-position: 60% 50%;
}
.banner-section-h1 .bg-image:before {
  background-image: linear-gradient(90deg, rgba(10, 12, 28, 0.9) 0%, rgba(10, 12, 28, 0.72) 38%, rgba(10, 12, 28, 0.3) 68%, rgba(10, 12, 28, 0.15) 100%);
  opacity: 1;
}
@media (max-width: 991.98px) {
  /* Sur mobile, le texte occupe toute la largeur : voile plus uniforme. */
  .banner-section-h1 .bg-image:before {
    background-image: linear-gradient(180deg, rgba(10, 12, 28, 0.85) 0%, rgba(10, 12, 28, 0.7) 60%, rgba(10, 12, 28, 0.5) 100%);
  }
}
/* Lignes ondulées du template : faites pour un fond uni, elles brouillent la photo. */
.banner-section-h1 .outer-box:before {
  display: none;
}
/* Personnage du template retiré : il donnait sa hauteur à la bannière sur ordinateur (783 px).
   On garde cette hauteur pour que la photo de fond conserve son cadrage. */
@media (min-width: 1200px) {
  .banner-section-h1 .inner-box {
    min-height: 783px;
  }
  /* Même largeur de texte qu'avec le personnage : le titre garde sa coupe et ne déborde pas sur la photo. */
  .banner-section-h1 .banner-content {
    max-width: min(689px, 48vw);
  }
}

/* ---------- Services (Accueil) ----------
   Le template impose 215 px de haut aux vignettes sans recadrer : les photos étaient légèrement écrasées.
   Recadrage automatique, sans changer la taille des cartes. */
.ks-service-thumb img {
  object-fit: cover;
}

/* ---------- À propos (Accueil) ----------
   Badge SVG : seul le texte circulaire tourne, la marque IWS au centre reste lisible. */
.about-section-h1 .image-column .inner-column .icon .iws-badge {
  display: block;
}
.about-section-h1 .image-column .inner-column .icon .iws-badge-texte {
  transform-origin: 105px 105px;
  animation: spin 14s linear infinite;
}

/* ---------- Pourquoi nous choisir (Accueil) ----------
   Icône IWS fixe : un logo qui tourne sur lui-même devient illisible. */
.ks-choose-2-icon img {
  animation: none;
  border-radius: 14px;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.12);
}
@media (prefers-reduced-motion: reduce) {
  .about-section-h1 .image-column .inner-column .icon .iws-badge-texte {
    animation: none;
  }
}

/* ---------- Bannière : scène 3D (Three.js) ----------
   Ordinateur portable et téléphone qui présentent deux réalisations IWS. Affichée sur ordinateur seulement :
   sur tablette et mobile, le module n'est même pas téléchargé. Apparition en fondu une fois les écrans chargés. */
.banner-section-h1 .hero-3d {
  position: absolute;
  right: 2%;
  top: 46%;
  transform: translateY(-50%);
  width: 48%;
  max-width: 800px;
  aspect-ratio: 1.15;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.9s ease;
  pointer-events: none;
}
.banner-section-h1 .hero-3d.is-ready {
  opacity: 1;
}
.banner-section-h1 .hero-3d canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}
@media (max-width: 1199.98px) {
  .banner-section-h1 .hero-3d {
    display: none;
  }
}