/* ==========================================
   CSS Variables (Design Tokens)
   ========================================== */
:root {
    /* Colors */
    --color-navy-dark: #002644;
    --color-navy-medium: #3A5A7A;
    --color-blue-light: #E1ECEF;
    --color-orange: #F79C5E;
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-gray-light: #F5F5F5;
    --color-gray-medium: #CCCCCC;
    
    /* Typography */
    --font-heading: "ivyora-display";
    --font-body: 'Satoshi', sans-serif;
    
    /* Font Sizes */
    --text-xs: 0.875rem;     /* 14px */
    --text-sm: 1rem;         /* 16px */
    --text-base: 1.125rem;   /* 18px */
    --text-lg: 1.375rem;     /* 22px */
    --text-xl: 1.625rem;     /* 26px */
    --text-2xl: 1.875rem;    /* 30px */
    --text-3xl: 2.125rem;    /* 34px */
    --text-4xl: 2.5rem;      /* 40px */
    --text-5xl: 2.625rem;    /* 42px */
    
    /* Spacing */
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 1.5rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;
    --spacing-2xl: 4rem;
    --spacing-3xl: 6rem;
    
    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
    
    /* Container */
    --container-width: 1440px;
    --container-padding: 2rem;
	
	
	
	--bg-blue: #001e3d;
    --text-white: #ffffff;

    /* --- Ta fonction buildClamp appliquée aux éléments --- */
    
    /* Container f=1050 | moyen=72.91vw | max=1400px */
    --ml-container-width: clamp(320px, 72.91vw, 1050px);

    /* Titre H1 f=46 | moyen=3.19vw | max=61.3px */
    --ml-h1-size: clamp(30px, 3.19vw, 46px);
    --ml-h1-lh: calc(clamp(30px, 3.19vw, 46px) + 10px);

    /* Titre H2 f=20 | moyen=1.38vw | max=26.6px */
    --ml-h2-size: clamp(18px, 1.38vw, 20px);
    --ml-h2-lh: calc(clamp(18px, 1.38vw, 20px) + 10px);

    /* Texte f=18 | moyen=1.25vw | max=24px */
    --ml-body-size: clamp(16px, 1.25vw, 18px);
    --ml-body-lh: calc(clamp(16px, 1.25vw, 18px) + 10px);
	
}

/* ==========================================
   Reset & Base Styles
   ========================================== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--color-black);
    background-color: var(--color-white);
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    text-decoration: none;
    color: inherit;
    transition: color var(--transition-fast);
}

button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
    transition: all var(--transition-fast);
}

ul {
    list-style: none;
}

input,
textarea {
    font-family: inherit;
    font-size: inherit;
}

/* ==========================================
   Typography
   ========================================== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    line-height: 1.2;
    font-weight: 500;
}

.heading-display {
    font-size: var(--text-4xl);
    font-weight: 400;
    text-transform: uppercase;
}

.heading-large {
    font-size: var(--text-3xl);
    font-weight: 500;
}

.heading-medium {
    font-size: var(--text-xl);
    font-weight: 500;
}

/* ==========================================
   Container
   ========================================== */
.container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}

.container-wide {
    max-width: calc(var(--container-width) + 200px);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}

/* Hero Section */
.hero {
  position: relative;
  /* height: 100vh; */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0;
  overflow: hidden; /* important pour que la vidéo ne déborde pas */
}

.hero__video {
  position: absolute !important;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* équivalent du background-size: cover */
  z-index: 0;
}

/* S'assurer que le contenu reste au-dessus de la vidéo */
.hero > *:not(.hero__video) {
  position: relative;
  z-index: 1;
}

/* Dark overlay */
.home .hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #0948E7;
  z-index: 2;
   opacity: 0.2;
}

.home .hero::after {
  content: "";
  position: absolute;
  inset: 0;
   background: linear-gradient(233.07deg, #E1ECEF -264.53%, #002644 151.27%);
  z-index: 3;
  opacity: 0.2;
}

.hero > * {
  position: relative;
  z-index: 1;
}

/* Navbar */
.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: absolute !important;
  justify-content: space-between;
  width: 100%;
  top : 52px;
  z-index: 60 !important;
  padding: 0 clamp(32px,2.2222222222222223vw,42.66666666666667px) 0 clamp(32px,2.2222222222222223vw,42.66666666666667px);
  gap: 80px;
}

.logo {
  font-size: 18px;
  letter-spacing: 2px;
  line-height: 1.2;
}


.logo svg {

width : clamp(199px,13.819444444444445vw,265.3333333333333px);
height: clamp(51px,3.5416666666666665vw,68px);

}

.logo strong {
  font-weight: 600;
}

.nav-links {
  display: flex;
  gap: clamp(84px,5.833333333333333vw,112px);
  align-items: center;
  margin-top: clamp(-32px,-2.2222222222222223vw,-42.66666666666667px);
}

.nav-links a {
  text-decoration: none;
  color: #fff;
  font-size: clamp(13.5px,0.9375vw,18px);
  letter-spacing: 1px;
  text-transform: uppercase;
  transition: opacity 0.3s ease;
  font-weight: 300;
}

.nav-links a:hover {
  opacity: 1;
}

.nav-links .contact {
position: relative;
}

.nav-links .contact::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -0.5rem;
    width: 100%; /* Visible par défaut */
    height: 1px;
    background-color: var(--color-orange);
    
    /* On prépare la transition sur le scale (échelle) */
    transform: scaleX(1); 
    transition: transform 0.4s ease-in-out;
    transform-origin: left; /* Le trait s'appuie sur la gauche */
}

/* Au survol : le trait se "redessine" */
.nav-links .contact:hover::after {
    animation: redraw 0.6s ease-in-out forwards;
}

@keyframes redraw {
    0% {
        transform: scaleX(1);
        transform-origin: right; /* Il commence par se retirer vers la droite */
    }
    45% {
        transform: scaleX(0);
        transform-origin: right;
    }
    55% {
        transform: scaleX(0);
        transform-origin: left; /* Il change de côté pour revenir de la gauche */
    }
    100% {
        transform: scaleX(1);
        transform-origin: left; /* Il finit à 100% et y reste */
    }
}


.wrrp_menu a {
	
position : relative;	
	
}

.wrrp_menu a::after {
	
width: 100%;
content: '';
position: absolute;
left: 0;
right: 0;
bottom: -0.5rem;
height: 1px;
background-color: var(--color-orange);	
width :0;	
transition : 0.3s ease-in-out;	
}


.wrrp_menu a:hover:after {
	
width : 100%;	
	
} 



.nav-links .switch_lang {

display: flex;
gap : 13px;

}



/* Hero Content */



.home .hero .hero-circles {
    position: absolute;
    top: 12%;
    right: 0;
    transform: translateY(-50%);
    width: 100%;
    z-index: 2;
}


.home .hero .hero-circles img {
	
    max-width: clamp(602px,41.80555555555556vw,802.6666666666667px);
    height: auto;
    display: block;
    position: absolute;
    right: clamp(40px,2.7777777777777777vw,53.33333333333333px);	
	opacity : 0.5;
	
}





.hero-content {
  max-width: clamp(760px,52.77777777777778vw,1013.3333333333333px);
  margin-top: auto;
  margin-bottom: auto;
  min-height: 100vh;
  padding-top: clamp(429px,29.791666666666668vw,572px);
  padding-left: clamp(40px,2.7777777777777777vw,53.33333333333333px);
  position: relative;
  z-index: 5 !important;

}

.hero-content h1  {
  font-size: clamp(40px,2.7777777777777777vw,53.33333333333333px);
  font-weight: 300;
  line-height: 1.3;
  text-transform: uppercase;
    color: var(--color-white); ;
    font-family: var(--font-body);
}

.hero-content h1 span {

font-family: var(--font-heading);

}


/* Stats */
.hero-stats {
  display: flex;
  gap: clamp(245px,17.01388888888889vw,326.6666666666667px);
  padding-bottom: 40px;
  justify-content: space-between;
  padding: 0 clamp(38px,2.638888888888889vw,50.66666666666667px) clamp(47px,3.263888888888889vw,62.66666666666667px) clamp(38px,2.638888888888889vw,50.66666666666667px);
  z-index: 4 !important;


}

.stat {
  display: flex;
  flex-direction: column;
}

.stat * {

color: var(--color-white);
font-family: var(--font-body);
font-size: clamp(30px,2.0833333333333335vw,40.00000000000001px)  ;
line-height: clamp(35px,2.4305555555555554vw,46.66666666666666px)  ;

}


.stat .plus {
  color: #F79C5E;
  margin-bottom: clamp(8px,0.5555555555555556vw,10.666666666666668px);
  
}


.wrrp_menu {

display: flex;
gap : clamp(23px,1.5972222222222223vw,30.66666666666667px)

}


/* ==========================================
   Introduction Section
   ========================================== */
.intro-section {
    padding: clamp(155px,10.76388888888889vw,206.66666666666669px) 0 clamp(118px,8.194444444444445vw,157.33333333333334px) 0;
    background-color: var(--color-white);
}

.intro-section p {
    font-size: clamp(30px,2.0833333333333335vw,40.00000000000001px);
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    max-width: 51.5rem;
    margin: 0 auto;
    letter-spacing: -0.03em;
}

/* ==========================================
   Domains Section
   ========================================== */
.domains-section {
    padding: 5.6rem 0 6rem;
    background: linear-gradient(203.37deg, #002644 0%, #F79C5E 100%);
    color: var(--color-white);
}

.domains-section .section-title {


font-family: var(--font-body);
font-weight: 700;
font-size: clamp(42px,2.9166666666666665vw,56px);
line-height: 110.00000000000001%;
letter-spacing: -4%;
text-align: center;
margin-bottom: clamp(80px,5.555555555555555vw,106.66666666666666px);

} 




/* Tabs */
.tabs {
    display: flex;
    justify-content: center;
    gap: clamp(100px,6.944444444444445vw,133.33333333333334px);
    position: relative;
}

.tabs::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1rem;
    height: 1px;
    background: transparent;
}

.tab-btn {
    font-size: clamp(30px,2.0833333333333335vw,40.00000000000001px);
    font-weight: 500;
    color: rgba(255, 255, 255, 0.8);
    padding-bottom: 0.5rem;
    letter-spacing: -0.02em;
    position: relative;
}

.tab-btn.active {
    color: var(--color-white);
    font-size: clamp(34px,2.361111111111111vw,45.33333333333333px);
}

.tab-btn:not(:last-child)::after {
    content: '';
    position: absolute;
    right: clamp(-55px,-3.8194444444444446vw,-73.33333333333334px);
    top: 40%;
    transform: translateY(-50%);
    width: 2px;
    height: 60%;
    background-color: var(--color-orange);

}

.tab-btn:hover {
    color: var(--color-white);
}

/* Tab Content */
.tab-content {
    display: none;
    margin-top: 1.6rem;
}

.tab-content.active {
    display: block;
}

/* Glass Card */
.glass-card {
    backdrop-filter: blur(100px);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.1) 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-sm);
    padding: 6.3rem 4rem 4rem 4rem;
    max-width: clamp(1070px,74.30555555555556vw,1426.6666666666665px);
    margin: 0 auto;
}

.glass-card .wrrp {

background: #FFFFFF;

border-radius: var(--radius-sm);
/* max-width: clamp(915px,63.541666666666664vw,1220px); */
width: 100%;
padding: 2.25rem 5.8125rem 2.75rem 5.8125rem;

}


.glass-card .wrrp::after {

 content: '';
    position: absolute;
    right: clamp(-55px,-3.8194444444444446vw,-73.33333333333334px);
    left : 50%;
    transform: translate(-50%);
    width: clamp(828px,57.5vw,1104px);
    height: clamp(254px,17.63888888888889vw,338.66666666666663px);
     background: rgba(255, 255, 255, 0.5);
     top : 4rem;
         z-index: -1;


}


.card-intro {
    font-size: clamp(22px,1.5277777777777777vw,29.33333333333333px);
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    margin-bottom: 2.5rem;
    letter-spacing: -0.03em;
    color: #050505;
    /* background: rgba(255, 255, 255, 0.5); */
    padding: 0;
    border-radius: var(--radius-sm);
    max-width: clamp(661px,45.90277777777778vw,881.3333333333333px);
	margin-left : auto;
	margin-right : auto;
}

.service-items {
    display: grid;
    justify-content: space-between;
    gap: clamp(45px,3.125vw,60px);
	   grid-template-columns: repeat(3, 1fr);
   
}

.service-item {
    flex: 1;
    max-width: clamp(213px,14.791666666666666vw,284px);
        background: var(--color-white);
        padding: 1.625rem;
         border-radius: var(--radius-sm);
          box-shadow: 10px 14px 84px rgba(161, 165, 172, 0.25);
}

.service-item p {
    font-size: clamp(14px,0.9722222222222222vw,18.666666666666668px);
    font-weight: 500;
    color: #1f2026;
    line-height: 1.4;
    letter-spacing: -0.01em;
}

/* 360 Offer */
.offer-360 {
    margin-top: 2.5rem;
    text-align: center;
    max-width: 53rem;
    margin-left: auto;
    margin-right: auto;
}

.offer-title {
    font-family: var(--font-body);
    font-size: clamp(30px,2.0833333333333335vw,40.00000000000001px);
    font-weight: 400;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 2.3rem;
}

.offer-text {
font-weight: 500;
font-size: clamp(18px,1.25vw,24px);
line-height: 140%;
text-align: center;

}

/* ==========================================
   Team Section
   ========================================== */
.team-section {
    background-color: var(--color-white);
}


.team-section .container {

padding-left: clamp(38px,2.638888888888889vw,50.66666666666667px) ;
padding-bottom: clamp(30px,2.0833333333333335vw,40.00000000000001px) ;
padding-right: 0;
max-width : 100%;

}


.team-section .top {

display: flex;
justify-content: space-between;
align-items: flex-end;
	
}


.team-section .top svg {
	
width : clamp(160px,11.11111111111111vw,213.33333333333331px);
height  :clamp(41px,2.8472222222222223vw,54.66666666666667px);	
	
}


.team-section .top .line {

height: 1px;
width : clamp(1102px,76.52777777777777vw,1469.333333333333px);
max-width: 100%;
background-color: var(--color-white);
opacity: 0.4;
}


.team-hero {
    position: relative;
    height: 47.3rem;
   background-image: url(assets/team-photo-main.png);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   padding: clamp(64px,4.444444444444445vw,85.33333333333334px) clamp(80px,5.555555555555555vw,106.66666666666666px);
}

.team-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-overlay {
    position: absolute;
    bottom: 5rem;
    left: 5rem;
}

.team-title {
    font-size: 2.188rem;
    font-weight: 400;
    color: var(--color-white);
    text-transform: uppercase;
    line-height: 1.2;
    font-family: var(--font-body);
}

.team-intro {
    display: flex;
    padding: clamp(70px,4.861111111111111vw,93.33333333333331px) clamp(64px,4.444444444444445vw,85.33333333333334px) 0 clamp(60px,4.166666666666667vw,80.00000000000001px);
    align-items: flex-start;
    justify-content: space-between;
}

.mp-logo img {
    width: clamp(243px,16.875vw,324px);
    height: auto;
}

.team-intro-content {
    width : clamp(714px,49.583333333333336vw,952px)
}

.team-intro-text {
    font-size: clamp(26px,1.8055555555555556vw,34.666666666666664px);
    font-weight: 400;
    line-height: 1.2;
}

.link-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
    font-weight: 400;
    padding-left: var(--spacing-sm);
    border-left: 1px solid var(--color-orange);
    line-height: 100%;
}

.link-with-icon svg {
	
transition : 0.3s ease-in-out;	
transform : scale(1);	
	
}

.link-with-icon:hover svg {
   transform : scale(1.5)
}

.link-with-icon img {
    width: 1rem;
    height: 1rem;
}

/* Team Controls */
.team-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: clamp(33px,2.2916666666666665vw,44px);
    
}

.team-controls .swiper-button-lock {
	
display : block	
	
}


.carousel-arrows {
    display: flex;
    gap: 0.75rem;
    margin-top: clamp(20px,1.3888888888888888vw,26.666666666666664px);
}

/* Carousel */
.carousel-container {
    padding-bottom: 5rem;
}

.teamSwiper {

padding: clamp(50px,3.4722222222222223vw,66.66666666666667px) 
0
clamp(120px,8.333333333333334vw,160.00000000000003px)
clamp(20px,1.3888888888888888vw,26.666666666666664px) !important ;

}

.carousel {
    overflow: hidden;
    padding:  clamp(20px,1.3888888888888888vw,26.666666666666664px) 0;
}

.swiper-slide {
  display: flex;
  justify-content: center;
  width: auto; /* permet au slide de s'adapter à la team-card */
}


.swiper-slide.no_bio .bio-btn {
	
display : none;	
	
}


.carousel-track {
    display: flex;
    gap: clamp(28px,1.9444444444444444vw,37.333333333333336px);
    transition: transform var(--transition-slow);
}

.team-card {
    position: relative;
    flex: 0 0 calc(15% - 1.5rem);
    aspect-ratio: 180 / 366;
    /* overflow: hidden; */
}

.team-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.6), transparent);
    opacity: 0;
    transition: opacity var(--transition-base);
    display: flex;
    align-items: flex-end;
    padding: clamp(10px,0.6944444444444444vw,13.333333333333332px);
}

.team-card:hover .team-card-overlay {
    opacity: 1;
}

.team-card-overlay.active {
    opacity: 1;
}

.bio-btn {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    font-size: var(--text-sm);
    font-weight: 400;
    color: var(--color-black);
     background: var(--color-white);
    justify-content: center;
    padding-left: var(--spacing-sm);
    padding-right: var(--spacing-sm);
   
    padding-top: clamp(5px,0.3472222222222222vw,6.666666666666666px);
    padding-bottom: clamp(5px,0.3472222222222222vw,6.666666666666666px)    ;
}

.bio-btn img {
    width: 1rem;
    height: 1rem;
}


.team-card.featured {

position: relative;
z-index: 0;

}

.team-section .swiper-slide .team-card::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
width: calc(100% + clamp(32px,2.2222222222222223vw,42.66666666666667px) );
height: calc(100% + clamp(32px,2.2222222222222223vw,42.66666666666667px) );
transform: translate(-50%, -50%);
z-index: -1;
background-image: url("data:image/svg+xml,%3Csvg width='212' height='398' viewBox='0 0 212 398' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='212' height='398' fill='white'/%3E%3Crect width='212' height='398' fill='url(%23paint0_linear_3432_569)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_3432_569' x1='106' y1='0' x2='106' y2='398' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23E1ECEF'/%3E%3Cstop offset='0.5' stop-color='white' stop-opacity='0.4'/%3E%3Cstop offset='1' stop-color='%23F79C5E'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
background-size: cover;
background-repeat: no-repeat;
opacity: 0;
transition: 0.3s ease-in-out;

}

.swiper-slide:hover .team-card::after {
opacity: 1;

}

.swiper-slide:hover .team-card-info {

opacity: 1;
visibility: visible;
width: calc(100% + clamp(32px,2.2222222222222223vw,42.66666666666667px));
  transform: translateX(-50%);
  position: absolute;
  left: 50%;
bottom: -30%;	

}



.team-card-info {
/*     position: absolute; */
    bottom: clamp(-100px,-6.944444444444445vw,-133.33333333333334px);
    padding-left: clamp(14px,0.9722222222222222vw,18.666666666666668px);
    padding-right: clamp(2px,0.1388888888888889vw,2.666666666666667px);
    padding-top: clamp(50px,3.4722222222222223vw,66.66666666666667px) ;
    border-left: 1px solid var(--color-orange);
    left: clamp(-16px,-1.1111111111111112vw,-21.333333333333336px);
    opacity: 0;
    visibility: hidden;
    transition: 0.3s ease-in-out;
	width: calc(100% + clamp(32px,2.2222222222222223vw,42.66666666666667px));
  transform: translateX(-50%);
  position: absolute;
  left: 50%;
bottom: -40%;
}


.team-card-info.depassement_hauteur .team-member-name {
	
margin-bottom : clamp(5px,0.3472222222222222vw,6.666666666666666px)	
	
}


.team-member-name {
    font-size: clamp(18px,1.25vw,24px);
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: clamp(15px,1.0416666666666667vw,20.000000000000004px);
    font-family: var(--font-body);
}

.team-member-role {
    font-family: var(--font-heading);
    font-size: clamp(18px,1.25vw,24px);
    font-weight: 400;
    text-transform: uppercase;
}

/* Carousel Controls */
.carousel-btn {
    width: clamp(60px,4.166666666666667vw,80.00000000000001px);
    height: clamp(60px,4.166666666666667vw,80.00000000000001px);
    border-radius: 50%;
    background-color: #E1ECEF80;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 2px solid transparent;
    transition: 0.3 ease-in-out;
}

.carousel-btn svg {

width : clamp(13px,0.9027777777777778vw,17.333333333333332px);
height : clamp(12px,0.8333333333333334vw,16px);

}


.carousel-btn:hover {
    border: 2px solid var(--color-orange);
}

.carousel-btn img {
    width: 1.5rem;
    height: 1.5rem;
}

/* ==========================================
   Engagement Section
   ========================================== */
.engagement-section {
  width: 100%;
  background: linear-gradient(180deg, rgba(0, 38, 68, 0.8) 0%, rgba(0, 38, 68, 0) 100%),
                linear-gradient(203.37deg, #E1ECEF 0%, rgba(255, 255, 255, 0.4) 20.67%, #F79C5E 100%);
  position: relative;
  overflow: hidden;
}

.engagement-section .container {

padding: clamp(80px,5.555555555555555vw,106.66666666666666px) clamp(110px,7.638888888888889vw,146.66666666666669px) clamp(71px,4.930555555555555vw,94.66666666666666px) clamp(110px,7.638888888888889vw,146.66666666666669px);
max-width : 100%	

}


.engagement-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: 
    radial-gradient(ellipse at 80% 20%, rgba(100, 160, 200, 0.08) 0%, transparent 60%),
    radial-gradient(ellipse at 20% 80%, rgba(30, 60, 100, 0.15) 0%, transparent 50%);
  pointer-events: none;
}

.engagement-header {
  max-width: clamp(1220px,84.72222222222223vw,1626.666666666667px);
  position: relative;
  z-index: 1;
}

.section-title-alt {
  font-family: var(--font-body);
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 4px;
  color: rgba(255, 255, 255);
  text-transform: uppercase;
  line-height: 140%;
  margin-bottom: 28px;
}

.engagement-intro {
  font-family: var(--font-body);
  font-size: clamp(28px,1.9444444444444444vw,37.333333333333336px);
  font-weight: 300;
  color: #ffffff;
  line-height: 120%;
   color: rgba(255, 255, 255, 0.8);
   letter-spacing: -0.5px;
   max-width: clamp(1050px,72.91666666666667vw,1400px) ;
}

.engagement-intro strong {
  font-weight: 700;
  color: #ffffff;
  display: block;
  margin-bottom: 4px;
   color: rgba(255, 255, 255, 1);
}

.divider {
  margin-top: 40px;
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 1);
  background: none;
}

/* Value Cards */
.value-cards {
    display: flex;
    grid-template-columns: repeat(3, 1fr);
    justify-content: space-between;
    margin-top: clamp(80px,5.555555555555555vw,106.66666666666666px);

}

.value-card {
    backdrop-filter: blur(40px);
    background: linear-gradient(0deg, rgba(0, 38, 68, 0.05), rgba(0, 38, 68, 0.05)),
                rgba(255, 255, 255, 0.70);
    border-bottom: 2px solid var(--color-orange);
    padding: 0 clamp(16px,1.1111111111111112vw,21.333333333333336px) clamp(76px,5.277777777777778vw,101.33333333333334px) clamp(16px,1.1111111111111112vw,21.333333333333336px);
    position: relative;
    height: clamp(480px,33.333333333333336vw,640.0000000000001px);
    width: clamp(320px,22.22222222222222vw,426.66666666666663px) ;
}


.value-card:first-child {

margin-top: clamp(90px,6.25vw,120px) ;

}


.value-card:nth-child(2) {

margin-top: clamp(334px,23.194444444444443vw,445.33333333333326px);

}



.value-dash {
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--color-navy-dark);
}

.value-title {
    font-family: var(--font-heading);
    font-size: clamp(26px,1.8055555555555556vw,34.666666666666664px);
    font-weight: 500;
    color: var(--color-navy-dark);
    margin: 1.5rem 0 0.5rem;
}

.value-text {
    font-size: var(--text-sm);
    font-weight: 400;
    color: var(--color-navy-dark);
    line-height: 1.4;
    letter-spacing: 0.015em;
}

.value-icon {
    position: absolute;
    bottom: clamp(76px,5.277777777777778vw,101.33333333333334px);
    left: 50%;
    transform: translateX(-50%);
}

.value-icon img {
    width: 6.25rem;
    height: 6.25rem;
}

/* ==========================================
   Operations Section
   ========================================== */
.operations-section {
    padding: 3.1rem 0 0;
    background-image: url("/wp-content/uploads/2026/03/bg_engagemnt.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.operations-section > .container {


width: clamp(1247px,86.59722222222223vw,1662.666666666667px);
max-width: 100%;
padding-left: clamp(61px,4.236111111111111vw,81.33333333333331px) ;
padding-right: clamp(95px,6.597222222222222vw,126.66666666666666px);
background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 100%);
padding-top: clamp(72px,5vw,96px);
padding-bottom: clamp(74px,5.138888888888889vw,98.66666666666669px);
}


.operations-title {
    font-family: var(--font-heading);
    font-size: 2.188rem;
    font-weight: 400;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 4rem;
}

.grid {
    position: relative;
    width: 100%;
    opacity: 0;
    transition: opacity 0.4s ease;
}

/* La carte */
.card {
    width: 33.333%;
    background: #fff;
    border: 1px solid #eee;
    box-sizing: border-box; /* Indispensable pour que la bordure ne crée pas d'espace */
    margin: 0 !important; /* On tue toutes les marges */
}

/* Les cartes cachées ne doivent pas prendre de place du tout */
.hidden-card {
    display: none !important;
}

/* Effet de décalage sur la colonne du milieu (2ème carte de la grille) */
.card:nth-child(2) {
    margin-top: 60px !important;
}

/* Ajustement logo pour éviter les espaces blancs */
.card-logo {
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-logo img {
    max-width: 80%;
    height: auto;
}

/* Responsive */
@media (max-width: 992px) {
    .card { width: 50%; }
    .card:nth-child(2) { margin-top: 0 !important; }
}
@media (max-width: 768px) {
    .card { width: 100%; }
}



/* 
  .grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 0;
  }
 */
  /* LEFT column: rows 1 and 2 */
  .col-left {
    grid-column: 1;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  /* CENTER column: spans both rows but starts lower */
  .col-center {
    grid-column: 2;
    grid-row: 1 / 3;
    display: flex;
    flex-direction: column;
    padding-top: clamp(40px,2.7777777777777777vw,53.33333333333333px); /* shift down */
  }

  /* RIGHT column: rows 1 and 2 */
  .col-right {
    grid-column: 3;
    display: flex;
    flex-direction: column;
    gap: 0;
  }



/*   .card {
    border: 1px solid #e2eaec;
    background: #fff;
    display: flex;
    flex-direction: column;
  } */

  .card-logo {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 50px 30px;
    min-height: 200px;
  }

  .card-logo img {
    max-width: 180px;
    max-height: 80px;
    object-fit: contain;
    filter: grayscale(100%);
  }

  /* Fallback logo text for demo */
  .logo-text {
    font-size: 1.4rem;
    font-weight: 600;
    color: #2a2a2a;
    letter-spacing: 0.05em;
  }
  .logo-text.small { font-size: 1rem; }

  .card-tag {
    background: #edf4f6;
    color: #3a3a3a;
    font-size: clamp(14px,0.9722222222222222vw,18.666666666666668px);
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    text-align: center;
    padding: 14px 10px;
  }

  /* Separator lines between columns */
  .col-left .card { border-right: none; }
  .col-right .card { border-left: none; }

  /* Between rows in same column */
  .col-left .card:not(:last-child),
  .col-right .card:not(:last-child) {
    border-bottom: 1px solid #e2eaec;
  }
  .col-center .card:not(:last-child) {
    border-bottom: 1px solid #e2eaec;
  }

  /* Voir plus */
  .voir-plus {
    text-align: center;
    margin-top: clamp(75px,5.208333333333333vw,100px);
  }

  .voir-plus a {
    font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
    line-height: 80%;
    font-weight: 400;
    letter-spacing: 0.15em;
    color: var(--color-black);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    transition: gap 0.3s ease;
    border-left: 1px solid var(--color-orange) ;
    border-right: 1px solid var(--color-orange) ;

  }

  .voir-plus a::before,
  .voir-plus a::after {
    content: '';
    display: inline-block;
    width: 1px;
    transition: width 0.3s ease;
  }

  

/* Quote Section */
.quote-section {
    position: relative;
    padding: 6rem 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 100%);
}

.quote-section .container {

border-top: 1px solid rgba(255,255,255, 0.5);
border-bottom: 1px solid rgba(255,255,255, 0.5);
width: clamp(1048px,72.77777777777777vw,1397.333333333333px);
margin: auto;
padding-bottom: clamp(42px,2.9166666666666665vw,56px) !important;
padding-top:clamp(183px,12.708333333333334vw,244px) !important;
}

.swiper-pagination-bullet-active {
  background: #ff0000; /* Your primary color */
}

.quote {
    text-align: center;
    margin: 0 auto;
    padding-top: 3rem; 
}


.quote-section .swiper-pagination-horizontal.swiper-pagination-bullets {
	
top : clamp(55px,3.8194444444444446vw,73.33333333333334px);
	
}

.quote-section .swiper-pagination-bullet {
	
background : rgba(247, 156, 94, 1);	
width : clamp(6px,0.4166666666666667vw,8px);
height : clamp(6px,0.4166666666666667vw,8px);
margin : 0 clamp(28px,1.9444444444444444vw,37.333333333333336px) !important;
	
	
}





.quote-text {
    font-family: var(--font-heading);
    font-size: clamp(34px,2.361111111111111vw,45.33333333333333px);
    font-weight: 500;
    line-height: 140%;
    text-transform: uppercase;
    margin-bottom: clamp(140px,9.722222222222221vw,186.66666666666663px) ;
}

.quote-author {
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: 500;
    font-style: normal;
    text-transform: uppercase;
}

/* ==========================================
   Footer
   ========================================== */
.footer {
    background-color: var(--color-black);
    color: var(--color-white);
    
}

.footer .container {

padding: clamp(78px,5.416666666666667vw,104px) clamp(87px,6.041666666666667vw,116px) clamp(81px,5.625vw,108px) clamp(60px,4.166666666666667vw,80.00000000000001px);
max-width : 100%	

} 


.footer-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-bottom: 7rem;
}

.footer-left {
    display: flex;
    flex-direction: column;
    gap: clamp(30px,2.0833333333333335vw,40.00000000000001px);
    padding-right: clamp(125px,8.680555555555555vw,166.66666666666669px);
}


.footer-left > a {
	
width : fit-content;	
	
}


.footer-right {

position: relative;
padding-top : clamp(75px,5.208333333333333vw,100px);
width : clamp(439px,30.48611111111111vw,585.3333333333334px);
max-width : 100%;	

}


.footer-bottom .right_side {
	
display : flex;
justify-content : space-between;
width : clamp(620px,43.05555555555556vw,826.6666666666667px);	
	
}


.footer-content > .footer-right::before {

content: "";
position: absolute;
left: clamp(-80px,-5.555555555555555vw,-106.66666666666666px);
background: rgba(255, 255, 255);
height: 83%;
    width: 1px;
    top: 57%;
transform: translateY(-50%);
opacity : 0.2;    
}



.footer-logo {
    width: clamp(160px,11.11111111111111vw,213.33333333333331px);
    height: auto;
    filter: brightness(0) invert(1);
}

.footer-tagline {
    font-size: clamp(22px,1.5277777777777777vw,29.33333333333333px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.03em;
	margin-top:clamp(32px,2.2222222222222223vw,42.66666666666667px);
/* 	margin-bottom : clamp(30px,2.0833333333333335vw,40.00000000000001px); */
}

.footer-cta {
    font-family: var(--font-heading);
    font-size: clamp(22px,1.5277777777777777vw,29.33333333333333px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

.footer-contact {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
	margin-top : clamp(18px,1.25vw,24px);
   
}

.footer-contact .contact-address {

position: relative;

}


.footer-contact .contact-address::after {
content: "";
position: absolute;
left: clamp(-20px,-1.3888888888888888vw,-26.666666666666664px);
background: var(--color-white);
height: 80%;
width : 1px;
top: 50%;
transform: translateY(-50%);

}

.contact-items {

display: flex;
gap : clamp(10px,0.6944444444444444vw,13.333333333333332px);

}

.contact-items .item {
    width: clamp(54px,3.75vw,72px);
    height: clamp(54px,3.75vw,72px);
    background-color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}


.contact-items .item svg {

width: clamp(13px,0.9027777777777778vw,17.333333333333332px);
height: clamp(13px,0.9027777777777778vw,17.333333333333332px);

}

.contact-address p {
    font-size: clamp(14px,0.9722222222222222vw,18.666666666666668px);
    line-height: 1.7;
}

.footer-expertise {
    margin-top: clamp(70px,4.861111111111111vw,93.33333333333331px);
}

.footer-heading {
    font-family: var(--font-heading);
    font-size: clamp(22px,1.5277777777777777vw,29.33333333333333px);
    font-weight: 400;
    margin-bottom: clamp(25px,1.7361111111111112vw,33.333333333333336px);
    letter-spacing: -0.03em;
}

.footer-links {
    display: flex;
    flex-direction: column;
    gap: clamp(12px,0.8333333333333334vw,16px);
}

.footer-links a {
    font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
    font-weight: 500;
    letter-spacing: -0.02em;
}

.footer-links a:hover,  .footer-contact .contact-address:hover a {
    color: var(--color-orange);
}

/* Contact Form */
.contact-form {
    display: flex;
    flex-direction: column;
    gap: 1.3rem;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 0.438rem;
}

.form-group label {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 500;
    letter-spacing: 0.01em;
}

.form-group input,
.form-group textarea {
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    color: var(--color-white);
    padding: clamp(25px,1.7361111111111112vw,33.333333333333336px) 0 clamp(5px,0.3472222222222222vw,6.666666666666666px) 0;
    font-size: var(--text-sm);
    outline: none;
    transition: border-color var(--transition-fast);
}

.form-group input:focus,
.form-group textarea:focus {
    border-bottom-color: var(--color-orange);
}

.form-group input::placeholder,
.form-group textarea::placeholder {
   color: rgba(255, 255, 255, 1);
	    font-family: var(--font-heading);
    font-size: clamp(20px,1.3888888888888888vw,26.666666666666664px);
    font-weight: 400;
/*     margin-bottom: clamp(30px, 2.0833333333333335vw, 40.00000000000001px); */
    letter-spacing: -0.03em;

}

.message-group {
    margin-top: 1.5rem;
}

.message-group textarea {
    resize: vertical;
    min-height: 4rem;
}

.form-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-top: 1rem;
}

.form-checkbox input[type="checkbox"] {
    appearance: none;
    width: 0.75rem;
    height: 0.75rem;
    border: 1px solid var(--color-white);
    border-radius: 50%;
    margin-top: 0.25rem;
    cursor: pointer;
    flex-shrink: 0;
}

.form-checkbox input[type="checkbox"]:checked {
    background-color: var(--color-orange);
    border-color: var(--color-orange);
}

.form-checkbox label {
    font-size: var(--text-xs);
    font-weight: 465;
    line-height: 1.3;
    letter-spacing: 0.01em;
    cursor: pointer;
}

.submit-btn {
    align-self: flex-start;
/*     font-size: 1.5rem; */
    font-weight: 400;
    color: var(--color-white);
    /* text-decoration: underline; */
    margin-top: clamp(35px,2.4305555555555554vw,46.66666666666666px);
    position: relative;
}

.submit-btn::after {

content: "";
position: absolute;
bottom : -2px;
left: 0;
width: 100%;
background: var(--color-white);
height: 1px;

}


.submit-btn:hover {
    color: var(--color-orange);
}



.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
}

.footer-legal {
    display: flex;
    gap: 4.4rem;
}

.footer-legal a {
    font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
}

.footer-legal a:hover {
    color: var(--color-orange);
}

.footer-copyright {
    font-family: var(--font-body);
    font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
   
}

.footer-credit {
    font-family: var(--font-body);
    font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
    opacity: 0.6;
}




.footer-right .form-group {
/*     margin-bottom: clamp(15px,1.0416666666666667vw,20.000000000000004px); */
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.footer-right label {
    display: block;
    color: #fff;
    font-size: 16px;
    font-family: serif;
    margin-bottom: 6px;
}

.footer-right .wpcf7-form-control.wpcf7-text,
.footer-right .wpcf7-form-control.wpcf7-tel,
.footer-right .wpcf7-form-control.wpcf7-email,
.footer-right .wpcf7-form-control.wpcf7-textarea {
    width: 100%;
    background: transparent;
    border: none;
    outline: none;
    color: #fff;
    font-family: serif;
/*     padding: 4px 0 8px 0; */
    caret-color: #fff;
	  font-family: var(--font-heading);
    font-size: clamp(20px,1.3888888888888888vw,26.666666666666664px);
}

.footer-right .wpcf7-form-control.wpcf7-textarea {
    resize: none;
    height: 80px;
	padding-top : clamp(10px,0.6944444444444444vw,13.333333333333332px);
}

.footer-right .form-group.message-group {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.footer-right .form-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: clamp(45px,3.125vw,60px) 0 0 0;
}

.footer-right .form-checkbox .wpcf7-acceptance .wpcf7-list-item {
    margin: 0;
}

.footer-right .form-checkbox .wpcf7-list-item-label {
   font-family: var(--font-body);
font-weight: 465;
font-size: clamp(14px,0.9722222222222222vw,18.666666666666668px);
letter-spacing: 1%;
margin-left : clamp(-15px,-1.0416666666666667vw,-20.000000000000004px);
position : relative;
left : 	clamp(20px,1.3888888888888888vw,26.666666666666664px)

}

.footer-right .form-checkbox input[type="checkbox"] {
    accent-color: #fff;
    margin-top: 3px;
    flex-shrink: 0;
}

.footer-right .wpcf7-submit {
    background: transparent;
    border: none;
    border-bottom: 1px solid #fff;
    color: #fff;
    font-size: clamp(20px,1.3888888888888888vw,26.666666666666664px);
    font-family: var(--font-body);
    padding: 0 0 4px 0;
    cursor: pointer;
    letter-spacing: 0.5px;
}

.footer-right .wpcf7-submit:hover {
    opacity: 0.7;
}






/* ==========================================
   Responsive Design
   ========================================== */
@media (max-width: 1200px) {
    :root {
        --container-padding: 1.5rem;
    }
    
    .hero-title {
        font-size: 2rem;
    }
    
    .hero-stats {
        gap: 4rem;
    }
    
    .nav-menu {
        gap: 3rem;
    }
    
    .value-cards {
        grid-template-columns: 1fr;
    }
    
    .operations-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .nav-menu {
        display: none;
    }
    
    .hero-title {
        font-size: 1.5rem;
        margin-bottom: 5rem;
    }
    
    .hero-stats {
        flex-direction: column;
        gap: 2rem;
    }
    
    .intro-text {
        font-size: 1.25rem;
    }
    
    .tabs {
        flex-wrap: wrap;
        gap: 1rem;
    }
    
    .tab-btn {
        font-size: 1.25rem;
    }
    
    .tab-btn.active {
        font-size: 1.5rem;
    }
    
    .glass-card {
        padding: 2rem;
    }
    
    .service-items {
        flex-direction: column;
        gap: 1.5rem;
    }
    
    .service-item {
        max-width: 100%;
    }
    
    .team-intro {
        flex-direction: column;
    }
    
    .carousel {
        margin: 0 3rem;
    }
    
    .team-card {
        flex: 0 0 calc(50% - 1rem);
    }
    
    .operations-grid {
        grid-template-columns: 1fr;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
    }
    
    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .quote-text {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .hero-content {
        padding: 4rem 0 3rem;
    }
    
    .hero-title {
        font-size: 1.25rem;
    }
    
    .stat-number,
    .stat-label {
        font-size: 1.25rem;
    }
    
    .section-title {
        font-size: 1.75rem;
    }
    
    .team-card {
        flex: 0 0 100%;
    }
    
    .carousel {
        margin: 0 2rem;
    }
}

/* ==========================================
   Biography Page Styles
   ========================================== */

/* Bio Hero Section */
.bio-hero-section {
    position: relative;
    min-height: 100vh;
    background: linear-gradient(233.07deg, #E1ECEF 0%, #002644 50%);
    color: var(--color-white);
    overflow: hidden;
    padding-bottom: 5rem;
}

.bio-hero-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
    padding: 8rem 0 5rem;
}

.bio-hero-text {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.bio-name {
    font-size: 4.375rem;
    font-weight: 400;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.bio-role {
    font-family: var(--font-heading);
    font-size: 1.875rem;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--color-orange);
    letter-spacing: 0.05em;
}

.bio-intro {
    font-size: 1.375rem;
    font-weight: 400;
    line-height: 1.5;
    max-width: 32rem;
}

.bio-hero-image {
    position: relative;
    height: 40rem;
    overflow: hidden;
    border-radius: var(--radius-md);
}

.bio-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Bio Summary Card */
.bio-summary-section {
    margin-top: -3rem;
    padding-bottom: 5rem;
    background: linear-gradient(180deg, transparent 0%, var(--color-white) 30%);
}

.bio-summary-card {
    backdrop-filter: blur(40px);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.95) 100%);
    border: 1px solid rgba(0, 38, 68, 0.1);
    border-radius: var(--radius-md);
    padding: 3rem 4rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    box-shadow: 0 20px 60px rgba(0, 38, 68, 0.08);
}

.summary-item {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
}

.summary-label {
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-orange);
}

.summary-text {
    font-family: var(--font-heading);
    font-size: var(--text-base);
    font-weight: 500;
    color: var(--color-navy-dark);
    line-height: 1.4;
}

.summary-divider {
    width: 1px;
    height: 3rem;
    background: linear-gradient(to bottom, transparent, var(--color-orange), transparent);
}

/* Experience Section */
.bio-experience-section {
    padding: 5rem 0;
    background-color: var(--color-white);
}

.section-title-bio {
    font-size: 2.625rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 4rem;
    color: var(--color-navy-dark);
    letter-spacing: -0.02em;
}

.experience-timeline {
    max-width: 56rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.experience-item {
    display: grid;
    grid-template-columns: 10rem 1fr;
    gap: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid rgba(0, 38, 68, 0.1);
}

.experience-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.experience-period {
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-orange);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.experience-details {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.experience-title {
    font-family: var(--font-heading);
    font-size: 1.625rem;
    font-weight: 500;
    color: var(--color-navy-dark);
}

.experience-role {
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-navy-medium);
}

.experience-description {
    font-size: var(--text-sm);
    font-weight: 400;
    line-height: 1.6;
    color: var(--color-navy-dark);
}

/* Track Records Section */
.track-records-section {
    padding: 6rem 0;
    background: linear-gradient(180deg, rgba(0, 38, 68, 0.02) 0%, rgba(247, 156, 94, 0.05) 100%);
}

.track-records-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin-bottom: 4rem;
}

.track-record-card {
    backdrop-filter: blur(20px);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.85) 100%);
    border: 1px solid rgba(0, 38, 68, 0.08);
    border-radius: var(--radius-md);
    padding: 2.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    transition: transform var(--transition-base), box-shadow var(--transition-base);
    box-shadow: 0 4px 20px rgba(0, 38, 68, 0.06);
}

.track-record-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 38, 68, 0.12);
}

.track-record-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.track-record-logo {
    max-height: 2.5rem;
    max-width: 8rem;
    object-fit: contain;
}

.track-record-type {
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    color: var(--color-orange);
    letter-spacing: 0.05em;
    padding: 0.375rem 0.75rem;
    background: rgba(247, 156, 94, 0.1);
    border-radius: var(--radius-sm);
    white-space: nowrap;
}

.track-record-description {
    font-size: var(--text-sm);
    font-weight: 400;
    line-height: 1.6;
    color: var(--color-navy-dark);
    flex: 1;
}

.track-record-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 38, 68, 0.08);
}

.track-record-amount {
    font-family: var(--font-heading);
    font-size: 1.375rem;
    font-weight: 600;
    color: var(--color-navy-dark);
}

.track-record-year {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-navy-medium);
}

/* Back to Team Link */
.back-to-team {
    text-align: center;
    padding-top: 2rem;
}

.link-with-icon-orange {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    font-size: var(--text-base);
    font-weight: 500;
    color: var(--color-orange);
    padding: 0.75rem 1.5rem;
    border: 1px solid var(--color-orange);
    border-radius: 2rem;
    transition: all var(--transition-fast);
}

.link-with-icon-orange:hover {
    background-color: var(--color-orange);
    color: var(--color-white);
    transform: translateX(-4px);
}

.link-with-icon-orange img {
    width: 1.25rem;
    height: 1.25rem;
    transform: rotate(180deg);
    filter: brightness(0) saturate(100%) invert(67%) sepia(47%) saturate(820%) hue-rotate(330deg) brightness(99%) contrast(94%);
}

.link-with-icon-orange:hover img {
    filter: brightness(0) invert(1);
}

/* Biography Page Responsive */
@media (max-width: 1200px) {
    .bio-hero-content {
        gap: 3rem;
    }
    
    .bio-name {
        font-size: 3rem;
    }
    
    .bio-hero-image {
        height: 32rem;
    }
    
    .track-records-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .bio-hero-content {
        grid-template-columns: 1fr;
        padding: 4rem 0 3rem;
    }
    
    .bio-hero-image {
        height: 28rem;
    }
    
    .bio-name {
        font-size: 2.5rem;
    }
    
    .bio-role {
        font-size: 1.375rem;
    }
    
    .bio-intro {
        font-size: 1.125rem;
    }
    
    .bio-summary-card {
        flex-direction: column;
        gap: 2rem;
        padding: 2rem;
    }
    
    .summary-divider {
        width: 100%;
        height: 1px;
    }
    
    .experience-item {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .section-title-bio {
        font-size: 2rem;
    }
}

@media (max-width: 480px) {
    .bio-name {
        font-size: 2rem;
    }
    
    .bio-hero-image {
        height: 24rem;
    }
    
    .track-record-card {
        padding: 1.5rem;
    }
}


@media (max-width: 1024px) {
  .hero {
    padding: 40px;
  }

  .hero-content h1 {
    font-size: 36px;
  }

  .hero-stats {
    gap: 40px;
  }
}

@media (max-width: 768px) {
  .nav-links {
    display: none; /* à remplacer par un menu burger */
  }

  .hero-content h1 {
    font-size: 28px;
  }

  .hero-stats {
    flex-direction: column;
    gap: 24px;
  }
}




/* Single Bio */

/* --- SECTION PRINCIPALE --- */
.single-equipe .hero-bio {
    background-color: #0d2238;
    min-height: 100vh;
    display: flex;
    overflow: hidden;
    position: relative;
	background-size: cover;
/*     height: 100vh; */;
	flex-direction : column;
}

.single-equipe .container-bio {
    display: flex;
    width: 100%;
/* 	width : clamp(1250px,86.80555555555556vw,1666.6666666666665px); */
	width : clamp(1216px,84.44444444444444vw,1621.3333333333335px);
	margin : auto;
	justify-content : space-between;
}


.single-equipe .container-bio .hero-content {
	
padding-top : clamp(200px,13.88888888888889vw,266.6666666666667px);	
min-height : auto;	
padding-left : clamp(50px,3.4722222222222223vw,66.66666666666667px);	
margin : 0;	
/*  height: 100vh;	 */
	display: flex;
    flex-direction: column;
    position : relative;
}






/* --- COLONNE GAUCHE --- */
.single-equipe .hero-left {
    flex: 0 0 100%;
    /* Padding basé sur 115px (8vw) et 72px (5vw) */
    padding: 0 0 clamp(50px, 3.47vw, 66px) 0;
    display: flex;
    flex-direction: column;
/*     justify-content: center; */
    position: relative;
    z-index: 10;
/* 	margin-top : clamp(150px,10.416666666666666vw,200px); */
/* 	height : 100vh; */
/* 	min-height: calc(100vh + clamp(300px,20.833333333333332vw,400px)); */
	margin-bottom : clamp(300px,20.833333333333332vw,400px);
}



.single-equipe .hero-left .wrrpr_badges_arrows {
	
display : flex;
justify-content : space-between;	
align-items : center;	
    margin-top: clamp(40px, 3.47vw, 66px);
	
}



/* .single-equipe .desc-section::before {
    content: '';
    position: absolute;
    left: 0;
    top:clamp(-500px,-34.72222222222222vw,-666.6666666666667px);

    width: 1px;
    height: clamp(662px,45.97222222222222vw,882.6666666666667px);
    background-color: #F79C5E;

	
}
 */


.single-equipe .container-bio .hero-content::before {
    content: '';
    position: absolute;
    left: 0;
    width: 1px;
    height: clamp(662px,45.97222222222222vw,882.6666666666667px);
    background-color: #F79C5E;
}





.single-equipe .hero-name {
  
    font-size: clamp(46px,3.1944444444444446vw,61.33333333333334px);
    font-weight: 300;
    color: #E1ECEF;
    letter-spacing: 2%;
    margin-bottom: clamp(5px, 0.34vw, 6px);
    text-transform: uppercase;
    line-height: calc(clamp(32px, 2.22vw, 42px) + 10px);
}

.single-equipe .hero-subtitle {
   
   font-family : var(--font-heading);
    font-size: clamp(32px,2.2222222222222223vw,42.66666666666667px);
    color: #E1ECEF;
    text-transform: uppercase;
    letter-spacing: 2%;
    margin-bottom: clamp(30px, 2.77vw, 53px);
}

.single-equipe .hero-desc {
    font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
    line-height: calc(clamp(14px, 1.04vw, 20px) + 10px);
    color: #E1ECEF;
    max-width: clamp(547px,37.986111111111114vw,729.3333333333335px);
    margin-bottom: clamp(35px, 2.43vw, 46px);
}

.single-equipe .hero-icons {
    display: flex;
    gap: clamp(10px, 1.04vw, 20px);
}

.single-equipe .hico {
    width: clamp(64px,4.444444444444445vw,85.33333333333334px);
    height: clamp(64px,4.444444444444445vw,85.33333333333334px);
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
	background : rgba(255, 255, 255, 1);
}


.single-equipe .hico:hover {
	
border : 2px solid rgba(247, 156, 94, 1)	
	
}


.single-equipe .hico svg {
    width: clamp(15px,1.0416666666666667vw,20.000000000000004px);
	height : clamp(15px,1.0416666666666667vw,20.000000000000004px);
/*     fill: #ffffff; */
}


.single-equipe .hico-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.single-equipe .hico-tooltip {
    position: absolute;
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 8px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    white-space: nowrap;
    z-index: 10;
}

.single-equipe .hico-wrap:hover .hico-tooltip {
    opacity: 1;
    pointer-events: all;
}
.single-equipe .hico-text {
    font-size: clamp(12px, 0.83vw, 16px);
    color: #E1ECEF;
    font-weight: 300;
}

.single-equipe .hico-copy {
    background: rgba(247, 156, 94, 1);
    border: none;
    border-radius: 20px;
    padding: 4px 14px;
    font-size: clamp(11px, 0.69vw, 13px);
    cursor: pointer;
    color: #fff;
    font-weight: 400;
    transition: background 0.3s ease;
}

.single-equipe .hico-copy:hover {
    background: rgba(247, 156, 94, 0.8);
}



/* Badges du bas */
.single-equipe .hero-badges {
    display: flex;
    gap: clamp(8px, 0.83vw, 16px);
/*     margin-top: clamp(40px, 3.47vw, 66px); */
    flex-wrap: wrap;
	padding-left : clamp(42px,2.9166666666666665vw,56px);
}

.single-equipe .badge {
   background : #FFFFFF;
    padding: clamp(26px,1.8055555555555556vw,34.666666666666664px) clamp(18px, 1.52vw, 29px);
    font-size: clamp(14px,0.9722222222222222vw,18.666666666666668px);
    font-weight: 400;
    letter-spacing: 0.1em;
    color: #09162D;
	text-transform : uppercase;
	border-radius : clamp(8px,0.5555555555555556vw,10.666666666666668px);
}

/* --- COLONNE DROITE --- */
.single-equipe .hero-right {
    flex: 0 0 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
	position: absolute;
    right: 0;
    height: 100%;
    width: 100%;
    top: 0;
}

.single-equipe .portrait-img {
    height: 95%;
    max-height: 90vh;
    object-fit: contain;
    z-index: 5;
}

.single-equipe .hero-circles {
    position: absolute;
    top: 20%;
    right: 0;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
}


.single-equipe .hero-circles img {
	
    max-width: 100%;
    height: auto;
    display: block;
    position: absolute;
    right: clamp(40px,2.7777777777777777vw,53.33333333333333px);	
	opacity : 0.5;
	
}


.single-equipe .hero-arrows {
/*     bottom: clamp(20px, 2.77vw, 53px); */
    display: flex;
    gap: clamp(8px, 0.69vw, 13px);
    z-index: 10;
}

.single-equipe .ha-btn {
    width: clamp(60px,4.166666666666667vw,80.00000000000001px);
    height: clamp(60px,4.166666666666667vw,80.00000000000001px);
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
	transition : 0.3s ease-in-out;
}


.single-equipe .ha-btn svg {
	
width : clamp(13px,0.9027777777777778vw,17.333333333333332px);
height : clamp(13px,0.9027777777777778vw,17.333333333333332px);	
	
}


.single-equipe .ha-btn:hover {
    background: #ffffff;
    border: 2px solid rgba(247, 156, 94, 1);
}
/* ── DESCRIPTION ── */

.single-equipe .desc-section{
  padding:
  clamp(50px,3.47vw,66.66px)
  clamp(100px,6.94vw,133.33px)
 clamp(67px,4.652777777777778vw,89.33333333333334px)
clamp(100px,6.94vw,133.33px);
  text-align:center;
	margin : auto;
	width : clamp(1216px,84.44444444444444vw,1621.3333333333335px);	
	margin-top : clamp(-300px,-20.833333333333332vw,-400px);
	position : relative;
	border-bottom : 2px solid #F79C5E;
	position: absolute;
    left: 50%;
    transform: translateX(-50%);
	z-index : 1;
}


.single-equipe .desc-section .texts {
	
position : relative;
z-index :1;	
  max-width:clamp(991px,68.81944444444444vw,1321.3333333333335px);	
	
}


.single-equipe .desc-section .blured_bg{
    
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
     background:rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(20px);
	z-index :0;
	
}


.single-equipe .desc-section p{
  font-size:clamp(24px,1.6666666666666667vw,32px);
  line-height:140%;
  color:#1a2744;
letter-spacing : -3%;
  margin: auto;
margin-bottom : clamp(30px,2.0833333333333335vw,40.00000000000001px);	
	
}

.single-equipe .desc-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(28px,1.94vw,37.33px);
  margin-top:clamp(70px,4.861111111111111vw,93.33333333333331px);
}

.single-equipe .dact{
  display:flex;
  align-items:center;
  gap:clamp(7px,0.48vw,9.33px);
  font-size:clamp(14px,0.9722222222222222vw,18.666666666666668px);
}


.single-equipe .dact svg {
	
width : clamp(18px,1.25vw,24px)	
	
}

/* ── ORANGE LINE ── */

.single-equipe .oline{
  height:2px;
  background:linear-gradient(90deg,#c86010 0%,#e88030 50%,#f4a860 100%);
}

/* ── PARCOURS SECTION ── */

.single-equipe .section-two{
  position:relative;
  overflow:hidden;
  padding:
  clamp(227px,15.76388888888889vw,302.6666666666667px)
  clamp(50px,3.4722222222222223vw,66.66666666666667px)
clamp(48px,3.3333333333333335vw,64px)	
clamp(50px,3.4722222222222223vw,66.66666666666667px)	  
	  ;
/*   display:grid;
  grid-template-columns:clamp(320px,22.22vw,426.66px) 1fr;
  gap:clamp(72px,5vw,96px); */


}


.single-equipe .section-two::before {
	
content:"";
position : absolute;
	background: 
  linear-gradient(203.37deg, #E1ECEF 0%, rgba(255, 255, 255, 0.4) 50%, #F79C5E 100%),
  linear-gradient(180deg, rgba(0, 38, 68, 0) 0%, rgba(0, 38, 68, 0.05) 100%);	
	top : 0;
	width : 100%;
	height : 100%;
	left : 0;
	z-index : -1;
	
}


.single-equipe .section-two .card_item {
	
display : flex;
justify-content : space-between;	
background : #fff;
padding : clamp(54px,3.75vw,72px) clamp(72px,5vw,96px) 	clamp(69px,4.791666666666667vw,92px) clamp(52px,3.611111111111111vw,69.33333333333333px);
position : relative;
width : clamp(1216px,84.44444444444444vw,1621.3333333333335px);	
margin : auto;	
}


.single-equipe .section-two .card_item .left_side {
	
width : clamp(473px,32.84722222222222vw,630.6666666666666px);	
	
}



.single-equipe .section-two .card_item .left_side svg {
	
position : absolute;
bottom : clamp(-11px,-0.7638888888888888vw,-14.666666666666664px);	
	
}



.single-equipe .section-two .contnr {
	
display : flex;
flex-direction : column;
gap: clamp(40px,2.7777777777777777vw,53.33333333333333px);	
background: linear-gradient(180deg, rgba(255, 255, 255, 0.078) 0%, rgba(255, 255, 255, 0.3) 100%);
padding : clamp(50px,3.4722222222222223vw,66.66666666666667px);
	
}



.single-equipe .stitle{

  font-weight:400;
  font-size: clamp(40px,2.7777777777777777vw,53.33333333333333px);
  color:#002644;
	line-height : 120%;
	text-transform : uppercase;
}


.single-equipe .stitle span {
	
font-family: var(--font-heading);	
	
}


.single-equipe .sitems{
  display:flex;
  flex-direction:column;
  gap:clamp(24px,1.66vw,32px);
	width : clamp(584px,40.55555555555556vw,778.6666666666667px);
	color : #002644;
}


.single-equipe .sitems .srow {
	
display :flex;
gap : clamp(24px,1.6666666666666667vw,32px);	
	
}


.single-equipe .stext{
  font-size: clamp(16px,1.1111111111111112vw,21.333333333333336px);
  line-height:130%;
}


.single-equipe .stext ul li {
	
padding-left : clamp(24px,1.6666666666666667vw,32px);
	
	
}


.single-equipe .stext ul li:not(:last-child) {
	
margin-bottom : clamp(20px,1.3888888888888888vw,26.666666666666664px);	
	
}



.single-equipe .stext ul li {
	
position : relative;	
	
}



.single-equipe .stext ul li::after {
	
    content: "";
    position: absolute;
background-image: url("data:image/svg+xml,%3Csvg width='11' height='11' viewBox='0 0 11 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.3848 5.38367H0.384766' stroke='%23F79C5E' stroke-width='0.767677' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.05469 10.3838L10.2326 5.72518C10.2799 5.68249 10.3178 5.63004 10.3438 5.57127C10.3697 5.5125 10.3831 5.44876 10.3831 5.38427C10.3831 5.31979 10.3697 5.256 10.3438 5.19723C10.3178 5.13846 10.2799 5.08601 10.2326 5.04336L5.05469 0.383789' stroke='%23F79C5E' stroke-width='0.767677' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    top: clamp(5px,0.3472222222222222vw,6.666666666666666px);
    width: clamp(10px,0.6944444444444444vw,13.333333333333332px);
    height: clamp(10px,0.6944444444444444vw,13.333333333333332px);
    left: 0;  
	background-repeat : no-repeat;
	
}


/* ── OPS RÉCENTES ── */

.single-equipe .ops-section{
  background:#fff;
	padding-top : clamp(100px,6.944444444444445vw,133.33333333333334px); 
  padding-bottom:clamp(75px,5.208333333333333vw,100px);
}

.single-equipe .ops-head{
  display:flex;
  align-items:stretch;
  margin-bottom: clamp(86px,5.972222222222222vw,114.66666666666666px);
margin-left : auto;
margin-right : auto;	
width : clamp(1216px,84.44444444444444vw,1621.3333333333335px);
justify-content : space-between;
align-items : center;	
	
}

.single-equipe .ops-arrow{
  width:clamp(60px,4.166666666666667vw,80.00000000000001px);
  height:clamp(90px,6.25vw,120px);
  background:#e07830;
  color:#fff;
  font-size:clamp(20px,1.38vw,26.66px);
	transition : 0.3s ease-in-out;
}


.single-equipe .ops-arrow svg path {
	
transition : 0.s ease-in-out;	
	
}


.single-equipe .ops-arrow:hover {
	
 background:#fff;
box-shadow : 0px 0px 5px 0 #000 ;
	
}


.single-equipe .ops-arrow:hover svg path {
	
stroke : #e07830	
	
}



.single-equipe .ops-arrow svg {
	
width : clamp(13px,0.9027777777777778vw,17.333333333333332px);	
height : clamp(13px,0.9027777777777778vw,17.333333333333332px);		
	
}


.single-equipe .ops-htitle{
  font-family:var(--font-heading);
  font-weight:400;
  font-size:clamp(35px,2.4305555555555554vw,46.66666666666666px);
  color:#1a2744;
	text-transform : uppercase;
}



.ops-slider {
  width: 100%;
}

.ops-slider .swiper-slide {
  display: flex;
  justify-content: center;
}





.single-equipe .op-card{
  border:1px solid rgba(225, 236, 239, 1);
  border-radius:clamp(10px,0.69vw,13.33px) clamp(10px,0.69vw,13.33px) 0 0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
	height : clamp(223px,15.48611111111111vw,297.3333333333333px);
}

.single-equipe .op-logo{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:
  clamp(28px,1.94vw,37.33px)
  clamp(16px,1.11vw,21.33px);
  min-height:clamp(110px,7.63vw,146.66px);
}

.single-equipe .op-tag{
  background: rgba(225, 236, 239, 0.5);;
  padding:clamp(11px,0.76vw,14.66px) clamp(8px,0.55vw,10.66px);
  text-align:center;
  font-size:clamp(14px,0.9722222222222222vw,18.666666666666668px);
  line-height : 120%;
font-weight : 500;	
text-transform : uppercase;	
}


.single-equipe .op-card img {
	
filter : grayscale(1)	
	
}

/* Mentions légales */

.page-template-mentions-legales {
	
background : #002644;	
	
}


/* --- Styles du Conteneur --- */
.ml-container {
    width: 90%; /* Sécurité pour les petits écrans */
    max-width: clamp(1132px,78.61111111111111vw,1509.3333333333335px) !important;
    margin-left: auto;
    margin-right: auto;
	padding-top: clamp(255px,17.708333333333332vw,340px);
	padding-right : clamp(82px,5.694444444444445vw,109.33333333333334px);
	color: #fff;
	font-family : var(--font-body);
	padding-bottom : clamp(20px,1.3888888888888888vw,26.666666666666664px);
	border-bottom : 1px solid #fff;
	margin-bottom : clamp(80px,5.555555555555555vw,106.66666666666666px);
}





/* --- Styles des Éléments (Contenu Gutenberg) --- */
.ml h1 {
    font-size: var(--ml-h1-size) !important;
    line-height: var(--ml-h1-lh) !important;
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: 1.5em;
    letter-spacing: 0.05em;
	font-family : var(--font-body);
}

.ml h2 {
    font-size: var(--ml-h2-size) !important;
    line-height: var(--ml-h2-lh) !important;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: clamp(40px,2.7777777777777777vw,53.33333333333333px);
    margin-bottom: clamp(40px,2.7777777777777777vw,53.33333333333333px);
    letter-spacing: 0.1em;
	font-family : var(--font-body);
}

/* h3, h4, h5, h6 et p héritent du 18px clamp */
.ml p, 
.ml h3, 
.ml h4, 
.ml h5, 
.ml h6, 
.ml li {
    font-size: var(--ml-body-size) !important;
    line-height: var(--ml-body-lh) !important;
    font-weight: 300;
    margin-bottom: 1.5em;
    opacity: 0.9;
}

.ml strong {
    font-weight: 700;
    opacity: 1;
}

.ml a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* Gestion des espacements Gutenberg par défaut */
.ml > * {
    margin-left: 0 !important;
    margin-right: 0 !important;
}


.legal-wrapper .hero-circles {
    position: absolute;
    top: 20%;
    right: 0;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
}


.legal-wrapper .hero-circles img {
	
    max-width: 100%;
    height: auto;
    display: block;
    position: absolute;
    right: clamp(40px,2.7777777777777777vw,53.33333333333333px);	
	opacity : 0.2;
	
}


/* Page 404 */


/* Container principal avec le dégradé Marignan */
.error-page-container {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 20px;
/*    background: linear-gradient(0deg, #FFFFFF, #FFFFFF),
linear-gradient(170.82deg, #F79C5E -6.94%, #002644 86.09%); */
	background: linear-gradient(170.82deg, #F79C5E -6.94%, #002644 86.09%);;

    color: #ffffff;
}

.error-404-content {
    max-width: 600px;
    width: 100%;
	margin-top : clamp(65px,4.513888888888889vw,86.66666666666669px);
}

.error-404-content .page-header {
	
	    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;	
	
}


.error-svg-wrapper svg {
    max-width: 100%;
    height: auto;
}

/* Typographie */
.error-404-content .page-title {
    font-size: clamp(26px,1.8055555555555556vw,34.666666666666664px);
	line-height: 120%;
    font-weight: 500;
    margin-bottom: clamp(18px,1.25vw,24px);
    color: #ffffff;
	font-family : var(--font-body);
}

.error-404-content .page-description {
    font-size: clamp(18px,1.25vw,24px);
    margin-bottom: clamp(33px,2.2916666666666665vw,44px);
    line-height: 120%;
	width : clamp(296px,20.555555555555557vw,394.66666666666674px);
	text-align : center;
}

/* Bouton stylisé */
.button-primary {
    display: flex;
    background-color: #ffffff;
    color: #001f36;
    padding: clamp(18px,1.25vw,24px) clamp(16px,1.1111111111111112vw,21.333333333333336px);
    text-decoration: none;
    font-weight: 400;
    transition: all 0.3s ease;

	width : fit-content;
}


.button-primary span {
	
    transition: all 0.3s ease;
	display : block;
	
	
}


.button-primary:hover {
    background-color: #f49a5e;
    color: #ffffff;
}


.button-primary svg {
	
width : clamp(10px,0.6944444444444444vw,13.333333333333332px);
height : clamp(9px,0.625vw,12px);	
	
}


.button-primary svg path {
	
 transition: all 0.3s ease;
	
	
} 

.button-primary:hover svg path {
	
stroke : white;	
	
}


.button-primary .arrow {
    margin-left: 10px;
    font-size: 1.2rem;
    display: inline-block;
    vertical-align: middle;
}


.error-404-content .page-actions {
	
display : flex;
justify-content : center;	
	
}

.error-404-content .page-actions a {
	
display : flex;
gap : clamp(10px,0.6944444444444444vw,13.333333333333332px);
align-items : center;	
justify-content : space-between;	
width : clamp(258px,17.916666666666668vw,344px);
max-width : 100%;	
}


/* Responsive */
@media (max-width: 768px) {
    .error-404-content .page-title {
        font-size: 1.8rem;
    }
}