/* Base typographique responsive */
html {
  font-size: 100%; /* 1rem = 16px */
  line-height: 1.5;
  scroll-behavior: smooth;
}

body {
  font-family: 'Segoe UI', 'Roboto', sans-serif;
  font-size: clamp(0.7rem, 0.84vw + 0.35rem, 0.85rem);
  color: #212529;
}

/* Titres */
h1 {
  font-size: clamp(1.4rem, 2.8vw + 0.7rem, 2.45rem);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 0.8rem;
}

h2 {
  font-size: clamp(1.2rem, 2.1vw + 0.35rem, 1.75rem);
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 0.6rem;
}

h3 {
  font-size: clamp(1.05rem, 1.75vw + 0.35rem, 1.4rem);
  font-weight: 600;
  margin-bottom: 0.4rem;
}

h4 {
  font-size: clamp(0.9rem, 1.4vw + 0.35rem, 1.25rem);
  font-weight: 500;
}

h5 {
  font-size: clamp(0.77rem, 1.1vw + 0.35rem, 1.05rem);
  font-weight: 500;
}

h6 {
  font-size: clamp(0.6rem, 0.65vw + 0.30rem, 0.7rem);
  font-weight: 500;
}

/* Paragraphe & texte générique */
p {
  font-size: clamp(0.7rem, 0.84vw + 0.21rem, 0.84rem);
  margin-bottom: 0.8rem;
}

small {
  font-size: clamp(0.56rem, 0.63vw, 0.63rem);
}


#backToTop {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 1000;
  background-color: #CE143D;
  color: white;
  border: none;
  padding: 12px 18px;
  border-radius: 50%;
  font-size: 20px;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.3s ease;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

#backToTop:hover {
  background-color: #a80f30;
}

.h3-styled {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  color: #223843;
  font-size: clamp(1rem, 1.8vw + 0.25rem, 1.5rem);
  text-align: center;
  line-height: 1.3;
}

.h3-styled .redred {
  color: #ce1f46;
}
.script-text {
  font-family: 'Marck Script', cursive;
  font-size: clamp(1.5rem, 3vw + 1rem, 2.5rem);
  color: #ce1f46;
  font-weight: normal;
  text-transform: lowercase;
  margin-right: 0.25rem;
}

.h2-styled {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  color: #223843;
  font-size: clamp(1.5rem, 3vw + 1rem, 2.5rem);
  text-align: center;
  line-height: 1.3;
}

.h2-styled .redred {
  color: #ce1f46;
}

.h2-styled  .rotatet {
  display: inline-block;

  transform: rotate(-8deg);
  margin-top:-10px;
}

.h2-styled .h3-styled  .script-text {
  font-family: 'Marck Script', cursive;
  font-size: clamp(1.5rem, 3vw + 1rem, 2.5rem);
  color: #ce1f46;
  font-weight: normal;
  text-transform: lowercase;
  margin-right: 0.25rem;
}

.h2-styled .underline-text {
  text-decoration: underline;
}
.h2-styled .decaleg
{
margin-left:-50px;
}
.h2-styled .decaled
{
margin-right:-250px;
}

@media (max-width: 576px) {
.h2-styled {
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  color: #223843;
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.3;
}

.h2-styled .redred {
  color: #ce1f46;
}

.h2-styled  .rotatet {
  display: inline-block;

  transform: rotate(-8deg);
  margin-top:-10px;
}

.h2-styled .h3-styled  .script-text {
  font-family: 'Marck Script', cursive;
  font-size: 3rem;
  color: #ce1f46;
  font-weight: normal;
  text-transform: lowercase;
  margin-right: 0.25rem;
}

.h2-styled .underline-text {
  text-decoration: underline;
}
.h2-styled .decaleg
{
margin-left:0px;
}
.h2-styled .decaled
{
margin-right:-100px;
}
}


.vtitle {
	font-weight: 600;
	color: #223843;
	font-size: 24px;
	margin-bottom: 20px;
	text-align: center;
	line-height: 1.8em;
}
.vtitle u {
	text-decoration:none;
	font-weight: normal;
	font-family: "Marck Script";
	word-spacing: -10px;
	font-size: 36px;
}
.vtitle u b {
	font-weight: normal;
	color: #ce1f46;
}
.addvline {
	position: relative;
}
.addvline .vline{
	display:block;
	position: relative;
	margin: auto;
}
.addvline.vred .vline svg{
	color: #CE143D;
}
.vtitle .vline {
	width:90px;
	margin-top:5px;
	/*margin-left: -8px;*/
}
.vtitle .addvline {
	display:inline-block;
}



#tl {
	--c-red: #3b8f9b;
	--c-blu: #223843;
	--c-gre: #ce1f46;
	--c-yel: #000000;
	
	--b-red: #c0ebed;
	--b-blu: #cfe4eb;
	--b-gre: #ffdce5;
	--b-yel: #FFFFFF;
}

.tl-red { background: var(--b-red); }
.tl-blu { background: var(--b-blu); }
.tl-gre { background: var(--b-gre); }
.tl-yel { background: var(--b-yel); }

.vl-red { background: linear-gradient(var(--c-red), var(--c-red)) no-repeat center/3px 100%; }
.vl-blu { background: linear-gradient(var(--c-blu), var(--c-blu)) no-repeat center/3px 100%; }
.vl-gre { background: linear-gradient(var(--c-gre), var(--c-gre)) no-repeat center/3px 100%; }
.vl-yel { background: linear-gradient(var(--c-yel), var(--c-yel)) no-repeat center/3px 100%; }

.bc-red { border-color: var(--c-red); }
.bc-blu { border-color: var(--c-blu); }
.bc-gre { border-color: var(--c-gre); }
.bc-yel { border-color: var(--c-yel); }

#tl {
	display: flex;
	flex-direction: column;
	font-weight: 500;
}
.tl-zone {
	display: flex;
	flex-direction: row;
}
.tl-phase {
	width: 60px;
	writing-mode: vertical-rl;
	text-orientation: sideways;
	font-size: 36px;
	font-weight: 600;
	color: #00000066;
	margin-right: 20px;
}
.tl-title {
	display: flex;
	justify-content: center;
	width: 100%;
}
.tl-text {
	display: inline-block;
	font-size: 24px;
	padding: 20px 40px;
	border-width: 3px;
	border-style: dashed;
	border-radius: 40px;
	text-align: center;
}
.tl-bloc {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.tlb-event {
	display: flex;
	flex-direction: row;
	width: 100%;
	padding: 40px 20px;
	
	div {
		display: flex;
		align-items: center;
	}
	
	div:nth-child(1) {
		width: 50%;
		justify-content: flex-end;
		text-align: right;
	}
	div:nth-child(2) {
		width: 100px;
		text-align: center;
		vertical-align: middle;
		justify-content: center;
		
		
		span {
			display: inline-block;
			width: 40px;
			height: 40px;
			background: #fff;
			border-width: 5px;
			border-style: solid;
			border-radius: 30px;
			font-size: 20px;
			font-weight: 600;
		}
	}
	
	div:nth-child(3) {
		width: 50%;
	}
}

.tlb-info{
	display: flex;
	justify-content: center;
	width: 100%;
	
	span {
		display: inline-block;
		padding: 20px 40px;
		border-width: 1px;
		border-style: solid;
		border-radius: 40px;
		background: #ffffff;
	}
}

				


.texte-espace {
  line-height: 2; /* ou 150% */
}

.viasection {
	background-image: url('../img/home-viabilis.png');
	background-size: cover;
	background-position: top center;
	/*background:#dce2ed;*/
	
}
.viahome {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	height: 640px;
	/*background-image: url('../img/home-viabilis.png');
	background-size: cover;
	background-position: bottom center;
	*/
}


.bthomevia
{
margin-left:20px;
}
.publink a {
	text-decoration: none;
	border:1px solid #223843;
	color: #000;
	font-weight: 500;
  font-size: clamp(0.9rem, 1.4vw + 0.35rem, 1.25rem);
}
.publink a:hover {
	background: #E3E3E3;
}
.publink a .bi {
	color: #CE143D;
	font-size: 22px;
	margin-right: 10px;
}

.vtitle {
	font-weight: 600;
	color:#223843;
	font-size: 36px;
	margin-bottom: 20px;
	text-align: center;
	line-height: 1.8em;
}
.vtitle u {
	text-decoration:none;
	font-weight: normal;
	font-family: "Marck Script";
	word-spacing: -10px;
	font-size: 42px;
}
.vtitle u b {
	font-weight: normal;
	color: #CE143D;
}


.addvline {
	position: relative;
}
.addvline .vline{
	display:block;
	position: relative;
	margin: auto;
}

.vtitle .vline {
	width:90px;
	margin-top:5px;
	/*margin-left: -8px;*/
}
.vtitle .addvline {
	display:inline-block;
}


.btn {
	padding: 6px 8px;
}

.btn-viamenu {
	background: #cccccc;
	border: 1px solid #000000;
	border-radius: 30px;
	color: #000000;
	font-weight: 600;
  font-size: clamp(0.7rem, 0.75vw + 0.35rem, 0.9rem);
	text-transform: uppercase;
	padding: 10px 20px;
}
	.red
	{
	background-color: #CE143D;
	color:#FFF;
		border: 0px solid #000000;

	}
.red:hover
	{
	background-color: #000;
	color:#FFF;
	}	

	.white
	{
	background-color: #FFFFFF;
	color: #CE143D;
	border : 1px solid #CE143D;
	}	
	.white:hover
	{
	background-color: #CE143D;
	color: #FFFFFF;
	border : 1px solid #CE143D;
	}	
	

.linkheadsocial
{
color:#CE143D;
background-color:#FFF;
border-radius:20px;
font-size:10px;
margin-right:5px;
margin-top:5px;
margin-bottom:5px;
width:40px;
height:40px;
}
.linkheadsocial:hover
{
color:#fff;
background-color:#CE143D;

}
.linkheadsocial span {
    transform: scale(0.7); /* Réduit la taille à 70% */
    display: inline-block;
}


.linkhead
{
color:#fff;
}
.linkhead:hover
{
color:#CE143D;
}

/***** VIABILIS **************************************************************/

/* Couleurs

rouge viabilis		#CE143D
gris bleu					#333A45
Bleu foncé				#21264C

gris clair 1			#F7F7F7
gris clair 2			#F9F9F9
gris clair 3			#F3F3F3
gris clair 4			#F1F1F1
gris clair 5			#F3F3F3

blanc							#FFFFFF
noir							#000000

*/

.--via-bg-rv { background: #ce143d; }
.--via-bg-r2 { background: #c13165; }
.--via-bg-gb { background: #333a45; }
.--via-bg-bf { background: #21264c; }

.--via-bg-g0 { background: #ffffff; }
.--via-bg-g1 { background: #f9f9f9; }
.--via-bg-g2 { background: #f3f3f3; }
.--via-bg-g3 { background: #f1f1f1; }
.--via-bg-g4 { background: #F3F3F3; }
.--via-bg-g6 { background: #21264c; }

.--via-tx-g5 { background: #8b8b8b; }
.--bs-secondary-rgb { background: #FFF;}
.viaRed{
	color: #FFFFFF;
	background: #CE143D;
}

.viaIRed{
	color: #CE143D;
	background: #FFFFFF;
}

.viaGrey{
	color: #FFFFFF;
	background: #333A45;
}

.--a-wb {
	color:#fff;
	&:hover {
		color:#000;
	}
}
.--a-wr {
	color:#fff;
	&:hover {
		color:#ce143d;
	}
}



/*****************************************************************************/

/*
@import url("https://fonts.googleapis.com/css2?family=Marck+Script&family=Montserrat:wght@100..900&family=MONTSERRAT:wght@400;600&display=swap");
*/

body {
	font-family: "MONTSERRAT", sans-serif;
	font-weight: 400;
	font-size: 15px;
	background-color: #f8f8f8;
}

/*****************************************************************************/

header {
	border: none;
    position: sticky;
    top: 0;
    z-index:100;
}

.navbar{
	background: #FFFFFF;

	
	.me-auto {
		margin-right: 0 !important;
		margin-left: auto;
		width: 300px;
		
		& > li {
			padding-left: 10px;
			border-left: 1px solid #ccc;
		}
	}
}
@media screen and (max-width: 768px) {
	.navbar .me-auto {
			margin-right: auto !important;
			margin-left: none;
			width: 100%;
			
			& > li {
				padding-left: 0px;
				border-left: none;
			}
		}
	}
}

.navbar-brand {
	margin-right: 220px;
}
.navbar-brand img {
	display: block;
	position: absolute;
	height: 80px;
	top: 20px;
/*	filter: drop-shadow(2px 1px 0px #fff) drop-shadow(-2px 1px 0px #fff); */>
}
@media screen and (max-width: 768px) {
	.navbar-brand img {
		height: 50px;
		top: 8px;
	}
}

.dropdown-item:hover,
.dropdown-item:focus {
	color: #fff !important;
	background-color: #a9a9a9 !important;
}

dropdown:hover .dropdown-menu {
	display: block;
}

.dropdown-menu.show{
	background: #F9F9F9;
	border: none;
	font-size: 14px;
}

.navbar-toggler {
	/*padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
	font-size: var(--bs-navbar-toggler-font-size);
	line-height: 1;*/
	color: #000000;
	background-color: transparent;
	border: 0px solid #000000;
	border-radius: 20px;
	/*transition: var(--bs-navbar-toggler-transition);*/

	&:focus {
		box-shadow: none;
		background-color: #FFF;
	}
		&:visited {
		box-shadow: none;
		background-color: #FFF;
	}
}
/*****************************************************************************/

.btn-via {
	background: #cccccc;
	border: 1px solid #0000000;
	border-radius: 30px;
	color: #000000;
	font-weight: 600;
  font-size: clamp(0.7rem, 0.75vw + 0.35rem, 0.9rem);
	text-transform: uppercase;
	padding: 20px 30px;



	&.red {
		background: #CE143D;
		border: 1px solid #CE143DFF;
		color: #FFFFFF;
	}
	&.red:hover {
		background: #000000;
		border: 1px solid #000000FF;
		color: #FFFFFF;
	}
	&.white {
		background: #FFFFFF;
		border: 1px solid #CE143DFF;
		color: #CE143D;
	}
	&.white:hover {
		background: #CE143D;
		border: 1px solid #CE143DFF;
		color: #FFFFFF;
	}
}

/*****************************************************************************/



/*****************************************************************************/
section:nth-child(n+3){
	margin-top: 0px;
}
.viainner {
	padding: 0 5%;
	
	&:nth-child(n+2) {
		
	}
}

.viasection {
	background-image: url('../img/home-viabilis.png');
	background-size: cover;
	background-position: bottom center;
	/*background:#dce2ed;*/
	
}
.viahome {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	height: 640px;
	/*background-image: url('../img/home-viabilis.png');
	background-size: cover;
	background-position: bottom center;
	*/
}

.home-slogan{
	color: #ffffff;
	padding: 10px 0 10px 0;
	width: 80%;
	text-align: center;
}


/*****************************************************************************/





/*****************************************************************************/

/*************** SCROLLBAR MAC OS X ***************/
 
.scrollbar-macosx > .scroll-element,
.scrollbar-macosx > .scroll-element div
{
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10;
}
 
.scrollbar-macosx > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}
 
.scrollbar-macosx > .scroll-element .scroll-element_track { display: none; }
.scrollbar-macosx > .scroll-element .scroll-bar {
    background-color: #6C6E71;
    display: block;
 
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
 
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
 
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
}
.scrollbar-macosx:hover > .scroll-element .scroll-bar,
.scrollbar-macosx > .scroll-element.scroll-draggable .scroll-bar {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
    opacity: 0.7;
}