﻿/* =========================================
   À PROPOS - CONTENU UNIQUEMENT
   Le header reste géré par style.css comme les autres pages
   ========================================= */

.page-apropos-clean{
  background:#eef6ef !important;
  overflow-x:hidden !important;
}

.page-apropos-clean main{
  background:#eef6ef !important;
}

.page-apropos-clean main .container,
.page-apropos-clean footer .container{
  width:min(1180px, calc(100% - 56px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Hero */
.apropos-hero-clean{
  background:linear-gradient(120deg,#051f2f,#145032) !important;
  padding:70px 0 !important;
  min-height:390px !important;
  color:#ffffff !important;
}

.hero-clean-content{
  text-align:left !important;
}

.hero-clean-content small{
  color:#7ed91f !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

.hero-clean-content h1{
  color:#ffffff !important;
  font-size:clamp(2.3rem, 4vw, 3.6rem) !important;
  line-height:1.08 !important;
  margin:18px 0 24px !important;
}

.hero-clean-content h1 span{
  color:#7ed91f !important;
}

.hero-clean-content p{
  max-width:560px !important;
  color:#ffffff !important;
  font-size:1rem !important;
  line-height:1.7 !important;
}

/* Sections */
.apropos-section{
  padding:68px 0 !important;
  background:#eef6ef !important;
}

.engagement-clean-layout{
  display:grid !important;
  grid-template-columns:0.9fr 1.6fr !important;
  gap:54px !important;
  align-items:start !important;
}

.engagement-text small,
.story-clean-text small,
.section-title-clean small{
  color:#2f7d1d !important;
  text-transform:uppercase !important;
  font-weight:900 !important;
}

.engagement-text h2,
.story-clean-text h2,
.section-title-clean h2{
  color:#051f2f !important;
  font-size:2rem !important;
  line-height:1.25 !important;
  margin:14px 0 26px !important;
}

.check-list-clean{
  list-style:none !important;
  padding:0 !important;
  margin:0 !important;
}

.check-list-clean li{
  position:relative !important;
  padding-left:34px !important;
  margin-bottom:18px !important;
  color:#051f2f !important;
  line-height:1.65 !important;
}

.check-list-clean li::before{
  content:"✓" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  color:#5fb915 !important;
  font-weight:900 !important;
}

/* Cartes engagement */
.engagement-cards-clean{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  gap:18px !important;
}

.mini-card-clean{
  background:#ffffff !important;
  border:1px solid rgba(5,31,47,.08) !important;
  border-radius:14px !important;
  padding:28px 18px !important;
  min-height:210px !important;
  text-align:center !important;
  box-shadow:0 14px 30px rgba(5,31,47,.08) !important;
}

.mini-card-clean img{
  width:66px !important;
  height:66px !important;
  object-fit:contain !important;
  display:block !important;
  margin:0 auto 18px !important;
}

.mini-card-clean h3{
  margin:0 0 12px !important;
  color:#051f2f !important;
  font-size:1rem !important;
  line-height:1.25 !important;
}

.mini-card-clean p{
  margin:0 !important;
  color:#051f2f !important;
  line-height:1.55 !important;
}

/* Histoire */
.story-clean-layout{
  display:grid !important;
  grid-template-columns:0.85fr 1.65fr !important;
  gap:48px !important;
  align-items:center !important;
}

.story-clean-text p{
  color:#051f2f !important;
  line-height:1.7 !important;
}

.story-btn-clean{
  background:#ffffff !important;
  color:#2f7d1d !important;
  border:1px solid #2f7d1d !important;
  font-weight:900 !important;
}

.story-cards-clean{
  display:grid !important;
  grid-template-columns:repeat(2, 1fr) !important;
  gap:20px !important;
}

.story-card-clean{
  display:block !important;
  overflow:hidden !important;
  border-radius:14px !important;
  background:#051f2f !important;
  text-decoration:none !important;
  box-shadow:0 18px 40px rgba(5,31,47,.18) !important;
}

.story-card-clean img{
  width:100% !important;
  height:240px !important;
  object-fit:cover !important;
  display:block !important;
}

.story-card-clean h3{
  margin:0 !important;
  padding:18px !important;
  color:#ffffff !important;
  text-align:center !important;
  font-size:1.25rem !important;
}

/* Valeurs */
.values-clean-section{
  padding-top:40px !important;
}

.section-title-clean{
  text-align:center !important;
  margin-bottom:34px !important;
}

.values-grid-clean{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  background:#ffffff !important;
  border-radius:14px !important;
  padding:30px 26px !important;
  box-shadow:0 16px 35px rgba(5,31,47,.08) !important;
  border:1px solid rgba(5,31,47,.08) !important;
}

.value-card-clean{
  display:grid !important;
  grid-template-columns:58px 1fr !important;
  gap:16px !important;
  padding:10px 22px !important;
  border-right:1px solid rgba(5,31,47,.12) !important;
}

.value-card-clean:last-child{
  border-right:none !important;
}

.value-card-clean img{
  width:44px !important;
  height:44px !important;
  object-fit:contain !important;
  margin-top:4px !important;
}

.value-card-clean h3{
  margin:0 0 8px !important;
  color:#051f2f !important;
}

.value-card-clean p{
  margin:0 !important;
  color:#051f2f !important;
  line-height:1.55 !important;
}

/* CTA */
.quick-contact-clean{
  background:#eef6ef !important;
  padding:34px 0 !important;
}

.quick-contact-box-clean{
  background:linear-gradient(135deg,#051f2f,#08324a) !important;
  color:#ffffff !important;
  border-radius:16px !important;
  padding:28px 34px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:24px !important;
  box-shadow:0 18px 40px rgba(5,31,47,.18) !important;
}

.quick-contact-box-clean h2,
.quick-contact-box-clean p{
  color:#ffffff !important;
  margin-top:0 !important;
}

.quick-actions-clean{
  display:flex !important;
  gap:16px !important;
  flex-wrap:wrap !important;
}

/* Responsive contenu */
@media(max-width:1100px){
  .engagement-clean-layout,
  .story-clean-layout{
    grid-template-columns:1fr !important;
  }

  .engagement-cards-clean,
  .values-grid-clean{
    grid-template-columns:repeat(2, 1fr) !important;
  }
}

@media(max-width:800px){
  .story-cards-clean{
    grid-template-columns:1fr !important;
  }

  .quick-contact-box-clean{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
}

@media(max-width:600px){
  .engagement-cards-clean,
  .values-grid-clean{
    grid-template-columns:1fr !important;
  }

  
}





