/* Custom styles extracted from inline styles in index.html */

/* Hero section background */
.hero5-section-area.bg-header {
  background-image: url(../img/bg/header-bg5.png);
  background-repeat: no-repeat;
  background-size: cover;
}

/* Service section dark background */
.service1-section-area.dark-bg {
  background-color: #104041;
  background-size: cover;
  background-repeat: no-repeat;
  color: #ffffff;
}

/* CTA section background */
.cta5-section-area.bg-header {
  background-image: url(../img/bg/header-bg5.png);
  background-repeat: no-repeat;
  background-size: cover;
}

/* FAQ section no background */
.choose-section-area.no-bg {
  background: none;
}

/* Accordion tabs no padding */
.accordian-tabs-area.no-padding {
  padding: 0;
}

/* Testimonial section dark background */
.testimonial5-section-area.dark-bg {
  background-color: #104041;
  background-size: cover;
  background-repeat: no-repeat;
}

/* Hidden botcheck field */
.botcheck-hidden {
  display: none;
}

/* Fix for icons and images in accompagnement page */
.service-boxarea img {
  width: auto;
  height: auto;
  max-width: 100%;
  display: block;
  margin: 0 auto;
}

.service12-boxarea .icons img {
  width: auto;
  height: auto;
  max-width: 100%;
  display: block;
  margin: 0 auto;
}

.about-all-images-area img {
  width: auto;
  height: auto;
  max-width: 100%;
  display: block;
}

/* Make SVG icons visible on dark green background */
.service12-section-area .about-all-images-area img {
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

/* Improve text contrast on dark green background */
.service12-section-area .about5-content-area p,
.service12-section-area .about5-content-area li {
  color: #ffffff !important;
}

.service12-section-area .about5-content-area h3 {
  color: #ffffff !important;
}

.service12-section-area .about5-content-area b {
  color: #ffffff !important;
  font-weight: 600;
}

/* Ensure text is visible in service12 sections */
.service12-section-area .service-header h2 {
  color: #ffffff !important;
}

.service12-section-area .service-header p {
  color: #e0e0e0 !important;
}

/* Fix menu dropdown hover visibility - yellow on white is hard to see */
.homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a:hover {
  color: #104041 !important; /* Dark green that matches the site theme */
}

/* Also fix for mobile menu if needed */
.mobile-sidebar5 .sub-menu li a:hover {
  color: #104041 !important;
}

/* Fix dropdown positioning - it was too low (100px) making it disappear before mouse can reach it */
/* The dropdown should be positioned just below the menu item, not 100px down */
.homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding {
  top: 100% !important; /* Position directly below the parent menu item */
  margin-top: 10px !important; /* Small gap for visual separation */
}

.homepage5-body .header-area.homepage5 .header-elements .main-menu ul li:hover ul.dropdown-padding {
  top: 100% !important; /* Position directly below the parent menu item on hover */
  margin-top: 10px !important; /* Small gap for visual separation */
}

/* Ensure white sections on homepage stay white - override any body background */
.about5-section-area {
  background-color: #ffffff !important;
}

.choose-section-area {
  background-color: #ffffff !important;
}

/* Styles for robuste page - to avoid inline styles for CSP compliance */
/* Apply green background only on robuste page container, not the body */
body.homepage5-body.robuste-page {
  background-color: #ffffff !important;
}

/* Ensure header is visible on robuste page and starts at top */
body.homepage5-body.robuste-page {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.homepage5-body.robuste-page header {
  position: relative !important;
  z-index: 10000 !important;
  width: 100% !important;
  display: block !important;
  visibility: visible !important;
  margin-top: 0 !important;
  top: 0 !important;
}

/* Ensure header has transparent background on robuste page - use relative like other pages */
body.homepage5-body.robuste-page .header-area.homepage5 {
  background: transparent !important;
  position: relative !important;
  width: 100% !important;
  z-index: 10000 !important;
  margin-top: 0 !important;
  padding-top: 16px !important;
}

/* Container for robuste tool content */
body.homepage5-body.robuste-page .robuste-page-container {
  padding-top: 0 !important;
  padding-bottom: 200px !important;
  background-color: #104041;
  min-height: auto !important;
  position: relative !important;
  z-index: 1 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Ensure robuste content wrapper doesn't overlap header */
body.homepage5-body.robuste-page .robuste-content-wrapper {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 60px !important;
}

/* Footer white background on robuste page */
body.homepage5-body.robuste-page .footer5-section-area {
  background-color: #ffffff !important;
  padding: 40px 0 !important;
}

/* Ensure footer has white background on all pages */
.footer5-section-area {
  background-color: #ffffff !important;
}

/* Service boxes styling for service-conseil-ti and gestion-ti pages */
/* Force all service boxes to have dark green background with white text and icons */
.service1-section-area .service-all-boxes-area1 .service-boxarea,
.service1-section-area .service-all-boxes-area1 .service-boxarea.box2,
.service1-section-area .service-all-boxes-area1 .service-boxarea.box3,
.service1-section-area .service-all-boxes-area1 .service-boxarea.box4 {
  background-color: #104041 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  margin: 0 10px 30px 10px !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 400px !important;
}

/* White text for links and paragraphs */
.service1-section-area .service-all-boxes-area1 .service-boxarea a,
.service1-section-area .service-all-boxes-area1 .service-boxarea p {
  color: #ffffff !important;
}

/* White icons with filter */
.service1-section-area .service-all-boxes-area1 .service-boxarea img {
  filter: brightness(0) invert(1) !important;
  max-width: 80px !important;
  height: auto !important;
  margin: 0 auto !important;
}

/* Align buttons at the bottom of each box */
.service1-section-area .service-all-boxes-area1 .service-boxarea .btn-area1 {
  margin-top: auto !important;
  padding-top: 20px !important;
}

/* Style the "En savoir plus" button for dark background */
.service1-section-area .service-all-boxes-area1 .service-boxarea .header-btn11 {
  background-color: #ffffff !important;
  color: #104041 !important;
  border: 2px solid #ffffff !important;
  padding: 10px 20px !important;
  border-radius: 5px !important;
  transition: all 0.3s !important;
}

.service1-section-area .service-all-boxes-area1 .service-boxarea .header-btn11:hover {
  background-color: transparent !important;
  color: #ffffff !important;
  border: 2px solid #ffffff !important;
}

/* Homepage service boxes styling - align buttons and use green buttons */
.service1-section-area.dark-bg .service-all-boxes-area {
  display: flex !important;
  gap: 20px !important;
}

.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea {
  display: flex !important;
  flex-direction: column !important;
  min-height: 400px !important;
  flex: 1 1 0 !important;
  width: 0 !important; /* Force equal width with flex */
}

.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .btn-area1 {
  margin-top: auto !important;
  padding-top: 20px !important;
}

/* Green buttons with white text for homepage service boxes */
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .header-btn11,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .btn-area1 .header-btn11 {
  background-color: #104041 !important;
  color: #ffffff !important;
  border: 2px solid #104041 !important;
  padding: 10px 20px !important;
  border-radius: 5px !important;
  transition: all 0.3s !important;
  position: relative !important;
}

/* Disable the ::after pseudo-element that creates green overlay */
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .header-btn11::after,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .btn-area1 .header-btn11::after {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .header-btn11:hover,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .btn-area1 .header-btn11:hover,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea a.header-btn11:hover {
  background-color: #ffffff !important;
  color: #104041 !important;
  border: 2px solid #ffffff !important;
}

/* Ensure ::after is hidden on hover too */
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .header-btn11:hover::after,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .btn-area1 .header-btn11:hover::after {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .header-btn11:hover i,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .btn-area1 .header-btn11:hover i,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea a.header-btn11:hover i {
  color: #104041 !important;
}

/* Loi 25 horizontal banner styling - white background with green text */
.loi25-banner {
  background-color: #ffffff !important;
  padding: 40px 30px !important;
  border-radius: 8px !important;
  margin-top: 10px !important;
  border: 2px solid #104041 !important;
}

/* Reduce spacing in the service section container */
.service1-section-area.dark-bg + .service1-section-area {
  padding-top: 0 !important;
  margin-top: 10px !important;
}

.loi25-banner .loi25-content h3 {
  color: #104041 !important;
  margin-bottom: 15px !important;
}

.loi25-banner .loi25-content p {
  color: #333333 !important;
  margin-bottom: 0 !important;
}

.loi25-banner .loi25-icon img {
  filter: none !important;
}

.loi25-banner .loi25-btn .header-btn11 {
  background-color: #104041 !important;
  color: #ffffff !important;
  border: 2px solid #104041 !important;
  padding: 10px 20px !important;
  border-radius: 5px !important;
  transition: all 0.3s !important;
}

.loi25-banner .loi25-btn .header-btn11:hover {
  background-color: #ffffff !important;
  color: #104041 !important;
  border: 2px solid #104041 !important;
}

.loi25-banner .loi25-btn .header-btn11:hover i {
  color: #104041 !important;
}

/* Disable ::after pseudo-element for Loi 25 button */
.loi25-banner .loi25-btn .header-btn11::after,
.loi25-banner .loi25-btn .header-btn11:hover::after {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Show list bullets in content areas */
.about5-content-area ul,
.service12-section-area .about5-content-area ul {
  list-style: disc !important;
  padding-left: 20px !important;
}

.about5-content-area ul li,
.service12-section-area .about5-content-area ul li {
  list-style: disc !important;
  display: list-item !important;
}

/* Style for h5 step headings in dark green sections */
.service12-section-area .about5-content-area h5.step-heading {
  background-color: #ffffff !important;
  color: #104041 !important;
  padding: 15px 20px !important;
  border-radius: 5px !important;
  margin-top: 20px !important;
  margin-bottom: 20px !important;
  display: inline-block !important;
  font-weight: 600 !important;
  opacity: 0 !important;
  transition: opacity 0.6s ease !important;
}

/* AOS animation will handle the visibility */
.service12-section-area .about5-content-area h5.step-heading[data-aos].aos-animate {
  opacity: 1 !important;
}

/* ============================================
   CSS Classes to replace inline styles for CSP compliance
   ============================================ */

/* Image sizing classes */
.img-max-width-300 {
  max-width: 300px !important;
  height: auto !important;
}

.img-max-width-100 {
  max-width: 100px !important;
  height: auto !important;
}

.img-max-width-120 {
  max-width: 120px !important;
  height: auto !important;
}

.img-max-width-115 {
  max-width: 115px !important;
  height: auto !important;
}

.img-max-width-150 {
  max-width: 150px !important;
  height: auto !important;
}

.img-max-width-230 {
  max-width: 230px !important;
  height: auto !important;
}

.img-max-width-400 {
  max-width: 400px !important;
  height: auto !important;
}

/* List styling classes */
.list-style-disc {
  list-style: disc !important;
  padding-left: 20px !important;
}

.list-style-disc-margin-top {
  list-style: disc !important;
  padding-left: 20px !important;
  margin-top: 20px !important;
}

.list-style-circle {
  list-style: circle !important;
  padding-left: 30px !important;
}

/* Text color classes */
.text-white {
  color: #ffffff !important;
}

.text-green {
  color: #104041 !important;
}

.text-dark-gray {
  color: #333333 !important;
}

.text-gray {
  color: #666 !important;
}

/* Display classes */
.display-none {
  display: none !important;
}

.display-block {
  display: block !important;
}

/* Info sections in robuste footer should be block when visible */
.robuste-footer .info-section:not(.display-none) {
  display: block !important;
}

/* CTA Auto-évaluation cybersécurité */
#auto-evaluation-cybersecurite {
  padding: 60px 0 !important;
}

#auto-evaluation-cybersecurite .cta-auto-eval h2 {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 15px;
}

#auto-evaluation-cybersecurite .cta-auto-eval .subtitle-cta {
  font-size: 1.25rem;
  font-weight: 500;
  margin-bottom: 30px;
  opacity: 0.95;
}

#auto-evaluation-cybersecurite .cta-auto-eval .btn-area1 {
  margin-bottom: 20px;
}

#auto-evaluation-cybersecurite .cta-auto-eval .confidentiality-text {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.8);
  margin-top: 20px;
  font-style: italic;
  line-height: 1.6;
}

/* Animation pulse pour le bouton CTA */
.cta-pulse {
  animation: pulse-cta 2s ease-in-out infinite;
  position: relative;
}

@keyframes pulse-cta {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
  }
}

.cta-pulse:hover {
  animation: none;
  transform: scale(1.05);
}

@media (max-width: 768px) {
  #auto-evaluation-cybersecurite .cta-auto-eval h2 {
    font-size: 1.5rem;
  }
  
  #auto-evaluation-cybersecurite .cta-auto-eval .subtitle-cta {
    font-size: 1.1rem;
  }
}

/* Aide mémoire Loi 25 section - compact green section */
.aide-memoire-loi25-section.dark-bg {
  background-color: #104041 !important;
  padding: 40px 0 !important;
}

.aide-memoire-loi25-section .aide-memoire-content h2 {
  color: #ffffff !important;
  margin-bottom: 0 !important;
}

.aide-memoire-loi25-section .aide-memoire-content .btn-area1 {
  margin-top: 20px !important;
}

@media (max-width: 767px) {
  .aide-memoire-loi25-section.dark-bg {
    padding: 30px 0 !important;
  }
  
  .aide-memoire-loi25-section .aide-memoire-content h2 {
    font-size: 1.75rem !important;
  }
}

/* Qui sommes nous section - green section */
.qui-sommes-nous-section.dark-bg {
  background-color: #104041 !important;
  padding: 60px 0 !important;
}

.qui-sommes-nous-section .qui-sommes-nous-content h2 {
  color: #ffffff !important;
  margin-bottom: 0 !important;
}

.qui-sommes-nous-section .qui-sommes-nous-content p {
  color: #ffffff !important;
  opacity: 0.95 !important;
  font-size: 1.1rem !important;
  line-height: 1.8 !important;
}

@media (max-width: 767px) {
  .qui-sommes-nous-section.dark-bg {
    padding: 40px 0 !important;
  }
  
  .qui-sommes-nous-section .qui-sommes-nous-content h2 {
    font-size: 1.75rem !important;
  }
  
  .qui-sommes-nous-section .qui-sommes-nous-content p {
    font-size: 1rem !important;
  }
}

/* Créons ensemble un futur meilleur section - green section with 3 boxes */
.futur-meilleur-section.dark-bg {
  background-color: #104041 !important;
  padding: 80px 0 !important;
}

.futur-meilleur-section .futur-meilleur-header h2 {
  color: #ffffff !important;
  margin-bottom: 50px !important;
}

.futur-meilleur-section .futur-meilleur-box {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border: 2px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 8px !important;
  padding: 40px 30px !important;
  height: 100% !important;
  text-align: center !important;
  transition: all 0.3s ease !important;
}

.futur-meilleur-section .futur-meilleur-box:hover {
  background-color: rgba(255, 255, 255, 0.15) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  transform: translateY(-5px) !important;
}

.futur-meilleur-section .futur-meilleur-box h3 {
  color: #ffffff !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  margin-bottom: 20px !important;
}

.futur-meilleur-section .futur-meilleur-box p {
  color: #ffffff !important;
  opacity: 0.95 !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
  margin-bottom: 0 !important;
}

@media (max-width: 991px) {
  .futur-meilleur-section .futur-meilleur-box {
    margin-bottom: 30px !important;
  }
}

@media (max-width: 767px) {
  .futur-meilleur-section.dark-bg {
    padding: 50px 0 !important;
  }
  
  .futur-meilleur-section .futur-meilleur-header h2 {
    font-size: 1.75rem !important;
    margin-bottom: 30px !important;
  }
  
  .futur-meilleur-section .futur-meilleur-box {
    padding: 30px 20px !important;
  }
  
  .futur-meilleur-section .futur-meilleur-box h3 {
    font-size: 1.25rem !important;
  }
  
  .futur-meilleur-section .futur-meilleur-box p {
    font-size: 0.95rem !important;
  }
}

/* Spacing classes */
.margin-top-20 {
  margin-top: 20px !important;
}

.margin-top-40 {
  margin-top: 40px !important;
}

.margin-top-15 {
  margin-top: 15px !important;
}

.margin-bottom-0 {
  margin-bottom: 0 !important;
}

.margin-bottom-10 {
  margin-bottom: 10px !important;
}

.padding-left-20 {
  padding-left: 20px !important;
}

/* Font styling classes */
.font-size-small {
  font-size: 0.9em !important;
}

.font-style-italic {
  font-style: italic !important;
}

.font-weight-900 {
  font-weight: 900 !important;
}

/* Text alignment classes */
.text-align-left {
  text-align: left !important;
}

.text-align-center {
  text-align: center !important;
}

/* Background and border classes */
.bg-white {
  background-color: #ffffff !important;
}

.border-green {
  border: 2px solid #104041 !important;
}

.border-radius-8 {
  border-radius: 8px !important;
}

.padding-30 {
  padding: 30px !important;
}

/* Specific component classes */
.loi25-banner-style {
  background-color: #ffffff !important;
  padding: 30px !important;
  border-radius: 8px !important;
  border: 2px solid #104041 !important;
}

.loi25-banner-title {
  color: #104041 !important;
  margin-bottom: 10px !important;
}

.loi25-banner-text {
  color: #333333 !important;
  margin-bottom: 0 !important;
}

.asterisk-note {
  font-size: 0.9em !important;
  color: #666 !important;
  font-style: italic !important;
  margin-top: 15px !important;
  text-align: left !important;
}

.formation-icon {
  max-width: 100px !important;
  height: auto !important;
  margin: 0 auto !important;
  display: block !important;
}

.formation-icon-large {
  max-width: 230px !important;
  height: auto !important;
  margin: 0 auto !important;
  display: block !important;
}

.soon-available {
  font-weight: 900 !important;
  color: #104041 !important;
}

/* Ensure text visibility in simulations section */
.service12-section-area#simulations .about5-content-area p,
.service12-section-area#simulations .about5-content-area li,
.service12-section-area#simulations .about5-content-area b {
  color: #ffffff !important;
}

.service12-section-area#simulations .about5-content-area ul {
  color: #ffffff !important;
}

.service12-section-area#simulations .about5-content-area ul li {
  color: #ffffff !important;
}

/* Reduce spacing between introduction and service boxes on service-conseil-ti page */
.service-conseil-ti-intro.about5-section-area.sp2 {
  padding-bottom: 40px !important;
}

.service-conseil-ti-intro + .service1-section-area.sp2 {
  padding-top: 40px !important;
}

/* Improve spacing and text alignment in service-conseil-ti boxes */
.service1-section-area.sp2 .service-all-boxes-area1 .service-boxarea {
  display: flex !important;
  flex-direction: column !important;
  min-height: 450px !important;
  padding: 25px !important;
}

.service1-section-area.sp2 .service-all-boxes-area1 .service-boxarea > a {
  margin-bottom: 10px !important;
  min-height: 60px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.service1-section-area.sp2 .service-all-boxes-area1 .service-boxarea .space40 {
  height: 15px !important;
  min-height: 15px !important;
  flex: 0 0 auto !important;
}

.service1-section-area.sp2 .service-all-boxes-area1 .service-boxarea img {
  margin: 15px auto !important;
  flex: 0 0 auto !important;
}

.service1-section-area.sp2 .service-all-boxes-area1 .service-boxarea p {
  flex: 1 1 auto !important;
  min-height: 80px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  text-align: center !important;
  margin: 0 !important;
}

/* Disable image-anime effect on green backgrounds */
.service12-section-area .image-anime:after,
.service1-section-area.dark-bg .image-anime:after,
.service12-section-area .image-anime:hover:after,
.service1-section-area.dark-bg .image-anime:hover:after {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  content: none !important;
}

/* Style for service boxes in white sections (autres services) */
.about5-section-area .service-all-boxes-area1 .service-boxarea {
  display: flex !important;
  flex-direction: column !important;
  min-height: 400px !important;
  border: 2px solid #104041 !important;
  border-radius: 8px !important;
  padding: 30px !important;
  text-align: center !important;
  align-items: center !important;
}

.about5-section-area .service-all-boxes-area1 .service-boxarea .btn-area1 {
  margin-top: auto !important;
  padding-top: 20px !important;
}

.about5-section-area .service-all-boxes-area1 .service-boxarea .header-btn11 {
  background-color: #104041 !important;
  color: #ffffff !important;
  border: 2px solid #104041 !important;
}

.about5-section-area .service-all-boxes-area1 .service-boxarea .header-btn11:hover {
  background-color: #ffffff !important;
  color: #104041 !important;
  border: 2px solid #104041 !important;
}

.about5-section-area .service-all-boxes-area1 .service-boxarea .header-btn11:hover i {
  color: #104041 !important;
}

.about5-section-area .service-all-boxes-area1 .service-boxarea .header-btn11::after,
.about5-section-area .service-all-boxes-area1 .service-boxarea .header-btn11:hover::after {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Style for titles in service boxes (remove link styling) */
.about5-section-area .service-all-boxes-area1 .service-boxarea > a {
  color: #104041 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 1.25rem !important;
  display: block !important;
}

.about5-section-area .service-all-boxes-area1 .service-boxarea > a:hover {
  color: #104041 !important;
  text-decoration: none !important;
}

/* Limit icon size in service boxes */
.about5-section-area .service-all-boxes-area1 .service-boxarea img {
  max-width: 120px !important;
  height: auto !important;
  margin: 0 auto !important;
}

/* Override icon sizes for format section */
.about5-section-area#format .service-all-boxes-area1 .service-boxarea img {
  max-width: 100px !important;
  height: auto !important;
  margin: 0 auto !important;
  display: block !important;
}

/* Specific size for virtuel icon */
.about5-section-area#format .service-all-boxes-area1 .service-boxarea img[src*="formation-securite-training-virtuel"] {
  max-width: 150px !important;
  height: auto !important;
}

/* Center text content in service boxes */
.about5-section-area .service-all-boxes-area1 .service-boxarea p {
  text-align: center !important;
}

/* Format de nos formations section - white boxes */
.about5-section-area#format .service-all-boxes-area1 .service-boxarea {
  background-color: #ffffff !important;
  border: 2px solid #e0e0e0 !important;
  border-radius: 8px !important;
  padding: 30px !important;
  min-height: 400px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Ensure all format boxes have equal height */
.about5-section-area#format .service-all-boxes-area1 .row {
  display: flex !important;
  align-items: stretch !important;
}

.about5-section-area#format .service-all-boxes-area1 .row > div {
  display: flex !important;
  flex-direction: column !important;
}

/* Make sure all service-boxarea take full height */
.about5-section-area#format .service-all-boxes-area1 .row > div .service-boxarea {
  flex: 1 1 auto !important;
  min-height: 400px !important;
}

/* Style for asterisk text - positioned to not affect box height */
.about5-section-area#format .service-all-boxes-area1 .row > div:first-child {
  position: relative !important;
}

.about5-section-area#format .service-all-boxes-area1 .row > div:first-child > p {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  margin-top: 15px !important;
  margin-bottom: 0 !important;
  padding-left: 20px !important;
  width: 100% !important;
  flex: 0 0 auto !important;
}

.about5-section-area#format .service-all-boxes-area1 .service-boxarea h3 {
  color: #104041 !important;
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  margin-bottom: 20px !important;
  text-align: center !important;
}

.about5-section-area#format .service-all-boxes-area1 .service-boxarea p {
  color: #333333 !important;
  text-align: center !important;
  flex: 1 1 auto !important;
}

/* Align service boxes vertically in formations page */
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea {
  display: flex !important;
  flex-direction: column !important;
  min-height: 500px !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea > a {
  text-align: center !important;
  margin-bottom: 20px !important;
  min-height: 60px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .space40,
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea .space66 {
  flex: 0 0 auto !important;
  height: 20px !important;
  min-height: 20px !important;
}

/* Align all icons at the same vertical position */
.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea img {
  flex: 0 0 auto !important;
  height: 120px !important;
  width: auto !important;
  max-width: 150px !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  display: block !important;
}

.service1-section-area.dark-bg .service-all-boxes-area .service-boxarea p {
  flex: 1 1 auto !important;
  text-align: center !important;
  margin: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  min-height: 100px !important;
}

/* Fix for contact icons - ensure they display as perfect circles */
.contact5-section-area .contact-auhtor-box .icons {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  min-width: 80px !important;
  width: 80px !important;
  height: 80px !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}

.contact5-section-area .contact-auhtor-box .icons img {
  max-width: 50% !important;
  max-height: 50% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
  flex-shrink: 0 !important;
}

/* Cybersecurity section on homepage - white background with green borders */
.service12-section-area.bg-white-cybersecurite {
  background-color: #ffffff !important;
  padding-bottom: 40px !important;
  overflow: visible !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider {
  position: relative !important;
  padding-bottom: 20px !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .owl-stage-outer {
  position: relative !important;
  overflow: visible !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .owl-stage {
  display: flex !important;
  align-items: stretch !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .owl-nav {
  display: none !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .owl-prev,
.service12-section-area.bg-white-cybersecurite .service-slider .owl-next {
  display: none !important;
  visibility: hidden !important;
}

.service12-section-area.bg-white-cybersecurite .service-header h2 {
  color: #104041 !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea {
  background-color: #ffffff !important;
  border: 2px solid #104041 !important;
  border-radius: 8px !important;
  padding: 30px !important;
  margin: 10px !important;
  min-height: 300px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea:hover {
  border: 2px solid #104041 !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea .content {
  text-align: center !important;
  width: 100% !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea .content a {
  color: #104041 !important;
  text-align: center !important;
  display: block !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea .content p {
  color: #333333 !important;
  text-align: center !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea .icons {
  background: transparent !important;
  height: 100px !important;
  width: 100px !important;
  line-height: 100px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea .icons img {
  filter: none !important;
  width: 60px !important;
  height: 60px !important;
  max-width: 60px !important;
  max-height: 60px !important;
  object-fit: contain !important;
}

.service12-section-area.bg-white-cybersecurite .service-slider .service12-boxarea:hover .icons {
  background: transparent !important;
  transform: none !important;
}