/* ============================================================
   DEVECO – Développement Écologique
   Landing Page Stylesheet
   Palette: Navy Blue #0D1B3E | Eco Green #2d8a4e | White #FFFFFF
   ============================================================ */

/* ---- Reset & Base ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --navy:       #0D1B3E;
  --navy-light: #1a3a6b;
  --navy-mid:   #122b56;
  --green:      #2d8a4e;
  --green-dark: #1e6337;
  --green-light:#4caf72;
  --green-pale: #e8f5ee;
  --white:      #ffffff;
  --off-white:  #f7f9f7;
  --gray-100:   #f0f4f0;
  --gray-200:   #e2e8e2;
  --gray-500:   #6b7c6b;
  --gray-700:   #374237;
  --text:       #1a2a1a;
  --shadow-sm:  0 2px 8px rgba(13,27,62,.08);
  --shadow-md:  0 8px 32px rgba(13,27,62,.14);
  --shadow-lg:  0 20px 60px rgba(13,27,62,.18);
  --radius:     12px;
  --radius-lg:  20px;
  --transition: all .3s cubic-bezier(.4,0,.2,1);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Open Sans', sans-serif;
  color: var(--text);
  background: var(--white);
  line-height: 1.7;
  overflow-x: hidden;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
ul { list-style: none; }

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ---- Typography ---- */
h1, h2, h3, h4 { font-family: 'Montserrat', sans-serif; line-height: 1.2; }

/* ============================================================
   NAVBAR
   ============================================================ */
.navbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  padding: 16px 0;
  transition: var(--transition);
  background: transparent;
}

.navbar.scrolled {
  background: rgba(13, 27, 62, 0.97);
  backdrop-filter: blur(12px);
  padding: 10px 0;
  box-shadow: var(--shadow-md);
}

.nav-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav-logo {
  display: flex;
  align-items: center;
}

.logo-img {
  height: 48px;
  width: 48px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--green);
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 8px;
}

.nav-links li a {
  color: var(--white);
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: .875rem;
  padding: 8px 14px;
  border-radius: 8px;
  transition: var(--transition);
  letter-spacing: .03em;
}

.nav-links li a:hover {
  background: rgba(255,255,255,.12);
  color: var(--green-light);
}

.nav-cta {
  background: var(--green) !important;
  color: var(--white) !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
}

.nav-cta:hover {
  background: var(--green-dark) !important;
  transform: translateY(-1px);
}

.nav-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
}

.nav-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: var(--transition);
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(13,27,62,.88) 0%,
    rgba(13,27,62,.72) 40%,
    rgba(30,99,55,.55) 100%
  );
  z-index: 1;
}

.hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  color: var(--white);
  padding: 120px 24px 80px;
  max-width: 900px;
}

.hero-badge {
  display: inline-block;
  background: rgba(45,138,78,.25);
  border: 1px solid rgba(45,138,78,.5);
  color: var(--green-light);
  font-family: 'Montserrat', sans-serif;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  padding: 6px 18px;
  border-radius: 50px;
  margin-bottom: 24px;
}

.hero-title {
  font-size: clamp(2.8rem, 7vw, 5.5rem);
  font-weight: 900;
  letter-spacing: -.02em;
  line-height: 1;
  margin-bottom: 8px;
}

.hero-dev { color: var(--white); }
.hero-eco { color: var(--green-light); }

.hero-subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(.9rem, 2.5vw, 1.3rem);
  font-weight: 300;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: rgba(255,255,255,.75);
  margin-bottom: 28px;
}

.hero-tagline-bar {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--green);
  color: var(--white);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: clamp(.7rem, 1.5vw, .88rem);
  padding: 8px 20px;
  border-radius: 6px;
  margin-bottom: 28px;
  flex-wrap: wrap;
  justify-content: center;
}

.hero-tagline-bar .sep { opacity: .6; }

.hero-quote {
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-size: clamp(1rem, 2.5vw, 1.35rem);
  font-weight: 300;
  color: rgba(255,255,255,.85);
  margin-bottom: 36px;
  border: none;
}

.hero-actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 56px;
}

.hero-stats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--radius);
  padding: 20px 32px;
  backdrop-filter: blur(8px);
  flex-wrap: wrap;
  gap: 8px;
}

.stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 28px;
}

.stat-number {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--green-light);
}

.stat-label {
  font-size: .75rem;
  color: rgba(255,255,255,.65);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-top: 2px;
}

.stat-divider {
  width: 1px;
  height: 40px;
  background: rgba(255,255,255,.2);
}

.hero-scroll-arrow {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  color: rgba(255,255,255,.6);
  animation: bounce 2s infinite;
}

.hero-scroll-arrow svg { width: 32px; height: 32px; }

@keyframes bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(8px); }
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: .04em;
  padding: 14px 32px;
  border-radius: var(--radius);
  border: 2px solid transparent;
  cursor: pointer;
  transition: var(--transition);
  text-transform: uppercase;
}

.btn-primary {
  background: var(--green);
  color: var(--white);
  border-color: var(--green);
}

.btn-primary:hover {
  background: var(--green-dark);
  border-color: var(--green-dark);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(45,138,78,.35);
}

.btn-outline {
  background: transparent;
  color: var(--white);
  border-color: rgba(255,255,255,.5);
}

.btn-outline:hover {
  background: rgba(255,255,255,.12);
  border-color: var(--white);
  transform: translateY(-2px);
}

.btn-full { width: 100%; justify-content: center; }

/* ============================================================
   SECTION COMMONS
   ============================================================ */
section { padding: 80px 0; }

.section-header {
  text-align: center;
  margin-bottom: 48px;
}

.section-tag {
  display: inline-block;
  background: var(--green-pale);
  color: var(--green-dark);
  font-family: 'Montserrat', sans-serif;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 50px;
  margin-bottom: 16px;
}

.section-title {
  font-size: clamp(1.3rem, 2.5vw, 1.75rem);
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 16px;
}

.section-divider {
  width: 64px;
  height: 4px;
  background: linear-gradient(90deg, var(--green), var(--green-light));
  border-radius: 2px;
  margin: 0 auto 20px;
}

.section-desc {
  color: var(--gray-500);
  max-width: 600px;
  margin: 0 auto;
  font-size: .95rem;
}

/* ============================================================
   BRAND STORY
   ============================================================ */
.brand-story { background: var(--white); }

.story-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}

.story-text p {
  color: var(--gray-700);
  margin-bottom: 20px;
  font-size: 1.05rem;
}

.story-lead {
  font-size: 1.15rem !important;
  color: var(--navy) !important;
  line-height: 1.8;
}

.story-founder {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 32px;
  padding: 20px;
  background: var(--green-pale);
  border-radius: var(--radius);
  border-left: 4px solid var(--green);
}

.founder-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--navy);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: .85rem;
  flex-shrink: 0;
}

.founder-info {
  display: flex;
  flex-direction: column;
}

.founder-info strong {
  font-family: 'Montserrat', sans-serif;
  color: var(--navy);
  font-size: 1rem;
}

.founder-info span {
  color: var(--gray-500);
  font-size: .85rem;
}

.story-img-wrapper {
  position: relative;
  border-radius: 0;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  margin-bottom: 24px;
}

.story-img {
  width: 100%;
  height: 320px;
  object-fit: cover;
}

.story-img-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(13,27,62,.8));
  color: rgba(255,255,255,.85);
  font-size: .8rem;
  padding: 24px 16px 12px;
  font-style: italic;
}

.story-values {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.value-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px;
  background: var(--off-white);
  border-radius: var(--radius);
  transition: var(--transition);
}

.value-item:hover {
  background: var(--green-pale);
  transform: translateX(4px);
}

.value-icon {
  font-size: 1.5rem;
  flex-shrink: 0;
  width: 40px;
  text-align: center;
}

.value-item strong {
  font-family: 'Montserrat', sans-serif;
  color: var(--navy);
  display: block;
  margin-bottom: 4px;
}

.value-item p {
  color: var(--gray-500);
  font-size: .875rem;
  margin: 0;
}

/* ============================================================
   SERVICES
   ============================================================ */
.services { background: var(--gray-100); }

.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}

.service-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  position: relative;
  border: 2px solid transparent;
  overflow: hidden;
}

.service-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--green), var(--green-light));
  transform: scaleX(0);
  transition: var(--transition);
  transform-origin: left;
}

.service-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
  border-color: var(--green-pale);
}

.service-card:hover::before { transform: scaleX(1); }

.service-card.featured {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  color: var(--white);
  border-color: var(--navy-light);
}

.service-card.featured .service-title,
.service-card.featured .service-desc,
.service-card.featured .service-features li {
  color: rgba(255,255,255,.9);
}

.service-card.featured .service-link {
  color: var(--green-light);
}

.service-badge {
  position: absolute;
  top: 20px;
  right: 20px;
  background: var(--green);
  color: var(--white);
  font-family: 'Montserrat', sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: 50px;
}

.service-icon-wrap {
  width: 72px;
  height: 72px;
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}

.service-icon-green { background: var(--green-pale); }
.service-icon-blue  { background: rgba(26,58,107,.1); }

.service-icon-wrap svg { width: 40px; height: 40px; }

.service-title {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 12px;
}

.service-desc {
  color: var(--gray-500);
  font-size: .95rem;
  margin-bottom: 20px;
  line-height: 1.7;
}

.service-features {
  margin-bottom: 24px;
}

.service-features li {
  color: var(--gray-700);
  font-size: .875rem;
  padding: 6px 0;
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--gray-200);
}

.service-features li:last-child { border-bottom: none; }

.service-features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--green);
  font-weight: 700;
}

.service-link {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: .875rem;
  color: var(--green);
  transition: var(--transition);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.service-link:hover { gap: 8px; }

/* ============================================================
   PROJECT HIGHLIGHT
   ============================================================ */
.project-highlight {
  position: relative;
  padding: 96px 0;
  overflow: hidden;
}

.project-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.project-bg-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(13,27,62,.92) 0%,
    rgba(13,27,62,.78) 50%,
    rgba(30,99,55,.7) 100%
  );
  z-index: 1;
}

.project-content { position: relative; z-index: 2; }

.project-inner {
  max-width: 700px;
  color: var(--white);
}

.project-tag {
  display: inline-block;
  background: rgba(45,138,78,.3);
  border: 1px solid rgba(45,138,78,.5);
  color: var(--green-light);
  font-family: 'Montserrat', sans-serif;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 50px;
  margin-bottom: 20px;
}

.project-title {
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1;
  margin-bottom: 8px;
  letter-spacing: -.02em;
}

.project-subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--green-light);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 28px;
}

.project-text {
  color: rgba(255,255,255,.85);
  font-size: 1.05rem;
  margin-bottom: 16px;
  line-height: 1.8;
}

.project-sectors {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 28px 0 36px;
}

.sector-tag {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.2);
  color: var(--white);
  font-family: 'Montserrat', sans-serif;
  font-size: .8rem;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 50px;
  backdrop-filter: blur(4px);
}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testimonials { background: var(--white); }

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 64px;
}

.testimonial-card {
  background: var(--off-white);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: var(--transition);
  border: 2px solid transparent;
  position: relative;
}

.testimonial-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: var(--green-pale);
}

.testimonial-card.featured-testimonial {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  color: var(--white);
}

.testimonial-card.featured-testimonial .testimonial-text,
.testimonial-card.featured-testimonial .author-info strong,
.testimonial-card.featured-testimonial .author-info span {
  color: rgba(255,255,255,.9);
}

.testimonial-stars {
  color: #f5a623;
  font-size: 1.1rem;
  letter-spacing: 2px;
  margin-bottom: 16px;
}

.testimonial-text {
  font-style: italic;
  color: var(--gray-700);
  font-size: .95rem;
  line-height: 1.8;
  margin-bottom: 24px;
  border: none;
  padding: 0;
}

.testimonial-author {
  display: flex;
  align-items: center;
  gap: 12px;
}

.author-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--green);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: .75rem;
  flex-shrink: 0;
}

.author-info strong {
  font-family: 'Montserrat', sans-serif;
  color: var(--navy);
  display: block;
  font-size: .9rem;
}

.author-info span {
  color: var(--gray-500);
  font-size: .8rem;
}

.social-proof-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: var(--navy);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.proof-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32px 20px;
  border-right: 1px solid rgba(255,255,255,.1);
  transition: var(--transition);
}

.proof-item:last-child { border-right: none; }
.proof-item:hover { background: rgba(255,255,255,.05); }

.proof-number {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.6rem;
  font-weight: 900;
  color: var(--green-light);
  line-height: 1;
  margin-bottom: 8px;
}

.proof-label {
  color: rgba(255,255,255,.6);
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  text-align: center;
}

/* ============================================================
   CONTACT
   ============================================================ */
.contact { background: var(--gray-100); }

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 64px;
  align-items: start;
}

.contact-title { text-align: left; }

.contact-intro {
  color: var(--gray-500);
  font-size: 1.05rem;
  margin-bottom: 36px;
  line-height: 1.7;
}

.contact-details {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 32px;
}

.contact-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.contact-icon {
  font-size: 1.25rem;
  width: 40px;
  height: 40px;
  background: var(--green-pale);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.contact-item strong {
  font-family: 'Montserrat', sans-serif;
  color: var(--navy);
  display: block;
  font-size: .9rem;
  margin-bottom: 2px;
}

.contact-item p {
  color: var(--gray-500);
  font-size: .9rem;
  line-height: 1.5;
}

.contact-item a {
  color: var(--green);
  transition: var(--transition);
}

.contact-item a:hover { color: var(--green-dark); }

.social-links { display: flex; gap: 12px; }

.social-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: .85rem;
  transition: var(--transition);
}

.social-link svg { width: 18px; height: 18px; }

.social-link.facebook {
  background: #1877f2;
  color: var(--white);
}

.social-link.facebook:hover {
  background: #0d65d9;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(24,119,242,.35);
}

/* ---- Contact Form ---- */
.contact-form-wrap {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 40px;
  box-shadow: var(--shadow-md);
}

.form-title {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 28px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.form-group {
  margin-bottom: 20px;
}

.form-group label {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: .85rem;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: .02em;
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid var(--gray-200);
  border-radius: var(--radius);
  font-family: 'Open Sans', sans-serif;
  font-size: .95rem;
  color: var(--text);
  background: var(--off-white);
  transition: var(--transition);
  outline: none;
  appearance: none;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: var(--green);
  background: var(--white);
  box-shadow: 0 0 0 4px rgba(45,138,78,.1);
}

.form-group textarea { resize: vertical; min-height: 120px; }

.form-success {
  display: none;
  background: var(--green-pale);
  border: 1px solid var(--green);
  color: var(--green-dark);
  border-radius: var(--radius);
  padding: 14px 20px;
  margin-top: 16px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: .9rem;
  text-align: center;
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--navy);
  color: rgba(255,255,255,.75);
  padding: 80px 0 0;
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr;
  gap: 48px;
  margin-bottom: 56px;
}

.footer-logo {
  height: 64px;
  width: 64px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 20px;
  border: 2px solid var(--green);
}

.footer-brand p {
  font-size: .9rem;
  line-height: 1.7;
  margin-bottom: 12px;
}

.footer-legal {
  font-size: .78rem !important;
  color: rgba(255,255,255,.45) !important;
  border-top: 1px solid rgba(255,255,255,.1);
  padding-top: 12px;
}

.footer-links h4,
.footer-contact h4 {
  font-family: 'Montserrat', sans-serif;
  color: var(--white);
  font-size: .85rem;
  font-weight: 700;
  margin-bottom: 20px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.footer-links ul { display: flex; flex-direction: column; gap: 10px; }

.footer-links a {
  font-size: .875rem;
  transition: var(--transition);
}

.footer-links a:hover { color: var(--green-light); padding-left: 4px; }

.footer-contact p {
  font-size: .875rem;
  margin-bottom: 10px;
}

.footer-fb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #1877f2;
  color: var(--white);
  padding: 10px 18px;
  border-radius: var(--radius);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: .8rem;
  margin-top: 16px;
  transition: var(--transition);
}

.footer-fb:hover {
  background: #0d65d9;
  transform: translateY(-2px);
}

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.footer-bottom p {
  font-size: .8rem;
  color: rgba(255,255,255,.45);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .story-grid { grid-template-columns: 1fr; gap: 40px; }
  .services-grid { grid-template-columns: 1fr 1fr; }
  .testimonials-grid { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .social-proof-bar { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  section { padding: 64px 0; }
  .services-grid { grid-template-columns: 1fr; }
  .hero-stats { flex-direction: column; gap: 16px; }
  .stat-divider { width: 40px; height: 1px; }
  .form-row { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .social-proof-bar { grid-template-columns: repeat(2, 1fr); }

  .nav-links {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0;
    background: var(--navy);
    flex-direction: column;
    padding: 80px 24px 32px;
    gap: 4px;
    z-index: 999;
  }

  .nav-links.open { display: flex; }
  .nav-links li a { display: block; padding: 12px 16px; font-size: 1rem; }
  .nav-toggle { display: flex; z-index: 1001; }
}

@media (max-width: 480px) {
  .hero-title { font-size: 2.4rem; }
  .hero-tagline-bar { font-size: .7rem; gap: 6px; }
  .hero-actions { flex-direction: column; align-items: center; }
  .social-proof-bar { grid-template-columns: 1fr 1fr; }
  .contact-form-wrap { padding: 24px; }
  .proof-item { padding: 20px 12px; }
}

/* ============================================================
   NEW SECTIONS STYLES
   ============================================================ */

/* ---- Priorities ---- */
.priorities { background: var(--white); }
.priorities-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin-top: 40px;
}
.priority-card {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 20px;
  background: var(--off-white);
  border-radius: var(--radius);
  border: 1px solid var(--gray-200);
  transition: var(--transition);
}
.priority-card:hover {
  background: var(--green-pale);
  border-color: var(--green);
  transform: translateY(-3px);
}
.priority-icon {
  width: 40px;
  height: 40px;
  background: var(--green);
  color: var(--white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  flex-shrink: 0;
}

/* ---- Axes d'action ---- */
.axes-section { background: var(--navy); color: var(--white); }
.axes-section .section-title { color: var(--white); }
.axes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 25px;
}
.axis-card {
  background: rgba(255, 255, 255, 0.05);
  padding: 30px;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  transition: var(--transition);
}
.axis-card:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--green-light);
}
.axis-number {
  width: 45px;
  height: 45px;
  background: var(--green);
  color: var(--white);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 1.2rem;
  margin-bottom: 20px;
}
.axis-card h3 { margin-bottom: 15px; color: var(--green-light); }
.axis-card p { font-size: 0.95rem; color: rgba(255, 255, 255, 0.8); }

/* ---- Founder Section ---- */
.founder-section { background: var(--off-white); }
.founder-info-box {
  background: var(--white);
  padding: 40px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}
.founder-subtitle {
  font-size: 1.2rem;
  color: var(--gray-500);
  margin-bottom: 30px;
  font-weight: 600;
}
.founder-details p { margin-bottom: 20px; color: var(--gray-700); }
.founder-traits {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 15px;
  margin-top: 30px;
}
.trait {
  background: var(--green-pale);
  padding: 15px;
  border-radius: var(--radius);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--navy);
  border-left: 4px solid var(--green);
}

/* ---- FAQ Section ---- */
.faq-section { background: var(--white); }
.faq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
  gap: 25px;
}
.faq-item {
  background: var(--off-white);
  padding: 25px;
  border-radius: var(--radius);
  border: 1px solid var(--gray-200);
}
.faq-question {
  font-size: 1.1rem;
  color: var(--navy);
  margin-bottom: 15px;
  font-weight: 700;
}
.faq-answer {
  font-size: 0.95rem;
  color: var(--gray-700);
}

@media (max-width: 768px) {
  .faq-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   AXES D'ACTION - MISE À JOUR V5 (IMAGES)
   ============================================================ */
.axes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 32px;
    margin-top: 48px;
}

.axis-card {
    display: flex;
    flex-direction: column;
    background: var(--white);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: var(--transition);
    border: 1px solid var(--gray-200);
    height: 100%;
}

.axis-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
    border-color: var(--green-light);
}

.axis-img-placeholder {
    width: 100%;
    height: 220px;
    background: var(--gray-100);
    overflow: hidden;
    position: relative;
}

.axis-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(.4,0,.2,1);
}

.axis-card:hover .axis-img {
    transform: scale(1.1);
}

.axis-content {
    padding: 32px;
    position: relative;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.axis-content .axis-number {
    position: absolute;
    top: -28px;
    right: 32px;
    width: 56px;
    height: 56px;
    background: var(--green);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 1.05rem;
    border: 4px solid var(--white);
    box-shadow: var(--shadow-sm);
    z-index: 2;
}

.axis-content h3 {
    font-size: 1.1rem;
    color: var(--navy);
    margin-bottom: 16px;
    font-weight: 700;
}

.axis-content p {
    font-size: 0.95rem;
    color: var(--gray-500);
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 480px) {
    .axes-grid {
        grid-template-columns: 1fr;
    }
    .axis-img-placeholder {
        height: 180px;
    }
    .axis-content {
        padding: 24px;
    }
}

/* ============================================================
   AGENT IA DEVECO — WIDGET FLOTTANT
   ============================================================ */

#deveco-chat-btn {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 9999;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(145deg, #1e6337, #2d8a4e);
  border: none;
  cursor: pointer;
  box-shadow: 0 6px 28px rgba(45,138,78,.5), 0 2px 8px rgba(0,0,0,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease, box-shadow 0.3s ease;
  animation: robot-float 4s ease-in-out infinite;
  padding: 0;
}

@keyframes robot-float {
  0%, 100% { box-shadow: 0 6px 28px rgba(45,138,78,.5), 0 2px 8px rgba(0,0,0,.2); }
  50% { box-shadow: 0 10px 36px rgba(45,138,78,.7), 0 4px 14px rgba(0,0,0,.25); }
}

#deveco-chat-btn:hover {
  background: linear-gradient(145deg, #155228, #1e6337);
  box-shadow: 0 8px 36px rgba(45,138,78,.7), 0 4px 12px rgba(0,0,0,.25);
}

#deveco-chat-btn:active { transform: scale(0.95); }

.chat-notif {
  position: absolute;
  top: -4px;
  right: -4px;
  width: 20px;
  height: 20px;
  background: #e53935;
  border-radius: 50%;
  border: 2px solid #fff;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat', sans-serif;
}

#deveco-chat-window {
  position: fixed;
  bottom: 108px;
  right: 28px;
  z-index: 9998;
  width: 380px;
  background: var(--white);
  border-radius: 20px;
  box-shadow: 0 20px 60px rgba(13,27,62,.22);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: scale(0.85) translateY(20px);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.3s cubic-bezier(.4,0,.2,1), opacity 0.3s ease;
  transform-origin: bottom right;
}

#deveco-chat-window.open {
  transform: scale(1) translateY(0);
  opacity: 1;
  pointer-events: all;
}

.chat-header {
  background: var(--navy);
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.chat-header-logo {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--green);
  flex-shrink: 0;
}

.chat-header-info { flex: 1; }
.chat-header-info strong {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: .9rem;
  font-weight: 700;
  color: #fff;
}
.chat-header-info span {
  font-size: .75rem;
  color: var(--green-light);
  display: flex;
  align-items: center;
  gap: 5px;
}

.chat-status-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--green-light);
  animation: dot-pulse 2s infinite;
}
@keyframes dot-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

.chat-close-btn {
  background: rgba(255,255,255,.12);
  border: none;
  border-radius: 8px;
  width: 32px;
  height: 32px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.7);
  font-size: 1.1rem;
  transition: var(--transition);
}
.chat-close-btn:hover { background: rgba(255,255,255,.22); color:#fff; }

.chat-suggestions {
  padding: 10px 14px 6px;
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  background: var(--gray-100);
  border-bottom: 1px solid var(--gray-200);
  flex-shrink: 0;
}

.sugg-btn {
  font-family: 'Open Sans', sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  padding: 5px 11px;
  border-radius: 20px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  color: var(--navy);
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}
.sugg-btn:hover { background: var(--green-pale); border-color: var(--green); color: var(--green-dark); }

.chat-messages {
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--off-white);
  min-height: 240px;
  max-height: 300px;
}
.chat-messages::-webkit-scrollbar { width: 4px; }
.chat-messages::-webkit-scrollbar-thumb { background: var(--gray-200); border-radius: 2px; }

.msg-row { display: flex; gap: 8px; align-items: flex-end; animation: msg-in 0.25s ease; }
@keyframes msg-in { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
.msg-row.user { flex-direction: row-reverse; }

.msg-avatar {
  width: 28px; height: 28px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  font-family: 'Montserrat', sans-serif;
}
.msg-avatar.agent-av { background: var(--navy); color: var(--green-light); }
.msg-avatar.user-av  { background: var(--green-pale); color: var(--green-dark); }

.msg-bubble {
  max-width: 78%;
  padding: 10px 14px;
  border-radius: 16px;
  font-size: 13.5px;
  line-height: 1.6;
}
.msg-bubble.agent-bubble {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-bottom-left-radius: 4px;
  color: var(--gray-700);
}
.msg-bubble.user-bubble {
  background: var(--green);
  color: var(--white);
  border-bottom-right-radius: 4px;
}

.typing-row { display: flex; gap: 8px; align-items: flex-end; }
.typing-bubble {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 16px;
  border-bottom-left-radius: 4px;
  padding: 12px 16px;
  display: flex;
  gap: 5px;
}
.typing-bubble span {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--green);
  animation: tb 1.2s infinite;
}
.typing-bubble span:nth-child(2){animation-delay:.2s}
.typing-bubble span:nth-child(3){animation-delay:.4s}
@keyframes tb { 0%,80%,100%{transform:translateY(0);opacity:.4} 40%{transform:translateY(-5px);opacity:1} }

.chat-input-area {
  padding: 12px 14px;
  border-top: 1px solid var(--gray-200);
  display: flex;
  gap: 8px;
  align-items: center;
  background: var(--white);
  flex-shrink: 0;
}
.chat-input-area input {
  flex: 1;
  border: 1.5px solid var(--gray-200);
  border-radius: 10px;
  padding: 9px 14px;
  font-family: 'Open Sans', sans-serif;
  font-size: 13.5px;
  color: var(--text);
  background: var(--off-white);
  outline: none;
  transition: var(--transition);
}
.chat-input-area input:focus { border-color: var(--green); background: var(--white); }
.chat-input-area input::placeholder { color: var(--gray-500); }

.chat-send-btn {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: var(--green);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition);
  flex-shrink: 0;
}
.chat-send-btn:hover { background: var(--green-dark); }
.chat-send-btn:disabled { opacity:.5; cursor:not-allowed; }
.chat-send-btn svg { width: 18px; height: 18px; color: #fff; }

.chat-footer {
  padding: 7px;
  text-align: center;
  font-size: 10.5px;
  color: var(--gray-500);
  background: var(--white);
  border-top: 1px solid var(--gray-200);
}

@media (max-width: 480px) {
  #deveco-chat-window { width: calc(100vw - 24px); right: 12px; bottom: 96px; }
  #deveco-chat-btn { bottom: 20px; right: 16px; }
}

/* ============================================================
   PARTENAIRES — DÉFILEMENT INFINI
   ============================================================ */
.partners-section {
  background: var(--off-white);
  padding: 64px 0;
  overflow: hidden;
}

.partners-track-wrap {
  overflow: hidden;
  position: relative;
  margin: 0 -24px;
}

/* Masques flous sur les côtés */
.partners-track-wrap::before,
.partners-track-wrap::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 120px;
  z-index: 2;
  pointer-events: none;
}
.partners-track-wrap::before {
  left: 0;
  background: linear-gradient(to right, var(--off-white), transparent);
}
.partners-track-wrap::after {
  right: 0;
  background: linear-gradient(to left, var(--off-white), transparent);
}

.partners-track {
  display: flex;
  gap: 24px;
  width: max-content;
  animation: scroll-partners 22s linear infinite;
  padding: 16px 24px;
}

.partners-track:hover { animation-play-state: paused; }

@keyframes scroll-partners {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.partner-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 16px;
  width: 180px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 20px;
  flex-shrink: 0;
  box-shadow: 0 2px 12px rgba(13,27,62,.06);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.partner-card:hover {
  box-shadow: 0 6px 24px rgba(13,27,62,.13);
  transform: translateY(-3px);
}

.partner-card img {
  max-width: 100%;
  max-height: 68px;
  object-fit: contain;
  filter: grayscale(30%);
  transition: filter 0.3s ease;
}

.partner-card:hover img { filter: grayscale(0%); }

.partner-placeholder {
  border: 2px dashed var(--gray-200);
  background: transparent;
  box-shadow: none;
}

.partner-placeholder span {
  font-family: 'Montserrat', sans-serif;
  font-size: .72rem;
  font-weight: 600;
  color: var(--gray-500);
  text-align: center;
  line-height: 1.5;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* ============================================================
   RÉSEAUX SOCIAUX FOOTER
   ============================================================ */
.footer-social-icons {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}

.footer-social-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition);
  flex-shrink: 0;
}

.footer-social-icon:hover { transform: translateY(-3px); }

.footer-instagram {
  background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  color: #fff;
}

.footer-linkedin {
  background: #0077b5;
  color: #fff;
}

.footer-youtube {
  background: #ff0000;
  color: #fff;
}

/* ============================================================
   COOKIE BANNER
   ============================================================ */
#cookie-banner {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99999;
  width: calc(100% - 48px);
  max-width: 820px;
  background: var(--navy);
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  padding: 20px 24px;
  display: flex;
  align-items: center;
  gap: 20px;
  border: 1px solid rgba(255,255,255,.1);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.cookie-inner {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  flex-wrap: wrap;
}

.cookie-text {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex: 1;
  min-width: 200px;
}

.cookie-icon { font-size: 1.6rem; flex-shrink: 0; line-height: 1; }

.cookie-text strong {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: .9rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 4px;
}

.cookie-text p {
  font-size: .8rem;
  color: rgba(255,255,255,.65);
  line-height: 1.5;
  margin: 0;
}

.cookie-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

.cookie-btn {
  font-family: 'Montserrat', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  padding: 10px 20px;
  border-radius: 10px;
  border: none;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}

.cookie-accept {
  background: var(--green);
  color: #fff;
}

.cookie-accept:hover {
  background: var(--green-dark);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(45,138,78,.4);
}

.cookie-ignore {
  background: rgba(255,255,255,.1);
  color: rgba(255,255,255,.8);
  border: 1px solid rgba(255,255,255,.2) !important;
}

.cookie-ignore:hover {
  background: rgba(255,255,255,.18);
  color: #fff;
}

@media (max-width: 600px) {
  #cookie-banner { bottom: 12px; width: calc(100% - 24px); padding: 16px; }
  .cookie-inner { flex-direction: column; gap: 14px; }
  .cookie-actions { width: 100%; }
  .cookie-btn { flex: 1; text-align: center; }
}

/* ============================================================
   BOUTON PARTENAIRE NAVBAR (complément responsive)
   ============================================================ */
@media (max-width: 768px) {
  .nav-partner { margin: 4px 0 !important; }
}

/* ============================================================
   BANNIÈRE DEVENIR PARTENAIRE (milieu de page)
   ============================================================ */
.partner-banner-strip {
  background: linear-gradient(135deg, var(--green-dark) 0%, var(--green) 50%, #1e8a4e 100%);
  padding: 56px 0;
  position: relative;
  overflow: hidden;
}

.partner-banner-strip::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('cover.jpeg') center/cover no-repeat;
  opacity: 0.06;
}

.partner-banner-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}

.partner-banner-text { flex: 1; min-width: 280px; }

.partner-banner-tag {
  display: inline-block;
  background: rgba(255,255,255,.18);
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 5px 14px;
  border-radius: 50px;
  margin-bottom: 14px;
  border: 1px solid rgba(255,255,255,.25);
}

.partner-banner-text h2 {
  font-size: clamp(1.15rem, 2.5vw, 1.5rem);
  font-weight: 900;
  color: #fff;
  margin-bottom: 10px;
  line-height: 1.25;
}

.partner-banner-text p {
  color: rgba(255,255,255,.82);
  font-size: .95rem;
  line-height: 1.65;
  margin: 0;
  max-width: 520px;
}

.partner-banner-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-shrink: 0;
}

.partner-banner-btn-main {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--green-dark);
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: .9rem;
  padding: 14px 28px;
  border-radius: var(--radius);
  transition: var(--transition);
  white-space: nowrap;
  letter-spacing: .02em;
}

.partner-banner-btn-main:hover {
  background: var(--green-pale);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.2);
}

.partner-banner-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: rgba(255,255,255,.9);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: .85rem;
  padding: 12px 28px;
  border-radius: var(--radius);
  border: 2px solid rgba(255,255,255,.4);
  transition: var(--transition);
  white-space: nowrap;
}

.partner-banner-btn-secondary:hover {
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.8);
}

@media (max-width: 768px) {
  .partner-banner-inner { flex-direction: column; text-align: center; }
  .partner-banner-text p { max-width: 100%; }
  .partner-banner-actions { width: 100%; }
  .partner-banner-btn-main,
  .partner-banner-btn-secondary { width: 100%; }
}

/* ============================================================
   CARROUSEL TÉMOIGNAGES
   ============================================================ */
.testi-carousel-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0 0 28px;
  padding: 0;
}

.testi-carousel-viewport {
  overflow: hidden;
  flex: 1;
  padding: 12px 0 20px;
}

.testi-track {
  display: flex;
  gap: 24px;
  transition: transform 0.45s cubic-bezier(.4,0,.2,1);
  will-change: transform;
  padding: 0 24px;
}

.testi-slide {
  flex: 0 0 calc(33.333% - 16px);
  min-width: calc(33.333% - 16px);
}

/* Flèches */
.testi-arrow {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid var(--gray-200);
  background: var(--white);
  color: var(--navy);
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition);
  z-index: 2;
  box-shadow: var(--shadow-sm);
  position: relative;
}

.testi-prev { margin: 0 8px 0 24px; }
.testi-next { margin: 0 24px 0 8px; }

.testi-arrow:hover {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
  transform: scale(1.08);
}

.testi-arrow:disabled {
  opacity: .35;
  cursor: not-allowed;
  transform: none;
}

/* Points de navigation */
.testi-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-bottom: 40px;
}

.testi-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gray-200);
  border: none;
  cursor: pointer;
  transition: var(--transition);
  padding: 0;
}

.testi-dot.active {
  background: var(--green);
  width: 24px;
  border-radius: 4px;
}

/* Responsive — 2 cartes sur tablette, 1 sur mobile */
@media (max-width: 1024px) {
  .testi-slide { flex: 0 0 calc(50% - 12px); min-width: calc(50% - 12px); }
}

@media (max-width: 640px) {
  .testi-slide { flex: 0 0 calc(100% - 48px); min-width: calc(100% - 48px); }
  .testi-arrow { width: 36px; height: 36px; font-size: .95rem; }
  .testi-prev { margin-left: 12px; }
  .testi-next { margin-right: 12px; }
}


/* ============================================================
   PAGE-SPECIFIC STYLES (merged from inline <style> blocks)
   ============================================================ */

/* --- from index.html --- */
.nav-item-dropdown { position: relative; }
    .nav-item-dropdown > a::after { content: ' ▾'; font-size: .65rem; opacity: .7; }
    .dropdown-menu {
      display: none; position: absolute; top: calc(100% + 10px); left: 50%;
      transform: translateX(-50%); background: var(--navy);
      border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius);
      min-width: 280px; box-shadow: 0 16px 40px rgba(0,0,0,.35); z-index: 2000; overflow: hidden;
    }
    .nav-item-dropdown:hover .dropdown-menu { display: block; }
    .dropdown-header {
      padding: 10px 18px 8px; font-family: 'Montserrat', sans-serif; font-size: .65rem;
      font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
      color: var(--green-light); background: rgba(45,138,78,.15);
      border-bottom: 1px solid rgba(255,255,255,.1);
    }
    .dropdown-menu a {
      display: flex; align-items: center; gap: 8px; padding: 9px 18px;
      color: rgba(255,255,255,.8) !important; font-family: 'Montserrat', sans-serif;
      font-size: .78rem; font-weight: 600; border-bottom: 1px solid rgba(255,255,255,.06);
      transition: var(--transition); background: transparent !important;
    }
    .dropdown-menu a:last-child { border-bottom: none; }
    .dropdown-menu a:hover { background: rgba(45,138,78,.2) !important; color: var(--green-light) !important; padding-left: 22px; }
    .dropdown-num {
      display: inline-flex; width: 20px; height: 20px; background: var(--green);
      color: #fff; border-radius: 50%; font-size: .62rem; font-weight: 800;
      align-items: center; justify-content: center; flex-shrink: 0;
    }
    @media (max-width: 768px) {
      .dropdown-menu { position: static; transform: none; box-shadow: none; border: none; border-radius: 0; background: rgba(255,255,255,.06); display: none; min-width: unset; }
      .nav-item-dropdown.open .dropdown-menu { display: block; }
      .dropdown-menu a { padding: 9px 32px; font-size: .85rem; }
    }

    /* === Harmonisation hauteur liens navbar === */
    .nav-links li a {
      font-size: .82rem !important;
      padding: 7px 11px !important;
    }
    .nav-cta {
      padding: 7px 16px !important;
      font-size: .82rem !important;
    }

/* --- from axes.html --- */
.nav-item-dropdown { position: relative; }
    .nav-item-dropdown > a::after { content: ' ▾'; font-size: .65rem; opacity: .7; }
    .dropdown-menu {
      display: none; position: absolute; top: calc(100% + 10px); left: 50%;
      transform: translateX(-50%); background: var(--navy);
      border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius);
      min-width: 280px; box-shadow: 0 16px 40px rgba(0,0,0,.35); z-index: 2000; overflow: hidden;
    }
    .nav-item-dropdown:hover .dropdown-menu { display: block; }
    .dropdown-header {
      padding: 10px 18px 8px; font-family: 'Montserrat', sans-serif; font-size: .65rem;
      font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
      color: var(--green-light); background: rgba(45,138,78,.15);
      border-bottom: 1px solid rgba(255,255,255,.1);
    }
    .dropdown-menu a {
      display: flex; align-items: center; gap: 8px; padding: 9px 18px;
      color: rgba(255,255,255,.8) !important; font-family: 'Montserrat', sans-serif;
      font-size: .78rem; font-weight: 600; border-bottom: 1px solid rgba(255,255,255,.06);
      transition: var(--transition); background: transparent !important;
    }
    .dropdown-menu a:last-child { border-bottom: none; }
    .dropdown-menu a:hover { background: rgba(45,138,78,.2) !important; color: var(--green-light) !important; padding-left: 22px; }
    .dropdown-num {
      display: inline-flex; width: 20px; height: 20px; background: var(--green);
      color: #fff; border-radius: 50%; font-size: .62rem; font-weight: 800;
      align-items: center; justify-content: center; flex-shrink: 0;
    }
    @media (max-width: 768px) {
      .dropdown-menu { position: static; transform: none; box-shadow: none; border: none; border-radius: 0; background: rgba(255,255,255,.06); display: none; min-width: unset; }
      .nav-item-dropdown.open .dropdown-menu { display: block; }
      .dropdown-menu a { padding: 9px 32px; font-size: .85rem; }
    }

    /* === Harmonisation hauteur liens navbar === */
    .nav-links li a {
      font-size: .82rem !important;
      padding: 7px 11px !important;
    }
    .nav-cta {
      padding: 7px 16px !important;
      font-size: .82rem !important;
    }

    /* === Hero page intérieure === */
    .page-hero {
      position: relative;
      background: var(--navy);
      padding: 140px 0 80px;
      overflow: hidden;
      text-align: center;
    }
    .page-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(45,138,78,.18) 0%, transparent 60%);
      pointer-events: none;
    }
    .page-hero-tag {
      display: inline-block;
      font-family: 'Montserrat', sans-serif;
      font-size: .7rem;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--green-light);
      background: rgba(45,138,78,.15);
      border: 1px solid rgba(45,138,78,.3);
      border-radius: 50px;
      padding: 6px 18px;
      margin-bottom: 20px;
    }
    .page-hero h1 {
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(2rem, 5vw, 3.2rem);
      font-weight: 800;
      color: #fff;
      margin: 0 0 16px;
      line-height: 1.15;
    }
    .page-hero p {
      font-family: 'Open Sans', sans-serif;
      font-size: .93rem;
      color: rgba(255,255,255,.65);
      max-width: 580px;
      margin: 0 auto 32px;
      line-height: 1.7;
    }
    .page-hero-breadcrumb {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-family: 'Montserrat', sans-serif;
      font-size: .75rem;
      color: rgba(255,255,255,.4);
      margin-top: 8px;
    }
    .page-hero-breadcrumb a {
      color: rgba(255,255,255,.5);
      text-decoration: none;
      transition: color .2s;
    }
    .page-hero-breadcrumb a:hover { color: var(--green-light); }
    .page-hero-breadcrumb .sep { opacity: .4; }

    /* === Axes section standalone === */
    .axes-section-page {
      background: var(--light-bg, #f8f9f6);
      padding: 80px 0 100px;
    }

    /* === CTA retour accueil === */
    .back-cta {
      text-align: center;
      padding: 48px 0 0;
    }
    .back-cta a {
      font-family: 'Montserrat', sans-serif;
      font-size: .82rem;
      font-weight: 700;
      color: rgba(255,255,255,.5);
      text-decoration: none;
      transition: color .2s;
    }
    .back-cta a:hover { color: var(--green-light); }

/* --- from tourisme.html --- */
/* Harmonisation navbar — toutes pages */
    .nav-links li a {
      font-size: .82rem !important;
      padding: 7px 11px !important;
      line-height: 1 !important;
    }
    .nav-cta {
      padding: 7px 16px !important;
      font-size: .82rem !important;
    }
    /* Dropdown FAQ */
    .nav-item-dropdown { position: relative; }
    .nav-item-dropdown > a { display: inline-flex; align-items: center; gap: 2px; }
    .nav-item-dropdown > a::after { content: '▾'; font-size: .6rem; opacity: .7; margin-left: 2px; }
    .dropdown-menu {
      display: none; position: absolute; top: calc(100% + 8px); left: 50%;
      transform: translateX(-50%); background: var(--navy);
      border: 1px solid rgba(255,255,255,.12); border-radius: 12px;
      min-width: 272px; box-shadow: 0 16px 40px rgba(0,0,0,.35);
      z-index: 2000; overflow: hidden;
    }
    .nav-item-dropdown:hover .dropdown-menu { display: block; }
    .dropdown-header {
      padding: 9px 16px 7px; font-family: 'Montserrat', sans-serif;
      font-size: .62rem; font-weight: 700; letter-spacing: .12em;
      text-transform: uppercase; color: var(--green-light);
      background: rgba(45,138,78,.15);
      border-bottom: 1px solid rgba(255,255,255,.1);
    }
    /* Les liens du dropdown ont leur propre style — ne doit PAS hériter du .nav-links li a */
    .dropdown-menu a {
      display: flex !important; align-items: center !important;
      gap: 8px !important; padding: 8px 16px !important;
      color: rgba(255,255,255,.82) !important;
      font-family: 'Montserrat', sans-serif !important;
      font-size: .76rem !important; font-weight: 600 !important;
      border-bottom: 1px solid rgba(255,255,255,.06) !important;
      transition: background .2s, padding-left .2s !important;
      background: transparent !important;
      line-height: 1.3 !important;
    }
    .dropdown-menu a:last-child { border-bottom: none !important; }
    .dropdown-menu a:hover {
      background: rgba(45,138,78,.2) !important;
      color: var(--green-light) !important;
      padding-left: 20px !important;
    }
    .dropdown-num {
      display: inline-flex; width: 19px; height: 19px;
      background: var(--green); color: #fff; border-radius: 50%;
      font-size: .6rem; font-weight: 800;
      align-items: center; justify-content: center; flex-shrink: 0;
    }
    @media (max-width: 768px) {
      .dropdown-menu {
        position: static; transform: none; box-shadow: none;
        border: none; border-radius: 0;
        background: rgba(255,255,255,.06); display: none; min-width: unset;
      }
      .nav-item-dropdown.open .dropdown-menu { display: block; }
      .dropdown-menu a { padding: 8px 28px !important; font-size: .84rem !important; }
    }

/* --- from tourisme.html --- */
/* ===== TOURISME PAGE ===== */
    .tourisme-hero {
      position: relative; min-height: 92vh;
      display: flex; align-items: center; overflow: hidden;
    }
    .tourisme-hero-bg { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center; }
    .tourisme-hero-overlay {
      position:absolute;inset:0;
      background: linear-gradient(135deg, rgba(13,27,62,.85) 0%, rgba(13,27,62,.6) 50%, rgba(30,99,55,.5) 100%);
      z-index:1;
    }
    .tourisme-hero-content { position:relative;z-index:2;color:#fff;padding:120px 0 80px;max-width:680px; }
    .tourisme-hero-content h1 { font-size:clamp(1.7rem,3.8vw,2.6rem);font-weight:900;line-height:1.1;margin-bottom:12px; }
    .tourisme-hero-content h1 span { color:var(--green-light); }
    .tourisme-hero-content p { font-size:.95rem;color:rgba(255,255,255,.82);line-height:1.7;max-width:520px;margin-bottom:36px; }
    .tourisme-badges { display:flex;flex-wrap:wrap;gap:10px;margin-bottom:36px; }
    .tourisme-badge { background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;font-family:'Montserrat',sans-serif;font-size:.8rem;font-weight:600;padding:8px 16px;border-radius:50px;backdrop-filter:blur(4px); }

    /* Intro Mongoumba */
    .mongoumba-intro { background:var(--white);padding:80px 0; }
    .mongoumba-grid { display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center; }
    .mongoumba-text h2 { font-size:clamp(1.3rem,2.8vw,1.85rem);font-weight:800;color:var(--navy);margin-bottom:20px;line-height:1.3; }
    .mongoumba-text h2 span { color:var(--green); }
    .mongoumba-text p { color:var(--gray-700);font-size:1rem;line-height:1.8;margin-bottom:16px; }
    .mongoumba-stats { display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px; }
    .mstat { background:var(--green-pale);border-radius:var(--radius);padding:20px;text-align:center; }
    .mstat-num { font-family:'Montserrat',sans-serif;font-size:1.8rem;font-weight:900;color:var(--green-dark);display:block;margin-bottom:4px; }
    .mstat-label { font-size:.8rem;color:var(--gray-500);font-family:'Montserrat',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.06em; }
    .mongoumba-img { border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);position:relative; }
    .mongoumba-img img { width:100%;height:420px;object-fit:cover;display:block; }
    .mongoumba-img-caption { position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(13,27,62,.8));color:rgba(255,255,255,.9);font-size:.8rem;padding:32px 16px 14px;font-style:italic; }

    /* Expériences touristiques */
    .experiences { background:var(--navy);padding:80px 0; }
    .experiences .section-title { color:#fff; }
    .experiences-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px; }
    .exp-card { background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-lg);overflow:hidden;transition:var(--transition); }
    .exp-card:hover { background:rgba(255,255,255,.1);border-color:var(--green-light);transform:translateY(-6px); }
    .exp-img { height:200px;overflow:hidden;position:relative; }
    .exp-img img { width:100%;height:100%;object-fit:cover;transition:transform .5s ease; }
    .exp-card:hover .exp-img img { transform:scale(1.07); }
    .exp-cat { position:absolute;top:14px;left:14px;background:var(--green);color:#fff;font-family:'Montserrat',sans-serif;font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:50px; }
    .exp-body { padding:24px; }
    .exp-title { font-size:1.05rem;font-weight:700;color:#fff;margin-bottom:10px;line-height:1.4; }
    .exp-desc { font-size:.88rem;color:rgba(255,255,255,.65);line-height:1.6;margin-bottom:16px; }
    .exp-tags { display:flex;flex-wrap:wrap;gap:6px; }
    .exp-tag { background:rgba(76,175,114,.15);color:var(--green-light);font-size:.68rem;font-weight:600;font-family:'Montserrat',sans-serif;padding:3px 9px;border-radius:50px;border:1px solid rgba(76,175,114,.25); }

    /* Galerie tourisme */
    .tourisme-gallery { padding:64px 0;background:var(--off-white); }
    .tgallery { display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto;gap:14px; }
    .tgallery-item { border-radius:var(--radius);overflow:hidden;position:relative;cursor:pointer; }
    .tgallery-item:first-child { grid-column:span 2;grid-row:span 2; }
    .tgallery-item img { width:100%;height:100%;object-fit:cover;min-height:160px;display:block;transition:transform .4s ease; }
    .tgallery-item:first-child img { min-height:340px; }
    .tgallery-item:hover img { transform:scale(1.05); }
    .tgallery-overlay { position:absolute;inset:0;background:rgba(13,27,62,0);display:flex;align-items:flex-end;padding:14px;transition:background .3s; }
    .tgallery-item:hover .tgallery-overlay { background:rgba(13,27,62,.45); }
    .tgallery-caption { color:#fff;font-size:.75rem;font-style:italic;opacity:0;transition:opacity .3s; }
    .tgallery-item:hover .tgallery-caption { opacity:1; }

    /* Section Aka */
    .aka-section { background:var(--white);padding:80px 0; }
    .aka-grid { display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center; }
    .aka-text h2 { font-size:clamp(1.3rem,2.8vw,1.85rem);font-weight:800;color:var(--navy);margin-bottom:16px; }
    .aka-text h2 span { color:var(--green); }
    .aka-text p { color:var(--gray-700);font-size:1rem;line-height:1.8;margin-bottom:16px; }
    .aka-values { display:flex;flex-direction:column;gap:12px;margin-top:24px; }
    .aka-value { display:flex;gap:14px;align-items:flex-start;padding:14px;background:var(--off-white);border-radius:var(--radius); }
    .aka-value-icon { font-size:1.4rem;flex-shrink:0;width:36px;text-align:center; }
    .aka-value strong { font-family:'Montserrat',sans-serif;color:var(--navy);display:block;margin-bottom:3px;font-size:.9rem; }
    .aka-value p { color:var(--gray-500);font-size:.85rem;margin:0; }
    .aka-img { border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);position:relative; }
    .aka-img img { width:100%;height:400px;object-fit:cover;display:block; }

    /* Transport fluvial */
    .fluvial-section { background:var(--navy);padding:80px 0; }
    .fluvial-grid { display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center; }
    .fluvial-text h2 { font-size:clamp(1.3rem,2.8vw,1.85rem);font-weight:800;color:#fff;margin-bottom:16px; }
    .fluvial-text h2 span { color:var(--green-light); }
    .fluvial-text p { color:rgba(255,255,255,.78);font-size:1rem;line-height:1.8;margin-bottom:16px; }
    .fluvial-points { list-style:none;display:flex;flex-direction:column;gap:10px;margin-top:20px; }
    .fluvial-points li { display:flex;align-items:flex-start;gap:12px;color:rgba(255,255,255,.8);font-size:.95rem;line-height:1.6; }
    .fluvial-points li::before { content:'✓';width:22px;height:22px;background:var(--green);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;flex-shrink:0;margin-top:2px; }
    .fluvial-img { border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg); }
    .fluvial-img img { width:100%;height:380px;object-fit:cover;display:block; }

    /* CTA */
    .tourisme-cta { background:var(--green-dark);padding:64px 0;text-align:center; }
    .tourisme-cta h2 { color:#fff;font-size:1.45rem;font-weight:800;margin-bottom:12px; }
    .tourisme-cta p { color:rgba(255,255,255,.8);max-width:500px;margin:0 auto 32px; }
    .tourisme-cta-btns { display:flex;gap:16px;justify-content:center;flex-wrap:wrap; }

    @media(max-width:1024px){.experiences-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:768px){.mongoumba-grid,.aka-grid,.fluvial-grid{grid-template-columns:1fr}.experiences-grid{grid-template-columns:1fr}.tgallery{grid-template-columns:1fr 1fr}.tgallery-item:first-child{grid-column:span 2}}
    @media(max-width:480px){.tgallery{grid-template-columns:1fr}.tgallery-item:first-child{grid-column:span 1}.mongoumba-stats{grid-template-columns:1fr 1fr}}

/* --- from fondateur.html --- */
/* ---- Page Fondateur ---- */
    .founder-page-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
      padding: 140px 0 0;
      position: relative;
      overflow: hidden;
    }
    .founder-page-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url('cover.jpeg') center/cover no-repeat;
      opacity: 0.07;
    }

    .founder-hero-inner {
      display: grid;
      grid-template-columns: 1fr 420px;
      gap: 64px;
      align-items: end;
      position: relative;
      z-index: 1;
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px;
    }

    .founder-hero-text { padding-bottom: 64px; }
    .founder-hero-text .section-tag { background: rgba(76,175,114,.2); color: var(--green-light); margin-bottom: 20px; }
    .founder-hero-text h1 {
      font-size: clamp(1.6rem,3.5vw,2.4rem);
      font-weight: 900;
      color: #fff;
      line-height: 1.15;
      margin-bottom: 8px;
    }
    .founder-hero-text h1 span { color: var(--green-light); }
    .founder-hero-role {
      font-family: 'Montserrat', sans-serif;
      font-size: 1rem;
      font-weight: 600;
      color: rgba(255,255,255,.65);
      letter-spacing: .06em;
      text-transform: uppercase;
      margin-bottom: 28px;
    }
    .founder-hero-lead {
      color: rgba(255,255,255,.8);
      font-size: 1.05rem;
      line-height: 1.8;
      max-width: 520px;
      margin-bottom: 36px;
    }
    .founder-hero-tags { display: flex; flex-wrap: wrap; gap: 10px; }
    .founder-tag {
      background: rgba(255,255,255,.1);
      border: 1px solid rgba(255,255,255,.2);
      color: rgba(255,255,255,.85);
      font-family: 'Montserrat', sans-serif;
      font-size: .78rem;
      font-weight: 600;
      padding: 7px 16px;
      border-radius: 50px;
    }

    /* Portrait */
    .founder-portrait-wrap {
      position: relative;
      align-self: flex-end;
    }
    .founder-portrait-wrap img {
      width: 100%;
      max-width: 420px;
      display: block;
      border-radius: 20px 20px 0 0;
      object-fit: cover;
      object-position: top;
      filter: drop-shadow(0 -20px 40px rgba(0,0,0,.3));
    }
    .founder-portrait-badge {
      position: absolute;
      bottom: 24px;
      left: 20px;
      background: var(--green);
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: .75rem;
      font-weight: 700;
      padding: 8px 16px;
      border-radius: 50px;
      letter-spacing: .05em;
    }

    /* Biographie détaillée */
    .founder-bio-section { background: var(--white); padding: 80px 0; }
    .founder-bio-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: start;
    }

    .bio-block { margin-bottom: 36px; }
    .bio-block-title {
      font-family: 'Montserrat', sans-serif;
      font-size: 1rem;
      font-weight: 800;
      color: var(--navy);
      text-transform: uppercase;
      letter-spacing: .08em;
      margin-bottom: 14px;
      padding-bottom: 10px;
      border-bottom: 2px solid var(--green-pale);
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .bio-block-title::before {
      content: '';
      width: 4px;
      height: 18px;
      background: var(--green);
      border-radius: 2px;
      flex-shrink: 0;
    }
    .bio-block p {
      color: var(--gray-700);
      font-size: .98rem;
      line-height: 1.8;
      margin-bottom: 14px;
    }

    /* Timeline */
    .founder-timeline { list-style: none; }
    .founder-timeline li {
      display: flex;
      gap: 16px;
      margin-bottom: 20px;
      align-items: flex-start;
    }
    .tl-year {
      font-family: 'Montserrat', sans-serif;
      font-size: .78rem;
      font-weight: 800;
      color: var(--green);
      min-width: 52px;
      padding-top: 3px;
    }
    .tl-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: var(--green);
      flex-shrink: 0;
      margin-top: 6px;
      position: relative;
    }
    .tl-dot::after {
      content: '';
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translateX(-50%);
      width: 2px;
      height: 28px;
      background: var(--gray-200);
    }
    .founder-timeline li:last-child .tl-dot::after { display: none; }
    .tl-content { font-size: .92rem; color: var(--gray-700); line-height: 1.6; }
    .tl-content strong { color: var(--navy); font-family: 'Montserrat', sans-serif; font-size: .85rem; display: block; margin-bottom: 2px; }

    /* Compétences */
    .skills-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .skill-item {
      display: flex;
      align-items: center;
      gap: 10px;
      background: var(--off-white);
      border-radius: var(--radius);
      padding: 12px 16px;
      font-size: .88rem;
      color: var(--navy);
      font-family: 'Montserrat', sans-serif;
      font-weight: 600;
      border-left: 3px solid var(--green);
    }

    /* Citation */
    .founder-quote-section {
      background: var(--navy);
      padding: 72px 0;
      text-align: center;
    }
    .founder-quote-section blockquote {
      font-family: 'Montserrat', sans-serif;
      font-size: clamp(1.1rem,2.2vw,1.45rem);
      font-weight: 300;
      font-style: italic;
      color: rgba(255,255,255,.9);
      max-width: 780px;
      margin: 0 auto 24px;
      line-height: 1.6;
      border: none;
    }
    .founder-quote-section cite {
      font-family: 'Montserrat', sans-serif;
      font-size: .85rem;
      font-weight: 700;
      color: var(--green-light);
      letter-spacing: .06em;
      font-style: normal;
    }

    /* CTA */
    .founder-cta { background: var(--green-pale); padding: 64px 0; text-align: center; }
    .founder-cta h2 { color: var(--navy); font-size: 1.4rem; font-weight: 800; margin-bottom: 12px; }
    .founder-cta p { color: var(--gray-500); margin-bottom: 32px; }
    .founder-cta-btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

    @media (max-width: 900px) {
      .founder-hero-inner { grid-template-columns: 1fr; }
      .founder-portrait-wrap { max-width: 320px; margin: 0 auto; }
      .founder-bio-grid { grid-template-columns: 1fr; gap: 32px; }
      .skills-grid { grid-template-columns: 1fr; }
    }

/* --- from faq.html --- */


/* --- from faq.html --- */
/* ---- Styles spécifiques à la page FAQ ---- */
    .faq-page-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 60%, var(--green-dark) 100%);
      padding: 140px 0 80px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .faq-page-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url('cover.jpeg') center/cover no-repeat;
      opacity: 0.08;
    }
    .faq-page-hero .container { position: relative; z-index: 1; }
    .faq-page-hero h1 {
      font-size: clamp(1.6rem,3.5vw,2.4rem);
      font-weight: 900;
      color: #fff;
      margin-bottom: 16px;
    }
    .faq-page-hero h1 span { color: var(--green-light); }
    .faq-page-hero p {
      color: rgba(255,255,255,.75);
      font-size: 1.1rem;
      max-width: 560px;
      margin: 0 auto 32px;
    }

    /* Navigation FAQ */
    .faq-nav {
      background: var(--white);
      border-bottom: 1px solid var(--gray-200);
      position: sticky;
      top: 68px;
      z-index: 100;
      box-shadow: var(--shadow-sm);
    }
    .faq-nav-inner {
      display: flex;
      gap: 0;
      overflow-x: auto;
      scrollbar-width: none;
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px;
    }
    .faq-nav-inner::-webkit-scrollbar { display: none; }
    .faq-nav-link {
      font-family: 'Montserrat', sans-serif;
      font-size: .8rem;
      font-weight: 700;
      letter-spacing: .04em;
      text-transform: uppercase;
      color: var(--gray-500);
      padding: 16px 18px;
      white-space: nowrap;
      border-bottom: 3px solid transparent;
      transition: var(--transition);
    }
    .faq-nav-link:hover, .faq-nav-link.active {
      color: var(--green);
      border-bottom-color: var(--green);
    }

    /* Blocs FAQ */
    .faq-block {
      padding: 80px 0;
      border-bottom: 1px solid var(--gray-200);
    }
    .faq-block:nth-child(even) { background: var(--off-white); }
    .faq-block:last-child { border-bottom: none; }

    .faq-block-inner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: center;
    }
    .faq-block-inner.reverse { direction: rtl; }
    .faq-block-inner.reverse > * { direction: ltr; }

    .faq-block-text {}
    .faq-question-title {
      font-size: clamp(1.2rem,2.5vw,1.6rem);
      font-weight: 800;
      color: var(--navy);
      margin-bottom: 20px;
      line-height: 1.3;
    }
    .faq-question-title span { color: var(--green); }
    .faq-answer-text {
      color: var(--gray-700);
      font-size: 1rem;
      line-height: 1.8;
      margin-bottom: 20px;
    }
    .faq-answer-text strong { color: var(--navy); }
    .faq-points {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin-top: 20px;
    }
    .faq-points li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-size: .95rem;
      color: var(--gray-700);
      line-height: 1.6;
    }
    .faq-points li::before {
      content: '✓';
      width: 22px;
      height: 22px;
      background: var(--green);
      color: #fff;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: .75rem;
      font-weight: 700;
      flex-shrink: 0;
      margin-top: 2px;
    }

    /* Image FAQ */
    .faq-block-img {
      border-radius: var(--radius-lg);
      overflow: hidden;
      box-shadow: var(--shadow-lg);
      position: relative;
    }
    .faq-block-img img {
      width: 100%;
      height: 340px;
      object-fit: cover;
      display: block;
      transition: transform 0.5s ease;
    }
    .faq-block-img:hover img { transform: scale(1.04); }
    .faq-img-caption {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      background: linear-gradient(transparent, rgba(13,27,62,.8));
      color: rgba(255,255,255,.9);
      font-size: .8rem;
      padding: 32px 16px 14px;
      font-style: italic;
    }

    /* Badge de section */
    .faq-section-tag {
      display: inline-block;
      background: var(--green-pale);
      color: var(--green-dark);
      font-family: 'Montserrat', sans-serif;
      font-size: .7rem;
      font-weight: 700;
      letter-spacing: .15em;
      text-transform: uppercase;
      padding: 5px 14px;
      border-radius: 50px;
      margin-bottom: 14px;
    }

    /* CTA bas de page */
    .faq-cta-bar {
      background: var(--navy);
      padding: 64px 0;
      text-align: center;
    }
    .faq-cta-bar h2 {
      color: #fff;
      font-size: 1.8rem;
      font-weight: 800;
      margin-bottom: 12px;
    }
    .faq-cta-bar p {
      color: rgba(255,255,255,.7);
      margin-bottom: 32px;
    }
    .faq-cta-btns {
      display: flex;
      gap: 16px;
      justify-content: center;
      flex-wrap: wrap;
    }

    /* Responsive */
    @media (max-width: 900px) {
      .faq-block-inner { grid-template-columns: 1fr; gap: 32px; }
      .faq-block-inner.reverse { direction: ltr; }
      .faq-block-img img { height: 260px; }
    }
    @media (max-width: 600px) {
      .faq-block { padding: 48px 0; }
      .faq-question-title { font-size: 1.1rem; }
    }

/* --- from partenaire.html --- */
/* Dropdown nav */

    /* ===== PAGE PARTENAIRE ===== */
    .partner-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 55%, var(--green-dark) 100%);
      padding: 140px 0 80px;
      position: relative;
      overflow: hidden;
      text-align: center;
    }
    .partner-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url('ngodo.jpeg') center/cover no-repeat;
      opacity: 0.07;
    }
    .partner-hero .container { position: relative; z-index: 1; }
    .partner-hero h1 { font-size: clamp(1.6rem,3.5vw,2.4rem); font-weight: 900; color: #fff; margin-bottom: 12px; line-height: 1.2; }
    .partner-hero h1 span { color: var(--green-light); }
    .partner-hero p { color: rgba(255,255,255,.78); font-size: .95rem; max-width: 580px; margin: 0 auto 36px; line-height: 1.7; }

    /* Avantages partenariat */
    .partner-benefits { background: var(--white); padding: 72px 0; }
    .benefits-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      margin-top: 48px;
    }
    .benefit-card {
      background: var(--off-white);
      border-radius: var(--radius-lg);
      padding: 32px 24px;
      text-align: center;
      border: 1px solid var(--gray-200);
      transition: var(--transition);
    }
    .benefit-card:hover {
      background: var(--green-pale);
      border-color: var(--green);
      transform: translateY(-4px);
      box-shadow: var(--shadow-md);
    }
    .benefit-icon {
      font-size: 1.8rem;
      margin-bottom: 16px;
      display: block;
    }
    .benefit-card h3 {
      font-size: 1.05rem;
      font-weight: 800;
      color: var(--navy);
      margin-bottom: 10px;
    }
    .benefit-card p { font-size: .88rem; color: var(--gray-500); line-height: 1.6; margin: 0; }

    /* Types de partenariat */
    .partner-types { background: var(--navy); padding: 72px 0; }
    .partner-types .section-title { color: #fff; }
    .types-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-top: 40px;
    }
    .type-card {
      background: rgba(255,255,255,.07);
      border: 1px solid rgba(255,255,255,.12);
      border-radius: var(--radius-lg);
      padding: 28px 24px;
      transition: var(--transition);
    }
    .type-card:hover {
      background: rgba(255,255,255,.12);
      border-color: var(--green-light);
    }
    .type-card-icon {
      font-size: 1.3rem;
      margin-bottom: 14px;
      display: block;
    }
    .type-card h3 {
      font-family: 'Montserrat', sans-serif;
      font-size: 1rem;
      font-weight: 800;
      color: var(--green-light);
      margin-bottom: 10px;
    }
    .type-card p { font-size: .87rem; color: rgba(255,255,255,.68); line-height: 1.6; margin: 0; }

    /* Partenaires actuels */
    .current-partners { background: var(--off-white); padding: 64px 0; }
    .cp-logos {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 32px;
      flex-wrap: wrap;
      margin-top: 36px;
    }
    .cp-logo-card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: 14px;
      padding: 16px 28px;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: var(--shadow-sm);
      transition: var(--transition);
    }
    .cp-logo-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
    .cp-logo-card img { max-height: 56px; max-width: 180px; object-fit: contain; }
    .cp-logo-placeholder {
      width: 160px;
      height: 80px;
      border: 2px dashed var(--gray-200);
      border-radius: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Montserrat', sans-serif;
      font-size: .72rem;
      font-weight: 600;
      color: var(--gray-500);
      text-transform: uppercase;
      letter-spacing: .06em;
    }

    /* ===== FORMULAIRE ===== */
    .partner-form-section { background: var(--gray-100); padding: 80px 0; }
    .partner-form-wrap {
      max-width: 760px;
      margin: 0 auto;
      background: var(--white);
      border-radius: var(--radius-lg);
      box-shadow: var(--shadow-lg);
      overflow: hidden;
    }
    .partner-form-header {
      background: linear-gradient(135deg, var(--navy), var(--navy-mid));
      padding: 36px 40px;
      text-align: center;
    }
    .partner-form-header h2 {
      color: #fff;
      font-size: 1.25rem;
      font-weight: 800;
      margin-bottom: 8px;
    }
    .partner-form-header p { color: rgba(255,255,255,.72); font-size: .9rem; margin: 0; }
    .partner-form-body { padding: 40px; }

    .form-section-title {
      font-family: 'Montserrat', sans-serif;
      font-size: .75rem;
      font-weight: 800;
      color: var(--green);
      text-transform: uppercase;
      letter-spacing: .12em;
      margin: 28px 0 16px;
      padding-bottom: 8px;
      border-bottom: 2px solid var(--green-pale);
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .form-section-title:first-child { margin-top: 0; }

    .partner-type-select {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
      margin-bottom: 20px;
    }
    .type-radio {
      display: none;
    }
    .type-radio-label {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      padding: 14px 10px;
      background: var(--off-white);
      border: 2px solid var(--gray-200);
      border-radius: var(--radius);
      cursor: pointer;
      font-family: 'Montserrat', sans-serif;
      font-size: .78rem;
      font-weight: 700;
      color: var(--gray-500);
      text-align: center;
      transition: var(--transition);
    }
    .type-radio-label span.type-emoji { font-size: 1.4rem; }
    .type-radio:checked + .type-radio-label {
      border-color: var(--green);
      background: var(--green-pale);
      color: var(--green-dark);
    }
    .type-radio-label:hover {
      border-color: var(--green-light);
      background: var(--green-pale);
    }

    /* Indicateur requis */
    .req { color: var(--green); font-weight: 800; }

    /* Bouton envoi */
    .partner-submit-btn {
      width: 100%;
      padding: 16px;
      background: linear-gradient(135deg, var(--green), var(--green-dark));
      color: #fff;
      border: none;
      border-radius: var(--radius);
      font-family: 'Montserrat', sans-serif;
      font-size: 1rem;
      font-weight: 800;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      transition: var(--transition);
      margin-top: 8px;
      letter-spacing: .04em;
    }
    .partner-submit-btn:hover {
      background: linear-gradient(135deg, var(--green-dark), #0f3d1e);
      transform: translateY(-2px);
      box-shadow: 0 8px 24px rgba(45,138,78,.4);
    }
    .partner-submit-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }

    .partner-form-notice {
      text-align: center;
      font-size: .8rem;
      color: var(--gray-500);
      margin-top: 16px;
      line-height: 1.5;
    }

    .partner-success {
      display: none;
      background: var(--green-pale);
      border: 2px solid var(--green);
      border-radius: var(--radius);
      padding: 20px 24px;
      text-align: center;
      margin-top: 16px;
    }
    .partner-success h3 {
      color: var(--green-dark);
      font-size: 1.1rem;
      font-weight: 800;
      margin-bottom: 6px;
    }
    .partner-success p { color: var(--green-dark); font-size: .88rem; margin: 0; }

    @media (max-width: 768px) {
      .benefits-grid, .types-grid { grid-template-columns: 1fr; }
      .partner-type-select { grid-template-columns: 1fr 1fr; }
      .partner-form-header, .partner-form-body { padding: 24px; }
    }
    @media (max-width: 480px) {
      .partner-type-select { grid-template-columns: 1fr; }
    }

/* --- from actualites.html --- */
/* ---- Page Actualités ---- */
    .actu-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 50%, var(--green-dark) 100%);
      padding: 140px 0 80px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .actu-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url('ngodo.jpeg') center/cover no-repeat;
      opacity: 0.1;
    }
    .actu-hero .container { position: relative; z-index: 1; }
    .actu-hero h1 { font-size: clamp(1.6rem,3.5vw,2.4rem); font-weight:900; color:#fff; margin-bottom:16px; }
    .actu-hero h1 span { color: var(--green-light); }
    .actu-hero p { color:rgba(255,255,255,.75); font-size:.95rem; max-width:560px; margin:0 auto 32px; }

    /* Filtres */
    .actu-filters {
      background: var(--white);
      border-bottom: 1px solid var(--gray-200);
      padding: 0;
      position: sticky;
      top: 68px;
      z-index: 100;
      box-shadow: var(--shadow-sm);
    }
    .actu-filters-inner {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px;
      display: flex;
      gap: 0;
      overflow-x: auto;
      scrollbar-width: none;
    }
    .actu-filters-inner::-webkit-scrollbar { display: none; }
    .filter-btn {
      font-family: 'Montserrat', sans-serif;
      font-size: .78rem;
      font-weight: 700;
      letter-spacing: .05em;
      text-transform: uppercase;
      color: var(--gray-500);
      padding: 16px 20px;
      border: none;
      background: none;
      cursor: pointer;
      white-space: nowrap;
      border-bottom: 3px solid transparent;
      transition: var(--transition);
    }
    .filter-btn:hover, .filter-btn.active {
      color: var(--green);
      border-bottom-color: var(--green);
    }

    /* Article à la une */
    .actu-featured {
      padding: 64px 0 48px;
      background: var(--off-white);
    }
    .actu-featured-card {
      display: grid;
      grid-template-columns: 1.3fr 1fr;
      gap: 0;
      border-radius: var(--radius-lg);
      overflow: hidden;
      box-shadow: var(--shadow-lg);
      background: var(--white);
    }
    .actu-featured-img {
      position: relative;
      overflow: hidden;
    }
    .actu-featured-img img {
      width: 100%; height: 100%;
      object-fit: cover;
      min-height: 380px;
      transition: transform 0.5s ease;
    }
    .actu-featured-card:hover .actu-featured-img img { transform: scale(1.04); }
    .actu-featured-badge {
      position: absolute;
      top: 20px; left: 20px;
      background: var(--green);
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: .72rem;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      padding: 6px 14px;
      border-radius: 50px;
    }
    .actu-featured-body {
      padding: 40px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    .actu-cat {
      font-family: 'Montserrat', sans-serif;
      font-size: .72rem;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--green);
      margin-bottom: 12px;
    }
    .actu-featured-title {
      font-size: 1.3rem;
      font-weight: 800;
      color: var(--navy);
      line-height: 1.3;
      margin-bottom: 16px;
    }
    .actu-featured-excerpt {
      color: var(--gray-500);
      font-size: .95rem;
      line-height: 1.7;
      margin-bottom: 28px;
    }
    .actu-meta {
      display: flex;
      align-items: center;
      gap: 16px;
      font-size: .8rem;
      color: var(--gray-500);
      margin-bottom: 24px;
    }
    .actu-meta span { display: flex; align-items: center; gap: 5px; }
    .actu-read-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      font-size: .85rem;
      color: var(--green);
      transition: var(--transition);
    }
    .actu-read-btn:hover { gap: 12px; }

    /* Grille d'articles */
    .actu-grid-section {
      padding: 64px 0;
    }
    .actu-grid-section h2 {
      font-size: 1.25rem;
      font-weight: 800;
      color: var(--navy);
      margin-bottom: 32px;
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .actu-grid-section h2::after {
      content: '';
      flex: 1;
      height: 2px;
      background: var(--gray-200);
      border-radius: 1px;
    }
    .actu-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
    }
    .actu-card {
      background: var(--white);
      border-radius: var(--radius-lg);
      overflow: hidden;
      box-shadow: var(--shadow-sm);
      border: 1px solid var(--gray-200);
      transition: var(--transition);
      display: flex;
      flex-direction: column;
    }
    .actu-card:hover {
      transform: translateY(-6px);
      box-shadow: var(--shadow-md);
      border-color: var(--green-pale);
    }
    .actu-card-img {
      overflow: hidden;
      height: 200px;
      position: relative;
    }
    .actu-card-img img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 0.5s ease;
    }
    .actu-card:hover .actu-card-img img { transform: scale(1.08); }
    .actu-card-cat {
      position: absolute;
      bottom: 12px; left: 12px;
      background: var(--navy);
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: .65rem;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      padding: 4px 10px;
      border-radius: 50px;
    }
    .actu-card-body {
      padding: 24px;
      flex: 1;
      display: flex;
      flex-direction: column;
    }
    .actu-card-date {
      font-size: .78rem;
      color: var(--gray-500);
      margin-bottom: 10px;
    }
    .actu-card-title {
      font-size: 1.05rem;
      font-weight: 700;
      color: var(--navy);
      line-height: 1.4;
      margin-bottom: 12px;
    }
    .actu-card-text {
      font-size: .88rem;
      color: var(--gray-500);
      line-height: 1.6;
      flex: 1;
      margin-bottom: 20px;
    }
    .actu-card-link {
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      font-size: .8rem;
      color: var(--green);
      display: inline-flex;
      align-items: center;
      gap: 4px;
      transition: var(--transition);
    }
    .actu-card-link:hover { gap: 8px; }

    /* Section vidéos */
    .actu-videos {
      background: var(--navy);
      padding: 64px 0;
    }
    .actu-videos h2 {
      font-size: 1.3rem;
      font-weight: 800;
      color: #fff;
      margin-bottom: 8px;
    }
    .actu-videos p {
      color: rgba(255,255,255,.65);
      margin-bottom: 40px;
    }
    .videos-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 28px;
    }
    .video-card {
      background: rgba(255,255,255,.06);
      border-radius: var(--radius-lg);
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.1);
      transition: var(--transition);
    }
    .video-card:hover {
      background: rgba(255,255,255,.1);
      border-color: var(--green-light);
    }
    .video-thumb {
      position: relative;
      overflow: hidden;
      height: 220px;
      background: var(--navy-mid);
      cursor: pointer;
    }
    .video-thumb img {
      width: 100%; height: 100%;
      object-fit: cover;
      opacity: 0.75;
      transition: opacity 0.3s ease;
    }
    .video-card:hover .video-thumb img { opacity: 0.9; }
    .video-play-btn {
      position: absolute;
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 64px; height: 64px;
      background: rgba(255,255,255,.9);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: var(--transition);
    }
    .video-card:hover .video-play-btn { background: var(--green); transform: translate(-50%,-50%) scale(1.1); }
    .video-play-btn svg { width: 24px; height: 24px; margin-left: 4px; }
    .video-play-btn svg path { fill: var(--navy); transition: var(--transition); }
    .video-card:hover .video-play-btn svg path { fill: #fff; }
    .video-duration {
      position: absolute;
      bottom: 12px; right: 12px;
      background: rgba(0,0,0,.7);
      color: #fff;
      font-size: .75rem;
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      padding: 3px 8px;
      border-radius: 4px;
    }
    .video-body { padding: 20px 24px; }
    .video-cat {
      font-size: .7rem;
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--green-light);
      margin-bottom: 8px;
    }
    .video-title {
      font-size: 1rem;
      font-weight: 700;
      color: #fff;
      line-height: 1.4;
      margin-bottom: 8px;
    }
    .video-desc {
      font-size: .85rem;
      color: rgba(255,255,255,.6);
      line-height: 1.6;
    }

    /* Embed vidéo YouTube placeholder */
    .video-embed-placeholder {
      background: var(--navy-mid);
      height: 220px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 12px;
      cursor: pointer;
    }
    .video-embed-placeholder span {
      font-family: 'Montserrat', sans-serif;
      font-size: .8rem;
      color: rgba(255,255,255,.6);
      text-align: center;
      padding: 0 16px;
    }

    /* Section galerie photos */
    .actu-gallery {
      padding: 64px 0;
      background: var(--gray-100);
    }
    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: auto;
      gap: 12px;
    }
    .gallery-item {
      border-radius: var(--radius);
      overflow: hidden;
      position: relative;
      cursor: pointer;
    }
    .gallery-item:first-child {
      grid-column: span 2;
      grid-row: span 2;
    }
    .gallery-item img {
      width: 100%; height: 100%;
      object-fit: cover;
      min-height: 160px;
      transition: transform 0.4s ease;
      display: block;
    }
    .gallery-item:first-child img { min-height: 340px; }
    .gallery-item:hover img { transform: scale(1.06); }
    .gallery-overlay {
      position: absolute;
      inset: 0;
      background: rgba(13,27,62,0);
      display: flex;
      align-items: flex-end;
      padding: 16px;
      transition: background 0.3s ease;
    }
    .gallery-item:hover .gallery-overlay { background: rgba(13,27,62,.45); }
    .gallery-caption {
      color: #fff;
      font-size: .78rem;
      font-style: italic;
      opacity: 0;
      transition: opacity 0.3s ease;
    }
    .gallery-item:hover .gallery-caption { opacity: 1; }

    /* CTA newsletter / rejoindre */
    .actu-subscribe {
      background: var(--green-dark);
      padding: 64px 0;
      text-align: center;
    }
    .actu-subscribe h2 { color: #fff; font-size: 1.45rem; font-weight: 800; margin-bottom: 12px; }
    .actu-subscribe p { color: rgba(255,255,255,.8); margin-bottom: 32px; max-width: 500px; margin-left: auto; margin-right: auto; }
    .subscribe-form {
      display: flex;
      gap: 12px;
      justify-content: center;
      flex-wrap: wrap;
      max-width: 500px;
      margin: 0 auto;
    }
    .subscribe-form input {
      flex: 1;
      min-width: 240px;
      padding: 14px 20px;
      border-radius: var(--radius);
      border: 2px solid rgba(255,255,255,.3);
      background: rgba(255,255,255,.1);
      color: #fff;
      font-family: 'Open Sans', sans-serif;
      font-size: .95rem;
      outline: none;
      transition: var(--transition);
    }
    .subscribe-form input::placeholder { color: rgba(255,255,255,.55); }
    .subscribe-form input:focus { border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.15); }
    .subscribe-form button {
      padding: 14px 28px;
      border-radius: var(--radius);
      border: none;
      background: #fff;
      color: var(--green-dark);
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      font-size: .9rem;
      cursor: pointer;
      transition: var(--transition);
    }
    .subscribe-form button:hover { background: var(--green-pale); }

    /* Responsive */
    @media (max-width: 1024px) {
      .actu-grid { grid-template-columns: 1fr 1fr; }
      .videos-grid { grid-template-columns: 1fr; }
      .gallery-grid { grid-template-columns: repeat(2, 1fr); }
      .gallery-item:first-child { grid-column: span 2; }
    }
    @media (max-width: 768px) {
      .actu-featured-card { grid-template-columns: 1fr; }
      .actu-grid { grid-template-columns: 1fr; }
      .gallery-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 480px) {
      .gallery-grid { grid-template-columns: 1fr; }
      .gallery-item:first-child { grid-column: span 1; }
    }

/* --- from cookie.html --- */
.cookie-page-hero { background: var(--navy); padding: 120px 0 60px; text-align: center; }
    .cookie-page-hero h1 { color: #fff; font-size: 1.7rem; font-weight: 800; margin-bottom: 10px; }
    .cookie-page-hero p { color: rgba(255,255,255,.65); font-size: .9rem; }
    .cookie-page-content { max-width: 780px; margin: 0 auto; padding: 64px 24px; }
    .cookie-page-content h2 { font-size: 1.25rem; font-weight: 800; color: var(--navy); margin: 36px 0 12px; padding-bottom: 8px; border-bottom: 2px solid var(--green-pale); }
    .cookie-page-content p { color: var(--gray-700); line-height: 1.8; margin-bottom: 14px; font-size: .97rem; }
    .cookie-page-content ul { margin: 10px 0 16px 20px; color: var(--gray-700); line-height: 1.8; font-size: .97rem; }
    .cookie-page-content ul li { margin-bottom: 6px; }
    .cookie-consent-box { background: var(--green-pale); border: 2px solid var(--green); border-radius: var(--radius-lg); padding: 28px 32px; margin: 40px 0; }
    .cookie-consent-box h3 { color: var(--green-dark); font-size: 1.05rem; font-weight: 800; margin-bottom: 10px; }
    .cookie-consent-box p { color: var(--green-dark); margin-bottom: 20px; font-size: .9rem; }
    .cookie-consent-btns { display: flex; gap: 12px; flex-wrap: wrap; }
    .cookie-consent-btns button { font-family: 'Montserrat', sans-serif; font-size: .85rem; font-weight: 700; padding: 11px 24px; border-radius: 10px; border: none; cursor: pointer; transition: var(--transition); }
    .btn-accept-cookie { background: var(--green); color: #fff; }
    .btn-accept-cookie:hover { background: var(--green-dark); }
    .btn-ignore-cookie { background: transparent; color: var(--green-dark); border: 2px solid var(--green) !important; }
    .btn-ignore-cookie:hover { background: rgba(45,138,78,.1); }
    .cookie-status { font-family: 'Montserrat', sans-serif; font-size: .8rem; font-weight: 700; padding: 8px 16px; border-radius: 50px; margin-left: 12px; }
    .status-accepted { background: var(--green); color: #fff; }
    .status-ignored { background: var(--gray-200); color: var(--gray-700); }