/* cover ------------------------------------------------------- */

#cover { 
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100vh;
background: url('/img/cover/securite.avif') top/cover no-repeat;
color:white;
}

#cover .titre {
font-size: 4.5vw;
line-height: var(--petit);
margin:0 auto 100px auto;
width:750px;
color:white;
text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.15);
}


@media (max-width: 800px) {
#cover .titre {
font-size: var(--6xl);
padding:20px;
margin-bottom:200px;
width:100%;
}
}



/* dynamic btns -------------------------------------------------------- */

#dynamic-buttons {
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
position: fixed;
bottom: 100px;
left: 50%;
z-index: 100;
border-radius: 50vh;
padding: 10px;
background-color: rgba(0, 0, 0, 0.8);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
transform: translateX(-50%);
transition: bottom 0.3s ease, transform 0.3s ease, opacity 0.3s ease;
outline: solid 1px rgba(100,100,100,0.5);
}



#dynamic-buttons.full {
bottom: 10px;
}


#dynamic-buttons .texte {
color:white;
padding:0 20px;
font-weight:500;
text-wrap:nowrap;
}

#dynamic-buttons .btn {
background: #00e094;
color: black;
text-decoration: none;
font-size: var(--m);
border-radius: 50vh;
line-height:100%;
padding: 12px 16px;
font-weight:600;
text-wrap:nowrap;
}

#dynamic-buttons .blanc {
background: white;
}


#dynamic-buttons .btn:hover {outline:solid 2px white;}

@media (max-width: 900px) {

#dynamic-buttons {
flex-direction: column;
border-radius:28px;
padding:12px;
bottom: 30px;
}

#dynamic-buttons.full {
width: calc(100% - 40px);
transform: translateX(-50%);
border-radius:15px;
bottom: 10px;
}


#dynamic-buttons .texte {
  line-height:100%;
  text-wrap:wrap;
}

#dynamic-buttons .btn {
padding: 11px 17px;
}

#dynamic-buttons .btn.full {
width:100%;
}



}



#dynamic-buttons.hide {
transform: translateX(-50%) scale(0);
opacity:0;
}

#dynamic-buttons.show {
transform: translateX(-50%) scale(1);
opacity:1;
}



/* swiper -------------------------------------------------------- */
.swiper-button-next, .swiper-button-prev {color:white !important;}

.swiper {
width: 100%;
}

.wm-slide {width:100%; height:500px; border-radius:8px; margin-bottom:30px;}
.swiper .texte {
font-size:var(--xl);
margin-bottom:10px;
}

@media (min-width: 800px) {
.camera .wm-slide-1 {background: url('/img/slidercameras/pc/1.avif') center center / cover no-repeat;}
.camera .wm-slide-2 {background: url('/img/slidercameras/pc/2.avif') center center / cover no-repeat;}
.camera .wm-slide-3 {background: url('/img/slidercameras/pc/3.avif') center center / cover no-repeat;}
.camera .wm-slide-4 {background: url('/img/slidercameras/pc/4.avif') center center / cover no-repeat;}
.camera .wm-slide-5 {background: url('/img/slidercameras/pc/5.avif') center center / cover no-repeat;}
.camera .wm-slide-6 {background: url('/img/slidercameras/pc/6.avif') center center / cover no-repeat;}
.camera .wm-slide-7 {background: url('/img/slidercameras/pc/7.avif') center center / cover no-repeat;}
.camera .wm-slide-8 {background: url('/img/slidercameras/pc/8.avif') center center / cover no-repeat;}
.camera .wm-slide-9 {background: url('/img/slidercameras/pc/9.avif') center center / cover no-repeat;}
.camera .wm-slide-10 {background: url('/img/slidercameras/pc/10.avif') center center / cover no-repeat;}
.camera .wm-slide-11 {background: url('/img/slidercameras/pc/11.avif') center center / cover no-repeat;}
.camera .wm-slide-12 {background: url('/img/slidercameras/pc/12.avif') center center / cover no-repeat;}

.alarme .wm-slide-1 {background: url('/img/slideralarmes/pc/1.avif') center center / cover no-repeat;}
.alarme .wm-slide-2 {background: url('/img/slideralarmes/pc/2.avif') center center / cover no-repeat;}
.alarme .wm-slide-3 {background: url('/img/slideralarmes/pc/3.avif') center center / cover no-repeat;}
.alarme .wm-slide-4 {background: url('/img/slideralarmes/pc/4.avif') center center / cover no-repeat;}
.alarme .wm-slide-5 {background: url('/img/slideralarmes/pc/5.avif') center center / cover no-repeat;}
.alarme .wm-slide-6 {background: url('/img/slideralarmes/pc/6.avif') center center / cover no-repeat;}
.alarme .wm-slide-7 {background: url('/img/slideralarmes/pc/7.avif') center center / cover no-repeat;}
.alarme .wm-slide-8 {background: url('/img/slideralarmes/pc/8.avif') center center / cover no-repeat;}
}

@media (max-width: 800px) {
.camera .wm-slide-1 {background: url('/img/slidercameras/mobile/1.avif') center center / cover no-repeat;}
.camera .wm-slide-2 {background: url('/img/slidercameras/mobile/2.avif') center center / cover no-repeat;}
.camera .wm-slide-3 {background: url('/img/slidercameras/mobile/3.avif') center center / cover no-repeat;}
.camera .wm-slide-4 {background: url('/img/slidercameras/mobile/4.avif') center center / cover no-repeat;}
.camera .wm-slide-5 {background: url('/img/slidercameras/mobile/5.avif') center center / cover no-repeat;}
.camera .wm-slide-6 {background: url('/img/slidercameras/mobile/6.avif') center center / cover no-repeat;}
.camera .wm-slide-7 {background: url('/img/slidercameras/mobile/7.avif') center center / cover no-repeat;}
.camera .wm-slide-8 {background: url('/img/slidercameras/mobile/8.avif') center center / cover no-repeat;}
.camera .wm-slide-9 {background: url('/img/slidercameras/mobile/9.avif') center center / cover no-repeat;}
.camera .wm-slide-10 {background: url('/img/slidercameras/mobile/10.avif') center center / cover no-repeat;}
.camera .wm-slide-11 {background: url('/img/slidercameras/mobile/11.avif') center center / cover no-repeat;}
.camera .wm-slide-12 {background: url('/img/slidercameras/mobile/12.avif') center center / cover no-repeat;}

.alarme .wm-slide-1 {background: url('/img/slideralarmes/mobile/1.avif') center center / cover no-repeat;}
.alarme .wm-slide-2 {background: url('/img/slideralarmes/mobile/2.avif') center center / cover no-repeat;}
.alarme .wm-slide-3 {background: url('/img/slideralarmes/mobile/3.avif') center center / cover no-repeat;}
.alarme .wm-slide-4 {background: url('/img/slideralarmes/mobile/4.avif') center center / cover no-repeat;}
.alarme .wm-slide-5 {background: url('/img/slideralarmes/mobile/5.avif') center center / cover no-repeat;}
.alarme .wm-slide-6 {background: url('/img/slideralarmes/mobile/6.avif') center center / cover no-repeat;}
.alarme .wm-slide-7 {background: url('/img/slideralarmes/mobile/7.avif') center center / cover no-repeat;}
.alarme .wm-slide-8 {background: url('/img/slideralarmes/mobile/8.avif') center center / cover no-repeat;}

.swiper .texte {font-size:var(--l);}
.swiper-button-next, .swiper-button-prev {display:none !important;}
.wm-slide {height:400px;}
}


/* formulaire ------------------------------------------------------------ */
#formulaire {width:800px; background:white; padding:50px 42px; margin:0 auto; border-radius:20px; /* box-shadow: 0 0 10px rgba(0,0,0,0.2);*/ }
@media (max-width: 900px) {
#formulaire {width:calc(100% - 40px); padding:20px 12px; margin:0 20px; }
}


/* carte -------------------------------------------------------------------- */
#carte {margin-bottom:60px;}

#carte svg {
width: 600px;
height: auto;
}
#carte .dot {
fill: black;
opacity: 0;
transition: opacity 0.1s linear;
}
#swissPath {
fill: none;
stroke: none;
}

@media (max-width: 800px) {
#carte svg {width: calc(100% - 50px);
}
}

/* villes ------------------------------------------------------------------- */
.c{overflow:hidden;white-space:nowrap; }
.s{display:inline-block;animation:a 1000s linear infinite}
.s span{display:inline-block;padding:5px 10px;}
@keyframes a{to{transform:translateX(-50%)}}