@charset "UTF-8";

html,body {
	font-family: "Manrope", sans-serif;
	font-size:17px;
	font-weight:400;
	margin:0;
	padding:0;
	color:#1A0F1E;
	background: #F2EFEA;
	scroll-padding: 90px;
	line-height: 170%;
	-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
}

.allura{font-family: "Allura", cursive;}

::selection {background: #ccc;color:#1A0F1E;}
::-moz-selection {background: #ccc;color:#1A0F1E;}

.imgLeft{float: left;margin:0 30px 30px 0;}
.clear{clear: both;}

.embed-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;height:auto}
.embed-container iframe,.embed-container object,.embed-container embed,.embed-container video{position:absolute;top:0;left:0;width:100%;height:100%;border:none;}

.mobileOnly{display: none;}
.mobileOff{display: block;}


/**** GLOBAL ****/
img{max-width: 100%;}
a{color:#1A0F1E;text-decoration: none;}
a:hover{text-decoration: none;color:#1A0F1E;}
a:focus{border: none;text-decoration: none;}
a.underline{text-decoration: underline;}
a.a_bleu{color:#59CBE8;}


p{text-align:left;}

h1{color: #1A0F1E;font-family: "Manrope", sans-serif;font-size:56px;font-style: normal;font-weight:800;line-height: 120%;letter-spacing:2px;}
h2{color: #1A0F1E;font-family: "Manrope", cursive;font-size:52px;font-style: normal;font-weight:800;line-height: 120%;}
	.h2_1{background: linear-gradient(105deg, #59CBE8 33.69%, #31BEFF 55.02%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
	.h2_2{background: linear-gradient(105deg, #14B5FF 33.69%, #29A2FF 55.02%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
	.h2_3{font-weight: 500;line-height: 110%;}
	.h2_3 span{font-weight: 800;background: linear-gradient(105deg, #59CBE8 33.69%, #31BEFF 45.42%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}

h3{color: #1A0F1E;font-family: "Manrope", sans-serif;font-size:24px;font-style: normal;font-weight:700;line-height: 100%;}



.btn-vert{display:inline-flex;height: 60px;padding: 16px 24px;justify-content: center;align-items: center;gap: 16px;border-radius: 16px;border: 1px solid #C0CF8C;background:#C0CF8C;font-size: 17px;font-style: normal;font-weight: 600;}
.btn-vert:hover{background:#F2EFEA;}

.btn-bleu{display:inline-flex;height: 60px;padding: 16px 24px;justify-content: center;align-items: center;gap: 16px;border-radius: 16px;border: 1px solid #59CBE8;background:#59CBE8;font-size: 17px;font-style: normal;font-weight: 600;}
.btn-bleu:hover{background:transparent;}

.btn-bleu2{display:inline-flex;height: 60px;padding: 16px 24px;justify-content: center;align-items: center;gap: 16px;border-radius: 16px;border: 1px solid #59CBE8;background:#transparent;font-size: 17px;font-style: normal;font-weight: 600;}
.btn-bleu2:hover{background:#59CBE8;}

.btn-noir{display:inline-flex;height: 60px;padding: 16px 24px;justify-content: center;align-items: center;gap: 16px;border-radius: 16px;border: 1px solid #1D1D1B;background:#1D1D1B;font-size: 17px;font-style: normal;font-weight: 600;color:#fff;}
.btn-noir:hover{background:transparent;}

.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;}

header{position: fixed;width: 100%;background: #F2EFEA;z-index: 99;height:110px;border-bottom: 1px solid rgba(255, 255, 255, 0.58);}
#header-padding{height: 110px;}

#nav_btn_metiers.active {background-color: #59CBE8;}
#nav_btn_metiers.active img {transform: rotate(45deg);}

.metiers-mobile-btn{display:none;}

#nav_metiers{display:none;position: fixed;width: 100%;z-index: 90;top:110px;}
	#nav_metiers .container{border-radius: 48px;background: rgba(29, 29, 27, 0.97);box-shadow: 0 1px 20px 0 rgba(89, 203, 232, 0.23);padding: 64px 112px;}
	#nav_metiers span{color:#59CBE8;font-size:15px;font-weight: 400;line-height:15px;}
	#nav_metiers a{color:#fff;font-size: 22px;font-style: normal;font-weight: 700;}
	#nav_metiers a:hover{color:#59CBE8;}
	#nav_metiers .col-md-4{margin-bottom:24px;}

.footer1{background: #1D1D1B;border-radius: 0 0 84px 84px;color:#fff;padding:64px 0;}
	.footer1 .slogan{color: #59CBE8;}
	.footer1 .borderbottom{border-bottom: 1px solid #59CBE8;padding: 8px 0 24px 0;}

	.footer1 .btn-footer{border-radius: 16px;border: 1px solid #31BEFF;height: 60px;padding: 16px 24px;justify-content: center;align-items: center;gap: 16px;color:#fff;}
	.footer1 .btn-footer:hover{background: #31BEFF;}


	.footer1 .titre{color: var(--Dark_40, #666);font-size: 13px;font-weight: 700;line-height: 160%;padding-top:40px;}

	.footer1 ul{margin: 0;padding:0;list-style-type: none;}
	.footer1 ul li{padding:0px 0;font-size:14px;}
	.footer1 ul li a{color:#fff;}
	.footer1 ul li a:hover{color:#59CBE8;}


	.footer1 .copyright{color: var(--Dark_40, #666);font-size: 12px;font-weight: 500;line-height: 160%;}
	.footer1 .copyright a{color:#666;}
	.footer1 .copyright a:hover{color:#fff;}


.footer2{background: #f2efea;padding:0;}


section.bg-blanc{background: #fff;}
section.bg-noir{background:#1D1D1B;color:#fff;}
section.bg-noir-round{background:#1D1D1B;border-radius: 0 0 84px 84px;color:#fff;}

section .row.borderbottom{border-bottom: 1px solid var(--Grey_background, #F2EFEA);}

.container-big{padding:0 10%;}

/******** HOME *********/

.rubrique{font-size: 15px;font-style: normal;font-weight: 400;line-height: 160%;padding-bottom: 20px;}


.carrousel-outer {display: flex;flex-direction: column;align-items: center;gap: 10px;width: 860px;max-width: 100%;}
.carrousel-wrap {position: relative;width: 100%;aspect-ratio: 860 / 600;overflow: hidden;border-radius: 48px;background: #000;user-select: none;}

/* Sur desktop, le carrousel calque sa hauteur sur celle du bloc de contenu à sa gauche (col-md-5) au lieu de son aspect-ratio fixe */
@media (min-width:768px){
    .hero-carrousel-col{display:flex;}
    .hero-carrousel-col .carrousel-outer{height:100%;}
    .hero-carrousel-col .carrousel-wrap{aspect-ratio:unset;flex:1 1 auto;min-height:0;}
}

.slide {position: absolute;inset: 0;opacity: 0;transition: opacity 0.75s ease;}
.slide.active { opacity: 1; }
.slide img {width: 100%;height: 100%;object-fit: cover;display: block;}

.marker {position: absolute;inset: 0;pointer-events: none;z-index: 10;opacity: 0.8;  mix-blend-mode: hard-light; }
.marker svg { width: 100%; height: 100%; }

.dots {position: absolute;bottom: 14px;left: 50%;transform: translateX(-50%);display: flex;gap: 8px;z-index: 12;}
.dot {width: 8px;height: 8px;border-radius: 50%;background: rgba(255,255,255,0.4);border: none;cursor: pointer;padding: 0;transition: background 0.25s, transform 0.25s;}
.dot.active { background: #fff; transform: scale(1.25); }

.caption {width: 100%;text-align: right;font-size: 11px;letter-spacing: 0.05em;color: #777;min-height: 1.4em;transition: opacity 0.4s ease;padding-right: 40px;}
.caption.fade-out { opacity: 0; }
.caption.fade-in  { opacity: 1; }





.logos {overflow: hidden;width: 100%;padding:64px 0;}
.logos-track {display: flex;width: max-content;animation: scrollLogos 20s linear infinite;}
.logos-track img {height: 60px;width: auto;object-fit: contain;flex-shrink: 0;margin: 0 40px;filter: grayscale(1);}
@keyframes scrollLogos {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.logos_confiance{background:#F2EFEA;padding: 20px;border-radius: 16px;}
.logos_confiance img{width:30%;border-right: 1px solid #ccc;}
.logos_confiance a:last-child img{ border-right:none; }

.btn-suiveznous{display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: #1D1D1B;}


.parallax {overflow: hidden;}
.parallax img {width: 100%;height: 100%;object-fit: cover;animation: zoomParallax 20s ease-in-out infinite;will-change: transform;}

@keyframes zoomParallax {
  0%   { transform: scale(1)    translateY(0); }
  50%  { transform: scale(1.08) translateY(-3%); }
  100% { transform: scale(1)    translateY(0); }
}


.tags{float:left;padding: 8px 16px;justify-content: center;align-items: center;gap: 8px;border-radius: 40px;background: #F2EFEA;margin:0 10px 10px 0;font-size: 16px;font-weight: 400;line-height: 160%;}


/** DOMAINES INTERVENTION **/
.section-header {display: flex;align-items: center;justify-content: space-between;margin-bottom: 28px;}
.section-title {font-size: 22px;font-weight: 600;color: #C0CF8C;letter-spacing: -0.01em;}
.nav-arrows { display: flex; gap: 12px; }
.nav-arrows button {background: none;border: none;color: #fff;font-size: 20px;cursor: pointer;width: 36px;height: 36px;display: flex;align-items: center;justify-content: center;border-radius: 50%;transition: background 0.2s;}
.nav-arrows button:hover { background: rgba(255,255,255,0.1); }
.domaines-outer { overflow: hidden; }
.domaines-track {display: flex;gap: 16px;will-change: transform;}

/* ── Cards ── */
.card {flex-shrink: 0;width: 280px;min-height: 390px;border-radius: 16px;border: 1px solid #59CBE8;background: #1e1e1e;padding:76px 20px 32px 20px;display: flex;flex-direction: column;gap: 12px;cursor: pointer;will-change: width, background;transition:width        0.55s cubic-bezier(0.4, 0, 0.2, 1),background   0.55s cubic-bezier(0.4, 0, 0.2, 1),border-color 0.55s cubic-bezier(0.4, 0, 0.2, 1);}
.card:hover:not(.active) { border-color:#C0CF8C; }
.card-inner {display: flex;flex-direction: column;gap: 12px;flex: 1;transform: translateY(0);transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);}
.card.active {background: #59CBE8 url(../images/bg-a.png) top center no-repeat;border-color: #59CBE8;width: 380px;}
.card-number {font-size: 15px;font-weight: 300;color: #fff;transition: color 0.55s;}
.card.active .card-number { color:#1D1D1B; }
.card-title {font-size: 27px;font-weight: 700;color: #fff;line-height:120%;transition: color 0.55s;}
.card.active .card-title { color: #000; }
.card-spacer { flex: 1; }
.card-desc {font-size: 17px;color:#1D1D1B;font-weight:500;line-height: 1.5;max-height: 0;opacity: 0;overflow: hidden;transition: max-height 0.55s cubic-bezier(0.4,0,0.2,1), opacity 0.4s ease;}
.card.active .card-desc { max-height: 80px; opacity: 1; }
.card-btn {display: flex;align-items: center;gap: 8px;max-height: 0;opacity: 0;overflow: hidden;transition: max-height 0.55s cubic-bezier(0.4,0,0.2,1), opacity 0.4s ease 0.1s;justify-content: center; }
.card.active .card-btn { max-height: 48px; opacity: 1; }
.card-btn a {display: flex;font-size: 17px;font-weight: 600;color: #000;text-decoration: none;text-align: center;}
.card-btn a:hover .arrow-circle{background: #fff}
.card-btn .arrow-circle {width:48px; height: 34px;border-radius:16px;border:1px solid #fff;display: flex; align-items: center; justify-content: center;color: #1D1D1B;font-size: 14px;flex-shrink: 0;}

.card.active:hover{background: #C0CF8C url(../images/bg-a-hover.png) top center no-repeat;;border-color: #C0CF8C;}
.card.active:hover .card-inner {transform: translateY(-30px);}


.expertise-ref{border: 1px solid #000;border-radius: 16px;padding:16px;height:100%;box-sizing:border-box;}

.section-label{display:flex;align-items:center;gap:12px;}
.section-label span{font-size:14px;color:#fff;opacity:.8;}

.expertise-photo{position:relative;overflow:hidden;border-radius:24px;aspect-ratio:6/5;}
.expertise-photo img{width:100%;height:100%;object-fit:cover;display:block;}

.propose-box{background:#fff;border-radius:24px;padding:32px;}
.propose-box h3{margin-top:0;}
.propose-box .row{row-gap:24px;}
.propose-card{border: 1px solid #59CBE8;border-radius: 16px;padding:20px;height:100%;box-sizing:border-box;display:flex;flex-direction:column;}
.propose-num{color:#59CBE8;font-size:14px;font-weight:600;}
.propose-title{font-size:20px;font-weight:700;line-height:130%;margin-top:8px;}
.propose-spacer{flex:1;min-height:16px;}
.propose-btn{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;}
.propose-btn .eq-card-arrow{width:34px;height:34px;}




/** EQUIPE **/
.section-header {display: flex;align-items: flex-start;justify-content: space-between;margin-bottom: 32px;}
.nav-arrows {display: flex;gap: 12px;align-items: center;}
.nav-arrows button {background: none;border: none;color: #1D1D1B;font-size: 20px;cursor: pointer;width: 36px;height: 36px;display: flex;align-items: center;justify-content: center;border-radius: 50%;transition: background 0.2s;}
.nav-arrows button:hover { background: rgba(0,0,0,0.08); }
 
 /* ── Slider ── */
.slider-outer {overflow: hidden;cursor: grab;}
.slider-outer.is-dragging {cursor: grabbing;}
.slider-track {display: flex;gap: 24px;will-change: transform;user-select: none;}
.slider-outer.is-dragging a {pointer-events: none;}

.eq-card {flex-shrink: 0;width:380px;background: #fff;border-radius: 24px;overflow: hidden;  padding: 8px 8px 24px 8px;}
/*.eq-card:first-child { width: 690px;}*/
.eq-card-photo {width: 100%;overflow: hidden;border-radius: 24px;height: 400px; aspect-ratio: unset;}
.eq-card-photo img {width: 100%;height: 100%;object-fit: cover;display: block;pointer-events: none; transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);}
.eq-card:hover .eq-card-photo img {transform: scale(1.04);}
.eq-card-body {display: flex;align-items: center;justify-content: space-between;padding: 18px 20px;}
.eq-card-info .eq-card-name {font-size: 19px;font-weight: 600;color: #1D1D1B;}
.eq-card-info .eq-card-role {font-size: 17px;font-weight: 400;color: #000;margin-top: 2px;line-height: 100%;}
.eq-card-arrow {width: 48px;height:34px;border-radius: 16px;border: 1px solid #ccc;display: flex;align-items: center;justify-content: center;color: #1D1D1B;font-size: 16px;flex-shrink: 0;text-decoration: none;transition: background 0.2s, border-color 0.2s;}
.eq-card-arrow:hover {background: #C0CF8C;color: #fff;border-color: #C0CF8C;}


.equipe-detail{}
.equipe-detail .close {border-radius: 16px;border: 1px solid #ccc;display: flex;align-items: center;justify-content: center;color: #1D1D1B;font-size: 16px;flex-shrink: 0;text-decoration: none;transition: background 0.2s, border-color 0.2s;width: 200px;padding:10px 0;}
.equipe-detail .close:hover {background: #C0CF8C;color: #fff;border-color: #C0CF8C;}
.equipe-detail .close img{transform: rotate(180deg);}
.equipe-detail .photo{background:#fff;padding:8px;border-radius: 24px;margin-bottom: 16px;}
.equipe-detail .photo img{border-radius: 24px;}
.equipe-detail .fonction{padding:0 0 20px 0;font-weight:700;}
.equipe-detail .intro{border-radius: 16px;background:#59CBE8 url(../images/bg-a.png) top center no-repeat;padding:32px;}
.equipe-detail .intro strong{font-size: 24px;}
.equipe-detail .texte{padding:20px 0 20px 0;}




/******** FORM *********/
.form{}
.form input, .form select{padding:16px 24px;margin-bottom:16px;border-radius: 8px;border: 1px solid #333;background: #262626;color: #fff;width: 100%;height:50px;font-size:17px;font-family:'Manrope';font-style: normal;font-weight:400;line-height:120%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.form input::placeholder, .form textarea::placeholder, .form select option {font-size:17px;font-family: 'Manrope';font-style: normal;font-weight:400;line-height: 120%;}
.form textarea{padding:16px 24px;border: 1px solid #333;background: #262626;color:#fff;width: 100%;height:160px;border-radius: 8px;font-style:italic;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font-size:16px;font-family: 'Manrope';font-style: normal;font-weight: 400;line-height:120%;}
.form select{height: 80px;}

.form button{border-radius:8px;border: 1px solid #C0CF8C;background: #C0CF8C;font-size:16px;padding:16px 56px;}
.form button:hover{background:transparent;color:#fff;border: 1px solid #C0CF8C;}

.form .mentions{font-style: italic;text-align: left;font-size:12px;line-height: 14px;padding:20px 0;}







@media (max-width:1200px) {
	h1{font-size:38px;}
	h2{font-size:38px;}

	.btn-vert{padding: 16px 18px;font-size: 14px;}
	.btn-bleu{padding: 16px 18px;font-size: 14px;}
	.btn-bleu2{padding: 16px 18px;font-size: 14px;}
	.btn-noir{padding: 16px 18px;font-size: 14px;}

	.btn-suiveznous span{display: none;}

	.parallax {min-height:300px;position: relative;}
	.parallax img {position: absolute;width: 100%;height: 100%;object-fit: cover;animation: zoomParallax 20s ease-in-out infinite;will-change: transform;}

}

@media (max-width:700px) {

	h1{font-size:32px;}
	h2{font-size:32px}

	header .btn-bleu{display: none;}

	.hero-cta{flex-direction:column;align-items:stretch;gap:12px;}

	.metiers-mobile-btn{display:flex;align-items:center;justify-content:space-between;gap:16px;position:fixed;left:16px;right:16px;bottom:16px;z-index:95;background:#1D1D1B;color:#fff;border-radius:100px;padding:18px 18px 18px 28px;font-size:16px;font-weight:700;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,0.25);}
	.metiers-mobile-btn:hover{color:#59CBE8;}
	.metiers-mobile-btn-icon{width:36px;height:36px;border-radius:50%;border:1.5px solid #fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform 0.3s ease;}
	.metiers-mobile-btn.active .metiers-mobile-btn-icon{transform:rotate(45deg);}

	#nav_metiers{top:auto;bottom:88px;max-height:calc(100vh - 140px);overflow-y:auto;}
	#nav_metiers .container{border-radius:24px;padding: 24px 36px;}
	#nav_metiers .row{padding-top:0;}
	#nav_metiers span{display:none;}
	#nav_metiers br{display:none;}
	#nav_metiers .col-md-4{margin-bottom:6px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,0.15);}
	#nav_metiers .row:last-child .col-md-4:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}

	.expertise-ref{height:auto;margin-bottom:20px;}

	#nav_metiers a{font-size: 18px;}

	.footer2{padding-bottom:90px;}

	.eq-card {width:300px;}
	.eq-card:first-child { width: 300px;}
	.eq-card-photo {height:280px;}

	.footer1 .btn-footer{width: 80%;display: block;margin: 0 auto;}

	#footer-a{width: 140px;}

	section.bg-noir-round{border-radius: 0 0 24px 24px;color:#fff;}
	.footer1{border-radius: 0 0 24px 24px;padding:24px 0;}


	.propose-box .row{row-gap:12px;}
	.propose-card{padding:10px;}
	.propose-num{color:#59CBE8;font-size:14px;font-weight:600;}
	.propose-title{font-size:20px;font-weight:700;line-height:110%;margin-top:0px;}
	.propose-spacer{flex:1;min-height:16px;}
	.propose-btn{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;}
	.propose-btn .eq-card-arrow{width:34px;height:34px;}

}

