h1 {
font-size: 28px;
text-align: center;
color: var(--white);
}
.services-section {
max-width: 1260px;
width: 100%;
margin: 0 auto;
padding: 100px 20px;
}
.intro-service {
background: linear-gradient(135deg, var(--noir) 0%, var(--gris) 100%);
color: white;
color: var(--white);
padding: 30px;
border-radius: 6px;
text-align: center;
margin-bottom: 40px;
box-shadow: 1px 2px 1px lightgrey;
}
.intro-service h1 {
margin-bottom: 15px;
padding-bottom: 0;
text-align: center;
}
.service-card {
background: var(--white);
border-radius: 6px;
padding: 30px;
margin: 25px 0;
box-shadow: 1px 2px 1px lightgrey;
position: relative;
}
.service-header {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.service-icon {
margin-right: 15px;
color: var(--color);
}
.service-card h2 {
color: var(--color2);
margin: 0;
padding-bottom: 0;
}
.service-card p {
color: var(--noir);
margin-bottom: 15px;
text-align: left;
}
.service-highlights {
background: var(--carte);
border-radius: 6px;
padding: 15px;
margin: 15px 0;
text-align: left;
}
.service-highlights strong {
color: var(--color2);
}
.specialty-tag {
display: inline-block;
background: var(--color);
color: white;
padding: 4px 12px;
border-radius: 6px;
margin: 5px;
}
.service-actions {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 20px;
}
.arrow-link {
background: var(--color);
color: white;
padding: 8px 15px;
border-radius: 20px;
text-decoration: none;
display: flex;
align-items: center;
gap: 5px;
transition: background 0.3s ease;
}
.arrow-link:hover {
background: var(--color2);
}
.economic-highlight {
background: #e8f5e8;
border-left: 4px solid #4caf50;
padding: 15px;
margin: 15px 0;
border-radius: 5px;
color: #2e7d32;
}
.pro-section {
background: linear-gradient(135deg, var(--noir) 0%, var(--gris) 100%);
color: white;
border-left: none;
}
.pro-section p {
color: var(--white);
}
.pro-section h2 {
color: white;
}
.pro-section .service-highlights {
background: rgba(255,255,255,0.1);
}
.pro-section .service-highlights strong {
color: white;
}


/*ROUTE OK*/
.serviceRouteCard {
max-width: 1260px;
margin: 0 auto;
background-color: var(--white);
box-shadow: 1px 2px 1px lightgrey;
border: 1px solid var(--border);
border-radius: 6px;
padding: 40px;
}
.cardRouteCard {
display: flex;
flex-wrap: wrap;
justify-content: center;   
align-items: flex-start;
gap: 40px;
}
.serviceRoute {
text-align: left;
max-width: 400px;
}
.serviceRoute p {
padding-bottom: 10px;
}
.cinelliAll {
width: 100%;
max-width: 640px;
margin: auto;
overflow: hidden;
border-radius: 10px;
position: relative;
min-height: 427px;
}
.slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
opacity: 0;
animation: fade1 18s infinite;
}
.slide1 { animation-delay: 0s; }
.slide2 { animation-delay: 3s; }
.slide3 { animation-delay: 6s; }
.slide4 { animation-delay: 9s; }
.slide5 { animation-delay: 12s; }
.slide6 { animation-delay: 15s; }

@keyframes fade1 {
0%    { opacity: 0; }
5%    { opacity: 1; }
16.66% { opacity: 1; }
20%   { opacity: 0; }
100%  { opacity: 0; }
}
/*FLOTTE OK*/
.flotteCard {
max-width: 1260px;
margin: 0 auto;
background-color: var(--white);
box-shadow: 1px 2px 1px lightgrey;
border: 1px solid var(--border);
border-radius: 6px;
padding: 40px;
margin-top: 100px;
}
.flotteAll {
width: 100%;
max-width: 400px;
margin: auto;
overflow: hidden;
border-radius: 10px;
position: relative;
min-height: 400px;
}
.flotteCardall {
display: flex;
flex-wrap: wrap;
justify-content: center;   
align-items: flex-start;
gap: 20px;
}
.avisFlotte {
max-width: 280px;
text-align: left;
background-color: var(--white);
box-shadow: 1px 2px 1px lightgrey;
border: 1px solid var(--border);
padding: 20px;
border-radius: 6px;
margin: 20px 0;
}
.avisFlotte h3{
color: var(--noir);
}
.avisFlotte p{
padding-bottom: 10px;
}
.rating {
color: var(--noir);
font-weight: bold;
text-align: left;
font-size: 20px;
}
.slidef {
position: absolute;
top: 0;
left: 0;
width: 100%;
opacity: 0;
animation: fade2 12s infinite;
}
.slidef1 { animation-delay: 0s; }
.slidef2 { animation-delay: 2.4s; }
.slidef3 { animation-delay: 4.8s; }
.slidef4 { animation-delay: 7.2s; }
.slidef5 { animation-delay: 9.6s; }
@keyframes fade2 {
0%   { opacity: 0; }
5%   { opacity: 1; }  
20%  { opacity: 1; }
25%  { opacity: 0; }
100% { opacity: 0; }
}
/*IMAGES*/
.imgSize {
max-width: 840px;
width: 100%;
height: 100%;
border-radius: 6px;
margin-bottom: 20px;
}
/*MINICARTE*/
.serviceCenter {
display: flex;
gap: 40px;
margin: 0 auto;
justify-content: center;
max-width: 1260px;
flex-wrap: wrap;
padding: 100px 0px;
}
.serviceCenter h2 {
padding-bottom: 10px;
}
.serviceCenter {
color: var(--noir);
}
.titreSC {
padding-bottom: 30px;
}
.scCard {
padding: 20px;
max-width: 250px;
width: 100%;
min-height: 250px;
border-radius: 6px;
background-color: var(--white);
box-shadow: 1px 2px 1px lightgrey;
border: 1px solid var(--border);
flex-direction: column;
display: flex;
justify-content: center;
align-items: center;
text-align: left;
}
.scCard:hover{
background-color: #fcfcfc;
}
.cardscCB {
background-color: var(--noir);
}
.cardscCB:hover {
background-color: #161616;
}
.cardscCO {
background-color: #f66000;
}
.cardscCO:hover {
background-color: #f65e0080;
}